@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css);
body *{
    margin: 0;
    font-family: "Nanum Barun Gothic";
}

.layout-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

/*.depth2 {
    display: none;
    background: #000;
    position: absolute;
    top: 100%;
}*/

.main-header {

    background: #ffffff;
    /*height: 106px;*/
    z-index: 11;
    position: absolute;
    width: 100%;
    left: 0;
}

    .main-header .main-wrapper {
        /*margin: 0 auto;
        width: 1145px;*/
        position: relative;
        padding-bottom:5px;
    }

        .main-header .main-wrapper .content {
            padding-top: 5px;
        }

        .main-header .main-wrapper .logo {
            float: left;
        }

        .main-header .main-wrapper .content > .gnb {
            display: inline-block;
            padding-bottom: 120px;
        }

        .main-header .main-wrapper .content .gnb .gnb {
            position: absolute;
            /*17.8.30 gnb 1차메뉴 hover했을경우 header 영역을 벗어나면 2차메뉴가 사라지는 현상이 있어서 z-index 이용해서 나오게끔 처리 함.*/
            z-index: 9999;
            top: 50px;
            left: 240px;
            /*left: 280px;
            bottom: 80px;*/
        }

        .main-header .main-wrapper .content .gnb > .gnb > ul > li {
            float: left;
            padding: 0px 15px;
        }

            .main-header .main-wrapper .content .gnb > .gnb > ul > li > ul {
                /*display:none;*/
                /*z-index:999;*/
            }


        .main-header .main-wrapper .content .gnb .gnb ul li a {
            color: white;
            font-size: 15px;
        }

        .main-header .main-wrapper .content .login {
            float: left;
        }

            .main-header .main-wrapper .content .login .widget-login {
                color: white;
                position: absolute;
                right: 21px;
                top: 15px;
                font-size: 12px;
            }

                .main-header .main-wrapper .content .login .widget-login a {
                    color: white;
                }

.gnb-image {
    text-align: center;
}

.gnb-line {
    background: #0c69ae;
    position: absolute;
    top: 66px;
    left: 0;
    width: 100%;
    display: inline-block;
    z-index: 9;
}

    .gnb-line .gnb-line-wrapper {
        margin: 0 auto;
        width: 1300px;
    }

    .gnb-line .gnb-line-wrapper .gnb-line-cont{
        font-size:16px;
    }

    .gnb-line li {
        float: left;
        list-style:none;
    }

        .gnb-line li:last-child {
            /*float: none;*/
        }

    .gnb-line .gnb-line-wrapper .gnb-line-cont li a {
        color: white;
        display: inline-block;
        padding: 15px 20px;
        text-decoration: none;
    }

    /*.gnb-line .gnb-line-wrapper .gnb-line-cont li:hover a,
    .gnb-line .gnb-line-wrapper .gnb-line-cont li.active a {
        color: #0c69ae;
    }*/


.gnb-top-btn {
    text-align: center;
    border-top: 1px solid #c2c2c2;
}

    .gnb-top-btn img {
        cursor: pointer;
    }

.gnb-wrapper {
    /*margin: 0 auto;
    width: 1140px;*/
    background:#262626;
    padding-bottom: 40px;
}



    .gnb-wrapper .gnb > ul > li {
        float: left;
        padding-right: 82px;
        padding-top: 40px;
    }

        .gnb-wrapper .gnb > ul > li > ul {
            padding-top: 10px;
        }


        .gnb-wrapper .gnb > ul > li > a {
            color: #969696;
            font-weight: bold;
            font-size: 16px;
        }

        .gnb-wrapper .gnb > ul > li > ul > li > a {
            color: #969696;
            font-size:14px;
        }


.footer {
    background: #2c2c2c;
    border-top: 1px solid #404040;
}

    .footer .wrap-footer {
        margin: 0 auto;
        /*width: 1140px;*/
    }

        .footer .wrap-footer .footer-top-btn {
            text-align: center;
        }

            .footer .wrap-footer .footer-top-btn img {
                cursor: pointer;
            }

        .footer .wrap-footer .footer-content {
            padding: 21px 0px 20px 0px;
            position: relative;
        }

            .footer .wrap-footer .footer-content .logo {
                /*margin-top: -14px;*/
            }

            .footer .wrap-footer .footer-content .content {
                padding-left: 30px;
                /*padding-right: 100px;*/
                color: #969696;
                padding-bottom:20px;
            }

            .footer .wrap-footer .footer-content .footer-familysite {
                position: absolute;
                left: 980px;
                top: 46px;
            }

                .footer .wrap-footer .footer-content .footer-familysite #select {
                    width: 160px;
                    background: #3a3a3a;
                    color: white;
                    border: 1px solid #3a3a3a;
                    padding: 7px;
                }


            .footer .wrap-footer .footer-content .logo{
                position:relative; top:-6px;
            }

            .footer .wrap-footer .footer-content .logo, .footer .wrap-footer .footer-content .content {
                float: left;
                line-height: 2;
            }

            .footer .wrap-footer .footer-content .content .cont:first-child{
                padding-left:0;
            }

            .footer .wrap-footer .footer-content .content .cont{
                padding-left:10px;
                font-size:13px;
            }

            .footer .wrap-footer .footer-content .content .cont:last-child{
                padding-left:0;
            }


            .footer .wrap-footer .footer-content .icon{
                text-align:right;
            }


