@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://cdn.jsdelivr.net/gh/leetaewook/gmarket-sans-dynamic-subset/GmarketSans.css');

:root {
    --layoutwidth: 1570px;
    --layoutwidthMini : 1350px;

    --mainfont: 'Pretendard Variable';
    --pointfont: 'Gmarket Sans';

    --pointcolor: #3bbee8;
    --subcolor: #6fb7cf;
    --subcolor2: #ff7d21;

    --backcolor: #d5ddd8;
    --textcolor: #1a1a1a;
    --graycolor: #4f4f4f;
    --midgraycolor: #a3a3a3;
    --lightgraycolor: #cecece;
}

/* Fonts */
.main-font { font-family: var(--mainfont), sans-serif !important; }
.point-font { font-family: var(--pointfont), serif !important; }

/* Colors */
.point-color { color: var(--pointcolor) !important; }
.sub-color { color: var(--subcolor) !important; }
.sub-color2 { color: var(--subcolor2) !important; }

.back-color { color: var(--backcolor) !important; }
.text-color { color: var(--textcolor) !important; }
.gray-color { color: var(--graycolor) !important; }
.mid-gray-color { color: var(--midgraycolor) !important; }
.light-gray-color { color: var(--lightgraycolor) !important; }

.white-color { color: #fff; }

/* Bgs */
.point-bg { background-color: var(--pointcolor) !important; }
.sub-bg { background-color: var(--subcolor) !important; }
.sub-bg2 { background-color: var(--subcolor2) !important; }

.back-bg { background-color: var(--backcolor) !important; }
.text-bg { background-color: var(--textcolor) !important; }
.gray-bg { background-color: var(--graycolor) !important; }
.mid-gray-bg { background-color: var(--midgraycolor) !important; }
.light-gray-bg { background-color: var(--lightgraycolor) !important; }

.white-bg { background-color: #fff; }

/* ========== Line-hight ========== */
.lh-10 { line-height: 1.0; }
.lh-12 { line-height: 1.2; }
.lh-14 { line-height: 1.4; }
.lh-15 { line-height: 1.5; }
.lh-16 { line-height: 1.6; }
.lh-17 { line-height: 1.7; }
.lh-20 { line-height: 2.0; }

/* Text-align */
.text-left   { text-align: left; }
.text-right  { text-align: right; }
.text-center { text-align: center; }

/* Font Size */
.font-12  { font-size: 0.750rem; }
.font-14  { font-size: 0.875rem; }
.font-15  { font-size: .9375rem; }
.font-16  { font-size: 1.000rem; }
.font-18  { font-size: 1.125rem; }
.font-20  { font-size: 1.250rem; }
.font-22  { font-size: 1.375rem; }
.font-24  { font-size: 1.500rem; }
.font-25  { font-size: 1.5625rem;}
.font-26  { font-size: 1.625rem; }
.font-27  { font-size: 1.7rem; }
.font-28  { font-size: 1.750rem; }
.font-30  { font-size: 1.875rem; }
.font-32  { font-size: 2.000rem; }
.font-34  { font-size: 2.125rem; }
.font-35  { font-size: 2.1875rem;}
.font-36  { font-size: 2.250rem; }
.font-38  { font-size: 2.375rem; }
.font-40  { font-size: 2.500rem; }
.font-42  { font-size: 2.625rem; }
.font-44  { font-size: 2.750rem; }
.font-45  { font-size: 2.8125rem;}
.font-46  { font-size: 2.875rem; }
.font-48  { font-size: 3.000rem; }
.font-50  { font-size: 3.125rem; }
.font-55  { font-size: 3.4375rem;}
.font-60  { font-size: 3.750rem; }
.font-65  { font-size: 4.0625rem;}
.font-70  { font-size: 4.375rem; }
.font-75  { font-size: 4.6875rem;}
.font-80  { font-size: 5.000rem; }
.font-85  { font-size: 5.3125rem;}
.font-90  { font-size: 5.625rem; }
.font-95  { font-size: 5.9375rem;}
.font-100 { font-size: 6.250rem; }
.font-110 { font-size: 6.875rem; }
.font-120 { font-size: 7.500rem; }
.font-125 { font-size: 7.775rem; }
.font-130 { font-size: 8.125rem; }
.font-140 { font-size: 8.750rem; }
.font-150 { font-size: 9.375rem; }
.font-160 { font-size: 10.000rem; }
.font-170 { font-size: 10.625rem; }
.font-180 { font-size: 11.250rem; }
.font-190 { font-size: 11.875rem; }
.font-200 { font-size: 12.500rem; }
@media (max-width:768px){
    .font-100 { font-size: 5.75rem; }
    .font-95  { font-size: 5.5rem; }
    .font-70  { font-size: 2.95rem;}
    .font-50  { font-size: 2.5rem; }
    .font-38  { font-size: 2.05rem; }
    .font-35  { font-size: 1.95rem; }
    .font-32  { font-size: 1.85rem;}
    .font-27  { font-size: 1.325rem; }
    .font-25  { font-size: 1.25rem; }
    .font-22  { font-size: 1.15rem;}
    .font-20  { font-size: 1.1rem;}
    .font-15  { font-size: 1rem; }
    .font-14  { font-size: .9rem; }
}

/* Font Weights */
.bold100 { font-weight: 100; }
.bold200 { font-weight: 200; }
.bold300 { font-weight: 300; }
.bold400 { font-weight: 400; }
.bold500 { font-weight: 500; }
.bold600 { font-weight: 600; }
.bold700 { font-weight: 700; }
.bold800 { font-weight: 800; }
.bold900 { font-weight: 900; }

/* Width */
.width100 { width: 100% !important; }
.width95  { width: 95%; }
.width90  { width: 90%; }
.width85  { width: 85%; }
.width80  { width: 80%; }
.width75  { width: 75%; }
.width70  { width: 70%; }
.width65  { width: 65%; }
.width60  { width: 60%; }
.width55  { width: 55%; }
.width50  { width: 50%; }
.width45  { width: 45%; }
.width40  { width: 40%; }
.width35  { width: 35%; }
.width30  { width: 30%; }
.width25  { width: 25%; }
.width20  { width: 20%; }
.width15  { width: 15%; }
.width10  { width: 10%; }

.ls-01 { letter-spacing: -1px; }
.ls-02 { letter-spacing: -2px; }
.ls-03 { letter-spacing: -3px; }
.ls-04 { letter-spacing: -4px; }
.ls-05 { letter-spacing: -5px; }
.ls-06 { letter-spacing: -6px; }
.ls-07 { letter-spacing: -7px; }
.ls-08 { letter-spacing: -8px; }

.ls-10 { letter-spacing: 1px; }
.ls-20 { letter-spacing: 2px; }
.ls-30 { letter-spacing: 3px; }
.ls-40 { letter-spacing: 4px; }
.ls-50 { letter-spacing: 5px; }
.ls-80 { letter-spacing: 8px; }
.ls-100 { letter-spacing: 10px; }

/* Positions & Visible */
.hidden   { overflow: hidden; }
.scrolls { overflow: scroll; }
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }

.visible-lg, .visible-md, .visible-sm, .visible-xs,.visible-xxs {display:none !important}

@media (max-width:1550px) { .hidden-lg {display:none!important} .visible-lg {display:block!important}}
@media (max-width:1240px) { .hidden-md {display:none!important} .visible-md {display:block!important}}
@media (max-width:990px)  { .hidden-sm {display:none!important} .visible-sm {display:block!important}}
@media (max-width:768px)  { .hidden-xs {display:none!important} .visible-xs {display:block!important}}
@media (max-width:500px)  { .hidden-xxs{display:none!important} .visible-xxs{display:block!important}}

/* Display */
.block { display: block; }
.inline-block { display: inline-block; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }

.flex-wrap { flex-wrap: wrap; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; justify-content: space-between; }

.justify-start { justify-content: flex-start; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }

.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }

