/*===========================================
# Fonts
===========================================*/

@charset "utf-8";
/*
    font-weight
    --------------
    Thin 100
    Light 200
    DemiLight 300
    Regular 500
    Medium 700
    Bold 800
    Black 900
*/
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 100;
    src: local('Noto Sans KR Thin'),
    url('../fonts/NotoSansKR-Thin.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Thin.woff') format('woff'),
    url('../fonts/NotoSansKR-Thin.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 200;
    src: local('Noto Sans KR Light'),
    url('../fonts/NotoSansKR-Light.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Light.woff') format('woff'),
    url('../fonts/NotoSansKR-Light.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 300;
    src: local('Noto Sans KR DemiLight'),
    url('../fonts/NotoSansKR-DemiLight.woff2') format('woff2'),
    url('../fonts/NotoSansKR-DemiLight.woff') format('woff'),
    url('../fonts/NotoSansKR-DemiLight.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 500;
    src: local('Noto Sans KR Regular'),
    url('../fonts/NotoSansKR-Regular.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Regular.woff') format('woff'),
    url('../fonts/NotoSansKR-Regular.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 700;
    src: local('Noto Sans KR Medium'),
    url('../fonts/NotoSansKR-Medium.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Medium.woff') format('woff'),
    url('../fonts/NotoSansKR-Medium.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 800;
    src: local('Noto Sans KR Bold'),
    url('../fonts/NotoSansKR-Bold.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Bold.woff') format('woff'),
    url('../fonts/NotoSansKR-Bold.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-weight: 900;
    src: local('Noto Sans KR Black'),
    url('../fonts/NotoSansKR-Black.woff2') format('woff2'),
    url('../fonts/NotoSansKR-Black.woff') format('woff'),
    url('../fonts/NotoSansKR-Black.otf') format('opentype');
}

/*
    font-weight
    --------------
    Light 300
    Regular 400
    Bold 700
    Black 800
*/
@font-face {
    font-family: 'NanumSquare';
    font-weight: 300;
    src: url('../fonts/NanumSquareL.eot');
    src: url('../fonts/NanumSquareL.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NanumSquareL.woff') format('woff'),
        url('../fonts/NanumSquareL.ttf') format('truetype');
}
@font-face {
    font-family: 'NanumSquare';
    font-weight: 400;
    src: url('../fonts/NanumSquareR.eot');
    src: url('../fonts/NanumSquareR.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NanumSquareR.woff') format('woff'),
        url('../fonts/NanumSquareR.ttf') format('truetype');
}
@font-face {
    font-family: 'NanumSquare';
    font-weight: 700;
    src: url('../fonts/NanumSquareB.eot');
    src: url('../fonts/NanumSquareB.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NanumSquareB.woff') format('woff'),
        url('../fonts/NanumSquareB.ttf') format('truetype');
}
@font-face {
    font-family: 'NanumSquare';
    font-weight: 800;
    src: url('../fonts/NanumSquareEB.eot');
    src: url('../fonts/NanumSquareEB.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NanumSquareEB.woff') format('woff'),
        url('../fonts/NanumSquareEB.ttf') format('truetype');
}

@import url('https://fonts.googleapis.com/earlyaccess/nanumgothic.css');


/*===========================================
# Base
===========================================*/

html {
    box-sizing: border-box;
}
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    overflow-x: hidden;
}
body {
    position: relative;
    font-family: 'Noto Sans KR', sans-serif;
    line-height: 1.4;
    color: #555;
}
h1, h2, h3, h4, h5, h6 {
    clear: both;
    word-break:keep-all;
}
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
p, li, dt, dd {
    word-break:keep-all;
}
img {
    max-width: 100%;
    height: auto;
}
a {
    color: #555;
    text-decoration:  none;
    box-shadow: none !important;
}
a, a:active, a:focus, a:hover {
    outline: none;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
a:hover {
    color: #222;
    text-decoration: none;
}
button {
    box-shadow: none !important;
}


/*===========================================
# Main Color
===========================================*/

.col-default-black {
    color: #333;
}
.col-default-red {
    color: #ae1a4a;
}
.col-light-red {
    color: #e93429;
}


/*===========================================
# Main Navigation - PC
===========================================*/
nav.navbar.bootsnav {
    padding: 0;
    border-bottom: solid 1px #ddd;
    z-index: 98;
}

nav.navbar.bootsnav .animated {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

nav.navbar.bootsnav .brand-header {
    padding: 15px 0;
    text-align: center;
    border-bottom: solid 1px #ddd;
    min-height: 91px;
}

nav.navbar.bootsnav .navbar-brand {
    display: none;
}

nav.navbar.bootsnav .navbar-collapse-header {
    display: none !important;
}

nav.navbar.bootsnav ul.nav > li > a {
    position: relative;
    display: block;
    padding: 15px 30px;
    font-size: 1.25rem;
    font-weight: 800;
    color: #222;
}

nav.navbar.bootsnav li.dropdown ul.dropdown-menu {
    top: calc(100% - 2px);
    border-top: solid 2px;
    border-top-color: #e93429 !important;
    font-size: 0.875rem;
    width: 180px;
}

nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a {
    color: #222;
}

nav.navbar.bootsnav .attr-nav.mobile {
    display: none !important;
}

nav.navbar.bootsnav .attr-nav.desktop > ul > li > a {
    display: block;
    padding: 13px 15px 17px !important;
    font-size: 1rem;
    font-weight: 700;
    color: #555 !important;
}

nav.navbar.bootsnav .attr-nav.desktop > ul > li > a:focus,
nav.navbar.bootsnav .attr-nav.desktop > ul > li > a:hover {
    background: transparent;
}

/* Hide Dropdown Caret */
.dropdown-toggle::after {
    display: none;
}

.navbar-block {
    height: 148px;
}

/*===========================================
# Main Navigation - Mobile
===========================================*/
@media (max-width: 991px) {
    nav.navbar.navbar-mobile .brand-header {
        display: none;
    }
    nav.navbar.bootsnav .navbar-brand {
        display: block;
    }
    nav.navbar.navbar-mobile .navbar-header {
        padding: 8px 20px !important;
        width: 100%;
        min-height: 61px;
    }

    nav.navbar.navbar-mobile .navbar-header i.material-icons {
        font-size: 1.75rem;
    }

    nav.navbar.navbar-mobile .navbar-brand img.logo {
        width: 130px;
    }

    nav.navbar.navbar-mobile .navbar-collapse-header {
        display: block !important;
        padding: 10px 20px;
        background: #e93429;
        text-align: right;
    }

    nav.navbar.navbar-mobile .navbar-collapse-header .close-menu {
        color: #fff;
    }

    nav.navbar.navbar-mobile ul.nav li.dropdown ul.dropdown-menu li a {
        padding-left: 35px !important;
    }

    nav.navbar.navbar-mobile ul.nav li.dropdown ul.dropdown-menu {
        padding: 0 !important;
    }

    nav.navbar.navbar-mobile ul.nav > li > a {
        padding: 15px 25px !important;
        border-top: none;
        font-size: 1rem;
        font-weight: 700;
    }

    nav.navbar.navbar-mobile .dropdown .megamenu-content .row {
        margin: 0;
        border-bottom: solid 1px #ddd;
    }

    nav.navbar.navbar-mobile .dropdown .megamenu-content .col-menu {
        padding: 0;
    }

    nav.navbar.bootsnav.navbar-mobile ul.nav ul.dropdown-menu .col-menu .title {
        padding-top: 13px !important;
        padding-right: 40px !important;
        padding-bottom: 13px !important;
        padding-left: 35px !important;
    }

    nav.navbar.bootsnav .dropdown .megamenu-content .col-menu .content {
        padding: 0;
    }

    nav.navbar.bootsnav .dropdown .megamenu-content .col-menu .content .menu-col a {
        padding-left: 50px !important;
    }

    nav.navbar.navbar-mobile .attr-nav {
        display: block !important;
    }

    nav.navbar.bootsnav .attr-nav.desktop {
        display: none !important;
    }

    nav.navbar.bootsnav .attr-nav.mobile {
        display: block !important;
    }

    nav.navbar.navbar-mobile .attr-nav > ul > li > a {
        padding: 20px 15px 15px;
        color: #222;
    }

    nav.navbar.navbar-mobile .attr-nav i.material-icons {
        font-size: 1.75rem;
    }

    nav.navbar.navbar-mobile .attr-nav li.dropdown ul.dropdown-menu {
        left: -180px;
        border-top: solid 1px #e0e0e0 !important;
        width: 150px !important;
        border-radius: .25rem;
    }

    nav.navbar.navbar-mobile .attr-nav li.dropdown ul.dropdown-menu a{
        padding: 10px 20px;
        background: transparent;
    }
}

.mobile-overlay {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

@media (max-width: 991px) {
    nav.navbar.bootsnav .navbar-toggler {
        outline:none;
        margin-top: 3px;
    }
    nav.navbar.bootsnav .navbar-collapse.collapse {
        display: block !important;
    }
    .wrap-sticky nav.navbar.bootsnav {
         left: auto;
    }
    .side-right .mobile-overlay {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin-left: 280px;
        background-color: #000;
        opacity: 0.5;
        z-index: 99;
    }

    .navbar-block {
        height: 61px;
    }
}

/*===========================================
# Main Navigation - Color
===========================================*/
nav.navbar.bootsnav ul.nav > li > a:hover,
nav.navbar.bootsnav ul.nav li.active > a,
nav.navbar.bootsnav.on ul.nav li.dropdown ul.dropdown-menu li.active > a,
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li.active > a,
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li a:hover,
nav.navbar ul.nav li.dropdown.on > a {
    color: #e93429 !important;
}


/*===========================================
# Footer
===========================================*/

footer .fnb {
    padding: 5px 0;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}
footer .fnb a {
    display: inline-block;
    padding: 10px 0;
    margin-right: 30px;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.5px;
    color: #222;
}
footer .fnb a.privacy_policy {
    color: #e93429;
}
footer .footer-info {
    padding: 30px 0 40px;
}
footer .footer-info p {
    font-size: 0.7825rem;
    font-weight: 700;
    line-height: 1.3;
    color: #777;
    margin-bottom: 5px;
}
footer .footer-info p.copyrights {
    margin-top: 15px;
    font-size: 0.8125rem;
    font-family: 'Nanum Gothic';
    color: #999;
}

@media (max-width: 767px) {
    footer .fnb a {
        font-size: 0.875rem;
    }

    footer .footer-info {
        padding: 20px 0 40px;
    }
    footer .footer-info .col-auto {
        width: 100%;
        margin-bottom: 15px;
    }
}

@media (max-width: 575px) {
    footer .fnb a {
        font-size: 0.75rem;
    }

    footer .footer-info p {
        font-size: 0.75rem;
    }
}

@media (max-width: 480px) {
    footer .fnb a {
        margin-right: 20px;
    }
}