@charset "utf-8";
@import url('base.css');
@import url('remixicon.css');
;

.hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.hidden02 { position: absolute; top: auto; left: -10000px; height: 1px; overflow: hidden; }/* 메인페이지, 서브컨텐츠 사용 */
.skip { position: absolute; top: 0; height: 0; font-size: 0;}

 .wow { visibility: hidden; }
 
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	border: 0;
	clip: rect(0 0 0 0);
}
 /* pop */
#pop { position:absolute; top:200px; left:30px; max-width:85%; z-index:1000;}
#pop img { max-width:100%; }



/* layout */
#wrap { width:100%; height:100%; position:relative;}
.container { max-width:1240px;  margin:0 auto; padding:0 20px; position:relative; }
header { 
   position: absolute;
   top:0;
   width:100%;
   z-index:10;

}
header .logo { }
header .logo > a { display:inline-block; width:230px; }

.header{
  
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 0 3rem;
}
.on_hidden {overflow: hidden !important;}
/* gnb */
.gnb_wrap {margin-left:auto;  }
.gnb {position:relative; display:inline-block; *display:inline; zoom:1}
.gnb > li{ position:relative; float:left; margin:0 10px; line-height:1; z-index:10;}
.gnb > li > a { display:inline-block;  position:relative; height:100px;  font-size:18px; padding:40px 20px 10px 20px;font-family: 'Montserrat', sans-serif;font-weight:600;color:#fff;}
.gnb > li > a:hover, .gnb > li > a.active { color:#5bb8e8; }
.gnb > li > ul {display:none; position:absolute; top:100%; z-index:10; width:180px;left:50%; margin-left:-90px;
   background: rgb(91,184,232);
background: linear-gradient(180deg, rgba(91,184,232,1) 0%, rgba(28,68,152,1) 100%);
border-radius: 30px;
box-shadow: 0 0 40px rgb(0 0 0 / 10%); /*0 1.6rem 2.222rem 0 rgb(0 0 0 / 10%);*/}
.gnb > li > ul li {  text-align:center;  }
.gnb > li > ul li a {display:block; padding:15px;color:#fff;opacity: 0.8; }
.gnb > li > ul li a:hover {opacity: 1;}


/* 전체메뉴  */
#btn_all_gnb_toggle { position: absolute; appearance: none; opacity: 0; }
#btn_all_gnb_toggle:checked ~ .btn_all_gnb{ position:fixed; right:30px; z-index:99; }
#btn_all_gnb_toggle:checked ~ .gnb_all_wrap { opacity: 1; visibility: visible; }

.btn_all_gnb {  
   margin-left:20px;
   width: 25px;
   height: 25px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   position: relative;}

.btn_all_gnb .dot{position: absolute; display:block; width:4px; height:4px; border-radius:4px; background-color:#fff;}
.btn_all_gnb .dot.dot1{top: 0; left: 0;}
.btn_all_gnb .dot.dot2{top: 0; left: 11px;}
.btn_all_gnb .dot.dot3{top: 0; right: 0;}

.btn_all_gnb .dot.dot4{top: 10px; left: 0;}
.btn_all_gnb .dot.dot5{top: 10px; left: 11px;}
.btn_all_gnb .dot.dot6{top: 10px; right: 0;}

.btn_all_gnb .dot.dot7{top: 20px; left: 0;}
.btn_all_gnb .dot.dot8{top: 20px; left: 11px;}
.btn_all_gnb .dot.dot9{top: 20px; right: 0;}


#btn_all_gnb_toggle:checked ~ .btn_all_gnb{ z-index:100000;}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot2,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot4,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot5,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot6,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot8{opacity: 0;}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot1,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot3,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot5,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot7,
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot9{background-color: #fff; height: 4px; width: 22px;}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot1{transform: translateY(8px) rotate(45deg);}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot3{transform: translateY(8px) rotate(-45deg);}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot7{transform: translateY(-8px) rotate(-45deg);}
#btn_all_gnb_toggle:checked ~ .btn_all_gnb .dot.dot9{transform: translateY(-8px) rotate(45deg);}


.gnb_all_wrap { position: fixed; top: 0; left:0; width: 100%; height: 100%; display:flex; justify-content:center; 
   align-items:center;  background: #0b1135; opacity: 0;  z-index:10; overflow-x: hidden; visibility: hidden; transition: 0.3s; }
.gnb_all {position:relative; width:90%;  text-align:center;  display:inline-block; *display:inline; zoom:1}
.gnb_all > li{ float:left; width:25%; line-height:1; }
.gnb_all > li > a { font-size:30px; color:#fff; font-weight:700;}
.gnb_all > li > a {position:relative; }
.gnb_all > li > a:after { content:""; position:absolute; bottom:0; left:0;  width:100%; border-bottom:5px; background-color:#00b7de; }
.gnb_all > li > a:hover, .gnb > li > a.active {  }
.gnb_all li ul {padding-top:20px;}
.gnb_all li ul li { padding:10px 0;   }
.gnb_all li ul li a { font-size:20px; color:#fff }
.gnb_all li ul li a:hover {}


#container {  width:100%; }
#content { position:relative;}
#content .content { }
#footer {
   margin-top:60px;
   display:flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   font-size:16px; padding:55px 3.65vw; background-color:#fff;  border-top:1px solid #ddd;}
#footer  .footer_logo img { width:220px;}
#footer  .footer_info  span{

}
#footer .footer_info span:not(:last-child):after {
   display: inline-block;
   content: "";
   width: 1px;
   height: 12px;
   background: rgba(0,0,0,0.3);
   margin: 0 13px;
}
 #footer .copy { color:#9c9c9c }


.sub_visual { display: flex; justify-content: center;align-items: center; position:relative; height:530px; background:url(../images/sub_visual01.jpg) no-repeat center bottom / cover}
.sub_visual .location {     color: #fff;
   position: absolute;
   right: 30px;
   bottom: 30px;}

   .sub_visual .location ul { display:flex;}
   .sub_visual .location ul li {position: relative; padding: 0 10px;}
   .sub_visual .location ul li::after {
      display: block;
      content: '';
      width: 3px;
      height: 3px;
      background: #fff;
      border-radius: 50%;
      position: absolute;
      right: -1.5px;
      top: 50%;
      transform: translateY(-50%);
  }
  .sub_visual .location ul li a { color:#fff;}
   .sub_visual .location ul li span { display:none;}
   .sub_visual .location ul li:last-child::after { display:none}
/* title */
.sub_title { position:relative;  max-width:1200px; margin:0 auto; padding:100px 20px 50px 20px;  text-align: center;color:#fff;}
.sub_title h2 {font-family: 'Montserrat', sans-serif;position:relative; display: inline-block; font-size:26px; }
.sub_title P { font-size:30px; font-weight:700;padding-top:10px;}


.h3_title { margin:50px 0 30px; text-align:center; font-family: 'Montserrat', sans-serif, "맑은 고딕", Malgun Gothic; font-size:25px;  font-weight:bold; color:#5bb8e8; background:url(../images//img_title_logo.png) no-repeat top center; padding-top:20px} 
.h3_title::before { }
.h4_title { margin:30px 0;font-size:25px; font-weight:600;}

/**** pc ***/
@media screen and (max-width: 1400px) {
   .gnb_wrap {  }
}





/**** 태블릿 ***/
@media screen and (max-width: 1200px) {
   .gnb_wrap { display:none; }
   .gnb_all > li{ width:50%; margin-bottom:30px }
   .header {height:80px;}

}


/**** 모바일 ***/

@media screen and (max-width: 768px) {
	
   #footer .container:after {  display:none; }

}

@media screen and (max-width: 340px) {
	header .logo { top:35px; }
  header .logo > a {  width:190px;}
}

