@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto; }
.s-inner {	width:100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto; }

#wrap { font-size: 1.6rem; overflow-wrap: break-word;}

/* 타블렛 가로 */
@media all and (max-width:1599px) {
	.inner {	width: 90%;}
}
@media all and (max-width:1399px) {
	.s-inner {	width:90%}
}
@media all and (max-width:1280px) {
}
@media all and (max-width:976px) {
  html { font-size: 60% !important; }
}

@media all and (max-width:767px) {
  html { font-size: 0.55rem !important; }
}

@media all and (max-width:480px) {
  html { font-size: 2.0vw !important; }
}







/*Header*/
#header { position:fixed; width:100%; height:100px; z-index:150; }

#header #logo { position:absolute; top:0; left: 40px; z-index:89; font-size:0; }
#header #logo img{ vertical-align:middle;  }
#header #logo img.on{ display:none; }
#header #logo2 { position:absolute; top:-3px; left: 267px; z-index:89; font-size:0; width: 150px;}
#header #logo2 img{ vertical-align:middle; width: 100%; }
#header #logo2 img.on{ display:none; }
#header .hd_bx { line-height:100px;  }
#header .hd_mbx { display: none; }

#header .comm3-btn{position: absolute; top: 0; right: 160px; z-index: 89; }
#header .comm3-btn a {display:inline-block; padding:1em 1.8em;background:#2a292d; border-radius:30px; line-height:1em }
#header .comm3-btn a p { font-size:1.5rem; font-family:'Montserrat'; font-weight:600; color:#FFF;}
#header .comm3-btn img{max-width: 100%;}
#header .comm3-btn img.on{display: none;}


.mo-link-bx{display: flex;}
.mo-link-bx .comm3-btn{margin-left:auto; display: flex; justify-content: center; align-items: center;}
.mo-link-bx .comm3-btn img{width: 30px;}


#header .hd_btn { position: absolute; top:0; right: 40px; z-index:89; }

