You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
text/static/css/common.css

1322 lines
24 KiB

blockquote, body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, td, textarea, th, ul {
margin: 0;
padding: 0
}
ol, ul {
list-style: none
}
body {
font: 12px/1.5 Arial;
-webkit-text-size-adjust: none
}
button, input, select {
vertical-align: middle;
font-size: 100%;
outline: 0
}
fieldset, img {
border: 0 none
}
em {
font-style: normal
}
i {
font-style: normal
}
a {
color: #333;
text-decoration: none;
outline: 0
}
a:hover {
color: #aaa
}
.clear {
clear: both;
display: block;
height: 0;
visibility: hidden;
font: 0/0 arial
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
font-size: 0
}
button {
cursor: pointer
}
.layz_load {
display: inline-block;
position: relative;
background: #ddd
}
.layz_load::before {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
animation-fill-mode: both;
top: 50%;
left: 50%;
border-radius: 50%;
background: #fff;
height: 20px;
width: 20px;
margin: -10px 0 0 -10px;
-webkit-animation: scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite;
-moz-animation: scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite;
animation: scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite
}
.layz_load::after {
content: "";
display: block;
position: absolute;
box-sizing: border-box;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
animation-fill-mode: both;
top: 50%;
left: 50%;
border-radius: 50%;
border: 2px solid #fff;
width: 40px;
height: 40px;
margin: -20px 0 0 -20px;
background: 0 0;
border: 2px solid;
border-color: #fff transparent #fff transparent;
-webkit-animation: rotate_scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite;
-moz-animation: rotate_scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite;
animation: rotate_scale 1s 0s cubic-bezier(.09, .57, .49, .9) infinite;
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
animation-duration: 1s
}
.f_w {
position: absolute;
width: 1000%
}
@keyframes rotate {
0% {
-webkit-transform: rotate(0);
transform: rotate(0)
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg)
}
}
@keyframes rotate_scale {
0% {
-webkit-transform: rotate(0) scale(1);
transform: rotate(0) scale(1)
}
50% {
-webkit-transform: rotate(180deg) scale(.6);
transform: rotate(180deg) scale(.6)
}
100% {
-webkit-transform: rotate(360deg) scale(1);
transform: rotate(360deg) scale(1)
}
}
@-webkit-keyframes scale {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1
}
45% {
-webkit-transform: scale(.1);
transform: scale(.1);
opacity: .7
}
80% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1
}
}
@font-face {
font-family: iconfont;
src: url(../font/iconfont.eot);
src: url(../font/iconfont.eot#iefix) format('embedded-opentype'), url(../font/iconfont.woff) format('woff'), url(../font/iconfont.ttf) format('truetype'), url(../font/iconfont.svg#iconfont) format('svg')
}
.header {
width: 1200px;
height: 80px;
padding: 0;
margin: 10px auto 0
}
.header .logo {
float: left;
width: 214px;
height: 54px;
margin: 10px 0 0 0;
overflow: hidden
}
.index .header .logo {
margin-right: 126px
}
.search-box {
position: relative;
z-index: 50;
float: right;
width: 302px;
padding: 0 78px 0 0;
margin: 10px 0 0
}
.index .search-box {
width: 502px;
float: left
}
.search-box .search-keyword {
position: relative;
padding: 6px 10px;
height: 20px;
overflow: hidden;
zoom: 1;
border: 2px solid #30C37E;
background: #fff
}
.search-box .keyword {
float: left;
width: 278px;
height: 20px;
border: 0 none;
outline: 0 none;
font: 14px/20px arial;
color: #999
}
.index .search-box .keyword {
width: 478px
}
.search-box .search-button {
position: absolute;
right: 0;
top: 0;
width: 80px;
height: 36px;
border: 0 none;
background-color: #30C37E;
color: #fff;
font: 16px/34px 'Microsoft YaHei', arial;
overflow: hidden;
cursor: pointer;
outline: 0 none
}
.search-box .search-button:hover {
background: #30C37E
}
.search-box .search-hot-words {
margin: 5px 0 0;
height: 20px;
line-height: 20px;
overflow: hidden
}
.search-box .search-hot-words span {
float: left;
color: #999
}
.search-box .search-hot-words a {
float: left;
margin: 0 15px 0 0
}
.search-box .search-hot-words a:hover {
color: #aaa
}
.search-suggest {
display: none;
position: absolute;
top: 36px;
left: 0;
border: 1px solid #e6e6e6;
border-top: 0 none;
width: 499px;
background: #fff;
z-index: 20
}
.suggest-list li {
height: 24px;
line-height: 24px;
overflow: hidden;
padding-left: 18px;
color: #666;
cursor: pointer
}
.suggest-list li span {
float: none;
margin-right: 0;
color: red
}
.suggest-list .sug-sel {
background: #f3f3f3
}
.suggest-list .sug-t {
padding-left: 5px;
font-weight: 700
}
.qrcode {
float: right;
position: relative;
padding: 8px 8px 0;
border: 1px solid #e6e6e6;
line-height: 22px;
text-align: center;
color: #666;
width: 70px;
height: 92px;
margin-bottom: -20px;
background-color: #fff;
z-index: 10
}
.qrcode img {
display: block
}
.qrcode-close {
position: absolute;
top: -1px;
left: -17px;
width: 15px;
height: 15px;
text-indent: -9999em;
overflow: hidden;
cursor: pointer;
background-position: -79px -136px;
background-color: #fff;
border: 1px solid #e6e6e6
}
.nav-box {
margin-top: -50px;
border-bottom: 2px solid #30C37E
}
.index .nav-box {
margin-top: 25px
}
.nav-box-inner {
width: 1200px;
margin: 0 auto
}
.nav-box .nav {
padding: 0 0 12px 360px;
height: 32px;
line-height: 32px
}
.index .nav-box .nav {
padding: 0 0 2px 230px
}
.nav li {
float: left;
height: 32px;
margin-right: 12px
}
.nav-box .nav li a {
position: relative;
float: left;
padding: 0 10px;
font: 16px/2 'Microsoft YaHei';
color: #333;
white-space: nowrap
}
.nav-box .nav li a:hover {
color: #aaa
}
.nav-box .nav .zol618entry {
position: absolute;
left: -4px;
top: -32px;
width: 97px;
height: 38px
}
.nav-box .nav-box-inner .link-ad {
float: right;
width: 100px;
height: 32px;
margin: -34px 0 0;
overflow: hidden;
text-indent: -9999em
}
.page-box {
position: relative;
zoom: 1
}
.pagebar {
padding: 0 0 40px;
font-size: 14px;
font-family: arial;
line-height: 34px;
text-align: center
}
.pagebar span {
margin: 0 3px 0 2px
}
.pagebar_2 {
padding: 0;
height: 38px;
width: 200px;
overflow: hidden;
margin: 0 auto
}
.pagebar span.historySel, .pagebar span.sel {
font-family: arial
}
.pagebar .historySel, .pagebar .sel, .pagebar a {
display: inline-block;
border: 1px solid #e6e6e6;
padding: 0 7px;
height: 34px;
min-width: 20px;
white-space: nowrap;
margin: 0 3px 0 2px;
vertical-align: top
}
.pagebar a {
color: #333
}
.pagebar .history, .pagebar .historyStart {
color: #ccc
}
.pagebar .sel, .pagebar a:hover {
background: #30C37E;
color: #fff;
border-color: #30C37E
}
.pagebar .historySel, .pagebar .historyStart:hover, .pagebar a.history:hover {
background: #ccc;
color: #fff;
border-color: #ccc
}
.pagebar a:hover {
text-decoration: none
}
.pagebar .prev {
padding: 0 11px 0 25px;
position: relative
}
.pagebar .next {
padding: 0 24px 0 12px;
position: relative
}
.pagebar .next i, .pagebar .prev i {
position: absolute;
width: 7px;
height: 12px;
font: 0/0 arial;
top: 11px
}
.pagebar .prev i {
left: 12px;
background-position: 0 -76px
}
.pagebar .next i {
right: 12px;
background-position: -11px -76px
}
.pagebar .prev:hover i {
left: 12px;
background-position: -22px -76px
}
.pagebar .next:hover i {
right: 12px;
background-position: -33px -76px
}
.footer {
background: #2c323b;
padding: 20px 0;
margin-top: 40px
}
.footer .links {
position: relative;
zoom: 1;
border-bottom: 1px solid #3d424a;
padding: 15px 0;
font-size: 12px;
color: #b1b3b9;
text-align: center
}
.footer .links a {
color: #b1b3b9;
padding: 10px
}
.footer .copyright {
width: 1000px;
margin: 0 auto
}
.footer .copyright p {
line-height: 30px;
text-align: center;
color: #b1b3b9
}
.footer .copyright a.office-verification {
margin-left: 5px;
padding: 5px 10px;
background-size: 20px 20px
}
.footer .copyright a.office-verification img {
width: 20px;
height: 20px;
vertical-align: top
}
.footer .copyright .footerIcon, .footer .copyright .footerIcon a {
display: inline-block;
zoom: 1;
vertical-align: middle
}
.footer .copyright .footerIcon {
width: 16px;
height: 16px;
margin-left: 5px;
margin-top: -2px
}
.footer .copyright .footerIcon a {
padding: 0
}
.footer .copyright a {
color: #999
}
.global-sitenav a {
text-decoration: none;
color: #333
}
.global-sitenav a:hover {
text-decoration: underline
}
.global-sitenav {
position: relative;
z-index: 1000;
height: 34px;
margin-bottom: 15px;
border-bottom: 1px solid #e6e6e6;
background: #fafafa;
color: #333;
font: 400 12px/34px 'Microsoft YaHei', arial
}
.global-sitenav .sitenav-inner {
min-width: 950px;
width: 1000px;
margin: 0 auto;
zoom: 1;
padding: 0 10px
}
.global-sitenav h3 {
margin: 0;
padding: 0
}
.global-sitenav button, .global-sitenav input {
margin: 0;
padding: 0;
vertical-align: middle;
font-size: 100%;
font-family: inherit
}
.global-sitenav img {
border: 0 none
}
.global-sitenav .icon-hot i, .global-sitenav .icon-new i {
position: absolute;
margin: 3px 0 0 2px;
width: 9px;
height: 11px;
font: 0/0 arial;
background-position: -60px -175px;
font: 0/0 arial
}
.global-sitenav .icon-hot i {
background-position: -60px -190px
}
.global-sitenav .red {
color: #f33
}
.global-sitenav .sitenav-inner:after {
content: " ";
display: block;
height: 0;
clear: both;
visibility: hidden;
font-size: 0
}
.global-sitenav .sitenav-links a:hover, .global-sitenav a:hover {
text-decoration: underline
}
.global-sitenav .sitenav-trigger {
display: block;
position: relative;
zoom: 1;
padding: 0 10px;
color: #666;
cursor: pointer
}
.global-sitenav .sitenav-trigger i {
position: absolute;
top: 15px;
right: 10px;
width: 7px;
height: 4px;
overflow: hidden;
background-position: -75px -195px
}
.global-sitenav .sitenav-dropdown-body {
display: none;
position: absolute;
top: 35px;
left: 0;
z-index: 5;
background-color: #fff;
border: 1px solid #E6E6E6
}
.global-sitenav .h-sitenav-dropdown {
position: relative;
margin-top: -1px
}
.global-sitenav .h-sitenav-dropdown .sitenav-trigger {
z-index: 10;
margin-bottom: -1px;
padding: 0 9px 1px;
border: 1px solid #e6e6e6;
border-bottom: 0 none;
background-color: #fff
}
.global-sitenav .h-sitenav-dropdown .sitenav-trigger i, .global-sitenav .h-sitenav-groupsite .sitenav-trigger i {
background-position: -85px -195px
}
.global-sitenav .h-sitenav-dropdown .sitenav-dropdown-body {
display: block
}
.global-sitenav .sitenav-links {
float: left
}
.global-sitenav .sitenav-links a {
color: #666;
text-decoration: none
}
.global-sitenav .sitenav-links .zol-link {
float: left;
width: 60px;
margin: 0 10px 0 0
}
.global-sitenav .sitenav-links .add-fav {
float: left;
margin-right: -60px
}
.global-sitenav .sitenav-links .sitenav-telephone {
float: left;
margin-right: -140px;
color: #999
}
.global-sitenav .sitenav-links .sitenav-telephone em {
color: #f33;
font-style: normal
}
.global-sitenav .sitenav-links .sitenav-trigger {
padding-right: 10px
}
.global-sitenav .sitenav-links .client-enter {
float: left;
margin: 0 10px 0 0;
width: 82px
}
.global-sitenav .product-librarylinks {
float: left;
position: relative;
padding-left: 10px
}
.global-sitenav .product-librarylinks a {
float: left;
margin: 0 15px 0 0
}
.global-sitenav .sitenav-productlibrary-count {
float: right
}
.global-sitenav .sitenav-productlibrary-count a {
margin: 0 0 0 15px;
color: #666
}
.global-sitenav .sitenav-productlibrary-count a:hover {
color: #aaa
}
.global-sitenav .sitenav-productlibrary-count em {
color: #f33
}
.global-sitenav .product-librarylinks .icon-hot i, .global-sitenav .product-librarylinks .icon-new i {
margin: 5px 0 0 0;
font: 0/0 arial
}
.global-sitenav .sitenav-groupsite {
position: relative;
z-index: 199;
float: left;
width: 97px
}
.global-sitenav .sitenav-groupsite a {
color: #333;
text-decoration: none
}
.global-sitenav .sitenav-groupsite a:hover {
color: #aaa;
text-decoration: underline
}
.global-sitenav .sitenav-groupsite .sitenav-trigger {
padding: 0 22px 0 25px;
background-position: -180px -168px
}
.global-sitenav .sitenav-groupsite .groupsite-sitemap-body {
display: none;
position: absolute;
top: 35px;
left: -70px;
width: 998px;
background: #fff;
border: 1px solid #E6E6E6;
-webkit-box-shadow: 0 2px 5px -3px rgba(0, 0, 0, .4);
box-shadow: 0 2px 5px -3px rgba(0, 0, 0, .4)
}
.global-sitenav .h-sitenav-groupsite {
margin-top: -1px;
background: #fff
}
.global-sitenav .h-sitenav-groupsite .sitenav-trigger {
z-index: 10;
margin-bottom: -1px;
padding: 0 21px 1px 24px;
border: 1px solid #e6e6e6;
border-bottom: 0 none;
background-color: #fff;
background-position: -181px -168px
}
.global-sitenav .h-sitenav-groupsite .groupsite-sitemap-body {
display: block
}
.global-sitenav .sitemap-items {
margin: 0 0 0 20px;
padding: 8px 0 12px;
list-style: none outside none
}
.global-sitenav .sitemap-items li {
overflow: hidden;
margin: 0;
padding: 4px 0 0;
list-style: none outside none;
zoom: 1;
line-height: 28px
}
.global-sitenav .sitemap-items a {
float: left;
margin: 0 16px 0 0;
color: #666;
font: 400 14px/28px 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1'
}
.global-sitenav .sitemap-items .icon-hot, .global-sitenav .sitemap-items .icon-new {
margin-right: 27px
}
.global-sitenav .sitemap-items .sitemap-sub-title {
float: left;
margin: 0 16px 0 0;
font: 400 14px/28px 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1';
color: #0b92e0
}
.global-sitenav .sitemap-items .more {
float: right
}
.global-sitenav .sitemap-items .more b {
font-family: simsun;
font-weight: 400
}
.global-sitenav .sitenav-login-bar {
float: right;
padding: 0;
width: 113px
}
.global-sitenav .sitenav-login-bar a:hover {
color: #aaa;
text-decoration: underline
}
.global-sitenav .sitenav-login-bar .sitenav-login-links {
float: right;
height: 24px;
margin: 5px 0 0;
width: 68px;
overflow: hidden
}
.global-sitenav .sitenav-login-bar .sitenav-qq, .global-sitenav .sitenav-login-bar .sitenav-weibo {
float: left;
width: 24px;
height: 24px;
margin: 0 0 0 10px;
background-position: 0 -175px;
color: #666;
text-indent: -9999em;
opacity: .8;
filter: alpha(opacity=80);
font: 0/0 arial
}
.global-sitenav .sitenav-login-bar .sitenav-qq {
background-position: -30px -175px
}
.global-sitenav .sitenav-login-bar .sitenav-qq:hover, .global-sitenav .sitenav-login-bar .sitenav-weibo:hover {
opacity: 1;
filter: alpha(opacity=100)
}
.global-sitenav .sitenav-login-bar .sitenav-login-box {
position: relative;
float: left;
width: 45px
}
.global-sitenav .sitenav-login-bar .sitenav-login-link {
display: inline-block;
width: 25px;
padding: 0 10px;
cursor: pointer
}
.global-sitenav .sitenav-login-bar .sitenav-login-form {
display: none;
position: absolute;
top: 34px;
right: -69px;
width: 190px;
padding: 11px 34px 4px;
border: 1px solid #cdcdcd;
-webkit-box-shadow: 0 0 8px #cdcdcd;
box-shadow: 0 0 8px #cdcdcd;
background: #fff
}
.global-sitenav .sitenav-login-bar .sitenav-login-box-open .sitenav-login-form {
display: block
}
.global-sitenav .sitenav-login-form h3 {
color: #666;
font: 400 12px/20px Arial
}
.global-sitenav .sitenav-login-form .sitenav-password, .global-sitenav .sitenav-login-form .sitenav-username {
position: relative;
display: block;
width: 172px;
height: 28px;
margin: 10px 0 0;
padding: 0 8px;
border: 1px solid #e6e6e6
}
.global-sitenav .sitenav-login-form .sitenav-username {
margin-top: 6px
}
.global-sitenav .sitenav-password input, .global-sitenav .sitenav-username input {
position: absolute;
top: 1px;
left: 8px;
width: 172px;
padding: 4px 0;
outline: 0 none;
border: 0 none;
line-height: 18px
}
.global-sitenav .sitenav-password label, .global-sitenav .sitenav-username label {
position: absolute;
top: 0;
left: 9px;
z-index: 10;
color: #ccc;
font-size: 12px;
line-height: 28px;
font-family: arial;
cursor: text;
-webkite-user-select: none;
user-select: none
}
.global-sitenav .sitenav-login-form .sitenav-focus {
border-color: #0791f5
}
.global-sitenav .sitenav-login-form .sitenav-focus label {
color: #e0e0e0
}
.global-sitenav .sitenav-login-form .sitenav-error {
border-color: #f33
}
.global-sitenav .sitenav-login-form .sitenav-registration {
margin-left: 0;
color: #1f4f88
}
.global-sitenav .sitenav-loign-bar {
overflow: hidden
}
.global-sitenav .sitenav-loign-bar a {
float: right;
color: #1f4f88
}
.global-sitenav .sitenav-loign-bar label {
float: left;
color: #666
}
.global-sitenav .sitenav-loign-bar label input {
float: left;
width: 14px;
height: 14px;
overflow: hidden;
margin: 10px 5px 0 0
}
.global-sitenav .sitenav-login-button {
display: block;
width: 190px;
height: 30px;
margin: 10px 0 0;
border: 0 none;
background: #008ef5;
color: #fff;
font: 700 14px/30px Arial;
cursor: pointer
}
.sitenav-login-error-tip {
position: absolute;
left: 34px;
top: 11px;
width: 190px;
height: 20px;
font: 12px/20px 'Microsoft YaHei', arial;
color: #f33;
background: #fff;
display: none
}
.global-sitenav .sitenav-personal-center {
float: right;
margin: 0 5px 0 0;
width: 280px
}
.global-sitenav .sitenav-personal-center a {
color: #666;
text-decoration: none
}
.global-sitenav .sitenav-personal-center a:hover {
color: #aaa;
text-decoration: underline
}
.global-sitenav .sitenav-personal-center .sitenav-personal-login-out {
float: right;
margin: 0 0 0 20px
}
.global-sitenav .sitenav-personal-center .sitenav-personal-msg {
position: relative;
float: right;
width: 16px;
height: 13px;
margin: 10px 0 0 20px;
background-position: -75px -175px
}
.global-sitenav .sitenav-personal-msg i {
position: absolute;
right: -3px;
top: -4px;
font: 0/0 arial;
width: 8px;
height: 8px;
background-position: -95px -175px
}
.global-sitenav .sitenav-personal-center .sitenav-personal-welcome {
float: right;
color: #999
}
.mask_layer {
position: fixed;
width: 100%;
height: 100%;
z-index: 9999;
background: rgba(0, 0, 0, .3);
top: 0;
left: 0
}
.mask_layer .loading {
position: absolute;
width: 200px;
height: 200px;
top: 50%;
left: 50%;
margin: -100px 0 0 -100px
}
.mask_layer .loading .a1 {
top: 135px;
left: 100px;
-webkit-animation: ball-spin-fade-loader 1s 0s infinite linear;
animation: ball_loader 1s 0s infinite linear
}
.mask_layer .loading .a2 {
top: 124px;
left: 124px;
-webkit-animation: ball_loader 1s .12s infinite linear;
animation: ball_loader 1s .12s infinite linear
}
.mask_layer .loading .a3 {
top: 100px;
left: 135px;
-webkit-animation: ball_loader 1s .24s infinite linear;
animation: ball_loader 1s .24s infinite linear
}
.mask_layer .loading .a4 {
top: 76px;
left: 124px;
-webkit-animation: ball_loader 1s .36s infinite linear;
animation: ball_loader 1s .36s infinite linear
}
.mask_layer .loading .a5 {
top: 65px;
left: 100px;
-webkit-animation: ball_loader 1s .48s infinite linear;
animation: ball_loader 1s .48s infinite linear
}
.mask_layer .loading .a6 {
top: 76px;
left: 76px;
-webkit-animation: ball_loader 1s .6s infinite linear;
animation: ball_loader 1s .6s infinite linear
}
.mask_layer .loading .a7 {
top: 100px;
left: 65px;
-webkit-animation: ball_loader 1s .72s infinite linear;
animation: ball_loader 1s .72s infinite linear
}
.mask_layer .loading .a8 {
top: 124px;
left: 76px;
-webkit-animation: ball_loader 1s .84s infinite linear;
animation: ball_loader 1s .84s infinite linear
}
.mask_layer .loading div {
background-color: #fff;
width: 15px;
height: 15px;
border-radius: 50%;
margin: 2px;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
position: absolute
}
.mask_layer .load_text {
position: absolute;
top: 65%;
left: 50%;
width: 140px;
margin-left: -60px;
font-size: 16px;
color: #fff
}
@-webkit-keyframes ball_loader {
50% {
opacity: .3;
-webkit-transform: scale(.4);
transform: scale(.4)
}
100% {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1)
}
}
@keyframes ball_loader {
50% {
opacity: .3;
-webkit-transform: scale(.4);
transform: scale(.4)
}
100% {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1)
}
}
.box_msg {
position: fixed;
left: 50%;
top: 50%;
padding: 10px 15px;
background: rgba(0, 0, 0, .6);
border-radius: 4px
}
.box_msg .con {
max-width: 300px;
color: #fff;
font-size: 14px
}
.box_mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .3)
}
.box_wrap {
position: fixed;
top: 50%;
left: 50%;
padding: 1px;
box-shadow: 0 0 10px #333;
background: #fff
}
.box_wrap .box_title {
padding: 10px 20px;
background: #f0f0f0;
font-size: 16px
}
.box_wrap .box_content {
background: #fff;
padding: 10px 0
}
.box_wrap .box_in {
padding: 0 20px;
min-width: 200px;
max-width: 600px
}
.box_wrap .box_btn_wrap {
padding: 10px 20px;
text-align: right
}
.box_wrap .box_btn_wrap button {
border: none;
line-height: 30px;
margin-left: 10px;
padding: 0 20px;
color: #fff;
cursor: pointer
}
.box_wrap .box_btn_wrap .confirm_btn {
background: #30C37E
}
.box_wrap .box_btn_wrap .cancel_btn {
background: #ccc
}
.box_wrap .box_close {
position: absolute;
top: 10px;
right: 10px;
width: 20px;
height: 20px;
cursor: pointer
}
.box_wrap .box_close::before {
content: "\e601";
font-family: iconfont;
font-size: 12px;
color: #999
}
.back_top {
position: fixed;
right: 0;
bottom: 100px;
display: none;
width: 42px;
height: 42px;
background: #ccc;
border-radius: 4px;
cursor: pointer
}
.back_top::before {
content: "\e60c";
display: block;
text-align: center;
line-height: 42px;
font-family: iconfont;
font-size: 20px;
color: #fff
}
.back_top:hover {
background: #aaa
}
.v3-compare-box-list li:hover .pic span {
color: #333
}