*, *::after, *::before { box-sizing: border-box; -ms-overflow-style: none; scrollbar-width: none; }
html, body { margin: 0; padding: 0; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background-color: var(--bg-color); word-break: keep-all; }
body { font-family: Inter, Pretendard, Zodiak, sans-serif; transition: background-color 0.4s; animation: fadein 1.2s forwards; background-color: var(--bg-color); color: var(--eli-color); }
@keyframes fadein {
  0% { opacity: 0.3; }
  100% { opacity: 1; }
}


@font-face {
  font-family: InterVariable;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../webf/InterVariable.woff2") format("woff2");
}

.custom-quotes {
  font-family: 'InterVariable', sans-serif;
  font-feature-settings: 'ss08' 1;
  font-size: 8.329vw !important;
  line-height: 1 !important;
  position: absolute;
  margin-top: -2vw;
}


button { font-family: Inter, Pretendard, Zodiak, sans-serif; }


body.dark {
  --bg-color: #1a1915;
  --eli-color: #f4f3de;
  --color1: #f4f3de;
  --color2: #1a1915;
  --opc1:0.3;
  --opc2:0.1;
  --opc3:0.4;
  --opc4:0.4;
  --opc5:0.2;
  --mix-blend:difference;
}

body.light { 
  --bg-color: #f4f3de;
  --eli-color: #1a1915;
  --color1: #f4f3de;
  --color2: #1a1915;
  --opc1:0.4;
  --opc2:0.07;
  --opc3:0.6;
  --opc4:0.5;
  --opc5:0.4;
  --mix-blend:multiply;
}


#loader-wrap { height: 100vh; overflow: hidden; }
.loader { height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; position: fixed; z-index: 6; }
.MuiCircularProgress-root { display: inline-block;}
.MuiCircularProgress-static { transition: transform .1s cubic-bezier(.4,0,.2,1) 0s; }
.MuiCircularProgress-indeterminate { animation: MuiCircularProgress-keyframes-circular-rotate 1.4s linear infinite;} 
.MuiCircularProgress-svg { display: block;}
.MuiCircularProgress-circleIndeterminate { animation: MuiCircularProgress-keyframes-circular-dash 1.4s ease-in-out infinite; stroke-dasharray: 80px,200px; stroke: var(--eli-color); }

.backcircle { width:40px; height:40px; display: flex; justify-content: center; align-items: center; background-color:transparent; position:absolute; z-index:1; border-radius:40px; border:8px solid var(--eli-color); opacity:0.1; }

@keyframes MuiCircularProgress-keyframes-circular-rotate {
    0% {
        transform-origin: 50% 50%;
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes MuiCircularProgress-keyframes-circular-dash {
    0% {
        stroke-dasharray: 1px, 200px;
        stroke-dashoffset: 0px;
    }
    50% {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -10px;
    }
    100% {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -145px;
    }
}


#pointer-dot { position: fixed; width: 12px; height: 12px; border-radius: 50%; z-index: 101; background: var(--eli-color); pointer-events: none; transition: background 0.5s, border-color 0.5s, width 0.3s, height 0.3s; mix-blend-mode: var(--mix-blend); display: flex; align-items: center; justify-content: center; color: transparent; font-size: 10px; font-weight: bold; user-select: none; transform-origin: center center; }
#pointer-dot.hover-go { width: 5.206vw !important; height: 5.206vw !important; color: var(--eli-color); background: var(--bg-color); transition: width 0.3s ease, height 0.3s ease, color 0.3s ease; mix-blend-mode: normal; opacity: 0.9; }
#pointer-dot.hover-go::after { content: "->"; color: var(--eli-color); position: relative; pointer-events: none; user-select: none; font-size: 1.874vw; }

.color-mode-toggle, .color-mode-toggle svg { width: 26px; height: 26px; }
.color-mode-toggle { top: 35px; right: 28px; padding: 0 8px 0 0; border: none; background: none; cursor: pointer; display: flex; align-items: center; justify-content: flex-end; width: auto; }
.color-mode-toggle svg { display: block; width: 20px; height: 20px; margin-left: 10px; transition: transform 0.3s cubic-bezier(.4, 0, .2, 1); }
@media (hover:hover) {
  .color-mode-toggle:not(.clicked):hover svg { transform: rotate(180deg); }
}
@media (hover:none) {
  .color-mode-toggle svg { transform: none !important; transition: none !important; }
}

.mode-text { text-align: right; flex-grow: 1; color: var(--eli-color); }

body.light .toggle-border { stroke: var(--color2); fill: var(--color2); stroke-width: 1; }
body.light .toggle-left { fill: var(--color1); }
body.dark .toggle-border { stroke: var(--color1); fill: var(--color1); stroke-width: 1; }
body.dark .toggle-left { fill: var(--color2); }


div, ol, ul { list-style: none; margin: 0; padding: 0; }
img { max-width: 100%; will-change: opacity, transform; }
a { text-decoration: none; color: var(--eli-color); cursor: pointer; }
p { margin: 0; padding: 0; }

.no-scroll::-webkit-scrollbar { display: none; } 
.no-scroll { overflow: hidden; }
::selection { background: var(--light-bg); }

.blend { mix-blend-mode: var(--mix-blend); }

video { display: block; width: 100%; outline: none; border: 0; transform: scale(1); -webkit-mask-image: -webkit-radial-gradient(white, black); mask-image: -webkit-radial-gradient(white, black); backface-visibility: hidden; height: 100%; }







.fixed-bar { position: fixed; left: 0; right: 0; top: 0; width: 100vw; display: flex; align-items: center; z-index: 6; }

.bi_bk, .color-mode-toggle { position: fixed; z-index: 5; }
nav { flex: 1 1 auto; height: 96px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 500; line-height: 1.5; letter-spacing: -0.01em; }

.bi_bk { margin: 0; padding: 0; top: 36px; left: 36px; color: var(--eli-color); }
.bi_bk a { display: block; }
.bi_bk a, .bi_bk a svg { height: 24px; }
.bi_bk a svg path { fill: var(--eli-color); }

.ment_desc { font-size: 14px; opacity: var(--opc1); margin-top: 1px; }

nav ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
nav li { display: flex; align-items: center; padding: 0 40px 1px 0; cursor: pointer; height: 22px; }
nav li:last-child { padding: 0 0 1px 0; }
nav a { text-decoration: none; }
.num-sup { font-size: smaller; line-height: 0; vertical-align: super; position: relative; top: -5px; font-size: 14px; }
.num-super { position: relative; top: 0; }

.line_th { overflow: hidden; display: inline-block; position: relative; color: inherit; text-decoration: none; }
.line_th:before { content: ""; position: absolute; left: -100%; bottom: 0; display: block; width: 100%; height: 1px; background-color: var(--eli-color); transition: all 0.3s ease-out; }
.menu li:hover .line_th:before, .line_th.active:before { left: 0; }
.line_th.active, .line_th.active:before { transition: none; }

.menu ul { list-style: none; padding: 0; margin: 0; display: flex; }
.menu li { transition: opacity 0.2s ease-out; }
.menu li.is-dimmed { opacity: var(--opc1); }

.menu a.line_th { position: relative; transition: color 0.2s; }
.menu a.line_th::after { content: ''; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; background: currentColor; transform: scaleX(0); opacity: 0; transform-origin: left; transition: transform 0.4s cubic-bezier(.4,0,.2,1), opacity 0.3s; pointer-events: none; }
.menu a.line_th.active::after, .menu a.line_th:hover::after, .menu a.line_th.focused::after { transform: scaleX(1); opacity: 1; }

.smooth-content { opacity: 0; transform: translateY(30px); }


.marquee-area { display: flex; align-items: center; margin-top: 12.5vw; overflow: hidden; height: 10.411vw; }
.mq-text { white-space: nowrap; font-size: 8.3333vw; font-weight: 500; flex-shrink: 0; padding: 0 10px; width: max-content; display: flex; align-items: center; animation: a-text-scroll 30s linear infinite; }

@keyframes a-text-scroll {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(-50%, 0, 0); }
}

.f-zdai3 { font-weight: 600; }


#scroll-to-top { position: absolute; }
#scroll-to-top svg path { fill: var(--eli-color); }


#site-footer-sub { position: fixed; z-index: 1; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: flex-end; background-color: var(--bg-color); bottom: 0; width: 100vw; height: 36vw; transition: background-color 0.4s; opacity: 0; box-shadow: 0 0 0 1px var(--bg-color); }

#site-footer-sub.show { opacity: 1; pointer-events: auto; animation: fadein 1.2s forwards; }


@keyframes fadein {
	0% { opacity: 0.3; }
	100% { opacity: 1; }
}



.area1-sub { color: var(--eli-color); }
#footer-logo { position: absolute; overflow: hidden; height: 100%; bottom: -19.3vw; }
#footer-logo svg { overflow: visible; width: 123.9583vw; height: 100%; }
#footer-logo svg path { fill: var(--eli-color); }

.area1-sub { bottom: 10vw; width: calc(100% - 72px); position: relative; z-index: 1; }
.area1-sub .info { display: flex; gap: 24px; font-size: clamp(18px, 1.146vw, 1.146vw); margin-top: 30px; }

.area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2) { width: calc((100% - 72px) * (2/6)); }
.area1-sub .foot-sec:nth-child(3), .area1-sub .foot-sec:nth-child(4) { width: calc((100% - 72px) * (1/6)); }

