@charset "utf-8";
::-webkit-scrollbar { display:none; } 

/** { scroll-behavior: smooth; box-sizing: border-box; }*/

body { width: 100%; max-width: 500px; margin: auto; font-family: 'Noto Sans KR', sans-serif; overflow-x: hidden; }
#wrapper { width: 100%; margin: auto; height: auto; position: relative; top: 0; overflow: hidden; z-index: 1; background-color: #fff;
 /*box-shadow: 0px 0px 10px rgba(0,0,0,0.3); */
}


/*#fixVisual{position:relative; top: 0; left: 0;right: 0; margin: auto; width: 100%; height:100vh; z-index: -5;}*/

#slider1 { position:relative; }

#slider1 .item  { position: relative; width: 100%; height: 100vh; background-color: #fff; overflow: hidden; max-width: 500px; margin: auto; }
#slider1 .itembg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; margin: auto; }

#slider1 .main_txt_box { position: relative; top:15%; left: 0; right: 0; margin: 0 auto; z-index: 99; text-align:center; color: #fff;  }

#slider1 .main_txt_box div { display:relative;  }
#slider1 .main_txt_box .txt01 { margin-top: -7vw; }
#slider1 .main_txt_box .txt02 { font-size: 3vw; font-weight: 400; color: #fff;  margin-top: -5vw; padding: 12vw 0 3vw; line-height: 140%; }
#slider1 .main_txt_box .main_line { position: relative;  width: 1px; height: 0vw; background-color: #fff; left: 0; right: 0; margin: 0 auto; top: -5vw; }
#slider1 .main_txt_box .main_bi2 { margin-top: 1vw; }
#slider1 .main_txt_box .main_logo2 { margin-top: -5vw; padding-top:20px  }


@media all and (min-width:500px) {

/**/
	#slider1 .main_txt_box {top:150px; }
	#slider1 .main_txt_box .txt01 { font-size: 56px; padding-top: 15px; letter-spacing: -3px;}
	#slider1 .main_txt_box .txt02 {font-size: 1rem; margin-top: 0px; padding: 50px 0 20px;  }
	#slider1 .main_txt_box .main_bi2 { margin-top: 0px; }
	/*.main_txt_box .main_line {top:-25px;}*/

}


/**/
.sec{ width: 100%; max-width: 500px; margin: auto;}

