@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 { /* overflow-x: hidden; */ /*scroll-behavior:smooth;*/ }

br.br1280{display: none;}
br.br980{display: none;}
br.br768{display: none;}
br.mo{display: none;}

:root{
    --color1:#2389c2;
    --color2: #014888;
    --color3: #bdcb4a;
}


.p-Part{padding: 12rem 0;}

/* 타블렛 가로 */
@media all and (max-width:1620px) {
    .inner {	width:90%; }
}
@media all and (max-width:1420px) {
    .s-inner {	width:90%; }
}
@media all and (max-width:1280px) {
    html { font-size: 60% !important; }
    br.br1280{display: block !important;}
    .p-Part{padding: 10rem 0;}
}
@media all and (max-width:980px) {
    html { font-size: 60% !important; }
    br.br980{display: block !important;}
    .p-Part{padding: 8rem 0;}
}
@media all and (max-width:768px) {
    html { font-size: 0.55rem !important; }
    br.br768{display: block !important;}
    .p-Part{padding: 6rem 0;}
}
@media all and (max-width:480px) {
    html { font-size: 2.2vw !important; }
    br.mo{display: block !important;}
}

#header { position:fixed; width:100%; height:180px; box-sizing:border-box; z-index:300; margin:0 auto; background:#fff; top:0; text-align:center; transition:height .4s ease, box-shadow .4s ease; }
#header.scroll {height:60px;}
#header #logo { height:120px; display:flex; align-items:center; justify-content:center; overflow:hidden; opacity:1; transform:translateY(0); transition:height .35s ease, opacity .25s ease, transform .35s ease;}
#header #logo img{width: 43rem;}
#header.scroll #logo { height:0; opacity:0; transform:translateY(-20px); }
#header .cont { height:60px; line-height:60px; border-top:1px solid rgba(0,0,0,.1); border-bottom:1px solid #eee; transition:border-color .3s; }
#header .hd_mbx { display: none; }



.menuToggle { position: relative; right:0; top:0; width:80px; height:80px; cursor:pointer; z-index:101; }
.menuToggle span { display:block;  height:2px; border-radius:3px;   position:absolute; top: 50%; left:50%; margin-left: -16px; transition:all 0.5s; background:#222}
.menuToggle span.t { margin-top: -11px; width:27px;}
.menuToggle span.m { margin-top:-1px; width: 27px; }
.menuToggle span.b { margin-top: 9px; width:27px; }

#header.mo_on .menuToggle span.t {transform: rotate(45deg);  margin-top: 0;}
#header.mo_on .menuToggle span.m {width:0;}
#header.mo_on .menuToggle span.b {transform: rotate(-45deg); width:27px;  margin-top: 0;} 

#header.mo_on .menuToggle span { background:#FFF} 





/* #gnb_pc > ul{position: relative;}
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center;}
#gnb_pc > ul > li > div {display:block; font-size:1.8rem; text-transform:uppercase; width: auto; padding: 0 8rem; cursor: pointer;letter-spacing:0; }
#gnb_pc > ul > li > div  a { color:#222;  font-weight:bold; }
#gnb_pc > ul > li:hover > div  a { color:var(--color1);}
#gnb_pc > ul > li ul.smenu { display: none; padding:15px 0; width:1200px; background: var(--color1); position: absolute; top: 59px; left: 50%; line-height: 2rem; transform: translateX(-50%);}
#gnb_pc > ul > li ul.smenu > li > a {display:block; width:100%;padding:10px; color:#fff;box-sizing: border-box; font-size: 1.8rem; font-weight: normal;}
#gnb_pc > ul > li ul.smenu > li:last-child > a {border-bottom:0;}
#gnb_pc > ul > li ul.smenu > li > a:hover {text-decoration:underline}
#gnb_pc > ul > li ul.smenu > li > ul {display:none} */

#gnb_pc > ul {position:relative;}
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center; position:static;}
#gnb_pc > ul > li .nm {display:block; font-size:1.8rem; text-transform:uppercase; width:auto; padding:0 8rem; cursor:pointer; letter-spacing:0;}
#gnb_pc > ul > li > div a {color:#222; font-weight:bold;}
#gnb_pc > ul > li:hover > div a {color:var(--color1);}

