/* #book_area */
#book_area .list_box li .img_box:before,#book_area .list_box li .img_box:after {transform:scaleY(0);-webkit-transform:scaleY(0)}
#book_area .list_box li .img_box:after {transform-origin:center bottom;-webkit-transform-origin:center bottom}

/* #youtube_box */
#youtube_box a {width:83px;height:83px;border-radius:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-webkit-animation:spineer 2s infinite;animation:spineer 2s infinite}
header .menu {border-bottom:1px rgba(var(--white-rgb),.2) solid}

/* #webmenu */
header #webmenu nav>ul>li>p a {color:var(--white)}

/* #openform */
#openform {background:rgba(var(--white-rgb),.3)}
section {margin:0 auto}
section.section_pad {padding:5vw 0}
section>* {z-index:3}
section .title_box {margin-bottom:40px}
section .title_box .area_title {font-weight:400; font-size:45px}
section .title_box .sub_title {font-weight:300; font-size:23px}
.bg_box {width:100%; height:100%; background:no-repeat 50% / cover; background-attachment:fixed; opacity:.3; top:0; left:0}
.bg_box:before {width:100%; height:100%; display:block; background:rgba(var(--primary-rgb),.2); content:""}
.bg_box.white:before {background:rgba(var(--white-rgb),.2)}
.pageh1J .pageh1 {position:relative;display:flex;font-size:16px;font-weight:400;padding-top:20px}

/* #story_area */
#story_area {position:relative;min-height:820px;padding:125px 0 0;background:var(--cream);overflow:hidden;color:var(--primary);font-family:var(--font-family);margin:0}
#story_area .story_frame {position:relative;width:min(1540px,calc(100% - 100px));min-height:695px;margin:auto}
#story_area .story_top {position:relative;width:100%}
#story_area .story_no {margin-bottom:27px;font-family:var(--font-family);font-size:11px;font-weight:600;line-height:1;letter-spacing:.18em;color:var(--triadic1)}
#story_area .story_line {width:100%;height:1px;background:var(--line)}
#story_area .story_content {position:relative;z-index:2;display:grid;grid-template-columns:48% 32% 20%;padding-top:70px}
#story_area .story_title {position:relative}
#story_area .story_en {margin-bottom:34px;font-family:var(--font-family);font-size:13px;font-weight:600;letter-spacing:.19em;color:var(--gold)}
#story_area .story_main_title span {margin:0;font-family:var(--font-serif);font-size:clamp(34px,2.5vw,50px);font-weight:400;line-height:1.75;letter-spacing:.06em;color:var(--primary)}
#story_area .story_main_title {display:flex;flex-direction:column}
#story_area .story_text {position:relative;padding-top:15px}
#story_area .story_desc {position:relative;max-width:390px}
#story_area .story_desc p {margin:0 0 27px;font-family:var(--font-family);font-size:17px;font-weight:400;line-height:2.4;letter-spacing:.055em;color:var(--triadic1)}
#story_area .story_more {position:relative;display:flex;width:190px;align-items:center;margin-top:42px;padding-bottom:16px;text-decoration:none;font-family:var(--font-family);font-size:13px;font-weight:500;letter-spacing:.08em;color:var(--primary)}
#story_area .story_more span {transition:color .4s ease}
#story_area .story_more:after {position:absolute;left:0;bottom:0;width:100%;height:1px;background:rgba(var(--primary-rgb),.7);transform-origin:left center;content:"";transition:transform .45s ease}
#story_area .story_more span {white-space:nowrap;color:inherit}
#story_area .story_more i {flex:1}
#story_area .story_more b {font-size:27px;font-weight:300;line-height:1;color:var(--gold);transition:transform .45s ease}
#story_area .story_more:hover {color:var(--gold)}
#story_area .story_more:hover:after {transform:scaleX(.45)}
#story_area .story_more:hover b {transform:rotate(90deg)}
#story_area .story_beans {position:relative;height:470px;pointer-events:none}
#story_area .bean_large {position:absolute;z-index:2;right:-80px;top:105px;width:340px;animation:storyBeanFloat 6s ease-in-out infinite}
#story_area .bean_large img {display:block;width:100%;height:auto}
#story_area .bean_small {position:absolute;z-index:3;left:0;top:310px;width:58px;animation:storyBeanFloatSmall 5s ease-in-out infinite}
#story_area .bean_small img {display:block;width:100%;height:auto}
#story_area .story_bg_text {position:absolute;z-index:1;left:0;bottom:-13px;font-family:var(--font-en);font-size:clamp(100px,8vw,165px);font-weight:400;font-style:italic;line-height:.8;letter-spacing:-.045em;color:rgba(var(--triadic2-rgb),.29);white-space:nowrap;pointer-events:none}
@keyframes storyBeanFloat{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,-12px,0) rotate(1.5deg)}}
@keyframes storyBeanFloatSmall{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(5px,-9px,0) rotate(-4deg)}}

