/* ==========================================================================
최종수정 20250401
========================================================================== */



/*===== 공통 영역 포함 리스트 =====*/
/*
    - 사이드메뉴
    - 네비게이션
    - 푸터
    - 네비 탭(depth2, depth3) 화면
    - jQuery combobox
    - 게시판
*/


/* 0.5초씩 바운스 효과 */
/*
.bounce:hover {
    position: relative;
    -moz-animation: bounce 0.5s infinite linear;
    -webkit-animation: bounce 0.5s infinite linear;
    -o-animation: bounce 0.5s infinite linear;
    animation: bounce 0.5s infinite linear;
}
*/

.bounce.active:hover {
    position: static;
    -moz-animation: none;
    -webkit-animation: none;
    -o-animation: none;
    animation: none;
}

/* 
바운스의 높이
0% 일 때, 0px
50%일 때, -5px
70%일 때, -50px
100%일 때, 0px
*/
@-webkit-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -5px;
    }

    70% {
        top: -10px;
    }

    100% {
        top: 0;
    }
}

@-moz-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -5px;
    }

    70% {
        top: -10px;
    }

    100% {
        top: 0;
    }
}

@-o-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -5px;
    }

    70% {
        top: -10px;
    }

    100% {
        top: 0;
    }
}

@-ms-keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -5px;
    }

    70% {
        top: -10px;
    }

    100% {
        top: 0;
    }
}

@keyframes bounce {
    0% {
        top: 0;
    }

    50% {
        top: -5px;
    }

    70% {
        top: -10px;
    }

    100% {
        top: 0;
    }
}



/*===== [사이드] 우측 고정 메뉴 =====*/
.btn-hideshow {
    cursor: pointer;
    width: 80px;
    height: 60px;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0;
    order: 2;
}

.btn-hideshow > div {
    background-color: #000;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    margin: 10px auto 0;
}

.btn-hideshow > div span {
    display: block;
    background: url('../images/icon-dots.png') no-repeat center;
    width: 48px;
    height: 48px;
}