.area1-sub .info .foot-sec .f-right { text-align: right; }
.area1-sub .info .foot-sec #f-copy { width: 4.4vw; min-width: 100px; fill: var(--eli-color); }
.area1-sub .info .foot-sec .f-title { font-size: clamp(16px, 0.8vw, 0.8vw); opacity: var(--opc1); margin-bottom: 5px; }

.area1-sub .info ul { width: 25.82vw; }
.area1-sub .info ul li, .area1-sub .info a { color: var(--eli-color); line-height: 1.4; font-weight: 500; }

#datetime { font-variant-numeric: tabular-nums; }



.pm-video { width: 288px; height: 256px; background-color: var(--eli-color); opacity: 0; visibility: hidden; border-radius: 8px; padding: 0 10px; position: fixed; right: 36px; bottom: 36px; z-index: 100; box-shadow: 0 8px 20px rgba(0,0,0,0.2); transition: opacity 0.4s ease, visibility 0.4s ease; pointer-events: none; }
.pm-video.pmv-show { opacity: 1; visibility: visible; pointer-events: auto; }
.pm-video.pmv-hide { opacity: 0; visibility: hidden; pointer-events: none; }

.pmv-close {
  display: flex; justify-content: flex-end; align-items: center; padding: 0; margin: 0; }
.pmv-close-btn { font-size: 28px; font-weight: 200; color: var(--bg-color); width: 28px; height: 28px; line-height: 28px; cursor: pointer; user-select: none; display: inline-block; text-align: right; }

.pmv {margin-top: 5px; width: 268px; height: 142px; overflow: hidden; position: relative; }
.pmv video { position: absolute; top: -59px; left: 0; width: 100%; height: auto; object-fit: cover; }
.pmv-txt-title, .pmv-txt-desc { color: var(--bg-color); }
.pmv-txt-title { font-size: 13px; opacity: 0.6; margin: 20px 0 8px; }
.pmv-txt-desc { font-size: 14px; font-weight: 500; letter-spacing: -0.015em; }



@media screen and (min-width:2561px) {
  .bi_bk a svg { width: 100%; height: 0.937vw; }
  .grt, .ment_desc, nav, .color-mode-toggle { font-size: 0.508vw; }

  nav { width: 10.152vw; font-size: 0.781vw; margin-top: 0.234vw; }
  nav li { height: 0.937vw; }
  .line_th:before { height: 0.039vw; }
  
  .num-sup { font-size: 0.469vw; top: -0.195vw; }
  .num-super { font-size: 0.43vw; }
  .color-mode-toggle svg { width: 0.625vw; height: 0.625vw; margin-left: 0.39vw; }

  #wrap-sub { padding-bottom: 0 !important; }
  #wrap-sub .recent-activity { padding: 4vw 36px 0 !important; }

  .area1-sub .info { font-size: clamp(18px, 0.8vw, 0.8vw); }

  #site-footer-sub { height: 32vw; background-color: var(--bg-color) }
  #footer-logo { bottom: -17.5vw; }
  

}



