.wrapper { width: 100%; overflow: hidden; }
/* page-form */
#page-form { background: #f2f2f2; padding: 70px 0; }
#page-form .workframe { width: min(90%,1024px); }
#page-form form,#page-form fieldset { margin: 0; padding: 0; border: 0; }
#page-form p { overflow: hidden; color: #000; font-size: 16px; margin: 8px 5px; display: inline-block; width: calc((100%/2) - 15px); }
#page-form label { float: left; width: 100px; text-align: right; padding: 5px 0; }
#page-form span { display: block; }
#page-form .ra span { width: auto; float: left; margin-left: 10px; padding: 5px 0; }
#page-form input[type="text"],#page-form select { width: 100%; padding: 15px 30px; border-radius: 50px; }
#page-form input#Checknum { width: 220px; margin-right: 10px; }
#page-form select { width: calc(100% - 1px); border: 0; -webkit-appearance: none; background: url(/images/27/arrow.png) no-repeat scroll 98% center white; background-repeat: no-repeat; background-position: 98% 50%; padding: 19px 30px; font-size: 16px; }
#page-form p.send input {background: #e09a25;color: #fff;text-align: center;width: 100%;padding: 20px 0;font-size: 14px;outline: none;cursor: pointer;border-radius: 50px;}
#page-form p.send input:hover { opacity: .8; }
#page-form h2 { text-align: center; margin-bottom: 40px; font-size: 30px; letter-spacing: 2px; font-weight: 500; }
#page-form h2 img { margin-right: 5px; vertical-align: bottom; }
#page-form h2 b { display: inline-block; font-size: 24px; color: #353535; margin-right: 10px; vertical-align: baseline; }
#page-form fieldset.btn { text-align: center; margin-top: 30px; }
#page-form fieldset.btn p { display: block; width: 20%; margin: 0 auto; }
/*小廣告*/
#ssbanner { position: relative; padding: 34px 0px; margin-bottom: 50px; margin-top: -128px; z-index: 9; }
#ssbanner .container { width: 1280px; background: #ffffff; padding: 20px 38px; border-radius: 250px; filter: drop-shadow(0 0 8px #0000002e); border: #103082 2px solid; max-width: 90%; }
#ssbanner .ssbanner-item { position: relative; margin: 0 15px; background-size: 100% auto; background-position: center; background-repeat: no-repeat; display: flex; flex-direction: column; align-items: center; }
#ssbanner .ssbanner-item .fmimg { background: #f6f6f6; padding: 18px; border-radius: 50%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#ssbanner .ssbanner-item .fmimg img { width: 56px; }
#ssbanner .ssbanner-item a { display: flex; position: relative; transition: ease .3s; flex-direction: column; align-items: center; }
#ssbanner .ssbanner-item a.fmbak { position: absolute; width: 100%; height: 100%; /* pointer-events: none; */ }
#ssbanner .ssbanner-item a:hover {   }
#ssbanner .ssbanner-item .title { position: relative; padding: 8px 15px 0; width: 100%; text-align: center; color: #1b1b1b; transition: ease .3s; font-size: max(1.2*(1vw + 1vh)/2,16px); font-weight: 600; }
#ssbanner .ssbanner-item span { font-size: max(1*(1vw + 1vh)/2,13px); display: none; }
#ssbanner .ssbanner-item a:hover .title {   }
#ssbanner .slick-slider { margin-bottom: 0px; background-size: 100% auto; background-repeat: no-repeat; background-position: center; }
#ssbanner .arrow { display: block; position: absolute; top: 50%; height: 20px; width: 20px; cursor: pointer; opacity: .5; transition: ease .3s; }
#ssbanner .arrow:hover { opacity: 1; }
#ssbanner .prev { left: 0px; transform: translateY(-50%); margin-left: 35px; background: url(/images/27/ico_arrow_prev.svg) no-repeat; }
#ssbanner .next { right: 0px; transform: translateY(-50%); margin-right: 35px; background: url(/images/27/ico_arrow_next.svg) no-repeat; }
.sectionTitle { margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-direction: column; }
.sectionTitle h2 { font-size: 32px; display: inline-block; }
.sectionTitle .btn { display: flex; margin-left: 30px; position: absolute; right: 0; }
.sectionTitle .btn a,.btn a { display: flex; font-size: 16px; transition: ease .3s; color: #000; font-weight: 400; box-sizing: border-box; width: 250px; height: 56px; line-height: 56px; border: #444444 1px solid; border-radius: 120px; align-items: center; justify-content: center; }
.sectionTitle .btn a:hover,.btn a:hover { background: #0131b9; }
.sectionTitle .btn a:hover *,.sectionTitle .btn a:hover,.btn a:hover *,.btn a:hover { color: #ffffff; }
.sectionTitle .btn a i,.btn a i { margin-right: 5px; color: #0131b9; }
.index-btn { text-align: center; display: flex; justify-content: center; }
.index-btn a { display: flex; font-size: 16px; transition: ease .3s; color: #000; font-weight: 400; box-sizing: border-box; width: 250px; height: 56px; line-height: 56px; border: #444444 1px solid; border-radius: 120px; align-items: center; justify-content: center; }
.index-btn a i { margin: 0 5px; color: #0131b9; }
.index-btn a:hover { background: #0131b9; color: #fff; }
.index-btn a:hover i { color: #fff; }
/*news*/
#NPBox { margin-bottom: 80px; }
#NPBox .sectionTitle { display: flex; align-items: flex-start; }
#newBox { box-sizing: border-box; width: 100%; }
#newBox .nwbox { display: flex; border: 1px solid #eee; margin-top: 15px; }
#newBox .nwbox:hover .news-content-title { background: #0131b9; }
#newBox .nwbox:hover { background: #e9e9e9; }
#NPBox .news-content-title { display: inline-block; margin-right: 30px; width: 124px; padding: 16px 0; background: #184d8f; font-weight: bold; text-align: center; color: #fff; font-size: 16px; }
#NPBox .new-slider { width: calc(100% - 0px); display: inline-block; margin-bottom: 0px; }
#NPBox .news-item { position: relative; display: flex; align-items: center; width: calc(100% - 150px); }
#NPBox .news-item .date { vertical-align: text-bottom; position: relative; font-family: 'Montserrat',sans-serif; margin-right: 30px; font-size: 15px; }
#NPBox .news-item h3 { width: 70%; }
#NPBox .news-item .title { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: text-bottom; font-size: 15px; font-weight: bold; width: 100%; padding: 10px 0; }
#NPBox .news-item .date::after { content: ""; position: absolute; right: -23px; width: 13px; height: 2px; background: #79551a; top: 50%; transform: translateY(-50%); }
#NPBox .news-item .more { position: absolute; right: 0px; font-size: 15px; padding-right: 15px; }
#NPBox .news-item .more::after { content: ""; position: absolute; left: -15px; height: 24px; width: 1px; background: #eee; display: inline-block; }
#NPBox .news-item .more i { padding: 0 5px; color: #0131b9; font-size: 16px; }
/*product*/
#products { position: relative; padding-bottom: 100px; padding-top: 0px; }
#products:before { content: ""; position: absolute; width: 100%; height: 140%; background: #f2f2f2; top: -100%; z-index: -1; }
#products .sectionTitle { margin-bottom: 40px; display: flex; flex-direction: column; padding-bottom: 10px; }
.products-list { display: flex; flex-wrap: wrap; justify-content: space-between; width: 99%; margin: 0px auto 80px; }
.products-list .product-item { width: 24%; display: flex; flex-direction: column; align-items: center; border: #cfcfcf 2px solid; border-radius: 20px 20px 0px 00px; margin-bottom: 10px; }
.products-list .product-item:hover { border: #0131b9 2px solid; }
.products-list .product-item:nth-child(3n) { margin-right: 0px; }
.products-list .product-item .photobox { overflow: hidden; width: 100%; border-radius: 18px 18px 0px 00px; }
.products-list .product-item a.photo { display: block; background-size: cover; width: 100%; transition: ease .6s; }
.products-list .product-item a.photo:hover { transform: scale(1.2); }
.products-list .product-item .info {   }
.products-list .product-item .title { font-size: 16px; font-weight: bold; transition: ease .3s; -webkit-line-clamp: 1; width: 100%; padding: 8px 0; }
.products-list .product-item .price { padding: 5px 0px; font-size: 14px; display: flex; align-items: center; }
.products-list .product-item .price .dollar { vertical-align: baseline; }
.products-list .product-item .saleprice .dollar { color: red; font-size: 18px; }
.products-list .product-item .old { text-decoration: line-through; }
.products-list .product-item .saleprice { padding-bottom: 4px; }
.products-list .product-item .line { margin: 0 10px; width: 1px; background: #eee; display: inline-block; height: 15px; }
.products-list .product-item .btn { text-align: right }
.products-list .product-item a.more { transition: ease .3s; padding: 3px 8px; border: 1px solid #79551a; border-radius: 11px; background-color: #fff; color: #79551a; font-size: 12px; font-weight: 700; }
.products-list .product-item:hover .title { color: #0131b9; }
.products-list .product-item a.more:hover { background: #79551a; color: #fff; }
/*about*/
#aboutBox { padding-bottom: 0px; }
#aboutBox .container { display: flex; justify-content: flex-end; position: relative; margin-top: -220px; }
#aboutBox .about-img { background-repeat: no-repeat; background-size: cover; background-position: center; }
#aboutBox .about-img img { width: 100%; aspect-ratio: 192/65; }
#aboutBox .about-info {
  width:58%;padding:60px 50px;box-sizing:border-box;/* background:url(/images/27/about-info.png) no-repeat 50% 0;*/
  margin-top:0;border-radius:20px;background-color:#ffffff;margin-right:-8%;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;
}
#aboutBox .about-info h4 { font-weight: 400; }
#aboutBox .btn { position: absolute; top: 80px; right: 0; }
#aboutBox .about-info h3 { font-family: 'Montserrat',sans-serif; font-size: 15px; color: #79551a; margin-bottom: 15px; }
#aboutBox .about-info h2 { font-size: 30px; color: #212121; margin-bottom: 20px; -webkit-line-clamp: 2; }
#aboutBox .info { -webkit-line-clamp: 3; height: 70px; margin-bottom: 20px; }
#aboutBox #SeoStarRating { margin-bottom: 20px; }
#aboutBox .btn a i {   }
#aboutBox .btn a:hover {   }
/*book*/
#bookbox { position: relative; padding-bottom: 150px; padding-top: 60px; display: flex; background-image: url(/images/27/cuimg.jpg); }
#bookbox:before { content: ""; position: absolute; width: 70px; aspect-ratio: 1/1; background: url(/images/27/money.png); background-repeat: no-repeat; background-size: cover; left: 9%; top: 2%; animation: float 5s ease-in-out infinite; }
@keyframes float {
  0% { transform: translateY(0); }
  50% { transform: translateY(-20px); }
  100% { transform: translateY(0); }
}
#bookbox:after { content: ""; position: absolute; width: 64px; aspect-ratio: 1/1; background: url(/images/27/money.png); border-radius: 50%; right: 4%; bottom: 37%; background-repeat: no-repeat; background-size: cover; animation: float 6s ease-in-out infinite; }
#bookbox .container { display: flex; flex-direction: column; }
#bookbox .container .cocnbox { display: flex; flex-wrap: wrap; }
#bookbox .container .cocnbox .conleftbox { width: 100%; display: flex; justify-content: center; margin-bottom: 30px; }
#bookbox .container .cocnbox .conrightbox { width: 100%; display: flex; flex-direction: column; }
#bookbox .swiper-container { width: 100%; }
#bookbox .sectionTitle { text-align: center; position: relative; }
#bookbox .sectionTitle h2 { position: relative; }
#bookbox .sectionTitle b { font-family: 'Nothing You Could Do',cursive; font-family: 'Italianno',cursive; position: absolute; left: -20px; width: 100%; height: 100%; display: block; top: -95px; font-size: 150px; line-height: 197px; text-align: center; font-style: italic; transform: rotate(-9deg); font-weight: 400; letter-spacing: 10px; color: rgba(239,231,218,0.5); z-index: -1; }
#bookbox .index-btn { margin-bottom: 30px; }
#bookbox .swiper-wrapper {   }
.book-item>div { position: relative; display: flex; flex-direction: column; align-items: center; margin: 0 10px; }
.book-item>div a.photo { width: 100%; display: flex; flex-direction: column; border-radius: 50%; }
.book-item>div a.photo img { aspect-ratio: 1/1; }
.book-item .info { margin-top: 15px; width: 100%; margin-left: 0; display: flex; flex-direction: column; }
.book-item .info a.title { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; transition: ease .3s; line-height: 1; opacity: 1; font-size: max(1.5*(1vw + 1vh)/2,18px); color: #595959; font-weight: bold; width: 100%; text-align: center; margin-bottom: 17px; }
.book-item .info a.btn { display: block; font-size: 16px; background: #fbf8f0; transition: ease .3s; color: #000; font-weight: bold; box-sizing: border-box; width: 180px; padding: 15px; margin-top: 45px; opacity: 0; }
.book-item .info a.btn i { margin: 0 5px; color: #79551a; }
.book-item .info a.btn:hover i { color: #fff; }
.book-item .info a.btn:hover { background: #79551a; color: #fff; }
.book-item.swiper-slide-active .info a.btn,.book-item.swiper-slide-active .info a { opacity: 1; }
#bookbox .book-content { width: 100%; }
#bookbox .book-bg { position: relative; }
#bookbox .book-bg::after { z-index: -1; position: absolute; top: 50px; left: 0; width: 100%; height: 100%; background: linear-gradient(270deg,#efe7da,#efe7da 70%,#fff 0,#fff); content: ""; }

/*otherset*/
#other-content { padding-bottom: 80px; }
#other-content.noneCI { display: none; }
.other-set .item { position: relative; }
.other-set .item article { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; padding: 47px 58px 52px; display: flex; align-items: center; justify-content: space-between; color: #fff; }
.other-set .item article .othertitle { width: 30%; }
.other-set .item article .othertitle p { font-size: 24px; font-weight: bold; -webkit-line-clamp: 3; line-height: 1.2; }
.other-set .item article font { width: 40%; font-weight: bold; -webkit-line-clamp: 5; }
.other-set .item article .index-btn { width: 180px; }
.other-set .item article .index-btn a { width: 100%; height: 43px; line-height: 43px; font-size: 14px; }
.other-set a.photo { position: relative; }
.other-set a.photo::after { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.52) }
.other-set .swiper-slide { opacity: 0 !important; }
.other-set .swiper-slide-active { opacity: 1 !important; }

@media screen and (max-width: 1680px) {
	#NPBox .news-item h3 { width: 60%; }
}

@media screen and (max-width: 1470px) {
	.book-item .info a.title {   }
	#ssbanner .container { width: 980px; }
}

@media screen and (max-width: 1280px) {
	#ssbanner .container { width: 83%; }
	.products-list .product-item { width: 31%; }
	#aboutBox .btn { position: relative; top: 0; display: flex; flex-direction: column; align-items: center; }

}

@media screen and (max-width: 1100px) {
	.products-list .product-item { margin-right: 25px; }
}

@media screen and (max-width: 1024px) {
	.sectionTitle h2 { font-size: 30px; }
	.index-btn a { width: 250px; }
	#NPBox .news-item h3 { width: 55%; }
	.book-item .info a.btn { width: 120px; padding: 10px; font-size: 14px; }
	#aboutBox .about-info { padding: 30px 40px; }
	#aboutBox .about-info h2 { font-size: 26px; }
	.book-item .info a.title {   }
	#bookbox .book-bg::after { height: 90%; }
	.other-set .item article .index-btn { width: 120px; }
	.other-set .item article .othertitle p { font-size: 20px; }
}

@media screen and (max-width: 940px) {
	#NPBox .news-content-title { margin-right: 15px; }
	#NPBox .news-item .more { padding-right: 10px; }
	#NPBox .news-item h3 { width: 50%; }
	.products-list .product-item { margin-right: 20px; }
	#aboutBox .about-img { min-height: 280px; }
	#aboutBox .info { margin-bottom: 40px; }
}

@media screen and (max-width:768px) {
	#bookbox { padding-bottom: 80px; }
	#bookbox .container { width: 85%; }
	#ssbanner .container { width: 100%; max-width: 100%; background: unset; border: none; }
	#ssbanner { margin-top: 0; margin-bottom: 20px; background: #e2e2e2; padding: 3px 0; }
	#NPBox .news-item .more { display: none; }
	#products:before { height: 115%; }
	#aboutBox { padding-bottom: 20px; }
	#aboutBox .about-info { width: 65%; padding: 30px; }
	#aboutBox .container { margin-top: 0; display: flex; justify-content: center; width: 100%; }
	#aboutBox .about-img { background-position: 7% 50%; }
	.products-list { justify-content: space-between; width: 90%; }
	.products-list .product-item { width: 47%; margin-right: 0px; margin-bottom: 20px; }
	.book-item .info { margin-top: 95px; }
	#ssbanner .prev { margin-left: -20px; }
	#ssbanner .arrow { margin-right: -20px; }
}
@media screen and (max-width:640px) {
    #page-form fieldset.btn p{width:50%}
	#page-form p {width: 100%;}
	#newBox { padding: 16px; }
	#NPBox .new-slider { width: 100%; }
	#NPBox .news-item h3 { width: calc(100% - 110px); }
	#NPBox .news-content-title { display: none; }
	#NPBox .sectionTitle { margin-bottom: 0px; padding: 5px 0 5px 16px; display: flex; flex-direction: column; align-items: center; }
	.sectionTitle .btn { position: absolute; bottom: -75px; margin-left: 0; right: auto; }
	#NPBox .sectionTitle .btn a,#NPBox .sectionTitle .btn a i {   }
	#NPBox .sectionTitle .btn a { display: flex; font-size: 16px; transition: ease .3s; font-weight: bold; box-sizing: border-box; width: 250px; height: 56px; line-height: 56px; border: #444444 1px solid; border-radius: 120px; align-items: center; justify-content: center; }
	#NPBox { margin-bottom: 115px; }
	.book-item>div a.photo { width: 100%; }
	.book-item .info { width: 100%; float: inherit; margin: 45px 0px 0px; }
	.book-item .info a.btn { margin-top: 20px; }
	#bookbox .book-bg::after { height: 100%; background: linear-gradient(270deg,#efe7da,#efe7da 85%,#fff 0,#fff); }
	.other-set a.photo { min-height: 250px; background-size: cover; }
	.other-set .item article { display: block; }
	.other-set .item article .othertitle,.other-set .item article font,.other-set .item article .index-btn { width: 100%; }
	.other-set .item article .othertitle p { text-align: center; -webkit-line-clamp: 2; }
	.other-set .item article font { -webkit-line-clamp: 3; text-align: center; padding: 15px 0px; }
	.other-set .item article .index-btn { position: absolute; left: 0px; bottom: 35px; }
	.other-set .item article .index-btn a { width: 70%; }
	#aboutBox .about-info { width: 100%; margin-top: 0; padding: 26px 10px; margin-right: 0; }
	#NPBox .news-item { width: 100%; }
}
@media screen and (max-width:540px) {
	.sectionTitle h2 { font-size: 26px; }
}
@media screen and (max-width:480px) {
	.sectionTitle h2 { font-size: 24px; }
	.products-list .product-item { width: 100%; }
	#bookbox .sectionTitle b { font-size: 120px; }
	#ssbanner .arrow { display: none !important; }
	#NPBox .news-item { display: block; }
	#NPBox .news-item .date,#NPBox .news-item h3 { display: block; }
	#NPBox .news-item h3 { width: 100%; }
	#NPBox .news-item .date::after { display: none; }
}
@media screen and (max-width:375px) {
	#bookbox .sectionTitle b { font-size: 100px; }
}