/* reset */
*{box-sizing:border-box;}
html{overflow-x:hidden;}
body{margin:0; padding:0; font-family: 'Pretendard', sans-serif; letter-spacing:-0.5px;}
a{text-decoration: none; color:#000;}
ul{list-style: none; padding:0; margin:0;}
ul li{list-style: none; padding:0;}
p{margin:0; padding:0;}
h2{margin:0; padding:0;}
:root{
	--main-color: #33327a;
}


/* common */
.container_inner{width:95%; max-width:1250px; margin:0 auto;}

@media (max-width:480px){
	.container_inner{width:90%;}
}
/* //common */


/* head */
header{width:100%; height:100px; position:fixed; top:0; left:0; z-index:100; background-color:#fff;}
header .gnb{width:95%; max-width:1250px; margin:0 auto; display:flex; align-items:center; justify-content: space-between; height:100%;}
header .gnb .logo a img{max-width:100%;}
header .gnb .menu{width:60%; height:100%;}
header .gnb .menu ul.gnb_dep1{display:flex; justify-content: space-between; width:100%; height:100%;}
header .gnb .menu ul li a:hover{color:var(--main-color);}
header .gnb .menu ul.gnb_dep1 > li{width:fit-content; position:relative; height:100%; display:flex; align-items:center;}
header .gnb .menu ul.gnb_dep1 > li > a{font-size:18px; font-weight:500; display:block;}
header .gnb .menu ul.gnb_dep1 > li > a.on{color:var(--main-color); font-weight:800;}
header .gnb .menu ul.gnb_dep1 > li > a:after{content: ''; position: absolute; bottom: 50%; left: 50%; transform:translateX(-50%); width: 0; height: 3px; background: var(--main-color); transition: 0.2s ease;}
header .gnb .menu ul.gnb_dep1 > li:hover > a:after{width:40px; bottom:0;}
header .gnb .menu ul.gnb_dep1 > li:hover > a{color:var(--main-color); font-weight:800;}
header .gnb .menu ul.sub_menu{position:absolute; top:100px; left:50%; transform:translateX(-50%); width:140px; height:0; overflow:hidden; z-index:1000; text-align:center;}
header .gnb .menu.open ul.sub_menu{height:240px; transition:0.3s height;}
header .gnb .menu ul.sub_menu > li > a{display:block; width:auto; height:auto; padding: 13px 0; color: #222; font-size: 16px; font-weight: 300; line-height: 1;}
header .gnb .menu ul.sub_menu > li > a:hover{color:var(--main-color);}
header .gnb .menu .depth_bg{position: absolute; z-index: 900; left: 0; top: 100px; width: 100%; height: 0px; background: #fff; transition: height .3s ease; box-shadow: 1px 1px 5px rgb(0 0 0 / 50%);}
header .gnb .menu.open .depth_bg{height:240px;}
/* //head */


/***** 모바일 메뉴 시작 ******/
.header_hamburger_menu { display:none; position: fixed; right: 20px; top: 35px; transform-origin: center; transition: all 0.35s; }
.mobile_menu_inner_wrap {position: absolute; width: 100%; top: 80px; padding: 50px 30px 0; height: 70vh;  overflow-y: auto;}

.header_hamburger_menu .hamburger {  font: inherit; display: inline-block; overflow: visible; margin: 0; padding: 0; line-height:1em; cursor: pointer; transition-timing-function: linear;  transition-duration: .35s;
    transition-property: opacity,filter;     text-transform: none; color: inherit;  border: 0; }
.header_hamburger_menu .hamburger-box {   position: relative;  display: inline-block;  width: 28px;height: 20px; }
.header_hamburger_menu .hamburger-inner:after,
.header_hamburger_menu .hamburger-inner:before {  display: block;   content: ""; }
.header_hamburger_menu .hamburger-inner,
.header_hamburger_menu .hamburger-inner:after,
.header_hamburger_menu .hamburger-inner:before { width: 100%; height: 3px; border-radius: 0; }
.header_hamburger_menu .hamburger-inner {  margin-top: 1px; }
.header_hamburger_menu .hamburger-inner,
.header_hamburger_menu .hamburger-inner:after,
.header_hamburger_menu .hamburger-inner:before { position: absolute;  transition-timing-function: ease; transition-duration: .10s;  transition-property: transform;  border-radius: 4px; background-color: #000;}
.header_hamburger_menu .hamburger-inner:before {top: 8px;  transition-property: transform,opacity;}
.header_hamburger_menu .hamburger-inner:after {bottom: -16px; }

.header_hamburger_menu .navbar-toggle {cursor: pointer;color: #fff;}
.header_hamburger_menu.open { transform: rotate(180deg);}
.header_hamburger_menu .navbar-toggle.open .hamburger-inner { transform: translate3d(0,6px,0) rotate(45deg);}
.header_hamburger_menu .navbar-toggle.open .hamburger-inner:before {transform: rotate(-45deg) translate3d(0px,0px,0); opacity: 0;}
.header_hamburger_menu .navbar-toggle.open .hamburger-inner:after {transform: translate3d(0,-16px,0) rotate(-90deg);}
.header_hamburger_menu .navbar-toggle.open .hamburger-inner,
.header_hamburger_menu .navbar-toggle.open .hamburger-inner:after,
.header_hamburger_menu .navbar-toggle.open .hamburger-inner:before {background-color: #fff;}

.mobile_menu_contents { position: fixed;  top: 0; left: 100%; width: 100%; height: 100%; z-index: 1999;}
.mobile_menu_contents.open {left:0;}

#mobile_menu_box .gnb_dep1 { margin-top: 0; padding-left:0}
#mobile_menu_box .gnb_dep1>li { opacity:0; transform: translateY(50px); transition: all 0.35s ease-out; transition-timing-function: ease; border-bottom: 1px solid #fff;}
#mobile_menu_box .gnb_dep1>li.visible {opacity:1; transform: translateY(0);}
#mobile_menu_box .gnb_dep1>li>a {font-size: 22px; padding: 15px 0 15px 30px;  height: auto; color: #fff; line-height: 1em;  position: relative; display: block;}
#mobile_menu_box .gnb_dep1>li.menu-item-has-children .plus {position: absolute; top: 50%;  transform: translateY(-50%); transition: transform 0.3s; right: 25px;}
#mobile_menu_box .gnb_dep1>li.menu-item-has-children.open .plus { transform: translateY(-50%) rotate(-180deg);}
#mobile_menu_box .gnb_dep1>li.menu-item-has-children .plus .plus_add {display: block;   width: 20px;  height: 2px;  position: relative;  background: #fff;}
#mobile_menu_box .gnb_dep1>li.menu-item-has-children .plus .plus_add:after {content: "";  background: #fff;  width: 100%;  height: 2px;  position: absolute;  right: 0;  top: 50%;  transform: translateY(-50%) rotate(90deg);  transition: transform 0.3s;}
#mobile_menu_box .gnb_dep1>li.menu-item-has-children.open .plus .plus_add:after {transform: translateY(-50%) rotate(0);}
#mobile_menu_box .sub_menu { width: 100%; line-height: 1em; float: none; margin: 0; padding: 10px 10px 30px 25px;left:0 !important; display:none;}
#mobile_menu_box .sub_menu>li { padding: 10px;}
#mobile_menu_box .sub_menu>li>a { font-size: 16px; color: #fff;  font-weight: 500;}

.mobile-container-overlay {  position: fixed; top: -120.5vh; right: -120.5vh; width: 250vh;  height: 250vh;  border-radius: 50%;  background: var(--main-color);  transition: .2s;  z-index: 0; transform: scale(0); z-index: 10;}
.mobile-container-overlay.open  {animation: checked-overlay .8s both;}
.mobile-container-overlay.close  { animation: not-checked-overlay .4s both; }

.mobile_menu_contents .mobile_menu_copyright {color: #fff;   position: absolute;  bottom: 10px;  width: 100%;   text-align: center;  font-size: 12px; opacity:0; transition: all 0.35s ease-out;  transition-delay:1s;}
.mobile_menu_contents.open .mobile_menu_copyright {opacity:1; }

.mobile_menu_logo {display: none}

@keyframes checked-overlay {
  0% { transform: scale(0); }
  90% { transform: scale(1); }
  100% { transform: scale(1); }
}
@keyframes not-checked-overlay {
  0% { transform: scale(1); }
  100% { transform: scale(0); }
}


@media only screen and ( max-width: 1024px ) {
    /* 모바일 메뉴 Break Point */
    .header_hamburger_menu {display:block;z-index: 19999;}
    #logo {display: none}
    .mobile_menu_logo {display: block; position: fixed;   top: 0;  left: 0;  width: 100%;  height: 90px; z-index: 1999;}
    .mobile_menu_logo a {  display: block;  width: 145px;  height: 90px;  background: url(../img/logo.png) no-repeat center; background-size: 100% !important; transition: 0.35s ease; margin-left:2.5%;}
    .mobile_menu_logo.open a {filter: grayscale(1) brightness(3);}
	header{height:90px;}
	header .gnb{display:none;}
}

@media only screen and ( max-width: 767px ) {
    .header_hamburger_menu {  top: 20px;}
    .mobile_menu_logo,
    .mobile_menu_logo a { height: 60px; }
	header{height:60px;}
}

@media (max-width:480px){
	.mobile_menu_logo a{margin-left:5%;}
}
/***** 모바일 메뉴 끝 ******/







/* footer */
footer{background:#282f35;}
footer .container_inner{display: flex; padding: 80px 0; column-gap: 60px;}
footer .container_inner .info p{color: rgb(255 255 255 / 70%); font-size: 17px; line-height: 1; font-weight: 200; margin-bottom:10px;}
footer .container_inner .info p:last-child{margin-bottom:0;}


@media (max-width:1300px){
	footer .container_inner{padding: 6vw 0; column-gap: 4vw;}
}
@media (max-width:1024px){
	footer .container_inner .logo{width:25%;}
	footer .container_inner .logo img{max-width:100%;}
	footer .container_inner .info p{font-size:1.6vw;}
}

@media (max-width:767px){
	footer .container_inner{flex-direction: column; row-gap:3vw;}
	footer .container_inner .info p{font-size:2.5vw; margin-bottom:2vw;}
}

@media (max-width:480px){
	footer .container_inner .logo{width:40%;}
	footer .container_inner .info p{font-size:3.5vw; line-height:1.5; margin-bottom:0;}
	footer .container_inner .info p .mo_br{display:block; font-size:0;}
}
/* //footer */