@media screen and (min-width:1921px) {
    #scroll-to-top { right: 36px; bottom: 160px; position: fixed; }
    #wrap, #wrap-sub { width: 100%; min-height: 100vh; padding: 0; margin: 0; display: flex; flex-direction: column; position: relative; z-index: 4; background-color: var(--bg-color); color: var(--eli-color); font-size: 38px; line-height: 1; transition: background-color 0.4s; }

    #wrap .align-wrapper { margin: 10vw 1.875vw 8.333vw; }
    #wrap .br-headline { position: relative; margin: 0; display:block; width: 96%; height: auto; letter-spacing: -0.01em; }
    #wrap .hl1, #wrap .hl2 { display: block; }

    #wrap .hl1 { width: 100%; display: block; line-height: 1; font-weight: 600; }
    #wrap .cmt { margin-top: 1.6vw; margin-right: 0.6vw; font-size: 1.041vw; font-weight: 500; display: inline-block; vertical-align: top; letter-spacing: 0; }
    #wrap .h-copy { display: inline; font-size: 3.5417vw; line-height: 1.1; }
    #wrap .f-zdai, #wrap .f-zdai2, #wrap .f-zdai3 { display: inline; font-family: Zodiak; font-style: italic; letter-spacing: -0.03em; }
    #wrap .f-zdai { font-size: 3.2vw; }
    #wrap .f-zdai2 { font-size: 1.041vw; font-weight: 600; display: inline-block; letter-spacing: -0.02em; }
    #wrap .hl2 { width: 60vw; font-size: clamp(24px, 1.249vw, 48px); line-height: 1.6; font-weight: 500; margin-top: 3.1250vw; letter-spacing: -0.02em; }
    
    .panel img { width: 100% !important; }
    .panel2 { height: 100vh; margin-bottom: 12.493vw; }

    .featured-exp { display: flex; flex-direction: column; width: calc(100% - 72px); margin: 0 auto; /*margin-top: 70vw;*/ position: relative; }
    .featured-exp h2, .recent-activity h2 { font-size: 6.25vw; font-weight: 600; margin-bottom: 4.1667vw; letter-spacing: -0.01em; }
    .featured-exp .fe-list-row, .recent-activity .fe-list-row { display: flex; gap: 64px; }
    .featured-exp .fe-list-row { display: flex; flex-wrap: wrap; }
    .fe-list-row ul { margin-bottom: 4.1667vw; justify-content: flex-start; flex: 0 0 calc((100% - 64px) / 2); }

    #wrap .pic-wrap { position: relative; overflow: hidden; width: 100%; }
    #wrap .card_pic { display: block; width: 100%; height: auto; transition: transform 0.5s ease-out; }
    #wrap .card_pic:hover { transform: scale(1.04); }

    .recent-activity { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .recent-activity .fe-list-row2 { display: flex; flex-wrap: wrap; gap: 1.667vw; }
    .recent-activity .fe-list-row2 > ul { width: calc((100% - 2 * 1.667vw) / 3); box-sizing: border-box; margin-bottom: 4.1667vw; }

    .s912, .s600 { margin-top: 1.354vw; }
    .left-list { width: calc(50% - 12px); max-width: none; }
    .right-list { width: 41.667vw; max-width: 600px; }
    .ra-area1 { color: var(--eli-color); font-size: 1.0417vw; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; }
    .ra-bottom-row { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
    .a2-title, .a2-desc { display: block; }
    .a2-title, .ra-area3 { margin-top: 1.354vw; line-height: 1.2; }
    .a2-title { font-size: clamp(1.4583vw, 1.4583vw, 28px); font-weight: 500; margin-right: 30px; }
    .a2-desc { font-size: clamp(16px, 1.146vw, 22px); opacity: var(--opc1); margin-top: 0.729vw; font-weight: 500; }
    .ra-area3 { font-size: clamp(1.4583vw, 1.4583vw, 28px); font-weight: 500; }

    .view-all { width: 44.896vw; display: flex; justify-content: flex-end; align-items: flex-end; letter-spacing: -0.01em; margin-left: auto; }
    .view-all ul { margin: 0; padding: 0; list-style: none; }
    .all-link a { line-height: 1.3; width: auto; font-size: clamp(60px, 3.123vw, 3.123vw); font-weight: 600; text-decoration: underline; text-decoration-thickness: 0.104vw; text-underline-offset: 0.521vw; }

    .all-num { padding-left: 40px; }
    .all-txt { text-align: right; }
    .all-no { font-size: clamp(2.604vw, 100px, 100px); font-weight: 800; }

    .panel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 1.5em; text-align: center; position: relative; }
    .panel h2 { display: none; }

    .icon-external { margin-bottom: 0.35vw; width: 0.625vw; height: 0.625vw; }
    .icon-external path { fill: var(--eli-color); }

    .vertcopy2 { position: fixed; bottom: calc(-10vw + 80px); right: 80px; z-index: 2; }
    .vertcopy2 svg { width: 1.6649vw; max-width: 16px; }
    .vertcopy2 svg path { fill: var(--eli-color); }

    .line_th2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

    .hl-op { opacity: 0.3 !important; }
    
    .o-abt { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .o-abt > ul { display: flex; gap: 24px; padding: 0; margin: 0; list-style: none; }
    .o-abt > ul > li { flex: 1; }
    .abt1 { font-size: 1.25vw; }
    .abt2 > ul { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 24vw; }
    .abt2-title { font-size: 2.5vw; font-weight: 600; line-height: 1.1; margin-bottom: 2.0833vw; }
    .abt2-desc { font-size: 1.25vw; line-height: 1.4; margin-bottom: 4.1667vw; }
    .abt2-btn { font-size: 1.4583vw; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
    .hero-slider { width: 100%; aspect-ratio: 3 / 2; position: relative; display: flex; z-index: 0; }
    .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .hero-slider .swiper-slide { overflow: hidden; }
    .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; }
    .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
    .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform, -webkit-transform; box-sizing: content-box; }
    .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform, -webkit-transform; }

    .area1-sub .info .foot-sec #f-copy { width: clamp(120px, 4.4vw, 6.4vw); }
}


