@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap');

.mainWrap *{
    line-height: 100%;
    letter-spacing: -1px;
    box-sizing: border-box;
}

.disN{
	display:none;
}
.slick-slide img{
    width:100%;
}


.mainWrap{
    width: 100%;
	position:relative;
}

/*loader*/
body{
	overflow-x:hidden;
	font-family: "Asta Sans", sans-serif;
}
.loading{
    width:100%;
    height:100%;
    position:fixed;
    left:0px;
    top:0px;
    background:#fff;
    z-index:1000;
}
.loading img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.main_loader{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 11;
    width: 350px;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    font-size: 35px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}
.circular_loader {
    -webkit-animation: rotate 1s linear infinite;
    animation: rotate 2s linear infinite;
    height: calc(100% + 40px);
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    width: calc(100% + 40px);
    position: absolute;
    top: -20px;
    left: -20px;
    margin: auto;
}

.loader_path {
    stroke-dasharray: 150, 200;
    stroke-dashoffset: -10;
    -webkit-animation: dash_circle 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    animation: dash_circle 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    stroke-linecap: round;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes dash_circle {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}


#header {
	opacity: 0;
	 animation: fadeIn 1s 4s forwards;
}

#header.--color .logo a {background: url(../images/logo.png?v=1) center center / cover no-repeat;}
#header.--color #nav .gnb li a span {color:#3a363b;}
#header.--color .utils .open_info {color:#670000; border: 1px solid #670000;}
#header.--color .header-inner::after { background: #3a363b;}
#header.--color:hover .header-inner::after {    background: #fff;}



.fp-enabled #fullpage .section.mainVisual,
.fp-enabled #fullpage .section.intro,
.fp-enabled #fullpage .section.summary,
.fp-enabled #fullpage .section.premium,
.fp-enabled #fullpage .section.brand {
    height: 100vh;
}

.fp-enabled #fullpage .section.intro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 0;
    padding-bottom: 0;
}
@media (max-height: 900px) {
    .fp-enabled #fullpage .section.intro .image img { max-height: 38vh; width: auto; max-width: 100%; }
    .fp-enabled #fullpage .section.intro .explain  { margin-top: 24px; }
    .fp-enabled #fullpage .section.intro .logo     { margin-top: 28px; }
}

.fp-enabled #fullpage .section.summary .image {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
}
.fp-enabled #fullpage .section.summary .text { flex: 0 0 auto; }

.fp-enabled #fullpage .section.brand .bg {
    background-attachment: scroll;
}

.fp-enabled #fullpage .section.contact {
    height: 100vh;
    display: flex;
    align-items: center;
}
.fp-enabled #fullpage .section.contact .contact_wrap { width: 100%; }



/*mainVisual*/
.mainVisual {
	width: 100%;
    position: relative;
    height: 100vh ;
    overflow: hidden;
}

.intro_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #670000;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    animation:
        introOverlayShrink 0.9s ease-in-out forwards,
        introOverlayBgFade 0.9s ease-in-out forwards;
    animation-delay: 2.9s, 2.9s;
}

.intro_gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: linear-gradient(to right, #670000 0%, #670000 20%, rgba(103, 0, 0, 0.7) 55%, rgba(103, 0, 0, 0) 100%);
    opacity: 0;
    animation: gradientFadeIn 0.9s ease-in-out forwards;
    animation-delay: 3.1s;
}

.intro_slogan {
    position: relative;
    z-index: 10;
    text-align: center;
    color: #fff;
    opacity: 1; 
    animation: fadeIn 0.5s ease-in-out forwards;
    animation-delay: 2.9s;
    transition: opacity 1s ease;
}

.mainVisual.is-slide-alt .intro_slogan {
    animation: none;
    opacity: 0;
    pointer-events: none;
}

.slogan_alt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -80%); 
    z-index: 10;
    text-align: center;
    color: #fff;
    opacity: 0;
    transition: opacity 1s ease;
    pointer-events: none;
	max-width: 288px;
    width: 100%;
}


.mainVisual.is-slide-alt .slogan_alt {
    opacity: 1;
    pointer-events: auto;
}