#gnb_pc .menu_wrap {display:none; position:absolute; top:59px; left:50%; transform:translateX(-50%); width:1200px; height:360px; background:#fff; box-shadow:0 20px 40px rgba(0,0,0,0.08); z-index:500; text-align:left;}
#gnb_pc .menu_area{width:30%; height:100%; background:#fff; padding:4rem; box-sizing:border-box; border-right:1px solid #e4e4e4; border-left:1px solid #e4e4e4;}
#gnb_pc .menu_area ul.smenu {display:block !important; position:static; width:auto; padding:0; background:none; transform:none; line-height:1.4;}
#gnb_pc .menu_area ul.smenu > li > a {display:block; width:100%; padding:0 0 18px; color:#222; font-size:1.8rem; font-weight:500; box-sizing:border-box;}
#gnb_pc .menu_area ul.smenu > li > a:hover {color:var(--color1); text-decoration:none; font-weight:700;}

/* #gnb_pc .menu_fixed {position:absolute; top:0; left:340px; right:0; height:100%; display:flex;} */
#gnb_pc .menu_fixed{height:100%; display:flex;}
#gnb_pc .gnb_banner { height:100%; padding:4rem; box-sizing:border-box;}
#gnb_pc .gnb_banner strong {display:block; font-size:2.4rem; font-weight:800; margin-bottom:1.5rem; line-height:1.3;}
#gnb_pc .gnb_banner p {font-size:1.8rem; line-height:1.4; color:#555;}
#gnb_pc .gnb_banner01{width:35%; background:#f7f7f7; text-align:center;}
#gnb_pc .gnb_banner01 .img{width: 13rem; margin: 2rem auto 2.5rem;}
#gnb_pc .gnb_banner01 .img img{width: 100%;}
#gnb_pc .gnb_banner02{width:35%; background:var(--color2); color:#fff;}
#gnb_pc .gnb_banner02 p.call{font-size: 3rem; color: #fff; display: flex; align-items: center; gap: 1rem; margin-top: 4rem;}
#gnb_pc .gnb_banner02 p.call span{font-weight: bold; color: var(--color3);}
#gnb_pc .gnb_banner02 dl{display: flex; font-size: 2rem; line-height: 1.4;}
#gnb_pc .gnb_banner02 dl + dl{margin-top: 1rem;}
#gnb_pc .gnb_banner02 dl dt{width: 12rem; display: flex; align-items: center;gap: 1rem;}
#gnb_pc .gnb_banner02 dl dt span{font-size: 1.5rem; display: inline-block; padding: 0rem 0.7rem 0 0.5rem; background:#ce0000; border-radius: 0.3rem;}
#gnb_pc .gnb_banner02 dl dd{display: flex; align-items: center; gap: 0.5rem 1rem; flex-wrap: wrap; width: calc(100% - 10rem);}
#gnb_pc .gnb_banner02 dl dd.org{color: #ffa742; font-weight: bold;}
#gnb_pc .gnb_banner02 p.notice{font-size: 1.6rem; color: #fff;margin-top: 2rem; opacity: 0.8;}
#gnb_pc .gnb_quick {width:100px; height:100%; background:#333;}
#gnb_pc .gnb_quick ul {height:100%;}
#gnb_pc .gnb_quick li {height:25%; padding:10px 10px 0; box-sizing:border-box;}
#gnb_pc .gnb_quick li a {display:flex; align-items:center; justify-content:center; height:100%; color:#fff; font-size:1.4rem; font-weight:500; text-align:center; border-bottom:1px solid rgba(255,255,255,0.2); flex-direction: column; align-content: center; line-height: 2.5;}
#gnb_pc .gnb_quick li:last-child a {border-bottom:0;}
#gnb_pc > ul > li:hover > div a span{color: #fff;}
#gnb_pc > ul > li > div a span{color: #fff;}