@media screen and (min-width:1281px) and (max-width:1920px) {
    #scroll-to-top { right: 36px; bottom: 160px; position: fixed; }

    #wrap, #wrap-sub { width: 100%; min-height: 100vh; padding: 0; margin: 0; display: flex; flex-direction: column; position: relative; z-index: 4; background-color: var(--bg-color); color: var(--eli-color); font-size: 38px; line-height: 1; transition: background-color 0.4s; }

    #wrap .align-wrapper { margin: 12vw 36px 8.333vw; }
    #wrap .br-headline { position: relative; margin: 0; display:block; width: 96%; height: auto; letter-spacing: -0.01em; }
    #wrap .hl1, #wrap .hl2 { display: block; }

    .custom-quotes { font-size: 7.6vw !important; }

    #wrap .hl1 { width: 100%; display: block; line-height: 1; font-weight: 600; }
    #wrap .cmt { margin-top: 1.6vw; margin-right: 0.6vw; font-size: 20px; font-weight: 500; display: inline-block; vertical-align: top; letter-spacing: 0; }
    #wrap .h-copy { display: inline; font-size: 3.5417vw; line-height: 1.1; }
    #wrap .f-zdai, #wrap .f-zdai2, #wrap .f-zdai3 { display: inline; font-family: Zodiak; font-style: italic; letter-spacing: -0.03em; }
    #wrap .f-zdai { font-size: 3.2vw; }
    #wrap .f-zdai2 { font-size: 20px; font-weight: 600; display: inline-block; letter-spacing: -0.02em; }
    #wrap .hl2 { width: 60vw; font-size: clamp(20px, 1.25vw, 24px); line-height: 1.6; font-weight: 500; margin-top: 3.1250vw; letter-spacing: -0.02em; }
    
    .panel2 { height: 100vh; margin-bottom: 240px; }

    .featured-exp { display: flex; flex-direction: column; width: calc(100% - 72px); margin: 0 auto; /*margin-top: 70vw;*/ position: relative; }
    .featured-exp h2, .recent-activity h2 { font-size: 6.25vw; font-weight: 600; margin-bottom: 4.1667vw; letter-spacing: -0.01em; }
    .featured-exp .fe-list-row, .recent-activity .fe-list-row { display: flex; gap: 32px; }
    .featured-exp .fe-list-row { display: flex; flex-wrap: wrap; }
    .fe-list-row ul { margin-bottom: 4.1667vw; justify-content: flex-start; width: calc((100% - 1 * 32px) / 2); }

    #wrap .pic-wrap { position: relative; overflow: hidden; width: 100%; }
    #wrap .card_pic { display: block; width: 100%; height: auto; transition: transform 0.5s ease-out; }
    #wrap .card_pic:hover { transform: scale(1.04); }

    .recent-activity { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .recent-activity .fe-list-row2 { display: flex; flex-wrap: wrap; gap: 1.667vw; }
    .recent-activity .fe-list-row2 > ul { width: calc((100% - 2 * 1.667vw) / 3); box-sizing: border-box; margin-bottom: 4.1667vw; }

    .s912, .s600 { margin-top: 1.354vw; }
    .left-list { width: calc(50% - 12px); max-width: none; }
    .right-list { width: 41.667vw; max-width: 600px; }
    .ra-area1 { color: var(--eli-color); font-size: 1.0417vw; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; }
    .ra-bottom-row { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
    .a2-title, .a2-desc { display: block; }
    .a2-title, .ra-area3 { margin-top: 1.354vw; line-height: 1.2; }
    .a2-title { font-size: clamp(1.4583vw, 1.4583vw, 28px); font-weight: 500; margin-right: 30px; }
    .a2-desc { font-size: clamp(16px, 1.146vw, 22px); opacity: var(--opc1); margin-top: 0.729vw; font-weight: 500; }
    .ra-area3 { font-size: clamp(1.4583vw, 1.4583vw, 28px); font-weight: 500; }

    .view-all { width: 44.896vw; display: flex; justify-content: flex-end; align-items: flex-end; letter-spacing: -0.01em; margin-left: auto; }
    .view-all ul { margin: 0; padding: 0; list-style: none; }
    .all-link a { line-height: 1.3; width: auto; font-size: clamp(2.083vw, 3.125vw, 60px); font-weight: 600; text-decoration: underline; text-decoration-thickness: 0.104vw; text-underline-offset: 0.521vw; }

    .all-num { padding-left: 40px; }
    .all-txt { text-align: right; }
    .all-no { font-size: clamp(2.604vw, 100px, 100px); font-weight: 800; }

    .panel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 1.5em; text-align: center; position: relative; }
    .panel h2 { display: none; }

    .icon-external { margin-bottom: 0.35vw; }
    .icon-external path { fill: var(--eli-color); }

    .vertcopy2 { position: fixed; bottom: calc(-10vw + 80px); right: 80px; z-index: 2; }
    .vertcopy2 svg { width: 1.6649vw; max-width: 16px; }
    .vertcopy2 svg path { fill: var(--eli-color); }

    .line_th2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

    .hl-op { opacity: 0.3 !important; }
    
    .o-abt { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .o-abt > ul { display: flex; gap: 24px; padding: 0; margin: 0; list-style: none; }
    .o-abt > ul > li { flex: 1; height: 100%; }
    .abt1 { font-size: 1.6vw; }
    .abt2 > ul { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 496px; }
    .abt2-title { font-size: 2.5vw; font-weight: 600; line-height: 1.1; margin-bottom: 2.0833vw; }
    .abt2-desc { font-size: 1.25vw; line-height: 1.4; margin-bottom: 4.1667vw; }
    .abt2-btn { font-size: 1.4583vw; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
    .hero-slider { width: 100%; aspect-ratio: 3 / 2; position: relative; display: flex; z-index: 0; }
    .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .hero-slider .swiper-slide { overflow: hidden; }
    .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; }
    .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
    .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform, -webkit-transform; box-sizing: content-box; }
    .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform, -webkit-transform; }

    #site-footer-sub { height: 40vw; background-color: var(--bg-color) }
    #footer-logo { bottom: -21.2vw; }
    .area1-sub { bottom: 12vw; }
    .area1-sub .info .foot-sec #f-copy { width: 6.8vw; }

    .area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2), .area1-sub .foot-sec:nth-child(3) { width: calc((100% - 72px) * (4/14)); }
    .area1-sub .foot-sec:nth-child(4) { width: calc((100% - 72px) * (2/14)); }


}


