.body_min_width{ min-width: 1263px; } /* header */ .mainHeader{ max-height: 54px; min-height: 54px !important; box-shadow: 0px 2px 8px 0px rgba(60,69,86,.1); background: #1675FF; min-width: 1280px; } .header-nav{ width: 100%; height: 54px; padding: 0px 64px 0px 64px; } ul{ width: 50%; height: 100%; } .header-nav ul li{ line-height: 54px; display: inline-block; font-size: 16px; } .header-nav ul:first-of-type li{ height: 100%; vertical-align: middle; } .header-nav ul:first-of-type li:first-of-type{ margin-right: 8px; font-weight: 500; } .header-nav ul:first-of-type li:first-of-type img{ width: auto; float: left; height: 28px; margin-top: 12px; } .header-nav ul:last-of-type li{ padding: 0px 16.5px; font-weight: 500; color: #FFFFFF; letter-spacing: 1px; cursor: pointer; letter-spacing: 1px; opacity: 0.63; } .header-nav li.active{ color: #FFFFFF !important; opacity: 1 !important; } .header-nav li.active::after{ content: ''; display: block; width: 4px; height: 4px; background: #FFFFFF; border-radius: 100%; position: relative; margin-left: 50%; left: -2px; top: -10px; } .header-login{ opacity: 1 !important; } .header-nav ul:last-of-type button{ padding: 0px 24px; height: 30px; line-height: 30px; background: #1675FF; border-radius: 20px; border: 1px solid #FFFFFF; font-weight: 500; color: #FFFFFF; letter-spacing: 2px; cursor: pointer; opacity: 1 !important; } /* header */ /* index banner */ .banner-wrap{ width: 100%; height: 430px; box-sizing: border-box; overflow: hidden; background: #D9F2FE; position: relative; } .banner-bg{ height: 430px; } .banner-content{ height: 430px; position: absolute; z-index: 2; width: 100%; top: 0; left: 0; box-sizing: border-box; } .banner-content-wrap{ display: flex; justify-content:space-between; width: 70%; min-width: 967px; max-width: 1115px; margin: 0 auto; } .banner-content-right{ flex-grow: 1; box-sizing: border-box; overflow: hidden; } .banner-content-right > h1{ text-align: center; height: 59px; line-height: 59px; font-size: 44px; font-family: MicrosoftYaHei-Bold, MicrosoftYaHei; font-weight: bold; color: #171A1D; letter-spacing: 9px; margin-top: 84px; } .banner-content-right > h2{ width: 100%; height: 21px; font-size: 16px; font-family: MicrosoftYaHei; color: #171A1D; text-align: center; padding-left: 23px; box-sizing: border-box; line-height: 21px; letter-spacing: 1px; margin-top: 15px; } .banner-content-right button{ display: block; text-align: center; margin: 0 auto; width: 188px; height: 50px; background: #1675FF; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12); border-radius: 6px; font-weight: 500; color: #FFFFFF; text-shadow: 0px 2px 4px rgba(44,115,141,0.47); margin: 37px auto 0px; cursor: pointer; } .banner-content-left{ width: auto; height: 430px; } .banner-content-right-submit{ min-width: 830px; flex-grow: 0 !important; } .banner-content-right-title{ width: 100%; height: 37px; font-size: 26px; font-weight: 600; color: black; line-height: 37px; letter-spacing: 2px; text-align: center; margin-top: 30px; display: flex; justify-content: center; align-items: center; } .banner-content-right-title img{ width: 22px; height: auto; margin-left: 15px; flex-shrink: 0; } .banner-content-right-form{ width: 735px; border-radius: 6px; border: 1px solid #E8E8E8; background: #FFFFFF; backdrop-filter: blur(10px); box-sizing: border-box; display: flex; padding-left: 24px; } .banner-content-right-form label{ margin-right: 10px; font-weight: 600; color: black; position: relative; opacity: 0.8; top: -1px; } .banner-content-right-input{ height: 50px; line-height: 50px; } .banner-content-right-input input{ font-weight: 450; color: black; flex-grow: 0.9; border-radius: 6px; } .banner-content-right-form textarea{ flex-grow: 1; outline: none; box-sizing: border-box; resize: none; border-radius: 6px; overflow-y: hidden; } .banner-content-wrap-submit{ min-width: 1112px !important; justify-content: space-around !important; } .banner-content-right-desc{ height: 17px; font-size: 14px; font-weight: 450; color: grey; line-height: 17px; text-align: center; } .banner-content-right-submit button{ margin-top: 21px !important; height: 50px !important; width: 162px !important; } /* index banner */ /* index navigation */ .index-nav-wrap{ background: url(/images/ai2/index-nav-bg.png?v=8) center center no-repeat; -webkit-background-size: cover; background-size: cover; overflow: hidden; height: 123px; background-color: #FFFFFF; } .index-nav-wrap h1{ margin-top: 27px; text-align: center; height: 40px; font-size: 28px; font-weight: 600; color: #282828; line-height: 40px; } .index-nav-wrap ul{ width: 700px; height: 20px; display: flex; text-align: center; justify-content: flex-start; margin: 30px auto 0px; letter-spacing: 1px; box-sizing: border-box; } .index-nav-wrap ul li{ color: black; font-weight: 500; text-align: center; width: 25%; position: relative; cursor: pointer; } .index-nav-wrap ul li span{ position: relative; } .index-nav-wrap ul li span.active{ color: #1675FF !important; } .index-nav-wrap ul li span.active::after{ content: ''; display: block; position: absolute; width: 100%; height: 2px; background: #1675FF; border-radius: 2px; left: 50%; margin-left: -50%; bottom: -5px; } /* index navigation */ /* index-list-wrap */ .index-body-style{ background-color: #F9FAFA !important; } .index-list-wrap{ width: 1140px; margin: 0 auto; display: flex; box-sizing: border-box; padding: 36px 0px 47px; flex-wrap: wrap; } .index-item-wrap{ width: calc(25% - 15px); box-sizing: border-box; height: 145px; background: #FFFFFF; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12); border-radius: 8px; margin-right: 20px; margin-bottom: 36px; display: flex; box-sizing: border-box; padding: 42px 15px 38px 22px; min-width: 270px; cursor: pointer; /* overflow: hidden; */ } .index-item-wrap > div:first-child{ width: calc(100% - 78px); } .index-item-left > h1:first-child{ height: 22px; font-size: 16px; font-weight: 600; color: black; line-height: 22px; letter-spacing: 1px; } .index-item-left > h1:last-child{ height: 17px; font-weight: 500; color: grey; line-height: 17px; letter-spacing: 1px; margin-top: 26px; } .index-list-wrap > .index-item-wrap:nth-child(4n){ margin-right: 0px !important; } .index-item-left > h1:last-child{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; position: relative; } .index-item-left > h1:last-child div{ position: absolute; } .index-item-wrap{ position: relative; } .index-item-left-desc-tips{ position: absolute; width: 242px; min-height: 63px; height: auto; padding: 10px 15px; background: #EDF4FF; border-radius: 5px; z-index: 8; left: 57px; top: 115px; display: none; font-size: 12px; font-weight: 500; color: #8C919D; line-height: 17px; letter-spacing: 1px; } .index-item-wrap.active .index-item-left-desc-tips{ display: block; } .index-item-left-desc-tips::before{ content: ''; position: absolute; display: block; border-bottom: 10px solid #EDF4FF; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 9px solid transparent; top: -19px; right: 82px; } /* index-list-wrap */ /* footer */ footer{ height: 60px; } footer h3{ width: 100%; text-align: center; height: 60px; line-height: 60px; background: #EFFAFF; font-weight: 450; color: grey; letter-spacing: 2px; z-index: 99999; } footer h3 a{ font-weight: 450; color: grey; letter-spacing: 2px; } /* footer */ /* login */ .loginCon{ position: fixed; z-index: 899; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; } .loginConMask{ background: rgba(0,0,0,0.4); width: 100%; height: 100%; position: absolute; z-index: 3; left: 0; top: 0; } .loginConContent{ position: absolute; z-index: 5; left: 50%; top: 50%; margin-left: -263px; margin-top: -164px; width: 526px; height: 328px; background: #FFFFFF; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.14); border-radius: 8px; } .loginConQrcode{ width:132px; height: 132px; margin: 40px auto 0px; position: relative; } .loginConQrcodeTitle{ height: 27px; line-height: 27px; font-size: 18px; font-weight: 500; color: black; margin-top: 66px; text-align: center; } .loginConQrcodeTitle img{ vertical-align: middle; margin-right: 8px; } .loginConQrcode img{ left: 0; position: absolute; } .loginConQrcode > img:first-child{ top: 0; } .loginConQrcode > img:nth-child(2){ bottom: 0; } .loginConQrcode > img:last-child{ width: 112px; height: 112px; left: 10px; top: 10px; } .loginConClose{ position: absolute; cursor: pointer; top: 22px; right: 31px; } /* login */ /* kefucom */ .kefuCom{ position: fixed; z-index: 88; right: 22px; bottom: 140px; width: 60px; min-height: 100px; } .kefuCom ul > li { width: 58px; cursor: pointer; height: 58px; background: #FFFFFF; box-shadow: 0px 3px 19px 0px rgba(0,0,0,0.02), 0px 2px 9px 0px rgba(0,0,0,0.08); border-radius: 10px; /* overflow: hidden; */ margin-bottom: 6px; text-align: center; } .kefuCom ul > li img{ display: block; margin: 0px auto 6px; padding-top: 12px; } .kefuCom ul > li p { font-size: 12px; line-height: 12px; font-weight: 450; } .kefuQq{ color: #1675FF; } .kefuWx{ color:#1675FF; } .payinnerContent{ margin-top: 30px; } .kefuCom li{ position: relative; } .wxkefuImg{ width: 136px; height: 150px; background: #FFFFFF; box-shadow: 0px 1px 23px 0px rgba(15,30,37,0.11); border-radius: 10px; position: absolute; left: -136px; display: none; top: 0; z-index: 8; } .wxkefuImg p{ height: 17px; font-size: 12px; font-weight: 450; color: #777777; line-height: 17px; } .kefuWxLi:hover .wxkefuImg{ display: block; } /* kefucom */ /* form*/ .homelist{ width: 1140px; margin: 0 auto; margin-bottom: 142px; } .homelist .item{ width: calc(25% - 15px); height: 145px; float: left; margin-right: 20px; margin-top: 36px; background: #FFFFFF; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12); border-radius: 8px; cursor: pointer; } .homelist > .item:nth-child(4n){ margin-right: 0px; } .homelist .item ul{ width: 100%; padding: 42px 10px 10px 22px; height: 100%; } .homelist .item ul > li{ float: left; height: 100%; } .homelist .item ul > li:first-child{ width: calc(100% - 98px); } .homelist .item ul > li:first-child h1{ min-height: 22px; max-height: 44px; height: auto; font-size: 16px; font-weight: 600; color: black; line-height: 22px; letter-spacing: 1px; overflow: hidden; text-overflow: ellipsis; word-break: break-all; white-space: nowrap; } .homelist .item ul > li:first-child h2{ line-height: 17px; min-height: 17px; max-height: 34px; font-size: 12px; font-weight: 500; color: #8C919D; letter-spacing: 1px; margin-top: 26px; overflow: hidden; word-break: break-all; text-overflow: -o-ellipsis-lastline; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .homelist .item ul > li:last-child{ width: 98px; } .homelist .item ul > li:last-child img{ margin-top: 4px; } .homelist-header{ width: 1140px; /* overflow: hidden; */ margin: 0 auto; } .homelist-header .list-header ul{ width: 100%; } .homelist-header .list-header li { float: left; height: 20px; line-height: 20px; letter-spacing: 1px; margin-top: 30px; position: relative; } .homelist-header .list-header ul>li:first-child{ margin-right: 11px; font-weight: 600; color: #282828; } .homelist-header .list-header ul>li:nth-child(n+3){ margin-left: 30px; } .homelist-header .list-header ul>li:nth-child(n+2){ font-weight: 500; color: #8C919D; cursor: pointer; } .homelist-header .list-header ul>li.active{ font-weight: 600; color: #282828; } .homelist-header .list-header ul>li.active::before{ content: ''; display: block; position: absolute; left: 50%; top: 22px; width: 4px; height: 4px; background: #00D17D; border-radius: 100%; } .aitoolFormTips{ font-size: 12px !important; padding-left:24px !important; text-align: left; } .homelist.homelistForm{ /* height: 820px; */ background: #FFFFFF; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12); border-radius: 8px; margin-top: 20px; padding: 36px 30px; height: auto; } .homelist-header .list-header li.list-header-li-form{ margin-top: 20px !important; } .homelistForm div > div > h1:first-child{ height: 25px; font-size: 16px; font-weight: 600; color: black; line-height: 25px; letter-spacing: 2px; position: relative; } .homelistForm > div > div > h1:first-child::before{ content: ''; left: 0; top: 0; display:inline-block; width: 5px; height: 17px; background: #1675FF; border-radius: 2px; margin-right: 8px; vertical-align: middle; position: relative; top: -2px; } .homelistForm > div > div > ul{ width: 100%; margin-top: 9px; } .homelistForm > div > div li{ width: auto; height: auto; font-weight: 450; color: #8C919D; line-height: 20px; letter-spacing: 1px; padding-left: 13px; word-break: break-all; margin-bottom: 12px; } .pageMask{ width: 100%; height: 100%; background: rgba(0,0,0,0.33); position: fixed; z-index: 888889; left: 0; top: 0; } .modelDialog1{ width: 600px; margin-left: -300px; margin-top: -67.5px; position: fixed; z-index: 8888809; left: 50%; top: 50%; min-height: 135px; height: auto; background: #FFFFFF; border-radius: 8px; line-height: 71px; box-sizing: border-box; word-break: break-all; max-height: 84px; text-align: center; } .aiform-progress-box{ width: 476px; margin: 0 auto; margin-top: 95px; position: relative; height: 6px; } .aiform-progress-bar-bg{ width: 100%; height: 6px; background: #E5E5E5; border-radius: 3px; } .aiform-progress-bar{ width: 0%; position: absolute; left: 0; top: 0; height: 6px; background: #0099FF; border-radius: 3px; } .ani-chick-icon3{ width: 52px; height: 32px; } .ani-chick-icon2{ width: 52px; height: 32px; position: absolute; right: -26px; top: -35px; } .modelDialog1 p{ font-size: 16px; font-weight: 500; color: black; margin-top: 26px; display: block; width: 100%; line-height: 22px; } .modelDialog2{ position: fixed; z-index: 8888809; left: 50%; top: 50%; width: 667px; height: 399px; margin-left: -333.5px; margin-top: -199.5px; background: #F9F9FB; border-radius: 13px; box-sizing: border-box; } .modelDialog2Title li{ float: left; } .modelDialog2Title{ height: 30px; margin: 0 auto; text-align: center; margin-top: 30px; width: 278px; } .modelDialog2Title img{ vertical-align: middle; } .modelDialog2Title > li:nth-child(2) h2{ height: 30px; font-size: 16px; font-weight: 500; color: black; line-height: 30px; padding-left: 9px; } .modelDialog2Title > li:nth-child(3) img{ margin-left: 10px; margin-top: 7px; } #modelDialog2Con{ width: 627px; height: 212px; background: #FFFFFF; border-radius: 10px; margin: 23px auto 0px; padding: 23px 40px; box-sizing: border-box; font-weight: 450; color: #8C919D; line-height: 26px; } .formSumbtnResult{ margin: 30px auto 0px; display: block; } .banner-content ul li button,#formSumbtn,.formSumbtnResult,#formSumbtn2{ cursor: pointer; border-radius: 0px 13px 13px 0px; width: 162px; height: 50px; background: #00C865 linear-gradient(138deg, #99F8F5 0%, #17CCED 100%); font-size: 16px; font-weight: 500; color: #FFFFFF; } #formSumbtn,.formSumbtnResult,#formSumbtn2{ border-radius: 6px !important; margin: 0 auto; margin-top: 21px; } .banner-content ul li button:hover,#formSumbtn:hover,.formSumbtnResult:hover,#formSumbtn2:hover{ background: #00C865 linear-gradient(138deg, #92EFEC 0%, #15C0E0 100%); } .formResloading span { display: inline-block; height: 22px; line-height: 22px; text-align: left; vertical-align: -0.25em;/* 属性设置元素的垂直对齐方式。指定为负长度,可以使元素降低 */ overflow: hidden; } .formResloading{ font-size: 16px; font-weight: 500; color: black; margin-top: 24px; float: left; display: block; width: calc(100% - 55px); line-height: 22px; padding: 0 35px; } .formResloading span::before{ display: block; content: '...\A..\A.'; font-size: 16px; font-weight: 500; color: black; white-space: pre-wrap;/* 保留空白符序列 */ animation: formResloading 3s infinite step-start both; } @keyframes formResloading{ 33%{ transform: translateY(-44px); } 66%{ transform: translateY(-22px); } } .formLineOut{ opacity: 0; } .wordCountCont{ float: left; height: 17px; font-size: 12px; font-weight: 450; color: #8C919D; position: absolute; line-height: 17px; bottom: 16px; right: 24px; } .banner-content-right-form-special{ width: 735px !important; height: 186px !important; background: #FFFFFF !important; border-radius: 6px !important; backdrop-filter: blur(10px) !important; display: block !important; } .banner-content-right-form-special label{ display: block !important; font-weight: 600 !important; color: black !important; opacity: 0.8 !important; } .banner-content-right-form-special textarea{ margin-top: 9px !important; width: 100% !important; height: 107px !important; } .banner-content-right-submit-special{ position: relative !important; top: -40px !important; } /* form */ /* pay */ .paycom{ min-width: 559px; overflow: hidden; width: calc(98% - 79px); } .primaryBtn{ cursor: pointer; border-radius: 6px; width: 162px; background: linear-gradient(139deg, #76EAE7 0%, #43CBC7 100%); height: 50px; font-size: 16px; font-weight: 500; color: #FFFFFF; } .primaryBtn:hover{ background: #00C865 linear-gradient(138deg, #99F8F5 0%, #17CCED 100%); } .paywrap ul > li:first-child > span{ height: 28px; line-height: 28px; } .paywrap ul > li:first-child > span:first-child{ font-size: 20px; font-weight: 600; color: rgb(252, 73, 86); } .paywrap ul > li:first-child > span:nth-child(2){ font-size: 12px; font-weight: 450; color: rgba(61,75,84,0.66); } .paywrap ul > li:first-child > span:last-child{ font-size: 12px; font-weight: 450; color: #B8C3C6; margin-left: 9px; } .paywrap ul > li:nth-child(2){ height: 20px; font-weight: 450; color: #8C919D; line-height: 20px; margin-top: 11px; } .paywrap ul > li:last-child button{ margin-top: 42px; } .paywrap2 > ul:first-child > li{ float: left; width: 132px; height: 90px; background: #FFFFFF; border-radius: 14px; border: 1px solid #EBEBEB; margin-right: 10px; position: relative; cursor: pointer; } .paywrap2 > ul:first-child{ height: 87px; display: block; width: 100%; } .paywrap2 > ul:first-child > li.active{ border: 1px solid #52CDC9; } .paywrap2 > ul:first-child > li.active::after{ content: ''; display: block; right: -1px; top: -1px; width: 45px; height: 39px; background: url(/images/ai/select_top.png) no-repeat; background-size: 45px 39px; position: absolute; } .paywrap2 > ul:first-child > li > p{ text-align: center; } .paywrap2 > ul:first-child > li:first-child > p:first-child{ margin-top: 22px; } .paywrap2 > ul:first-child > li:first-child > p:first-child > span:first-child{ display: inline-block; height: 22px; font-size: 20px; font-weight: 500; color: #333333; line-height: 22px; } .paywrap2 > ul:first-child > li:first-child > p:first-child > span:last-child{ font-size: 12px; height: 22px; font-weight: 450; color: #333333; display: inline-block; line-height: 22px; vertical-align: middle; } .paywrap2 > ul:first-child > li:first-child > p:last-child{ height: 17px; font-size: 12px; font-weight: 450; color: #CB7E1F !important; line-height: 17px; margin-top: 12px; } .paywrap2 > ul:last-child{ margin-top: 30px; } .paywrap2 > ul:last-child li { float: left; position: relative; } .paywrap2 > ul:last-child > li:first-child{ width: 130px; height: 100%; } .paywrap2 > ul:last-child > li:first-child{ width: calc(100% -155px); height: 100%; } .payQrcodeBorder{ position: absolute; left: 0; top: 0; z-index: 1; } .payQrcodeImg,.payQrcodeMask{ position: absolute; left: 10.5px; top: 10.5px; width: 112px; height: 112px; z-index: 1; } .payQrcodeMask{ background: rgba(255,255,255,0.94); backdrop-filter: blur(1px); cursor: pointer; z-index: 2 !important; } .payQrcodeRefresh{ position: absolute; z-index: 3; top: 46px; left: 58px; cursor: pointer; } .payQrcodeError{ height: 17px; font-size: 12px; font-weight: 500; color: #F07370; line-height: 17px; text-align: center; position: absolute; z-index: 3; top: 69px; left: 0px; width: 100%; cursor: pointer; } .payQrcodeWrap{ width: 133px; height: 133px; position: relative; } .payqrcode{ height: 19px; font-size: 12px; font-weight: 500; line-height: 17px; margin-top: 11px; color: rgb(82, 205, 201); text-align: center; } .payqrcode img{ vertical-align: middle; } .paywrap2 > ul:last-child >li:first-child > p:last-child{ height: 17px; font-size: 12px; font-weight: 450; color: #8C919D; line-height: 17px; text-align: center; margin-top: 2px; cursor: pointer; } .payinfoWrap{ margin-left: 25px; } .payinfoWrap > p:first-child > span{ height: 28px; line-height: 28px; } .payinfoWrap > p:first-child > span:first-child{ font-size: 20px; font-weight: 600; color: rgb(252, 73, 86); } .payinfoWrap > p:first-child > span:nth-child(2){ font-size: 12px; font-weight: 450; color: rgba(61,75,84); } .payinfoWrap > p:first-child > span:last-child{ font-size: 12px; font-weight: 450; color: #B8C3C6; margin-left: 9px; } .payinfoWrap > p:nth-child(2) { height: 20px; font-weight: 450; color: #8C919D; line-height: 20px; margin-top: 11px; } .payinfoWrap > p:last-child,.payinfoWrap > p:nth-child(2) { height: 20px; font-weight: 450; color: #8C919D; margin-top: 11px; line-height: 20px; } .paylist > p:first-child{ height: 17px; font-size: 12px; font-weight: 450; color: #8C919D; line-height: 17px; text-align: center; margin-top: 11px; } .paylist > p:nth-child(2) span{ display: inline-block; } .paylist > p:nth-child(2) { height: 22px; margin-top: 6px; line-height: 22px; } .paylist > p:nth-child(2) > span:first-child{ font-size: 12px; font-weight: 450; color: #8C919D; } .paylist > p:nth-child(2) > span:nth-child(2){ font-size: 22px; font-weight: 500; color: #52CDC9; } .paylist > p:nth-child(2) > span:last-child{ font-size: 12px; font-weight: 450; color: #8C919D; } .paylist > p:last-child { height: 17px; font-size: 12px; font-weight: 450; color: #8C919D; margin-top: 6px; line-height: 17px; } .payQrcodeWrap .payQrcodeMask,.payQrcodeWrap .payQrcodeRefresh,.payQrcodeWrap .payQrcodeError{ display: none;; } .payQrcodeWrap.error .payQrcodeMask,.payQrcodeWrap.error .payQrcodeRefresh,.payQrcodeWrap.error .payQrcodeError{ display: block !important; } #isPayDialogMask{ width: 100%; height: 100%; background: rgba(0,0,0,0.33); position: fixed; z-index: 888889; left: 0; top: 0; } .paycom-dialog{ width: 716px; height: 467px; background: #FFFFFF; border-radius: 13px; position: fixed; top: 50%; left: 50%; margin-top: -265px; margin-left: -358px; z-index: 8888889; box-sizing: border-box; padding: 0px 60px; overflow: unset !important; } .paycom-dialog-title{ width: 100%; height: 30px; font-size: 22px; font-weight: 500; color: black; line-height: 30px; letter-spacing: 1px; margin-top: 37px; margin-bottom: 30px; text-align: center; } .paycom-dialog.paycom-taobao{ height: 538px !important; } .paycom-dialog-title.paycom-taobao{ margin-top: 26px !important; } .paycom-dialog .paywrap2 > ul:first-child > li{ margin-right: 22px !important; } .paycom-dialog .paywrap2 > ul:first-child > li:last-child{ margin-right: 0px !important; } .payQrcodeUlDialog > li:first-child{ width: 130px !important; } .payQrcodeUlDialog{ width: 100% !important; } .payresultMask,.aiCataMask{ position: fixed; width: 100%; height: 100%; z-index: 98; background: rgba(0,0,0,0.21); left: 0; top: 0; } .payresultWrap{ position: fixed; z-index: 99; top: 50%; left: 50%; width: 526px; margin-left: -263px; margin-top: -149.5px; height: 389px; background: #FFFFFF; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.14); border-radius: 8px; text-align: center; } .payresultWrap.payresultNoGz{ height: 252px !important; } .payresultWrapHeader{ width: 100%; height: 35px; background: #EBFFFF; display: flex; justify-content: center; line-height: 35px; } .payresultWrapHeader h1 span{ color: #D63333; } .payresultWrap > h1:first-of-type{ width: 100%; height: 25px; font-size: 16px; font-weight: bold; line-height: 25px; margin-top: 24px; text-align: center; } .payresultWrap > h1:first-of-type span{ display: inline-block; height: 100%; line-height: 20px; } .payresultWrap > h1:nth-of-type(2){ height: 20px; font-weight: 500; color: #3D4B54; line-height: 20px; margin-top: 24px; } .payresultWrap > h1:nth-of-type(2) > span:nth-child(2){ color: #CB7E1F; } .payresultWrap > h1:nth-of-type(2) img{ vertical-align: middle; margin-top: -4px; } .payresultQrcode{ width: 115px; height: 115px; margin-top: 13px; } .payresultWrap > h1:last-of-type { height: 20px; font-weight: 450; color: #3D4B54; line-height: 20px; } .payresultBtn{ width: 100%; height: 40px; display: flex; justify-content:space-between; padding: 0px 78px; box-sizing: border-box; margin-top: 24px; position: absolute; bottom: 42px; } .payresultBtn1{ width: 132px; height: 40px; background: #FFFFFF; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1); border-radius: 3px; border: 1px solid #56D6D3; box-sizing: border-box; color: #52CDC9; cursor: pointer; } .payresultBtn2{ width: 132px; height: 40px; background: linear-gradient(139deg, #76EAE7 0%, #43CBC7 100%); box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1); border-radius: 3px; color: #FFFFFF; cursor: pointer; } #payresultCopyTidBtn{ cursor: pointer; } /* pay */ /* modelessay */ /* left side */ .essay-container{ width: 100%; min-width: 1280px; height: auto; position: absolute; left: 0; top: 54px; box-sizing: border-box; overflow: hidden; min-height: calc(100% - 54px); } .essay-leftWrap{ box-sizing: border-box; height: 100%; width: 326px; position: absolute; left: 0; top: 0; background: #F0F4FF; min-height: 750px; } .essay-leftWrap-top{ width: 100%; height: 750px; background: linear-gradient(180deg, #D1F1FE 0%, #F0F4FF 100%); overflow: hidden; position: absolute; left: 0; top: 0; } .essay-leftWrap-cont img{ display: block; margin: 0 auto; } .essay-leftWrap-cont > img:first-child{ margin-top: 42px; } .essay-leftWrap-cont div{ width: 286px; height: 84px; background: white; margin: 0 auto; border-radius: 6px; margin-top: 34px; } .essay-leftWrap-cont div ul{ display: block; width: 100%; box-sizing: border-box; padding: 12px 8px; } .essay-leftWrap-cont div ul li{ height: 28px; font-weight: 600; color: black; line-height: 28px; margin-bottom: 4px; opacity: 0.7; } .essay-leftWrap-cont div ul li::before{ content: ''; display: inline-block; width: 8px; height: 8px; background: #FFFFFF; border: 1px solid #1675FF; border-radius: 100%; box-sizing: border-box; vertical-align: middle; margin-right: 6px; } .essay-leftWrap-cont div img{ position: relative; top: -1px; margin: 0px 0px 0px 70px; } .essay-leftWrap-cont > img:last-child{ margin-top: 48px; } .essay-leftWrap-cont{ position: relative; top: 0; left: 0; } /* left side */ /* right side */ .essay-rightWrap{ width: 100%; box-sizing: border-box; margin-left: 353px; min-height: calc(100% - 1px); } @media (min-width: 1680px) { .essay-leftWrap{ width: 518.1456953642383px; } .essay-rightWrap{ box-sizing: border-box; margin-left: 658.1456953642383px; } } @media (max-width: 1679px){ .essay-rightWrap-cont{ margin: 0 auto; position: relative; left: -188.5px; } } .essay-rightWrap{ box-sizing: border-box; background-color: #FFFFFF; } .essay-rightWrap-cont{ width: 902px; height: auto; box-sizing: border-box; position: relative; } .essay-rightWrap-cont > h1:first-child{ height: 30px; font-size: 22px; font-weight: 600; color: #3D4B54; line-height: 30px; letter-spacing: 1px; text-align: left; margin-top: 60px; text-align: center; } .model-eassy-form-title{ margin-bottom: 8px; } .model-eassy-form-title,.model-eassy-form-desc{ width: 735px; background: #FFFFFF; margin-left: 83px; } .form-label-textarea textarea{ outline: none; resize: none; } .form-label-input{ width: 621px; height: 50px; border-radius: 6px; padding: 0px 24px; line-height: 50px; } .form-label-input input, .form-label-textarea textarea{ flex-grow: 1; } .form-label-input label,.form-label-textarea label{ margin-right: 20px; color: black; font-weight: 600; opacity: 0.8; } .form-label-textarea{ padding: 16px 24px; height: 118px; } .form-label-input,.form-label-textarea{ border-radius: 6px; background: #FFFFFF; border: 1px solid #E2E2E2; display: flex; box-sizing: border-box; backdrop-filter: blur(10px); } .checkbox_wrap p{ box-sizing: border-box; padding-left: 107px; margin-top: 14px; height: 17px; font-size: 12px; font-weight: 450; color: rgba(117, 117, 117, 0.9); cursor: pointer; line-height: 17px; } .checkbox_wrap p::before{ content: ''; width: 15px; height: 15px; display: inline-block; background: url(/images/ai2/modelessay/check_false.png) center center no-repeat; vertical-align: middle; margin-right: 4px; position: relative; top: -1px; } .checkbox_wrap p.active::before{ content: ''; width: 15px; height: 15px; display: inline-block; background: url(/images/ai2/modelessay/check_true.png) center center no-repeat !important; vertical-align: middle; margin-right: 4px; position: relative; top: -1px; } .essay-expand-wrap{ font-weight: 450; color: black; margin-right: -20px; position: relative; left: 714px; top: -36px; display: inline-block; cursor: pointer; opacity: 0.8; } .essay-expand-wrap::after{ content: ''; width: 12px; height: 12px; display: inline-block; vertical-align: middle; position: relative; top: -1px; left: 4px; background: url(/images/ai2/modelessay/close.png) center center no-repeat; } .essay-expand-wrap.active::after{ content: ''; width: 12px; height: 12px; display: inline-block; vertical-align: middle; position: relative; left: 4px; top: -1px; background: url(/images/ai2/modelessay/expland.png) center center no-repeat !important; } .primary-btn{ width: 162px; height: 40px; background: #1675FF; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12); border-radius: 6px; font-weight: 500; color: #FFFFFF; text-shadow: 0px 2px 4px rgba(44,115,141,0.47); margin: 0 auto; display: block; cursor: pointer; } .model-essay-submit{ margin-top: 20px; } .essay-list-wrap{ width: 817px; height: 162px; background: white; display: flex; justify-content: space-between; border-radius: 6px; padding-left: 55px; padding-right: 43px; } .essay-list-wrap-item{ width: calc(33.33333333333% - 46.666666666666664px); height: 160px; background: #FFFFFF; border-radius: 6px; border: 2px solid #FFFFFF; } .essay-list-wrap-item-line1{ margin: 32px auto 20px; height: 31px; font-size: 18px; font-weight: 450; color: #3D4B54; line-height: 31px; text-align: left; } .essay-list-wrap-item-line1 img{ vertical-align: middle; display: inline-block; position: relative; top: -2px; } .essay-list-wrap-item-line1 span{ font-weight: 600; color: black; opacity: 0.8; font-size: 16px; } .essay-list-wrap-item-line2{ width: 100%; text-align: left; } .essay-list-wrap-item-line2 p{ height: 18px; font-size: 13px; font-weight: 450; color: rgba(117, 117, 117); line-height: 18px; margin-bottom: 8px; } .draft-content-message { width: 624px; height: 40px; line-height: 40px; background: linear-gradient(90deg, rgba(229,239,254,0) 0%, rgba(231,239,251,0.38) 24%, #E1EDFF 50%, rgba(230,239,251,0.38) 77%, rgba(229,239,255,0) 100%); border-radius: 4px 4px 4px 4px; text-align: center; margin: 50px auto 0; font-size: 13px; color: #787d87; overflow: hidden; } .draft-content-message .draft-content-message-lis { display: inline-block; height: 40px; line-height: 40px; overflow: hidden; } /* right side */ .essay-rightWrap-notice{ min-height: 41px; height: auto; background: url(/images/ai2/modelessay/service_notice_bg.png); padding: 10px 86px; box-sizing: border-box; margin-top: 27px; margin-left: 326px; } .essay-rightWrap-notice div{ max-width: 1020px; } .essay-rightWrap-notice h1{ color: grey; line-height: 20px; text-align: center; box-sizing: border-box; margin: 0 auto; } .essay-rightWrap-notice img{ width: 16px; height: auto; vertical-align: middle; position: relative; top: -1px; margin-right: 8px; } @media (min-width: 1680px){ .essay-rightWrap-notice{ margin-left: 518.1456953642383px; } } .essay-rightWrap-submit-wrap{ background: #F9FAFA; overflow: hidden; margin-top: 20px; padding-bottom: 20px; } .essay-rightWrap-submit-wrap > h1:first-child { height: 28px; line-height: 28px; font-size: 20px; font-weight: 600; color: #404E57; letter-spacing: 2px; text-align: left; text-align: center; margin-top: 24px; } .essayservice-list-wrap{ width: 100%; background: #F9FAFA; display: flex; justify-content: center; height: 160px; margin-top: 24px; padding: 0px 14px; } .essayservice-list-wrap-item{ width: 160px; height: 168px; background: #FFFFFF; box-shadow: 1px 1px 6px 0px rgba(145,145,145,0.1); border-radius: 6px; margin-right: 12px; padding-right: 5px; padding-left: 5px; cursor: pointer; box-sizing: border-box; position: relative; } .essayservice-list-wrap-item.active{ border: 2px solid #1675FF; } .essayservice-list-wrap .essayservice-list-wrap-item:last-of-type{ margin-right: 0px !important; } .essayservice-list-wrap-item-line1{ margin: 0px auto 0px; height: 70px; padding-top: 11px; font-size: 18px; padding-bottom: 4px; font-weight: 400; color: #3D4B54; line-height: 25px; text-align: left; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; padding-right: 9px; display: flex; align-items: center; } .essayservice-list-wrap-item-line1 img{ vertical-align: middle; display: inline-block; position: relative; top: -2px; width: 40px; height: auto; } .essayservice-list-wrap-item-line1 span{ font-weight: 600; color: black; opacity: 0.8; font-size: 16px; } .essayservice-list-wrap-item-line2{ width: 100%; text-align: center; margin-top: 10px; } .essayservice-list-wrap-item-line2 p{ height: 72px; font-size: 13px; font-weight: 450; color: rgba(117, 117, 117); line-height: 18px; margin-bottom: 8px; padding: 0px 8px; -webkit-line-clamp: 4; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .essayservice-list-wrap-item-line2 p:last-of-type{ text-align: left !important; } .essayservice-list-wrap-item-border{ width: 150px; height: 1px; background: #F0F1F1; } .essayservice-list-wrap-item .selectimg{ position: absolute; right: 0; top: 0; width: 40px; height: auto; display: none; } .essayservice-list-wrap-item.active .selectimg{ display: block !important; } .essay-list-wrap-out{ margin-top: 40px; width: 100%; background: #F9FAFA; padding: 32px; height: 226px; } /* modelessay */ /* submit pay page */ .essay-pay-desc-wrap{ width: 100%; min-height: 286px; background: #F9FAFA; overflow: hidden; box-sizing: border-box; padding:30px 37px 30px 26px; margin-top: 31px; } .essay-pay-desc-title{ display: flex; justify-content: flex-start; margin-bottom: 22px; } .essay-pay-desc-title label{ margin-right: 9px; font-weight: 500; width: 70px; min-width: 70px; text-align: right; color: rgba(117, 117, 117, 0.9); } .essay-pay-desc-title div{ flex-grow: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; font-weight: 450; color: #3D4B54; } .essay-pay-desc-cont{ display: flex; color: rgba(117, 117, 117, 0.9); justify-content: flex-start; } .essay-pay-desc-list-wrap1{ display: flex; justify-content: space-between; } .essay-pay-desc-cont-right{ flex-grow: 1; } .essay-pay-desc-list-wrap1 .essay-pay-desc-list-item{ width: calc(50% - 10px); width: 360px; height: 72px; background: #FFFFFF; box-shadow: 1px 1px 6px 0px rgba(145,145,145,0.1); border-radius: 8px; box-sizing: border-box; padding: 20px 16px 20px 28px ; } .essay-pay-desc-list-wrap1 .essay-pay-desc-list-item img{ vertical-align: middle; } .essay-pay-desc-list-wrap1 .essay-pay-desc-list-item span:first-of-type{ font-weight: 600; color: black; opacity: 0.7; } .essay-pay-desc-list-wrap1 .essay-pay-desc-list-item > span:last-child{ font-size: 13px; font-weight: 600; color: #F09900; float: right; line-height: 32px; } .essay-pay-desc-cont label{ margin-right: 9px; font-weight: 500; text-align: right; } .essay-pay-desc-list-wrap2{ display: flex; justify-content: space-between; margin-top: 16px; } .essay-pay-desc-list-wrap2 .essay-pay-desc-list-item{ width: 106px; height: 96px; background: #FFFFFF; box-shadow: 1px 1px 6px 0px rgba(145,145,145,0.1); border-radius: 8px; } .essay-pay-desc-list-wrap2 > div{ text-align: center; overflow: hidden; } .essay-pay-desc-list-wrap2 > div img{ margin-top: 12px; } .essay-pay-desc-list-wrap2 > div > p:nth-child(2){ height: 17px; line-height: 17px; color: #3D4B54; opacity: 0.9; } .essay-pay-desc-list-wrap2 > div > p:last-child{ margin-top: 6px; } .essay-rightWrap-cont{ position: relative; } .essay-rightWrap-cont > p:nth-child(2){ position: absolute; top: 13px; cursor: pointer; height: 17px; font-size: 13px; font-weight: 450; color: #3D4B54; line-height: 17px; } .essay-rightWrap-cont > p:nth-child(2) img{ vertical-align: middle; position: relative; top: -1px; } .ai2_pay_wrap{ width: 100%; display: flex; box-sizing: border-box; } .ai2_pay_wrap > li{ margin-right: 40px; display: flex; height: 17px; font-size: 14px; font-weight: 450; color: grey; line-height: 17px; cursor: pointer; position: relative; } .ai2_pay_wrap li i{ display: block; width: 17px; height: 17px; margin-right: 4px; } .ai2_pay_wrap li i img{ vertical-align: middle; } .ai2_pay_wrap .ai2_wxpay i{ background: url(/images/ai2/pay/wxpay.png) no-repeat center center; } .ai2_pay_wrap .ai2_zfbpay i{ background: url(/images/ai2/pay/zfbpay.png) no-repeat center center; } .ai2_pay_wrap .ai2_wxpay.active::after{ content: ''; width: 100%; height: 2px; background: #29C445; position: absolute; bottom: -5px; display: block; left: 0px; border-radius: 2px; } .ai2_pay_wrap .ai2_zfbpay.active::after{ content: ''; width: 100%; height: 2px; background: #1675FF; position: absolute; left: 0px; bottom: -5px; border-radius: 2px; } .ai2_pay_wrap .ai2_wxpay.active{ color: #29C445; } .ai2_pay_wrap .ai2_zfbpay.active{ color: #1675FF; } .ai2_pay_wrap .ai2_wxpay.active i{ background: url(/images/ai2/pay/wxpay_active.png) no-repeat center center; } .ai2_pay_wrap .ai2_zfbpay.active i{ display: block; background: url(/images/ai2/pay/zfbpay_active.png) no-repeat center center; } .essay-rightWrap-cont.payCont .payinner{ width: 100%; margin-top: 23px; box-sizing: border-box; padding-left: 26px; /* overflow: hidden; */ min-height: 429px; } .essay-rightWrap-cont.payCont .payinner .choose{ height: 46px; /* overflow: hidden; */ line-height: 46px; } .essay-rightWrap-cont.payCont .payinner .choose > span:first-child ,.essay-rightWrap-cont.payCont .payinner .choose > ul, .essay-rightWrap-cont.payCont .payinner .choose > ul > li,.chooseLabel{ float: left; cursor: pointer; } .essay-rightWrap-cont.payCont .payinner .choose > ul > li > img{ width: 16px; height: 16px; flex-shrink: 0; vertical-align: middle; float: right; position: relative; top: 15px; margin-left: 34px; } .essay-rightWrap-cont.payCont .payinner .choose .chooseLabel,.chooseLabel { font-weight: 600; color: #3D4B54; margin-right: 9px; } .essay-rightWrap-cont.payCont .payinner .choose > ul > li > span{ font-weight: 450; color: #3D4B54; } .essay-rightWrap-cont.payCont .payinner .choose > ul{ width: calc(98% - 79px); display: flex; column-gap: 64px; } .essay-rightWrap-cont.payCont .payinner .choose > ul.three{ column-gap: 16px !important; } .essay-rightWrap-cont.payCont .payinner .choose > ul.three li{ min-width: unset !important; padding: 0px 10px !important; display: flex; } .essay-rightWrap-cont.payCont .payinner .choose > ul.three li img{ margin-left: 20px; } .essay-rightWrap-cont.payCont .payinner .choose > ul > li{ max-width: 360px; min-width: 218px; height: 46px; background: #F9FAFA; box-shadow: 1px 1px 6px 0px rgba(145,145,145,0.1); border-radius: 6px; box-sizing: border-box; border: 1px solid rgba(146,146,146,0.32); /* margin-right: 16px; */ padding: 0px 26px; } .payQrcodeUlai2{ position: relative; z-index: 8; } .ai2pay_greybg{ width: 588px; height: 205px; background: #FBFCFC; box-shadow: 1px 1px 6px 0px rgba(145,145,145,0.1); position: relative; z-index: 1; top: -158px; } .payQrcodeUlai2{ /* margin-top: 51px !important; */ } /* submit pay page */ /* footer left */ .leftSideFooter{ width: 100%; height: auto; position: absolute; left: 0; bottom: 21px; z-index: 8; } .leftSideFooter p,.leftSideFooter p a{ width: 80%; height: auto; font-size: 12px; font-weight: 450; color: #383838; line-height: 17px; margin: 0 auto; text-align: center; word-break: break-all; } /* footer left */ /* taobao pay start*/ .paytips{ padding: 12px; left: 0; top: 27px; width: 588px; min-height: 41px; height: auto; line-height: 17px; background: linear-gradient(90deg, rgba(229,239,254,0) 0%, rgba(231,239,251,0.38) 10%, #E1EDFF 50%, rgba(230,239,251,0.38) 93%, rgba(229,239,255,0) 100%) #F4F8FE; font-weight: 450; color: #B4B9BA; } .paytipstb,.paytipscard{ margin-top: 21px; } .comTbTidRemain{ width: 282px; height: 37px; background: #E4EFFF; box-sizing: border-box; display: flex; padding: 10px 17px; } .comTbTidRemain > div{ flex-grow: 1; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 12px; color: rgba(117, 117, 117, 0.9); } .comTbTidRemain > div span{ color: #1675FF; } .comTbTidRemain > div:last-child span{ color: #FF6413 !important; } .comTbPiece{ line-height: 20px; height: 20px; margin-top: 8px; } .comTbPiece span{ display: inline-block; color: #FF6413; line-height: 20px; height: 20px; } .comTbPiece > span:first-child,.comTbPiece > span:last-child{ font-size: 12px; } .comTbPiece > span:nth-child(2){ font-size: 20px; } .tbpayComWrap{ width: 588px; min-height: 333px; background: #F0FEFD; box-shadow: 1px 1px 6px 0px #FCFCFC; margin-top: 25px; display: flex; flex-wrap: wrap; justify-content: flex-start; box-sizing: border-box; padding: 28px 43px 20px 80px; position: relative; } .tbpayComWrap .comleft,.tbpayComWrap .comright{ height: 100%; } .tbpayComWrap .comleft{ width: 282px; position: relative; } .tbpayComWrap .comright{ flex-grow: 1; margin-left: 51px; position: relative; top: 20px; } .tbpayComWrap .comleft > div:first-child{ display: flex; } .tbpayComWrap .comleft > div:first-child > h1:first-child{ height: 22px; font-weight: 600; color: black; line-height: 22px; } .tbpayComWrap .comleft > div:first-child > h2:nth-child(2){ height: 22px; font-size: 12px; font-weight: 450; color: #52CDC9; line-height: 22px; margin-left: 12px; } .tbpayComWrap .comleft .comleftInput{ display: flex; margin-top: 10px; width: 282px; height: 32px; background: rgba(255,255,255,0.57); border: 1px solid #E1E2E2; box-sizing: border-box; padding: 5px 14px; } .tbpayComWrap .comleft .comleftInput input{ height: 100%; font-weight: 450; color: #3D4B54; line-height: 20px; width: 100%; } .tbpayComWrap .comright .comrightQrcode{ width: 100px; height: 100px; box-sizing: border-box; display: block; margin-left: 17px; } .tbpayComWrap .comright h1{ height: 17px; font-size: 12px; font-weight: 450; color: #FF6413; line-height: 17px; margin-left: 20px; margin-bottom: 10px; margin-top: 11px; } .primaryBtn.orange{ width: 132px !important; height: 40px !important; background: rgba(255,255,255,0) !important; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1) !important; border-radius: 3px !important; border: 1px solid #FE5500 !important; color: #FF6413 !important; font-size: 14px !important; } .tbpayComWrap .comeleftError { width: 282px; height: 54px; max-height: 54px; padding: 10px 10px 10px 10px; background: #FFFAF2; margin-top: 10px; box-sizing: border-box; overflow: hidden; } .tbpayComWrap .comeleftError p{ overflow: hidden; font-weight: 450; color: #FF6413; -webkit-line-clamp: 2; line-height: 17px; word-break: break-all; font-size: 12px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } .tbpayComWrap .comleftInput img{ width: 16px; height: 16px; position: relative; top: 2px; left: 5px; } .paycom{ min-height: 22px; } .tbpayComWrap .comrightQrcode canvas{ border-radius: 3px; } .tbpayComWrap .comFindTbOrder{ cursor: pointer; } .tbpayComWrap .comleftDesc{ position: relative; } .tbpayComWrap .comTbOrderImg{ height: 231px; position: absolute; top: 32px; right: -376px; width: 567px; box-shadow: 1px 1px 8px 7px rgba(145,145,145,0.04), 1px 1px 5px 0px rgba(145,145,145,0.08); z-index: 2; background: #FFFFFF; overflow: hidden; border-radius: 6px; } .tbpayComWrap .comTbOrderImg > img:last-child{ width: 534px; height: auto; display: block; margin: 10px auto 0px; } .triangle{ width: 0; height: 0; border: 10px solid transparent; border-bottom-color: white; } .tbpayComWrap .tb_order_trianglewrap{ position: absolute; top: 22px; width: 567px; right: -376px; height: 10px; z-index:9; } .tbpayComWrap .tb_order_triangle{ position: absolute; top: -10px; left: 66px; z-index: 9; } .tbpayComWrap .comTbOrderImg >div:first-child{ height: 40px; font-size: 13px; font-weight: 500; color: #FF6413; line-height: 40px; margin: 0; padding-left: 22px; box-sizing: border-box; } .tbpayComWrap .comJdOrderImg >div:first-child{ color: rgb(223, 29, 24) !important; } .tbpayComWrap .comTbOrderImg >div:first-child img{ width: 16px; height: 16px; margin: 0; vertical-align: middle; } .tbpayComWrap .comTbOrderImg >div:first-child::after{ content: ''; display: block; width: 65px; height: 2px; background: #FF6413; position: relative; top: -4px; border-radius: 2px; } .tbpayComWrap .comJdOrderImg >div:first-child::after{ content: ''; display: block; width: 65px; height: 2px; background: rgb(223, 29, 24) !important; position: relative; top: -4px; border-radius: 2px; } .ai2_pay_wrap .ai2_tbpay i{ background: url(/images/ai2/pay/tbpay_grey.png) no-repeat center center; background-size: 17px; } .ai2_pay_wrap .ai2_jdpay i{ background: url(/images/ai2/pay/jdpay_grey.png) no-repeat center center !important; background-size: 17px !important; } .ai2_pay_wrap .ai2_tbpay.active::after{ content: ''; width: 100%; height: 2px; background: #FF6413; position: absolute; left: 0px; bottom: -5px; border-radius: 2px; } .ai2_pay_wrap .ai2_jdpay.active::after{ content: ''; width: 100%; height: 2px; background: rgb(223, 29, 24) !important; position: absolute; left: 0px; bottom: -5px; border-radius: 2px; } .ai2_pay_wrap .ai2_tbpay.active{ color: #FF6413; } .ai2_pay_wrap .ai2_jdpay.active{ color: rgb(223, 29, 24) !important; } .ai2_pay_wrap .ai2_tbpay.active i{ display: block; background: url(/images/ai2/pay/tbpay.png) no-repeat center center; background-size: 17px; } .ai2_pay_wrap .ai2_jdpay.active i{ display: block; background: url(/images/ai2/pay/jdpay.png) no-repeat center center !important; background-size: 17px !important; } /* taobao pay end*/ /* check card pay start*/ .ai2_pay_wrap .ai2_cardpay i{ background: url(/images/ai2/pay/checkcard_pay_grey.png) no-repeat center center; background-size: 17px; } .ai2_pay_wrap .ai2_cardpay.active::after{ content: ''; width: 100%; height: 2px; background: #1675FF; position: absolute; left: 0px; bottom: -5px; border-radius: 2px; } .ai2_pay_wrap .ai2_cardpay.active{ color: #1675FF; } .ai2_pay_wrap .ai2_cardpay.active i{ display: block; background: url(/images/ai2/pay/checkcard_pay2.png) no-repeat center center; background-size: 17px; } .cardpayComWrap{ width: 588px; min-height: 245px; background: #F0FEFD; box-shadow: 1px 1px 6px 0px #FCFCFC; margin-top: 25px; display: flex; justify-content: flex-start; box-sizing: border-box; padding: 33px 43px 20px 80px; } .cardpayComWrap .checkCardComleft,.cardpayComWrap .checkCardComright{ height: 100%; } .cardpayComWrap .checkCardComleft{ width: 282px; position: relative; } .cardpayComWrap .checkCardComright{ flex-grow: 1; margin-left: 51px; } .cardpayComWrap .checkCardComleft > div:first-child{ display: flex; } .cardpayComWrap .checkCardComleft > div:first-child > h1:first-child{ height: 22px; font-weight: 600; color: black; line-height: 22px; } .cardpayComWrap .checkCardComleft > div:first-child > h2:nth-child(2){ height: 22px; font-size: 12px; font-weight: 450; color: #52CDC9; line-height: 22px; margin-left: 12px; } .cardpayComWrap .checkCardComleft > div:nth-child(2){ display: flex; margin-top: 10px; width: 282px; height: 32px; background: rgba(255,255,255,0.57); border: 1px solid #E1E2E2; box-sizing: border-box; padding: 5px 14px; } .cardpayComWrap .checkCardComleft > div:nth-child(2) input{ height: 100%; font-weight: 450; color: #3D4B54; line-height: 20px; width: 100%; } .primaryBtn.cyan{ width: 132px !important; height: 40px !important; box-sizing: border-box !important; border-radius: 3px !important; font-size: 14px !important; float: right; margin-top: 12px; } .cardpayComWrap .checkCardComright .checkCardComrightQrcode{ width: 100px; height: 100px; box-sizing: border-box; display: block; margin-left: 17px; } .cardpayComWrap .checkCardComright h1{ height: 17px; font-size: 12px; font-weight: 450; color: #FF6413; line-height: 17px; margin-left: 20px; margin-bottom: 10px; margin-top: 11px; } .primaryBtn.orange{ width: 132px !important; height: 40px !important; background: rgba(255,255,255,0) !important; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1) !important; border-radius: 3px !important; border: 1px solid #FE5500 !important; color: #FF6413 !important; font-size: 14px !important; } .cardpayComWrap .checkCardComeleftError { width: 282px; height: 54px; max-height: 54px; padding: 10px 10px 10px 10px; background: #FFFAF2; margin-top: 10px; box-sizing: border-box; overflow: hidden; } .cardpayComWrap .checkCardComeleftError p{ overflow: hidden; font-weight: 450; color: #FF6413; -webkit-line-clamp: 2; line-height: 17px; word-break: break-all; font-size: 12px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } .cardpayComWrap .checkCardComleftInput img{ width: 16px; height: 16px; position: relative; top: 2px; left: 5px; } .paycom{ min-height: 22px; } .cardpayComWrap .checkCardComrightQrcode canvas{ border-radius: 3px; } .cardpayComWrap .checkCardComFindTbOrder{ cursor: pointer; } .cardpayComWrap .checkCardComleftDesc{ position: relative; } .cardpayComWrap .checkCardComTbOrderImg{ height: 231px; position: absolute; top: 32px; right: -376px; width: 567px; box-shadow: 1px 1px 8px 7px rgba(145,145,145,0.04), 1px 1px 5px 0px rgba(145,145,145,0.08); z-index: 2; background: #FFFFFF; overflow: hidden; border-radius: 6px; } .cardpayComWrap .checkCardComTbOrderImg > img:last-child{ width: 534px; height: auto; display: block; margin: 10px auto 0px; } .triangle{ width: 0; height: 0; border: 10px solid transparent; border-bottom-color: white; } .cardpayComWrap .tb_order_trianglewrap{ position: absolute; top: 22px; width: 567px; right: -376px; height: 10px; z-index:9; } .cardpayComWrap .tb_order_triangle{ position: absolute; top: -10px; left: 66px; z-index: 9; } .cardpayComWrap .checkCardComTbOrderImg >div:first-child{ height: 40px; font-size: 13px; font-weight: 500; color: #FF6413; line-height: 40px; margin: 0; padding-left: 22px; box-sizing: border-box; } .cardpayComWrap .checkCardComTbOrderImg >div:first-child img{ width: 16px; height: 16px; margin: 0; vertical-align: middle; } .cardpayComWrap .checkCardComTbOrderImg >div:first-child::after{ content: ''; display: block; width: 65px; height: 2px; background: #FF6413; position: relative; top: -4px; border-radius: 2px; } .checkCardComRecharge{ width: 400px; height: auto; overflow: hidden; display: flex; margin-top: 32px; } .checkCardComRechargeLeft{ position: relative; width: 134px; } .checkCardComRechargeLeft > div:last-child.zfbstyle{ color: #1675FF; } .checkCardComRechargeLeft > div:last-child{ width: 100%; height: 18px; margin-top: 12px; line-height: 18px; text-align: center; } .checkCardComRechargeLeft > div:last-child img{ vertical-align: middle; margin-right: 2px; } .checkCardComRechargeRight{ flex-grow: 1; box-sizing: border-box; padding-left: 26px; } .checkCardComRechargeRight ul{ width: 100%; height: auto; } .checkCardComRechargeRight ul li{ height: 20px; color: #3D4B54; opacity: 0.9; line-height: 20px; } .checkCardComRechargeRight ul > li:first-child{ height: 28px !important; line-height: 28px !important; margin-top: 4px !important; margin-bottom: 15px !important; opacity: 1 !important; } .checkCardComRechargeRight ul > li:first-child > span:first-child{ opacity: 0.9; color: #3D4B54; } .checkCardComRechargeRight ul > li:first-child > span:nth-child(2){ font-size: 20px; color: #F07370; padding-left: 2px; padding-right: 2px; opacity: 1 !important; } .checkCardComRechargeRight ul > li:first-child > span:last-child{ opacity: 0.9; font-size: 12px; color: #3D4B54; } #checkCardComRechargeQrcodeWrap{ width: 112px; height: 112px; box-sizing: border-box; position: absolute; left: 10px; top: 10px; } .checkcard_zfbpay,.checkcard_wxpay{ display: none; } .checkCardComRecharge.wxpayactive .checkcard_wxpay,.checkCardComRecharge.zfbpayactive .checkcard_zfbpay{ display: block !important; } .paycom-dialog.paycom-checkcard{ height: 478px !important; } .checkCardComRechargePayType{ display: flex; justify-content: center; } .checkCardComRechargePayType img{ width: 16px; height: 16px; } .checkCardComRechargePayType span{ padding-left: 2px; } /* check card pay end*/ .mp7{ margin-top: 7px; } .mp8{ margin-top: 8px; } .mp11{ margin-top: 11px; } .mp19{ margin-top: 19px; } .mp30{ margin-top: 30px; } .pd17{ padding-top: 17px; } .pb33{ padding-bottom: 33px; } .pr24{ padding-right: 24px; } .height128{ height: 128px; } @media (max-width: 1300px) { .banner-content-right-submit{ min-width: 738px; width: 738px; } .banner-content-right-desc{ font-size: 12px !important; } .banner-content-right-submit{ margin-left: 23px; } } @media (min-width: 1301px) { .banner-content-right-submit{ min-width: 800px; width: 800px; } .banner-content-right-title{ min-width: 735px; width: 735px; } .btlistype{ min-width: 735px; width: 735px; } .banner-content-right-desc{ font-size: 12px !important; min-width: 735px; width: 735px; padding-left: 25px; margin-left: -1px; } .banner-content-right-submit{ margin-left: 53px; } .banner-content-right-input input,.banner-content-right-form textarea,.banner-content-right-form label{ font-size: 15px; } } @media (min-width: 1400px) { .index-list-wrap{ width: 1280px; } } @media (min-width: 1734px) { } #aiCataEdit{ position: fixed; top: 50%; left:50%; margin-left: -279px; margin-top: -246.5px; z-index:198; width: 558px; height: 493px; background: #F9F9FB; border-radius: 10px; overflow: hidden; } #aiCataEditClose{ position: absolute; right: 27px; top: 27px; cursor: pointer; } .aiCataEditTitle{ width: 100%; height: 31px; line-height: 31px; margin-top: 22px; text-align: center; font-size: 12px; font-weight: 500; color: #3D4B54; font-weight: 600; } .aiCataEditTitle > img{ vertical-align: middle; } .aiCataEditTitle > img:first-of-type{ width: auto; height: 100%; margin-right: 3px; } .aiCataEditTitle > img:last-of-type{ width: auto; margin-left: 7px; height: 15px; } .modelDialog2Con{ background-color: #FFFFFF; } .editable p{ border: none; outline: none; margin: 0; } #modelDialog2ConRight{ height: 337px !important; width: calc(100% - 32px); } .header-submitbtn{ margin-right: 20px; } #modelDialog2ConRight .leftitem{ height: 337px !important; overflow: hidden; } .modelDialog2Con .option{ position: absolute; bottom:0px; right: 0px; z-index: 18; width: 100%; display: flex; background-color: #F9F9FB; justify-content: flex-end; padding-bottom: 25px; padding-top: 20px; border-radius: 8px; } .modelDialog2Con .option img{ vertical-align: middle; position: relative; top: 7px; } [contenteditable]:focus{ outline: none; } .modelDialog2Con .list{ box-sizing: border-box; width: 100%; height: 100%; padding: 18px; /* padding-bottom: 68px !important; */ background: #FFFFFF; border-radius: 8px; overflow-y: hidden; /* margin-bottom: 120px; */ } .catalogue-lv1,.catalogue-lv1 span{ height: auto; padding-bottom: 6px; line-height: 22px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: #3D4B54; } .catalogue-lv2,.catalogue-lv2 span,.catalogue-lv3,.catalogue-lv3 span{ height: auto; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #8C8C8C; line-height: 22px; padding-bottom: 6px; /* text-indent: 1em; */ } .modelDialog2ConList{ position: relative; } #modelDialog2Con{ position: relative; } .morebtn{ height: 20px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; line-height: 20px; text-align: center; width: 75.234375%; margin-top: 14px; cursor: pointer; } .morebtn span{ position: relative; padding-bottom: 3px; } .morebtn.morebtnai{ color: #4ED6D2; } .morebtn.morebtnai span::after{ width: 100%; content: ''; height: 2px; background-color: #4ED6D2; position: absolute; display: block; bottom: 0; left: 0; border-radius: 1px; } .morebtn.morebtnai2{ color: #1675FF; } .morebtn.morebtnai2 span::after{ width: 100%; content: ''; height: 2px; background-color: #1675FF; position: absolute; display: block; bottom: 0; left: 0; border-radius: 1px; } .leftitem .option > img{ width: 16px; height: 16px; margin-right: 20px; cursor: pointer; } .list-submitbtn{ margin-right: 20px; height: 32px !important; line-height: 32px !important; padding: 0px 14px !important; } .catalogue-title.error{ color: red; border-bottom: 1px dashed red; } .primary.ai2 { background: #235AFD !important; color: #FFFFFF !important; } .primary{ height: 39px; padding: 0px 20px; line-height: 39px; border-radius: 6px; display:inline-block; text-align: center; font-weight: bold; cursor: pointer; background: #235AFD; color: #FFFFFF; } .primary.ai{ background: #4ED6D2 !important; color: #FFFFFF !important; } .primary.ai2{ background: #235AFD !important; color: #FFFFFF !important; } .primary-upload{ height: 39px; line-height: 39px; padding: 0px 34px; background: #0281FF; border-radius: 27px; display:inline-block; text-align: center; font-weight: bold; color: #FFFFFF; } .mp21{ margin-top: 21px; } .mp23{ margin-top: 23px; } .mp32{ margin-top: 32px; } .hide{ display: none !important; } .left .leftitem .list p{ /* width: calc(100% - 60px); */ width: 100%; word-break: break-all; /* padding-left: 50px; */ position: relative; line-height: 22px; min-height: 22px; } .modelDialog2ConList p{ word-break: break-all; position: relative; } .catalogue-lv1:before{ content: attr(data-leveltxt) " "; /* width: 63px; */ /* position: absolute; */ top: 0px; left: 0px; height: auto; padding-bottom: 6px; line-height: 22px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: #3D4B54; display: inline-block; margin-right: 5px; background-image: url(/images/ai/catelogue/zhangkai_h1.png); background-repeat: no-repeat; background-size: 8px auto !important; background-position: 24px 10px; cursor: pointer; word-spacing: 12.8px; } .catalogue-lv2:before{ content: attr(data-leveltxt) " "; top: 0px; left: 0px; height: auto; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #8C8C8C; line-height: 22px; padding-bottom: 6px; display: inline-block; margin-right: 5px; cursor: pointer; background-image: url(/images/ai/catelogue/zhangkai_h2.png); background-repeat: no-repeat; background-size: 8px auto !important; background-position: 24px 10px; cursor: pointer; word-spacing: 12.8px; } .catalogue-lv3:before{ content: attr(data-leveltxt) " "; top: 0px; left: 0px; height: auto; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #8C8C8C; line-height: 22px; padding-bottom: 6px; display: inline-block; margin-right: 5px; cursor: pointer; background-image: url(/images/ai/catelogue/zhangkai_h2.png); background-repeat: no-repeat; background-size: 8px auto !important; background-position: 24px 10px; cursor: pointer; word-spacing: 12.8px; } .catalogue-lv1.error:before{ content: attr(data-leveltxt) " "; top: 0px; left: 0px; height: auto; padding-bottom: 6px; line-height: 22px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: red !important; display: inline-block; margin-right: 5px; word-spacing: 12.8px; } .catalogue-lv2.error:before{ content: attr(data-leveltxt) " "; top: 0px; left: 0px; height: auto; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; line-height: 22px; padding-bottom: 6px; color: red !important; display: inline-block; margin-right: 5px; word-spacing: 12.8px; } .catalogue-lv3.error:before{ content: attr(data-leveltxt) " "; top: 0px; left: 0px; height: auto; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; line-height: 22px; padding-bottom: 6px; color: red !important; display: inline-block; margin-right: 5px; word-spacing: 12.8px; } .catalogue-title-wrap{ display: flex; } .catalogue-title-wrap .catalogue-title-headings{ line-height: 22px; min-height: 22px; margin-right: 10px; cursor: pointer; display: flex; } .catalogue-title-headings.headingsh1{ font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: #3D4B54; } .catalogue-title-headings.headingsh1::after{ content: ''; width: 8px; height: 3.2px; background: url(/images/ai/catelogue/zhangkai_h1.png) no-repeat center center; margin-top: 10px; margin-left: 2px; background-size: 8px 4px !important; } .catalogue-title-headings.headingsh2::after{ content: ''; width: 8px; height: 5.2px; background: url(/images/ai/catelogue/zhangkai_h1.png) no-repeat center center; margin-top: 10px; margin-left: 2px; background-size: 8px 5px !important; } .catalogue-title-headings.headingsh2{ /* text-indent: 1em; */ } .catalogue-title-headings.headingsh1.ai2.active::after{ content: ''; width: 8px; height: 3.2px; background: url(/images/ai/catelogue/zhankai2.png) no-repeat !important; background-size: 8px 4px !important; margin-top: 10px; margin-left: 2px; } .catalogue-title-headings.active.ai1{ color: #4ED6D2 !important; } .catalogue-title-headings.active.ai2{ color: #1675FF !important; } .catalogue-title-headings{ position: relative; } .catalogue-title-headings-out ul{ position: absolute; left: 0px; top: 22px; width: 131px; height: 120px; background: #FFFFFF; box-shadow: 0px 1px 9px 0px rgba(28,35,59,0.1); border-radius: 8px; z-index: 288; padding: 14px; box-sizing: border-box; } .catalogue-title-headings-out{ position: fixed; left: 0; top: 0; z-index: 288; } .catalogue-title-headings-out li { cursor: pointer; } .catalogue-title-headings-out li .no-select{ display: block; height: 22px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(0,0,0,0.45); line-height: 22px; } .catalogue-title-headings-out li.ai2 .select{ height: 22px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #1675FF !important; line-height: 22px; } .catalogue-title-headings-out li.ai1 .select{ height: 22px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #4ED6D2 !important; line-height: 22px; } .catalogue-title-headings-out li .no-select img, .catalogue-title-headings-out li .select img{ width: 12px; height: 12px; margin-right: 4px; vertical-align: middle; position: relative; top: -2px; } .catalogue-title-headings-out li .select{ display: none; } .catalogue-title-headings-out li.active .no-select{ display: none !important; } .catalogue-title-headings-out li.active .select{ display: block !important; } .catalogue-title-headings-out br{ display: none !important; } #lottie{ position: absolute; box-sizing: border-box; left: 50%; top: 50%; width: 150px; margin-left: -100px; margin-top: -150px; } #lottie::after{ content:'AI思考中...'; text-align: center; display: block; width: 100%; color: #999; } .primary.white{ background-color: #ffffff !important; color: #1675FF !important; border: 1px solid #1675FF !important; box-sizing: border-box; } .optionCancelBtn{ display: none; } .editing .optionCopyBtn,.editing .optionEditBtn{ display: none !important; } .editing .optionCancelBtn{ display: block !important; } .optionCancelBtn{ margin-right: 10px !important; } .mask{ position: fixed; top: 0px; left: 0; width: 100%; height: 100%; z-index:88888; opacity: .5; background: #000; display: none; } .confirmAlt{ position: fixed; z-index:888889; width: 496px; height: 174px; background: #FFFFFF; border-radius: 9px; left: 50%; top: 50%; overflow: hidden; box-sizing: border-box; margin-left: -248px; margin-top: -107px; display: none; } .confirmAltLogo{ width: auto; height: 32px; } .confirmAltClose{ position: absolute; right: 19px; top: 14px; cursor: pointer; } .confirmAltLine1{ width: 100%; height: 32px; line-height: 32px; display: flex; justify-content: center; margin-top: 29px; font-size: 14px; font-weight: 500; color: #3D4B54; } .confirmAltLogo{ margin-right: 9px; } .confirmOption{ display: flex; justify-content: center; margin-top: 28px; } .confirmOptionCancel{ margin-right: 20px; } .right .header{ height: 22px; font-size: 14px; font-weight: 600; color: #3D4B54; line-height: 22px; margin-top: 19px; } .right .header img{ width: 12px; height: auto; vertical-align: middle; } .catacon{ height: 17px; font-size: 12px; color: #8C8C8C; line-height: 17px; margin-top: 10px; margin-bottom: 15px; } .content .right{ background-color: #FFFFFF; padding-left: 14px; padding-right: 14px; } #modelDialog2ConRight{ width: calc(100% - 32px); margin: 17px auto 0px; border-radius: 8px; background-color: #FFFFFF; } #modelDialog2ConRight .list { /* background-color: #F5F6F6 !important; */ /* width: 100% !important; */ } .addServiceSelect{ display: flex; } .addServiceSelect .pptTplInfo{ display: flex; align-items: center; justify-content: center; } .addServiceSelect .pptTplInfo span{ height: 18px; font-size: 13px; color: #3D4B54; line-height: 18px; overflow: hidden; word-break: break-all; text-overflow: ellipsis; white-space: nowrap; max-width: 156px; } .addServiceSelect .priceFlag{ flex-shrink: 0; } .pptBrLine{ width: 1px; box-sizing: border-box; height: 32px; border-right: 1px dashed #D9D9D9; margin-top: 7px; margin-right: 10px; margin-left: 10px; } .pptTplRight{ position: relative; } .pptTplListBox{ width: 390px; height: 350px; background: #FFFFFF; border-radius: 5px; position: absolute; right: -11px; top: -353px; box-sizing: border-box; box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.13); display: none; } .pptTplListBox::after{ content: ''; position: absolute; width: 14px; height: 12px; bottom: -7px; right: 26px; z-index: 1; background: white; transform: rotate(56deg) skew(25deg); -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.13); -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.13); box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.13); } .pptTplRight div:first-of-type{ color:red; width: 100%; text-align: center; height: 18px; font-size: 13px; color: #BFC4C7; line-height: 18px; } .addServiceSelect .pptTplInfo{ height: 18px; font-size: 13px; color: #3D4B54; line-height: 18px; } .addServiceSelect .pptTplInfo img{ width: 13px; height: 13px; margin-left: 5px !important; } .pptTplListBox{ padding:17px 0px; box-sizing: border-box; } .pptTplListBox .pptTplListBoxTitle{ height: 18px; font-size: 13px; color: #3D4B54; line-height: 18px; } .pptTplListBoxList{ margin-top: 12px; height:288px; overflow-x: hidden; display: flex; flex-wrap: wrap; row-gap: 13px; justify-content: space-between; padding:0 15px 15px; } .pptTplListBoxItem{ position: relative; width: 162px !important; min-height: 91px !important; height:auto !important; box-sizing: border-box; border-radius: 5px; } .pptTplListBoxItem img{ display:block; margin:0 auto !important; } .pptTplListBoxItem img:first-of-type{ width:30px; height:30px; position: absolute; right:0; top:61px; display:none; } .pptTplListBoxItem.active img:first-of-type{ display:block; } .pptTplListBoxItem img:last-of-type{ width: 162px; height: 91px; box-sizing: border-box; box-sizing: border-box; border-radius: 5px; } .pptTplListBoxItem.active img:last-of-type{ border: 1px solid #1675FF; box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.13); } .pptTplListBoxItem div:last-of-type{ min-height: 18px; height:auto !important; font-size: 13px; color: #3D4B54; line-height: 18px; text-align: center; margin-top: 4px; } .pptTplListBoxItemOption{ position: absolute; top: 68px; left: 0; height: 22px !important; background: rgba(0,0,0,0.53); border-radius: 0px 0px 5px 5px; z-index:8; display:none; } .pptTplListBoxItemOption div{ float:left; color: #FFFFFF !important; font-size: 13px !important; text-align: center !important; height: 16px !important; line-height: 16px !important; width:50% !important; margin-top: 3px !important; } .pptTplListBoxItemPreview{ border-right: 1px solid rgba(255, 255, 255, 0.6); } .pptmask{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.21); z-index:898989; display: none; } .pptPreview{ position: fixed; top: 50%; left: 50%; margin-left: -450px; margin-top: -303px; width: 900px; height: 566px; background: #FFFFFF; z-index:8989898; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.14); border-radius: 8px; overflow: hidden; display: none; } .pptPreviewTitle{ width: 100%; height: 25px; font-weight: 500; font-size: 18px; color: #3D4B54; line-height: 25px; margin-top: 22px; text-align: center; } .pptPreviewImg{ width: 844px; height: 397px; background: #F9FAFA; margin: 22px auto 0; padding: 16px 26px 26px 26px; box-sizing: border-box; overflow-x:hidden; overflow-y:auto; } .pptPreviewImgCon{ width: 792px; height: auto; padding: 0 0 16px 0; box-sizing: border-box; } .pptPreviewImgCon img{ width: 792px; height: auto; } #pptPreviewClose{ position: absolute; width: 15px; height: 15px; top:27px; right:29px; cursor:pointer; } .pptPreviewBtn{ width: 100%; display:flex; justify-content: center; column-gap: 107px; margin-top: 30px; } .pptPreviewBtn div{ width: 132px; height: 40px; line-height: 40px; text-align: center; box-sizeing: border-box; border-radius: 3px; font-weight: 500; font-size: 14px; cursor: pointer; } .pptPreviewBtn .cancel{ background: #FFFFFF; border-radius: 3px; border: 1px solid #1675FF; color: #1675FF; } .pptPreviewBtn .submit{ background: #1675FF; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1); color: #FFFFFF; } .custom_style_btn{ width: 132px !important; height: 50px !important; line-height: 50px !important; background: url(/images/ai2/ai_index_btn.png) !important; background-size: 132px 50px !important; background-repeat: no-repeat !important; box-shadow: 0px 2px 10px 0px rgba(46,113,92,0.12) !important; border-radius: 0px !important; margin:30px 0 0 0 !important; font-size: 16px !important; font-weight: 500 !important; text-shadow: 0px 2px 4px rgba(44,115,141,0.47) !important; } .index-right-bg{ height:280px; width:auto; position: absolute; right: 0; bottom: 0; }