html{font-size:62.5%;}
body{font-family:Arial, Helvetica; font-size:1.6rem; color:#333333; background:#ffffff;}
h1,h2,h3,h4,h5,h6,ul,ol,li,p{margin:0; padding:0; list-style-type:none; font-size:1.6rem;}
a{color:#333333; text-decoration:none; font-size:1.6rem;}
a:hover{color:#1d2088; text-decoration:none;}
.form-input{width:100%; border:1px solid #e0e0e0; font-size:16px; color:#333; height:40px; line-height:40px; padding:5px 5px; outline:none;}
.form-area{width:100%; border:1px solid #e0e0e0; font-size:16px; color:#333; line-height:180%; padding:5px 5px; overflow:auto; outline:none;}
.form-submit{display:inline-block; background:#505050; padding:5px 30px; overflow:hidden; font-size:1.125rem; color:#fff; line-height:30px; letter-spacing:0.06em; margin:0; border:0; cursor:pointer; outline:none; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px;}
.form-submit-over{background:#333;}
.line-height{line-height:200%;}
.bg-white{background:#fff;}
.bg-white-aph{background:rgba(255,255,255,.85);}
@media (min-width:992px){
.col-lg-20{-ms-flex:0 0 20%; flex:0 0 20%; max-width:20%;}
}
.pb-6{padding-bottom:4rem !important;}
.py-6{padding-top:4rem !important; padding-bottom:4rem !important;}
.pb-7{padding-bottom:5rem !important;}
.py-7{padding-top:5rem !important; padding-bottom:5rem !important;}
.pb-8{padding-bottom:6rem !important;}
.py-8{padding-top:6rem !important; padding-bottom:6rem !important;}
.mt-6,.mt-lg-6{margin-top:4rem !important;}
.mt-7{margin-top:5rem !important;}
.max-w1300{max-width:1300px !important;}

/*screen*/
.overlay{position:fixed; top:0; left:0; bottom:0; right:0; z-index:999; opacity:0; background:rgba(0, 0, 0, 0.3); -webkit-transition:opacity 0.5s; transition:opacity 0.5s;}
.overlay.show{opacity:1;}
.screen-toggler i{font-size:1.8rem;}
.screen-toggler span{font-size:1.8rem;}
.attr-screen{width:320px; padding:0 0.5rem; background:#fff; z-index:0; position:fixed; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:column; left:0; top:0; bottom:0;}
@media (max-width: 375px){
.attr-screen{width:85%; overflow-y:scroll;}
}
@media (max-width: 414px){
.attr-screen{width:75%; overflow-y:scroll;}
}
@media (max-width: 1200px){
.attr-screen.open{left:0; opacity:1;}
.attr-screen{z-index:1000; box-shadow:0 5px 5px -3px rgb(0 0 0 / 15%); left:-80%; top:0; bottom:0; opacity:0; -webkit-transition:left 0.2s; transition:left 0.2s; position:fixed !important;}
}

.center{width:100%; max-width:94%; margin:0 auto;}
@media (min-width: 1920px){
.center{width:100%; max-width:1800px; margin:0 auto;}
}

.top{width:100%; height:40px; line-height:40px; background:#f7f7f7; color:#808080;}
.top strong{font-weight:normal;}
.top .tools{display:flex; align-items:center;}
.top .tools span{display:flex; align-items:center;}
.top .tools i{font-size:2rem; color:#1d2088;}
.top .tools a{color:#808080;}
.top .tools a:hover{color:#1d2088;}

header{display:block; position:relative; z-index:1000; width:100%;}
header .logo{margin:1rem 0; overflow:hidden;}
header .logo a{display:flex; align-items:center;}
header .logo img{display:inline-block; width:auto; height:3rem;}
header .logo strong{display:block; width:10rem; margin-left:.5rem; font-size:1.4rem; line-height:110%; text-transform:uppercase; color:#1d2088;}
header .menu-nav{display:none;}
header ul > li{padding:0 2.5rem;}
header ul > li > a.menu-link{display:block; font-size:1.6rem; text-transform:uppercase; font-weight:normal; text-align:center;}
header .search-bar{margin-left:2.5rem;}
header .search-bar i{font-size:2.2rem;}
header .menu-bar i{font-size:2.2rem;}
@media (min-width: 1200px){
header .logo img{display:inline-block; width:auto; height:6rem;}
header .logo strong{display:block; width:20rem; margin-left:1rem; font-size:2.8rem; line-height:110%; text-transform:uppercase; color:#1d2088;}
header .menu-nav{display:block;}
header ul > li{padding:0 1.3rem;}
header ul > li a.menu-link{display:block; position:relative; z-index:2; line-height:80px; font-size:1.8rem; text-transform:uppercase; font-weight:normal; text-align:center;}
header ul > li a.menu-link::before{width:0; height:.3rem; border-radius:1rem; position:absolute; bottom:1.25rem; left:50%; transform:translateX(-50%); transition:width 0.5s,left 0.5s; background:#0e4e95; content:"";}
header ul > li a.menu-link:hover{color:#1d2088;}
header ul > li:hover a.menu-link{color:#1d2088;}
header ul > li:hover a.menu-link::before{width:100%;}
header ul > li:hover .dropdown-panel{display:block !important; opacity:1; transform:translateY(0);}

.dropdown-panel{display:none; opacity:0; transform:translateY(-10px); transition:opacity 0.3s ease, transform 0.3s ease; z-index:1; width:100%; position:fixed; left:0; top:12rem; padding:2rem 0; border-top:1px solid #f2f2f2; background:#fff; box-shadow:0 4px 4px rgba(0, 0, 0, 0.2);}
.dropdown-panel a{display:block; padding:.5rem 0; line-height:200%; font-size:1.6rem; color:#666; text-transform:capitalize; text-align:center;}
.dropdown-panel a:hover{color:#1d2088;}
}
@media (min-width: 1340px){
header ul > li{padding:0 2rem;}
}
@media (min-width: 1400px){
header ul > li{padding:0 2.3rem;}
}
@media (min-width: 1500px){
header ul > li{padding:0 3rem;}
}
@media (min-width: 1600px){
header ul > li{padding:0 3.5rem;}
}

.attr-menu-nav{position:fixed; top:0; bottom:0; right:0; opacity:0; -webkit-transition:right 0.2s; transition:right 0.2s; z-index:1000; width:65%; overflow-y:scroll; background:#fff; box-shadow:0 4px 4px rgba(0, 0, 0, 0.2);}
.attr-menu-nav.open{opacity:1;}
.attr-menu-nav ul{display:flex; flex-direction:column;}
.attr-menu-nav ul > li{padding:1.3rem 1.3rem; width:100%; border-bottom:1px solid rgba(0, 0, 0, 0.1);}
.attr-menu-nav ul > li > a{display:block; font-size:1.6rem; text-transform:uppercase; font-weight:bold; text-align:left;}
.attr-menu-nav ul > li .dropdown-panel{display:none;}

footer{display:block; width:100%; background:#28295e; color:rgba(255,255,255,.5);}
footer a{color:rgba(255,255,255,.5); font-size:1.6rem;}
footer a:hover{color:rgba(255,255,255,.8);}
footer dl{margin-bottom:2rem;}
footer dl:last-child{margin-bottom:1rem;}
@media (min-width: 1200px){
footer dl{margin-bottom:0;}
}
footer dt{font-size:1.8rem; font-weight:bold; color:#fff; text-transform:uppercase; margin-bottom:1rem;}
footer dd{line-height:200%; font-size:1.6rem;}
footer dd:last-child{margin-bottom:0;}
footer dd span{display:block; color:#686987;}
footer .bottom{color:rgba(255,255,255,.5); padding:.5rem 0; font-size:1.6rem; border-top:1px solid #3e3f6e;}
footer .bottom .share a:hover i{color:rgba(255,255,255,.8);}
footer .bottom .share i{font-size:3.6rem;}
footer .bottom .share abbr{display:none;}
footer .bottom .share .facebook i{color:rgba(255,255,255,.4);}
footer .bottom .share .twitter i{color:rgba(255,255,255,.4);}
footer .bottom .share .linkedin i{color:rgba(255,255,255,.4);}

section{width:100%; overflow:hidden; margin-top:5%;}
@media (min-width: 992px){
section{width:100%; overflow:hidden; margin-top:3%;}
}

.banner{width:100%; margin:0 auto; overflow:hidden; position:relative;}
.banner img{display:block; width:100%;}
.swiper-banner{margin-left:auto; margin-right:auto; position:relative; list-style:none; padding:0; z-index:1;}
.swiper-banner{--swiper-theme-color:#fff; --swiper-navigation-color:#e60012;}
.swiper-banner .swiper-slide img{display:block; width:100%;}
.swiper-banner-pagination{text-align:center; z-index:1; position:absolute; left:50%; bottom:0.1rem; transform:translateX(-50%);}
.swiper-banner-pagination .swiper-pagination-bullet{width:10px; height:10px; display:inline-block; margin-left:5px; margin-right:5px; border-radius:100%; background:#ffffff; opacity:0.9;}
.swiper-banner-pagination .swiper-pagination-bullet-active{width:10px; opacity:1; border-radius:5px; background:#e60012;}

h4.title{width:100%; margin-bottom:1.6rem; text-align:center; font-size:2.2rem; text-transform:capitalize;}
@media (min-width: 992px){
h4.title{width:100%; margin-bottom:4rem; text-align:center; font-size:4.2rem; text-transform:capitalize;}
}

.tab-company .nav-link{padding:.5rem 1rem; background:#fff; margin-left:1.5rem; box-shadow: 0 5px 10px 1px rgba(0, 0, 0, 0.1);}
.tab-company .nav-link .iconfont{font-size:3rem; color:#b3b3b3;}
.tab-company .nav-link span{display:block; text-transform:uppercase; font-size:1.6rem;}
.tab-company .nav-link.active{background:#1d2088;}
.tab-company .nav-link.active .iconfont{color:#ffffff;}

.tab-company-title{position:relative; left:0; top:0; margin-bottom:1rem; font-size:2.2rem; text-transform:capitalize;}
@media (min-width: 992px){
.tab-company-title{position:absolute; left:0; top:-8rem; margin-bottom:0; font-size:4.2rem; text-transform:capitalize;}
}
.tab-company-profile{line-height:200%;}
.tab-company-list span{display:inline-block; color:#666;}
.tab-company-list span i{font-size:3rem;}
.more{display:block; padding:1rem 6rem; background:#1d2088; font-size:1.8rem; border-radius:2.5rem; color:#fff; text-transform:uppercase; text-align:center;}
@media (min-width: 992px){
.more{display:inline-block; padding:1rem 6rem; background:#1d2088; font-size:1.8rem; border-radius:2.5rem; color:#fff; text-transform:uppercase; text-align:center;}
}
.more:hover{background:#e60012; color:#fff;}
.more i{font-size:2rem;}

.tab-certificate-list img{display:block; width:100%;}
.factory img{display:block; width:100%;}

.whychooseus{width:100%; padding-top:3rem; padding-bottom:3rem; background-image:url(../images/whychooseus.jpg); background-position:center; background-repeat:no-repeat; background-attachment:fixed; color:#fff;}
@media (min-width: 992px){
.whychooseus{width:100%; padding-top:7rem; padding-bottom:10rem; background-image:url(../images/whychooseus.jpg); background-position:center; background-repeat:no-repeat; background-attachment:fixed; color:#fff;}
}
.whychooseus .iconfont{font-size:6rem;}
.whychooseus dl{text-align:center;}
.whychooseus dl dt span{display:block; position:relative; width:10rem; height:10rem; border-radius:100%; margin:auto; text-align:center; vertical-align:center; border:1px solid rgba(255, 255, 255, 0.2); transition:all .5s;}
@media (min-width: 992px){
.whychooseus dl dt span{display:block; position:relative; width:12rem; height:12rem; border-radius:100%; margin:auto; text-align:center; vertical-align:center; border:1px solid rgba(255, 255, 255, 0.2); transition:all .5s;}
}
.whychooseus dl dt span:before{position:absolute; left:50%; margin-left:-4px; bottom:-4px; content:''; width:8px; height:8px; background:#fff; display:inline-block; border-radius:50%;}
.whychooseus dl:hover dt span{background:#1d2088; border:1px solid #1d2088;}
.whychooseus dl dt span i{position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%,-50%); font-weight:normal;}
.whychooseus dl dd{font-family:"Times New Roman"; font-size:3.4rem; font-weight:bold; margin:0 0;}
@media (min-width: 992px){
.whychooseus dl dd{font-family:"Times New Roman"; font-size:6rem; font-weight:bold; margin:2rem 0;}
}
.whychooseus dl dd:last-child{margin:0 0; font-family:Arial, Helvetica; font-size:1.6rem; color:rgba(255,255,255,.6); font-weight:normal; margin-bottom:0;}
.whychooseus dl dd em{margin-left:1rem; font-size:3rem; font-style:normal;}

.grid.row{margin-left:-0.5rem; margin-right:-0.5rem;}
.grid li{padding-left:.5rem; padding-right:.5rem; margin-bottom:3rem;}
.grid li a{display:block; position:relative; padding:.5rem; background:#fff; width:100%; border:1px solid #ddd;}
.grid li a .pic{width:100%; height:133px; overflow:hidden; display:flex; justify-content:center;}
@media (min-width: 768px){
.grid.row{margin-left:-1rem; margin-right:-1rem;}
.grid li{padding-left:1rem; padding-right:1rem; margin-bottom:3rem;}
.grid li a{display:block; position:relative; padding:.5rem; background:#fff; width:100%;}
.grid li a .pic{width:100%; height:230px; overflow:hidden; display:flex; justify-content:center;}
}
@media (min-width: 1200px){
.grid.row{margin-left:-1.5rem; margin-right:-1.5rem;}
.grid li{padding-left:1.5rem; padding-right:1.5rem; padding-bottom:3rem; margin-bottom:3rem;}
.grid li a{display:block; position:relative; padding:1rem 1rem 4rem 1rem; background:#fff; width:100%;}
.grid li a .pic{width:100%; height:230px; overflow:hidden; display:flex; justify-content:center;}
}
.grid li a .pic img{max-width:100%; max-height:100%; -webkit-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.grid li a h3{position:absolute; bottom:-2rem; left:50%; transform:translateX(-50%); background:#fff; width:96%; height:4rem; line-height:4rem; border:1px solid #ddd; display:block; padding:0 .5rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
@media (min-width: 1200px){
.grid li a h3{position:absolute; bottom:-2rem; left:50%; transform:translateX(-50%); background:#fff; width:94%; height:5rem; line-height:5rem; border:1px solid #ddd; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
}
.grid li a:hover h3{border:1px solid #1d2088; background:#1d2088; color:#fff;}
.grid li a:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}

.article{background:#f6f6f6;}
.article a{display:block; border:1px solid #e9e9e9; background:#fff; box-shadow:0 2px 6px rgba(0, 0, 0, 0.05);}
.article a:hover{box-shadow:0 2px 10px rgba(0, 0, 0, 0.1);}
.article a:hover i{color:#1d2088;}
.article a img{display:block; width:100%;}
.article dl{display:flex; flex-flow:column; font-size:1.6rem; width:94%; margin:0 auto;}
.article dl dt{display:block; width:100%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; font-size:1.6rem; line-height:200%;}
.article dl dd{color:#999999; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden; line-height:200%;}
.article dl dd:last-child{color:#666;}
.article .article-more i{display:inline-block; animation:1.5s linear infinite; -webkit-animation:1.5s linear infinite;}
.article a:hover .article-more i{animation-name:headShake; -webkit-animation-name:headShake;}

/*Products*/
.bread-crumb{display:block; padding-left:1rem; font-size:1.6rem; line-height:50px; color:#fff; background:#1d2088;}
.bread-crumb a{display:inline-block; padding:0 0.5rem; font-size:1.6rem; color:#fff;}
.bread-category{width:100%; padding:1rem; border:3px solid #f2f2f2;}
.bread-category a.active{color:#e60012;}

.bread-category .row{margin-left:-0.5rem; margin-right:-0.5rem;}
.bread-category li{padding-left:.5rem; padding-right:.5rem; margin-bottom:.5rem;}
@media (min-width: 768px){
.bread-category .row{margin-left:-1rem; margin-right:-1rem;}
.bread-category li{padding-left:1rem; padding-right:1rem; margin-bottom:.5rem;}
}
@media (min-width: 1200px){
.bread-category .row{margin-left:-1.5rem; margin-right:-1.5rem;}
.bread-category li{padding-left:1.5rem; padding-right:1.5rem; margin-bottom:.5rem;}
}

.left{width:0;}
.right{width:100%;}
@media (min-width: 992px){
.left{width:36rem;}
.right{width:calc(100% - 3rem - 36rem);}
}

.left h5{display:block; text-align:center; font-size:2.4rem; line-height:50px; color:#fff; text-transform:uppercase; background:#1d2088;}
.left .category{width:100%; border:1px solid #dddddd; padding:2px 2px 0 2px;}
.left .category li{position:relative;}
.left .category li i{position:absolute; right:0; top:1.2rem; cursor:pointer;}
.left .category li a{display:block; width:100%; font-size:1.6rem; color:#333; padding:1rem 1rem; background:#f0f0f0; border-bottom:2px solid #ffffff;}
.left .category li a.active,.left .category li a:hover{color:#fff; background:#e60012;}
.left .category li ul{display:none;}
.left .category li ul li a{display:block; width:100%; font-size:1.6rem; color:#666; padding:1rem 1rem 1rem 2rem; border-bottom:none;}
.left .category li ul li a.active,.left .category li ul li a:hover{color:#0e4e95;}
.left .goods{border-bottom:1px dashed #e5e5e5; padding:1.5rem 0;}
.left .goods .pic{width:150px; overflow:hidden; margin-right:15px;}
.left .goods .pic img{max-width:100%; max-height:100%; -webkit-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.left .goods:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}

.left .goods h3{display:block; width:calc(100% - 150px - 15px); font-size:1.4rem; line-height:180%;}
.left .goods:last-child{border-bottom:none;}

.attr-screen h5{display:block; width:100%; text-align:center; font-size:2rem; line-height:50px; color:#fff; text-transform:uppercase; background:#1d2088;}
.attr-screen .category{width:100%; border:1px solid #dddddd; padding:2px 2px 0 2px;}
.attr-screen .category li{position:relative;}
.attr-screen .category li i{position:absolute; right:0; top:1.2rem; cursor:pointer;}
.attr-screen .category li a{display:block; width:100%; font-size:1.6rem; color:#333; padding:1rem 1rem; background:#f0f0f0; border-bottom:2px solid #ffffff;}
.attr-screen .category li a.active,.left .category li a:hover{color:#fff; background:#e60012;}
.attr-screen .category li ul{display:none;}
.attr-screen .category li ul li a{display:block; width:100%; font-size:1.6rem; color:#666; padding:1rem 1rem 1rem 2rem; border-bottom:none;}
.attr-screen .category li ul li a.active,.left .category li ul li a:hover{color:#0e4e95;}

/*goods*/
.swiper-goods{width:100%; z-index:1;}
.swiper-goods .gallery-top{width:100%; margin-bottom:15px; border:1px solid #e5e5e5; position:relative;}
.swiper-goods .gallery-top .swiper-text{position:absolute; left:5px; bottom:5px; z-index:2; font-family:Arial, "sans-serif"; font-size:12px; color:#333;}
.swiper-goods .gallery-top .swiper-slide{background-color:#fff; background-size:contain; background-position:center; background-repeat:no-repeat; padding-top:100%;}
.swiper-goods .gallery-top .swiper-slide .pic{position:absolute; left:0; top:0; z-index:3; display:block; width:100%; height:100%;}
.swiper-goods .gallery-thumbs .swiper-slide{background-color:#fff; background-size:cover; background-position:center; padding-top:18%; opacity:0.7; border:1px solid #e5e5e5; cursor:pointer;}
.swiper-goods .gallery-thumbs .swiper-slide-thumb-active{opacity:1; border:1px solid #1d2088;}
.swiper-goods .swiper-button-prev.swiper-button-black,
.swiper-goods .swiper-button-next.swiper-button-black{--swiper-navigation-color:#1d2088;}
@media (max-width: 767px){
.swiper-goods .swiper-button-prev.swiper-button-black,
.swiper-goods .swiper-button-next.swiper-button-black{--swiper-navigation-size:30px;}
}

.goods-info{width:100%;}
.goods-info h1{display:block; width:100%; font-size:2rem; padding-bottom:1rem 0; border-bottom:2px solid #e5e5e5; margin-bottom:1rem;}
.goods-info .goods-intro{padding:1rem 0; min-height:auto; font-size:1.6rem; color:#333; line-height:220%;}
.goods-info .goods-intro table{width:100%; border-collapse:collapse !important;}
.goods-info .goods-intro table td{background-color:#fff; border:1px solid #e5e5e5 !important; padding:.5rem 1rem;}
.goods-info .goods-intro table tr td:first-child{background:#fafafa !important;}
@media (min-width: 992px){
.goods-info{width:calc(100% - 60rem - 3rem);}
.goods-info h1{display:block; width:100%; font-size:2.4rem; padding:1.5rem 0; border-bottom:2px solid #e5e5e5; margin-bottom:1rem;}
.goods-info .goods-intro{padding:1rem 0; min-height:32rem; font-size:1.6rem; color:#333; line-height:220%;}
}
@media (min-width: 1200px){
.goods-picture{width:60rem;}
.goods-info{width:calc(100% - 60rem - 3rem);}
.goods-info h1{display:block; width:100%; font-size:2.4rem; padding:2rem 0; border-bottom:2px solid #e5e5e5; margin-bottom:1rem;}
.goods-info .goods-intro{padding:1rem 0; min-height:32rem; font-size:1.6rem; color:#333; line-height:220%;}
}

.tags-title{font-size:1.8rem; font-weight:bold; text-transform:uppercase;}
.tags-title i{color:#e60012;}
.tags.row{margin-left:-0.5rem; margin-right:-0.5rem;}
.tags li{padding-left:.5rem; padding-right:.5rem; margin-bottom:.5rem;}
@media (min-width: 768px){
.tags.row{margin-left:-1rem; margin-right:-1rem;}
.tags li{padding-left:1rem; padding-right:1rem; margin-bottom:1rem;}
}
@media (min-width: 1200px){
.tags.row{margin-left:-1.5rem; margin-right:-1.5rem;}
.tags li{padding-left:1.5rem; padding-right:1.5rem; margin-bottom:1rem;}
}
.tags a{display:block; border-radius:2.5rem; padding:.8rem 0; text-align:center; background:#e5e5e5; color:#333;}
.tags a:hover{background:#e60012; color:#fff;}

.detail-title{width:100%; height:50px; line-height:50px; border-bottom:2px solid #ddd; font-size:1.8rem;}
.detail-title span{display:inline-block; padding:0 1.5rem; background:#1d2088; color:#fff; text-transform:uppercase;}
@media (min-width: 992px){
.detail-title{width:100%; height:50px; line-height:50px; border-bottom:2px solid #ddd; font-size:2rem;}
}

.detail{line-height:220%; font-size:1.6rem;}
.detail p{font-size:1.6rem;}
.detail a{font-size:1.6rem; color:#1d2088;}
.detail a:hover{text-decoration:underline;}
.detail h2{font-size:1.6rem; font-weight:bold;}
.detail h3{font-size:1.4rem;}
.detail h4{font-size:1.2rem;}
.detail h5{font-size:1rem;}
.detail h6{font-size:0.8rem;}
@media (min-width: 992px){
.detail h2{font-size:2.4rem; font-weight:bold;}
.detail h3{font-size:2.2rem;}
.detail h4{font-size:2rem;}
.detail h5{font-size:1.8rem;}
.detail h6{font-size:1.6rem;}
}
.detail img{display:inline-block; max-width:100%;}
.detail table{width:100%; border-collapse:collapse !important; margin:1.5rem 0;}
.detail table td{background-color:#fff; border:1px solid #e5e5e5 !important; padding:.5rem 1rem;}

.leave-message{padding:3rem 2rem .5rem 2rem; border-left:5px solid #1d2088; background:#fff; box-shadow:0 0 10px 1px rgb(0 0 0 / 6%);}
.message-title{color:#1d2088; font-size:3rem; font-weight:bold; text-transform:uppercase;}
.message-title i{font-size:3rem; color:#1d2088; font-weight:normal;}
.message-text{color:#666; line-height:180%;}
@media (min-width: 992px){
.message-text{color:#666; line-height:250%;}
}
.message-subject{background:#f6f6f6; padding:1rem;}
.message-subject span{display:block; color:#1d2088;}
.message-subject span i{color:#1d2088;}
.message-subject strong{display:block; text-decoration:underline;}

.quotation{width:100%;}
@media (min-width: 1200px){
.quotation{width:50%;}
}
.quotation span{color:#ff0000;}
.quotation .form-group {margin-bottom:1.5rem;}
.quotation .form-control{height:calc(2.6em); padding:.375rem .75rem; font-size:1.6rem; border:1px solid #e5e5e5;}
.quotation .message{height:auto;}
.quotation .btn{padding:1rem 2.5rem; font-size:1.6rem; width:100%; text-transform:uppercase;}
.quotation .btn-submit{background:#1d2088; border-radius:2.5rem; color:#fff;}
.quotation .btn-submit:hover{background:#e60012; border-radius:2.5rem; color:#fff;}
.captcha{position:absolute; right:0; top:0;}
@media (min-width: 992px){
.quotation .btn{padding:.9rem 4rem; font-size:1.8rem; width:auto;}
}

#errors{display:none;}
#errors li{list-style:disc; margin-left:10px; color:#a94442;}

/*article view*/
.article-detail dl{width:100%; padding-bottom:3rem; border-bottom:1px solid #f0f0f0;}
.article-detail dt{font-size:1.8rem; font-weight:bold; text-align:center; line-height:180%; color:#333; padding-bottom:2rem;}
.article-detail dd.article-datetime{width:100%; padding:.5rem 1rem; border:1px dashed #d7d7d7; background:#f6f6f6; text-align:center;}
.article-detail dd.article-datetime span{color:#666;}
.article-detail dd{font-size:1.6rem; line-height:200%; color:#333;}
.article-detail dd p{font-size:1.6rem;}
.article-detail dd a{font-size:1.6rem; color:#1d2088;}
.article-detail dd a:hover{text-decoration:underline;}
.article-detail dd h2{font-size:1.6rem; font-weight:bold;}
.article-detail dd h3{font-size:1.4rem;}
.article-detail dd h4{font-size:1.2rem;}
.article-detail dd h5{font-size:1rem;}
.article-detail dd h6{font-size:0.8rem;}
@media (min-width: 992px){
.article-detail dt{font-size:2.6rem; font-weight:bold; text-align:center; line-height:200%; color:#333; padding-bottom:2rem;}
.article-detail dd.article-datetime{width:100%; padding:.5rem 1rem; border:1px dashed #d7d7d7; background:#f6f6f6; text-align:center;}
.article-detail dd.article-datetime span{color:#666;}
.article-detail dd{font-size:1.6rem; line-height:200%; color:#333;}
.article-detail dd p{font-size:1.6rem;}
.article-detail dd a{font-size:1.6rem; color:#1d2088;}
.article-detail dd a:hover{text-decoration:underline;}
.article-detail dd h2{font-size:2.4rem; font-weight:bold;}
.article-detail dd h3{font-size:2.2rem;}
.article-detail dd h4{font-size:2rem;}
.article-detail dd h5{font-size:1.8rem;}
.article-detail dd h6{font-size:1.6rem;}
}
.article-detail ol li{font-size:1.6rem;}
.article-detail ol li{font-size:1.6rem;}
.article-detail ol li a{font-size:1.6rem;}
.article-detail ol span{color:#999; display:inline-block; min-width:8rem; text-align:right; padding-right:1rem;}
.article-detail img{display:inline-block; max-width:100%;}

.sns-share a{margin-left:1.5rem;}
.sns-share a:hover i{color:#e60012;}
.sns-share i{font-size:3.2rem;}
.sns-share abbr{display:none;}
.sns-share .facebook i{color:rgba(51,51,51,.4);}
.sns-share .twitter i{color:rgba(51,51,51,.4);}
.sns-share .linkedin i{color:rgba(51,51,51,.4);}

/*Contact*/
.contact{width:100%; border-top:5px solid #1d2088; padding:2rem 3rem 3rem 3rem; text-align:center; background:#fff; box-shadow:0 0 10px 1px rgb(0 0 0 / 6%);}
.contact span{display:flex; justify-content:center; align-items:center; margin:0 auto 1rem auto; width:8rem; height:8rem; background:#f7f7f7; border-radius:100%;}
.contact span i{color:#1d2088; font-size:3rem;}
.contact h5{font-size:2rem; font-weight:bold; line-height:180%;}
.contact p{display:block; height:4rem; line-height:180%;}
.contact a{display:block;}
@media (min-width: 992px){
.contact{width:100%; border-top:5px solid #1d2088; padding:3rem 3rem; text-align:center; background:#fff; box-shadow:0 0 10px 1px rgb(0 0 0 / 6%);}
.contact h5{font-size:2.4rem; font-weight:bold; line-height:200%;}
.contact p{display:block; height:5rem; line-height:200%;}
}

/*About*/
.about-nav{width:96%; margin:0 auto;}
.about-nav a{display:block; position:relative; width:19rem; background:#e5e5e5; padding:1rem 2rem; border-radius:2.5rem;}
@media (min-width: 992px){
.about-nav{width:100%; margin:0 auto;}
.about-nav a{display:block; position:relative; width:15rem; background:#e5e5e5; padding:1rem 2rem; border-radius:2.5rem;}
}
.about-nav a.active,
.about-nav a:hover{background:#1d2088; color:#fff;}
.about-nav a:before{bottom:-10px; left:50%; border: solid transparent; content:""; width:0; height:0; position:absolute; pointer-events:none; border-color:rgba(255, 255, 255, 0); border-top-color:#1d2088; border-width:10px; opacity:0; filter:alpha(opacity=0); transition:all .5s; margin-left:-10px;}
.about-nav a.active:before,
.about-nav a:hover:before{opacity:1; filter:alpha(opacity=100); bottom:-20px;}

.about-crumb{display:block; border-bottom:1px solid #e5e5e5; font-size:1.6rem; line-height:40px; color:#333;}
.about-crumb a{display:inline-block; padding:0 0.5rem; font-size:1.6rem; color:#333;}

.info{font-size:1.6rem; line-height:220%;}

.gallery .pic{border-radius:5px; overflow:hidden;}
.gallery .pic img{max-width:100%; max-height:100%; -webkit-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.gallery h3{display:block; text-align:center; font-size:1.6rem; padding:1.5rem 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.gallery:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}

.search-box{display:none; position:fixed; top:0; left:0; z-index:3; width:100%; height:100%; background:rgba(0,0,0,0.8);}
.search-box .search{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:60%; max-width:500px;}
.search-box .search .search-input{position:relative; width:100%; height:50px; line-height:50px; background:none; border:none; border-bottom:1px solid #fff; color:#fff; outline:none;}
.search-box .search .search-submit{position:absolute; right:0; top:0; width:40px; height:50px; line-height:50px; text-align:center; background:none; border:none; outline:none; border-radius:100%;}
.search-box .search .search-submit i{color:#fff;}
.search-box .search .search-close{position:absolute; right:-60px; top:-60px; width:40px; line-height:50px; color:#fff; text-align:center;}

/*page*/
.page-item .page-link,.page-item span{font-size:1.6rem; display:-webkit-box; display:flex; width:3.6rem; height:3.6rem; margin:0 5px; padding:0; border-radius:4px; -webkit-box-align:center; align-items:center; -webkit-box-pack:center; justify-content:center;}
.pagination-lg .page-item .page-link,.pagination-lg .page-item span{width:4.6rem; height:4.6rem; line-height:4.6rem;}
.pagination-lg > li > span{padding:1rem 1.6rem; font-size:1.4rem; line-height:1.3333333;}
.pagination > li > a,
.pagination > li > span{position:relative; float:left; padding:6px 12px; margin-left:-1px; line-height:1.42857143; color:#000; text-decoration:none; background-color:#fff; border:1px solid #ddd;}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus{z-index:1; color:#000; background-color:#eee; border-color:#ddd;}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus{z-index:1; color:#fff; cursor:default; background-color:#1d2088; border-color:#1d2088;}
.page-item.active .page-link{z-index:3; color:#fff; background-color:#1d2088; border-color:#1d2088;}

@-webkit-keyframes headShake{
    0% {-webkit-transform: translateX(0); transform: translateX(0);}
    6.5% {-webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg);}
    18.5% {-webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg);}
    31.5% {-webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg);}
    43.5% {-webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg);}
    50% {-webkit-transform: translateX(0); transform: translateX(0);}
}

@keyframes headShake{
    0% {-webkit-transform: translateX(0); transform: translateX(0);}
    6.5% {-webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg);}
    18.5% {-webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg);}
    31.5% {-webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg);}
    43.5% {-webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg);}
    50% {-webkit-transform: translateX(0); transform: translateX(0);}
}

/*customer service*/
.gtalk{position:fixed; z-index:1; top:30%; right:-18.5rem; cursor:pointer; transition:all .3s ease;}
.gtalk ul li{width:23rem; padding:.5rem 0; color:#fff; margin-bottom:.3rem; border-radius:3rem 0 0 3rem; background:#e60012; overflow:hidden; display:flex; align-items:center;}
.gtalk ul li i{font-size:2.5rem; margin-left:1.5rem;}
.gtalk ul li a{display:block; color:rgba(255,255,255,1);}
.gtalk ul li span{display:block;}
.gtalk ul li small{display:none;}
.gtalk ul li img{display:block; width:80px;}
.gtalk ul li:hover{color:rgba(255,255,255,.7);}
.gtalk ul li:hover a{color:rgba(255,255,255,.7);}
.gtalk:hover{right:0;}
.gtalk:hover .scan-code i{align-self:start;}
.gtalk:hover .scan-code span{line-height:3.75rem;}
.gtalk:hover .scan-code small{display:block;}

/*Leave a message*/
.mini-message{position:relative; z-index:2; width:90%; margin:2rem auto;}
.mini-message .btn-message{display:flex; justify-content:center; align-items:center; cursor:pointer; width:100%; background:#e60012; border:none; line-height:4.2rem; color:#fff; font-size:1.8rem; border-radius:2.5rem;}
.mini-message .btn-message i{font-size:2rem;}
@media (min-width: 1200px){
.mini-message{position:fixed; z-index:2; width:20rem; margin:0; bottom:1rem; right:1rem;}
.mini-message .btn-message{display:flex; justify-content:center; align-items:center; cursor:pointer; width:20rem; background:#e60012; border:none; line-height:4.2rem; color:#fff; font-size:1.8rem; border-radius:2.5rem;}
.mini-message .btn-message i{font-size:2rem;}
}
.mini-message-panel{display:none; transition:all 0.3s ease-in-out; position:absolute; bottom:-1rem; right:0; width:35rem; border-radius:.5rem; background:#fff; box-shadow:0 0 10px 1px rgb(0 0 0 / 6%);}
.mini-message-panel h4{display:flex; justify-content:space-between; align-items:center;  width:100%; height:5rem; line-height:5rem; padding:0 1rem; border-radius:.5rem .5rem 0 0; background:#e60012; color:#fff; font-size:1.8rem; font-weight:normal;}
.mini-message-panel h4 a{color:#fff;}
.mini-message-panel .panel-content{width:100%; padding:.5rem 1.5rem 1.5rem 1.5rem; background:#fff;}
.mini-message-panel .panel-content-text{color:#999999; line-height:140%;}
.mini-message-panel .panel-content .form-control{height:3.8rem; font-size:1.4rem;}
.mini-message-panel .btn-submit{width:100%; border:0; padding:.85rem 0; font-size:1.6rem; text-transform:uppercase; background:#e60012; border-radius:2.5rem; color:#fff;}
.mini-message-panel .btn-submit:hover{background:#1d2088; border-radius:2.5rem; color:#fff;}

/*404*/
@media (max-width: 767px){
.nofound{width:100%; min-height:200px; background-image:url(../images/404.gif); background-repeat:no-repeat; background-position:left 30px; background-size:25%; margin:0 auto; padding:30px 0 0 0;}
.nofound h4{font-size:16px; font-weight:bold; color:#007c35; line-height:200%; border-bottom:1px solid #ddd; margin-left:90px;}
.nofound ul{margin-top:10px; margin-left:90px;}
.nofound li{list-style:upper-latin; margin-left:20px; line-height:200%; color:#999;}
.nofound li a{font-size:14px; color:#999;}
}
@media (min-width: 768px){
.nofound{width:100%; min-height:300px; background:url(../images/404.gif) no-repeat 30px 30px; margin:0 auto; padding:50px 0 0 200px;}
.nofound h4{font-size:20px; font-weight:bold; color:#007c35; line-height:200%; border-bottom:1px solid #ddd;}
.nofound ul{margin-top:10px;}
.nofound li{list-style:upper-latin; margin-left:20px; line-height:200%; color:#999;}
.nofound li a{font-size:14px; color:#999;}
}