.position-relative { position: relative; } .position-absolute { position: absolute; } .d-flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .justify-content-center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } .justify-content-end { -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end } .justify-content-between { -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between } .align-items-center { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } header{ width: 100%; height: 70px; position: fixed; box-shadow:-1px 1px 4px 0px rgba(25,149,251,0.1); top: 0; left: 0; z-index: 110; background: #fff; } .header{ width: 1000px; height: 100%; margin: 0 auto; } .header .logo{ width: 380px; } .header ul li{ font-size:16px; color:#494949; margin-right: 34px; cursor: pointer; height: 70px; line-height: 70px; position: relative; } .header ul li:hover{ color: #096dde; } .header ul li.active-more:hover::after{ background-position: -135px -51px; } .header ul li.active-more::after{ content: ''; display: block; width: 17px; height: 9px; background-image: url(/uploads/image/sssimages/icon-gather.png); margin-left: 5px; background-size: 150px auto; background-position: -135px -30px; background-repeat: no-repeat; } .header ul li.active-more:hover .li-more{ display: block; } .header ul li .li-more{ position: absolute; top: 70px; left: -35%; width:144px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); display: none; } .header ul li .li-more ol{ width: 100%; height: 46px; text-align: center; line-height: 46px; font-size: 16px; color: #494949; cursor: pointer; } .header ul li .li-more ol:hover{ color: #096dde; } .header-login{ width: 144px; height: 70px; } .header-login .login-btn{ width:144px; height:35px; background:rgba(9,109,222,1); border-radius:6px; cursor: pointer; } .header-login .login-btn img{ width: 18px; height: 17px; } .header-login .login-btn span{ font-size:16px; color:rgba(255,255,255,1); line-height: 18px; margin-left: 8px; } .header-login .user-info-wrapper{ width:144px; height: 100%; position: relative; cursor: pointer; } .header-login .user-info-wrapper .head-portrait{ width:41px; height:41px; background:rgba(255,255,255,1); border:1px solid rgba(238,238,238,1); border-radius:50%; overflow: hidden; /* padding: 5px; */ } .header-login .user-info{ width: 90px; height: 40px; } .header-login .user-info p{ width: 90px; font-size:14px; color:rgba(73,73,73,1); overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; } .header-login .user-info-wrapper:hover .info-list{ display: block; } .header-login .info-list{ display: none; position: absolute; width:144px; background:rgba(255,255,255,1); border-radius:5px; top: 70px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); left: 0px; } .header-login .info-list li{ width: 100%; height: 46px; text-align: center; line-height: 46px; font-size: 16px; } footer{ width:100%; height:420px; } .footer-top{ width:100%; height:352px; background-color: #4069de; } .footer-top .content{ width: 1000px; margin: 0 auto; padding: 68px 0 20px; } .footer-top .content .footer-logo{ width: 186px; height: 77px; } .footer-top .content .qr{ width: 220px; } .footer-top .content .qr li img{ display: block; width: 90px; height: 90px; margin: 0 auto; } .footer-top .content .qr li p{ font-size:14px; color:rgba(255,255,255,1); text-align: center; margin-top: 12px; } .footer-top .content ul li{ margin-right: 67px; } .footer-top .content ul li:nth-last-child(1){ margin-right: 0; } .footer-top .content ul li .title{ font-size:17px; font-weight:500; color:rgba(255,255,255,1); position: relative; } .footer-top .content ul li .title::after{ content: ''; display: block; width: 65px; height: 1px; /* border: 1px solid #fff; */ position: absolute; bottom: -7px; left: 0; background-image: url(/uploads/image/sssimages/line.png); background-size: 65px auto; background-position: 0 0; background-repeat: no-repeat; } .footer-top .content ul .ol-list{ margin-top: 30px; } .footer-top .content ul ol{ font-size:14px; color:rgba(208,216,228,1); margin-bottom: 10px; font-weight:300; } .footer-top .content ul ol:hover{ color: #fff; cursor: pointer; } .footer-top .content hr{ width: 1000px; margin: 33px auto 0; border:1px solid rgba(255,255,255,1); opacity:0.1; } .footer-top .content .blogroll{ margin-top: 16px; } .footer-top .content .blogroll p{ font-size:14px; color:rgba(208,216,228,1); } .footer-top .content .blogroll span{ font-size:14px; color:#d0d8e4; margin-right: 10px; display: block; font-weight:300; } .footer-top .content .blogroll span:hover{ color: #fff; cursor: pointer; } .footer-bottom{ width:100%; height:68px; background-color: #365ac1; font-size:14px; font-weight:300; color:rgba(208,216,228,1); text-align: center; line-height: 20px; padding-top: 15px; } .footer-bottom a{ font-size:14px; font-weight:300; color:rgba(208,216,228,1); } .cursor-pointer{ cursor: pointer; } .toast-message{ font-size: 14px; color: #fff; } .section-banner{ width: 100%; min-height: 416px; background-image: url(/uploads/image/sssimages/banner.jpg); background-size: 1920px auto; background-repeat: no-repeat; background-position: center 0; padding: 257px 0 0; } body{ padding: 70px 0 0; } .section-banner .short-ipt{ font-size: 14px; padding-left: 10px; width:623px; height:63px; background:rgba(255,255,255,1); border:1px solid rgba(183,223,255,1); } .section-banner .short-btn{ width:167px; height:63px; background:rgba(9,109,222,1); font-size:18px; font-weight:bold; color:rgba(255,255,255,1); } .section-banner .short-btn:hover{ background-color: #0b62c3; } .section-banner .tool-info-wrapper{ margin: 0 auto; width: 790px; position: relative; } .section-banner .tool-info .doname-list { margin-top: 23px; } .section-banner .tool-info .doname-list li{ color: #096dde; font-size: 14px; margin-right: 20px; } .section-banner .tool-info .doname-list li label{ cursor: pointer; } .section-banner .tool-info .doname-list .radio-input { margin-right: 5px; width: 12px; height: 12px; border-radius: 50%; vertical-align: -5%; background-color: #ffffff; cursor: pointer; border: 1px solid #096dde; } .section-banner .tool-info .doname-list .radio-input:checked::before { content: ''; position: absolute; width: 5px; height: 5px; background: #096dde; border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%,-50%); } .section-banner .tool-info .doname-list span{ margin: 0; font-size: 14px; } .section-banner .term { display: inline-block; vertical-align: top; margin-top: 9px; } .section-banner .termname { display: inline-block; vertical-align: middle; font-size: 14px; color: #096dde; } .section-banner .term_select { display: inline-block; vertical-align: middle; width:71px; height:20px; color: #096dde; outline: none; background-color: #fff; border:1px solid #096dde; border-radius: 3px; padding-left: 5px; cursor: pointer; font-size: 12px; } .section-banner .short-creat-wrapper{ position: absolute; top: 130px; display: none; } .section-banner .short-creat-wrapper .top{ height: 60px; } .section-banner .short-creat-wrapper .top p{ width: 156px; background: #f2f7ff; text-align: center; line-height: 60px; font-size:18px; font-weight:bold; color:rgba(73,73,73,1); } .section-banner .short-creat-wrapper .top span{ width: calc(100% - 312px); text-align: center; line-height: 60px; background-color: #fff; } .section-banner .short-creat-wrapper .top .copy-btn{ width: 156px; background: #f2f7ff; text-align: center; line-height: 60px; font-size:18px; font-weight:bold; color:#096dde; } .section-banner .short-creat-wrapper .bottom{ width:790px; /*height:177px;*/ background:rgba(9,109,222,1); } .section-banner .short-creat-wrapper .bottom p{ font-size:16px; color:rgba(255,255,255,1); text-align: center; padding: 10px 0; } .section-banner .short-creat-wrapper .bottom p span{ font-size:18px; font-weight: bold; cursor: pointer; } .section-banner .short-creat-wrapper .bottom hr{ border-top:1px solid rgba(255,255,255,1); opacity:0.1; margin: 0; } .section-banner .short-creat-wrapper .bottom ul{ padding: 23px 50px; } .section-banner .short-creat-wrapper .bottom ul li{ width:127px; height:41px; background:rgba(255,255,255,1); border-radius:5px; font-size:16px; font-weight:500; color:rgba(9,109,222,1); text-align: center; line-height: 41px; cursor: pointer; } .section-banner .short-creat-wrapper .bottom .tips{ font-size:14px; color:rgba(218,229,255,1); text-align: center; padding: 12px 0; font-weight: 300; } .section-banner .short-creat-wrapper .bottom .tips span{ color: #fff; font-weight: bold; } .section-introduce{ padding: 54px 0 0; box-shadow: 0px 2px 5px rgba(0,0,0,0.05); } .section-introduce .title{ font-size:28px; color:rgba(9,109,222,1); text-align: center; } .section-introduce .subtitle{ font-size:16px; color:rgba(73,73,73,1); text-align: center; margin-top: 23px; } .section-introduce ul{ width: 1000px; margin: 98px auto 0; } .section-introduce ul li{ margin-bottom: 100px; } .section-introduce ul li .introduce-list-img1{ width: 556px; } .section-introduce ul li .introduce-list-img2{ width: 520px; } .section-introduce ul li .introduce-list-img3{ width: 571px; } .section-introduce ul li .introduce-list-img4{ width: 550px; } .section-introduce .introduce-list-img5{ width: 468px; } .section-introduce ul li .introduce-list1{ width: 400px; } .section-introduce ul li .introduce-list2{ width:458px; } .section-introduce ul li .introduce-list3{ width: 400px; } .section-introduce ul li .introduce-list4{ width: 429px; } .section-introduce ul li .introduce-list .top{ width:100%; height:49px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); font-size:16px; color:rgba(73,73,73,1); z-index: 11; position: relative; } .section-introduce ul li .introduce-list .top::before{ content: ''; display: block; width: 24px; height: 24px; background-image: url(/uploads/image/sssimages/icon-gather.png); background-size: 150px auto; background-position: 3px -44px; background-repeat: no-repeat; margin:0 16px 0 19px ; } .section-introduce ul li .introduce-list .bottom{ width:100%; /* height:128px; */ background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); position: relative; z-index: 9; padding: 28px 0 28px 50px; border-bottom: 2px solid rgba(9, 109, 222,0.9); } .section-introduce ul li .introduce-list .bottom .bottom-img{ width:47px; height:47px; background-image: url(/uploads/image/sssimages/icon-gather.png); background-size: 350px auto; background-position: -52px -105px; background-repeat: no-repeat; } .section-introduce ul li .introduce-list .bottom p { margin-left: 23px; } .section-introduce ul li .introduce-list .bottom p span{ font-size:18px; font-weight:500; color:rgba(9,109,222,1); display: block; line-height:26px; } .section-introduce ul li button{ width:152px; height:45px; background:rgba(9,109,222,1); border-radius:5px; font-size:18px; color:rgba(255,255,255,1); margin-top: 47px; } .section-introduce ul li button:hover{ background-color: #0b62c3; } .section-introduce .introduce-last{ width:100%; height:448px; background:rgba(255,255,255,1); /* box-shadow: 0px 2px 5px rgba(0,0,0,0.05); */ box-shadow: 0px 0px 6px 2px rgba(132,163,246,0.08); padding: 40px 0; } .section-introduce .introduce-list5{ width: 427px; margin-right: 91px; } .section-introduce .introduce-list5 button { width: 152px; height: 45px; background: rgba(9,109,222,1); border-radius: 5px; font-size: 18px; color: rgba(255,255,255,1); margin-top: 47px; } .section-introduce .introduce-list5 .top{ width: 100%; height: 49px; background: rgba(255,255,255,1); border-radius: 5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); font-size:18px; font-weight:500; color:rgba(9,109,222,1); z-index: 11; position: relative; border-bottom: 2px solid rgba(9, 109, 222,0.9); text-align: center; line-height: 49px; } .section-introduce .introduce-list5 .bottom{ width:100%; height:197px; background: rgba(255,255,255,1); border-radius: 5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); position: relative; z-index: 9; font-size:14px; color:rgba(77,77,77,1); line-height:13px; text-align: center; line-height: 25px; padding: 24px 0 29px; } .section-introduce .introduce-list5 .bottom span{ color: #4d4d4d; font-size: 16px; } .section-funlist{ width:100%; height:505px; background:linear-gradient(270deg,rgba(235,242,255,1) 0%,rgba(255,255,255,1) 100%); padding: 50px 0 65px; } .section-funlist ul{ width: 1000px; height: 100px; margin: 0 auto 10px; } .section-funlist ul:nth-of-type(1){ padding: 0 263px; } .section-funlist ul:nth-of-type(2){ padding: 0 92px; } .section-funlist ul:nth-of-type(3){ padding: 0 263px; } .section-funlist ul li{ width: 85px; height: 100px; } .section-funlist ul li p{ width: 70px; height: 70px; background-image: url(/uploads/image/sssimages/icon-gather.png); background-size: 500px auto; background-repeat: no-repeat; margin: 0 auto; } .section-funlist ul li.fun1 p{ background-position: 0px -1px; } .section-funlist ul li.fun2 p{ background-position:-148px 0px ; } .section-funlist ul li.fun3 p{ background-position: -73px 0px; } .section-funlist ul li.fun4 p{ background-position:-223px 0px ; } .section-funlist ul li.fun5 p{ background-position: -73px -73px; } .section-funlist ul li.fun6 p{ background-position: 0px -73px; } .section-funlist ul li.fun7 p{ background-position: -148px -73px; } .section-funlist ul li.fun8 p{ background-position: -223px -73px; } .section-funlist ul li span{ display: block; font-size:14px; color:rgba(77,77,77,1); text-align: center; margin-top: 7px; } .section-funlist ul p{ font-size:28px; color:rgba(77,77,77,1); } .section-funlist ul p span{ color: #096dde; text-decoration: underline; cursor: pointer; font-weight: bold; } .section-funlist ul p span:hover{ color: #0b62c3; } .section-funlist button{ display: block; width:152px; height:45px; background:rgba(9,109,222,1); border-radius:5px; font-size:18px; color:rgba(255,255,255,1); margin: 50px auto 0; } .section-funlist button:hover{ background-color: #0b62c3; } .section-cms{ width: 1000px; margin: 15px auto; } .section-cms li{ width:494px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); padding: 44px 34px 30px 40px; } .section-cms li .title span{ font-size:22px; color:rgba(26,104,192,1); } .section-cms li .title::before{ content: ''; display: block; width: 30px; height: 30px; background-image: url(/uploads/image/sssimages/icon-gather.png); background-repeat: no-repeat; background-size: 225px auto; background-position: -102px -69px; margin-right: 11px; } .section-cms li .tit-class::before{ background-size: 240px auto; background-position: -73px -74px; } .section-cms li .more span{ font-size:18px; color:#096dde; font-weight: 300; } .section-cms li .more::after{ content: ''; display: block; width: 6px; height: 24px; background-image: url(/uploads/image/sssimages/icon-arrows.png); background-size: 6px auto; background-repeat: no-repeat; background-position: center 8px; margin-left: 4px; } .section-cms li ul{ margin-top: 40px; } .section-cms li ul ol p{ width: 100%; font-size:14px; color:#1a68c0; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; } .section-cms li ul ol p:hover{ color: #096dde; } .section-cms li ul ol span{ display: block; width: 100%; font-size:12px; color:rgba(131,167,236,1); overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; margin-top: 10px; font-weight: 300; } .section-cms li ul hr{ margin: 17px 0 ; border:1px dashed rgba(131,167,236,.2); } .view-more-btn { font-size: 18px; text-align: center; color: #1995fb; margin: 30px 0; cursor: pointer; } .view-more-btn::before{ display: block; content: ''; width:27px; height:1px; border-top:1px solid rgba(9,109,222,1); margin-right: 8px; } .view-more-btn::after{ display: block; content: ''; width:27px; height:1px; border-top:1px solid rgba(9,109,222,1); margin-left: 8px; } .section-advertising{ width: 1000px; height: 260px; position: relative; margin: 14px auto 16px; background-image: url(/uploads/image/sssimages/advertising-banner.jpg); background-size: 1000px auto; background-image: center center; cursor: pointer; } .section-advertising:hover{ transform: scale(1.01); transition: .4s; } .section-advertising .promotion{ width:80px; height:30px; background:rgba(255,255,255,0.2); font-size:16px; font-weight:500; color:rgba(255,255,255,1); text-align: center; line-height: 30px; position: absolute; top: 10px; left: 12px; } .section-advertising button{ width:57px; height:23px; background:rgba(255,255,255,1); font-size:12px; color:rgba(94,94,94,1); position: absolute; right: 12px; top: 12px; } .section-advertising button::before{ content: ''; display: block; width: 11px; height: 11px; background-image: url(/uploads/image/sssimages/icon-gather.png); background-size: 100px auto; background-repeat: no-repeat; background-position: -90px -1px; margin-right: 4px; } /* 营销课堂 */ .cms-section { background-color: #f7f8fb; } .cms-section .banner1{ width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/cms-banner1.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .banner2{ width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-banner2-1.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .banner2-2{ width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-banner2-2.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .banner2-3{ width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-banner2-3.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .banner2-4{ width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-banner2-4.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .banner2.type1{ background-image: url(/uploads/image/sssimages/cms-banner2-1.jpg); } .cms-section .banner2.type2{ background-image: url(/uploads/image/sssimages/cms-banner2-3.jpg); } .cms-section .banner2.type3{ background-image: url(/uploads/image/sssimages/cms-banner2-2.jpg); } .cms-section .banner2.type4{ background-image: url(/uploads/image/sssimages/cms-banner2-5.jpg); } .cms-section .top-banner { min-width: 1000px; width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-top-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-section .top-banner .top-banner-wrap { width: 1000px; height: 100%; margin: auto; position: relative; } .cms-section .top-banner .top-banner-wrap > p { font-size: 38px; color: #9ebbee; position: absolute; top: 20px; left: 234px; } .cms-section .banner3{ width: 100%; height: 122px; background-image: url(/uploads/image/sssimages/cms-banner3.png); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .cms-container{ width: 1200px; margin: -35px auto 0; } .cms-container .left{ width: 700px; margin-right: 20px; } .cms-container .left nav{ width:700px; height:60px; background:rgba(255,255,255,1); padding: 0 70px; } .cms-container .left nav li{ height: 60px; line-height: 60px; font-size:18px; color:#494949; cursor: pointer; } .cms-container .left nav li.active{ color: #096dde; position: relative; font-weight:bold; } .cms-container .left nav li.active::before{ content: ''; width: 80%; height: 2px; background: #096dde; position: absolute; display: block; bottom: 0; left: 10%; } .cms-container .left .article-container{ width:700px; background:rgba(255,255,255,1); margin-top: 16px; padding: 22px 20px; } .cms-container .left .article-list{ margin-bottom: 60px; } .cms-container .left a:nth-last-child(1) .article-list{ margin-bottom: 0px; } .cms-container .left .article-list img{ width:188px; height:145px; background:rgba(235,235,235,1); } .cms-container .left .article-info{ width: 446px; height:145px; } .cms-container .left .article-info .title{ font-size:18px; color:rgba(64,64,64,1); } .cms-container .left .article-info .subtitle{ width: 446px; height: 40px; font-size:14px; font-weight:300; color:rgba(64,64,64,1); line-height: 20px; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 3; -webkit-box-orient: vertical; margin-top: 18px; } .cms-container .left .article-info .info{ margin-top: 41px; } .cms-container .left .article-info .info p{ height: 20px; } .cms-container .left .article-info .info span{ font-size:14px; font-weight:300; color:rgba(139,139,139,1); line-height: 20px; } .cms-container .left .article-info .info .timer i{ width:17px; height:17px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -13px -1px; background-size: auto 40px; background-repeat: no-repeat; margin-right: 4px; } .cms-container .left .article-info .info .reader i{ width:21px; height:14px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -41px -1px; background-size: auto 40px; background-repeat: no-repeat; margin-right: 4px; } .cms-container .right{ width: 280px; } .cms-container .right .search input{ width:230px; height:47px; background:rgba(255,255,255,1); font-size:14px; font-weight:300; padding-left: 25px; position: relative; } .cms-container .right .search button{ width:50px; height:47px; background:#096dde; padding: 0; } .cms-container .right .search button i{ display: block; width: 24px; height: 24px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -158px 0px; background-size: auto 60px; background-repeat: no-repeat; margin-left: 12px; } .cms-container .right .hot-article{ width:280px; /*height:456px;*/ background:rgba(255,255,255,1); margin-top: 16px; padding: 15px 14px; } .cms-container .right .hot-article .title span{ font-size:18px; color:#096dde; } .cms-container .right .hot-article .title i{ display: block; width: 17px; height: 20px; background-image: url(/uploads/image/sssimages/icon-gather2.png); background-position: -133px -26px; background-size: auto 70px; background-repeat: no-repeat; margin-right: 13px; } .cms-container .right .hot-article ul{ padding: 15px 0; } .cms-container .right .hot-article-list{ margin-bottom: 17px; } .cms-container .right a:nth-last-child(1) .hot-article-list{ margin-bottom: 0px; } .cms-container .right .hot-article-list img{ width:83px; height:64px; background:rgba(235,235,235,1); } .cms-container .right .hot-article-list-title{ width:150px; height:39px; font-size:14px; color: rgba(64,64,64,1); line-height: 20px; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 3; -webkit-box-orient: vertical; } .cms-container .right .hot-article-info{ height: 64px; } .cms-container .right .hot-article-list .timer{ margin-top: 9px; } .cms-container .right .hot-article-list .timer i{ width: 13px; height: 13px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -13px -1px; background-size: auto 37px; background-repeat: no-repeat; margin-right: 4px; } .cms-container .right .hot-article-list .timer span{ font-size:12px; font-weight:300; color:rgba(139,139,139,1); } .cms-container .right .advertising-space{ width:280px; } .cms-container .right .advertising-space img{ display: block; width:280px; height:142px; background:rgba(235,235,235,1); margin-top: 16px; } .market-page{ margin: 50px 0 50px; } /* 外面盒子样式---自己定义 */ .market-page .page_div { /* margin: 20px 10px 20px 0; */ color: #666; width: 1000px; height: 28px; /* margin: 50px auto 20px; */ display: flex; justify-content: center; width: 100%; } /* 页数按钮样式 */ .market-page .page_div button { display: inline-block; min-width: 30px; height: 28px; cursor: pointer; color: #666; font-size: 13px; line-height: 25px; background-color: #f9f9f9; border: 1px solid #dce0e0; text-align: center; margin: 0 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .market-page #firstpage, .market-page #lastpage, .market-page #nextpage, .market-page #prepage { width: 50px; color: #404040; border: 1px solid #404040 } .market-page #nextpage, .market-page #prepage { width: 70px } .market-page .page_div .current { background-color: #096dde; border-color: #096dde; color: #fff } /* 页面数量 */ .market-page .totalpages { margin: 0 10px } .market-page .totalpages span, .market-page .totalsize span { color: #1995fb; margin: 0 5px } /*button禁用*/ .page_div button:disabled { opacity: .5; cursor: no-drop } .cms-container .left .essay-nav{ width: 700px; height: 46px; background: #fff; padding: 0 46px; } .cms-container .left .essay-nav i{ width: 14px; height: 18px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -31px 1px; background-size: auto 42px; background-repeat: no-repeat; margin-right: 10px; } .cms-container .left .essay-nav span{ font-size:16px; color:rgba(139,139,139,1); } .cms-container .left .essay-conainer{ width: 700px; background: #fff; margin-top: 2px; padding: 30px 46px 40px; word-break: break-all; } .cms-container .left .essay-conainer .title{ font-size:28px; color:rgba(64,64,64,1); } .cms-container .left .essay-conainer .info{ margin-top: 18px; } .cms-container .left .essay-conainer .info p{ height: 20px; } .cms-container .left .essay-conainer .info span{ font-size:14px; font-weight:300; color:rgba(139,139,139,1); line-height: 20px; } .cms-container .left .essay-conainer .info .timer{ margin-left: 24px; } .cms-container .left .essay-conainer .info .timer i{ width:17px; height:17px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -13px -1px; background-size: auto 40px; background-repeat: no-repeat; margin-right: 4px; } .cms-container .left .essay-conainer .info .reader i{ width:21px; height:14px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-position: -41px -1px; background-size: auto 40px; background-repeat: no-repeat; margin-right: 4px; } .cms-container .left .essay-conainer .essay-banner{ display: block; width:100%; height:356px; background:rgba(235,235,235,1); margin-top: 22px; } .cms-container .left .essay-info{ margin-top: 30px; color: #404040; font-size: 16px; line-height: 28px; } .cms-container .left .essay-icons{ width: 110px; height: 22px; margin-top: 80px; margin-left: 498px; } .cms-container .left .essay-icons .icons{ width: 110px; } .cms-container .left .essay-icons .icons1 li{ width: 25px; height: 22px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-size: auto 40px; background-repeat: no-repeat; } .cms-container .left .essay-icons .icons li{ width: 25px; height: 22px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-size: auto 40px; background-repeat: no-repeat; cursor: pointer; } .cms-container .left .essay-icons .icons li:nth-of-type(1){ background-position: -71px -20px; } .cms-container .left .essay-icons .icons li:nth-of-type(2){ background-position: -97px -20px; } .cms-container .left .essay-icons .icons li:nth-of-type(3){ background-position: -121px -20px; } .cms-container .left .essay-icons .icons li:nth-of-type(1):hover{ background-position: 3px -20px; } .cms-container .left .essay-icons .icons li:nth-of-type(2):hover{ background-position: -23px -20px; } .cms-container .left .essay-icons .icons li:nth-of-type(3):hover{ background-position: -47px -20px; } .cms-container .left .essay-conainer .essay-navigation{ margin-top: 40px; } .cms-container .left .essay-conainer .navigation-info{ margin-top: 20px; } .cms-container .left .essay-conainer .essay-navigation-prev,.cms-container .left .essay-conainer .essay-navigation-next{ width:285px; height:102px; background:rgba(9,109,222,1); padding: 21px 23px; cursor: pointer; } .cms-container .left .essay-conainer .essay-navigation-prev:hover,.cms-container .left .essay-conainer .essay-navigation-next:hover{ background-color: #0b62c3; } .cms-container .left .essay-conainer .essay-navigation-prev .title,.cms-container .left .essay-conainer .essay-navigation-next .title{ width: 222px; font-size:18px; font-weight:300; color:rgba(255,255,255,1); overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; } .cms-container .left .essay-conainer .prev-next-btn i{ width: 17px; height: 17px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-size: auto 40px; background-repeat: no-repeat; background-position: -125px 1px; margin-right: 5px; } .cms-container .left .essay-conainer .prev-next-btn span{ font-size:18px; font-weight:300; color:rgba(255,255,255,1); line-height: 17px; } .cms-container .left .essay-conainer .timer i{ width: 17px; height: 17px; background-image: url(/uploads/image/sssimages/icon-cms.png); background-size: auto 50px; background-repeat: no-repeat; background-position: 1px -2px; margin-right: 4px; } .cms-container .left .essay-conainer .timer span{ height: 17px; font-size:14px; font-weight:300; color:rgba(255,255,255,1); line-height: 18px; } .cms-container .left .essay-conainer .essay-navigation-next .prev-next-btn i{ transform:rotate(180deg); -ms-transform:rotate(180deg); /* ie 9 */ -webkit-transform:rotate(180deg); /* safari and chrome */ margin-left: 4px; margin-right: 0; } .cms-container .left .recommend{ width:700px; /* height:283px; */ background:rgba(255,255,255,1); margin: 27px 0 30px; padding: 33px 43px; } .cms-container .left .recommend .title{ font-size:18px; color:rgba(64,64,64,1); } .cms-container .left .recommend ul{ margin-top: 26px; } .cms-container .left .recommend li{ margin-bottom: 20px; } .cms-container .left .recommend li p{ width: 430px; font-size:14px; color:rgba(122,122,122,1); overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; } .cms-container .left .recommend li span{ font-size:14px; color:rgba(122,122,122,1); } .cms-container .left .recommend a:nth-last-child(1) li{ margin-bottom: 0; } .cms-container .right .news-article .title i { width: 28px; background-position: -97px 0px; } /* api页面 */ .section-api .api-banner{ width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/api-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-api .api-content{ width: 1000px; margin: -45px auto 0; } .section-api .api-key-box{ width:100%; height:54px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); padding: 0 0 0 47px ; display: none; } .section-api .api-key-box p{ font-size:18px; font-weight:bold; color:rgba(73,73,73,1); height:54px; line-height: 54px; } .section-api .api-key-box span{ font-size:20px; font-weight:bold; color:#096dde; display: block; width: calc(100% - 205px); } .section-api .api-key-box .copy-btn{ width:117px; height:54px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); font-size:18px; font-weight:bold; color:rgba(9,109,222,1); text-align: center; line-height: 54px; cursor: pointer; } .section-api .api-mode-box{ width:100%; /*height:184px;*/ background:rgba(255,255,255,1); border-radius:2px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); margin-top: 20px; } .section-api .api-mode-box ul li{ width:208px; height:42px; background:rgba(9,109,222,1); border-radius:2px; line-height: 42px; font-size:18px; font-weight:bold; color:rgba(255,255,255,1); text-align: center; margin-right: 20px; } .section-api .api-mode-box .mode-list{ padding: 17px 0; } .section-api .api-mode-box ol:nth-of-type(1){ margin-bottom: 15px; } .section-api .api-mode-box ol i{ width:9px; height:9px; background:rgba(9,109,222,1); border-radius:50%; margin-left: 48px; } .section-api .api-mode-box ol p{ font-size:16px; color:rgba(73,73,73,1); margin-left: 5px; } .section-api .api-mode-box ol span{ font-size:16px; color:#096dde; } .section-api .api-table .title{ font-size:16px; font-family:source han sans cn; font-weight:bold; color:rgba(73,73,73,1); padding: 24px 43px 21px; } .section-api .api-table table{ width: 100%; border-spacing: 0; border-collapse: collapse; } .section-api .api-table table thead{ background-color: #f1f9ff; } .section-api .api-table table thead th{ font-size:14px; color:rgba(73,73,73,1); height: 30px; text-align: left; } .section-api .api-table table thead th:nth-of-type(1){ padding-left: 45px; } .section-api .api-table table tbody td:nth-of-type(1){ padding-left: 45px; } .section-api .api-table table tbody td{ font-size:14px; color:rgba(73,73,73,1); height: 30px; padding: 10px 0; word-break: break-all; } .section-api .api-table table tbody tr:nth-child(even){ background-color: #f1f9ff; } .mb-15{ margin-bottom: 15px; } /* 产品优势 */ .section-advantage .advantage-banner{ width: 100%; height: 395px; background-image: url(/uploads/image/sssimages/advantage-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-advantage nav{ width:1000px; height:150px; background:rgba(255,255,255,1); box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); padding: 0 165px; width: 1000px; margin: -75px auto 0; } .section-advantage nav li{ width: 160px; } .section-advantage nav p{ font-size:38px; color:rgba(9,109,222,1); text-align: center; } .section-advantage nav span{ font-size:18px; color:rgba(77,77,77,1); display: block; text-align: center; margin-top: 10px; } .section-advantage .title{ font-size:28px; color:rgba(9,109,222,1); text-align: center; margin-top: 86px; } .section-advantage .subtitle{ font-size:16px; color:rgba(73,73,73,1); text-align: center; margin-top: 23px; } .section-advantage ul{ width: 1000px; margin: 107px auto 0; } .section-advantage ul .list1 img{ width: 387px; } .section-advantage ul .list2 img{ width: 370px; } .section-advantage ul .list3 img{ width: 333px; } .section-advantage ul li{ margin-bottom: 90px; } .section-advantage ul li .advantage-list{ width: 428px; } .section-advantage ul li .advantage-list .tel{ font-size:18px; font-weight:500; color:rgba(9,109,222,1); margin-bottom: 23px; } .section-advantage ul li .advantage-list p{ font-size:16px; font-weight:500; color:rgba(77,77,77,1); } .section-advantage ul li .advantage-list span{ font-size:14px; color:rgba(77,77,77,1); display: block; line-height: 26px; margin-top: 16px; } .section-services{ width:100%; height:282px; background:linear-gradient(270deg,rgba(235,242,255,1) 0%,rgba(255,255,255,1) 100%); } .section-services .services-content{ width: 733px; height: 282px; background-image: url(/uploads/image/sssimages/bg-services.png); background-size: 733px auto; background-repeat: no-repeat; background-position: 0 0; margin: 0 auto; padding: 65px 0 50px; } .section-services .services-content p{ font-size:28px; font-weight:bold; color:rgba(9,109,222,1); text-align: center; } .section-services .services-content span{ font-size:16px; color:rgba(77,77,77,1); display: block; text-align: center; margin-top: 17px; } .section-services .services-content button{ width:170px; height:45px; background:rgba(9,109,222,1); border-radius:5px; font-size:21px; color:rgba(255,255,255,1); display: block; margin: 33px auto 0; } .section-services .services-content button:hover{ background: #0b62c3; } /* about页面 */ .section-about .about-banner{ width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/about-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-about .about-content{ width: 1000px; margin: -45px auto 0; } .section-about .title{ width:1000px; height:75px; background:rgba(255,255,255,1); box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); } .section-about .title p{ width: 34px; height: 36px; background-image: url(/uploads/image/sssimages/icon-gather2.png); background-size: 300px auto; background-repeat: no-repeat; } .section-about .title:nth-of-type(1) p{ background-position: -232px -9px; } /* .section-about .title:nth-of-type(1){ } .section-about .title:nth-of-type(3){ } */ .section-about .title:nth-of-type(5){ margin-top: 67px; } .section-about .title:nth-of-type(3) p{ background-position: -268px -44px; } .section-about .title:nth-of-type(5) p{ background-position: -270px -9px; } .section-about .title span{ font-size:22px; font-weight:bold; color:rgba(77,77,77,1); margin-left: 20px; } .section-about .about-wrapper{ margin-bottom: 52px; } .section-about .about-wrapper p{ font-size:16px; font-weight:bold; color:rgba(73,73,73,1); margin-top: 26px; } .section-about .about-wrapper span{ display: block; font-size:14px; color:rgba(77,77,77,1); margin-top: 14px; text-indent: 2em; line-height:24px; } .section-about .contact{ padding: 52px 285px 105px; } .section-about .contact li img{ width: 148px; height: 148px; } .section-about .contact li span{ font-size:18px; color:rgba(73,73,73,1); display: block; text-align: center; margin-top: 5px; } .section-about .course{ width: 100%; height: 718px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); position: relative; background-image: url(/uploads/image/sssimages/bg-course.png); background-size: 326px 555px; background-repeat: no-repeat; background-position: 292px 39px; } .section-about .course li{ position: absolute; } .section-about .course li.list-2020{ width: 329px; top: 56px; left: 69px; } .section-about .course li.list-2019{ width: 338px; top: 125px; left: 568px; } .section-about .course li.list-2018{ width: 280px; top: 218px; left: 155px; } .section-about .course li.list-2017{ width: 350px; top: 287px; left: 628px; } .section-about .course li.list-2016{ width: 333px; top: 380px; left: 90px; } .section-about .course li.list-2015{ width: 303px; top: 441px; left: 564px; } .section-about .course li.list-2014{ width: 264px; top: 498px; left: 142px; } .section-about .course li.list-2013{ width: 323px; top: 558px; left: 590px; } .section-about .course li ol:nth-of-type(1){ margin-top: 17px; } .section-about .course li ol:nth-of-type(2){ margin-top: 21px; } .section-about .course li .list-img{ width: 93px; height: 93px; /* background-color: red; */ background-image: url(/uploads/image/sssimages/icon-gather2.png); background-size: 541px auto; background-repeat: no-repeat; } .section-about .course li.list-2020 .list-img{ background-position: -96px -102px; width: 121px; height: 121px; } .section-about .course li.list-2019 .list-img{ background-position: -95px 0; } .section-about .course li.list-2018 .list-img{ background-position: -318px -102px; } .section-about .course li.list-2017 .list-img{ background-position: 0 -102px; } .section-about .course li.list-2016 .list-img{ background-position: -191px 0; } .section-about .course li.list-2015 .list-img{ background-position: 0 0; } .section-about .course li.list-2014 .list-img{ background-position: -221px -102px; } .section-about .course li.list-2013 .list-img{ background-position: -288px 0; } .section-about .course li .list-tit{ font-size:26px; font-weight:bold; color:rgba(73,73,73,1); } .section-about .course li p{ font-size:18px; font-weight:bold; color:rgba(73,73,73,1); margin-right: 8px; } .section-about .course li span{ font-size:16px; color:rgba(73,73,73,1); } /* faq页面 */ .section-faq .faq-banner { width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/faq-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-faq .faq-content{ width: 1000px; margin: -35px auto 97px; } .section-faq .faq-content .list1{ width:1000px; height:386px; background:rgba(255,255,255,1); box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); padding: 31px 41px; } .section-faq .faq-content .list2{ width:1000px; height:327px; background:rgba(255,255,255,1); padding: 31px 41px; } .section-faq .faq-content .list3{ width:1000px; height:319px; background:rgba(247,251,255,1); padding: 31px 41px; } .section-faq .faq-content li{ margin-bottom: 28px; } .section-faq .faq-content li .title{ font-size:16px; font-weight:bold; color:rgba(73,73,73,1); } .section-faq .faq-content li p{ font-size:14px; color:rgba(77,77,77,1); margin-top: 12px; } .section-faq .faq-content li span{ font-weight:bold; } /* 登录享特权页面 */ .section-privilege .privilege-banner { width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/privilege-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-privilege .privilege-content{ width: 1000px; margin: -76px auto 80px; } .section-privilege .title{ width: 100%; height: 50px; line-height: 50px; text-align: center; font-size:18px; font-weight:bold; color:rgba(73,73,73,1); box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); background: #fff; margin-top: 31px; } .section-privilege table{ width: 100%; border-spacing: 0; border-collapse: collapse; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); } .section-privilege table thead{ background-color: #e1eef8; } .section-privilege table thead th{ font-size:14px; font-weight:bold; color:rgba(73,73,73,1); height: 30px; } .section-privilege table thead th:first-of-type{ width: 280px; } .section-privilege table tbody td{ font-size:14px; color:rgba(73,73,73,1); height: 30px; text-align: center; } .section-privilege table tbody tr:nth-child(even){ background-color: #f1f9ff; } .section-privilege table tbody td i.hook{ display: block; width: 16px; height: 13px; background-image: url(/uploads/image/sssimages/icon-hook.png); background-size: 16px; background-repeat: no-repeat; margin: 0 auto; } .section-privilege table tbody td i.fork{ display: block; width: 11px; height: 11px; background-image: url(/uploads/image/sssimages/icon-fork.png); background-size: 11px; background-repeat: no-repeat; margin: 0 auto; } /* 短网址还原 */ .section-restore{ min-height: calc(100vh - 490px); } .section-restore .restore-banner { width: 100%; height: 270px; background-image: url(/uploads/image/sssimages/restore-banner.jpg); background-position: center center; background-size: 1920px auto; background-repeat: no-repeat; background-color: #f7fbff; } .section-restore .restore-content{ width: 1000px; margin: -45px auto; padding: 0 0 50px; } .section-restore .restore{ width: 1000px; height:325px; background:rgba(255,255,255,1); border-radius:5px; box-shadow: 0px 0px 8px 2px rgba(132,163,246,0.08); padding: 21px; position: relative; } .section-restore .restore textarea{ width: 100%; height: 100%; border:1px solid rgba(220,220,220,1); border-radius:5px; resize:none; font-size:16px; line-height:18px; padding: 21px 11px; } .section-restore .restore-content button{ display: block; width:150px; height:38px; background:rgba(9,109,222,1); border-radius:5px; font-size:18px; color:rgba(255,255,255,1); margin: 38px auto; } .section-restore .restore .fork{ width: 16px; height: 16px; background-image: url(/uploads/image/sssimages/icon-fork.png); background-size: 16px; background-repeat: no-repeat; position: absolute; right: 45px; top: 45px; cursor: pointer; } /* 登录弹框 */ .login-popup,.register-popup{ width:100%; height:100%; background: rgba(0, 0, 0, 0.2); position: fixed; top: 0; left: 0; z-index: 999; } .login{ width:690px; height:473px; background:rgba(248,250,255,1); border-radius:10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .login .title{ width:100%; height:54px; background:rgba(9,109,221,1); border-radius:10px 10px 0 0; font-size:26px; color:rgba(255,255,255,1); line-height: 54px; text-align: center; position: relative; } .login .title .close{ position: absolute; width: 16px; height: 16px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 220px auto; background-position: -97px -2px; top: 20px; right: 50px; cursor: pointer; } .login ul { padding: 24px 30px; } .login ul li{ width:288px; height:367px; background:rgba(255,255,255,1); border-radius:10px; padding: 16px 17px 56px; } .login ul .center-sec hr{ width: 1px ; height: 25px; border: 1px solid rgba(73, 73, 73,.3); } .login ul .center-sec{ font-size:18px; color:rgba(73,73,73,1); } .login ul li .tit{ text-align: center; font-size:18px; color:rgba(73,73,73,1); } .login ul li .ipt-list{ width:255px; height:30px; } .login ul li .ipt-list input{ width:255px; height:30px; background:rgba(255,255,255,1); border:1px solid rgba(82,163,255,1); border-radius:5px; position: absolute; top: 0; left: 0; padding-left: 52px; font-size:16px; font-weight:300; } .tips_message{ position: absolute; top: 29px; font-size: 14px; color: #d0021b; padding: 0 0 0 14px; } .login ul li .ipt-list i{ display: block; width: 22px; height: 22px; position: absolute; left: 10px; z-index: 12; top: 3px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 230px auto; } .login ul li .ipt-list.ipt-phone i{ background-position: 4px 1px; } .login ul li .ipt-list.ipt-phone{ margin-top: 37px; } .login ul li .ipt-list.ipt-password { margin-top: 23px; } .login ul li .ipt-list.ipt-password i{ background-position: -137px 1px; } .login ul li .ipt-list.ipt-identifying-code i{ background-position: -67px 1px; } .login ul li .ipt-list.ipt-message-code i{ background-position: -30px 2px; } .login ul li .ipt-list.ipt-identifying-code input{ width: 187px; } .login ul li .ipt-list.ipt-identifying-code img{ width:65px; height:30px; background:rgba(233,233,233,1); border-radius:5px; position: absolute; right: 0; top: 0; } .login ul li .ipt-list.ipt-message-code input{ width: 187px; } .login ul li .ipt-list.ipt-message-code .message-code{ width:65px; height:30px; background:rgba(9,109,221,1); border:1px solid rgba(9,109,221,1); border-radius:5px; font-size:12px; color:rgba(255,255,255,1); position: absolute; right: 0; top: 0; line-height: 27px; text-align: center; cursor: pointer; padding: 0; } .login ul li .ipt-list span{ display: block; position: absolute; width: 22px; height: 22px; text-align: center; line-height: 22px; z-index: 12; top: 3px; left: 32px; font-size: 17px; color: rgba(191, 191, 191,.5); } .login ul li .tips-remember{ width: 100%; height: 16px; margin-top: 21px; } .login ul li .tips-remember input{ width: 0; height: 0; } .login ul li .tips-remember i{ display: inline-block; width:16px; height:16px; background:rgba(255,255,255,1); border:1px solid rgba(82,163,255,1); } .login ul li .tips-remember span{ font-size:14px; color:#494949; margin-left: 10px; } .login ul li .tips-remember-lable{ cursor: pointer; } .login ul li .tips-remember a{ font-size:14px; color:rgba(9,109,221,1); } .login ul li .tips-remember input:checked i{ background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 220px auto; border: none; background-position: -204px -3px; background-color: #096edb; } .login ul li .login_btn{ width:238px; height:38px; background:rgba(9,109,221,1); border:1px solid rgba(9,109,221,1); border-radius:19px; font-size:16px; color:rgba(255,255,255,1); margin: 48px auto 0; } .login ul li .register-btn{ font-size:14px; color:#494949; text-align: center; margin-top: 21px; } .login ul li .register-btn a{ color: #096ddd; } .login ul li .qr-login{ width:166px; height:166px; background:rgba(255,255,255,1); margin: 28px auto 0; position: relative; cursor: pointer; } .login ul li .qr-login img{ width:166px; height:166px; } .login ul li .qr-login p{ position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); top: 0; left: 0; display: none; } .login ul li .qr-login span{ position: absolute; display: block; width: 100%; font-size:16px; color:rgba(255,255,255,1); line-height:26px; text-align: center; top: 50%; transform: translatey(-50%); } .login ul li .tips-agreement{ width: 100%; height: 16px; margin-top: 28px; } .login ul li .tips-agreement input{ width: 0; height: 0; } .login ul li .tips-agreement i{ display: inline-block; width:16px; height:16px; background:rgba(255,255,255,1); border:1px solid rgba(82,163,255,1); margin-right: 7px; } .login ul li .tips-agreement-lable{ cursor: pointer; } .login ul li .tips-agreement input:checked i{ background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 220px auto; border: none; background-position: -204px -3px; background-color: #096edb; } .login ul li .tips-agreement p{ font-size:14px; color:rgba(73,73,73,1); } .login ul li .tips-agreement span{ color:#096ddd; cursor: pointer; } .login ul li .tips-validity{ margin-top: 20px; } .login ul li .tips-validity i{ display: block; width: 22px; height: 22px; top: 3px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 230px auto; background-position: -173px 2px; margin-right: 5px; } .login ul li .tips-validity p{ font-size:14px; color:rgba(73,73,73,1); } .login ul li .tips-validity span{ color: #e26548; } .mt-17{ margin-top: 17px !important; } .reset-passwords-popup{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); position: fixed; top: 0; left: 0; z-index: 999; } .reset-passwords{ width:345px; height:396px; background: rgba(248,250,255,1); border-radius: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .reset-passwords .title{ width:100%; height:54px; background:rgba(9,109,221,1); border-radius:10px 10px 0 0; font-size:26px; color:rgba(255,255,255,1); line-height: 54px; text-align: center; position: relative; } .reset-passwords .title .close{ position: absolute; width: 16px; height: 16px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 220px auto; background-position: -97px -2px; top: 20px; right: 20px; cursor: pointer; } .reset-passwords-content{ width:289px; height:294px; background:rgba(255,255,255,1); border-radius:10px; padding: 16px 17px 56px; margin: 24px auto 0; } .reset-passwords .ipt-list{ width:255px; height:30px; } .reset-passwords .ipt-list input{ width:255px; height:30px; background:rgba(255,255,255,1); border:1px solid rgba(82,163,255,1); border-radius:5px; position: absolute; top: 0; left: 0; padding-left: 52px; font-size:16px; font-weight:300; } .reset-passwords .ipt-list i{ display: block; width: 22px; height: 22px; position: absolute; left: 10px; z-index: 12; top: 3px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 230px auto; } .reset-passwords .ipt-list.ipt-phone i{ background-position: 4px 1px; } .reset-passwords .ipt-list.ipt-phone{ margin-top: 37px; } .reset-passwords .ipt-list.ipt-password { margin-top: 23px; } .reset-passwords .ipt-list.ipt-password i{ background-position: -137px 1px; } .reset-passwords .ipt-list.ipt-identifying-code i{ background-position: -67px 1px; } .reset-passwords .ipt-list.ipt-message-code i{ background-position: -30px 2px; } .reset-passwords .ipt-list.ipt-identifying-code input{ width: 187px; } .reset-passwords .ipt-list.ipt-identifying-code img{ width:65px; height:30px; background:rgba(233,233,233,1); border-radius:5px; position: absolute; right: 0; top: 0; } .reset-passwords .ipt-list.ipt-message-code input{ width: 187px; } .reset-passwords .ipt-list.ipt-message-code .message-code{ width:65px; height:30px; background:rgba(9,109,221,1); border:1px solid rgba(9,109,221,1); border-radius:5px; font-size:12px; color:rgba(255,255,255,1); position: absolute; right: 0; top: 0; line-height: 28px; text-align: center; cursor: pointer; } .reset-passwords .ipt-list span{ display: block; position: absolute; width: 22px; height: 22px; text-align: center; line-height: 22px; z-index: 12; top: 3px; left: 32px; font-size: 17px; color: rgba(191, 191, 191,.5); } .reset-passwords .confirm-btn{ width:256px; height:38px; background:rgba(9,109,221,1); border:1px solid rgba(9,109,221,1); border-radius:19px; font-size:16px; color:rgba(255,255,255,1); margin-top: 22px; } .agreement-popup{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); position: fixed; top: 0; left: 0; z-index: 999; font-size:14px; } .agreement{ width:800px; height:563px; background:rgba(248,250,255,1); border-radius:10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .agreement .title{ width:100%; height:54px; background:rgba(9,109,221,1); border-radius:10px 10px 0 0; font-size:26px; color:rgba(255,255,255,1); line-height: 54px; text-align: center; position: relative; } .agreement .title .close{ position: absolute; width: 16px; height: 16px; background-image: url(/uploads/image/sssimages/icon-login.png); background-repeat: no-repeat; background-size: 220px auto; background-position: -97px -2px; top: 22px; right: 22px; cursor: pointer; } .agreement-content{ width:720px; /* height:279px; */ margin: 33px auto 0; overflow-y:auto; max-height:342px; z-index: 11; padding: 0 10px; } .agreement-content::-webkit-scrollbar { width: 3px; } .agreement-content::-webkit-scrollbar-track { background-color:#b8b8b8; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } .agreement-content::-webkit-scrollbar-thumb { background-color: #686868; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } .agreement .tit{ font-size:16px; font-weight:bold; color:rgba(36,36,36,1); line-height:26px; text-align: center; } .agreement .subtit{ font-size: 14px; color: #242424; line-height: 22px; text-indent: 1rem; margin-top: 27px; } .agreement ul li { margin-top: 10px; } .agreement ul li p{ font-size: 18px; color: #242424; } .agreement ul li span{ font-size: 14px; color: #242424; display: block; margin-top: 5px; } .agreement ul li > ul >li { margin-top: 10px; text-indent: 16px; } .agreement ul li .agreement-info{ font-size: 14px; color: #242424; margin-top: 5px; } .agreement button{ width:253px; height:45px; background:rgba(9,109,222,1); border-radius:5px; font-size:21px; color:rgba(255,255,255,1); margin: 30px auto 0; display: block; } .agreement .bold{ font-weight: bold; } .agreement b{ font-weight: bold; }