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

:root {
    --color2 : #4F4037;
    --color3 : #825A49;
    --filter-white : brightness(0) invert(1);
    --font-ral : 'Raleway', sans-serif;
    --font-out : 'Outfit', sans-serif;
    --font-nun : 'Nunito Sans', sans-serif;
    --font-euly : 'Eulyoo1945', sans-serif;
}

/* intro */
#intro {height: 100vh; display: flex; background: url('/img/main/intro_img.jpg') no-repeat center/cover;}
#intro > div {width: 50%;}
#intro .left {background: #825A49; position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 40px; opacity: 98%;}
#intro .left::before {content: ""; width: 483px; height: 519px; background: url('/img/main/logo_bg.svg') no-repeat center/cover; position: absolute; top: 50%; transform: translateY(-50%); left: 0;}
#intro .left img {width: 153px;}
#intro .left .line {display: block; width: 1px; height: 30px; background: #fff;}
#intro .left p {font-size: 24px; font-weight: 400; color: #fff;}
#intro .right {position: relative;}
#intro .right a {display: flex; align-items: center; justify-content: center; position: absolute; right: 55px; top: 434px; width: 150px; height: 150px;}
#intro .right a .arrow {width: 40px;}
#intro .right a .circle {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%;}
#intro .right a .circle img {width: 100%; animation: rotate_image 14s linear infinite;}
@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}

