@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

:root {
    --filer-white : brightness(0) invert(1);
    /* --font-out : 'Outfit';
    --font-nun: "Nunito Sans", serif; */
    --font-pre : 'pretendard';
    --font-pop : "Poppins", serif;
    --color1 : #EF4C4D;
    --color-red : #FF0000;
}

/* 공통 */
p, dd{word-break:keep-all;}
.pc{display:block !important;}
.mob{display:none !important;}
.inner{max-width:1600px; margin:0 auto; width: 100%;}
body * {font-family: var(--font-pre);}

.ta-c {text-align: center;}
.ta-l{text-align: left;}
.flex {display: flex; align-items: center;}
.flex-jc {display: flex; align-items: center; justify-content: center;}
.flex-jb {display: flex; align-items: center; justify-content: space-between;}


/* HEADER */
.header{position:fixed; top:0; z-index:1500; width:100%;}
.header .inner{height:100%;}
.header h1 a .logo {width: 130px; display: block;}
.header .right {display: flex; align-items: center; gap: 100px;}
.header .gnb_wrap{height: 100%;}
.header .gnb{display:flex; gap:75px; height: 100%;}
.header .gnb > li{position:relative; height: 100%; display: flex; align-items: center;}
.header .gnb > li > a{font-size: 18px; font-weight: 500; line-height: 1.5; color: #fff; position: relative; padding: 36px 0; letter-spacing: -.5px;}
.header .mp_menu {gap: 20px;}
.header .mp_menu a {font-size: 16px; font-weight: 400; line-height: 1.6; color: #fff;}
.header .mp_menu a:first-child {gap: 10px;}
.header .mp_menu a img {width: 20px;}
.header .mp_menu .line {display: block; width: 1px; height: 15px; background: #fff; opacity: .5;}
.header.hd_member,
.header.fixed,
.header:hover {background: #fff;}
.header.hd_member a,
.header.fixed a,
.header:hover a {color: #000 !important;}
.header.hd_member img,
.header.fixed img,
.header:hover img {filter: invert(1);}
.header.hd_member .mp_menu .line,
.header.fixed .mp_menu .line,
.header:hover .mp_menu .line {background: #000; opacity: .5;}

/* quick btn */
.quick {position: fixed; right: 50px; bottom: 50px; z-index: 100; gap: 20px;}
.quick .moveBtn {display: flex; align-items: center; justify-content: center; color: #fff; position: relative; border-radius: 100px; width: 280px; height: 65px; background: linear-gradient(91.75deg, #FF4243 26.58%, #FF804C 69.75%, #FFE55C 115.79%); overflow: hidden; font-size: 20px; font-weight: 700; letter-spacing: -.5px;}
.quick .moveBtn::before {content: ""; width: 126px; height: 65px; background: url('/img/main/quick_bg.png') no-repeat center/contain; position: absolute; top: 6px; right: 12px;}
.quick .top_btn{display: flex; align-items: center; justify-content: center; background: #fff; width: 65px; height: 65px; border-radius: 100%; box-shadow: 0px 8px 24px 0px #959DA533;}
.quick .top_btn img {width: 20px;}

/* footer */
.footer{background: #111; padding: 79px 0 100px; margin-top: 150px;}
.footer .ft_top {display: flex; align-items: flex-end; justify-content: space-between;}
.footer .logo {width: 149px;}
.footer .use {gap: 30px;}
.footer .use a {font-size: 18px; font-weight: 500; color: #fff; line-height: 1.5;}
.footer .use a strong {font-weight: 700;}
.footer .ft_bot {margin-top: 48px;}
.footer .ft_lr p {display: flex; align-items: center; gap: 5px 20px; font-size: 16px; font-weight: 400; color: #BEBEBE; line-height: 1.6;}
.footer .ft_lr strong {font-weight: 600; color: #fff; display: block;}
.footer .copy {margin-top: 14px; font-size: 16px; font-weight: 400; line-height: 1.6; color: #fff;}


/********* main *********/
/* common */
#main .sec_tit p {font-size: 25px; font-weight: 500; color: #fff; letter-spacing: -1px; line-height: 1.4; font-family: var(--font-pop);}
#main .sec_tit h2 {margin-top: 20px; font-size: 60px; font-weight: 700; color: #fff; letter-spacing: -1px; line-height: 1;}

/* visual */
#main .visual .swiper-wrapper {position: relative;}
#main .visual .swiper-slide {height: 950px; position: relative;}
#main .visual .swiper-slide a {display: block; width: 100%; height: 100%;}
#main .visual .swiper-slide .bg img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .visual .txtwrap {position: absolute; top: 305px; left: 50%; transform: translateX(-50%); text-align: center; color: #fff;}
#main .visual .txtwrap .tit {font-size: 28px; font-weight: 500; letter-spacing: -1px; line-height: 1.25; font-family: var(--font-pop);}
#main .visual .txtwrap .desc {margin-top: 35px; font-size: 70px; font-weight: 700; line-height: 1.2; letter-spacing: -1px;}
#main .visual .bot {position: absolute; left: 50%; transform: translateX(-50%); bottom: 117px; width: 100%; display: flex; align-items: center; justify-content: center; gap: 0 10px; z-index: 10;}
#main .visual .swiper-pagination {position: relative; margin: 0; top: auto; right: auto; bottom: auto; left: auto; width: auto; display: flex; align-items: center; gap: 0 10px;}
#main .visual .swiper-pagination-bullet {width: 100px; height: 4px; border-radius: 0; position: relative; overflow: hidden; margin: 0 !important; opacity: 1; background: rgba(255, 255, 255, .3);}
#main .visual .swiper-pagination-bullet::before {content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: opacity 0.3s;}
#main .visual .swiper-pagination-bullet-active {background: rgba(255, 255, 255, .3);}
#main .visual .swiper-pagination-bullet-active::before {background-color: #fff; animation: slide-progress 4.1s cubic-bezier(0.3, 0, 0.3, 1) forwards;}
#main .visual .swiper-pagination.paused-animation .swiper-pagination-bullet-active::before {animation-play-state: paused;}
#main .visual .pause img {width: 20px; cursor: pointer;}
@keyframes slide-progress {
    0% {  
        transform: translateX(-100%); 
    } 
    100% {  
        transform: translateX(0); 
    }
}

/* sec1 */
#main #sec1_wrap {overflow:hidden; display:flex; flex-wrap:nowrap; width: 400%; background: #fff;}
#main #sec1_wrap .horizontal_wrap {display: flex; width: 300%;}
#main #sec1_wrap .hor_items {position: relative; width:100%; height: 100vh; text-align: center; overflow: hidden;}
#main #sec1_wrap .hor_items::before {content: 'TO THE MOON TO THE MOON'; white-space: nowrap; font-size: 170px; font-weight: 800; font-family: var(--font-pop); letter-spacing: -1px; line-height: .9; opacity: .03; position: absolute; left: 0; bottom: 0; z-index: 1;}
#main #sec1_wrap .hor_items .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; padding-bottom: 50px;}
#main #sec1_wrap .hor_items p {font-size: 30px; font-weight: 400; letter-spacing: -1px; line-height: 1.5;}
#main #sec1_wrap .hor_items h2 {margin-top: 50px; font-size: 70px; font-weight: 800; letter-spacing: -1px; line-height: 1.2;}
#main #sec1_wrap .hor_items h2 span {color: var(--color1);}
#main #sec1_wrap .hor_items.last {position: relative;}
#main #sec1_wrap .hor_items.last .txt {z-index: 1;}
#main #sec1_wrap .hor_items.last .txt.white {clip-path:inset(100% 0 0 0);}
#main #sec1_wrap .hor_items.last .txt.white * {color: #fff;}
#main #sec1_wrap .hor_items.last .bg {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; clip-path: inset(100% 0 0 0); background-color: #000; z-index: 0;}
#main #sec1_wrap .hor_items.last .bg_txt {white-space: nowrap; font-size: 170px; font-weight: 800; font-family: var(--font-pop); letter-spacing: -1px; line-height: .9; opacity: .03; position: absolute; left: 0; bottom: 0; z-index: 1; height: 100%; display: flex; align-items: flex-end; justify-content: flex-start;}
#main #sec1_wrap .hor_items.last .bg_txt.white {clip-path:inset(100% 0 0 0); color: #fff;}

/* sec2 */
#main .sec2 .tit_cont {position: relative; background: url('/img/main/sec2_bg.jpg') no-repeat center/cover; width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; gap: 20px;}
#main .sec2 .tit_cont p {font-size: 25px; font-weight: 500; letter-spacing: -1px; line-height: 1.4; font-family: var(--font-pop); color: #fff;}
#main .sec2 .tit_cont h3 {font-size: 60px; font-weight: 700; color: #fff; letter-spacing: -1px; line-height: 1;}

/* sec3 */
#main .sec2 .cont {background: #111; margin-top: -27px; position: relative; z-index: 2; padding-bottom: 150px;}
#main .sec2 .item {display: flex; align-items: center; overflow: hidden; border-radius: 30px; background: #fff; box-shadow: 0px 4px 24px 0px #0000000D;}
#main .sec2 .item + .item {margin-top: 67px;}
#main .sec2 .item:nth-of-type(odd) .img img {margin-left: 1px;}
#main .sec2 .item .img {width: 1000px;}
#main .sec2 .item .img img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .sec2 .item .txt {width: calc(100% - 1000px); padding: 0 98px;}
#main .sec2 .item .txt .ic img {width: 70px;}
#main .sec2 .item .txt h3 {margin-top: 44px; font-size: 40px; font-weight: 600; letter-spacing: -1px; line-height: 1.25;}
#main .sec2 .item .txt strong {display: block; margin-top: 5px; font-size: 55px; font-weight: 700; letter-spacing: -1px; line-height: 1.18;}
#main .sec2 .item .txt p {margin-top: 30px; font-size: 22px; font-weight: 400; letter-spacing: -0.5px; line-height: 1.5;}

/* sec4 */
#main .sec4 {display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; height: 100vh; position: relative; gap: 54px;}
#main .sec4::before {content: 'TO THE MOON TO THE MOON'; white-space: nowrap; font-size: 170px; font-weight: 800; font-family: var(--font-pop); letter-spacing: -1px; line-height: .9; opacity: .03; position: absolute; left: -47px; bottom: 0;}
#main .sec4 h2 {font-size: 65px; font-weight: 400; letter-spacing: -1px; line-height: 1.2; position: relative; padding-right: 14px;}
#main .sec4 h2 .char {display: none; opacity: 0;}
#main .sec4 h2 strong {font-weight: 800;}
#main .sec4 h2 strong:nth-of-type(2) {color: #636363;}

#main .sec4 h2 .char-line {display: block; position: absolute; top: 0; right: 0; width: 3px; height: 100%;}
#main .sec4 h2 .char-line:before { content: ''; display: block; width: 100%; height: 100%; background: #999; animation-name: charLine; animation-duration: 1s; animation-direction: alternate; animation-iteration-count: infinite }
@keyframes charLine {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

#main .sec4 .btn {/* opacity: 0; */ transform: translate(0, 60px); transition: all .5s; height: auto;}
#main .sec4 a {display: flex; align-items: center; justify-content: center; width: 298px; height: 79px; border-radius: 100px; border: 2px solid var(--color1); color: var(--color1); font-size: 24px; font-weight: 600; letter-spacing: -1px; transition: all .3s;}
#main .sec4 a:hover {color: #fff; background: var(--color1);}

/* sec5 */
#main .sec5 {background: #000; padding-bottom: 264px;}
#main .sec5 .sec_tit {height: 850px; display: flex; align-items: center; justify-content: center; flex-direction: column; background: url('/img/main/sec5_bg.jpg') no-repeat center/cover;}
#main .sec5 ul {display: flex; align-items: flex-start; flex-wrap: wrap; gap: 100px 40px;}
#main .sec5 ul li {width: calc(50% - 20px);}
#main .sec5 ul li .img {height: 350px; overflow: hidden;}
#main .sec5 ul li .img img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .sec5 ul li .info {margin-top: 30px; color: #fff;}
#main .sec5 ul li .info strong {display: block; font-size: 27px; font-weight: 600; letter-spacing: -1px; line-height: 1.18;}
#main .sec5 ul li .info p {margin-top: 15px; font-size: 22px; font-weight: 400; letter-spacing: -1px; line-height: 1.18; opacity: .8;}

/* sec6 */
#main .sec6 {background: #F6F6F6; padding: 175px 0 150px;}
#main .sec6 .sec_tit {text-align: left;}
#main .sec6 .sec_tit * {color: #000;}
#main .sec6 .sec_tit span {display: block; margin-top: 40px; font-size: 20px; font-weight: 400; letter-spacing: -.8px;}
#main .sec6 .img {margin-top: 70px; overflow: hidden; border-radius: 18.18px;}
#main .sec6 .img img {width: 100%; height: 100%; object-fit: cover; object-position: center;}








@media screen and (max-width:1640px){

    /* 공통 */
    .inner{max-width: 95.12vw;}

    /* HEADER */
    .header h1 a .logo {width: 7.93vw;}
    .header .right {gap: 6.10vw;}
    .header .gnb{ gap:4.57vw;}
    .header .gnb > li > a{font-size: 1.10vw; padding: 2.20vw 0; letter-spacing: -0.03vw;}
    .header .mp_menu {gap: 1.22vw;}
    .header .mp_menu a {font-size: 0.98vw;}
    .header .mp_menu a:first-child {gap: 0.61vw;}
    .header .mp_menu a img {width: 1.22vw;}
    .header .mp_menu .line {width: 0.06vw; height: 0.91vw;}
    
    /* quick btn */
    .quick {right: 3.05vw; bottom: 3.05vw; gap: 1.22vw;}
    .quick .moveBtn {border-radius: 6.10vw; width: 17.07vw; height: 3.96vw; font-size: 1.22vw; letter-spacing: -0.03vw;}
    .quick .moveBtn::before {width: 7.68vw; height: 3.96vw; top: 0.37vw; right: 0.73vw;}
    .quick .top_btn{ width: 3.96vw; height: 3.96vw; border-radius: 100%; box-shadow: 0.00vw 0.49vw 1.46vw 0.00vw #959DA533;}
    .quick .top_btn img {width: 1.22vw;}
    
    /* footer */
    .footer{ padding: 4.82vw 0 6.10vw; margin-top: 9.15vw;}
    .footer .logo {width: 9.09vw;}
    .footer .use {gap: 1.83vw;}
    .footer .use a {font-size: 1.10vw;}
    .footer .ft_bot {margin-top: 2.93vw;}
    .footer .ft_lr p {gap: 0.30vw 1.22vw; font-size: 0.98vw;}
    .footer .copy {margin-top: 0.85vw; font-size: 0.98vw;}
    
    
    /********* main *********/
    /* common */
    #main .sec_tit p {font-size: 1.52vw; letter-spacing: -0.06vw;}
    #main .sec_tit h2 {margin-top: 1.22vw; font-size: 3.66vw; letter-spacing: -0.06vw;}
    
    /* visual */
    #main .visual .swiper-slide {height: 57.93vw;}
    #main .visual .txtwrap {top: 18.60vw;}
    #main .visual .txtwrap .tit {font-size: 1.71vw; letter-spacing: -0.06vw;}
    #main .visual .txtwrap .desc {margin-top: 2.13vw; font-size: 4.27vw; letter-spacing: -0.06vw;}
    #main .visual .bot {bottom: 7.13vw; gap: 0 0.61vw;}
    #main .visual .swiper-pagination {gap: 0 0.61vw;}
    #main .visual .swiper-pagination-bullet {width: 6.10vw; height: 0.24vw;}
    #main .visual .pause img {width: 1.22vw;}
    
    /* sec1 */
    #main #sec1_wrap .hor_items::before {font-size: 10.37vw; letter-spacing: -0.06vw;}
    #main #sec1_wrap .hor_items .txt {padding-bottom: 3.05vw;}
    #main #sec1_wrap .hor_items p {font-size: 1.83vw; letter-spacing: -0.06vw;}
    #main #sec1_wrap .hor_items h2 {margin-top: 3.05vw; font-size: 4.27vw; letter-spacing: -0.06vw;}
    #main #sec1_wrap .hor_items.last .bg_txt {font-size: 10.37vw; letter-spacing: -0.06vw; }
    
    /* sec2 */
    #main .sec2 .tit_cont {gap: 1.22vw;}
    #main .sec2 .tit_cont p {font-size: 1.52vw; letter-spacing: -0.06vw;}
    #main .sec2 .tit_cont h3 {font-size: 3.66vw; letter-spacing: -0.06vw;}
    
    /* sec3 */
    #main .sec2 .cont {margin-top: -1.65vw; padding-bottom: 9.15vw;}
    #main .sec2 .item {border-radius: 1.83vw;}
    #main .sec2 .item + .item {margin-top: 4.09vw;}
    #main .sec2 .item:nth-of-type(odd) .img img {margin-left: 0.06vw;}
    #main .sec2 .item .img {width: 60.98vw;}
    #main .sec2 .item .img img {}
    #main .sec2 .item .txt {width: calc(100% - 60.98vw); padding: 0 5.98vw;}
    #main .sec2 .item .txt .ic img {width: 4.27vw;}
    #main .sec2 .item .txt h3 {margin-top: 2.68vw; font-size: 2.44vw; letter-spacing: -0.06vw;}
    #main .sec2 .item .txt strong {margin-top: 0.30vw; font-size: 3.35vw; letter-spacing: -0.06vw;}
    #main .sec2 .item .txt p {margin-top: 1.83vw; font-size: 1.34vw; letter-spacing: -0.03vw;}
    
    /* sec4 */
    #main .sec4 {height: 100vh; gap: 3.29vw;}
    #main .sec4::before {font-size: 10.37vw; letter-spacing: -0.06vw; left: -2.87vw;}
    #main .sec4 h2 {font-size: 3.96vw; letter-spacing: -0.06vw; padding-right: 0.85vw;}
    
    #main .sec4 h2 .char-line {width: 0.18vw;}
    
    
    #main .sec4 .btn {transform: translate(0, 3.66vw);}
    #main .sec4 a {width: 18.17vw; height: 4.82vw; border-radius: 6.10vw; color: var(--color1); font-size: 1.46vw; letter-spacing: -0.06vw;}
    
    /* sec5 */
    #main .sec5 {padding-bottom: 16.10vw;}
    #main .sec5 .sec_tit {height: 51.83vw;}
    #main .sec5 ul {gap: 6.10vw 2.44vw;}
    #main .sec5 ul li {width: calc(50% - 1.22vw);}
    #main .sec5 ul li .img {height: 21.34vw;}
    #main .sec5 ul li .info {margin-top: 1.83vw;}
    #main .sec5 ul li .info strong {font-size: 1.65vw; letter-spacing: -0.06vw;}
    #main .sec5 ul li .info p {margin-top: 0.91vw; font-size: 1.34vw; letter-spacing: -0.06vw; opacity: .8;}
    
    /* sec6 */
    #main .sec6 {padding: 10.67vw 0 9.15vw;}
    #main .sec6 .sec_tit span {margin-top: 2.44vw; font-size: 1.22vw; letter-spacing: -0.05vw;}
    #main .sec6 .img {margin-top: 4.27vw; border-radius: 1.11vw;}

}



@media screen and (max-width:1280px){

    /* 공통 */
    .inner{max-width: 93.75vw;}
    
    /* HEADER */
    .header h1 a .logo {width: 7.97vw;}
    .header .right {gap: 6.09vw;}
    .header .gnb{ gap:4.53vw;}
    .header .gnb > li > a{font-size: 1.09vw; padding: 2.19vw 0; letter-spacing: -0.00vw;}
    .header .mp_menu {gap: 1.25vw;}
    .header .mp_menu a {font-size: 1.02vw;}
    .header .mp_menu a:first-child {gap: 0.63vw;}
    .header .mp_menu a img {width: 1.25vw;}
    .header .mp_menu .line {width: 0.08vw; height: 0.94vw;}
    
    /* quick btn */
    .quick {right: 3.05vw; bottom: 3.05vw; gap: 1.25vw;}
    .quick .moveBtn {border-radius: 6.09vw; width: 17.03vw; height: 3.98vw; font-size: 1.25vw; letter-spacing: -0.00vw;}
    .quick .moveBtn::before {width: 7.66vw; height: 3.98vw; top: 0.39vw; right: 0.70vw;}
    .quick .top_btn{ width: 3.98vw; height: 3.98vw; border-radius: 100%; box-shadow: 0.00vw 0.47vw 1.48vw 0.00vw #959DA533;}
    .quick .top_btn img {width: 1.25vw;}
    
    /* footer */
    .footer{ padding: 4.84vw 0 6.09vw; margin-top: 9.14vw;}
    .footer .logo {width: 9.06vw;}
    .footer .use {gap: 1.80vw;}
    .footer .use a {font-size: 1.09vw;}
    .footer .ft_bot {margin-top: 2.97vw;}
    .footer .ft_lr p {gap: 0.31vw 1.25vw; font-size: 1.02vw;}
    .footer .copy {margin-top: 0.86vw; font-size: 1.02vw;}
    
    
    /********* main *********/
    /* common */
    #main .sec_tit p {font-size: 1.48vw; letter-spacing: -0.08vw;}
    #main .sec_tit h2 {margin-top: 1.25vw; font-size: 3.67vw; letter-spacing: -0.08vw;}
    
    /* visual */
    #main .visual .swiper-slide {height: 57.97vw;}
    #main .visual .txtwrap {top: 18.59vw;}
    #main .visual .txtwrap .tit {font-size: 1.72vw; letter-spacing: -0.08vw;}
    #main .visual .txtwrap .desc {margin-top: 2.11vw; font-size: 4.30vw; letter-spacing: -0.08vw;}
    #main .visual .bot {bottom: 7.11vw; gap: 0 0.63vw;}
    #main .visual .swiper-pagination {gap: 0 0.63vw;}
    #main .visual .swiper-pagination-bullet {width: 6.09vw; height: 0.23vw;}
    #main .visual .pause img {width: 1.25vw;}
    
    /* sec1 */
    #main #sec1_wrap .hor_items::before {font-size: 10.39vw; letter-spacing: -0.08vw;}
    #main #sec1_wrap .hor_items .txt {padding-bottom: 3.05vw;}
    #main #sec1_wrap .hor_items p {font-size: 1.80vw; letter-spacing: -0.08vw;}
    #main #sec1_wrap .hor_items h2 {margin-top: 3.05vw; font-size: 4.30vw; letter-spacing: -0.08vw;}
    #main #sec1_wrap .hor_items.last .bg_txt {font-size: 10.39vw; letter-spacing: -0.08vw; }
    
    /* sec2 */
    #main .sec2 .tit_cont {gap: 1.25vw;}
    #main .sec2 .tit_cont p {font-size: 1.48vw; letter-spacing: -0.08vw;}
    #main .sec2 .tit_cont h3 {font-size: 3.67vw; letter-spacing: -0.08vw;}
    
    /* sec3 */
    #main .sec2 .cont {margin-top: -1.64vw; padding-bottom: 9.14vw;}
    #main .sec2 .item {border-radius: 1.80vw; box-shadow: 0.00vw 0.23vw 1.41vw 0.00vw #0000000D;}
    #main .sec2 .item + .item {margin-top: 4.06vw;}
    #main .sec2 .item:nth-of-type(odd) .img img {margin-left: 0.08vw;}
    #main .sec2 .item .img {width: 61.02vw;}
    #main .sec2 .item .img img {}
    #main .sec2 .item .txt {width: calc(100% - 61.02vw); padding: 0 6.02vw;}
    #main .sec2 .item .txt .ic img {width: 4.30vw;}
    #main .sec2 .item .txt h3 {margin-top: 2.66vw; font-size: 2.42vw; letter-spacing: -0.08vw;}
    #main .sec2 .item .txt strong {margin-top: 0.31vw; font-size: 3.36vw; letter-spacing: -0.08vw;}
    #main .sec2 .item .txt p {margin-top: 1.80vw; font-size: 1.33vw; letter-spacing: -0.00vw;}
    
    /* sec4 */
    #main .sec4 {height: 100vh; gap: 3.28vw;}
    #main .sec4::before {font-size: 10.39vw; letter-spacing: -0.08vw; left: -2.89vw;}
    #main .sec4 h2 {font-size: 3.98vw; letter-spacing: -0.08vw; padding-right: 0.86vw;}
    
    #main .sec4 h2 .char-line {width: 0.16vw;}
    
    
    #main .sec4 .btn {transform: translate(0, 3.67vw);}
    #main .sec4 a {width: 18.20vw; height: 4.84vw; border-radius: 6.09vw; color: var(--color1); font-size: 1.48vw; letter-spacing: -0.08vw;}
    
    /* sec5 */
    #main .sec5 {padding-bottom: 16.09vw;}
    #main .sec5 .sec_tit {height: 51.80vw;}
    #main .sec5 ul {gap: 6.09vw 2.42vw;}
    #main .sec5 ul li {width: calc(50% - 1.25vw);}
    #main .sec5 ul li .img {height: 21.33vw;}
    #main .sec5 ul li .info {margin-top: 1.80vw;}
    #main .sec5 ul li .info strong {font-size: 1.64vw; letter-spacing: -0.08vw;}
    #main .sec5 ul li .info p {margin-top: 0.94vw; font-size: 1.33vw; letter-spacing: -0.08vw; opacity: .8;}
    
    /* sec6 */
    #main .sec6 {padding: 10.70vw 0 9.14vw;}
    #main .sec6 .sec_tit span {margin-top: 2.42vw; font-size: 1.25vw; letter-spacing: -0.08vw;}
    #main .sec6 .img {margin-top: 4.30vw; border-radius: 1.09vw;}

}



@media screen and (max-width:768px){

	/* 공통 */
	.pc{display: none !important;}
	.mob{display: block !important;}
    .inner{max-width: 100%; padding-left: 5.21vw; padding-right: 5.21vw;}

    /* sideMenu */
    .head_bg {display: none !important; position: fixed; right: 0; top: 0; z-index: 10000; width: 100%; height: 100vh; text-align: right;}
	.head_bg.on{display: block !important;}
    .head_bg .head_bg_inner {position: relative; background: #fff; padding: 16.41vw 5.60vw; width: 100%; height: 100%; display: inline-block; text-align: left;}
    .head_bg .head_bg_close {position: absolute; top: 6.64vw; right: 5.86vw;}
    .head_bg .head_bg_close img {width: 4.17vw;}
	.head_bg .head_bg_logo a{display: block;}
    .head_bg .head_bg_logo img {width:41.67vw;}
    .head_bg .member {margin-top: 10.42vw; gap: 0 4vw; display: flex; align-items: center;}
    .head_bg .member a {position: relative; font-size: 3.65vw;}
    .head_bg .member .line {width: 0.26vw; height: 2.60vw; background: #000; opacity: .5;}
    .head_bg .member a img {filter: invert(1);}
    .head_bg .member .login {gap: 0 1.82vw; display: flex; align-items: center;}
    .head_bg .member .login img {width: 4.95vw;}
    .head_bg .accordion_wrap {margin-top: 10.42vw; max-height: 62%; overflow-y: auto; padding-right: 1.95vw; margin-right: -1.95vw;}
    .head_bg .accordion_wrap li + li {margin-top: 8.33vw;}
    .head_bg .accordion_wrap a {display: block; font-size: 8.33vw; font-weight: 600; color: #000; opacity: .5; line-height: 1.18;}
    .head_bg .accordion_wrap li.on a,
    .head_bg .accordion_wrap a:hover {opacity: 1;}
    
    /* HEADER */
    .header {height: 15.63vw;}
    .header h1 a .logo {width: 20.60vw;}
    .header .gnb,
    .header .mp_menu {display: none;}
    .header .allMenuBtn img {width: 8.33vw;}
    
    /* quick btn */
    .quick {right: 3.26vw; bottom: 4.56vw; gap: 3.26vw;}
    .quick .moveBtn {border-radius: 16.03vw; width: 44.87vw; height: 10.42vw; font-size: 3.21vw; letter-spacing: -0.08vw;}
    .quick .moveBtn::before {width: 20.15vw; height: 10.42vw; top: 1.04vw; right: 1.82vw;}
    .quick .top_btn{ width: 10.42vw; height: 10.42vw; border-radius: 100%; box-shadow: 0.00vw 1.28vw 3.85vw 0.00vw #959DA533;}
    .quick .top_btn img {width: 3.33vw;}
    
    /* footer */
    .footer{ padding: 15.63vw 0; margin-top: 20.83vw;}
    .footer .ft_top {flex-direction: column; align-items: flex-start; gap: 13.02vw;}
    .footer .logo {width: 30.89vw;}
    .footer .use {gap: 5.21vw;}
    .footer .use a {font-size: 3.65vw;}
    .footer .ft_bot {margin-top: 7.16vw;}
    .footer .ft_lr p {gap: 0.65vw 3.91vw; font-size: 3.65vw; flex-wrap: wrap;}
    .footer .copy {margin-top: 7.94vw; font-size: 3.65vw;}
    
    
    /********* main *********/
    /* common */
    #main .sec_tit p {font-size: 3.65vw; letter-spacing: -0.26vw;}
    #main .sec_tit h2 {margin-top: 5.21vw; font-size: 7.29vw; letter-spacing: -0.26vw;}
    
    /* visual */
    #main .visual {position: relative;}
    #main .visual .swiper-slide {height: 169.27vw;}
    #main .visual .txtwrap {top: 48.18vw;}
    #main .visual .txtwrap .tit {font-size: 3.65vw; letter-spacing: -0.26vw;}
    #main .visual .txtwrap .desc {margin-top: 5.21vw; font-size: 9.38vw; letter-spacing: -0.26vw; line-height: 1.16;}
    #main .visual .bot {bottom: 25.00vw; gap: 0 1.82vw;}
    #main .visual .swiper-pagination {gap: 0 1.82vw;}
    #main .visual .swiper-pagination-bullet {width: 16.93vw; height: 0.69vw;}
    #main .visual .pause img {width: 3.47vw;}
    
    
    /* sec1 */
    #main #sec1_wrap .hor_items::before {font-size: 14.84vw; letter-spacing: -0.26vw;}
    #main #sec1_wrap .hor_items .txt {padding-bottom: 8.72vw;}
    #main #sec1_wrap .hor_items p {font-size: 4.17vw; letter-spacing: -0.26vw; line-height: 1.25;}
    #main #sec1_wrap .hor_items h2 {margin-top: 10.42vw; font-size: 8.33vw; letter-spacing: -0.26vw; line-height: 1.3;}
    #main #sec1_wrap .hor_items.last .bg_txt {font-size: 14.84vw; letter-spacing: -0.26vw; }
    #main #sec1_wrap .hor_items01 .txt {transform: translate(-50%,-40%); transition: all 1s; opacity: 0; transition-timing-function:ease;}
    #main #sec1_wrap.active .txt {opacity: 1; transform: translate(-50%,-50%);}
    
    /* sec2 */
    #main .sec2 {background: url('/img/main/m_sec2_bg.jpg') no-repeat center/cover; margin-top: -1px; position: relative; z-index: -1;}
    #main .sec2 .tit_cont {gap: 2.60vw; height: auto; padding: 31.25vw 0; background: none;}
    #main .sec2 .tit_cont p {font-size: 3.65vw; letter-spacing: -0.26vw;}
    #main .sec2 .tit_cont h3 {font-size: 7.29vw; letter-spacing: -0.26vw;}
    
    /* sec3 */
    #main .sec2 .inner {box-sizing: border-box;}
    #main .sec2 .cont {margin-top: 0; padding-bottom: 20.83vw; background: none;}
    #main .sec2 .item {border-radius: 7.81vw; box-shadow: 0.00vw 1.04vw 6.25vw 0.00vw #0000000D; display: block; background: transparent; width: 100%; box-sizing: border-box;}
    #main .sec2 .item + .item {margin-top: 7.81vw;}
    #main .sec2 .item:nth-of-type(odd) .img img {margin-left: -0.13vw;}
    #main .sec2 .item:nth-of-type(2) {flex-direction: column-reverse; display: flex;}
    #main .sec2 .item .img {width: calc(100% + 2px); height: 53.75vw;}
    #main .sec2 .item .txt {width: 100%; padding: 10.42vw 7.81vw 13.02vw; display: flex; align-items: flex-start; gap: 5.73vw; background: #fff;}
    #main .sec2 .item .txt .ic img {width: 10.42vw;}
    #main .sec2 .item .txt h3 {margin-top: 0; font-size: 4.17vw; letter-spacing: -0.26vw; line-height: 1.2;}
    #main .sec2 .item .txt strong {margin-top: 1.30vw; font-size: 5.21vw; letter-spacing: -0.26vw; line-height: 1.2;}
    #main .sec2 .item .txt p {margin-top: 5.21vw; font-size: 3.65vw; letter-spacing: -0.13vw; line-height: 1.2;}
    
    /* sec4 */
    #main .sec4 {height: 100vh; gap: 9.11vw;}
    #main .sec4::before {font-size: 14.84vw; letter-spacing: -0.26vw; left: 0;}
    #main .sec4 h2 {font-size: 8.33vw; letter-spacing: -0.26vw; padding-right: 2.60vw;}
    #main .sec4 h2 .char-line {width: 0.78vw;}
    #main .sec4 .btn {transform: translate(0, 10.55vw);}
    #main .sec4 a {width: 53.13vw; height: 13.28vw; border-radius: 26.04vw; color: var(--color1); font-size: 4.17vw; letter-spacing: -0.26vw;}
    
    /* sec5 */
    #main .sec5 {padding-bottom: 20.83vw;}
    #main .sec5 .sec_tit {height: auto; padding: 31.25vw 0 32.29vw;}
    #main .sec5 ul {gap: 17.45vw 6.90vw;}
    #main .sec5 ul li {width: 100%;}
    #main .sec5 ul li .img {height: 52.08vw;}
    #main .sec5 ul li .info {margin-top: 7.81vw;}
    #main .sec5 ul li .info strong {font-size: 4.69vw; letter-spacing: -0.26vw;}
    #main .sec5 ul li .info p {margin-top: 2.60vw; font-size: 3.65vw; letter-spacing: -0.10vw; opacity: .8;}
    
    /* sec6 */
    #main .sec6 {padding: 20.83vw 0;}
    #main .sec6 .sec_tit span {margin-top: 2.60vw; font-size: 3.65vw; letter-spacing: -0.21vw;}
    #main .sec6 .img {margin-top: 10.42vw; border-radius: 4.73vw; height: 104.17vw;}

}