html{font-size:62.5%;}
body{font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-size:1.6rem; color:#000000; 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:#000000; text-decoration:none; font-size:1.6rem;}
a:hover{color:#fa8106; 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;}
.gray-666{color:#666666;}
@media (min-width:992px){
.size-18{font-size:1.8rem;}
}
.cursor{cursor:pointer;}

/*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:32rem; 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:-75%; top:0; bottom:0; -webkit-transition: left 0.2s ease, opacity 0.2s ease; transition: left 0.2s ease, opacity 0.2s ease;}
@media (max-width: 414px){
.attr-screen{width:75%; max-width:32rem; 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:1300px; margin:0 auto;}
}

header{display:block; position:fixed; z-index:1000; width:100%; background:rgba(0,0,0,.5);}
header .logo{margin:1rem 0; overflow:hidden;}
header .logo a{display:flex; align-items:center;}
header .logo img{display:inline-block; width:auto; height:2.4rem;}
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:capitalize; font-weight:bold; text-align:center;}
header .search-bar{margin-left:2.5rem;}
header .search-bar i{font-size:2.2rem; color:#ffffff;}
header .menu-bar i{font-size:2.2rem; color:#ffffff;}
@media (min-width: 1200px){
header .logo img{display:inline-block; width:auto; height:4.8rem;}
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; position:relative;}
header ul > li a.menu-link{display:block; position:relative; z-index:2; line-height:80px; font-size:1.8rem; color:#ffffff; text-transform:capitalize; font-weight:normal; text-align:center;}
header ul > li a.menu-link:hover{color:#fa8106;}
header ul > li:hover a.menu-link{color:#fa8106;}
header ul > li:hover a.menu-link::before{width:100%;}
header ul > li:hover .dropdown-widget{visibility:visible; opacity:1; transform:translateY(0); transition:all 0.3s ease-in-out, visibility 0s 0s;}
.dropdown-widget{visibility:hidden; opacity:0; transform:translateY(-10px); transition:all 0.3s ease-in-out, visibility 0s 0.1s; z-index:1; width:200px; position:absolute; left:50%; top:8rem; margin-left:-100px; padding:1.5rem 1.5rem 0; border-top:1px solid #f2f2f2; background:#fff; box-shadow:0 4px 4px rgba(0, 0, 0, 0.2);}
.dropdown-widget li{margin-bottom:1.5rem; text-align:center;}
.dropdown-widget::after{content: ''; position:absolute; top:-10px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:10px solid transparent; border-right: 10px solid transparent; border-bottom:10px solid #fff;}

.dropdown-panel{width:1000px; margin-left:-500px;}
.dropdown-panel li{margin-bottom:0; text-align:left;}
.dropdown-panel a{display:block; padding:.5rem 0; line-height:200%; font-size:1.6rem; color:#000000; text-transform:capitalize;}
.dropdown-panel a:hover{color:#fa8106;}
.dropdown-panel ul li ul li a{padding:0 0; line-height:200%; font-size:1.5rem; color:#666666; text-align:left;}
}
@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:-65%; opacity:0; -webkit-transition: right 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s cubic-bezier(0.2, 0.8, 0.2, 1),box-shadow 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
    transition: right 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s cubic-bezier(0.2, 0.8, 0.2, 1),box-shadow 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); z-index:1000; width:65%; max-width:23rem; overflow-y:scroll; background:#fff; box-shadow:0 2px 2px rgba(0, 0, 0, 0.1);}
.attr-menu-nav.open{opacity:1; right:0; box-shadow:0 4px 12px rgba(0, 0, 0, 0.2);}
.attr-menu-nav ul{display:flex; flex-direction:column;}
.attr-menu-nav ul > li{width:100%; padding:1rem 1.5rem; 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 !important;}
.attr-menu-nav ul > li .dropdown-panel{width:100%; margin-left:0;}
.attr-menu-nav ul li li{width:100%; padding:0.5rem 1.5rem; border-bottom:none;}
.attr-menu-nav ul li li a{display:block; font-size:1.4rem; text-transform:uppercase; font-weight:normal; text-align:left; color:#666666;}
.attr-menu-nav ul li li li a{display:block; position:relative; padding-left:1rem; font-size:1.4rem; text-transform:uppercase; font-weight:normal; text-align:left; color:#999999;}
.attr-menu-nav ul li li li a:before{position:absolute; left:0; top:8px; content:''; width:3px; height:3px; background:#999999;}

footer{display:block; width:100%; background:#000000; color:rgba(255,255,255,1);}
footer a{color:rgba(255,255,255,1); font-size:1.6rem;}
footer a:hover{color:rgba(250,129,6,1);}
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:#bfbfc9; 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:rgba(255,255,255,.4);}
footer .bottom{color:rgba(179,179,179,1); padding:.5rem 0; font-size:1.6rem; border-top:1px solid rgba(255,255,255,.2);}
footer .bottom .share a:hover i{color:rgba(250,129,6,1);}
footer .bottom .share i{font-size:3.6rem; color:rgba(179,179,179,1);}
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:6%;}
.section-mt{margin-top:calc(6% - 1rem);}
@media (min-width: 768px){
section{width:100%; overflow:hidden; margin-top:3%;}
.section-mt{margin-top:calc(3% - 1.5rem);}
}
@media (min-width: 992px){
section{width:100%; overflow:hidden; margin-top:2.5%;}
.section-mt{margin-top:calc(2.5% - 3rem);}
}

.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:8px; height:8px; display:inline-block; margin-left:5px; margin-right:5px; border-radius:100%; transition:opacity .5s, background-color .5s, width .5s; transition-delay:.5s, .5s, 0s; background:#ffffff; opacity:0.2;}
.swiper-banner-pagination .swiper-pagination-bullet-active{width:30px; opacity:1; border-radius:5px; transition-delay:0s; background:#fa8106;}

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

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

.exhibit.row{margin-left:-0.5rem; margin-right:-0.5rem;}
.exhibit > [class*="col-"]{padding-left:.5rem; padding-right:.5rem;}
@media (min-width: 768px){
.exhibit.row{margin-left:-1rem; margin-right:-1rem;}
.exhibit > [class*="col-"]{padding-left:1rem; padding-right:1rem;}
}
@media (min-width: 1200px){
.exhibit.row{margin-left:-1.5rem; margin-right:-1.5rem;}
.exhibit > [class*="col-"]{padding-left:1.5rem; padding-right:1.5rem;}
}
.exhibit-card,
.exhibit a{display:block; position:relative; width:100%;}
.exhibit-card .pic,
.exhibit a .pic{width:100%; overflow:hidden; display:flex; justify-content:center;}
.exhibit-card .pic img,
.exhibit a .pic img{max-width:100%; max-height:100%; -webkit-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.exhibit-card h3,
.exhibit a h3{position:absolute; bottom:0; left:50%; transform:translateX(-50%); background:rgba(0,0,0,.4); width:100%; height:3rem; line-height:3rem; display:block; padding:0 .5rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; color:#ffffff; text-align:center;}
@media (min-width: 768px){
.exhibit-card h3,
.exhibit a h3{position:absolute; bottom:0; left:50%; transform:translateX(-50%); background:rgba(0,0,0,.4); width:100%; height:4rem; line-height:4rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; color:#ffffff; text-align:center;}
}
@media (min-width: 1200px){
.exhibit-card h3,
.exhibit a h3{position:absolute; bottom:0; left:50%; transform:translateX(-50%); background:rgba(0,0,0,.4); width:100%; height:5rem; line-height:5rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; color:#ffffff; text-align:center;}
}
.exhibit-card:hover img,
.exhibit a:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}
.exhibit-card:hover h3,
.exhibit a:hover h3{background:#000000; color:#ffffff;}

.grid.row{margin-left:-0.5rem; margin-right:-0.5rem;}
.grid li{padding-left:.5rem; padding-right:.5rem;}
.grid li a{display:flex; flex-direction:column; position:relative; padding:.5rem .5rem 0 .5rem; width:100%; height:100%; border-radius:1rem; border:1px solid #ddd;}
.grid li a .pic{width:100%; overflow:hidden; display:flex; justify-content:center; align-items:center; flex:1;}
@media (min-width: 768px){
.grid.row{margin-left:-1rem; margin-right:-1rem;}
.grid li{padding-left:1rem; padding-right:1rem;}
.grid li a{display:flex; position:relative; padding:.5rem .5rem 0 .5rem; width:100%;}
.grid li a .pic{width:100%; overflow:hidden; display:flex; justify-content:center; align-items: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;}
.grid li a{display:flex; position:relative; padding:1rem 1rem 0 1rem; width:100%;}
.grid li a .pic{width:100%; overflow:hidden; display:flex; justify-content:center; align-items: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{width:100%; height:3rem; line-height:3rem; display:block; padding:0 .5rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
@media (min-width: 768px){
.grid li a h3{width:100%; height:4rem; line-height:4rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
}
@media (min-width: 1200px){
.grid li a h3{width:100%; height:5rem; line-height:5rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
}
.grid li a:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}

.swiper-most-goods{width:100%; position:relative; overflow:hidden;}
.most-popular{position:relative; width:100%;}
.most-popular .swiper-button-prev{position:absolute; top:55%; left:-2rem; transform:translateY(-55%); width:4rem; height:4rem; overflow:hidden; background:rgba(0,0,0,.85); border-radius:100%;}
.most-popular .swiper-button-next{position:absolute; top:55%; right:-2rem; transform:translateY(-55%); width:4rem; height:4rem; overflow:hidden; background:rgba(0,0,0,.85); border-radius:100%;}
.most-popular .swiper-button-next:after, .most-popular .swiper-button-prev:after{font-size:1.5rem; color:#ffffff;}
.swiper-most-goods a{display:block; position:relative; padding:.5rem .5rem 0 .5rem; width:100%; border-radius:1rem; border:1px solid #ddd;}
.swiper-most-goods a .pic{width:100%; height:18rem; overflow:hidden; display:flex; justify-content:center; align-items:center;}
@media (min-width: 1200px){
.swiper-most-goods a{display:block; position:relative; padding:1rem 1rem 0 1rem; width:100%;}
.swiper-most-goods a .pic{width:100%; height:30rem; overflow:hidden; display:flex; justify-content:center;}
}
.swiper-most-goods a .pic img{max-width:100%; max-height:100%; -webkit-transition:all 300ms ease 0s; transition:all 300ms ease 0s;}
.swiper-most-goods a h3{width:100%; height:3rem; line-height:3rem; display:block; padding:0 .5rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
@media (min-width: 768px){
.swiper-most-goods a h3{width:100%; height:4rem; line-height:4rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
}
@media (min-width: 1200px){
.swiper-most-goods a h3{width:100%; height:5rem; line-height:5rem; display:block; padding:0 1rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:1.6rem; text-align:center;}
}
.swiper-most-goods a:hover img{transform:scale(1.1, 1.1); -webkit-transform:scale(1.1, 1.1);}


/*Products*/
.bread-crumb{display:block; padding-left:1rem; font-size:1.6rem; line-height:40px; background:#f6f6f6;}
@media (min-width: 1200px){
.bread-crumb{display:block; padding-left:1rem; font-size:1.6rem; line-height:50px; background:#f6f6f6;}
}
.bread-crumb a{display:inline-block; padding:0 0.5rem; font-size:1.6rem;}
.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;}
}

.subject{display:block; padding-left:1rem; font-size:1.4rem; line-height:4rem; background:#f6f6f6;}
.subject i{display:inline-block; margin-left:1rem; width:0.9rem; height:1.8rem; background:#000000; transform:skewX(-30deg);}
@media (min-width: 768px){
.subject{display:block; padding-left:1rem; font-size:1.6rem; line-height:4rem; background:#f6f6f6;}
.subject i{display:inline-block; margin-left:1rem; width:0.9rem; height:2rem; background:#000000; transform:skewX(-30deg);}
}
@media (min-width: 1200px){
.subject{display:block; padding-left:1rem; font-size:1.6rem; line-height:5rem; background:#f6f6f6;}
.subject i{display:inline-block; margin-left:1rem; width:0.9rem; height:2.2rem; background:#000000; transform:skewX(-30deg);}
}
.subject.black{background:#000000; color:#ffffff;}
.subject.black i{background:#ffffff;}
.subject strong{display:inline-block; margin-left:1.5rem; font-weight:normal;}

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

.left h5{display:block; background:#000000;}
.left h5 i{display:inline-block; margin-left:1.5rem; width:0.9rem; height:2.2rem; background:#ffffff; transform:skewX(-30deg);}
.left h5 span{display:inline-block; margin-left:1.5rem; font-size:1.6rem; line-height:50px; color:#fff; text-transform:capitalize;}
.left .category{width:100%; border:1px solid #f2f2f2; padding:0.8rem 0.8rem 0 0.8rem;}
.left .category li{position:relative; margin-bottom:2px;}
.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; padding:1rem 1rem; background:#f6f6f6;}
.left .category li a.active,.left .category li a:hover{color:#fff; background:#fa8106;}
.left .category li ul{display:block;}
.left .category li ul li{margin-bottom:0;}
.left .category li ul li a{display:block; width:100%; font-size:1.6rem; padding:1rem 1rem 1rem 2rem; background:none; border-bottom:1px solid #f6f6f6;}
.left .category li ul li a.active,.left .category li ul li a:hover{color:#ffffff;}
.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;}

.contact-us{width:100%; border:1px solid #f2f2f2; padding:0.8rem 0.8rem 0.8rem 0.8rem;}
.contact-us i{width:5rem; font-size:2.2rem; text-align:center;}
.contact-us span{width:calc(100% - 5rem);}
.contact-us samp{display:block; margin-bottom:0.5rem; color:#000000; text-transform:uppercase;}
.contact-us p{display:block; font-size:1.5rem; padding:0; color:#999999;}
.contact-us p a{color:#999999;}
.contact-us p a:hover{color:#fa8106;}

.attr-screen h5{display:block; background:#000000;}
.attr-screen h5 i{display:inline-block; margin-left:1rem; width:0.9rem; height:2.2rem; background:#ffffff; transform:skewX(-30deg);}
.attr-screen h5 span{display:inline-block; margin-left:1.5rem; font-size:1.6rem; line-height:50px; color:#fff; text-transform:capitalize;}
.attr-screen .category{width:100%; border:1px solid #dddddd; padding:0.8rem 0.8rem 0 0.8rem;}
.attr-screen .category li{position:relative; margin-bottom:2px;}
.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:none; border-bottom:1px solid #f6f6f6;}
.attr-screen .category li a.active,.left .category li a:hover{color:#ffffff; background:#fa8106;}
.attr-screen .category li ul{display:block;}
.attr-screen .category li ul li{margin-bottom:0;}
.attr-screen .category li ul li a{display:block; width:100%; font-size:1.6rem; color:#666; padding:1rem 1rem 1rem 2rem; background:none; border-bottom:1px solid #f6f6f6;}
.attr-screen .category li ul li a.active,.left .category li ul li a:hover{color:#ffffff;}

/*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:0 0;}
.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:2rem; padding:0 0;}
.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:45rem;}
.goods-info{width:calc(100% - 45rem - 3rem);}
.goods-info h1{display:block; width:100%; font-size:2rem; padding:0 0;}
.goods-info .goods-intro{padding:1rem 0; min-height:32rem; font-size:1.6rem; color:#333; line-height:220%;}
}
.more{display:block; padding:0.7rem 6rem; background:#000000; font-size:1.8rem; color:#fff; text-transform:capitalize; text-align:center; border-radius:2px;}
@media (min-width: 992px){
.more{display:inline-block; padding:1rem 6rem; background:#000000; font-size:1.8rem; color:#fff; text-transform:capitalize; text-align:center; border-radius:2px;}
}
.more:hover{background:#222222; color:#fff;}
.more i{font-size:2rem;}

.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:4.5rem; line-height:4.5rem; border-bottom:2px solid #f6f6f6; font-size:1.8rem;}
.detail-title span{display:inline-block; padding:0 2.5rem; background:#f6f6f6; color:#000000; text-transform:capitalize;}
@media (min-width: 992px){
.detail-title{width:100%; height:5rem; line-height:5rem; border-bottom:2px solid #f6f6f6; 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;}

.inquiry{padding:3rem 2rem .5rem 2rem; background:#f6f6f6; box-shadow:0 10px 10px 5px rgb(235 235 235);}

.leave-message{padding:3rem 2rem .5rem 2rem; border-left:5px solid #000000; background:#fff; box-shadow:0 0 10px 1px rgb(0 0 0 / 6%);}
.message-title{color:#000000; font-size:2.2rem; font-weight:bold; text-transform:uppercase;}
.message-title i{font-size:2.2rem; color:#000000; font-weight:normal;}
.message-text{color:#666; line-height:180%;}
@media (min-width: 992px){
.message-title{color:#000000; font-size:3rem; font-weight:bold; text-transform:uppercase;}
.message-title i{font-size:3rem; color:#000000; font-weight:normal;}
.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:.8rem 2.5rem; font-size:1.6rem; width:100%; text-transform:uppercase;}
.quotation .btn-submit{background:#000000; border-radius:2px; color:#fff;}
.quotation .btn-submit:hover{background:#222222; border-radius:2px; 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:#fa8106;}
.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 #000000; 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:#000000; 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 #000000; 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*/
.company{width:100%;}
.company .company-gallery{width:100%; margin-right:0; margin-bottom:1rem; overflow:hidden;}
.company .company-info{width:100%; font-size:1.6rem; line-height:220%;}
@media (min-width: 768px){
.company .company-gallery{float:left; width:68rem; margin-right:2rem; margin-bottom:0; overflow:hidden;}
.company .company-info{float:right; width:calc(100% - 70rem); font-size:1.6rem; line-height:220%;}
}

.swiper-company{margin-left:auto; margin-right:auto; position:relative; overflow:hidden; list-style:none; padding:0; z-index:1; --swiper-theme-color:#009561; --swiper-navigation-color:#00ff33;}
.swiper-company .swiper-slide img{display:block; width:100%;}
.swiper-company .swiper-pagination-bullet{width:8px; height:8px; display:inline-block; border-radius:100%; background:#fff; opacity:0.9;}
.swiper-company .swiper-pagination-bullet-active{opacity:1; background:#fa8106;}

.info{font-size:1.6rem; line-height:220%;}
.info h1{width:100%; text-align:center; font-size:2.2rem; margin:1.5rem 0;}

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

.category-nav{display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(160px, 1fr));}
.category-nav a{display:inline-block; width:100%; text-align:center; border-radius:1px; padding:.8rem 2rem; background:#f6f6f6;}
@media (min-width: 768px){
.category-nav a{display:inline-block; width:100%; text-align:center; border-radius:1px; padding:1rem 2rem; background:#f6f6f6;}
}
.category-nav a:hover,
.category-nav a.active{background:#000000; color:#ffffff;}
.category-nav a:first-child{margin-left:0;}

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

/*catalog*/
.nav-item{margin-left:1rem;}
.nav-item:first-child{margin-left:0;}
.nav-tabs .nav-link.active{color:#495057; background-color:#fff; border-color:#000000 #dee2e6 #fff; border-width:2px 1px 0 1px;}
.nav-tabs .nav-link{cursor:pointer; padding:.8rem 2rem;background-color:#f5f5f5; border-color:#dddddd; border-width:1px 1px 0 1px;}

.catalog .modal-header{padding:1.5rem 1.5rem; align-items:center;}
.catalog .modal-body{padding:1.5rem 1.5rem;}
.catalog .modal-title{font-size:2rem;}
.catalog label{color:#666666;}
.catalog .form-group{margin-bottom:1.5rem;}
.catalog .form-control{height:4.2rem; padding:1.5rem 1.5rem; font-size:1.5rem;}
.catalog .btn{padding:.8rem 2rem; font-size:1.8rem;}

.download i{font-size:3rem; color:#ff0000; margin-right:0.5rem;}

.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:2.8rem; height:2.8rem; margin:0 5px; padding:0; border-radius:4px; -webkit-box-align:center; align-items:center; -webkit-box-pack:center; justify-content:center;}
@media (min-width: 1200px){
.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 > 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:#000000; border-color:#000000;}
.page-item.active .page-link{z-index:3; color:#fff; background-color:#000000; border-color:#000000;}

@-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*/
.wa-chat{position:fixed; right:2rem; bottom:2rem; z-index:999;}
.wa-chat i{font-size:3rem; color:#ffffff;}
.wa-chat .circle{display:flex; align-items:center; justify-content:center; transition:left 0.3s ease; z-index:2; width:5.6rem; height:5.6rem; line-height:5.6rem; text-align:center; border-radius:100%; background:#25d366; color:#ffffff; box-shadow:4px 4px 10px rgba(0, 0, 0, 0.2);}
.wa-chat .rectangle{opacity:0; z-index:1; width:0; height:5.6rem; line-height:5.6rem; text-align:center; margin-left:-1rem;}
.wa-chat .rectangle span{display:block; margin-top:0.8rem; font-size:1.6rem; color:#ffffff; line-height:4rem; background:#25d366; border-radius:0 25px 25px 0; box-shadow:4px 4px 10px rgba(0, 0, 0, 0.2);}
.wa-chat a:hover .circle{box-shadow:none;}
.wa-chat a:hover .rectangle{opacity:1; width:10rem;}

/*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;}
}