.wrap-aside {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 11;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.wrap-aside .aside {
    order: 1;
}

.aside {
    padding: 0;
    margin: 0;
    background: #FFF;
    display: inline-block;
    height: auto;
    border-radius: 100px;
    box-shadow: 1px 2px 10px rgba(36, 83, 150, 0.15);
}

.aside li {
    cursor: pointer;
    width: 80px;
    height: 60px;
    line-height: 60px;
    font-size: 17px;
    color: #FFF;
}

.aside li div.slideInLeft,
.aside li .aside-icon {
    position: absolute;
    text-align: center;
    animation-duration: 0.34s;
}

.aside li .aside-icon {
    width: 32px;
    height: 32px;
    line-height: 32px;
    z-index: 9;
    margin: 15px 24px;
}

.aside li div.slideInLeft {
    margin-left: 0;
    text-align: center;
    width: max-content;
    height: 54px;
    line-height: 54px;
    margin-top: 3px;
    border-radius: 100px;
    z-index: 1;
    background: #003A78;
    transform: translateX(-160px);
    transition: all 0.2s ease-in-out;
    opacity: 0;
    pointer-events: none;
}

.aside li:hover > div.slideInLeft {
    display: inline-block;
    transform: translateX(0);
    margin-left: -186px;
    opacity: 1;
    padding-left: 10px;
    text-align: right;
    position: absolute;
    right: 6px;
    pointer-events: all;
}

.aside li > div.slideInLeft span.blank {
    width: 32px;
    height: 32px;
    background-color: rgba(0, 0, 0, 0);
    display: inline-block;
    line-height: 60px;
    vertical-align: middle;
    margin-right: 18px;
    margin-left: 10px;
}

.aside li > div.slideInLeft span.aside-menu {
    padding-left: 10px;
}

.aside li:nth-child(1) {
    margin-top: 10px;
}

.aside li:nth-last-child(1) {
    margin-bottom: 10px;
}

.aside li .aside-icon {
    width: 32px;
    height: 32px;
    background-size: contain;
}

.aside .aside-icon-1 { /*한국문학 해외진출 활성화 플랫폼*/
    background: url('../images/klwave-black.png') no-repeat center;
}

.aside li:nth-child(1):hover > div.aside-icon-1 {
    background: url('../images/klwave-white.png') no-repeat center;
}

.aside .aside-icon-2 { /*한국문학 디지털도서관*/
    background: url('../images/icon-full_book.png') no-repeat center;
}

.aside li:nth-child(2):hover > div.aside-icon-2 {
    background: url('../images/icon-full_book_fff.png') no-repeat center;
}

.aside .aside-icon-3 { /*계간지 KLN*/
    background: url('../images/icon-full_computer.png') no-repeat center;
}

.aside li:nth-child(3):hover > div.aside-icon-3 {
    background: url('../images/icon-full_computer_fff.png') no-repeat center;
}

.aside .aside-icon-4 { /*번역아카데미*/
    background: url('../images/icon-full_logo.png') no-repeat center;
}

.aside li:nth-child(4):hover > div.aside-icon-4 {
    background: url('../images/icon-full_logo_fff.png') no-repeat center; 
}

.aside .aside-icon-5 { /*서울국제작가축제*/
    background: url('../images/icon-full_pen.png') no-repeat center; 
}
.aside li:nth-child(5):hover > div.aside-icon-5 {
    background: url('../images/icon-full_pen_fff.png') no-repeat center;  
}

.aside .aside-icon-6 { /*디아스포라 웹진 《너머*/
    background: url('../images/icon-diasporabook.png') no-repeat center;
}

.aside li:nth-child(6):hover > div.aside-icon-6 {
    background: url('../images/icon-diasporabook-fff.png') no-repeat center;
}

.aside p {
    color: #000;
    text-align: center;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 17px;
}

.aside p:hover {
    color: #003A78;
    transition: 0.3s;
}

.hidden,
.m-only {
    display: none;
}

.pc-only {
    display: block;
}

/* header */
header nav {
    /*position: fixed;*/
    top: 0;
    left: 0;
    z-index: 99;
    background-color: #FFFFFF;
    width: 100%;
    height: 85px;
    line-height: 85px;
    /*transition: background-color 0.2s ease, backdrop-filter 0.2s ease;*/
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

header nav .nav-wrap {
    width: 1360px;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header nav .nav-wrap .logo img {
    width: 200px;
    display: block;
}

header nav .nav-wrap .nav-list {
    height: 100%;
    display: flex;
    /*flex-basis: 60%;*/
    justify-content: space-between;
}

header nav .nav-wrap .nav-list > li > a {
    padding: 32px 12px;
    color: #333333;
    font-size: 18px;
    transition: 0.2s;
    position: relative;
}

header nav .nav-wrap .nav-list > li > a::after {
    content: '';
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 0;
    height: 5px;
    background-color: #3B61A8;
    transition: 0.2s;
}

header nav .nav-wrap .nav-list > li > a:hover {
    color: #111111;
    font-weight: bold;
}

header nav .nav-wrap .nav-list > li > a:hover::after {
    width: 100%;
}

header nav .nav-wrap .nav-list > li.active > a {
    color: #3B61A8;
    font-weight: bold;
}

header .side-nav-wrap {
    width: 100%;
    height: 0;
    background-color: #FFFFFF;
    position: relative;
    left: 50%;
    /*top: 85px;*/
    transform: translateX(-50%);
    z-index: 99;
    transition: height 0.3s ease;
    overflow: hidden;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

header .side-nav-wrap.open {
    height: 120px;
}

header .side-nav-wrap .side-nav-list {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1360px;
    margin: 0 auto;
    height: 100%;
}

header .side-nav-wrap .side-nav-list li {
    height: 100%;
    /*margin: 0 auto;*/
    flex-basis: 20%;
}

header .side-nav-wrap .side-nav-list li a {
    height: 100%;
    line-height: normal;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}

header .side-nav-wrap .side-nav-list li a span {
    position: relative;
}

header .side-nav-wrap .side-nav-list li a span::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 5px;
    background-color: #3B61A8;
    transition: 0.2s;
}

header .side-nav-wrap .side-nav-list li a:hover span::after {
    width: 100%;
}

header .side-nav-wrap .side-nav-list li a.active span {
    font-weight: bold;
    color: #3B61A8;
}

header .side-nav-wrap .side-nav-list li a img {
    width: 50px;
}

header nav .btn-wrap {
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 14px;
}

header nav .nav-wrap .time-div-pc,
header nav .nav-wrap .logout-pc {
    display: flex;
    align-items: center;
    font-size: 14px;
    background-color: #F3F3F3;
    border-radius: 8px;
    gap: 4px;
    padding: 4px 12px;
    height: auto;
}

header nav .nav-wrap .time-div-pc img,
header nav .nav-wrap .logout-pc img {
    width: 12px;
}

header nav .nav-wrap .time-div-pc span:last-child,
header nav .nav-wrap .logout-pc span:last-child {
    color: #D5164D;
    transition: 0.2s;
}

header nav .nav-wrap .time-div-pc:hover span:last-child,
header nav .nav-wrap .logout-pc:hover span:last-child {
    font-weight: 500;
}

header nav .nav-wrap .hamburger-menu {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 4px;
}

header nav .nav-wrap .hamburger-menu span {
    width: 20px;
    height: 2px;
    background-color: #111111;
    border-radius: 3px;
    transition: all 0.2s ease;
}

header .time-div-mobile {
    display: none;
}

header > li.active > a {
    color: #3B61A8;
    font-weight: bold;
}
/* header */


/*===== footer =====*/
/* style.css */
footer {
    position: relative;
    background: #0D1257;
    font-size: 15px;
    margin-top: 150px;
}

footer .container {
    max-width: 1440px;
    margin: 0 auto;
}

footer .fnb {
    padding: 1rem 0;
    border-bottom: 1px solid #4B4B81;
}

footer .fnb .container ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

footer .fnb .container ul li a.text-info {
    color: #c2c2d6;
}

footer .fnb .container ul li a.text-light-bl.v2 {
    color: #c2c2d6;
}

footer .ft-cont {
    padding: 2.22rem 1rem;
}

footer .ft-cont .container .row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

footer .ft-cont .container .row .logo {
    margin-right: 50px;
}

footer .ft-cont .container .row .logo h2 {
    width: 185px;
}

footer .ft-cont .container .row .logo h2 img {
    vertical-align: middle;
    max-width: 100%;
}

footer .ft-cont .container .row > div .addr {
    color: #C2C2D6;
    font-weight: 300;
    letter-spacing: -0.65px;
}

footer .ft-cont .container .row > div .addr .tel {
    margin-left: 1rem;
}

footer .ft-cont .container .row > div .addr .tel a {
    color: #C2C2D6;
}

footer .ft-cont .container .row > div .sns-mobile {
    display: none;
}

footer .ft-cont .container .row > ul {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

footer .ft-cont .container .row .sns-pc {
    display: flex;
}

/******************************************
===== 위지언 공통영역 (jQuery포함)
*********************************************/

.center {
    max-width: 1440px;
    /*padding: 0 20px;*/
    margin: 80px auto;
    width: 100%;
}

/* 필수 입력  - asterisk */
.lbl_chk:after {
    content: ' * ';
    font-weight: 500;
    color: red;
    font-size: 17px;
}

/*========== jQuery 전용 ==========*/
/*=== 달력 ===*/
.multi_inputs {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.multi_inputs input {
    width: 100%;
    height: 32px;
    line-height: 30;
    padding: 0 10px;
    font-size: 17px;
    background-color: #FFF;
    border: 1px solid #B8B8B8;
    border-radius: 4px;
    margin-top: -1px;
    opacity: 1;
}

.multi_inputs input:nth-child(1) {
    margin-right: 2px;
}

.multi_inputs img {
    margin-right: 0;
    width: 20px;
    height: 20px;
    padding: 2px;
    background-size: cover;
}

.multi_inputs,
.multi_inputs input {
    position: relative;
    width: 100%;
}

.multi_inputs img.ui-datepicker-trigger {
    position: absolute;
    right: 6px;
    left: unset;
    top: 6px;
}

.multi_inputs button.ui-datepicker-trigger {
    width: 20px;
    height: 20px;
    margin: 4px 2px 4px 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    flex: none;
}

.ui-datepicker-trigger {
    margin-left: 2px;
}

.multi_inputs button img {
    width: 20px;
    height: 20px;
}

/*=== select ===*/
.ui-button {
    border: unset !important;
}

.custom-combobox { margin-right: 2px;}

.custom-combobox select,
.custom-combobox input {
    width: 100%;
    height: 40px;
    line-height: 30;
    padding: 0 10px;
    font-size: 17px;
    background-color: #FFF;
    border: 1px solid #B8B8B8;
    border-radius: 4px;
    opacity: 1;
}

.custom-combobox .ui-button-icon-only .ui-icon {
    margin-left: -10px;
    opacity: 0;
    width: 20px;
    height: 20px;
}

.custom-combobox a,
.custom-combobox a:hover {
    position: absolute;
    right: 5px;
    top: 10px;
    background: url('../images/icon_selectbutton.png') no-repeat center;
    width: 20px;
    height: 20px;
    background-size: cover;
}

span.custom-combobox:hover {
    /*margin-top: -1px;*/
}

span.custom-combobox:hover a , span.custom-combobox:hover a span {
    /*margin-top: -1px;*/
}

.custom-combobox a span {
    display: block !important;
}

span.custom-combobox:hover input.custom-combobox-input ,
span.custom-combobox:hover {
    width: 100%;
    /*height: 40px;*/
    font-size: 17px;
    border-radius: 4px;
    opacity: 1;
}

span.custom-combobox:hover  {
    /*margin-top: 0;*/
}

span.custom-combobox:hover a {
    /*margin-top: 0;*/
}

span.custom-combobox:hover input.custom-combobox-input {
    border: 1px solid #B8B8B8 !important;
    background-color: #FFF;
}

.table_data span.custom-combobox:hover input.custom-combobox-input ,
.table_data span.custom-combobox input.custom-combobox-input {
    border: 1px solid #B8B8B8 !important;
    outline: revert !important;
    background-color: unset;
}

.table_data span.custom-combobox:hover input.custom-combobox-input {
    margin-top: 0;
}

span.custom-combobox:hover input.custom-combobox-input {
    outline: revert !important;
}

span.custom-combobox:hover a.ui-button.ui-button-icon-only {
    outline: unset !important;
}

/* combobox 하단 option */
.ui-autocomplete {
    max-height: 150px;
}

/* disabled인 combobox */
.custom-combobox input[disabled="disabled"] {
    pointer-events: none;
    color: #B8B8B8;
    background-color: #F1F1F1 !important;
    border: 1px solid #B8B8B8;
}

.custom-combobox a.custom-combobox-button-disabled,
.custom-combobox a.custom-combobox-button-disabled:hover {
    position: absolute;
    right: 5px;
    top: 5px;
    background: url('../images/icon_selectbutton_disabled.png') no-repeat center;
    width: 20px;
    height: 20px;
    background-size: cover;
    background-color: transparent;
}

.custom-combobox:hover input[disabled="disabled"] {
    border: 1px solid #B8B8B8 !important;
}

/******************************************
MediaQuery
*********************************************/
/*===== 공통 =====*/

/* 아이디 찾기, 비밀번호 초기화 */
body {
    padding: 0;
    margin: 0;
    font-family: 'Pretendard', sans-serif;
    overflow-x: hidden;
}

button {
    cursor: pointer;
    border: none;
    font-family: inherit;
}

.EN0214P {
    height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 50px;
}

.EN0214P .logo img {
    width: 300px;
}

.EN0214P .logo + * {
    max-width: 700px;
    width: 90%;
}

.EN0214P .input-section {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.EN0214P .label-input {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.EN0214P label {
    font-weight: 600;
    font-size: 18px;
    margin-left: 4px;
}

.EN0214P input {
    width: 100%;
    height: 50px;
    padding: 10px 16px;
    background: #fff;
    color: #111;
    border: 1px solid #dddddd;
    font-size: 16px;
    box-sizing: border-box;
}

.EN0214P input:disabled {
    background-color: #f1f1f1;
    color: #999999;
    border-radius: 8px;
}

.EN0214P .button-section {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 50px;
}

.EN0214P .button-section button {
    padding: 0 30px;
    height: 60px;
    font-size: 18px;
    font-weight: 500;
}

.EN0214P .button-section button.type1 {
    border: 1px solid #111987;
    background-color: #FFFFFF;
    color: #111987;
}

.EN0214P .button-section button.type2 {
    background-color: #111987;
    color: #FFFFFF;
}

.EN0214P .msg-state p {
    display: none;
    color: #FF0000;
    padding: 20px;
    margin: 0 0 30px 0;
    background-color: rgba(249, 249, 249, 0);
    transition: background-color 0.3s ease;
}

.EN0214P .msg-state p.on {
    display: block;
    background-color: #f9f9f9;
}

.empty {
    text-align: center !important;
    color: #999999 !important;
    font-weight: normal !important;
    font-size: 16px !important;
}

.chip-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.chip-menu li {
    background-color: #F7F7F7;
    border-radius: 50px;
}

.chip-menu li a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 20px 32px;
    box-sizing: border-box;
}

.chip-menu li.active {
    background-color: #EBF2F9;
}

.chip-menu li.active a {
    color: #34489B;
    font-weight: 600;
}


@media screen and (min-width: 547px) {
    #container #inner .mega-menu {
        margin-top: 1px;
    }
}

@media screen and (max-width: 767px) {
    .logout , .menu-inner {
        padding-top: 30px;
    }

    .menu-link {
        font-size: 1.2rem;
    }

    .wrap_modal_all {
        width: 100% !important;
        height: 100% !important;
    }

    .aside {
        display: none;
    }

    .all-tab-depth2 {
        background-color: #FFF;
    }

    .wrap-subnavi {
        display: inline-block;
        padding-top: 0;
    }

    .wrap-subnavi .container {
        max-width: unset;
    }

    .wrap-subnavi .container .mega-menu .container {
        max-width: 1000px;
        overflow-x: auto;
        white-space: nowrap;
    }

    .wrap-subnavi div > ul > li {
        margin: 0 10px;
    }

    /* 아이콘 depth 2 */
    .droppable .mega-menu.fake {
        height: 100%;
        background-color: #fff;
    }

    .subnavi-depth .subnavi-depth-icon {
        width: 36px;
        height: 36px;
        margin-bottom: 8px;
    }

    #container {
        display: flex;
        align-items: stretch;
        width: 100%;
        overflow: auto;
    }

    #inner {
        width: 100%;
        flex-shrink: 0;
        scroll-snap-align: start;
    }

    /* 게시판 상단 검색 */
    .board-search form {
        width: 100% !important;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .board-search form select, .board-search form input {
        margin-right: 4px;
    }

    .board-search form select {
        width: 50% !important;
    }

    .board-search form input {
        width: 100% !important;
    }

    /* 게시판 */
    .board .board-item {
        display: revert;
        justify-content: unset;
        align-items: unset;
    }

    .board-item.board-item-tr, .board-reads {
        display: none;
    }

    .board .board-item .board-nb {
        display: inline-block;
        vertical-align: middle;
    }

    .board .board-item .board-category {
        width: auto;
        display: inline-block;
        word-break: break-all;
    }

    .board .board-item .board-title {
        width: 100%;
        margin-top: 2px;
        margin-bottom: 10px;
        font-size: 16px;
    }

    .board .board-item .board-writer {
        display: inline-block;
        width: auto;
        margin-right: 6px;
        padding-left: 10px;
    }

    .board .board-item .board-reads {
        display: inline-block;
        width: auto;
        margin-right: 6px;
    }

    .board .board-item .board-date {
        display: inline-block;
        width: auto;
    }

    .board .board-item .board-title,
    .board .board-item  .board-writer {
        padding-left: 15%;
    }
}

@media screen and (max-width: 1280px) {
    .board .board-item {
        align-items: center;
    }
}

@media screen and (max-width: 1300px) {
    /* 팝업창 크기 */
    .wrap_modal_all {
        width: 100%!important;
    }
}

@media screen and (max-width: 1360px) {
    main {
        width: 100%;
        margin: 0;
        padding: 85px 20px;
        box-sizing: border-box;
    }

    main .main-wrap {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .hidden,
    .m-only {
        display: block;
        flex-basis: 100%;
    }

    .pc-only {
        display: none;
    }

    /* header */
    header nav {
        position: fixed;
        height: 64px;
        line-height: 64px;
    }

    header nav .nav-wrap {
        width: 100%;
        height: 64px;
        padding: 0 20px;
        box-sizing: border-box;
    }

    header nav .nav-wrap .logo img {
        width: 135px;
    }

    header nav .nav-wrap .nav-list {
        /*display: none;*/
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 64px;
        left: 0;
        background-color: #FFFFFF;
        width: 100%;
        height: calc(100dvh - 64px);
        overflow-y: auto;
        flex-direction: column;
        justify-content: start;
        transition: visibility 0s 0.2s, opacity 0.2s ease;
    }

    header nav .nav-wrap .nav-list.active {
        /*display: flex;*/
        visibility: visible;
        opacity: 1;
        transition: opacity 0.2s ease;
    }

    header nav .nav-wrap .nav-list > li {
        width: 100%;
        text-align: right;
        opacity: 0;
        transform: translateY(-20px);
        transition: opacity 0.2s ease, transform 0.2s ease;
    }

    header .time-div-mobile {
        display: block;
    }

    header .time-div-mobile {
        display: flex;
        align-items: center;
        justify-content: end;
        gap: 10px;
    }

    header .time-div-mobile button {
        padding: 12px 20px;
        background-color: #F3F3F3;
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: 4px;
        justify-content: center;
        float: right;
    }

    header .time-div-mobile button span:last-child {
        color: #D5164D;
    }

    header nav .nav-wrap .nav-list.active > li {
        opacity: 1;
        transform: translateY(0);
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(1) {

    }

    header nav .nav-wrap .nav-list.active > li:nth-child(2) {
        transition-delay: 0.2s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(3) {
        transition-delay: 0.4s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(4) {
        transition-delay: 0.6s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(5) {
        transition-delay: 0.8s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(6) {
        transition-delay: 1.0s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(7) {
        transition-delay: 1.2s;
    }

    header nav .nav-wrap .nav-list.active > li:nth-child(8) {
        transition-delay: 1.4s;
    }

    header nav .nav-wrap .nav-list.active > li:last-of-type {
        transition-delay: 1.6s;
        padding: 20px;
        box-sizing: border-box;
    }

    header nav .nav-wrap .nav-list > li > a {
        display: block;
        font-size: 20px;
        font-weight: 500;
    }

    header nav .nav-wrap .nav-list.active > li > a {
        opacity: 1;
        transform: translateY(0);
        padding: 0 20px;
    }

    header nav .nav-wrap .nav-list > li > a::after {
        left: auto;
        right: 20px;
        bottom: 10px;
    }

    header nav .nav-wrap .nav-list > li > a:hover::after {
        width: 0;
    }

    header .side-nav-wrap {
        position: static;
        transform: translateX(0);
        transition: height 0.5s ease-in-out;
    }

    header .side-nav-wrap.open {
        height: auto;
        box-shadow: none;
    }

    header .side-nav-wrap .side-nav-list {
        display: block;
    }

    header .side-nav-wrap .side-nav-list li {
        height: auto;
        margin: 0;
    }

    header .side-nav-wrap .side-nav-list li a {
        display: block;
        padding: 10px 20px;
    }

    header .side-nav-wrap .side-nav-list li a img {
        display: none;
    }

    header .side-nav-wrap .side-nav-list li a span {
        color: #666666;
    }

    header .side-nav-wrap .side-nav-list li a span::after {
        content: inherit;
        width: 0;
        height: 0;
    }

    header nav .nav-wrap .hamburger-menu {
        display: flex;
    }

    header nav .nav-wrap .hamburger-menu.active span:nth-child(1) {
        transform: rotate(45deg) translate(4px, 5px);
    }

    header nav .nav-wrap .hamburger-menu.active span:nth-child(2) {
        opacity: 0;
    }

    header nav .nav-wrap .hamburger-menu.active span:nth-child(3) {
        transform: rotate(-45deg) translate(4px, -5px);
    }

    header nav .nav-wrap .time-div-pc,
    header nav .nav-wrap .logout-pc {
        display: none;
    }
    /* header */


    /* footer */
    footer {
        /*padding: 40px 20px;*/
        box-sizing: border-box;
        margin-top: 0;
    }

    footer .fnb {
        padding: 1rem;
    }

    footer .footer-wrap {
        flex-direction: column-reverse;
        width: 100%;
        align-items: start;
        box-sizing: border-box;
        gap: 20px;
    }

    footer .footer-wrap img {
        width: 120px;
    }
    /* footer */

    /* go top */
    .go-top {
        display: none;
    }
    /* go top */


    /* .empty */
    /* 알림판 */
    .PC1006T .empty {
        padding: 0;
    }

    .chip-menu {
        gap: 10px;
        order: 1;
    }

    .chip-menu li a {
        padding: 10px 22px;
    }
}