.select_lang { position: relative; top:-2px; display: inline-block; vertical-align: middle;  }
.select_lang button { font-size: 1.5rem; font-weight: 600; text-align: left; outline: none; box-sizing: border-box; 
                                 color:#fff; font-family:'Montserrat' }
.select_lang button::after { content:''; display: inline-block; vertical-align: middle; width: 16px; height: 16px; overflow: hidden; font-size:0;
                                        z-index:10; background: url("/images/common/ico_lang.png") no-repeat center;  margin-left: 15px;  }
.select_lang ul { display: none; width: 100%; z-index: 2; position: absolute; left:0; top: 72px; overflow: hidden; background: #fff; border-radius: 10px; }
.select_lang ul li {  text-align: center; font-size: 1.3rem; line-height: 40px; font-weight:600 }
.select_lang ul li a { display: block; padding: 0 1em; font-family:'Montserrat' }
.select_lang ul li a:hover { color:#fff; background:#0e5acd}

#gnb_mo .select_lang ul { width: auto; border: 1px solid #ddd; top: 50%; left: 100%; transform: translateY(-50%);}
#gnb_mo .select_lang ul:hover { border-color:#0e5acd; }
#gnb_mo .select_lang ul li { display: inline-block; vertical-align: middle; }

#gnb_pc {padding-left:7%; position:relative; overflow:hidden; width:100%; box-sizing:border-box; color:#fff; text-align:center;  }
#gnb_pc .gnb_dp1{ width: 150px; display:inline-block; vertical-align:top; text-align:center; }
#gnb_pc .gnb_dp1>div { font-size:2.0rem; box-sizing:border-box; cursor:pointer; font-weight: 500}
#gnb_pc .gnb_dp1>div>a{ display:inline-block; position:relative; color:#fff; }

#gnb_pc .gnb_dp1 .smenu { position: relative; display:none; font-size:1.6rem; padding:30px 0; color:#fff; }
#gnb_pc .gnb_dp1 .smenu::before{ display:block; content:''; width:100%; height:300%; position:absolute; left:0; top:0;
                                                     background:#2eb1db; transition:all .3s; transform:scaleY(0); }
#gnb_pc .gnb_dp1 .smenu li { line-height: 1.35em; margin-bottom: 1em; position: relative; }
#gnb_pc .gnb_dp1 .smenu li a { color:#fff; }
#gnb_pc .gnb_dp1 .smenu li:hover a { font-weight:600;}

#gnb_pc li.gnb_dp1:hover > div > a { color:#2d5fa5; font-weight:700; }
/* #gnb_pc li.gnb_dp1:hover .smenu::before { transform:scaleY(1);} */


#header.scroll #logo img.on,
#header.menu_on #logo img.on { display:inline-block; }
#header.scroll #logo img.off,
#header.menu_on #logo img.off { display:none; }
#header.scroll #logo2 img.on,
#header.menu_on #logo2 img.on { display:inline-block; }
#header.scroll #logo2 img.off,
#header.menu_on #logo2 img.off { display:none; }



#header.menu_on #gnb_pc { background:rgba(45,95,165, 0.9);  }
#header.scroll #gnb_pc:before,
#header.menu_on #gnb_pc:before {content:""; width:100%; height:100px; background:#fff; position:absolute; top:0; left:0; }

#header.scroll .select_lang button,
#header.menu_on .select_lang button { color:#222;  }
#header.scroll .select_lang button::after,
#header.menu_on .select_lang button::after {background: url("/images/common/ico_lang.png") no-repeat center;  }

/* #header.scroll { height: 80px;  }
#header.scroll .hd_bx { line-height: 80px; }
#header.scroll #gnb_pc:before { height: 80px; } */

#header.scroll #gnb_pc .gnb_dp1>div > a,
#header.menu_on #gnb_pc .gnb_dp1>div > a { color:#212121 }

#header.scroll #gnb_pc .gnb_dp1>div > a:hover,
#header.menu_on #gnb_pc .gnb_dp1>div > a:hover { color:#2d5fa5 }

#header.on .select_lang button,
#header.scroll .select_lang button,
#header.menu_on .select_lang button { color:#222;  }
#header.on .select_lang button::after,
#header.scroll .select_lang button::after,
#header.menu_on .select_lang button::after { background: url("/images/common/ico_lang_on.png") no-repeat center; }




:is(.fp-viewing-1Page, .fp-viewing-3Page, .fp-viewing-4Page, .fp-viewing-5Page, .fp-viewing-6Page)
#header.scroll #gnb_pc:before { background: none; }

/* .fp-viewing-2Page #header.scroll #logo img.on { display:none; }
.fp-viewing-2Page #header.scroll #logo img.off { display:inline-block; } */


.menuToggle { left: 0; top: 0; border-right: 0px solid rgba(255,255,255,0.1);  position:absolute; cursor:pointer; z-index:9999; box-sizing: border-box; }
.menuToggle span {display:block; width:26px; height:2px; background:#fff; position:absolute; left:50%; margin-left: -13px; transition:all 0.5s}
.menuToggle span.t {top:28px;}
.menuToggle span.m {top:50%; margin-top:-1px;}
.menuToggle span.b {bottom:28px; }

.menuToggle.m_on span {background:#FFF}
.menuToggle.m_on span.t {transform:translateY(8.5px) rotate(45deg)}
.menuToggle.m_on span.m {width:0;}
.menuToggle.m_on span.b {transform:translateY(-8.5px) rotate(-45deg)}

 /* .fp-viewing-2Page #header.scroll .menuToggle span {background:#222} */

#header.scroll .menuToggle span,
#header.menu_on .menuToggle span { background:#222 }
#header.scroll .menuToggle span,
#header.menu_on .menuToggle span { background:#222 }

#header.scroll .menuToggle.m_on span,
#header.menu_on .menuToggle.m_on span { background:#FFF }
#header.scroll .menuToggle.m_on span,
#header.menu_on .menuToggle.m_on span { background:#FFF }


#gnb_mo { position:fixed; height:100%; z-index:999; left:0;  top:75px; padding:0; background:#fff;
                color:#212121; width:100%; max-width:380px; box-sizing:border-box; transition: all 0.4s ease;
            	-webkit-transform: translateX(-100%) rotate(0); -moz-transform: translateX(-100%) rotate(0); -ms-transform: translateX(-100%) rotate(0); -o-transform: translateX(-100%) rotate(0);
               transform: translateX(-100%) rotate(0);
}

#gnb_mo .gnb_dp1 div { font-weight:500; font-size:2.0rem; padding:1.2em 1em; cursor:pointer; border-bottom:1px solid #dedede;; }
#gnb_mo .gnb_dp1 > div > a { color:#212121; }
#gnb_mo .gnb_dp1 > div.on { background: #2eb1db; }
#gnb_mo .gnb_dp1 > div.on> a { color:#fff; }

#gnb_mo .smenu {display:none; padding:1em 1.5em; background: #f5f7fb; }
#gnb_mo .smenu>li br{display:none;}
#gnb_mo .smenu>li>a,
#gnb_mo .smenu>li>span {display:block; padding:0.5em 0; font-size:1.8rem; color:#787878;}
#gnb_mo .smenu>li>a:hover,
#gnb_mo .smenu>li>span:hover{ color:#212121; font-weight:500;}

#gnb_mo .hd_btn { padding: 1.2em 1em; background: #555; }


@media all and (max-width:1600px) {
  #gnb_pc .gnb_dp1{ width: 130px; }
}
@media all and (max-width:1480px) {
  #header .comm3-btn{ right: 130px; }
  #gnb_pc {padding-left:11%; }
  #gnb_pc .gnb_dp1{ width: 125px; }
  #gnb_pc .gnb_dp1 .smenu { font-size:1.5rem; }
  #header .hd_btn ul li { font-size: 1.3rem; }
}
@media all and (max-width:1399px) {
  #header .comm3-btn{ display:none}
  #gnb_pc {padding-left:24%; }
}

@media all and (max-width:1280px) {
  #header #gnb_pc {display:none;}
  #header { height:75px; }

  #header .hd_bx { line-height:75px; }
  #header #logo { left: -112px; width:100%; text-align:center; }
  #header #logo img { height:60px }
  #header #logo2 { left: 50%;  text-align:center; width: 140px;}
  /* #header #logo2 img { height:60px } */

  #header .hd_btn { }
  .select_lang ul { top: 65px; }
  #header .hd_mbx { display: block; width: 75px; height: 75px; }

  #header.scroll,
  #header.on { height: 75px; line-height: 75px; background:#FFF; border-bottom-color:#dedede;}

  #header.on .hd_bx,
  #header.scroll .hd_bx { line-height: 75px;  }

  #header.on #logo img.on { display: inline-block; }
  #header.on #logo img.off { display: none; }

  #header.on #logo2 img.on { display: inline-block; }
  #header.on #logo2 img.off { display: none; }

  #header.on .hd_full { background-color:#2d5fa5; }
  #gnb_mo.m_menuOn{	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }

 }
@media all and (max-width:767px) {
	#header{ height:60px; }

    #header #logo { left: -77px;}
	#header #logo img { height:45px }
    /* #header #logo2 { left: 45px;} */
	/* #header #logo2 img { height:45px } */

	  .select_lang ul { top: 55px; }


  #gnb_mo { top: 60px; }

	#header .hd_bx { line-height:60px; }
	#header .hd_mbx{ width:60px; height:60px; line-height:60px; }

    #header .naver-btn{right: 140px;}

  #header.on, #header.scroll { height: 60px; }
  #header.on .hd_bx, #header.scroll .hd_bx { line-height: 60px; }
  #header.scroll #gnb_pc .gnb_dp1>div { height:60px; }

  #header.scroll .hd_mbx { width: 60px; }

  .menuToggle span.t {top:20px;}
  .menuToggle span.b {bottom:20px; }
  .menuToggle.m_on span.t {transform:translateY(9px) rotate(45deg)}
  .menuToggle.m_on span.b {transform:translateY(-9px) rotate(-45deg)}

 
}


@media all and (max-width:568px) {
	#header{height:55px; }
	#gnb_mo { top: 55px; }

	#header .hd_btn { right:20px}
	 .select_lang ul { top: 45px; }
	 .select_lang ul li {line-height:1em !important; padding:1.5em 0}
	 .select_lang button::after { margin-left: 10px;  }

	#header .hd_bx{ line-height:55px; }
	#header .hd_mbx { width:55px; height:55px; line-height:55px;}

    #header #logo { left: -65px;}
    #header #logo2 { width: 110px; top: 0;}
	#header #logo img { height:35px; }

	#header.on, #header.scroll { height: 55px; }
	#header.on .hd_bx, #header.scroll .hd_bx { line-height: 55px; }
	#header.on #logo img, #header.scroll #logo img { }
	#header.scroll #gnb_pc .gnb_dp1>div { height:55px; }

	#header.scroll .hd_mbx { width: 55px; }

	.menuToggle span.t {top:17.5px;}
	.menuToggle span.b {bottom:17.5px; }
}







#footer { position: relative; background: #202328; padding: 3% 0; }
#footer .s-inner {  }
#footer h1 {border-bottom:1px solid #34373b }
#footer h1 img { width:100%; max-width: 324px; padding-bottom:20px }
#footer .f-info { margin-top: 20px; line-height: 1.5em; }
#footer .f-info p { color:#bcbcbc;  font-size: 1.6rem; display: inline-block; margin-right: 1.3em;  }
#footer .f-info p span {color:#686868}
#footer .f-info p.copy { font-size: 1.4rem; margin-top: 1em; display: block; opacity:.3 }


@media all and (max-width:1280px) {
  #footer { padding: 3em 0; }
}
@media all and (max-width:976px) {
 #footer h1 img { width:80% }
}
@media all and (max-width:568px) {
  #footer .f-cont .f-link li  { margin-right: 7px; }
  #footer .f-cont .f-info p { margin-right: 0.7em; }
}
@media all and (max-width:480px) {
#footer .s-inner { text-align: center; justify-content: center; }
}
