/* a.more */
a.more { margin-top: 15px; padding: 5px 30px; background: #404040; border-radius: 20px; display: inline-block; color: #fff; }
a.more i { margin-left: 6px; vertical-align: baseline; }

/*start*/
#SeoStarRating{
	padding-top: 30px;
}

/*parallax*/
#parallax{
	height: 382px;
	background-image: url(/images/13/parallax1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	position: relative;
}
#parallax .parallaxTit{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 45%;
    height: 100px;
    background: #0a09098f;
}
#parallax .parallaxTit p{
	color: #fff;
    text-align: center;
    font-size: 50px;
    height: 100px;
    line-height: 100px;
}

/* aboutBox */
#aboutBox{overflow: hidden;}
#aboutBox .workframe { margin-top: -20px; z-index: 100; }

#aboutBox .firstBox { overflow: hidden; width: 100%; background: url(/images/13/material-op60.png) #000980 center; border-radius: 20px 20px 0 0; box-shadow: 0 0 10px 5px rgba(0,0,0,.05); }
#aboutBox .firstBox:before { position: absolute; width: 380px; height: 408px; background: url(/images/13/pic-menu-img-2.png) no-repeat; background-size: 100% auto; display: block; left: 0px; top: 55px; z-index: 10; content: ""; }
#aboutBox .firstBox .iconBox p { position: absolute; width: 55px; animation: triangle 2s infinite cubic-bezier(.455,.03,.515,.955); }
#aboutBox .firstBox .iconBox p:nth-child(1) { top: 80px; right: calc(25% + 55px); animation-delay: .35s; }
#aboutBox .firstBox .iconBox p:nth-child(2) { top: 110px; right: -20px; animation-delay: .7s; }
#aboutBox .firstBox .iconBox p:nth-child(3) { width: 35px; top: 290px; right: -50px; animation-delay: 1.4s; }
#aboutBox .firstBox .iconBox p:nth-child(4) { width: 40px; top: 130px; right: 25%; animation-delay: 1.05s; }

#aboutBox .item { position: relative; float: left; }
#aboutBox .item article { padding: 	60px; }
#aboutBox .item h3 { margin-bottom: 20px; font-size: 18px; }
#aboutBox .item font { display: block; }

#aboutBox .item.c1 { width: 33%; background: url(/images/13/material-op60.png) #000980 center; color: #fff; }
#aboutBox .item.c1 article { animation-name: fadeInLeft; -webkit-animation-name: fadeInLeft; }
#aboutBox .item.c1 h3 , #aboutBox .item.c1 font { text-align: center; }

#aboutBox .item.c2 { width: calc(67% + 0.01px); background: url(/images/13/img-customBg.jpg) #2c95e6 center; }
#aboutBox .item.c2 .box { padding-bottom: 15px; float: left; width: calc(50% + 0.01px); background: #fff; }
#aboutBox .item.c2 .box:first-child { padding-bottom: 0; width: 100%; background-position: right bottom; background-repeat: no-repeat; background-size: 50% auto; background-color: #fff; }
#aboutBox .item.c2 .box:first-child article { width: calc(50% - 120px); animation-name: fadeInRight; -webkit-animation-name: fadeInRight; }
#aboutBox .item.c2 .box:first-child h3 { color: #9f8138; }
/*#aboutBox .item.c2 .box:nth-child(2) { width: 50%; background: url(/images/13/img-customBg.jpg) #2c95e6 center; color: #fff; }*/
#aboutBox .item.c2 .box:nth-child(2) article { animation-name: fadeInDown; -webkit-animation-name: fadeInDown; }
#aboutBox .item.c2 .box:nth-child(3) article { animation-name: fadeInUp; -webkit-animation-name: fadeInUp; }

