@charset "UTF-8";@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');@font-face {font-family:'GongGothicBold';src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicBold.woff') format('woff');font-weight:700;} 
/* #header {position:fixed!important;} */
#container {overflow:hidden;position:relative;max-width: 1920px;margin: 0 auto;}
html {font-size: 62.5%;scroll-behavior:smooth; }
/* 폰트사이즈 퍼센트는 rem을 쉽게사용하기 위해서 적용. 추후 미디어쿼리에 사용하기 쉽다. */
/* 공용 s */
.sr-only,
.sr-only:before,
.sr-only:after {width:1px;height:1px;opacity:0;color:rgba(0,0,0,0);position:absolute;top:-9999em;left:-9999em;text-indent:-9999em } 
.footer .btm_footer {background-color:#fff;} 
.clear {clear:both;height:0;} 
.clearfix:after {content:'';display:block;clear:both } 
section {position:relative }
/* 있어야 화면 줄었을때 aos 작동함 */
@media (max-width:1600px) {body {overflow:initial !important;} html {font-size: 50%;} }
@media (min-width:2500px) {html{font-size:65%}}
/* 공용 e */


/* css 0808 (S)*/
.gon {font-family:'GongGothicMedium';} 
.pre {font-family:'Pretendard';} 
.se_df {display:flex;justify-content:center;font-size: 2.4rem;} 
.home-logo {display:flex;justify-content:space-between;flex-direction:row;align-items:flex-start;} 
.green {color:#0d9979;font-weight:800;} 
.san_green {color:#375e30 } 
.fting {position:fixed;z-index:9999;right:2%;top:17%;cursor:pointer;} 
.scrollElement {position:absolute;left:0;width:10px;height:100%;} 

.fw-800{font-weight: 800;border: none !important;}

/* se1 */
.se1 {background:url(../images/se1_bg.png) no-repeat 100%/cover;} 
.in_box {height:90.81527347781218vh;width:65.165%;display: flex;flex-direction: row;align-items: center;} 
.in_box>div:first-child {margin-top:0px;font-weight: 500;} 
.in_box>div:first-child>img:first-child{margin-top: -4.334365325077399vh;}
.in_box>div:first-child>img:last-child{margin-left: 110px;margin-top: -90px;}
.in_box>div:last-child {font-size: 2.5rem;font-weight: 500;margin-bottom: 9vh;} 
.se1_main_text{margin-bottom: 11vh;}
.se1_sub_text{margin-bottom: 4vh;}
/* se2 */
.se2 {background-color:#ffffff;background-attachment:fixed;z-index:1;} 
.in_box2 {position:relative;height:35.08771929824561vh;width:65.165%;display: flex;justify-content: center;flex-direction: column;align-items: center;font-size: 2.4rem;} 
.in_box2>div{text-align: center;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.in_box2>div>p{margin-top: 60px;letter-spacing: 0.5rem;}    
/* se3 */
.se3 {background:url(../images/se3_bg.png)no-repeat 100%/cover;display:flex;align-items:center;z-index:0;z-index:0;} 
.in_box3 {position:relative;height:81.01135190918473vh;width:100%;} 
/* se4 */
.se4 {background-color: #ffffff;background-position:center;} 
.in_box4 {position:relative;height:45.92363261093911vh;width:65.165%;display:flex;justify-content:center;align-items:center;font-size: 2.3rem;} 
.in_box4>div{text-align: center;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.in_box4>div>p{line-height: 1.8;font-weight: 400;margin-bottom: 4rem;margin-top: 3rem;}
.in_box4>div>p>span{letter-spacing: 0.5rem;}
/* se5 */
.se5 {background-color: #13a483;} 
.in_box5 {position:relative;height:77.39938080495356vh;width:65.165%;display: flex;justify-content: center;align-items: center;flex-direction: column;margin-top: -2vh;} 
.in_box5>p{font-size: 5rem;font-weight: 800;color: #fff;}
.video_out_box{display: flex;flex-direction: row;align-content: center;align-items: center;width: 100%;justify-content: space-evenly;margin-top: 7vh;}
.video_width{width:23.73581011351909vh;box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);border-radius: 5px;}
.video_out_box>div{position: relative;position: relative;display: flex;align-items: center;flex-direction: column;}
.emog{position: absolute;margin-top: 1vh;width: 17.54385964912281vh;}
.emog2{position: absolute;margin-top: 1vh;width: 20.63983488132095vh;}
.id_img{position: absolute;bottom: 3vh;left: 2vh;width: 15.2734778121775vh;}
/* se6 */
.se6 {background-color: #eeeee4;}
.in_box6 {position:relative;height:159.9587203302374vh;width:65.165%;font-size: 4.6rem;text-align: center;font-weight: 400;} 
.in_box6>div{height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.in_box6>div>p{line-height: 6.5rem;margin-top: -1vh;}
.in_box6>div>p>span{font-size: 5rem;}
.se6_img_1{margin: 5.5rem;}
.img_he{height: 57.27554179566563vh;}
/* se7 */
.se7 {background-color:#13a483} 
.in_box7 {position: relative;height:71.7234262125903vh;width:65.165%;} 
.in_box7>div:first-child{display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;}
.in_box7>div:first-child>p{line-height: 6.5rem;font-size: 4.6rem;color: #fff;margin-top: 8rem;}
.in_box7>div:first-child>p>span{font-size: 5rem;font-weight: 800;}
.se7_ye{color:#fef4b4;}
.se7_ani{display: flex;flex-direction: row;justify-content: center;margin: 8rem 0;align-items:flex-start;}
.ani_outbox{color: #fff;font-size: 1.9rem;margin: 1rem 0rem;}
.ani_outbox>p:first-child{font-weight: 400;}
.ani_outbox>p:last-child{font-weight: 500;line-height: 1.5em;}
.ani_box{display: flex;flex-direction: row;justify-content: center;margin: 2rem 0;width:23.91331269349845vh;height: 10.31991744066047vh;}
.ani_box>p:first-child{font-size: 10rem;font-weight: 800;}
.ani_box>p:last-child{font-size: 4rem;line-height: 65px;font-weight: 800;}
.ani_con_4_text{text-align: left;line-height: 40px !important;font-size: 2.9rem !important;margin-top: 9px;margin-left: 24vh;position: absolute;}
.ani_box_3{margin-bottom: 2.05rem;}
.se7_line{margin:0 3.5rem;height: 31.47574819401445vh;}
/* se8 */
.se8 {background-color: #fff;} 
.in_box8 {height:71.20743034055728vh;width:65.165%;text-align: center;font-size: 4.6rem;} 
.in_box8>div{height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.in_box8>div>p{line-height: 6.5rem;}
.in_box8>div>p>span{font-size: 5rem;}
.se8_img{display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 9rem;}
.se8_con_img{margin: 0;height: 28.58617131062951vh;}
.se8_line{margin:0 4rem;height: 31.47574819401445vh;}
.set_con_img{margin-top: -1rem;}
/* se9 */
.se9 {background-color: #eeeee4;} 
.in_box9 {height:137.2549019607843vh;width:65.165%;text-align: center;font-size: 4.6rem;}  
.in_box9>div{height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.in_box9>div>p{line-height: 6.5rem;}
.in_box9>div>p>span{font-size: 5rem;}
.hover_out_box{display: flex;flex-direction: row;width: 123.8390092879257vh;justify-content: space-between;flex-wrap: wrap;margin: 6rem;}
.hover_out_box>div{width:40.76367389060888vh;position: relative;margin-top: 0.8vh;overflow: hidden;}
.hover_out_box>div>img{width:40.76367389060888vh;cursor: pointer;}
.se9_img_on{position: absolute;left: 0;opacity: 0;width:100%}
.hover_out_box>div:hover>a>.se9_img_on{opacity: 1;transition: all 0.5s;width:100%;}
/* se10 */
.se10 {background-color: #13a483;} 
.in_box10 {height:125.3869969040248vh;width:65.165%;} 
.in_box10>div:first-child{display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;}
.in_box10>div:first-child>p{line-height: 6.5rem;font-size: 4.6rem;color: #fff;margin-top: 8rem;}
.in_box10>div:first-child>p>span{font-size: 5rem;font-weight: 800;}
.se10_sub_text{text-align: center;color: #fff;display: flex;flex-direction: column;align-items: center;}
.se10_sub_p{line-height: 1.6;padding-bottom: 2vh;font-size: 2.2rem;}
.se10_sub_period{font-size:2.1rem;color: #fff5b5;text-align: left;margin-top: 1.5vh;margin-left: 5vh;}
.se10_sub_period>span{font-size: 2rem;border: 1px solid #fff5b5;padding:0.1rem 0.7rem;border-radius: 4px;margin-right: 1vh;}
.se10_img_bg{background: url(../images/se10_img.png) no-repeat 100%/cover;width: 94.53044375644995vh;height: 59.44272445820433vh;position: relative;}
.se10_img_bg>div{position: absolute;cursor: pointer;}
.se10_img_bg>div>img{opacity: 0;}
.se10_img_bg>div:nth-child(1){width:30vh;height: 18vh;bottom:12vh;left: 9vh;}
.se10_img_bg>div>img{width:13.20949432404541vh}
.se10_img_bg>div:nth-child(1):hover>img{opacity: 1;}
.se10_img_bg>div:nth-child(2){width: 17vh;height: 18vh;bottom: 27vh;left: 20vh;}
.se10_img_bg>div:nth-child(2):hover>img{opacity: 1;}
.se10_img_bg>div:nth-child(3){width: 19vh;height: 29vh;bottom: 14vh;left: 40vh;}
.se10_img_bg>div:nth-child(3):hover>img{opacity: 1;}
.se10_img_bg>div:nth-child(4){width: 12vh;height: 12vh;bottom: 15vh;left: 58vh;}
.se10_img_bg>div:nth-child(4):hover>img{opacity: 1;}
.se10_img_bg>div:nth-child(5){width: 26vh;height: 29vh;bottom: 25vh;left: 58vh;}
.se10_img_bg>div:nth-child(5):hover>img{opacity: 1;}
.se10_img_bg>p{position: absolute;width: 100%;bottom: 7%;left: 50%;transform: translateX(-50%);font-size: 1.6rem;color: #7f796f;font-weight: 400;}
.se10_btn{width:194px}
.se10_sub_text>div {position: relative;margin-top: 2rem;}
.se10_sub_text>div:nth-child(1) {margin-top: 3.5rem;}
.se10_sub_text>div:nth-child(2) {margin-top: 3rem;}
.se10_sub_text>div:nth-child(4) {margin-top: 4rem;}
.se10_btn{position: absolute;right: 50%;transform: translateX(280%);width:14.34468524251806vh;margin-top: 3vh;}
.se10_btn:hover{opacity: 0.5;transition: all 0.4s;}
/* .se10_text_img{width: 49.53560371517028vh;} */
.star_text{font-size: 1.8rem;font-weight: 400;margin-top: 2rem;letter-spacing: -0.5px;color:#c7e1db}
/* 슬라이드 css */
.swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }

  .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .swiper-button-next{right: 18% !important;color: #000 !important;font-weight: 600;}
  .swiper-button-prev{left: 18% !important; color: #000 !important;font-weight: 600;}
  .swiper-button-next:hover, .swiper-button-prev:hover{opacity: 0.2 !important;transition: all 0.2s;}
  .sw_sub_text_df{position: absolute;width: auto !important;height: auto !important;right: 19%;bottom: 9%;opacity: 0;transition: all 1s;}
  .sw_sub_text_on{opacity: 1 !important;}

/* 버튼 css */
.button {
	pointer-events: auto;
	cursor: pointer;
	background: #e7e7e7;
	border: none;
	padding: 1.5rem 3rem;
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	position: relative;
	display: inline-block;
}
.button::before,
.button::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@keyframes MoveUpInitial {
	to {
		transform: translate3d(0,-105%,0);
	}
}

@keyframes MoveUpEnd {
	from {
		transform: translate3d(0,100%,0);
	}
	to {
		transform: translate3d(0,0,0);
	}
}

.button--skoll {
    overflow: hidden;
    border-radius: 50%;
    color: #fff;
    width: 5.159958720330237vh;
    height: 5.159958720330237vh;
    padding: 0;
    font-weight: 500;
    position: absolute;
    right: 50%;
    margin-top: 1.5vh;
    transform: translateX(900%);
}


.button--skoll span {
	display: block;
	position: relative;
    font-size: 4rem;
}

.button--skoll > span {
	overflow: hidden;
	mix-blend-mode: difference;
}

.button--skoll:hover > span > span {
	animation: MoveUpInitial 0.2s forwards, MoveUpEnd 0.2s forwards 0.2s;
}

.button--skoll::before {
	content: '';
	background: #000;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	transform: translate3d(0,0,0);
	transition: transform 0.3s;
	transition-timing-function: cubic-bezier(0.7, 0, 0.2, 1);
}

.button--skoll:hover::before {
	transform: translate3d(0,100%,0);
}



html,body {margin:0;padding:0;width:100%;height:100%;} 
 .fixd_ani {position:fixed;top:-915px;width:100%;text-align:center;right:0;transition:all 2s;} 
 .box {position:absolute;} 
 .orange {width:100%;height:100%;background:url(../images/slick_img_2b.png)no-repeat 100%/cover; background-position: right;} 
 .purple {width:100%;height:100%;background:url(../images/slick_img_3.png)no-repeat 100%/cover; background-position: right;} 
 .green_se3 {width:100%;height:100%;background:url(../images/slick_img_4.png)no-repeat 100%/cover; background-position: right;} 
 .red{width:100%;height:100%;background:url(../images/slick_img_5.png)no-repeat 100%/cover; background-position: right;}
 #container-sl {position:relative;width:73.5%;height:700px;background:url(../images/slick_img_1b.png)no-repeat 100%/cover;overflow:hidden;top:5%;} 
 .ifrr>img{width:100%;}
 .dot_sl {position:absolute;z-index:2;width:160px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;} 
 .dot_df {width:15px;height:15px;border:2px solid #fff;border-radius:100%;cursor:pointer;} 
 .bl_box {position:absolute;width:160px;height:100%;background-color:#a9b3bb;mix-blend-mode:multiply;z-index:2;opacity:0.65;left:0;top:0;z-index:1;} 
 .dot_on {border:none;border-radius:0%;width:151px;height:107px;background-image:url(../images/fa_img.png);} 
 .dot_df:last-child {border:none;border-radius:0%;width:123px;height:133px;background-image:url(../images/home.png);margin-left:28px;} 
 .dot_df:last-child.dot_on {border:none;border-radius:0%;width:95px;height:130px;background-image:url(../images/light.png);margin-left:1px;}