@charset "utf-8";
/*
 * Name     : sub.css
 * Version  : 1.0
 * Author   : onepixel studio
 * Date     : YYYY-MM-DD
 ---------------------------------------------------
 Table of contents
 ---------------------------------------------------
    01. 
    02.
    03.
    04.
---------------------------------------------------
*/


/* ------------------------------
 * sub common
------------------------------ */
.sub {padding-top:70px; padding-bottom:70px}
.sub-section-title {text-align:center; padding-bottom:80px; border-bottom:1px solid #d9d9d9}
.sub-section-title h3 {font-size:40px; font-weight:100; color:#000; letter-spacing:-0.025em; line-height:1.4}
.sub-section-title h3 strong.light-strong {font-weight:300}
.sub-section-title h3 strong {font-weight:500}
section.sub .sub-photo-output .col-title {margin-bottom:30px}
section.sub .sub-photo-output .col-title h3 {font-size:24px; font-weight:400; color:#f4a337; letter-spacing:-0.025em}
section.sub .fraction {position: static; display: inline-block; width: auto; font-size:14px; font-weight:300; color:#9a9a9a; margin-right: 10px; vertical-align: middle}
section.sub .fraction .swiper-pagination-current {color: #000}
section.sub .col-buttons button {display:inline-block; padding:0; margin:0; outline: none; line-height:30px; border:1px solid #d9d9d9; width:32px; height:32px; background-color:#fff}
section.sub .col-buttons button:last-child {margin-left:-5px}
.gallery-board .gallery-swiper .swiper-slide a {display: block; border:1px solid #d9d9d9}
.gallery-board .gallery-swiper .swiper-slide a .img-box {overflow:hidden}
.gallery-board .gallery-swiper .swiper-slide a .img-box img {width:100%; transition:0.3s}
.gallery-board .gallery-swiper .swiper-slide a .board-title {padding:15px 25px}
.gallery-board .gallery-swiper .swiper-slide a .board-title h3 {font-size:16px; font-weight:400; color:#000; letter-spacing:-0.025em; transition:0.3s; ; white-space:nowrap; overflow:hidden; text-overflow: ellipsis;}
.gallery-board .gallery-swiper .swiper-slide a:hover .img-box img {transform:scale(1.1)}
.gallery-board .gallery-swiper .swiper-slide a:hover .board-title h3 {color:#f7a337}


/* ------------------------------
 * hero
------------------------------ */
.hero {margin-top:80px; height:400px; background-position:center; background-size:cover; background-repeat:no-repeat}
.hero .caption {text-align:center}
.hero .caption h2 {display:inline-block; font-size:60px; font-weight:600; color:#fff; letter-spacing:-0.025em; border-bottom:2px solid #fff; padding-bottom:10px; margin-bottom:10px}
.hero .caption p {font-size:32px; font-weight:600; color:#fff; letter-spacing:-0.025em}

/* ------------------------------
 * breadcrumb
------------------------------ */
.breadcrumbs .row-breadcrumbs {border-bottom:1px solid #d9d9d9}
.breadcrumbs .col-items {text-align:center}
.breadcrumbs .col-items a {position:relative; display:block; font-size:20px; font-weight:400; letter-spacing:-0.025em; color:#636363; padding:20px 0}
.breadcrumbs .col-items a.active:after {content:''; display:block; width: 100%; height:3px; background-color:#000; position:absolute; bottom:0; left:0; right:0}
.breadcrumbs .col-items a:hover:after {content:''; display:block; width: 100%; height:3px; background-color:#000; position:absolute; bottom:0; left:0; right:0}
.breadcrumbs .col-items a.active {color:#000}
.breadcrumbs .col-items a:hover {color:#000}

/* ------------------------------
 * edu phil
------------------------------ */
.edu-phil .container-xl hr {margin-top:70px; margin-bottom:70px}
.edu-phil .row-phil .title h2 {font-size:37px; font-weight:500; color:#000; letter-spacing:-0.025em}
.edu-phil .row-phil .info-box > p {font-size:26px; font-weight:400; color:#000; letter-spacing:-0.025em; line-height:1.25}
.edu-phil .row-phil .txt-box {margin-top:50px; padding:40px; background-color:#f7f7f7}
.edu-phil .row-phil .txt-box p {font-size:21px; font-weight:100; color:#666666; line-height:1.28; letter-spacing:-0.025em}
.edu-phil .row-phil .txt-box p + p {margin-top:40px}

/* ------------------------------
 * edu feature
------------------------------ */
.edu-feature .row-edu-feature .img-box img {width:100%}
.edu-feature .row-edu-feature .row-txt {height:100%}
.edu-feature .row-edu-feature .row-txt .txt-box {text-align:center}
.edu-feature .row-edu-feature .row-txt .txt-box span {display:block; width:50px; height:50px; background-color:#f4a336; color:#fff; border-radius:50%; line-height:48px; font-size:30px; font-weight:300; margin:0 auto 10px}
.edu-feature .row-edu-feature2 .row-txt .txt-box span {background-color:#00b1b0}
.edu-feature .row-edu-feature .row-txt .txt-box h3 {font-size:30px; font-weight:400; color:#000; letter-spacing:-0.025em; line-height:1.34; margin-bottom:30px}
.edu-feature .row-edu-feature .row-txt .txt-box p {font-size:22px; font-weight:300; color:#222; letter-spacing:-0.025em; line-height:1.34}
.edu-feature .row-edu-feature2 {margin-top:120px}

/* ------------------------------
 * ceo profile
------------------------------ */
.ceo-profile {min-height:1440px}
.ceo-profile .row-ceo-profile {position:relative}
.ceo-profile .row-ceo-profile .col-items:nth-child(2) {position:absolute; top:50%; margin-top:-50px; right:0}
.ceo-profile .ceo-info .title {position:relative}
.ceo-profile .ceo-info .title h3 {font-size:37px; font-weight:300; color:#000; letter-spacing:-0.025em; margin-bottom:10px}
.ceo-profile .ceo-info .title span.bullet {position:absolute; width:180px; height:180px; border-radius:50%; opacity:0.2; z-index:5}
.ceo-profile .ceo-info .title span.bullet01 {background-color:#00b1b0; top:-65px; left:-180px}
.ceo-profile .ceo-info .title span.bullet02 {background-color:#f4a337; top:-65px; left:-40px}
.ceo-profile .ceo-info .title p {position:relative; display:inline-block; font-size:42px; font-weight:300; color:#fff; letter-spacing:-0.025em; background-color:#f4a337; z-index:10}
.ceo-profile .ceo-career {margin-top:40px}
.ceo-profile .ceo-career > ul li {position:relative; font-size:24px; font-weight:100; color:#222; letter-spacing:-0.025em; padding-left:15px}
.ceo-profile .ceo-career p {font-size:24px; font-weight:100; color:#222; letter-spacing:-0.025em}
.ceo-profile .ceo-career h4 {display:inline-block; position:relative; font-size:32px; font-weight:300; color:#222; letter-spacing:-0.025em; margin-bottom:20px}
.ceo-profile .ceo-career h4:after {content:''; position:absolute; bottom:0; display:block; width:100%; height:15px; background-color:#f4a336; z-index:-1; opacity:0.55}
.ceo-profile .ceo-career > ul li:before {content:''; display:block; position:absolute; top:16px; left:0; width:4px; height:4px; background-color:#000; border-radius:50%}
.ceo-profile .ceo-career > ul li + li {margin-top:10px}

/* ------------------------------
 * location
------------------------------ */
.location {padding-bottom:70px}
.location .map-wrapper {position: relative; overflow: hidden}
.location .map-wrapper #map {display: block; width: 100%; height: 720px}
.location .map-wrapper .map-info {position: absolute; top: 120px; left: 80px; background-color: #fff; z-index: 10}
.location .map-wrapper .map-info .info-body {padding: 65px 35px 50px 60px}
.location .map-wrapper .map-info address {font-size: 21px; font-weight: 300; color: #222; letter-spacing: -0.025em; line-height: 1.52}
.location .map-wrapper .map-info address h3 {font-size: 21px; font-weight: normal; color: #000; margin-bottom: 6px}
.location .map-wrapper .map-info address p span {font-size:16px}
.location .map-wrapper .map-info address p a[href^=tel]:hover {color:#000}
.location .map-wrapper .map-info address + address {margin-top: 28px}
.location .map-wrapper .map-info .info-footer {padding: 25px 35px 25px 60px; border-top: 2px solid #f5f5f5}
.location .map-wrapper .map-info .info-footer a {font-size: 21px; color: #222; letter-spacing: -0.025em}
.location .map-wrapper .map-info .info-footer a .arrow {display: inline-block; width: 22px; height: 22px; font-size: 14px; color: #fff; text-align: center; line-height: 22px; margin-left: 4px; border-radius: 50%; background-color: #000; vertical-align: 2px}

/* ------------------------------
 * art in voice ~ interview
------------------------------ */
.art-in-voice .top-info {padding-top:70px; padding-bottom:70px}
.art-in-voice .top-info h3 {font-size:47px; font-weight:300; color:#000; letter-spacing:-0.025em; line-height:1.1; margin-bottom:50px}
.art-in-voice .top-info p {font-size:25px; font-weight:100; color:#000; letter-spacing:-0.025em; line-height:1.4}
.art-in-voice .top-info p strong {font-weight:300}
.art-in-voice .top-info p + p {margin-top:50px}
.art-in-voice .feature-box {padding-top:70px; padding-bottom:70px; border-top:1px dashed #d9d9d9}
.art-in-voice .feature-box:last-child {border-bottom:1px dashed #d9d9d9}
.art-in-voice .feature-box .col-title h3 {font-size:37px; font-weight:400; color:#000; letter-spacing:-0.025em}
.art-in-voice .feature-box .col-title h3 b {font-size:15px; font-weight:700; color:#e98624}
.art-in-voice .feature-box .col-title h3 span {display:block; font-size:30px; font-weight:100}
.art-in-voice .feature-box .col-items > ol li {list-style-type:decimal}
.art-in-voice .feature-box .col-items > ol li + li {margin-top:35px}
.art-in-voice .feature-box .col-items > ol li::marker {font-size:26px}
.art-in-voice .feature-box .col-items > ol li h3 {display:inline-block; position:relative; font-size:26px; font-weight:400; color:#000; letter-spacing:-0.025em; margin-bottom:20px}
.art-in-voice .feature-box .col-items > ol li h3:after {content:''; position: absolute; bottom:0; left:0; width:100%; height:13px; background-color:#f4a336; opacity:0.55; z-index:-1}
.art-in-voice .feature-box .col-items > ol li p {font-size:20px; font-weight:100; color:#666; letter-spacing:-0.025em; line-height:1.4}
.art-in-voice .feature-box .target-box {padding:40px 40px; background-color:#f7f7f7}
.art-in-voice .feature-box .target-box > ul li {position:relative; font-size:20px; font-weight:100; color:#666; letter-spacing:-0.025em; padding-left:10px}
.art-in-voice .feature-box .target-box > ul li + li {margin-top:10px}
.art-in-voice .feature-box .target-box > ul li:after {content:''; display:block; width:5px; height:5px; background-color:#000; border-radius:50%; position:absolute; top:12px; left:0}
.art-in-voice .feature-box .process-box table {border-top:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9}
.art-in-voice .feature-box .process-box table tbody tr th {border-bottom:1px solid #d9d9d9; border-right:1px solid #d9d9d9; font-size:20px; font-weight:300; color:#000; padding:30px 0 30px 20px; letter-spacing:-0.025em}
.art-in-voice .feature-box .process-box table tbody tr td {border-bottom:1px solid #d9d9d9; font-size:20px; font-weight:300; color:#000; padding:30px 30px; letter-spacing:-0.025em}
.art-in-voice .feature-box .process-box table thead tr th {font-size:20px; font-weight:300; color:#000; background-color:#f7f7f7; padding:20px 0; text-align:center; letter-spacing:-0.025em; border-left:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9}
.art-in-voice .feature-box .process-box table thead tr th:first-child {border-left:0}
.art-in-voice .feature-box .process-box table tbody tr td {font-size:20px; font-weight:300; color:#000; padding:20px 30px; letter-spacing:-0.025em; line-height:1.4; border-left:1px solid #d9d9d9}
.art-in-voice .feature-box .process-box table tbody tr td:first-child {border-left:0}
.art-in-voice .feature-box .process-box table tbody tr td ul li {position:relative; font-size:20px; font-weight:300; color:#000; letter-spacing:-0.025em; line-height:1.4; padding-left:15px}
.art-in-voice .feature-box .process-box table tbody tr td ul li:after {content:''; display:block; position:absolute; top:12px; left:0; width:7px; height:7px; border-radius:50%; background-color:#666}
.art-in-voice .feature-box .process-box table tbody tr td ul li + li {margin-top:15px}
.art-in-voice .feature-box .process-box table tbody tr td.td-center {text-align:center}
.art-in-voice .feature-box .process-box table tbody tr td.td-title {color:#f4a336; font-weight:400}
.art-in-voice .feature-box .process-box table tbody tr td.td-title2 {color:#19bcb8}
.art-in-voice .program-wrap {padding-top:70px; padding-bottom:20px; border-top:4px solid #f7a337}
.art-in-voice .program-wrap h3 {font-size:32px; font-weight:300; color:#000; letter-spacing:-0.025em; margin-bottom:40px}
.art-in-voice .program-wrap h3 strong {font-size:37px; font-weight:400}
.art-in-voice .program-wrap .txt-box {position:relative; border:8px solid #d9d9d9; text-align:center; width:100%; height:100%; padding:25px 0}
.art-in-voice .program-wrap .txt-box.active {border-color:#f4a337}
.art-in-voice .program-wrap .txt-box:after {content: '\e93f'; position: absolute; top: 50%; right:-3rem; font-family: 'xeicon'; font-size: 2rem; color: #ebebeb; margin-top:-1.2rem}
.art-in-voice .program-wrap .txt-box p {font-size:20px; font-weight:300; color:#666}
.art-in-voice .program-wrap .txt-box span {display:inline-block; font-size:16px; font-weight:300; color:#666; transition:0.3s}
.art-in-voice .program-wrap .txt-box span:hover {color:#fb7d00}
.art-in-voice .program-wrap .txt-box span.active {font-weight:500; color:#e98624}
.art-in-voice .program-wrap .txt-box span.active:before {font-weight:300; color:#666}
.art-in-voice .program-wrap .txt-box span + span:before {content:'/'; display:inline-block; font-size:14px; margin:0 4px 0 2px}
.art-in-voice .program-wrap .txt-box2 span + span:before {content:''; display:none}
.art-in-voice .program-wrap .row-program-bar2 .txt-box:after {right:-3.3rem; margin-top:-1.4rem}
.art-in-voice .program-wrap .txt-box.active:after {color:#f7a337}
.art-in-voice .program-wrap .col-items:last-child .txt-box:after {content:''; display:none}
.art-in-voice .program-wrap .contact-btn {margin-top:50px; margin-bottom:70px; text-align:center}
.art-in-voice .feature-box .col-tip {margin-top:70px}
.art-in-voice .feature-box .col-tip .tip-wrap {padding:40px 40px; border:2px solid #d9d9d9; text-align:center}
.art-in-voice .feature-box .col-tip .tip-wrap > h3 {display:inline-block; position:relative; font-size:32px; font-weight:400; color:#000; letter-spacing:-0.025em; border-bottom:1px solid #000; padding-bottom:20px}
.art-in-voice .feature-box .col-tip .tip-wrap > h3:before {content:''; display:block; position:absolute; top:-8px; left:-30px; background-image:url(../images/tip_star.png); background-repeat:no-repeat; width:25px; height:24px}
.art-in-voice .feature-box .col-tip .tip-wrap > h3 strong {font-weight:500}
.art-in-voice .feature-box .col-tip .tip-wrap > ol {text-align:left; margin-top:30px}
.art-in-voice .feature-box .col-tip .tip-wrap > ol li::marker {font-size:20px}
.art-in-voice .feature-box .col-tip .tip-wrap > ol li + li {margin-top:30px}
.art-in-voice .feature-box .col-tip .tip-wrap > ol li h3 {display:inline-block; position:relative; font-size:20px; font-weight:400; color:#fff; letter-spacing:-0.025em; margin-bottom:10px; padding:0 5px}
.art-in-voice .feature-box .col-tip .tip-wrap > ol li h3:after {content:''; position: absolute; bottom:0; left:0; width:100%; height:100%; background-color:#19bcb8; opacity:0.55; z-index:-1}
.art-in-voice .feature-box .col-tip .tip-wrap > ol li p {font-size:20px; font-weight:100; color:#666; letter-spacing:-0.025em; line-height:1.4}
.art-in-voice .feature-box .feature-caution {margin-top:50px; font-size:20px; font-weight:300; color:#666; letter-spacing:-0.025em}

/* ------------------------------
 * Contact
------------------------------ */
.contact .root_daum_roughmap .wrap_controllers {display:none !important}
.contact .map-info {margin-top:50px}
.contact .map-info h3 {padding-bottom:20px; border-bottom:1px solid #d9d9d9}
.contact .map-info p {margin-top:20px; font-size:16px; font-weight:400; color:#333}
.contact .map-info p span.bar {display:inline-block; width:1px; height:10px; background-color:#ccc; margin:0 5px; vertical-align: 0}
.contact .map-info p + p {margin-top:10px}

/* ------------------------------
 * Membership
------------------------------ */
/* login */
.login-form {padding-top: 6.25rem; padding-bottom: 8.75rem}
.login-form .login-header {font-size: 1.375rem; font-weight: 700; color: #212529; letter-spacing: -0.04em; text-align: center}
.login-form .login-header-desc {font-size: 0.875rem; color: #343a40; letter-spacing: -0.04em; line-height: 1.7}
.login-form .form-tail-link {font-size: 0.9375rem; font-weight: 500; color: #868e96 !important; letter-spacing: -0.04em; padding: 0 !important; border: 0 !important; border-radius: 0}
.login-form .form-tail-link:hover {text-decoration: underline !important}
.login-form .form-sm + .form-sm {margin-top: 6.25rem}
.login-form .login-form-card {padding: 2.25rem; border: 1px solid #dee2e6; border-radius: 16px}
.login-form .guest-privacy-term {height: 10rem; padding: 1.75rem; font-size: 0.9375rem; color: #495057; letter-spacing: -0.03em; line-height: 1.6; border: 1px solid #dee2e6; border-radius: 12px; background-color: #f7f8fa; overflow-y: auto}
.login-form .order-info {margin-top: 2.25rem; padding: 1.75rem; border-radius: 0.75rem; background-color: #f7f7f7}
.login-form .order-info p {font-size: 14px; color: #495057; letter-spacing: -0.03em; line-height: 1.6}
.login-form .order-info p strong {font-weight: 700; color: #212529}
.login-form .login-warning {position: relative; padding: 1.75rem 1.75rem 1.75rem 5.75rem; border-radius: 0.375rem; background-color: #f7f7f7}
.login-form .login-warning i {position: absolute; top: 1.75rem; left: 1.75rem; font-size: 3.125rem; color: #ccc; line-height: 1}
.login-form .login-warning p {font-size: 0.9375rem; color: #888; line-height: 1.6}
.login-form .login-warning p strong {font-weight: 500; color: #000}

/* register */
.register-form {padding-top: 10rem; padding-bottom: 8.75rem}
.register-form .register-form-group {border: 1px solid #dee2e6; border-radius: 1rem; overflow: hidden}
.register-form .register-form-group .group-header {padding: 1.5rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: calc(1rem - 1px); border-top-right-radius: calc(1rem - 1px)}
.register-form .register-form-group .group-header h2 {font-size: 1.1875rem; font-weight: 700; color: #343a40; letter-spacing: -0.04em}
.register-form .register-form-group .group-content {padding: 1.75rem 1.5rem}
.register-form .register-form-group .group-footer {padding: 1.5rem; border-top: 1px solid #dee2e6; border-bottom-left-radius: calc(1rem - 1px); border-bottom-right-radius: calc(1rem - 1px)}
.register-form .register-form-group + .register-form-group {margin-top: 2rem}
.register-agreement .register-form-group .group-content .table th, .register-agreement .register-form-group .group-content .table td {font-size: 13px; letter-spacing: -0.03em}
.register-agreement .register-form-group .group-content .table thead th {border-bottom-width: 1px}
.register-form .register-process-button {margin-top: 4rem}
.register-form .register-form-group .small-desc {font-size: 13px; font-weight: 500; color: #666; letter-spacing: -0.03em; line-height: 1.5}
.register-form .register-form-group .small-desc.desc-exclamation {position: relative; padding-left: 18px}
.register-form .register-form-group .small-desc.desc-exclamation .bi {position: absolute; left: 0}
.register-form .register-result-wrap h3 {font-size: 1.1875rem; font-weight: 700; color: #343a40; letter-spacing: -0.04em; line-height: 1.5; margin-bottom: 1.5rem}
.register-form .register-result-wrap h3 strong {position: relative; color: #5c4229; z-index: 5}
.register-form .register-result-wrap h3 strong::after {content: ''; position: absolute; bottom: 2px; left: 0; right: 0; height: 0.5rem; background-color: #fab34a; opacity: .4; z-index: -1}
.register-form .register-result-wrap .result-info-list {padding: 1rem 1.75rem; border-radius: 1rem; background-color: #f8f9fa}
.register-form .register-result-wrap .result-info-list li {font-size: 0}
.register-form .register-result-wrap .result-info-list li + li {margin-top: 0.625rem}
.register-form .register-result-wrap .result-info-list li > b, .register-form .register-result-wrap .result-info-list li > p {display: inline-block; font-size: 0.9375rem; line-height: 1.6; vertical-align: top}
.register-form .register-result-wrap .result-info-list li > b {font-weight: 500; color: #495057; letter-spacing: -0.04em; width: 5rem}
.register-form .register-result-wrap .result-info-list li > p {font-weight: 700; color: #212529; width: calc(100% - 5rem)}
.register-form .register-result-wrap p {font-size: 0.9375rem; color: #666; letter-spacing: -0.04em; line-height: 1.68}
.register-form .register-result-wrap p + p {margin-top: 1.25rem}

/* ------------------------------
 * Board common
------------------------------ */
.board-button-row {text-align: right}
.board-button-row.top {padding-bottom: 2.5rem}
.board-button-row.bottom {padding-top: 2.5rem}
.board-button-row ul li {display: inline-block}
.btn_bo_user {display: inline-block; float: none}

.pg_wrap {float: none; display: block; padding-top: 3.75rem; font-size: 0; text-align: center}
.pg_page, .pg_current {display: inline-block; font-size: 0.9375rem; font-weight: 500; color: #495057; text-align: center; line-height: 2.25rem; width: 2.25rem; height: 2.25rem; margin: 0 3px; border: 0; border-radius: 50%; background-color: #fff}
.pg_page:hover {background-color: #f1f3f5}
.pg_current {color: #212529; background-color: #e9ecef}

.paging {font-size: 0; text-align: center}
.paging > b, .paging > a {display: inline-block; font-size: 15px; color: #666; text-align: center; line-height: 43px; width: 45px; height: 45px; margin: 0 4px; border: 1px solid #d9d9d9}
.paging > b, .paging > .current-page {color: #fff; border-color: #333; background-color: #333}
.paging > a:hover {border-color: #b4b4b4}

.bo_v_option {font-size: 0}
.bo_v_option li {display: inline-block; margin-right: 1rem}
.btn_cke_sc {height: auto !important; padding: 0.375rem 0.75rem; font-size: 0.875rem; color: #666; border: 1px solid #d9d9d9; background-color: #fff}

.article-list .list-common-top {margin-bottom: 2.625rem}
.article-list .list-common-top .total-count {font-size: 1.125rem; font-weight: 500; color: #343a40}
.article-list .list-common-top .total-count span {font-weight: 700; color: #5c4229}
.article-list .list-common-top .col-search {font-size: 0}
.article-list .list-common-top .col-search .selectric-wrapper, .article-list .list-common-top .col-search .search-box {display: inline-block; vertical-align: middle}
.article-list .list-common-top .col-search .selectric-wrapper {width: 8.75rem; margin-right: 0.5rem}
.article-list .list-common-top .col-search .search-box {position: relative; width: 16.25rem; height: 3.75rem; padding: 0.625rem 0.75rem; border: 1px solid #dee2e6; border-radius: 0; background-color: #fff}
.article-list .list-common-top .col-search .search-box input[type=text] {display: block; width: calc(100% - 2.25rem); height: 100%; font-size: 1rem; letter-spacing: -0.03em; padding: 0; border: 0; background-color: #fff; outline: 0}
.article-list .list-common-top .col-search .search-box .button-search {position: absolute; top: 0; right: 0; bottom: 0; padding: 0 0.75rem; font-size: 1.25rem; font-weight: 700; color: #212529; border: 0; background-color: transparent; outline: 0}
.article-list .cell-num {width: 3.75rem}
.article-list .cell-status {width: 5rem}
.article-list .cell-status .status {display: inline-block; font-size: 1rem; font-weight: 500; letter-spacing: -0.02em; text-align: center; min-width: 5.125rem; padding: 0.375rem 0.75rem; border-radius: 0.375rem}
.article-list .cell-status .status.status-01 {color: #495057; background-color: #f1f3f5}
.article-list .cell-status .status.status-02 {color: #4c6ef5; background-color: #dbe4ff}
.article-list .cell-status .status.status-03 {color: #fff; background-color: #343a40}
.article-list .cell-title {padding-left: 2.5rem}
.article-list .cell-title a {color: #333}
.article-list .cell-date {width: 9.375rem}
.article-list .cell-writer {width: 8.75rem}
.article-list .cell-read {width: 4.375rem}
.article-list .sch_word {color: #fab34a !important}
.article-view .view-container .header {padding: 3.125rem 2rem 2.5rem; border-top: 2px solid #333; border-bottom: 1px solid #e9e9e9}
.article-view .view-container .header h3 {font-size: 1.5rem; font-weight: 500; color: #212529; letter-spacing: -0.03em}
.article-view .view-container .header .grid-date {font-size: 0}
.article-view .view-container .header .grid-date span {display: inline-block; font-size: 1rem; color: #888}
.article-view .view-container .header .grid-date span + span::before {content: '|'; font-size: 0.75rem; color: #ccc; margin: 0 0.75rem; vertical-align: 1px}
.article-view .view-container .header .date {display: block; color: #888}
.article-view .view-container .header .divider {font-style: normal; color: #ccc; padding: 0 8px}
.article-view .view-container .body {padding: 3.75rem 0}
.article-view .view-container .body .post-inner {color: #666; line-height: 1.75}
.article-view .view-container .tail {margin-top: 3.75rem; border-top: 1px solid #333}
.article-view .view-container .tail .article-control li {line-height: 3.75rem; border-bottom: 1px solid #e9e9e9}
.article-view .view-container .tail .article-control li b {position: relative; float: left; display: block; padding-left: 2.5rem; width: 9.375rem; font-weight: 500; color: #555}
.article-view .view-container .tail .article-control li b:after {content: ''; position: absolute; top: 50%; right: 0; width: 1px; height: 1.125rem; margin-top: -0.5625rem; background-color: #d9d9d9}
.article-view .view-container .tail .article-control li a {display: block; font-weight: 500; color: #343a40; text-overflow: ellipsis; white-space: nowrap; margin-left: 11.875rem; padding-right: 2.5rem; overflow: hidden}
.article-write .write-desc {padding: 2.25rem; background-color: #f7f7f7}
.article-write .write-desc h4 {font-size: 1.1875rem; font-weight: 500; color: #212529; margin-bottom: 1.125rem}
.article-write .write-desc p {color: #666; line-height: 1.75}

/* ------------------------------
 * Board - photo
------------------------------ */
.photo-list .article-photo-row .grid-article {margin-bottom: 2rem}
.photo-list .article-photo-row .grid-article a {position: relative; display: block; border-radius:0; overflow: hidden; box-shadow: 0 4px 25.2px 2.8px rgba(0,0,0,.06)}
.photo-list .article-photo-row .grid-article figure {position: relative; margin-bottom: 0; padding-bottom: 52.91%; overflow: hidden}
.photo-list .article-photo-row .grid-article figure img {position: absolute; top: 0; left: 0; display: block; width: 100% !important; height: 100% !important; object-fit: cover; user-select: none; pointer-events: none; transition: transform .3s}
.photo-list .article-photo-row .grid-article .article-info {padding: 1.75rem; background-color: #fff}
.photo-list .article-photo-row .grid-article .article-info h3 {font-size: 1.1875rem; font-weight: 700; color: #222; letter-spacing: -0.04em; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 1rem; overflow: hidden}
.photo-list .article-photo-row .grid-article:hover .article-info h3 {color:#f4a336}
.photo-list .article-photo-row .grid-article:hover .article-info p {color:#f4a336}
.photo-list .article-photo-row .grid-article .article-info .date {display: block; font-size: 0.9375rem; font-weight: 500; color: #868e96; margin-top:1rem}
.photo-list .article-photo-row .grid-article a:hover figure img {transform: scale(1.03)}

/* ------------------------------
 * FAQ
------------------------------ */
.faq-list .sub-section-title {border-bottom:0}
.faq-list .faq-row .grid-faq-list ul li + li {margin-top: 1rem}
.faq-list .faq-row .grid-faq-list ul li .faq-header a {position: relative; display: flex; font-size: 1.1875rem; font-weight: 500; color: #333; letter-spacing: -0.025em; padding: 1.25rem 3rem 1.25rem 1.75rem; background-color:#f9f9f9}
.faq-list .faq-row .grid-faq-list ul li .faq-header a::before {content: 'Q'; display: block; font-family: 'NIXGON-Vb','Spoqa Han Sans Neo',sans-serif; font-weight: 700; color: #868e96; line-height: 1.3; margin-right: 1rem; transition:0.3s}
.faq-list .faq-row .grid-faq-list ul li .faq-header a::after {content: '\e941'; position: absolute; right: 1.75rem; font-family: 'xeicon'; color: #ced4da; z-index: 5; transition:0.3s}
.faq-list .faq-row .grid-faq-list ul li .faq-content {display: none; padding: 1.25rem 1.75rem 1.75rem; font-size: 1.0625rem; color: #000; letter-spacing: -0.03em; line-height: 1.67; background-color:#f9f9f9}
.faq-list .faq-row .grid-faq-list ul li.--open .faq-header a {border-bottom-left-radius: 0; border-bottom-right-radius: 0}
.faq-list .faq-row .grid-faq-list ul li.--open .faq-header a, .faq-list .faq-row .grid-faq-list ul li.--open .faq-content {background-color: #ffe8ca}
.faq-list .faq-row .grid-faq-list ul li.--open .faq-header a::after {transform: rotate(180deg)}
.faq-list .faq-row .grid-faq-list ul li.--open .faq-content {display: block}
.faq-list .faq-row .grid-faq-list.no-article {color: #868e96; line-height: 1.8; letter-spacing: -0.03em; text-align: center}
.faq-list .admin-button {padding-top: 3rem; text-align: right}

/* ------------------------------
 * media query
------------------------------ */
@media (max-width:1199px) {
    
}

@media (max-width:991px) {
    .hero .caption h2 {font-size:48px}
    .hero .caption p {font-size:28px}
    .breadcrumbs .col-items a {font-size:18px}

    .edu-phil .row-phil .title {text-align:center; margin-bottom:10px}
    .edu-phil .row-phil .title h2 {font-size:28px}
    .edu-phil .row-phil .info-box {text-align:center}
    .edu-phil .row-phil .info-box > p {font-size:24px}
    .edu-phil .row-phil .txt-box {margin-top:30px}
    .edu-phil .row-phil .txt-box p {font-size:18px}
    .edu-phil .row-phil .txt-box p + p {margin-top:20px}
    .edu-feature .row-edu-feature .row-txt .txt-box span {font-size:26px; width:40px; height:40px; line-height:38px}
    .edu-feature .row-edu-feature .row-txt .txt-box h3 {font-size:24px; margin-bottom:20px}
    .edu-feature .row-edu-feature .row-txt .txt-box p {font-size:20px}
    .ceo-profile {min-height:1190px}
    .ceo-profile .ceo-info .title h3 {font-size:32px}
    .ceo-profile .ceo-info .title p {font-size:38px}
    .ceo-profile .ceo-career > ul li {font-size:22px}

    .location .map-wrapper #map {height: 560px}
    .location .map-wrapper .map-info {top: 80px; left: 55px}
    .location .map-wrapper .map-info .info-body {padding: 55px 35px 40px 50px}
    .location .map-wrapper .map-info address {font-size: 19px}
    .location .map-wrapper .map-info address h3 {font-size: 19px}
    .location .map-wrapper .map-info .info-footer {padding: 25px 35px 25px 50px}
    .location .map-wrapper .map-info .info-footer a {font-size: 19px}

    .sub-section-title h3 {font-size:34px}
    .art-in-voice .top-info h3 {font-size:34px}
    .art-in-voice .top-info p {font-size:22px}
    .art-in-voice .feature-box .col-title h3 {font-size:34px}
    .art-in-voice .program-wrap .txt-box p {font-size:16px}

    .art-in-voice .feature-box .feature-caution {font-size:18px}
    .art-in-voice .program-wrap .txt-box span {font-size:14px}

}

@media (max-width:767px) {
    .hero .caption h2 {font-size:32px}
    .hero .caption p {font-size:22px}
    .breadcrumbs .col-items a {font-size:16px}
    .edu-phil .row-phil .title h2 {font-size:24px}
    .edu-phil .row-phil .info-box > p {font-size:18px}
    .edu-phil .row-phil .txt-box {padding:40px 15px}
    .edu-feature .row-edu-feature .row-txt .txt-box h3 {font-size:18px; margin-bottom:10px}
    .edu-feature .row-edu-feature .row-txt .txt-box p {font-size:16px}
    .edu-feature .row-edu-feature .col-items + .col-items {margin-top:40px}
    .ceo-profile {min-height:800px}
    .ceo-profile .row-ceo-profile .col-items:nth-child(2) {position:static; margin-top:40px; top:auto; right:auto}
    .ceo-profile .ceo-info .title span.bullet {width:40px; height:40px; top:-10px}
    .ceo-profile .ceo-info .title span.bullet01 {left:50px}
    .ceo-profile .ceo-info .title span.bullet02 {left:80px}
    .ceo-profile .ceo-info .title h3 {font-size:24px}
    .ceo-profile .ceo-info .title p {font-size:26px; padding:0 15px}
    .ceo-profile .ceo-career > ul li {font-size:18px}
    .ceo-profile .ceo-career h4 {font-size:26px; margin-bottom:10px}
    .ceo-profile .ceo-career p {font-size:18px}

    .location .map-wrapper #map {height: 400px}
    .location .map-wrapper .map-info {top: 25px; left: 25px}
    .location .map-wrapper .map-info .info-body {padding: 35px 28px 32px 28px}
    .location .map-wrapper .map-info address {font-size: 16px}
    .location .map-wrapper .map-info address h3 {font-size: 16px}
    .location .map-wrapper .map-info .info-footer {padding: 20px 28px 20px 28px}
    .location .map-wrapper .map-info .info-footer a {font-size: 16px}
    .location .map-wrapper .map-info .info-footer a .arrow {width: 19px; height: 19px; font-size: 13px; line-height: 19px; vertical-align: 0}

    .sub-section-title h3 {font-size:28px}
    .art-in-voice .top-info h3 {font-size:28px; margin-bottom:30px}
    .art-in-voice .top-info p {font-size:18px}
    .art-in-voice .top-info p + p {margin-top:30px}
    .art-in-voice .feature-box .col-title h3 {font-size:34px; margin-bottom:30px}
    .art-in-voice .feature-box .col-items > ol li h3 {font-size:24px; margin-bottom:15px}
    .art-in-voice .feature-box .col-items > ol li p {font-size:18px}
    .art-in-voice .feature-box .target-box {padding:40px 20px}
    .art-in-voice .feature-box .target-box > ul li {font-size:18px}
    .art-in-voice .program-wrap {padding-top:30px; padding-bottom:0}
    .art-in-voice .program-wrap h3 {font-size:32px}
    .art-in-voice .program-wrap h3 strong {font-size:32px}
    .art-in-voice .program-wrap .txt-box p {font-size:16px}
    .art-in-voice .feature-box .feature-caution {font-size:16px}

    .login-form {padding-top: 3.75rem; padding-bottom: 5rem}
    .register-form {padding-top: 6.25rem; padding-bottom: 5rem}

    .photo-list .article-photo-row .grid-article {margin-bottom: 3rem}

    .contact .map-box {margin-top:50px}
}

@media (max-width:575px) {
    .sub {padding-top:50px; padding-bottom:50px}
    .hero {margin-top: 60px; height:180px}
    .hero .caption h2 {font-size:22px}
    .hero .caption p {font-size:18px}
    .breadcrumbs .col-items a {font-size:12px}
    .edu-feature .row-edu-feature .row-txt .txt-box h3 {font-size:16px}
    .edu-phil .row-phil .title h2 {font-size:20px}
    .edu-phil .row-phil .info-box > p {font-size:14px}
    .edu-phil .container-xl hr {margin-top:50px; margin-bottom:50px}
    .edu-feature .row-edu-feature .row-txt .txt-box p {font-size:14px}
    .edu-feature .row-edu-feature .col-items + .col-items {margin-top:20px}
    .edu-phil .row-phil .txt-box p {font-size:14px}
    .ceo-profile .ceo-info .title p {font-size:18px}
    .ceo-profile .ceo-career {margin-top:20px}
    .ceo-profile .ceo-career > ul li {font-size:14px; padding-left:10px}
    .ceo-profile .ceo-career > ul li:before {top:8px}
    .ceo-profile .ceo-career h4 {font-size:24px}
    .ceo-profile .ceo-career p {font-size:14px}
    .location .map-wrapper .map-info {position: static; top: auto; left: auto; background-color: #f8f9fa}
    .location .map-wrapper .map-info .info-body {padding: 28px}
    .location .map-wrapper .map-info .info-footer {padding: 20px 28px; border-color: #e9e9e9}

    .sub-section-title h3 {font-size:22px}
    .art-in-voice .top-info h3 {font-size:22px; margin-bottom:20px}
    .sub-section-title {padding-bottom:40px}
    .art-in-voice .top-info p {font-size:16px}
    .art-in-voice .top-info p + p {margin-top:20px}
    .art-in-voice .feature-box {padding-top:50px; padding-bottom:50px}
    .art-in-voice .feature-box .col-items > ol li p {font-size:14px}
    .art-in-voice .feature-box .col-title h3 span {font-size:18px}
    .art-in-voice .feature-box .col-title h3 {font-size:22px; margin-bottom:20px}
    .art-in-voice .feature-box .target-box > ul li {font-size:14px}
    .art-in-voice .feature-box .target-box > ul li:after {top:8px}
    .art-in-voice .feature-box .process-box table thead tr th {font-size:16px; font-weight:500}
    .art-in-voice .feature-box .process-box table tbody tr th {width:40%; font-size:14px; padding:20px 10px}
    .art-in-voice .feature-box .process-box table tbody tr td {font-size:14px; padding:20px 15px}
    .art-in-voice .feature-box .process-box table tbody tr td ul li {font-size:14px}
    .art-in-voice .feature-box .process-box table tbody tr td ul li:after {top:6px}
    .art-in-voice .feature-box .process-box table tbody tr td ul li + li {margin-top:10px}
    .art-in-voice .program-wrap .txt-box p {font-size:14px}
    .art-in-voice .program-wrap h3 {font-size:22px}
    .art-in-voice .program-wrap h3 strong {font-size:22px}
    .art-in-voice .program-wrap .col-items {margin-bottom:50px}
    .art-in-voice .program-wrap .txt-box:after {top:auto; left:0; right:0; bottom:-57px; transform:rotate(90deg)}
    .art-in-voice .program-wrap .txt-box p {font-size:14px}
    .art-in-voice .program-wrap .contact-btn {margin-top:0; margin-bottom:50px}
    
    .art-in-voice .feature-box .col-items > ol li {margin-left:30px}
    .art-in-voice .feature-box .col-items > ol li::marker {font-size:22px}
    .art-in-voice .feature-box .col-items > ol li h3 {font-size:22px}
    .art-in-voice .feature-box .col-tip .tip-wrap {padding:40px 15px}
    .art-in-voice .feature-box .col-tip .tip-wrap > h3 {font-size:22px; padding-bottom:10px}
    .art-in-voice .feature-box .col-tip .tip-wrap > ol li h3 {font-size:14px}
    .art-in-voice .feature-box .col-tip .tip-wrap > ol li p {font-size:14px}
    .art-in-voice .feature-box .feature-caution {font-size:14px}
    
    .art-in-voice .feature-box .col-title h3 b {font-size:13px; font-weight:700; color:#e98624}

    .photo-list .article-photo-row .grid-article {margin-bottom: 0}
    .photo-list .article-photo-row .grid-article + .grid-article {margin-top: 2rem}
    .article-list .list-common-top .col-search .selectric-wrapper {width: 7rem}
    .article-list .list-common-top .col-search .search-box {width: calc(100% - 7.5rem)}
    .article-list .table-solid thead {display: none}
    .article-list .table-solid tbody, .article-list .table-solid tr, .article-list .table-solid td {display: block; width: 100%; text-align: left !important}
    .article-list .table-solid tr {padding: 1rem 0; border-bottom: 1px solid #eaeaea}
    .article-list .table-solid td {padding: 0 15px; border-bottom: 0}
    .article-list .cell-num {padding-bottom: 0.75rem !important}
    .article-list .cell-title {padding-left: 0; padding-bottom: 0.625rem !important}
    .article-list .cell-writer, .article-list .cell-date, .article-list .cell-read {font-size: 0.875rem; color: #666; padding-bottom: 2px !important}
    .article-view .view-container .header .grid-date {margin-top: 1rem}
    .gallery-board .gallery-swiper .swiper-slide a .board-title h3 {font-size:12px}
    section.sub .sub-photo-output {position:relative}
    section.sub .sub-photo-output .col-title {margin-bottom:10px}
    section.sub .sub-photo-output .col-title h3 {font-size:14px}
    section.sub .sub-photo-output .col-buttons {position:absolute; right:-15px; top:40px}
    .gallery-board .gallery-swiper .swiper-slide a .board-title {padding:15px 20px}
}