#aboutBox .item.c3 { overflow: hidden; padding: 60px 0; float: none; background: #1c243a; }
#aboutBox .item.c3 p { position: relative; text-align: center; font-size: 16px; color: #909090; z-index: 2; }
#aboutBox .item.c3 p a { margin-bottom: 15px; padding: 10px 50px; background: #fff; border-radius: 40px; display: inline-block; font-weight: bold; font-size: 18px; color: #2456b7; }
#aboutBox .item.c3 .bgBox { position: absolute; top: -110%; left: -150px; animation: bgWhirligig 80s infinite linear; z-index: 1; }
#aboutBox .item.c3:after { position: absolute; width: 100%; height: 25px; background: url(/images/13/img-wave-shadow-inset.png) left top repeat-x; bottom: 0; left: 0; content: ""; z-index: 3; }

/* NPBox */
#NPBox { overflow: hidden; position: relative; margin-top: 30px; }
#NPBox h2 , #bookBox h2 { margin-bottom: 15px; font-size: 25px; color: #9f8138; }

#NPBox .product { position: relative; }
#NPBox .product:before { position: absolute; width: 100%; height: 100%; background: url(/images/13/productBg.svg) no-repeat 0 bottom; background-size: 2000px auto; top: -20px; left: 0; content: ""; z-index: 10; }
#NPBox .product #productBox { position: relative; margin-top: 20px; padding: 30px; background-repeat: no-repeat; background-color: #fff; background-size: cover; border-radius: 0 0 20px 20px; box-shadow: 0 0 10px 5px rgba(0,0,0,.05); z-index: 11; }
#NPBox .product #productBox:before { position: absolute; width: 100%; height: 17px; background: url(/images/13/img-wave-shadow-outset.png) repeat-x left bottom; top: -17px; left: 0; z-index: 50; content: ""; }
#NPBox .product #productBox .pro-list p , #NPBox .product #productBox .pro-list h3 { margin: 10px; }
#NPBox .product #productBox .pro-list a.photo img ,
#NPBox #leftPhoto .box a.photo img ,
#bookBox .item .bookList ul li a.photo img { width: 100%; }
#NPBox .product #productBox .pro-list h3 , #NPBox #newBox h3 { }
#NPBox .product #productBox .pro-list h3 a { font-size: 18px; color: #333; }
#NPBox .product #productBox .pro-list .slick-list p.price { display: block; color: #3f3f3f; font-size: 18px; }
#NPBox .product #productBox .pro-list .slick-list p.price span.old { margin-right: 10px; font-size: 15px; text-decoration: line-through; color: #858585; }
#NPBox .product #productBox .pro-list .slick-list p.price b { font-size: 20px; margin: 0 2px 0 10px; color: #e42d2d; }
#NPBox .product #productBox .pro-list .slick-list p.price span.old b { font-size: 15px; font-weight: normal; margin: 0; color: #858585; }
#NPBox .product #productBox .readM { text-align: center; }

#NPBox .bgBox { position: absolute; top: 3%; right: 5%; animation: bgWhirligig-2 80s infinite linear; z-index: 1; }

#NPBox #newBox { position: relative; margin: 55px 0; width: 60%; z-index: 2; }
#NPBox #newBox p , #NPBox #newBox h3 , #NPBox #newBox a { overflow: hidden; margin-bottom: 10px; color: #404040; }
#NPBox #newBox h3 a { font-size: 18px; }

#NPBox #newBox p.describe { height: 50px; -webkit-line-clamp: 2; }
#NPBox #newBox .readM a { background: #404040; color: #694e14; }
#NPBox #newBox .readM a span,
#NPBox #newBox .readM a i{color: #fff}

#NPBox #leftPhoto { padding: 60px 0px; overflow: hidden; position: relative; z-index: 2; }
#NPBox #leftPhoto:before , #NPBox #leftPhoto:after { position: absolute; width: 100%; height: 9px; background: url(/images/13/header-white-wave.svg) left top repeat-x; bottom: 150px; left: 0; z-index: 1; content: ""; }
#NPBox #leftPhoto .workframe { z-index: 2; }
#NPBox #leftPhoto .box { overflow: hidden;border-radius: 50%; margin: 15px 10px; float: left; width: calc((100% / 4) - 20px); }
#NPBox #leftPhoto:after { height: 150px; background: #fff; bottom: 0; }