/* #about_area */
#about_area .info_box article {margin-bottom:30px; width:90%; line-height:210%; letter-spacing:1.5px; font-weight:300}
.title_box {position:relative;width:100%}
.twoo_box {display:flex;align-items:flex-end;justify-content:space-between;gap:60px}
.title_left {position:relative}
.title_right {position:relative}
.sub_title {margin:0 0 27px;font-family:var(--font-family);font-size:11px;font-weight:600;line-height:1;letter-spacing:.2em;color:var(--triadic1)}
.area_title {font-family:var(--font-serif);font-size:clamp(36px,2.6vw,52px);font-weight:400;line-height:1.45;letter-spacing:.055em;color:var(--primary)}
.title_right p {margin:0;font-family:var(--font-family);font-size:14px;font-weight:400;line-height:2;color:var(--gray);letter-spacing:.04em}
.tabsJ {display:flex;align-items:center}
.tab_btn {position:relative;display:flex;align-items:baseline;gap:9px;padding:0 0 18px;margin:0 37px 0 0;border:0;background:none;font-family:var(--font-family);font-size:14px;font-weight:500;line-height:1;color:var(--gray);cursor:pointer;white-space:nowrap;transition:color .35s ease}
.tab_btn:after {position:absolute;left:0;bottom:-1px;width:0;height:2px;background:var(--primary);content:"";transition:width .4s cubic-bezier(.22,.8,.25,1)}
.tab_btn span {color:inherit}
.tab_btn small {font-size:9px;font-weight:500;letter-spacing:.1em;color:rgba(var(--gray-rgb),.72)}
.tab_btn:hover,.tab_btn.active {color:var(--primary)}
.tab_btn.active:after {width:100%}
.circle_btn {display:flex;width:44px;height:44px;align-items:center;justify-content:center;padding:0;border:1px solid rgba(var(--primary-rgb),.28);border-radius:50%;background:transparent;color:var(--primary);cursor:pointer;transition:background .35s ease,border-color .35s ease,color .35s ease,transform .35s ease}
.circle_btn span {display:block;margin-top:-3px;font-family:Arial,sans-serif;font-size:27px;font-weight:300;line-height:1}
.circle_btn:hover {border-color:var(--primary);background:var(--primary);color:var(--secondary);transform:translateY(-2px)}