.con_wrap {width: 100%; position: relative; z-index: 2; background-color: #fff; left: 0; right: 0; margin: 0 auto;}

/* sec01 */
.sec01 { position:relative; max-width: 500px; margin: auto; overflow:hidden; background-color: #EFEBEC; /*margin-top: calc(100vh + 0vw); */ }
.sec01 .sec01bg { position:absolute; top:0; left:0; transform: scale(1.3); transition: 4s .3s;  opacity: 0}
.sec01 .sec01_txtbox { position:absolute; height: auto; bottom: 50px; left:0; }
.sec01 .sec01_toptxt { position:absolute;  font-size:3.5vw; color:#4e4238 ; top: 50px; left: 4vw; opacity: 0 }
.sec01 .sec01_toptxt .line {
	position: relative; display: inline-block; width: 7vw; height: 1px; border: 1px solid #4e4238 ; 
	margin-right: 15px;vertical-align: middle;
}
.sec01 .sec01_img { position: relative; padding:20px 0;  opacity: 0; top:-5vw }
/*.sec01 .sec01_txt { position:relative;  }*/
.sec01 .sec01_txt .txt1, .sec01 .sec01_txt .txt2 {
	position: relative; text-align: center; color:#fff; font-size:3vw; letter-spacing: -1px; opacity: 0
}

.sec01.active .sec01bg { opacity: 1; transform: scale(1); }
.sec01.active .sec01_toptxt { left: 0; opacity: 1; transition: 1.3s .5s;}
.sec01.active .sec01_img { opacity: 1; top: 0; transition: 1.2s 1.3s; }
.sec01.active .sec01_txt .txt1 { opacity: 1; transition: 0.7s 1.6s;  }
.sec01.active .sec01_txt .txt2 { opacity: 1; transition: 0.7s 1.8s;  }



/* sec02 */

.sec02 {
	width: 100%; height: 190vw; position: relative; background-color: #F5F8FA; color: #000; padding: 0 0%; box-sizing: border-box; padding-top: 0vw; overflow: visible;
	margin: 0 auto;  max-width: 500px; top:0;
	/* margin-top: calc(100vh + 0vw); */ margin-top: 0vw !important; 
}

.sec02 .title { position: relative; padding-top: 8vw; transform: translateX(40px); opacity: 0;}
.sec02_txt1 {margin-top:8vw;}
.sec02 h1, .sec02 h2 {  font-family: 'Nanum Myeongjo', serif; }

.sec02_txtbox {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 2vw; text-align:left; padding:2vw 8vw 0vw 10vw;  }
.sec02_txtbox h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #6094C6; line-height: 150%; font-weight: 500; transform: translateX(-40px); opacity: 0; }
.sec02_txtbox p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(-40px); opacity: 0;}
.sec02_txtbox h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #6094C6;  line-height: 180%; font-weight: 800; transform: translateX(-40px); opacity: 0;  }
.sec02_ov01 {position: relative; top: 0vw; left: 0; right: 0; margin: 0 auto; transform: translateX(40px); opacity: 0;}

.sec02_txt2 {margin-top:5vw;}

.sec02_txtbox2 {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 0vw; text-align:right; padding:0 10vw; }
.sec02_txtbox2 h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #6094C6;  line-height: 150%; font-weight: 800; transform: translateX(40px); opacity: 0; }
.sec02_txtbox2 p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(40px); opacity: 0;}
.sec02_txtbox2 h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #6094C6; line-height: 180%; font-weight: 800; transform: translateX(40px); opacity: 0;}


.sec02.active .title { opacity: 1; transform: translateX(0px); transition: 1s .1s; }
.sec02.active .sec02_txtbox h1 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec02.active .sec02_txtbox h2 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec02.active .sec02_txtbox p {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec02.active .sec02_ov01 {opacity: 1; transform: translate(0); transition: 1s .5s;}

.sec02.active .sec02_txtbox2 h1 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec02.active .sec02_txtbox2 h2 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec02.active .sec02_txtbox2 p {opacity: 1; transform: translate(0); transition: 1s 1.3s; }


/* sec03 */

.sec03 {
	width: 100%; height: 185vw; position: relative; background-color: #F5F8FA; color: #000; padding: 0 0%; box-sizing: border-box; padding-top: 0vw; overflow: visible;
	margin: auto;  max-width: 500px; top:0;
}

.sec03_txt1 {margin-top:8vw;}
.sec03 h1, .sec03 h2 {  font-family: 'Nanum Myeongjo', serif; }

.sec03_txtbox {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 2vw; text-align:left; padding:2vw 8vw 0vw 10vw; }
.sec03_txtbox h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #6094C6; line-height: 150%; font-weight: 500; transform: translateX(-40px); opacity: 0; }
.sec03_txtbox p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(-40px); opacity: 0;}
.sec03_txtbox h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #6094C6;  line-height: 180%; font-weight: 800; transform: translateX(-40px); opacity: 0;  }

.sec03_txt2 {margin-top:10vw; }

.sec03_txtbox2 {position:relative; margin: 3vw auto 0;  width: 100%; left:0vw; top: 0vw; text-align:right; padding:0 8vw; }
.sec03_txtbox2 h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #6094C6; line-height: 150%; font-weight: 500; transform: translateX(40px); opacity: 0; }
.sec03_txtbox2 p {margin-top:4vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(40px); opacity: 0;}
.sec03_txtbox2 h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #6094C6; line-height: 180%; font-weight: 800; transform: translateX(40px); opacity: 0;}
.sec03_ov02 {position: relative; top: 11vw; left: 0; right: 0; margin: 0 auto; transform: translateX(-40px); opacity: 0;}


.sec03.active .sec03_txtbox h1 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec03.active .sec03_txtbox h2 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec03.active .sec03_txtbox p {opacity: 1; transform: translate(0); transition: 1s .3s; }

.sec03.active .sec03_txtbox2 h1 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec03.active .sec03_txtbox2 h2 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec03.active .sec03_txtbox2 p {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec03.active .sec03_ov02 {opacity: 1; transform: translate(0); transition: 1s 1.5s;}


/* sec04 */

.sec04 {
	width: 100%; height: 190vw; position: relative; background-color: #F8F9F5; color: #000; padding: 0 0%; box-sizing: border-box; padding-top: 0vw; overflow: visible;
	margin: auto; max-width: 500px; top:0;
}

.sec04 .title { position: relative; padding-top: 8vw; transform: translateX(40px); opacity: 0;}
.sec04_txt1 {margin-top:8vw;}
.sec04 h1, .sec04 h2 {  font-family: 'Nanum Myeongjo', serif; }

.sec04_txtbox {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 2vw; text-align:left; padding:2vw 8vw 0vw 10vw;  }
.sec04_txtbox h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #46936A; line-height: 150%; font-weight: 500; transform: translateX(-40px); opacity: 0; }
.sec04_txtbox p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(-40px); opacity: 0;}
.sec04_txtbox h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #46936A;  line-height: 180%; font-weight: 800; transform: translateX(-40px); opacity: 0;  }
.sec04_ov01 {position: relative; top: 0vw; left: 0; right: 0; margin: 0 auto; transform: translateX(40px); opacity: 0;}

.sec04_txt2 {margin-top:5vw;}

.sec04_txtbox2 {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 0vw; text-align:right; padding:0 10vw; }
.sec04_txtbox2 h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #46936A;  line-height: 150%; font-weight: 800; transform: translateX(40px); opacity: 0; }
.sec04_txtbox2 p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(40px); opacity: 0;}
.sec04_txtbox2 h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #46936A; line-height: 180%; font-weight: 800; transform: translateX(40px); opacity: 0;}


