h2.title { padding-bottom: 50px; text-align: center; font-size: 36px; }

/* aboutBox */
#aboutBox { background: no-repeat 50% / cover; }
#aboutBox h2 { padding: 60px 0 50px; border-bottom: 1px solid rgba(0, 0, 0, .2); text-align: center; font-weight: 700; font-size: 26px; color: #0e0e0e; }
#aboutBox .customBox { margin: 50px 0; font-size: 0; }
#aboutBox .customBox >div h3 { margin: 0 20px; text-align: center; font-weight: 400; font-size: 30px; }
#aboutBox .customBox >div article { margin: 0 20px; text-align: center; font-size: 15px; }
#aboutBox .pictureBox { margin: 20px auto; width: 90%; }
#aboutBox .pictureBox .slick-list { z-index: 2; }
#aboutBox .pictureBox .list { position: relative; }
#aboutBox .pictureBox .list >div { overflow: hidden; margin: 10px; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, .4); }
#aboutBox .pictureBox .list >div img { background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.5) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );  }
#aboutBox .pictureBox .list p { position: absolute; left: 10px; bottom: 10px; }
#aboutBox .pictureBox .list p a { padding: 10px 20px; width: calc(100% - 50px); display: block; color: #fff; font-size: 15px; }
#aboutBox .aboutInfo { position: relative; margin-top: -100px; padding: 150px 0 50px; background: #fff; box-shadow: 0 -4px 4px rgba(0, 0, 0, .1); z-index: 1; }
#aboutBox .aboutInfo .workframe { width: 50%; }
#aboutBox .aboutInfo article { text-align: center; font-size: 16px; color: #313136; }
#aboutBox .aboutInfo #SeoStarRating { text-align: right; }

/* product */
#product { position: relative; padding: 2vw 0 1vw; background-color: #eff1f5; }
#product .slick-list { padding: 0 15%; }
#product .pro-list .slick-slide { padding-bottom: 50px; }
#product .pro-list .slick-slide a.photo { margin: 20px; padding-bottom: 0; box-shadow: 5px 5px 10px rgba(0,0,0,.2); }
#product .pro-list .slick-slide.slick-current a.photo { padding-bottom: 50px; }
#product .pro-list .slick-slide.slick-current { padding-bottom: 0; }
#product .pro-list .slick-slide .info { margin: 20px 40px; }
#product .pro-list .slick-slide .info h3 a { height: 34px; line-height: 34px; font-size: 16px; color: #868686; -webkit-line-clamp: 1; }
#product .pro-list .slick-slide.slick-current .info h3 a { font-size: 20px; color: #000; }
#product .pro-list .slick-slide .info p.price { min-height: 30px; opacity: 0; }
#product .pro-list .slick-slide.slick-current .info p.price { opacity: 1; }
#product .pro-list .slick-slide .info p.price span { margin-right: 10px; display: inline-block; font-size: 16px; color: #ce0000; vertical-align: middle; }
#product .pro-list .slick-slide .info p.price span.old { text-decoration: line-through; font-size: 12px; color: #c4c4c4; }
#product .btn { width: 100%; text-align: center; }
#product .btn a { position: absolute; width: 7vw; height: 7vw; background: #af6e52; box-shadow: 0 5px 10px rgba(0, 0, 0, .2); display: inline-block; left: calc((100% / 3) - 50px); bottom: 150px; }
#product .btn a:before , #product .btn a:after { position: absolute; width: 40%; height: 1px; background: #fff; bottom: 44%; right: 30%; transition: right .2s ease-in; content: ""; }
#product .btn a:after { margin: 1px 0 0 1px; width: 1.3vw; bottom: 50%; left: 26%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#product .btn a#nextBtn { background: #242a46; left: auto; right: calc((100% / 3) - 50px); }
#product .btn a#nextBtn:before , #product .btn a#nextBtn:after { background: #bf8b75; }
#product .btn a#nextBtn:after { margin: 1px 1px 0 0; left: auto; right: 26%; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* NewsBox */
#NewsBox ul li >div { position: relative; margin: 0 20px; }
#NewsBox ul li .newImg a.category { position: absolute; padding: 4px 40px; background: #ae591b; display: inline-block; color: #fff; bottom: 0; left: 0; }
#NewsBox ul li .info { padding: 40px 30px 50px; background: #fff; border: 1px #d0d0d0 solid; }
#NewsBox ul li:hover .info { border-color: #ae591b; }
#NewsBox ul li .info h3 { height: 34px; font-size: 20px; -webkit-line-clamp: 1; }
#NewsBox ul li .info article { margin: 5px 0 20px; height: 46px; -webkit-line-clamp: 2; }
#NewsBox ul li .info p.time { font-size: 13px; color: #9f9f9f; }
#NewsBox ul li .info p.more { position: absolute; right: 30px; bottom: 20px; }
#NewsBox ul li .info p.more a { padding: 0; border: 0; }
#NewsBox ul li .info p.more a:before { display: none; }