/*GNB*/
.main-header .main-wrapper .header-gnb {
    position: absolute;
    top: 20px;
    left: 275px;
    z-index: 2;
}

    .main-header .main-wrapper .header-gnb > ul > li {
        float: left;
        position: relative;
        padding:0 26px;
    }

        .main-header .main-wrapper .header-gnb > ul > li > a {
            font-size: 22px;
            color: #000;
            font-weight:bold;
            /*padding: 16px 31px;*/
        }




        .main-header .main-wrapper .header-gnb > ul > li > a:hover{
            text-decoration:none;
                color: #2a7cc5;
    border-bottom: 2px solid #09A2C2;
    padding-bottom: 3px;
    transition: all ease 0.2s;
        }

        .main-header .main-wrapper .header-gnb > ul > li > ul {
            display: none;
            position: absolute;
            top: 40px;
            left: 0;
            padding: 8px 0;
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(1) > ul {
            /*display:none;*/
            /*min-width: 1000px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(2) > ul {
            /*min-width: 1000px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(3) > ul {
            /*min-width: 760px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(4) > ul {
            margin-left: -314px;
            /*min-width: 1060px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(5) > ul {
            margin-left: -490px;
            /*min-width: 990px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(6) > ul {
            margin-left: -242px;
            /*min-width: 600px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:nth-child(7) > ul {
            margin-left: -942px;
            /*min-width: 800px;*/
        }

        .main-header .main-wrapper .header-gnb > ul > li:hover > ul {
            display: block;
        }

        .main-header .main-wrapper .header-gnb > ul > li > ul > li {
            float: left;
        }

            .main-header .main-wrapper .header-gnb > ul > li > ul > li > a {
                color: #fff;
                padding: 0 21px;
                font-size: 14px;
                text-decoration: none;
            }

        .main-header .main-wrapper .header-gnb > ul > li.active > ul > li.active > a {
            text-decoration: underline;
        }

.main-header .main-wrapper .layout-header .header-wrapper .header-mobile-gnb {
    /*display: none;
    position: absolute;
    right: 12px;
    color: #333;
    background: #fff;
    padding: 7px 11px 6px 11px;
    font-size: 1.6em;
    border-radius: 2px;
    cursor: pointer;*/
}


/*.main-header .main-wrapper .gnb-line {
    position: absolute;
    top: 80px;
    left: 0;
    height: 35px;
    width: 100%;
    min-width: 1170px;
    background: #185d9e;
}*/

a{text-decoration:none !important;}


.ms2-box-cotnent { text-align:center; padding:15px 0px; }
.ms2bc-title { font-size:40px; font-weight:600;}
.ms2bc-desc { color:#7A7A7A; font-size:14px; font-weight:600; }

.i0 { text-align:center; cursor:pointer; }
.i0 img { float:none !important; margin-top:0px !important; }
.i0 p:nth-child(2) { color:#fff; font-size:22px; font-weight:600; margin-top:10px; margin-bottom:10px; }
.i0 p:nth-child(3) { color:#fff; font-size:14px; color:#fff; margin-bottom:15px; }

.header-mobile-gnb { float:right; font-size:28px; padding-top:10px; }
.mm-panel { background:#0c69ae !important; }
.mm-title, .mm-listview>li>a, .mm-listview>li>span { color:#fff !important; }
.mm-menu .mm-listview>li .mm-next:after { border-color:#fff !important; }

.ms2-box { transition:all ease 0.3s; }
.ms2-box.active { border:10px solid #09A4C3 !important; transition:all ease 0.3s; }
.ms2-box.active  .circle span { background:#09A4C3 !important; }
.ms2-shadow { background:rgba(0,0,0,0.45); width:100%; height:100%; display:none; }
.ms2-table { border:0px;  width:100%; display:none; table-layout:fixed; position: absolute; top: 50%; }
.ms2-table td { text-align:center; padding:6px 0px; width:50%; } 
.ms2-table td a { padding:5px; transition:all ease 0.3s; }
.ms2-table td:hover a { background:rgba(54,191,218,0.4);  transition:all ease 0.3s; }
.ms2-table td a { text-decoration:none; color:#fff; font-size:18px; font-family:NanumBarunGothic;  }


@media (max-width:1200px){
    .main-header .main-wrapper .header-gnb > ul > li{
        padding:0 16px;
    }

    .First_Box .container{
        text-align:center;
    }


    .First_Box .cont{
        font-size:13px !important;
    }

    .First_Box .cont_box{
        padding:0 !important;
    }

    .Four_Box .Four-Col3 .cont_subbox .cont{
        font-size:13px !important;
    }

    .gnb-wrapper .gnb > ul > li{
        padding-right:52px;
    }

    /*.footer .wrap-footer .footer-content{font-size:0;}

    .footer .wrap-footer .footer-content .logo{
        width:20%;
    }

    .footer .wrap-footer .footer-content .content{
        width:80%;
    }*/


}

@media (max-width:992px){
    .main-header .main-wrapper .header-gnb{
        top:25px;
        left:235px;
    }

    .main-header .main-wrapper .header-gnb > ul > li > a{
        font-size:19px;
    }

    .main-header .main-wrapper .header-gnb > ul > li{
        padding:0 4px;
    }

    .First_Box .cont{
        font-size:13px !important; white-space:nowrap;
    }

    .gnb-wrapper .gnb > ul > li{
        padding-right:22px;
    }

    .footer .wrap-footer .footer-content .logo{
        left:50%;
        transform:translateX(-50%);
    }

    .footer .wrap-footer .footer-content .content{
        text-align:center;
    }


}

@media (max-width:768px){
    .gnb-wrapper{padding:0;}
    .footer .wrap-footer .footer-content .logo, .footer .wrap-footer .footer-content .content{
        text-align:center;
        float:none;
    }
    .footer .wrap-footer .footer-content .icon{text-align:center;}
    .footer .wrap-footer .footer-content .content{padding:0;}


}