h2.boxTitle {margin-bottom: 15px;color: #000;}
h2.boxTitle img { margin-left: 20px; }

#content{overflow:hidden;width: 1500px;margin: 0 auto;background: #f5f5f5;padding: 40px;margin-top: 30px;}
#leftBox{float:left;width: calc(100% - 350px);}
#rightBox{float:right;width: 300px;}
#searchBox h2{
    margin-bottom: 10px;
    color: #000;
}
#searchBox h4{
    color: #333;
    font-weight: normal;
    margin: 10px 0;
}
#searchBox .adPT a{
    display: inline-block;
    border: 1px #cac8c8 solid;
    border-radius: 5px;
    padding: 3px 9px;
    color: #000;
    margin: 0 10px 10px 0;
}
#news{
    margin: 20px 0;
}
#news .newsList{
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 10px;
}
#news .newsList li{}
#news .newsList li h3{
    font-size: 16px;
    color: #333;
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 30px);
}
#news .newsList li h3.dot{
    width: 24px;
}
#news .newsList li h3 a{
    color: #333;
}
#slotBox{}
#slotBox .cust{}
#slotBox .cust .four{
    float: left;
    width: calc(50% - 10px);
    margin: 0 10px 10px 0;
}
#slotBox .cust .four:nth-child(2n){
    margin: 0 0 10px 10px;
}
#slotBox .cust .four h2 a{
    display: block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    border-radius: 5px;
}
#first-box{}
#first-box section >p{text-align:center;}
#first-box .aboutnewspro{overflow:hidden;}
#first-box .aboutnewspro #about{}
#first-box .aboutnewspro #about .aboutus{overflow:hidden;position:relative;}
#first-box #about .aboutus .aboutcontrol{}
#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:#4e4e4e;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:#484847;font-size:12px;position:relative;margin-top:25px;line-height:200%;overflow:hidden;}
#first-box #about .aboutus .aboutcontrol article h3{font-weight:normal;margin-bottom:20px;font-size: 17px;line-height: 200%;}
#first-box #about .aboutus .aboutcontrol .more{
    text-align: center;
    margin-bottom: 20px;
}
#first-box #about .aboutus .aboutcontrol .more a{color: #fff;font-size: 16px;background: #a51217;display: inline-block;padding: 20px 60px;margin: 0 5px;border-radius: 5px;font-weight: bold;letter-spacing: 2px;}
#first-box #about .aboutus .aboutcontrol .more a:nth-child(2){
    background: #323031;
}
#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:#4e4d4c;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:#4e4d4c;font-size:18px;}
#first-box #newshot li .intro article{color:#8e8e8e;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;}
#allporduct section, #first-box section{
    width: 100%;
}
#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-repeat:no-repeat;background-position:50% 50%;background-size:25%;background-color: rgb(0 0 0 / 70%);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: 5px 0;}
#product .productList .product-info:hover .product-detail{}
#product .productList .product-info .product-detail span{display:block;width:50px;height:3px;background:#c5af81;}
#product .productList .product-info .product-detail h3{font-weight: bold;margin-top:10px;}
#product .productList .product-info .product-detail h3 a{color:#1f1e1e;font-size: 18px;display: block;overflow: hidden;height: 48px;}
#product .productList .product-info .product-detail p{
    color: #a7a7a7;
    font-size: 13px;
}
#index-large{background:#152030;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(25% - 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 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:#b5995a;margin-bottom:40px;}
#book .stxt span{background:#b5995a;}
#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:1600px){
#content{width:90%;}
}
@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{}
	#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{}
	#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%; }
}
@media screen and (max-width:1024px){
#product .productList .product-info{float:left;width: 49%;margin-right:2%;margin-bottom:15px;}
#product .productList .product-info:nth-child(2n){margin-right:0;}
}
@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){
	#leftBox{float:none;width: 100%;}
    #rightBox{float:none;width: 100%;}
	#news{width:100%;margin-bottom:30px;}
	#hotproduct{width:100%;}
	#content{
    width: calc(90% - 80px);
    margin-top: 20px;
}
    #allporduct{
    padding: 0 0 30px;
}
	#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{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;}
#first-box #about .aboutus .aboutcontrol .more a{padding: 20px 0;display: block;text-align: center;margin-bottom: 10px;}
}