@import url('/css/community.css');

/* sub_banner */
#sub_banner{margin-top:64px}
#sub_banner #banner_box{width:100%;height:100%;top:0;left:0}
#sub_banner #banner_box img{height:100%}


/* page_title */
#page_title{height:400px}
#page_title .workframe{margin:auto}
#page_title .pag_tit{line-height:100%;letter-spacing:.15em;font-size:29px;color:#1e1e1e}


/* waylink */
.waylink ol{padding-top:5px}
.waylink ol li,.waylink ol li a{letter-spacing:.1em;font-weight:300;font-size:14px;vertical-align:bottom;color:#515151}
.waylink ol li:after{margin:0 10px;display:inline-block;font-weight:100;font-size:12px;color:#7d7d7d;content:"/"}
.waylink ol li:last-child:after{margin:0;content:""}


/* wrap */
#wrap{padding:60px 0;min-height:350px;z-index:4;background-image:url(/images/43/innerBG-1.jpg),url(/images/43/innerBG-2.jpg);background-position:100% 0%,100% 100%;background-repeat:no-repeat}
#wrap .list_box li .img_cover{height:350px}
#wrap ul.list_box{display:flex;flex-wrap:wrap}
#wrap .list_box li{margin-bottom:30px;border:#e7e7e7 1px solid;padding:20px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;width:calc(33.3% - 10px);display:flex;flex-direction:column;border-radius:10px;margin-right:5px;margin-left:5px}


/* aside */
aside{margin-bottom:60px;z-index:5;display:none}
aside ul li b{padding:5px 10px 5px 5px}
aside ul li b .fa:before{content:"\f107"}
aside>ul>li{position:relative;display:inline-block}
aside>ul>li h4{padding:0 15px}
aside>ul>li h4 a{padding:10px 5px;font-weight:500;font-size:18px;letter-spacing:.15em}
aside>ul>li.action h4 a,aside>ul>li.action h4 i{color:var(--triadic1)}
aside>ul>li .subUL{position:absolute;margin-top:10px;width:180px;background:var(--white);left:calc((100% - 180px) / 2)}
aside>ul>li .subUL>li{border-bottom:1px rgba(var(--gray-rgb),.1) solid}
aside>ul>li .subUL>li a{padding:3px 15px;display:block;line-height:140%;font-weight:300}
aside>ul>li .subUL>li .subULHead a{padding:10px 15px;color:var(--black);font-weight:400}
aside>ul>li .subUL>li b{display:none}
aside>ul>li .sub2UL{margin:0 10px 10px}
aside>ul>li[data-type="1"]{overflow:hidden}
aside>ul>li[data-type="1"] .subUL{box-shadow:0 0 15px rgba(var(--black-rgb),0);opacity:0;z-index:-1}
aside>ul>li[data-type="2"]{overflow:visible}
aside>ul>li[data-type="2"] .subUL{box-shadow:0 0 15px rgba(var(--black-rgb),.15);opacity:1;z-index:1}


/* article_list */
#article_list li .info_box{margin:-50px auto 0;padding:30px;width:calc(80% - 60px);box-shadow:0 0 20px rgba(var(--black-rgb),.1)}
#article_list li .info_box h3{height:37px;font-size:22px;font-style:italic;letter-spacing:.15em}
#article_list li .info_box article{margin-top:5px;font-weight:300}


/* news_list */
#news_list li .time{font-weight:300;line-height:120%;background:rgb(219 219 219 / 49%);padding:3px 5px;color:#444444;text-align:center}
#news_list li .img_box{border:0 var(--secondary) solid}
#news_list li .h3{margin-top:10px;height:40px;line-height:45px;letter-spacing:.15em;font-weight:500;font-size:18px;color:#3f3f3f}
#news_list li .h3:before{position:absolute;width:0;height:1px;background:var(--secondary);display:block;bottom:0;left:0;content:""}
#news_list li .more font{font-weight:600;font-style:italic;font-size:14px}
#news_list li .more svg{margin-left:10px;width:18px;height:13px}


/* faq_list */
#faq_list li{margin-bottom:15px}
#faq_list li .title{padding:15px 65px 15px 25px;background:#3d4a24}
#faq_list li .title font{font-size:max(1.4*(1vw + 1vh) / 2,18px)}
#faq_list li .title:before{position:absolute;width:0;height:calc(100% - 3px);background:var(--white);top:0;left:0;content:""}
#faq_list li .title i{font-size:26px;top:calc((100% - 26px) / 2);right:25px}
#faq_list li .info{padding:25px;font-size:14px;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
#faq_list li.current .title:before{width:calc(100% - 65px)}
#faq_list li.current .title font{color:var(--secondary)}


/* book_list */
#book_list{margin-bottom:5vw}
#book_list img{height:350px}
#book_list a{background:rgba(var(--black-rgb),.2)}
#book_list a b{margin:auto;padding:0 10%;width:80%;height:42px;letter-spacing:.15em;font-weight:700;font-size:25px}


/* album_list */
#album_list{margin-bottom:5vw;flex-wrap:wrap}
#album_list>div{margin:0 1px 1px 0;height:400px;flex-grow:1}
#album_list>div img{width:auto;min-width:100%;height:400px}


/* pagenav */
#pagenav{display:flex;justify-content:center;width:98%;margin:0 auto}
#pagenav .talign_right{display:flex;justify-content:flex-end}
#pagenav a,#pagenav strong{margin:0 2px;width:35px;height:35px;display:inline-block;text-align:center;line-height:35px;font-weight:400}
#pagenav strong{background:#707d57;color:var(--white)}
#pagenav a:first-child,#pagenav a:last-child{line-height:30px}
#pagenav p a{margin:15px 0 0;padding:0 11px;width:auto;background:#3d4a24;border-radius:5px}
#pagenav p a i{margin:0 2px 0 0;color:#ffffff}
#pagenav p a font{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none;display:none}
#pagenav p:last-child a i{margin:0 0 0 5px}




/* describe */
#describe{margin:2em 0 5vw}
#describe *,.tab_content *{vertical-align:bottom;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
#describe hr{border-width: 1px;border-color: var(--secondary);margin-top: 1rem;margin-bottom: 1rem;}


/* detail_title */
#detail_title{margin-bottom:60px;padding:0 15px 5px;border-bottom:1px rgb(102 102 102 / 21%) solid}
#detail_title .time{padding:4px 13px;font-weight:300;font-style:italic;line-height:120%;font-size:13px;opacity:0}
#detail_title>div{padding-top:5px;box-sizing:border-box;line-height:1px;z-index:5}
#detail_title>div:after{margin:13px 0 0 20px;width:0;height:3px;background:var(--secondary);display:inline-block;vertical-align:top;content:""}
#detail_title .title{max-width:calc(100% - 50px);line-height:100%;letter-spacing:.15em;font-style:normal;font-size:29px;font-weight:600;text-transform:uppercase;opacity:0}
#detail_title .quote_box{font-weight:500;font-style:italic;letter-spacing:.1em;opacity:0}
#detail_title.showtime>div:after{width:30px;-webkit-transition-delay:.4s;transition-delay:.4s}
#detail_title.showtime .title{opacity:1}
#detail_title.showtime .time,#detail_title.showtime .quote_box{opacity:1;-webkit-transition-delay:.6s;transition-delay:.6s;background:#707d57;font-weight:400;margin-bottom:15px}
.vidoobox{display:flex;flex-direction:column;align-items:center;width:100%;max-width:100%}
.vidoobox .clmvideo{width:100%;display:flex}
.vidoobox .clmvideo video{width:500px;margin:0 auto;max-width:100%}


/* form_box */
.form_box p.note .red{color:#f00}
.form_box p.item{padding:15px;border-bottom:1px rgba(var(--black-rgb),.1) solid}
.form_box p.item label span{letter-spacing:.15em;font-weight:600;font-style:italic;font-size:17px}
.form_box p.item label i{margin-left:15px;line-height:20px;font-size:20px;color:#f00}
.form_box p.item font{margin:5px 0}
.form_box p.item.check_box{border-bottom:0}
.form_box p.send_box{margin:15px 0 50px}


/* lodbg */
[data-action="loader"]{width:100vw;height:100vh;background:rgba(var(--black-rgb),.3);line-height:100vh;top:0;left:0;opacity:0;z-index:-1}
[data-action="loader"] .loader_circle{border:2px rgba(var(--black-rgb),.6) solid;border-left-color:rgba(var(--white-rgb),.4)}
#lodbg{opacity:1;z-index:99999}

@media screen and (min-width: 1281px) {
	#sub_banner{margin-top:90px}
	aside>ul>li:hover h4 a,aside>ul>li:hover h4 i{color:var(--triadic1)}
	#news_list li:hover h3:before{width:100%}
}

@media screen and (max-width: 1470px) {
	#page_title{height:275px}
	#page_title .workframe{padding-left:10%}
}

@media screen and (max-width: 1280px) {
	#article_list li .info_box{width:calc(90% - 60px)}
	#wrap .list_box li .img_cover{height:264px}
}

@media screen and (min-width: 761px) {
	.form_box p.item{padding:30px 20px}
	.form_box p.item label{width:170px}
	.form_box p.item font{margin:0 0 0 30px;width:calc(100% - 200px)}
}

@media screen and (max-width: 980px) {
	#wrap .list_box li{margin-left:5px;margin-right:5px;margin-bottom:9px;width:calc(33.3% - 10px);padding:10px}
	#wrap .list_box li .img_cover{height:225px}

}

@media screen and (max-width: 640px) {

	#album_list>div,#album_list>div img{height:auto}
	#sub_banner #banner_box img{object-position:0% 50%}
	#sub_banner{margin-top:90px}
	#page_title{height:184px}
	#wrap .list_box li{width:calc(100% - 10px)}
	#wrap .list_box li .img_cover{height:182px}
}

@media screen and (max-width: 550px) {
	#community{margin-top:10px}
	#pagenav p a i,#pagenav p:last-child a i{margin:0}
	#page_title .workframe{padding-left:0}
}

@media screen and (max-width: 450px) {
	#detail_title .title{font-size:22px}
	#album_list>div,#album_list>div img{height:50vw}
	#pagenav a,#pagenav strong{margin:0;width:24px;height:24px;line-height:24px;font-size:14px}
	#pagenav a{background:none}
	#pagenav a:first-child,#pagenav a:last-child{line-height:20px}
}