#gnb_pc .menu_wrap{display:none; position:absolute; top:59px; left:50%; transform:translateX(-50%); width:1200px; height:360px; background:#fff; box-shadow:0 20px 40px rgba(0,0,0,0.08); z-index:500; text-align:left;}
#gnb_pc .menu_fixed{display:flex; width:100%; height:100%; position:static;}
#gnb_pc .gnb_banner{height:100%; padding:4rem; box-sizing:border-box;}
#gnb_pc .gnb_banner01{width:35%; background:#f7f7f7; text-align:center;}
#gnb_pc .menu_area{width:30%; height:100%; background:#fff; padding:4rem; box-sizing:border-box; border-left:1px solid #e4e4e4; border-right:1px solid #e4e4e4;}
#gnb_pc .gnb_banner02{width:35%; background:var(--color2); color:#fff;}




#gnb_mo { position:fixed; top:0; right:0; width:100%; height:100%; max-width:500px; padding: 80px 0; background:rgba(5,5,5, 0.90); overflow-y:scroll; -ms-overflow-style:none; z-index: 100; text-align: left; 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 > ul { border-top: 1px solid rgba(255,255,255,0.1); line-height:3.5em;}
#gnb_mo > ul > li > div {display:block; width:100%; font-size:2.0rem;  border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; padding:0.7em 1.5em; position:relative; cursor: pointer; }
#gnb_mo > ul > li > div:after {content:''; display:block; width:11px; height:1px; background:#fff; position:absolute; right:1em; top:50%; margin-top:-1px;}
#gnb_mo > ul > li > div:before {content:''; display:block; width:1px; height:11px; background:#fff; position:absolute; right:calc(1em + 5px); top:50%; margin-top:-6px; transition:all 0.5s;}
#gnb_mo > ul > li > div > a { color:#fff; display: inline-block; width: 100%; height: 100%;}
#gnb_mo > ul > li > ul { display:none; }
#gnb_mo > ul > li > ul > li > a {display:block; width:100%; font-size:1.8rem; color:#4b4b4b;padding:0 2em; font-weight: 500; border-bottom:1px solid #e1e1e1; background:#fff; box-sizing:border-box; line-height:3.5em;}
#gnb_mo > ul > li > div.on { background: var(--color1); }
#gnb_mo > ul > li > div.on:before {transform:rotate(90deg)}

#header.mo_on #gnb_mo {display:block;}
#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:1399px){
    #header #logo img{width: 35rem;}
    /* #gnb_pc > ul > li > ul { padding:10px 0; width:150px; margin-left: -75px;}
    #gnb_pc > ul > li > div {font-size:1.8rem; padding: 0 2.5rem;} */
}
@media all and (max-width:1280px){
    #header {height: 150px;}
    #header #logo {height: 100px;}
    #header.scroll {height:50px;}
    #header .cont {height: 50px; line-height: 50px;}
    /* #gnb_pc > ul > li > div {padding: 0 20px;font-size: 1.6rem;}
    #gnb_pc > ul > li > ul {top: 49px; line-height: 1.8rem;}
    #gnb_pc > ul > li > ul > li > a {font-size: 1.6rem;} */
    
    #gnb_pc .gnb_banner {padding:4rem 3rem;}
    #gnb_pc .gnb_banner strong {font-size:2rem;}
    #gnb_pc .gnb_banner01 .img{width: 12rem;}
    #gnb_pc .gnb_banner01 p{font-size: 1.7rem;}
    #gnb_pc .menu_wrap {width:970px; top: 49px;}
    #gnb_pc > ul > li .nm {font-size:1.8rem; padding:0 6rem;}
    #gnb_pc .menu_area {width:275px;}
    #gnb_pc .gnb_banner02{width: 37%;}
    #gnb_pc .gnb_banner02 p.call{margin-top: 3rem;}
}

