@font-face {
    font-family: 'EssendineCapse';
    src: url('../fonts/EssendineCapse.otf');
    src: url('../fonts/EssendineCapse.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
/*----- reset -----*/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, address, em, img, strong, dl, dt, dd, ul, li, fieldset, form, label, legend {border: 0; font-family: inherit; font-size: 100%; margin: 0; outline: 0; padding: 0; }
:focus {outline: 0; }
ol,ul {list-style: none; }
img {width: auto\9; height: auto; max-width: 100%; vertical-align: middle; -ms-interpolation-mode: bicubic; }
table {border-collapse: collapse; border-spacing: 0; width: 100%; }
html,body {height: 100%; } 
/*----- common -----*/
body {background-color: #fff; color: #000; font: normal normal 100% Arial, Helvetica, sans-serif; line-height: 1.5em; font-size: .75em; }
h1,h2,h3, h4, h5, h6 {line-height: normal; font-weight: normal; }
input,select,textarea {color: #38444f; font: normal normal 1em Arial, Helvetica, sans-serif; }
input:focus,select:focus,textarea:focus,a:link,a:visited,a:hover,a:focus {outline: none; } a:link,a:visited,a:hover,a:focus {text-decoration: none; }
a:link,a:visited {color: #000; }
a:hover,a:focus {color: #43f812; }
.clear {clear: both; }
/*===================================================================*/

.bg-trans{
	-moz-transition: background, .4s ease;
	-o-transition: background, .4s ease;
	-webkit-transition: background, .4s ease;
	transition: background, .4s ease;
}

.header-top{padding: 10px 0 20px;}
.header-top h2{font: 400 24px/normal 'EssendineCapse', sans-serif; color: #073975; text-transform: uppercase;padding-top: 30px;}
.header-top p{font: 400 16px/20px 'Roboto', sans-serif; color: #073975;}
.header-top ul li{width: 50%;float: left;padding-top: 30px;}
.header-top a{font: 400 13px/20px 'Roboto', sans-serif; color: #6a6a6a; display: block;}
.header-top a.cart,
.header-top a.register{font-size: 16px;text-transform: uppercase; color: #333;margin-bottom: 5px;display: block;}
.header-top a.cart:before{width: 21px;height: 22px; content: ''; display: inline-block; background: url(../images/front/sprite.png) no-repeat -26px 0; margin-right: 10px; vertical-align: text-bottom;}
.header-top a.register:before{width: 21px;height: 22px; content: ''; display: inline-block; background: url(../images/front/sprite.png) no-repeat 0 0; margin-right: 10px; vertical-align: text-bottom;}

.header-bot{background: #073975;}
.menu li{float: left;}
.menu li a{display: block; font: 400 13px/20px 'Roboto', sans-serif; color: #a4cdff; text-transform: uppercase;padding: 17px 17px 13px;border-left: 1px solid #064692;}
.menu li.active a,
.menu li a:hover{ color: #fff;background: #3f88df;}
.search{position: relative; border-left: 1px solid #064692; border-right: 1px solid #064692;}
.search input{height: 50px;border-radius: 0; background: transparent;border: none;font: italic 400 14px/20px 'Roboto'; color: #fff;}
.search button{position: absolute; width: 16px; height: 16px; background: url(../images/front/sprite.png) no-repeat -53px 0; text-indent: -9999px;display: block;padding: 0; right: 10px; top: 18px;border: none;}

#footer{background: url(../images/front/bg-footer.png) no-repeat; color: #fff;padding-top: 60px; background-size: cover;margin-top: 60px;}
#footer h2{font: 400 20px/normal 'EssendineCapse', sans-serif; text-transform: uppercase;margin-bottom: 10px;}
#footer p{font: 400 14px/20px 'Roboto', sans-serif; margin-bottom: 50px;}
#footer p span{display: block;margin-bottom: 5px;}
#footer p span a{color: #fff;}

.mnuclose,
.smobitrigger{display: none;}


.mg-top{margin-top: 30px;}


.slider{width: 100%;overflow: hidden;position: relative;}
.rslides {position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; }
.rslides li {-webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0;text-align: center;}
.rslides li:first-child {position: relative; display: block; float: left; }
.rslides img {display: inline-block; height: auto; float: left; width: 100%; border: 0; }
a.rslides_nav{display: block; width: 22px;height: 22px; background: url(../images/front/sprite.png) no-repeat; text-indent: -9999px; position: absolute; top: 50%; margin-top: -45px;z-index: 10;
-moz-transition: background, .4s ease;
-o-transition: background, .4s ease;
-webkit-transition: background, .4s ease;
transition: background, .4s ease;}
a.rslides_nav.prev{background-position: 0 -32px; left: 0;}
a.rslides_nav.next{background-position: -24px -32px; right: 0;}
a.rslides_nav.prev:hover{background-position: 0 -54px;}
a.rslides_nav.next:hover{background-position: -24px -54px;}

h3{border-bottom: 1px solid #ececec;text-transform: uppercase;margin-bottom: 20px;}
h3 span{font: 400 18px/20px 'Roboto', sans-serif; padding-bottom: 10px; border-bottom: 3px solid #8bd145;margin-bottom: -1px;display: inline-block;}

h4{overflow: hidden;}
h4 a{font: 500 14px/20px 'Roboto', sans-serif; color: #333;}
.table_{display: table;width: 100%;height: 100%;}
.table_cell{display: table-cell;width: 100%;vertical-align: middle;}

.block-product{padding: 15px 20px 0; border: 1px solid #ececec;}
.block-product li{overflow: hidden;margin-bottom: 20px;}
.block-product li h4{height: 40px;margin-bottom: 5px;}
.block-product li a.img{float: left; width: 75px; height: 65px; margin-right: 15px;border: 1px solid #ececec;overflow: hidden;transition: border, .2s linear;}
.block-product li span{color: #ff2520;font: 400 14px/20px 'Roboto', sans-serif;}

.block-intro{}
.block-intro .detail{position: relative;}
.block-intro .txt{position: absolute;width: 100%;height: 100%;left: 0;top: 0;text-align: center;color: #fff;text-transform: uppercase;}
.block-intro .txt strong{font: 700 15px/20px 'Roboto', sans-serif;}
.block-intro .txt h4{font: 400 26px/normal 'EssendineCapse', sans-serif;padding-top: 7px;margin: 5px 0;}
.block-intro .txt a{font: 400 12px/normal 'Roboto', sans-serif;color: #fff;padding-top: 5px;border-top: 1px solid #fff; display: inline-block;transition: border, color, .2s linear;}

.product-hot{overflow: hidden;}
.product-hot ul{margin: 0 -15px;}
.product-hot ul li{float: left;width: 20%;padding: 0 15px;margin-bottom: 20px;}
.list-cate ul li a.img,
.product-hot a.img{width: 100%;height: auto;overflow: hidden; border: 1px solid #ececec; display: block; position: relative;}
.list-cate ul li a.img:before,
.product-hot a.img:before{z-index: 11;content: ''; width: 100%;height: 100%; display: none;position: absolute; left: 0;right: 0;}
.list-cate ul li a.img:hover:before,
.product-hot a.img:hover:before{display: block;background: rgba(0, 0, 0, 0.39)  url(../images/front/more-icon.png) no-repeat center;}

.list-cate ul li h4,
.product-hot h4{height: 20px;margin: 10px 0 5px;}
.list-cate ul li h4 a,
.product-hot h4 a{font-size: 14px;}
.list-cate ul li p,
.product-hot p{color: #ff2520;font: 400 14px/20px 'Roboto', sans-serif;}

.block-category{overflow: hidden;width: 100%;}
.block-category .list{width: 200px; float: left; margin-right: 30px;}
.block-category .list h5{background: #3f88df;font: 500 14px/20px 'Roboto', sans-serif; text-transform: uppercase; color: #fff;padding: 10px 20px;}
.block-category .list h5:before{content: '';width: 8px;height: 9px; display: inline-block; background: url(../images/front/sprite.png) no-repeat -51px -32px; margin-right: 10px;}
.block-category .list ul li{background: #ececec;margin-bottom: 2px; padding: 10px 20px;}
.block-category .list ul li:before{content: '';width: 7px;height: 7px; background: #666; display: inline-block; margin-right: 10px;border-radius: 100%;}
.block-category .list ul li a{font: 400 13px/20px 'Roboto', sans-serif; color: #666;}
.list-cate{overflow: hidden;}
.list-cate ul{margin: 0 -10px;}
.list-cate ul li{padding: 0 10px;width: 25%; float: left;box-sizing:border-box;margin-bottom: 10px;}
.list-cate ul li h4{margin: 5px 0 0;}

.block-news{}
.block-news ul{margin: 0 -10px; }
.block-news ul li{width: 33.333%; float: left;padding: 0 10px;}
.block-news ul li h4{margin: 10px 0 5px;}
span.date{font: 400 13px/20px 'Roboto', sans-serif; color: #9c9c9c;}
.block-product li a.img:hover,
.block-intro .txt a:hover{color: #FB2222; border-color: #FB2222;}
h4 a:hover{color: #8BD145;}
.list-cate ul li:first-child a.img:before{display: none;}
.list-cate ul li:first-child a.img{border: none;}
.block-category .list ul li:hover{background: rgba(139, 209, 69, 0.49);}
.block-category .list ul li:hover:before{background: #ff2520;}
.block-category .list ul li:hover a{color: #ff2520;}
/*==========================================================================*/

@-moz-document url-prefix() { 
	
}

@media (max-width: 1190px){
    .header-top h2{font-size: 21px;}
    .header-top p{font-size: 14px;}
    .menu li a{padding: 17px 10px 13px;}
    .block-product h3,
    .block-product li{margin-bottom: 10px;}
    .block-product li a.img{height: 60px;}
    .block-product li h4{margin-bottom: 0;}
    .block-category .list ul li{padding: 7px 20px;}
}
@media (max-width: 990px){
    .block_cart {position: absolute; top: -20px; width: auto; right: 0;}
    .block_cart ul li{width: auto;margin: 0 15px;float: none;display: inline-block;}
    .list-cate ul li:first-child,
    .block-news .col-md-5,
    .block_cart a{display: none;}
    .header-top h2{padding-top: 40px;}
    .menu li a {padding: 12px 10px 8px;font-size: 10px;}
    .search input{height: 40px;}
    .search button{top: 13px;}
    #footer{padding-top: 30px;}
    #footer p{margin-bottom: 20px;}
    #footer,
    .block-product{margin-top: 20px;}
    .block-product ul{overflow: hidden; margin: 0 -10px;}
    .block-product ul li{padding: 0 10px; width: 50%; float: left;}
    .product-hot ul li{width: 25%;}
    .block-category{margin: 0 0 20px;}
    .list-cate ul li{width: 33.33%;}
}
@media (max-width: 750px){
    a.smobitrigger {display: block;width: 32px;height:19px;overflow: hidden; padding: 5px 0; position: absolute; top: 11px; left: 15px; background: url(../images/front/line.png) no-repeat; text-indent: -9999px;}
    a.mnuclose{padding: 15px 20px; width: 100%; background: #0C284A url(../images/front/bg-close.png) no-repeat center; display: block; text-indent: -9999px;}
    .ovrActv {position: fixed; background: rgba(0, 0, 0, 0.79); width: 100%; height: 100%; z-index: 999; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; }
    .mnuopn{left: 0px !important; }
    .menu ul{margin: 0;display: none;}
    .header-bot .mobimenu {display: block;overflow-y: auto;padding: 0;width: 280px; position: fixed; height: 100%; top: 0px; left: -280px; background-color: #073975 !important;z-index: 9999}
    .header-bot .menu li{float: none;padding: 7px 10px;border-top: 1px solid #214A7B; margin: 0;}
    .header-bot .menu li a{padding: 0; border: none; color: #fff !important; font-size: 13px;background: transparent;}
    .header-bot .menu li:hover, .header-bot .menu li.active,
    .header-bot .menu li.active{background: #2360AB;}
    .block-intro .txt h4{font-size: 18px;}
    
}
@media (max-width: 680px){
    .list-cate ul li{width: 50%;margin-bottom: 10px;}
    .block-category .list ul li{padding: 10px 20px;}
}
@media (max-width: 630px){
    #footer h2,
    .header-top h2{font-size: 17px;}
    #footer p,
    .header-top p{font-size: 12px;}
    .block-intro ul li{width: 50%; margin-bottom: 20px;}
    .mg-top{margin: 0;}
    .block-intro,
    .content-top{margin-top: 20px;}
    .product-hot ul li{margin-bottom: 20px;width: 33.333%;}
    .block-product ul li,
    .block-category .list{width: 100%;float: none; margin-bottom: 20px;}
    .product-hot h4{height: 40px;}
    .block-product li h4{height: auto;}
}
@media (max-width: 500px){
    #footer h2,
    .header-top h2{font-size: 14px;}
    .block-news ul li{width: 50%;margin-bottom: 20px;}
}
@media (max-width: 420px){
    .header-top .col-md-2,
    .block-intro ul li,
    .header-top .col-md-4,
    .header-top .col-md-6{width: 100%;text-align: center;}
    .header-top .col-md-6 .text-center{display: none;}
    .header-top a.logo{display: inline-block;margin-top: 30px;}
    .header-top a.cart, .header-top a.register{font-size: 14px;}
    .header-bot .col-xs-8{width: 30%}
    .header-bot .col-xs-4{width: 70%;}
    #footer{padding: 20px 0 0;}
    #footer h2{line-height: 20px;}
    #footer .container{text-align: center;}
    .block-product li h4{height: 40px;}
    .product-hot ul li{width: 50%;}
    .block-news ul li{width: 100%;}
}