/* Section Common */
.section            { padding:200px 0; }
.section_mini       { padding:150px 0; }
.section-left       { padding-left : calc( (100% - var(--layoutwidth) ) / 2); width: 100%; }
.section-right      { padding-right: calc( (100% - var(--layoutwidth) ) / 2); width: 100%; }
.section-left_mini  { padding-left : calc( (100% - var(--layoutwidthMini) ) / 2); width: 100%; }
.section-right_mini { padding-right: calc( (100% - var(--layoutwidthMini) ) / 2); width: 100%; }

@media (max-width:1350px){
    .section            { padding:120px 0; }
    .section_mini       { padding:100px 0; }
    .section-left, .section-left_mini { padding-left: 5%; }
    .section-right, .section-right_mini { padding-right: 5%; }
}
@media (max-width: 990px){
    /* .section       { padding: 100px 0; }
    .section_mini  { padding: 80px 0; } */
}
@media (max-width: 500px){
    /* .section       { padding: 80px 0; }
    .section_mini  { padding: 50px 0; } */
}

/* Margin */
.m-auto { margin: auto; }
.mt-0   { margin-top: 0 !important;}
.mt-5   { margin-top: 0.3125rem;}
.mt-10  { margin-top: 0.625rem; }
.mt-15  { margin-top: 0.9375rem;}
.mt-20  { margin-top: 1.250rem; }
.mt-25  { margin-top: 1.5625rem;}
.mt-30  { margin-top: 1.875rem; }
.mt-35  { margin-top: 2.1875rem;}
.mt-40  { margin-top: 2.500rem; }
.mt-45  { margin-top: 2.8125rem;}
.mt-50  { margin-top: 3.125rem; }
.mt-60  { margin-top: 3.750rem; }
.mt-70  { margin-top: 4.375rem; }
.mt-80  { margin-top: 5.000rem; }
.mt-90  { margin-top: 5.625rem; }
.mt-100 { margin-top: 6.250rem; }
.mt-120 { margin-top: 7.500rem; }
.mt-140 { margin-top: 8.750rem; }
.mt-150 { margin-top: 9.375rem; }
.mb-0   { margin-bottom: 0 !important;}
.mb-5   { margin-bottom: 0.3125rem;}
.mb-10  { margin-bottom: 0.625rem; }
.mb-15  { margin-bottom: 0.9375rem;}
.mb-20  { margin-bottom: 1.250rem; }
.mb-25  { margin-bottom: 1.5625rem;}
.mb-30  { margin-bottom: 1.875rem; }
.mb-35  { margin-bottom: 2.1875rem;}
.mb-40  { margin-bottom: 2.500rem; }
.mb-45  { margin-bottom: 2.8125rem;}
.mb-50  { margin-bottom: 3.125rem; }
.mb-60  { margin-bottom: 3.750rem; }
.mb-70  { margin-bottom: 4.375rem; }
.mb-80  { margin-bottom: 5.000rem; }
.mb-90  { margin-bottom: 5.625rem; }
.mb-100 { margin-bottom: 6.250rem; }
.mb-120 { margin-bottom: 7.500rem; }
.mb-140 { margin-bottom: 8.750rem; }
.mb-150 { margin-bottom: 9.375rem; }
.mr-0   { margin-right: 0 !important;}
.mr-5   { margin-right: 0.3125rem;}
.mr-10  { margin-right: 0.625rem; }
.mr-15  { margin-right: 0.9375rem;}
.mr-20  { margin-right: 1.250rem; }
.mr-25  { margin-right: 1.5625rem;}
.mr-30  { margin-right: 1.875rem; }
.mr-35  { margin-right: 2.1875rem;}
.mr-40  { margin-right: 2.500rem; }
.mr-45  { margin-right: 2.8125rem;}
.mr-50  { margin-right: 3.125rem; }
.mr-60  { margin-right: 3.750rem; }
.mr-70  { margin-right: 4.375rem; }
.mr-80  { margin-right: 5.000rem; }
.mr-90  { margin-right: 5.625rem; }
.mr-100 { margin-right: 6.250rem; }
.ml-0   { margin-left: 0 !important;}
.ml-5   { margin-left: 0.3125rem;}
.ml-10  { margin-left: 0.625rem; }
.ml-15  { margin-left: 0.9375rem;}
.ml-20  { margin-left: 1.250rem; }
.ml-25  { margin-left: 1.5625rem;}
.ml-30  { margin-left: 1.875rem; }
.ml-35  { margin-left: 2.1875rem;}
.ml-40  { margin-left: 2.500rem; }
.ml-45  { margin-left: 2.8125rem;}
.ml-50  { margin-left: 3.125rem; }
.ml-60  { margin-left: 3.750rem; }
.ml-70  { margin-left: 4.375rem; }
.ml-80  { margin-left: 5.000rem; }
.ml-90  { margin-left: 5.625rem; }
.ml-100 { margin-left: 6.250rem; }