@media screen and (min-width:961px) and (max-width:1280px) {
    #scroll-to-top { position: fixed; right: 36px; bottom: 72px; }
    #scroll-to-top svg { width: 18px; height: 23px; }

    #wrap, #wrap-sub { width: 100%; min-height: 100vh; padding: 0; margin: 0; padding-bottom: 9.375vw; display: flex; flex-direction: column; position: relative; z-index: 4; background-color: var(--bg-color); color: var(--eli-color); line-height: 1; transition: background-color 0.4s; }

    #wrap .align-wrapper { margin: 15vw 36px 8.333vw; }
    #wrap .br-headline { position: relative; margin: 0; display:block; width: 96%; height: auto; letter-spacing: -0.01em; }
    #wrap .hl1, #wrap .hl2 { display: block; }

    .custom-quotes { font-size: 10vw !important; }

    #wrap .hl1 { width: 100%; display: block; line-height: 1; font-weight: 600; }
    #wrap .cmt { margin-top: 1.6vw; margin-right: 0.6vw; font-size: 20px; font-weight: 500; display: block; letter-spacing: 0; }
    #wrap .h-copy { display: inline; font-size: 4.8vw; line-height: 1.1; }
    #wrap .f-zdai, #wrap .f-zdai2, #wrap .f-zdai3 { display: inline; font-family: Zodiak; font-style: italic; letter-spacing: -0.03em; }
    #wrap .f-zdai { font-size: 5.313vw; }
    #wrap .f-zdai2 { font-size: 20px; font-weight: 600; display: inline-block; letter-spacing: -0.02em; }
    #wrap .hl2 { width: 60vw; font-size: clamp(20px, 1.25vw, 24px); line-height: 1.6; font-weight: 500; margin-top: 3.1250vw; letter-spacing: -0.02em; }

    .panel2 { height: 100vh; margin-bottom: 160px; }
    .panel3 { height: 75vh; }

    .featured-exp { display: flex; flex-direction: column; width: calc(100% - 72px); margin: 0 auto; position: relative; }
    .featured-exp h2, .recent-activity h2 { font-size: 7.813vw; font-weight: 600; margin-bottom: 6.25vw; letter-spacing: -0.01em; }
    .featured-exp .fe-list-row, .recent-activity .fe-list-row { display: flex; gap: 24px; }
    .featured-exp .fe-list-row { display: flex; flex-wrap: wrap; gap: 24px; }
    .fe-list-row ul { margin-bottom: 4.1667vw; justify-content: flex-start; }

    #wrap .pic-wrap { position: relative; overflow: hidden; width: 100%; }
    #wrap .card_pic { display: block; width: 100%; height: auto; transition: transform 0.5s ease-out; }
    #wrap .card_pic:hover { transform: scale(1.04); }

    .recent-activity { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .recent-activity .fe-list-row2 { display: flex; flex-wrap: wrap; gap: 1.667vw; }
    .recent-activity .fe-list-row2 > ul { width: calc((100% - 1 * 1.667vw) / 2); margin-bottom: 4.1667vw; }

    .recent-activity .fe-list-row2 > ul:nth-child(2) { margin-right: 0; }
    .fe-list-row2 > ul:nth-child(3) { display: none; }

    .s912, .s600 { margin-top: 1.354vw; }
    .left-list { width: calc(50% - 12px); max-width: none; }
    .right-list { width: 41.667vw; max-width: 600px; }
    .ra-area1 { color: var(--eli-color); font-size: 1.563vw; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; }
    .ra-bottom-row { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
    .a2-title, .a2-desc { display: block; }
    .a2-title, .ra-area3 { margin-top: 1.354vw; line-height: 1.2; }
    .a2-title { font-size: clamp(20px, 2.188vw, 28px); font-weight: 500; margin-right: 30px; }
    .a2-desc { font-size: clamp(16px, 1.146vw, 22px); opacity: var(--opc1); margin-top: 0.729vw; font-weight: 500; }
    .ra-area3 { font-size: clamp(20px, 2.188vw, 28px); font-weight: 500; }

    .view-all { width: 44.896vw; display: flex; justify-content: flex-end; align-items: flex-end; letter-spacing: -0.01em; margin-left: auto; }
    .view-all ul { margin: 0; padding: 0; list-style: none; }
    .all-link a { line-height: 1.3; width: auto; font-size: clamp(28px, 4.063vw, 52px); font-weight: 600; text-decoration: underline; text-decoration-thickness: 0.104vw; text-underline-offset: 0.521vw; }

    .all-num { padding-left: 40px; }
    .all-txt { text-align: right; }
    .all-no { font-size: clamp(2.604vw, 100px, 100px); font-weight: 800; }

    .panel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 1.5em; text-align: center; position: relative; }
    .panel h2 { display: none; }
    .panel3 { margin-top: 40vw; height: auto; }

    .icon-external { margin-bottom: 3px; }
    .icon-external path { fill: var(--eli-color); }

    .vertcopy2 { position: fixed; bottom: calc(-10vw + 80px); right: 80px; z-index: 2; }
    .vertcopy2 svg { width: 1.6649vw; max-width: 16px; }
    .vertcopy2 svg path { fill: var(--eli-color); }

    .line_th2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

    .hl-op { opacity: 0.3 !important; }
    
    .o-abt { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .o-abt > ul { display: flex; gap: 24px; padding: 0; margin: 0; list-style: none; }
    .o-abt > ul > li { flex: 1; height: 100%; }
    .abt1 { font-size: 2vw; font-weight: 500; }
    .abt2 > ul { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 350px; }
    .abt2-title { font-size: 3.594vw; font-weight: 600; line-height: 1.1; margin-bottom: 2.0833vw; }
    .abt2-desc { font-size: 1.77vw; line-height: 1.4; margin-bottom: 4.1667vw; }
    .abt2-btn { font-size: 2vw; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
    .hero-slider { width: 100%; aspect-ratio: 3 / 2; position: relative; display: flex; z-index: 0; }
    .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .hero-slider .swiper-slide { overflow: hidden; }
    .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; }
    .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
    .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform, -webkit-transform; box-sizing: content-box; }
    .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform, -webkit-transform; }


    #site-footer-sub { height: 52vw; }

    .area1-sub { color: var(--eli-color); }
    #footer-logo { position: absolute; overflow: hidden; height: 100%; bottom: -27vw; }
    #footer-logo svg { overflow: visible; width: 123.9583vw; height: 100%; }
    #footer-logo svg path { fill: var(--eli-color); }

    .area1-sub { bottom: 12vw; width: calc(100% - 72px); position: relative; z-index: 1; }
    .area1-sub .info { display: flex; flex-wrap: wrap; font-size: clamp(22px, 1.442vw, 1.442vw); margin-top: 30px; align-items: stretch; }

    .area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2) { width: calc((100% - 72px) * (3/6)); margin-bottom: 1.563vw; }
    .area1-sub .foot-sec:nth-child(3), .area1-sub .foot-sec:nth-child(4) { width: calc((100% - 72px) * (3/6)); }

    .area1-sub .foot-sec { flex: 0 0 calc((100% - 24px) / 2); }

    .area1-sub .info .foot-sec .f-right { text-align: right; }
    .area1-sub .info .foot-sec #f-copy { width: 120px; fill: var(--eli-color); }

    .area1-sub .info .foot-sec:last-child { display: flex; flex-direction: column; }
    .area1-sub .info .foot-sec:last-child .f-title { display: none; }
    .area1-sub .info .foot-sec:last-child .f-right { margin-top: auto; }

    .area1-sub .info ul li, .area1-sub .info a { color: var(--eli-color); height: 28px; line-height: 1; font-weight: 500; }

    #datetime { font-variant-numeric: tabular-nums; }

}