.slogan_alt_text {
    font-family: "Asta Sans", sans-serif;
    font-size: 40px;
    line-height: 140%;
    font-weight: 300;
}
.slogan_alt_text .point { font-weight: 600; }

.slogan_alt_line {
    width: 2px;
    height: 60px;
    background: #fff;
    margin: 5% auto;
}
.slogan_alt_logo {
	width: 263px;
    margin: 0 auto;
}
.slogan_alt_logo img {
    width: 100%;
}



.intro_slogan_text {
    font-family: "Asta Sans", sans-serif;
    font-size: 40px;
    line-height: 120%;
    font-weight: 300;
    overflow: hidden;
}

.intro_small_slogan {
	font-size: 20px;
    line-height: 130%;
    margin-bottom: 5.5%;
	position:relative;
	opacity: 0;
	transform: translateY(30%);
    animation: up_move 1s  0.25s forwards;
}

.intro_small_slogan::after {
	content: "";
    width: 90%;
    height: 1px;
    background: #fff;
    display: block;
    margin: 5% auto;
}

.intro_slogan_text .point { font-weight: 600; }

.intro_slogan_text .char {
    display: inline-block;
    opacity: 0;
    transform: translateY(40px);
    animation: charUp 0.6s 0.5s forwards;
    animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.intro_slogan_text01 .char {
    animation-delay: calc(var(--char-index) * 0.055s);
}

.intro_slogan_text02 .char {
    animation-delay: calc(0.5s + (var(--char-index) * 0.055s));
}

.intro_line {
    width: 2px;
    height: 60px;
    background: #fff;
    margin: 5% auto;
    transform: scaleY(0);
    transform-origin: top;
    animation: growDown 1s ease-out forwards;
    animation-delay: 1.5s;
}

.intro_logo {
    opacity: 0;
    animation: fadeIn 0.6s ease-out forwards;
    animation-delay: 1.9s;
}

/* .intro_logo img { width: 100%; } */


.mainVisual .bg{
    width: 100vw;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 177.77vh;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: -2;
}
.mainVisual .bg:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #00000053;
    pointer-events: none;
	z-index: 1;
    animation: back_bg 6s forwards;
}
.mainVisual .bg iframe{
    position: absolute;
    left:0;
    top: 0;
    width:100%;
    height: 100%;
}



.mainVisual .mainSlider {
    width: 100%;
}
.mainVisual .mainSlider .slideCon {
	position: relative;
	height: 100vh;
}

/* .mainVisual .bg{
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
	transition: transform 1s ease-out
    transform: scale(1.15);
}
.mainVisual .mainSlider .slideCon01 .bg{ background: url(../images/mainVisual_img_01.jpg?v=1) center center / cover no-repeat;}
.mainVisual .mainSlider .slideCon02 .bg{ background: url(../images/mainVisual_img_02.jpg?v=1) center center / cover no-repeat;}
.mainVisual .mainSlider .slideCon03 .bg{ background: url(../images/mainVisual_img_03.jpg?v=1) center center / cover no-repeat;}

.mainVisual .slick-active .bg{
	animation:scale_1 4s forwards;
	transition: transform 4s ease-out;
}
 */
/* .mainVisual.is-slide03 .intro_slogan {
	transform: translateY(-60%);
} */


