﻿
@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');
}

@import url(//cdn.jsdelivr.net/font-nanum/1.0/nanumgothic/nanumgothic.css);


/* font select */
body * { font-family:  'NanumSquare'; letter-spacing : .3px;}
a:hover, a * {cursor: pointer; text-decoration: none; word-break: keep-all; }
p, h1, h2, h3, h4, h5, h6 {word-break: keep-all; }
.flex {display: flex; align-items: center;}

/* header */
#header { background:#303030; padding:6px 0px;}
#header a { color:#fff; text-decoration:none;}
#header a:hover { font-weight:bold; transition:0.3s;}
#header .header-box-left { float: left; font-size: 14px; }
#header .header-box-right { float: right; font-size: 14px; color:#fff;}
#header .header-box-right span { margin:0px 5px;}
.header-box { display:inline-block; padding: 0px 15px; font-size:14px; color:#fff;}
#header .active { font-weight:bold;}

/* gnb */
#gnb-wrap{ border-bottom: 3px solid #F5AA37;}
#gnb-wrap img { float:left; margin:10px 0px; }
#gnb { float: right; margin-top:35px; display: flex; align-items: center; }
#gnb > li  { padding:0px 30px; position: relative;}
#gnb > li > a { font-size:1.7em; color:#121212; font-weight: bold; text-decoration:none; transition:all ease 0.3s; }
#gnb > li > a:hover {  color:#F5AA37; border-bottom:2px solid #F5AA37; padding-bottom:7px; transition:all ease 0.3s; font-weight:bold; }
#gnb > li > a.active { color:#F5AA37; border-bottom:2px solid #F5AA37; padding-bottom:7px; transition:all ease 0.3s; font-weight:bold; }
#gnb > li > ul { display:none; }
.point { position:absolute; bottom:-68px; left:46%; margin-left:-9px; display:none; opacity:1;}


/* gnb2 */
.gnb2 {background: #F5AA37; width:100%; height:0px; position:absolute;left:0px; z-index:999; display: flex; align-items: center;}
/*.gnb2 .container { padding:40px 0px 0px;}*/
.subtext-wrap { float:left;  padding:0px; display:none; width:285px; text-align:center; margin-right:30px;}
.subtext { display:inline-block; }
.subtext p { color:#333333;}
.subtext p:first-child { font-size:14px; margin-bottom:0px; display:none; }
.subtext p:nth-child(2) { font-size:30px; color:#fff; font-weight:bold;}
.subtext img { display:inherit; position:relative; float:none!important; margin:20px auto; }
.subul {display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end;}
.subul > li { /*float:left;*/ width:21%; /*margin:0px 40px 50px 0px;*/ padding: 2em 1em;} 
.subul > li > a { font-size:1.5em; font-weight:600;}
.subul > li > a > i { float:right; position:relative; top:3px; }
.subul > li > ul { margin-top:15px; }
.subul > li > ul > li { font-size:13px; transition:all ease 0.3s;height: 29px;margin-top:1px; }
.subul > li > ul > li:hover { background-color:#E85295;}
.subul > li > ul > li > a { padding: 5px 7px;border-bottom: 1px solid #fff;display: inline-block;overflow: hidden; width: 100%;text-overflow: ellipsis; white-space: nowrap; }
.subul > li > ul > li > a > i { margin-right:5px; position:relative; }
.subul li a { color: #fff; text-decoration:none; }



/* footer */

#footer { clear: both; background:#F5AA37; padding:3em 15px; position:relative; text-align:left;}
#footer img { margin-right: 35px; clear:both; display:inline-block;}
#footer p { color:#fff; font-size:1.5em; display:inline-block; margin:0px; text-align:left; align-self: end;}

/* mobile */
#my-menu{display: none;}
.header-mobile-gnb .toggle {color:#333333!important;}
.mm-panels > #mm-1 {background-color:#85b4d9!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 { background-color: #9cbeef!important; }
.mm-navbar { padding:20px 0px!important; height:inherit!important;}
.mm-navbar a { font-size:22px; color:#fff!important;}
.mm-listview>li>a, .mm-listview>li>span { padding:20px 25px!important; font-size:17px;}
.mm-panels>.mm-panel>.mm-listview { margin:20px 0px!important;}
.mm-btn {top:unset!important;}


@media (max-width:1199px) {
    #gnb > li { padding:0px 12px;}
    #sitemap-wrap img {width:50%;}
    #sitemap > li { padding:0px 25px;}
}

@media (max-width:992px) {
    #header { padding:5px 10px;}
    .header-mobile-gnb {
        font-size: 2.5em;
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
    }
    #gnb-wrap > div.container {position: relative; top: 0; left: 0;}
    #gnb-wrap img { max-width:16em;}

    #footer { text-align:center; }
    #footer > div > div {flex-direction: column; align-items: center;}
    #footer p { font-size: 1.4em; text-align:center; position:initial; align-self: unset; }
    #footer img { float:none; display:block; margin:0px auto 15px;}
}

@media (max-width:767px) {
    #main-section2 { margin:0px 0px 15px;}
    #footer { text-align:center; padding: 1.5em 0 10px; }
    #gnb-wrap { padding:0px;}


}


@media (max-width: 414px) {
    #footer p {font-size: 1.2em;}

}