/* Padding */
.pt-0   { padding-top: 0!important;}
.pb-0   { padding-bottom: 0!important;}
.pr-0   { padding-right:0!important}
.pl-0   { padding-left:0!important}
.pt-5   { padding-top: 0.3125rem;}
.pt-10  { padding-top: 0.625rem; }
.pt-15  { padding-top: 0.9375rem;}
.pt-20  { padding-top: 1.250rem; }
.pt-25  { padding-top: 1.5625rem;}
.pt-30  { padding-top: 1.875rem; }
.pt-35  { padding-top: 2.1875rem;}
.pt-40  { padding-top: 2.500rem; }
.pt-45  { padding-top: 2.8125rem;}
.pt-50  { padding-top: 3.125rem; }
.pt-60  { padding-top: 3.750rem; }
.pt-70  { padding-top: 4.375rem; }
.pt-80  { padding-top: 5.000rem; }
.pt-90  { padding-top: 5.625rem; }
.pt-100 { padding-top: 6.250rem; }
.pb-5   { padding-bottom: 0.3125rem;}
.pb-10  { padding-bottom: 0.625rem; }
.pb-15  { padding-bottom: 0.9375rem;}
.pb-20  { padding-bottom: 1.250rem; }
.pb-25  { padding-bottom: 1.5625rem;}
.pb-30  { padding-bottom: 1.875rem; }
.pb-35  { padding-bottom: 2.1875rem;}
.pb-40  { padding-bottom: 2.500rem; }
.pb-45  { padding-bottom: 2.8125rem;}
.pb-50  { padding-bottom: 3.125rem; }
.pb-60  { padding-bottom: 3.750rem; }
.pb-70  { padding-bottom: 4.375rem; }
.pb-80  { padding-bottom: 5.000rem; }
.pb-90  { padding-bottom: 5.625rem; }
.pb-100 { padding-bottom: 6.250rem; }
.pr-5   { padding-right: 0.3125rem;}
.pr-10  { padding-right: 0.625rem; }
.pr-15  { padding-right: 0.9375rem;}
.pr-20  { padding-right: 1.250rem; }
.pr-25  { padding-right: 1.5625rem;}
.pr-30  { padding-right: 1.875rem; }
.pr-35  { padding-right: 2.1875rem;}
.pr-40  { padding-right: 2.500rem; }
.pr-45  { padding-right: 2.8125rem;}
.pr-50  { padding-right: 3.125rem; }
.pr-60  { padding-right: 3.750rem; }
.pr-70  { padding-right: 4.375rem; }
.pr-80  { padding-right: 5.000rem; }
.pr-90  { padding-right: 5.625rem; }
.pr-100 { padding-right: 6.250rem; }
.pl-5   { padding-left: 0.3125rem;}
.pl-10  { padding-left: 0.625rem; }
.pl-15  { padding-left: 0.9375rem;}
.pl-20  { padding-left: 1.250rem; }
.pl-25  { padding-left: 1.5625rem;}
.pl-30  { padding-left: 1.875rem; }
.pl-35  { padding-left: 2.1875rem;}
.pl-40  { padding-left: 2.500rem; }
.pl-45  { padding-left: 2.8125rem;}
.pl-50  { padding-left: 3.125rem; }
.pl-60  { padding-left: 3.750rem; }
.pl-70  { padding-left: 4.375rem; }
.pl-80  { padding-left: 5.000rem; }
.pl-90  { padding-left: 5.625rem; }
.pl-100 { padding-left: 6.250rem; }
.pd-1em { padding: 1em}
.pd-2em { padding: 2em}
.pd-3em { padding: 3em}
.pd-4em { padding: 4em}
.px-1em { padding-left: 1em ; padding-right: 1em}
.px-2em { padding-left: 2em ; padding-right: 2em}
.px-3em { padding-left: 3em ; padding-right: 3em}
.px-4em { padding-left: 4em ; padding-right: 4em}
.py-1em { padding-top:  1em ; padding-bottom: 1em}
.py-2em { padding-top:  2em ; padding-bottom: 2em}
.py-3em { padding-top:  3em ; padding-bottom: 3em}
.py-4em { padding-top:  4em ; padding-bottom: 4em}