.mainVisual .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    width: 100%;
}
.mainVisual .text .logo {
    margin-bottom: 30px;
    opacity: 0;
    animation: logo_in 1.2s cubic-bezier(.22, 1, .36, 1) 1.8s forwards;
}
.mainVisual .text .title {
    font-size: 60px;
    line-height: 110%;
    font-weight: 300;
    margin-bottom: 20px;
}
.mainVisual .text .title b,
.mainVisual .text .title span {
    display: inline-block;
    opacity: 0;
    animation: text_up 1s cubic-bezier(.22, 1, .36, 1) forwards;
}
.mainVisual .text .title > :nth-child(1) { animation-delay: 2.2s; }
.mainVisual .text .title > :nth-child(2) { animation-delay: 2.2s; }
.mainVisual .text .title > :nth-child(4) { animation-delay: 2.45s; }
.mainVisual .text .title > :nth-child(5) { animation-delay: 2.45s; }
.mainVisual .text .explain {
    font-weight: 300;
    font-size: 24px;
    opacity: 0;
    animation: text_up 1s cubic-bezier(.22, 1, .36, 1) 2.8s forwards;
}
.mainVisual .text .explain b {
    font-weight: 500;
    letter-spacing: -2px;
}
.mainVisual .text .explain span {
    display: inline-block;
    font-style: italic;
    opacity: 0;
    animation: text_up .8s cubic-bezier(.22, 1, .36, 1) 2.8s forwards;
}
/* animation */
@keyframes text_up {
    from { opacity: 0; transform: translateY(30px); filter: blur(8px); }
    to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes logo_in {
    from { opacity: 0; transform: scale(.92); filter: blur(6px); }
    to { opacity: 1; transform: scale(1); filter: blur(0); }
}
@keyframes line_grow {
    from { width: 0; }
    to { width: 120px; }
}
@keyframes back_bg {
    0% { background: #000000ba; }
	20% { background: #000000ba; }
	50% { background: #000000ba; }
    100%  { background: #00000053; }
}
   

/* intro */

.fp-enabled #fullpage .section.intro {padding-top:5%;}

.intro {
    padding: 140px 0 100px;
    background: #f5f3f1;
    text-align: center;
}


.intro .text .sub {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.4;
    color: #670000;
    margin-bottom: 5px;
    opacity: 0;
}

.intro .text .title {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.04em;
    color: #670000;
    opacity: 0;
}

.intro .image {
    margin-top: 28px;
    overflow: hidden;
}

.intro .image img {
    display: block;
    margin: 0 auto;
    opacity: 0;
    transform: translateY(calc(100% + 4px));
}

.intro .image .line {
    position: relative;
    z-index: 1;
    width: 1000px;
    max-width: 100%;
    height: 4px;
    margin: 0 auto;
    background: #670000;
    transform: scaleX(0);
    transform-origin: center;
}

.intro .info {
    display: flex;
    justify-content: center;
    margin-top: 35px;
}

.intro .info .list {
    padding: 0 50px;
    font-size: 30px;
    font-weight: 700;
    line-height: 0.9;
    color: #670000;
    opacity: 0;
}

.intro .info .list + .list {
    border-left: 1px solid #670000;
}

.intro .info .list .small {
    font-size: 16px;
    font-weight: 400;
}

.intro .explain {
    margin-top: 40px;
    font-size: 20px;
    line-height: 1.7;
    letter-spacing: -0.02em;
    color: #3a363b;
    opacity: 0;
}

.intro .explain .point {
    font-weight: 700;
}

.intro .explain .point:last-child {
    display: block;
}

.intro .logo {
    margin-top: 50px;
   opacity: 0;
  
}

.intro .logo img {
    display: block;
    margin: 0 auto;
}

/* intro animation */
.intro.fp-completely .text .sub {
    animation: intro_up 1s cubic-bezier(.22, 1, .36, 1) both;
}

.intro.fp-completely .text .title {
    animation: intro_up 1s cubic-bezier(.22, 1, .36, 1) .2s both;
}

.intro.fp-completely .image .line {
    animation: intro_line .95s cubic-bezier(.65, 0, .35, 1) both;
}

.intro.fp-completely .image img {
    animation: intro_build 1s cubic-bezier(.22, 1, .36, 1) .5s both;
}

.intro.fp-completely .info .list {
    animation: intro_up 1s cubic-bezier(.22, 1, .36, 1) .5s both;
}

.intro.fp-completely .explain {
    animation: intro_up 1s cubic-bezier(.22, 1, .36, 1) .5s both;
}

.intro.fp-completely .logo {
    animation: intro_logo_in 1s cubic-bezier(.22, 1, .36, 1) .5s forwards;
}

@keyframes intro_logo_in {
    from { opacity: 0; transform: scale(.92); filter: blur(6px); }
    to   { opacity: 1; transform: scale(1); filter: blur(0); }
}

@keyframes intro_up {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes intro_line {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

@keyframes intro_build {
    from { opacity: 1; transform: translateY(calc(100% + 4px)); }
    to   { opacity: 1; transform: translateY(0); }
}

/* summary */
.summary {
	height:100vh;
}
.summary .content {
	display:flex;
	flex-direction: column;
	width:100%;
	height:100%;
}
.summary .image {
	position: relative;
	height: 100%;
	overflow: hidden;
}
.summary .image .bg {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	 background: url(../images/summary_bg.jpg?v=4) center bottom  / cover no-repeat;
	 transform: scale(1.15);
}
.summary .image .slogan {
	position: absolute;
	top:20%;
	left:50%;
	z-index:1;
	opacity: 0;
    transform: translate(-50%, 40px);
    filter: blur(6px);
}
.summary .text {
	padding: 50px 0;
	width:100%;
	background:#670000;
	color:#fff;
	text-align: center;
}
.summary .text .title{
	font-size:26px;
	font-weight: 500;
	margin-bottom:15px;
	opacity: 0;
}
.summary .text .info{
	font-size:18px;
	font-weight: 400;
}
.summary .text .info .con {
	line-height: 1.8;
	opacity: 0;
}
.summary .text .info .con span {
	margin: 0 8px;
}

.summary.fp-completely .image .bg {
    animation: summary_bg 2.4s cubic-bezier(.22, 1, .36, 1) both;
}

.summary.fp-completely .image .slogan {
    animation: summary_slogan 1.4s cubic-bezier(.22, 1, .36, 1) .5s both;
}

.summary.fp-completely .text .title {
    animation: summary_up 1s cubic-bezier(.22, 1, .36, 1) both;
}

.summary.fp-completely .text .info .con:nth-child(1) {
    animation: summary_up 1s cubic-bezier(.22, 1, .36, 1) .2s both;
}

.summary.fp-completely .text .info .con:nth-child(2) {
    animation: summary_up 1s cubic-bezier(.22, 1, .36, 1) .35s both;
}


/* summary animation */
@keyframes summary_bg {
    from { transform: scale(1.15); }
    to   { transform: scale(1); }
}

@keyframes summary_slogan {
    from { opacity: 0; transform: translate(-50%, 40px); filter: blur(6px); }
    to   { opacity: 1; transform: translate(-50%, 0); filter: blur(0); }
}

@keyframes summary_up {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* location */
.location {
    background: #fff;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fp-enabled #fullpage .section.location { padding-top: 60px; }  /* 헤더 높이만큼 */
.location .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.location .text .sub {
    font-size: 22px;
    font-weight: 500;
    line-height: 1.3;
    color: #670000;
    margin-bottom: 0;
}
.location .text .sub span { font-style: italic; }
.location .text .title {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.04em;
    color: #670000;
}
.location .text .explian {
    font-size: 17px;
    line-height: 1.5;
    letter-spacing: -1px;
    color: #3a363b;
    font-weight: 500;
}

/* 비교 슬라이더 */
.location .image {
    --pos: 50%;
    position: relative;
    width: min(1100px, 74vw, calc((100vh - 360px) * 2.03));
    aspect-ratio: 886 / 436;
    margin: 20px auto 32px;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
}
.location .image .img { position: absolute; inset: 0; }
.location .image .img img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
    -webkit-user-drag: none;
}
.location .image .img02 { z-index: 1; }
.location .image .img01 {
    z-index: 2;
    clip-path: inset(0 calc(100% - var(--pos)) 0 0);   
}
.location .image .handle {
    position: absolute;
    top: 0;
    left: var(--pos);
    z-index: 3;
    width: 60px;                 /* 터치/클릭 영역 */
    height: 100%;
    transform: translateX(-50%);
    cursor: ew-resize;
    touch-action: none;
    outline: none;
}
.location .image .handle .line {
    position: absolute;
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    background: #fff;
    transform: translateX(-50%);
}
.location .image .handle .knob {
    position: absolute;
    top: 50%;
    left: 50%;
	width:55px;
    transform: translate(-50%, -50%);
}
.location .image.is-dragging .handle { cursor: grabbing; }
.location .image.is-dragging .handle .knob { animation: none; }

/* location 진입 애니메이션 */
.location .text .sub,
.location .text .title,
.location .text .explian,
.location .image { opacity: 0; }
.location.fp-completely .text .sub     { animation: intro_up 1s cubic-bezier(.22,1,.36,1) both; }
.location.fp-completely .text .title   { animation: intro_up 1s cubic-bezier(.22,1,.36,1) .2s both; }
.location.fp-completely .image         { animation: intro_up 1s cubic-bezier(.22,1,.36,1) .4s both; }
.location.fp-completely .text .explian { animation: intro_up 1s cubic-bezier(.22,1,.36,1) .6s both; }


/* 모바일 시안 */
@media (max-width: 1080px) {
    .location { padding: 15% 0; }
    .location .text .sub { font-size: 4vw; margin-bottom: 1.5vw; }
    .location .text .title { font-size: 7vw; line-height: 1.1; }
    .location .text .explian { font-size: 3vw; word-break: keep-all; }
    .location .image {
        width: 87%;
        aspect-ratio: 565 / 440;
        margin: 7% auto;
    }
    .location .image .handle .knob { width: 38px; height: 38px; }
}



/* premium */
.premium[data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}
.premium {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
	background: #e9e4dd;
}
.premium_wrap {
    position: relative;
    width: 100%;
    height: 100%;
    background: #e9e4dd;
}
.premium_slider,
.premium_slider .slick-list,
.premium_slider .slick-track {
    height: 100%;
}
.premium_slider { position: relative; }


.premium_slide {
    height: 100vh;
    display: flex !important;
    align-items: center;
    gap: 20px;
    padding: 0 4.3vw 0 4.4vw;
    box-sizing: border-box;
    text-align: left;
	user-select: text;
    -webkit-user-select: text;
}

.premium_slide .text {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    height:60%;
    color: #670000;
    font-family: "Plus Jakarta Sans", sans-serif;
}
.premium_slide .text .point { font-weight: 100; }

.premium_slide .text .title {
    font-family: "Tenor Sans", sans-serif;
    font-size: 66px;
    font-style: italic;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin-bottom: 35px;
	opacity: 0;
    transform: translateY(40px);
      transition: opacity 1s ease, transform 1s ease;
}
/* .premium.fp-completely .premium_slide.slick-active .text .title {
    opacity: 1;
    transform: translateY(0);
} */

 .premium.fp-completely .premium_slide .text .title {
	opacity: 1;
    transform: translateY(0);
 }

.premium_slide .text .slogan {margin-bottom: 40px;}
.premium_slide .text .slogan .en,
.premium_slide .text .slogan .con {
    overflow: hidden;
}
.premium_slide .text .slogan .en { font-size: 24px; line-height: 135%; font-weight: 600; letter-spacing: 2px; }
.premium_slide .text .slogan .con { font-size: 36px; font-weight: 300; line-height: 135%; }
.premium_slide .text .slogan .con .point { font-weight: 600; }
.premium_slide .text .slogan .en .char { letter-spacing: 0px !important; }
.premium_slide .text .slogan .en .char,
.premium_slide .text .slogan .con .char {
    display: inline-block;
    opacity: 0;
    transform: translateY(30px);
}
.premium.fp-completely .premium_slide.slick-active .text .slogan .en .char {
    animation: pCharUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--char-index) * 0.035s + 0.15s);
}
.premium.fp-completely .premium_slide.slick-active .text .slogan .con .char {
    animation: pCharUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--char-index) * 0.035s + 0.45s);
}

.premium_slide .text .explain {
    margin-bottom: 42px;
    font-size: 20px;
    font-weight: 300;
    line-height: 140%;
    color: #4a4a4a;
    opacity: 0;
    transition: opacity 0.7s ease;
    transition-delay: 0.9s;
}
.premium.fp-completely .premium_slide.slick-active .text .explain {
    opacity: 1;
}

.premium_controls {
    position: static;
}
.premium_arrows {
    display: flex;
    gap: 12px;
    opacity: 0;
    transition: 0.8s ease;
}
.premium.fp-completely .premium_arrows {
    opacity: 1;
    transition-delay: 1s;
}
.premium_arrow {
    width: 38px;
    height: 38px;
    box-sizing: border-box;
    border-radius: 50%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s all;
    padding: 0;
}
.premium_arrow:hover { opacity: 0.8; }
.premium_arrow.prev {
        background-image: url(../images/premium_arrow_l.png?v=1);
}
.premium_arrow.next {
        background-image: url(../images/premium_arrow_r.png?v=1);
}

.premium_slide .text .sub_wrap {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    gap: 20px;
    z-index: 3;
}
.premium_slide .text .sub_wrap .image.sub {
    flex: 0 0 200px;
    width: 200px;
    height: 200px;
    overflow: hidden;
    opacity: 0;
    transition: opacity 1s ease;
}
.premium.fp-completely .premium_slide.slick-active .sub_wrap .image.sub {
    opacity: 1;
}
.premium_slide .sub_wrap .image.sub img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.premium_slide .image { flex: 1; overflow: hidden; }
.premium_slide .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.15);
    transition: transform 1.5s ease;
}
.premium.fp-completely .premium_slide.slick-active .image img {
    transform: scale(1.01);
}

.premium_slide .image_group {
    position: relative;
    flex: 0 0 60%;
    height: 60%;
}
.premium_slide .image_group .image.main {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.premium_slide .image_group .image.main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.15);
    transition: transform 1.5s ease;
}
.premium.fp-completely .premium_slide.slick-active .image_group .image.main img {
    transform: scale(1);
}

.premium_dots {
    position: absolute;
    right: calc(4.3vw + 31px);
    bottom: 22.75%;
    display: flex;
    gap: 12px;
    z-index: 5;
}
.premium_dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    border: none;
    cursor: pointer;
    transition: 0.3s all;
    padding: 0;
}
.premium_dot.--active {
    background: #f09494;
}

