@import url('font/if/iconfont.css');
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,.3);-webkit-border-radius:10px;border-radius:10px}
::-webkit-scrollbar-thumb{-webkit-border-radius:10px;border-radius:10px;background-color:#EFF1F3;-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,.5)}
::-webkit-scrollbar-thumb:window-inactive{background:rgba(255,0,0,.3)}
*{word-wrap:break-word;outline:none;}
html,body,div,span,h1,h2,h3,h4,p,a,
dl,dt,dd,ol,ul,li,fieldset,legend,label,form,input,select,option,textarea,button,
table,tr,th,td{margin:0;padding:0;vertical-align:baseline;color:#111;font-weight:400;font-size:15px;line-height:185%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}
@media screen and (max-width:640px) {
html,body,div,span,h1,h2,h3,h4,p,a,
dl,dt,dd,ol,ul,li,fieldset,legend,label,form,input,select,option,textarea,button,
table,tr,th,td{font-size:17px;}
}
body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;overflow-x:hidden;}
img{border:0;vertical-align:middle;max-width:100%}
p{margin:12px 0;}
h1, h2, h3, h4{font-size:30px;line-height:normal;margin:0 0 16px 0;font-weight:700;}
h2{font-size:26px} h3{font-size:22px;} h4{font-size:17px;}
ul,li{list-style:none;}
a{color:#333;text-decoration:none;outline:none;}
a:hover{color:#e30615;text-decoration:underline}
.clear{clear:both;width:100%;height:0;overflow:hidden;}
.hide{display:none;}
.center{text-align:center;} .right{text-align:right;}
.fleft{float:left;} .fright{float:right;}
.remark{color:#999;font-size:11px;} .red{color:#F00;} .blue{color:#06F;} .yellow{color:#FF0;} .checked, .green{color:#13C4A5;}
del{color:#999;font-size:11px;}
.pd20{padding:20px;}.mt10{margin-top:10px;}.mt20{margin-top:20px;}.mt30{margin-top:30px;}
.fs16{font-size:16px;}.fs18{font-size:18px;}.fs24{font-size:24px;}

/*------------------------ layout ------------------------*/
.wrap{margin:0 auto;width:1100px;}

.logo{float:left;}
.logo img{height:60px;margin:20px 0;}

.top-h{float:left;margin:20px;}
.top-h h1{margin:0;line-height:60px;}

.bn img{width:100%;}

.floor-about{padding:110px 0;}
.floor-about .i-content{float:left;width:46%;}
.floor-about .i-img{float:right;width:46%;}

.footer{background-color:#15171a;padding:80px 0;}
.footer .i-contact{float:left;width:48%;}
.footer .i-contact .if{display:block;float:left;width:35px;color:#FFF;}
.footer .i-contact a{display:block;float:left;width: -moz-calc(100% - 35px);width: -webkit-calc(100% - 35px);width: calc(100% - 35px);color:#FFF;}
.footer .i-contact li{margin-bottom:8px;}
.footer .i-qrcode{float:right;width:220px;}
.footer .i-copyright{text-align:center;color:#999;margin-top:35px;}
.footer .i-copyright a{color:#DDD;display:inline-block;margin-left:10px;}


/*------------------------ common ------------------------*/
/* transition */
a{-webkit-transition:color 0.2s ease-out;-webkit-transition-delay:0.1s;-moz-transition:color 0.2s ease-out 0.1s;-o-transition:color 0.2s ease-out 0.1s;transition:color 0.2s ease-out 0.1s;}
#footer-newsletter button, .page a, .tabs li{
transition:background-color 0.5s ease 0s; -webkit-transition:background-color 0.5s ease 0s;-moz-transition:background-color 0.5s ease 0s;-o-transition:background-color 0.5s ease 0s;}
.nav-sub, #nav-language .i-menu, .sns-urls .if,
#nav a.p,
.btn-radius, .btn-radius-fill {
transition:all 0.5s ease 0s; -webkit-transition:all 0.5s ease 0s;-moz-transition:all 0.5s ease 0s;-o-transition:all 0.5s ease 0s;}

/* shadow */
.nav-sub, .category-tree .sub, #nav-language .i-menu,
.product-list li:hover .i-img,
#cart-slide .i-del-confirm
{-moz-box-shadow:0 1px 10px rgba(0,0,0,0.15);-webkit-box-shadow:0 1px 10px rgba(0,0,0,0.15);box-shadow:0 1px 10px rgba(0,0,0,0.15);}
.cut, .product-list .i-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}


/** ---------------- media ------------------ **/
@media screen and (max-width:1100px){
.wrap{width:auto;padding-left:18px;padding-right:18px;}
}

@media screen and (max-width:640px){
.logo img{height:35px;}
.top-h{margin:20px 10px;}
.top-h h1{font-size:18px;line-height:35px;}

.floor-about{padding:60px 0;}
.floor-about .i-content, .floor-about .i-img{float:none;width:100%;}
.floor-about .i-content{margin-top:35px;}

.footer{padding:50px 0;}
.footer .i-contact, .footer .i-qrcode{float:none;width:100%;}
.footer .i-qrcode{text-align:center;margin-top:30px;}
.footer .i-qrcode img{width:70%;}
}
