.col-menu{margin-bottom: 10px;}
.col-menu-title{background: #2857a5 url(/components/col.menu/bar.png) no-repeat center left 13px; border-bottom: 3px solid #00a1e3; font-size: 14px; text-transform: uppercase; line-height: 32px; text-indent: 40px; color: #fff;}
.col-menu ul{list-style: none;}
.col-menu ul li{position: relative;}
.col-menu ul li a{position: relative; display: block; border-top: 1px dashed #d7d7d7; line-height: 35px; color: #2857a5; transition: all 0.25s ease 0s;}
.col-menu ul li a i{position: absolute; top: 0; left: 8px; font-size: 10px; line-height: 35px; transition: all 0.25s ease 0s;}
.col-menu ul li a:hover i{transform: translateX(3px);}
.col-menu ul li ul li a i{left: 25px;}
.col-menu > ul{border: 1px solid #d7d7d7; border-top: 0;}
.col-menu > ul > li > a{padding-left: 30px; background: url(/components/col.menu/li.jpg) no-repeat center left 12px;}
.col-menu > ul > li:first-child > a{border-top: 0;}
.col-menu > ul > li > a:hover, .col-menu > ul > li.active > a{color: #ff0410;}
.col-menu > ul > li > i{position: absolute; top: 0; right: 0; width: 35px; height: 35px; font-size: 10px; text-align: center; line-height: 35px; cursor: pointer;}
.col-menu > ul > li > i:hover, .col-menu > ul > li.active > i{color: #ff0410;}
.col-menu > ul > li > ul > li > a{padding-left: 40px; background: url(/components/col.menu/li.jpg) no-repeat center left 22px;}
.col-menu > ul > li > ul > li > a:hover, .col-menu > ul > li > ul > li.active > a{color: #ff0410;}.colnews{ margin-bottom: 10px;}
.colnews-list{border: 1px solid #d7d7d7; border-top: 0;}
.colnews-item{padding: 10px; border-bottom: 1px dashed #d7d7d7;}
.colnews-item:nth-last-child(2){border-bottom: 0;}
.colnews-img{float: left; margin-right: 10px; padding: 1px; border: 1px solid #d7d7d7;}
.colnews-name{height: 60px; overflow: hidden;}
.colnews-name a{display: block; line-height: 20px; color: #333; transition: all 0.25s ease 0s;}
.colnews-name a:hover{color: #a8d045;}.supp{margin-bottom: 10px;}
.supp-title{background: #2857a5; border-bottom: 3px solid #00a1e3; font-size: 14px; text-transform: uppercase; text-align: center; line-height: 32px; color: #fff;}
.supp-item{padding: 15px 0 10px; border: 1px solid #d7d7d7; border-top: 0; text-align: center;}
.supp-name{margin-bottom: 7px; font-family: Tahoma; font-size: 14px;}
.supp-phone{margin-bottom: 10px;}
.supp-phone a{font-family: Tahoma; font-size: 15px; font-weight: bold; color: #ff0410;}
.supp-chat{margin: 0 39px;}
.supp-chat a{float: left; display: block; margin: 0 5px;}.contact{}
.c-left{margin-bottom: 25px;}
.c-left h1{font-size: 100%; text-transform: uppercase; color: #2857a5; margin-bottom: 15px;}
.c-left ul{list-style: none; padding-left: 15px;}
.c-left ul li{margin-bottom: 5px; line-height: 20px;}
.c-left ul li:nth-child(3){max-height: 40px;}
.c-left ul li span{display: inline-block; width: 85px; vertical-align: top;}
.c-left ul li p{display: inline-block; width: calc(100% - 85px);}
.c-left ul li b{display: block;}
.c-left ul li:nth-child(2) p b{color: #2857a5;}
.c-left ul li:nth-child(3) p b{color: #ff0410;}
.c-left ul li a{color: #333;}
.c-right{margin-bottom: 20px;}
.c-right form{margin: auto;}
.c-text{margin-bottom: 20px; text-align: justify; line-height: 20px;}
.c-item{position: relative; margin-bottom: 10px;}
.c-item i{position: absolute; top: 0; bottom: 0; left: 0; display: flex; width: 40px; margin: auto; align-items: center; justify-content: center; color: #2857a5;}
.c-item input[type="text"]{text-indent: 40px;}
.c-item:nth-child(5){text-align: right;}
@media (min-width: 480px){
    .c-right form{width: calc(100% - 30px);}
}
@media (min-width: 767px){
    .c-left{float: left; width: calc(50% - 15px);}
    .c-right{float: right; width: calc(50% - 15px);}
}
@media (min-width: 970px){
    .c-left,
    .c-right{width: calc(50% - 25px);}
    .c-right form{width: calc(100% - 50px);}
}.dt-item{float: left; margin-bottom: 25px;}
.dt-wrap{padding: 10px; border: 1px solid #d7d7d7;}
.dt-img{position: relative; margin-bottom: 5px;}
.dt-img img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-height: 100%;}
.dt-name{height: 20px; overflow: hidden;}
.dt-name a{display: block; font-weight: bold; text-transform: uppercase; text-align: center; color: #2857a5;}
@media (min-width:320px){
    .dt-item{width: calc((100% - 10px) / 2); margin-right: 10px;}
    .dt-item:nth-child(2n){margin-right: 0;}
}
@media (min-width:410px){
}
@media (min-width:480px){
    .dt-item{width: calc((100% - 30px) / 2); margin-right: 30px;}
    .dt-item:nth-child(2n){margin-right: 0;}
}
@media (min-width:580px){
    .dt-item{width: calc((100% - 10px) / 3); margin-right: 05px;}
    .dt-item:nth-child(2n){margin-right: 05px;}
    .dt-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:767px){
    .dt-item{width: calc((100% - 50px) / 3); margin-right: 25px;}
    .dt-item:nth-child(2n){margin-right: 25px;}
    .dt-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:970px){
    .dt-item{width: calc((100% - 60px) / 4); margin-right: 20px;}
    .dt-item:nth-child(2n),
    .dt-item:nth-child(3n){margin-right: 20px;}
    .dt-item:nth-child(4n){margin-right: 0;}
}.product-left,
.product-right{margin-bottom: 20px;}
.product-prev{margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #d7d7d7;}
.product-prev b{line-height: 20px;}
.product-price{list-style: none; margin-bottom: 10px;}
.product-price li{line-height: 30px;}
.product-price li b{font-size: 20px; color: #ff0000;}
.product-mark{padding: 10px; background: #f8f8f8; border: 2px dashed #d7d7d7; border-radius: 10px;}
.product-tab ul{list-style: none;}
.product-tab li{display: inline-block;}
.product-tab li a{display: block; padding: 7px 10px; font-size: 15px; font-weight: bold; color: #fff; background: #1b4382;}
.product-content{padding: 10px; border: 1px solid #d7d7d7}
@media (min-width: 767px){
    .product-left{float: left; width: calc(50% - 10px);}
    .product-right{float: right; width: calc(50% - 10px);}
}.da{margin-bottom: 10px;}
.da-title{margin-bottom: 30px; background: #f8f8f8; font-family: Tahoma; font-size: 16px; font-weight: bold; text-transform: uppercase; text-align: center; line-height: 38px;}
.da-title a{position: relative; display: block; width: 215px; margin: auto; background: #f79217; color: #fff;}
.da-title a:after{content: ''; position: absolute; right: 0; bottom: -8px; left: 0; margin: auto; width: 15px; height: 8px; background: url(/components/home.duan/title.png);}
.da-item{position: relative; float: left; margin-bottom: 30px;}
.da-name{position: absolute; right: 0; bottom: 0; left: 0; margin: auto; background: rgba(27,67,130,0.7); transition: all 0.25s ease 0s}
.da-name a{display: block; padding: 5px 0; font-size: 14px; font-weight: bold; text-align: center; line-height: 20px; color: #fff; transition: all 0.25s ease 0s;}
.da-item:hover .da-name{background: rgba(27,67,130,0.9);}
@media (min-width:320px){
    .da-item{width: calc((100% - 10px)/2); margin-right: 10px;}
    .da-item:nth-child(2n){margin-right: 0;}
}
@media (min-width:580px){
    .da-item{width: calc((100% - 20px)/3);}
    .da-item:nth-child(2n){margin-right: 10px;}
    .da-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:767px){
    .da{padding: 0 20px;}
    .da-item{width: calc((100% - 60px)/3); margin-right: 30px;}
    .da-item:nth-child(2n){margin-right: 30px;}
    .da-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:970px){
    .da-item{width: calc((100% - 90px)/4);}
    .da-item:nth-child(2n),
    .da-item:nth-child(3n){margin-right: 30px;}
    .da-item:nth-child(4n){margin-right: 0;}
    
    .da-item-in{width: calc((100% - 60px)/3);}
    .da-item-in:nth-child(2n){margin-right: 30px;}
    .da-item-in:nth-child(3n){margin-right: 0;}
}.banner{position: relative; height: 360px; margin-top: 125px;}
.banner-wrap{position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; margin: auto; align-items: center; justify-content: center;}
.banner-title{font-size: 35px; text-transform: uppercase; color: #fff; text-shadow: 1px 1px 2px rgba(0,0,0,0.75);}
.banner-title-inner{font-size: 100%;}.direct{margin-bottom: 30px; padding: 10px 0; background: #f7f7f7;}
.direct ul{list-style: none;}
.direct ul li{float: left; line-height: 20px;}
.direct ul li+li:before{content: "/"; display: inline-block; margin: 0 5px;}
.direct ul li a{display: inline-block; color: #333;}
.direct ul li a i{font-size: 12px; color: #777;}
.direct ul li:nth-last-child(2){font-weight: bold; color: #339933;}
.direct ul li:nth-last-child(2) a{font-weight: bold; color: #339933;}
@media (min-width:320px){
    .direct ul li.direct-m{display: none;}
}
@media (min-width:767px){
    .direct ul li.direct-m{display: block;}
}.menu-bar{position: relative; height: 35px; margin-bottom: 5px; background: #2857a5; z-index: 100;}
.menu-icon{position: relative; float: left; width: 45px; height: 35px; text-align: center;}
.menu-icon span{display: block; width: 28px; height: 2px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background: #fff;}
.menu-icon span:after, .menu-icon span:before{display: block; width: 28px; height: 2px; background: #fff; position: absolute; content: '';}
.menu-icon span:after{bottom: -8px;}
.menu-icon span:before{top: -8px;}
.menu{float: left;}
.menu ul{list-style: none; transition: all 0.25s ease 0s;}
.menu ul li{position: relative; float: left; list-style: none; transition: all 0.25s ease 0s;}
.menu ul li a{display: block; font-size: 14px; line-height: 35px; color: #fff; transition: all 0.25s ease 0s;}
.menu > ul > li > a{background: url(/components/header.menu/li.jpg) no-repeat center left;}
.menu > ul > li:first-child > a{background: none;}
.menu > ul > li.active > a, .menu > ul > li:hover > a{color: #ffff00;}
.menu ul li ul{position: absolute; width: 215px; opacity: 0; transform-origin: 0 0;}
.menu ul li ul li{float: none;}
.menu ul li ul li a{padding: 0 7px; background: #2857a5; text-transform: none; line-height: 30px;}
.menu ul li ul li a:hover{color: #ffff00;}
.menu ul li ul{top: 100%; left: 0; transform: scale(1,0);}
.menu > ul > li:hover > ul{transform: scale(1,1); opacity: 1;}
.menu ul li ul li ul{top: 0; left: 100%; transform: scale(0,1);}
.menu ul li ul > li:hover > ul{transform: scale(1,1); opacity: 1;}
@media (min-width:320px){
    .menu{display: none;}
}
@media (min-width:970px){
    .menu{display: block;}
    .menu-display{display: none;}
    .menu ul > li > a{padding: 0 14.82px}
}
@media (min-width:1070px){
    .menu ul > li > a{padding: 0 19.82px}
}.hinhanh-item{position: relative; float: left; margin-bottom: 30px; line-height: 20px; overflow: hidden;}
.hinhanh-img{margin-bottom: 10px;}
.hinhanh-img a{position: relative; display: block; overflow: hidden;}
.hinhanh-detail{position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; padding: 40px 20px; background: rgba(0,0,0,0.125); color: #fff; opacity: 0; transition: all 0.25s ease 0s;}
.hinhanh-prev{height: 80px; overflow: hidden;}
.hinhanh-detail i{position: absolute; right: 40px; bottom: 40px; font-size: 20px; transform: translateX(-10px); opacity: 0; transition: all 0.25s ease 0s;}
.hinhanh-detail i:hover{color: #ed1c24;}
.hinhanh-name{position: relative; margin-top: 10px; height: 20px; padding-left: 15px; overflow: hidden;}
.hinhanh-name{display: block; font-size: 15px; font-weight: bold; text-transform: uppercase; text-align: center; color: #333; transition: all 0.25s ease 0s;}
.hinhanh-item:hover .hinhanh-detail{opacity: 1;}
.hinhanh-item:hover .hinhanh-detail i{transform: translateX(0); opacity: 1;}
.hinhanh-item:hover a{color: #ed1c24;}
@media (min-width:320px){
    .hinhanh-item{float: left; width: calc((100% - 10px) / 2); margin-right: 10px;}
    .hinhanh-item:nth-child(2n){margin-right: 0;}
}
@media (min-width:580px){
    .hinhanh-item{float: left; width: calc((100% - 20px) / 3); margin-right: 10px;}
    .hinhanh-item:nth-child(2n){margin-right: 10px;}
    .hinhanh-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:767px){
    .hinhanh-item{width: calc((100% - 40px) / 3); margin-right: 20px;}
    .hinhanh-item:nth-child(2n){margin-right: 20px;}
    .hinhanh-item:nth-child(3n){margin-right: 0;}
}.dtkh{padding: 10px 0;}
.dtkh-title{}
.dtkh-title a{font-size: 16px; font-weight: bold; text-transform: uppercase; line-height: 25px; color: #2857a5;}
.dtkh-item{position: relative; height: 90px;}
.dtkh-item img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-width: calc(100% - 20px); max-height: calc(100% - 20px);}.dvsl-list{padding: 20px; border: 1px solid #d7d7d7; border-top: 0;}
.dv-item{float: left; margin-bottom: 20px;}
.dv-img{margin-bottom: 15px;}
.dv-name{overflow: hidden;}
.dv-name a{display: block; font-family: Tahoma; font-weight: bold; text-align: center; color: #2857a5}
@media (min-width:320px){
    .dvsl-list{padding: 20px 10px 0;}
    .dv-item{float: left; width: calc((100% - 20px)/2); margin-right: 20px;}
    .dv-item:nth-child(2n){margin-right: 0;}
    .dv-name{height: 32px;}
}
@media (min-width:580px){
    .dv-item{width: calc((100% - 40px)/3);}
    .dv-item:nth-child(2n){margin-right: 20px;}
    .dv-item:nth-child(3n){margin-right: 0;}
    .dv-name{height: 16px;}
}
@media (min-width:767px){
    .dvsl-list{padding: 20px 20px 0;}
}
@media (min-width:1070px){
    .dv-item{width: calc((100% - 80px)/3); margin-right: 40px;}
    .dv-item:nth-child(2n){margin-right: 40px;}
    .dv-item:nth-child(3n){margin-right: 0;}
}.spnb{position: relative; margin-bottom: 20px;}
.spnb-list{padding: 15px 20px; border-top: 0;}
.spnb-more{position: absolute; right: 0; bottom: -11px; left: 0; margin: auto; font-family: Open Sans, Arial, sans-serif; font-size: 12px; text-align: center; line-height: 23px;}
.spnb-more a{display: inline-block; padding: 0 30px 0 10px; background: #00a1e3 url(/components/home.spnb/more.png) no-repeat center right 10px; border-radius: 11.5px; color: #fff; transition: all 0.25s ease 0s;}
.spnb-more a:hover{background: #ff0410 url(/components/home.spnb/more.png) no-repeat center right 10px;}
.sp-item{position: relative; margin-bottom: 25px;}
.sp-wrap{padding: 5px 5px 10px; border: 1px solid #d7d7d7; box-shadow: 0 0 3px 2px rgba(0,0,0,0.125); font-weight: bold; text-transform: uppercase; text-align: center; transition: all 0.25s ease 0s;}
.sp-wrap:hover{box-shadow: 0 0 3px 2px rgba(0,0,0,0.25);}
.sp-img{margin-bottom: 10px; font-size: 11px; font-weight: bold; text-align: center; line-height: 30px;}
.sp-img label{position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; background: #ff0410; border-radius: 50%; box-shadow: 0 0 2px 1px rgba(0,0,0,0.25); color: #fff;}
.sp-name{height: 30px; overflow: hidden;}
.sp-name a{display: block; color: #333;}
.sp-price{color: #ff0410;}
@media (min-width:320px){
    .spnb-list{padding: 15px 10px 0;}
    .sp-item{float: left; width: calc((100% - 20px)/2); margin-right: 20px;}
    .sp-item:nth-child(2n){margin-right: 0;}
}
@media (min-width:580px){
    .sp-item{width: calc((100% - 40px)/3);}
    .sp-item:nth-child(2n){margin-right: 20px;}
    .sp-item:nth-child(3n){margin-right: 0;}
}
@media (min-width:767px){
    .spnb-list{padding: 15px 20px 0; border: 1px solid #d7d7d7;}
}
@media (min-width:1070px){
    .sp-item{width: calc((100% - 80px)/3); margin-right: 40px;}
    .sp-item:nth-child(2n){margin-right: 40px;}
    .sp-item:nth-child(3n){margin-right: 0;}
}.news-item{margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px dashed #d7d7d7; line-height: 20px;}
.news-item:nth-last-child(2){border-bottom: 0;}
.news-img{box-sizing: border-box; padding: 3px; border: 1px solid #2857a5;}
.news-name{max-height: 40px; overflow: hidden; margin-bottom: 5px;}
.news-name a{display: block; color: #2857a5; transition: all 0.25s ease 0s;}
.news-name a:hover{color: #ff0410;}
.news-prev{max-height: 60px; overflow: hidden;}
.news-time{margin: 0 0 10px; color: #777;}
.news-time a{color: #777; transition: all 0.25s ease 0s;}
.news-time a:hover{color: #ff0410;}
@media (min-width:320px){
    .news-img{margin: 0 0 10px;}
}
@media (min-width:480px){
    .news-img{float: left; width: 220px; margin: 0;}
    .news-info{float: right; width: calc(100% - 230px);}
}.product-left{width: 100%; margin-bottom: 30px;}

.product-prev{margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #d7d7d7;}
.product-prev b{line-height: 20px;}

.product-string{list-style: none; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #d7d7d7;}
.product-string li{line-height: 22px;}
.product-string li b{position: relative; display: inline-block; width: 105px; vertical-align: top;}
.product-string li b:after{content: ':'; position: absolute; right: 0;}
.product-string li span{display: inline-block; width: calc(100% - 125px); padding-left: 15px;}
.product-string li:last-child b{width: auto;}
.product-string li:last-child b:after{content: '';}
.product-string li:last-child span{width: auto;}

.product-red{color: #ed1b24;}
.product-blue{color: #32a5d2;}

.product-price{list-style: none; margin-bottom: 10px;}
.product-price li{line-height: 30px;}
.product-price li b{position: relative; display: inline-block; width: 105px; vertical-align: top;}
.product-price li b:after{content: ':'; position: absolute; right: 0;}
.product-price li label{display: inline-block; width: calc(100% - 125px); padding-left: 15px; font-weight: bold; font-size: 20px; color: #ed1b24;}
.product-price li span{display: inline-block; width: calc(100% - 125px); padding-left: 15px; font-weight: bold; font-size: 14px; color: #777;}

.product-tab{margin-top: 25px; padding-top: 25px; border-top: 1px solid #d7d7d7;}
.product-tab ul{list-style: none;}
.product-tab li a{display: block; font-weight: bold; color: #fff; background: #d7d7d7; border: 1px solid #d7d7d7; border-bottom: 0;}
.product-tab li a.active{position: relative; background: #fff; color: #2857a5;}
.product-tab li a.active:after{content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background: #fff;}

.product-content{padding: 10px; border: 1px solid #d7d7d7}

@media (min-width: 320px){    
    .product-cart-add{margin-bottom: 3px;}
    .product-tab li{display: block;}
    .product-tab li a{padding: 5px 10px 7px; font-size: 15px;}
}
@media (min-width: 360px){

}
@media (min-width: 410px){
    .product-cart-add, .product-cart-go{display: inline-block; margin: 0;}
    .product-tab li{display: inline-block;}
    .product-tab li a{padding: 5px 6px 7px; font-size: 14px; border-top: 3px solid #d7d7d7;}
}
@media (min-width: 480px){
    .product-tab li a{padding: 5px 10px 7px; font-size: 15px;}
}
@media (min-width: 580px){

}
@media (min-width: 767px){
    .product-left{float: left; width: 350px; margin-bottom: 0;}
    .product-right{float: right; width: calc(100% - 375px);}
}
@media (min-width: 970px){
    .product-left{width: 400px;}
    .product-right{width: calc(100% - 430px);}
}
@media (min-width: 1170px){

}