@import url('/css/community.css');
.wow {animation-name: fadeInUp;-webkit-animation-name: fadeInUp;}
.wrap h1 { line-height: 150%; }
/* sbanner */
#sbanner {position: absolute;z-index: 0;width: 100%;}
#sbanner a {position: relative;z-index: 1;width: 100%;overflow: hidden;}
#sbanner a img{width: 100%;aspect-ratio: 13/3;}
/* wrap */
.wrap  {position: relative;margin-bottom: 12vh;z-index: 2;}
.wrap h1 { line-height: 150%; }
.workframe{width: 100%;position: relative;margin-bottom: 12vh;margin-top: 14vh;z-index: 2;width: min(1600px, 90%);}
.wrap:before{position: absolute;content:"";background:url(/images/42/leaf01.png);width: 13vw;aspect-ratio: 75/36;background-size: cover;z-index: 5;left: -9vw;}
/* waylink */
.waylink {display: inline-block;width: 100%;z-index: 3;}
.waylink ol {font-size: 0;text-align: center;background: #ffffff;padding: 8px 0;margin-bottom: 20px;}
.waylink ol li {display: inline-block;font-size: 14px;color: #999999;text-align: center;}
.waylink ol li a {color: #999999;font-size: 14px;}
.waylink ol li:after {margin: 0 10px;display: inline-block;color: #999999;content: "/";}
.waylink ol li:last-child {}
.waylink ol li:last-child:after { content: ""; }
.contentMain#listk_book aside ul li{width:100%;border:none;margin:0;padding:0}
.contentMain#listk_book{display:flex;flex-direction:column}
.contentMain#listk_book  aside{display:flex;width:100%}
.contentMain#listk_book aside ul{display:grid;grid-template-columns:repeat(5,1fr);width:100%;gap:10px}
.contentMain#listk_book aside ul li a{padding:20px;border-radius:6666px;border:#f1f1f1 1px solid;display:flex;align-items:center;justify-content:space-around}
.contentMain#listk_book aside ul li a:hover{background:#517a85;color:aliceblue}
.contentMain#listk_book aside ul li a:hover .fa{color:white}

/* bgTxt */
.bgTxt {position: relative;z-index: 1;}
.bgTxt.title {text-align: center;}
.bgTxt.title h1 , .bgTxt.title h3 {color: #54595f;margin-top: -3px;}
.bgTxt.title h1 {color: #636363;font-size: 40px;font-weight: 200;text-align: center;line-height: 130%;}
.bannerwrap{position: relative;width: 100%;height: 340px;display: flex;justify-content: center;align-items: center;margin-top: 95px;overflow: hidden;}
.bannerwrap .bgTxt.title,.bannerwrap .bgTxt.title h3{color: #ffffff;}
.bgTxt.title h1.white{color: white;}
.bannerwrap:before{content:"";position: absolute;background: url(/images/42/inner_top_bg.png);aspect-ratio: 1920/142;bottom: 0;width: 100%;z-index: 5;background-size: cover;}
/* contentMain */
.contentMain {position: relative;}
.contentMain article{color: #6D6D6D;margin-bottom: 0;}

/* sideNav */
#sideNav ul.Cate{text-align: center;}
#sideNav #sideMenu {width: 90%;margin: 0 auto;margin-top: 28px;padding: 8px 20px;display: none;font-size: 18px;color: #fff;background: #d7a297;border-radius: 7px;}
#sideNav #sideMenu font , #sideNav #sideMenu span {margin-right: 15px;display: inline-block;vertical-align: middle;}
#sideNav #sideMenu span i {margin: 2px 0;width: 3px;height: 3px;background: #ffffff;border-radius: 50%;display: block;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;}
#sideNav #sideMenu span.open i:nth-child(2) { margin: 2px 5px; }
.catBox {position: relative;z-index: 2;margin-top: 30px;}
.fixTop { position: fixed; width: 1420px; top: -15px; }
.fixTop.showheader { top: 50px; }
#sideNav >ul >li {position: relative;display: inline-block;border-radius: 666px;border: #c8c8c8 1px solid;}
#sideNav >ul >li.action{background: #D1C3A9;}
#sideNav >ul >li.action >.h3 a{ color: #fff; }
#sideNav >ul >li >.h3 {display: block;}
#sideNav >ul >li >.h3 a {display: inline-block;padding: 5px 15px;border-radius: 6666px;}
#sideNav >ul >li >.h3 a:hover{background: #D1C3A9;color: #fff}
#sideNav >ul >li b[data-action="sideOpen"] { display: none; }
#sideNav >ul >li >ul.subUL {overflow: hidden;position: absolute;left: calc(50% - 100px);width: 200px;height: 0;background: #d7a297;opacity: 0;}
#sideNav >ul >li:hover >ul.subUL { height: auto; opacity: 1; }
#sideNav >ul >li >ul.subUL li a { display: block;text-align: left; padding: 10px 20px; color: #fff;}
#sideNav >ul >li >ul.subUL li a:hover { background: #eae6df}
#sideNav >ul >li >ul.subUL li ul.sub2UL {background: #D1C3A9; }


/* artlsit */
#artlsit ul{font-size: 0;}
#artlsit ul li {width: calc((100% / 4) - 25px);display: inline-block;overflow: hidden;margin: 18px 10px;border: 1px solid #537c86;}
#artlsit ul li .img {position: relative;overflow: hidden;}
#artlsit ul li .img img{aspect-ratio: 5/6;}
#artlsit ul li .img a.photo { -webkit-transform: translate(0) scale(1); transform: translate(0) scale(1); }
#artlsit ul li .img p.cate{position: absolute;top: 0px;left: 0;padding: 10px 30px;text-align: center;background: #507a84;color: #fff;}
#artlsit ul li .info {padding: 20px 20px 5px;}
#artlsit ul li .info h3 {height: 35px;font-size: 25px;color: #6D6D6D;-webkit-line-clamp: 1;text-align: center;}
#artlsit ul li .info article {height: 43px;font-size: 14px;color: #6D6D6D;-webkit-line-clamp: 2;margin: 12px 0 28px;}
#artlsit ul li .info .price{padding-bottom: 10vh;}
#artlsit ul li .info .price span{display: inline-block;color: #6D6D6D;font-size: 16px;}
#artlsit ul li .info .price span.old {float: left;}
#artlsit ul li .info .price span.new {float: right;}
#artlsit ul li .info .price font{color: #D1C3A9;font-size: 18px;}
#artlsit ul li .info .price .old font { text-decoration: line-through;}

/* content */
#content .articlebar {margin: 13px 0 0px;}
#content .articlebar font{font-size: 1.2rem;color: #D1C3A9;}
#content h1{text-align: left;-webkit-line-clamp: 1;margin-bottom: 30px;border-bottom: 1px solid #d1c3a9;color: #666666;font-size: 31px;font-weight: 100;padding: 10px 0px 10px 0px;}
#content #describe{margin: 0 auto;width: 100%;}
#content h1.entry-title{background: #f4f1eb;padding: 10px 10px 13px;font-size: 20px;font-weight: 400;}
#content .bottomitle{font-weight: 500;}
#content .bottomitle a{color: #cdbea5;font-weight: 500;}
.innerboxJ{width: min(1280px , 90%);margin: 0 auto;}

.sharestyle .nametitle{
    font-size: max(2*(1vw + 1vh) / 2,17px);
    font-weight: 400;
    margin-bottom: 20px;
}


/* faqList */
#faqList li {margin-bottom: 10px;border-bottom: 1px solid #efeff0;}
#faqList li .title {position: relative;padding: 5px 65px 15px 25px;display: block;}
#faqList li .title font {color: #686868;}
#faqList li .title span {position: absolute;width: 17px;height: 17px;display: block;top: calc((100% - 30px) / 2);right: 25px;background: #D1C3A9;border-radius: 5px;padding: 2px 0px 3px 6px;}
#faqList li .title span:before , #faqList li .title span:after {width: 12px;height: 1px;background: #ffffff;display: block;content: "";-webkit-transform: translateY(9px);transform: translateY(9px);}
#faqList li .title span:after { -webkit-transform: translateY(8px) rotate(90deg); transform: translateY(8px) rotate(90deg); }
#faqList li .info {padding: 25px 50px 20px;background: #efeff0;color: #686868;font-size: 14px;line-height: 1.8;-webkit-transition: none;-moz-transition: none;-ms-transition: none;-o-transition: none;transition: none;}
#faqList li.current .title span:after { -webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transform: translateY(8px) rotate(180deg); transform: translateY(180deg) rotate(0); }

/* page-control */
#page-control{padding: 14vh 0 0;}
#page-control a {position: absolute;bottom: 58px;font-size: 14px;color: #D1C3A9;border: 1px solid #D1C3A9;padding: 5px 15px;vertical-align: middle;border-radius: 5px;display: flex;align-items: center;}
#page-control a.page-prev{left: 0;}
#page-control a.page-next{right: 0;}
#page-control a font{color: #6D6D6D;font-size: 12px;vertical-align: top;}
#page-control a:hover {background: #dbd0bc;color: #fff;}

/* pagenav */
#pagenav { margin: 30px 0 0; text-align: center; }
#pagenav a , #pagenav strong {width: 40px;height: 40px;display: inline-block;text-align: center;line-height: 37px;font-size: 18px;color: #D1C3A9;vertical-align: middle;border: 1px solid #D1C3A9;margin-left: 10px;}
#pagenav a { opacity: .5; }

/* form1 */
#form1 { font-size: 0; }
#form1 p { margin: 10px 20px; width: calc(100% - 40px); display: inline-block; vertical-align: text-bottom; }
#form1 p.col-2 {width: calc(50% - 30px);margin: 10px 0px 10px 20px;}
#form1 p.col-3 { width: calc((100% / 3) - 40px); }
#form1 p.col-4 { width: calc(25% - 40px); }
#form1 p.col.col-2.emailInfo{width: calc(100% - 40px);}
#form1 p label {margin-bottom: 5px;display: block;font-weight: 500;color: #404040;margin-bottom: 0.4em;font-size: 1.1em;}
#form1 p label b { margin-left: 5px; color: #D1C3A9; }
#form1 p input , #form1 select , #form1 textarea {width: calc(100% - 30px);border: 1px #e4e4e4 solid;display: block;padding: 15px 25px;border-color: #5a828c;border-radius: 4px;color: #5a828c;font-size: 17px;}
#form1 textarea{width: calc(100% - 50px);}
#form1 p select {padding: 20px 25px;width: calc(100% - 30px);}
#form1 p input#Checknum {margin-right: 10px;width: 173px;display: inline-block;}
#form1 p.send {text-align: center;width: auto;display: flex;justify-content: center;}
#form1 p.send a{color: #fff;border: 1px solid #537c87;background: #537c87;padding: 0;display: flex;justify-content: center;align-items: center;padding: 15px 60px;width: 30%;}
#form1 p.send a *{color:white;}

.babastyle{
    position:relative;
    width:100%;
    padding:30px 40px;
    background:#f6f6f6;
    border-radius:3px;
    outline:1px solid rgb(0 0 0 / 15%);
    outline-offset:-15px;
    margin:30px 0 10px;
    aspect-ratio:12 / 2;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    color:#1a2c70;
    font-size: max(1.2 * (1vw + 1vh) / 2, 16px);
    color: #57808a;
    }
.babastyle:before{content:"”";font-size: 77px;position:absolute;top: -20px;right: 12px;line-height:100%}

.matitleJ{font-size: max(1.6 * (1vw + 1vh) / 2, 18px);font-weight: 400;color: #527b84;}

@media screen and (max-width: 1470px) {
	.wrap  {width: 90%;margin-top: 11vh;}
}
@media screen and (min-width: 1281px) {	
	#artlsit ul li:hover .img a.photo { -webkit-transform: translate(0) scale(1.1); transform: translate(0) scale(1.1); }
	#artlsit ul li .info .cate a:hover , #artlsit ul li .info h3 a:hover { opacity: .6; }
}
@media screen and (max-width: 1280px) {
	.waylink {top: 95px;}
	.wrap {margin-top: 100px;margin-bottom: 7vh;}
	.wrap:before{width: 21vw;top: 40px;}
}
@media screen and (max-width: 980px) {
	.contentMain#listk_book aside ul{grid-template-columns: repeat(3, 1fr);}
	#sideNav #sideMenu { display: block; }
	#sideNav >ul.open>li >h3 a{width: 65%;padding: 12px 12px 12px 50px;border: none;color: #D1C3A9;}
	#sideNav >ul {position: relative;overflow: hidden;width: 95%;margin: 0 auto;height: 0;background: #ffffff;box-shadow: 0 7px 15px #f0d8d370;opacity: 0;left: 0;}
	#sideNav >ul.open {height: auto;opacity: 1;z-index: 1;width: 90%;}
	#sideNav >ul >li {display: block;border: 0.5px solid #f0d8d33b;border-radius: 5px;}
	#sideNav >ul >li.action{background: rgb(240 216 211 / 0.2);}
	#sideNav #sideMenu font, #sideNav #sideMenu span{color:white;}
	#sideNav >ul >li.action >.h3 a{color:#525252;}
	#sideNav >ul >li >.h3 a:hover{ background: none; color: #D1C3A9;}
	#sideNav >ul >li >ul.subUL {position: relative;width: 100%;left: 30px; padding: 2vh 0 3vh; background: none;-webkit-transition: none;transition: none; height: auto; display: none;}
	#sideNav >ul >li.action >ul.subUL {height: auto;opacity: 1;transition: none;}
	#sideNav >ul >li >ul.subUL li a {text-align: left;color: #D1C3A9;}
	#sideNav >ul >li >ul.subUL li .subULHead p {display: inline-block; }
	#sideNav >ul >li b[data-action="sideOpen"] {padding: 9px 16px 9px 0;display: inline-block;color: #D1C3A9;float: right;}
	#sideNav >ul >li >ul.subUL li ul.sub2UL { overflow: hidden; height: 0; border-bottom: 0; opacity: 0; }
	#sideNav >ul >li >ul.subUL li.action ul.sub2UL {height: auto;opacity: 1;background: none;margin-left: 30px;}
	#artlsit ul li{width: calc((100% / 2) - 25px);}
	#form1 p.col-2 , #form1 p.col-3 { width: calc(100% - 40px); }
	#form1 p.col-4 { width: calc(50% - 40px); }
	#form1 p.send { text-align: center; }
	#content h1{font-size: 22px;}
}
@media screen and (max-width: 765px) {
    #page-control a {position: relative;width: 90%;display: inline-block;margin-bottom: 20px;max-height: initial;overflow: hidden;-webkit-line-clamp: 1;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
    #page-control a.page-prev{ text-align: left}
    #page-control a.page-next{text-align: right}
	.bgTxt.title h3{font-size: 32px;}
	.bannerwrap{height: auto;margin-top: 120px;padding-bottom: 70px;}
	#sbanner a{height: 30vh;}
	
}
@media screen and (max-width: 640px) {
	.contentMain#listk_book aside ul{grid-template-columns: repeat(2, 1fr);margin-bottom: 15px;}
	#artlsit ul li{width: 95%;margin: 0 auto;margin-bottom: 6vh;}
	#artlsit ul li .info article a {margin: 12px 0 5px;}
	#form1 p.col-4 { width: calc(100% - 40px); }
	.bgTxt.title h3{font-size: 23px;}
	.wrap {margin-top: 100px;margin-bottom: 6vh;}
	.waylink ol{margin-bottom: 0px;}
	.bannerwrap{height: auto;margin-top: 90px;padding-bottom: 0;}
	.wrap:before{width: 21vw;top: 15vw;}
}