.wrap { position: relative; background: #fff; padding-top: 15vh; z-index: 998; }
.wrap #wrapBox>div { position: relative; }
.wrap #wrapBox .bg { position: absolute; width: 100%; height: 100%; background: 50% / auto; top: 0; left: 0; opacity: .4; }

/* aboutBox */
#aboutBox { overflow: hidden; }
#aboutBox .imgs { position: absolute; width: 50vw; height: 100%; top: 0; left: 0; z-index: 1; }
#aboutBox .imgs .list { height: 40vw; background: no-repeat 50% / cover; }
#aboutBox .info { position: relative; padding: 70px 0 70px 55vw; width: 490px; z-index: 3; }
#aboutBox .info .bgTxt { text-align: left; }
#aboutBox .info .stitle { position: relative; margin-bottom: 25px; padding: 0px 0 15px; font-size: 18px; color: #6D6D6D; }
#aboutBox .info .stitle:after { position: absolute; top: 33%; width: 70px; height: 1px; display: inline-block; background: #CCC; content: ""; }
#aboutBox .info article { line-height: 200%; color: #6D6D6D; }
#aboutBox #SeoStarRating { margin: 15px 0 30px; text-align: right; }
#aboutBox p.more { text-align: left; }

/* productBox */
#productBox .workframe { position: relative; width: 100%; }
#productBox .proList { padding: 0 0 1vw; }
#productBox .proList li { position: relative; padding: 0; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
#productBox .proList li.slick-slide { -moz-transform: scale(0.8); -webkit-transform: scale(0.8); -o-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); z-index: -1; margin: 0 -30px; opacity: 0.4; }
#productBox .proList li.slick-center { z-index: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); opacity: 1; }
#productBox .proList .item { margin: 30px auto; position: relative; width: 100%; max-width: 1180px; -webkit-box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3); box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3); }
#productBox .proList .item .Img { position: relative; }
#productBox .proList .item .Img a.photo:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgb(0 0 0 / 0.2); content: ""; }
#productBox .proList .item .info { position: absolute; left: 50%; bottom: 35px; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); text-align: center; }
#productBox .proList .item .info h3 { text-align: center; color: #fff; font-size: 2.4rem; font-weight: bold; text-shadow: 0px 0px 10px rgb(0 0 0 / 0.5); -webkit-line-clamp: 1; }
#productBox .proList .item .info article p { text-align: center; color: #ffffff; font-weight: 500; text-shadow: 0 0 10px rgb(0 0 0 / 0.3); -webkit-line-clamp: 2; }

/* bookBox bookList*/
#bookBox { font-size: 0; }
#bookBox .row { position: relative; margin: 0; width: 100%; display: block; }
#bookBox #BookList { padding-bottom: 7vh; }
#bookBox #BookList ul li { position: relative; width: 100%; max-width: 1180px; -webkit-box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3); box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3); }
#bookBox #BookList ul li.slick-slide { position: relative; -moz-transform: scale(0.8); -webkit-transform: scale(0.8); -o-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); z-index: -1; margin: 0 -70px; filter: blur(3px); }
#bookBox #BookList ul li.slick-slide:after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgb(215 162 151 / 78%); content: ""; }
#bookBox #BookList ul li.slick-center { z-index: 1; -webkit-transform: scaleY(0.9); -ms-transform: scaleY(0.9); transform: scaleY(0.9); filter: none; }
#bookBox #BookList ul li.slick-center:after { display: none; }
#bookBox #BookList ul li h3 { position: absolute; width: 100%; left: 0; bottom: 35px; }
#bookBox #BookList ul li h3 a { height: 70px; color: #fff; font-size: 3rem; font-weight: bold; text-shadow: 0 0 10px rgb(0 0 0 / 50%); text-align: center; -webkit-line-clamp: 1; }

/* bookBox customBox*/
#bookBox #customBox { background: url(/images/42/flower-bg.jpg) no-repeat 50% / cover; }
#bookBox #customBox ul { margin-bottom: 0; }
#bookBox #customBox .custom { position: relative; height: 80vh; font-size: 0; }
#bookBox #customBox .imgs { position: absolute; top: 0; right: 0; display: inline-block; width: 48vw; z-index: 1; }
#bookBox #customBox .imgs .list { height: 100vh; background: no-repeat 50% / cover; }
#bookBox #customBox .info { display: inline-block; width: 25vw; vertical-align: top; padding: 5vw 13vw 0; float: left; z-index: 3; }
#bookBox #customBox .info h3 { position: relative; font-size: 40px; color: #D7A297; text-align: center; }
#bookBox #customBox .info h3:after { position: absolute; bottom: -11px; left: calc((100% - 80px) / 2); width: 80px; height: 1px; background: #D7A297; content: ""; }
#bookBox #customBox .info article { color: #6D6D6D; margin: 55px 0; }
#bookBox #customBox .slick-dots { position: absolute; bottom: 4vh; left: -25%; }
#bookBox #customBox .slick-dots li button:before { color: #d49e93; font-size: 10px; opacity: .25; }
#bookBox #customBox .slick-dots li.slick-active button:before { color: #d7a297; opacity: .75; }

@media screen and (max-width: 1280px) {
	#aboutBox .imgs, #bookBox .row { position: relative; width: 100%; display: inline-block; }
	#aboutBox .info { padding: 70px 15%; width: 70%; background: rgb(249 249 249); }
	#aboutBox p.more { text-align: center; }
}
@media screen and (max-width: 980px) {
	#aboutBox .info .title { font-size: 8vw; }
	#bookBox #BookList ul li.slick-slide { margin: 0; }
	#bookBox #customBox .custom { height: auto; }
	#bookBox #customBox .info { width: 100%; height: 48vh; display: block; float: none; padding: 10vh 0; }
	#bookBox #customBox .info article { width: 60%; margin: 0 auto; padding: 5vh 0; }
	#bookBox #customBox .imgs { position: relative; width: 100%; }
	#bookBox #customBox .imgs .list { height: 35vh; }
	#bookBox #customBox .slick-dots { bottom: 40vh; left: calc(0% / 2); }
}
@media screen and (max-width: 680px) {
	#aboutBox .imgs .list { height: 60vw; }
	#productBox .proList { padding: 5vh 0 1vh; }
	#productBox .proList li.slick-center { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
	#bookBox #customBox .info article { width: 90%; padding: 8vw 0 0; }
}
@media screen and (max-width: 450px) {
	#aboutBox .info { padding: 10vw 5vw; width: 90vw; }
}