@import url("reset.css");
@import url("common.css");
@import url("font.css");
@import url('https://cdn.jsdelivr.net/gh/fonts-archive/Paperlogy/Paperlogy.css');
/*
      MAIN
*******************/
.pc-only {display:block;}
.m-only {display:none;}
#fullpage section{overflow: hidden;}

/* utility */
.utility_wrap{position: fixed; bottom: 40px; right: 30px; z-index: 20; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; transition: all 1s; opacity: 0; visibility: hidden;}
.utility_wrap > div{width: 58px; height: 58px; border-radius: 58px; border: 1px solid #5E5E5E; display: flex; align-items: center; justify-content: center; position: relative; cursor: pointer; transition: all 0.3s;}
.utility_wrap > div:hover{background: #333333; border: 1px solid #333333;}
.utility_wrap > div.customer_btn{padding: 20px 18px; justify-content: flex-end;}
.utility_wrap > div.customer_btn:hover{width: 160px;}
.utility_wrap > div p{position: absolute; right: 0; transform: translateX(-50px); top: 21px; font-size: 16px; font-weight: 500; color: #fff; white-space: nowrap; opacity: 0; transition: all 0.2s; pointer-events: none;}
.utility_wrap > div.customer_btn:hover p{opacity: 1;} 

body:not(.fp-viewing-sec1) .utility_wrap > div{border: 1px solid rgba(0,0,0,0.2);}
body:not(.fp-viewing-sec1) .utility_wrap > div svg path{stroke: #404041;}
body:not(.fp-viewing-sec1) .utility_wrap > div:hover svg path{stroke: #fff;}

.fp-viewing-sec1 header{transform: translateY(-90px);}
.fp-viewing-sec1 header.open{transform: translateY(0);}

/* indicator */
body #fp-nav.right{right: 50px;}
body #fp-nav ul{display: flex; flex-direction: column; align-items: center;}
body #fp-nav ul li{margin: 0; width: 6px; height: 6px; margin-bottom: 20px;}
body #fp-nav ul li a span{position: relative; top: 0; left: 0; margin: 0; display: block; width: 6px; height: 6px; background: rgba(255,255,255,0.2);}
body #fp-nav ul li a.active span{margin: 0; width: 6px; height: 6px; background: rgba(255,255,255,1);}
body #fp-nav ul li:hover a span{width: 6px; height: 6px; margin: 0;}
body #fp-nav ul li:hover a.active span{width: 6px; height: 6px; margin: 0;}
body #fp-nav ul li:nth-child(1){width: 14px; height: 16px; margin-bottom: 105px;}
body #fp-nav ul li:nth-child(1)::after{content: ""; position: absolute; top: 40px; left: 0; right: 0; margin: auto; width: 1px; height: 60px; background: rgba(255,255,255,0.2);}
body #fp-nav ul li:nth-child(1) a span{width: 14px; height: 16px; border-radius: unset; background: url("/resources/img/main/indi_home.svg") center center/cover no-repeat;}
body #fp-nav ul li:nth-child(1) a.active span{margin: 0; width: 14px; height: 16px; border-radius: unset;}
body #fp-nav ul li:nth-child(1):hover a span{width: 14px; height: 16px; margin: 0; border-radius: unset; background: url("/resources/img/main/indi_home_bk_active.svg") center center/cover no-repeat !important;}
body #fp-nav ul li:nth-child(1):hover a.active span{width: 14px; height: 16px; margin: 0; border-radius: unset;}

body #fp-nav ul li:not(:nth-child(1)) a::after{position: absolute; top: -2px; right: 10px; font-size: 10px; font-family: 'Paperlogy'; font-weight: 400; color: #00173E; letter-spacing: 0.5px; white-space: nowrap; opacity: 0; pointer-events: none; transition: all 0.5s;}
body #fp-nav ul li:not(:nth-child(1)) a.active::after{opacity: 1;}
body #fp-nav ul li:not(:nth-child(1)) a:hover::after{opacity: 1;}
body #fp-nav ul li:nth-child(2) a::after{content: "SHOW ROOM";}
body #fp-nav ul li:nth-child(3) a::after{content: "CALENDAR";}
body #fp-nav ul li:nth-child(4) a::after{content: "COMMUITY";}
body #fp-nav ul li:nth-child(5) a::after{content: "PREMIUM";}
body #fp-nav ul li:nth-child(6) a::after{content: "CONTACT US";}
body #fp-nav ul li:nth-child(7){display: none;}

body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav ul li a span{background: rgba(0,23,62,0.2);}
body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav ul li a.active span{background: rgba(0,23,62,1);}
body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav ul li:nth-child(1)::after{background: rgba(0,0,0,0.13);}
body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav ul li:nth-child(1) a span{background: url("/resources/img/main/indi_home_bk.svg") center center/cover no-repeat;}
body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav ul li:nth-child(1) a.active span{background: url("/resources/img/main/indi_home_bk_active.svg") center center/cover no-repeat;}

body:not(.fp-viewing-sec3):not(.fp-viewing-sec6) #fp-nav body #fp-nav ul li:not(:nth-child(1)) a::after{color: #000;}
body.fp-viewing-sec3 #fp-nav ul li:not(:nth-child(1)) a::after,
body.fp-viewing-sec6 #fp-nav ul li:not(:nth-child(1)) a::after{color: #fff;}

.fp-viewing-sec7 #fp-nav{display: none;}


/* section01 */
/* #section1 .scroll_box{position: absolute; bottom: 50px; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; z-index: 4; opacity: 0;}
#section1 .scroll_box p{font-size: 12px; font-weight: bold; color: #00173E; letter-spacing: 1.5px; margin-top: 25px;}
#section1 .scroll_box .line{width: 1px; height: 50px; background: rgba(0,23,62,0.2); position: relative;}
#section1 .scroll_box .line span{width: 1px; height: 20px; background: #00173E; position: absolute; top: 0; left: 0; animation: scroll_line 0.8s infinite alternate ease-out;} */

#section1 .popup_btn{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 55px; height: 200px; background: #015152; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; cursor: pointer; z-index: 4; border-radius: 0 20px 20px 0;}
#section1 .popup_btn p{text-transform: uppercase; writing-mode: sideways-lr; font-size: 16px; color: #fff; letter-spacing: 4px;}

#section1{overflow: hidden;}
#section1 .motion_wrap{width: 100%; height: 100%; position: relative;}
#section1 .motion_wrap .bg{width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: scale(1);}
#section1.on .motion_wrap .bg{animation: sec01_bg 20s both ease-in-out;}
@keyframes sec01_bg{
      0%{transform: scale(1);}
      100%{transform: scale(1.2);}
}
#section1 .motion_wrap .bg img{width: 100%; height: 100%; object-fit: cover;}
#section1 .motion_wrap .txt_box{position: absolute; left: 50%; top: 35%; transform: translate(-50%, -50%); text-align: center; white-space: nowrap;}
#section1 .motion_wrap .txt_box h3{font-size: 80px; font-weight: 300; color: #fff; opacity: 0;}
#section1 .motion_wrap .txt_box h3 strong{font-weight: bold;}
#section1 .motion_wrap .txt_box p{font-size: 55px; font-weight: bold; color: #fff; opacity: 0;}

#section1 .main_util{position: absolute; right: 50px; bottom: 50px; display: flex; align-items: center; gap: 10px; z-index: 2;}
#section1 .main_util .open{padding: 17px 19px; background: #B2A8A2; border-radius: 50px; color: #fff; font-size: 16px; font-weight: bold; line-height: 100%;}
#section1 .main_util a{display: block;}
#section1 .main_util a img{display: block;}

#section1.on .motion_wrap .txt_box h3{animation: focus-in-expand 1s 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
#section1.on .motion_wrap .txt_box p{animation: focus-in-expand 1s 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

@keyframes focus-in-expand {
      0% {letter-spacing: -0.5em; filter: blur(12px); opacity: 0;}
      100% {filter: blur(0px); opacity: 1;}
}

/* #section1 .motion_wrap .motion01{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background: #fff;}
#section1 .motion_wrap .motion01 img{position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; width: 100%; max-width: 198px; opacity: 0;}
#section1 .motion_wrap .motion02{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2;}
#section1 .motion_wrap .motion02 .bg{width: 100%; height: 100%; position: absolute; overflow: hidden; transition: all 1s;}
#section1 .motion_wrap .motion02 .bg .dim{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(#fff 50%, transparent); z-index: 1;}
#section1 .motion_wrap .motion02 .bg .img_box{width: 100%; height: 100%; position: absolute;}
#section1 .motion_wrap .motion02 .bg .img_box .bg_dim{position: absolute; width: 100%; height: 400px; background: linear-gradient(0deg,#000 50%, transparent); left: 0; bottom: 0; opacity: 0; z-index: 1; transition: 1s 1s;}
#section1 .motion_wrap .motion02 .bg img{width: 100%; height: auto; object-fit: cover; transform: translateY(40%); position: absolute; bottom: 0;}
#section1 .motion_wrap .motion02 .txt_box{position: relative; z-index: 2;text-align: center; padding-top: 10%;}
#section1 .motion_wrap .motion02 .txt_box .txt{margin-bottom: 35px;}
#section1 .motion_wrap .motion02 .txt_box .txt p{font-size: 24px; line-height: 29px; font-weight: 300; color: #00173E; margin-bottom: 4px; opacity: 0;}
#section1 .motion_wrap .motion02 .txt_box .txt h3{font-size: 30px; line-height: 36px; font-weight: 500; color: #00173E; opacity: 0;}
#section1 .motion_wrap .motion02 .txt_box img{opacity: 0;}

#section1 .motion_wrap .motion03{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
#section1 .motion_wrap .motion03 .bg{width: 100%; height: 100%; position: absolute; overflow: hidden; transition: all 1s;}
#section1 .motion_wrap .motion03 .bg .img_box{width: 100%; height: 100%; position: absolute;}
#section1 .motion_wrap .motion03 .bg .img_box .bg_dim{position: absolute; width: 100%; height: 400px; background: linear-gradient(0deg,#000 50%, transparent); left: 0; bottom: 0; opacity: 0; z-index: 1; transition: 1s;}
#section1 .motion_wrap .motion03 .bg .img_box img{width: 100%; height: 100%; object-fit: cover;} */


/* section01-animation */
@keyframes scroll_line {
      0%{transform: translateY(0);}
      100%{transform: translateY(30px);}
}
@keyframes opacity_ani {
      0%{opacity: 0;}
      100%{opacity: 1;}
}
@keyframes opacity_ani_and {
      0%{opacity: 1;}
      100%{opacity: 0;}
}
@keyframes txt_fadeUp {
      0%{opacity: 0; transform: translateY(50px);}
      100%{opacity: 1; transform: translateY(0);}
}
@keyframes sec1_slideing {
      0%{transform: translateY(40%);}
      100%{transform: translateY(5%);}
}

#section1.ani1 .scroll_box{animation: opacity_ani 1s both ease-in-out;}
#section1.ani1 .motion_wrap .motion01 img{animation: opacity_ani 1s both ease-in-out;}

#section1.ani2 .motion_wrap .motion01{animation: opacity_ani_and 1s both ease-in-out;}

#section1.ani3 .motion_wrap .motion02 .txt_box .txt p{animation: txt_fadeUp 1s both ease-in-out;}
#section1.ani3 .motion_wrap .motion02 .txt_box .txt h3{animation: txt_fadeUp 1s 0.2s both ease-in-out;}
#section1.ani3 .motion_wrap .motion02 .txt_box img{animation: txt_fadeUp 1s 0.4s both ease-in-out;}

#section1.ani4 .motion_wrap .motion02 .bg .dim{animation: opacity_ani_and 1s both ease-in-out;}
#section1.ani4 .motion_wrap .motion02 .bg .img_box .bg_dim{opacity: 0.2;}
#section1.ani4 .motion_wrap .motion02 .bg img{animation: sec1_slideing 1s both ease-in-out;}
#section1.ani4 .popup_btn{opacity: 1; visibility: visible;}
#section1.ani4 .scroll_box p{color: #fff;}
#section1.ani4 .scroll_box .line{background: rgba(255,255,255,0.2);}
#section1.ani4 .scroll_box .line span{background: #fff;}

/* #section1.ani5 .motion_wrap .motion02 .bg{animation: opacity_ani_and 1s both ease-in-out;} */
#section1.ani5 .motion_wrap .motion03 .bg .img_box .bg_dim{opacity: 0.2;}

#section1 .motion_wrap .motion02.bg_on .bg{opacity: 1 !important;}
#section1 .motion_wrap .motion02.bg_off .bg{opacity: 0 !important;}
#section1 .motion_wrap .motion03.bg_on .bg{opacity: 1 !important;}
#section1 .motion_wrap .motion03.bg_off .bg{opacity: 0 !important;}

body.utility_ani .utility_wrap{opacity: 1; visibility: visible;}
body.fp-viewing-sec1 #fp-nav{opacity: 0; visibility: hidden; transition: all 1s;}
body.fp-viewing-sec1.utility_ani #fp-nav{opacity: 1; visibility: visible;}


/* section02 */
#section2{position: relative;}
#section2 .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#section2 .bg img{width: 100%; height: 100%; object-fit: cover;}
#section2 .sec_inner{opacity: 0; transition: all 1s;}
#section2 .sec_inner .sec_box{position: relative; width: 100%; margin: auto; height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 140px; padding-left: 140px;}
#section2 .sec_inner .left_inner{width: 500px;}
#section2 .sec_inner .left_inner > .txt_box{margin-bottom: 65px;}
#section2 .sec_inner .left_inner > .txt_box span{font-size: 20px; font-weight: 700; color: #015152; line-height: 24px; margin-bottom: 30px; display: block;}
#section2 .sec_inner .left_inner > .txt_box p{font-size: 40px; font-weight: 200; color: #015152; margin-bottom: 5px;}
#section2 .sec_inner .left_inner > .txt_box h3{font-size: 50px; font-weight: 700; color: #015152;}
#section2 .sec_inner .left_inner .tab_wrap .type{display: flex; flex-direction: column; align-items: center;}
#section2 .sec_inner .left_inner .tab_wrap .type .img_box ul{position: relative; width: 400px; height: 260px;}
#section2 .sec_inner .left_inner .tab_wrap .type .img_box ul li{position: absolute; top: 0; left: 0; width: 400px; height: 260px; display: flex; align-items: center; justify-content: center; opacity: 0; transition: all 0.5s;}
#section2 .sec_inner .left_inner .tab_wrap .type .img_box ul li.on{opacity: 1;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box{margin-bottom: 40px;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul{position: relative; width: 400px; height: 140px;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li{position: absolute; top: 0; left: 0; right: 0; text-align: center; width: 100%; height: 100%; opacity: 0; transition: all 0.5s;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li.on{opacity: 1;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li h3{font-size: 82px; font-weight: 800; color: #111; line-height: 98px;}
#section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li p{padding: 6px 0; margin: auto; font-size: 16px; font-weight: 300; color: #333; line-height: 100%; border-top: 1px solid #ABB1BD; border-bottom: 1px solid #ABB1BD; width: max-content; text-align: center;}
#section2 .sec_inner .left_inner .tab_wrap .btn_box{width: 100%; display: flex; gap: 10px;}
#section2 .sec_inner .left_inner .tab_wrap .btn_box a{width: 160px; height: 60px; border-radius: 60px; background: #fff; border: 1px solid #ABB1BD; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 300; color: #000; transition: all 0.3s;}
#section2 .sec_inner .left_inner .tab_wrap .btn_box a:hover,
#section2 .sec_inner .left_inner .tab_wrap .btn_box a.on{background: #015152; border: 1px solid #015152; color: #fff; font-weight: 700;}

#section2 .sec_inner .right_inner{max-width: 1500px; margin-top: 90px;}
#section2 .sec_inner .right_inner .cursor{position: fixed; top: 0; left: 0; transform: translate(-50%, -50%); pointer-events: none; display: none; z-index: 1;}
#section2 .sec_inner .right_inner .cursor .cursor_trace{width: 130px; height: 130px; border-radius: 130px; backdrop-filter: blur(8px); background: rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center;}
#section2 .sec_inner .right_inner .cursor span{font-size: 18px; font-weight: 700; color: #fff;}

#section2 .sec_inner .right_inner .swiper-slide{width: 418px; height: 582px; margin-right: 10px; cursor: pointer;}
#section2 .sec_inner .right_inner .swiper-slide .slide_inner::after{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0; transition: all 0.5s;}
#section2 .sec_inner .right_inner .swiper-slide:hover .slide_inner::after{opacity: 0.7;}
#section2 .sec_inner .right_inner .swiper-slide .slide_inner img{display: none;}
#section2 .sec_inner .right_inner .swiper-slide .slide_inner img.on{display: block;}

#section2 .sec_inner .link_box{width: 100%; display: flex; align-items: center; justify-content: space-between; position: relative; padding: 0 50px 0 140px;}
#section2 .sec_inner .link_box a{margin-top: 84px; font-size: 18px; font-weight: 300; color: #000; line-height: 100%; display: inline-flex; align-items: center;}
#section2 .sec_inner .link_box a span{font-weight: 700; margin-right: 5px;}
#section2 .sec_inner .link_box a svg{position: absolute; z-index: 1;}
#section2 .sec_inner .link_box a svg path{transition: all 0.3s;}
#section2 .sec_inner .link_box a .btn_svg{position: relative; width: 10px; height: 14px; margin-left: 34px; display: flex; align-items: center; justify-content: center;}
#section2 .sec_inner .link_box a .btn_svg::after{content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: auto; width: 48px; height: 48px; border-radius: 48px; background: #015152; opacity: 0; transition: all 0.3s; z-index: 0;}
#section2 .sec_inner .link_box a:hover .btn_svg::after{opacity: 1;}
#section2 .sec_inner .link_box a:hover svg path{stroke: #fff;}

/* section02-animation */
#section2.ani1 .sec_inner{opacity: 1;}

/* section03 */
#section3{position: relative;}
#section3 .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#section3 .bg img{width: 100%; height: 100%; object-fit: cover;}
#section3 .sec_inner{max-width: 900px; width: 100%; position: relative; margin: auto; opacity: 0; transition: all 1s;}
#section3.ani1 .sec_inner{opacity: 1;}
#section3 .sec_inner .txt_box{text-align: center; margin-bottom: 50px;}
#section3 .sec_inner .txt_box h3{font-size: 90px; font-weight: bold; color: #fff; margin-bottom: 30px; line-height: 100%;}
#section3 .sec_inner .txt_box p{font-size: 24px; font-weight: 300; color: #fff;}
#section3 .sec_inner .calendaer{margin-bottom: 50px;}
#section3 .sec_inner .calendaer ul{display: grid; grid-template-columns: repeat(3,1fr); gap: 16px;}
#section3 .sec_inner .calendaer ul li{width: 100%; height: 150px; border: 1px solid rgba(255,255,255,0.3); background: rgba(0,0,0,0.3); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; transition: all 0.5s; border-radius: 10px;}
#section3 .sec_inner .calendaer ul li:hover{border: 1px solid #CDA892;}
#section3 .sec_inner .calendaer ul li:first-child{grid-column: span 3;}
#section3 .sec_inner .calendaer ul li h3{font-size: 30px; color: #fff; font-weight: bold; transition: all 0.5s;}
#section3 .sec_inner .calendaer ul li p{font-size: 20px; color: #fff; font-weight: 300; transition: all 0.5s;}
#section3 .sec_inner .calendaer ul li:hover h3{color: #CDA892;}
#section3 .sec_inner .calendaer ul li:hover p{color: #CDA892;}

#section3 .sec_inner .link_box{display: flex; align-items: center; justify-content: center; gap: 20px;}
#section3 .sec_inner .link_box a{padding: 23px 35px; display: flex; align-items: center; justify-content: space-between; background: #fff; border-radius: 100px; width: 250px; height: 60px; color: #000; font-size: 18px; font-weight: 400;}
#section3 .sec_inner .link_box a:last-child{background: #015152; color: #fff;}

/* section3-1 */
#section3-1{position: relative;}
#section3-1 .fp-tableCell{position: relative; vertical-align: baseline;}
#section3-1 .line_box{position: relative; max-width: 1820px; width: 100%; max-height: 230px; height: 100%; margin: 110px auto 0;}
#section3-1 .line_box span{transition: all 1s;}
#section3-1 .line_box span:first-child{width: 0%; height: 1px; background: #000; display: block;}
#section3-1.ani1 .line_box span:first-child{width: 100%;}
#section3-1 .line_box span:last-child{width: 1px; height: 0%; background: #000; display: block; margin-left: 17%; transition-delay: 0.5s;}
#section3-1.ani1 .line_box span:last-child{height: 100%;}
#section3-1 .sec_inner{max-width: 1437px; width: 100%; margin: 50px auto 0; padding-left: 70px; opacity: 0; transition: all 1s;}
#section3-1.ani1 .sec_inner{opacity: 1;}

#section3-1 .sec_inner .swiper{overflow: unset; height: 560px;}
#section3-1 .sec_inner .swiper-slide{display: flex; gap: 90px;}
#section3-1 .sec_inner .tit_box{margin-bottom: 125px;}
#section3-1 .sec_inner .tit_box h3{font-size: 90px; font-weight: bold; color: #111; margin-bottom: 40px; text-transform: uppercase; line-height: 100%;}
#section3-1 .sec_inner .tit_box p{font-size: 20px; font-weight: 300; color: #111;}
#section3-1 .sec_inner .tit_box p strong{font-weight: bold;}
#section3-1 .sec_inner .txt_box span{width: 80px; height: 30px; display: flex; align-items: center; justify-content: center; background: #015152; color: #fff; font-size: 18px; font-weight: bold; border-radius: 5px; margin-bottom: 15px;}
#section3-1 .sec_inner .txt_box p{font-size: 16px; font-weight: 300; color: #111;}
#section3-1 .sec_inner .img_box{max-width: 883px; width: 100%; margin-top: 20px; cursor: pointer;}

#section3-1 .sec_inner .swiper-pagination{position: relative; bottom: 0; top: 0; display: flex; align-items: center; justify-content: flex-start; gap: 10px; margin-top: 55px;}
#section3-1 .sec_inner .swiper-pagination-bullet{width: 10px; height: 10px; border-radius: 10px; background: #D9D9D9; margin: 0; opacity: 1;}
#section3-1 .sec_inner .swiper-pagination-bullet-active{background: #000;}

/* section04 */
#section4 .slide_inner{width: 100%; height: 100%; position: relative; display: flex; justify-content: space-between;}
#section4 .swiper{width: 100%; height: 100%; overflow: unset;}
#section4 .left_box{padding-top: 80px; position: relative; z-index: 2;}
#section4 .num_box{margin-left: 135px; margin-bottom: 80px; width: 82px; height: 96px; position: relative; box-sizing: content-box;}
#section4 .num_box p{font-size: 54px; font-family: 'Century Gothic'; color: #111; font-weight: 300; position: absolute; top: 0; left: 0;}
#section4 .num_box p:last-of-type{opacity: 0.2; top: unset; left: unset; bottom: 0; right: 0;}
#section4 .num_box span{width: 1px; height: 70px; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(30deg); background: #111; opacity: 0.2;}
#section4 .silde_tit{height: 344px; position: relative;}
#section4 .silde_tit h3{font-size: 160px; font-family: 'Paperlogy'; font-weight: 500; text-transform: uppercase; position: absolute; white-space: nowrap; color: transparent; animation: sec04_tit 3s infinite alternate linear; line-height: 100%; letter-spacing: -0.5px;}
#section4 .swiper-slide{padding: 90px 0;}
#section4 .swiper-slide01 .silde_tit h3{background: linear-gradient(140deg,#003E82 20%, #7092B7 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide02 .silde_tit h3{background: linear-gradient(140deg,#A7CBF0 20%, #E1E4F1 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide03 .silde_tit h3{background: linear-gradient(140deg,#312833 20%, #70586C 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide04 .silde_tit h3{background: linear-gradient(140deg,#D56248 20%, #F0B7AC 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide05 .silde_tit h3{background: linear-gradient(140deg,#234A1B 20%, #82AC77 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide06 .silde_tit h3{background: linear-gradient(140deg,#2A0D06 20%, #734C3E 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .swiper-slide07 .silde_tit h3{background: linear-gradient(140deg,#81572E 20%, #EACE99 50%); background-size: 100%; background-clip: text; -webkit-background-clip: text;}

#section4 .left_box .txt_box{padding-left: 135px; margin-top: 20px; width: 800px;}
#section4 .left_box .txt_box p{font-size: 24px; color: #3c3c3c; font-weight: 300; line-height: 36px; height: 36px; position: relative; overflow: hidden;}
#section4 .left_box .txt_box h3{font-size: 26px; color: #3c3c3c; font-weight: 700; line-height: 36px; margin-bottom: 45px; height: 36px; position: relative; overflow: hidden;}
#section4 .left_box .txt_box > span{font-size: 14px; color: #111; font-weight: 300; display: block; height: 20px; position: relative; overflow: hidden;}
#section4 .left_box .txt_box > span strong{font-weight: 700;}

#section4 .left_box .txt_box p > span{position: absolute; top: 0; left: 0; transform: translateY(36px); opacity: 0; transition: all 1s 0.5s;}
#section4 .left_box .txt_box h3 > span{position: absolute; top: 0; left: 0; transform: translateY(36px); opacity: 0; transition: all 1s 0.7s;}
#section4 .left_box .txt_box > span > span{position: absolute; top: 0; left: 0; transform: translateY(14px); opacity: 0; transition: all 1s 0.9s;}

#section4 .right_box{width: 100%; max-width: 800px; padding-right: 160px; box-sizing: content-box; position: relative; z-index: 2; overflow: hidden;}
#section4 .right_box .img_box{width: 100%; height: 100%; clip-path: polygon(100% 0%, 100% 0, 100% 100%, 100% 100%); transition: all 1.5s 0.5s; cursor: pointer;}
#section4 .right_box .img_box img{width: 100%; height: 100%; object-fit: cover;}

#section4 .slide_inner .cursor{position: fixed; top: 0; left: 0; transform: translate(-50%, -50%); pointer-events: none; display: none; z-index: 1;}
#section4 .slide_inner .cursor .cursor_trace{width: 540px; height: 540px; border-radius: 540px; background: radial-gradient(#A8C99D 0, transparent 70%); opacity: 0.5;}
#section4 .swiper-slide01 .cursor .cursor_trace{background: radial-gradient(#7DA0C7 0, transparent 70%);}
#section4 .swiper-slide02 .cursor .cursor_trace{background: radial-gradient(#7DA0C7 0, transparent 70%);}
#section4 .swiper-slide03 .cursor .cursor_trace{background: radial-gradient(#625763 0, transparent 70%);}
#section4 .swiper-slide04 .cursor .cursor_trace{background: radial-gradient(#F5936F 0, transparent 70%);}
#section4 .swiper-slide05 .cursor .cursor_trace{background: radial-gradient(#98CCA7 0, transparent 70%);}
#section4 .swiper-slide06 .cursor .cursor_trace{background: radial-gradient(#A2796F 0, transparent 70%);}
#section4 .swiper-slide07 .cursor .cursor_trace{background: radial-gradient(#E9B57C 0, transparent 70%);}

/* section04-animation */
@keyframes sec04_tit{
      0%{background-size: 100%;}
      100%{background-size: 300%;}
}

#section4 .swiper-slide.open .left_box .txt_box p > span{transform: translateY(0); opacity: 1;}
#section4 .swiper-slide.open .left_box .txt_box h3 > span{transform: translateY(0); opacity: 1;}
#section4 .swiper-slide.open .left_box .txt_box > span > span{transform: translateY(0); opacity: 1;}
#section4 .swiper-slide.open .right_box .img_box{clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0% 100%);}


/* section05 */
#section5 .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#section5 .bg img{width: 100%; height: 100%; object-fit: cover;}
#section5 .sec_inner{width: 100%; max-width: 1290px; height: 100%; position: relative; margin: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; transition: all 1s;}
#section5 .tit_box{margin-bottom: 50px; width: 100%; text-align: center;}
#section5 .tit_box h3{font-size: 40px; font-weight: bold; color: #fff; letter-spacing: 2px;}
#section5 .map_box{width: 100%; max-width: 800px;}
#section5 .map_box .map{width: 100%; max-width: 613px; margin: 0 auto 34px;}
#section5 .map_box .map img{width: 100%;}
#section5 .map_box ul{display: grid;grid-template-columns: repeat(2, 1fr); gap: 15px;}
#section5 .map_box ul li .info_box{text-align: center;}
#section5 .map_box ul li .info_box h3{font-size: 22px; font-weight: 600; color: #fff;}
#section5 .map_box ul li .info_box p{font-size: 20px; font-weight: 300; color: #fff;}
#section5 .map_box ul li .info_box .icon_box{display: flex; gap: 10px; align-items: center; justify-content: center; margin-top: 22px;}

/* section05-animation */
#section5.ani1 .sec_inner{opacity: 1;}


/* 반응형 */
@media screen and (max-height: 1080px){
      #section3-1 .line_box{height: 100px;}
}
@media screen and (max-height: 1035px) {
      #section1 .motion_wrap .motion02 .txt_box .txt p{font-size: 20px; line-height: 25px;}
      #section1 .motion_wrap .motion02 .txt_box .txt h3{font-size: 26px; line-height: 32px;}
      #section1 .motion_wrap .motion02 .txt_box img{width: 100%; max-width: 470px;}
      @keyframes sec1_slideing {
            0%{transform: translateY(40%);}
            100%{transform: translateY(10%);}
      }
      #section2 .sec_inner .left_inner > .txt_box h3,
      #section2 .sec_inner .left_inner > .txt_box p{line-height: 100%;}
      #section2 .sec_inner a.link_btn{margin-top: 20px;}
      
      #section4 .silde_tit h3{font-size: 130px;}
      #section4 .swiper-slide{padding: 0; height: 80%; margin: auto;}
      #section2 .sec_inner .right_inner{margin: 0;}

      #section6.ani1 .bg{transform: translateY(20%) scale(0.55);}
      #section6.ani2 .bg {left: 0;transform: translateY(0) scale(1);}
}
@media screen and (max-height: 900px){
      #section1 .motion_wrap .motion03 .bg .img_box{height: 150%;}
      @keyframes sec1_slideing {
            0%{transform: translateY(40%);}
            100%{transform: translateY(15%);}
      }

      #section2 .sec_inner .left_inner > .txt_box{margin-bottom: 30px;}
      #section2 .sec_inner .left_inner .tab_wrap .type .txt_box{margin-bottom: 20px;}
      #section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li h3 {font-size: 60px; line-height: 76px;}

      #section3 .sec_inner .calendaer ul li{height: 100px;}

      #section3-1 .line_box{margin: 50px auto 0;}
      #section3-1 .sec_inner .swiper{height: 490px;}
      #section3-1 .sec_inner .tit_box{margin-bottom: 60px;}

      #section4 .left_box{padding-top: 0;}
      #section4 .silde_tit{height: 260px;}
      #section4 .right_box{max-height: 700px;}

      #section5 .tit_box{margin-bottom: 30px;}
      #section5 .tit_box p:nth-of-type(1){margin-bottom: 30px;}

      #section6.ani1 .bg{transform: translateY(30%) scale(0.55);}
      #section6.ani2 .bg {left: 0;transform: translateY(0) scale(1);}
}

@media screen and (max-width: 1700px){
      #section3-1 .sec_inner .img_box{width: 100%; max-width: 600px; display: flex; align-items: center; justify-content: flex-end;}
      #section3-1 .sec_inner .img_box img{width: 100%;}

      #section4 .silde_tit{height: 260px;}
      #section4 .silde_tit h3{font-size: 130px;}
      #section4 .right_box{max-width: 600px;}
}
@media screen and (max-width: 1500px){
      #section2 .sec_inner .sec_box{padding-left: 50px;}
      #section2 .sec_inner .link_box{padding: 0 50px;}

      #section3-1 .sec_inner .tit_box h3{font-size: 70px;}

      #section5 .sec_inner{max-width: 1000px;}
}
@media screen and (max-width: 1400px){
      #section4 .silde_tit{height: 190px;}
      #section4 .silde_tit h3{font-size: 100px;}
      #section4 .swiper-slide01 .silde_tit h3 span{padding-left: 190px;}
      #section4 .swiper-slide02 .silde_tit h3 span{padding-left: 315px;}
      #section4 .swiper-slide03 .silde_tit h3 span{padding-left: 205px;}
      #section4 .swiper-slide04 .silde_tit h3 span{padding-left: 210px;}
      #section4 .swiper-slide05 .silde_tit h3 span{padding-left: 140px;}
      #section4 .swiper-slide06 .silde_tit h3 span{padding-left: 200px;}
}
@media screen and (max-width: 1300px){
      #section2 .sec_inner{padding-left: 60px; gap: 60px;}

      #section3-1 .sec_inner .img_box{max-width: 500px;}

      #section4 .num_box{margin-left: 80px;}
      #section4 .left_box .txt_box{padding-left: 80px; width: 680px;}
}
@media screen and (max-width: 1200px){
      #section1 .motion_wrap .txt_box h3{font-size: 50px;}
      #section1 .motion_wrap .txt_box p{font-size: 35px;}

      #section4 .left_box .txt_box{width: 580px;}
      #section4 .right_box{padding-right: 80px;}

      #section5 .sec_inner{max-width: 800px;}
}


/* 모바일 */
@media screen and (max-width: 1024px) {
      .pc-only{display: none;}
      .m-only{display: block;}
      
      #fullpage section{width: 100%; height: 100dvh; position: relative;}

      #section1{width: 100%; height: 100dvh;}
      #section1 .popup_btn{display: none;}
      #section1 .motion_wrap .motion02 .txt_box{padding-top: 260px; transition: all 2s;}
      #section1 .motion_wrap .motion02 .bg img{content: url('/resources/img/main/mo_sec01_motion02_bg.jpg');}
      @keyframes sec1_slideing {
            0%{transform: translateY(40%);}
            100%{transform: translateY(0%);}
      }

      #section1.ani3_2 .motion_wrap .motion02 .txt_box{padding-top: 140px;}

      #fullpage section#section2{height: auto;}
      #section2.open .sec_inner{opacity: 1;}
      #section2.open .sec_inner .sec_box{opacity: 1;}
      #section2 .sec_inner{padding: 130px 0 190px;}
      #section2 .sec_inner .sec_box{flex-direction: column; padding: 0 25px; gap: 0;}
      #section2 .sec_inner .left_inner > .tab_wrap{display: flex; flex-direction: column-reverse; gap: 20px;}
      #section2 .sec_inner .right_inner{max-width: 500px; margin-top: 36px;}
      #section2 .sec_inner .right_inner .swiper{overflow: unset}

      #section2 .sec_inner .link_box{padding: 0 25px; margin: 50px auto 0;}
      #section2 .sec_inner .left_inner .link_box{justify-content: flex-start;}
      #section2 .sec_inner .right_inner .link_box{justify-content: flex-end;}
      #section2 .sec_inner a.link_btn{margin: 0 !important; width: 210px; position: relative; pointer-events: all;}
      #section2 .sec_inner a.link_btn span{margin-right: 5px;}
      #section2 .sec_inner a.link_btn .btn_svg{position: absolute; right: 0;}
      #section2 .sec_inner a.link_btn .btn_svg::after{display: none;}
      #section2 .sec_inner a.link_btn:hover svg path{stroke: black;}
      #section2 .sec_inner .left_inner a.link_btn::after{content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background: #ABB1BD;}
      #section2 .sec_inner .right_inner .cursor{display: none !important;}
      #section2 .sec_inner .right_inner .swiper-slide .slide_inner::after{display: none;}

      #fullpage section#section3{height: auto;}
      #section3 .sec_inner{padding: 100px 25px; transition: all 1s; opacity: 0;}
      #section3.open .sec_inner{opacity: 1;}
      #section3 .sec_inner .txt_box{margin-bottom: 20px;}
      #section3 .sec_inner .txt_box h3{font-size: 50px; margin-bottom: 10px;}
      #section3 .sec_inner .txt_box p{font-size: 20px;}
      #section3 .sec_inner .calendaer ul{gap: 10px;}
      #section3 .sec_inner .calendaer ul li h3{font-size: 20px;}
      #section3 .sec_inner .calendaer ul li p{font-size: 15px;}

      #fullpage section#section3-1{height: auto;}
      #section3-1 .sec_inner{padding: 0 25px 100px; transition: all 1s; opacity: 0; transform: unset;}
      #section3-1.open .sec_inner{opacity: 1;}
      #section3-1 .line_box{top: 0; position: relative; margin: 80px 0 30px;}
      #section3-1.open .line_box span:first-child{width: 100%;}
      #section3-1.open .line_box span:last-child{height: 100%;}
      #section3-1 .sec_inner .swiper{height: auto;}
      #section3-1 .sec_inner .swiper-slide {gap: 20px; flex-direction: column; align-items: center;}
      #section3-1 .sec_inner .tit_box{margin-bottom: 30px;}
      #section3-1 .sec_inner .tit_box h3{font-size: 60px; margin-bottom: 20px;}
      #section3-1 .sec_inner .tit_box p{font-size: 20px;}
      #section3-1 .sec_inner .txt_box h3{margin-bottom: 0;}
      #section3-1 .sec_inner .img_box{width: 352px; height: 250px; align-items: center; justify-content: center; }
      #section3-1 .sec_inner .swiper-slide01 .img_box{width: 300px;}
      #section3-1 .sec_inner .swiper-pagination{margin: 50px auto 0; max-width: 360px;}

      
      #fullpage section#section4{height: auto;}
      #section4 .slide_inner{flex-direction: column; gap: 20px;}
      #section4 .swiper-slide{padding-bottom: 0; overflow: hidden;}
      #section4 .left_box{padding: 90px 25px 0; width: 100%; margin: auto;}
      #section4 .num_box {margin-left: 0; margin-bottom: 20px; padding: 0 20px;; position:relative;}
      #section4 .num_box::before,
      #section4 .num_box::after {content:''; position:absolute; top: 50%;; width:8px; height:13px; background:url('/resources/img/main/sec04_arrow.png') 0 0 no-repeat; background-size:100% 100%;;}
      #section4 .num_box::before {left:0;}
      #section4 .num_box::after {right:0; transform: rotate(180deg);}
      #section4 .num_box p {left:20px;}
      #section4 .num_box p:last-of-type {right:20px;}
      #section4 .left_box .txt_box{padding-left: 0;}
      #section4 .right_box{padding: 0; width: 100%; max-width: 100%;}
      #section4 .swiper-pagination{bottom:436px; text-align:right; padding: 0 25px;; display: none;}
      #section4 .swiper-pagination-bullet{background: #000;}
      #section4 .silde_tit{height: 54px; margin-bottom: 70px;}
      #section4 .silde_tit h3{font-size: 54px;}

      #section4 .slide_inner .cursor{display: block !important; animation: sec04_cursor 30s infinite alternate linear;}
      @keyframes sec04_cursor {
            0%{transform: translate(0,50%);}
            33%{transform: translate(100%,50%);}
            66%{transform: translate(100%,-40%);}
            100%{transform: translate(0%,-40%);}
      }
      
      #fullpage section#section5{height: auto;}
      #section5 .sec_inner{padding: 100px 25px;}
      #section5.open .sec_inner{opacity: 1;}
      #section5 .map_box ul{display: flex; flex-direction: column; align-items: center; gap: 50px;}
      #section5 .map_box ul li{width: 100%;}

      #fullpage section#section6{height: auto;}

}

@media screen and (max-width: 760px){
      
      #section1 .main_util{display: none;}
      #section1 .motion_wrap .bg{background: url("/resources/img/main/m_sec01.jpg") center bottom/cover no-repeat;}
      #section1 .motion_wrap .bg img{display: none;}
      #section1 .motion_wrap .txt_box{white-space: unset; padding: 0 40px;}
      #section1 .motion_wrap .txt_box h3 {font-size: 50px; line-height: 65px; margin-bottom: 45px;}
      #section1 .motion_wrap .txt_box p {font-size: 30px;}
      
      #section2 .sec_inner .right_inner .swiper-slide{width: 209px; height: 291px;}
      #section2 .sec_inner .right_inner .swiper-slide img{width: 100%;}

      #section3 .sec_inner .txt_box {margin-bottom: 40px;}
      #section3 .sec_inner .txt_box h3 {font-size: 60px; margin-bottom: 20px;}
      #section3 .sec_inner .txt_box p {font-size: 16px;}
      #section3 .sec_inner .calendaer ul{grid-template-columns: repeat(2, 1fr);}
      #section3 .sec_inner .calendaer ul li:first-child {grid-column: span 2;}
      #section3 .sec_inner .calendaer ul li h3 {font-size: 24px; line-height: 100%; margin-bottom: 10px;}
      #section3 .sec_inner .calendaer ul li p {font-size: 16px;}

      #section3-1 .line_box{padding: 0 20px;}
      #section3-1 .line_box span:last-child{margin-left: 10%;}
      #section3-1 .sec_inner .tit_box {margin-bottom: 64px;}
      #section3-1 .sec_inner .tit_box p {font-size: 16px;}
      #section3-1 .sec_inner .swiper-pagination{margin: 55px auto 0;}

      #fullpage section#section4{height: 100vh;}
      #section4 .swiper-slide{height: 100%;}
      #section4 .num_box{width: 55px; height: 53px; margin-bottom: 16px;}
      #section4 .num_box p{font-size: 34px;}
      #section4 .num_box span{height: 50px;}
      #section4 .left_box{width: 100%;}
      #section4 .silde_tit{height: 100px;}
      #section4 .silde_tit h3{font-size: 54px;}
      #section4 .left_box .txt_box p{font-size: 17px; line-height: 26px; height: 26px;}
      #section4 .left_box .txt_box h3{font-size: 19px; line-height: 29px; height: 29px; margin-bottom: 30px;}
      #section4 .right_box{min-height: 442px;}
      #section4 .swiper-slide01 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide01.jpg");}
      #section4 .swiper-slide02 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide02.jpg");}
      #section4 .swiper-slide03 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide03.jpg");}
      #section4 .swiper-slide04 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide04.jpg");}
      #section4 .swiper-slide05 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide05.jpg");}
      #section4 .swiper-slide06 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide06.jpg");}
      #section4 .swiper-slide07 .right_box .img_box img{content: url("/resources/img/main/m_sec04_slide07.jpg");}

      #fullpage section#section5{height: auto;}
      #section5 .sec_inner{justify-content: flex-start; padding: 120px 30px; max-width: 100%;}
      #section5 .tit_box p:nth-of-type(1){font-size: 18px; margin-bottom: 40px;}
      #section5 .tit_box h3{font-size: 28px;}
      #section5 .tit_box p:nth-of-type(2){font-size: 14px;}
      #section5 .tit_box p:nth-of-type(2) span{margin: 0 0 5px; display: block;}
      #section5 .map_box ul {gap: 45px; flex-direction: column; align-items: center; display: flex;}
      #section5 .map_box ul li{width: 100%;}
      #section5 .map_box ul li .map{margin-bottom: 24px;}
      #section5 .map_box ul li .info_box h3{font-size: 19px; margin-bottom: 5px;}
      #section5 .map_box ul li .info_box p{font-size: 17px;}

      #fullpage section#section6{height: auto;}
}
@media screen and (max-width: 540px) {
      #section1 .motion_wrap .motion02 .txt_box .txt p{font-size: 18px; line-height: 23px;}
      #section1 .motion_wrap .motion02 .txt_box .txt h3 {font-size: 22px; line-height: 26px;}
      #section1 .motion_wrap .motion02 .txt_box img {width: 100%; max-width: 285px;}

      #section2 .sec_inner{align-items: unset;}
      #section2 .sec_inner .left_inner{width: 100%; padding: 0 30px;}
      #section2 .sec_inner .left_inner > .txt_box span{font-size: 18px; line-height: 22px;}
      #section2 .sec_inner .left_inner > .txt_box p{font-size: 18px; line-height: 22px;}
      #section2 .sec_inner .left_inner > .txt_box h3{font-size: 22px; line-height: 28px;}
      #section2 .sec_inner .left_inner .tab_wrap .btn_box a {width: unset; height: unset; padding: 20px 34px;}
      #section2 .sec_inner .left_inner > .tab_wrap{align-items: center;}
      #section2 .sec_inner .left_inner > .tab_wrap .img_box{margin: 20px 0;}
      #section2 .sec_inner .left_inner .tab_wrap .btn_box{justify-content: center;}
      #section2 .sec_inner .left_inner .tab_wrap .type .img_box ul{width: 300px; height: 194px;}
      #section2 .sec_inner .left_inner .tab_wrap .type .img_box ul li{width: 100%; height: 100%;}
      #section2 .sec_inner .left_inner .tab_wrap .type .img_box ul li img{width: 100%;}
      #section2 .sec_inner .left_inner .tab_wrap .type .txt_box ul li h3 {font-size: 64px; line-height: 80px;}
      #section2 .sec_inner .link_box{flex-direction: column; align-items: flex-start; gap: 20px;}

      #section3 .sec_inner .link_box{flex-direction: column; gap: 10px;}

      #section4 .left_box .txt_box{width: 100%;}

      #section5 .tit_box p:nth-of-type(2){font-size: 16px;}
}
@media screen and (max-width: 420px){      
      #section2 .sec_inner .left_inner > .txt_box h3 {font-size: 20px; line-height: 26px;}
      #section2 .sec_inner .left_inner .tab_wrap .btn_box a{padding: 16px 30px;}

      #section4 .silde_tit{height: 90px;}
      #section4 .silde_tit h3 {font-size: 46px;}
      #section4 .left_box .txt_box h3 {font-size: 16px; line-height: 26px; height: 26px;}
      #section4 .slide_inner .cursor .cursor_trace{width: 300px; height: 300px;}
      @keyframes sec04_cursor {
            0%{transform: translate(0,50%);}
            33%{transform: translate(80%,50%);}
            66%{transform: translate(80%,-40%);}
            100%{transform: translate(0%,-40%);}
      }

      #section6 .sec_inner p{font-size: 14px; line-height: 20px; height: 40px;}
      #section6 .sec_inner h3 {font-size: 40px; line-height: 50px; height: 150px;}
}