@charset "utf-8";
html{font-size:14px;}
@media (min-width:992px){
html{font-size:16px;}
}

h1,h2,h3,h4,h5,h6,ul,ol,li{margin:0; padding:0; list-style-type:none;}
body{font-family:sans-serif, Arial, Helvetica; color:#505050; background:url(../images/bg.jpg) repeat-y left top;}
a{color:#505050; text-decoration:none;}
a:hover{color:#1a1c65; 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;}

.center{width:100%; max-width:94%; margin:0 auto;}
@media (min-width: 1200px){
.center{width:100%; max-width:1170px; margin:0 auto;}
}
@media (min-width: 1300px){
.center{width:1260px; max-width:1260px; margin:0 auto;}
}

header{display:block; position:fixed; top:0; z-index:100; width:100%; height:40px; background:#fff; box-shadow:0 0.1rem 0.2rem rgba(0,0,0,0.15);}
header .logo{width:150px; margin:9.125px 0; overflow:hidden;}
header .logo img{display:inline-block; width:auto; height:21.75px;}

header .menu{position:absolute; right:14px; top:0; line-height:40px;}
header .menu a{display:inline-block; color:#fff;}
header .menu a.msearch{width:36px; height:36px; overflow:hidden;}
header .menu a.msearch i{font-size:24px; color:#545454;}
header .menu a.go-menu{width:36px; height:36px; overflow:hidden;}
header .menu a.go-menu i{font-size:27px; color:#545454;}
header .menu a.go-close{width:36px; height:36px; overflow:hidden;}
header .menu a.go-close i{font-size:27px; color:#545454;}

.search-box{display:none; overflow:visible!important; background:#fff; border-bottom:1px solid #e0e0e0; border-top:1px solid #e0e0e0; width:100%; position:absolute; left:0; top:40px; z-index:999999;}
.search-form{width:260px; margin:0.5rem auto; display:flex;}
.search-form .search-input{width:calc(100% - 19px); height:35px; line-height:3.5rem; font-size:0.875rem; color:#797979; padding:0 0.5rem; border:none; border-bottom:0.1rem solid #e0e0e0; outline:none;}
.search-form p{width:19px; height:35px; overflow:hidden; padding:0; margin:0;}
.search-form p .search-submit{background:url(../images/so.png) no-repeat center; width:19px; height:35px; height:35px; overflow:hidden; margin:0; border:0; cursor:pointer; outline:none;}

.navigation{display:none; overflow:visible!important; background:#fff; border-bottom:1px solid #e0e0e0; border-top:1px solid #e0e0e0; position:absolute; width:100%; left:0; top:40px; z-index:999999; margin-top:0;}
.navigation-wrapper{}
.navigation dl{}
.navigation dl dt{line-height:40px; border-bottom:1px solid #e0e0e0; position:relative;}
.navigation dl dt a{display:block; text-align:left; font-size:1.125rem; font-weight:normal; text-indent:1rem;}
.navigation dl dt span{display:inline-block; position:absolute; right:1rem; top:25px; width:14px; height:8px; overflow:hidden; background:url(../images/drop-down.png) no-repeat left top;}
.navigation dl dt.current span{background:url(../images/drop-up.png) no-repeat left top;}
.navigation dl dd.current{background:url(../images/drop-bg.jpg) repeat-x left top; border-bottom:1px solid #e0e0e0;}

.navigation li{padding:1.5rem 0;}
.navigation li a{display:block; text-align:left; font-size:1rem; text-indent:1rem; line-height:120%;}
.navigation li a p{font-size:0.875rem; color:#999; padding:0; margin:0;}

@media (min-width: 992px){
header{display:block; position:fixed; top:0; z-index:100; width:100%; height:65px; background:#fff; box-shadow:0 0.1rem 0.2rem rgba(0,0,0,0.15);}
header .logo{width:150px; margin:15px 0; overflow:hidden;}
header .logo img{display:inline-block; width:100%; max-width:100%; height:auto;}

nav{width:730px; line-height:65px;}
nav ul.navmenu{width:100%; margin:0 auto;}
nav ul.navmenu li a.depth{display:block; padding:0 5px; color:#505050; font-size:1.125rem; text-align:center; position:relative;}
nav ul.navmenu li a.current,
nav ul.navmenu li a.depth:hover{display:block; padding:0 5px; color:#999; font-size:1.125rem; text-decoration:none;}
nav ul.navmenu li:hover i{position:absolute; z-index:2; bottom:-1px; left:0; right:0; margin:0 auto; width:18px; height:10px; overflow:hidden; line-height:normal; background-image:url(../images/arw.png); background-repeat:no-repeat; background-position:center;}

.children{display:none; position:absolute; z-index:1; left:-100px; right:0; top:65px; width:300px; padding:10px 20px 0 20px; border:1px solid #e0e0e0; margin:0 auto; line-height:normal; background:#fff; box-shadow:0 3px 5px rgba(0,0,0,0.2);}
.children ul{}
.children li{margin-bottom:10px;}
.children li a{display:block; color:#505050; font-size:1.125rem; text-align:left;}
.children li a:hover{color:#999; text-decoration:none;}
.children li p{color:#b5b5b5; padding:0; margin:5px 0; text-align:left;}

/*.children{display:none; position:absolute; z-index:1; left:0; right:0; top:65px; width:1170px; padding:10px 50px 0 50px; border:1px solid #e0e0e0; margin:0 auto; line-height:normal; background:#fff; box-shadow:0 3px 5px rgba(0,0,0,0.2);}
.children ul{}
.children li{margin-bottom:10px;}
.children li a{display:inline-table; color:#505050; font-size:1.125rem; text-align:left;}
.children li a:hover{color:#999; text-decoration:none;}
.children li p{color:#b5b5b5; padding:0; margin:5px 0; text-align:left;}

.products-dropdown{width:300px !important; left:-100px !important; padding-left:20px !important; padding-right:20px !important;}
.products-dropdown li a{display:block; color:#505050; font-size:1.125rem; text-align:left;}
.products-dropdown li a:hover{color:#999; text-decoration:none;}
*/

.search{width:250px; margin-left:40px; margin-top:15px; display:flex; justify-content:space-between;}
.search .search-input{width:calc(100% - 40px); height:35px; line-height:35px; font-size:1.125rem; color:#797979; padding:0 5px; border:none; border-bottom:1px solid #e0e0e0; outline:none;}
.search p{width:40px; height:35px; overflow:hidden; padding:0; margin:0;}
.search p .search-submit{background:url(../images/search.png) no-repeat center; width:40px; height:35px; overflow:hidden; margin:0; border:0; cursor:pointer; outline:none;}
}

@media (min-width: 1200px){
header{display:block; position:fixed; top:0; z-index:100; width:100%; height:65px; background:#fff; box-shadow:0 0.1rem 0.2rem rgba(0,0,0,0.15);}
header .logo{width:150px; margin:9px 0; overflow:hidden;}
header .logo img{display:inline-block; width:auto; height:auto;}
}

@media (min-width: 1300px){
.children{display:none; position:absolute; z-index:1; left:-100px; right:0; top:65px; width:300px; padding:10px 20px 0 20px; border:1px solid #e0e0e0; margin:0 auto; line-height:normal; background:#fff; box-shadow:0 3px 5px rgba(0,0,0,0.2);}
}

/**bottom*/
footer{display:block; width:94%; overflow:hidden; margin:0 auto;}
footer .bottom{width:100%; padding:1rem 0; font-size:1rem; border:1px solid #999; border-width:1px 0 1px 0;}
footer dl{width:100%;}
footer dl dt{font-weight:bold; text-transform:uppercase; padding-bottom:15px;}
footer dl dd{line-height:200%;}
footer dl dd a:hover{color:#505050; text-decoration:underline;}
.share{margin-top:10px;}
a.facebook{display:inline-block; width:29px; height:24px; text-indent:-9999px; overflow:hidden; background:url(../images/facebook.png) no-repeat left center;}
a.twitter{display:inline-block; margin:0 15px 0 0; width:29px; height:24px; text-indent:-9999px; overflow:hidden; background:url(../images/twitter.png) no-repeat left center;}
a.linkedin{display:inline-block; width:29px; height:24px; text-indent:-9999px; overflow:hidden; background:url(../images/linkedin.png) no-repeat left center;}
footer .copyright{width:100%; padding:10px 0; line-height:250%; color:#999; text-align:center;}
footer .copyright a{margin:0 10px; color:#999;}
@media (min-width: 1200px){
footer{display:block; width:1170px; overflow:hidden; margin:0 auto;}
}
@media (min-width: 1300px){
footer{display:block; width:1260px; overflow:hidden; margin:0 auto;}
}

/**index*/
.main{width:94%; margin:40px auto 15px auto; overflow:hidden;}
.content{width:94%; margin:40px auto 15px auto; overflow:hidden;}
@media (min-width: 1300px){
.main{width:100%; margin:65px auto 15px auto; overflow:hidden;}
.content{width:1260px; margin:65px auto 15px auto; overflow:hidden;}
}

.banner{width:100%; margin:0 auto; overflow:hidden;}

.title{width:100%; margin:0.9375rem 0; font-size:1.875rem; font-weight:normal; color:#505050; text-transform:uppercase; text-align:center; line-height:200%;}
a.more{display:inline-table; padding:0 25px 0 10px; height:1.5rem; line-height:24px; font-size:0.875rem; color:#fff; background:url(../images/more.jpg) no-repeat right top #505050; cursor:pointer;}
a.more:hover{text-decoration:none;}
.highlights td{display:block; width:100%;}
.highlights img{display:block; width:100%; margin-bottom:1rem;}
@media (min-width: 768px){
.highlights td{display:block; width:100%;}
.highlights img{display:block; width:50%; margin-bottom:0;}
}
@media (min-width: 1200px){
.highlights td{display:table-cell; width:auto;}
.highlights img{display:block; width:auto; margin-bottom:0;}
}

.grid{width:100%;}
.grid-img{width:100%; overflow:hidden; position:relative; z-index:1;}
.grid-img img{display:block; width:100%; overflow:hidden;}
.grid-img .subtitle{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:2.625rem; overflow:hidden; line-height:2.625rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}

.grid-list{width:100%;}
.goods{width:100%; overflow:hidden; position:relative; z-index:1;}
.goods a{display:block; width:100%; overflow:hidden; text-align:center; vertical-align:middle;}
.goods a img{display:block; width:100%; text-align:center; vertical-align:middle;}
.goods h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:30px; overflow:hidden; line-height:30px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}
.goods h2.over{background:rgba(0,0,0,1);}

.article{width:100%; margin-bottom:20px; overflow:hidden;}
.article .img{display:inline-block; width:100%; text-align:center; vertical-align:middle;}
.article h2{width:100%; margin-top:5px; font-size:1.125rem; font-weight:normal; color:#505050; line-height:150%;}
.article p{width:100%; padding:0; margin:5px 0 15px 0; color:#666; line-height:150%;}

@media (min-width: 768px){
.grid{width:100%;}
.grid-img{width:100%; overflow:hidden; position:relative; z-index:1;}
.grid-img img{display:block; width:100%; height:370px; overflow:hidden;}
.grid-img .subtitle{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:2.625rem; overflow:hidden; line-height:2.625rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}

.grid-list{width:100%;}
.goods{width:100%; overflow:hidden; position:relative; z-index:1;}
.goods a{display:block; width:100%; overflow:hidden; text-align:center; vertical-align:middle;}
.goods a img{display:block; width:100%; text-align:center; vertical-align:middle;}
.goods h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:30px; overflow:hidden; line-height:30px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}
.goods h2.over{background:rgba(0,0,0,1);}

.article{width:100%; margin-bottom:20px; overflow:hidden;}
.article .img{display:inline-block; width:100%; text-align:center; vertical-align:middle;}
.article h2{width:100%; height:55px; margin-top:5px; font-size:1.125rem; font-weight:normal; color:#505050; line-height:150%;}
.article p{width:100%; padding:0; margin:5px 0 15px 0; color:#666; line-height:150%;}
}

@media (min-width: 992px){
.grid{width:100%;}
.grid-img{width:100%; overflow:hidden; position:relative; z-index:1;}
.grid-img img{display:block; width:100%; height:435px; overflow:hidden;}
.grid-img .subtitle{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:2.625rem; overflow:hidden; line-height:2.625rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}

.grid-list{width:100%;}
.goods{width:100%; overflow:hidden; position:relative; z-index:1;}
.goods a{display:block; width:100%; overflow:hidden; text-align:center; vertical-align:middle;}
.goods a img{display:block; width:100%; text-align:center; vertical-align:middle;}
.goods h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:30px; overflow:hidden; line-height:30px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}
.goods h2.over{background:rgba(0,0,0,1);}

.article{width:100%; overflow:hidden;}
.article .img{display:inline-block; width:100%; text-align:center; vertical-align:middle;}
.article h2{width:100%; height:55px; margin-top:5px; font-size:1.125rem; font-weight:normal; color:#505050; line-height:150%;}
.article p{width:100%; padding:0; margin:5px 0 15px 0; color:#666; line-height:150%;}
}

@media (min-width: 1300px){
.grid{width:1260px;}
.grid-img{width:100%; position:relative; z-index:1;}
.grid-img img{display:block; width:620px; height:589px; overflow:hidden;}
.grid-img .subtitle{position:absolute; left:0; bottom:0; z-index:2; width:620px; height:2.625rem; overflow:hidden; line-height:2.625rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}

.grid-list{width:100%;}
.goods{width:100%; overflow:hidden; position:relative; z-index:1;}
.goods a{display:block; width:100%; overflow:hidden; text-align:center; vertical-align:middle;}
.goods a img{display:block; width:100%; text-align:center; vertical-align:middle;}
.goods h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:30px; overflow:hidden; line-height:30px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}
.goods h2.over{background:rgba(0,0,0,1);}

.article{width:100%; margin-bottom:20px; overflow:hidden;}
.article .img{display:inline-block; width:100%; text-align:center; vertical-align:middle;}
.article h2{width:100%; height:55px; margin-top:5px; font-size:1.125rem; font-weight:normal; color:#505050; line-height:150%;}
.article p{width:100%; padding:0; margin:5px 0 15px 0; color:#666; line-height:150%;}
}

/*position*/
.position{width:100%; margin:10px 0; font-size:0.875rem; font-weight:normal; text-align:right;}
.position a{display:inline-block; margin:0 5px; font-size:0.875rem; color:#666; font-weight:normal;}
.position a.home{background:url(../images/home.png) no-repeat left 1px; padding-left:15px;}

.subject{width:100%; margin:0 0; font-size:1.875rem; font-weight:normal; color:#505050; text-align:left; line-height:200%;}

/*products*/
.products-list{width:100%;}
.products-list-left{float:none; width:100%;}
.products-list-right{float:none; width:100%;}
@media (min-width: 992px){
.products-list-left{float:left; width:220px;}
.products-list-right{float:right; width:calc(100% - 220px - 30px);}
}

.products-sidebar{width:100%;}
.products-sidebar li{padding-left:20px; padding-top:5px; padding-bottom:5px;}
.products-sidebar > li{margin-bottom:10px;}
.products-sidebar li > a{display:flex; align-items:center; font-size:1rem; color:#666; line-height:160%;}
.products-sidebar li a.on,.products-sidebar li a:hover{color:#051383;}
.products-sidebar li a.on span{background:#051383; color:#fff;}
.products-sidebar li > a span{display:inline-block; text-align:center; width:20px; height:20px; line-height:20px; overflow:hidden; border-radius:100%; background:#e0e0e0;}
.products-sidebar li > a strong{display:inline-block; margin-left:10px; font-weight:normal;}
.products-sidebar li ul{display:none;}
.products-sidebar li ul li{padding-left:30px;}
.products-sidebar li ul li i{margin-right:10px;}
.products-sidebar li ul li a:hover i{color:#051383;}

.space.row{margin-left:-5px; margin-right:-5px;}
.space [class*="col-"]{padding-left:5px; padding-right:5px; margin-bottom:0.625rem;}
@media (min-width: 992px){
.space.row{width:100%;}
.space [class*="col-"]{padding-left:15px; padding-right:15px; margin-bottom:1.875rem;}
}

.category a{display:block; width:100%; font-size:0.875rem; line-height:2.1875rem; background:#e0e0e0; color:#333; text-align:center;}
.category a.selected,
.category a:hover{background:#505050; color:#fff; text-decoration:none;}

.products{background:#fff; position:relative; z-index:1;}
.products a{display:block; width:100%; overflow:hidden; display:flex; justify-content:center; align-items:center;}
.products h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:35px; padding:0 5px; overflow:hidden; line-height:35px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6); display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.products h2.over{background:rgba(0,0,0,1);}
@media (max-width: 767px){
.products h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:28px; padding:0 5px; overflow:hidden; line-height:28px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6); display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.products h2.over{background:rgba(0,0,0,1);}
}

/*goods*/
.goods-info-left .goods-img{width:100%; overflow:hidden; background:#fff; border:3px solid #e0e0e0; z-index:0; display:flex; justify-content:center; align-items:center;}
.goods-info-left .goods-img img{display:block; width:100%;}
.goods-info-left .goods-morepimg{width:100%;}
.goods-info-left .goods-moreimg ul{display:flex; padding:0; margin:0;}
.goods-info-left .goods-moreimg li{width:100px; height:100px; overflow:hidden; margin:10px 20px 0 0;}
.goods-info-right{width:100%;}
.goods-info-right h1{font-size:1.125rem; color:#505050; line-height:180%; font-weight:bold;}
.goods-info-right .goods-intro{margin-top:5px; width:100%; overflow:hidden; line-height:140%;}
.goods-info-right a.enquiry{display:inline-table; margin-top:10px; padding:0 25px 0 10px; height:35px; line-height:35px; font-size:14px; color:#fff; background:url(../images/more.jpg) no-repeat right center #505050; cursor:pointer;}
.goods-info-right a.enquiry:hover{text-decoration:none;}
@media (max-width:767px){
.goods-info-right a.enquiry{display:block; margin-top:10px; padding:0 0 0 0; text-align:center; height:35px; line-height:35px; font-size:0.875rem; color:#fff; background:#1a1c65; cursor:pointer;}
}

@media (min-width:992px){
.goods-info-right .goods-intro{margin-top:5px; width:100%; height:480px; overflow:hidden; line-height:140%;}
}

.products-hot{width:100%; position:relative;}
.products-hot-title{width:100%; border-bottom:2px solid #999; font-size:1.125rem; line-height:2.25rem;}
.goods-hot{width:100%; overflow:hidden; position:relative; z-index:1;}
.goods-hot a{display:block; width:100%; overflow:hidden;}
.goods-hot h2{position:absolute; left:0; bottom:0; z-index:2; width:100%; height:35px; overflow:hidden; line-height:35px; font-size:0.875rem; color:#fff; text-align:center; font-weight:normal; background:rgba(0,0,0,.6);}
.goods-hot h2.over{background:rgba(0,0,0,1);}

.picScroll-top{width:100%;}
.picScroll-top .hd{overflow:hidden; height:36px; padding:0 0; position:absolute; right:0; top:8px;}
.picScroll-top .hd .prev,.picScroll-top .hd .next{display:block; width:14px; height:7px; float:right; margin-right:8px; margin-top:12px; overflow:hidden; cursor:pointer; background:url("../images/arrow.png") 0 -100px no-repeat;}
.picScroll-top .hd .next{background-position:0 -140px;}
.picScroll-top .hd .prevStop{background-position:-60px -100px;}
.picScroll-top .hd .nextStop{background-position:-60px -140px;}
.picScroll-top .hd ul{float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1;}
.picScroll-top .hd ul li{float:left; width:12px; height:12px; overflow:hidden; margin-right:8px; text-indent:-999px; cursor:pointer; background:url("../images/icoCircle.png") 0 -9px no-repeat;}
.picScroll-top .hd ul li.on{background-position:0 0;}
.picScroll-top .bd{padding:0;}
.picScroll-top .bd ul{overflow:hidden; zoom:1;}
.picScroll-top .bd ul li{margin-top:15px; zoom:1;}

.products-detail{width:100%;}
.products-detail-title{width:100%; border-bottom:2px solid #999; font-size:1.125rem; line-height:36px; position:relative;}
.products-detail-title span{display:inline-block; padding:0 20px; border:2px solid #999; border-bottom:2px solid #fff; margin-bottom:-2px;}
.products-detail-container{width:100%; margin-top:10px; color:#666;}

.goods-swiper-container{margin:0 auto; position:relative; overflow:hidden; z-index:1;}
.goods-swiper-container .swiper-pagination-bullet{background:#ccc;}
.goods-swiper-container .swiper-pagination-bullet-active{opacity:1; background:#1a1c65;}
.goods-swiper-container .swiper-pagination-bullets{bottom:20px !important; left:0; width:100%;}

.middle-goods{display:block; width:100%; margin:1rem auto; text-align:center;}
.middle-goods img{display:block; width:100%;}

/*article view*/
dl.article_view{width:100%;}
dl.article_view dt{width:100%; text-align:center; padding-bottom:10px; line-height:200%;}
dl.article_view dt h1{color:#1d2c61; font-weight:bold; font-size:1rem;}
dl.article_view dd .subtitle{width:100%; height:1px; background:#ddd; text-align:center; position:relative; z-index:1;}
dl.article_view dd .subtitle div{position:absolute; z-index:2; display:block; top:-12px; left:0; right:0; margin:0 auto;}
dl.article_view dd .subtitle div span{padding:0 15px; font-size:0.875rem; color:#999; background:#f3f3f3;}
dl.article_view dd{width:100%; padding-top:20px; line-height:200%; font-size:0.875rem; color:#333; word-break:break-all; word-wrap:break-word;}

.prev-next{width:100%; margin:50px 0;}
.prev-next li a.button{display:inline-block; font-size:0.875rem; font-weight:normal; color:#333; line-height:35px; background:#e0e0e0; padding:0 20px; text-align:center; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px;}
.prev-next li a.button:hover{background:#505050; color:#fff; text-decoration:none;}

/*contact us*/
/*.call-us{width:1260px; margin-bottom:30px; font-size:24px; line-height:200%;}*/
.feedback{width:100%; font-size:1rem; margin:30px 0 90px 0;}
.contact-us{width:100%; font-size:1rem; line-height:250%; margin-top:65px;}
/*about us*/
.container{width:100%; font-size:1rem; line-height:140%; padding:0; margin:0;}
.container img{display:block; width:100%; margin-bottom:1rem;}
@media (min-width: 768px){
.container img{display:block; width:50%; margin-bottom:0;}
}
@media (min-width: 1200px){
.container img{display:block; width:auto; margin-bottom:0;}
}

.main-box-left{width:100%;}
.main-box-left img{display:block; width:100%; height:auto;}
.main-box-right{width:100%;}
@media (min-width: 1200px){
.main-box-left{float:left; width:565px;}
.main-box-left img{display:block; width:100%; height:auto;}
.main-box-right{float:right; width:565px;}
}
@media (min-width: 1300px){
.main-box-left{float:left; width:610px;}
.main-box-left img{display:block; width:100%; height:auto;}
.main-box-right{float:right; width:610px;}
}

.pagebar{width:100%; padding:0; margin:20px 0; text-align:center;}
.pagebar a{display:inline-table; margin:0 3px; padding:5px 14px; font-size:0.875rem; color:#333; text-decoration:none; border:1px solid #999;}
.pagebar a:hover{color:#fff; text-decoration:none; padding:5px 14px; background:#1e3278; border:1px solid #1e3278;}
.pagebar .page_now{display:inline-table; margin:0 5px; font-weight:bold; padding:5px 14px; font-size:0.8125rem; border:1px solid #1e3278; background:#1e3278; color:#fff;}

/*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;}

.attr-screen{width:320px; background:#fff; z-index:0; position:fixed; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; flex-direction:row; 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;}
}