@charset "utf-8"; /* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a { z-index:100000; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden } 
#skipToContent a:focus, 
#skipToContent a:active { width:200px; height:50px; background:#21272e; color:#fff; font-size:14px; font-weight:bold; text-align:center; text-decoration:none; line-height:50px } 

.only-desktop-tablet { display:block; } 
.only-desktop { display:block; } 
.only-tablet { display:none; } 
.only-mobile { display:none; } 

#wrapper { overflow:hidden; } 


/* header */
#header { position:fixed; top:0; left:0; width:100%; transition:.2s; background:transparent; z-index:100; } 
#header .contain { display:flex; justify-content: space-between; align-items: center; max-width: 100% !important; height:var(--header-height); z-index:2; } 
#sub #header { position:absolute; border-bottom: 1px solid rgba(221,221,221,0.3); } 

.sitelogo a { display:block; width: 166px; height: 50px; margin-right:clamp(15px, calc( 45 / var(--inner) * 100vw ), 45px ); background:url("../images/common/logo.png") no-repeat center/contain; overflow:hidden; font-size:0; line-height:0; text-indent:-9999em; } 

#gnb { text-align:center; flex:1 1 auto; min-width:0; width:1%; } 
#gnb > ul { display:flex; text-align:center; } 
#gnb > ul > li { position:relative; } 
#gnb>ul>li>a { display:flex; align-items:center; flex-direction: column; justify-content:center; position:relative; height:var(--header-height); padding:0 clamp(15px, calc( 45 / var(--inner) * 100vw ), 45px ); font-weight:700; color:#fff; font-size:var(--font-size-20); letter-spacing:-.03em; line-height:1.3em; } 
#gnb>ul>li>a:after { content:""; position:absolute; bottom:-1px; left:50%; width:0; height:3px; background:var(--color-primary); transition:.2s; } 
#gnb>ul>li.active>a:after { width:100%; left:0; } 
#gnb .submenu { position:absolute; z-index:50; left:0; width:100%; height:0; overflow:hidden; } 
#gnb .submenu::after { content: ""; position: absolute; top:0; right:0; height:100%; width:1px; background-color: #ebebeb; } 
#gnb .submenu>ul { padding:20px 5px; } 
#gnb .submenu ul li a { display:block; padding:10px 0; font-size:var(--font-size-16); line-height:1.3em; color: #454545; } 
#gnb .submenu ul li a:hover { color: var(--color-primary); font-weight:600; } 
#gnb>ul>li.active .submenu { background-color: #fafafa; } 

