h2.boxTitle { font-size: 45px; line-height: 110%; color: #fff; }
h2.boxTitle img { margin-right: 20px; }

#first-box{background-image:url(/images/05/index-section01-bg.jpg);background-repeat:no-repeat;background-position:50% 100%;background-size:cover;padding-bottom:60px;}
#first-box section >p{text-align:center;}
#first-box .aboutnewspro{margin-top:70px;overflow:hidden;}
#first-box .aboutnewspro #about{width:620px;float:left;}
#first-box .aboutnewspro #about .aboutus{overflow:hidden;position:relative;}
#first-box #about .aboutus .aboutcontrol{width:54%;float:left;/*height:198px;*/overflow:hidden;}
#first-box #about .aboutus .aboutimage{width:44%;float:right;height:198px;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#first-box #about .aboutus .aboutcontrol .stxt,
#first-box #newshot .stxt,
#allporduct .stxt,
#book .stxt{color:#f5d8a4;font-size:16px;font-weight:normal;letter-spacing:0.2em;margin-top:10px;overflow:hidden;}
#first-box #about .aboutus .aboutcontrol .stxt span,
#first-box #newshot .stxt span,
#allporduct .stxt span,
#book .stxt span{display:inline-block;width:100px;height:1px;background:#c0c0c0;margin-top:10px;margin-left:10px;}
#first-box #about .aboutus .aboutcontrol article{color:#ccc;font-size:12px;position:relative;margin-top:25px;line-height:200%;overflow:hidden;}
#first-box #about .aboutus .aboutcontrol article h3{height:72px;overflow:hidden;font-weight:normal;margin-bottom:20px;}
#first-box #about .aboutus .aboutcontrol .more{position:absolute;right:5px;bottom:0;line-height:12px;}
#first-box #about .aboutus .aboutcontrol .more a,
#first-box #newshot .stxt a,
#allporduct .stxt a,
#book .stxt a{color:#f5d8a4;font-size:12px;line-height:12px;}
#first-box .aboutnewspro #about .adPT{margin-top:10px;}
#first-box .aboutnewspro #about .adPT ul{height:414px;position:relative;}
#first-box .aboutnewspro #about .adPT li{position:absolute;left:0;top:0;height:200px;width:30%;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#first-box .aboutnewspro #about .adPT li a{display:block;width:100%;height:100%;}
#first-box .aboutnewspro #about .adPT li:nth-child(2){left:32%;width:22%;}
#first-box .aboutnewspro #about .adPT li:nth-child(3){left:0;top:initial;bottom:0;width:54%;height:200px;}
#first-box .aboutnewspro #about .adPT li:nth-child(4){right:0;top:0;width:44%;height:100%;left:initial;}
#first-box .aboutnewspro #newshot{width:487px;float:right;}
#first-box #newshot .stxt a,
#allporduct .stxt a,
#book .stxt a{float:right;}
#first-box #newshot .stxt{margin-bottom:18px;}
#first-box #newshot li{overflow:hidden;padding:10px 0;}
#first-box #newshot li .date{float:left;color:#f5d8a4;font-size:18px;width:10%;}
#first-box #newshot li .date .big{font-size:25px;font-weight:bold;}
#first-box #newshot li .intro{float:right;width:88%;}
#first-box #newshot li .intro h3,
#first-box #newshot li .intro article{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#first-box #newshot li .intro h3 a{color:#f5d8a4;font-size:18px;}
#first-box #newshot li .intro article{color:#ccc;font-size:12px;margin-top:5px;}
#hotproduct{margin-top:18px;}
#hotproduct .hotproduct-List{}
#hotproduct .hotproduct-List h3{overflow:hidden;color:#fff;font-weight:normal;font-size:16px;}
#hotproduct .hotproduct-List h3 p{background:#c5af81;float:left;width:calc(35% - 30px);padding:5px 15px;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#hotproduct .hotproduct-List h3 a{color:#fff;display:block;float:left;background:#575757;width:calc(65% - 30px);padding:5px 15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#hotproduct .hotproduct-List .photo{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;display:block;}
#allporduct{padding:50px 0 30px;}
#allporduct .stxt{margin-bottom:20px;}
#product{}
#product .productList{overflow:hidden;}
#product .productList .product-info{float:left;width:23.5%;margin-right:2%;margin-bottom:15px;}
#product .productList .product-info:nth-child(4n){margin-right:0;}
#product .productList .product-info .photo{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#product .productList .product-info .photo a{display:block;/*background-image:url(/images/05/index-product-hover.png);*/background-repeat:no-repeat;background-position:50% 50%;background-size:25%;background-color:rgba(100,90,67,0.7);opacity:0;transition:all ease-in-out 0.3s;}
#product .productList .product-info:hover .photo a{opacity:1;}
#product .productList .product-info .product-detail{padding:15px;}
#product .productList .product-info:hover .product-detail{background-color:#404040;}
#product .productList .product-info .product-detail span{display:block;width:50px;height:3px;background:#c5af81;}
#product .productList .product-info .product-detail h3{font-weight:normal;margin-top:10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#product .productList .product-info .product-detail h3 a{color:#f5d8a4;font-size:16px;}
#index-large{background:url(/images/05/index-large-bg.jpg);background-repeat: no-repeat;background-position: 50% 100%;background-size: cover;position:relative;padding:40px 0;overflow:hidden;z-index:1;}
#index-large:after{content:'';position:absolute;width:200%;height:50%;left:-170%;background:rgba(255,255,255,0.1);transform:skewX(80deg);z-index:-1;bottom:0;animation-name:indexbg1;animation-iteration-count:infinite;animation-duration:5s;animation-direction:alternate;}
#index-large:before{content:'';position:absolute;width:200%;height:100%;right:-190%;background:rgba(255,255,255,0.1);transform:skewX(-60deg);z-index:-1;bottom:0;animation-name:indexbg2;animation-iteration-count:infinite;animation-duration:5s;animation-direction:alternate;}
@keyframes indexbg1{
	0%{transform:skewX(50deg);left:-200%;height:100%;bottom:0;}
	50%{transform:skewX(80deg);left:-170%;height:50%;bottom:0;}
	100%{transform:skewX(80deg);left:-170%;height:50%;bottom:-30%;}
}
@keyframes indexbg2{
	0%{transform:skewX(0deg);right:-300%;}
	100%{transform:skewX(-60deg);right:-190%;}
}
#product .productList .product-info .product-detail .price { height: 25px; }
#product .productList .product-info .product-detail .price p{ display: inline-block; font-size: 16px; color: #777777; }
#product .productList .product-info .product-detail .price p b { font-size: 18px; color: #f00f0f; }
#product .productList .product-info .product-detail .price p.old { margin-right: 10px; text-decoration: line-through; color: #c4c1c1; }
#freebox .four h2{margin-bottom:20px;color:#c5af81;font-size:20px;letter-spacing:0.1em;text-align:center;}
#freebox .four{width:90%;margin:20px auto;}
#freebox .four ul{text-align:center;}
#freebox .four li{display:inline-block;width:calc(100%/6 - 4px);}
/*#freebox .four li .border{border:2px solid #c5af81;background-image:url(/images/05/footer-bg.png);text-align:center;margin:10px 20px;padding:40px 20px 30px;}
#freebox .four li .border p{color:#fff;text-align:center;height:46px;overflow:hidden;margin-top:25px;font-size:8pt;}
#freebox .four li .border img { display: inline-block; }*/
#freebox .four li a {display: block;width: 100%;position: relative;padding-bottom: 128%; }
#freebox .four li img {position: absolute;left: 50%;top: 2%;transform: translate(-50%);}
#freebox .four li span {font-size: calc(16px + 8 * ((100vw - 420px) / 860));color: #f5d8a4;position: absolute;left: 50%;transform: translateX(-50%);bottom: 6%;width: 100%;text-align: center;}
#freebox article{text-align:center;color:#c5af81;font-size:15px;line-height:180%;}
#freebox .four .youtube { position: relative; margin: 30px auto; width: 55%; }
#youtube .UTwo{position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden}
#youtube .UTwo a{display:block;width:100px;height:100px;text-align:center;line-height:100px;border-radius:50%;background:rgba(0,0,0,0.6);position:absolute;z-index:5;color:#dcdcdc;font-size:30px;left:calc(50% - 50px);top:calc(50% - 50px);transition:all linear .3s}
#youtube .UTwo a:hover{width:110px;height:110px;line-height:110px;left:calc(50% - 55px);top:calc(50% - 55px);font-size:34px}
#youtube .UTwo iframe{position:absolute;top:0;left:0;width:100%;height:100%}
#book{margin:80px 0 20px;}
#book .stxt{color:#fff;margin-bottom:40px;}
#book .stxt span{background:#fff;}
#book .bookshow{position:relative;margin:0 10px;}
#book .bookshow .photo{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#book .bookshow .photo a{display:block;}
#book .bookshow .bookdetail{position:absolute;bottom:0;left:0;width:100%;background:rgba(255,255,255,0.7);padding:20px 0;transition:all ease-in-out 0.3s;}
#book .bookshow:hover .bookdetail{background:rgba(25,25,25,0.7);}
#book .bookshow .bookdetail h3{text-align:center;}
#book .bookshow .bookdetail h3 a{color:#252525;font-size:16px;}
#book .bookshow:hover .bookdetail h3 a{color:#fff;}
#book .bookshow .bookdetail p{text-align:center;}
#book .bookshow .bookdetail p a{color:#9b8146;font-size:12px;}

@media screen and (max-width:1366px){
	#first-box .aboutnewspro #about,
	#freebox .four{width:100%;}
	#first-box .aboutnewspro #newshot{width:100%;margin-top:50px;overflow:hidden;}
	#news{width:66%;float:left;}
	#hotproduct{width:30%;float:right;}
	#hotproduct .hotproduct-List h3 p{width:calc(50% - 30px);}
	#hotproduct .hotproduct-List h3 a{width:calc(50% - 30px);}
	#first-box{padding-bottom:100px;}
	#hotproduct .hotproduct-List h3{font-size:14px;}
}
@media screen and (max-width:1280px){
	#freebox .four{width:70%;}
	#freebox .four li{width:calc(50% - 4px);margin-bottom:20px;}
	#freebox .four .youtube { width: 100%; }
	#freebox .four li a{ padding-bottom: 72%; }
}
@media screen and (max-width:980px){
	#news{width:56%;}
	#hotproduct{width:40%;}
	#product .productList .product-info,
	#product .productList .product-info:nth-child(4n){width:31%;margin-right:3.3%;}
	#product .productList .product-info:nth-child(3n){margin-right:0;}
	#freebox .four{width:80%;}
}
@media screen and (max-width:768px){
	#news{width:100%;margin-bottom:30px;}
	#hotproduct{width:100%;}
	#product .productList .product-info,
	#product .productList .product-info:nth-child(3n),
	#product .productList .product-info:nth-child(4n){width:48.5%;margin-right:2%;}
	#product .productList .product-info:nth-child(2n){margin-right:0;}
	#product .productList .product-info .photo a{background-size:30%;}
	#freebox .four{width:80%;}
	#freebox .four li .border p{height:70px;}
	#first-box #newshot .stxt a, #allporduct .stxt a, #book .stxt a{margin-top:5px;}
	#freebox .four{width:90%;}
	#freebox .four li .border{margin:10px 10px;}
}
@media screen and (max-width:640px){
	#first-box .aboutnewspro #about .adPT ul{height:auto;}
	#first-box .aboutnewspro #about .adPT li{position:initial;float:left;height:250px;width:40%;}
	#first-box .aboutnewspro #about .adPT li:nth-child(2){width:57%;float:right;}
	#first-box .aboutnewspro #about .adPT li:nth-child(3){margin-top:10px;width:60%;}
	#first-box .aboutnewspro #about .adPT li:nth-child(4){width:38%;height:200px;float:right;margin-top:10px;}
	#first-box #about .aboutus .aboutimage{width:100%;float:right;height:200px;}
	#first-box #about .aboutus .aboutcontrol,
	#freebox .four{width:100%;}
	#first-box #about .aboutus .aboutcontrol{margin-bottom:20px;}
}
@media screen and (max-width:480px){
	#product .productList .product-info,
	#product .productList .product-info:nth-child(3n),
	#product .productList .product-info:nth-child(4n),
	#product .productList .product-info:nth-child(2n){width:100%;margin-right:0;}
	#freebox .four li a{ padding-bottom: 110%; }
	/*#freebox .four li{width:80%;margin:0 10% 20px;}
	#freebox .four li .border p{height:auto;}*/
	#first-box #newshot li .date{width:15%;}
	#first-box #newshot li .intro{width:83%;}
	#first-box #about .aboutus .aboutcontrol .more{position:initial;text-align:right;}
}