/* ----------- Common ----------- */
/* ==================================================================================
    Media query
================================================================================== */
@media only screen
and (max-width: 1300px) {

    /* inner layout box */
    #wrap .inner-wrap-narrow {
        width: 100%;
    }

}

@media only screen
and (max-width: 1280px) {

    .drawer-nav .drawer-menu > li.w-col1,
    .drawer-nav .drawer-menu > li.major {
        width: 33.33333%;
    }

}

@media only screen
and (max-width: 1024px) {

    /*******************
        hidden
    *******************/
    .visible-xs {
        display: block !important;
    }
    .hidden-xs {
        display: none !important;
    }

    /*******************
        layout
    *******************/
    /* inner layout box */
    #wrap .inner-wrap {
        padding: 0;
    }

    /* ----------------------------------------------------------------------------------
        style : mobile menu
    ---------------------------------------------------------------------------------- */
    .drawer--right.drawer-open .drawer-nav {
        width: 86%;
        height: 100vh;
        max-height: 800px;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch; /* mobile safari */
    }
    .drawer-nav h3 {
        margin: 0 20px 30px;
        padding: 20px 0;
        font-size: 21px;
    }
    .drawer-nav .drawer-menu {
        padding: 0 20px 60px;
    }
    .drawer-nav .drawer-menu > li {
        margin: 0 0 20px;
    }
    .drawer-nav .drawer-menu > li.major {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.w-col1,
    .drawer-nav .drawer-menu > li.major {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.w-col1 {
        margin-bottom: 40px;
    }
    .drawer-nav .drawer-menu > li.cyber-gallery {
        margin-top: 0;
        padding-top: 20px;
    }
    .drawer-nav .drawer-menu > li.cyber-gallery > a {
        margin: 0 0 30px;
    }
    .drawer-nav .drawer-menu > li.community.main.top {
        margin-top: 20px;
        padding-top: 30px;
    }
    .drawer-nav .drawer-menu > li.community {
        margin: 0 0 15px;
    }
    .drawer-nav .drawer-menu > li.community > a {
        font-size: 16px;
        font-weight: bold;
    }
    .drawer-nav .drawer-menu > li.community > a > small {
        display: none;
    }
    .drawer-nav .drawer-menu > li.community.sub {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.community.sub > a {
        font-size: 16px;
        font-weight: bold;
        letter-spacing: -0.45px;
    }
    .drawer-nav .drawer-menu > li.community.sub > a > small {
        display: inline-block;
        margin: 0 0 0 10px;
        font-size: 13px;
    }
    .drawer-nav .drawer-menu > li > a {
        margin: 0 0 15px;
        font-size: 19px;
    }
    .drawer-nav .drawer-menu > li > a  + ul.sub-menu > li {
        display: inline-block;
        margin: 0 20px 15px 0;
    }
    .drawer-nav .drawer-menu > li > a  + ul.sub-menu > li > a {
        font-size: 15px;
    }
    .drawer-nav .drawer-toggle.close {
        float: none;
        position: absolute;
        right: 20px;
        top: 14px;
        font-size: 36px;
        opacity: 0.75;
    }

    /* mobile-etc-menu */
    #header ul.mobile-etc-menu {
        display: block;
        width: 100%;
        margin-top: 10px;
        padding: 10px 0 0;
        text-align: right;
        border-top: 1px solid #f4f4f4;
    }
    #header ul.mobile-etc-menu > li {
        display: inline-block;
    }
    #header ul.mobile-etc-menu > li a {
        color: #002e66;
    }
    #header ul.mobile-etc-menu > li.cyber-gallery {

    }
    #header ul.mobile-etc-menu > li.alumni-network {
        margin-left: 15px;
    }
    #header ul.mobile-etc-menu > li.giving {
        margin-left: 15px;
    }

    /* *******************************************************************
        #header
    ******************************************************************* */
    #header.sticky {

    }
    #header .inner-wrap {
        padding: 10px 20px;
        border-bottom: 1px solid #f0f0f0;
    }
    #header.sticky .inner-wrap {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    #header.sticky .mobile-etc-menu {
        display: none !important;
    }
    .sub #header .inner-wrap {
        border-bottom: 1px solid #f0f0f0;
    }

    /* logo */
    h1.logo {
        height: auto;
    }
    h1.logo a {
        display: inline-block;
    }
    h1.logo a img {
        display: block;
        height: 28px;
    }

    /* gnb */
    .gnb {
        right: 20px;
        top: 22px;
    }
    #header.sticky .inner-wrap .gnb {
        top: 22px;
    }
    .gnb li {
        margin: 0 0 0 15px;
    }
    .gnb li > a {
        letter-spacing: -0.25px;
        font-size: 18px;
    }
    #header .gnb > ul > li.cyber-gallery,
    #header .gnb > ul > li.alumni-network,
    #header .gnb > ul > li.giving {
        display: none;
    }

}