/* #product_area */
#product_area {position:relative;padding:105px 0 75px;background:#ebe4d8;overflow:hidden;color:var(--primary);font-family:var(--font-family);margin:0}
#product_area .workframe {width:min(1540px,calc(100% - 100px));max-width:none;margin:0 auto}
#product_area .product_head {position:relative}
#product_area .title_box {position:relative;width:100%}
#product_area .twoo_box {display:flex;align-items:flex-end;justify-content:space-between;gap:60px}
#product_area .title_left {position:relative}
#product_area .title_right {position:relative;padding:0 3% 5px 0}
#product_area .sub_title {margin:0 0 27px;font-family:var(--font-family);font-size:11px;font-weight:600;line-height:1;letter-spacing:.2em;color:var(--triadic1)}
#product_area .area_title {font-family:var(--font-serif);font-size:clamp(36px,2.6vw,52px);font-weight:400;line-height:1.45;letter-spacing:.055em;color:var(--primary)}
#product_area .title_right p {margin:0;font-family:var(--font-family);font-size:14px;font-weight:400;line-height:2;color:var(--gray);letter-spacing:.04em}
#product_area .productcate_wrap{position:relative;margin-top:58px;}
#product_area .productcatenav{position:relative;display:flex;align-items:center;margin-top:0;border-bottom:1px solid rgba(var(--primary-rgb),.18);}
#product_area .productcat_scroll_hint{display:none;}
#product_area .tab_btn {position:relative;display:flex;align-items:baseline;gap:9px;flex:0 0 auto;margin:0 37px 0 0;padding:0 0 18px;border:0;background:none;font-family:var(--font-family);font-size:14px;font-weight:500;line-height:1;color:var(--gray);cursor:pointer;white-space:nowrap;transition:color .35s ease;width:auto}
#product_area .tab_btn:after {position:absolute;left:0;bottom:-1px;width:0;height:2px;background:var(--primary);content:"";transition:width .4s cubic-bezier(.22,.8,.25,1)}
#product_area .tab_btn span {color:inherit}
#product_area .tab_btn small {font-size:9px;font-weight:500;letter-spacing:.1em;color:rgba(var(--gray-rgb),.72)}
#product_area .tab_btn:hover,#product_area .tab_btn.active {color:var(--primary)}
#product_area .tab_btn.active:after {width:100%}
#product_area .product-track {position:relative;width:100%;margin-top:35px;padding-left:max(50px,calc((100vw - 1540px)/2));box-sizing:border-box}
#product_area #product_list {position:relative;width:100%;margin:0;padding:0;list-style:none}
#product_area #product_list .slick-list {overflow:hidden}
#product_area #product_list .slick-track {display:flex;align-items:flex-start}
#product_area #product_list .slick-slide {height:auto}
#product_area #product_list .slick-slide>div {height:100%}
#product_area .product_item {position:relative;height:100%;margin:0;padding-right:27px;vertical-align:top;box-sizing:border-box}
#product_area .product_item:last-child {padding-right:0}
#product_area .productimg {position:relative;width:100%;aspect-ratio:1/1.15;overflow:hidden;background:#ddd4c7}
#product_area .productimg:after {position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--black-rgb),0) 60%,rgba(var(--black-rgb),.06));content:"";pointer-events:none}
#product_area .productimg img {display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.65,.25,1)}
#product_area .product_no {position:absolute;z-index:2;left:17px;top:17px;display:flex;min-width:35px;height:28px;align-items:center;justify-content:center;padding:0 8px;background:rgba(var(--secondary-rgb),.94);font-family:var(--font-en);font-size:13px;font-style:italic;line-height:1;color:var(--primary);box-sizing:border-box}
#product_area .product_info {padding-top:22px}
#product_area .product_name {font-family:var(--font-serif);font-size:22px;font-weight:400;line-height:1.5;letter-spacing:.04em;color:var(--primary)}
#product_area .product_sub {margin-top:4px;font-family:var(--font-family);font-size:10px;font-weight:500;line-height:1.6;letter-spacing:.1em;color:var(--info);text-transform:uppercase}
#product_area .product_item:hover .productimg img {transform:scale(1.045)}
#product_area .product_item .masklink {z-index:5}
#product_area .product_foot {display:flex;align-items:center;justify-content:space-between;margin-top:42px}
#product_area .product_note {margin:0;font-family:var(--font-family);font-size:15px;line-height:1.8;letter-spacing:.03em;color:var(--info)}
#product_area .product_arrows {display:flex;align-items:center;gap:10px}
#product_area .circle_btn {display:flex;width:44px;height:44px;align-items:center;justify-content:center;padding:0;border:1px solid rgba(var(--primary-rgb),.28);border-radius:50%;background:transparent;color:var(--primary);cursor:pointer;transition:background .35s ease,border-color .35s ease,color .35s ease,transform .35s ease}
#product_area .circle_btn span {display:block;margin-top:-3px;font-family:Arial,sans-serif;font-size:27px;font-weight:300;line-height:1;color:inherit}
#product_area .circle_btn:hover {border-color:var(--primary);background:var(--primary);color:var(--secondary);transform:translateY(-2px)}
#product_area .product_arrows .slick-disabled {opacity:.28;pointer-events:none;transform:none}
#product_area .product_arrows .slick-disabled:hover {border-color:rgba(var(--primary-rgb),.28);background:transparent;color:var(--primary);transform:none}
@keyframes productCatSlide{0%,100%{transform:translateX(-5px);opacity:.45;}50%{transform:translateX(3px);opacity:1;}}
/* #place_area */
#place_area {position:relative;padding:105px 0 70px;background:var(--cream);overflow:hidden;color:var(--primary);font-family:var(--font-family)}
#place_area .place_frame {position:relative;width:min(1540px,calc(100% - 100px));min-height:840px;margin:auto}
#place_area .place_intro {position:absolute;left:0;top:45px;width:39%;z-index:4}
#place_area .sub_title {margin:0 0 35px;color:var(--gold)}
#place_area .area_title span {font-size:clamp(38px,2.65vw,54px);line-height:1.75;font-family:var(--font-serif);color:var(--primary)}
#place_area .area_title {display:flex;flex-direction:column}
#place_area .place_desc {margin-top:28px}
#place_area .place_desc p {margin:0 0 12px;font-family:var(--font-family);font-size:15px;font-weight:400;line-height:1.9;letter-spacing:.045em;color:var(--info)}
#place_area .place_photo {position:absolute;z-index:3}
#place_area .place_photo_main {right:0;top:0;width:55%}
#place_area .place_photo_small {left:0;bottom:0;width:25%}
#place_area .photo_reveal {position:relative;width:100%;overflow:hidden;background:var(--secondary)}
#place_area .place_photo_main .photo_reveal {aspect-ratio:16/9}
#place_area .place_photo_small .photo_reveal {aspect-ratio:1/1.05}
#place_area .photo_reveal img {display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.6s cubic-bezier(.16,.72,.25,1)}
#place_area .photo_cover {position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;background:var(--cream);transform:translateX(0);transition:transform 1.2s cubic-bezier(.77,0,.18,1) .18s;pointer-events:none}
#place_area .photo_reveal_reverse .photo_cover {transform:translateX(0)}
#place_area .place_photo.aos-animate .photo_reveal img {transform:scale(1)}
#place_area .place_photo.aos-animate .photo_reveal:not(.photo_reveal_reverse) .photo_cover {transform:translateX(101%)}
#place_area .place_photo.aos-animate .photo_reveal_reverse .photo_cover {transform:translateX(-101%)}
#place_area .place_photo:after {position:absolute;z-index:3;left:0;top:0;width:0;height:1px;background:rgba(var(--gold-rgb),.65);content:"";transition:width 1.25s ease .35s}
#place_area .place_photo.aos-animate:after {width:100%}
#place_area .place_caption {display:flex;align-items:center;gap:11px;margin-top:15px;color:var(--info)}
#place_area .place_caption span {font-family:var(--font-en);font-size:14px;font-style:italic;color:var(--gold)}
#place_area .place_caption i {display:block;width:15px;height:1px;background:rgba(var(--primary-rgb),.35)}
#place_area .place_caption p {margin:0;font-size:14px;font-weight:400;letter-spacing:.07em;color:var(--info)}
#place_area .place_beans {position:absolute;z-index:5;left:31%;top:-75px;width:145px;height:370px;pointer-events:none}
#place_area .place_bean {position:absolute}
#place_area .place_bean img {display:block;width:100%;height:auto}
#place_area .bean_01 {left:0;top:0;width:170px;animation:placeBeanFloat01 7s ease-in-out infinite}
#place_area .bean_02 {right:-20px;top:180px;width:36px;animation:placeBeanFloat02 6s ease-in-out infinite}
#place_area .bean_03 {right:8px;top:260px;width:47px;transform:rotate(35deg);animation:placeBeanFloat03 8s ease-in-out infinite}
#place_area .place_slogan {position:absolute;left:46%;bottom:80px;z-index:4}
#place_area .place_slogan-small {font-family:var(--font-family)}
#place_area .place_slogan_small {margin-bottom:15px;font-family:var(--font-family);font-size:11px;font-weight:600;line-height:1;letter-spacing:.18em;color:var(--triadic1)}
#place_area .place_slogan_big {font-family:var(--font-en);font-size:40px;font-weight:800;font-style:italic;line-height:1.2;color:var(--primary)}
#place_area .place_visit {position:absolute;right:1%;bottom:68px;z-index:5;display:flex;width:110px;height:110px;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(var(--primary-rgb),.32);border-radius:50%;text-decoration:none;color:var(--primary);transition:background .45s ease,color .45s ease,border-color .45s ease,transform .45s ease}
#place_area .place_visit:before {position:absolute;inset:8px;border:1px solid transparent;border-radius:50%;content:"";transition:border-color .45s ease,transform .45s ease}
#place_area .place_visit span {font-size:13px;font-weight:500;letter-spacing:.08em;color:inherit}
#place_area .place_visit small {margin-top:7px;font-size:9px;font-weight:600;letter-spacing:.12em;color:var(--info);transition:color .45s ease}
#place_area .place_visit:hover {border-color:var(--primary);background:var(--primary);color:var(--secondary);transform:translateY(-5px)}
#place_area .place_visit:hover:before {border-color:rgba(var(--secondary-rgb),.24);transform:scale(1)}
#place_area .place_visit:hover small {color:rgba(var(--secondary-rgb),.75)}
@keyframes placeBeanFloat01{0%,100%{transform:translate3d(0,0,0) rotate(-8deg)}50%{transform:translate3d(0,-12px,0) rotate(-5deg)}}
@keyframes placeBeanFloat02{0%,100%{transform:translate3d(0,0,0) rotate(25deg)}50%{transform:translate3d(5px,-8px,0) rotate(31deg)}}
@keyframes placeBeanFloat03{0%,100%{transform:translate3d(0,0,0) rotate(35deg)}50%{transform:translate3d(-5px,-10px,0) rotate(29deg)}}

