@import url('/css/community.css');

/* #faq_list */
#faq_list li .title i {transform:rotate(0);-webkit-transform:rotate(0);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
#faq_list li.current .title i {transform:rotate(180deg);-webkit-transform:rotate(180deg)}

/* #book_list */
#book_list li .img_box:before,#book_list li .img_box:after {transform:scaleY(0);-webkit-transform:scaleY(0)}
#book_list li .img_box:after {transform-origin:center bottom;-webkit-transform-origin:center bottom}
[data-action="loader"] .loader_circle {width:50px;height:50px;border-radius:50%}

/* #lodbg */
[data-action="loader"]#lodbg .loader_circle {-webkit-animation:circle infinite 0.75s linear;animation:circle infinite 0.75s linear}
@keyframes circle{0%{transform:rotate(0);-webkit-transform:rotate(0)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}
@-webkit-keyframes circle{0%{transform:rotate(0);-webkit-transform:rotate(0)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}
header .menu {background:var(--primary)}

/* #menubtn */
header #menubtn[data-type="1"] a span {background:var(--secondary)}

/* #wrap */
#wrap {z-index:6}
#wrap:before {content:"";position:absolute;width:100%;height:100%;background:rgb(244 240 231 / 40%)}
#wrap .page_area {margin:auto;width:100%;z-index:2}
#wrap .shadow {box-shadow:0 0 20px rgba(var(--black-rgb),.2)}

/* #sub_banner */
#sub_banner {top:0; left:0}
#sub_banner a,#page_title {padding-top:70px; height:400px}
#sub_banner a img {height:100%}
#sub_banner a:after {position:absolute; width:100%; height:100%; background:rgba(var(--black-rgb),.4); top:0; left:0; z-index:2; content:""}

/* #page_title */
#page_title>div {margin:auto}
#page_title .pag_tit {line-height:1.3em; letter-spacing:.15em; font-size:2em}
.waylink ol {padding-top:5px}
.waylink ol li,.waylink ol li a {letter-spacing:1.5px; font-weight:300; font-size:13px; vertical-align:bottom}
.waylink ol li:after {margin:0 10px; display:inline-block; font-weight:100; font-size:12px; color:var(--white); content:"/"}
.waylink ol li:last-child:after {margin:0; content:""}
.page_areaJJ {position:relative;width:min(1300px,calc(100% - 100px));margin:0 auto;padding:0;font-family:var(--font-family)}
.page_areaJJ:before,.page_areaJJ:after {position:absolute;left:0;width:100%;height:1px;background:var(--line);content:""}
.page_areaJJ:before {top:0}
.page_areaJJ:after {bottom:0}

/* #category_nav */
#category_nav {position:relative;display:flex;align-items:stretch;justify-content:center;width:100%;margin:0;padding:0;list-style:none;white-space:normal}
#category_nav>li {position:relative;display:flex;min-width:180px;align-items:center;justify-content:center;margin:0;padding:0 24px}
#category_nav .category_head {position:relative;display:flex;width:100%;align-items:center;justify-content:center}
#category_nav .category_head>a {position:relative;display:block;padding:24px 5px 23px;text-decoration:none;font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.055em;color:var(--gray);transition:color .35s ease}
#category_nav .category_head>a:before {position:absolute;left:50%;bottom:-1px;width:0;height:2px;background:var(--primary);transform:translateX(-50%);content:"";transition:width .45s cubic-bezier(.22,.8,.25,1)}
#category_nav>li:hover>.category_head>a {color:var(--primary)}
#category_nav>li:hover>.category_head>a:before {width:100%}
#category_nav>li.action>.category_head>a {color:var(--primary)}
#category_nav>li.action>.category_head>a:before {width:100%}
#category_nav>li.action>.category_head>a:after {position:absolute;left:50%;top:15px;width:4px;height:4px;border-radius:50%;background:var(--gold);transform:translateX(-50%);content:""}
#category_nav .category_head>b {position:relative;z-index:5;display:flex;width:28px;height:28px;align-items:center;justify-content:center;margin-left:4px;border:0;background:none;color:var(--primary);cursor:pointer}
#category_nav .category_head>b i {font-size:12px;color:inherit}
#category_nav .subUL {position:absolute;z-index:20;left:50%;top:100%;min-width:220px;margin:0;padding:15px 22px;background:var(--cream);border:1px solid var(--line);box-shadow:0 15px 35px rgba(var(--primary-rgb),.06);list-style:none;opacity:0;visibility:hidden;transform:translate(-50%,12px);transition:opacity .35s ease,visibility .35s ease,transform .35s ease}
#category_nav>li:hover>.subUL {opacity:1;visibility:visible;transform:translate(-50%,0)}
#category_nav .subUL>li {position:relative;border-bottom:1px solid rgba(var(--primary-rgb),.1)}
#category_nav .subUL>li:last-child {border-bottom:0}
#category_nav .subULHead {position:relative;display:flex;align-items:center}
#category_nav .subULHead p {width:100%;margin:0}
#category_nav .subULHead a {display:block;padding:12px 5px;text-align:left;text-decoration:none;font-size:16px;line-height:1.6;color:var(--gray);transition:color .3s ease,padding-left .3s ease}
#category_nav .subULHead a:hover,#category_nav .subUL>li.action>.subULHead p>a {padding-left:10px;color:var(--gold)}
#category_nav .subULHead>b {display:flex;width:30px;height:30px;align-items:center;justify-content:center;cursor:pointer}
#category_nav .sub2UL {margin:0 0 8px;padding:0 0 0 12px;list-style:none}
#category_nav .sub2UL li {position:relative}
#category_nav .sub2UL a {display:block;padding:8px 5px;text-align:left;text-decoration:none;font-size:16px;line-height:1.6;color:var(--info);transition:color .3s ease}
#category_nav .sub2UL a:hover,#category_nav .sub2UL li.action a {color:var(--gold)}
.category_mobile {display:none}
.category_mobile_toggle {width:100%;border:0;background:none;cursor:pointer}
#category_nav>li {opacity:1;transform:translateY(0);transition:opacity .4s ease,transform .4s ease}
#category_nav>li:nth-child(2) {transition-delay:.04s}
#category_nav>li:nth-child(3) {transition-delay:.08s}
#category_nav>li:nth-child(4) {transition-delay:.12s}
#category_nav>li:nth-child(5) {transition-delay:.16s}
#category_nav>li:nth-child(6) {transition-delay:.2s}
.product_list_area {position:relative;padding-top:20px}

/* #product_list_Jbox */
#product_list_Jbox {display:grid;grid-template-columns:repeat(4,1fr);gap:30px;width:100%;margin:0;padding:0;list-style:none;white-space:normal}
#product_list_Jbox .product_list_item {position:relative;min-width:0;box-shadow:0 0 20px rgb(27 23 20 / 18%);margin:0}
#product_list_Jbox .masklink {z-index:10;inset:0}
#product_list_Jbox .poduct_imgg {position:relative;width:100%;aspect-ratio:1/1.08;overflow:hidden;background:#eee8df}
#product_list_Jbox .poduct_imgg:after {position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--black-rgb),0) 60%,rgba(var(--black-rgb),.08));content:"";pointer-events:none}
#product_list_Jbox .poduct_imgg img {display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.65,.25,1),filter .7s ease}
#product_list_Jbox .product_hover_text {position:absolute;z-index:3;left:20px;bottom:18px;font-family:var(--font-family);font-size:15px;font-weight:500;line-height:1.5;letter-spacing:.12em;color:var(--white);opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease}
#product_list_Jbox .poduct_infoo {position:relative;padding:20px;background:rgb(255 255 255)}
#product_list_Jbox .potitle {position:relative;padding-bottom:15px;font-family:var(--font-serif);font-size:23px;font-weight:400;line-height:1.5;letter-spacing:.045em;color:var(--primary);transition:color .35s ease}
#product_list_Jbox .potitle:after {position:absolute;left:0;bottom:0;width:34px;height:1px;background:var(--gold);content:"";transition:width .45s cubic-bezier(.22,.8,.25,1)}
#product_list_Jbox .poticeinfo {display:-webkit-box;overflow:hidden;min-height:auto;margin-top:17px;font-family:var(--font-family);font-size:14px;font-weight:400;line-height:2;color:var(--gray);-webkit-box-orient:vertical;-webkit-line-clamp:2}
#product_list_Jbox .poticeinfo p {margin:0;font-size:inherit;line-height:inherit;color:inherit}
#product_list_Jbox .product_more {display:flex;align-items:center;width:150px;margin-top:25px;padding-bottom:11px;border-bottom:1px solid rgba(var(--primary-rgb),.28);font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.04em;color:var(--primary);transition:color .35s ease,border-color .35s ease;width:100%;padding-top:15px}
#product_list_Jbox .product_more span {white-space:nowrap;color:inherit;font-size:15px}
#product_list_Jbox .product_more i {flex:1}
#product_list_Jbox .product_more b {font-size:23px;font-weight:300;line-height:1;color:inherit;transition:transform .4s ease}
#product_list_Jbox .product_list_item:hover .poduct_imgg img {transform:scale(1.045);filter:brightness(.92)}
#product_list_Jbox .product_list_item:hover .product_hover_text {opacity:1;transform:translateY(0)}
#product_list_Jbox .product_list_item:hover .potitle {color:var(--gold)}
#product_list_Jbox .product_list_item:hover .potitle:after {width:70px}
#product_list_Jbox .product_list_item:hover .product_more {border-color:var(--gold);color:var(--gold)}
#product_list_Jbox .product_list_item:hover .product_more b {transform:rotate(90deg)}
#product_list_Jbox .product_list_item:nth-child(3n+2) {transition-delay:50ms!important}
#product_list_Jbox .product_list_item:nth-child(3n+3) {transition-delay:100ms!important}
.list_box li {margin:0 15px 50px}
.list_box li img {background:rgba(var(--primary-rgb),.05)}

/* #article_list */
#article_list li h3 {padding:10px 20px; width:calc(90% - 40px); height:34px; background:rgba(var(--white-rgb),.9); line-height:37px; font-weight:400; font-size:20px; bottom:20px; left:5%}
#article_list li img {height:35vw}
#article_list li .info_box p {height:34px; font-size:20px}
#article_list li .info_box .cate {z-index:2}
#article_list li .info_box article {margin:15px 0 40px; height:90px; line-height:220%; font-weight:300; font-size:14px; -webkit-line-clamp:3}
.news_list_page {position:relative}
.news_list_page .inner_wrap {position:relative;width:min(1300px,calc(100% - 100px));margin:0 auto}

/* #news_list */
#news_list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:70px 30px;width:100%;margin:0;padding:0;list-style:none;white-space:normal;counter-reset:newsCounter}
#news_list .news_list_item {position:relative;min-width:0;counter-increment:newsCounter;box-shadow:0 0 20px rgb(27 23 20 / 18%);margin:0}
#news_list .atag_item {z-index:5;inset:0}
#news_list .news_list_img {position:relative;width:100%;aspect-ratio:4/3;background:#eee8df}
#news_list .news_list_img:after {position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(var(--black-rgb),0) 62%,rgba(var(--black-rgb),.08));content:"";pointer-events:none}
#news_list .news_list_img img {display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.65,.25,1),filter .6s ease}
#news_list .news_list_no {position:absolute;z-index:3;left:16px;top:16px;display:flex;min-width:40px;height:30px;align-items:center;justify-content:center;padding:0 9px;background:rgba(var(--cream-rgb),.94);font-family:var(--font-en);font-size:16px;font-style:italic;line-height:1;color:var(--primary)}
#news_list .news_list_no:before {content:counter(newsCounter,decimal-leading-zero)}
#news_list .info_box {padding-top:22px;padding:20px;background:rgb(255 255 255)}
#news_list .news_list_meta {position:relative;z-index:6;display:flex;align-items:center;gap:11px;margin-bottom:16px}
#news_list .news_category {overflow:hidden;max-width:60%;text-decoration:none;font-size:15px;font-weight:500;line-height:1.5;letter-spacing:.04em;color:var(--gold);text-overflow:ellipsis;white-space:nowrap;transition:color .3s ease}
#news_list .news_category:hover {color:var(--primary)}
#news_list .news_list_meta>i {display:block;width:18px;height:1px;background:var(--line)}
#news_list .time {font-family:var(--font-en);font-size:16px;font-weight:500;line-height:1.5;color:var(--info);white-space:nowrap}
#news_list .news_list_title {display:-webkit-box;overflow:hidden;min-height:65px;font-family:var(--font-serif);font-size:22px;font-weight:500;line-height:1.55;letter-spacing:.035em;color:var(--primary);-webkit-box-orient:vertical;-webkit-line-clamp:2;transition:color .35s ease}
#news_list .news_list_more {position:relative;display:flex;align-items:center;margin-top:25px;padding-bottom:11px;border-bottom:1px solid rgba(var(--primary-rgb),.28);font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.04em;color:var(--primary);transition:color .35s ease,border-color .35s ease;width:100%;padding-top:15px}
#news_list .news_list_more:after {position:absolute;left:0;bottom:0;width:100%;height:1px;background:rgba(var(--primary-rgb),.28);transform-origin:left center;content:"";transition:transform .45s ease,background .35s ease}
#news_list .news_list_more span {white-space:nowrap;color:inherit;font-size:14px}
#news_list .news_list_more>i {flex:1}
#news_list .news_list_more b {font-size:23px;font-weight:300;line-height:1;color:inherit;transition:transform .4s ease}
#news_list .news_list_item:hover .news_list_img img {transform:scale(1.045);filter:brightness(.94)}
#news_list .news_list_item:hover .news_list_title {color:var(--gold)}
#news_list .news_list_item:hover .news_list_more {color:var(--gold)}
#news_list .news_list_item:hover .news_list_more:after {background:var(--gold);transform:scaleX(.55)}
#news_list .news_list_item:hover .news_list_more b {transform:rotate(90deg)}
#news_list .news_list_item:nth-child(3n+1) {transition-delay:0ms!important}
#news_list .news_list_item:nth-child(3n+2) {transition-delay:50ms!important}
#news_list .news_list_item:nth-child(3n+3) {transition-delay:100ms!important}
.news_detail_page {position:relative}
.news_detail_page .inner_wrap {position:relative;width:min(1100px,calc(100% - 100px));margin:0 auto}
.news_inner_box {position:relative;width:100%}
.news_detail_top {display:flex;align-items:flex-end;justify-content:space-between;gap:50px;padding-bottom:25px}
.news_detail_meta {display:flex;align-items:center;gap:28px}
.news_detail_label {font-size:16px;font-weight:600;line-height:1.5;letter-spacing:.16em;color:var(--gold)}
.news_detail_date {display:flex;align-items:center;gap:10px;font-family:var(--font-en);font-size:17px;font-weight:500;line-height:1.5;color:var(--info)}
.news_detail_date i {display:block;width:14px;height:1px;background:var(--line)}
.news_detail_top .quote_box {font-size:16px;line-height:1.7;color:var(--info)}
.news_detail_top .quote_box span {margin-right:8px;color:var(--gray)}
.news_detail_top .quote_box a {text-decoration:none;color:var(--gold);transition:color .3s ease}
.news_detail_top .quote_box a:hover {color:var(--primary)}
.news_detail_line {width:100%;height:1px;background:var(--line)}
.news_detail_bottom {display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-top:85px;padding-top:35px;border-top:1px solid var(--line)}
.news_detail_bottom_text {display:flex;flex-direction:column;gap:4px;font-family:var(--font-en);font-size:20px;font-weight:500;font-style:italic;line-height:1.5;color:var(--gold)}
.news_detail_bottom .inner_line_btn {margin-top:0}

/* #faq_list */
#faq_list li {margin-bottom:30px}
#faq_list li .title font {padding:15px 65px 15px 25px; background:var(--white); font-size:18px; box-shadow:0 0 15px rgba(var(--black-rgb),.2)}
#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 {box-shadow:0 0 15px rgba(var(--black-rgb),.2)}
#faq_list li.current .title font {background:var(--gray); box-shadow:none; color:var(--white)}
#faq_list li.current .title i {color:var(--white)}

/* #book_list */
#book_list img {height:450px}
#book_list .img_box {border:var(--white) solid; border-width:0 1px 1px 0}
#book_list .img_box:before,#book_list .img_box:after {position:absolute; width:100%; height:100%; background:var(--white); z-index:9; opacity:.4; content:""}
#book_list .img_box:after {right:0; bottom:0}
#book_list .atag_item {z-index:10}
#book_list .badge {margin:auto; padding:10px 20px; max-width:calc(80% - 40px); height:34px; line-height:36px; font-size:20px}
.environment_page {position:relative}
.environment_page .bookinner_box {position:relative;width:min(1300px,calc(100% - 100px));margin:0 auto}

/* #describe */
.environment_page #describe {position:relative;max-width:820px;margin:0 0 65px;padding:0 0 38px;border-bottom:1px solid var(--line);font-family:var(--font-family);font-size:16px;font-weight:400;line-height:2;color:var(--gray)}
.environment_page #describe:before {display:block;margin-bottom:20px;font-family:var(--font-family);font-size:16px;font-weight:600;line-height:1.5;letter-spacing:.17em;color:var(--gold);content:"OUR PLACE"}
.environment_page #describe p {margin:0 0 18px;font-size:16px;line-height:2;color:inherit}
.environment_page #describe p:last-child {margin-bottom:0}
.environment_page #describe strong,.environment_page #describe b {font-size:16px;font-weight:600;color:var(--primary)}
.environment_page #describe a {font-size:16px;text-decoration:none;color:var(--gold)}
.environment_page #describe img {display:block;max-width:100%;height:auto;margin:35px 0}

/* #album_list */
#album_list {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:55px 28px;width:100%;margin:0;padding:0;counter-reset:albumCounter}
#album_list .album_item {position:relative;min-width:0;counter-increment:albumCounter}
#album_list .album_item>a {position:relative;display:flex;width:100%;text-decoration:none;color:var(--primary);flex-direction:column}
#album_list .album_img {position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#eee8df;display:flex;flex-direction:column}
#album_list .album_img:before {position:absolute;z-index:2;inset:0;border:1px solid rgba(var(--primary-rgb),.06);content:"";pointer-events:none}
#album_list .album_img:after {position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(var(--black-rgb),0) 65%,rgba(var(--black-rgb),.06));content:"";pointer-events:none}
#album_list .album_img img {display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.65,.25,1),filter .6s ease}
#album_list .album_info {display:flex;min-height:30px;align-items:center;gap:12px;margin-top:15px}
#album_list .album_no {flex:0 0 auto}
#album_list .album_no:before {font-family:var(--font-en);font-size:18px;font-weight:500;font-style:italic;line-height:1;color:var(--gold);content:counter(albumCounter,decimal-leading-zero)}
#album_list .album_info i {display:block;flex:0 0 18px;width:18px;height:1px;background:rgba(var(--primary-rgb),.3)}
#album_list .album_title {overflow:hidden;font-family:var(--font-family);font-size:16px;font-weight:400;line-height:1.7;letter-spacing:.035em;color:var(--gray);text-overflow:ellipsis;white-space:nowrap;transition:color .35s ease}
#album_list .album_item:hover .album_img img {transform:scale(1.045);filter:brightness(.94)}
#album_list .album_item:hover .album_title {color:var(--gold)}
#album_list .album_item:nth-child(3n+1) {transition-delay:0ms!important}
#album_list .album_item:nth-child(3n+2) {transition-delay:50ms!important}
#album_list .album_item:nth-child(3n+3) {transition-delay:100ms!important}
.fancybox__container {--fancybox-bg:rgba(29,23,19,.96)}
.fancybox__caption {font-family:var(--font-family);font-size:16px;letter-spacing:.04em;color:var(--secondary)}
.fancybox__toolbar {font-family:var(--font-family)}

/* #content_wrap */
#content_wrap {padding:5vw 0;z-index:1;background-image:url(/images/40/crossword.png)}
#content_wrap h1 {margin-bottom:5px; padding:0 20px 5px; border-bottom:1px rgba(var(--black-rgb),.1) solid; line-height:130%}
#content_wrap .top_box {padding:0 20px}
#content_wrap .quote_box {margin-right:30px}

/* #pagenav */
#pagenav {padding-top:50px}
#pagenav a,#pagenav strong {margin:0 2px; width:35px; height:35px; background:rgba(var(--black-rgb),.1); border-radius:5px; display:inline-block; text-align:center; line-height:35px; font-weight:400}
#pagenav strong {background:var(--primary); color:var(--white)}
#pagenav a:first-child,#pagenav a:last-child {line-height:30px}
#pagenav p a {margin:0; padding:0 20px; width:auto; border-radius:20px}
#pagenav p a i {margin:0 5px 0 0}
#pagenav p a font {-webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; transition:none}
#pagenav p:last-child a i {margin:0 0 0 5px}

/* #describe */
#describe {margin:2em 0 5vw}
#describe * {vertical-align:bottom}
.form_box {display:grid; grid-template-columns:repeat(2,1fr); gap:20px 30px}
.form_box p.large {grid-column:1/3}
.form_box p.note {margin-bottom:20px}

/* #btnOK */
.form_box p #btnOK {width:150px}
[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 */
#lodbg {opacity:1; z-index:99999}
.article_list_page {position:relative}
.article_list_page .inner_wrap {position:relative;width:min(1300px,calc(100% - 100px));margin:0 auto}

/* #article_list */
#article_list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:75px 32px;width:100%;margin:0;padding:0;list-style:none;white-space:normal;counter-reset:articleCounter}
#article_list .article_list_item {position:relative;min-width:0;counter-increment:articleCounter}
#article_list .atag_item {z-index:5;inset:0}
#article_list .article_image {position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#eee8df}
#article_list .article_image:after {position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(var(--black-rgb),0) 55%,rgba(var(--black-rgb),.09));content:"";pointer-events:none}
#article_list .article_image img {display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.65,.25,1),filter .6s ease}
#article_list .article_no {position:absolute;z-index:3;left:16px;top:16px;display:flex;min-width:42px;height:30px;align-items:center;justify-content:center;padding:0 9px;background:rgba(var(--cream-rgb),.94);font-family:var(--font-en);font-size:16px;font-weight:500;font-style:italic;line-height:1;color:var(--primary)}
#article_list .article_no:before {content:counter(articleCounter,decimal-leading-zero)}
#article_list .article_image_more {position:absolute;z-index:3;right:17px;bottom:15px;display:flex;align-items:center;gap:8px;font-size:16px;font-weight:500;letter-spacing:.08em;color:var(--white);opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease}
#article_list .article_image_more i {display:flex;width:30px;height:30px;align-items:center;justify-content:center;border:1px solid rgba(var(--white-rgb),.65);border-radius:50%;font-size:18px;font-style:normal;font-weight:300;color:inherit;transition:transform .4s ease}
#article_list .info_box {position:relative;padding-top:22px}
#article_list .article_meta {position:relative;z-index:6;display:flex;align-items:center;gap:11px;margin-bottom:15px}
#article_list .article_meta .cate {overflow:hidden;max-width:65%;text-decoration:none;font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.045em;color:var(--gold);text-overflow:ellipsis;white-space:nowrap;transition:color .3s ease}
#article_list .article_meta .cate:hover {color:var(--primary)}
#article_list .article_meta>i {display:block;width:18px;height:1px;background:var(--line)}
#article_list .article_meta>span {font-family:var(--font-en);font-size:16px;font-weight:500;font-style:italic;line-height:1.5;letter-spacing:.05em;color:var(--info)}
#article_list .article_title {display:-webkit-box;overflow:hidden;min-height:70px;font-family:var(--font-serif);font-size:23px;font-weight:500;line-height:1.55;letter-spacing:.035em;color:var(--primary);-webkit-box-orient:vertical;-webkit-line-clamp:2;transition:color .35s ease}
#article_list .article_desc {display:-webkit-box;overflow:hidden;min-height:64px;margin-top:14px;font-family:var(--font-family);font-size:16px;font-weight:400;line-height:2;color:var(--gray);-webkit-box-orient:vertical;-webkit-line-clamp:2}
#article_list .article_desc p {margin:0;font-size:inherit;line-height:inherit;color:inherit}
#article_list .more_btn {position:relative;display:flex;width:150px;align-items:center;margin-top:25px;padding:0 0 11px;font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.08em;color:var(--primary);transition:color .35s ease}
#article_list .more_btn:after {position:absolute;left:0;bottom:0;width:100%;height:1px;background:rgba(var(--primary-rgb),.28);transform-origin:left center;content:"";transition:transform .45s ease,background .35s ease}
#article_list .more_btn span {white-space:nowrap;color:inherit;font-size:15px}
#article_list .more_btn>i {flex:1}
#article_list .more_btn b {font-size:23px;font-weight:300;line-height:1;color:inherit;transition:transform .4s ease}
#article_list .article_list_item:hover .article_image img {transform:scale(1.045);filter:brightness(.93)}
#article_list .article_list_item:hover .article_image_more {opacity:1;transform:translateY(0)}
#article_list .article_list_item:hover .article_image_more i {transform:rotate(90deg)}
#article_list .article_list_item:hover .article_title {color:var(--gold)}
#article_list .article_list_item:hover .more_btn {color:var(--gold)}
#article_list .article_list_item:hover .more_btn:after {background:var(--gold);transform:scaleX(.55)}
#article_list .article_list_item:hover .more_btn b {transform:rotate(90deg)}
#article_list .article_list_item:nth-child(3n+1) {transition-delay:0ms!important}
#article_list .article_list_item:nth-child(3n+2) {transition-delay:50ms!important}
#article_list .article_list_item:nth-child(3n+3) {transition-delay:100ms!important}

/* @media */
@media screen and (max-width:1399px) {
  .page_areaJJ { width: calc(100% - 80px); margin-bottom: 65px }
  #category_nav>li { min-width: 160px; padding: 0 20px }
  .news_list_page .inner_wrap { width: calc(100% - 80px) }
  #news_list { gap: 60px 26px }
  #news_list .news_list_title { font-size: 21px }
  .news_detail_page .inner_wrap { width: calc(100% - 80px) }
  .environment_page .bookinner_box { width: calc(100% - 80px) }
  .environment_page #describe { margin-bottom: 60px }
  #album_list { gap: 48px 25px }
  .article_list_page .inner_wrap { width: calc(100% - 80px) }
  #article_list { gap: 65px 27px }
  #article_list .article_title { font-size: 21px }
}
@media screen and (max-width:1199px) {
  #product_list_Jbox { gap: 60px 26px }
  #product_list_Jbox .potitle { font-size: 21px }
  #product_list_Jbox .poticeinfo { font-size: 16px }
}
@media screen and (max-width:1024px) {
  .form_box { grid-template-columns: 1fr }
  .form_box p.large { grid-column: inherit }
}
@media screen and (max-width:991px) {
  .page_areaJJ { width: calc(100% - 50px) }
  #category_nav>li { min-width: auto; flex: 1; padding: 0 12px }
  #category_nav .category_head>a { font-size: 15px }
  #product_list_Jbox { grid-template-columns: repeat(2,1fr); gap: 55px 25px }
  #product_list_Jbox .product_list_item:nth-child(n) { transition-delay: 0ms!important }
  #product_list_Jbox .product_list_item:nth-child(2n) { transition-delay: 50ms!important }
  .news_list_page .inner_wrap { width: calc(100% - 50px) }
  #news_list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 55px 24px }
  #news_list .news_list_item:nth-child(n) { transition-delay: 0ms!important }
  #news_list .news_list_item:nth-child(2n) { transition-delay: 50ms!important }
  .news_detail_page .inner_wrap { width: calc(100% - 50px) }
  .news_detail_top { align-items: flex-start }
  .news_detail_meta { display: block }
  .news_detail_date { margin-top: 12px }
  .environment_page .bookinner_box { width: calc(100% - 50px) }
  .environment_page #describe { max-width: 700px; margin-bottom: 50px }
  #album_list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 45px 22px }
  #album_list .album_item:nth-child(n) { transition-delay: 0ms!important }
  #album_list .album_item:nth-child(2n) { transition-delay: 50ms!important }
  .article_list_page .inner_wrap { width: calc(100% - 50px) }
  #article_list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 55px 24px }
  #article_list .article_list_item:nth-child(n) { transition-delay: 0ms!important }
  #article_list .article_list_item:nth-child(2n) { transition-delay: 50ms!important }
}
@media screen and (max-width:768px) {
  #article_list li img { height: 50vw }
}
@media screen and (max-width:767px) {
  .page_areaJJ { width: calc(100% - 40px); margin-bottom: 50px }
  .page_areaJJ:before,.page_areaJJ:after { display: none }
  .category_mobile { display: block; position: relative; z-index: 11 }
  .category_mobile_toggle { position: relative; display: flex; height: 68px; align-items: center; justify-content: space-between; padding: 0 18px 0 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; color: var(--primary) }
  .category_mobile_text { display: flex; align-items: center; gap: 18px }
  .category_mobile_text small { font-family: var(--font-family); font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: .17em; color: var(--gold) }
  .category_mobile_current { position: relative; padding-left: 18px; font-family: var(--font-serif); font-size: 17px; font-weight: 500; line-height: 1.5; color: var(--primary) }
  .category_mobile_current:before { position: absolute; left: 0; top: 50%; width: 1px; height: 15px; background: var(--line); transform: translateY(-50%); content: "" }
  .category_mobile_icon { position: relative; width: 20px; height: 20px }
  .category_mobile_icon i { position: absolute; left: 50%; top: 50%; display: block; width: 14px; height: 1px; background: var(--primary); transform: translate(-50%,-50%); transition: transform .35s ease,opacity .35s ease }
  .category_mobile_icon i:last-child { transform: translate(-50%,-50%) rotate(90deg) }
  .page_areaJJ.is-open .category_mobile_icon i:first-child { transform: translate(-50%,-50%) rotate(45deg) }
  .page_areaJJ.is-open .category_mobile_icon i:last-child { transform: translate(-50%,-50%) rotate(-45deg) }
  #category_nav { position: absolute; z-index: 10; left: 0; top: 68px; display: block; width: 100%; padding: 10px 0 14px; background: var(--cream); border-bottom: 1px solid var(--line); box-shadow: 0 18px 30px rgba(var(--primary-rgb),.06); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .35s ease,visibility .35s ease,transform .35s ease }
  .page_areaJJ.is-open #category_nav { opacity: 1; visibility: visible; transform: translateY(0) }
  #category_nav>li { display: block; width: 100%; padding: 0 18px; text-align: left; opacity: 0; transform: translateY(-8px) }
  .page_areaJJ.is-open #category_nav>li { opacity: 1; transform: translateY(0) }
  #category_nav .category_head { justify-content: space-between; border-bottom: 1px solid rgba(var(--primary-rgb),.09) }
  #category_nav>li:last-child>.category_head { border-bottom: 0 }
  #category_nav .category_head>a { flex: 1; padding: 16px 0; font-size: 15px; text-align: left }
  #category_nav .category_head>a:before { display: none }
  #category_nav>li.action>.category_head>a { padding-left: 16px; color: var(--primary) }
  #category_nav>li.action>.category_head>a:after { left: 0; top: 50%; width: 5px; height: 5px; transform: translateY(-50%) }
  #category_nav .category_head>b { width: 38px; height: 38px; margin-left: 10px }
  #category_nav .subUL { position: relative; left: auto; top: auto; display: none; width: 100%; min-width: 0; padding: 5px 0 8px 16px; background: transparent; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none }
  #category_nav>li:hover>.subUL { transform: none }
  #category_nav>li.sub-open>.subUL { display: block }
  #category_nav .subULHead a { padding: 11px 0; font-size: 15px }
  #category_nav .subULHead a:hover,#category_nav .subUL>li.action>.subULHead p>a { padding-left: 0 }
  #category_nav .sub2UL { display: none; padding-left: 15px }
  #category_nav .subUL>li.sub-open>.sub2UL { display: block }
  #category_nav .sub2UL a { font-size: 15px }
  .product_list_area { padding-top: 5px }
  #product_list_Jbox { grid-template-columns: 1fr; gap: 48px }
  #product_list_Jbox .product_list_item:nth-child(n) { transition-delay: 0ms!important }
  #product_list_Jbox .poduct_imgg { aspect-ratio: 1/1 }
  #product_list_Jbox .poduct_infoo { padding-top: 19px }
  #product_list_Jbox .potitle { padding-bottom: 13px; font-size: 20px }
  #product_list_Jbox .poticeinfo { min-height: 0; margin-top: 14px; font-size: 15px; line-height: 1.9 }
  #product_list_Jbox .product_more { width: 140px; margin-top: 20px; font-size: 15px }
  #product_list_Jbox .product_hover_text { left: 15px; bottom: 14px; font-size: 15px }
  .news_list_page .inner_wrap { width: calc(100% - 40px) }
  #news_list { grid-template-columns: 1fr; gap: 48px }
  #news_list .news_list_item:nth-child(n) { transition-delay: 0ms!important }
  #news_list .news_list_img { aspect-ratio: 4/3 }
  #news_list .news_list_no { left: 13px; top: 13px; min-width: 36px; height: 27px; font-size: 15px }
  #news_list .info_box { padding-top: 18px }
  #news_list .news_list_meta { margin-bottom: 12px }
  #news_list .news_category,#news_list .time { font-size: 15px }
  #news_list .news_list_title { min-height: 0; font-size: 20px }
  #news_list .news_list_more { width: 135px; margin-top: 20px; font-size: 15px }
  .news_detail_page .inner_wrap { width: calc(100% - 40px) }
  .news_detail_top { display: block; padding-bottom: 20px }
  .news_detail_label { font-size: 15px }
  .news_detail_date { font-size: 15px }
  .news_detail_top .quote_box { margin-top: 20px; font-size: 15px }
  .news_detail_bottom { display: block; margin-top: 60px; padding-top: 28px }
  .news_detail_bottom_text { font-size: 18px }
  .news_detail_bottom .inner_line_btn { margin-top: 30px }
  .environment_page .bookinner_box { width: calc(100% - 40px) }
  .environment_page #describe { margin-bottom: 38px; padding-bottom: 28px; font-size: 15px; line-height: 1.95 }
  .environment_page #describe:before { margin-bottom: 17px; font-size: 15px }
  .environment_page #describe p { font-size: 15px; line-height: 1.95 }
  .environment_page #describe strong,.environment_page #describe b,.environment_page #describe a { font-size: 15px }
  #album_list { grid-template-columns: 1fr; gap: 35px }
  #album_list .album_item:nth-child(n) { transition-delay: 0ms!important }
  #album_list .album_img { aspect-ratio: 4/3 }
  #album_list .album_info { margin-top: 12px }
  #album_list .album_no:before { font-size: 16px }
  #album_list .album_title { font-size: 15px }
  .fancybox__caption { font-size: 15px }
  .article_list_page .inner_wrap { width: calc(100% - 40px) }
  #article_list { grid-template-columns: 1fr; gap: 48px }
  #article_list .article_list_item:nth-child(n) { transition-delay: 0ms!important }
  #article_list .article_image { aspect-ratio: 4/3 }
  #article_list .article_no { left: 13px; top: 13px; min-width: 37px; height: 27px; font-size: 15px }
  #article_list .article_image_more { right: 13px; bottom: 12px; font-size: 15px }
  #article_list .info_box { padding-top: 18px }
  #article_list .article_meta { margin-bottom: 12px }
  #article_list .article_meta .cate,#article_list .article_meta>span { font-size: 15px }
  #article_list .article_title { min-height: 0; font-size: 20px }
  #article_list .article_desc { min-height: 0; margin-top: 11px; font-size: 15px; line-height: 1.9 }
  #article_list .more_btn { width: 140px; margin-top: 20px; font-size: 15px }
}
@media screen and (max-width:640px) {
  #article_list li img { height: 320px }
  #book_list { margin: 0 5% }
  #book_list .img_box { border: 0 }
  #book_list img { height: 65vw }
}
@media screen and (max-width:550px) {
  #community { margin-top: 10px }
  #pagenav p a i,#pagenav p:last-child a i { margin: 0 }
}
@media screen and (max-width:480px) {
  .category_mobile_toggle { height: 64px }
  .category_mobile_text { gap: 12px }
  .category_mobile_text small { font-size: 15px }
  .category_mobile_current { font-size: 16px }
  #category_nav { top: 64px }
  #news_list { gap: 42px }
  #news_list .news_list_title { font-size: 19px }
  #article_list { gap: 42px }
  #article_list .article_title { font-size: 19px }
  #sub_banner a,#page_title { height: 300px }
}
@media screen and (max-width:450px) {
  #pagenav a,#pagenav strong { margin: 0; width: 24px; height: 24px; line-height: 24px; font-size: 14px }
  #pagenav a:first-child,#pagenav a:last-child { line-height: 20px }
  #pagenav p a i,#pagenav p:last-child a i { font-size: 20px }
}
@media screen and (min-width:1281px) {
  #book_list li:hover .img_box:before,#book_list li:hover .img_box:after { transform: scaleY(1); -webkit-transform: scaleY(1) }
  #sub_banner a,#page_title { padding-top: 88px; height: 400px }
  #article_list li:hover h3 { opacity: 0 }
  #article_list li img { height: 500px }
  #book_list li:hover .badge { background: var(--primary); color: var(--white) }
  #pagenav a:hover { background: var(--primary); color: var(--white) }
  #pagenav a:hover font,#pagenav a:hover i,#pagenav a:hover i:before { color: var(--white) }
}
