@font-face {
    font-family: 'NanumSquare';
    src: url(webfont/NanumSquare/NanumSquareR.eot);
    src: url(webfont/NanumSquare/NanumSquareR.eot?#iefix) format('embedded-opentype'), url(webfont/NanumSquare/NanumSquareR.woff) format('woff'), url(webfont/NanumSquare/NanumSquareR.ttf) format('truetype');
}

@font-face {
    font-family: 'NanumSquareRound';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* common */
body * { font-family: 'NanumSquare';}
a {text-decoration: none!important;}
a:hover {text-decoration: none!important; cursor: pointer;}
#joinForm { margin: 150px auto 0!important;}
#loginForm {margin: 5% auto!important; position: relative;}
#privacyStatement {margin: 5% auto!important; }
#my-menu { display: none;}
.content {margin: 0 0 80px;}
#dimodePage .dimode-theme {margin: 80px 0 0;}
.mian-box {position: relative;}

@media (min-width: 1500px) {
    .subcontainer {width: 1400px; margin: 0 auto;}
    .mainContainer { width: 1240px; margin: 0 auto; }
    .subgContainer {width: 25%; margin: 0 auto;}
}

/*gnb-all*/
.gnb-all {
    display: none;
    position: absolute;
    z-index: 999;
    top: 100px;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}
.gnb-all a { text-decoration: none; }
.gnb-all .all-wrapper {
    background: #fff;
    padding: 40px 0;
    border-bottom: 3px solid #E39E36;
}
.gnb-all .all-wrapper .container {padding: 0; margin: 0 auto;}
.gnb-all .all-wrapper .container a { display: block; color: #E39E36;}
.gnb-all .all-wrapper .container > div { overflow: hidden; }
.gnb-all .all-wrapper .container > ul {display: flex; justify-content: space-around;}
.gnb-all .all-wrapper .container > ul > li { /*max-width: 225px; min-width: 145px;*/ position: relative; text-align: left; }
.gnb-all .all-wrapper .container > ul > li > a { margin: 0px 0px 15px; font-size: 19px; font-weight: 600; text-decoration: none; border-bottom: 1px solid #ddd; padding-bottom: 8px; }
.gnb-all .all-wrapper .container > ul > li > ul > li > a {
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 16px;
	padding: 0px;
	margin: 10px 0;
	transform: skew(-0.05deg);
	font-weight: bold;
}
.gnb-all .all-wrapper .container > ul > li > ul > li > ul > li > a {
	color: #333;
	display: block;
	margin: 10px 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	padding: 0 15px;
	transform: skew(-0.05deg);
}
.gnb-all .close { opacity:1; position: absolute; top: 30px; right: 10%; font-size: 3rem; color: #000; }


/* header */
.header {
    width: 100%;
    height: 100px;
    position: relative;
    z-index: 999;
    text-align: center;
    transition: .4s all;
    background: #001935;
}
.header > div {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.header .main-logo img {max-width: 230px;}
.header .gnb {}
.header .gnb a {color:#fff;}

.header .gnb .depth1 { display:inline-flex; height: inherit; align-items:center; }
.header .gnb .depth1 > li {
    position: relative;
    text-align: center;
    height: inherit;
    display: inline-flex;
    cursor: pointer;
    padding: 1.9vw 10px;
    box-sizing: border-box;
}
.header .gnb .depth1 > li > a { width:130px; font-size: 20px; font-weight:bold; display:block;}
.header .gnb .depth1 > li > a:hover { color:#E39E36; font-weight: bold; transition: .3s all;}

.header .gnb .depth2 { display:none;}
.header .gnb .depth2.active { 
	display: block;
    position: absolute;
    background: #fff;
    top: 100px;
    width: 180px;
    z-index: 99;
    left: 50%;
    transform: translateX(-50%);
    padding: 0;
}
.header .gnb .depth2 > li { background-color:#E39E36; border-bottom:1px solid #ffffff;}
.header .gnb .depth2 > li:last-child{ border:unset;}
.header .gnb .depth2 > li > a {font-size: 18px; padding:15px 10px; display: inline-block; width: 100%;}
.header .gnb .depth2 > li > a:hover { background: #001935; color:#E39E36; font-weight:bold; transition:all ease-in-out .15s;}
.header .gnb .depth3 > li:first-child > a {padding-top: 10px;}
.header .gnb .depth3 > li > a { color: #001935; font-size:17px; /*margin: 5px 15px;*/ position:relative; display:inline-block; padding: 8px 0; transition: all .3s ease-in-out;}
.header .gnb .depth3 > li:nth-child(6) > a {padding-bottom: 10px;}
.header .gnb .depth3 > li > a:hover {
    color: #001935;
    font-weight: bold;
}
/*.header .gnb .depth3 > li > a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 1px;
  left: 50%;
  position: absolute;
  background: #333;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}*/
.header .gnb .depth3 > li > a:hover:after { 
  width: 100%; 
  left: 0; 
  height: 2px;
}

.headerLogin { white-space: nowrap;}
.headerLogin ul {display: flex; align-items: center;}
.headerLogin li {padding: 1.5vw 10px; color: white;}
.headerLogin li.pastHp a {font-size: 2rem;}
.headerLogin li a {font-size: 1.7rem; color: white;}
.headerLogin a:hover {color: #E29C42; font-weight: bold;}


footer { width: 100%; background-color: #141414; clear: both; overflow: hidden;}
.footer-wrap {display: flex; justify-content: space-around; padding: 50px 0 20px;}
.footer-wrap .address {
    color: white;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: .5px;}
.footer-wrap p { font-size: 1.8rem; font-weight: bold;}
footer .footer-bottom, footer .footer-bottom a { font-size: 1.5rem; color: #7B7B7B; margin: 20px 0; transform: skew(-0.05deg);}


/* */
#my-menu {display: none;}
.mm-panels > #mm-1 { background-color: #001A34 !important;}
.mm-panels > #mm-2,
.mm-panels > #mm-3,
.mm-panels > #mm-4,
.mm-panels > #mm-5,
.mm-panels > #mm-6,
.mm-panels > #mm-7,
.mm-panels > #mm-8,
.mm-panels > #mm-9,
.mm-panels > #mm-10,
.mm-panels > #mm-11,
.mm-panels > #mm-12,
.mm-panels > #mm-13,
.mm-panels > #mm-14,
.mm-panels > #mm-15,
.mm-panels > #mm-16,
.mm-panels > #mm-17,
.mm-panels > #mm-18,
.mm-panels > #mm-19,
.mm-panels > #mm-20,
.mm-panels > #mm-21,
.mm-panels > #mm-22,
.mm-panels > #mm-23,
.mm-panels > #mm-24,
.mm-panels > #mm-25,
.mm-panels > #mm-26,
.mm-panels > #mm-27,
.mm-panels > #mm-28,
.mm-panels > #mm-29,
.mm-panels > #mm-30,
.mm-panels > #mm-31,
.mm-panels > #mm-32,
.mm-panels > #mm-33,
.mm-panels > #mm-34,
.mm-panels > #mm-35,
.mm-panels > #mm-36,
.mm-panels > #mm-37,
.mm-panels > #mm-38,
.mm-panels > #mm-39,
.mm-panels > #mm-40,
.mm-panels > #mm-41,
.mm-panels > #mm-42,
.mm-panels > #mm-43 {background-color: #378ad8 !important;}
.mm-navbar {border: none!important; margin: 8%!important; }
.mm-title { 
    font-weight: 600;
    font-size: 2.5rem;
    letter-spacing: 1px;
}
.mm-navbar a {
    font-size: 22px;
    color: #fff !important;
}

.mm-listview > li > a, .mm-listview > li > span {
    padding: 20px 25px !important;
    font-size: 1.7rem;
}
.mm-panels > .mm-panel > .mm-listview {margin: 10% 0px !important;}
.mm-btn {top: unset !important;}
.mm-menu.mm-opened.mm-pagedim-black~#mm-blocker {background: unset!important;}
.mm-menu .mm-listview > li .mm-next:after { border-color: white !important;}
.mm-listview>li, .mm-listview>li .mm-next, .mm-listview>li .mm-next:before, .mm-listview>li:after {border-color: rgba(212,212,212, .4)!important;}
/* .mm-listview li:first-child {display: none!important;} */
.mm-listview > li.login { float: right; display: flex;}
.mm-listview > li.login a {color : white!important; padding: 25px 10px!important;}
.mm-listview > li.login::after {display: none!important;}



/* subtab2 */
.sub-content-menu { position: relative;}
.sub-content-menu ul {
    display: flex;
    align-content: center;
    justify-content: space-between;
    text-align: center;
    margin: 60px 0 0;
}
.sub-content-menu ul li {
   display:inline-block;
   cursor:pointer;
   background-color: transparent;
}
    .sub-content-menu ul li i {
        padding: 0 0 10px;
        display: block;
        font-size: 14px;
        transition: all .3s ease-in-out;
        color: #003A80;
    }
.sub-content-menu ul li a { color: #000; text-decoration:none; font-size:20px; display:inline-block; width:100%;}
.sub-content-menu ul li.active, .sub-content-menu ul li:hover {
    font-weight: bold;
    border-bottom: unset;
    transition: all 200ms;
    color: #003A80;
}
.sub-content-menu ul li.active a {font-weight: bold; color: #003A80;}
.sub-content-menu ul li:hover i {transform: translateY(-5px);}


/* Responsive */
@media (max-width: 414px) {
    
}

@media (max-width: 767px) {
    .sub-cont > .sub-top-ul2 {display: none;}
    .sub-content-menu ul {display: none!important;}
    .footer-wrap {flex-direction: column; padding: 40px 20px 10px;}
    .footer-wrap .address, .footer-wrap p {font-size: 1.4rem; line-height: 1.6;}

}


@media (max-width: 992px) {
    .header {height: 80px;}
    .header .main-logo img {max-width: 165px;}
    .header > div {justify-content: space-between!important; padding: 0 20px;}
    .header .gnb, .headerLogin {display: none;}
    .header-mobile-gnb a {color: white!important; font-size: 2.8rem;}

    

}


@media (max-width: 1199px) {
    .header .gnb .depth1 > li > a {width: auto; font-size: 1.7rem;}
    .header .gnb .depth1 > li {padding: 3.4vw 2vw!important;}
    .header .gnb .depth2.active {width: 140px;}
    .header .gnb .depth2 > li > a {font-size: 15px; padding: 10px;}
}


@media (max-width: 1499px) {
    .subcontainer {width: 100%;}
    .header > div {justify-content: space-around; height: inherit;}
    .header .gnb .depth1 > li {padding: 2.4vw 1vw;}
    .sub-content-menu ul {justify-content: center;}
    .sub-content-menu ul li {margin: 0 40px;}
}