/* #news_area */
#news_area .list_box img {height:320px}
#news_area .list_box .info_box {padding:15px 30px}
#news_area .list_box .info_box p a {margin-right:10px; max-width:calc(100% - 100px); font-weight:400; z-index:2}
#news_area .list_box .info_box p .time {width:90px; font-weight:300}
#news_area .list_box .info_box h3 {height:34px; font-size:20px}

/* #book_area */
#book_area .list_box img {height:450px}
#book_area .list_box .img_box {border:var(--white) solid; border-width:0 1px 1px 0}
#book_area .list_box .img_box:before,#book_area .list_box .img_box:after {position:absolute; width:100%; height:100%; background:var(--white); z-index:9; opacity:.4; content:""}
#book_area .list_box .img_box:after {right:0; bottom:0}
#book_area .list_box .atag_item {z-index:10}
#book_area .list_box .badge {margin:auto; padding:10px 20px; max-width:calc(80% - 40px); height:34px; line-height:36px; font-size:20px}

/* #youtube_box */
#youtube_box {min-height:1px; padding-bottom:30%}
#youtube_box a {position:absolute; background:var(--white); display:flex; top:50%; left:50%; z-index:99}
#youtube_box a i {margin:auto; font-size:30px; color:var(--primary)}
#youtube_box iframe {position:absolute; width:100%; height:100%; top:0; left:0; z-index:5}

/* #custom_area */
#custom_area {margin:0; padding:5vw 0 3vw}
#custom_area:before {position:absolute; width:100%; height:75%; background:rgba(var(--primary-rgb),.1); display:block; bottom:0; left:0; opacity:.3; content:""}

/* #custom_box */
#custom_box {padding:8vw 0 5vw}
#custom_box li .row {margin:30px 20px; padding:30px; display:block; border-bottom:2px var(--primary) solid}
#custom_box li .row h2 {font-size:20px}
#custom_box li .row article {margin-top:30px; line-height:200%}
@-webkit-keyframes spineer{0%{-webkit-box-shadow:0 0 0 0 var(--info)}70%{-webkit-box-shadow:0 0 0 20px transparent}100%{-webkit-box-shadow:0 0 0 0 transparent}}
@keyframes spineer{0%{box-shadow:0 0 0 0 var(--info)}70%{box-shadow:0 0 0 20px transparent}100%{box-shadow:0 0 0 0 transparent}}
.line_more {position:relative;display:flex;width:180px;align-items:center;padding:0 0 15px;text-decoration:none;font-family:var(--font-family);font-size:13px;font-weight:500;letter-spacing:.07em;color:var(--primary);transition:color .4s ease}
.line_more:after {position:absolute;left:0;bottom:0;width:100%;height:1px;background:rgba(var(--primary-rgb),.65);transform-origin:left center;content:"";transition:transform .45s ease}
.line_more span {white-space:nowrap;color:inherit}
.line_more i {flex:1}
.line_more b {font-size:27px;font-weight:300;line-height:1;color:var(--primary);transition:transform .45s ease,color .45s ease}
.line_more:hover {color:var(--gold)}
.line_more:hover:after {transform:scaleX(.45)}
.line_more:hover b {color:var(--gold);transform:rotate(90deg)}