@keyframes pCharUp {
    to { opacity: 1; transform: translateY(0); }
}


/* brand */
.brand {
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
}
.brand .bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/brand_bg.jpg?v=1) center center / cover no-repeat fixed;
	transform: scale(1.1);
	transition: transform 2.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.brand .text {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.brand .text img {
	display: block;
	max-width: 100%;
	height: auto;
}

.brand .title {
	margin: 0 0 30px;
	font-size: 32px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: -2px;
	color: #670000;
	word-break: keep-all;
}
.brand .line {
	width: 1px;
	height: 60px;
	margin-bottom: 35px;
	background: #670000;
}
.brand .slogan {
	margin-bottom: 160px;
}

.brand .title,
.brand .slogan,
.brand .logo {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 1.2s ease, transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
.brand .line {
	opacity: 0;
	transform: scaleY(0);
	transform-origin: top center;
	transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.4s ease;
}

.brand.fp-completely .bg {
	transform: scale(1);
}
.brand.fp-completely .title,
.brand.fp-completely .slogan,
.brand.fp-completely .logo {
	opacity: 1;
	transform: translateY(0);
}
.brand.fp-completely .line {
	opacity: 1;
	transform: scaleY(1);
}
.brand.fp-completely .title  { transition-delay: 0.4s; }
.brand.fp-completely .line   { transition-delay: 0.5s; }
.brand.fp-completely .slogan { transition-delay: 0.8s; }
.brand.fp-completely .logo   { transition-delay: 1s; }

@media (prefers-reduced-motion: reduce) {
	.brand .bg,
	.brand .title,
	.brand .line,
	.brand .slogan,
	.brand .logo {
		transition: none;
		transform: none;
		opacity: 1;
	}
}





/* contact */
.contact[data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}
.contact {background: #e8e8e8;}
.contact .contact_wrap{
    display: flex;
    align-items: center;
	 height: 100%;
}
.contact .contact_wrap .image{
	width: 100%;
    height: 100%;
    background: url(../images/contact_img.jpg?v=1) center center / cover no-repeat;
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.9s ease, transform 0.9s ease;
	
}
.contact.fp-completely .contact_wrap .image {
    opacity: 1;
    transform: translateX(0);
}

.contact .contact_wrap .image img {width: 100%;}
.contact .right {
    width: 100%;
    text-align: left;
    padding: 5% 5% 10%;
    display: flex;
    flex-direction: column;
    flex: 0 0 45%;
}
.contact .right > .title{
	margin-bottom: 3.5%;
	opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
    transition-delay: 0.2s;
}
.contact.fp-completely .right > .title {
    opacity: 1;
    transform: translateY(0);
}

.contact .right .title .sub{
    font-size: 26px;
    color: #546964;
    margin-bottom: 10px;
    letter-spacing: 1px;
    font-weight: 500;
}
.contact .right .title .main {
	font-size: 64px;
    font-weight: 400;
    font-family: "Tenor Sans", sans-serif;
    position: relative;
    color: #670000;
}





.contact .right .info{}
.contact .right .info .title{
    font-size: 36px;
    font-weight: 600;
    color: #2f2f2f;
    margin-bottom: 10px;
	overflow: hidden;
}
.contact .right .info > .con{
    font-size: 20px;
    margin-bottom: 5%;
	overflow: hidden;
}
.contact .right .info > .title .char,
.contact .right .info > .con .char {
    display: inline-block;
    opacity: 0;
    transform: translateY(24px);
}
.contact.fp-completely .right .info > .title .char {
    animation: cCharUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--char-index) * 0.03s + 0.6s);
}
.contact.fp-completely .right .info > .con .char {
    animation: cCharUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--char-index) * 0.03s + 0.9s);
}

