@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&family=Roboto:wght@100;200;300;400;500;600;700;800;900&family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
* { margin: 0; padding: 0; } 
html,body,div,span,p,h1,h2,h3,h4,h5,h6,sup,ul,ol,li,a,dt,dl,table,th,td,input,select,label,section,button,strong{font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, Montserrat, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; color: #333; letter-spacing:-0.04em}
body,ul,p,span,h1,h2,h3,h4,h5,h6,blockquote,fieldset,legend { margin: 0; padding: 0; } 
h1,h2,h3,h4,h5,h6 { font-size: 18px; } 
ol,ul { list-style: none; } 
em,address { font-style: normal; } 
fieldset { border: none; } 
legend { text-indent: -999999px; width: 1px; height: 1px; overflow: hidden; font-size: 1px; line-height: 1px; position: absolute; left: 0; top: 0; } 
img { vertical-align: middle; } 
.sec input[type="text"],
.sec input[type="password"],
.sec input[type="email"],
.sec input[type="tel"],
.sec input[type="radio"] { vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; padding: 0; border: 0; } 
button { padding: 0; margin: 0; border: 0; } 
a { text-decoration: none; color: #333; highlight-color:transparent;} 
a { -webkit-tap-highlight-color:transparent; -webkit-highlight:none;}

body,html { width: 100%; margin: 0 auto; overflow-x:hidden;} 
html, body{
  -webkit-text-size-adjust : none;  /* 크롬, 사파리, 오페라 신버전 */
  -ms-text-size-adjust : none;  /* IE */
  -moz-text-size-adjust : none;  /* 파이어폭스 */
  -o-text-size-adjust : none;  /* 오페라 구버전 */
}
.wrap { width: 670px; margin: 0 auto; } 
.flex { display: flex; } 
body .bx-wrapper { margin: 0; padding: 0; box-shadow: none; border:0; background: transparent; } 
.f-mont{font-family:'Montserrat' !important;}


/* mobile-btn */
.fix-quick { width: 100%; position: fixed; bottom: 0; z-index: 30; } 
.fix-quick .top-btn { width: 50px; height: 50px; line-height: 1.3; background-color: #6f5b47; color: #fff; text-align: center; font-size: 18px; position: absolute; bottom: 200px; right: 40px; display: none; padding-top:5px } 
.fix-quick > .pc-btn { display: block; width:100%; height: 80px; background: #444 url(../image/main/pc_on.png) right 240px top 33px no-repeat; } 
.fix-quick > .pc-btn p { font-size: 30px; font-weight: 700; color: #aaa; text-align: center; line-height: 80px; } 


#header { width:100%; height:80px; position: fixed; border-bottom: 1px solid #ddd; box-sizing: border-box; z-index:99; padding:22.5px 40px;} 
#header .hd-top { justify-content: space-between; align-items: center;  width:100%;} 
#header .hd-top > li{min-width:40px;}
#header .nav-btn { position:relative; z-index: 100; height:100%; cursor:pointer;} 
#header .nav-btn span { display:inline-block; width: 40px; height:0; background-color: transparent; position: absolute; top:50%; left: 0; right: 0; margin: auto;  transform:translateY(-50%)} 
#header .nav-btn.on span { background-color:rgba(255,255,255,0); z-index:4; } 
#header .nav-btn span:after, 
#header .nav-btn span:before{ content:''; position:absolute; width: 40px; height:4px; display:inline-block; background:#fff; transition: all 0.5s; } 
#header .nav-btn span:after { top:7px; } 
#header .nav-btn span:before { top: -7px; } 

#header .nav-btn.on span:after,
#header .nav-btn.on span:before { top: 0; }


#header .nav-btn.on span:after { transform:rotate(-45deg); background:#333;} 
#header .nav-btn.on span:before { transform:rotate(45deg);  background:#333;} 
#header .tel { width: 80px; height: 80px; border-left: 1px solid #ddd; box-sizing: border-box; } 
#header .tel a { display: block; width: 100%; height: 100%; padding: 30px; box-sizing: border-box; } 


#header .nav-ct { width: 100%; min-height:100vh; position: absolute; top: 0;  z-index: 50; right:-470px; transition: all 0.3s ease-in-out; opacity:0; visibility:hidden; } 
#header .nav-con { width: 100%; margin: 0 auto; background:#fff; position:fixed; } 
#header .nav-top { width: 100%; height: 80px; margin: 0 auto; padding:22.5px 40px; box-sizing:border-box; border-bottom:1px solid #ddd;} 
#header .nav-top ul {height: 100%; align-items: center; margin-left:45px;} 
#header .nav-top ul li { position: relative; } 
#header .nav-top ul li.logout::before{ display: none;}
#header .nav-top ul li+li { padding-left: 15px; margin-left: 15px; } 
#header .nav-top ul li a { display: block; font-size: 22px; color: #fff; } 
#header .sns{margin-top:30px;}
#header .sns li + li{margin-left:25px;}

nav{box-sizing:border-box; padding:30px 40px;}
#gnb {box-sizing: border-box; max-height:calc(100vh - 28vw); overflow-y:auto; position:relative;} 
#gnb::-webkit-scrollbar{
	position:absolute; top:0; right:0;
     width: 6px;
}
#gnb::-webkit-scrollbar-thumb{
     background-color: #aaaaaa;
     border-radius: 30px;
}
#gnb::-webkit-scrollbar-track{
     background-color: #eeeeee;
}
#gnb > li { } 
#gnb > li > a { position: relative; transition: rotate 0.1s; } 
#gnb > li > a.dep2::after{content:""; width:34px; height:34px; background:url(../image/main/arw_depth1_on.png) center center no-repeat; position:absolute; top:50%; right:40px; transform:translateY(-50%); display:block;}
#gnb > li > a{ height: 90px; line-height: 80px; color:#333; font-size: 30px; font-weight:bold; display:block; padding-left: 20px; position:relative; border-bottom: 1px solid #ddd; } 

#gnb > li > a.on::before { background-color: #fff; } 
#gnb > li > a.on::after { transform: rotate(90deg); background-color: #fff; } 
#gnb > li > a.on.dep2{border-color:#26a7a1}
#gnb > li > a.on.dep2::after{content:""; width:34px; height:34px; background:url(../image/main/arw_depth1_off.png) center center no-repeat; position:absolute; top:50%; right:40px; transform:translateY(-50%); display:block;}
#gnb > li > ul.depth2 { display:none; /* background: #f4f5f9; *//*  max-height:450px; overflow-y:auto */ padding:12.5px 0;} 
#gnb > li > ul.depth2 li a{position:relative;}
#gnb > li > ul.depth2 > li > a { font-size: 26px; display:block; color:#333;  /* border-bottom: 1px solid #ddd; */ box-sizing: border-box; padding:12.5px 20px;} 
#gnb > li > ul.depth2 > li:last-child > a { border-bottom: 0; } 
.nav-ct .nav-bg { width: 470px; height: 100vh; background-color: #fff; } 

#gnb > li > ul.depth2 > li{position: relative; transition: rotate 0.1s;}
#gnb > li > ul.depth2 > li span{content:""; position:absolute; top:45px; right:0px; transform:translateY(-50%); display:block; font-size:50px; color:#808081; font-weight:100;font-size:80px; background:url(../image/main/dep2plus.png) center center no-repeat; width:90px; height:90px; cursor:pointer;}
#gnb > li > ul.depth2 > li span.btnOn{background:url(../image/main/dep2minus.png) center center no-repeat;}



#gnb ul.depth3 { display:none; background: #eee; padding:25px 0;/*  max-height:450px; overflow-y:auto */} 
#gnb ul.depth3 li{padding:0 40px;}
#gnb ul.depth3 > li + li{margin-top:30px;}
#gnb ul.depth3 a { font-size: 20px; display:block; color:#333; line-height: 1; box-sizing: border-box; padding:0 20px; position:relative;} 
#gnb ul.depth3 a:before{content:"·"; display:block; position:absolute; top:0; left:0; width:20px; height:20px; text-align:center; font-size:20px; color:#333;}
#gnb ul.depth3 > li:last-child > a { border-bottom: 0; } 
#gnb ul.depth3.on{display:block;}

/* leftmenu 활성화 */
html.hidden, body.hidden { overflow: hidden; } 
#header .nav-ct.on{right:0; opacity:1; visibility:visible;}
#header .nav-ct.on:before{display:block; background:rgba(0, 0, 0, .6); content:""; width:100vw; height:100vh; position:fixed; top:50%; left:50%; max-width:100%; transform:translate(-50%, -50%)}

/* header 스크롤 */
#header.Hd-Scroll{background:#fff;}
#header.Hd-Scroll .nav-btn span:after, #header.Hd-Scroll .nav-btn span:before{background:#333;}



/* Main */
.Mouse{width:250px; height:50px; display:block; position:absolute; left:50%; bottom:30vw; transform:translateX(-50%);}
.Mouse p{padding-top:65px; color:#333333; font-size:22px; font-weight:500; text-align:center; font-family:'Montserrat' !important;}
.Mouse a {padding-top: 40px;}
.Mouse a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 40px;
  height: 56px;
  margin-left: -15px;
  border: 5px solid #333333;
  border-radius: 50px;
  box-sizing: border-box;
}
.Mouse a span::before {
  position: absolute;
  top: 5px;
  left: 50%;
  content: '';
  width: 6px;
  height: 12px;
  margin-left: -3px;
  background-color: #333333;
  border-radius: 6px;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
	-webkit-transform: translate(0, 0);
	opacity: 0;
  }
  40% {
	opacity: 1;
  }
  80% {
	-webkit-transform: translate(0, 10px);
	opacity: 0;
  }
  100% {
	opacity: 0;
  }
}
@keyframes sdb {
  0% {
	transform: translate(0, 0);
	opacity: 0;
  }
  40% {
	opacity: 1;
  }
  80% {
	transform: translate(0, 10px);
	opacity: 0;
  }
  100% {
	opacity: 0;
  }
}   



.section {width:100%; height:Auto; position:relative;}
.sec1{background:url(../image/main/sec01_1.png) center center no-repeat; background-size:cover; }
.sec1 .centerImg{background:url(../image/main/sec01Center.png) center center no-repeat; background-size:cover; height:53.333vw; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:89.333vw; box-shadow: 19px 19px 34px 22px rgba(0, 0, 0, .09);}
.sec2{background:url(../image/main/sec02.png) center center no-repeat; background-size:cover; }
.sec3{background:url(../image/main/sec03.png) center center no-repeat; background-size:cover; }
.sec4{background:#fff;}
.sec4{background:#fff;}

.titWrap{padding:0 0 40px;}
.titWrap span{font-family:'Montserrat' !important; font-size:20px; font-weight:500; color:#fff; text-align:center; display:block;}
.titWrap h1{font-family:'Montserrat' !important; font-size:54px; font-weight:bold; color:#fff; text-align:center; margin-top:25px;}

.titWrap2{padding-bottom:20px;}
.titWrap2 span{font-family:'Montserrat' !important; font-size:20px; font-weight:500; color:#26a7a1; display:block; text-align:center;}
.titWrap2 h1{font-family:'Montserrat' !important; font-size:30px; font-weight:bold; color:#333; margin-top:10px; text-align:center;}
.titWrap2 p{font-size:22px; font-weight:400; color:#333; margin-top:10px; text-align:center;}

.sec2{}
.sec2 .flex{width:calc(100% - 40px); flex-direction:column; margin:0 auto;}
.sec2 .flex > div{width:100%; height:145px;box-sizing:border-box; padding:0 85px; text-align:center; transition: all .3s ease-out; display:flex; align-items:center; justify-content:space-between;}
.sec2 .flex > div + div{border-top:1px solid #ddd;}
.sec2 .flex > div > div{display:flex; align-items:center;}
.sec2 .flex > div img{margin-right:35px;}
.sec2 .flex > div p{font-size:38px; font-weight:bold; color:#fff;}
.sec2 .flex > div a{text-align:center; display:block; box-sizing:border-box; border-bottom:1px solid #fff; color:#fff; padding-bottom:0px; font-size:22px;}
.sec2 .flex > div:hover{padding:0 58px; background:linear-gradient(-90deg, rgba(38, 167, 161, .85), rgba(3, 26, 71, .85)); scale:1.055; border-top:none; }



.sec3{}
.sec3 .flex{width:calc(100% - 80px); height:auto; margin:0 auto; flex-direction:column; align-items: center; padding-bottom:150px;}
.sec3 .flex > div{width:670px; height:290px;}
.sec3 .flex > div:nth-of-type(1){background:url(../image/main/sec03_1.png)center center no-repeat;}
.sec3 .flex > div:nth-of-type(2){background:url(../image/main/sec03_2.png)center center no-repeat; margin-top:130px;}
.sec3 .contentBox{display:flex; position:relative; flex-direction:column; justify-content:flex-end; box-sizing:border-box; padding:35px;}
.sec3 .contentBox > p{font-size:36px; font-weight:600; color:#fff;}
.sec3 .sec3Pop{position:absolute; width:550px; height:190px; background:linear-gradient(0deg, rgba(3, 26, 71), rgba(38, 167, 161)); box-sizing:border-box; padding:37.5px 30px; left:50%; bottom:-90px; transform:translateX(-50%); border-radius:20px; transition: all .3s ease-out;}
.sec3 .sec3Pop p{position:relative; font-size:38px; font-weight:600; color:#fff; line-height:1;}
.sec3 .sec3Pop p:before{width:2px; height:60px; content:""; display:block; background:#fff; position:absolute; top:-70px; left:15px;}
.sec3 .sec3Pop span{display:inline-block; font-size:18px; color:#fff; margin:20px auto; letter-spacing:-0.5px;}
.sec3 .sec3Pop a{font-size:16px; font-weight:500; color:#fff; letter-spacing:-0.5px; width:140px; line-height:35px; border:1px solid #fff; box-sizing:border-box;  font-family:'Montserrat' !important; display:block; text-align:center; position:absolute; top:40px; right:30px;}


.sec4{}
.sec4 .flex{align-items:center; width:calc(100% - 80px); flex-direction:column; margin:0 auto; padding-bottom:100px;}
.sec4 .flex .adress, .sec4 .flex .map{width:100%}
.sec4 .flex .adress{padding-top:50px;}
.sec4 .flex .adress > p{font-size:24px; font-weight:600; color:#333; letter-spacing:-0.5px; font-family:'Montserrat' !important;}
.sec4 .flex .adress > span{font-size:24px; font-weight:400; color:#26a7a1; letter-spacing:-0.5px; margin:20px 0 35px; display:inline-block;}
.sec4 .flex .adress > ul{display:flex; flex-direction:column;}
.sec4 .flex .adress > ul > li{width:100%; box-sizing:border-box; padding-left:40px; display:flex; width:100%; font-size:20px; font-family:'Montserrat' !important;}
.sec4 .flex .adress > ul > li:nth-of-type(1){background:url(../image/main/sec4_ico01.png) center left no-repeat;}
.sec4 .flex .adress > ul > li:nth-of-type(2){background:url(../image/main/sec4_ico02.png) center left no-repeat;}
.sec4 .flex .adress > ul > li:nth-of-type(3){background:url(../image/main/sec4_ico03.png) left 6px no-repeat;}
.sec4 .flex .adress > ul > li:nth-of-type(4){background:url(../image/main/sec4_ico04.png) left 6px no-repeat;}
.sec4 .flex .adress > ul > li + li{margin-top:20px;}
.sec4 .flex .adress > ul > li span{font-family:'Montserrat' !important; font-size:18px; font-weight:600; letter-spacing:-0.5px; color:#333; width:140px; display:inline-block; line-height:37px;}
.sec4 .flex .adress > ul > li strong{font-weight:600; letter-spacing:-0.2px;}
.sec4 .flex .adress > ul > li ul{display:flex; flex-direction:column; width:calc(100% - 160px);}
.sec4 .flex .adress > ul > li ul li{font-size:20px; display:flex;}
.sec4 .flex .adress > ul > li ul li + li {margin-top:20px;}
.sec4 .flex .adress > ul > li ul li span{color:#26a7a1;     white-space: nowrap;}
.sec4 .flex .adress > ul > li ul li p{}
.sec4 .flex .adress > ul > li ul li p:nth-of-type(2){width:200px; }
.sec4 .flex .adress > ul > li ul li p:nth-of-type(1){width:85px;padding-right:20px; margin-right:20px; text-align:justify; text-align-last:justify; border-right:2px solid #333; height:31px; line-height:31px;}
.sec4 .flex .map img{display:block; margin:0 auto;}




.footer{padding:80px 0 180px; border-top:1px solid #ddd; width:100%;}
.footer > div{width:100%;}
.footer .top{margin-bottom:40px;}
.footer .top ul{display:flex; margin:0 auto; align-items:center; justify-content:center;}
.footer .top ul li{position:relative;}
.footer .top ul li img{vertical-align:sub; margin-right:5px; display:inline-block; margin-bottom:5px;}
.footer .top ul li a{line-height:24px; font-family:'Montserrat' !important; font-size:20px; font-weight:400; color:#333; text-transform:uppercase ;}
.footer .top ul li + li{margin-left:45px;}
.footer .top ul li + li:before{position:absolute; top:50%; left:-25px; content:"·"; display:block; transform:translateY(-50%); color:#999; font-size:18px;}
.footer .bottom ul{display:flex; margin:0 auto; align-items:center; justify-content:center; flex-wrap:wrap; width:100%;}
.footer .bottom ul.gen{}
.footer .bottom ul.gen li{font-size:22px; font-weight:400; color:#333; letter-spacing:-1.4px; position:relative;}
.footer .bottom ul.gen li a{font-size:22px;}
.footer .bottom ul.gen li + li{margin-left:45px;}
.footer .bottom ul.gen li + li:before{position:absolute; top:50%; left:-30px; content:""; display:block; transform:translateY(-50%) rotate(-45deg); width:17px; height:3px; background:#c9c9c9;}

.footer .bottom ul.info{margin:30px auto 10px;}
.footer .bottom ul.info li{font-size:20px; font-weight:400; color:#666; letter-spacing:-0.2px; position:relative; line-height:1.6;}
.footer .bottom ul.info li + li{margin-left:45px;}
.footer .bottom ul.info li + li:before{position:absolute; top:50%; left:-25px; content:""; display:block; transform:translateY(-50%); width:2px; height:15px; background:#c9c9c9;}
.footer .bottom ul.info li + li:nth-of-type(3){padding-left:}
.footer .bottom ul.info li + li:nth-of-type(3):before{display:none;}
.footer .bottom ul.info li + li:nth-of-type(4){padding-left:0; margin-left:0;}
.footer .bottom ul.info li + li:nth-of-type(4):before{display:none;}

.footer .bottom > p{text-align:center; font-family:'Montserrat' !important; font-size:18px; font-weight:500; color:#999;}

.fixMenu{position:fixed; left:0; bottom:0; width:100%; height:80px; z-index:10;}
.fixMenu ul{width:100%; height:100%; display:flex;}
.fixMenu li{width:50%; box-sizing:border-box; border-radius:20px 20px 0 0; filter: drop-shadow(0 0 14px rgba(0, 0, 0, .1));}
.fixMenu li:nth-of-type(1){background:#fff;}
.fixMenu li:nth-of-type(2){background:#39b54a;}
.fixMenu li:nth-of-type(1) a span{color:#031a47;}
.fixMenu li:nth-of-type(2) a span{color:#fff;}
.fixMenu li a{display:flex; text-align:Center; line-height:80px; align-items:center; justify-content:center; font-size:22px; cursor:pointer;}
.fixMenu li a img{margin-right:10px;}

.modalBg{width:100vw; height:100vh; background:rgba(0, 0, 0, .6); position:fixed; z-index:99; content:""; display:none; top:0; left:0;}
.modalBg.on{display:block;}

.q-btncounselPop{width:580px; height:590px; box-sizing:border-box; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); z-index:100; filter: drop-shadow(0 0 10px rgba(0, 0, 0, .1)); background:linear-gradient(180deg, #26a7a1 230px, #fff 0px); border-radius:15px; padding:45px 80px; opacity:0; visibility:hidden; transition: all .3s ease-out;}
.q-btncounselPop .flex{flex-direction:column;}
.q-btncounselPop .flex > div{width:100%}
.q-btncounselPop .flex > div:nth-of-type(1){text-align:center;}
.q-btncounselPop .flex > div:nth-of-type(1) h1{text-align:center; color:#fff; font-size:45px; font-weight:bold; letter-spacing:-1.4px}
.q-btncounselPop .flex > div:nth-of-type(1) p{text-align:center; color:#fff; font-size:26px; font-weight:300; letter-spacing:-1.4px; margin:15px auto 20px;}
.q-btncounselPop .flex > div:nth-of-type(2){background:#fff; width:100%; height:230px; box-sizing:border-box; border-radius:15px; padding:60px; border:1px solid #ddd; overflow:hidden;}
.q-btncounselPop .flex > div:nth-of-type(2) input[type=textbox]{border:none; width:100%; height:40px; line-height:40px; border-bottom:1px solid #ddd; font-size:26px;}
.q-btncounselPop .flex > div:nth-of-type(2) input[type=textbox]:focus{outline:none !important;}
.q-btncounselPop .flex > div:nth-of-type(2) input[type=textbox]::placeholder{text-indent:5px; font-size:26px; font-weight:normal;}
.q-btncounselPop .flex > div:nth-of-type(2) input + input{margin-top:25px;}
.q-btncounselPop .flex > div:nth-of-type(3) input[type=checkbox]{width:20px; height:20px; margin-right:5px; vertical-align:middle;}
.q-btncounselPop .flex > div:nth-of-type(3) > p{font-size:26px; font-weight:400; color:#666; text-align:center; margin:15px auto 20px; display:flex; align-items:center; justify-content:center;}
.q-btncounselPop .flex > div:nth-of-type(3) > p span{font-size:26px; font-weight:bold; color:#666; display:inline-block; margin-left:3px; cursor:pointer;}
.q-btncounselPop .flex > div:nth-of-type(3) > p label{font-size:26px; font-weight:400; color:#666; text-align:center;}
.q-btncounselPop .flex > div:nth-of-type(3) h4{background:#a16e38; line-height:55px; text-align:center; border-radius:45px; width:300px; color:#fff; font-size:30px; cursor:pointer; border-radius:10px; margin:0 auto;}
.q-btncounselPop.on{visibility:visible; opacity:1;}
.popCls{font-size:32px; color:#fff; position:fixed; top:calc(50% - 350px); left:calc(50% + 250px);}

.agree-box{
	position: absolute;
	width: 280px;
	padding: 10px;
	font-size: 16px;
	border: 1px solid #515559;
	background: #fff;
	z-index: 1;
	display: none;
	text-align: left;
	bottom: 170px;
	left:50%;
	transform:translateX(-50%);
	transition:none;
}
.agree-box .agree_tit{ font-weight: 400; font-size: 18px; color: #d71313; }