@media screen and (min-width:641px) and (max-width:960px) {
    #scroll-to-top { position: fixed; right: 36px; bottom: 72px; }
    #scroll-to-top svg { width: 18px; height: 23px; }

    nav li { padding-right: 20px; }

    #wrap, #wrap-sub { width: 100%; min-height: 100vh; padding: 0; margin: 0; padding-bottom: 15vw; display: flex; flex-direction: column; position: relative; z-index: 4; background-color: var(--bg-color); color: var(--eli-color); line-height: 1; transition: background-color 0.4s; }
    #wrap { padding-bottom: 10vw; }

    #wrap .align-wrapper { margin: 24vw 1.875vw 8.333vw; }
    #wrap .br-headline { position: relative; margin: 0; display:block; width: 96%; height: auto; letter-spacing: -0.01em; }
    #wrap .hl1, #wrap .hl2 { display: block; }

    #wrap .hl1 { width: 100%; display: block; line-height: 1; font-weight: 600; }
    #wrap .cmt { margin-top: 1.6vw; margin-right: 0.6vw; font-size: 20px; font-weight: 500; display: block; letter-spacing: 0; }
    #wrap .h-copy { display: inline; font-size: 5.313vw; line-height: 1.1; }
    #wrap .f-zdai, #wrap .f-zdai2, #wrap .f-zdai3 { display: inline; font-family: Zodiak; font-style: italic; letter-spacing: -0.03em; }
    #wrap .f-zdai { font-size: 5.313vw; }
    #wrap .f-zdai2 { font-size: 20px; font-weight: 600; display: inline-block; letter-spacing: -0.02em; }
    #wrap .hl2 { font-size: clamp(20px, 1.25vw, 24px); line-height: 1.6; font-weight: 500; margin-top: 3.1250vw; letter-spacing: -0.02em; }

    .panel2 { height: 100vh; margin-bottom: 15vw; }
    .panel3 { height: auto; }

    .featured-exp { display: flex; flex-direction: column; width: calc(100% - 72px); margin: 0 auto; /*margin-top: 70vw;*/ position: relative; }
    .featured-exp h2, .recent-activity h2 { font-size: 7.813vw; font-weight: 600; margin-bottom: 6.25vw; letter-spacing: -0.01em; }
    .featured-exp .fe-list-row, .recent-activity .fe-list-row { display: flex; gap: 24px; }
    .featured-exp .fe-list-row { display: flex; flex-wrap: wrap; gap: 24px; }
    .fe-list-row ul { margin-bottom: 4.1667vw; justify-content: flex-start; }

    #wrap .pic-wrap { position: relative; overflow: hidden; width: 100%; }
    #wrap .card_pic { display: block; width: 100%; height: auto; transition: transform 0.5s ease-out; }
    #wrap .card_pic:hover { transform: scale(1.04); }

    .recent-activity { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }
    .recent-activity .fe-list-row2 { display: flex; flex-wrap: wrap; gap: 1.667vw; }
    .recent-activity .fe-list-row2 > ul { width: calc((100% - 1 * 1.667vw) / 2); margin-bottom: 4.1667vw; }

    .recent-activity .fe-list-row2 > ul:nth-child(2) { margin-right: 0; }
    .fe-list-row2 > ul:nth-child(3) { display: none; }

    .s912, .s600 { margin-top: 1.354vw; }
    .left-list { width: calc(50% - 12px); max-width: none; }
    .right-list { width: 41.667vw; max-width: 600px; }
    .ra-area1 { color: var(--eli-color); font-size: 2.2vw; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; }
    .ra-bottom-row { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
    .a2-title, .a2-desc { display: block; }
    .a2-title, .ra-area3 { margin-top: 1.354vw; line-height: 1.2; }
    .a2-title { font-size: clamp(18px, 2.083vw, 24px); font-weight: 500; margin-right: 30px; }
    .a2-desc { font-size: clamp(16px, 1.146vw, 22px); opacity: var(--opc1); margin-top: 0.729vw; font-weight: 500; }
    .ra-area3 { font-size: clamp(18px, 2.083vw, 24px); font-weight: 500; }

    .view-all { width: 44.896vw; display: flex; justify-content: flex-end; align-items: flex-end; letter-spacing: -0.01em; margin-left: auto; }
    .view-all ul { margin: 0; padding: 0; list-style: none; }
    .all-link a { line-height: 1.3; width: auto; font-size: clamp(28px, 4.063vw, 52px); font-weight: 600; text-decoration: underline; text-decoration-thickness: 0.104vw; text-underline-offset: 0.521vw; }

    .all-num { padding-left: 40px; }
    .all-txt { text-align: right; }
    .all-no { font-size: clamp(2.604vw, 100px, 100px); font-weight: 800; }

    .panel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 1.5em; text-align: center; position: relative; }
    .panel h2 { display: none; }

    .icon-external { margin-bottom: 3px; }
    .icon-external path { fill: var(--eli-color); }

    .vertcopy2 { position: fixed; bottom: calc(-10vw + 80px); right: 80px; z-index: 2; }
    .vertcopy2 svg { width: 1.6649vw; max-width: 16px; }
    .vertcopy2 svg path { fill: var(--eli-color); }

    .line_th2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

    .hl-op { opacity: 0.3 !important; }
    
    .o-abt { width: calc(100% - 72px); margin: 0 auto; margin-top: 12.5vw; }


    .o-abt > ul {
      display: grid;
      grid-template-columns: 1fr 1fr; /* 왼쪽/오른쪽 두 열 */
      grid-template-rows: auto auto;  /* 각 행 높이는 내용에 맞춤 */
      gap: 24px;
    }

    .o-abt > ul > li:nth-child(1) {
      grid-column: 1; /* 왼쪽 열 */
      grid-row: 1;    /* 첫 행 */
    }

    .o-abt > ul > li:nth-child(2) {
      grid-column: 1; /* 왼쪽 열 */
      grid-row: 2;    /* 두 번째 행 → 1 아래로 붙음 */
    }

    .o-abt > ul > li:nth-child(3) {
      grid-column: 2; /* 오른쪽 열 */
      grid-row: 2;    /* 두 번째 행부터 시작 → 2의 시작점에 맞춤 */
    }

    .abt1 { font-size: 2vw; font-weight: 500; }
    .abt2 > ul { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 400px; }
    .abt2-title { font-size: 4.2vw; font-weight: 600; line-height: 1.1; margin-bottom: 2.0833vw; }
    .abt2-desc { font-size: 2vw; line-height: 1.4; margin-bottom: 4.1667vw; }
    .abt2-btn { font-size: 2.4vw; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }

    .hero-slider { width: 100%; aspect-ratio: 3 / 2; position: relative; display: flex; z-index: 0; }
    .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .hero-slider .swiper-slide { overflow: hidden; }
    .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; }
    .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
    .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform, -webkit-transform; box-sizing: content-box; }
    .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform, -webkit-transform; }


    #site-footer-sub { height: 72vw; }

    .area1-sub { color: var(--eli-color); }
    #footer-logo { position: absolute; overflow: hidden; height: 100%; bottom: -37vw; }
    #footer-logo svg { overflow: visible; width: 123.9583vw; height: 100%; }
    #footer-logo svg path { fill: var(--eli-color); }

    .area1-sub { bottom: 12vw; width: calc(100% - 72px); position: relative; z-index: 1; }
    .area1-sub .info { display: flex; flex-wrap: wrap; font-size: clamp(16px, 2.083vw, 2.083vw); margin-top: 30px; align-items: stretch; }

    .area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2) { width: calc((100% - 72px) * (3/6)); margin-bottom: 4vw; }
    .area1-sub .foot-sec:nth-child(3), .area1-sub .foot-sec:nth-child(4) { width: calc((100% - 72px) * (3/6)); }

    .area1-sub .foot-sec { flex: 0 0 calc((100% - 24px) / 2); }

    .area1-sub .info .foot-sec .f-title { font-size: clamp(14px, 1.458vw, 1.458vw); margin-bottom: 0; }
    .area1-sub .info .foot-sec .f-right { text-align: right; }
    .area1-sub .info .foot-sec #f-copy { width: 120px; fill: var(--eli-color); }

    .area1-sub .info .foot-sec:last-child { display: flex; flex-direction: column; }
    .area1-sub .info .foot-sec:last-child .f-title { display: none; }
    .area1-sub .info .foot-sec:last-child .f-right { margin-top: auto; }

    .area1-sub .info ul li, .area1-sub .info a { color: var(--eli-color); height: 28px; line-height: 1; font-weight: 500; }

    #datetime { font-variant-numeric: tabular-nums; }
}