.contact .right .minmap {
	opacity: 0;
    transform: translateY(50px);
	transition: opacity 0.7s ease;
    margin-bottom: 5%;
}
.contact.fp-completely .right .minmap {
	opacity: 1;
    transform: translateY(0px);
	transition-delay: 0.5s;
}

.contact.is-keep .right .minmap {
	opacity: 1 !important;
    transform: translateY(0) !important;
}

.contact .right .info .btnWrap {
    display: flex;
    gap: 30px;
    align-items: center;
	opacity: 0;
    transition: opacity 0.7s ease;
    transition-delay: 1.3s;
}
.contact.fp-completely .right .info .btnWrap {
    opacity: 1;
}

.contact .right .info .btnWrap .btn {}
.contact .right .info .btnWrap .btn a {display: flex;align-items: center;gap: 8px;font-size: 20px;font-weight: 500;color: #333; transition: 0.5s all;}
.contact .right .info .btnWrap .btn a:hover {
	opacity:0.8;
}
.contact .right .info .btnWrap .btn.naver {}
.contact .right .info .btnWrap .btn.kakao {}


.contact.is-keep .contact_wrap .image,
.contact.is-keep .right > .title,
.contact.is-keep .right .info .btnWrap,
.fp-viewing-footer .contact .contact_wrap .image,
.fp-viewing-footer .contact .right > .title,
.fp-viewing-footer .contact .right .info .btnWrap {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}
.contact.is-keep .right .info > .title .char,
.contact.is-keep .right .info > .con .char,
.fp-viewing-footer .contact .right .info > .title .char,
.fp-viewing-footer .contact .right .info > .con .char {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
}

@keyframes cCharUp {
    to { opacity: 1; transform: translateY(0); }
}




/*response*/

@media(max-width:1080px){
	.loader{width:calc(100% - 30px);}
	.main_loader{
		width: 150px;
		height: 150px;
	}
	.header_m {
		opacity: 0;
		animation: fadeIn 1s 2s forwards;
	}
    .mainWrap{
        overflow: hidden;
    }
    .mainWrap img{
        width: 100%;
        max-width: max-content;
    }
   
    .mainVisual{
        min-height: 100vh;
        height: 100vh;
    }

	.mainVisual .text .title {
		font-size: 6vw;
		line-height: 125%;
	}
	.mainVisual .text .explain {
		font-size: 3vw;
	}

	.mainVisual .text .logo {
		width: 40%;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	
	/* intro */
	.intro {
		flex-direction: column; 
		gap: 60px;
		padding: 15% 5%;
	}
	.intro .logo {
		width: 98px;
		margin: 0 auto;
		margin-top: 50px;
	}
	.intro .logo img {
		max-width: none;
	}

	.intro .text .sub {
		font-size: 4vw;
	}
	.intro .text .title {
		font-size: 5vw;
	}
	
	.intro .info .list {
		padding: 0 20px;
		font-size: 4vw;
	}
	.intro .info .list .small {
		font-size: 2.8vw;
	}
	.intro .image .line {width:90%;}
	.intro .image img {width: 60%;}
	.intro .explain {
		font-size: 3vw;
	}


	.summary .image .slogan {
		width:60%;
	}
	.summary .text {margin-top:-1px;}
	.summary .text .title {
		font-size: 5vw;
		margin-bottom: 20px;
	}
	.summary .text .info .con {
		font-size: 3vw;
	}


	/* premium */
	.premium {
		padding: 15% 20px;
	}
	.premium_slide {
		flex-direction: column;
		padding:0;
		gap:30px;
		text-align: center;
	}

	.premium_slide .text {width:80%; flex: 0;}
	.premium_slide .text .sub_wrap .image.sub {display:none;}
	.premium_slide .text .title {
		font-size: 8vw;
		margin-bottom: 20px;
	}
	.premium_slide .text .slogan {
		margin-bottom: 20px;
	}
	.premium_slide .text .slogan .en {font-size:4vw}
	.premium_slide .text .slogan .con {font-size:6vw}
	.premium_slide .text .explain {
		font-size: 3vw;
		word-break: keep-all;
		margin-bottom:0;
	}
	.premium_arrows {
		display:none;
	}

	.premium_dot {
		width: 8px;
		height: 8px;
	}
	.premium_dots {
		right: 50%;
		transform: translateX(50%);
		bottom: 40px;
		gap: 8px;
	}

	.premium_slide .image_group {
		height:50%;
		flex: 0 0 50%;
	}

	.brand {height:90vh;}
	 .brand .slogan img {
        max-width: 100vw;
        width: 100%;
        margin: 0 auto;
    }

	.brand .title {
		margin-bottom: 30px;
		font-size: 5vw;
	}
	.brand .line {
		height: 40px;
		margin-bottom: 24px;
	}
	.brand .slogan {
		margin-bottom: 80px;
	}
	.brand .slogan img { max-width: 60vw; }
	.brand .logo img { max-width: 55vw; }

	

	/* contact */

	.contact .contact_wrap {
		 flex-direction: column-reverse;
		 height: auto; 
	}
	.contact .contact_wrap .image { height: 100vw; flex: none; }
	.contact .right {
		padding: 15% 5% 10%;
		flex: none;
	}
	.contact .right > .title {
		margin-bottom: 6.5%;
	}
	.contact .right .title .sub {font-size: 4.2vw;}
	.contact .right .title .main{font-size: 10vw; text-align: center;}
	.contact .right .info .title {font-size: 5vw;}
	.contact .right .info > .con {
		font-size: 4vw;
	}
	.contact .right .info .btnWrap .btn a {font-size: 3.4vw;}
	.contact .right .info .btnWrap .btn img {
		width: 22px;
	}

	.contact .right .info {text-align:center;}
	.contact.fp-completely .right .info .btnWrap {
		justify-content: center;
	}
	.contact .right .minmap,
	.contact.fp-completely .right .minmap {
		text-align: center;
	}


	#footer .right .call b{color:#fff;}
	


}

@media(max-width: 499px){
	.mainVisual .text .logo {width:50%;}
	.mainVisual .text .title {
        font-size: 7vw;
		margin-bottom: 10px;
    }
	.mainVisual .text .explain {
        font-size: 3.4vw;
    }

	.summary .text .title {
        font-size: 6vw;
    }

	 .summary .text .info .con {
        font-size: 4vw;
        font-weight: 300;
        line-height: 1.6;
    }


	.intro .logo {
		width: 96px;
	}

	.premium_slide .text {width:95%;}
	.premium_slide .text .slogan .en {font-size:4vw}
	.premium_slide .text .slogan .con {font-size:6vw}
	.premium_slide .text .explain {font-size:4vw;}

	.premium_dots {
		bottom: 50px;
	}

	.brand .slogan img {max-width: 80%;}


}


@media(max-width: 450px){
    .premium_slide .text .explain {
        font-size: 3.6vw;
    }
	.brand .slogan {
        margin-bottom: 80px;
    }
	.brand .slogan img {
        max-width: 42vw;
    }
}