/* Border Radius */
.sec-radius    { border-radius: 3rem; }
.sec-radius-md { border-radius: 2rem; }
.sec-radius-sm { border-radius: 1rem; }
.sec-radius-xs { border-radius: .5rem; }

/* Box Content */
.flexList { --x-gap:1.500rem; --y-gap:1.500rem;   display:flex;  flex-wrap:wrap;  gap:var(--y-gap) var(--x-gap);}
.flexList > .box{width:calc(100% / var(--count) - (var(--x-gap) * (var(--count) - 1)) / var(--count)); }
.flexList[layoutStyle="fullbox"] {--x-gap:0; --y-gap:10px; }
.flexList[layoutStyle="fullbox"] > .box{  width:calc(100% / var(--count)) }
/* boxCout */
[boxCount="2"]{ --count:2; }
[boxCount="3"]{ --count:3; }
[boxCount="4"]{ --count:4; }
[boxCount="5"]{ --count:5; }
[boxCount="6"]{ --count:6; }
[boxCount="7"]{ --count:7; }
[boxCount="8"]{ --count:8; }
@media (max-width:990px){
    .sm-wrap3{--count:3}
    .sm-wrap2{--count:2}
    .sm-wrap1{--count:1}
}
@media (max-width:768px){
    .xs-wrap3{--count:3}
    .xs-wrap2{--count:2}
    .xs-wrap1{--count:1}
}
@media (max-width:500px){
    .xxs-wrap2{--count:2}
    .xxs-wrap1{--count:1}
}

