/* Base */
.dis-lb{ display: inline-block; }
.dis-b{ display: block; }
.dis-n{ display: none; }
.vis-v{ visibility: visible; }
.vis-h{ visibility: hidden; }
.opa1{ opacity: 1; }
.opa0{ opacity: 0; }
.f-lt{ float: left; }
.f-rt{ float: right; }
.pos-r{ position: relative;}
.pos-a{ position: absolute; }
.txt-c{ text-align: center; }
.txt-r{ text-align: right; }
.txt-l{ text-align: left; }
.txt-i{ text-indent: -9999px; }
.pd-none{ padding: 0; }
.mg-none{ margin: 0; }
.txt-u{ text-transform: uppercase; }
.txt-ca{ text-transform: capitalize; }
.tra-t{ -webkit-transition: all 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);transition: all 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55); }
.tra-t2{ -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
.s-hide{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d-hide{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
/* Head */
#header{ width: 100%; }
.head-top{ background-color:#82A6F5;  background: -webkit-gradient(linear, 0 0, 0 100%, from(#065850), to(#009688));}
.h-top-ul{ width: 100%; }
.h-top-ul li{ height: 25px; line-height: 25px; }
.h-top-ul a{ padding: 0 10px; border-right: 1px solid #ddd; color: #fff; }
.h-top-ul .fa{ color: #fff; }
.h-top-ul li:last-child>a{ border: none; }
.head-mid{ width: 100%; background-color:#f7f7f7;  background: -webkit-gradient(linear, 0 0, 0 100%, from(#f7f7f7), to(#f7f7f7)); }
.logo{ line-height: 74px; }
.logo img{ max-width: 70%; height: auto; }
.h-search{ padding: 26px 10px; }
.search-text{ width: 100%; height: 38px; line-height: 24px; padding: 8px 15px;     border: 1px solid #b7b7b7;
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out }
.search-btn{ position: absolute; top: 0; right: 0; }
.search-btn button{ position: relative; padding: 0 27px; height: 38px; line-height: 25px; background-color: #ffcf00; border:1px solid #b7b7b7 }
.h-cart{ padding: 24px 0; }
.h-cart .cart{ width: 40px; height: 40px; line-height: 30px;  margin: 0 auto; border: 1px solid #999; border-radius: 5px; }
.head-bottom{ background: -webkit-gradient(linear, 0 0, 0 100%, from(#3269c8), to(#000a8c)); }
.h-side-tit{ width: 100%; height: 50px; padding-left: 50px; line-height: 50px; color: #fff; font-weight: bold; background-color: #b50303; cursor: pointer; }
.h-side-tit a{ display: inline-block; width: 100%; color: #fff; font-size:16px; }
.h-side-tit span{ width: 18px; height: 2px; background-color: #fff; top: 24px; left: 20px; }
.h-side-tit span:before,.h-side-tit span:after{ content: ''; position: absolute;height: 2px; width: 24px; top: -7px; background-color: #fff; 
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out}
.h-side-tit span:after{ top: 7px; }
.h-side-tit span.act{ background: rgba(0,0,0,0); }
.h-side-tit span.act:before{ transform: rotateZ(45deg); top: 0; }
.h-side-tit span.act:after{ transform: rotateZ(-45deg); top: 0; }
.h-side-nav{ width: 100%; top: 34px; left: 0; background-color: #fff; border: 1px solid #484848; border-top: none; z-index: 16; display: none;opacity: 0;}
.h-side-nav>li{ width: 100%; height: 40px; border-bottom: 1px solid #fff; 
-webkit-transition: all 0.3s ease;transition: all 0.3s ease}
.h-side-nav>li>a{ padding: 0 10px; border-bottom: 1px solid #e5e5e5; line-height: 39px; }
.h-side-nav>li>a.on{ margin-right: -1px; border-right: 1px solid #484848; }
.h-side-nav>li:last-child{ border-bottom: none; }
.h-side-nav>li:last-child>a{ border-bottom: none; }
.font-tit{ float: left; width: calc( 100% - 20px ); font-size: 12px; }
.act-icon{ float: left; margin-top: 20px; position: relative; }
.act-icon:before,.act-icon:after{ position: absolute; left: 0; content: ""; width: 12px; height: 2px; background-color: #000; 
-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.act-icon:before{ top: -5px; }
.act-icon:after{ bottom: -5px; }
.act-icon.on:before{-webkit-transform: rotateZ(-134deg);transform: rotateZ(-134deg); }
.act-icon.on:after{ -webkit-transform: rotateZ(134deg);transform: rotateZ(134deg); }
.h-act{ display: block; opacity: 1; top: 50px; }
.tran-menu{ width: 704px; height: 400px; top: 0; left: 101%; overflow: hidden; padding: 10px; background-color: #fff; display: none; z-index: 2; 
-moz-box-shadow:3px 2px 5px #333333; -webkit-box-shadow:3px 2px 5px #333333; box-shadow:3px 2px 5px #333333;}
.tran-m-list>li{ width: 50%; line-height: 40px; float: left; }
.tran-m-list>li>a{ padding: 0 10px; }
.tran-img{ height: 188px; }
.tran-img img{ border-radius: 6px; }
.tran-img-des{ width: 100%; }
.tran-img-des p{ width: 100%; line-height: 28px; padding: 0 20px; margin: 16px 0 20px; font-size: 14px; font-weight: bold; text-align: center;     color: #ffa106;
    background-color: #f7e9d6;}
.tran-img-des a{ width: 60px; height: 30px; line-height: 30px; font-weight: bold; margin: 0 auto; background: url(../img/s-pic/more.png) no-repeat; color:#000; }
.h-nav{ width: 100%; overflow: hidden; }
.h-nav li{ line-height: 50px; float: left; border-left: 1px solid #fff;}
.h-nav li>a{ position: relative; color: #fff; padding: 0 10px; font-size: 16px; font-weight: bold; z-index: 1; }
.h-nav li:first-child{ border-left: none; }
.h-nav li>a:after{ content: ""; position: absolute; opacity: 0; width: calc(100% + 2px); height: 50px; top: -17px; left: 0; background-color: #fff; z-index: -1; 
background: -webkit-gradient(linear, 0 0, 0 100%, from(#408af5), to(#3269c8));}
.h-nav li:hover>a{ color: #3B200C; }
.h-nav li:hover>a:after{ opacity: 1; }
.ph-nav-btn{ width: 74px; height: 60px; right: 0; top: -60px; display: none; }
.ph-nav-btn span{ width: 18px; height: 2px; background-color: #fff; top: 30px; left: 24px; 
-webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.ph-nav-btn span:before,.ph-nav-btn span:after{ content: ''; position: absolute; height: 2px; width: 18px; top: -7px; background-color: #fff; 
	-webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.ph-nav-btn span:after{ top: 7px; }
.ph-nav-btn span.act{ background-color: rgba(225,225,225,0); }
.ph-nav-btn span.act:before,.ph-nav-btn span.act:after{ top: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.ph-nav-btn span.act:after{ -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
/* Small Cart */
.small-cart{ width: 274px; top: 64px; right: 50%; margin-right: -20px; background-color: #fff; z-index: 10; padding: 10px;; visibility: hidden; opacity: 0; 
-webkit-transition: all 0.3s ease;transition: all 0.3s ease}
.small-cart:after{ position: absolute; content: ""; top: -4px; right: 0; width: 32px; height: 4px; background-color: #fff; }
.small-cart p{ background-color: #fff; }
.s-cart-list{ width: 100%; height: 60px; border-bottom: 1px solid #333; padding: 4px 2px; }
.s-cart-img{ width: 51px; height: 51px; line-height: 51px; text-align: center; border: 1px solid #ddd; }
.s-cart-img img{ width: 100%; }
.s-cart-info{ width: calc( 100% - 120px); height: 51px; padding: 0 4px; overflow: hidden; }
.s-cart-info a{ display: block; }
.s-cart-parice{ width: 60px; height: 51px; }
.s-cart-parice em{ line-height: 24px; }
.s-cart-parice button{ float: right; width: 16px; height: 16px; line-height: 16px; }
.small-bottom{ width: 100%; height: 50px; line-height: 26px; padding: 10px 5px 0 5px; background-color: #f0f0f0; }
.s-tb{ width: 20%; font-size: 14px; color: #000; }
.s-pb{ width: 30%; font-weight: bold; color: red; }
.s-bb{ width: 40%; height: 26px; line-height: 26px; text-align: center; border-radius: 6px; color: #fff; background-color: #408AF5; }
.s-bb:hover{ background-color: #333; color: #fff; }
.h-cart .cartshow{ border-radius: 0px; border-color:#999; border-bottom: #fff; }
/* Page Index */
.page-index{ margin: 16px 0 16px 0; }
.page-index a{ display: inline-block; padding: 0 10px; height: 30px; line-height: 30px; border-radius: 4px; background-color: #ddd; }
.page-index li:first-child a,.page-index li:last-child a{ background-color: #fff; }
/* Banner */
.banner{ width: 100%; }
.carousel-control.left,.carousel-control.right{ background: none; width: 136px; }
.carousel-control span{ width: 40px; height: 40px; line-height: 32px; border: 4px solid #e5e5e5; border-radius: 50%; 
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out }
.carousel-control:hover span{ border-color: #3B200C; }
.carousel-control:hover span>.fa{ color: #3B200C; }
.carousel-indicators li{ border-color: #3B200C; }
.carousel-indicators .active{ background-color: #3B200C; }
/* ------------  pay btn  ------------ */
.p_wrap{ margin-bottom: 20px; }
#pay1,#pay2{ position: relative; display: inline-block; vertical-align: middle; margin-right: 20px; width: 20px; height: 20px; border-radius: 50%; border: 1px solid #666; background-color: #ddd; }
#pay1.act:after,#pay2.act:after{ position: absolute; top: 4px; left: 4px; content: ""; width: 10px; height: 10px; background-color: #000; border-radius: 50%; }
/* AD */
#mid-ad{ width: 100%; padding: 30px 0; }
.ad-icon{ margin-top: 7px;
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out }
.ad-icon:hover{ border-color: #408AF5; }
.ad-icon .glyphicon{ font-size: 22px;     color: #009688; }
.ad-des{ display: block; line-height: 26px; }
/* Recommended links */
.recom-img img{ border-radius: 10px; }
.recom-img a{z-index: 1;}
.recom-img a::before,.recom-img a:after{ content: ''; width: 0; height: 88%; border: 1px solid #FFF; border-left: none; border-right: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;z-index: 0; 
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out}
.recom-img a::after{ width: 88%; height: 0; border: 1px solid #fff; border-top: none; border-bottom: none; }
.recom-img a.act::before{ width: 88%; }
.recom-img a.act::after{ height: 88%; }
.recom-img p{ width: 74%; height: 30px; line-height: 30px; text-align: center;font-size: 14px; font-weight: bold; color: #fff; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
.recom-tab li{ top: 0; left: 0; }
.recom-links{ width: 100%; padding: 10px 0; border: 1px solid #000; border-radius: 10px; margin-top: 10px; }
.recom-links a{ display: block; padding-left: 10px; line-height: 30px; font-size: 14px; border-radius: 10px; color: #408AF5; }
.recom-links a:hover{ color: #fff; background-color: #408AF5; }
/* Goods top */
.gds-top{ width: 100%; }
.gds-top:after{ display: block; content: ""; width: 100%; height: 1px; border-bottom: 1px solid #011935; visibility: visible; }
.gds-top li{ height: 45px; padding-right: 20px; margin-bottom: -1px;}
.gds-top li>a{ width: 100%; height: 45px; line-height: 45px; font-weight: bold; padding: 0 6px; font-size: 16px; color: #000; border-bottom: 2px solid #011935; }
.gds-top li>a:hover{ border-bottom-color: #408AF5; }
.gds-top li>a.act{ border-bottom-color: #000; background-color: #00343F; color: #fff; 
background: -webkit-gradient(linear, 0 0, 0 100%,  from(#408af5), to(#3269c8));}
/* Goods list */
.gds-brand-wrap{ padding: 10px; top: 0; left: 0; }
.gds-brand-wrap li{ height: 320px; padding: 4px; }
.gds-brand-wrap li.two{ height: 290px; }
.gds-brand-col{ width: 100%; height: 100%; background-color: #fff; border:  2px solid #fff; overflow: hidden; }
.gds-brand-col:hover{ border-color: #011935; }
.gds-brand-hov{ max-height: 374px; padding: 0 20px; }
.gds-brand-hov.two{ max-height: 290px; }
.gds-brand-img{ width: 100%; min-height: 126px; margin-bottom: 14px; overflow: hidden; }
.gds-brand-img.two{ margin-bottom: 0; }
.gds-brand-img img{ max-width: 100%; max-height: 160px; margin: auto; top: 0; left: 0; bottom: 0; right: 0; }
.gds-brand-btn{ width: 80px; height: 60px; opacity: 0; margin: auto; top: 0; left: 0; bottom: 0; right: 0; }
.gds-brand-btn a{ float: left; width: 40px; height: 40px; line-height: 40px; color: #FFF; font-weight: bold; overflow: hidden; text-transform: uppercase; }
.gds-brand-btn .gds-more-btn{ background-color: #011935; background: -webkit-gradient(linear, 0 0, 0 100%, from(#82a6f5), to(#011935)); -webkit-transform: translateX(-20px); transform: translateX(-20px); }
.gds-brand-btn .gds-add-btn{ background-color: #37C6C0; background: -webkit-gradient(linear, 0 0, 0 100%, from(#37C6C0), to(#046561)); -webkit-transform: translateX(20px); transform: translateX(20px); }
.gds-brand-btn .gb-icon,.gds-brand-btn span{ 
			-webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -ms-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s;
}
.gds-brand-btn .gb-icon{ color: #fff; font-size: 20px; top: 8px; left: -74px; 
transform: translateX(84px);}
.gds-brand-btn span{ width: 100%; height: 100%; opacity: 1; }
.gds-brand-des1,.gds-brand-des2,.gds-brand-des3{ width: 100%; text-align: center; font-size: 16px; }
.gds-brand-des1{ height: 20px; line-height: 20px; color: #82A6F5; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gds-brand-des2{ height: 22px; line-height: 22px; color: #444; font-weight: bold; text-transform: uppercase; z-index: 1; }
.g-b-dn{ width: 100%; height: 60px; line-height: 20px; margin-top: 20px; text-align: center; cursor: default; overflow: hidden; }
.g-b-dn.two{ height: 40px; margin-top: 0; }
.gds-brand-pri{ width: 100%; text-align: center;line-height: 20px; }
.gds-brand-pri span:first-child{ color: #F44336; font-size: 12px;  }
.gds-brand-pri span:nth-child(2){ margin-left: 4px; color: #757575; }
/* Goods Big List */
.gds-big{ height: 574px; background-color: #fff; margin-top: 12px; overflow: hidden; }
.gds-big>.gds-big-inner{ height: 100%; }
.gds-big>.gds-big-inner>li{ width: 100%; top: 0; left: 0; padding: 10px; display: none; }
.gds-big-des{ display: block; font-size: 1px; font-weight: bold; line-height: 26px; }
.gds-big-des2{ display: block; width: 100%; height: 40px; line-height: 20px; overflow: hidden; }
.gds-big-prev,.gds-big-next{ position: absolute; width: 40px; height: 40px; line-height: 40px; font-size: 20px; text-align: center; top: 180px; }
.gds-big-prev{ left: 0; }
.gds-big-next{ right: 0; }
.gds-big-dot{ width: 100%; line-height: 26px; text-align: center; position: absolute; top: 274px; left: 0; }
.gds-big-dot li{ display: inline-block; width: 8px; height: 8px; border-radius: 8px; background-color: #82a6f5; cursor: pointer;
-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.gds-big-dot li.act{ width: 20px; }
.gds-big-des3{ line-height: 26px; }
.gds-big-img{ width: 100%; height: 300px; display: block; text-align: center; padding-bottom: 40px; }
.gds-big-img img{ max-width: 100%; }
.gds-big-buy{ padding-bottom: 20px; border-bottom: 1px solid #ddd; }
.gds-big-buy em{ width: calc( 100% - 174px ); }
.gds-big-buy span{ font-size: 18px; font-weight: bold; }
.gds-big-buy s{ font-size: 12px; }
.gds-big-buy .gds-buy-btn{ width: 124px; height: 40px; line-height: 40px; text-align: center; font-size: 18px; color: #37C6C0; border: 1px solid #37C6C0; }
.gds-big-buy .gds-buy-btn:hover{ background-color: #37C6C0; color: #82A6F5; }
.gds-big-more{ display: block; width: 124px; height: 40px; line-height: 40px; text-align: center; margin: 0 auto; }
/* Footer */
#footer{     width: 100%;
    padding-top: 10px;
    border-top: 10px solid #FF9800;
    background-color: #011935;
    color:#fff}
    #footer a {color:#999}
.f-envelope{ margin-top: 20px; }
.f-envelope .f-lt:first-child{ padding: 20px; }
.f-envelope .f-lt:last-child{ width: calc( 100% - 65px); }
.f-envelope p{ line-height: 26px; color: #999; }
.f-envelope a{ font-size: 16px; color: #333; }
.blog-link{ padding: 20px; }
.blog-link li{ padding-right: 10px; }
.f-search,.f-sch-bar{ width: 100%; padding-left: 20px; }
.f-search dt,.f-sch-bar dt{ padding: 0 0 20px; font-size: 16px; color: #fff; }
.f-search dd,.f-sch-bar p{ padding: 5px 0; }
.f-img img{ padding: 10px 10px 0 0; }
.footer-bottom{ width: 100%; height: 35px; background-color: #1428a3;; line-height: 35px; color: #83b0f1; text-align: center; margin-top: 5px; }
/* --------- Public --------- */
/* IMG ROLL */
#myimgroll,#myimgroll2{ position: relative; margin-top: 10px; }
.imgroll-wrap{ width: 100%; overflow: hidden; position: relative;}
.imgroll{ position: relative; }
.imgroll li{ width: 204px; height: 274px; margin-right: 30px; border: 1px solid #ddd; }
.btn-next,.btn-prev{ position: absolute; top: 118px; width: 30px; height: 30px; line-height: 30px; text-align: center; font-size: 18px; background-color: #fff; border: 2px solid #ddd;
transform: rotateZ(45deg);}
.btn-prev{ left: -15px; }
.btn-next{ right: -15px; }
.btn-next .glyphicon ,.btn-prev .glyphicon{ transform: rotateZ(-45deg); }
.imgroll-dot{ line-height: 30px; text-align: center; }
.imgroll-dot li{ display: inline-block; width: 8px; height: 8px; border-radius: 8px; background-color: #82a6f5; margin-right: 8px; cursor: pointer; 
-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.imgroll-dot li.act{ width: 20px; }
/* Roll List */
.rolllist{ width: 100%; padding: 0 6px; }
.rolllist-img{ height: 190px; margin: 0 -6px; }
.rolllist-img img{ width: 100%; }
.rolllist-des,.rolllist-des2{  }
.rolllist-des2{ width: 100%; max-height: 40px; line-height: 20px; overflow: hidden; }
/* Brand Roll */
.brand-border{ width: 100%; border-top: none; position: relative; margin: 0 auto; overflow: hidden; }
.brand-wrap{ width: 88%; position: relative; margin: 20px auto; overflow: hidden; }
.brand-imgroll{
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;}
.brand-imgroll li{ float: left; width: 120px; height: 62px; border: 1px solid #ddd; }
.brand-prev,.brand-next{ width: 20px; line-height: 60px; position: absolute; top: 20px; color: #000; text-align: center;}
.brand-prev{ left: 10px; }
.brand-next{ right: 10px; }
/* Bottom Block */
.block-bottom{ width: 100%; background-color: #F5F5F5; padding: 20px 0 30px; }
.bb-tit{ width: 100%; border-bottom: 1px solid #ddd; margin-bottom: 30px; }
.bb-tit a{ position: relative; display: block; padding: 15px 0; color: #000; font-size: 16px; font-weight: bold; margin-bottom: -1px; }
.bb-tit a:after{ position: absolute; bottom: 0; left: 0; content: ""; width: 74px; height: 2px; background-color: #000; }
.b-block dd{ margin-bottom: 32px; }
.b-block dd:hover .img-product{ border-color: #408AF5; }
.img-product{ width: 100px; height: 100px; line-height: 98px; border-radius: 10px; border: 2px solid transparent; background-color: #fff; margin-right: 21px; overflow: hidden; }
.info-product{ overflow: hidden; width: calc( 100% - 122px ); }
.info-product .p-name{ max-height: 48px; line-height: 24px; color: #484848; overflow: hidden; }
.info-product .p-des{ color:#f28b00; }
.info-product .p-price{ margin-top: 12px; font-size: 16px; }
/* --------- Details --------- */
/* Detail info */
.pro-details{ width: 100%; }
.viewimg{ width: 100%; border: 1px solid #ddd; margin-bottom: 20px; }
.v-img{ width: 88%; }
.smallimg{ width: 100%; position: relative; height: 100px; overflow: hidden; }
.smallimg ul{  
	-webkit-transition: all 0.3s ease-in-out;	transition: all 0.3s ease-in-out;
}
.smallimg-wrap{ width: 74px; margin-right: 4px; border: 1px solid #ddd; float: left; }
.smallimg-wrap img{ width: 100%; }
.simg-btn-wrap{ width: 50px; margin: 0 auto; }
.simg-prev,.simg-next{ display: inline-block; width: 10px; height: 12px; line-height: 8px; color: #fff; text-align: center; border-radius: 50%; background-color: #000; }
.simg-prev.act,.simg-next.act{ width: 22px; border-radius: 22px; }
.viewdetails{ width: 100%; }
.v-top{ padding: 0 0 0 20px; }
.v-top>strong{ font-size: 12px; line-height: 26px; }
.v-top h2{ font-size: 20px; font-weight:800; padding:15px 0; line-height: 24px; }
.v-link1,.v-link2{ padding: 10px; }
.v-link3{ padding-left: 10px; }
.v-mid{ width: 100%; padding-left: 20px; }
.v-table{ width: 100%; margin-bottom: 10px; }
.v-table tr:nth-child(odd){ background-color: #dce5f9; }
.v-table th,.v-table td{ border: 1px solid #ddd; padding: 7px; }
.v-table th{ width: 20%; }
.v-table td{ width: 80%; }
.v-p-b em{ font-size: 16px; color: #37C6C0; font-weight: bold; }
.v-p-b span{ color: #82A6F5; }
.v-dtit{ display: inline-block; vertical-align: top; padding-right: 20px; width: 100px; }
.v-attr4 p{ color: #666; line-height: 24px; }
.v_a4_des{ width: calc(100% - 105px); }
.gdsnum{ width: 50px; height: 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #fff; text-align: center; }
.v-minus,.v-add{ width: 20px; height: 30px; line-height: 28px; border: 1px solid #ddd; font-size: 18px; text-align: center; vertical-align: top; }
.v-minus:hover,.v-add:hover{ background-color: #37C6C0; color: #fff; }
.v-link4{ width: calc(100% - 247px); top: 10px; right: 20px; }
.addin-btn{ width: 80%; height: 42px; background-color: #011935; font-size: 18px; color: #000; margin: 30px 0; font-weight: bold; 
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFEB3B), to(#FF9800)); transition: all 0.3s ease;}
.addin-btn:hover{ background-color: #161616;  background: -webkit-gradient(linear, 0 0, 0 100%, from(#161616), to(#161616)); color: #fff; }
/* Detail other info */
.d-info-nav{ text-align: center; }
.d-info-nav li{line-height: 50px;}
.d-info-nav a{ position: relative; border-bottom: 2px solid #ddd; padding: 15px 5px; font-size: 16px; font-weight: bold; }
.d-info-nav a.act-ving{ border-color: #408AF5; color: #408AF5; position: relative;}
.d-info-nav a.act-ving:after{ position: absolute; content: ""; width: 8px; height: 4px; background-color: #408AF5; bottom: -4px; left: 50%; margin-left: -4px;  }
.d-info-nav a:hover{ border-color: #408AF5; }
.d-info-wrap,.d-info-more{ float: left; width: 100%; border: 1px solid #ddd; margin-top: -1px; padding: 50px; overflow: hidden;}
.d-info-wrap h3,.d-info-more h3{ font-size: 18px; line-height: 40px; font-weight:600;}
.d-table{ width: 100%; margin: 0 auto; }
.d-table tr,.d-table td{ line-height: 30px; vertical-align: top; padding-left: 20px; color: #333e48; }
.d-table tr{ border-bottom: 1px solid #ddd; }
.d-table tr:nth-child(even){ background-color: #dce5f9; }
.d-table td:first-child{ width: 30%; font-size: 16px; }
.d-ot-mod{ padding: 10px; }
.d-ot-mod li{ font-size: 12px; margin: 6px 14px 4px 0;}
.d-ot-mod a{ padding: 4px 12px; border-radius: 4px;     background-color: #eef2f9;
    color: #3c3b3b;}
.d-ot-mod a:hover{ background-color: #408AF5; color: #fff;}
.d-intro{ margin-left: 20px; }
.d-intro li{ list-style-type: disc; }
.d-dd{ padding-left: 12px; text-indent: -12px; line-height: 22px; }
.company{ margin: 0 -50px -50px -50px; background: #ddd; }
.company-des p{ width: 50%; padding: 0 10px; line-height: 22px; }
.d-info-img img{ width: 100%; }
.circle-wrap{ position: relative; width: 100%; height: 300px; }
.circle-inner{ width: 300px; height: 300px; position: absolute; top: 0; left: 0; }
.o-center{ position: absolute; top: 0; left: 5px; bottom: 0; margin: auto; 
-webkit-transition: all 0.3s ease; 
transition: all 0.3s ease;}
.o-circle1{ position: absolute; top: 0; bottom: 0; margin: auto; width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 50%; background-color: #fff; 
-webkit-transition: all 0.6s ease; 
transition: all 0.6s ease; -webkit-transform-origin: 50% 250%; transform-origin: 50% 250%;}
.o-circle1 .fa{ font-size: 20px; color: #000;
-webkit-transition: all 0.9s ease;
transition: all 0.9s ease;}
.o-main{ position: absolute; top: 0; bottom: 0; margin: auto; width: 60px; height: 60px; line-height: 60px; text-align: center; border-radius: 50%; background-color: #408AF5; }
.o-main .fa{ font-size: 22px; color: #fff;}
.circle-inner>p{ position: absolute; width: 174px; padding: 4px; background-color: #fff; border-radius: 6px; 
-webkit-transition: all 0.3s cubic-bezier(0.09, 0.6, 0.41, 1.49); 
transition: all 0.3s cubic-bezier(0.09, 0.6, 0.41, 1.49); opacity: 0; }
.circle-inner>p:nth-child(3){ top: 38px; left: 184px; }
.circle-inner>p:nth-child(4){ top: 125px; left: 234px; }
.circle-inner>p:nth-child(5){ top: 212px; left: 184px; }
.o-movetop{ -webkit-transform: translateY(-100px); transform: translateY(-100px); }
.o-rotate1{ -webkit-transform: rotate(30deg); transform: rotate(30deg); }
.o-rotate2{ -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.o-rotate3{ -webkit-transform: rotate(150deg); transform: rotate(150deg); }
.o-rotate1 .fa{ -webkit-transform: rotate(-30deg); transform: rotate(-30deg); }
.o-rotate2 .fa{ -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
.o-rotate3 .fa{ -webkit-transform: rotate(-150deg); transform: rotate(-150deg); }
.circle-inner>p:nth-child(3).o-p1{ left: 134px; opacity: 1;}
.circle-inner>p:nth-child(4).o-p2{ left: 184px; opacity: 1;}
.circle-inner>p:nth-child(5).o-p3{ left: 134px; opacity: 1;}
.circle-inner>p:nth-child(3).o-delay9{ -webkit-transition-delay: 0.9s; transition-delay: 0.9s; }
.circle-inner>p:nth-child(4).o-delay10{ -webkit-transition-delay: 1.0s; transition-delay: 1.0s; }
.circle-inner>p:nth-child(5).o-delay11{ -webkit-transition-delay: 1.1s; transition-delay: 1.1s; }
.circle-inner>p:nth-child(3).o-delay2{ -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
.circle-inner>p:nth-child(4).o-delay1{ -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
.o-delay3{ -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.o-delay5{ -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }
.o-delay6{ -webkit-transition-delay: 0.6s; transition-delay: 0.6s; }
.o-delay9{ -webkit-transition-delay: 0.9s; transition-delay: 0.9s; }
.o-delay11{ -webkit-transition-delay: 1.1s; transition-delay: 1.1s; }
/* --------- Classify Page --------- */
/* Page Description */
.page-describe{ height: 174px; position: relative; margin-bottom: 20px;}
.page-describe::before,.page-describe::after{ width: 0px; height: 174px; background-color: #e0e8fb; position: absolute; content: ""; z-index: -1;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;}
.page-describe::before{ top: 0; left: 0; border-left: 2px solid #000; border-radius: 6px; }
.page-describe::after{ bottom: 0; right: 0; border-right: 2px solid #000; border-radius: 6px;}
.page-describe:hover:after,.page-describe:hover:before{ width: 50%; height: 100%; }
.page-des-inner{ width: 96%; height: 74%; position: absolute; top: 0; right: 0; left: 0; bottom: 0; margin: auto; padding: 10px; border: 1px solid #ddd; }
.page-des-inner h2{ font-size: 16px; line-height: 26px; }
.page-des-inner p{ line-height: 24px; }
/* Page Description2 */
.page-describe2{ background-color: #D0E9FF;border: 24px solid #82A6F5; margin-bottom: 20px;}
.page-describe2 p{ text-indent: -10px; line-height: 24px; }
/* Goods List */
.tit-gds{ display: block; margin-left: -15px; margin-right: -15px; min-height: 50px; line-height: 40px; font-size: 16px; font-weight: bold; color: #000; border-bottom: 1px solid #011935;}
.tit-gds:after{ position: absolute; bottom: -1px; left: 0; content: ""; width: 74px; height: 2px; background-color: #000; }
.gds2-wrap{ padding-top: 20px; padding-bottom: 20px; border-bottom: 1px solid #ddd; 
-webkit-transition: all 0.3s ease; 
transition: all 0.3s ease;}
.gds2-wrap:hover{ background-color: #D0E9FF; }
.gds2-img{ padding: 4px; }
.gds2-img img{ width: 132px; }
.gds2-info{ padding: 4px; }
.gds2-text,.gds2-text2{ line-height: 22px; }
.gds2-text2{ font-weight: bold; overflow: hidden; }
.gds2-text3{ line-height: 22px; }
.gds2-stars{ font-size: 16px; color: #37C6C0; }
.gds2-pric{ padding: 4px 4px 10px; border-bottom: 1px solid #ececec; }
.gds2-pric em{ display: inline-block; width: calc( 100% - 45px ); font-size: 16px; font-weight: bold; }
.gds2-pric a{ display: inline-block; width: 40px; height: 28px; line-height: 28px; text-align: center; background-color: #ddd; }
.gds2-more{ display: block; width: 100%; text-align: center; line-height: 34px; background-color: #408af5; background: -webkit-gradient(linear, 0 0, 0 100%, from(#408af5), to(#337ab7)); color: #fff; }
.gds2-more .glyphicon{ font-size: 16px; }
/* Side Drop Down */
.side-block1{ width: 100%; border: 1px solid #fff; border-top:none }
.drop-down-tit{ display: block; width: 100%; height: 49px; line-height: 49px; padding-left: 8px; border-bottom: 1px solid #ECECEC; }
.drop-down-tit span{ display: inline-block; width: calc( 100% - 26px ); font-size: 14px; font-weight: bold; }
.drop-down-tit i{ vertical-align: top; margin-top: 20px; }
.drop-down-tit:hover{ color: #fff; }
.s-drop-down>a {
    background-color: #FF9800;
    color: #066561;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFEB3B), to(#FF9800));
}
.s-drop-down .drop-down-nav{ padding: 0 12px; overflow: hidden; width: 0; height: 0; background-color: #fff;
-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.s-last-down .drop-down-nav{ padding: 0 12px; }
.drop-down-nav li{ width: 100%; height: 49px; line-height: 49px; border-bottom: 1px solid #ececec; overflow: hidden; }
.drop-down-nav a:hover{ margin-left: 10px; color: #e6f5f; }
/* Side Brand */
.side-block2{ background-color: #055b53; }
.side-brand{     width: 100%;
    height: 45px;
    line-height: 45px;
    font-size: 18px;
    padding-left: 10px;
    font-weight: bold;
    color: #fe9a06;
    border-bottom: 1px solid #FFF;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#13504e), to(#237d78));}
.side-brand:after{ content: ""; position: absolute; left: 0; bottom: -1px; width: 74px; height: 2px; background-color: #fff; }
.s-brand-tit{ margin-top: 20px; padding-left:10px; color: #fff; font-weight: bold; font-size: 14px; text-transform: capitalize;}
.s-brand-link{ display: inline-block; width: 48%; height: 30px; line-height: 30px; padding-left: 10px; color:#ffdc30 ; }
.s-brand-link:hover{ padding-left: 10px; color: #fff; }
/* Related Recomment */
.side-block3{ width: 100%; }
.side-related{ height: 50px; line-height: 50px; font-size: 16px; font-weight: bold; border-bottom: 1px solid #011935; }
.side-related:after{ position: absolute; bottom: -1px; left: 0; content: ""; width: 74px; height: 2px; background-color: #000; }
.related-list{ border: 1px solid #011935; border-top: none; }
.related-img{ width: 96px; height: 96px; vertical-align: top; padding: 4px; }
.related-img img{ width: 100%; }
.related-info{ width: calc( 100% - 102px); padding: 4px; }
.related-info-des{ width: 100%; height: 60px; font-size: 12px; }
.related-info em{ font-size: 16px; font-weight: bold; color: #343F49; line-height: 28px;  }
.side-img{ width: 100%; margin-top: 50px; }
.side-img img{ width: 100%; }
/* --------- Page Menu --------- */
.brand-menu{ height: 176px; border-right: 1px solid #ddd; margin: 5px 0; border-radius: 4px; overflow: hidden;
-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.brand-menu:before{ position: absolute; top: -177px; left: -174px; content: ""; width: 12px; height: 300%; background-color: rgba(0,0,0,0.2); 
transform: rotateZ(60deg); }
.bm_act:before{ animation: bm_act 0.6s linear both; }
@keyframes bm_act{
	0%{ left: -174px; width: 12px; }
	50%{ left: 40%; width: 100px; }
	100%{ left: 160%; width: 12px; }
}
.bm_act2:before{ animation: bm_act_ 0.6s linear both; }
@keyframes bm_act_{
	0%{ left: 160%; width: 12px; }
	50%{ left: 40%; width: 60px; }
	100%{ left: -174px; width: 12px; }
}
.brand-menu:nth-child(odd){ border-left: 1px solid #ddd; border-bottom-right-radius: 0; border-top-right-radius: 0; }
.brand-menu dt{ height: 40px; line-height: 40px;}
.brand-menu dt a{ font-size: 14px; font-weight: bold; color: #000; padding: 4px; border-radius: 4px; }
.brand-menu dt a:hover{ background-color: #000; color: #fff; }
.brand-menu dd{ height: 26px; line-height: 26px; margin-bottom: 4px; border-radius: 4px; overflow: hidden; }
.brand-menu dd a{ padding: 5px 8px; color: #000; }
.brand-menu dd a:hover{ background-color: #408AF5; color: #fff; }
/* --------- Page price/Page gwckey/Page capacity --------- */
.link-list{ width: 100%; }
.link-list li{ margin: 6px 14px 4px 0; font-size: 12px; }
.link-list a{ padding: 4px 12px; border-radius: 4px; background-color: #eef2f9;
    color: #3c3b3b; }
.link-list a:hover{ background-color: #408AF5; color: #fff; }
.link-j2{ height: 22px; }
.dd-table{ width: 100%; }
.dd-table th,.dd-table td{ width: 40%; padding: 4px 6px; border: 1px solid #000; }
.dd-table td{ width: 60%; background-color: #dcf4f5; }
.mod-list{ margin-top: 4px;}
.mod-list a{ display: block; padding: 10px; background-color: #eee; color: #000; border-radius: 4px; }
.mod-list a:hover{ background-color: #00343F; color: #fff; }
/* --------- Side Fixed --------- */
.fixed-wrap{ position: fixed; top: 0; right: 0; width: 30px; height: 100%; padding-top: 174px; background-color: #ffeb3b; visibility: hidden; pointer-events: none; }
.fixed-inner{ pointer-events: auto; }
.fixed-inner li{ position: relative; width: 100%; height: 30px; line-height: 30px; text-align: center; }
.fixed-inner li:last-child{ margin-top: 74px; }
.fixed-inner li a{ display: block; color: #000; }
.fixed-inner li p{ position: absolute; top: 0; visibility: hidden; white-space: nowrap; opacity: 0; right: 74px; height: 26px; line-height: 26px; padding: 0 10px; border-radius: 14px; background-color: rgba(0,0,0,0.8); color: #fff;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;}
.fixed-inner li .ewm{ width: 174px; height: 174px; background-color: #ddd; }
.fixed-inner li p .glyphicon{ display: block; position: absolute;top: 7px; right: -7px; color: #2F2F2F; }
.fixed-inner li:hover{ background-color: #fff; }
.fixed-inner li:hover p{ visibility: visible; opacity: 1; right: 47px; }
@media screen and (max-width: 1199px) {
	.h-nav li>a{ font-size: 12px; }
	.gds-brand-img img{ max-width: 130px; }
	.gds-big-img img{ max-width: 260px; }}
}
@media screen and (max-width: 992px) {
	.tran-menu{ width: 574px; left: 101%; }
}
@media screen and (max-width: 991px) {
	.side-block1,.side-block2,.side-block3,.side-img{ width: 47%; float: left; }
	.side-block2,.side-img{ float: right; }
	/* Head Phone */
	.h-top-ul{ text-align: center; }
	.h-side-nav>li{ height: unset; }
	.ph-nav-btn{ display: block; }
	.h-nav,.tran-img{ display: none; height: 0; }
	.h-nav li{ float: none; display: block; }
	.h-nav li>a{ border: none; }
	.tran-menu{ position: unset; padding: 0; width: unset; height: unset; }
	.side_blk1_ph{ width: 100%; }
}
@media screen and (max-width: 767px) {
	.ad-phone{ text-align: center; }
	.gds-brand-img img{ max-width: 174px; }
	.gds2-img img{ width: 100%; }
	.fixed-wrap{ background: rgba(0,0,0,0); }
}
@media screen and (max-width: 442px) {
	.gds-brand-img img{ max-width: 118px; }
	.gds2-img,.gds2-info,.gds2-buy{ width: 100%; }
	.side-block1,.side-block2,.side-block3,.side-img{ width: 100%; float: unset; }
	.gds2-wrap{ width: 50%; border: 1px solid #ddd; max-height: 442px; }
	.gds2-text2{ height: 50px; }
	/*detail*/
	.d-info-wrap,.d-info-more{ padding: 8px; }
	.a-pay-line{ width: 100%; }
	.company{ margin: 0 -8px -8px -8px; }
	.company-des p{ width: 100%; padding: 8px; }
}