@media only screen
and (max-width: 960px) {

    .drawer-nav .drawer-menu > li.w-col1,
    .drawer-nav .drawer-menu > li.major {
        width: 50%;
    }

}

/* max-width: 768px */
@media only screen
and (max-width: 768px) {

    /*******************
        hidden
    *******************/
    .visible-xs {
        display: block !important;
    }
    .hidden-xs {
        display: none !important;
    }

    /*******************
        layout
    *******************/
    /* inner layout box */
    #wrap .inner-wrap {
        padding: 0;
    }

    /* ----------------------------------------------------------------------------------
        style : mobile menu
    ---------------------------------------------------------------------------------- */
    .drawer--right.drawer-open .drawer-nav {
        width: 86%;
    }
    .drawer-nav h3 {
        margin: 0 20px 30px;
        padding: 20px 0;
        font-size: 21px;
    }
    .drawer-nav .drawer-menu {
        padding: 0 20px 60px;
    }
    .drawer-nav .drawer-menu > li {
        margin: 0 0 20px;
    }
    .drawer-nav .drawer-menu > li.major {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.w-col1,
    .drawer-nav .drawer-menu > li.major {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.w-col1 {
        margin-bottom: 40px;
    }
    .drawer-nav .drawer-menu > li.cyber-gallery {
        margin-top: 0;
        padding-top: 20px;
    }
    .drawer-nav .drawer-menu > li.cyber-gallery > a {
        margin: 0 0 30px;
    }
    .drawer-nav .drawer-menu > li.community.main.top {
        margin-top: 20px;
        padding-top: 30px;
    }
    .drawer-nav .drawer-menu > li.community {
        margin: 0 0 15px;
    }
    .drawer-nav .drawer-menu > li.community > a {
        font-size: 16px;
        font-weight: bold;
    }
    .drawer-nav .drawer-menu > li.community > a > small {
        display: none;
    }
    .drawer-nav .drawer-menu > li.community.sub {
        float: none;
        width: 100%;
    }
    .drawer-nav .drawer-menu > li.community.sub > a {
        font-size: 16px;
        font-weight: bold;
        letter-spacing: -0.45px;
    }
    .drawer-nav .drawer-menu > li.community.sub > a > small {
        display: inline-block;
        margin: 0 0 0 10px;
        font-size: 13px;
    }
    .drawer-nav .drawer-menu > li > a {
        margin: 0 0 15px;
        font-size: 19px;
    }
    .drawer-nav .drawer-menu > li > a  + ul.sub-menu > li {
        display: inline-block;
        margin: 0 20px 15px 0;
    }
    .drawer-nav .drawer-menu > li > a  + ul.sub-menu > li > a {
        font-size: 15px;
    }
    .drawer-nav .drawer-toggle.close {
        float: none;
        position: absolute;
        right: 20px;
        top: 14px;
        font-size: 36px;
        opacity: 0.75;
    }

    /* mobile-etc-menu */
    #header ul.mobile-etc-menu {
        display: block;
        width: 100%;
        margin-top: 10px;
        padding: 10px 0 0;
        text-align: right;
        border-top: 1px solid #f4f4f4;
    }
    #header ul.mobile-etc-menu > li {
        display: inline-block;
    }
    #header ul.mobile-etc-menu > li a {
        color: #002e66;
    }
    #header ul.mobile-etc-menu > li.cyber-gallery {

    }
    #header ul.mobile-etc-menu > li.alumni-network {
        margin-left: 15px;
    }
    #header ul.mobile-etc-menu > li.giving {
        margin-left: 15px;
    }

    /* *******************************************************************
        #header
    ******************************************************************* */
    #header.sticky {

    }
    #header .inner-wrap {
        padding: 10px 20px;
        border-bottom: 1px solid #f0f0f0;
    }
    #header.sticky .inner-wrap {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    #header.sticky .mobile-etc-menu {
        display: none !important;
    }
    .sub #header .inner-wrap {
        border-bottom: 1px solid #f0f0f0;
    }

    /* logo */
    h1.logo {
        height: auto;
    }
    h1.logo a {
        display: inline-block;
    }
    h1.logo a img {
        display: block;
        height: 28px;
    }

    /* gnb */
    .gnb {
        right: 20px;
        top: 22px;
    }
    #header.sticky .inner-wrap .gnb {
        top: 22px;
    }
    .gnb li {
        margin: 0 0 0 15px;
    }
    .gnb li > a {
        letter-spacing: -0.25px;
        font-size: 18px;
    }
    #header .gnb > ul > li.cyber-gallery,
    #header .gnb > ul > li.alumni-network,
    #header .gnb > ul > li.giving {
        display: none;
    }

    /*******************
        카카오맵
    *******************/
    .root_daum_roughmap {
        width: 100% !important;
    }

    /* *******************************************************************
        #footer
    ******************************************************************* */
    #wrap #footer .inner-wrap {
        padding: 40px 0 60px;
    }

    /* address */
    address {
        margin: 0 0 10px;
    }
    address p.title {
        margin: 0 0 15px;
        font-size: 17px;
    }
    #footer .address li {
        margin: 0 0 20px;
        font-size: 13px;
    }

    /* copyright */
    #footer .copyright {
        font-size: 13px;
    }

    /* *******************************************************************
        #footer type2
    ******************************************************************* */
    #footer.type2 .inner-wrap {
        padding: 40px 0;
    }

    /* address */
    #footer.type2 address b {
        display: block;
        margin: 0 0 5px;
    }
    #footer.type2 .address li {
        display: block;
        margin: 0 0 20px;
        font-size: 14px;
    }
    #footer.type2 .address li span,
    #footer.type2 .address li.divline {
        display: none;
    }

    /* copyright */
    #footer.type2 .copyright {
        font-size: 14px;
    }

    /* *******************************************************************
        etc
    ******************************************************************* */
    /* back-to-top */
    .back-to-top {
        cursor: pointer;
        position: fixed;
        bottom: 20px;
        left: 50%;
        /*display: none;*/
        width: 46px;
        height: 46px;
        margin-left: -23px;
        padding-top: 10px;
        font-size: 12px;
        font-weight: 300;
        color: #fff;
        border: 0;
        border-radius: 100% !important;
        background-color: rgba(0,0,0,0.25);
    }
    .back-to-top:hover {
        color: #fff;
        background-color: rgba(0,46,102,0.85);
    }
    .ios-device.back-to-top {
        bottom: 30px;
    }
    .back-to-top i {
        margin: 0;
        line-height: 1.1;
        font-size: 24px;
    }

    /* back-to-back */
    .back-to-back {
        cursor: pointer;
        position: fixed;
        bottom: 20px;
        left: 20px;
        /*display: none;*/
        width: 46px;
        height: 46px;
        padding-top: 10px;
        font-size: 12px;
        font-weight: 300;
        color: #fff;
        border: 0;
        border-radius: 100% !important;
        background-color: rgba(0,0,0,0.25);
    }
    .back-to-back:hover {
        color: #fff;
        background-color: rgba(0,46,102,0.85);
    }
    .ios-device.back-to-back {
        bottom: 30px;
    }
    .back-to-back i {
        margin: 0;
        line-height: 1.1;
        font-size: 24px;
    }

    /* back-to-next */
    .back-to-next {
        cursor: pointer;
        position: fixed;
        bottom: 20px;
        right: 20px;
        /*display: none;*/
        width: 46px;
        height: 46px;
        padding-top: 10px;
        font-size: 12px;
        font-weight: 300;
        color: #fff;
        border: 0;
        border-radius: 100% !important;
        background-color: rgba(0,0,0,0.25);
    }
    .back-to-next:hover {
        color: #fff;
        background-color: rgba(0,46,102,0.85);
    }
    .ios-device.back-to-next {
        bottom: 30px;
    }
    .back-to-next i {
        margin: 0;
        line-height: 1.1;
        font-size: 24px;
    }

    /* back-to-list */
    .back-to-list {
        cursor: pointer;
        position: fixed;
        bottom: 80px;
        /*left: 50%;*/
        left: auto;
        right: 20px;
        /*display: none;*/
        width: 46px;
        height: 46px;
        /*margin-left: -23px;*/
        padding-top: 10px;
        font-size: 12px;
        font-weight: 300;
        color: #fff;
        border: 0;
        border-radius: 100% !important;
        background-color: rgba(0,0,0,0.25);
    }
    .back-to-list:hover {
        color: #fff;
        background-color: rgba(0,46,102,0.85);
    }
    .ios-device.back-to-list {
        bottom: 90px;
    }
    .back-to-list i {
        margin: 0;
        line-height: 1.1;
        font-size: 24px;
    }

}

/* ----------- Tablet ----------- */
/* Portrait and Landscape */
@media only screen
and (min-width: 768px)
and (max-width: 1024px) {

}

/* Portrait */
@media only screen
and (min-width: 768px)
and (max-width: 1024px)
and (orientation: portrait) {

}

/* Landscape */
@media only screen
and (min-width: 768px)
and (max-width: 1024px)
and (orientation: landscape) {

}

/* ----------- Phone ----------- */
/* max-width: 767px */
@media only screen
and (max-width: 767px) {

}

/* max-width: 639px */
@media only screen
and (max-width: 639px) {

}

/* max-width: 480px */
@media only screen
and (max-width: 480px) {



}

/* max-width: 320px */
@media only screen
and (max-width: 320px) {

}

/*
##Device = Tablets, Ipads (landscape)
##Screen = B/w 768px to 1024px
##Device = 태블릿, 아이패드(가로)
##Screen = 768px에서 1024px 사이
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {



}

/* ----------- iPad Pro 10.5" ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 834px)
and (max-device-width: 1112px)
and (-webkit-min-device-pixel-ratio: 2) {



}

/* ----------- iPad Pro 12.9" ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 1024px)
and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2) {



}