/* ========== Aos (fade) ========== */
[data-aos=fade-up2] { transform: translate3d(0, 30px, 0); }
[data-aos=fade-down2] { transform: translate3d(0, -30px, 0); }
[data-aos=fade-right2] { transform: translate3d(-30px, 0, 0); }
[data-aos=fade-left2] { transform: translate3d(30px, 0, 0); }
[data-aos=fade-up-right2] { transform: translate3d(-30px, 30px, 0); }
[data-aos=fade-up-left2] { transform: translate3d(30px, 30px, 0); }
[data-aos=fade-down-right2] { transform: translate3d(-30px, -30px, 0); }
[data-aos=fade-down-left2] { transform: translate3d(30px, -30px, 0); }
[data-aos=fade-in] { transform: translate3d(0, 0, 0); }
/* ========== Aos (zoom) ========== */
[data-aos*="bg-zoom-out"]{transform: scale(1.1)}
[data-aos*="bg-zoom-out"].aos-animate {transform: scale(1);}
[data-aos*="bg-zoom-in"]{transform: scale(1)}
[data-aos*="bg-zoom-in"].aos-animate {transform: scale(1.1);}

/* ========== Aos (reveal) ========== */
[data-aos="reveal-line"]{clip-path:polygon(0 0,0 0,0 100%,0 100%);}
[data-aos="reveal-line"].aos-animate {clip-path: polygon(0 0,100% 0,100% 100%,0 100%)}
[data-aos="reveal-line-revers"]{clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%)}
[data-aos="reveal-line-revers"].aos-animate {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)}

