@charset "utf-8";

/*== Footer ==*/
.footer {color: rgba(255,255,255,0.6); background-color: #666;}
.footer .container {display: flex; padding: 55px 0; align-items: flex-start;}
.footer__logo {flex-shrink: 0; color: transparent; font-size: 0; text-indent: -100vw; overflow: hidden; width: 168px; height: 70px; background: url(../images/common/footer_logo_gray.png) no-repeat left top / cover; margin-right: 30px;}
.footer__info {margin-right: auto;}
.footer__info p {padding-bottom: 5px; font-size: 14px;}
.footer__contact span {margin-right: 20px;}
.footer__contact span strong {margin-right: 5px;}
.footer__copy {font-size: 10px; font-weight: 300; margin-top: 5px;}
.footer__nav {display: flex; flex-direction: column; align-items: flex-end; margin-left: 30px;}
.footer__nav .policy {display: flex; font-size: 12px; margin-bottom: 20px;}
.footer__nav .policy li {display: flex; align-items: center;}
.footer__nav .policy li::after {display: block; content: ""; width: 1px; height: 12px; background-color: rgba(255,255,255,0.7); margin: 0 15px;}
.footer__nav .policy li:last-child::after {display: none;}
.footer__nav > a {display: flex; justify-content: center; align-items: center; width: 100%; border: 1px solid #b7b7b7; padding: 8px; font-size: 14px; font-weight: 700; text-transform: uppercase;}
.footer__nav > a img {margin-right: 5px;}

@media screen and (max-width: 1199px) {
    .footer__logo {width: 130px; height: 54px;}
    .footer__info p {padding-bottom: 10px;}
    .footer__contact {display: flex; flex-direction: column;}
    .footer__contact span {margin-right: 0;}
}

@media screen and (max-width: 767px) {
    .footer .container {flex-direction: column; align-items: center; text-align: center;}
    .footer__logo {width: 100px; height: 42px;}
   .footer__info, .footer__nav, .footer__logo {margin: 0; margin-bottom: 30px;}
   .footer__nav {align-items: center; margin-bottom: 0;}
   .footer__nav .policy {margin-bottom: 20px;}
}




/* == Aside == */
#quick_menu {position: fixed; top: 50%; right: 190px; transform: translateY(-50%); z-index: 8888; text-align: center; opacity: 0; transition: opacity 0.3s, right 0.3s; pointer-events: none;}
#quick_menu.show,
#quick_menu.on {opacity: 1; pointer-events: initial;}
#quick_menu ul {border-radius: 10px; border: 1px solid #d7d7d7; width: 112px; background-color: #fff; overflow: hidden;}
#quick_menu ul li {border-bottom: 1px solid #d7d7d7;}
#quick_menu ul li:last-child {border: none;}
#quick_menu ul li a {display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 10px; min-height: 80px;}
#quick_menu ul li a .ico.on {display: none;}
#quick_menu ul li a .ico.off {display: block;}
#quick_menu ul li a .name {color: #283891; font-size: 12px; margin-top: 5px; line-height: 130%;}
#quick_menu ul li.menu a:hover {background-color: #283891;}
#quick_menu ul li.menu a:hover .ico.on {display: block;}
#quick_menu ul li.menu a:hover .ico.off {display: none;}
#quick_menu ul li.menu a:hover .name {color: #fff;}
#quick_menu_open {display: none;}

@media screen and (max-width: 1870px) {
    #quick_menu {right: 30px;}
}
@media screen and (max-width: 1560px) {
    #quick_menu {right: -115px;} 
    #quick_menu.active {right: 0;}
    #quick_menu_open {position: absolute; top: 50%; left: -19px; transform: translateY(-50%); width: 20px; height: 120px; background-color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 10px 0 0 10px; border: 1px solid #b7b7b7;}
    #quick_menu_open .arrow {border-color: #283891; margin-left: 5px;}
    #quick_menu.active #quick_menu_open {background-color: #283891; border-color: #283891;}
    #quick_menu.active #quick_menu_open .arrow {transform: rotate(45deg); margin-left: -5px; border-color: #fff;}
    #quick_menu ul {border-radius: 10px 0 0 10px;}
}




/* Find Staff */
#staff__search .searchbar_wrapper {display: flex;justify-content: center;}
#staff__search .input_wrapper .search_option {width: 86px; margin-right: 10px;}
#staff__search .input_wrapper .searchbar {display: flex;}
#staff__search .input_wrapper .searchbar .searchbar__input {border-right: none; width: 288px;}
#staff__search .input_wrapper .searchbar .searchbar__submit {border: none; background: url(../images/common/ico/search.png) no-repeat center; background-color: #283891; color: transparent; font-size: 0; width: 54px;}
.staff__contents h4 {color: #283891; font-size: 20px; font-weight: 400; margin-bottom: 15px; display: flex; align-items: center;}
.staff__contents h4 .button__view_list {display: flex; align-items: center; justify-content: center; padding: 5px 20px; font-size: 16px; color: #fff; text-align: center; background-color: #283891; margin-left: auto;}
.staff__info1 {width: 100%; table-layout: fixed; border-top: 1px solid #dbdbdb; font-size: 14px; font-weight: 300; margin-bottom: 30px;}
.staff__info1 th, .staff__info1 td {border-bottom: 1px solid #dbdbdb; padding: 10px 14px;}
.staff__info1 th {width: 110px; background-color: #f3f3f3;}
.staff__info2 {border: 1px solid #c2c2c2; padding: 30px; overflow-y: scroll; max-height: 300px;}
.staff__info2.empty {text-align: center;}
.staff__info2 .career {margin-bottom: 50px;}
.staff__info2 * {line-height: 180%;}
.staff__info2 .sbj {color: #283891; font-size: 20px; font-weight: 400; margin-bottom: 15px; line-height: 1;}
.staff__contents .result_empty {border: 1px solid #dbdbdb; display: flex; align-items: center; justify-content: center; width: 100%; height: 300px; text-align: center; color: #555;}
.staff__list table {width: 100%; border-top: 2px solid #718496; font-size: 14px;}
.staff__list table colgroup col:nth-child(4) {width: 200px;}
.staff__list table colgroup col:nth-child(5) {width: 170px;}
.staff__list table th, .staff__list table td {padding: 10px; text-align: center; height: 50px;}
.staff__list table th:last-child, .staff__list table td:last-child {border-right: none;}
.staff__list table tr {border-bottom: 1px solid #f1f2f4;}
.staff__list table thead {background-color: #f1f2f4; border-bottom: 2px solid #e1e2e3;}
.staff__list table thead th {text-align: center; position: relative;}
.staff__list table thead th::after {position: absolute; display: block; content: ""; width: 1px; height: 34px; background-color: #b9b9b9; top: 50%; right: 0; transform: translateY(-50%);}
.staff__list table thead th:last-child::after {display: none;}
.staff__list table tbody td {border-right: 1px solid #f1f2f4; word-break: break-all;}
.staff__list .staff__empty {display: flex; align-items: center; justify-content: center; border: 1px solid #dfdfdf; text-align: center; color: #555; min-height: 250px;}
.staff__button {display: flex; align-items: center; justify-content: center; height: 34px; padding: 0 15px; border: 1px solid #c2c2c2; border-radius: 34px;}
.staff__button img {margin-right: 10px;}

@media screen and (max-width: 1023px) {
    #staff__search .input_wrapper .searchbar {width: 100%;}
    #staff__search .input_wrapper .searchbar .searchbar__input {width: 100%;}
    .staff__contents h4 {font-size: 18px; margin-bottom: 10px;}
    .staff__info1 {font-size: 12px;}
    .staff__info1 tr {display: flex; flex-wrap: wrap;}
    .staff__info1 th, .staff__info1 td {padding: 10px;}
    .staff__info1 th {width: 80px;}
    .staff__info1 td {width: calc(100% - 80px);}
    .staff__info2 {max-height: none; padding: 30px 20px;}
    .staff__info2 * {font-size: 14px!important;}
    .staff__info2 .sbj {font-size: 18px; margin-bottom: 10px;}
}
@media screen and (max-width: 767px) {
    .staff__button {width: 34px; height: 34px; padding: 5px; margin: 0 auto;}
    .staff__button img {margin: 0;}
    .staff__button span {display: none;}
    .staff__list table th, .staff__list table td {font-size: 12px;}
    .staff__list table colgroup {display: none;}
}
@media screen and (max-width: 500px) {
    .staff__list table th:nth-child(3), .staff__list table td:nth-child(3) {display: none;}
}