/* #news_area */
#news_area {position:relative;padding:0 0 90px;background:var(--cream);overflow:hidden;color:var(--primary);font-family:var(--font-family)}
#news_area .bg_box {z-index:0;inset:0;background-position:center;background-size:cover;pointer-events:none}
#news_area .news_marquee {position:relative;z-index:2;width:100%;overflow:hidden;border-top:1px solid rgba(var(--primary-rgb),.15);border-bottom:1px solid rgba(var(--primary-rgb),.15)}
#news_area .news_marquee_track {display:flex;width:max-content;align-items:center;height:105px;animation:newsMarquee 30s linear infinite;white-space:nowrap}
#news_area .news_marquee_track span {font-family:var(--font-serif);font-size:42px;font-weight:500;line-height:1;letter-spacing:.035em;color:rgba(var(--triadic1-rgb),.52)}
#news_area .news_marquee_track i {display:block;margin:0 35px;font-family:var(--font-serif);font-size:28px;font-style:normal;color:rgba(var(--triadic1-rgb),.55)}
#news_area .news_frame {z-index:2;display:grid;grid-template-columns:34% 66%;width:min(1540px,calc(100% - 100px));max-width:none;margin:0 auto;padding-top:115px}
#news_area .news_left {position:relative;padding-top:7px}
#news_area .title_box {position:relative}
#news_area .sub_title {margin:0 0 33px;font-size:11px;color:var(--triadic1)}
#news_area .area_title span {font-family:var(--font-serif);font-size:clamp(38px,2.6vw,52px);font-weight:400;line-height:1.7;letter-spacing:.06em;color:var(--primary)}
#news_area .area_title {display:flex;flex-direction:column}
#news_area .line_more {margin-top:58px}
#news_area .list_box {position:relative;min-width:0}
#news_area .list_box ul {margin:0;padding:0;list-style:none}
#news_area .list_box .slick-list {overflow:hidden}
#news_area .list_box .slick-slide {height:auto;border-bottom:1px solid rgba(var(--primary-rgb),.17)}
#news_area .news_item {display:grid;grid-template-columns:120px minmax(0,1fr) 50px;align-items:center;min-height:170px;padding:24px 0;gap:25px}
#news_area .news_img {position:relative;width:120px;height:120px;overflow:hidden;background:var(--secondary)}
#news_area .news_img img {display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.65,.25,1),filter .6s ease}
#news_area .news_info {position:relative;min-width:0}
#news_area .news_meta {display:flex;align-items:center;gap:8px;margin-bottom:16px;font-size:9px;font-weight:500;line-height:1;letter-spacing:.07em;color:var(--info)}
#news_area .news_meta span {color:inherit;font-size:12px}
#news_area .news_meta i {display:block;width:10px;height:1px;background:rgba(var(--primary-rgb),.28)}
#news_area .news_meta a {position:relative;z-index:6;text-decoration:none;color:var(--info);transition:color .3s ease;font-size:12px}
#news_area .news_meta a:hover {color:var(--gold)}
#news_area .news_title {overflow:hidden;margin-bottom:9px;font-family:var(--font-serif);font-size:22px;font-weight:400;line-height:1.5;letter-spacing:.04em;color:var(--primary);text-overflow:ellipsis;white-space:nowrap;transition:color .35s ease,transform .45s ease}
#news_area .news_intro {overflow:hidden;font-family:var(--font-family);font-size:16px;font-weight:400;line-height:1.8;letter-spacing:.03em;color:var(--info);text-overflow:ellipsis;white-space:nowrap}
#news_area .news_plus {display:flex;width:44px;height:44px;align-items:center;justify-content:center;justify-self:end;font-family:var(--font-family);font-size:28px;font-weight:300;line-height:1;color:var(--primary);transition:transform .45s ease,color .35s ease}
#news_area .atag_item {z-index:5;inset:0}
#news_area .news_item:hover .news_img img {transform:scale(1.07);filter:brightness(.94)}
#news_area .news_item:hover .news_title {color:var(--gold);transform:translateX(5px)}
#news_area .news_item:hover .news_plus {color:var(--gold);transform:rotate(90deg)}
#news_area .slick-slide>div {height:100%}
#news_area .slick-current .news_item {opacity:1}
@keyframes newsMarquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* @media */
@media screen and (max-width:1399px) {
  #story_area { min-height: 760px; padding-top: 100px }
  #story_area .story_frame { width: calc(100% - 80px); min-height: 660px }
  #story_area .story_content { grid-template-columns: 46% 34% 20%; padding-top: 62px }
  #story_area .story_desc p { font-size: 15px; line-height: 2.25 }
  #story_area .bean_large { right: -50px; top: 120px; width: 290px }
  #story_area .bean_small { top: 295px; width: 50px }
  #product_area { padding: 90px 0 65px }
  #product_area .workframe { width: calc(100% - 80px) }
  #product_area .product-track { padding-left: 40px }
  #product_area .product_item { padding-right: 22px }
  #product_area .productcatenav { margin-top: 50px }
  #product_area .area_title { font-size: clamp(34px,3.4vw,46px) }
  #product_area .productcate_wrap { margin-top: 50px; }
  #place_area { padding: 90px 0 65px }
  #place_area .place_frame { width: calc(100% - 80px); min-height: 690px }
  #place_area .place_intro { top: 35px }
  #place_area .area_title { font-size: clamp(35px,3vw,46px) }
  #place_area .place_photo_main { width: 55% }
  #place_area .place_photo_small { width: 26% }
  #place_area .place_beans { left: 31%; top: -55px; transform: scale(.85); transform-origin: top left }
  #place_area .place_slogan { left: 45%; bottom: 70px }
  #place_area .place_visit { bottom: 60px; width: 100px; height: 100px }
  #news_area { padding-bottom: 80px }
  #news_area .news_marquee_track { height: 95px }
  #news_area .news_marquee_track span { font-size: 38px }
  #news_area .news_frame { grid-template-columns: 32% 68%; width: calc(100% - 80px); padding-top: 95px }
  #news_area .area_title { font-size: clamp(35px,3vw,46px) }
  #news_area .news_item { grid-template-columns: 105px minmax(0,1fr) 45px; min-height: 155px; gap: 22px; padding: 20px 0 }
  #news_area .news_img { width: 105px; height: 105px }
}
@media screen and (max-width:1199px) {
  #story_area { min-height: 700px; padding-top: 85px }
  #story_area .story_frame { width: calc(100% - 60px); min-height: 615px }
  #story_area .story_content { grid-template-columns: 44% 36% 20%; padding-top: 55px }
  #story_area .story_main_title { font-size: clamp(31px,3.4vw,43px) }
  #story_area .story_desc p { font-size: 14px }
  #story_area .bean_large { right: -35px; width: 250px }
  #story_area .story_bg_text { font-size: 110px }
  #product_area .twoo_box { gap: 45px }
  #product_area .title_right { padding-right: 0 }
  #product_area .productcatenav { margin-top: 45px }
  #product_area .tab_btn { margin-right: 30px }
  #product_area .product_item { padding-right: 20px }
  #product_area .productcate_wrap { margin-top: 45px; }
  #place_area .place_frame { min-height: 630px }
  #place_area .place_intro { width: 38% }
  #place_area .place_desc p { font-size: 13px }
  #place_area .place_photo_main { width: 56% }
  #place_area .place_photo_small { width: 27% }
  #place_area .place_beans { left: 29%; transform: scale(.72); transform-origin: top left }
  #place_area .place_slogan { left: 43%; bottom: 55px }
  #place_area .place_slogan_big { font-size: 30px }
  #place_area .place_visit { bottom: 45px; width: 90px; height: 90px }
  #news_area .news_frame { grid-template-columns: 30% 70%; padding-top: 85px }
  #news_area .area_title { font-size: 38px }
  #news_area .line_more { margin-top: 45px }
  #news_area .news_item { grid-template-columns: 95px minmax(0,1fr) 40px; min-height: 145px; gap: 18px }
  #news_area .news_img { width: 95px; height: 95px }
  #news_area .news_title { font-size: 18px }
  #news_area .news_intro { font-size: 11px }
}
@media screen and (max-width:991px) {
  #story_area { min-height: auto; padding: 80px 0 70px }
  #story_area .story_frame { width: calc(100% - 50px); min-height: 0 }
  #story_area .story_content { grid-template-columns: 1fr 1fr; padding-top: 55px }
  #story_area .story_title { padding-right: 40px }
  #story_area .story_text { padding-top: 0 }
  #story_area .story_beans { position: absolute; right: 0; bottom: -50px; width: 260px; height: 260px; opacity: .35 }
  #story_area .bean_large { right: -30px; top: 10px; width: 220px }
  #story_area .bean_small { left: 20px; top: 150px; width: 40px }
  #story_area .story_bg_text { position: relative; left: auto; bottom: auto; margin-top: 65px; font-size: 90px }
  #product_area { padding: 80px 0 60px }
  #product_area .workframe { width: calc(100% - 50px) }
  #product_area .twoo_box { align-items: flex-start; gap: 40px }
  #product_area .area_title { font-size: 40px }
  #product_area .title_right p { font-size: 13px }
  #product_area .productcatenav { overflow-x: auto; overflow-y: hidden; margin-top: 45px; scrollbar-width: none }
  #product_area .productcatenav::-webkit-scrollbar { display: none }
  #product_area .tab_btn { margin-right: 28px }
  #product_area .product-track { padding-left: 25px }
  #product_area .product_item { padding-right: 20px }
  #product_area .product_name { font-size: 20px }
  #product_area .productcate_wrap { margin-top: 45px; }
  #product_area .productcatenav { overflow-x: auto; overflow-y: hidden; padding-right: 75px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  #product_area .productcatenav::-webkit-scrollbar { display: none; }
  #product_area .productcat_scroll_hint { position: absolute; z-index: 8; right: 0; top: -90px; bottom: 0; display: flex; width: 78px; align-items: center; justify-content: flex-end; gap: 7px; padding-right: 8px; background: linear-gradient(90deg,rgba(235,228,216,0) 0%,rgba(235,228,216,.88) 40%,#ebe4d8 68%); font-family: var(--font-family); font-size: 11px; font-weight: 500; letter-spacing: .06em; color: var(--primary); pointer-events: none; transition: opacity .35s ease,visibility .35s ease; }
  #product_area .productcat_scroll_hint>span { white-space: nowrap; }
  #product_area .productcat_scroll_hint>i { position: relative; display: block; width: 22px; height: 1px; background: var(--primary); animation: productCatSlide 1.35s ease-in-out infinite; }
  #product_area .productcat_scroll_hint>i:after { position: absolute; right: 0; top: -3px; width: 6px; height: 6px; border-top: 1px solid var(--primary); border-right: 1px solid var(--primary); transform: rotate(45deg); content: ""; }
  #product_area .productcate_wrap.is-scrolled .productcat_scroll_hint { opacity: 0; visibility: hidden; }
  #place_area { padding: 80px 0 65px }
  #place_area .place_frame { width: calc(100% - 50px); min-height: 0 }
  #place_area .place_intro { position: relative; left: auto; top: auto; width: 70% }
  #place_area .place_photo { position: relative }
  #place_area .place_photo_main { right: auto; top: auto; width: 78%; margin: 60px 0 0 auto }
  #place_area .place_photo_small { left: auto; bottom: auto; width: 45%; margin-top: 45px }
  #place_area .place_beans { left: auto; right: 6%; top: 40px; transform: scale(.7); transform-origin: top right }
  #place_area .place_slogan { position: relative; left: auto; bottom: auto; margin: 55px 0 0 47% }
  #place_area .place_visit { right: 2%; bottom: 0 }
  #news_area .news_marquee_track { height: 82px }
  #news_area .news_marquee_track span { font-size: 32px }
  #news_area .news_marquee_track i { margin: 0 28px; font-size: 23px }
  #news_area .news_frame { grid-template-columns: 34% 66%; width: calc(100% - 50px); padding-top: 75px }
  #news_area .area_title { font-size: 34px }
  #news_area .news_item { grid-template-columns: 82px minmax(0,1fr) 35px; min-height: 128px; gap: 15px; padding: 17px 0 }
  #news_area .news_img { width: 82px; height: 82px }
  #news_area .news_meta { margin-bottom: 10px }
  #news_area .news_title { margin-bottom: 5px; font-size: 16px }
}
@media screen and (max-width:768px) {
  #news_area .list_box .info_box { padding: 15px 0 }
  #youtube_box { padding-bottom: 60vw }
  #custom_box li .row { margin: 10px 15px; padding: 10px 0 }
}
@media screen and (max-width:767px) {
  #story_area { padding: 65px 0 55px }
  #story_area .story_frame { width: calc(100% - 40px) }
  #story_area .story_no { margin-bottom: 20px; font-size: 9px }
  #story_area .story_content { display: block; padding-top: 45px }
  #story_area .story_title { padding-right: 0 }
  #story_area .story_en { margin-bottom: 22px; font-size: 10px }
  #story_area .story_main_title { font-size: 32px; line-height: 1.7 }
  #story_area .story_text { margin-top: 45px }
  #story_area .story_desc { max-width: 100% }
  #story_area .story_desc p { margin-bottom: 22px; font-size: 15px; line-height: 2.15 }
  #story_area .story_more { width: 175px; margin-top: 30px }
  #story_area .story_beans { right: -40px; bottom: 20px; width: 190px; height: 210px; opacity: .2 }
  #story_area .bean_large { right: -20px; top: 15px; width: 180px }
  #story_area .bean_small { left: 10px; top: 135px; width: 32px }
  #story_area .story_bg_text { margin-top: 80px; font-size: 62px }
  #product_area { padding: 65px 0 50px }
  #product_area .workframe { width: calc(100% - 40px) }
  #product_area .twoo_box { display: block }
  #product_area .sub_title { margin-bottom: 20px; font-size: 9px }
  #product_area .area_title { font-size: 32px }
  #product_area .title_right { margin-top: 25px }
  #product_area .title_right p { font-size: 15px; line-height: 1.9 }
  #product_area .productcatenav { margin-top: 38px }
  #product_area .tab_btn { margin-right: 25px; padding-bottom: 15px; font-size: 13px }
  #product_area .tab_btn small { font-size: 8px }
  #product_area .product-track { margin-top: 27px; padding-left: 20px; padding-right: 20px }
  #product_area .product_item { padding-right: 15px }
  #product_area .productimg { aspect-ratio: 1/1.12 }
  #product_area .product_no { left: 13px; top: 13px; min-width: 32px; height: 25px; font-size: 12px }
  #product_area .product_info { padding-top: 17px }
  #product_area .product_name { font-size: 20px }
  #product_area .product_sub { font-size: 12px }
  #product_area .product_foot { margin-top: 30px }
  #product_area .product_note { font-size: 13px }
  #product_area .product_arrows { gap: 7px }
  #product_area .circle_btn { width: 40px; height: 40px }
  #product_area .circle_btn span { font-size: 24px }
  #product_area .productcate_wrap { margin-top: 38px; }
  #product_area .productcatenav { padding-right: 70px; }
  #product_area .productcat_scroll_hint { width: 71px; font-size: 10px; }
  #place_area { padding: 65px 0 55px }
  #place_area .place_frame { width: calc(100% - 40px) }
  #place_area .place_intro { width: 100% }
  #place_area .sub_title { margin-bottom: 22px }
  #place_area .area_title { font-size: 31px; line-height: 1.7 }
  #place_area .place_desc { margin-top: 22px }
  #place_area .place_desc p { font-size: 15px }
  #place_area .place_photo_main { width: 100%; margin-top: 45px }
  #place_area .place_photo_small { width: 66%; margin-top: 35px }
  #place_area .place_beans { right: -30px; top: 70px; transform: scale(.45); opacity: .4 }
  #place_area .place_caption { margin-top: 11px }
  #place_area .place_slogan { margin: 50px 0 0 0 }
  #place_area .place_slogan_small { font-size: 9px }
  #place_area .place_slogan_big { font-size: 28px }
  #place_area .place_visit { right: 0; bottom: -5px; width: 85px; height: 85px }
  #place_area .place_visit span { font-size: 18px }
  #place_area .place_visit small { font-size: 11px; margin-top: 0 }
  #news_area { padding-bottom: 60px }
  #news_area .news_marquee_track { height: 70px }
  #news_area .news_marquee_track span { font-size: 27px }
  #news_area .news_marquee_track i { margin: 0 20px; font-size: 18px }
  #news_area .news_frame { display: block; width: calc(100% - 40px); padding-top: 65px }
  #news_area .sub_title { margin-bottom: 22px; font-size: 12px }
  #news_area .area_title { font-size: 31px; line-height: 1.65 }
  #news_area .line_more { margin-top: 30px }
  #news_area .list_box { margin-top: 55px }
  #news_area .list_box .slick-slide { border-bottom: 0 }
  #news_area .news_item { display: grid; grid-template-columns: 105px minmax(0,1fr) 35px; min-height: 140px; padding: 18px 0; border-top: 1px solid rgba(var(--primary-rgb),.16); border-bottom: 1px solid rgba(var(--primary-rgb),.16); gap: 17px }
  #news_area .news_img { width: 105px; height: 105px }
  #news_area .news_meta { margin-bottom: 10px; font-size: 8px }
  #news_area .news_title { font-size: 17px }
  #news_area .news_intro { font-size: 10px }
  #news_area .news_plus { width: 35px; height: 35px; font-size: 23px }
}
@media screen and (max-width:640px) {
  #book_area .list_box img { height: 65vw }
}
@media screen and (max-width:550px) {
  #product_area .area_title { font-size: 29px }
  #product_area .product-track { padding-left: 20px; padding-right: 20px }
  #product_area .product_note { max-width: 215px }
  #product_area .product_item { padding-right: 0 }
  #news_area .news_marquee_track { height: 62px }
  #news_area .news_marquee_track span { font-size: 24px }
  #news_area .area_title { font-size: 28px }
  #news_area .news_item { grid-template-columns: 85px minmax(0,1fr) 28px; gap: 12px }
  #news_area .news_img { width: 85px; height: 85px }
  #news_area .news_title { font-size: 15px }
  #news_area .news_intro { display: none }
  #news_area .news_plus { width: 28px; font-size: 21px }
}
@media screen and (max-width:480px) {
  #story_area .story_main_title { font-size: 27px }
  #story_area .story_bg_text { font-size: 51px }
  #story_area .story_beans { right: -55px }
  #place_area .area_title { font-size: 28px }
  #place_area .place_photo_small { width: 78% }
  #place_area .place_slogan_big { font-size: 25px }
  #place_area .place_visit { width: 110px; height: 110px }
}
@media screen and (max-width:400px) {
  #product_area .area_title { font-size: 27px }
  #product_area .title_right p { font-size: 12px }
  #product_area .product_note { max-width: 160px; font-size: 10px }
  #product_area .circle_btn { width: 37px; height: 37px }
  #news_area .area_title { font-size: 26px }
  #news_area .news_item { grid-template-columns: 75px minmax(0,1fr) 25px }
  #news_area .news_img { width: 75px; height: 75px }
  #news_area .news_meta { gap: 5px; font-size: 7px }
  #news_area .news_title { font-size: 14px }
}
@media screen and (min-width:1281px) {
  #book_area .list_box li:hover .img_box:before,#book_area .list_box li:hover .img_box:after { transform: scaleY(1); -webkit-transform: scaleY(1) }
  #book_area .list_box li:hover .badge { background: var(--primary); color: var(--white) }
  #custom_box li:hover .row { box-shadow: 0 4px 17px 0 rgba(var(--black-rgb),.2) }
}