.sec04.active .title { opacity: 1; transform: translateX(0px); transition: 1s .1s; }
.sec04.active .sec04_txtbox h1 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec04.active .sec04_txtbox h2 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec04.active .sec04_txtbox p {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec04.active .sec04_ov01 {opacity: 1; transform: translate(0); transition: 1s .5s;}

.sec04.active .sec04_txtbox2 h1 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec04.active .sec04_txtbox2 h2 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec04.active .sec04_txtbox2 p {opacity: 1; transform: translate(0); transition: 1s 1.3s; }


/* sec0 */

.sec05 {
	width: 100%; height: 190vw; position: relative; background-color: #F8F9F5; color: #000; padding: 0 0%; box-sizing: border-box; padding-top: 0vw; overflow: visible;
	margin: auto;  max-width: 500px; top:0;
}

.sec05_txt1 {margin-top:8vw;}
.sec05 h1, .sec05 h2 {  font-family: 'Nanum Myeongjo', serif; }

.sec05_txtbox {position:relative; margin: 0 auto;  width: 100%; left:0vw; top: 2vw; text-align:left; padding:2vw 8vw 0vw 10vw; }
.sec05_txtbox h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #46936A; line-height: 150%; font-weight: 500; transform: translateX(-40px); opacity: 0; }
.sec05_txtbox p {margin-top:2vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(-40px); opacity: 0;}
.sec05_txtbox h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #46936A;  line-height: 180%; font-weight: 800; transform: translateX(-40px); opacity: 0;  }

.sec05_txt2 {margin-top:10vw; }

.sec05_txtbox2 {position:relative; margin: 3vw auto 0;  width: 100%; left:0vw; top: 0vw; text-align:right; padding:0 8vw; }
.sec05_txtbox2 h2 {font-size: 7vw; letter-spacing: -0.3vw; color: #46936A; line-height: 150%; font-weight: 500; transform: translateX(40px); opacity: 0; }
.sec05_txtbox2 p {margin-top:4vw; font-size: 3.8vw; line-height:150%; color: rgba(0,0,0,0.7); font-weight: 400; letter-spacing: -0.1vw; transform: translateX(40px); opacity: 0;}
.sec05_txtbox2 h1 {font-size: 9vw; letter-spacing: -0.5vw; color: #46936A; line-height: 180%; font-weight: 800; transform: translateX(40px); opacity: 0;}
.sec05_ov02 {position: relative; top: 11vw; left: 0; right: 0; margin: 0 auto; transform: translateX(-40px); opacity: 0;}


.sec05.active .title { opacity: 1; transform: translateX(0px); transition: 1s .1s; }
.sec05.active .sec05_txtbox h1 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec05.active .sec05_txtbox h2 {opacity: 1; transform: translate(0); transition: 1s .3s; }
.sec05.active .sec05_txtbox p {opacity: 1; transform: translate(0); transition: 1s .3s; }

.sec05.active .sec05_txtbox2 h1 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec05.active .sec05_txtbox2 h2 {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec05.active .sec05_txtbox2 p {opacity: 1; transform: translate(0); transition: 1s 1.3s; }
.sec05.active .sec05_ov02 {opacity: 1; transform: translate(0); transition: 1s 1.5s;}


@media all and (max-width:300px){
}

@media all and (min-width:375px){
}

@media all and (min-width:500px){


/* sec01 */
.sec01.active .sec01_txt .txt1, .sec01.active .sec01_txt .txt2 { font-size:0.875rem;  }
.sec01 .sec01_toptxt { font-size:0.875rem; }
.sec01 .sec01_toptxt .line { width: 50px; }

/* sec02 */

	.sec02 { height:900px;  padding-top: 0px;/* margin-top: 100vh; */}
	
	.sec02_txtbox {top:0; padding:20px 40px 0 40px;}
	.sec02_txt1 {margin-top:30px;}
	.sec02_txtbox h1 {font-size:40px;}
	.sec02_txtbox h2 {font-size:35px; letter-spacing:0;}
	.sec02_txtbox p {font-size:14px; margin-top:10px;}
	
	.sec02_txtbox2 {top:0; padding:0px 40px 0 40px;}
	.sec02_txtbox2 h1 {font-size:40px; letter-spacing:0;}
	.sec02_txtbox2 h2 {font-size:35px;}
	.sec02_txtbox2 p {font-size:14px; margin-top:10px;}
	

/* sec03 */

	.sec03 { height:900px;  padding-top: 0px; }
	
	.sec03_txtbox {top:0; padding:20px 40px 0 40px;}
	.sec03_txt1 {margin-top:30px;}
	.sec03_txtbox h1 {font-size:40px;}
	.sec03_txtbox h2 {font-size:35px; letter-spacing:0;}
	.sec03_txtbox p {font-size:14px; margin-top:10px;}
	
	.sec03_txtbox2 {top:0; padding:0px 40px 0 40px;}
	.sec03_txtbox2 h1 {font-size:40px; letter-spacing:0;}
	.sec03_txtbox2 h2 {font-size:35px;}
	.sec03_txtbox2 p {font-size:14px; margin-top:10px;}
	.sec03_ov02 {top:50px;}
	

/* sec04 */

	.sec04 { height:900px;  padding-top: 0px; }
	
	.sec04_txtbox {top:0; padding:20px 40px 0 40px;}
	.sec04_txt1 {margin-top:30px;}
	.sec04_txtbox h1 {font-size:40px;}
	.sec04_txtbox h2 {font-size:35px; letter-spacing:0;}
	.sec04_txtbox p {font-size:14px; margin-top:10px;}
	
	.sec04_txtbox2 {top:0; padding:0px 40px 0 40px;}
	.sec04_txtbox2 h1 {font-size:40px; letter-spacing:0;}
	.sec04_txtbox2 h2 {font-size:35px;}
	.sec04_txtbox2 p {font-size:14px; margin-top:10px;}



/* sec05 */

	.sec05 { height:900px;  padding-top: 0px; }
	
	.sec05_txtbox {top:0; padding:20px 40px 0 40px;}
	.sec05_txt1 {margin-top:30px;}
	.sec05_txtbox h1 {font-size:40px;}
	.sec05_txtbox h2 {font-size:35px; letter-spacing:0;}
	.sec05_txtbox p {font-size:14px; margin-top:10px;}
	
	.sec05_txtbox2 {top:0; padding:0px 40px 0 40px;}
	.sec05_txtbox2 h1 {font-size:40px; letter-spacing:0;}
	.sec05_txtbox2 h2 {font-size:35px;}
	.sec05_txtbox2 p {font-size:14px; margin-top:10px;}
	.sec05_ov02 {top:50px;}
}