#NPBox #leftPhoto .bounceInUp:nth-child(1){
	animation-delay: .1s;
}
#NPBox #leftPhoto .bounceInUp:nth-child(2){
	animation-delay: .3s;
}
#NPBox #leftPhoto .bounceInUp:nth-child(3){
	animation-delay: .5s;
}
#NPBox #leftPhoto .bounceInUp:nth-child(4){
	animation-delay: .7s;
}


#NPBox #leftPhoto .box a.photo{
	transition: all .5s;
	background-size:cover;
}
#NPBox #leftPhoto .box:hover a.photo{
	transform: scale(1.2);
}
/* bookBox */
#bookBox { margin-top: 50px; }
#bookBox h2 { text-align: center; color: #2b3f70; }
#bookBox .readM { text-align: center; }
#bookBox .item { overflow: hidden; margin-top: 20px; background: url(/images/13/material-op50.png) #f7f7f7 center; }
#bookBox .item > div , #bookBox .item .bookList ul li { float: left; width: 50%; }
#bookBox .item .bookList ul { overflow: hidden; }
#bookBox .item .bookList ul li { width:  calc(100% / 3); }
#bookBox .item .bookList ul li:nth-child(2n) { background:  #fff; }
#bookBox .item .bookList ul li a.photo { position: relative; background-size: cover; }
#bookBox .item .bookList ul li a font { position: absolute; padding: 0 10px; width: calc(90% - 20px); height: 36px; background: rgba(26, 37, 62, 0.7); display: block; text-align: center; line-height: 200%; font-size: 18px; color: #fff; left: 5%; bottom: 20px; -webkit-line-clamp: 1; }

/* transform */
@keyframes triangle { 0% , 100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
@keyframes triangle-sm { 0% , 100%{ transform: translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes bgWhirligig { 0% { transform: rotate(360deg); } 100% { transform: rotate(0); } }
@keyframes bgWhirligig-2 { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
@media screen and (max-width: 1164px) {
	#aboutBox .firstBox:before{
		width: 320px;
	}
	#parallax .parallaxTit{
		width: 40%;
		height: 70px;

	}
	#parallax .parallaxTit p{
		height: 70px;
		font-size: 32px;
		line-height: 70px;
	}
}
@media screen and (max-width: 1024px) {
	#aboutBox { overflow: hidden; }
	#bookBox .item > div { width: 100%; }
}
@media screen and (max-width: 960px) {
	#aboutBox .item.c1{
		height: 180px;
	}
	#parallax .parallaxTit{
		width: 300px;
	}
	#parallax .parallaxTit p{
		height: 70px;
		line-height: 70px;

		font-size: 24px;
	}
	#aboutBox .item.c1 , #aboutBox .item.c2 , #NPBox #newBox { width: 100%; }
	#aboutBox .item.c1 h3 , #aboutBox .item.c1 font { text-align: left; }
	#aboutBox .firstBox:before { width: 206px; top: 40px; bottom: auto; }
	#aboutBox .item.c2 .box:first-child { background-image: none !important; }
	#aboutBox .item.c2 .box:first-child article { padding-top: 60px; width: calc(100% - 120px); background-color: rgba(255, 255, 255, 0.37); }
	#NPBox .bgBox { top: 0; }
	#NPBox #leftPhoto:before { bottom: 100px; }
	#NPBox #leftPhoto:after { height: 100px; }
}
@media screen and (max-width: 480px) {
	#aboutBox .item.c1{height: 0px;}
	#aboutBox .item article{padding: 0px 60px;}
	#aboutBox .firstBox:before , #aboutBox .firstBox .iconBox { display: none; }
	#aboutBox .item.c2 .box , #aboutBox .item.c2 .box:nth-child(2) { width: 100%; }
	#NPBox #leftPhoto .box { width: calc((100% / 2) - 20px); }
	#bookBox .item .bookList ul li { width: calc(100% / 2); }
}
@media screen and (max-width: 450px) {
}