.text-clamp{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
.more{display:inline-block;font-size:16px;padding:21px 48px 19px;background: #d91a21;border: 2px solid #d91a21;box-sizing:border-box;text-align:center;font-family:'Poppins',sans-serif;transition:ease .3s;color:#fff}
.more:hover{color:#fff;background: #ff9800;border: 2px solid #ff9800;}
#Extra-setting{background:#efefef}
#Extra-setting .workframe{display:flex;flex-wrap:wrap;padding:110px 0px;justify-content:space-between}
#Extra-setting .item{width:calc((100%/4) - 100px);display:flex;flex-direction:column;align-items:center;background:#fff;padding:40px}
#Extra-setting .item .item-icon{width:90px}
#Extra-setting .item .item-info{}
#Extra-setting .item .item-info .item-title{margin:10px 0 20px;color:#0a346f;font-size:20px;text-align:center}
#Extra-setting .item .item-info .item-descript{color:#888888;font-size:14px;line-height:30px;text-align:justify;font-weight:200;line-height:200%}
#aboutFunc{padding: 100px 0px;background-attachment:fixed;background-repeat:no-repeat;background-size:cover;position: relative;}
#aboutFunc:after{content:'';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity: .5;}
#aboutFunc .speBox{width:100%;position: relative;z-index: 2;}
#aboutFunc .speBox:after{content:url(/images/24/img-about.png);position: absolute;right: -10%;top: 0;zoom: 55%;}
#aboutFunc .speBox .youtubebox{width:45%;float:right}
#aboutFunc .speBox .youtubebox #youtube .UTwo iframe{width:100%;height:376px}
#aboutFunc .speBox #about{width:50%}
#aboutFunc .speBox #about h3.subBoxTitle{font-size: 40px;font-family:'Poppins',sans-serif;color:#fff;line-height:1.3;margin-bottom:30px}
#aboutFunc .speBox #about h2{font-size: 20px;color:#fff;margin-bottom:25px;font-weight: 500;}
#aboutFunc .speBox #about .arts{font-size: 16px;line-height: 200%;color:#fff;font-weight: 200;text-align: justify;margin-bottom: 40px;}
#aboutFunc #SeoStarRating{padding-bottom:50px}
#product .titleSet{padding:160px 110px;background:#1a1a1a}
#product .titleSet h2.speBoxTitle{font-size:42px;color:#fff;font-family:'Poppins',sans-serif;line-height:1.3;padding-bottom:35px}
#product .titleSet .product-desc{font-family:'Poppins',sans-serif;color:#ffffff;font-size:22px;line-height:1.6;max-width:75%;padding-bottom:30px}
#product #prolay .pro-list{display:flex;flex-wrap:wrap}
#product #prolay .pro-list > div{width:25%;position:relative;overflow:hidden;transition:ease .3s}
#product #prolay .pro-list > div .photo{position:relative;background-position:center;background-repeat:no-repeat;background-size:cover;display:block}
#product #prolay .pro-list > div .photo::after{content:"";position:absolute;left:0px;top:0px;display:block;background:transparent;transition:ease .3s;width:100%;height:100%}
#product #prolay .pro-list > div .p-box .p-info{width:95%;color:#fff;position:absolute;left:20px;bottom:0px;transform:translateY(85px);transition:ease .3s}
#product #prolay .pro-list > div .p-box .p-info .describe{height:44px;overflow:hidden;padding-right:17px;box-sizing:border-box;-webkit-line-clamp:2}
#product #prolay .pro-list > div .p-box .p-info .price{height:23px;overflow:hidden;padding-bottom:10px}
#product #prolay .pro-list > div .p-box .p-info .price span{display:inline-block}
#product #prolay .pro-list > div .p-box .p-info .price span.saleprice{margin-left:5px;height:28px}
#product #prolay .pro-list > div .p-box .p-info .price span.saleprice b{font-size:22px;color:red}
#product #prolay .pro-list > div .p-box .p-info .title{display:flex;justify-content:space-between;align-items:center;padding-bottom:60px}
#product #prolay .pro-list > div .p-box .p-info h3{max-width:65%;position:relative;font-size:22px;font-family:'Poppins',sans-serif;line-height:1.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#product #prolay .pro-list > div .p-box .p-info h3 a{color:#fff}
#product #prolay .pro-list > div .p-box .p-info a.btn{display:block;width:58px;height:58px;text-align:center;line-height:58px;border:2px solid #fff;border-radius:50%;margin-right:20px;color:#fff;transition:ease .3s;opacity:0}
#NewsBox{}
#NewsBox .workframe{padding: 90px 0px;}
#NewsBox .workframe .speBox .titleSet{display:flex;justify-content: space-between;align-items: center;}
#NewsBox .workframe .speBox .titleSet h2{font-size:42px;font-family:'Poppins',sans-serif;line-height:1.3;margin-right:45px}
#NewsBox #news .newsList{padding-top:50px}
#NewsBox #news .newsList .border{padding:0 15px;overflow:hidden}
#NewsBox #news .newsList .border a{display:block;background-position:center;background-repeat:no-repeat;background-size:cover}
#NewsBox #news .newsList .border .news-info h3{font-size: 20px;line-height:1.6;padding: 15px 0 0;text-align: center;font-weight: 400;letter-spacing: 1px;}
#NewsBox #news .newsList .border .news-info .describe{font-family:'Poppins',sans-serif;font-size:17px;color:#888888;line-height:1.6;-webkit-line-clamp:2}
#NewsBox #news .newsList .slick-prev,#NewsBox #news .newsList .slick-next{height:58px;width:58px;border:2px solid #888888;border-radius:50%}
#NewsBox #news .newsList .slick-prev{right:87px;top:0px;left:unset}
#NewsBox #news .newsList .slick-next{right:15px;top:0px}
#NewsBox #news .newsList .slick-prev:before{content:"\f053";font:normal normal normal 14px/1 FontAwesome;padding-right:5px}
#NewsBox #news .newsList .slick-next:before{content:"\f054";font:normal normal normal 14px/1 FontAwesome;padding-left:5px}
#NewsBox #news .newsList .slick-prev:before,#NewsBox #news .newsList .slick-next:before{font-size:20px;color:#888888}
#bookBox{display:flex;background-repeat:no-repeat;background-size:cover;background-position:center;background-attachment:fixed}
#bookBox .speBox{width:35%;position:relative}
#bookBox .speBox .booktitle{width:100%;position:absolute;top:50%;left:50%;transform:translate(0%,-50%)}
#bookBox .speBox .booktitle h2{font-size:42px;color:#fff;font-family:'Poppins',sans-serif;line-height:1.3}
#bookBox #book{width:65%;transform:translateX(200px)}
#bookBox #book .bList .mofd{position:relative}
#bookBox #book .bList .photo{background-size:cover;background-repeat:no-repeat;background-position:center}
#bookBox #book .bList .photo img{height:700px}
#bookBox #book .bList .mofd h3{transition:ease .3s;position:absolute;bottom:0px;left:0px;width:100%;height:60px;background:#020202a6;text-align:center;line-height:60px;box-sizing:border-box;border-right:1px solid #888}
#bookBox #book .bList .mofd h3 a{color:#fff;display:block;width:100%}
#bookBox #book .bList .mofd:hover h3{background:#020202d6}
#freebox.noneCI{display:none}
#freebox{padding:160px 110px}
#freebox .free h3{font-size:42px;color:#fff;font-family:'Poppins',sans-serif;line-height:1.3;padding-bottom:35px;text-align:center}
#freebox .free p{font-family:'Poppins',sans-serif;color:#ffffff;font-size:22px;line-height:1.6;max-width:100%;padding-bottom:30px;text-align:center}
#ssbanner .bxslider{display:flex}
#ssbanner .bxslider >div{position:relative}
#ssbanner .bxslider > div a{position:relative;display:block;background-repeat:no-repeat;background-position:center;background-size:cover;height:100%}
#ssbanner .bxslider > div a::after{content:"";position:absolute;left:0px;top:50%;transform:translateY(-50%);width:100%;height:0%;transition:all .25s;background-color:rgba(27,47,66,0.5);z-index:1}
#ssbanner .bxslider > div a:hover::after{height:100%}
#ssbanner .bxslider > div a p{position:absolute;width:85%;bottom:14%;left:8%;color:#fff;font-size:22px;z-index:2}

@media screen and (min-width:1025px){
	#product #prolay .pro-list > div:hover .photo::after{background:rgba(9,113,242,0.9)}
	#product #prolay .pro-list > div:hover .p-box .p-info{transform:translateY(0px)}
	#product #prolay .pro-list > div:hover .p-box .p-info{transform:translateY(0px)}
	#product #prolay .pro-list > div:hover .p-box .p-info a.btn{opacity:1}
}
@media screen and (max-width:1300px){
	#product #prolay .pro-list > div .p-box .p-info a.btn{width:45px;height:45px;line-height:45px}
	#product #prolay .pro-list > div .p-box .p-info .title{padding-bottom:40px}
}
@media screen and (max-width:1280px){
	#product #prolay .pro-list > div{width:33.33333%}
}
@media screen and (max-width:1024px){
	#Extra-setting .item{width: calc((100%/2) - 100px);margin: 15px 0;}
	#aboutFunc .speBox:after{display:none;}
	#Extra-setting .item .item-info .item-descript{font-size:16px}
	#Extra-setting .item .item-info .item-title{font-size:18px}
	#aboutFunc{padding: 80px 40px;}
	#aboutFunc .speBox .youtubebox{width:100%;float:unset}
	#aboutFunc .speBox #about{width:100%;}
	#product #prolay .pro-list > div .p-box .p-info h3{font-size:20px}
	#product #prolay .pro-list > div .p-box .p-info .describe{height:44px}
	#product .titleSet{padding:60px 40px}
	#product .titleSet .product-desc{max-width:100%}
	#bookBox{display:block}
	#bookBox .speBox{width:100%;position:unset}
	#bookBox .speBox .booktitle{width:100%;position:unset;padding:30px 40px;transform:unset}
	#bookBox #book{width:100%;transform:unset}
	#bookBox #book .bList .photo img{height:auto}
	#ssbanner .bxslider > div a p{font-size:18px}
}
@media screen and (max-width:768px){
	#Extra-setting .workframe{padding:40px 20px}
	#Extra-setting .item{width:100%}
	#Extra-setting .item .item-icon img{height:auto}
	#product #prolay .pro-list > div{width:50%}
	#product #prolay .pro-list > div .p-box .p-info h3{font-size:18px}
	#NewsBox #news .newsList .slick-prev,#NewsBox #news .newsList .slick-next{height:35px;width:35px}
	#NewsBox #news .newsList .slick-prev{right:65px}
	#NewsBox #news .newsList .slick-prev:before,#NewsBox #news .newsList .slick-next:before{font-size:14px}
	#NewsBox #news .newsList .slick-prev:before{padding-right:3px}
	#NewsBox #news .newsList .slick-next:before{padding-left:3px}
	#freebox{padding:80px 40px}
	#ssbanner .bxslider{flex-wrap:wrap}
	#ssbanner .bxslider > div{width:50%}
}
@media screen and (max-width:580px){
	#NewsBox #news .newsList{padding:0;}
	#aboutFunc{padding: 60px 15px;background-attachment: inherit;}
	#aboutFunc .speBox #about h3.subBoxTitle, #NewsBox .workframe .speBox .titleSet h2{font-size: 35px;}
	#NewsBox #news .newsList .slick-prev,#NewsBox #news .newsList .slick-next{top:45px}
	#NewsBox .workframe .speBox .titleSet{flex-direction: column;align-items: center;}
	#NewsBox .workframe .speBox .titleSet h2{margin: 0 0 35px;}
	#NewsBox .workframe .speBox .titleSet h3{display:none;}
	#NewsBox .workframe{padding:50px 0;}
	#NewsBox #news .newsList .border .news-info h3{font-size:18px;letter-spacing: 0;}
}