@media all and (max-width:976px){
    #header { height:70px; display: flex; justify-content: space-between;}
    #header.scroll {height:70px;}
    #header #logo {height: 100%; padding-left: 2%;}
    #header.scroll #logo { height:100%; opacity:1; transform:translateY(0); }
    #header #logo img{width: 27rem;}
    #header .hd_mbx { display: block; }
    .menuToggle { width:40px; height:70px }
    #gnb_mo { padding: 70px 0; }	
    #gnb_pc {display:none;}
    #gnb_mo { text-align: left; }
}
@media all and (max-width:768px) {
    #header { height:60px; }
    #header.scroll {height:60px;}
    .menuToggle { height:60px }
    #header #logo img{width: 24rem;}
    #gnb_mo { max-width: 100%; padding: 60px 0; }
    #header.mo_on #logo a.logo { background:url("/images/common/logo_w.png") no-repeat left center; background-size:100% auto; }
    #t-loca {display:none}
}
@media all and (max-width:480px) {
    #header #logo img{width: 22rem;}

}


/* footer */
#footer {background: var(--color2); color: #fff;padding: 4rem 0;}
#footer .info{margin: 3rem 0 2rem;font-size: 1.6rem;}
#footer .info ul{display: flex; flex-wrap: wrap; gap: 1rem 3rem;}
#footer .info ul li{display: flex; gap: 1rem; align-items: center;}
#footer .info ul li span{font-weight: bold;}
#footer p{font-size: 1.6rem; opacity: 0.5; text-align: right;}

@media all and (max-width:768px){
    #footer {padding: 4rem 0 12rem;}
    #footer .logo{width: 23rem;}
    #footer .logo img{width: 100%;}
    #footer .info{font-size: 1.5rem;}
    #footer p{font-size: 1.4rem;}
}
@media all and (max-width:480px){
    #footer {padding: 4rem 0 10rem;}
    #footer .logo{width: 20rem;}
    #footer .info{font-size: 1.5rem;}
    #footer .info ul{gap: 0.5rem 2rem;}
}


#quick{position: fixed; right: 20px; z-index: 99; top: 50%; transform: translateY(-50%);}
#quick .list{background: linear-gradient(to bottom, #2954ae, #0d2140); padding: 2.5rem 0; width: 9rem; box-shadow: 18px 10px 43px rgba(0,0,0,0.16);}
#quick .list li{text-align: center;}
#quick .list li + li{margin-top: 2.5rem;}
#quick .list li a{color: #fff;}
#quick .list li.naver a{display: block; padding: 15px 0;}
#quick .list li a .icon{margin-bottom: 7px;}
#quick .list li a .icon img{max-width: 100%;}
#quick .list li a p{font-size: 1.6rem; font-weight: 500;}
#quick .go_top{width: 86px; aspect-ratio: 1 / 1; display: flex; justify-content: center; align-items: center; flex-direction: column; background-color: #fff ; cursor: pointer; margin-top: 10px; box-shadow: 18px 10px 43px rgba(0,0,0,0.16);}
#quick .go_top .up{font-size: 2.5rem; font-weight: bold; color: #000000; line-height: 1em;}
#quick .go_top p{font-size: 1.6rem; font-weight: 500; color: #000000;}

@media all and (max-width:768px){
	#quick{right: auto; top: auto; transform: translateY(0); bottom: 0; left: 0; width: 100%;}
	#quick .go_top{display: none;}
	#quick .list{display: flex; width: 100%; justify-content: center; padding: 0; border-top-left-radius: 16px; border-top-right-radius: 16px; overflow: hidden;}
	#quick .list li{width: 100%;}
	#quick .list li + li{margin-top: 0px; border-left: 1px solid rgba(255,255,255,0.1);}
	#quick .list li a{ padding: 15px 0; display: flex; justify-content: center; align-items: center; flex-direction: column;}
	#quick .list li a .icon img{height: 2.5rem;}
	#quick .list li a p{font-size: 1.3rem; font-weight: 300;}
}
@media all and (max-width:500px){
	#quick .list li a{padding: 12px 0;}
	#quick .list li a .icon{margin-bottom: 0.7rem;}
}