.submenu-bg { display:none; position:absolute; left:0; width:100%; background-color: #fff; border-top:1px solid #ebebeb; } 

#header .sns-wrap { display:flex; align-items: center; gap: var(--space-35); margin-right:var(--space-35); } 
#header .sns-wrap a { display:block; width:29px; height:24px; background-position:center; background-size: contain; background-repeat: no-repeat; } 
#header .sns-wrap .naver { background-image: url(/images/common/naver.png); } 
#header .sns-wrap .youtube { background-image: url(/images/common/youtube.png); } 
#header .sns-wrap .insta { background-image: url(/images/common/insta.png); } 

#header.header-white { background: #fff; } 
#header.header-white .sitelogo a { background-image: url("../images/common/logo-on.png"); } 
#header.header-white #gnb>ul>li>a { color: #242424; } 
#header.header-white .btn-all-menu span,
#header.header-white .btn-all-menu span:before,
#header.header-white .btn-all-menu span:after { background: #242424; } 
#header.header-white .btn-m-menu span, 
#header.header-white .btn-m-menu span:before, 
#header.header-white .btn-m-menu span:after { background: #242424; } 
#header.header-white .sns-wrap .naver { background-image: url(/images/common/naver-on.png); } 
#header.header-white .sns-wrap .youtube { background-image: url(/images/common/youtube-on.png); } 
#header.header-white .sns-wrap .insta { background-image: url(/images/common/insta-on.png); } 
#header.header-white .btn-all-menu { background-image: url(/images/common/ham-on.png); } 
#header.header-white #gnb>ul>li>a { font-weight:600; padding:0 clamp(15px, calc( 90 / var(--inner) * 100vw ), 90px ); } 

#header:hover { background: #fff; } 
#header:hover .sitelogo a { background-image: url("../images/common/logo-on.png"); } 
#header:hover #gnb>ul>li>a { color: #242424; } 
#header:hover .btn-all-menu span,
#header:hover .btn-all-menu span:before,
#header:hover .btn-all-menu span:after { background: #242424; } 
#header:hover .btn-m-menu span, 
#header:hover .btn-m-menu span:before, 
#header:hover .btn-m-menu span:after { background: #242424; } 
#header:hover .sns-wrap .naver { background-image: url(/images/common/naver-on.png); } 
#header:hover .sns-wrap .youtube { background-image: url(/images/common/youtube-on.png); } 
#header:hover .sns-wrap .insta { background-image: url(/images/common/insta-on.png); } 
#header:hover .btn-all-menu { background-image: url(/images/common/ham-on.png); } 
#header:hover #gnb>ul>li>a { font-weight:600; padding:0 clamp(15px, calc( 90 / var(--inner) * 100vw ), 90px ); } 

/* 전체메뉴 */
.btn-all-menu { display: block; width: 28px; height: 22px; background: url(../images/common/ham.png) no-repeat 100%/contain; margin-left: var(--space-40); cursor:pointer; z-index: 1000; } 
.all-menu.active { transform:translateY(0); } 
.all-menu { position:fixed; top:0; left:0; width:100%; height:100vh; overflow: hidden; z-index:102; transition:ease .3s; transform:translateY(-100%); color: #fff; background: url(/images/common/bg-all.jpg) no-repeat center/cover; } 
.all-menu .top { position:relative; height:var(--header-height); border-bottom: 1px solid rgba(255,255,255,.6); } 
.all-menu .gnb-logo { position: absolute; top:50%; left:var(--container-space); transform: translateY(-50%); } 
.all-menu .gnb-logo img { height:100%; } 
.all-menu .close { position: absolute; top:50%; right:clamp(16px, calc( 25 / var(--inner) * 100vw ), 25px ); transform: translateY(-50%); width:50px; height:50px; text-indent:-9999em; overflow:hidden; background:url(../images/common/close-all.png) 50% 50% no-repeat; background-size:contain; cursor:pointer; z-index: 100; } 
.all-menu .contain { max-width: 1760px !important; height: calc(100% - var(--header-height)); } 
.all-menu .flex-area { display:flex; justify-content: space-between; align-items: center; height: 100%; } 
.all-menu .flex-area .nav { display: flex; flex-direction: column; justify-content: center; width:64%; height: 100%; border-right: 1px solid rgba(255,255,255,.6); padding-left:var(--space-80); } 
.all-menu .nav > ul > li { margin-bottom:var(--space-50); } 
.all-menu .nav > ul > li:last-child { margin-bottom:0; } 
.all-menu .nav > ul > li > a { display: block; margin-bottom: 10px; font-size: var(--font-size-40); font-weight: 700; line-height:1.3em; font-family: "gimpogothic"; } 
.all-menu .nav .submenu ul { display:flex; } 
.all-menu .nav .submenu > ul > li > a { position:relative; display: block; font-size: var(--font-size-20); font-weight: 500; color: #f0d1ce; line-height:2em; } 
.all-menu .nav .submenu > ul > li > a::after { content: ""; display:inline-block; margin:0 var(--space-20); width:1px; height:16px; background-color: rgba(255,255,255,.3); } 
.all-menu .nav .submenu > ul > li:last-child > a::after { display:none; } 
.all-menu .nav .submenu > ul > li > a:hover { font-weight:600; color: #fff; } 
.all-menu .logo-wrap { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: var(--space-170); } 
.all-menu .logo-wrap .info { display:flex; gap: var(--space-60); padding-top:clamp(30px, calc( 90 / var(--inner) * 100vw ), 90px ); } 
.all-menu .logo-wrap dl dt { font-family: "gimpogothic"; color: rgba(255,255,255,.7); font-size: var(--font-size-14); line-height:2.142em; } 
.all-menu .logo-wrap dl dd { font-size: var(--font-size-16); letter-spacing: -0.04em; line-height:1.875em; } 

/* main */
[data-aos=fade-up] { transform: translate3d(0,100px,0); } 
.main-visual { position:relative; height:100vh; background:#000; color:#fff; overflow:hidden; } 
.main-visual .item { position:relative; height:100vh; overflow:hidden; } 
.main-visual .image { position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; transition:5s linear; transform:scale(1.15); } 
.main-visual .image img { position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; } 
.main-visual .caption { position: absolute; left: 0; width: 100%; top: 50%; transform: translateY(-50%); } 
.main-visual .caption .contain { max-width: 1800px; } 
.main-visual .caption .t1 { margin-bottom:var(--space-20); font-size: var(--font-size-70); font-weight:700; line-height:1.2em; font-family: "gimpogothic"; } 
.main-visual .controls { position:absolute; top: 35%; right: 10%; display:flex; align-items:center; justify-content: flex-end; } 
.main-visual .pager { display:block; width:130px; font-family: "gimpogothic"; text-align:center; font-size:var(--font-size-20); line-height:1.33em; } 
.main-visual .pager .slush { margin:5px; } 
.main-visual .pager .current { font-size: var(--font-size-80); } 
.main-visual .slide-btn { width:60px; height:60px; margin-top: -15px; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; border:0; overflow:hidden; background-size: contain; } 
.main-visual .slide-prev { background-image:url("../images/main/slide-prev.png"); } 
.main-visual .slide-next { background-image:url("../images/main/slide-next.png"); } 
.main-visual .active .image { transform:scale(1); } 

.history-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-40); width: 100%; max-width: 1400px; margin: var(--space-100) auto 0; text-align: center; } 
.history-list li { display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: var(--border-radius-20-10); background-color: rgba(0,0,0,0.4); padding: var(--space-75) 0; color: #fff; } 
.history-list p { font-weight:500; margin-top: 10px; font-size: var(--font-size-18); line-height:1.666em; } 
.history-list .num { margin-top:var(--space-20); font-family: "gimpogothic"; font-weight: 700; font-size: var(--font-size-18); line-height:2.777em; } 
.history-list .num.flex { display:flex; align-items: center; } 
.history-list .num strong { font-size: var(--font-size-50); line-height: 1em; } 

.scroll-down { position: absolute; bottom:var(--space-70); right:var(--space-40); z-index: 50; animation: scrollUpDown 1s infinite alternate linear; width:20px; height:48px; background: url(/images/main/scroll.png) no-repeat center/contain; } 

@keyframes scrollUpDown { 
 0% { transform: translate(0, 0); } 
 100% { transform: translate(0, 15px); } 
 }

 /* fp-nav */
#fp-nav { right:var(--space-45) !important; transform: translateY(-50%) !important; margin-top: 0 !important; } 
#fp-nav:before { display:none !important; } 
#fp-nav::after { display:none !important; } 
#fp-nav ul li .fp-tooltip { display:none !important; } 
#fp-nav ul li, .fp-slidesNav ul li { width: 8px !important; height: 8px !important; } 
#fp-nav ul li a span, .fp-slidesNav ul li a span { width: 8px !important; height: 8px !important; background: rgba(255,255,255,.4); } 
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { width: 8px !important; height: 8px !important; background-color: #fff; } 

#fp-nav ul li:nth-child(4) { margin-bottom: 30px; } 

#main.fp-viewing-history #header,
#main.fp-viewing-review #header,
#main.fp-viewing-news #header { background:#fff; } 

#main.fp-viewing-history #header .sitelogo a,
#main.fp-viewing-review #header .sitelogo a,
#main.fp-viewing-news #header .sitelogo a { background-image: url(/images/common/logo-on.png); } 

#main.fp-viewing-history #header #gnb>ul>li>a,
#main.fp-viewing-review #header #gnb>ul>li>a, 
#main.fp-viewing-news #header #gnb>ul>li>a { color: #242424; } 

#main.fp-viewing-history #header .sns-wrap .naver,
#main.fp-viewing-review #header .sns-wrap .naver,
#main.fp-viewing-news #header .sns-wrap .naver { background-image: url(/images/common/naver-on.png); } 

#main.fp-viewing-history #header .sns-wrap .youtube,
#main.fp-viewing-review #header .sns-wrap .youtube,
#main.fp-viewing-news #header .sns-wrap .youtube { background-image: url(/images/common/youtube-on.png); } 

#main.fp-viewing-history #header .sns-wrap .insta,
#main.fp-viewing-review #header .sns-wrap .insta,
#main.fp-viewing-news #header .sns-wrap .insta { background-image: url(/images/common/insta-on.png); } 

#main.fp-viewing-history #header .btn-all-menu,
#main.fp-viewing-review #header .btn-all-menu,
#main.fp-viewing-news #header .btn-all-menu { background-image: url(/images/common/ham-on.png); } 

#main.fp-viewing-history #header .btn-m-menu span,
#main.fp-viewing-review #header .btn-m-menu span,
#main.fp-viewing-news #header .btn-m-menu span { position:absolute; right:0; top:50%; margin-top:-1px; height:2px; width:23px; background:#242424; } 

#main.fp-viewing-history #header .btn-m-menu span:before,
#main.fp-viewing-review #header .btn-m-menu span:before,
#main.fp-viewing-news #header .btn-m-menu span:before,
#main.fp-viewing-history #header .btn-m-menu span:after,
#main.fp-viewing-review #header .btn-m-menu span:after,
#main.fp-viewing-news #header .btn-m-menu span:after { content:" "; position:absolute; right:0; width:23px; height:2px; background:#242424; transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s; } 

#main.fp-viewing-history #fp-nav ul li a span, 
#main.fp-viewing-history .fp-slidesNav ul li a span { background: rgba(0,0,0,.15); } 
#main.fp-viewing-history #fp-nav ul li a.active span, 
#main.fp-viewing-history .fp-slidesNav ul li a.active span, 
#main.fp-viewing-history #fp-nav ul li:hover a.active span, 
#main.fp-viewing-history .fp-slidesNav ul li:hover a.active span { background-color: #000; } 

#main.fp-viewing-review #fp-nav ul li a span, 
#main.fp-viewing-review .fp-slidesNav ul li a span { background: rgba(0,0,0,.15); } 
#main.fp-viewing-review #fp-nav ul li a.active span, 
#main.fp-viewing-review .fp-slidesNav ul li a.active span, 
#main.fp-viewing-review #fp-nav ul li:hover a.active span, 
#main.fp-viewing-review .fp-slidesNav ul li:hover a.active span { background-color: #000; } 

#main.fp-viewing-news #fp-nav ul li a span, 
#main.fp-viewing-news .fp-slidesNav ul li a span { background: rgba(0,0,0,.15); } 
#main.fp-viewing-news #fp-nav ul li a.active span, 
#main.fp-viewing-news .fp-slidesNav ul li a.active span, 
#main.fp-viewing-news #fp-nav ul li:hover a.active span, 
#main.fp-viewing-news .fp-slidesNav ul li:hover a.active span { background-color: #000; } 

/* section */
.section { background-position:center; background-repeat:no-repeat; background-size:cover; } 
.section .flex-wrap { display:flex; justify-content: space-between; } 
.section .flex-wrap.ai-center { align-items: center; } 

.m-head { position:relative; margin-bottom:var(--space-80); } 
.m-head::before { content: ""; position: absolute; top:-60px; left:-90px; width:293px; height:207px; background: url(/images/main/logo-a.png) no-repeat center/contain; } 
.m-head .en { display:block; margin-bottom:var(--space-20); font-family: "gimpogothic"; font-size: var(--font-size-16); color: var(--color-primary); font-weight:700; letter-spacing: 0.2em; } 
.m-head .m-tit { width: fit-content; font-family: "gimpogothic"; font-size: var(--font-size-50); color: var(--color-dark); font-weight:400; line-height: 1.44em; } 
.m-head > p { font-size: var(--font-size-18); line-height: 1.666em; margin-top:var(--space-40); } 

.section-inner { padding-top:var(--header-height); } 

.btn-more { display: flex; justify-content: center; align-items: center; position: relative; width: fit-content; margin-top:var(--space-50); color: #000000; font-size: clamp(12px, calc( 16 / var(--inner) * 100vw ), 16px); z-index: 100; height: var(--space-60); padding-left: var(--space-30); } 
.btn-more span { display:inline-block; margin-left:var(--space-10); } 
.btn-more::before { content: ""; position: absolute; top:0; left:0; width: var(--space-60); height: var(--space-60); background-color: rgb(202, 58, 28); border-radius: 100%; opacity: 0.07; transition: .3s; z-index:-1; } 
.btn-more:hover { padding-right:30px; } 
.btn-more:hover span { color:#fff; } 
.btn-more:hover::before { left: auto; right:0; background-color: #c74225; opacity: 1; } 

.main-history { position:relative; background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(202,58,28,0.05) 100%); } 
.main-history .tab-slider { position: absolute; top:50%; right:0; transform: translateY(-50%); z-index: 10; } 
.main-history .tab-slider .tab ul { display:flex; justify-content:center; } 
.main-history .tab-slider .tab ul li a { position:relative; display: inline-block; padding: 0 var(--space-20); font-weight:700; font-size: var(--font-size-18); line-height:2.44em; color: var(--color-dark); } 
.main-history .tab-slider .tab ul li a::before { content: ""; position: absolute; top: 50%; right: 0; width:3px; height:3px; background-color: #242424; border-radius: 100%; z-index:-1; } 
.main-history .tab-slider .tab ul li:last-child a::before { display:none; } 
.main-history .tab-slider .tab ul li.active a { color: #fff; } 
.main-history .tab-slider .tab ul li.active a::after { content: ""; position: absolute; top: 50%; right: 0; right: 0; transform: translateY(-50%); width: 100%; height: 100%; background-color: var(--color-primary); border-radius: 50vh; z-index:-1; } 
.main-history .tab-slider .tab ul li a::before { display:none; } 
.main-history .tab-slider .tab ul li.active a::before { display:block; } 

#loadSlider { width: 100%; max-width: 770px; margin: 0 auto; } 
#loadSlider .swiper { overflow: visible; } 
.main-history .swiper-wrapper { align-items: end; } 
.main-history .swiper-slide a { display:flex; transform: scale(0.8); transform-origin: center bottom; border-radius: var(--border-radius-20-10); } 
.main-history .swiper-slide.swiper-slide-active a { transform: scale(1); } 

.main-history .info-wrap { width:36%; padding:var(--space-40); padding-bottom:var(--space-30); background-color: #fff; border-top-left-radius: var(--border-radius-20-10); border-bottom-left-radius: var(--border-radius-20-10); } 
.main-history .info-wrap .cate { margin-bottom:5px; font-weight:600; color: #ca3a1c; font-size: var(--font-size-16); } 
.main-history .info-wrap .tit { margin-bottom:var(--space-20); font-weight:700; font-size: var(--font-size-28); color: #242424; line-height:1.5em;  display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis; } 
.main-history .info-wrap .info { margin-bottom:var(--space-20); line-height:2em; } 

.main-history .thumb-wrap { flex: 1 1 auto; min-width:0; width:1%; } 
.main-history .thumb-wrap .thumb { position:relative; height:100%; overflow:hidden; border-top-right-radius: var(--border-radius-20-10); border-bottom-right-radius: var(--border-radius-20-10); } 
.main-history .thumb-wrap .thumb img { position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; border-top-right-radius: var(--border-radius-20-10); border-bottom-right-radius: var(--border-radius-20-10); } 

.main-history .btn-more { margin-top:var(--space-30); opacity: 0; transition: .3s; } 
.main-history .swiper-slide.swiper-slide-active .btn-more { opacity: 1; } 

.main-history .control-wrap { padding-top: var(--space-60); } 
.main-history .control-wrap .contain { display: flex; justify-content: space-between; align-items: center; } 
.main-history .swiper-scrollbar { opacity:1 !important; } 
.main-history .swiper-horizontal>.swiper-scrollbar,
.main-history .swiper-scrollbar { background-color: #ddd; } 
.main-history .swiper-scrollbar.swiper-scrollbar-horizontal { width: 100% !important; max-width: 1210px !important; position: relative; left: auto; bottom: auto; top: auto; } 
.main-history .swiper-scrollbar-drag { background-color: #ca3a1c !important; } 
.main-history .btn-wrap { display: flex; align-items: center; justify-content: end; position:relative; gap: 10px; width: 100%; max-width: 130px; height:60px; } 
.main-history .slide-arrow { position:relative; top: auto; z-index:50; overflow:hidden; width:60px; height:100%; border-radius:100%; border:0; background-color:#fff; background-position:50% 50%; background-repeat:no-repeat; background-size:6px auto; font-size:0; line-height:0; text-indent:-9999em; transition:.2s; } 
.main-history .slide-prev { left:0; background-image:url("/images/main/arrow-blk-left.png"); } 
.main-history .slide-prev:hover { background-image: url(/images/main/arrow-wht-left.png); } 
.main-history .slide-next { right:0; background-image:url("/images/main/arrow-blk.png"); } 
.main-history .slide-next:hover { background-image:url("/images/main/arrow-wht.png"); } 
.main-history .slide-arrow:hover { background-color:var(--color-primary); } 

.main-switch .m-head { position:relative; } 
.main-switch .m-head::before { background-image: url(/images/main/logo3.png); } 
.main-switch .m-head .tab-wrap { position: absolute; bottom:10px; right:0; } 
.main-switch .tab ul { display:flex; justify-content:center; } 
.main-switch .tab ul li a { display: flex; justify-content: center; align-items: center; padding: 0 var(--space-20); color: #fff; text-align: center; font-size: var(--font-size-18); font-weight: 700; line-height:2.44em; border-radius: 50vh; background: #ca3a1c; cursor:pointer; } 
.main-switch .tab ul li.active a { color: #ca3a1c; background:#fff; } 
.main-switch .slider { position:relative; } 
.main-switch .slider .item a { display:block; } 
.main-switch .item a > div { color: #fff !important; line-height:1em !important; } 
.main-switch .slider .item .thumb { position:relative; overflow:hidden; padding-bottom:68.18%; margin-bottom:var(--space-30); border-radius: var(--border-radius-20-10); } 
.main-switch .slider .item .thumb img { position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; border-radius: var(--border-radius-20-10); } 
.main-switch .item .menu { font-weight:600; font-size: var(--font-size-16); } 
.main-switch .item .tit { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:var(--space-20); font-weight:700; font-size: var(--font-size-24); } 
.main-switch .item .date { margin-top:var(--space-30); font-size: var(--font-size-14); } 
.main-switch .slider .control-wrap { padding-top: var(--space-60); } 
.main-switch .slider .control-wrap .contain { display: flex; justify-content: space-between; align-items: center; } 
.main-switch .swiper-scrollbar { opacity:1 !important; } 
.main-switch .swiper-horizontal>.swiper-scrollbar,
.main-switch .swiper-scrollbar { background-color: rgba(255,255,255,.3); } 
.main-switch .swiper-scrollbar.swiper-scrollbar-horizontal { width: 100% !important; max-width: 1210px !important; position: relative; left: auto; bottom: auto; top: auto; } 
.main-switch .swiper-scrollbar-drag { background-color: #fff !important; } 
.main-switch .slider .btn-wrap { display: flex; align-items: center; justify-content: end; position:relative; gap: 10px; width: 100%; max-width: 130px; height:60px; } 
.main-switch .slide-arrow { position:relative; top: auto; z-index:50; overflow:hidden; width:60px; height:100%; border-radius:100%; border:0; background-color:#fff; background-position:50% 50%; background-repeat:no-repeat; background-size:6px auto; font-size:0; line-height:0; text-indent:-9999em; transition:.2s; } 
.main-switch .slide-prev { left:0; background-image:url("/images/main/arrow-blk-left.png"); } 
.main-switch .slide-prev:hover { background-image: url(/images/main/arrow-wht-left.png); } 
.main-switch .slide-next { right:0; background-image:url("/images/main/arrow-blk.png"); } 
.main-switch .slide-next:hover { background-image:url("/images/main/arrow-wht.png"); } 

.main-fair { background-color: #ca3a1c; } 
.main-fair .slide-arrow:hover { background-color:var(--color-primary); } 

.main-festival { background-color: #004f6f; } 
.main-festival .slide-arrow:hover { background-color:#004f6f; } 
.main-festival .tab ul li a { background: #004f6f; } 
.main-festival .tab ul li.active a { color: #004f6f; background: #fff; } 

.main-review { position:relative; background: #faecea; } 
.main-review:before { content:''; position:absolute; top:0; left:0; width:100%; height:100vh; background: url(/images/main/bg-review.jpg) no-repeat center/cover; } 
.main-review .section-inner { padding:var(--space-150) 0; } 
.main-review .m-head { width: 32%; margin-bottom: 0; padding-top: var(--space-80); } 
.main-review .m-head::before { top: 0; left: -75px; } 
.main-review .review-wrap { flex: 1 1 auto; width:1%; min-width:0; height: calc(100vh - var(--space-150)); overflow: auto; scrollbar-width: none; } 
.main-review .review-list { position: relative; display: flex; align-items: center; justify-content: end; align-items: center; gap: 30px; padding: 30px; } 
 .main-review .review-wrap ul { display: flex; flex-direction: column; align-items: center; justify-content: start; gap: 30px; } 
.main-review .review-wrap ul li { position: relative; width: 100%; max-width: 425px; padding: var(--space-40); line-height: 1.87em; border-radius: var(--border-radius-20-10); background-color: #fff; box-shadow: 0px 10px 30px 0px rgba(199, 66, 37, 0.08); } 
.main-review .review-wrap .tt { display:flex; align-items: center; margin-bottom:var(--space-20); } 
.main-review .review-wrap .tt .id { margin-left:var(--space-20); font-weight:600; font-size: var(--font-size-20); color: #242424; } 
.main-review .review-wrap .tx { font-size: var(--font-size-15); } 
.main-review.active .m-head { position:fixed; top:var(--space-150); z-index:100; } 

.iScrollIndicator { opacity:.1; } 

.fp-scroller,
.iScrollIndicator { transition-duration:600ms !important; } 

/* main-news */
.main-news .m-head { position:relative; } 
.main-news  .tab-menu { position: absolute; bottom: 10px; right: 0; } 
.main-news .tab-menu ul { display: flex; } 
.main-news .tab-menu ul li a { display: flex; justify-content: center; align-items: center; padding: 0 var(--space-20); color: #242424; text-align: center; font-size: var(--font-size-18); font-weight: 700; line-height: 2.44em; border-radius: 50vh; background: #fff; cursor: pointer; } 
.main-news .tab-menu ul li.active a { color: #fff; background: #ca3a1c; } 

.news-list2 ul { border-top:1px solid #242424; } 
.news-list2 ul li { position: relative; border-bottom: 1px solid #ddd; } 
.news-list2 ul li::after { content: ""; position: absolute; top:50%; right:var(--space-60); transform: translateY(-50%); width:25px; height:25px; background: url(/images/main/plus.png) no-repeat center/contain; } 
.news-list2 ul li a { display:flex; } 
.news-list2 ul li a:hover { background-color: #fafafa; } 
.news-list2 ul li a .menu { width: 9%; } 
.news-list2 ul li a .cnt { flex: 1 1 auto; width:1%; min-width:0; padding:var(--space-40); letter-spacing: -0.05em; } 
.news-list2 .menu { display:flex; justify-content: center; align-items: center; writing-mode: vertical-lr; font-family: "gimpogothic"; font-weight:700; color: var(--color-primary); letter-spacing: 0.2em; font-size: var(--font-size-14); } 
.news-list2 .tit { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:10px; font-weight:600; font-size: var(--font-size-24); color: #242424; line-height:1.75em; } 
.news-list2 .date { line-height:1.75em; color: #898989; } 

/* sub page */
.contain { max-width:1600px; margin:0 auto; padding-left:var(--container-space); padding-right:var(--container-space); } 
#contArea { max-width:1600px; padding-left:var(--container-space); padding-right:var(--container-space); margin:0 auto; } 
#contArea.wide { max-width:100% !important; padding-left:0; padding-right:0; } 

#sub #contArea,
#sub .contain { max-width: 1400px; } 

.sub-title { padding: var(--space-100) 0 var(--space-80); text-align:center; } 
.sub-title h1 { font-size:var(--font-size-50); line-height:1em; color:var(--color-dark); } 

.real-cont { padding:0 0 var(--space-130); } 

.sub-visual { position:relative; height:450px; z-index:10; overflow:hidden; } 
.sub-visual .background { position:absolute; top:0; left:0; width:100%; height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; transform:scale(1.09); -ms-transform:scale(1.09); /* IE 9 */
-moz-transform:scale(1.09); /* Firefox */
-webkit-transform:scale(1.09); /* Safari and Chrome */
-o-transform:scale(1.09); /* Opera */
transition: all 2s ease-out 0s; transition-delay: 0.1s; z-index:0; } 
.sub-visual.load .background { transform:scale(1); -ms-transform:scale(1); /* IE 9 */
-moz-transform:scale(1); /* Firefox */
-webkit-transform:scale(1); /* Safari and Chrome */
-o-transform:scale(1); /* Opera */ } 
.sub-visual .tt-wrap { width: 100%; position: absolute; top: 50%; left: 0; z-index: 1; color: #fff; } 
.sub-visual .tt-wrap .tx { font-family: "gimpogothic"; font-size: var(--font-size-20); line-height: 1em; font-weight: 700; } 
.sub-visual .tt-wrap .tit { padding-top:var(--space-20); font-size: var(--font-size-80); line-height: 1em; font-weight: 800; } 

.sub-menu { border-bottom:1px solid #ddd; } 
.sub-menu .contain { position:relative; display:flex; justify-content: space-between; } 

.lnb-wrap { position:relative; } 
.lnb ul { display:flex; } 
.lnb ul li { flex:1; text-align:center; margin-right:var(--space-40); } 
.lnb ul li a { display:flex; flex-direction:column; justify-content:center; align-items:center; position:relative; width: max-content; height:var(--lnb-height); padding:0 10px; color:#242424; font-size:var(--font-size-18); font-weight:500; line-height:1.2em; letter-spacing:-.03em; } 
.lnb ul li.active a { color:var(--color-primary); } 
.lnb ul li a:after { content:""; position:absolute; bottom:-1px; left:50%; width:0; height:3px; background:var(--color-primary); transition:.2s; z-index:10; } 
.lnb ul li.active>a:after { width:100%; left:0; } 

.path-wrap { position: relative; z-index: 50; } 
.path-wrap .wrap { max-width: 1200px; } 
.path-wrap .inner { display: flex; align-items: center; height:var(--lnb-height); } 
.path-wrap a { display: flex; align-items: center; position: relative; color: #ababab; font-size: var(--font-size-15); line-height: 1.866em; } 
.path-wrap .part:nth-child(2) > a { padding-right: 36px; } 
.path-wrap .home a img { display: block; margin-top: -4px; margin-right: 10px; } 
.path-wrap .part { position: relative; z-index: 50; } 
.path-wrap .part > a { display: flex; align-items: center; } 
.path-wrap .part:nth-child(2)::after { content: ""; position: absolute; top: 7px; right: 13px; width: 6px; height: 10px; background: url(/images/common/path-arrow.png) no-repeat center/contain; } 
.path-wrap .part ul { display: none !important; } 

/* footer */
#footer { background-color: #000000; padding: var(--space-50) 0; font-weight:300; letter-spacing: -0.02em; } 
#footer .contain { display: flex; justify-content: space-between; position: relative; max-width: 1600px !important; } 
#footer .contain .left { display:flex; } 
#footer .foot-logo { padding-right: clamp(20px, calc( 75 / var(--inner) * 100vw ), 75px ); } 
#footer .foot-info { min-width: 0; width: 1%; flex: 1 1 auto; max-width: 800px; font-size: var(--font-size-15); line-height: 1.733em; } 
#footer .foot-info address { font-style: normal; display: flex; margin: 0 -15px; flex-wrap: wrap; } 
#footer .foot-info address p { padding: 0 15px; color: #ababab; } 
#footer .foot-info .copy { color: #929292; margin-top: var(--space-25); } 
#footer .foot-menu { display: flex; justify-content: flex-end; } 
#footer .foot-menu a { position:relative; font-weight:500; font-size: var(--font-size-15); line-height:1.866em; letter-spacing: -0.03em; color: #fff; } 
#footer .foot-menu li:first-child a::after { content: ""; display:inline-block; width:1px; height:8px; margin:0 8px; background-color: rgba(255,255,255,.3); } 
#footer .sns-wrap { display:flex; justify-content: flex-end; gap: 10px; margin-top:var(--space-30); } 

/* for mobile */
.only-mobile { display:none; } 
.btn-m-menu { display:none; position:absolute; top:50%; margin-top:-11px; right:30px; width:23px; height:22px; text-align:center; text-indent:-9999em; z-index:99; transition:all 0.5s ease-in-out; } 
.btn-m-menu span { position:absolute; right:0; top:50%; margin-top:-1px; height:2px; width:23px; background:#fff; } 
.btn-m-menu span:before,
.btn-m-menu span:after { content:" "; position:absolute; right:0; width:23px; height:2px; background:#fff; transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s; } 
.btn-m-menu span:before { top:-10px; transition-property:top, transform; } 
.btn-m-menu span:after { bottom:-10px; transition-property:bottom, transform; } 
.mobile-navigation { position:fixed; top:0; right:0; padding:20px 0; width:400px; height:100%; overflow:auto; transition:.3s ease-in-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:202; } 
.mobile-navigation .home { display:block; margin-bottom:20px; padding-left:15px; } 
.mobile-navigation .home a { display:block; } 
.mobile-navigation .home img { height:30px; } 
.mobile-navigation .nav-menu>ul { margin-top:30px; } 
.mobile-navigation .nav-menu>ul>li { border-bottom:1px solid #dfdfdf; } 
.mobile-navigation .nav-menu>ul>li>a { position:relative; padding:12px 15px; display:block; color:#454545; font-size:18px; font-weight:500; line-height:1.3em; } 
.mobile-navigation .nav-menu>ul>li a:after { content:""; position:absolute; top:50%; right:15px; transform:translateY(-75%) rotate(45deg); width:10px; height:10px; border-right:2px solid #2c2c2c; border-bottom:2px solid #2c2c2c; } 
.mobile-navigation .nav-menu>ul>li.active>a { color:var(--color-primary) } 
.mobile-navigation .nav-menu>ul>li.active>a:after { transform:translateY(-35%) rotate(-135deg); border-color:var(--color-primary); } 
.mobile-navigation .nav-menu .submenu { display:none; margin:-1px 0 0 0; padding:0 15px 15px; } 
.mobile-navigation .nav-menu .submenu>ul:after { content:""; display:block; clear:both; } 
.mobile-navigation .nav-menu .submenu>ul>li>a { display:block; position:relative; padding:5px 15px; color:#454545; font-size:16px; font-weight:400; line-height:1.3em; } 
.mobile-navigation .nav-menu .submenu>ul>li>a:after { display:block; content:""; position:absolute; top:14px; left:5px; width:4px; height:4px; background:#dfdfdf; border-radius:50%; transition:.3s ease-in-out; } 
.mobile-navigation .nav-menu .submenu>ul>li>a:hover { color:var(--color-primary) } 
.mobile-navigation .nav-menu .submenu>ul>li>a:hover:after { background:var(--color-primary) } 
.mobile-navigation .close { position:absolute; top:20px; right:15px; width:24px; height:24px; text-indent:-9999em; overflow:hidden; } 
.mobile-navigation .close:before,
.mobile-navigation .close:after { content:" "; position:absolute; top:12px; left:0; width:100%; height:2px; background:#2c2c2c; } 
.mobile-navigation .close:before { transform:rotate(45deg); } 
.mobile-navigation .close:after { transform:rotate(-45deg); } 

.mobile-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:201; } 

html.menu-opened { overflow:hidden; } 
html.menu-opened .mobile-navigation { -ms-transform:translateX(0); transform:translateX(0); } 
html.menu-opened .mobile-overlay { display:block; }