/* bookBox */
#bookBox { overflow: hidden; position: relative; margin: 4vw 0 1vw; background: linear-gradient(180deg,#fff 0,#fff 280px,#bd9672 0,#bd9672); }
#bookBox ul li { position: relative; padding-bottom: 70px; }
#bookBox ul li a.photo { margin: 0 50px; background-color: #fff; box-shadow: 10px 5px 20px 3px rgba(0,0,0,.1); }
#bookBox ul li .info { position: absolute; margin-bottom: 20px; padding: 60px 40px 40px; width: 420px; min-height: 440px; background: #fff; border-top: 5px #bd9672 solid; box-sizing: border-box; box-shadow: 2px 3px 20px 3px rgba(0,0,0,.1); left: 10%; bottom: 0; z-index: 10; }
#bookBox ul li .info h3 a { margin-bottom: 30px; height: 51px; font-weight: 400; font-size: 30px; color: #222224; -webkit-line-clamp: 1; }
#bookBox ul li .info article { height: 120px; font-size: 18px; color: #000; -webkit-line-clamp: 4; }
#bookmore { margin-bottom: 3vw; }

@media screen and (max-width: 1600px) {
	#product .slick-list { padding: 0 10%; }
	#product .btn a#nextBtn { margin-left: calc((80% / 3) + 35px); }
}
@media screen and (min-width: 1281px) {
	#NewsBox ul li:hover .info p.more a span { margin: 0 0 0 20px; }
	#NewsBox ul li .info p.more a:hover font , #NewsBox ul li:hover .info p.more a font { color: #af6e52; }
	#NewsBox ul li .info p.more a:hover span:before , #NewsBox ul li .info p.more a:hover span:after , #NewsBox ul li:hover .info p.more a span:before , #NewsBox ul li:hover .info p.more a span:after { background: #af6e52; }
}
@media screen and (max-width: 1280px) {
	#bookBox ul li a.photo { margin: 0 25px; }
	#bookBox ul li a.photo img { max-width: inherit; }
}
@media screen and (max-width: 1024px) {
	#aboutBox .aboutInfo .workframe { width: 70%; }
	#product .slick-list { padding: 0 5%; }
	#bookBox { padding-bottom: 30px; }
	#bookBox ul li a.photo img { height: 45vw; }
	#bookBox ul li .info { padding: 10px 20px; width: 70%; min-height: inherit; }
}
@media screen and (max-width: 980px) {
	#product .slick-list { padding: 0 35%; }
	#product .btn a { width: 10vw; height: 10vw; left: 20%; }
	#product .btn a:after { width: 1.7vw; }
	#product .btn a#nextBtn { left: auto; right: 20%; }
}
@media screen and (max-width: 640px) {
	#aboutBox .aboutInfo .workframe { width: 90%; text-align: left; }
	#aboutBox .aboutInfo article { text-align: left; }
	#product .slick-list { padding: 0 20%; }
	#product .btn a { left: 10%; }
	#product .btn a#nextBtn { left: auto; right: 10%; }
	#NewsBox .workframe { width: 100%; }
	#bookBox ul li a.photo img { height: 55vw; }
	#bookBox ul li .info h3 a { height: 40px; font-size: 24px; }
	#bookBox ul li .info article { height: 60px; font-size: 16px; -webkit-line-clamp: 2; }
}
@media screen and (max-width: 480px) {
	#product .pro-list .slick-slide { padding-bottom: 0; }
	#product .pro-list .slick-slide.slick-current a.photo { padding-bottom: 0; }
	#bookBox ul li .info h3 a { padding-bottom: 5px; font-size: 22px; }
	#product .btn { display: none; }
	#NewsBox { margin: 15vw 0; }
}