.text-clamp{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
.more{display:inline-block;font-size:16px;padding: 25px 50px;background: #d11c29;border: 2px solid #d11c29;box-sizing:border-box;text-align:center;transition:ease .3s;color:#fff;}
.more:hover{color: #1a1a1a;background: #ffffff;border: 2px solid #fff;}
#Extra-setting{background:#1a1a1a}
#Extra-setting .workframe{display:flex;flex-wrap:wrap;padding:160px 0px 110px}
#Extra-setting .item{width:50%;display:flex;padding:20px 0px 50px}
#Extra-setting .item .item-icon{padding:0 15px}
#Extra-setting .item .item-icon img{width:170px;height:160px}
#Extra-setting .item .item-info{padding:0 15px;width:62%}
#Extra-setting .item .item-info .item-title{margin-bottom:27px;color:#fff;font-size:22px}
#Extra-setting .item .item-info .item-descript{color:#888888;font-size:17px;line-height:30px}
#aboutFunc{padding:160px 0px;background-repeat:no-repeat;background-size:cover;position: relative;}
#aboutFunc:after{content:'';position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: #1a1a1a;opacity: .55;}
#aboutFunc .speBox{width:100%;position: relative;z-index: 2;}
#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:42px;color:#fff;line-height:1.3;margin-bottom:30px;}
#aboutFunc .speBox #about h2{font-size:22px;color:#fff;font-family:'Poppins',sans-serif;margin-bottom:25px}
#aboutFunc .speBox #about .arts{font-size:17px;line-height: 2;color:#fff;text-align: justify;margin-bottom: 40px;}
#aboutFunc #SeoStarRating{padding-bottom:50px}
#product{padding: 100px 0;}
#product .titleSet h2.speBoxTitle{font-size:42px;color:#fff;line-height:1.3;text-align: center;margin-bottom: 70px;}
#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: calc((100%/3) - 40px);position:relative;overflow:hidden;transition:ease .3s;margin: 20px;}
#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{color:#fff;}
#product #prolay .pro-list > div .p-box .p-info .describe{line-height: 1.6;-webkit-line-clamp: 3;height: 70px;overflow: hidden;color: #888;font-size: 14px;text-align: justify;}
#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{}
#product #prolay .pro-list > div .p-box .p-info h3{position:relative;font-size:22px;line-height:1.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin: 15px 0;}
#product #prolay .pro-list > div .p-box .p-info h3 a{color:#fff;display: block;height: 31px;overflow: hidden;}
#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{background:#1a1a1a}
#NewsBox .workframe{padding:100px 0px}
#NewsBox .workframe .speBox .titleSet{}
#NewsBox .workframe .speBox .titleSet h2{font-size:42px;line-height:1.3;color:#fff;text-align:center}
#NewsBox #news .newsList{padding-top:50px;display:flex;flex-wrap:wrap}
#NewsBox #news .newsList >div{width:calc(100%/4)}
#NewsBox #news .newsList .border{padding:15px;overflow:hidden}
#NewsBox #news .newsList .border a.photo{display:block;background-position:center;background-repeat:no-repeat;background-size:cover}
#NewsBox #news .newsList .border a img{width:100%}
#NewsBox #news .newsList .border .news-info h3{margin:15px 0}
#NewsBox #news .newsList .border .news-info h3 a{font-size:22px;line-height:150%;color:#fff;display:block;overflow:hidden;height:65px}
#NewsBox #news .newsList .border .news-info .describe{line-height:1.6;-webkit-line-clamp:3;height:70px;overflow:hidden;color:#888;font-size:14px;text-align:justify}
#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: rgb(26 26 26 / 55%);}
#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}
#aboutFunc{background-attachment:fixed;}
}@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{}
}@media screen and (max-width:1280px){#aboutFunc{padding:160px 40px}
}@media screen and (max-width:1024px){#Extra-setting .item .item-info .item-descript{font-size:16px}
#Extra-setting .item .item-info .item-title{font-size:18px}
#aboutFunc{padding:120px 40px}
#aboutFunc .speBox .youtubebox{width:100%;float:unset}
#aboutFunc .speBox #about{width:100%;padding-top:35px}
#product #prolay .pro-list > div .p-box .p-info h3{}
#product #prolay .pro-list > div .p-box .p-info .describe{height:44px}
#product .titleSet{}
#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%}
#product, #NewsBox .workframe{padding:50px 0;}
#NewsBox #news .newsList >div{width:50%;}
#Extra-setting .item .item-icon img{height:auto}
#product .titleSet h2.speBoxTitle, #aboutFunc .speBox #about h3.subBoxTitle, #NewsBox .workframe .speBox .titleSet h2{font-size: 32px;}
#product #prolay .pro-list > div .p-box .p-info h3{}
#product .titleSet h2.speBoxTitle{margin-bottom: 30px;}
#NewsBox .workframe .speBox .titleSet{display:block}
#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 .slick-prev,#NewsBox #news .newsList .slick-next{top:45px}
#NewsBox #news .newsList{padding-top: 40px;}
#NewsBox #news .newsList >div{width:100%;}
#product #prolay .pro-list > div{width: calc(100% - 40px);}
}
@media screen and (max-width:480px){#freebox .free h3{font-size:36px}
#freebox .free p{font-size:16px}
#bookBox .speBox .booktitle h2,#NewsBox .workframe .speBox .titleSet h2,#aboutFunc .speBox #about h3.subBoxTitle,#product .titleSet h2.speBoxTitle{font-size:36px}
#product .titleSet .product-desc{font-size:18px}
.more{padding:8px 25px 10px}
#Extra-setting .workframe{padding:40px 0px}
#Extra-setting .item .item-info .item-title{font-size:16px}
#Extra-setting .item .item-info .item-descript{font-size:14px}
#aboutFunc{padding:60px 40px}
}@media screen and (max-width:420px){#product #prolay .pro-list > div .p-box .p-info h3{}
#ssbanner .bxslider > div a p{font-size:16px}
}@media screen and (max-width:374px){#product .titleSet,#aboutFunc,#NewsBox .workframe,#freebox{padding:60px 20px}
}