@media screen and (max-width:640px) {
    .pm-video { display: none !important; }

    .color-mode-toggle { padding: 0; right: 18px; }

    #scroll-to-top { position: fixed; right: 36px; bottom: 72px; }
    #scroll-to-top svg { width: 18px; height: 23px; }

    .bi_bk { top: 36px; left: 18px; }

    nav { position: relative; height: auto; min-height: 168px; }
    nav ul { flex-direction: column; height: auto; position: absolute; top: 31px; }
    nav li { margin: 0; padding: 0; margin-bottom: 4px; font-size: 16px; }
    .num-sup { top: -3px; font-size: 12px; }

    #wrap, #wrap-sub { width: 100%; min-height: 100vh; padding: 0; margin: 0; display: flex; flex-direction: column; position: relative; z-index: 4; background-color: var(--bg-color); color: var(--eli-color); line-height: 1; transition: background-color 0.4s; margin-bottom: 160vw !important; }

    #wrap .align-wrapper { margin: 48vw auto 8.333vw; width: calc(100vw - 36px); }
    #wrap .br-headline { position: relative; margin: 0; display:block; width: 96%; height: auto; letter-spacing: -0.01em; }
    #wrap .hl1, #wrap .hl2 { display: block; }

    .custom-quotes { font-size: 16vw !important; margin-top: -3vw; }

    #wrap .hl1 { width: 100%; display: block; line-height: 1; font-weight: 600; }
    #wrap .cmt { margin-top: 6vw; line-height: 1.4; margin-right: 0.6vw; font-size: 5vw; font-weight: 500; display: block; letter-spacing: 0; }
    #wrap .h-copy { display: inline; font-size: 8.8vw; line-height: 1.1; }
    #wrap .f-zdai, #wrap .f-zdai2, #wrap .f-zdai3 { display: inline; font-family: Zodiak; font-style: italic; letter-spacing: -0.03em; }
    #wrap .f-zdai { font-size: 8.8vw; }
    #wrap .f-zdai2 { font-size: 4.375vw; font-weight: 600; display: inline-block; letter-spacing: -0.02em; }
    #wrap .hl2 { font-size: clamp(17px, 2.656vw, 17px); line-height: 1.6; font-weight: 500; margin-top:6.6vw; letter-spacing: -0.02em; }

    .panel2 { height: 100vh; margin-bottom: 20vw; }
    .panel3 { height: auto; min-height: 25vw; }

    .featured-exp { display: flex; flex-direction: column; width: calc(100% - 36px); margin: 0 auto; position: relative; }
    .featured-exp h2, .recent-activity h2 { font-size: 15vw; font-weight: 600; margin-bottom: 15vw; letter-spacing: -0.01em; }
    .featured-exp .fe-list-row, .recent-activity .fe-list-row { display: flex; }
    .featured-exp .fe-list-row { display: flex; flex-wrap: wrap; }
    .fe-list-row ul { margin-bottom: 15vw; justify-content: flex-start; }

    #wrap .pic-wrap { position: relative; overflow: hidden; width: 100%; }
    #wrap .card_pic { display: block; width: 100%; height: auto; transition: transform 0.5s ease-out; }
    #wrap .card_pic:hover { transform: scale(1.04); }

    .recent-activity { width: calc(100% - 36px); margin: 0 auto; margin-top: 20vw; background-color: var(--bg-color); transition: background-color 0.4s; }
    .recent-activity .fe-list-row2 { display: flex; flex-wrap: wrap; gap: 1.667vw; }
    .recent-activity .fe-list-row2 > ul { width: 100%; margin-bottom: 14vw; }

    .fe-list-row2 > ul:nth-child(2), .fe-list-row2 > ul:nth-child(3) { display: none; }

    .ra-bottom-row { margin-top: 1.563vw; }

    .s912, .s600 { margin-top: 1.354vw; }
    .right-list { width: 41.667vw; max-width: 600px; }
    .ra-area1 { color: var(--eli-color); font-size: 4vw; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; }
    .ra-bottom-row { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
    .a2-title, .a2-desc { display: block; }
    .a2-title, .ra-area3 { margin-top: 1.354vw; line-height: 1.2; }
    .a2-title { font-size: clamp(20px, 3.125vw, 24px); font-weight: 500; margin-right: 30px; }
    .a2-desc { font-size: clamp(16px, 1.146vw, 22px); opacity: var(--opc1); margin-top: 0.729vw; font-weight: 500; }
    .ra-area3 { font-size: clamp(20px, 3.125vw, 24px); font-weight: 500; }

    .view-all { width: 44.896vw; display: flex; justify-content: flex-end; align-items: flex-end; letter-spacing: -0.01em; margin-left: auto; }
    .view-all ul { margin: 0; padding: 0; list-style: none; }
    .all-link a { line-height: 1.3; width: auto; font-size: clamp(28px, 4.063vw, 52px); font-weight: 600; text-decoration: underline; text-decoration-thickness: 0.104vw; text-underline-offset: 0.521vw; }

    .all-num { padding-left: 40px; }
    .all-txt { text-align: right; }
    .all-no { font-size: clamp(2.604vw, 100px, 100px); font-weight: 800; }

    .panel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 1.5em; text-align: center; position: relative; }
    .panel h2 { display: none; }

    .icon-external { margin-bottom: 3px; }
    .icon-external path { fill: var(--eli-color); }

    .vertcopy2 { position: fixed; bottom: calc(-10vw + 80px); right: 80px; z-index: 2; }
    .vertcopy2 svg { width: 1.6649vw; max-width: 16px; }
    .vertcopy2 svg path { fill: var(--eli-color); }

    .line_th2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
    .mq-text { font-size: 14vw; }
    .marquee-area { margin-top: 15vw; overflow: hidden; height: 120px; }
    .hl-op { opacity: 0.3 !important; }
    
    .o-abt { width: calc(100% - 36px); margin: 0 auto; margin-top: 20vw; }
    .o-abt > ul { display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto; gap: 24px; width: 100%; }

    .abt1 { font-size: 4.8vw; font-weight: 400; }
    .abt2 > ul { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 400px; }
    .abt2-title { font-size: 8vw; font-weight: 600; line-height: 1.1; margin-bottom: 2.0833vw; }
    .abt2-desc { font-size: 4vw; line-height: 1.4; margin-bottom: 4.1667vw; }
    .abt2-btn { font-size: 5.6vw; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }

    .hero-slider { width: 100%; aspect-ratio: 3 / 2; position: relative; display: flex; z-index: 0; }
    .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
    .hero-slider .swiper-slide { overflow: hidden; }
    .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; }
    .swiper-container { margin-top: 8vw; margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
    .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform, -webkit-transform; box-sizing: content-box; }
    .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform, -webkit-transform; }


    #site-footer-sub { height: 130vw; }

    .area1-sub { color: var(--eli-color); }
    #footer-logo { position: absolute; overflow: hidden; height: 100%; bottom: -66vw; }
    #footer-logo svg { overflow: visible; width: 123.9583vw; height: 100%; }
    #footer-logo svg path { fill: var(--eli-color); }

    .area1-sub { width: calc(100% - 36px); position: relative; z-index: 1; bottom: 12vw; }
    .area1-sub .info { display: flex; flex-wrap: wrap; font-size: clamp(16px, 1.667vw, 1.875vw); margin-top: 60px; align-items: stretch; }

    /* .area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2) { width: calc((100% - 72px) * (3/6)); margin-bottom: 4vw; }
    .area1-sub .foot-sec:nth-child(3), .area1-sub .foot-sec:nth-child(4) { width: calc((100% - 72px) * (3/6)); }

    .area1-sub .foot-sec { flex: 0 0 calc((100% - 24px) / 2); } */

    .area1-sub .info, .area2-sub .info, .area3-sub .info, .area4-sub .info { display: block; width: 100%; }
    .area1-sub .foot-sec, .area2-sub .foot-sec, .area3-sub .foot-sec, .area4-sub .foot-sec { flex: none; width: 100vw; }

    .area1-sub .foot-sec:nth-child(1), .area1-sub .foot-sec:nth-child(2), .area1-sub .foot-sec:nth-child(3), .area1-sub .foot-sec:nth-child(4) { width: 100vw; }

    .area1-sub .foot-sec { margin-bottom: 8vw; }


    .area1-sub .info .foot-sec .f-title { font-size: clamp(14px, 1.458vw, 1.458vw); margin-bottom: 0; }
    .area1-sub .info .foot-sec .f-right { text-align: left; }
    .area1-sub .info .foot-sec #f-copy { width: 100px; fill: var(--eli-color); }

    .area1-sub .info .foot-sec:last-child { display: flex; flex-direction: column; }
    .area1-sub .info .foot-sec:last-child .f-title { display: none; }
    .area1-sub .info .foot-sec:last-child .f-right { margin-top: auto; }

    .area1-sub .info ul li, .area1-sub .info a { color: var(--eli-color); height: 24px; line-height: 1; font-weight: 500; }

    #datetime { font-variant-numeric: tabular-nums; }
}