/* HEADER */
.header{height:100px; position:fixed; top:0; z-index:100; width:100%; transition: 0.35s cubic-bezier(.4,0,.6,1);}
.header .inner{height:100%; display:flex; align-items:center; justify-content:space-between; border-bottom: 1px solid #ffffff80;}
.header .inner > div{display:flex; align-items:center;}
.header h1 a img{width: 160px; display: block;}
.header h1 a img.logo_ov{display:none;}
.header .gnb{display:flex;}
.header .gnb > li{position:relative;}
.header .gnb > li > a{font-size: 20px; color: #fff; font-weight: 600; line-height: 100px; display: block; position: relative; padding: 0 75px;}
.header .gnb > li:first-child > a {padding-left: 0;}
.header .gnb > li:last-child > a {padding-right: 0;}
.header .gnb > li > a::before {content: ""; width: 15px; height: 16px; background: url('/img/main/hd_icon.svg') no-repeat center/cover; position: absolute; left: 50%; transform: translateX(-50%); top: 14px; opacity: 0;}
.header .gnb > li:first-child > a::before {left: calc(50% - 37.5px);}
.header .gnb > li:last-child > a::before {left: calc(50% + 37.5px);}
.header .gnb_2depth{position:absolute; top:100%; display:none; align-items: center; gap: 40px; height: 80px; width: max-content; padding-left: 75px; opacity: 0; transition: opacity .3s;}
.header .gnb_2depth.on {opacity: 1;}
.header .gnb > li:nth-child(1) > .gnb_2depth {padding-left: 0;}
.header .gnb_2depth li a{font-size: 18px; font-weight: 400; color: #fff !important; letter-spacing: -.6px; font-family: var(--font-ral);}
.header .gnb_2depth li a:hover {font-weight: 700; text-decoration: underline; text-underline-offset: 4px;}
.header .gnb_2depth_bg {position: absolute; top: 100%; left: 0; width: 100%; height: 0; background-color: transparent; -webkit-transition: 0.35s cubic-bezier(.4,0,.6,1); -o-transition: 0.35s cubic-bezier(.4, 0, .6, 1); transition: 0.35s cubic-bezier(.4,0,.6,1) }
.all_menu_btn{width: 32px; cursor:pointer; filter: var(--filter-white);}
.head_mob_btn{display:none !important;}
.head_bg{display:none !important;}

.header:hover{background: #FFF;}
.header:hover h1 a img.logo{display:none;}
.header:hover h1 a img.logo_ov{display:block;}
.header:hover .all_menu_btn{filter: none;}
.header:hover .gnb > li > a{color: var(--color3)}

.header .gnb > li.on > a::before {opacity: 1;}
.header .gnb > li.on > .gnb_2depth {display:flex;}

.header .gnb_2depth_bg.on {height: 80px; background: var(--color3); width: 5000px; left: 50%; transform: translateX(-50%);}
.header.fixed {background: #FFF;}
.header.fixed h1 a img.logo{display:none;}
.header.fixed h1 a img.logo_ov{display:block;}
.header.fixed .all_menu_btn{filter: none;}
.header.fixed .gnb > li > a{color: var(--color3)}

/* all menu */
.all_menu{transform: translateX(100%); opacity: 0; position:fixed; width:100%; height:100%; z-index:5000; background: var(--color3); transition: all .3s;}
.all_menu::before {content: ""; width: 483px; height: 519px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: url('/img/main/logo_bg.svg') no-repeat center/cover;}
.all_menu.on {transform: translateX(0); opacity: 1;}
.all_menu .all_inner {position:relative; padding: 65px 0 143px;}
.all_menu_close{position: absolute; top: 41px; right: 40px; width: 60.47px; height: 60.47px; border-radius: 100%; border: 1px solid #fff; display: flex; align-items: center; justify-content: center; cursor:pointer; z-index: 1; cursor: pointer;}
.all_menu_close img{width:20.48px;}
.all_inner .logo {width: 160px; margin-left: 130px;}
.all_menu_list {margin-top: 113px;}
.all_menu_list dl{display: flex; align-items: center; gap: 60px;}
.all_menu_list dl + dl {margin-top: 60px;}
.all_menu_list dt {cursor: pointer; display: flex; align-items: center; gap: 80px;}
.all_menu_list dt::before {content: ""; width: 450px; height: 1px; background: #fff; display: block; opacity: 0;}
.all_menu_list dt span {opacity: .5; display: block; min-width: 303px; font-size: 60px; font-weight: 600; color: #fff; letter-spacing: -.03em; line-height: 1.2;}
.all_menu_list dd {display: none;}
.all_menu_list dd a{font-size:20px; font-weight: 700; color: #fff; opacity: .5; letter-spacing: -.4px;}
.all_menu_list dd a:hover {opacity: 1;}
.all_menu_list dl.on dt::before {opacity: 1;}
.all_menu_list dl.on dt span {opacity: 1;}
.all_menu_list dl.on dd {display: block;}
.all_menu .copy {margin-top: 199px; margin-left: 529px; font-size: 18px; font-weight: 400; color: #fff;}

/* footer */
.footer {background: var(--color3); padding: 60px 0 50px;}
.footer .logo {width: 160px;}
.footer .top {display: flex; align-items: flex-start; justify-content: space-between; margin-top: 20px;}
.footer .info p {display: flex; align-items: center; gap: 20px;}
.footer .info p + p {margin-top: 10px;}
.footer .info p span {font-size: 16px; font-weight: 400; color: #fff; letter-spacing: -.4px;}
.footer .info p span span {color: #D0AB9B;}
.footer .info p:last-child span:last-child {font-family: var(--font-out);}
.footer .sns {display: flex; align-items: center; gap: 10px;}
.footer .sns img {width: 30px; opacity: .5;}
.footer .bot {margin-top: 37px; display: flex; align-items: flex-start; justify-content: space-between; padding-top: 40px; border-top: 1px solid #ffffff20;}
.footer p.copy {font-size: 14px; font-weight: 400; color: #fff; line-height: 1.6; font-family: var(--font-out);}
.footer .term {display: flex; align-items: center; gap: 26px;}
.footer .term a {font-size: 14px; font-weight: 400; color: #D0AB9B; letter-spacing: -.4px;}
.footer .term strong a {font-weight: 700; color: #fff;}

/* SIDE QUICK */
.quick {position:fixed; right:30px; bottom:40px; z-index:1000;}
.quick a {display:flex; flex-direction: column; align-items: center; justify-content: center; width: 70px; height: 70px; border-radius: 100%; background: var(--color3);}
.quick a img {width: 22px;}
.quick a p {font-size: 12px; font-weight: 700; color: #fff; font-family: var(--font-nun); letter-spacing: -.4px;}
.quick.on {position: absolute; bottom: 40px;}

/* main */
#main #menu{position:fixed; bottom:280px; right:44px; z-index: 99; padding: 4px 0;}
#main #menu ul li a{width:50px; height:52px; background-color:#00000020; display:flex; align-items:center; justify-content:center; position:relative;}
#main #menu ul li:first-child a{border-radius: 50px 50px 0 0;}
#main #menu ul li:last-child a{border-radius:0 0 50px 50px;}
#main #menu ul li a img {width: 22px; position: relative; z-index: 1;}
#main #menu ul li a .hover{ font-weight: 700; color: #fff; width:0; height: 36px; transition:all .2s; border-radius:30px; position:absolute; top:50%; right: -14px; transform:translateY(-50%); background-color:var(--color3); overflow:hidden; font-family: var(--font-nun); display: flex; align-items: center;}
#main #menu ul li.active a .hover,
#main #menu ul li:hover a .hover {padding: 0 59px 0 24px; width: max-content;}
#main .fp-watermark {display: none;}
#main .fp-table,
#main .fp-overflow {height: 100%;}
/* sec1 */
#main .scroll_down { position: absolute; top: 50%; z-index: 10; display: flex; flex-direction: column; align-items: center; gap: 30px;}
#main .scroll_down p { font-size: 14px; font-weight: 700; font-family: var(--font-nun); text-transform: uppercase; color: #fff; transform: rotate(90deg); margin-bottom: 60px;}
#main .scroll_down .line { width: 1px; height: 120px; background: #ffffff50; position: relative;}
#main .scroll_down .line::after { display: block; content: ""; width: 8px; height: 8px; background: #fff; border-radius: 100%; position: relative; left: -3px; animation:ball 2s ease-in Infinite;}
@keyframes ball {
    0% {
          opacity: 0;
    }
    20% {
        top:0px;
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
          top: 130px;
          opacity: 0;
    }
}
#main .visual {position: relative; height: 100%;}
#main .visual .swiper-slide {width: 100%; height: 100%; overflow: hidden; position: relative;}
#main .visual .swiper-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.1); transition: transform 3s ease !important;}
#main .visual .swiper-slide .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center;}
#main .visual .swiper-slide .txt h2 {font-size: 70px; font-weight: 200; color: #fff; letter-spacing: -5px; font-family: var(--font-nun); line-height: 1.14;}
#main .visual .swiper-slide .txt h2 strong {font-weight: 700;}
#main .visual .swiper-slide .txt p {margin-top: 10px; font-size: 22px; font-weight: 400; color: #fff; letter-spacing: -.6px; line-height: 1.18;}
#main .visual .swiper-slide-active .txt p {animation-name: text-active-animation; animation-duration: 1s; animation-fill-mode: both; animation-delay: 1.2s;}
#main .visual .swiper-slide-active img {transform: scale(1);}
@keyframes text-active-animation {
    from {
      opacity: 0;
      transform: translateY(30px);
    }
  
    to {
      opacity: 1;
      transform: translateY(0);
    }
}
#main .visual .arrow_box {position: absolute; display: flex; align-items: center; justify-content: center; gap: 16px; left: 50%; transform: translateX(-50%); bottom: 70px; z-index: 1;}
#main .visual .arrow_box .swiper-pagination {display: flex; align-items: center; gap: 16px; position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0;}
#main .visual .arrow_box .swiper-pagination-bullet {position: relative; display: flex; align-items: center; justify-content: center; width: 4px; height: 4px; border-radius: 100%; background: #ffffff50; opacity: 1;}
#main .visual .arrow_box .swiper-pagination-bullet-active {background: #fff}
#main .visual .arrow_box .swiper-pagination-bullet-active .autoplay-progress {display: block;}
#main .visual .autoplay-progress { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; width: 18px; height: 18px; display: none;}
#main .visual .autoplay-progress svg { --progress: 0; position: absolute; left: 0; top: 0px; z-index: 10; width: 100%; height: 100%; stroke-width: 2px; stroke: #fff; fill: none; stroke-dashoffset: calc(125.6px * (1 - var(--progress))); stroke-dasharray: 125.6; transform: rotate(-90deg); }
#main .visual .arrow_box .arrow {display: flex; align-items: center; gap: 4px;}
#main .visual .arrow_box .arrow > div {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; width: 16px; height: 16px;}
#main .visual .arrow_box .arrow > div::after {display: none;}
#main .visual .arrow_box .arrow img {width: 100%;}

/* section2 */
#main .section02 {height: 100%;}
#main .section02 .sec2_swiper {height: 100%;}
#main .section02 .swiper-slide {position: relative; overflow: hidden;}
#main .section02 .swiper-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.1); transition: all 1s 0s;}
#main .section02 .swiper-slide .box {position: absolute; top: 60%; left: 50%; transform: translate(-50%,-50%); width: 100%;}
#main .section02 .swiper-slide [class^="txt"] {opacity: 0; transform: translateY(40px); transition: all 1s 0.5s;}
#main .section02 .swiper-slide .txt {text-align: center;}
#main .section02 .swiper-slide .txt img {width: 60px;}
#main .section02 .swiper-slide .txt h3 {margin-top: 10px; font-size: 60px; font-weight: 400; font-family: var(--font-euly); letter-spacing: -5px; line-height: 1.16; color: #fff;}
#main .section02 .swiper-slide .txt p {margin-top: 10px; font-size: 28px; font-weight: 400; font-family: var(--font-nun); letter-spacing: -0.4px; line-height: 1.3; color: #fff;}
#main .section02 .swiper-slide .txt * {transition: all 1s 0.2s; transform: translateY(40px); opacity: 0;}
#main .section02 .swiper-slide .desc {transition: all 1s 0.2s; opacity: 0; margin-top: 70px; transform: translateY(40px); font-size: 40px; font-weight: 300; color: #fff; letter-spacing: -1px; line-height: 1.25; text-align: center;}
#main .section02 .swiper-slide .txt2 {transition: all 1s 0.2s; transform: translateY(40px); opacity: 0; margin: 85px auto 0; display: flex; align-items: center; justify-content: space-between; width: 1700px; font-size: 100px; font-weight: 800; color: #fff; letter-spacing: -.8px; line-height: 1.36; font-family: var(--font-nun); opacity: 0; /* transform: translateY(40px); */ transition: all 1s 0.5s;}
#main .section02 .swiper-slide .txt2 strong:first-child {transform: translateX(-100%); transition: all 1s 0s;}
#main .section02 .swiper-slide .txt2 strong:last-child {transform: translateX(100%); transition: all 1s 0s;;}
#main .section02 .swiper-slide .txt2 .line {display: block; width: 300px; height: 1px; background: #ffffff80; transition: all 1s 0s; transform: scaleX(0);}
#main .section02 .swiper-slide.item2 .txt2 .line {width: 200px;}
#main .section02.active .swiper-slide [class^="txt"] {opacity: 1; transform: translateY(0);}
#main .section02 .swiper-slide.swiper-slide-active img {transform: scale(1);}
#main .section02 .swiper-slide.swiper-slide-active .txt * {transform: translateY(0); opacity: 1;}
#main .section02 .swiper-slide.swiper-slide-active .desc {transform: translateY(0); opacity: 1;}
#main .section02 .swiper-slide.swiper-slide-active .txt2 {opacity: 1;}
#main .section02 .swiper-slide.swiper-slide-active .txt2 .line {transform: scaleX(1);}
#main .section02 .swiper-slide.swiper-slide-active .txt2 strong:first-child {transform: translateX(0);}
#main .section02 .swiper-slide.swiper-slide-active .txt2 strong:last-child {transform: translateX(0);}

/* section3 */
#main .section03 {background: url('/img/main/sec3_bg.jpg') no-repeat center/cover;}
#main .section03 .fp-overflow {height: auto; padding: 110px 0 150px;}
#main .section03 .tit {text-align: center;}
#main .section03 .tit p {font-size: 22px; font-weight: 400; color: #fff; letter-spacing: -.4px; font-family: var(--font-nun); line-height: 1.3;}
#main .section03 .tit h2 {margin-bottom: 10px; font-size: 60px; font-weight: 400; color: #fff; letter-spacing: -5px; font-family: var(--font-euly); line-height: 1.3;}
#main .section03 .circleWrap {margin-top: 90px; display: flex; align-items: center; justify-content: center;}
#main .section03 .circleWrap li {width: 400px; height: 400px; border-radius: 100%; position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; cursor: pointer;}
#main .section03 .circleWrap li::before {content: ""; width: 0; height: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: #fff; border-radius: 100%; transition: all .6s;}
#main .section03 .circleWrap li * {position: relative; z-index: 2; transition: all .6s;}
#main .section03 .circleWrap li + li {margin-left: -20px;}
#main .section03 .circleWrap li svg {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#main .section03 .circleWrap li .img {display: block; height: 88px; display: flex; align-items: center; justify-content: center;}
#main .section03 .circleWrap li .img img {filter: var(--filter-white);}
#main .section03 .circleWrap li:nth-child(1) .img img {width: 65.31px;}
#main .section03 .circleWrap li:nth-child(2) .img img {width: 120px;}
#main .section03 .circleWrap li:nth-child(3) .img img {width: 93.56px;}
#main .section03 .circleWrap li:nth-child(4) .img img {width: 83.31px;}
#main .section03 .circleWrap li p {margin-top: 55px; font-size: 40px; font-weight: 400; color: #fff; letter-spacing: -.6px; font-family: var(--font-euly);}
#main .section03 .circleWrap li span {display: block; margin-top: 10px; font-size: 20px; font-weight: 400; color: #fff; letter-spacing: -.6px;}
#main .section03 .circleWrap li svg path {stroke-dasharray:610; stroke-dashoffset:610px;}
#main .section03.active ul li svg path,
#main .section03 .circleWrap li.go svg path { animation:stroke_ani 1.3s ease-in forwards; -webkit-animation:stroke_ani 1.3s ease-in forwards; }
#main .section03 .circleWrap li:nth-child(1) svg path {animation-delay:0.25s;}
#main .section03 .circleWrap li:nth-child(2) svg path {animation-delay:0.5s;}
#main .section03 .circleWrap li:nth-child(3) svg path {animation-delay:0.75s;}
#main .section03 .circleWrap li:nth-child(4) svg path {animation-delay:0.9s;}
#main .section03 .circleWrap li:hover::before {width: 100%; height: 100%;}
#main .section03 .circleWrap li:hover .img img {filter: none;}
#main .section03 .circleWrap li:hover p,
#main .section03 .circleWrap li:hover span {color: var(--color3);}
@keyframes stroke_ani {
    0% {stroke-dashoffset: 610px;}
    100% {stroke-dashoffset: 0;}
}

/* section4 */
#main .section04 .fp-overflow {display: flex; height: 100%; overflow: hidden;}
#main .section04 .fp-overflow > div {width: 50%; position: relative; transition: all 1s ease; will-change:transform; transform:translateZ(0);}
#main .section04 .fp-overflow > div:hover {width: 60%;}
#main .section04 .left {background: url('/img/main/sec4_img01.jpg') no-repeat left/cover;}
#main .section04 .right {background: url('/img/main/sec4_img02.jpg') no-repeat right/cover;}
#main .section04 .txt {position: absolute; left: 0; padding-right: 45px; width: 100%; height: 100%; top: 0;}
#main .section04 .left .txt {padding: 138px 45px 91px 100px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;}
#main .section04 .right .txt {padding: 0 45px 133px 100px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;}
#main .section04 .top {display: flex; align-items: flex-start; gap: 35px;}
#main .section04 .top img {width: 60px;}
#main .section04 .top p {font-size: 50px; font-weight: 200; font-family: var(--font-nun); letter-spacing: -4px; line-height: 1.2; color: #fff;}
#main .section04 .top strong {font-weight: 700;}
#main .section04 .bot {display: flex; align-items: center; justify-content: space-between; width: 100%;}
#main .section04 .bot .num {display: block; font-size: 20px; font-weight: 600; color: #fff; letter-spacing: -.6px; font-family: var(--font-euly);}
#main .section04 .bot .tit {margin-top: 10px; font-size: 40px; font-weight: 400; color: #fff; letter-spacing: -2px; font-family: var(--font-euly);}
#main .section04 .bot .desc {margin-top: 40px; font-size: 20px; font-weight: 400; color: #fff; letter-spacing: -0.6px; line-height: 1.4;}
#main .section04 .bot a {display: flex; align-items: center; justify-content: center; width: 150px; height: 150px; position: relative;}
#main .section04 .bot a .arrow {width: 40px;}
#main .section04 .bot a .circle {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%;}
#main .section04 .bot a .circle img {width: 100%; animation: rotate_image 14s linear infinite;}
@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}
#main .section04 .right .bot {align-items: flex-end;}
#main .section04 .right .info {padding-bottom: 70px;}

/* section5 */
#main .section05 {position: relative;}
#main .section05 .bg {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .section05 .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; color: #fff;}
#main .section05 .txt img {width: 60px;}
#main .section05 .txt h2 {margin-top: 10px; font-size: 60px; font-weight: 400; font-family: var(--font-euly); letter-spacing: -5px;}
#main .section05 .txt p {margin-top: 10px; font-size: 28px; font-weight: 400; font-family: var(--font-nun); letter-spacing: -0.4px;}
#main .section05 .txt a {margin: 40px auto 0; display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 400; color: #fff; letter-spacing: -.6px; font-family: "Roboto", sans-serif; width: 148px; height: 44px; border: 1px solid #fff; border-radius: 100px; transition: all .3s;}
#main .section05 .txt a img {width: 20px; filter: var(--filter-white); transition: all .3s;}
#main .section05 .txt a:hover {background: #fff; color: var(--color3);}
#main .section05 .txt a:hover img {filter: none;}

/* footer */
#main .footer {height: 360px;}

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

    /* intro */
    #intro .left {gap: 2.44vw;}
    #intro .left::before {width: 29.45vw; height: 31.65vw;}
    #intro .left img {width: 9.33vw;}
    #intro .left .line {width: 0.06vw; height: 1.83vw;}
    #intro .left p {font-size: 1.46vw;}
    #intro .right a {right: 3.35vw; top: 26.46vw; width: 9.15vw; height: 9.15vw;}
    #intro .right a .arrow {width: 2.44vw;}

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

    /* HEADER */
    .header{height:6.10vw; }
    .header h1 a img{width: 9.76vw;}
    .header .gnb > li > a{font-size: 1.22vw; line-height: 6.10vw; padding: 0 4.57vw;}
    .header .gnb > li > a::before {width: 0.91vw; height: 0.98vw; top: 0.85vw;}
    .header .gnb > li:first-child > a::before {left: calc(50% - 2.29vw);}
    .header .gnb > li:last-child > a::before {left: calc(50% + 2.29vw);}
    .header .gnb_2depth{gap: 2.44vw; height: 4.88vw; padding-left: 4.57vw;}
    .header .gnb_2depth li a{font-size: 1.10vw; letter-spacing: -0.04vw;}
    .header .gnb_2depth li a:hover {text-underline-offset: 0.24vw;}
    .all_menu_btn{width: 1.95vw;}
    .header .gnb_2depth_bg.on {height: 4.88vw; width: 304.88vw;}

    /* all menu */
    .all_menu::before {width: 29.45vw; height: 31.65vw;}
    .all_menu .all_inner {padding: 3.96vw 0 8.72vw;}
    .all_menu_close{top: 2.50vw; right: 2.44vw; width: 3.69vw; height: 3.69vw;}
    .all_menu_close img{width:1.25vw;}
    .all_inner .logo {width: 9.76vw; margin-left: 7.93vw;}
    .all_menu_list {margin-top: 6.89vw;}
    .all_menu_list dl{gap: 3.66vw;}
    .all_menu_list dl + dl {margin-top: 3.66vw;}
    .all_menu_list dt {gap: 4.88vw;}
    .all_menu_list dt::before {width: 27.44vw; height: 0.06vw;}
    .all_menu_list dt span {min-width: 18.48vw; font-size: 3.66vw;}
    .all_menu_list dd a{font-size:1.22vw; letter-spacing: -0.02vw;}
    .all_menu .copy {margin-top: 12.13vw; margin-left: 32.26vw; font-size: 1.10vw;}

    /* footer */
    .footer {padding: 3.66vw 0 3.05vw;}
    .footer .logo {width: 9.76vw;}
    .footer .top {margin-top: 1.22vw;}
    .footer .info p {gap: 1.22vw;}
    .footer .info p + p {margin-top: 0.61vw;}
    .footer .info p span {font-size: 0.98vw; letter-spacing: -0.02vw;}
    .footer .sns {gap: 0.61vw;}
    .footer .sns img {width: 1.83vw;}
    .footer .bot {margin-top: 2.26vw; padding-top: 2.44vw;}
    .footer p.copy {font-size: 0.85vw;}
    .footer .term {gap: 1.59vw;}
    .footer .term a {font-size: 0.85vw; letter-spacing: -0.02vw;}

    /* SIDE QUICK */
    .quick {right:1.83vw; bottom:2.44vw;}
    .quick a {width: 4.27vw; height: 4.27vw;}
    .quick a img {width: 1.34vw;}
    .quick a p {font-size: 0.73vw; letter-spacing: -0.02vw;}
    .quick.on {bottom: 2.44vw;}

    /* main */
    #main #menu{bottom:17.07vw; right:2.68vw; padding: 0.24vw 0;}
    #main #menu ul li a{width:3.05vw; height:3.17vw;}
    #main #menu ul li:first-child a{border-radius: 3.05vw 3.05vw 0 0;}
    #main #menu ul li:last-child a{border-radius:0 0 3.05vw 3.05vw;}
    #main #menu ul li a img {width: 1.34vw;}
    #main #menu ul li a .hover{height: 2.20vw; border-radius:1.83vw; right: -0.85vw;}
    #main #menu ul li.active a .hover,
    #main #menu ul li:hover a .hover {padding: 0 3.60vw 0 1.46vw;}
    /* sec1 */
    #main .scroll_down {gap: 1.83vw;}
    #main .scroll_down p {font-size: 0.85vw;  margin-bottom: 3.66vw;}
    #main .scroll_down .line {width: 0.06vw; height: 7.32vw;}
    #main .scroll_down .line::after {width: 0.49vw; height: 0.49vw; left: -0.18vw;}
    @keyframes ball {
        20% {
            top:0.00vw;
        }
        100% {
            top: 7.93vw;
        }
    }
    #main .visual .swiper-slide .txt h2 {font-size: 4.27vw; letter-spacing: -0.30vw;}
    #main .visual .swiper-slide .txt p {margin-top: 0.61vw; font-size: 1.34vw; letter-spacing: -0.04vw;}
    @keyframes text-active-animation {
    from {
            transform: translateY(1.83vw);
        }
        
        to {
            transform: translateY(0);
        }
    }
    #main .visual .arrow_box {gap: 0.98vw; bottom: 4.27vw;}
    #main .visual .arrow_box .swiper-pagination {gap: 0.98vw;}
    #main .visual .arrow_box .swiper-pagination-bullet {width: 0.24vw; height: 0.24vw;}
    #main .visual .autoplay-progress {transform: translate(-50%, -50%); width: 1.10vw; height: 1.10vw;}
    #main .visual .autoplay-progress svg {stroke-width: 0.12vw;}
    #main .visual .arrow_box .arrow {gap: 0.24vw;}
    #main .visual .arrow_box .arrow > div {width: 0.98vw; height: 0.98vw;}

    /* section2 */
    #main .section02 .swiper-slide .box {top: 56%;}
    #main .section02 .swiper-slide .txt img {width: 3.66vw;}
    #main .section02 .swiper-slide .txt h3 {margin-top: 0.61vw; font-size: 3.66vw; letter-spacing: -0.30vw;}
    #main .section02 .swiper-slide .txt p {margin-top: 0.61vw; font-size: 1.71vw; letter-spacing: -0.02vw;}
    #main .section02 .swiper-slide .txt * {transform: translateY(2.44vw);}
    #main .section02 .swiper-slide .desc {margin-top: 4.27vw; font-size: 2.44vw; letter-spacing: -0.06vw;}
    #main .section02 .swiper-slide .txt2 {margin: 5.18vw auto 0; width: 97.56vw; font-size: 6.10vw; letter-spacing: -0.05vw;}
    #main .section02 .swiper-slide .txt2 .line {width: 18.29vw; height: 0.06vw;}
    #main .section02 .swiper-slide.item2 .txt2 .line {width: 10.20vw;}

    /* section3 */
    #main .section03 .fp-overflow {padding: 6.71vw 0 9.15vw;}
    #main .section03 .tit p {font-size: 1.34vw; letter-spacing: -0.02vw;}
    #main .section03 .tit h2 {margin-bottom: 0.61vw; font-size: 3.66vw; letter-spacing: -0.30vw;}
    #main .section03 .circleWrap {margin-top: 5.49vw;}
    #main .section03 .circleWrap li {width: 24.39vw; height: 24.39vw;}
    #main .section03 .circleWrap li + li {margin-left: -1.22vw;}
    #main .section03 .circleWrap li .img {height: 5.37vw;}
    #main .section03 .circleWrap li:nth-child(1) .img img {width: 3.98vw;}
    #main .section03 .circleWrap li:nth-child(2) .img img {width: 7.32vw;}
    #main .section03 .circleWrap li:nth-child(3) .img img {width: 5.70vw;}
    #main .section03 .circleWrap li:nth-child(4) .img img {width: 5.08vw;}
    #main .section03 .circleWrap li p {margin-top: 3.35vw; font-size: 2.44vw; letter-spacing: -0.04vw;}
    #main .section03 .circleWrap li span {margin-top: 0.61vw; font-size: 1.22vw; letter-spacing: -0.04vw;}

    /* section4 */
    #main .section04 .txt {padding-right: 2.74vw;}
    #main .section04 .left .txt {padding: 8.41vw 2.74vw 5.55vw 6.10vw;}
    #main .section04 .right .txt {padding: 0 2.74vw 8.11vw 6.10vw;}
    #main .section04 .top {gap: 2.13vw;}
    #main .section04 .top img {width: 3.66vw;}
    #main .section04 .top p {font-size: 3.05vw; letter-spacing: -0.24vw;}
    #main .section04 .bot .num {font-size: 1.22vw; letter-spacing: -0.04vw;}
    #main .section04 .bot .tit {margin-top: 0.61vw; font-size: 2.44vw; letter-spacing: -0.12vw;}
    #main .section04 .bot .desc {margin-top: 2.44vw; font-size: 1.22vw; letter-spacing: -0.04vw;}
    #main .section04 .bot a {width: 9.15vw; height: 9.15vw;}
    #main .section04 .bot a .arrow {width: 2.44vw;}
    #main .section04 .right .info {padding-bottom: 4.27vw;}

    /* section5 */
    #main .section05 .txt img {width: 3.66vw;}
    #main .section05 .txt h2 {margin-top: 0.61vw; font-size: 3.66vw; letter-spacing: -0.30vw;}
    #main .section05 .txt p {margin-top: 0.61vw; font-size: 1.71vw; letter-spacing: -0.02vw;}
    #main .section05 .txt a {margin: 2.44vw auto 0; gap: 0.49vw; font-size: 0.85vw; letter-spacing: -0.04vw; width: 9.02vw; height: 2.68vw; border-radius: 6.10vw;}
    #main .section05 .txt a img {width: 1.22vw;}

    /* footer */
    #main .footer {height: 21.95vw;}

}



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

    /* intro */
    #intro .left {gap: 2.42vw;}
    #intro .left::before {width: 29.45vw; height: 31.64vw;}
    #intro .left img {width: 9.30vw;}
    #intro .left .line {width: 0.08vw; height: 1.80vw;}
    #intro .left p {font-size: 1.48vw;}
    #intro .right a {right: 3.36vw; top: 26.48vw; width: 9.14vw; height: 9.14vw;}
    #intro .right a .arrow {width: 2.42vw;}

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

    /* HEADER */
    .header{height:5.86vw; }
    .header h1 a img{width: 9.38vw;}
    .header .gnb > li > a{font-size: 1.17vw; line-height: 5.86vw; padding: 0 4.53vw;}
    .header .gnb > li > a::before {width: 0.94vw; height: 1.02vw; top: 0.86vw;}
    .header .gnb > li:first-child > a::before {left: calc(50% - 2.27vw);}
    .header .gnb > li:last-child > a::before {left: calc(50% + 2.27vw);}
    .header .gnb_2depth{gap: 2.42vw; height: 4.84vw; padding-left: 4.53vw;}
    .header .gnb_2depth li a{font-size: 1.09vw; letter-spacing: -0.08vw;}
    .header .gnb_2depth li a:hover {text-underline-offset: 0.23vw;}
    .all_menu_btn{width: 1.95vw;}
    .header .gnb_2depth_bg.on {height: 4.84vw; width: 304.84vw;}

    /* all menu */
    .all_menu::before {width: 29.45vw; height: 31.64vw;}
    .all_menu .all_inner {padding: 3.98vw 0 8.75vw;}
    .all_menu_close{top: 2.50vw; right: 2.42vw; width: 3.67vw; height: 3.67vw;}
    .all_menu_close img{width:1.25vw;}
    .all_inner .logo {width: 9.77vw; margin-left: 7.97vw;}
    .all_menu_list {margin-top: 6.88vw;}
    .all_menu_list dl{gap: 3.67vw;}
    .all_menu_list dl + dl {margin-top: 3.67vw;}
    .all_menu_list dt {gap: 4.84vw;}
    .all_menu_list dt::before {width: 27.42vw; height: 0.08vw;}
    .all_menu_list dt span {min-width: 18.52vw; font-size: 3.67vw;}
    .all_menu_list dd a{font-size:1.25vw; letter-spacing: -0.00vw;}
    .all_menu .copy {margin-top: 12.11vw; margin-left: 32.27vw; font-size: 1.09vw;}

    /* footer */
    .footer {padding: 3.52vw 0 2.89vw;}
    .footer .logo {width: 9.38vw;}
    .footer .top {margin-top: 1.17vw;}
    .footer .info p {gap: 1.25vw;}
    .footer .info p + p {margin-top: 0.63vw;}
    .footer .info p span {font-size: 0.94vw; letter-spacing: -0.02vw;}
    .footer .sns {gap: 0.63vw;}
    .footer .sns img {width: 1.80vw;}
    .footer .bot {margin-top: 2.27vw; padding-top: 2.42vw;}
    .footer p.copy {font-size: 0.86vw;}
    .footer .term {gap: 1.56vw;}
    .footer .term a {font-size: 0.86vw; letter-spacing: -0.00vw;}

    /* SIDE QUICK */
    .quick {right:2.34vw; bottom:3.13vw;}
    .quick a {width: 4.30vw; height: 4.30vw;}
    .quick a img {width: 1.33vw;}
    .quick a p {font-size: 0.70vw; letter-spacing: -0.00vw;}
    .quick.on {bottom:3.13vw;}

    /* main */
    #main #menu{bottom:17.03vw; right:2.34vw; padding: 0.23vw 0;}
    #main #menu ul li a{width:2.97vw; height:3.13vw;}
    #main #menu ul li:first-child a{border-radius: 2.93vw 2.93vw 0 0;}
    #main #menu ul li:last-child a{border-radius:0 0 2.93vw 2.93vw;}
    #main #menu ul li a img {width: 1.29vw;}
    #main #menu ul li a .hover{height: 2.11vw; border-radius:1.76vw; right: -0.86vw;}
    #main #menu ul li.active a .hover,
    #main #menu ul li:hover a .hover {padding: 0 3.52vw 0 1.33vw;}
    /* sec1 */
    #main .scroll_down {gap: 1.80vw;}
    #main .scroll_down p {font-size: 0.86vw;  margin-bottom: 3.67vw;}
    #main .scroll_down .line {width: 0.08vw; height: 7.34vw;}
    #main .scroll_down .line::after {width: 0.47vw; height: 0.47vw; left: -0.16vw;}
    @keyframes ball {
        20% {
            top:0.00vw;
        }
        100% {
            top: 7.97vw;
        }
    }
    #main .visual .swiper-slide .txt h2 {font-size: 4.30vw; letter-spacing: -0.31vw;}
    #main .visual .swiper-slide .txt p {margin-top: 0.63vw; font-size: 1.33vw; letter-spacing: -0.08vw;}
    @keyframes text-active-animation {
    from {
            transform: translateY(1.80vw);
        }
        
        to {
            transform: translateY(0);
        }
    }
    #main .visual .arrow_box {gap: 1.02vw; bottom: 4.30vw;}
    #main .visual .arrow_box .swiper-pagination {gap: 1.02vw;}
    #main .visual .arrow_box .swiper-pagination-bullet {width: 0.23vw; height: 0.23vw;}
    #main .visual .autoplay-progress {transform: translate(-50%, -50%); width: 1.09vw; height: 1.09vw;}
    #main .visual .autoplay-progress svg {stroke-width: 0.16vw;}
    #main .visual .arrow_box .arrow {gap: 0.23vw;}
    #main .visual .arrow_box .arrow > div {width: 1.02vw; height: 1.02vw;}

    /* section2 */
    #main .section02 .swiper-slide .box {top: 55%;}
    #main .section02 .swiper-slide .txt img {width: 3.67vw;}
    #main .section02 .swiper-slide .txt h3 {margin-top: 0.63vw; font-size: 3.52vw; letter-spacing: -0.29vw;}
    #main .section02 .swiper-slide .txt p {margin-top: 0.63vw; font-size: 1.64vw; letter-spacing: -0.02vw;}
    #main .section02 .swiper-slide .txt * {transform: translateY(2.42vw);}
    #main .section02 .swiper-slide .desc {margin-top: 4.30vw; font-size: 2.34vw; letter-spacing: -0.06vw;}
    #main .section02 .swiper-slide .txt2 {margin: 5.16vw auto 0; width: 99%; font-size: 5.86vw; letter-spacing: -0.05vw;}
    #main .section02 .swiper-slide .txt2 .line {width: 17.58vw; height: 0.08vw;}
    #main .section02 .swiper-slide.item2 .txt2 .line {width: 9.77vw;}

    /* section3 */
    #main .section03 .fp-overflow {padding: 6.72vw 0 9.14vw;}
    #main .section03 .tit p {font-size: 1.25vw; letter-spacing: -0.02vw;}
    #main .section03 .tit h2 {margin-bottom: 0.63vw; font-size: 3.52vw; letter-spacing: -0.29vw;}
    #main .section03 .circleWrap {margin-top: 5.47vw;}
    #main .section03 .circleWrap li {width: 23.44vw; height: 23.44vw;}
    #main .section03 .circleWrap li + li {margin-left: -1.25vw;}
    #main .section03 .circleWrap li .img {height: 5.39vw;}
    #main .section03 .circleWrap li:nth-child(1) .img img {width: 3.98vw;}
    #main .section03 .circleWrap li:nth-child(2) .img img {width: 7.34vw;}
    #main .section03 .circleWrap li:nth-child(3) .img img {width: 5.70vw;}
    #main .section03 .circleWrap li:nth-child(4) .img img {width: 5.08vw;}
    #main .section03 .circleWrap li p {margin-top: 3.36vw; font-size: 2.42vw; letter-spacing: -0.08vw;}
    #main .section03 .circleWrap li span {margin-top: 0.63vw; font-size: 1.25vw; letter-spacing: -0.08vw;}

    /* section4 */
    #main .section04 .txt {padding-right: 2.73vw;}
    #main .section04 .left .txt {padding: 8.44vw 3.13vw 5.55vw 3.13vw;}
    #main .section04 .right .txt {padding: 0 3.13vw 8.13vw 3.13vw;}
    #main .section04 .top {gap: 2.11vw;}
    #main .section04 .top img {width: 3.67vw;}
    #main .section04 .top p {font-size: 3.05vw; letter-spacing: -0.23vw;}
    #main .section04 .bot .num {font-size: 1.25vw; letter-spacing: -0.08vw;}
    #main .section04 .bot .tit {margin-top: 0.63vw; font-size: 2.42vw; letter-spacing: -0.16vw;}
    #main .section04 .bot .desc {margin-top: 2.42vw; font-size: 1.25vw; letter-spacing: -0.08vw;}
    #main .section04 .bot a {width: 9.14vw; height: 9.14vw;}
    #main .section04 .bot a .arrow {width: 2.42vw;}
    #main .section04 .right .info {padding-bottom: 4.30vw;}

    /* section5 */
    #main .section05 .txt img {width: 3.67vw;}
    #main .section05 .txt h2 {margin-top: 0.63vw; font-size: 3.67vw; letter-spacing: -0.31vw;}
    #main .section05 .txt p {margin-top: 0.63vw; font-size: 1.72vw; letter-spacing: -0.00vw;}
    #main .section05 .txt a {margin: 2.42vw auto 0; gap: 0.47vw; font-size: 0.86vw; letter-spacing: -0.08vw; width: 8.98vw; height: 2.66vw; border-radius: 6.09vw;}
    #main .section05 .txt a img {width: 1.25vw;}

    /* footer */
    #main .footer {height: 21.95vw;}

}



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

    /* intro */
    #intro {background: url('/img/main/m_intro_img.jpg') no-repeat center/cover; flex: auto; display: block;}
    #intro > div {width: auto;}
    #intro .left {gap: 7.29vw; background: none; position: absolute; top: 45%; left: 50%; transform: translate(-50%,-50%); text-align: center; width: 100%;}
    #intro .left::before {display: none;}
    #intro .left img {width: 27.86vw;}
    #intro .left .line {width: 0.26vw; height: 5.34vw;}
    #intro .left p {font-size: 5.21vw;}
    #intro .right {width: 100%; height: 100%;}
    #intro .right a {right: auto; left: 50%; transform: translateX(-50%); top: auto; bottom: 7.81vw; width: 26.04vw; height: 26.04vw;}
    #intro .right a .arrow {width: 7.29vw;}

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

    /* HEADER */
    .header{height:15.63vw; }
    .header h1 a img{width: 20.83vw;}
    .header .gnb {display: none;}
    .all_menu_btn {display: none;}
    .head_mob_btn {display: block !important;}
    .head_mob_btn img {filter: var(--filter-white); width: 8.33vw;}
    .header:hover {background: transparent;}
    .header:hover h1 a img.logo{display:block;}
    .header:hover h1 a img.logo_ov{display:none;}
    .header.fixed .head_mob_btn img {filter: none;}

    /* head_bg */
    .head_bg {position: fixed; top: 0; left: 0; background: var(--color3); z-index: 1001; width: 100%; height: 100vh; padding: 19.01vw 5.21vw;}
    .head_bg.on {display: block !important;}
    .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 img {width: 32.55vw;}
    .head_bg .accordion {margin-top: 16.28vw; height: calc(100vh - 108vw); overflow: hidden; overflow-y: scroll;}
    .head_bg .accordion > li + li{margin-top: 8.33vw;}
    .head_bg .accordion .link {padding: 0 0 5.60vw; font-size: 8.33vw; font-weight: 600; color: #ffffff50; letter-spacing: -.03em;}
    .head_bg .accordion .submenu {display: none;}
    .head_bg .accordion .submenu ul {display: flex; align-items: center; gap: 1.30vw 6.51vw;}
    .head_bg .accordion .submenu a {font-size: 3.89vw; font-weight: 700; color: #ffffff50; letter-spacing: -0.11vw;}
    .head_bg .accordion .submenu a:hover {color: #fff; text-decoration: underline; text-underline-offset: 0.65vw;}
    .head_bg .copy {margin-top: 40vw; font-size: 3.65vw; font-weight: 400; color: #fff; letter-spacing: -0.21vw;}
    .head_bg .accordion > li.on .link {color: #fff;}

    /* footer */
    .footer {padding: 15.63vw 0 11.46vw;}
    .footer .logo {width: 31.25vw;}
    .footer .top {margin-top: 9.11vw; flex-direction: column; align-items: flex-start; gap: 9.77vw;}
    .footer .info p {gap: 0.65vw 2.60vw; flex-wrap: wrap;}
    .footer .info p + p {margin-top: 0.65vw;}
    .footer .info p span {font-size: 4.17vw; letter-spacing: -0.10vw;}
    .footer .sns {gap: 3.52vw;}
    .footer .sns img {width: 10.42vw;}
    .footer .bot {margin-top: 10.42vw; padding-top: 7.81vw; flex-direction: column; align-items: flex-start; gap: 2.99vw;}
    .footer p.copy {font-size: 3.65vw;}
    .footer .term {gap: 5.21vw;}
    .footer .term a {font-size: 3.65vw; letter-spacing: -0.10vw;}

    /* SIDE QUICK */
    .quick {right:2.99vw; bottom: 2.5vw;}
    .quick a {width: 11.72vw; height: 11.72vw;}
    .quick a img {width: 3.68vw;}
    .quick a p {font-size: 2.01vw; letter-spacing: -0.07vw;}
    .quick.on {bottom: 2.5vw;}

    /* main */
    #main #menu{display: none;}
    #main .fp-table, #main .fp-overflow {max-height: none; min-height: auto;}
    /* sec1 */
    #main .scroll_down {display: none;}
    #main .visual .swiper-slide {height: 169.27vw;}
    #main .visual .swiper-slide .txt {width: 100%;}
    #main .visual .swiper-slide .txt h2 {font-size: 13.02vw; letter-spacing: -1.30vw; line-height: 1.12;}
    #main .visual .swiper-slide .txt strong {display: block; margin-top: 1.30vw;}
    #main .visual .swiper-slide .txt p {margin-top: 2.60vw; font-size: 5.21vw; letter-spacing: -0.16vw;}
    @keyframes text-active-animation {
    from {
            transform: translateY(7.03vw);
        }
        
        to {
            transform: translateY(0);
        }
    }
    #main .visual .arrow_box {gap: 5.86vw; bottom: 11.07vw;}
    #main .visual .arrow_box .swiper-pagination {gap: 5.86vw;}
    #main .visual .arrow_box .swiper-pagination-bullet {width: 1.45vw; height: 1.45vw;}
    #main .visual .autoplay-progress {transform: translate(-50%, -50%); width: 5.79vw; height: 5.79vw;}
    #main .visual .autoplay-progress svg {stroke-width: 0.39vw;}
    #main .visual .arrow_box .arrow {gap: 1.45vw;}
    #main .visual .arrow_box .arrow > div {width: 5.79vw; height: 5.79vw;}

    /* section2 */
    #main .section02 .swiper-slide .box {top: 50%;}
    #main .section02 .swiper-wrapper {display: block;}
    #main .section02 .swiper-slide {height: 169.27vw;}
    #main .section02 .swiper-slide .txt {width: 100%; opacity: 1;}
    #main .section02 .swiper-slide .txt img {width: 15.63vw;}
    #main .section02 .swiper-slide .txt h3 {margin-top: 2.60vw; font-size: 8.33vw; letter-spacing: -0.52vw;}
    #main .section02 .swiper-slide .txt p {margin-top: 2.60vw; font-size: 4.17vw; letter-spacing: -0.10vw;}
    #main .section02 .swiper-slide .txt * {transform: translateY(9.51vw);}
    #main .section02 .swiper-slide .desc {margin-top: 23.96vw; font-size: 5.21vw; letter-spacing: -0.16vw; width: 100%; text-align: center;}
    #main .section02 .swiper-slide .txt2 {margin: 24.74vw auto 0; width: 100%; font-size: 13.02vw; letter-spacing: -0.21vw; flex-wrap: wrap; opacity: 1;}
    #main .section02 .swiper-slide .txt2 strong:first-child {width: 100%;}
    #main .section02 .swiper-slide .txt2 .line {width: 23.44vw; height: 0.26vw;}
    #main .section02 .swiper-slide.item2 .txt2 .line {width: 14.32vw;}

    #main .section02 .swiper-slide.on > [class^="txt"] {opacity: 1; transform: translateY(0);}
    #main .section02 .swiper-slide.on img {transform: scale(1);}
    #main .section02 .swiper-slide.on .txt * {transform: translateY(0); opacity: 1;}
    #main .section02 .swiper-slide.on .desc {transform: translateY(0); opacity: 1;}
    #main .section02 .swiper-slide.on .txt2 {opacity: 1;}
    #main .section02 .swiper-slide.on .txt2 .line {transform: scaleX(1);}
    #main .section02 .swiper-slide.on .txt2 strong:first-child {transform: translateX(0);}
    #main .section02 .swiper-slide.on .txt2 strong:last-child {transform: translateX(0);}

    /* section3 */
    #main .section03 {background: url('/img/main/m_sec3_bg.jpg') no-repeat center/cover; padding: 20.83vw 0 30.60vw;}
    #main .section03 .tit p {font-size: 4.17vw; letter-spacing: -0.10vw;}
    #main .section03 .tit h2 {margin-bottom: 2.60vw; font-size: 8.33vw; letter-spacing: -0.52vw;}
    #main .section03 .circleWrap {margin-top: 10.42vw; flex-wrap: wrap;}
    #main .section03 .circleWrap li {width: 45.83vw; height: 45.83vw;}
    #main .section03 .circleWrap li + li {margin-left: 0;}
    #main .section03 .circleWrap li:nth-child(even) {margin-left: -2.21vw;}
    #main .section03 .circleWrap li:nth-child(3),
    #main .section03 .circleWrap li:nth-child(4) {margin-top: -2.21vw;}
    #main .section03 .circleWrap li .img {height: 9.56vw;}
    #main .section03 .circleWrap li:nth-child(1) .img img {width: 7.49vw;}
    #main .section03 .circleWrap li:nth-child(2) .img img {width: 13.49vw;}
    #main .section03 .circleWrap li:nth-child(3) .img img {width: 10.73vw;}
    #main .section03 .circleWrap li:nth-child(4) .img img {width: 9.56vw;}
    #main .section03 .circleWrap li p {margin-top: 6.38vw; font-size: 4.69vw; letter-spacing: -0.07vw;}
    #main .section03 .circleWrap li span {margin-top: 1.17vw; font-size: 3.13vw; letter-spacing: -0.07vw;}
    #main .section03.on .circleWrap li svg path {animation:stroke_ani 1.3s ease-in forwards; -webkit-animation:stroke_ani 1.3s ease-in forwards;}
    #main .section03 .circleWrap li:nth-child(1) svg path {animation-delay:0.25s;}
    #main .section03 .circleWrap li:nth-child(2) svg path {animation-delay:0.5s;}
    #main .section03 .circleWrap li:nth-child(3) svg path {animation-delay:0.75s;}
    #main .section03 .circleWrap li:nth-child(4) svg path {animation-delay:0.9s;}

    /* section4 */
    #main .section04 .fp-overflow {display: block;}
    #main .section04 > div{height: 104.17vw;}
    #main .section04 .left {background: url('/img/main/m_sec4_img01.jpg') no-repeat left / cover;}
    #main .section04 .right {background: url('/img/main/m_sec4_img02.jpg') no-repeat left / cover;}
    #main .section04 .fp-overflow > div {height: 104.17vw; width: 100%; position: relative;}
    #main .section04 .fp-overflow > div:hover {width: 100%;}
    #main .section04 .info {width: 100%;}
    #main .section04 .left .txt {padding: 14.32vw 5.21vw 10.94vw; position: relative;}
    #main .section04 .left .info {margin-top: 16.28vw;}
    #main .section04 .right .txt {padding: 29.95vw 5.21vw 19.27vw; position: relative;}
    #main .section04 .top {gap: 3.65vw;}
    #main .section04 .top img {width: 6.25vw;}
    #main .section04 .top p {font-size: 7.29vw; letter-spacing: -0.42vw;}
    #main .section04 .bot {display: block;}
    #main .section04 .bot .num {font-size: 3.13vw; letter-spacing: -0.06vw;}
    #main .section04 .bot .tit {margin-top: 1.04vw; font-size: 5.73vw; letter-spacing: -0.21vw;}
    #main .section04 .bot .desc {margin-top: 4.17vw; font-size: 3.39vw; letter-spacing: -0.06vw;}
    #main .section04 .bot a {width: 28.65vw; height: 28.65vw; position: absolute; top: 29.95vw; right: 5.21vw;}
    #main .section04 .bot a .arrow {width: 7.68vw;}
    #main .section04 .right .info {padding-bottom: 0;}

    /* section5 */
    #main .section05 .txt {width: 100%;}
    #main .section05 .txt img {width: 15.63vw;}
    #main .section05 .txt h2 {margin-top: 2.60vw; font-size: 8.33vw; letter-spacing: -1.30vw;}
    #main .section05 .txt p {margin-top: 2.60vw; font-size: 4.17vw; letter-spacing: -0.10vw;}
    #main .section05 .txt a {margin: 10.42vw auto 0; gap: 2.08vw; font-size: 3.65vw; letter-spacing: -0.16vw; width: 38.41vw; height: 11.46vw; border-radius: 26.04vw;}
    #main .section05 .txt a img {width: 5.21vw;}

    /* footer */
    #main .footer {height: auto; min-height: auto;}

}