[data-aos="reveal-line-half"]{clip-path:polygon(0 0,50% 0,50% 100%,0 100%);}
[data-aos="reveal-line-half"].aos-animate {clip-path: polygon(0 0,100% 0,100% 100%,0 100%)}
[data-aos="reveal-line-half-revers"]{clip-path:polygon(50% 0,100% 0,100% 100%,50% 100%);}
[data-aos="reveal-line-half-revers"].aos-animate {clip-path: polygon(0 0,100% 0,100% 100%,0% 100%)}

[data-aos="reveal-top"]{clip-path:polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);}
[data-aos="reveal-top"].aos-animate {clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 0);}
[data-aos="reveal-bottom"]{clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}
[data-aos="reveal-bottom"].aos-animate {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
[data-aos="reveal-circle"]{clip-path: circle(0% at 50% 50%);}
[data-aos="reveal-circle"].aos-animate {clip-path:  circle(100% at 50% 50%);}
[data-aos="reveal-open"]{clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%)}
[data-aos="reveal-open"].aos-animate {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)}

/* ========== Aos (animation 효과로 설정) ========== */
[data-aos="title"]{ opacity: 0;}
[data-aos="title"].aos-animate {animation: title 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;}
[data-aos="tit_mini"]{ opacity: 0;}
[data-aos="tit_mini"].aos-animate {animation: tit_mini 1.2s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;}
[data-aos="focus"]{ opacity: 0;}
[data-aos="focus"].aos-animate {animation: focus 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

/* ========== Animation ========== */
@keyframes title    {0% {letter-spacing: -0.5em;opacity: 0;} 40% {opacity: 0.6;}  100% {opacity: 1;} }
@keyframes tit_mini {0% {letter-spacing: 0.5em;opacity: 0;}  40% {opacity: 0.6;}  100% {letter-spacing: 0;opacity: 1;}}
@keyframes focus    {0% {-webkit-filter: blur(12px);filter: blur(12px);opacity: 0;}  100% {-webkit-filter: blur(0px);filter: blur(0px);opacity: 1;}}
@keyframes cycleM   {0% {transform:  translateY(0) scale(1);}    100% {transform: translateY(1.5rem) scale(0.95)}}
@keyframes rotate   {from{ transform: rotate(0); }to{ transform: rotate(360deg); }}
@keyframes scroll   {0% {transform: translate(-50%, 0);opacity: 0;} 40% {opacity: 1;}80% {transform: translate(-50%, 1.4rem);opacity: 0;}100% {opacity: 0;}}
@keyframes bigger   {0%{transform: scale(0); opacity:1;} 100%{transform: scale(5); opacity:0;}}
@keyframes bounce   {to {transform: translateX(2rem);opacity: 0;}}

/* ===================================================== */

h1, h2, h3, h4, h5, h6 { font-weight: 400; margin: 0; padding: 0; font-family: var(--mainfont) !important; }
u { text-underline-position: under; text-decoration-thickness: 1px; }

.img-responsive { display: block; max-width: 100%; }

html, body { font-size: 16px; }
section.section { position: relative; font-size: 16px; font-family: var(--mainfont), -apple-system, BlinkMacSystemFont, system-ui, "Malgun Gothic", sans-serif; letter-spacing: -1.5px; font-weight: 400; }
.container { width: var(--layoutwidth); margin: auto; }
.container_mini { width: var(--layoutwidthMini); margin: auto; }
.container img { display: block; max-width: 100%; -webkit-user-drag: none; user-select: none; }
@media (max-width:1570px){
.container, .container_mini { width: 90%; }
}
@media (max-width:1350px){
    .container img { width: 100%; }
    .container img.width90 { width: 90%; }
}
@media (max-width:1080px){
    /* .container, .container_mini { width: 100%; } */
}
@media (max-width:990px){
    html, body { font-size: 14px; }
}
@media (max-width:768px){
    html, body { font-size: 12px; }
}
@media (max-width:500px){
    html, body { font-size: 10px; }
}