@charset "utf-8";
/* 서브공통 s */
:root {--point-color: #3F4FC0; --point-color2: #EFF5FF;}

.contents-head {background: url("/_user/support/img/sub/bg-sub-head-m.png") no-repeat center / cover; text-align: center; padding-top: 11rem;}
@media screen and (min-width: 768px){
    .contents-head {background: url("/_user/support/img/sub/bg-sub-head.png") no-repeat center / cover;}
}
@media screen and (min-width: 1200px){
    .contents-head {display: flex; flex-direction: column; justify-content: center; align-items: center; padding-top: 20rem;}
}
/* 서브공통 e */

/* sub tab s */
.category {position: relative; width: 100%; border-radius: 3rem 3rem 0 0; padding: 2.5rem 1.5rem 2rem; box-sizing: border-box; background: #fff;}
.category-btn {display: flex; align-items: center; justify-content: space-between; position: relative; width: 100%; height: 5rem; padding: 17px 16px; background: var(--point-color); color: #fff; font-size: 1.6rem; border-radius: 1.6rem; transition: .3s;}
.category-btn.active {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.category-wrap {display: none; width: calc(100% - 3rem); position: absolute; overflow-y: auto; z-index: 5; border: 1px solid #e5e5e5; box-sizing: border-box;}
.category-wrap li .tab-btn {display: flex; align-items: center; width: 100%; height: 52px; padding: 17px 16px; box-sizing: border-box; background: #fff; transition: .3s;}
.category-btn .arrow {display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; transition: .3s;}
.category-btn.active .arrow {transform: rotate(180deg);}
.category li.active .tab-btn {background: #F6FAFF;}
.category .arrow::before {content: ''; position: absolute; top: 50%; width: 7px; height: 7px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: translateY(-50%) rotate(135deg);}
@media screen and (min-width: 768px){
    .category {padding: 2.5rem 4rem 2rem;}
    .category-wrap {width: calc(100% - 8rem);}
}
@media screen and (min-width: 1200px){
    .category {width: 100%; max-width: 160rem; padding: 5rem 10rem 0; border-radius: 6rem 6rem 0 0;}
    .category-wrap {width: 100%; margin: 0 auto; position: relative !important; display: flex !important; justify-content: center; padding: 3px; z-index: 1; border-radius: 90px; box-shadow: 0 0 21px 0 rgba(0, 6, 43, 0.07); border: 1px solid rgba(0, 0, 0, 0.10); background: #fff;}
    .category-btn {display: none;}
    .category-wrap li { background: #fff; width: -webkit-fill-available;}
    .category-wrap.col3 li {width: 33.33%;}
    .category-wrap.col4 li {width: 25%;}
    .category-wrap li .tab-btn {height: 60px; justify-content: center; font-size: 20px;}
    .category-wrap li + li .tab-btn {border-left: 1px solid #fff;}
    .category-wrap li.active .tab-btn {color: #fff; background: var(--point-color); border-radius: 90px; }
}
/* sub tab e */

/* table guide s */
.tbl-guide {display: flex; align-items: center; justify-content: center; width: 100%; line-height: 44px; border: 1px solid #C6C6C6; margin: 0 0 14px; }
.tbl-guide > span {display: flex; gap: 1rem; align-items: center; position: relative;}
.tbl-guide > span::before {content: ""; display: inline-block; margin-right: 6px; width: 5.9rem; height: 3.2rem; background: url("/_user/support/img/sub/ico-scroll.svg") 0 0.5rem/contain no-repeat;}
.tbl-guide > span::after {content: ""; display: inline-block; position: absolute; top: 9px; width: 22rem; height: 3rem; background: url("/_user/support/img/sub/ico-scroll-hand.svg") 0 0/contain no-repeat; animation: handloop 1s infinite;}
@keyframes handloop{
    0%{
        left:20px;
    }
    50%{
        left:23px;
    }
    100%{
        left:20px;
    }
}
@media screen and (min-width: 768px){
    .tbl-guide {font-size: 1.6rem;}
}
@media screen and (min-width: 1024px){
    .tbl-guide {display: none;}
}
/* table guide e */

/* dialog modal s */
dialog::backdrop{background:rgba(0,0,0,.5)}
dialog {border:none;border-radius:2rem; padding:0; max-width:500px; width:90%;box-shadow:0 8px 30px rgba(0,0,0,.25); animation:fadeUp .2s ease; overflow: hidden;}
dialog.type-wide {max-width: 60rem;}
dialog.type-wide-900 {max-width: 90rem;}
.dialog-inner {padding: 2rem;}
@keyframes fadeUp {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.dialog-header {display:flex;justify-content:space-between;align-items:center}
.dialog-header h2 {display: flex; align-items: center; gap: 0.5rem; font-size:2.8rem; font-weight: 500;}
.btn-modal-close {width: 3rem; height: 3rem; background: url("/_user/support/img/sub/ico-modal-close.svg") no-repeat center / contain; position: absolute; right: 2rem; border-radius: 1rem;}
.dialog-footer .btn-modal-close {position: static; display: flex; justify-content: center; align-items: center; width: 12.5rem; height: 4.8rem; background: #333; color: #fff; margin: 0 auto;}
.dialog-body {margin-top:2rem; line-height:1.5; font-size: 1.6rem;}
.type-no-header .dialog-body {margin-top: 0;}
.dialog-footer{margin-top:16px;text-align:right}
.ico-modal-noti {display: block; width: 7rem; height: 7rem; background: url("/_user/support/img/sub/ico-modal-noti.svg") no-repeat center / cover; margin: 0 auto 2rem;}
.modal-info-txt {font-size: 1.7rem; text-align: center;}
.modal-btn-wrap {display: flex; justify-content: space-between; gap: 1rem;}
.btn-modal {height: 6rem; display: flex; align-items: center; justify-content: center; background: #333; border-radius: 0.8rem; flex: 1; color: var(--white); font-size: 1.7rem;}
.btn-modal.bg-point {background: var(--point-color);}
.img-profile {margin-right: 0.5rem;}
.img-profile > img {position: relative; top: -0.4rem;}
.ico-guide {display: inline-block; width: 3rem; height: 3rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-guide.svg") no-repeat center / contain;}
.ico-dialog {display: inline-block; width: 3rem; height: 3rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-dialog.svg") no-repeat center / contain;}

.radio-box input[type="radio"] + label {display: flex; padding-left: 3.5rem; font-size: 2rem; color: var(--black);}
.radio-box input[type="radio"] + label::after {top: 5px; width: 2.3rem; height: 2.3rem;}
.radio-box input[type="radio"] + label:before {left: 4px; top: 9px; width: 1.5rem; height: 1.5rem;}
.radio-box input[type="radio"] + label:hover::after, .radio-box input[type="radio"]:checked + label::after {border-color: var(--point-color);}
.radio-box input[type="radio"]:checked + label::before {background: var(--point-color);}
.dialog-body .radio-form {letter-spacing: 0;}
.dialog-body .radio-form.column {gap: 0;}
.dialog-body .y-scroll {overflow-y: auto; max-height: 50rem; padding-right: 1rem;}
.dialog-body .custom-scroll::-webkit-scrollbar {width: 10px; height: 5px; margin-top: 15px;}
.dialog-body .custom-scroll::-webkit-scrollbar-thumb {height: 10% !important; background: var(--point-color);border-radius: 50px;}
.dialog-body .custom-scroll::-webkit-scrollbar-track {background: #EBEBEB;}

/* 작성가이드 모달 */
.gray-box {padding: 3rem 2rem; border-radius: 1.2rem; border: 1px solid #E4E4E4; background: #F8F8F8;}
.dialog-body-tit {padding: 3rem 0 2rem; line-height: 1; font-size: 1.9rem; font-weight: 700;}
.dialog-body-txt + .gray-box {margin-top: 3rem;}
.gray-box .dialog-body-tit {padding-top: 0;}
.dialog-bullet-list {font-size: 1.5rem; word-break: keep-all;}
.dialog-bullet-list > li {display: flex; flex-wrap: wrap; position: relative; align-items: baseline;}
.dialog-bullet-list > li::before {content: ''; position: relative; top: -0.3rem; display: inline-block; margin-right: 0.8rem; min-width: 0.4rem; height: 0.4rem; border-radius: 1rem; background: var(--black);}
.dialog-bullet-list > li em {min-width: 9rem; font-weight: 600;}
.dialog-bullet-list > li span {width: 100%; padding-left: 1rem; box-sizing: border-box;}
.dialog-bullet-list > li + li {margin-top: 0.5rem;}
/*.dialog-bullet-list:last-of-type {padding-bottom: 3rem;}*/
.title-top {font-size: 1.5rem; color: #979797;}
@media screen and (min-width: 768px) {
    .dialog-bullet-list > li span {width: auto; padding-left: 0;}
}
@media screen and (min-width: 1200px) {
    dialog {border-radius: 3.5rem}
    .dialog-inner {padding: 3rem;}
    .dialog-inner.type-no-header {padding: 5rem;}
    .dialog-body {margin-top: 4rem;}
    .dialog-footer {margin-top: 3rem;}
    .btn-modal-close {width: 4rem; height: 4rem; top: 2rem; right: 2rem;}
    .btn-modal {font-size: 1.8rem;}
    .ico-modal-noti {width: 8rem; height: 8rem; margin: 0 auto 3em;}
    .modal-info-txt {font-size: 2rem;}
    .dialog-footer .btn-modal-close {height: 6rem;}
    .dialog-body .y-scroll {padding-right: 3rem;}
    .dialog-body .custom-scroll::-webkit-scrollbar {width: 18px; height: 5px; margin-top: 15px;}
    .ico-guide {width: 4rem; height: 4rem;}
    .gray-box {padding: 3rem;}
    .dialog-body-txt + .gray-box {margin-top: 4rem;}
    .dialog-bullet-list > li {flex-wrap: nowrap;}
    .dialog-bullet-list > li em {min-width: 12rem;}
    .ico-dialog {width: 4rem; height: 4rem;}
}
/* dialog modal e */


/* 인바디 test s*/
.measurement-date-area {position: relative; display: flex; align-items: center; justify-content: center; border-radius: 0.8rem; background: #f8f8f8; padding: 2rem 1rem; font-size: 1.5rem; margin-bottom: 2rem;}
.measurement-date-area .ico-arrow-left, .measurement-date-area .ico-arrow-right {display: inline-block; width: 2.4rem; height: 2.4rem; background: url("/_user/support/img/sub/ico-arrow.svg") no-repeat center / contain;}
.measurement-date-area .ico-arrow-right {transform: rotate(180deg);}
.open-modal-date {width: 100%; display: flex; justify-content: space-between; align-items: center; max-width: 40rem; color: #111; font-size: 1.5rem;}
.open-modal-date > em {display: flex; align-items: center;}
.open-modal-date .date {padding-left: 0.5rem; font-weight: 600;}
.ico-date {display: inline-block; margin-left: 1rem; width: 2.4rem; height: 2.4rem; background: url("/_user/support/img/sub/ico-date.svg") no-repeat center / contain;}
.ico-date-b {display: inline-block; width: 3rem; height: 3rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-date-b.svg") no-repeat center / contain;}
.ico-child {display: inline-block; width: 4rem; height: 4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-child.svg") no-repeat center / contain;}
.ico-child-w {display: inline-block; width: 4rem; height: 4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-child-w.svg") no-repeat center / contain;}
.ico-child-m {display: inline-block; width: 4rem; height: 4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-child-m.svg") no-repeat center / contain;}

.evaluation-card-list {word-break: keep-all;}
.evaluation-card-list .card-item {border-radius: 1.2rem; box-sizing: border-box; font-size: 1.6rem; border: 1px solid #EDEDED;}
.evaluation-card-list .item-inbody-txt > p {margin: 3rem 0 1rem;}
.item-inbody-profile {display: grid; gap: 1rem; grid-template-columns: 8rem 1fr; grid-template-rows: 1fr 1fr; color: var(--black); padding: 1.5rem 2rem 2rem; box-sizing: border-box; background: #F8F8F8; margin-bottom: 2rem;}
.item-inbody-profile .profile-info {display: flex;}
.item-inbody-profile .profile-photo {grid-column: 1 / 2; grid-row: 1 / 3; margin: 0 auto; min-width: 8rem; height: 8rem; border-radius: 8rem;}
.item-inbody-profile .profile-details {display: flex; align-items: center; gap: 1rem; }
.item-inbody-profile .profile-name {font-size: 2rem;}
.item-inbody-profile .profile-meta {font-size: 1.6rem; font-weight: 400;}
.open-modal-child {display: flex; align-items: center; justify-content: center; width: 100%; color: var(--white); border-radius: 1rem; font-weight: 600; transition: .3s; max-width: 30rem; background: #565D6D}
.open-modal-child > em {display: flex; align-items: center;}
.ico-profile {display: inline-block; width: 2.4rem; height: 2.4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-profile.png") no-repeat center / cover;}
.ico-profile-more {display: inline-block; width: 2rem; height: 2rem; margin-left: 0.5rem; background: url("/_user/support/img/sub/ico-profile-more.svg") no-repeat center / cover;}
.item-inbody-score {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; background: #E6F2FE; padding: 3rem 2rem;}
.item-inbody-score .card-tit {font-weight: 500; font-size: 1.6rem;}
.item-inbody-score .card-content {display: flex; align-items: center; color: #5C6ED2; font-size: 2.6rem;}
.item-inbody-score .score, .item-inbody-score .divider {font-size: 3.4rem; font-weight: 600;}
.item-inbody-score .divider {font-size: 3.6rem;}
.item-inbody-score .card-desc {width: 100%; padding-top: 1.5rem;}
.item-inbody-score .card-desc strong {display: block;}
.ico-inbody {display: inline-block; width: 7rem; height: 2rem; background: url("/_user/support/img/sub/ico-inbody.svg") no-repeat center/ contain; color: #941D2E;}
.btn-lnk-inbody {display: flex; gap: 1rem; justify-content: center; align-items: center; width: 100%; height: 6rem; margin-bottom: 1rem; border-radius: 1.2rem; background: #F3F3F3; color: #941D2E; transition: .3s;}
.evaluation-info-list {display: flex; flex-wrap: wrap; gap: 1.2rem;}
.evaluation-info-list > li {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 48%; padding: 1rem; box-sizing: border-box; border-radius: 1.5rem; background: #F8F8F8;}
.evaluation-info-list .label {width: 100%; border-radius: 0.5rem; box-sizing: border-box; text-align: center; background: #fff; padding: 0.5rem 1.3rem; font-size: 1.3rem; margin-bottom: 0.8rem;}
.evaluation-info-list > li > p {font-size: 2.2rem; font-weight: 700; line-height: 1;}


.dialog-body .radio-form > li {padding: 3rem 0;}
.dialog-body .radio-form > li + li {border-top: 1px solid rgba(0, 0, 0, 0.20);}
.modal-date-item > label {display: flex !important; flex-wrap: wrap; justify-content: space-between;}
.modal-date-item .weight em {color: #888; padding-right: 0.5rem;}

/* 체성분 분석*/
.donut-chart{width: 180px; height: 180px; border-radius: 50%; margin: 3rem auto 3rem; position:relative; display:flex; align-items:center ;justify-content:center; background:conic-gradient(#eee 0deg 360deg);}
.donut-chart::before{content:"";position:absolute;width:65%;height:65%;background:#fff;border-radius:50%;z-index:1;}
.chart-label{position:absolute;text-align:center;font-size:14px;font-weight:500;z-index:2;}
.chart-tooltip{position:absolute;padding:4px 8px;background:#333;color:#fff;font-size:12px;border-radius:4px;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(-50%,-120%);transition:opacity .2s;z-index:2;}
.chart-segment{position:absolute;inset:0;border-radius:50%;cursor:pointer;}
.graph-labels {display: flex; gap: 1rem; justify-content: center;}
.graph-labels>li{display:flex;align-items:center;gap:.5rem;position:relative;color:#555;}
.graph-labels>li::before{content:'';display:inline-block;width:1.5rem;height:1.5rem;border-radius:50%;}
.graph-labels>.item01::before{background:#636AE8;}
.graph-labels>.item02::before{background:#E8618C;}
.graph-labels>.item03::before{background:#9095A1;}
.graph-labels>.item04::before{background:#22CCB2;}
.graph-labels>.item05::before{background:#22CCB2;}
.graph-labels>.item06::before{background:#B2B2B2;}/*기타*/
.graph-labels>.item07::before{background:#92D000;}
.graph-labels>.item08::before{background:#6FA902;}
.graph-labels>.item09::before{background:#FFED66;}
.bodycomp-list {margin-top: 5rem;}
.bodycomp-list > li {display: flex; justify-content: space-between; background: #F8F8F8; border-radius: 1rem; padding: 1.5rem 2rem;}
.bodycomp-list > li + li {margin-top: 1.2rem;}
.bodycomp-list .tit {font-weight: 600; font-size: 2rem;}
.bodycomp-list .tit span {display: block; color: #7D8492; font-weight: 400; font-size: 1.3rem;}
.bodycomp-list .result {display: flex; flex-direction: column; align-items: flex-end;}
.bodycomp-list .result > p {font-size: 2.6rem; color: var(--point-color); font-weight: 500;}
.bodycomp-list .result > span {font-size: 1.4rem; color: #7D8492;}
.bodycomp-list .result br {display: none;}

/*비만분석*/
.weight-management-area {padding-bottom: 2rem;}
.body-info-box {padding: 1.5rem; border-radius: 1.5rem; background: #F8F8F8; box-sizing: border-box; margin-bottom: 1rem; font-size: 1.6rem;}
.body-info-box .tit {font-weight: 600;}
.body-info-box .data {text-align: right;}
.obesity-level {display: block; color: var(--point-color); font-weight: 500; font-size: 4rem; line-height: 1;}
.body-status-table { width:100%; border-collapse:collapse; text-align:center; border-radius: 1.5rem; overflow: hidden; font-size: 1.4rem;}
.body-status-table th {background-color:var(--point-color); color:#fff; padding:0.6rem 0; font-weight:500; font-size: 1.6rem;}
.body-status-table th + th {border-left: 1px solid #fff;}
.body-status-table td {border-bottom:1px solid #fff; padding:1rem 0; background: #F8F8F8; font-weight: 500;}
.body-status-table td:nth-of-type(1) {color: #7D8492;}
.body-status-table td + td {border-left: 1px solid #fff;}
.body-status-table td .status {position: relative; font-weight:500;}
.status.decrease {color:#ff3b30;}
.status.increase {color:#ff9f0a; font-weight:500;}
.status.maintain {color:#34c759; font-weight:500;}
.status::before {content: ''; display: inline-block; width: 1.6rem; height: 1.6rem;  position: relative; top: 3px; margin-right: 0.3rem;}
.status.decrease::before {background: url("/_user/support/img/sub/ico-decrease.svg") no-repeat center / cover;}
.status.increase::before {background: url("/_user/support/img/sub/ico-increase.svg") no-repeat center / cover;}
.status.maintain::before {background: url("/_user/support/img/sub/ico-maintain.svg") no-repeat center / cover;}
.adjust.decrease {color:#ff3b30;}
.adjust.increase {color:#ff9f0a;}
.adjust.maintain {color:#34c759;}

.body-balance {position: relative; width: 100%; height: 100%; max-width: 54rem; margin: 0 auto; background: #F8F8F8; border-radius: 10px;display: flex;align-items: center;justify-content: center; z-index: 0;}
.body-balance::before {content: '왼'; display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 5rem; background: #fff; border-top-right-radius: 100px; border-bottom-right-radius: 100px; position: absolute; left: 0; color: #7D8492; font-size: 1.2rem;}
.body-balance::after {content: '오른';display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 5rem; background: #fff; border-top-left-radius: 100px; border-bottom-left-radius: 100px; position: absolute; right: 0; color: #7D8492; font-size: 1.2rem;}
.body-balance .part {position: absolute;text-align: center; font-size: 1.5rem;color: #333;}
.body-balance .label {font-weight: 400; color: #7D8492; font-size: 1.4rem;}
.body-balance .status {font-weight: 500;}
.body-balance .trunk {position: static; width: 11rem; height: 24rem; padding-bottom: 3rem; box-sizing: border-box; display: flex;flex-direction: column;justify-content: center;align-items: center;  background: url("/_user/support/img/sub/img-inbody.svg") no-repeat center / contain;}
.body-balance .trunk::before {content: ''; width: 0.3rem; height: 100%; background: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1;}
.body-balance .trunk::after {content: ''; width: 100%; height: 0.3rem; background: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1;}
.body-balance .left-arm {left: 3rem;top: 3rem; text-align: left;}
.body-balance .right-arm {right: 3rem;top: 3rem; text-align: right;}
.body-balance .left-leg {left: 3rem;bottom: 3rem; text-align: left;}
.body-balance .right-leg {right: 3rem;bottom: 3rem; text-align: right;}

.inbody-bar {display: flex; align-items: center; justify-content: space-between; gap: 2rem; background: #F8F8F8; padding: 1rem; border-radius: 1.2rem;}
.inbody-bar + .inbody-bar {margin-top: 1rem;}
.inbody-box {padding-top: 1rem;}
.inbody-box .bar-label {display:flex; flex-direction: column; justify-content:space-between; margin-bottom:6px; font-weight:500;}
.inbody-box .bar-label > span {color: var(--point-color); line-height: 1; font-size: 1.8rem; min-width: 5.2rem; font-weight: 700;}
.inbody-box .bar {position: relative; display: flex; gap: 0.3rem; width: 100%; height: 16px; overflow: hidden; font-size: 1.2rem; text-align: center; color: #fff;}
.inbody-box .range {display: flex; align-items: center; justify-content: center; font-weight: 500; word-break: keep-all;}
.inbody-box .low {background: rgba(195, 214, 0, 0.1); color: #949F1B;}
.inbody-box .normal {background: rgba(72, 199, 188, 0.15); color: #1C8C82;}
.inbody-box .high {background: rgba(92, 110, 210, 0.1); color: #3244A9;}
.inbody-box .bar-sub {height:10px; border-radius:6px; transition: width 0.6s ease; width: 0;}
.inbody-bar .bar-box {flex: 1;}
.inbody-box .bar-bg {width: 100%; height: 1.5rem; background: #E9EDF0; border-radius: 1rem; margin-top: 0.5rem; }
.inbody-box .bar-sub {height: 1.5rem; border-radius: 1rem; width: 0; transition: width .8s ease;}


@media screen and (min-width: 768px) {
    /* 인바디 test */
    .item-inbody-profile {grid-template-columns: 9rem 1fr;}
    .item-inbody-profile .profile-photo {width: 9rem; height: 9rem;}
    .open-modal-date {font-size: 1.7rem;}
    .open-modal-child {height: 4.4rem;}
    .btn-lnk-inbody:hover, .open-modal-child:hover {opacity: 0.8;}
    .body-balance .trunk {width: 17rem; height: 32rem;}
    .body-balance::before, .body-balance::after {width: 5rem; height: 10rem; font-size: 1.8rem;}
    .inbody-bar + .inbody-bar {margin-top: 1.5rem;}
    .inbody-bar {padding: 2rem 2.5rem; border-radius: 1.5rem; gap: 3rem;}
    .inbody-box {margin-top: 2rem;}
    .inbody-box .bar {font-size: 1.5rem; height: 2rem;}
    .inbody-box .bar-bg {height: 2rem;}
    .inbody-box .bar-sub {height: 2rem;}
    .inbody-box .bar-label {min-width: 7.5rem; font-size: 1.6rem;}
    .inbody-box .bar-label > span {font-size: 2.5rem;}
    .evaluation-info-list .label {font-size: 1.6rem;}
    .evaluation-card-list .card-item {gap: 1rem 2rem;}
}

@media screen and (min-width: 1024px) {
    .measurement-date-area {font-size: 2rem; border-radius: 5rem; margin-bottom: 0; border: 1px solid #EDEDED;}
    .open-modal-date {font-size: 2rem;}
    .evaluation-card-list {display: flex; gap: 1.2rem; padding-top: 5rem; font-size: 1.8rem;}
    .evaluation-card-list .card-item {width: 33.33%; grid-template-columns: 10rem 1fr; grid-template-rows: 10rem 1fr; border-radius: 3rem; padding: 6rem 7rem;}
    .evaluation-card-list .item-inbody-profile {font-size: 1.8rem; padding: 3.5rem; margin-bottom: 0;}
    .item-inbody-profile .profile-photo {width: 10rem; height: 10rem;}
    .item-inbody-profile .profile-info {display: flex; gap: 2rem;}
    .item-inbody-profile .profile-name {font-size: 2.7rem;}
    .item-inbody-profile .profile-meta {display: flex; align-items: center; gap: 0.3rem; font-size: 1.8rem;}
    .ico-profile {width: 3.5rem; height: 3.5rem;}
    .open-modal-child {height: 5.5rem; grid-column: 1 / 3; max-width: unset;}
    .evaluation-card-list .item-inbody-score {padding: 5rem;}
    .item-inbody-score .card-tit {font-size: 2.1rem; padding-bottom: 4rem;}
    .item-inbody-score .card-content {display: flex; align-items: baseline; font-size: 2.8rem;}
    .item-inbody-score .score, .item-inbody-score .divider {font-size: 5rem; font-weight: 600;}
    .item-inbody-score .card-desc {padding-top: 3rem;}
    .evaluation-card-list .item-inbody-txt {padding: 0; align-self: flex-end;}
    .btn-lnk-inbody {height: 7rem; margin-top: 2rem;}
    .evaluation-info-list {margin-top: 1.2rem;}
    .evaluation-info-list > li {width: calc(25% - 0.9rem); height: 16rem; padding: 2.7rem;}
    .evaluation-info-list > li > p {font-size: 3rem; padding-top: 1rem;}
    /* 체성분 분석*/
    .bodycomp-graph-area {display: flex; justify-content: space-between;}
    .bodycomp-graph-box {width: 40%;}
    .bodycomp-list {width: 55%;}
    .bodycomp-list > li {padding: 2rem 3rem;}
    .bodycomp-list .tit {font-size: 2.4rem;}
    .bodycomp-list .tit span {font-size: 1.6rem;}
    .bodycomp-list .result {gap: 1.8rem;}
    .bodycomp-list .result > p {font-size: 2.6rem;}
    .bodycomp-list .result > span {min-width: 8.4rem}
    .donut-chart {width: 33rem; height: 33rem; margin: 0 5rem 3rem; box-sizing: border-box}
    .chart-label {font-size: 2rem;}
    /* 비만 분석*/
    .weight-management-area {display: flex; gap: 2rem; padding-bottom: 4rem;}
    .body-info-box {width: 38%; padding: 3rem 5rem; margin-bottom: 0;}
    .body-info-box .tit {font-size: 2.2rem; padding-bottom: 2rem;}
    .body-status-table {width: 62%;}
    .body-status-table .status {width: 1.6rem; height: 1.6rem;}
    .fat-assessment-area {display: flex; gap: 2rem;}
    .obesity-level {font-size: 4.4rem;}
    .body-info-box .data > span {font-size: 1.8rem;}
    .body-status-table th {padding: 2rem 0;}
    .body-status-table td {font-size: 2rem;}
    .fat-img-box {width: 38%;}
    .inbody-box {width: 62%; background: #F8F8F8; margin-top: 0; padding-top: 0;}
    .body-balance {border-radius: 2rem; margin: 0;}
    .body-balance .part {font-size: 2rem;}
    .body-balance .label {font-size: 1.8rem;}
    .inbody-bar {padding: 3rem 4rem; border-radius: 2rem;}
    .inbody-box .bar {height: 2rem;}
    .inbody-box .bar-bg {height: 3rem; border-radius: 3rem; margin-top: 1rem;}
    .inbody-box .bar-sub {height: 3rem; border-radius: 3rem 0 0 3rem;}
    .inbody-box .bar-box {max-width: 55rem;}
    .inbody-box .bar-label {font-size: 1.8rem;}
    .inbody-box .bar-label > span {font-size: 3.6rem; padding-top: 1rem;}
    .inbody-box .range {font-size: 1.5rem;}
}
@media screen and (min-width: 1200px) {
    .bodycomp-graph-box {display: flex; align-items: center;}
    .bodycomp-graph-box .graph-labels {flex-direction: column;}
    .graph-labels > li + li {padding-top: 1.5rem;}
    .donut-chart {margin-bottom: 0;}
    .evaluation-info-list {margin-top: 3rem;}
}
/* 인바디 test e*/

/* 활동량 분석 s*/
.evaluation-card-list .card-item.item-report {display: block; position: relative; background: #EFF5FF; border: 1px solid #90B9FE; padding: 1.5rem 2rem;}
.evaluation-card-list .card-item.item-report::before {content: ''; display: block; width: 9.8rem; height: 6.3rem; position: absolute; right: 0; bottom: 0; background: url("/_user/support/img/sub/deco-report.png") no-repeat center / cover;}
.card-item.item-report .card-tit {display: flex; align-items: center; position: relative; color: var(--black); font-size: 1.8rem; font-weight: 600;}
.card-item.item-report .card-tit::before {content: ''; display: inline-block; margin-right: 1rem;  width: 2.4rem; height: 2.4rem; background: #fff url("/_user/support/img/sub/deco-report-tit.svg") no-repeat center / 1.8rem; border-radius: 0.5rem;}
.card-item.item-report .card-content {font-size: 1.4rem; color: #6B768B; padding: 0.5rem 0 0 3.5rem;}

.ability-list li {width: 100%; height: 4rem; display: flex; align-items: center; justify-content: space-between; background: #F8F8F8; border-radius: 1rem; padding: 0.5rem 2rem; box-sizing: border-box;}
.ability-list li:last-child {border-bottom: 0;}
.ability-list li + li {margin-top: 0.3rem;}
.ability-list li .tit {display: flex; align-items: center;}
.ability-item i {display: inline-block; width: 3rem; height: 3rem; margin-right: 1rem;}
.ability-item .ico-ability01 {background: url("/_user/support/img/sub/ico-ability01.svg") no-repeat center / contain;}
.ability-item .ico-ability02 {background: url("/_user/support/img/sub/ico-ability02.svg") no-repeat center / contain;}
.ability-item .ico-ability03 {background: url("/_user/support/img/sub/ico-ability03.svg") no-repeat center / contain;}
.ability-item .ico-ability04 {background: url("/_user/support/img/sub/ico-ability04.svg") no-repeat center / contain;}
.ability-item .ico-ability05 {background: url("/_user/support/img/sub/ico-ability05.svg") no-repeat center / contain;}
.ability-item .ico-ability06 {background: url("/_user/support/img/sub/ico-ability06.svg") no-repeat center / contain;}
.ability-item .ico-ability01 {}
.icon img {width: 24px; height: 24px; vertical-align: middle;}
.title {flex: 1; margin-left: .75rem; font-size: 15px; color: #333;}
.stars {display: flex; gap: 4px;}
.star {width: 18px; height: 18px; background: url("/_user/support/img/sub/img-star-off.svg") no-repeat center / contain;}
.star.on {background-image: url("/_user/support/img/sub/img-star-on.svg");}
.ability-list-wrap .chart-wrap {margin: 0 auto; max-width: 40rem; padding-top: 4rem;}
@media screen and (min-width: 768px) {
    .evaluation-card-list .card-item.item-report {transition: .3s;}
    .evaluation-card-list .card-item.item-report:hover {opacity: 0.8;}
    .ability-list li {height: 5rem; font-size: 1.5rem;}
    .ability-item i {display: inline-block; width: 3.5rem; height: 3.5rem; margin-right: 1rem;}

}
@media screen and (min-width: 1024px) {
    .evaluation-card-list.type-long {gap: 2rem;}
    .evaluation-card-list.type-long .item-inbody-profile {flex: 1; width: 70%; padding: 1.5rem 6rem; display: flex; align-items: center; justify-content: center; gap: 2rem;}
    .evaluation-card-list.type-long .open-modal-child {max-width: 20rem; margin-left: 2rem; border-radius: 1.3rem;}
    .evaluation-card-list.type-long .item-inbody-profile .profile-photo {margin: 0;}
    .evaluation-card-list .card-item.item-report {width: 32%;}
    .evaluation-card-list .card-item.item-report {padding: 3rem;}
    .card-item.item-report .card-tit {font-size: 2rem;}
    .card-item.item-report .card-content {font-size: 1.5rem; padding: 1rem 0 0 2rem;}
    .evaluation-card-list .card-item.item-report::before {width: 12.7rem; height: 9.2rem;}

    .ability-list-wrap .chart-wrap {max-width: 36rem; width: 36rem; margin: 0 auto; padding-top: 0;}
    .ability-list-wrap {display: flex; align-items: center;}
    .ability-list {width: 100%; max-width: 30rem;}
    .ability-item i {display: inline-block; width: 4rem; height: 4rem;}
    .star {width: 2.4rem; height: 2.4rem;}


}
/* 활동량 분석 e*/

/* 체형진단 s */
.musculoskeletal-list {display: flex; flex-wrap: wrap; gap: 0.5rem;}
.musculoskeletal-item {width: calc(50% - 0.3rem); background: #F8F8F8; border-radius: 1.2rem; padding: 1rem 3rem; box-sizing: border-box;}
.musculoskeletal-item .label {height: 3rem; display: flex; align-items: center; justify-content: center; width: 100%; border-radius: 3rem; background: var(--point-color); color: #fff;}
.musculoskeletal-item .label-question {background: var(--point-color) url("/_user/support/img/sub/ico-label-question.svg") no-repeat center right 0.5rem / 3rem; transition: .3s;}
.musculoskeletal-item:nth-of-type(3) {width: 100%;}
.musculoskeletal-item > p {padding-top: 1rem; text-align: center; font-size: 2.2rem; font-weight: 600;}
.data-muscule.lv1, .data-muscule.lv2, .skeletal-info-item .lv1, .skeletal-info-item .lv2 {color: #C3D600;}
.data-muscule.lv3, .data-muscule.lv4, .skeletal-info-item .lv3, .skeletal-info-item .lv4 {color: #EF7504;}
.data-muscule.lv5, .data-muscule.lv6, .skeletal-info-item .lv5, .skeletal-info-item .lv6 {color: #E50012;}

.formanalysis-item.bowlegs .bar-box {flex-direction: column; align-items: unset; gap: 0;}
.formanalysis-item.bowlegs .type-col3 {display: flex; align-items: center; gap: 1rem;}
.formanalysis-graph .type-col3 .lv1 {background: rgba(14, 128, 205, 0.6);}
.formanalysis-graph .type-col3 .lv2 {background: rgba(14, 128, 205, 0.2);}
.formanalysis-graph .type-col3 .lv3 {border-radius: 0 10rem 10rem 0; background: rgba(14, 128, 205, 0.6);}
.formanalysis-graph .type-col3 .level.lv1 em::before {display: none;}
.formanalysis-graph .bowlegs.right .level.lv2 em::before {content: '정상'; position: absolute; left: 50%; bottom: -2.5rem; transform: translateX(-50%); color: #0E80CD; word-break: keep-all; font-size: 1.4rem;}
.formanalysis-graph .bar-info {display: flex; justify-content: space-between; font-size: 1.3rem; padding-left: 2rem;}

.table-top-tit {padding: 1rem; width: 100%; background: #F7F8FB; border-top: 1px solid var(--black); color: var(--black); font-weight: 500; box-sizing: border-box;}
.info-box {border-radius: 1.2rem; background: #F8F8F8; padding: 2rem 1rem; font-size: 1.5rem; word-break: keep-all;}
.info-box-tit {display: flex; align-items: center; position: relative; padding-bottom: 1rem; font-weight: 600;}
.info-box-tit::before {content: ''; display: inline-block; margin-right: 0.5rem; width: 1.6rem; height: 1.6rem; background: url("/_user/support/img/sub/ico-info.svg") no-repeat center / 1.6rem; }
.info-box-txt {padding-left: 2rem;}
.skeletal-info-list {padding-top: 1rem; margin: 1rem 0 0 2rem; border-top: 1px dashed #C6C6C6;}
.skeletal-info-item {position: relative; align-items: baseline; display: flex; gap: 1rem;}
.skeletal-info-item::before {content: ''; min-width: 3px; height: 3px; border-radius: 3px; background: #555; display: inline-block; position: relative; top: -3px;}
.skeletal-info-item em {min-width: 9rem; font-weight: 500;}

@media screen and (min-width: 768px) {
    .musculoskeletal-item .label-question:hover {opacity: 0.8;}
    .musculoskeletal-list {gap: 1rem;}
    .musculoskeletal-item {width: calc(33.33% - 0.7rem); padding: 2rem; border: 1px solid #EDEDED;}
    .musculoskeletal-item:nth-of-type(3) {width: calc(33.33% - 0.7rem);}

    .formanalysis-graph.type-sub .formanalysis-img {width: 20%;}
}

@media screen and (min-width: 1024px) {
    .musculoskeletal-item {padding: 2rem 6rem; border-radius: 2rem;}
    .musculoskeletal-item .label {height: 4rem; font-size: 1.6rem;}
    .musculoskeletal-item > p {font-size: 3rem; padding-top: 1.5rem;}
    .formanalysis-graph.type-sub {display: flex; flex-wrap: wrap; gap: 5rem 0;}
    .formanalysis-graph.type-sub .formanalysis-item {width: 50%;}
    .formanalysis-graph.type-sub .formanalysis-item {padding-left: 0; margin-left: 0;}
    .formanalysis-graph.type-sub .formanalysis-item:nth-of-type(even) {justify-content: flex-end;}
    .formanalysis-graph.type-sub .formanalysis-item:nth-of-type(-n+2)::after {content: ''; width: 90%; bottom: -25px; height: 1px; position: absolute; background: #d9d9d9;}
    .formanalysis-graph.type-sub .formanalysis-item:nth-of-type(3)::before {display: none;}
    .formanalysis-graph.type-sub .formanalysis-item + .formanalysis-item::before {left: 0;}
    .formanalysis-item.bowlegs .type-col3 {min-width: 28rem;}

    .table-top-tit {font-size: 1.6rem;}
    .info-box-tit::before {background-size: 2rem;}
    .info-box {padding: 3rem; font-size: 1.7rem; border-radius: 2rem; border: 1px solid #E4E4E4;}
    .skeletal-info-list {padding-top: 2rem; margin: 2rem 0 0 2rem;}
    .skeletal-info-item + .skeletal-info-item {padding-top: 1rem;}
    .skeletal-info-item em {min-width: 10rem;}
}

@media screen and (min-width: 1200px) {
    .graph-labels.type-sub > li + li {padding-top: 0;}
    .formanalysis-graph.type-sub {gap: 10rem 0;}
    .formanalysis-graph.type-sub .formanalysis-item:nth-of-type(-n+2)::after {bottom: -45px;}
    .formanalysis-graph .bowlegs.right .level.lv2 em::before {font-size: 2.2rem; bottom: -3.5rem;}
    .formanalysis-graph.type-sub .formanalysis-img {width: 25%; min-width: 14rem;}
}
/* 체형진단 e */

/* ai 행동분석 s*/
.aianalysis-chart-list > li {border-radius: 1.2rem; border: 1px solid #ECEDF0; background: #FFF; box-shadow: 0 4px 25px 0 rgba(5, 6, 24, 0.05); padding-bottom: 3rem; box-sizing: border-box;}
.aianalysis-chart-list > li + li {margin-top: 4rem;}
@media screen and (min-width: 1024px) {
    .aianalysis-chart-list .aianalysis-chart-box {padding: 0 4rem;}
    .aianalysis-chart-list {display: flex; flex-wrap: wrap; gap: 3rem;}
    .aianalysis-chart-list > li {width: calc(50% - 1.7rem); border-radius: 2rem; padding: 4rem;}
    .aianalysis-chart-list > li.w-full {width: 100%;}
    .aianalysis-chart-list > li + li {margin-top: 0;}
}
@media screen and (min-width: 1200px) {
    .aianalysis-chart-list .chart-label-tit {padding: 4rem 0 0;}
}
/* ai 행동분석 e*/

/* 예방접종도우미 s */
.vaccination-link-item {position: relative; display: block; padding: 3rem 2rem; background: #ECF0FF; border-radius: 1.2rem; margin-top: 1rem; line-height: 1; color: var(--black); transition: .3s;}
.vaccination-link-item::before {content: ''; width: 5.7rem; height: 5.4rem; position: absolute; right: 2rem; bottom: 0; background: url("/_user/support/img/sub/ico-vaccin-link01.png") no-repeat center / cover;}
.vaccination-link-list>li:nth-of-type(2) .vaccination-link-item::before {width: 5.4rem; height: 5.4rem; bottom: 1.5rem; background: url("/_user/support/img/sub/ico-vaccin-link02.png") no-repeat center / cover;)}
.vaccination-link-item p {font-size: 2rem; font-weight: 600;}
.vaccination-link-item .link-arrow {position: relative; display: flex; align-items: center; color: var(--point-color); font-size: 1.5rem; padding-top: 2rem; font-weight: 600;}
.vaccination-link-item .link-arrow::after {content: ''; display: inline-block; margin-left: 0.5rem; width: 2rem; height: 2rem; background: url("/_user/support/img/sub/ico-vaccin-arrow.svg") no-repeat center / cover;}
.table.type-toggle td {word-break: keep-all;}
.bullet-list {font-size: 1.5rem; word-break: keep-all;}
.bullet-list > li {display: flex; position: relative; align-items: baseline; gap: 1rem;}
.bullet-list > li::before {content: ''; position: relative; top: -0.3rem; display: inline-block; margin-right: 0.8rem; min-width: 0.4rem; height: 0.4rem; border-radius: 1rem; background: var(--black);}
.bullet-list > li em {min-width: 12rem; font-weight: 600;}
.bullet-list > li + li {margin-top: 1rem;}
.toggle-box { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 1.4rem; word-break: keep-all;}
.toggle-text {font-weight: 500; color:  #FBD95E;}
.toggle-box.on .toggle-text {color: var(--point-color);}
.toggle { position: relative; min-width: 40px; height: 20px; display: inline-block; }
.toggle input { display: none; }
.slider {position: absolute; cursor: pointer; background: #FBD95E; border-radius: 20px; top: 0; left: 0; right: 0; bottom: 0; transition: .3s; }
.slider::before { content: ""; position: absolute; width: 16px; height: 16px; background: #fff; border-radius: 50%; top: 2px; left: 2px; transition: .3s; }
input:checked + .slider { background: var(--point-color);}
input:checked + .slider::before { transform: translateX(20px);}
.vaccination .table td {padding: 5px 4px;}

@media screen and (min-width: 768px) {
    .vaccination-link-list {display: flex; gap: 2rem;}
    .vaccination-link-list > li {width: 50%;}
    .vaccination-link-item::before {width: 8rem; height: 8rem;}
    .vaccination-link-list>li:nth-of-type(2) .vaccination-link-item::before {width: 7rem; height: 7rem;}
    .vaccination-link-item:hover {opacity: 0.8;}
    .vaccination-link-item p {font-size: 2.2rem;}
    .vaccination-link-item .link-arrow {font-size: 1.6rem;}
    .bullet-list {font-size: 1.6rem;}
    .bullet-list > li em {min-width: 15rem;}
}
@media screen and (min-width: 1024px) {
    .vaccination-link-item {padding: 4rem; border-radius: 2rem; margin-top: 0;}
    .vaccination-link-item::before {width: 11rem; height: 10.4rem; right: 4rem;}
    .vaccination-link-list {margin-top: 2rem;}
    .vaccination-link-list>li:nth-of-type(2) .vaccination-link-item::before {width: 8.5rem; height: 8.5rem; right: 7rem; bottom: 2rem;}
    .vaccination-link-item p {font-size: 2.6rem;}
    .vaccination-link-item .link-arrow {font-size: 1.7rem;}
    .aianalysis-chart-list .chart-label-tit {padding: 4rem 0 0;}
    .toggle-box {font-size: 1.6rem;}
    .bullet-list {font-size: 1.7rem;}
    .bullet-list > li::before {top: -0.4rem;}
    .bullet-list > li em {min-width: 17rem;}
    .bullet-list > li + li {margin-top: 2.5rem;}
    .vaccination .table td {padding: 17px 12px;}
}
/* 예방접종도우미 e */

/* 강사의견 게시판 list 모바일(카드형) s */
.board-list-wrap {background: #fff; padding: 0 1rem;}
.board-top {display: flex; align-items: center; flex-direction: column; margin-bottom: 2rem; position: relative;}
.board-top>p {color: var(--black); padding-top: 2rem; font-size: 14px; font-weight: 600; font-size: 1.8rem; width: 100%; text-align: left;}
.board-top .total {color: var(--point-color);}
.search-box-wrap {width: 100%;}
.search-box {width: 100%; display: flex; flex-direction: column; gap: 1rem; box-sizing: border-box;}
.btn-search {display: flex; align-items: center; justify-content: center; width: 100%; height: 5.5rem; border-radius: 0.8rem; border: 1px solid var(--point-color); background: rgba(81, 165, 0, 0.07); margin-top: 1rem; color: var(--point-color); font-size: 1.8rem; background: var(--point-color2);}
.ico-search {display: inline-block; width: 2.4rem; height: 2.4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-search.svg") no-repeat center / 2.5rem;}
.search-box > p {display: none;}

.table.type-mcard thead {display:none;}
.table.type-mcard tbody tr {display:block; margin-bottom: 1.5rem; border-top: 1px solid #111;}
.table.type-mcard tbody td {position: relative; display:flex;justify-content:space-between; font-size:15px; color: #293A46; border:none; padding: 1rem 1.5rem 1rem 12.5rem; border-bottom: 1px solid #D9D9D9;}
.table.type-mcard tbody td::before {content: attr(data-label); position: absolute; display: flex; align-items: center; top: 0; left: 0; min-width: 11rem; box-sizing: border-box; height: 100%; background: #F8F8F8; text-align: left; padding: 1.5rem; font-weight:600; color:#293A46;}
.table.type-mcard tbody td.tit a {color: var(--gray); font-size: 14px; font-weight: 400; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-align: left;}
.table.type-mcard colgroup {display: none;}
@media (min-width:1024px){
    .board-list-wrap {padding: 0;}
    .board-top {align-items: flex-start;}
    .board-top>p {width: auto; padding-bottom: 0; font-size: 16px; margin-top: 2rem;}
    .search-box {width: 100%; justify-content: center; flex-wrap: wrap; flex-direction: row;}
    .search-box.w-full {max-width: 120rem; margin: 0 auto;}
    .search-box-wrap > form {width: 100%;}
    .search-box .input-box {display: flex;}
    .search-box.w-full .input-box {display: flex; flex: 1;}
    .search-box .input-box input[type="text"] {width: auto; flex: 1;}
    .search-box .sel {width: 14rem;}
    .btn-search {width: 9rem; margin: 0 0 0 0.8rem;}
    .table.type-mcard {border-collapse: separate; border-spacing: 0;}
    .table.type-mcard colgroup {display: table-column-group;}
    .table.type-mcard thead{display:table-header-group;}
    .table.type-mcard thead th {border-right: none; overflow: hidden; border-top: 1px solid #ddd;}
    .table.type-mcard thead th:first-of-type {border-radius: 0.8rem 0 0 0.8rem; border-left: 1px solid #ddd;}
    .table.type-mcard thead th:last-of-type {border-radius: 0 0.8rem 0.8rem 0; border-right: 1px solid #ddd;}
    .table.type-mcard tbody tr{display:table-row;padding:0;border:none;margin:0;background:none;border-radius:0;}
    .table.type-mcard tbody td{display:table-cell;justify-content:initial;padding:10px;font-size:initial; border-bottom:1px solid #ddd;}
    .table.type-mcard tbody td::before{content:none !important;}
    .table.type-mcard tbody td.tit a {-webkit-line-clamp: 1; font-size: 1.8rem;}
    .table.type-mcard tbody td.tit a:hover {text-decoration: underline; text-underline-position: under;}
}

@media all and (min-width: 1200px) {
    .board-top>p {font-size: 2rem;}
    .search-box-wrap {padding: 3rem; border-radius: 1rem; background: #F8F8F8;}
    .search-box .input-box input[type="text"] {width: 50rem; font-size: 1.8rem;}
    .search-box .input-box input[type="text"]::placeholder {font-size: 1.8rem;}
    .search-box .sel {font-size: 1.8rem;}
    .table.type-mcard thead th {padding: 2rem 1.5rem;}
    .table.type-mcard tbody td {font-size: 1.8rem; padding: 1.8rem;}
}

@media all and (min-width: 1200px) {
    .search-box > p {display: block; word-break: keep-all; font-size: 1.7rem; font-weight: 600;}
    .search-box > p:nth-of-type(2) {padding-left: 2.4rem;}
    .search-box {flex-wrap: nowrap; align-items: center;}
}
/* 강사의견 게시판 list 모바일(카드형) e */

/* 강사의견 게시판 view s */
.board-view-top {}
.board-view-top .board-tit {display: flex; align-items: center; justify-content: center; gap: 1rem; color: var(--black); font-size: 2.2rem; font-weight: 700; text-align: center; padding-bottom: 3rem;}
.board-view-top .label-notice {margin: 0;}
.board-view-box {border: 1px solid #D9D9D9; padding: 4rem 1rem 3rem; border-radius: 2rem; font-size: 1.5rem;}
.view-cont {padding: 4rem 1rem; border-top: 1px solid var(--egray); box-sizing: border-box;}
.view-info {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; padding-bottom: 3.5rem;}
.view-info > li {position: relative; display: flex; align-items: center; gap: 0.6rem;}
.view-info > li + li::before {content: ''; width: 1px; height: 1rem; background: #555; display: inline-block; margin: 0 1rem;}
.veiw-file-item {padding: 1.6rem; border-radius: 0.8rem; border: 1px solid var(--egray); background: #F8F8F8; color: var(--black);}
.veiw-file-item + .veiw-file-item {margin-top: 1.5rem;}
.veiw-file-item p {display: flex;}
.veiw-file-item em {display: inline-block; min-width: 7rem; font-weight: 500;}
.veiw-file-item .file-tit {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; text-align: left;}
.btn-bownload {height: 3.5rem; display: flex; align-items: center; justify-content: center; background: var(--point-color); color: #fff; margin-top: 1rem; border-radius: 0.6rem;}
.ico-down {display: inline-block; width: 1.6rem; height: 1.6rem; margin-left: 1rem; background: url("/_user/support/img/sub/ico-down.svg") no-repeat center / 2rem;}
.view-label {max-width: fit-content; display: flex; align-items: center; justify-content: center; padding: 0.5rem 2rem; border-radius: 5rem; color: #51A500; background: rgba(139, 195, 75, 0.1); margin: 0 auto 1rem; font-weight: 600;}
@media all and (min-width: 768px) {
    .view-cont {min-height: 20rem;}
    .veiw-file-item {display: flex; gap: 1.5rem; align-items: center;}
    .btn-bownload {min-width: 11rem; margin: 0; transition: .3s;}
    .btn-bownload:hover {opacity: 0.8;}
}
@media all and (min-width: 1024px) {
    .board-view-top .board-tit {font-size: 3rem;}
    .view-info {font-size: 1.7rem;}
    .view-cont {min-height: 30rem; font-size: 1.8rem;}
    .board-view-box {padding: 8rem 4rem 4rem; font-size: 1.7rem;}
    .veiw-file-item {gap: 2rem;}
    .veiw-file-item p {gap: 1.5rem;}
    .btn-bownload {min-width: 13rem; height: 4rem;}
    .ico-down {width: 1.8rem; height: 1.8rem;}
}

/* 강사의견 게시판 view e */

/* 성장발달레포트 s */
.xbody-guide-wrap {color: var(--black);}
.guide-title {font-size: 1.6rem; border-radius: 1.2rem 1.2rem 0 0; background: linear-gradient(90deg, #B7D1EA 0%, rgba(183, 209, 234, 0.20) 100%); line-height: 1; padding: 1.2rem 3rem; font-weight: 500;}
.xbody-guide-list {padding: 1rem 1.5rem 3rem; background: #F3F9FE; border-radius: 0 0 1.2rem 1.2rem;}
.xbody-guide-item + .xbody-guide-item {margin-top: 2rem;}
.xbody-guide-item .tit {font-size: 1.8rem; font-weight: 700; text-align: center; padding: 1rem 0 2rem;}
.xbody-guide-thumb {position: relative; display:flex; align-items:center; justify-content:center; border-radius:1.2rem 1.2rem 0 0; background:linear-gradient(180deg,#E6F2FE 0%,rgba(230,242,254,0) 100%); padding: 2rem 0 0;}
.xbody-guide-thumb::before {content:""; position:absolute; inset:0; border-radius:1.2rem 1.2rem 0 0; padding:0.1rem; background:linear-gradient(180deg,#B7D1EA 0%,rgba(255,255,255,0) 100%); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;}
.guide-info-list{counter-reset:num; padding-top: 3rem;}
.guide-info-list li{position:relative;padding-left:1.5rem;counter-increment:num}
.guide-info-list li::before{content:counter(num)'.';position:absolute;left:0;top:0}
@media all and (min-width: 1024px) {
    .guide-title {font-size: 2.2rem; padding: 1.5rem 4rem; border-radius: 2rem 2rem 0 0;}
    .xbody-guide-list {display: flex; flex-wrap: wrap; gap: 5rem 2rem; padding: 2rem 2rem 5rem;}
    .xbody-guide-item {width: calc(50% - 1rem);}
    .xbody-guide-item + .xbody-guide-item {margin-top: 0;}
    .xbody-guide-item .tit {font-size: 2.2rem;}
    .guide-info-list {font-size: 1.6rem;}
}
@media all and (min-width: 1200px) {
    .xbody-guide-list {padding: 3rem 3rem 6rem; gap: 3rem;}
    .xbody-guide-item {width: calc(25% - 2.3rem);}
}
/* 성장발달레포트 e */

/* 영유아 발달 선별 검사 s*/
.growth .sub-title {justify-content: center; text-align: center;}
.growth-banner {position: relative; padding: 6rem 3rem 14rem; border-radius: 2rem; background: url("/_user/support/img/sub/bg-growth-banner-m.png") no-repeat center / cover; color: var(--black); font-size: 1.6rem; word-break: keep-all;}
.growth-banner::after {content: ''; position: absolute; right: 0; bottom: 2.5rem; width: 14.2rem; height: 11.6rem; background: url("/_user/support/img/sub/deco-growth-banner.png") no-repeat center / contain; transform: scale(0.6); transform-origin: right bottom; animation: appearBounce 3s ease forwards, bounce 2.5s infinite 1s;}
@keyframes appearBounce {
    0% { opacity: 0; transform: scale(1.15) translateY(20px); }
    100% { opacity: 1; transform: scale(1.15) translateY(0); }
}
@keyframes bounce {
    0%, 100% { transform: scale(1.15) translateY(0); }
    25% { transform: scale(1.16) translateY(-3%); }
    50% { transform: scale(1.15) translateY(0); }
    75% { transform: scale(1.155) translateY(-1.5%); }
}
.growth-banner .tit {font-size: 2.5rem; padding-bottom: 3rem; font-weight: 700;}
.growth-card-item {border: 1px solid #ECEDF0; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background: var(--white); border-radius: 2rem; padding: 3rem; text-align: center; color: var(--black); font-size: 1.5rem; word-break: keep-all;}
.growth-card-item + .growth-card-item {margin-top: 2rem;}
.growth-card-item .tit {display: block; font-size: 2rem; font-weight: 700; padding-bottom: 2rem;}
.growth-card-item > i {display: block; width: 5rem; height: 5rem; margin: 0 auto 2rem;}
.ico-growth-01 {background: url("/_user/support/img/sub/ico-growth-01.svg") no-repeat center / contain;}
.ico-growth-02 {background: url("/_user/support/img/sub/ico-growth-02.svg") no-repeat center / contain;}
.ico-growth-03 {background: url("/_user/support/img/sub/ico-growth-03.svg") no-repeat center / contain;}
.label-tit {width: fit-content; padding: 0.9rem 2rem; border-radius: 5rem; display: flex; justify-content: center; align-items: center; background: rgba(139, 195, 75, 0.10); color: var(--point-color); margin: 0 auto 2rem; font-weight: 700;}
.growth-txt {text-align: center; font-size: 1.6rem; color: var(--black);}
.check-list {max-width: 90rem; padding: 2rem; box-sizing: border-box; margin: 2rem auto 0; border-radius: 1.2rem; background: #F8F8F8; font-weight: 600; color: var(--black); font-size: 1.5rem;}
.check-list > li {display: flex; align-items: center; gap: 1.2rem;}
.check-list > li::before {content: ''; display: inline-block; min-width: 2.7rem; height: 2.7rem; background: url("/_user/support/img/sub/ico-check-list.svg") no-repeat center / cover;}
.check-list > li + li {margin-top: 1rem;}
.growth-step-list {margin-top: 1rem;}
.growth-step-item {max-width: 90rem; margin: 0 auto; box-sizing: border-box; position: relative; background: #F0F7F7; border-radius: 1.2rem; padding: 2rem 1rem; box-sizing: border-box; color: var(--black);}
.growth-step-item + .growth-step-item {margin-top: 4.2rem;}
.growth-step-item + .growth-step-item::before {content: ''; display: block; position: absolute; top: -3rem; left: 50%; transform: translateX(-50%); width: 4.5rem; height: 2.3rem; background: url("/_user/support/img/sub/ico-step-arrow.svg") no-repeat center / cover;}
.growth-step-item > em {display: flex; width: fit-content; gap: 1rem; height: 5rem; padding: 0.7rem 1.5rem; box-sizing: border-box; align-items: center; justify-content: center; border-radius: 5rem; background: #48C7BC; color: var(--white); font-size: 2rem; margin: 0 auto 2rem; font-weight: 600;}
.step-num {display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; border-radius: 9rem; background: var(--white); color: #48C7BC; font-weight: 700;}
.step-bullet {position: relative; display: flex; align-items: baseline; font-size: 1.6rem;}
.step-bullet::before {content: ''; display: inline-block; margin-right: 1rem; min-width: 0.5rem; height: 0.5rem; border-radius: 1rem; background: var(--black); position: relative; top: -0.3rem;}
.step-bullet .color {color: #48C7BC; font-weight: 500;}
.notice {max-width: fit-content; display: flex; align-items: center; font-size: 1.4rem; padding: 0.5rem 1.6rem; border: 1px solid #FFEAC1; background: #FFF8E9; border-radius: 10rem; margin: 2rem auto 0;}
.notice > em {display: inline-block; margin-right: 1.3rem; width: fit-content; word-break: keep-all; color: #98690A;}
.ico-notice {min-width: 2.4rem; height: 2.4rem; margin-right: 0.3rem; background: url("/_user/support/img/sub/ico-notice.svg") no-repeat center / cover;}

.growth-guide-wrap {border-radius: 1.2rem; padding: 2rem; background: #F8F8F8;}
.growth-guide-box {background: #fff; border-radius: 1.2rem; padding: 2rem; margin-top: 2rem;}
.guide-desc {font-size: 1.5rem; padding-top: 1rem;}
.open-modal-guide {position: relative; width: 100%; display: flex; align-items: center; justify-content: center; height: 3.7rem; border-radius: 0.8rem; border: 1px solid #8BC34B; background:  #F1FFE0 url(/_user/support/img/sub/ico-label-question.svg) no-repeat center right 0.5rem / 3rem; color: #8BC34B; font-weight: 500; transition: .3s;}
.guide-form-row > label, .guide-form-row > span {display: block; font-size: 1.6rem; color: var(--black); font-weight: 700; padding-bottom: 1rem;}
.guide-form-row.writer {display: flex; align-items: center; padding-top: 2rem; gap: 1rem;}
.guide-form-row.writer > span {padding-bottom: 0;}
.btn-submit {display: flex; align-items: center; justify-content: center; width: 100%; height: 4.5rem; background: var(--point-color); border-radius: 0.8rem; margin-top: 3rem; color: var(--white);}

@media screen and (min-width: 768px) {
    .growth-banner::after {width: 18rem; height: 15rem;}
    .growth-txt {margin: 0 auto; max-width: 61rem;}
    .check-list {margin: 3rem auto 0;}
    .check-list > li {justify-content: center;}
    .step-bullet {justify-content: center;}
    .open-modal-guide:hover {opacity: 0.8;}
    .btn-submit:hover {opacity: 0.8;}
}

@media screen and (min-width: 1024px) {
    .growth-banner {padding: 3.5rem 3rem 4rem; margin-top: 5rem;}
    .growth-banner::after {width: 22.2rem; height: 19.6rem; transform: scale(1.15); right: 20%; background: url("/_user/support/img/sub/deco-growth-banner.png") no-repeat center / contain; }
    .growth-banner .tit {font-size: 4rem; max-width: 90rem; margin: 0 auto;}
    .growth-banner .txt {font-size: 1.9rem; max-width: 90rem; margin: 0 auto;}
    .growth-card-list {display: flex; gap: 3rem; padding-top: 3rem;}
    .growth-card-item {width: 33.33%; padding: 6rem 3rem; font-size: 1.7rem;}
    .growth-card-item + .growth-card-item {margin-top: 0;}
    .growth-card-item .tit {font-size: 2.2rem;}
    .growth-card-item > i {width: 7rem; height: 7rem;}
    .growth-txt {font-size: 2rem; max-width: 78rem;}
    .check-list {padding: 3rem 4rem; font-size: 2.2rem; margin: 4rem auto 0;}
    .growth-step-item {padding: 3rem 6rem; border-radius: 2rem;}
    .growth-step-item + .growth-step-item {margin-top: 8rem;}
    .growth-step-item + .growth-step-item::before {width: 5.7rem; height: 2.9rem; top: -5rem;}
    .growth-step-item > em {font-size: 2.2rem; padding: 0.7rem 1.5rem 0.7rem 0.5rem;}
    .step-bullet {font-size: 1.9rem;}
    .notice {font-size: 1.7rem;}
    .notice > em {font-size: 1.9rem; margin-right: 4rem;}
    .growth-guide-wrap {border-radius: 2rem; padding: 4rem 6rem;}
    .growth-guide-top {display: flex; align-items: center; gap: 1.6rem;}
    .open-modal-guide {width: 18rem; height: 4.8rem; font-size: 1.7rem; padding-right: 1rem;}
    .guide-desc {padding-top: 0; font-size: 1.7rem;}
    .growth-guide-box {border-radius: 2rem; padding: 2.4rem 3.2rem;}
    .growth-guide-box fieldset {display: flex; align-items: center; justify-content: space-between;}
    .guide-form-wrap {display: flex; align-items: center; gap: 5rem;}
    .guide-form-row.writer {padding-top: 0;}
    .guide-form-row {display: flex; align-items: center; gap: 1rem;}
    .guide-form-row > label, .guide-form-row > span {min-width: fit-content; font-size: 1.7rem; padding-bottom: 0;}
    .guide-form-row .sel {min-width: 30rem;}
    .btn-submit {margin: 0; width: 16rem;}

}

/* 궁금증 해결 (FAQ) */
.faq-box-wrap {max-width: 90rem; margin: 0 auto;}
.faq-box {font-size: 1.6rem;}
.question {position: relative; width: 100%; min-height: 5.7rem; display: flex; padding: 1rem 1.5rem; box-sizing: border-box; cursor: pointer; color: var(--black); border-radius: 1.2rem; margin-bottom: 0.5rem; justify-content: space-between; align-items: center; background: #F0F7F7; line-height: 1.5;}
.question .question-info {display: flex; align-items: center;}
.question .question-info > .num {min-width: 30px; margin-top: 3px; text-align: center; color: #777;}
.question .question-info > .category {min-width: 85px; border: 1px solid #DEDEDE; border-radius: 20px; color: #777; padding: 2px 0 0; margin-left: 10px; font-size: 12px; text-align: center;}
.question .mark {display: block; position: relative; min-width: 2.5rem; height: 2.5rem;  margin-right: 2rem; background: var(--point-color); border-radius: 50%; font-weight: 600; font-size: 2.2rem;}
.question .mark:before {content: 'Q'; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center;}
.question .q-tit {display: flex; align-items: center; word-break: keep-all; text-align: left; color: var(--black); font-weight: 600;}
.arrow-wrap {display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 100%; flex-shrink: 0;}
.arrow-wrap::before {content: ''; width: 1.6rem; height: 1.6rem; display: inline-block; background: url("/_user/support/img/sub/ico-faq-arrow.svg") no-repeat center / cover; transform: rotate(180deg); transition: .3s;}
.question.on .arrow-wrap::before {transform: rotate(0);}
.answer {display: flex; align-items: flex-start; overflow: hidden; padding: 1rem 1.5rem; box-sizing: border-box; background: var(--white); border: 1px solid var(--point-color); color: #111; border-radius: 1.2rem; margin-bottom: 1.6rem;}
.answer .answer-view {display: flex; flex-direction: column; gap: 1rem;}
.answer .answer-view > span {display: block; position: relative; width: 25px; height: 25px;  margin-right: 10px; background: #555; border-radius: 50%; font-weight: 400; flex-shrink: 0;}
.answer .answer-view > span:before {content: 'A'; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; font-weight: 700;}
.answer .answer-view div * {background: none !important;}
.answer .answer-view div li {color: #111 !important;}
.answer .answer-view div li ul {padding-left: 15px;}
.accordion-content {display: none;}
.question {margin-bottom: 1.6rem;}
.question .on {margin-bottom: 0.5rem;}
.question .on + .accordion-content {display: flex !important;}

@media screen and (min-width: 1024px) {
    .question, .answer {flex-direction: row; align-items: center; padding: 25px 20px;}
    .question {padding: 0 4rem; height: 11rem; border-radius: 2rem;}
    .question .question-info {flex-shrink: 0;}
    .question .question-info > .num {font-size: 16px;}
    .question .q-tit {width: 100%; padding: 0; font-size: 20px;}
    .question .mark {width: 32px; height: 32px; margin-right: 20px;}
    .arrow-wrap {width: 24px; height: 24px;}
    .answer {padding: 4rem; border-radius: 2rem;}
    .answer .answer-view {flex-direction: row; font-size: 18px; gap: 0;}
    .answer .answer-view > span {width: 32px; height: 32px; margin-right: 20px;}

}
@media screen and (min-width: 1200px) {
    .category-wrap li a {font-size: 14px;}
}
@media screen and (min-width: 1300px) {
    .category-wrap li a {font-size: 16px;}
}
/* 영유아 발달 선별 검사 e*/

/* checkbox s */
.check-box input[type="checkbox"] {width: 0; height: 0; border: 0; overflow: hidden; padding: 0; clip: rect(0, 0, 0, 0); opacity: 0; position: absolute;}
.check-box input[type="checkbox"]:focus + label {outline: 1px solid #000;}
.check-box input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; padding-left: 23px; color: var(--gray); border: none; width: auto; text-align: left; word-break: keep-all;}
.check-box input[type="checkbox"] + label:after {content: ''; position: absolute; left: 0; top: 0; width: 18px; height: 18px; box-sizing: border-box; border-radius: 3px; border: 1px solid var(--dgray); border-width: 1px;}
.check-box input[type="checkbox"]:checked + label::before { content: ''; position: absolute; left: 4px; top: 4px; width: 8px; height: 4px; border: 2px solid var(--white); border-top: 0; border-right: 0; z-index: 1; transform: rotate(-45deg);}
.check-box input[type="checkbox"]:checked + label::after {border-color: var(--point-color); background-color: var(--point-color);}
.check-box input[type="checkbox"] + label:hover::after {border: 1.5px solid var(--point-color);}
.check-form.choice ul {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px;}
.check-form.choice.col02 ul li {width: calc(50% - 5px);}
.check-form.choice.col03 ul li {width: calc(33.3% - 7px);}
.check-form.choice ul li:last-child {margin-bottom: 0;}
.check-box.choice input[type="checkbox"] + label {display: inline-block; cursor: pointer; position: relative; width: 100%; padding: 10px 0; border: 1px dashed var(--dgray); border-radius: 7px; background-color: var(--white); text-align: center; font-size: 13px; box-sizing: border-box; transition: all 0.2s;}
.check-box.choice input[type="checkbox"]:checked + label {color: var(--point-color); border: 1px solid var(--point-color);}
.check-box.choice input[type="checkbox"] + label:hover {border: 1px solid var(--point-color); color: var(--point-color);}
.check-box.choice input[type="checkbox"] + label:after {display: none;}
.check-form.type {display: flex; flex-wrap: wrap; gap: 10px;}
@media screen and (min-width: 1200px) {
    .check-box input[type="checkbox"] + label:after {width: 20px; height: 20px;}
    .check-box input[type="checkbox"] + label {font-size: 15px; padding-left: 30px;}
    .accordion-wrap .check-box.choice input[type="checkbox"] + label {font-size: 20px; padding: 9px 0;}
    .check-box.choice input[type="checkbox"] + label {font-size: 15px; padding: 15px 0;}
    .check-box input[type="checkbox"]:checked + label::before {top: 5px; left: 5px;}
    .check-form.choice ul {gap: 20px 25px; justify-content: flex-start;}
    .check-form.choice.col02 ul li {width: calc(25% - 19px);}
    .check-form.choice.col03 ul li {width: calc(20% - 20px);}
}
/* checkbox e*/

/* radio s */
input[type="radio"] {width: 1px; height: 1px; margin: -1px; border: 0; overflow: hidden; padding: 0; clip: rect(0, 0, 0, 0); opacity: 0; position: absolute;}
.radio-box input[type="radio"] + label {display: inline-block; position: relative; cursor: pointer; padding-left: 22px; color: var(--gray); font-size: 16px; font-weight: 400;}
.radio-box input[type="radio"]:focus-visible + label {outline: 1px solid #000; border-radius: 3px;}
.radio-box input[type="radio"] + label:before {content: ''; position: absolute; left: 4px; top: 6px; width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box; background: #fff; }
.radio-box input[type="radio"] + label:after {content: ''; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; border: 1px solid var(--dgray); border-width: 1px;}
.radio-box input[type="radio"]:checked + label::before {background: var(--point-color);}
.radio-box input[type="radio"]:checked + label::after {border-color: var(--point-color);}
.radio-box input[type="radio"] + label:hover::after {border: 2px solid var(--point-color);}
@media screen and (min-width: 1200px) {
    .radio-box input[type="radio"] + label {font-size: 17px;}
}
/* radio e */

/* selectbox s */
.bookrange-box {background-color: #f8f8f8; border-radius: 10px; padding: 15px; box-sizing: border-box;}
.bookrange-box ul {display: flex; justify-content: space-between; gap: 5px;}
.bookrange-box ul li {width: 32%;}
.select-form .search-select {width: 100%; height: 40px; padding: 12px 8px; font-size: 13px; border: 1px solid var(--dgray); border-radius: 4px; box-sizing: border-box; background: var(--white) url("/_user/support/img/sub/icon_arrow.svg") right 8px center/10px no-repeat; font-weight: 400;}
@media screen and (min-width: 1024px) {
    .bookrange-box {padding: 20px 30px;}
    .select-form .search-select {font-size: 15px;}
    .bookrange-box .select-form .search-select {height: 50px;}
}
@media screen and (min-width: 1200px) {
    .bookrange-box ul {justify-content: flex-start; gap: 10px;}
    .bookrange-box ul li {width: 130px;}
}
/* selectbox e */

/* input s */
input {background: #fff; border-radius: 8px; box-sizing: border-box;}
input[type="text"] {width: 100%; height: 55px; padding: 0.8rem 1.2rem; border: 1px solid var(--dgray);}
input::placeholder {color: #555; font-size: 1.8rem;}
.input-box input:invalid {border: 1px solid #e00 !important;}
.input-box .error-msg {display: none; color: #e00; font-size: 14px; margin-top: 4px;}
.input-box input:invalid ~ .error-msg {display: flex; align-items: center; gap: 0.5rem;}
.input-box.nomal input[type="text"], .input-box.nomal input[type="number"] {width: 100%; padding: 12px 10px; font-size: 13px; border: 1px solid #e5e5e5;}
.input-box.nomal label {display: block; width: 100%; padding-bottom: 5px; color: var(--black); font-weight: 400;}
.input-box.nomal.col02 {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.input-box.nomal.col02 input[type="text"], .input-box.nomal.col02 input[type="number"] {width: 50%;}
.input-box input:read-only, .input-box input:disabled {background-color: #F8F8F8;}
.input-box input:read-only:focus, .input-box input:disabled:focus, .input-box input:read-only:hover, .input-box input:disabled:hover {border: 1px solid var(--dgray);}
.input-box .inner-box {display: inline-block;}
.ico-error { width: 1.6rem; height: 1.6rem; background: url("/_user/support/img/sub/ico-error.svg") no-repeat center / cover;}
@media screen and (min-width: 768px) {
    .input-box .inner-box {gap: 20px;}
}
@media screen and (min-width: 1024px) {
    input::placeholder {font-size: 15px;}
}
@media screen and (min-width: 1200px) {
    .input-box input[type="text"], .input-box input[type="number"], .input-box input::placeholder, textarea::placeholder {font-size: 15px; width: 100%;}
    .input-box input.search-input::placeholder {font-size: 18px !important;}
    .input-box.nomal label {font-size: 15px;}
}
/* input e */

/* 아이콘 s */
.icon {position: relative; display: inline-block; width: 16px; height: 16px; text-indent: -9999px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.icon.home {background-image: url("/_user/support/img/sub/ico-home.svg"); position: relative; top: -1px; background-size: 2.5rem;}
.icon.detail {background-image: url("/_user/support/img/sub/icon_detail.svg"); margin-right: 4px;}
.icon.tooltip {background-image: url("/_user/support/img/sub/icon_tooltip.svg"); margin-left: 4px; width: 15px; height: 15px; background-size: 100%; top: 2px;}
.icon.shortcut {background-image: url("/_user/support/img/sub/icon_shortcut_arrow.svg"); width: 6px; height: 9px; margin-left: 10px; top: 5px;}
.icon.put {background-image: url("/_user/support/img/sub/icon_put.svg"); width: 18px; height: 18px; margin-right: 3px; top: -1px;}
.icon.phone {background-image: url("/_user/support/img/sub/icon_phone.svg"); width: 20px; height: 20px; margin-right: 5px;}
.btn .icon {display: inline-block; width: 16px; height: 16px; margin-right: 10px;}
.btn .icon.plus {background: url("/_user/support/img/sub/icon_plus.svg") center no-repeat;}
.btn .icon.edit {background: url("/_user/support/img/sub/icon_edit.svg") center no-repeat;}
.btn .icon.del {background: url("/_user/support/img/sub/icon_btndel.svg") center no-repeat;}
.btn .icon.shortcut {top: 0; width: 6px; height: 9px;}
.btn-site {display: inline-block; width: 25px; height: 25px; text-indent: -9999px; background: #fff url("/_user/support/img/sub/icon_home.svg") 50% no-repeat; border: 1px solid var(--dgray); border-radius: 45px;}
.ico-home {display: inline-block; width: 16px; height: 16px; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-home.svg") no-repeat center / 2.4rem; position: relative;}

@media screen and (min-width: 1200px) {
    .icon {width: 24px; height: 24px; background-size: contain;}
    .icon.home {width: 20px; height: 20px; top: 0;}
    .icon.tooltip {top: 0; width: 18px; height: 18px;}
    .icon.put {width: 18px; height: 18px; top: 0;}
    .icon.shortcut {width: 7px; height: 12px; margin-left: 12px;}
    .icon.phone {margin-right: 10px; top: 2px;}
    .btn .icon {margin-right: 15px;}
    .btn .icon.shortcut {width: 7px; height: 12px;}
    .btn-site {width: 30px; height: 30px;}
}
/* 아이콘 e */

/* 테이블 s */
.table-wrap {border-top: 1px solid var(--black); margin-bottom: 15px; padding-bottom: 5px;}
.table-wrap:last-of-type {margin-bottom: 0;}
.table {width: 100%;}
.table-wrap.scroll-y tbody>tr + tr {border-top: 1px solid var(--black);}
.table thead th {color: var(--black); text-align: center; font-weight: 400;}
.table thead th.tc {text-align: center;}
.table td, .table th {padding: 17px 12px; letter-spacing: -1px; border-bottom: 1px solid var(--egray); border-right: 1px solid var(--egray); color: var(--gray); word-break: break-all; vertical-align: middle;}
.table th {background: #F7F8FB; color: var(--black); font-weight: 400;}
.table td {font-size: 14px;}
.table thead th:last-child, .table td:last-child, .table th:last-child {border-right: none;}
.table td > img {max-width: 100%;}
.table .bt {border-top: 1px solid var(--egray) !important;}
.table .bb {border-bottom: 1px solid var(--egray) !important;}
.table .bl {border-left: 1px solid var(--egray) !important;}
.table .br {border-right: 1px solid var(--egray) !important;}
.table.type02 thead, .table.type02 colgroup {display: none;}
.table.type02 tbody {display: block;}
.table.type02 tbody tr {display: block;}
.table.type02 tbody th {width: 150px; box-sizing: border-box; font-weight: 400;}
.table.type02 tbody td {display: block; box-sizing: border-box; position: relative; min-height: 56px; padding-left: 162px;}
.table.type02 tbody td .th {position: absolute; left: 0; top: 0; padding: 17px 12px; box-sizing: border-box; background: #F7F8FB; border-right: 1px solid var(--egray); height: 100%; width: 150px;}
.table.type-sticky thead tr:first-of-type th:first-of-type, .table.type-sticky tbody th {position: sticky; left: 0; z-index: 3;}
@media screen and (min-width: 1200px) {
    .table th {font-size: 18px;}
    .table td {font-size: 17px;}
    .table.type02 thead {display: contents;}
    .table.type02 colgroup {display: table-column-group;}
    .table.type02 tbody {display: table-row-group;}
    .table.type02 tbody tr {display: table-row;}
    .table.type02 tbody td {display: table-cell; padding: 17px 12px;}
    .table.type02 tbody td .th {display: none;}
    .table-wrap.scroll-y tbody>tr + tr {border-top: none;}
}
/* 테이블 e */

/* 검색창 s */
.search-wrap-sub .search-box {display: flex; justify-content: space-between; flex-direction: column; gap: 10px;}
.search-wrap-sub .input-box.search select {display: none;}
.search-wrap-sub .input-box.search {display: flex; justify-content: space-between; align-items: center; position: relative; padding: 12px 70px 12px 15px; border-radius: 32px; border: 2px solid var(--point-color); outline: 2px solid #DEE9FB; outline-offset: 2px; box-sizing: border-box; overflow: hidden;}
.search-wrap-sub .input-box.search input {width: 100%;}
.search-wrap-sub .input-box.search input::placeholder {font-size: 15px;}
.btn-clear {position: absolute; top: 50%; transform: translateY(-50%); right: 53px; border-radius: 50%; width: 18px; height: 18px; background: url("/_user/support/img/sub/icon_del.svg") center no-repeat; background-size: contain; text-indent: -9999px; box-sizing: border-box;}
.search-wrap-sub .btn-search {position: absolute; top: 3px; right: 3px; border-radius: 50%; width: 36px; height: 36px; background: #7DC9FF url("/_user/support/img/sub/icon_search.svg") center no-repeat; background-size: 17px auto; text-indent: -9999px; box-sizing: border-box;}
.btn-detail {min-width: 70px; height: 46px; border-radius: 32px; border: 2px solid var(--point-color); color: var(--point-color);}
.btn-detail:hover {background-color: rgba(50, 116, 217, 0.06);}
.btn-detail.on {color: var(--white); background: var(--point-color);}
.btn-detail.on .icon {background-image: url("/_user/support/img/sub/icon_detail_on.svg"); background-size: contain;}
.search-form .search-box.select-type {flex-wrap: wrap; gap: 6px 10px; padding: 15px; border-radius: 10px; background-color: #f8f8f8;}
.search-form .search-box.select-type > ul {width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 10px;}
.search-form .search-box.select-type > ul li {width: 100%;}
.search-form .search-box.select-type .select-type-search {height: 40px; padding: 0 20px 0 8px; font-size: 14px; border: 1px solid var(--dgray); border-radius: 4px; box-sizing: border-box; background: var(--white) url("/_user/support/img/sub/icon_arrow.svg") right 8px center/10px no-repeat; font-weight: 400;}
.search-form .search-box.select-type select {width: 100%;}
.search-form .search-box.select-type > ul li.col02 {display: flex; justify-content: space-between; gap: 6px;}
.search-form .search-box.select-type .btn-search {width: 100%; height: auto; line-height: 40px; position: static; border-radius: 4px; text-indent: 0; font-size: 13px; color: var(--white); background: #09315D none; background-size: 20px;}
.search-form .search-box.select-type .btn-search .icon {width: 20px; height: 20px; top: 10px; margin-right: 6px; background: url("/_user/support/img/main/ico-search-w.svg") center no-repeat; background-size: 14px;}
@media screen and (min-width: 360px) {
    .search-wrap-sub .search-box {flex-direction: row;}
    .search-wrap-sub .input-box.search {width: calc(100% - 79px);}
    .btn-detail {height: auto;}
}
@media screen and (min-width: 1024px) {
    .search-form .search-box.select-type {flex-wrap: nowrap; padding: 30px;}
    .search-form .search-box.select-type.col02 li {width: 33%;}
    .search-form .search-box.select-type select {width: calc(33.3% - 10px);}
    .search-form .search-box.select-type .btn-search {width: 125px; flex-shrink: 0; font-size: 15px; border-radius: 7px;}
    .search-form .search-box.select-type .select-type-search {font-size: 15px; height: 50px; padding: 15px 25px 15px 15px; background-position: right 12px center; border-radius: 7px;}
    .search-form .search-box.select-type > ul {flex-wrap: nowrap; justify-content: flex-start;}
    .search-form .search-box.select-type > ul li {width: calc(50% - 5px); flex-shrink: 0;}
    .search-form .search-box.select-type .select-type-search {width: 100%;}
    .search-form .search-box.select-type > ul li.col02 {gap: 10px; width: 66%;}
    .search-form .search-box.select-type.inner {flex-wrap: wrap; gap: 30px 10px;}
    .search-form .search-box.select-type.inner.cal {gap: 20px 10px;}
    .search-form .search-box.select-type.inner > ul {width: calc(100% - 135px);}
    .search-form .search-box.select-type.event.inner > ul {width: calc(100% - 135px);}
    .search-form .search-box.select-type.event > ul li {width: calc(60% - 10px);}
    .search-form .search-box.select-type.event > ul li.col02 {width: 40%;}
    .search-form .search-box.select-type .btn-search {width: 125px; flex-shrink: 0; font-size: 15px; border-radius: 7px;}
}
@media screen and (min-width: 1200px) {
    .search-wrap-sub .search-box {gap: 10px;}
    .search-wrap-sub .input-box.search {width: calc(100% - 155px); height: 64px; flex-shrink: 0; padding: 22px 30px;}
    .search-wrap-sub .input-box.search select {flex-shrink: 0; width: 145px; display: inline-block; margin-right: 30px; font-size: 18px; background: var(--white) url("/_user/support/img/sub/icon_select_arrow.svg") right center/14px no-repeat;}
    .search-wrap-sub .input-box.search input {font-size: 18px;}
    .btn-detail {width: 100%; font-size: 18px;}
    .search-wrap-sub .btn-search {width: 55px; height: 55px; background-size: 20px;}
    .btn-clear {right: 73px;}
    .btn-detail.on .icon {background-image: url("/_user/support/img/sub/icon_detail_on.svg"); background-size: contain; margin-right: 10px;}
}
/* 검색창 e */

/* tab s */
.tab-btn-wrap {display: flex; flex-wrap: wrap; box-sizing: border-box;}
.tab-btn-wrap > li {box-sizing: border-box; cursor: pointer; text-align: center;}
.tab-btn-wrap .tab-btn {border: 1px solid #e5e5e5; padding: 15px 0; width: 100%; display: flex; align-items: center; justify-content: center;}
.tab-btn-wrap > li:nth-child(n+2) .tab-btn {border-left: none;}
.tab-box-wrap .tab-box {display: none; word-break: break-all; padding-top: 40px;}
.tab-box-wrap .tab-box.active {display: block;}
.tab-btn-wrap.col02 > li {width: 50%;}
.tab-btn-wrap.col03 > li, .tab-btn-wrap.col04 > li {width:100%;}
.tab-btn-wrap.col03 > li:nth-child(n+2) .tab-btn, .tab-btn-wrap.col04 > li:nth-child(n+2) .tab-btn {border-top: none; border-left: 1px solid #e5e5e5;}
.tab-btn-wrap > li.active .tab-btn {color: var(--point-color); border-color: var(--point-color); border: 1px solid var(--point-color) !important; font-weight: 500; box-shadow: 0 0 0 2px var(--point-color) inset;}
@media screen and (min-width: 550px){
    .tab-btn-wrap.col03 > li  {width:33.33%;}
    .tab-btn-wrap.col03 > li:nth-child(n+2) .tab-btn {border-left: none; border-top: 1px solid #e5e5e5;}
    .tab-btn-wrap.col04 > li {width:50%;}
    .tab-btn-wrap.col04 .tab-btn {border-top: 1px solid #e5e5e5;}
    .tab-btn-wrap.col04 > li:nth-child(n+2) .tab-btn {border-top: 1px solid #e5e5e5;}
    .tab-btn-wrap.col04 > li:nth-child(n+3) .tab-btn {border-top: none;}
    .tab-btn-wrap.col04 > li:nth-child(2n) .tab-btn {border-left: none;}
}
@media screen and (min-width: 1024px){
    .tab-btn-wrap.col04 > li {width: 25%;}
    .tab-btn-wrap.col04 > li:nth-child(n+3) .tab-btn {border-top: 1px solid #e5e5e5;}
    .tab-btn-wrap.col04 > li:nth-child(n+2) .tab-btn {border-left: none;}
}
@media screen and (min-width: 1200px){
    .tab-btn-wrap .tab-btn {padding: 20px 0; font-size: 18px;}
    .tab-box-wrap .tab-box {padding-top: 60px;}
    .tab-btn-wrap > li.active .tab-btn {box-shadow: 0 0 0 3px var(--point-color) inset;}
}
/* tab e *

/* accordion s */
.accordion-btn {display: flex; justify-content: space-between; width: 100%; gap: 1rem;}
.accordion-btn .arrow {display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; border: 1px solid var(--egray); border-radius: 100%; box-sizing: border-box; transition: all 0.3s;}
.accordion-btn .arrow::before {content: ''; width: 4px; height: 4px; border-top: 2px solid var(--black); border-right: 2px solid var(--black); display: inline-block; transform: rotate(315deg);}
.accordion-btn.on .arrow::before {transform: rotate(135deg); position: relative; top: -1px;}
.accordion-btn .bullet-title-s + .arrow {width: 20px; height: 20px;}
.accordion-btn .bullet-title-s + .arrow::before {position: relative; top: 1px;}
.accordion-btn.on .bullet-title-s + .arrow::before {top: -1px;}
/* accordion e */

/* pc lnb s */
.aside {display: none;}
@media screen and (min-width: 1200px){
    .aside {display: block; min-width: 255px; font-size: 15px; margin-right: 30px;}
    .aside>p {color: #fff; font-size: 30px; position: relative; background-color: #7DC9FF; text-shadow: 1px 1px 5px rgba(0,0,0,0.5); border-radius: 20px 20px 100px 20px; overflow-y: hidden; height: 170px; display: flex; align-items: center; justify-content: center;font-weight: 700;}
    .aside>p:after {content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url("/_user/support/img/sub/img_lnblogo.svg") right center no-repeat;}
    .aside .nav>li {border-bottom: 1px solid var(--egray);}
    .aside .nav>li>a {font-size: 20px; text-decoration: none; display: flex; align-items: center; height: 70px; color: #333; background-color: #fff; padding: 6px; box-sizing: border-box; position: relative;}
    .aside .nav>li>a.toggle:before {content: ''; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 10px; height: 6px; background: url("/_user/support/img/sub/icon_lnb_arrow.svg") no-repeat; transition: all 0.3s;}
    .aside .nav>li.active>a {color: var(--point-color); border-bottom: 2px solid #7DC9FF; font-weight: 700;}
    .aside .nav>li.active>a:before {background: url("/_user/support/img/sub/icon_lnb_arrow_on.svg") no-repeat;}
    .aside .nav>li.active {border-bottom: none;}
    .aside .nav ul {display: none; padding: 24px 20px;}
    .aside .nav>li.active ul {border-bottom: 1px solid var(--egray);}
    .aside .nav ul>li {padding-bottom: 10px; position: relative; display: flex; align-items: center;}
    .aside .nav ul>li:last-child {padding: 0;}
    .aside .nav ul>li::before {content: ''; width: 3px; height: 3px; border-radius: 50%; background-color: var(--point-color); margin-right: 6px;}
    .aside .nav ul>li>a {color: var(--gray); font-weight: 400; font-size: 15px;}
    .aside .nav ul>li>a:hover, .aside .nav ul>li.on>a {font-weight: 700; color: var(--black);}
    .aside .nav ul>li.active>a {color: var(--black); font-weight: 500;}
    .aside .nav ul>li.active>a:after {border-color: #333;}
    /* .aside .nav>li>a.out-link {background-image: url('/_user/restructure2022/base/img/layout/icon-out-link2.png'); background-repeat: no-repeat; background-position: 94.5% 50%;} */
    /* .aside .nav>li>a.out-link:hover {background-image: url('/_user/restructure2022/base/img/layout/icon-out-link2-w.png');} */
}
/* pc lnb e */

/* pager s */
.pager-next,.pager-num,.pager-prev {margin-left:2px}
.pager {text-align:center; padding-top:40px; font-size:13px;}
.pager .mobshow {display:flex; justify-content:center}
.pager-num {color: var(--gray);}
.pager-next,.pager-num,.pager-prev {font-weight: 400; color: #4D4F5C; border: 1px solid var(--egray); border-radius: 4px; transition:.3s; width:35px; height:35px; margin: 2px; box-sizing:border-box; display:inline-block;}
.pager-first:focus,.pager-first:hover,.pager-last:focus,.pager-last:hover,.pager-next:focus,.pager-next:hover,.pager-prev:focus,.pager-prev:hover{border-color: var(--egray); border-radius: 4px;}
.pager-num:focus,.pager-num:hover {border-color: var(--point-color);}
.pager-num.active {color: var(--white); background: var(--point-color); border-color: var(--point-color);}
.pager-numlist {overflow:hidden; display:flex; line-height:35px}
.pager-prev {background:url("/_user/support/img/sub/icon_paging-prev.svg") 50% no-repeat}
.pager-next {background:url("/_user/support/img/sub/icon-paging-next.svg") 50% no-repeat}
@media screen and (min-width: 1200px) {
    .pager {padding-top:60px;}
    .pager .mobshow{display:none}
    .pager .mobhide{display:flex; justify-content:center}
    .pager-next,.pager-num,.pager-prev {margin: 4px;}
}
/* pager e */

/* shortcut-box s */
.shortcut-box {display: flex; flex-direction: column; align-items: center; width: 100%; padding: 20px 25px; background: #F7F8FB; border: 1px solid var(--egray); border-radius: 20px; box-sizing: border-box; overflow: hidden;}
.shortcut-box > .icon-bg {display: inline-block; width: 90px; height: 90px; margin-bottom: 15px; border: 1px solid var(--egray); border-radius: 50%; flex-shrink: 0; background-color: var(--white);  background-repeat: no-repeat; background-position: center; background-size: 48%;}
.shortcut-box div {display: flex; flex-direction: column; align-items: flex-start;}
.shortcut-box div > .title {display: block; padding-bottom: 10px; color: var(--black); font-size: 18px; font-weight: 500;}
.shortcut-box div > .text {display: inline-block; font-size: 17px; font-weight: 400; word-break: keep-all;}
.shortcut-box div > .link-btn {display: inline-block; align-self: center; padding: 13px 0; min-width: 104px; margin-top: 10px; text-align: center; background-color: var(--point-color); border-radius: 7px; color: var(--white); font-size: 13px; font-weight: 400;}
.shortcut-box > .icon-bg.db {background-image: url("/_user/support/img/sub/icon_shortcut_db.svg"); background-size: 40px auto;}
.shortcut-box > .icon-bg.delivery {background-image: url("/_user/support/img/sub/icon_shortcut_delivery.svg"); background-size: 40px auto;}
@media screen and (min-width: 1200px) {
    .shortcut-box {padding: 30px; flex-direction: row; gap: 30px; align-items: flex-start;}
    .shortcut-box > .icon-bg {width: 120px; height: 120px;}
    .shortcut-box > .icon-bg.db {margin-bottom: 0; background-size: 56px auto;}
    .shortcut-box > .icon-bg.delivery {margin-bottom: 0; background-size: 56px auto;}
    .shortcut-box div > .title {font-size: 22px; padding-bottom: 15px;}
    .shortcut-box div > .text {font-size: 20px;}
    .shortcut-box div > .link-btn {align-self: flex-start; font-size: 15px; min-width: 130px; margin-top: 20px;}
}
/* shortcut-box e */



/* 검색결과없음 s */
.no-result-box {display: flex; flex-direction: column; align-items: center; padding: 50px 0; border-bottom: 1px solid var(--egray); box-sizing: border-box;}
.no-result-box p {font-size: 15px; padding-top: 15px; font-weight: 400;}
.book-search-contents .no-result-box {height: 100%; justify-content: center; border-bottom:none;}
@media screen and (min-width: 1200px){
    .no-result-box {padding: 100px 0;}
    .no-result-box p {font-size: 18px;}
    .book-list.order .no-result-box {width: 100%; flex-shrink: 0; padding: 50px 0 100px; justify-content: center; align-items: center;}
    .no-result-box + .book-list-aside {display: none;}
}
/* 검색결과없음 e */
/* 사용자안내 - 로그인 s */
.apply .sm {max-width: 400px; margin: 0 auto; font-size: 14px; font-weight: 400;}
.apply .sm .info {text-align: center; padding: 20px 0;}
.apply .check-form,.apply .check-box input[type="checkbox"] + label {font-size: 13px; font-weight: 400;}
.type-form .apply .sub-title.center {justify-content: center;}
.apply .sm .info-list {display: flex; flex-direction: column; gap: 5px;}
.apply .sm .info-list>li {box-sizing: border-box; height: 40px; border-radius: 7px; background: #F7F8FB; border: 1px solid var(--egray); display: flex; align-items: center; padding: 0 15px;}
.apply .sm .info-list>li>span {display: flex; align-items: center; padding-right: 6px;}
.apply .sm .info-list>li>span:before {content: ''; margin-right: 7px; width: 4px; height: 4px; border-radius: 45px; background: var(--point-color);}
.apply .sm .info-list>li>span:after {content: ''; margin-left: 6px; width: 1px; height: 11px; background: #111; opacity: 0.3;}

.sns-login-wrap {position: relative;}
.sns-login-wrap:before {content: ''; position: absolute; left: 0; top: 14px; width: 100%; height: 1px; background: #E5E5E5;}
.sns-login-wrap>* {position: relative;}
.sns-login-wrap .sns-login {display: flex; justify-content: center; gap: 15px;}

.info-txt {font-size: 16px; font-weight: 400; text-align: center; padding-bottom: 50px; position: relative;}
.info-txt:before {content: ''; position: absolute; z-index: 1; left: 50%; bottom: 16px; transform: translateX(-50%); width: 40px; height: 30px; background: #fff url('/_user/support/img/sub/ico-symbol.png') 50% no-repeat; background-size: 18px;}
.info-txt:after {content: ''; position: absolute; width: 100%; left: 0; bottom: 30px; height: 1px; background: #E5E5E5;}

.btn.naver {background-color: #03C75A;}
.btn.kakao {background-color: #FEE500; color: #181600; font-weight: 500;}
.btn.naver:hover {background-color: #1d9b55;}
.btn.kakao:hover {background-color: #dfcf38;}

.join-user .icon.tooltip {position: absolute; left: 20px; top: 11px; margin: 0;}
.join-user .btn {position: relative;}

.tab-box-wrap.apply {border: 1px solid var(--egray); border-top: none; border-radius: 0 0 20px 20px; padding: 20px;}
.tab-box-wrap.apply .tab-box {padding-top: 10px;}

.join-info-txt {padding-bottom: 3rem; text-align: center;}

@media screen and (min-width: 360px) {
    .btn.naver, .btn.kakao {position: relative;}
    .btn.naver:before, .btn.kakao:before {content: ''; position: absolute; left: 20px; top: 0; width: 30px; height: 100%; background-repeat: no-repeat; background-position: center;}
    .btn.naver:before {background-image: url('/_user/support/img/sub/ico-naver02.png'); background-size: 14px;}
    .btn.kakao:before {background-image: url('/_user/support/img/sub/ico-kakao02.png'); background-size: 14px;}
}
@media screen and (min-width: 768px) {
    .info-txt {font-size: 18px;}
}
@media screen and (min-width: 1200px) {
    .apply .sm {font-size: 16px;}
    .apply .sm .info-list>li {height: 60px; padding: 0 20px;}
    .apply .sm .info-list>li>span {padding-right: 10px;}
    .apply .sm .info-list>li>span:after {margin-left: 10px;}
    .join-user-box + .btn-wrap {padding-top: 20px;}
    .sns-login-wrap {margin-top: 20px;}
    .sns-login-wrap:before {top: 16px;}
    .type-form .apply .sub-title.center {padding-bottom: 20px;}
    .sns-login-wrap + .btn-wrap {padding-top: 20px;}
    .btn-wrap.type02 {gap: 15px;}

    .info-txt {font-size: 22px; padding-bottom: 80px;}
    .info-txt:before {width: 110px; bottom: 27px; background-size: 23px;}
    .info-txt:after {bottom: 40px;}

    .join-user .icon.tooltip {left: 35px; top: 14px;}
    .btn.naver:before, .btn.kakao:before {background-size: 20px; left: 25px;}

    .tab-box-wrap.apply {padding: 60px 140px 100px;}

    .join-info-txt {font-size: 2.2rem; padding: 3rem 0 4rem;}
}
/* 사용자안내 - 로그인 e */

/* 도서관 선택 s */
.search-library {margin-top: 20px;}
.search-library .accordion-wrap {border-radius: 10px; border: 1px solid var(--egray); margin-bottom: 15px;}
.search-library .accordion-wrap:last-of-type {margin-bottom: 0;}
.search-library .accordion-btn {display: flex; justify-content: space-between; width: 100%; padding: 15px 20px; box-sizing: border-box;}
.search-library .accordion-content {padding: 15px 20px; background-color: #f8f8f8; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-sizing: border-box;}
.search-library .accordion-content.section1 {background-color: #ECF7FF;}
.search-library .accordion-content.section2 {background-color: #E3F3F4;}
.section1 .check-box.choice input[type="checkbox"]:checked + label {color: #fff; background-color: #3274D9; border-color: #3274D9;}
.section2 .check-box.choice input[type="checkbox"]:checked + label {color: #fff; background-color: #148293; border-color: #148293;}
.search-library .accordion-content .check-box input[type="checkbox"]:checked + label::before {display: none;}
.search-library.show {border: 1px solid var(--egray); border-radius: 10px; padding-top: 15px; box-sizing: border-box;}
.search-library.show .accordion-wrap {border: none; margin-bottom: 0;}
.search-library.show .accordion-content {background-color: var(--white);}
.search-library-button {display: none;}
.search-library-button.show {display: block; position: relative; padding: 15px 10px; background-color: var(--point-color); border-color: var(--point-color); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-sizing: border-box;}
.search-library-button button {color: var(--white); font-size: 13px;}
.search-library-button .btn-reset {margin-right: 25px; padding: 12px 12px 12px 30px; border: 1px solid var(--white); border-radius: 25px; background: var(--point-color) url("/_user/support/img/sub/icon_reset.svg") left 10px center no-repeat; background-size: 14px auto; box-sizing: border-box;}
.search-library-button .btn-search {position: static; background: var(--point-color) url("/_user/support/img/sub/icon_search_m.svg") center no-repeat; text-align: left; text-indent: 0; width: 45px; height: auto; border-radius: 0; background-position: right center;}

@media screen and (min-width: 360px){
    .search-library-button .btn-search {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
}
@media screen and (min-width: 1200px){
    .search-library {position: relative; margin-top: 40px;}
    .search-library.show:before {content: ''; position: absolute; left: 50px; top: 330px; width: 245px; height: 188px; background: url("/_user/support/img/main/img-main-bg.svg"); background-size: contain;}
    .search-library .accordion-wrap {margin-bottom: 30px;}
    .search-library .accordion-btn {padding: 20px 30px;}
    .accordion-btn .arrow {width: 24px; height: 24px;}
    .accordion-btn .arrow::before {width: 6px; height: 6px; position: relative; top: 1px;}
    .accordion-btn.on .arrow::before {top: -1px;}
    .search-library .accordion-content {padding: 30px 50px 40px;}
    .search-library.show {display: flex; flex-wrap: wrap; padding-top: 50px; gap: 40px;}
    .search-library.show .default-option-box {width: calc(40% - 40px); padding-left: 40px;}
    .search-library.show .detail-option-box {width: calc(60% - 40px); padding: 0 40px 0 0;}
    .search-library-button {width: 100%;}
    .search-library.show .accordion-wrap {margin-bottom: 40px;}
    .search-library.show .accordion-wrap:last-of-type {margin-bottom: 0;}
    .search-library.show .accordion-content {padding: 0;}
    .search-library.show .check-form.choice ul {gap: 10px;}
    .search-library.show .check-form.choice.col03 ul li {width: calc(33.3% - 7px);}
    .search-library.show .check-box.choice input[type="checkbox"] + label {font-size: 14px;}
    .search-library.show .accordion-btn {padding: 0 0 20px 0;}
    .search-library-button.show {padding: 15px 50px;}
    .search-library-button .btn-reset {font-size: 16px; padding: 15px 24px 15px 55px; background-size: 20px auto; background-position: left 24px center;}
    .search-library-button .btn-search {width: 55px; font-size: 18px; background-position: 35px 1px;}
    .search-library.show .check-form.choice.col02 ul li {width: calc(50% - 5px);}
}
/* 도서관 선택 e */
/* 상세옵션 s */
.detail-option-box {display: none;}
.detail-option-box.show {display: block; padding: 0 20px 15px; box-sizing: border-box;}
.detail-option-box .box {margin-top: 20px;}
.detail-option-box .box:first-of-type {margin-top: 0;}
.detail-option-box .inner-title {padding-bottom: 5px;}
.detail-option-box .input-box.nomal {padding-bottom: 10px;}
.detail-option-box .input-box.nomal:last-of-type {padding-bottom: 0;}
.detail-option-box .check-form.type {max-width: 550px;}
.input-box.nomal.col02 input[type="text"], .input-box.nomal.col02 input[type="number"] {width: 47%;}
@media screen and (min-width: 1200px) {
    .detail-option-box .box {margin-top: 80px;}
    .detail-option-box .box:first-of-type {display: flex; flex-wrap: wrap; gap: 20px;}
    .detail-option-box .inner-title {padding-bottom: 20px; font-size: 20px; width: 100%;}
    .detail-option-box .input-box.nomal {width: calc(50% - 10px); padding-bottom: 0;}
    .detail-option-box .check-form.type {max-width: none; justify-content: flex-start; gap: 20px;}
}
/* 상세옵션 e */
.total-num {padding: 30px 0; text-align: center; font-size: 18px; color: var(--black); word-break: keep-all; font-weight: 500;}
.total-num.sm {padding: 30px 0 15px; font-size: 14px; color: var(--gray); text-align: left; font-weight: 400; letter-spacing: -0.3px;}
.total-num.sm .num {font-weight: 500;}
@media screen and (min-width: 1200px) {
    .total-num {font-size: 22px; padding: 50px 0;}
    .total-num.sm {font-size: 17px; padding: 50px 0 30px;}
}
.loading {display: flex; justify-content: center; padding-top: 30px;}
.loading img {max-width: 80px;}
@media screen and (min-width: 768px){
    .loading img {max-width: 120px;}
}
@media screen and (min-width: 1200px){
    .loading {padding-top: 50px;}
    .loading img {max-width: 150px;}
}
/* 검색 e */

/* 소장자료 검색 책 리스트 s */
.book-order {display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 20px; gap: 6px;}
.book-order li {width: calc(50% - 4px);}
.book-list.order .book-order li.last, .book-list.info .book-order li {width: 100%;}
.book-list.info .book-order li {max-width: 200px;}
.book-order li:nth-child(5), .book-order li:nth-child(6) {margin-bottom: 0;}
.book-list.info .book-order {justify-content: center;}
.book-list.info .btn-state.del {width: 100%;}
/*.book-order li .label-state {line-height: 1.2;}*/
.contents div + .book-list {padding-top: 30px;}
.book-list .item {margin-bottom: 20px; display: block; padding: 20px; transition: all 0.3s; border: 1px solid var(--egray); border-radius: 10px; box-sizing: border-box;}
.book-list .item:last-child {margin-bottom: 0;}
.book-list .item>a {display: block;}
.book-list .item:hover, .book-list .item.chk-on {border-color: var(--point-color); box-shadow: 0 1px 10px 0 rgba(0,50,128,0.1);}
.book-info-list {display: flex; flex-direction: column; align-items: center; gap: 15px; color: var(--black);}
.book-info-list .book-cover {width: 100px; height: 140px; border: 1px solid var(--egray); box-sizing: border-box; flex-shrink: 0;}
.book-info-list .book-cover a {display: inline-block; width: 100%; height: 100%;}
.book-info-list .book-cover img {width: 100%; height: 100%; object-fit: cover;}
.book-info-list .book-cover.no-img {background: url("/_user/support/img/sub/icon_noimage.svg") center no-repeat; background-size: 40% auto;}
.book-info .title {font-size: 16px; font-weight: 500; margin-bottom: 5px; color: var(--black); text-overflow: ellipsis; overflow: hidden; display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.book-info .title > a {color: var(--black);}
.book-info .title > a:hover {text-decoration: underline;}
.book-list .item>a:hover .title {text-decoration: underline;}
.book-info li {font-size: 13px; font-weight: 500; display: flex; align-items: center;}
.book-info li:nth-child(n+2) {margin-bottom: 3px;}
.book-info li.label + li {margin-bottom: 0;}
.book-info li:last-child {margin-bottom: 0;}
.book-info li span.isbn {letter-spacing: 0;}
.book-info li > span:first-of-type {flex-shrink: 0;}
.book-info li > span:last-of-type {padding-left: 6px; font-weight: 400; color: var(--gray);}
.book-info li > span > i::before {content: ''; display: inline-block; margin: 0 6px; width: 1px; height: 9px; background-color: #aaa;}
.book-list-aside {display: none;}
.book-list .no-data {display: flex; align-items: center; justify-content: center; border: 1px solid var(--egray); border-radius: 15px; height: 250px; background: #fff; padding: 20px; box-sizing: border-box;}
.book-list .no-data>p {background: url('/_user/support/img/main/icon-error.svg') 50% 0/50px no-repeat; display: block; line-height: 1.7; text-align: center; font-size: 14px; padding-top: 65px;}

@media screen and (min-width: 360px){
    .book-info-list {flex-direction: row; align-items: flex-start;}
}
@media screen and (min-width: 768px){
    .book-info-list {gap: 20px;}
    .book-info-list .book-cover {width: 120px; height: 165px;}
    .book-info .title {font-size: 18px;}
    .book-info li {font-size: 15px;}
    .book-info-list + .book-order .label-state, .book-info-list + .book-order .btn-state {font-size: 15px;}
    .book-list.order .item {width: 100%; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; padding: 20px 30px;}
    .book-list.order .book-info-list {width: 60%;}
    .book-list.order .book-order {width: 40%; max-width: 320px; gap: 6px; align-items: center; justify-content: flex-end; padding-top: 0;}
    .book-list.order .book-order li {width: calc(50% - 10px); align-self: stretch;}
    .book-list.order .book-order li.last {margin-left: 14px;}
}
@media screen and (min-width: 1024px){
    .book-info-list .book-cover {width: 140px; height: 210px;}
    .book-info .title {font-size: 20px; margin-bottom: 20px;}
    .book-list > ul {display: flex; flex-wrap: wrap; gap: 20px;}
    .book-list .item {width: calc(50% - 10px); margin-bottom: 0; box-sizing: border-box;}
}
@media screen and (min-width: 1200px){
    .book-order li {width: calc(50% - 10px); align-self: stretch;}
    .book-info li:nth-child(n+2) {margin-bottom: 6px;}
    .book-info li:last-child {margin-bottom: 0;}
    .book-info li > span:last-of-type {padding-left: 8px;}
    .contents div + .book-list {padding-top: 50px;}
    .book-list.order {display: grid; grid-template-columns: 8fr min-content;}
    .book-list.order > ul {display: block;}
    .book-list.order .item {width: 100%; display: flex; align-items: center; padding: 24px 30px; margin-bottom: 28px; box-sizing: border-box;}
    .book-list-aside {display: block; width: 200px; padding-left: 25px;}
    .book-list .no-data {height: 350px;}
    .book-list .no-data>p {font-size: 17px;}
}
/* 소장자료 검색 책 리스트 e */

/* 찾으시는 자료가 없다면 s */
.book-application {padding-top: 30px;}
.book-application ul {display: flex; justify-content: space-between; gap: 10px;}
.book-application ul li {width: calc(33.3% - 10px); border: 1px solid var(--dgray); border-radius: 10px; text-align: center; transition: all 0.2s; box-sizing: border-box;}
.book-application ul li a {display: block; width: 100%; height: 100%; padding: 20px 0; box-sizing: border-box;}
.book-application .icon-img {display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; margin: 0 auto;}
.book-application .icon-img img {max-width: 100%;}
.book-application ul li a > p {font-size: 15px; color: var(--black); font-weight: 400; padding-top: 3px;}
@media screen and (min-width: 1200px){
    .book-application ul {gap: 16px; width: 79%;}
    .book-application ul li {height: 100px;}
    .book-application ul li:hover {border: 1px solid var(--point-color); box-shadow: 0 0 0 1px inset var(--point-color); border-radius: 49px;}
    .book-application ul li a {height: 100px; display: flex; align-items: center; justify-content: flex-start; padding: 20px;}
    .book-application .icon-img {width: 60px; height: 60px; margin: 0 20px 0 0;}
    .book-application .icon-img img {width: 70%;}
    .book-application ul li a > p {font-size: 18px; padding-top: 0;}
    .book-application ul li a > p > br {display: contents;}
}
/* 찾으시는 자료가 없다면 e */

/* 소장자료 검색 책 리스트 aside s */
.book-list-aside .accordion-wrap .accordion-btn {margin-bottom: 30px;}
.book-list-aside .accordion-wrap .accordion-btn.on {margin-bottom: 60px;}
.book-list-aside .accordion-btn + .accordion-content {margin-bottom: 60px;}
.book-list-aside .accordion-wrap:last-of-type {padding-bottom: 0}
.book-list-aside .accordion-content [class*='data-'] {max-height: 226px; overflow-y: auto;}
.book-list-aside .accordion-content [class*='data-'] li {font-size: 13px; padding-bottom: 10px;}
.book-list-aside .accordion-content [class*='data-'] li:last-child {padding-bottom: 0;}
.book-list-aside .accordion-btn .arrow {position: relative; border-radius: 4px;}
.book-list-aside .accordion-btn .arrow::before,.book-list-aside .accordion-btn .arrow::after {content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: all 0.3s; border: none; background: var(--black);}
.book-list-aside .accordion-btn .arrow::before {width: 2px; height: 8px;}
.book-list-aside .accordion-btn .arrow::after {width: 8px; height: 2px;}
.book-list-aside .accordion-btn.on .arrow::before {transform: rotate(90deg); top: 33%;}
/* 소장자료 검색 책 리스트 aside e */
/* 소장자료검색 e */


/* 웹DB서비스 : step-box s */
.step-box ul {width: 100%; padding-left: 0;}
.step-box ul li {display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 10px; border-radius: 4px; border: 1px solid var(--egray); box-sizing: border-box;}
.step-box ul li:last-child {margin-bottom: 0;}
.step-box ul li .stage {width: 100%; padding: 13px 0; text-align: center; color: var(--black); font-weight: 700; background-color: #F7F8FB; box-sizing: border-box; border-top-right-radius: 4px; border-top-left-radius: 4px;}
.step-box ul li .way {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 20px 45px; text-align: center; font-weight: 400; word-break: keep-all; box-sizing: border-box;}
.step-box ul li .way.block {display: block;}
.step-box + .noti-text {margin-top: 20px;}

@media screen and (min-width: 768px){
    .step-box ul {display: flex; flex-wrap: wrap; gap: 10px;}
    .step-box ul li {width: calc(50% - 5px);}
}

@media screen and (min-width: 1200px) {
    .step-box ul {display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: center; gap: 20px;}
    .step-box ul li {font-size: 18px; margin-bottom: 0; justify-content: space-between; width: 33.3%; border-radius: 7px;}
    .step-box.col-3 ul li {width: 33.33%;}
    .step-box.col-4 ul li {width: 25%;}
    .step-box.col-5 ul li {width: 20%;}
    .step-box.col-6 ul li {font-size: 18px; margin-bottom: 0; justify-content: space-between; width: 16.66%; border-radius: 7px; overflow: inherit;}
    .step-box ul li .stage {padding: 15px; border-top-right-radius: 7px; border-top-left-radius: 7px;}
    .step-box ul li .way {padding: 30px;}
    .step-box.col-6 ul li .way {padding: 15px;}
}
/* 웹DB서비스 : step-box e */

/* 갤러리 s */
.search-form .search-box.select-type .input-type-search {width: 100%; height: 40px; padding: 12px 8px; font-size: 14px; border: 1px solid var(--dgray); border-radius: 4px; box-sizing: border-box; font-weight: 400; background: var(--white);}
.search-form .search-box.select-type .input-type-search::placeholder {color: #555;}
.gallery-list>ul {width: 100%; display: flex; flex-direction: column; gap: 20px;}
.gallery-list .item {transition: .3s; border: 1px solid var(--egray); border-radius: 10px; box-sizing: border-box; overflow: hidden;}
.gallery-list .item:hover {border-color: var(--point-color); box-shadow: 0 1px 10px 0 rgba(0,50,128,0.1);}
.gallery-list .gallery-cover {max-height: 220px; border-bottom: 1px solid var(--egray); overflow: hidden; padding-top: 70%; position: relative;}
.gallery-list .item.no-cont .gallery-cover {padding-top: 70%; background: #FAFAFA url("/_user/support/img/sub/ico-gallery-nocont.svg") center no-repeat;}
.gallery-list .item.no-cont .gallery-cover img {display: none;}
.gallery-list .item .gallery-cover img {width: 100%; transition: .3s; height: 100%; object-fit: cover; display: block; position: absolute; top: 0;}
.gallery-list .item:hover .gallery-cover img {transform: scale(1.1);}
.gallery-list .item:hover .gallery-info .title {color: var(--point-color);}
.gallery-list .item .gallery-info {padding: 15px 20px;}
.gallery-list .item .gallery-info .title {font-size: 15px; color: var(--black); margin-bottom: 11px; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.gallery-list .item .gallery-info .info-box {display: flex; align-items: center; gap: 10px;}
.gallery-list .item .gallery-info .info-box>li {display: flex; align-items: center; gap: 7px;}
@media screen and (min-width: 768px){
    .gallery-list>ul {flex-direction: row; flex-wrap: wrap;}
    .gallery-list>ul .item {width: calc(50% - 10px);}
}
@media screen and (min-width: 1024px){
    .search-form .search-box.select-type.type02 > select {width: 100%; max-width: fit-content; min-width: 110px;}
    .search-form .search-box.select-type .input-type-search {height: 50px; font-size: 15px; padding: 15px; border-radius: 7px;}
    .search-form .search-box.select-type .input-type-search::placeholder {font-size: 15px;}
}
@media screen and (min-width: 1200px){
    .gallery-list>ul .item {width: calc(33.33% - 16px); border-radius: 20px;}
    .gallery-list>ul {gap: 20px 23px;}
}
/* 갤러리 e */

/* 4 - 신청공간 s */
/* 이용신청 안내 s */
.note-box {position: relative; border-radius: 8px; background-color: #fff; padding: 24px;}
.note-box:before {content: ''; position: absolute; z-index: -1; width: calc(100% + 4px); height: calc(100% + 4px); transform: translate(-50%, -50%); left: 50%; top: 50%; border-radius: 10px; box-sizing: border-box; background: linear-gradient(45deg, #fff 25%, #d5d5d5 0, #d5d5d5 50%, #FFF 0, #FFF 75%, #d5d5d5 0); background-size: 3px 3px;}
.note-box.type02 {background-color: #F8F8F8;}
.note-box:last-of-type {margin-bottom: 0;}
.note-box > .title {display: flex; align-items: center; gap: 5px; padding-bottom: 15px; font-size: 15px; color: var(--black); font-weight: 700;}
.note-box > .title::before {content: ''; width: 20px; height: 20px; background: url("/_user/support/img/sub/icon_note_volume.svg") center no-repeat; background-size: contain;}
.note-box > .note-list li {display: flex; align-items: baseline; gap: 5px; font-size: 13px; font-weight: 400; padding-bottom: 0;}
.note-list li {display: flex; align-items: baseline; gap: 5px; padding-bottom: 5px; font-size: 15px; font-weight: 400;}
.note-box > .note-list li:last-child, .note-list li:last-child {padding-bottom: 0;}
.note-box > .note-list li::before, .note-list li::before {content: ''; position: relative; top: -3px; flex-shrink: 0; width: 3px; height: 3px; background-color: #A8C4EF;}
.note-box.type02 > .note-list li::before {display: none;}
.sub-contents .text-box.point-color.bold {color: var(--point-color); font-weight: 700; padding-bottom: 10px;}
.note-box > .note-list li br + em {display: inline-block; padding-left: 10px;}
.note-box .title-sub {font-size: 15px; color: #111; font-weight: bold;}
.note-box > .note-list + .title-sub {padding-top: 10px;}
@media screen and (min-width: 1200px) {
    .note-box {padding: 30px; border-radius: 16px;}
    .note-box:before {border-radius: 18px;}
    .note-box > .title {font-size: 18px; padding-bottom: 18px; gap: 10px;}
    .note-box > .note-list li {padding-bottom: 5px; font-size: 15px; gap: 10px;}
    .note-list li {font-size: 18px; padding-bottom: 10px; gap: 10px;}
    .note-box > .note-list li::before, .note-list li::before {top: -4px; width: 5px; height: 5px;}
    .sub-contents .text-box.point-color.bold {padding-bottom: 15px;}
}
/* 이용신청 안내 e */

/* 이용신청 폼 양식 s */
.type-form .form-tit {display: flex; flex-wrap: wrap; align-items: center; color: var(--black); justify-content: space-between; font-size: 2.2rem; padding-bottom: 2.5rem; font-weight: 600;}
.type-form .apply + .apply {margin-top: 3rem;}
.type-form .noti {font-size: 1.6rem; font-weight: 500;}
.type-form .label-wrap {display: flex; gap: 4px; margin: 0 0 15px 10px;}
.type-form .boardview-contents {border-bottom: none;}
.type-form .boardview-contents P {margin-bottom: 0;}
.type-form fieldset {position: relative;}
.type-form .accordion-wrap {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; background-color: var(--white); border-radius: 1.2rem; border: 1px solid var(--egray); box-sizing: border-box;}
.type-form .accordion-btn {align-items: center; padding: 2rem 15px; box-sizing: border-box;}
.type-form .accordion-content {display: none; padding: 0 2rem 15px;}
.type-form .accordion-content ul {background: #F8F8F8; border-radius: 7px; padding: 15px 20px 15px 15px; box-sizing: border-box}
.type-form .accordion-content ul li {margin-bottom: 15px; font-size: 15px; font-weight: 300}
.type-form .accordion-content ul li:last-child {margin-bottom: 0;}
.type-form .apply {padding: 2.5rem 2rem 2.5rem; border: 1px solid var(--egray); border-radius: 10px; box-sizing: border-box; background: #fff; max-width: 140rem; margin: 0 auto;}
.type-form .apply .sub-title {display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding-bottom: 20px;}
.type-form .apply .sub-title > .noti {font-size: 13px; color: var(--gray); font-weight: 400;}
@media screen and (min-width: 1200px) {
    .accordion-wrap-area {border: 1px solid var(--egray); padding: 4rem; border-radius: 2rem;}
    .type-form .label-wrap {margin: 0 0 25px 20px;}
    .type-form fieldset {margin-top: 20px;}
    .type-form .accordion-wrap {border-radius: 15px;}
    .type-form .accordion-btn {padding: 25px 30px;}
    .type-form .accordion-content {padding: 0 20px 30px;}
    .type-form .accordion-content ul {border-radius: 15px; padding: 30px 40px 30px 30px;}
    .type-form .accordion-content ul li {margin-bottom: 30px; font-size: 18px;}
    .type-form .check-box input[type="checkbox"] + label {font-size: 18px;}
    .type-form .apply {padding: 6rem 0; border-radius: 20px; box-sizing: border-box;}
    .type-form .apply .sub-title {gap: 15px; padding-bottom: 15px;}
    .type-form .apply .sub-title > .noti {font-size: 15px}
    .type-form .apply + .apply {margin-top: 4rem;}
}
.apply .input-box {margin-bottom: 25px;}
.apply .input-box:last-of-type {margin-bottom: 0;}
.apply .input-box input:not(input[type="checkbox"], input[type="radio"]) {width: 100%; height: 5.6rem; padding: 0 10px; border: 1px solid var(--dgray); border-radius: 0.6rem; box-sizing: border-box;}
.apply .input-box input:hover, .apply .input-box textarea:hover {border-color: var(--black);}
.apply .input-box input:focus, .apply .input-box textarea:focus {outline: none !important; border: 2px solid var(--point-color);}
.apply .input-box input:read-only:focus, .apply .input-box input:disabled:focus,
.apply .input-box input:read-only:hover, .apply .input-box input:disabled:hover {border: 1px solid var(--dgray);}
.apply .input-box input.error {border: 2px solid #FF0000;}
.apply .input-box label, .apply .inner-title {display: block; margin-bottom: 5px; padding: 0 1rem; font-size: 15px; color: var(--black); font-weight: 700;}
.apply .input-box .star, .apply .inner-title .star {margin-left: 5px;}
.apply .input-box.id input:not(input[type="checkbox"]) {padding: 0 2rem 0 4rem; background: url("/_user/support/img/sub/icon_input_user.svg") left 15px center no-repeat; background-size: 2rem;}
.apply .input-box.password {position: relative;}
.apply .input-box.id input[type="password"], .apply .input-box.password input[type="password"], .apply .input-box.password input[type="text"] {width: calc(100% - 108px); margin-right: 5px; padding: 0 20px 0 40px; background: url("/_user/support/img/sub/icon_input_lock.svg") left 10px center no-repeat; background-size: 20px;}
.apply .input-box.col02 input[type="text"] {width: calc(100% - 108px); padding: 0 10px; margin-right: 5px;}
.apply .input-box.password > .passlook {position: absolute; right: 120px; top: 44px; display: block; text-indent: -9999px; width: 2rem; height: 2rem; background: url("/_user/support/img/sub/icon_input_passoff.svg") center no-repeat; background-size: contain;}
.apply .input-box.password > .passlook.active {background: url("/_user/support/img/sub/icon_input_passon.svg") center no-repeat; background-size: contain;}
.apply .input-box.password.w100 input:not(input[type="checkbox"], input[type="radio"]) {width: 100%;}
.apply .input-box.password.w100 > .passlook {right: 12px;}
.input-box.address .inner-box {flex-wrap: wrap; gap: 3px 5px;}
.input-box.address .inner-box input.zipcode {width: calc(100% - 105px);}
.input-box.address .inner-box input.w100 {width: 100%;}
.apply .input-box textarea {width: 100%; height: 100px; padding: 10px; border: 1px solid var(--dgray); border-radius: 4px; box-sizing: border-box;}
.input-box textarea:disabled:hover {border: 1px solid var(--dgray);}
.apply .radio-form.experience, .apply .radio-form.type {display: flex; flex-direction: column; gap: 5px;}
.apply .radio-form.type {position: relative;}
.apply .radio-form.experience .inner-title, .apply .radio-form.type .inner-title {margin-bottom: 0; width: 100%;}
.apply .radio-form.experience .radio-box:first-of-type {margin-bottom: 8px;}
.apply .radio-form.experience .radio-box.input, .apply .radio-form.type .radio-box.input {display: flex; align-items: center; gap: 10px;}
.apply .radio-form.experience .radio-box.input .input-box {margin-bottom: 0; width: 100%;}
.apply .radio-form.experience .radio-box label, .apply .radio-form.type .radio-box label {flex-shrink: 0; font-weight: 400;}
.type-form .join-user.apply {margin-top: 5px; padding: 20px; border: 1px solid var(--egray); border-radius: 20px; box-sizing: border-box;}
.join-user.apply .join-user-box + .join-user-box {margin-top: 20px;}
.join-user-box + .btn-wrap {padding-top: 10px; justify-content: flex-start; gap: 5px;}
.apply .radio-box-wrap {display: flex; gap: 15px; width: 100%;}
.form-inner {max-width: 60rem; margin: 0 auto;}

@media screen and (min-width: 768px) {
    .apply .radio-form.experience, .apply .radio-form.type {flex-direction: row; flex-wrap: wrap; align-items: center; gap: 5px 20px;}
    .apply .radio-form.type {gap:10px;}
    .apply .radio-form.experience .radio-box:first-of-type {margin-bottom: 0;}
    .apply .radio-form.experience .radio-box:nth-child(-n+3) {width: calc(15% - 20px);}
    .apply .radio-form.experience .radio-box:last-of-type {width: calc(100% - 30%);}
}
@media screen and (min-width: 1200px) {
    .apply .input-box {margin-bottom: 3rem;}
    .apply .input-box input:not(input[type="checkbox"], input[type="radio"]) {height: 50px; padding: 0 20px;}
    .apply .input-box label, .apply .inner-title {margin-bottom: 10px; font-size: 18px;}
    .apply .input-box.password > .passlook {width: 20px; height: 20px; top: 50px; right: 170px;}
    .apply .input-box.password.w100 > .passlook {right: 32px;}
    .input-box.address .inner-box {gap: 3px 10px;}
    .input-box.address .inner-box input.zipcode {width: calc(100% - 140px);}
    .apply .input-box.id input:not(input[type="checkbox"]) {padding: 0 30px 0 55px; background-position: left 20px center; background-size: 20px;}
    .apply .input-box.password input[type="password"], .apply .input-box.password input[type="text"] {width: calc(100% - 143px); padding: 0 30px 0 55px; background-position: left 20px center; background-size: 20px; margin-right: 10px;}
    .apply .input-box.col02 input[type="text"] {width: calc(100% - 143px); padding: 0 20px; margin-right: 10px;}
    .apply .input-box textarea {padding: 20px; height: 150px;}
    .apply .radio-form.experience .radio-box:nth-child(-n+3) {width: calc(12% - 20px);}
    .apply .radio-form.experience .radio-box:last-of-type {width: calc(100% - 24%);}
    .apply .radio-form.experience .radio-box.input {gap: 40px;}
    .type-form .join-user.apply {margin-top: 10px; padding: 60px 140px 100px;}
    .apply .radio-form.type .noti {position: absolute; bottom: -30px;}
}
/* 이용신청 폼 양식 e */
/* 이용신청 상세보기 s */
.type-form .apply-view.apply {padding: 20px; box-sizing: border-box;}
@media screen and (min-width: 1200px) {
    .type-form .apply-view.apply {padding: 60px 140px 100px; box-sizing: border-box;}
    .type-form .book-list .item {padding: 30px 40px;}
}
/* 이용신청 상세보기 e */
@media screen and (min-width: 1200px) {
    .cal-wrap.apply .input-box {margin-bottom: 20px;}
}
/* 4 - 신청공간 e */

/* 공지사항 리스트 s */
.notice-board-wrap .notice-wrap {border-top: 1px solid var(--black);}
.notice-board-wrap .notice-wrap .notice-table {width: 100%;}
.notice-board-wrap .notice-wrap thead, .notice-board-wrap .notice-wrap colgroup, .notice-board-wrap .notice-wrap .file, .notice-board-wrap .notice-wrap .no, .notice-board-wrap .notice-wrap .hide {display: none;}
.notice-board-wrap .notice-wrap tbody {display: block;}
.notice-board-wrap .notice-table th {border: none; padding: 0;}
.notice-board-wrap .notice-table td {border: none; padding: 0; color: var(--gray);}
.notice-board-wrap .notice-wrap tr {display: flex; flex-wrap: wrap; padding: 15px 15px 24px; border-bottom: 1px solid var(--egray);}
.notice-board-wrap .notice-wrap tr.notice {background-color: #F7F8FB;}
.notice-board-wrap .notice-wrap .no.notice {display: block;}
.notice-board-wrap .notice-wrap .no .icon-notice {position: relative; text-indent: -9999px; top: 4px; width: 13px; min-width: 13px; height: 13px; display: inline-block; margin-right: 6px; background: url("/_user/support/img/sub/icon_board_notice.svg") center no-repeat; background-size: contain;}
.notice-board-wrap .notice-wrap .name .color-label {font-size: 12px; display: inline-block; padding: 0; min-width: 45px; height: 22px; line-height: 22px; text-align: center;}
.notice-board-wrap .notice-wrap .name.type2 {width: calc(100% - 60px); text-align: left;}
.notice-board-wrap .notice-wrap .home {display: inline-flex; align-items: center; margin-right: 5px;}
.notice-board-wrap .notice-wrap .home + .tit {padding: 10px 0; width: calc(100% - 34px);}
.notice-board-wrap .notice-wrap td.tit {width: 100%; display: flex; align-items: center; text-align: left;}
.notice-board-wrap .notice-wrap .tit a {margin: 10px 0 15px; color: var(--gray); font-size: 14px; font-weight: 400; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.notice-board-wrap .notice-wrap .tit a.line-4 {-webkit-line-clamp: 4;}
.notice-board-wrap .notice-wrap .tit a:hover, .notice-board-wrap .notice-wrap .tit a:focus {text-decoration: underline;}
.notice-board-wrap .notice-wrap tr.notice .tit a {color: var(--black);}
.notice-board-wrap .notice-wrap .show, .notice-board-wrap .notice-wrap .writer, .notice-board-wrap .notice-wrap .day, .notice-board-wrap .notice-wrap .sm {font-size: 13px; padding-right: 14px;}

.notice-board-wrap .notice-wrap .view {font-size: 13px;}
.notice-board-wrap .notice-wrap .label {margin-right: 5px;}
.notice-board-wrap .notice-wrap .writer em, .notice-board-wrap .notice-wrap .day em, .notice-board-wrap .notice-wrap .view em, .notice-board-wrap .notice-wrap .show em {color: var(--black); padding-right: 6px;}

@media screen and (min-width: 768px) {
    .notice-board-wrap .notice-wrap .tit a {font-size: 17px;}
    .notice-board-wrap .notice-wrap .writer, .notice-board-wrap .notice-wrap .day, .notice-board-wrap .notice-wrap .show {font-size: 15px;}
}
@media screen and (min-width: 1200px) {
    .notice-board-wrap .notice-wrap thead {display: table-header-group;}
    .notice-board-wrap .notice-wrap th {font-weight: 400; color: var(--black); font-size: 18px; padding: 20px 0;}
    .notice-board-wrap .notice-wrap colgroup {display: table-column-group;}
    .notice-board-wrap .notice-wrap tbody {display: table-row-group;}
    .notice-board-wrap .notice-wrap tr {display: table-row; padding: 0 !important;}
    .notice-board-wrap .notice-wrap td {padding: 15px 10px; vertical-align: middle; font-size: 17px;}
    .notice-board-wrap .notice-wrap .name, .notice-board-wrap .notice-wrap .writer, .notice-board-wrap .notice-wrap .file, .notice-board-wrap .notice-wrap .view, .notice-board-wrap .notice-wrap .no, .notice-board-wrap .notice-wrap td.tit, .notice-board-wrap .notice-wrap .day, .notice-board-wrap .notice-wrap .hide {display: table-cell !important;}
    .notice-board-wrap .notice-wrap .name.type2.tc {text-align: center;}
    .notice-board-wrap .notice-wrap .name .color-label {font-size: 15px; min-width: 70px; height: 30px; line-height: 30px;}
    .notice-board-wrap .notice-wrap .no .icon-notice {width: 16px; height: 16px; margin-right: 0; top: 3px;}
    .notice-board-wrap .notice-wrap .tit a {-webkit-line-clamp: 1; margin: 0; text-align: left;}
    .notice-board-wrap .notice-wrap .home {display: table-cell;}
    .notice-board-wrap .notice-wrap .writer, .notice-board-wrap .notice-wrap .sm, .notice-board-wrap .notice-wrap .day, .notice-board-wrap .notice-wrap .view, .notice-board-wrap .notice-wrap .library {font-size: 17px;}
    .notice-board-wrap .notice-wrap .label em, .notice-board-wrap .notice-wrap .sm em, .notice-board-wrap .notice-wrap .writer em, .notice-board-wrap .notice-wrap .day em, .notice-board-wrap .notice-wrap .view em, .notice-board-wrap .notice-wrap .show em {display: none;}
    .notice-board-wrap .notice-wrap .file .icon-file {width: 16px; min-width: 16px; height: 16px; display: inline-block; background: url("/_user/support/img/sub/icon_board_file.svg") center no-repeat; background-size: contain;}
}
/* 공지사항 리스트 e */
/* 질문하기 리스트 s */
.notice-wrap .questions-table {text-align: center;}
.notice-wrap .questions-table td.tit {align-items: baseline;}
.notice-board-wrap .notice-wrap .tit .icon-secret {position: relative; top: 1px; margin-right: 6px; width: 13px; min-width: 13px; height: 13px; display: inline-block; background: url("/_user/support/img/sub/icon_board_secret.svg") center no-repeat; background-size: contain;}
.notice-wrap .questions-table .state {font-size: 13px; font-weight: 400;}
.notice-wrap .questions-table .state.receive {color: #4E59B9;}
.notice-wrap .questions-table .state.process {color: var(--point-color);}
.notice-wrap .questions-table .state.complete {color: var(--gray);}
@media screen and (min-width: 1200px) {
    .notice-wrap .questions-table td.tit {display: flex !important;}
    .notice-board-wrap .notice-wrap .tit .icon-secret {height: 16px; margin-right: 10px; top: 2px;}
    .notice-wrap .questions-table .state {font-size: 17px; text-align: center; display: table-cell;}
    .notice-board-wrap .notice-wrap + .btn-wrap {justify-content: flex-end;}
}
/* 질문하기 리스트 e */
/* 자유게시판 s */
.search-wrap-sub + .sub-box.note-box {margin:
        25px 0 0;}
@media screen and (min-width: 1200px) {
    .search-wrap-sub + .sub-box.note-box {margin-top: 50px;}
}
/* 자유게시판 e */

.img-box img {max-width: 100%;}

/* no-cont s */
.no-contents {font-size: 16px; color: #aaa; display: flex; flex-direction: column;  align-items: center; justify-content: center; height: 160px; border: 1px solid #ddd;}
.no-contents > span {display: block; padding-top: 14px; font-size: 14px; letter-spacing: -0.4px;}
.no-contents > img {margin-right: 0; width: 30px;}

@media all and (min-width: 1024px) {
    .no-contents {height: 460px; font-size: 20px;}
    .no-contents > img {width: 60px; }
    .no-contents.photo > img {width: 68px; }
    .no-contents > span {padding-top: 20px; font-size: 16px;}
}
/* no-cont e */

/* 이벤트 참여하기 s */
.event-order .label-state {display: flex; align-items: center; justify-content: center; max-width: 137px;}
.contents div + .event-list {padding-top: 30px;}
.list-box {padding-top: 30px;}
.event-list .item, .list-box .item {margin-bottom: 20px; display: block; padding: 20px; transition: all 0.3s; border: 1px solid var(--egray); border-radius: 10px; box-sizing: border-box;}
.event-list .item:last-child, .list-box .item:last-child {margin-bottom: 0;}
.event-list .item>a {height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.event-list .item:hover, .list-box .item:hover {border-color: var(--point-color); box-shadow: 0 1px 10px 0 rgba(0,50,128,0.1);}
.event-info-list {display: flex; flex-direction: column; align-items: center; gap: 15px; color: var(--black);}
.event-info {display: flex; flex-direction: column; gap: 3px;}
.event-info .title, .item .title {font-size: 16px;font-weight: 500; color: var(--black); text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 7px;}
.event-info .title > a {color: var(--black);}
.event-info .title > a:hover {text-decoration: underline;}
.event-list .item>a:hover .title {text-decoration: underline;}
.event-info>li {font-size: 13px; font-weight: 500; display: flex; gap: 6px;}
.event-info>li > span:first-of-type {flex-shrink: 0; font-weight: 600;}
.event-info>li > span:last-of-type {font-weight: 400; color: var(--gray); word-break: keep-all;}
.event-info li.bus > span {padding-left: 0; font-weight: 600}
.event-info li.bus > div {font-weight: 400; color: var(--gray); word-break: keep-all;}
.event-info>li.label {margin-bottom: 4px;}
.event-order {display: flex; justify-content: flex-end; padding-top: 10px; gap: 6px;}
.event-order li {max-width: 137px; width: 100%;}
.event-order li:nth-child(5), .event-order li:nth-child(6) {margin-bottom: 0;}
/* 241128 버스정보 추가 s */
.event-info li.bus {flex-direction: column;}
.event-info li.bus > div {width: 100%;}
.bus-info-box {display: grid; grid-template-columns: 125px 1fr; width: 100%; border-collapse: collapse; border: 1px solid #ccc; border-radius: 5px; text-align: center; overflow: hidden;}
.bus-info-box dt {display: grid; align-items: center; border-right: 1px solid #ccc;}
.bus-info-box dd.th {text-align: center;}
.bus-info-box dt:first-of-type, .bus-info-box dd:first-of-type {font-weight: 500; background-color: #f1f1f1; grid-column: span 1; border-top: none;}
.bus-info-box dt:last-of-type, .bus-info-box dd:last-of-type {border-bottom: none;}
.bus-info-box dt, .bus-info-box dd {padding: 8px 12px;}
.bus-info-box dt.row-2 {grid-row: span 2;}
.bus-info-box dd {word-break: keep-all; text-align: left;}
.bus-info-box dt:nth-of-type(n+3), .bus-info-box dd:nth-of-type(n+3) {border-top: 1px solid #ccc;}
/* 241128 버스정보 추가 e */
@media screen and (min-width: 360px){
    .event-info-list {flex-direction: row; align-items: flex-start;}
}
@media screen and (min-width: 768px){
    .search-form .search-box.select-type.event.inner > ul {width: calc(100% - 135px);}
    .search-form .search-box.select-type.event > ul li {width: calc(60% - 10px);}
    .search-form .search-box.select-type.event > ul li.col02 {width: 40%;}
    .search-form .search-box.select-type .btn-search {width: 125px; flex-shrink: 0; font-size: 15px; border-radius: 7px;}

    .event-list > ul, .list-box > ul {display: flex; flex-wrap: wrap; gap: 20px;}
    .event-list .item, .list-box .item {width: calc(50% - 10px); margin-bottom: 0; box-sizing: border-box;}
    .event-info .title, .item .title {font-size: 18px;}
    .event-info li {font-size: 15px;}
    .event-info-list + .event-order .label-state {font-size: 15px;}
}
@media screen and (min-width: 1024px){
    .event-info {gap: 6px;}
    .event-info .title, .item .title {font-size: 20px; margin-bottom: 14px;}
    .event-info>li.label {margin-bottom: 0;}
}

@media screen and (min-width: 1200px){
    .event-info li > span:last-of-type {padding-left: 8px;}
    .event-info li.bus > span {padding-left: 0;}
    /*.event-info li.bus > div {padding-left: 8px;}*/
    .contents div + .event-list {padding-top: 50px;}
    .list-box {padding-top: 50px;}
    .event-list .item, .list-box .item {padding: 30px 40px;}
    .event-list.order {display: flex; gap: 25px;}
    .event-list.order > ul {display: block; width: 79%; flex-shrink: 0;}
    .event-list.order .item {width: 100%; display: flex; align-items: center; padding: 24px 30px; margin-bottom: 28px; box-sizing: border-box;}
    .event-list.order .event-info-list {width: 60%;}
    .event-list.order .event-order {width: 40%; gap: 6px; align-items: center; justify-content: flex-end; padding-top: 0;}
    .event-list.order .event-order li .icon.tooltip {width: 18px; height: 18px;}
    .event-list-aside {display: block; width: 100%}
}
/* 이벤트 참여하기 e */

/* 문화행사 신청 s */
.event-info .possible {color: var(--point-color); font-weight: 600;}
.event-info .full {font-weight: 600;}
/* 문화행사 신청 e */

/* 갤러리 게시판 상세보기 s */
.boardview-contents.gallery {padding: 0;}
.boardview-contents img {margin: 0;}
.gallery-info .tit {font-size: 20px; margin-bottom: 10px; color: var(--black);}
.gallery-info > p:last-child {letter-spacing: -0.7px; margin-bottom: 0;}
.gallery-info {padding-top: 14px;}
.gallery-view {padding: 30px 0 15px 0; border-bottom: 1px solid #E5E5E5;}
.scroll-wrap {display: flex; flex-direction: column; gap: 10px; padding-top: 15px;}
.scroll-wrap > .scroll-list {margin-bottom: 12px;}
.scroll-wrap > .scroll-list:last-child {margin-bottom: 0;}
.scroll-wrap > .scroll-list > a {display: flex; gap: 10px; align-items: center;}
.scroll-wrap > .scroll-list > a .active-bg {width: 42.8%; height: 0; padding-top: 26%; display: block; position: relative; margin-bottom: 0;}
.scroll-wrap > .scroll-list > a > .active-bg  > img {width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0;}
.scroll-wrap > .scroll-list > a > div {overflow: hidden; width: 50%;}
.scroll-wrap > .scroll-list > a > div > p:first-child {font-size: 16px; color: #222; margin-bottom: 6px; letter-spacing: -0.8px; max-height: 44px; overflow: hidden; height: 44px; line-height: 22px;}
.scroll-wrap > .scroll-list > a > div > p:last-child {letter-spacing: -0.7px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; margin-bottom: 0;}

@media screen and (min-width: 768px) {
    .boardview-contents.gallery {border-bottom: none;}
    .gallery-view {padding: 0;}
    .gallery-list {padding-top: 50px; display: flex; justify-content: space-between;}
    .gallery-list .gallery-view {width: 59.2%;}
    .gallery-view {max-width: 610px; padding-bottom: 30px;}
    .scroll-wrap {padding-top: 0;}
    .gallery-list .gallery-inner-list {position: relative; width: 39.2%; overflow-y: auto; min-height: 636px; max-height: 766px; margin-left: 20px; padding-right: 20px; transition: 0.3s;}
    .gallery-info {padding-top: 20px;}
    .gallery-info > p:first-child {font-size: 24px; letter-spacing: -1.2px;}
    .gallery-info > p:last-child {font-size: 18px; letter-spacing: -0.9px;}
    .scroll-wrap > .scroll-list > a > div > p:first-child {font-size: 18px;}
    .scroll-wrap > .scroll-list > a .active-bg {width: 28.8%; padding-top: 23%;}
    .scroll-wrap > .scroll-list > a > div {width: 60%;}
}
/* 갤러리 게시판 상세보기 e */

/* 문화행사 신청 s*/
.check-form {margin-left: 2px;}
.apply .input-box textarea {resize: none;}
.apply .input-box select {width: 100%; height: 40px; padding: 0 10px; border: 1px solid var(--dgray); border-radius: 4px; box-sizing: border-box; background: var(--white) url(/_user/support/img/sub/icon_arrow.svg) right 16px center/10px no-repeat; font-size: 13px;}
.apply .input-box select.born {width: 90px;}
.apply .input-box select:hover {border-color: var(--black);}
.apply .input-box select:focus {outline: none !important; border: 2px solid var(--point-color);}
.apply .input-box .check-box {display: flex; align-items: center;}
.input-box .inner-box {display: flex; align-items: center; gap: 10px;}
.radio-form .inner-box {display: flex; align-items: center;  gap: 10px; flex-wrap: wrap;}
/*.input-box.address .inner-box input.w100 {width: 100%;}*/
.input-box .inner-box .inner-text {flex-shrink: 0; word-break: keep-all;}
.input-box .inner-box .col {display: flex; align-items: center; gap: 10px;}
.input-box.school .inner-box .col:first-of-type {width: 80%;}
.input-box.school .inner-box .col:last-of-type {width: 20%; min-width: 60px;}
.input-box.school .inner-box .col:last-of-type input {padding: 0 5px; text-align: center;}

@media all and (min-width: 768px) {
    .input-box .inner-box {gap: 20px;}
    .radio-form .inner-box {gap: 20px;}
}
@media all and (min-width: 1200px) {
    .apply .input-box select {height: 50px; padding: 0 20px; font-size: 15px;}
    .apply .input-box select.born {width: 110px;}
    .apply .radio-box input[type="radio"] + label {margin-bottom: 0}
    .apply .check-box input[type="checkbox"] + label,  .apply .input-box.survey .check-box input[type="checkbox"] + label {font-size: 15px;}
}
/* 문화행사 신청 e*/

/* 질문하기 상세 s */
.state-text {font-style: normal;}
.state-text.application {color: #4E59B9;}
.state-text.progress {color: var(--point-color);}
.state-text.completed {color: #555;}
.boardview-title.type02 {display: flex; align-items: center; gap: 10px;}
.boardview-title.type02 .ico-lock {width: 13px; height: 16px;}
.boardview-title.type02 .ico-lock img {width: 13px; height: 16px;}
.answer-view-wrap {border-top: 1px solid var(--black); margin-top: 30px;}
.answer-view-info {display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; font-weight: 400; background: #F7F8FB; padding: 15px;}
.answer-view-info .tit {color: #111; padding-right:10px;}
.answer-view-info .answer-date {color: #555;}
.answer-view-contents {padding: 30px; border-bottom: 1px solid var(--egray); box-sizing: border-box; word-break: break-all;}
.answer-view-contents p {margin-bottom: 30px; font-size: 15px;}
@media screen and (min-width: 1200px) {
    .answer-view-wrap {margin-top: 40px;}
    .answer-view-info {display: flex;}
    .answer-view-info .tit {padding-right: 20px;}
    .answer-view-info {font-size: 18px; padding: 20px;}
    .answer-view-contents {padding: 50px 30px;}
    .answer-view-contents p {font-size: 18px;}
}
/* 질문하기 상세 e */
/* 설문조사 상세 s */
.boardview-contents.survey {border: 1px solid var(--egray); border-radius: 7px; margin-top: 20px;}
@media screen and (min-width: 1200px) {
    .boardview-contents.survey {margin-top: 40px; border-radius: 20px;}
}
/* 설문조사 상세 e */
/* 설문조사 폼 s */
.form-container .input-box.survey {}
.form-container .input-box.survey .input-title {font-weight: 700; font-size: 15px; color: var(--black); padding-bottom: 10px;}
.form-container .input-box.survey .input-title .number {display: inline-block; color: #063F8B; font-weight: 700; padding-right: 8px;}
.form-container .input-box.survey > label, .inner-label {font-size: 14px; color:#555; font-weight: 400; margin-bottom: 15px;}
.radio-form.column, .check-form.column {display: flex; flex-direction: column; gap: 10px; margin-top: 0;}
.inner-form-box {display: flex; align-items: center; gap: 20px; padding-bottom: 20px;}
.input-box .radio-form.preference {margin-top: 0; gap: 20px;}
.radio-form.preference .radio-box input[type="radio"] + label {padding-left: 0;}
.radio-form.preference .radio-box input[type="radio"] + label:after {content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -20px; top: auto; width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; border: 1px solid var(--dgray); border-width: 1px;}
.radio-form.preference .radio-box input[type="radio"] + label:before {content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: -16px; top: auto; width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box; background: #fff;}
.radio-form.preference .radio-box input[type="radio"] + label:hover::after {border: 2px solid var(--point-color);}
.radio-form.preference .radio-box input[type="radio"]:checked + label::before {background: var(--point-color);}
.prefer-text {position: relative; top: 23px; word-break: keep-all;}
.star-rating {display:flex; flex-direction: row-reverse; font-size:1.5em; justify-content:flex-end; text-align:center;}
.star-rating input {display:none;}
.star-rating label {width: 18px; height: 18px; background: url("/_user/support/img/sub/ico-star-gray.svg") no-repeat; cursor:pointer; background-size: contain; padding: 0 10px}
.star-rating label:first-of-type {padding-right: 0;}
.star-rating :checked ~ label {background: url("/_user/support/img/sub/ico-star.svg") no-repeat; background-size: contain;}
.star-rating label:hover, .star-rating label:hover ~ label {background: url("/_user/support/img/sub/ico-star.svg") no-repeat; background-size: contain;}
.inner-box.survey-date {flex-wrap: wrap;}
.inner-box.survey-date .col:first-of-type {width: 70%; max-width: 490px;}
.inner-box.survey-date .col:nth-of-type(2), .inner-box.survey-date .col:nth-of-type(3) {width: 15%; min-width: 80px;}

@media screen and (min-width: 1200px) {
    .form-container .input-box.survey .input-title {font-size: 18px; padding-bottom: 20px;}
    .form-container .input-box.survey .input-title .number {font-size: 18px;}
    .form-container .input-box.survey > label {margin-bottom: 15px; font-size: 15px;}
}
/* 설문조사 폼 e */
/* 설문조사 결과 s */
.survey-result .survey-item + .survey-item {padding-top: 30px;}
.survey-result .tit {color: var(--black); font-weight: bold; font-size: 15px;}
.survey-result .tit>em {color: var(--point-color2);}
.survey-result .tit span {display: inline-block;}
.survey-result .answer-box {padding-top: 10px; overflow: hidden;}
.survey-result .answer-box + .answer-box {padding-top: 5px;}
.survey-result .answer-box .txt {padding: 7px 15px; border-radius: 4px; border: 1px solid var(--dgray); background: #f8f8f8;}
.survey-result .answer-box * {font-family: "Pretendard", sans-serif;}
.survey-result .scroll-box {overflow-y: hidden; overflow-x: auto;}
.survey-result .circle-chart {max-width: 350px; min-width: 300px;}
.survey-result .bar-chart {max-width: 300px; min-width: 250px;}
.survey-result .line-chart {max-width: 500px; min-width: 250px;}
.survey-result .apexcharts-toolbar {display: none;}
.apexcharts-legend {display: flex; flex-direction: column;}
.apexcharts-legend-series {display: flex; align-items: center;}

@media screen and (min-width: 768px) {
    .survey-result .circle-chart {max-width: 400px;}
    .survey-result .bar-chart {max-width: 700px;}
    .survey-result .line-chart {max-width: 700px;}
    .apexcharts-legend-text {font-size: 15px !important;}
    .apexcharts-legend-series {gap: 5px;}
    .apexcharts-legend-marker {width: 14px !important; height: 14px !important;}
}
@media screen and (min-width: 1200px) {
    .survey-result .survey-item + .survey-item {padding-top: 50px;}
    .survey-result .tit {font-size: 18px;}
    .survey-result .answer-box {padding-top: 20px;}
    .survey-result .answer-box + .answer-box {padding-top: 10px;}
    .survey-result .answer-box .txt {font-size: 15px; padding: 13px 20px;}
    .survey-result .circle-chart {max-width: 450px;}
}
/* 설문조사 결과 e */

/* 임시로 수정사항 적용해둔것 s*/
.tab-btn-wrap > li {display: flex; justify-content: center; align-items: center; word-break: keep-all;}
.tab-btn-wrap + .search-wrap-sub {padding-top: 30px;}
.step-box ul li {border-radius: 4px; overflow: hidden}
@media all and (min-width: 768px) {
    /* 반응형 768까지 한줄 끌고가기 */
    .search-form .search-box.select-type.type02 > select {width: 100%; max-width: 110px;}
    .search-form .search-box.select-type {flex-wrap: nowrap;}
    .tab-btn-wrap + .search-wrap-sub {padding-top: 50px;}
    .search-form .search-box.select-type.cal {flex-wrap: wrap;}
    .search-form .search-box.select-type.nowrap {flex-wrap: nowrap;}
    .search-form .search-box.select-type.nowrap>ul {width: 50%;}

    .search-form .search-box.select-type.event > ul.type-smart {width: calc(100% - 135px); flex-wrap: nowrap;}
    .search-form .search-box.select-type.event > ul.type-smart > li:first-of-type {width: 20%;}
    .search-form .search-box.select-type.event > ul.type-smart > li:nth-of-type(2) {width: 40%;}
    .search-form .search-box.select-type.event > ul.type-smart > li:nth-of-type(3) {width: 40%;}
}

@media all and (min-width: 1024px) {
    .bullet-doublesquare {width: 6px; height: 18px;}
    .bookrange-box .select-form .search-select {border-radius: 7px;}
    .search-form .search-box.select-type.event > ul.type-smart {width: calc(100% - 155px); }
}
@media all and (min-width: 1200px) {
    .step-box ul li {border-radius: 7px;}
}
/* 임시로 수정사항 적용해둔것 e*/

/* 게시판 댓글 s */
.boardview-wrap .label-wrap {display: flex; gap: 4px; padding-left: 10px;}
.boardview-wrap .label-wrap + .boardview-title {padding-top: 10px;}
.reply-wrap {padding-top: 50px;}
.reply-wrap .tit {font-size: 20px; letter-spacing: -0.4px; color: #333; font-weight: bold; padding-bottom: 10px;}
.reply-wrap .reply-write {display: flex; flex-direction: column; padding: 20px; box-sizing: border-box; border: 1px solid var(--egray); border-radius: 7px; font-size: 15px;}
.reply-wrap .reply-txt {display: block; width: 100%; border: none; resize: none; height: 100px; font-size: 15px; color: #555;}
.reply-write:focus-within {border-color: var(--point-color);}
.reply-wrap .reply-txt:focus {outline: none;}
.reply-wrap textarea::placeholder {font-size: 15px !important; color: #555;}
.reply-wrap .txt-count {align-self: flex-end; font-weight: 400; font-size: 13px;}
.reply-wrap .btn-wrap {padding-top: 0;}
.reply-wrap .write-wrap .btn-wrap {padding-top: 10px;}
.reply-wrap .btn-submit {width: 100%; height: 40px; border-radius: 7px; background: var(--point-color); color: #fff;}
.reply-wrap .reply-box {margin-top: 20px; border: 1px solid var(--egray); border-radius: 7px; overflow: hidden; font-size: 15px; color: #333;}
.reply-wrap .reply-count {padding: 16px 15px; background: #F7F8FB; font-weight: 400;}
.reply-wrap .reply-count .num {color: var(--point-color); font-weight: bold;}
.reply-wrap #comments>li {padding: 20px; box-sizing: border-box; display: flex; flex-direction: column; gap: 10px;}
.reply-wrap #comments>li+li {border-top: 1px solid var(--egray);}
.reply-wrap .user-ico {width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; box-sizing: border-box; border-radius: 50%; flex-shrink: 0; background: #F1F5F8; border: 1px solid var(--egray);}
.reply-wrap .user-ico:before {width: 18px; height: 18px; content: ''; display: block; background: url("/_user/support/img/sub/ico-user.svg") center no-repeat;}
.reply-wrap .reply-top {display: flex; flex-direction: column; gap: 10px;}
.reply-wrap .reply-top .btn {min-width: calc(50% - 10px);}
.reply-top .btn-wrap {justify-content: flex-start;}
.reply-wrap .reply {display: flex; flex-direction: column; gap: 10px; width: 100%;}
.reply-wrap .reply .reply-write {width: 100%;}
.reply-wrap .reply-info {display: flex; gap: 8px; align-items: center; font-weight: 400;}
.reply-wrap .reply-info .user-name {color: #0F0F0F; font-size: 16px; font-weight: bold;}
.reply-wrap .reply-info .date {font-size: 13px; letter-spacing: -0.3px; line-height: 21px; color: #555;}
.reply-wrap .comment {color: #464646; font-weight: 400;}
.reply-wrap .more-wrap {display: flex; justify-content: center;}
.reply-wrap .more-wrap .show-more {display: flex; justify-content: center; align-items: center; gap: 7px; width: 130px; height: 40px; color: var(--point-color); border-radius: 0 0 20px 20px; background: #F7F8FB; border: 1px solid var(--egray); border-top: none; transition: all 0.3s;}
.reply-wrap .more-wrap .show-more:after {content: ''; display: inline-block; width: 11px; height: 6px; background: url("/_user/support/img/sub/ico-show-more.svg");}
.reply-wrap .more-wrap .show-more:hover, .reply-wrap .more-wrap .show-more.on {background: var(--point-color); color: #fff;}
.reply-wrap .more-wrap .show-more:hover:after, .reply-wrap .more-wrap .show-more.on:after {background-image: url("/_user/support/img/sub/ico-show-more-on.svg");}
@media screen and (min-width: 360px) {
    .reply-wrap #comments>li {flex-direction: row;}
    .reply-wrap .reply-top .btn {min-width: 100px;}
}
@media screen and (min-width: 520px) {
    .reply-wrap .reply-txt {height: auto;}
    .reply-wrap .reply-top {flex-direction: row; justify-content: space-between;}
}
@media screen and (min-width: 768px) {
    .boardview-wrap .label-wrap + .boardview-title {padding-top: 15px;}
    .reply-wrap {padding-top: 60px;}
    .reply-wrap .tit {font-size: 22px;}
    .reply-wrap .write-wrap {display: flex; justify-content: space-between; gap: 10px;}
    .reply-wrap .write-wrap .btn-wrap {padding-top: 0; width: 130px;}
    .reply-wrap .reply-write {width: calc(100% - 140px); padding: 16px 20px;}
    .reply-wrap .reply-txt {height: 60px; font-size: 16px;}
    .reply-wrap .txt-count {font-size: 14px;}
    .reply-wrap .btn-submit {height: 100%;}
    .reply-wrap .reply-box {margin-top: 30px;}
    .reply-wrap .reply {gap: 15px;}
    .reply-wrap textarea::placeholder {font-size: 16px !important;;}
    .reply-wrap .reply-info .user-name {font-size: 18px;}
    .reply-wrap .reply-info .date {font-size: 14px;}
    .reply-wrap .comment {font-size: 16px;}
    .reply-wrap #comments>li {padding: 25px;}
}
@media screen and (min-width: 1024px) {
    .boardview-wrap .label-wrap + .boardview-title {padding-top: 25px;}
    .reply-wrap {padding-top: 70px;}
    .reply-wrap .tit {font-size: 24px; padding-bottom: 20px;}
    .reply-wrap .reply-count {padding: 24px 30px; font-size: 18px;}
    .reply-wrap .reply-info .user-name {font-size: 20px;}
    .reply-wrap .reply-info .date {font-size: 15px;}
    .reply-wrap #comments>li {gap: 25px; padding: 30px;}
    .reply-wrap .comment {font-size: 18px;}
    .reply-wrap .reply-txt, .reply-wrap .btn-submit {font-size: 18px;}
    .reply-wrap textarea::placeholder {font-size: 18px !important;}
    .reply-wrap .txt-count {font-size: 15px;}
    .reply-wrap .reply {gap: 20px;}
    .reply-wrap .user-ico {width: 60px; height: 60px;}
    .reply-wrap .user-ico:before {width: 28px; height: 28px; background-size: 100%;}
    .reply-wrap .more-wrap .show-more {width: 140px; height: 50px;}
    .reply-wrap .reply-box {margin-top: 40px; border-radius: 20px;}
    .reply-wrap .reply-top .btn {min-width: 130px; font-size: 15px;}
}
@media screen and (min-width: 1200px) {
    .boardview-wrap .label-wrap {padding-left: 20px;}
    .reply-wrap .btn {min-height: 40px;}
}
/* 게시판 댓글 e */
/* 회원가입 s */
/* join-box s */
.join-box-wrap {display: flex; flex-direction: column; gap: 20px;}
.join-box {padding: 20px; box-sizing: border-box; transition: all 0.3s; background: #F7F8FB; border: 1px solid #F7F8FB; border-radius: 7px; display: flex; align-items: center; flex-direction: column; gap: 20px;}
.join-box .title {font-size: 18px; color: #111; word-break: keep-all; font-weight: 500;}
.join-box .icon-area {width: 100px; height: 100px; box-sizing: border-box; background: #fff; transition: 0.3s; border: 1px solid #fff; display: flex; justify-content: center; align-items: center; border-radius: 50%;}
.join-box .icon-area:before {content: ''; width: 46px; height: 46px; display: block; background: url("/_user/support/img/sub/icon_application_bookbada.svg") center no-repeat; background-size: 100%;}
.join-box .icon-area.app:before {background-image: url('/_user/support/img/sub/icon_urido_app.svg');}
.join-box .text-area {word-break: keep-all; font-weight: 400;}
.join-box .text-area em {color: #111;}
.join-box .text-area>p+p {padding-top: 5px;}
.join-box .text-area .list-info {padding-top: 20px;}
.join-box .text-area ul.circle-num {display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; max-width: 300px;}
.join-box .text-area ul.circle-num>li {display: inline-flex;}
.join-box .text-area ul.circle-num>li:before {text-indent: -1px;}
.join-box .text-area .issuance-download-box>li {width: 50%;}
.join-box .text-area .issuance-download-box>li .tit {min-width: auto; margin: 0 auto; word-break: break-all; max-width: 130px;}
.join-box .btn-area {width: 100%;}
.join-box .link-btn {width: 100%; border-radius: 7px; padding: 10px; transition: all 0.3s; display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #2778FA; color: #2778FA; box-sizing: border-box;}
.join-box:hover {border-color: var(--point-color); background: #fff; box-shadow: 5px 5px 10px 0 rgba(0,0,0,0.1);}
.join-box:hover .icon-area {background: #F7F8FB; border: 1px solid var(--egray);}
.join-box:hover .link-btn:hover {background: #EBF4FF;}
@media screen and (min-width: 768px) {
    .join-box-wrap {display: grid; grid-template-columns: repeat(2, 1fr);}
    .join-box-wrap .join-box {gap: 30px; border-radius: 20px; padding: 30px;}
    .join-box .text-area {width: 70%; min-height: 95px;}
    .join-box .title {font-size: 22px;}
    .join-box .text-area, .join-box .link-btn {font-size: 15px;}
    .join-box .icon-area {width: 120px; height: 120px;}
    .join-box .icon-area:before {width: 50px; height: 50px;}
    .join-box .text-area .issuance-download-box {gap: 10px;}
    .join-box .text-area .list-info {padding-top: 40px;}
}
@media screen and (min-width: 1024px) {
    .join-box .text-area {width: 80%;}
    .join-box .text-area ul.circle-num {max-width: none; gap: 8px;}
}
@media screen and (min-width: 1200px) {
    .join-box .title {font-size: 24px;}
    .join-box-wrap .join-box {padding: 60px 50px;}
    .join-box .icon-area {width: 140px; height: 140px;}
    .join-box .icon-area:before {width: 56px; height: 56px;}
    .join-box .text-area {min-height: 160px;}
    .join-box .text-area .list-info {padding-top: 55px;}
    .join-box .text-area>p+p {padding-top: 10px;}
    .join-box .text-area, .join-box .link-btn {font-size: 16px;}
    .join-box .text-area ul.circle-num>li {font-size: 16px;}
    .join-box .text-area ul.circle-num>li:before {text-indent: -1.5px;}
    .join-box .text-area .issuance-download-box {gap: 20px;}
}
@media screen and (min-width: 1400px) {
    .join-box .text-area {min-height: 106px;}
}
/* join-box e */
/* 회원가입 (준회원) 완료 s*/
.join-box-wrap .join-box.wide {grid-column: 1 / 3; padding: 30px 20px;}
.join-box-wrap.complete .join-box {border-color: var(--point-color); background: #fff;}
.join-box-wrap.complete .join-box:hover {box-shadow: none;}
.join-box.wide .inner {width: 100%; display: flex; flex-direction: column; align-items: center; max-width: 800px;}
.icon-complete {width: 70px; height: 70px; display: block; background: url("/_user/support/img/sub/ico-ok.svg") center no-repeat; background-size: 100%;}
.icon-complete + .title {padding-top: 40px; padding-bottom: 15px;}
.join-box-wrap.complete .btn-area {margin-top: 40px; display: flex; justify-content: center;}
.join-box .info-box {width: 100%; box-sizing: border-box; background: #F7F8FB; border-radius: 7px; padding: 15px;}
.join-box .info-list {display: flex; flex-wrap: wrap; gap: 5px 30px; justify-content: center; color: #111;}
.join-box .info-list>li {position: relative; padding-left: 14px; display: flex; gap: 6px; align-items: baseline;}
.join-box .info-list>li:before {position: absolute; left: 0; top: calc(50% - 2px); transform: translateY(-50%); content: ''; width: 4px; height: 4px; border-radius: 50%; flex-shrink: 0; background: var(--point-color);}
.join-box .info-list em:before {content: ''; display: inline-block; margin-right: 6px; width: 1px; height: 11px; background-color: #111; opacity: 0.3}

.join-box .paragraph-list {width: 100%;}
.join-box .paragraph-list .bullet-title-s {font-weight: normal;}
.join-box .btn-area.join {flex-wrap: wrap; flex-direction: column; gap: 10px; align-items: center;}
.join-box-wrap.complete .link-btn.login {width: 100%; max-width: 220px; color: #fff; background: var(--point-color);}
.join-box-wrap.complete .link-btn {word-break: keep-all; flex-shrink: 0; width: auto; text-align: center;}
.join-box-wrap.complete .btn-area.join>div {margin: 0 auto;}


@media screen and (min-width: 768px) {
    .icon-complete {width: 75px; height: 75px;}
    .icon-complete + .title {padding-top: 50px; padding-bottom: 20px;}
    .join-box-wrap.complete .join-box {padding: 50px;}
    .join-box .info-list {gap: 10px 50px;}
    .join-box-wrap.complete .text-area {min-height: auto; max-width: 700px;}
    .join-box .info-list {font-size: 15px;}
    .join-box .info-list>li {gap: 10px;}
    .join-box .info-list>li:before {top: calc(50% - 1px);}
    .join-box .info-list em:before {margin-right: 10px;}
    .join-box-wrap.complete .link-btn.login {min-width: 185px; max-width: 380px;}
    .join-box-wrap.complete .link-btn {min-width: 185px;}
}
@media screen and (min-width: 1200px) {
    .icon-complete {width: 80px; height: 80px;}
    .icon-complete + .title {padding-bottom: 25px;}
    .join-box-wrap.complete .join-box {padding: 60px;}
    .join-box .info-box {padding: 20px;}
    .join-box .info-list {font-size: 16px;}
    .join-box-wrap.complete .btn-area {margin-top: 60px;}
    .join-box-wrap.complete .link-btn.login {max-width: 380px;}
}
/* 회원가입 (준회원) 완료 e*/
/* 회원가입 - 본인인증 s */
.form-container .inner {max-width: 140rem; margin: 0 auto;}
.form-container .title-box {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-bottom: 20px; padding: 0 1.5rem;}
.form-container .sub-title {padding-bottom: 0;}
.form-container .step-wrap {display: flex; gap: 10px;}
.form-container .step-wrap>li {font-weight: 500; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; background-color: #F7F8FB; color: #111;}
.form-container .step-wrap>li.active {background-color: var(--point-color); color: #fff;}
.form-container .infozone {margin-top: 20px;}
.form-container .title-box + .infozone {margin-bottom: 20px; margin-top: 0;}
.form-container .infozone>p {text-indent: -14px; padding-left: 14px;}
.form-container .title-box + .infozone>p {text-indent: 0; padding-left: 0;}
.form-container .title-box + .infozone>p.sub-title {font-weight: 500; text-indent: 0; padding-left: 0; padding-bottom: 10px;}
.join-box .icon-area.phone:before {background-image: url("/_user/support/img/sub/ico-hp.svg");}
.join-box .icon-area.i-pin:before {background-image: url("/_user/support/img/sub/ico-ipin.png");}
@media screen and (min-width: 768px) {
    .form-container .join-box-wrap {max-width: 800px; margin: 0 auto; }
    .form-container .infozone {margin-top: 30px;}
    .form-container .infozone>p {font-size: 15px; text-indent: -15px; padding-left: 15px;}
    .form-container .title-box + .infozone {margin-bottom: 30px;}
    .form-container .title-box + .infozone>p.sub-title {font-size: 18px;}
    .form-container .infozone>span {font-size: 15px;}
}
@media screen and (min-width: 1200px) {
    .form-container .title-box {margin-bottom: 40px;}
    .form-container .infozone {margin-top: 40px;}
    .form-container .infozone>p {font-size: 16px; text-indent: -16px; padding-left: 16px;}
    .form-container .title-box + .infozone {margin-bottom: 40px;}
    .form-container .title-box + .infozone>p {font-size: 18px;}
    .form-container .title-box + .infozone>p.sub-title {font-size: 22px;}
    .form-container .infozone>span {font-size: 16px;}
}
/* 회원가입 - 본인인증 e */
/* 회원가입 - step2 s */
.type-form.join .accordion-wrap {position: static;}
.type-form.join .accordion-wrap + .accordion-wrap {margin-top: 20px;}
.type-form.join .accordion-btn .arrow {flex-shrink: 0;}
.type-form.join .accordion-content>ul>li>span {display: block; padding-bottom: 5px;}
.type-form.join .accordion-content>ul {max-height: 250px;}
.type-form.join .accordion-content ul.text-list,
.type-form.join .accordion-content ul.text-list>li>ul {background: transparent; border: none; margin: 0; padding: 0; border-radius: 0;}
.type-form.join .accordion-content ul.text-list li {margin-bottom: 0; display: flex; flex-wrap: wrap;}
.type-form.join .accordion-content ul.text-list li>ul {margin-top: 5px; padding-left: 10px; width: calc(100% - 10px);}
.type-form.join .accordion-content ul.text-list li+li {padding-top: 5px;}
.agree-top {margin-bottom: 15px; font-size: 1.5rem; padding: 0 1.5rem;}
.agree-top.bookieum {font-size: 16px;}
.agree-top.bookieum>p {display: flex; align-items: baseline;}
.agree-top .check-box input[type="checkbox"] + label {color: #111; font-weight: 600;}
.agree-top .check-box input[type="checkbox"]:checked + label::before {top: 6px;}
.agree-top .check-box input[type="checkbox"] + label:after {top: 2px;}
.type-form.join .custom-scroll::-webkit-scrollbar-thumb {background: var(--black);}
.type-form.join .custom-scroll::-webkit-scrollbar-track {background: transparent;}
/* 컨텐츠 미노출 */
.no-cont .accordion-btn .arrow {display: none;}
.no-cont .accordion-btn {pointer-events: none;}
.no-cont .no-data {border: 1px solid #e5e5e5; height: 50px; display: flex; align-items: center; justify-content: center;}
.no-cont .no-data>p {display: flex; align-items: center; gap: 3px; font-weight: 500; font-size: 16px;}

@media screen and (min-width: 768px) {
    .type-form.join .custom-scroll::-webkit-scrollbar {width: 5px;}
}
@media screen and (min-width: 1200px) {
    .agree-top {margin-bottom: 4rem;}
    .agree-top .check-box input[type="checkbox"]:checked + label::before {top: 9px;}
    .agree-top .check-box input[type="checkbox"] + label:after {top: 4px;}
    .agree-top.bookieum>p .icon.tooltip {top: 3px;}
    .no-cont .no-data {height: 80px;}
    .no-cont .no-data>p {gap: 5px; font-size: 18px;}
    .no-cont .no-data .icon.tooltip {height: 20px; width: 20px;}
}
/* 회원가입 - step2 e */
/* 회원가입 - step3 s */
.form-container .sub-title {display: flex; flex-wrap: wrap; align-items: center; gap: 10px;}
.form-container .sub-title .noti {font-size: 13px; color: #555;}
.apply .input-box.type-btn input {width: 100%;}
.apply .input-box.type-btn button {min-width: 100%; margin-top: 5px;}
.input-box .radio-form {display: flex; gap: 10px; margin-top: 10px;}
.input-box .col3 {display: flex; flex-direction: column; gap: 5px;}
.input-box .noti, .radio-form .noti {width: 100%; display: block; padding-top: 5px;}

@media screen and (min-width: 400px) {
    .apply .input-box.type-btn input:not(input[type="checkbox"]) {width: calc(100% - 105px);}
    .apply .input-box.type-btn button {min-width: 100px; margin-top: 0;}
    .input-box .col3 {flex-direction: row;}
    .input-box .col3>* {width: calc(33.33% - 2.5px);}
}
@media screen and (min-width: 1200px) {
    .apply .input-box.type-btn input:not(input[type="checkbox"]) {width: calc(100% - 145px); margin-right: 10px;}
    .apply .input-box.type-btn button {min-width: 130px;}
    .form-container .sub-title .noti {font-size: 15px;}
    .form-container .join-box-wrap .sub-title {font-size: 21px;}
    .input-box .noti, .radio-form .noti {font-size: 16px; padding-top: 10px;}
}
/* 회원가입 - step3 e */
/* 비밀번호 안전도 s */
.pw-validation {margin-top: 10px; position: relative; font-size: 13px;}
.validate-top {display: flex; justify-content: space-between; gap: 15px;}
.pw-validation .step {display: flex; justify-content: space-between; align-items: center; gap: 10px; width: calc(100% - 45px);}
.pw-validation .step + em {min-width: 60px; text-align: right;}
.pw-validation .step>span {display: block; width: calc(33.33% - 5px); height: 5px; background-color: var(--egray);}
.validation-info {margin-top: 10px;}
.validation-info>li {display: flex; align-items: baseline; gap: 5px;}
.validation-info>li+li {padding-top: 5px;}
.validation-info .ico-check {flex-shrink: 0; width: 13px; height: 10px; display: inline-block; color: transparent; background-color: #555; mask: var(--svg); -webkit-mask: var(--svg); --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='9.902' viewBox='0 0 13 9.902'%3E%3Cpath id='Shape' d='M5.238,10.879A1.536,1.536,0,0,1,4.1,10.4L.813,6.7A1.1,1.1,0,0,1,.582,5.462,1.421,1.421,0,0,1,1.735,4.69a1.553,1.553,0,0,1,1.345.493L5.238,7.641l5.646-6.16A1.553,1.553,0,0,1,12.229.988a1.421,1.421,0,0,1,1.153.772A1.1,1.1,0,0,1,13.152,3L6.372,10.4A1.536,1.536,0,0,1,5.238,10.879Z' transform='translate(-0.482 -0.977)' fill='%23555'/%3E%3C/svg%3E");}

.pw-validation.unsafe .step1 {background-color: #D7373F;}
.pw-validation.unsafe .step + em {color: #D7373F;}
.pw-validation.general .step1, .pw-validation.general .step2 {background-color: #3274D9;}
.pw-validation.general .step + em {color: #555;}
.pw-validation.safe .step1, .pw-validation.safe .step2, .pw-validation.safe .step3 {background-color: #44B556;}
.pw-validation.safe .step + em {color: #44B556;}

.validation-info>li.unsafe {color: #D7373F;}
.validation-info>li.unsafe .ico-check {background-color: #D7373F;}
.validation-info>li.general {color: #3274D9;}
.validation-info>li.general .ico-check {background-color: #3274D9;}
.validation-info>li.safe {color: #44B556;}
.validation-info>li.safe .ico-check {background-color: #44B556;}

@media screen and (min-width: 450px) {
    .pw-validation .step {width: calc(100% - 70px);}
}
@media screen and (min-width: 768px) {
    .pw-validation {margin-top: 15px;}
    .pw-validation .step {width: calc(100% - 105px);}
}
@media screen and (min-width: 1200px) {
    .pw-validation {margin-top: 20px}
}
/* 비밀번호 안전도 e */
/* 회원가입 e */
/* 기존 회원가입 s */
.input-box.multi label.w100 {width: 100%;}
.input-box.multi .col2 {display: flex; gap: 5px; justify-content: space-between}
.input-box.multi .col2>input:first-of-type {width: calc(80% - 2.5px);}
.input-box.multi .col2>input:nth-of-type(2) {width: calc(20% - 2.5px); min-width: 60px;}
@media screen and (min-width: 1200px) {
    .input-box.multi .col2 {gap: 10px;}
}
/* 기존 회원가입 e */

/* 기본 select s */
.sel {width: 100%; height: 55px; padding: 8px 10px; font-size: 1.8rem; border: 1px solid var(--dgray); border-radius: 8px; background: var(--white) url("/_user/support/img/sub/icon_arrow.svg") right 16px center / 13px no-repeat; font-weight: 400;}
@media screen and (min-width: 1024px) {
    .sel {min-width: 130px; font-size: 15px; height: 55px; padding: 15px; background-position: right 15px center; border-radius: 7px;}
}
/* 기본 select e */
/* 신청공간 - 나의 정보 수정 s */
.input-box.email .email-box {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px;}
.input-box.email .email-box input:nth-of-type(2) {width: calc(100% - 20px);}
.input-box.email .email-box select {width: 100%;}
@media screen and (min-width: 400px) {
    .input-box.multi .col3 input:nth-of-type(1) {width: calc(40% - 2.5px);}
    .input-box.multi .col3 input:nth-of-type(2) {width: calc(30% - 2.5px);}
    .input-box.multi .col3 input:nth-of-type(3) {width: calc(30% - 2.5px);}

    .input-box.email .email-box input:nth-of-type(1) {width: calc(50% - 12px);}
    .input-box.email .email-box input:nth-of-type(2) {width: calc(50% - 12px);}
}
@media screen and (min-width: 768px) {
    .input-box.email .email-box input:nth-of-type(1) {width: calc(33.33% - 12px);}
    .input-box.email .email-box input:nth-of-type(2) {width: calc(33.33% - 12px);}
    .input-box.email .email-box select {width: calc(33.33% - 12px);}
}
/* 신청공간 - 나의 정보 수정 e */

/* 오시는 길 s */
.map-api  #map {height: 250px;}
.marker-info {background: #fff; border-radius: 3px; font-weight: 500; padding: 3px 8px; box-shadow: 0 2px 5px rgba(175,175,175,0.5); color: #111; position: relative; top: -52px; border: 1px solid #d3d3d3;}
.marker-info:before {position: absolute; content: ''; z-index: 1; left: 50%; top: 27px; margin-left: -3px; width: 0; height: 0; border-top: 5px solid #fff; border-left: 5px solid transparent; border-right: 5px solid transparent;}
.marker-info:after {position: absolute; content: ''; left: 50%; top: 27px; margin-left: -5px; width: 0; height: 0; border-top: 7px solid #d3d3d3; border-left: 7px solid transparent; border-right: 7px solid transparent;}

@media screen and (min-width: 768px) {
    .map-api  #map {height: 400px;}
}
@media screen and (min-width: 1200px) {
    .map-api  #map {height: 500px;}
}
/* 오시는 길 e */
/* 부가서비스 s*/
.sub-box.rule {}
.sub-inner-box + .sub-inner-box {padding-top: 20px;}
.sub-box.note-box.type-rule .title-list {display: flex; flex-direction:column;  justify-content: space-between;}
.sub-box.note-box.type-rule .title {color: var(--black); font-weight: 700; font-size: 15px; }
.sub-box.note-box.type-rule .sub-tit-list {display:flex; flex-direction:column; font-size: 13px; text-decoration: underline;}
.type-rule .rule-title {color: var(--black); font-weight: bold; padding-bottom: 10px; font-size: 15px;}
.type-rule .rule-text {font-size: 15px;}
.type-rule .rule-text + .rule-text, .type-rule .rule-bullet-list + .rule-text {padding-top: 10px;}
.line-box {padding: 15px; border: 1px solid var(--egray);}
.rule-text + .line-box, .inner .line-box {margin-top: 20px;}
.rule-bullet-list .inner div + ul {padding-top: 10px}
ul.list-auto {padding-left: 15px;}
ul.list-auto>li {list-style: auto;}
ul.rule-num {counter-reset: num 0;}
ul.rule-num.row2 {counter-reset: num 3;}
ul.rule-num.row3 {counter-reset: num 7;}
ul.rule-num>li:before {counter-increment: num 1; content: counter(num) '조. ';}
ul.rule-num>li {text-indent: -20px; padding-left: 20px;}
ul.num {counter-reset: num 0;}
ul.num>li:before {counter-increment: num 1; content: counter(num) '.'; padding-right: 5px;}
ul.circle-num {counter-reset: num 0;}
ul.circle-num>li {display: flex; align-items: baseline;}
ul.circle-num>li:before {counter-increment: num 1; content: counter(num); color: #555; display: inline-flex; justify-content: center; align-items: center; margin-right: 6px; width: 15px; height: 15px; border-radius: 50%; font-size: 13px; font-weight: 500; flex-shrink: 0; border: 1px solid #555;}
ul.rule-bullet-list.circle-num>li:before {position: relative; padding: 1px; box-sizing: border-box; font-weight: 400;}
ul.circle-num.depth2 > li:before {width: 14px; height: 14px; font-size: 12px; top: -1px; line-height: inherit; margin-right: 4px;}

ul.rule-bullet-list.circle > li {display: flex; align-items: baseline;}
ul.rule-bullet-list.circle > li:before {content: ''; position: relative; flex-shrink: 0; top: -3px; display: inline-block; width: 4px; height: 5px; background: blue; border-radius: 50%; margin-right: 8px; background: var(--point-color);}

.rule-text + .rule-bullet-list {padding-top: 15px;}
/*.rule-bullet-list > li+li {padding-top: 10px;}*/
.rule-bullet-list.depth2 {padding: 10px 0 0 10px;}
.rule-bullet-list.depth2>li+li {padding-top: 6px;}
.rule-bullet-list .inner {display: flex; align-items: baseline; flex-wrap: wrap;}
.rule-bullet-list .inner>div {width: calc(100% - 30px);}

@media screen and (min-width: 500px){
    .sub-box.note-box.type-rule .title-list {flex-direction: row;}
    .sub-box.note-box.type-rule .sub-tit-list {gap: 5px;}
}

@media screen and (min-width: 768px){
    .bullet-list.circle-num>li:before {top: -1px;}
}

@media screen and (min-width: 1200px){
    .line-box {padding: 30px;}
    .sub-inner-box + .sub-inner-box {padding-top: 40px;}
    .sub-box.note-box.type-rule .title {font-size: 18px;}
    .sub-box.note-box.type-rule .sub-tit-list {font-size: 16px; gap: 5px;}

    .type-rule .rule-title {font-size: 18px; padding-bottom: 15px;}
    .type-rule .rule-text {font-size: 18px;}

    .rule-bullet-list li {font-size: 18px;}
    ul.list-auto {padding-left: 20px;}
    ul.circle-num>li:before {width: 18px; height: 18px; font-size: 15px; top: -2px;}
    ul.circle-num.depth2>li:before {width: 14px; height: 14px; font-size: 14px; top: 0;}
    .type-rule .rule-title + ul.num {padding-top: 0;}
    ul.num {padding: 15px 0 0 0; font-size: 18px;}
    ul.rule-num>li {text-indent: -30px; padding-left: 30px;}
    .rule-bullet-list.depth2 {padding-left:  15px;}
    .rule-bullet-list.depth2>li {font-size: 16px;}
}
/* 부가서비스 e*/
/* 사이트맵 s*/
.ico-link {display: inline-block; width: 15px; height: 18px; padding-left: 10px;}
.sitemap-wrap .ico-link {width: 15px; height: 15px; display: inline-block; padding-left: 10px;}
.sitemap-wrap .depth1 {display: flex; flex-wrap: wrap; gap: 20px 10px; align-items: flex-start;}
.sitemap-wrap .depth1 .depth1-item {width: 100%; border-radius: 10px; border: 1px solid var(--egray); overflow: hidden;}
.sitemap-wrap .depth1 .depth1-item .site-tit>a {height: 46px; display: flex; align-items: center; justify-content: center; background: transparent linear-gradient(278deg, #3274D9 0%, #063F8B 100%) 0 0 no-repeat padding-box; color: #fff; font-size: 18px; font-weight: bold;}
.sitemap-wrap .depth1 .depth1-item .depth2 li {}
.sitemap-wrap .depth1 .depth1-item .depth2-tit {display: flex; align-items: center; box-sizing: border-box; border-bottom: 1px solid var(--egray); font-weight: 600; color: var(--black);}
.sitemap-wrap .depth1 .depth1-item .depth2-tit>a {display: flex; align-items: center; width: 100%; min-height: 46px; box-sizing: border-box; padding: 15px 10px; color: var(--black); font-weight: 600; color: var(--black);}
.sitemap-wrap .depth1 .depth1-item .depth2-tit>a:hover {text-decoration: underline;}
.sitemap-wrap .depth1 .depth1-item .depth3 {padding: 15px 10px; border-bottom: 1px solid var(--egray); background: #F7F8FB;}
.sitemap-wrap .depth1 .depth1-item .depth3>li>a {color: #555; transition: .3s;}
.sitemap-wrap .depth1 .depth1-item .depth3>li>a:hover {text-decoration: underline;}

@media screen and (min-width: 400px){
    .sitemap-wrap .depth1 .depth1-item {width: calc(50% - 7px);}
}

@media screen and (min-width: 1024px){
    .sitemap-wrap .depth1 .depth1-item .site-tit>a {height: 60px; font-size: 22px;}
    .sitemap-wrap .depth1 .depth1-item .depth2-tit>a {padding: 15px 20px; font-size: 18px;}
    .sitemap-wrap .depth1 .depth1-item .depth3 {padding: 15px 20px; font-size: 15px;}
    .sitemap-wrap .depth1 .depth1-item .depth3>li + li {padding-top: 10px; }
    .sitemap-wrap .depth1 {gap: 40px 45px;}
    .sitemap-wrap .depth1 .depth1-item {width: calc(33% - 29px);}
}
/* 사이트맵 e*/
/* 연혁 s */
.history-wrap .link-btn {min-width: 140px; box-sizing: border-box;  display: inline-block; padding: 13px 0; text-align: center; background-color: var(--point-color); border-radius: 7px; color: var(--white); font-weight: 400; margin: 15px 0 0 15px; transition: .3s;}
.history-wrap .link-btn:hover {background: var(--point-color2);}
.history-wrap .history-tit {padding: 0 20px; margin-bottom: 20px; color: #06750D; font-size: 26px; font-weight: 700; letter-spacing: -0.65px;}
.history-box-wrap {position: relative; margin: 0 30px 30px; padding: 0 0 20px;}
.history-box-wrap:before {content: ''; position: absolute; width: 1px; height: calc(100% - 15px); top: 15px; left: 0; background: #ddd;}
.history-wrap .history-box {padding: 0 20px; margin-bottom: 30px;}
.history-wrap .history-box:last-child {margin-bottom: 0;}

.history-box .year {position: relative; margin-bottom: 14px; color: var(--point-color2); font-weight: bold; letter-spacing: -0.8px; font-size: 22px; padding-left: 15px;}
.history-wrap .year:before {position: absolute; content: ''; left: -27px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border-radius: 50%; border: 3px solid var(--point-color); background: #fff; box-sizing: border-box;}
.history-wrap .year:after {position: absolute; content: ''; left: -15px; top: 50%; transform: translateY(-50%); width: 20px; height: 2px; background: var(--point-color);}

.history-box>ul {padding-left: 15px;}
.history-box>ul>li {display: flex; flex-direction: column; padding-bottom: 16px; letter-spacing: -0.7px;}
.history-box>ul>li:last-child {padding-bottom: 0;}
.history-box .month {color: var(--black); font-weight: bold; font-size: 15px;}
.history-box .desc {padding-top: 5px; font-size: 15px; word-break: keep-all;}

@media screen and (min-width: 1024px){
    .history-wrap .link-btn {min-width: 170px; font-size: 15px; margin: 20px 0 0 40px;}
    .history-wrap {display: flex;}
    .history-box-wrap:before {height: calc(100% - 40px);}
    .history-wrap .history-box {margin-bottom: 70px;}
    .history-box>ul {padding-left: 40px;}
    .history-box>ul>li {flex-direction: row; gap: 25px;}
    .history-box .year {font-size: 28px; margin-bottom: 25px; padding-left: 40px;}
    .history-wrap .year:before {width: 17px; height: 17px;}
    .history-wrap .year:after {left: -12px; width: 30px;}
    .history-box .month {min-width: 95px; max-width: 95px; word-break: keep-all; font-size: 18px;}
    .history-box .desc {font-size: 18px; padding-top: 0;}
}
/* 연혁 e */
/* 조직도 s*/
.organization-wrap {display: flex; flex-direction: column; align-items: center; max-width: 760px; margin: 0 auto;}
.organ-box {position: relative;}
.organ-box .organ-item {position: relative;}
.organ-box .organ-item:before {content: ''; width: 1px; height: 30px; position: absolute; left: 50%; top: -30px; transform: translateX(-50%); background: var(--egray); }
.organ-box .organ-item>a {display: flex; align-items: center; justify-content: center; transition: .3s;}
.organ-box .organ-item>a:hover {background: #EBF4FF;}
.organ-box.floor1 .organ-item:before {top: auto; bottom: -30px;}
.organ-box.floor1 .organ-item>a {width: 90px; height: 90px; border-radius: 100%; background: #09315D url("/_user/support/img/sub/bg-circle.svg") no-repeat center / cover; color: #fff; font-size: 18px; font-weight: 600;}
.organ-box.floor2 {width: 100%; display: flex; justify-content: space-between; padding-top: 58px;}
.organ-box.floor2:before {content: ''; position: absolute; top: 27px; left: 50%; transform: translateX(-50%); width: calc(100% - 100px); height: 1px; background: var(--egray);}
.organ-box.floor2:after {content: ''; position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; background: #fff; border: 3px solid var(--dgray); border-radius: 50%; box-sizing: border-box;}
.organ-box.floor2 .organ-item>a {width: 100px; height: 40px; border: 1px solid #063F8B; border-radius: 4px; font-size: 15px; color: #063F8B;}
.organ-box.floor3 {width: 100%; display: flex; justify-content: space-between; padding-top: 58px;}
.organ-box.floor3:before {content: ''; position: absolute; top: 27px; left: 50%; transform: translateX(-50%); width: calc(100% - 100px); height: 1px; background: var(--egray);}
.organ-box.floor3:after {content: ''; position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; background: #fff; border: 3px solid var(--dgray); border-radius: 50%; box-sizing: border-box;}
.organ-box.floor3 .organ-item>a {width: 100px; height: 40px; border: 1px solid #3274D9; border-radius: 4px; color: #3274D9;}

.organ-box.floor3.col-4:before {width: calc(100% - 75px);}
.organ-box.floor3.col-4 .organ-item>a {width: 75px; text-align: center;}
.info-table {padding-top: 20px;}

@media screen and (min-width: 1024px){
    .sub-box.organization {margin-bottom: 60px;}
    .organ-box .organ-item:before {height: 50px; top: -50px;}
    .organ-box.floor1 .organ-item>a {width: 120px; height: 120px; font-size: 22px;}
    .organ-box.floor1 .organ-item:before {bottom: -50px;}
    .organ-box.floor2 {padding-top: 100px;}
    .organ-box.floor2 .organ-item>a {width: 200px; height: 60px; font-size: 20px;}
    .organ-box.floor2:before {width: calc(100% - 200px); top: 50px;}
    .organ-box.floor2:after {top: 44px;}
    .organ-box.floor3 {padding-top: 100px;}
    .organ-box.floor3 .organ-item>a {width: 200px; height: 60px; font-size: 20px;}
    .organ-box.floor3.col-4 .organ-item>a {width: 180px;}
    .organ-box.floor3.col-4:before {width: calc(100% - 179px);}
    .organ-box.floor3:before {width: calc(100% - 200px); top: 50px;}
    .organ-box.floor3:after {top: 44px;}
}
/* 조직도 e*/
/* process-list s */
.process-list-wrap {padding-top: 15px;}
.process-list>li {position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.process-list>li+li {padding-top: 30px;}
.process-list>li:not(:last-child):after {content: ''; position: absolute; display: block; width: 35px; height: 15px; left: calc(50% - 17px);top: calc(100% + 8px); z-index: 1; transform: rotate(90deg); background: url("/_user/support/img/sub/ico-process-arrow.svg") center no-repeat; background-size: auto 15px;}
.process-list .text-area {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 70px; padding: 15px; box-sizing: border-box; border-radius: 7px; border: 1px dashed var(--egray); font-size: 16px; text-align: center; letter-spacing: -0.3px; word-break: keep-all;}
.process-list .text-area em {width: 100%; color: #666; font-size: 15px; display: block; padding-top: 5px;}
.process-list .text-area .bold {color: var(--black);}
.process-list + .process-list {margin-top: 60px;}

@media screen and (min-width: 768px) {
    .process-list {display: flex; flex-wrap: wrap; gap: 20px 0; justify-content: space-between;}
    .process-list>li {width: calc(25% - 20px); justify-content: flex-start;}
    .process-list.col5>li {width: calc(20% - 20px);}
    .process-list.col3>li {width: 33.33%;}
    .process-list>li+li {padding-top: 0;}
    .process-list>li:not(:last-child):after {width: 30px; height: 13px; background-size: auto 13px; top: 50%; left: auto; right: -28px; transform: rotate(0deg);}
}
@media screen and (min-width: 1024px) {
    .process-list .text-area {margin-top: 20px; font-size: 18px; min-height: 120px;}
    .process-list .text-area span {display: block;}
    .process-list>li:not(:last-child):after {width: 46px; height: 20px; top: 50%; right: -34px; background-size: auto 12px;}
}
/* process-list e */
/* 스마트 도서관 상호대차 s */
.step-box.type2 {}
.step-box.type2 ul li {width: 100%;}
.step-box.type2 ul li .way {flex-direction: column;}
.step-box.type2 em.way-tit {display: block; font-weight: 600; color: var(--black); padding-bottom: 12px;}
.text-box + .noti-text {padding-top: 5px;}
.process-list + .noti-text {padding-top: 10px;}
@media screen and (min-width: 600px) {
    .step-box.type2 ul {display: flex; flex-wrap: wrap; gap: 20px 15px;}
    .step-box.type2 ul li {width: calc(50% - 8px); margin-bottom: 0;}
}
@media screen and (min-width: 768px) {
    .step-box.type2 ul {gap: 30px 20px;}
    .step-box.type2 ul li {width: calc(33.33% - 14px);}
    .step-box.type2 ul li:nth-of-type(n + 4) {width: calc(25% - 15px);}
    .process-list + .noti-text {padding-top: 10px;}
}
/* 스마트 도서관 상호대차 e */


/* 폼 부분 수정 s */
em.hyphen {display: block; padding: 0 3px; text-align: center; line-height: 42px; color: var(--black);}
.check-form.login-search {display: flex; flex-direction: column;}
.check-form.login-search .check-box {display: grid;}
.input-box .a-box {display: flex; gap: 10px;}
@media screen and (min-width: 400px) {
    .check-form.login-search {flex-direction: row;}
    .input-box .a-box {justify-content: flex-start}
}
@media screen and (min-width: 1200px) {
    em.hyphen {padding: 0 6px;}
    .input-box .a-box {display: flex; gap: 20px;}
    .apply .check-form.login-search .check-box input[type="checkbox"] + label:after {top: 1px;}
}
/* 폼 부분 수정 e */
/* 도서관 안내 s */
.floor-tab {display: flex; position: relative; z-index: 1; gap: 3px; padding-bottom: 3px;}
.floor-tab .floor-btn {position: relative; display: flex; box-sizing: border-box; align-items: center; justify-content: center; width: 50px; height: 50px; font-size: 20px; letter-spacing: -0.4px; border-radius: 10px; background: #F2FAFF; border: 1px solid #7DC9FF;}
.floor-tab .floor-btn.txt {font-size: 15px;}
.floor-tab .floor-btn.active {color: #fff; font-weight: bold; background: #3274D9; border-color: #3274D9;}
.floor-tab .floor-btn.active:after {content: ''; position: absolute; left: 50%; top: 49px; margin-left: -7px; width: 0; height: 0; border-top: 8px solid #3274D9; border-left: 7px solid transparent; border-right: 7px solid transparent;}
.floor-info-wrap {background: #fff;}
.floor-info .map-arae {/*padding: 15px; border: 1px solid #d3d3d3;*/ position: relative;}
.floor-info .map-arae>li {display: none;}
.floor-info .map-arae>li.active {display: block;}
.floor-info .map-arae img {width: 100%; background: #fff;}
.facility-info {display: flex; flex-direction: column; gap: 10px;}
.facility-info .top {box-sizing: border-box; padding: 15px 15px 0; overflow: hidden; border-radius: 10px; border: 1px solid #D3D3D3;}
.floor-info {display: none; height: 100%;}
.floor-info.active {display: block;}
.facility-info .more-view {display: flex; padding-top: 30px; flex-direction: column; gap: 5px;}
.facility-info .more-view button {text-align: left; font-size: 13px; width: 100%; border-radius: 15px; background: #fff; box-sizing: border-box; border: 2px solid #fff; box-shadow: 0 2px 0 #c5e0f1; font-weight: 400; display: flex; height: 35px; align-items: center; padding: 0 15px; color: var(--point-color); font-weight: 700;}
.facility-info .more-view button.disabled {pointer-events: none; color: #555; font-weight: normal;}
.facility-info .more-view>li.active button {border-color: #3274D9; color: #3274D9; font-weight: bold;}
.facility-info .more-view button>em {color: #fff; text-align: center; margin-right: 10px; font-size: 11px; min-width: 15px; height: 15px; line-height: 15px; border-radius: 45px; background: #3274D9;}
.facility-info .map-info {display: flex; flex-wrap: wrap; gap: 10px 0; font-size: 13px;}
.facility-info .map-info>li {display: flex; align-items: center; width: 50%;}
.facility-info .map-info img {margin-right: 5px;}
.floor-info .explain {padding: 20px; margin: 20px -15px 0; background: #F2FAFF;}
.floor-info .explain.type2 {background: #fff; margin-top: 0;}
.floor-info .explain.type2 .con {background: #F2FAFF; border-radius: 10px; padding: 15px; box-sizing: border-box;}
.floor-info .list-info {display: grid; grid-template-columns: 1fr; gap: 10px;}
.pictogram img {height: 30px;}
.floor-info .list-info .txt {display: flex; flex-direction: column;}
.floor-info .list-info .txt strong {padding: 10px 0 0; font-size: 16px; color: #111;}
.floor-info .list-info .txt span {display: flex; margin-top: 3px;}
.floor-info .list-info .txt span:before {content: ''; display: block; min-width: 3px; height: 3px; border-radius: 45px; background: #3274D9; margin-top: 8px; margin-right: 5px;}
.floorplan-slide-wrap {display: none;}
.floorplan-slide-wrap.active {display: block;}
.floorplan-slide-wrap .top {border-radius: 0; border: none; padding: 0; font-size: 15px;}
.floorplan-slide-wrap .top>p {padding-top: 10px; font-weight: 500;}
.floorplan-slide-wrap>div {display: none; padding-top: 40px;}
.floorplan-slide-wrap>div.active {display: grid;}
.floorplan-slide-wrap .slide-tit {display: flex; align-items: center; font-size: 22px; gap: 5px; letter-spacing: -0.4px; color: #3274D9;}
.floorplan-slide-wrap .slide-tit>span {margin-right: 5px; width: 50px; height: 50px; padding: 8px; border-radius: 45px; border: 2px solid #3274D9; box-sizing: border-box; display: flex; align-items: center; justify-content: center;}
.floorplan-slide-wrap .slide-tit>span img {max-width: 100%;}
.floorplan-slide-wrap .slide-tit>em {width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 14px; font-weight: 300; line-height: 1; background: #3274D9; border-radius: 45px;}
.floorplan-slide-wrap .slide-info {padding-top: 20px;}
.floorplan-slide-wrap .slide-info .dl {display: flex; flex-direction: column; padding-top: 15px;}
.floorplan-slide-wrap .slide-info .dt {display: flex; align-items: center; font-weight: bold; color: #111; font-size: 15px;}
.floorplan-slide-wrap .slide-info .dt:before {content: ''; width: 5px; height: 5px; border-top: 2px solid #4C88E1; border-right: 2px solid #4C88E1; margin-top: -2px; margin-right: 5px; transform: rotate(45deg);}
.floorplan-slide {overflow: hidden; border-radius: 10px; margin-top: 30px;}
.floorplan-slide .swiper {position: relative;}
.floorplan-slide img {width: 100%;}
.floorplan-slide .swiper-button-prev, .floorplan-slide .swiper-button-next {width: 36px; height: 36px; border-radius: 45px; background: rgba(255,255,255,0.8) url('/_user/support/img/sub/ico-next-slide.png') 50%/10px no-repeat; backdrop-filter: blur(13px);}
.floorplan-slide .swiper-button-prev {background-image: url('/_user/support/img/sub/ico-prev-slide.png');}
.floorplan-slide .swiper-pagination {width: 70px; height: 30px; left: 50%; margin-left: -35px; color: #111; border-radius: 45px; display: flex; gap: 5px; align-items: center; justify-content: center; font-size: 13px; font-weight: bold; background: rgba(255,255,255,0.7);}
.floorplan-slide .swiper-pagination .swiper-pagination-current {color: #3274D9;}

.btn-img-popup {position: absolute; left: 0; bottom: 0; background: #3274D9 url('/_user/support/img/sub/icon-zoomin.png') 50% no-repeat; text-indent: -9999px; width: 36px; height: 36px;}
.bigimg-popup {display: none; position: fixed; padding-top: 40px; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 100; width: 90%; height: 400px; overflow: hidden;}
.bigimg-popup .btn-close {position: absolute; right: 0; top: 0; width: 40px; height: 40px; background: #000;}
.bigimg-popup .btn-close:before {content: ''; position: absolute; left: 20px; top: 7px; width: 1px; height: 25px; background: #fff; transform: rotate(45deg);}
.bigimg-popup .btn-close:after {content: ''; position: absolute; left: 20px; top: 7px; width: 1px; height: 25px; background: #fff; transform: rotate(-45deg);}
.bigimg-popup>div {overflow: auto; height: 100%; background: #fff;}

@media screen and (min-width: 360px) {
    .floor-info .more-view {flex-direction: row; flex-wrap: wrap;}
    .floor-info .more-view>li {width: calc(50% - 2.5px);}
    .floor-info .more-view button {height: 48px;}
    .facility-info .more-view button>em {min-width: 20px; height: 20px; line-height: 20px; font-size: 13px;}
}
@media screen and (min-width: 500px) {
    .facility-info .map-info>li {width: 33.33%;}
    .facility-info .more-view {gap: 8px;}
    .floor-info .more-view>li {width: calc(50% - 4px);}
}
@media screen and (min-width: 768px) {
    .facility-info .top {display: grid; grid-template-columns: 70px 5fr; position: relative; padding: 25px 25px 25px 15px;}
    .facility-info .top>p {grid-column: span 2; font-size: 15px;}
    .floor-tab {flex-direction: column; gap: 5px;}
    .floor-tab .floor-btn {width: 70px; height: 70px; font-size: 26px; padding-bottom: 0;}
    .floor-tab .floor-btn.txt {font-size: 18px;}
    .floor-tab .floor-btn.active:after {top: 50%; right: -11px; left: auto; margin-top: -9px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: none; border-left: 12px solid #3274D9;}
    .floor-info-wrap {padding-left: 3px;}
    .floor-info.active {display: flex; justify-content: space-between;}
    .floor-info .explain {margin: 0; box-sizing: border-box; min-width: 230px; width: 230px;}
    .floor-info .explain.type2 {width: 100%; padding: 0 0 0 20px;}
    .floor-info .explain.type2 .con {padding: 40px; font-size: 15px;}
    .floor-info .list-info .pictogram {white-space: nowrap;}
    .floor-info .list-info .txt strong {font-size: 18px; padding-top: 0;}
    .floor-info .list-info .txt span:before {margin-top: 9px;}
    .floor-info .explain .con {height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
    .floor-info .list-info {grid-template-columns: 1fr 1fr; gap: 30px 20px;}
    .floor-info .list-info>li {display: flex; align-items: baseline; gap: 15px;}
    .floor-info .list-info .col-span2 {grid-column: span 2;}
    .facility-info .map-info>li {width: 100%;}
    .more-view.sticky {position: fixed; top: 50px; width: 100%;}
    .floor-info .more-view {flex-direction: column; z-index: 1;}
    .floor-info .more-view>li {width: 100%;}
    .floor-info .more-view button {width: 190px; height: 40px; font-size: 15px;}
    .facility-info .bottom {grid-column: span 2;}
    .floorplan-slide-wrap .top {display: block; padding: 0 0 0 30px;}
    .floorplan-slide-wrap .top>p {font-size: 18px;}
    .floorplan-slide-wrap .top:before {content: ''; position: absolute; left: 0; right: 0; top: 26px; height: 1px; background: #d3d3d3;}
    .floorplan-slide-wrap .top:after {content: ''; position: absolute; left: 0; top: 25px; height: 2px; width: 30px; background: #3274D9;}
    .floorplan-slide-wrap .slide-tit {width: fit-content; background: #fff; padding-right: 20px; position: relative}
    .floorplan-slide-wrap>div.active {display: block;}
    .floorplan-slide {width: calc(100% - 280px); position: relative; left: 30px;}
    .floorplan-slide-wrap .slide-info {margin-top: 40px; padding: 0 30px; border-top: 1px solid #D3D3D3; font-size: 15px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px;}
    .floorplan-slide-wrap .slide-info .dt {font-size: 18px;}
    .floorplan-slide-wrap .slide-info .dd>em {display: block;}
}
@media screen and (min-width: 1024px) {
    .floorplan-slide {width: calc(100% - 280px);}
}
@media screen and (min-width: 1200px) {
    .facility-info .map-info>li {width: 100%;}
    .more-view.sticky {position: fixed; top: 140px; width: 100%;}
    .floorplan-slide-wrap .top {padding-left: 50px;}
    .floorplan-slide-wrap .top:before {top: 31px;}
    .floorplan-slide-wrap .top:after {width: 50px; top: 30px;}
    .floorplan-slide {width: calc(100% - 300px); left: 50px; margin-top: 50px;}
    .floorplan-slide-wrap .slide-tit {font-size: 28px;}
    .floorplan-slide-wrap .slide-tit>span {width: 60px; height: 60px; margin-right: 15px;}
    .floorplan-slide-wrap .slide-tit>em {width: 25px; height: 25px; line-height: 25px; font-size: 18px;}
    .floorplan-slide-wrap .slide-info {margin-top: 60px; padding: 30px 50px 0; gap: 0 40px;}
    .floorplan-slide-wrap .slide-info .dl {flex-direction: row; align-items: flex-start;}
    .floorplan-slide-wrap .slide-info .dt {white-space: nowrap; padding-right: 10px;}
    .floorplan-slide-wrap .slide-info .dd {padding-top: 3px;}
    .pictogram img {height: 45px;}
    .floor-info .explain.type2 .con {padding: 55px;}
    .floor-info .explain.type2 .con {position: relative;}
    .floor-info .explain.type2 .con:before {content: ''; position: absolute; right: 0; bottom: 0; width: 326px; height: 143px; background: url("/_user/support/img/sub/deco-book-w.svg"); background-size: 326px 143px;}
    .floor-info .list-info {gap: 40px 30px; position: relative; }
    .floor-info .list-info>li {gap: 40px;}
    .floor-info .list-info .txt span {margin-top: 7px;}
}
/* 도서관 안내 e */
/* 모바일회원증 s */
.m-card-wrap .tit {font-size: 18px; text-align: center; color: var(--black); font-weight: 600; padding-bottom: 10px;}
.m-card-wrap .top {margin: 0 auto;}
.m-card-wrap .barcode-area .txt-box {border-radius: 10px 10px 0 0; background: var(--point-color); color: #fff; padding: 17px; text-align: center;}
.m-card-wrap .barcode-area .name {color: #fff; font-size: 16px; font-weight: 500;}
.m-card-wrap .barcode-area .number {padding-top: 8px; font-size: 12px;}
.m-card-wrap .barcode-box {display: flex; justify-content: center; padding: 20px; border: 1px solid #d3d3d3; border-radius: 0 0 10px 10px;}
.m-card-wrap .barcode-box img {width: 100%; max-width: 180px;}
.m-card-wrap .bottom {max-width:800px; margin: 0 auto; background: #f7f8fb; border-radius: 4px; padding: 13px 40px; margin-top: 20px; font-size: 15px;}
.m-card-wrap .bottom>ul {display: flex; flex-wrap: wrap; justify-content: center; color: var(--black); font-weight: 600;}
.m-card-wrap .bottom>ul li+li:before {display: inline-block; content: ''; width: 1px; height: 11px; margin: 0 10px; background: #ddd;}

@media all and (min-width: 1024px){
    .m-card-wrap .top {max-width: 400px;}
    .m-card-wrap .tit {font-size: 24px;}
    .m-card-wrap .barcode-area .name {font-size: 20px;}
    .m-card-wrap .barcode-area .number {font-size: 15px;}
    .m-card-wrap .barcode-box {padding: 30px;}
    .m-card-wrap .barcode-box img {max-width: 260px;}
    .m-card-wrap .bottom {margin-top: 40px; font-size: 18px; padding: 20px 40px;}
}
/* 모바일회원증 e */



/* 이용안내 s */
.use-info-wrap .top-area {display: flex; flex-direction: column; gap: 20px;}
.use-info-wrap .closed-days-box {position: relative; border-radius: 15px; background: #EBF5FF; padding: 25px 20px; word-break: keep-all;}
.use-info-wrap .closed-days-box:before {content: ''; position: absolute; top: 25px; right: 25px; width: 115px; height: 50px; background: url("/_user/support/img/sub/deco-book-w.svg") no-repeat; background-size: cover; }
.use-info-wrap .closed-days-box .notice-box {position: relative; z-index: 1; padding: 8px; border-radius: 50px 50px 0 50px; background: var(--point-color); color: #fff; text-align: center; font-size: 20px; font-weight: bold;}
.use-info-wrap .closed-days-box .notice-box .txt em {font-size: 16px; font-weight: bold; vertical-align: initial;}
.use-info-wrap .closed-days-box>ul {max-width: 328px; padding-top: 15px; color: #111;}
.use-info-wrap .closed-days-box .link-btn>a {display: flex; justify-content: center; align-items: center; width: 107px; height: 35px; border-radius: 25px; background: var(--point-color); color: #fff; margin: 15px auto 0;}
.use-info-wrap .closed-days-box .ico-arrow {display: inline-block; width: 18px; height: 9px; background: url(/_user/support/img/main/ico-arrow-right-w.svg) 100% no-repeat;}
.use-info-wrap .closed-days-box .notice {text-align: center; font-size: 18px; font-weight: 600; color: #04293E;}
.use-info-wrap .closed-days-box .notice span {display: block; color: var(--point-color); font-size: 12px;}
.use-info-wrap .closed-days-box .closed-days {display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; max-width: 328px; margin: 0 auto; font-weight: 600;}
.use-info-wrap .closed-days-box .closed-days>li {display: flex; align-items: center; justify-content: center; width: calc(25% - 5px); text-align: center; border-radius: 5px; background: #fff; box-shadow: 0 2px 6px #AAB5C833;}
.use-info-wrap .usetime-box {padding: 25px 20px; border-radius: 10px; border: 1px solid var(--egray); }
.use-info-wrap .usetime-box ul {display: flex; overflow: hidden; flex-wrap: wrap; justify-content: center;}
.use-info-wrap .usetime-box ul>li {position: relative; display: flex; justify-content: center; width: fit-content; min-width: 50%; align-items: center; padding: 15px 0; box-sizing: border-box; gap: 6px; text-align: center;}
.use-info-wrap .usetime-box ul>li:after {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 300%; height: 1px; background: var(--egray);}
.use-info-wrap .usetime-box .info-zone {display: flex; min-width: fit-content; align-items: center; gap: 6px; text-align: center;}
.use-info-wrap .usetime-box ul>li:last-of-type {border-bottom: none;}
.use-info-wrap .usetime-box ul.type2>li.txt {width: 100%; text-align: left;}
.use-info-wrap .usetime-box ul>li img {width: 25px;}
.use-info-wrap .usetime-box ul>li .bg-circle {width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background: #F7F8FB; border-radius: 100%;}
.use-info-wrap .usetime-box ul>li .text {font-weight: bold; padding: 0 10px; min-width: 95px; width: 95px;}
.use-info-wrap .usetime-box ul.type2>li.txt .text {padding: 0; width: 100%;}
.use-info-wrap .usetime-box ul>li .text>p {color: var(--point-color); font-size: 14px; }
.use-info-wrap .usetime-box ul>li .day {padding-top: 5px; display: inline-block; color: var(--black);  font-weight: 600; font-size: 13px; word-break: keep-all;}
.use-info-wrap .usetime-box ul>li .time {display: block; padding-top: 5px; color: var(--black); font-size: 13px; word-break: keep-all; font-weight: bold}
.use-info-wrap .bullet-list li:not(:last-child) {margin-bottom: 10px;}

@media all and (min-width: 620px){
    .use-info-wrap .usetime-box ul {justify-content: flex-start;}
    .use-info-wrap .usetime-box ul>li {min-width: 33.33%; padding: 10px 0 20px;}
    .use-info-wrap .usetime-box ul.col3>li {padding-bottom: 10px;}
    .use-info-wrap .usetime-box ul.col4>li {min-width: 50%;}
    .use-info-wrap .usetime-box ul.col4>li:nth-of-type(n+3), .use-info-wrap .usetime-box ul>li:nth-of-type(n+4) {padding: 20px 0 0;}
    .use-info-wrap .usetime-box ul.col3>li:after, .use-info-wrap .usetime-box ul>li:nth-of-type(n+4):after, .use-info-wrap .usetime-box ul.col4>li:nth-of-type(n+3):after {display: none;}
    .use-info-wrap .usetime-box ul>li .text {width: auto;}
}
@media all and (min-width: 768px){
    .use-info-wrap .top-area {flex-direction: row;}
    .use-info-wrap .closed-days-box {width: 30%;}
    .use-info-wrap .usetime-box {min-width: 480px; width: 70%; box-sizing: border-box;}
    .use-info-wrap .usetime-box .info-zone {gap: 0;}
    .use-info-wrap .usetime-box ul>li {min-width: 33.33%;}
    .use-info-wrap .usetime-box ul>li .text {min-width: auto;}
}
@media screen and (min-width: 1024px){
    .use-info-wrap .closed-days-box, .use-info-wrap .usetime-box {padding: 25px 30px;}
    .use-info-wrap .usetime-box ul.col3, .use-info-wrap .usetime-box ul.col4 {padding-top: 20px;}
    .use-info-wrap .usetime-box ul.col4 {flex-wrap: nowrap; justify-content: center;}
    .use-info-wrap .usetime-box ul.col4>li {min-width: 25%; padding: 10px 0 0;}
    .use-info-wrap .usetime-box ul.col4>li:nth-of-type(n+3) {padding: 10px 0 0;}
    .use-info-wrap .usetime-box ul.col4>li:after {display: none;}
    .use-info-wrap .usetime-box ul.type2>li.txt {padding-left: 30px; min-width: 50%;}
}
@media screen and (min-width: 1200px){
    .use-info-wrap .top-area {gap: 3%;}
    .use-info-wrap .closed-days-box {max-width: 280px; box-sizing: border-box; padding: 40px 30px 30px; border-radius: 20px;}
    .use-info-wrap .closed-days-box:before {top: 30px; right: 10px; width: 155px; height: 68px;}
    .use-info-wrap .closed-days-box>ul {padding-top: 25px; font-size: 15px;}
    .use-info-wrap .usetime-box ul.col3, .use-info-wrap .usetime-box ul.col4 {padding-top: 0;}
    .use-info-wrap .usetime-box.youth ul {overflow: auto; justify-content: flex-start; padding-bottom: 10px;}
    .use-info-wrap .closed-days-box .closed-days {max-width: 269px; padding-top: 20px; font-size: 16px; gap: 10px;}
    .use-info-wrap .closed-days-box .link-btn>a {width: 140px; height: 46px; margin: 30px auto 0; font-size: 16px;}
    .use-info-wrap .closed-days-box .notice-box {padding: 10px 30px; font-size: 24px;}
    .use-info-wrap .closed-days-box .notice-box .txt em {font-size: 20px;}
    .use-info-wrap .closed-days-box .notice {font-size: 24px;}
    .use-info-wrap .closed-days-box .notice span {font-size: 15px}
    .use-info-wrap .usetime-box {min-width: 600px; padding: 40px 30px; border-radius: 20px;}
    .use-info-wrap .usetime-box ul {flex-wrap: nowrap; justify-content: center;}
    .use-info-wrap .usetime-box ul>li {width: 100%; min-width: auto; padding: 0;}
    .use-info-wrap .usetime-box ul>li + li {border-left: 1px solid var(--egray);}
    .use-info-wrap .usetime-box ul>li:nth-of-type(n+4) {padding: 0;}
    .use-info-wrap .usetime-box ul>li:after {display: none;}
    .use-info-wrap .usetime-box .info-zone {flex-direction: column; gap: 15px; height: 100%; width: 100%;}
    .use-info-wrap .usetime-box.youth .info-zone {min-width: 130px;}
    .use-info-wrap .usetime-box ul>li:first-of-type {padding-left: 0; border-left: none;}
    .use-info-wrap .usetime-box ul>li:last-of-type {padding-right: 0;}
    .use-info-wrap .usetime-box ul>li.type2 {padding-left: 30px;}
    .use-info-wrap .usetime-box ul>li .bg-circle {width: 60px; height: 60px;}
    .use-info-wrap .usetime-box ul>li img {width: 35px;}
    .use-info-wrap .usetime-box ul>li .text {padding: 0 20px;}
    .use-info-wrap .usetime-box ul>li .text>p {font-size: 16px;}
    .use-info-wrap .usetime-box ul>li .time {padding-top: 8px;}
}
/* 이용안내 e */
/* 이용안내 하단 s */
.use-info-wrap .accordion-wrap {border-radius: 10px; border: 1px solid var(--egray); margin-bottom: 15px;}
.use-info-wrap .accordion-wrap:last-of-type {margin-bottom: 0;}
.use-info-wrap .accordion-btn {display: flex; justify-content: space-between; width: 100%; padding: 15px 20px; box-sizing: border-box;}
.use-info-wrap .accordion-content {padding: 0 15px 20px;  border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-sizing: border-box;}
.use-info-wrap.show {border: 1px solid var(--egray); border-radius: 10px; padding-top: 15px; box-sizing: border-box;}
.use-info-wrap.show .accordion-wrap {border: none; margin-bottom: 0;}
.use-info-wrap.show .accordion-content {background-color: var(--white);}
.tab-wrap.m-scroll .use-info-wrap .inner-title {color: var(--black);}
.use-info-list {border-top: 1px solid var(--black); padding-top: 20px;}
.use-info-list>li {display: flex; align-items: baseline; margin-bottom: 10px; flex-wrap: wrap;}
.use-info-list>li .list-tit {min-width: 90px; padding-right: 10px; display: flex; align-items: baseline; color: var(--black); font-weight: 500; padding-bottom: 5px;}
.use-info-list>li .list-tit + .list-cont {padding-left: 10px;}
.use-info-list>li .list-cont {width: 100%; display: flex; align-items: baseline; flex-wrap: wrap; }
.use-info-list>li .list-cont>p {width: calc(100% - 15px);}
.use-info-list>li .list-cont em {display: inline-block;}
.use-info-list>li .list-cont .bullet-clamp + p ~ p {padding-left: 10px;}
.tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow {border: none; background: url("/_user/support/img/sub/icon_select_arrow.svg") no-repeat; background-size: 17px;}
.tab-wrap.m-scroll .use-info-wrap .accordion-btn.on .arrow {transform: rotate(180deg);}
.tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow:before, .tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow:after {content: none;}

.use-info-list .number {counter-increment: num 1;}
.use-info-list .number:before {content: counter(num);}

.use-info-list>li .list-cont .rule-bullet-list {padding-left: 10px;}

@media screen and (min-width: 768px){
    .use-info-list>li {flex-wrap: nowrap;}
    .use-info-list>li .list-tit {padding-bottom: 0;}
    .use-info-list>li .list-tit.fit {min-width: fit-content; padding-right: 30px;}
}

@media screen and (min-width: 1200px){
    .use-info-wrap .accordion-wrap {margin-bottom: 30px;}
    .use-info-wrap .accordion-btn {padding: 30px 40px;}
    .tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow {width: 24px; height: 24px;}
    .tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow::before {width: 6px; height: 6px; position: relative; top: 1px;}
    .tab-wrap.m-scroll .use-info-wrap .accordion-btn.on .arrow::before {top: -1px;}
    .use-info-wrap .accordion-content {padding: 0 40px 40px;}
    .use-info-wrap.show {display: flex; flex-wrap: wrap; padding-top: 50px; gap: 40px;}
    .use-info-wrap.show .default-option-box {width: calc(40% - 40px); padding-left: 40px;}
    .use-info-wrap.show .detail-option-box {width: calc(60% - 40px); padding: 0 40px 0 0;}
    .use-info-wrap-button {width: 100%;}
    .use-info-wrap.show .accordion-wrap {margin-bottom: 40px;}
    .use-info-wrap.show .accordion-wrap:last-of-type {margin-bottom: 0;}
    .use-info-wrap.show .accordion-content {padding: 0;}
    .use-info-wrap.show .check-form.choice ul {gap: 10px;}
    .use-info-wrap.show .check-form.choice.col03 ul li {width: calc(33.3% - 7px);}
    .use-info-wrap.show .check-box.choice input[type="checkbox"] + label {padding: 12px 0; font-size: 14px;}
    .use-info-wrap.show .accordion-btn {padding: 0 0 20px 0;}
    .use-info-wrap.show .check-form.choice.col02 ul li {width: calc(50% - 5px);}
    .use-info-list {padding-top: 30px;}
    .use-info-list>li {font-size: 18px;}
    .use-info-list>li .list-tit {min-width: 160px;}
    .use-info-list>li .list-tit + .list-cont {padding-left: 0;}
    .tab-wrap.m-scroll .use-info-wrap .inner-title {font-size: 22px;}
    .tab-wrap.m-scroll .use-info-wrap .accordion-btn .arrow {background-size: 20px;}
}
@media screen and (min-width: 1500px){
    .use-info-list>li .list-tit {min-width: 170px;}
}
/* 이용안내 하단 e */
/* 버튼 수정 s*/
.apply .input-box.type-btn label.btn {display: inline-flex; color: #fff; font-weight: normal; cursor: pointer; margin-left: 5px;}
.apply .input-box.type-btn button.delete {display: inline-flex; align-items: center; justify-content: center; position: relative; padding: 0; width: 18px; min-width: auto; min-height: auto; height: 18px; border-radius: 100%; background: #D7373F url("/_user/support/img/sub/ico-delete.svg") no-repeat center; background-size: 10px; margin-left: 5px;}
.apply .input-box.text {display: block;}
.upload-file-wrap {padding-bottom: 10px;}
.upload-file {padding-bottom: 5px;}
.apply .input-box .file-box {display: flex;}
.apply .input-box .file-box label, .apply .file-box .inner-title {display: inherit;}
.apply .input-box.type-btn input.screen-out {width: 0; padding: 0; margin: 0; border: none;}
@media screen and (min-width: 1200px){
    .apply .input-box.type-btn label.btn {min-width: 130px;}
}
/* 버튼 수정 e*/

.filter-btn-wrap {display: flex; padding-bottom: 30px;}
.filter-btn-wrap>li.on>button {color: var(--black); border-color: var(--point-color);}
.filter-btn-wrap>li>button {color: #555; line-height: 1; border-bottom: 3px solid #F4F4F4; width: 100%; padding: 0 10px; height: 50px; display: flex; align-items: center; justify-content: center;}
@media screen and (min-width: 500px){
    .filter-btn-wrap>li {min-width: 120px;}
}
@media screen and (min-width: 1200px){
    .filter-btn-wrap>li {min-width: 170px;}
    .filter-btn-wrap>li>button {height: 60px; border-bottom-width: 4px;}
}

/* 회원증 발급 s */
.inner-bullet-list {display: flex; flex-wrap: wrap; gap: 10px;}
.inner-bullet-list>li {display: flex; align-items: baseline; width: 100%; font-size: 14px;}
.issuance-info-box-wrap {position: relative; margin-top: 60px; border-radius: 10px; border: 1px solid var(--egray); padding: 50px 20px 20px; margin-bottom: 5px;}
.issuance-info-box-wrap .img-box {position: absolute; top: -37px; left: 50%; transform: translateX(-50%); width: 70px; height: 70px; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: #f7f8fb; border: 1px solid var(--egray);}
.issuance-info-box-wrap .img-box img {width: 40px;}
.issuance-download-box {display: flex; gap: 10px;}
.paragraph-list .bullet-title-s + .issuance-download-box>li {flex-direction: column; width: 50%; border-radius: 10px; border: 1px solid var(--egray); margin-bottom: 0; align-items: center; padding: 30px 10px;}
.issuance-download-box>li .tit {padding: 5px 10px; border-radius: 17px; text-align: center; line-height: 1.2; height: 34px; box-sizing: border-box; color: #fff; display: flex; align-items: center; justify-content: center;}
.issuance-download-box>li .tit.android {background: #007E64;}
.issuance-download-box>li .tit.ios {background: #09315D;}
.issuance-download-box>li img {width: 80px; max-width: 100%}
.paragraph-list .bullet-title-s + .issuance-location-box {display: flex; flex-wrap: wrap; padding-left: 0;}
.paragraph-list .bullet-title-s + .issuance-location-box>li {position: relative; width: 50%; display: flex; align-items: center; flex-direction: column; margin-bottom: 20px;}
.issuance-location-box>li .tit {position: relative; display: flex; justify-content: center; align-items: center; height: 45px; box-sizing: border-box; color: #fff; min-width: 140px; border: 4px solid #ADC7F0; border-radius: 28px; background: var(--point-color); font-weight: 600;}
.issuance-location-box>li:nth-of-type(even) .tit {background: #063F8B;}
.issuance-location-box>li:before {content: ''; width: 100%; height: 1px; position: absolute; top: 19px; background: var(--point-color);}
.issuance-location-box .cont {padding-top: 15px; font-size: 15px;}
@media screen and (min-width: 400px){
    .issuance-download-box>li .tit {min-width: 130px;}
}
@media screen and (min-width: 1024px){
    .issuance-info-box-wrap {margin: 20px 0 15px;}
    .issuance-info-box-wrap {display: flex; gap: 30px; border: none; padding: 0;}
    .issuance-info-box-wrap .img-box {position: static; width: 24%; height: auto; transform: none; border-radius: 20px; max-width: 240px;}
    .issuance-info-box-wrap .img-box img {width: 70px;}
    .inssuance-list-box {width: 76%; border: 1px solid var(--egray); border-radius: 20px; padding: 40px; box-sizing: border-box;}
    .issuance-download-box {gap: 40px;}
    .issuance-location-box .cont {font-size: 18px;}
    .issuance-download-box>li img {width: 100px;}
    .issuance-download-box>li .tit {margin-top: 10px; font-size: 15px; padding: 10px 20px;}
    .paragraph-list .bullet-title-s + .issuance-location-box>li {width: 25%; margin-bottom: 40px;}
    .issuance-location-box>li .tit {min-width: 160px; padding: 0 16px; height: 50px; font-size: 16px;}
}

@media screen and (min-width: 1200px){
    .inner-bullet-list>li {font-size: 18px;}
    .inner-bullet-list>li {}
    .inner-bullet-list>li .tit {padding: 10px; border-radius: 17px; min-width: 130px; box-sizing: border-box;}
}
/* 회원증 발급 e */

.paragraph-list.border {border-top: 1px solid var(--black);}
.notice-closed-wrap img {width: 100%;}
.notice-closed-wrap img.pc {display: none;}
@media screen and (min-width: 768px){
    .notice-closed-wrap img.mob {display: none;}
    .notice-closed-wrap img.pc {display: block;}
}

/* check-box list */
.data-search-wrap .control {display: flex; gap: 5px; padding-top: 15px;}
.data-search-wrap .control .btn-state {width: 100%; height: 36px; display: flex; align-items: center; justify-content: center; border: 1px dashed #555; background-color: #fff;}
.data-search-wrap .control .btn-state.all {color: #fff; border-color: #003A7A; background: #003A7A;}
.data-search-wrap .control .btn-state.black {color: #fff; border-color: #111; background: #111;}
.book-list .chk .item {position: relative; padding-top: 45px; overflow: hidden;}
.book-list .chk .check-box {position: absolute; left: 0; top: 0; width: 100%;}
.book-list .chk .check-box label {display: block; padding: 0; height: 35px; background: var(--egray);}
.book-list .chk .check-box input[type="checkbox"] {position: absolute;}
.book-list .chk .check-box input[type="checkbox"] + label:after {background-color: #fff; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.book-list .chk .check-box input[type="checkbox"]:checked + label:before {left: 50%; top: 48%; transform: translate(-50%,-50%) rotate(-45deg);}
.book-list .chk .check-box input[type="checkbox"]:checked + label {background-color: var(--point-color);}
.book-list .chk .check-box input[type="checkbox"]:checked + label:after {background-color: var(--point-color);}

.book-memo-layer {display: none; position: absolute; right: 25px; width: 200px; border-radius: 4px; overflow: hidden; z-index: 50; background: #fff; box-shadow: 0 3px 5px rgba(0,0,0,0.3);}
.memo-top {display: flex; justify-content: space-between; align-items: center; background: #02845C; color: #fff; padding: 0 12px;}
.book-memo-layer .memo-close {text-indent: -9999px; width: 39px; height: 39px; position: relative; margin-right: -12px;}
.book-memo-layer .memo-close>span {display: block; width: 2px; height: 16px; background: #fff; transform: rotate(-45deg); position: absolute; right: 17px; top: 11px;}
.book-memo-layer .memo-close>span:before {content: ''; position: absolute; left: -7px; top: 7px; width: 16px; height: 2px; background: #fff;}
.book-memo-layer .memo-con {font-size: 13px; color: #666; padding: 12px;}
.book-memo-layer .memo-con>textarea {width: 100%; border-radius: 4px; border: 1px solid var(--egray); resize: none; overflow-y: auto; max-height: 120px; box-sizing: border-box;}
.book-memo-layer .memo-con textarea {padding: 10px;}
.book-memo-layer .save-btn {width: 100%; background: #02845C; color: #fff; line-height: 30px; border-radius: 4px; margin-top: 20px;}

@media screen and (min-width: 360px){
    .book-memo-layer {width: 300px;}
}
@media screen and (min-width: 1024px){
    .select-btn-wrap {position: relative;}
    .select-btn-wrap.type2 {padding: 20px 30px; min-height: 90px; box-sizing: border-box;}
    .select-btn-wrap .select-form {max-width: 400px;}
    .data-search-wrap .control {gap: 10px; position: absolute; right: 20px; top: 25px; padding: 0;}
    .data-search-wrap .control .btn-state {height: 40px; min-width: 110px; font-size: 16px;}
    .book-list .chk .item {padding-top: 20px; padding-left: 55px;}
    .book-list .chk .check-box {width: 55px; height: 100%; display: flex; align-items: center; justify-content: center;}
    .book-memo-layer {width: 306px;}
}
@media screen and (min-width: 1200px){
    .book-list .chk .item {padding-left: 70px;}
    .book-list .chk .check-box {width: 50px; padding-left: 15px;}
}

/*서버중단 및 오류 페이지*/
.wrap {height: 100%; box-sizing: border-box; padding: 20px;}
.error-wrap {position: relative; line-height: 1.5; background-color: #fff; padding: 50px 0; min-width: 320px; min-height: calc(100% - 100px); display: flex; align-items: center; justify-content: center; color: #000; font-size: 15px; flex-direction: column;}
.logo-2 {position: absolute; z-index: 10; left: 0; top: 0; width: 100%; box-sizing: border-box; padding: 25px 20px;}
.logo-2>a {display: inline-block;}
.logo-2 img {width: 131px;}
.error-wrap .error {padding: 0 0 30px;}
.error-wrap.renewal {padding-top: 30px; min-height: calc(100% - 80px);}
.error-wrap.renewal .logo-2 {padding-bottom: 30px; width: 180px; position: static;}
.error-wrap.renewal .error {padding: 30px 0; margin: 0 20px; border-top: 1px solid var(--dgray); border-bottom: 1px solid var(--dgray);}
.renewal-info-img {max-width: 100%;}
.error-wrap .error-top {height: 150px; overflow: hidden; text-align: center;}
.error-wrap .error-top img {width: 187px;}
.error-wrap .error-bottom {padding-top: 30px;}
.error-wrap .error-bottom .txt {width: 255px; margin: 0 auto; color: #686868;}
.error-wrap .error strong {color: var(--black); font-size: 24px; font-weight: bold; padding-bottom: 10px; display: block;}
.error-wrap .btn-wrap {font-size: 14px; gap: 5px;}
.error-wrap .btn-wrap>a {min-width: 140px; box-sizing: border-box; justify-content: center; letter-spacing: -1px; color: var(--point-color); border-radius: 45px; border: 2px solid var(--point-color); height: 42px; display: flex; align-items: center; transition: all 0.2s ease-in;}
.error-wrap .btn-wrap>a:hover {color: #fff; background-color: var(--point-color);}
.error-wrap .book-application ul li {min-width: 100px;}
.error-wrap .book-application .icon-img img {width: 38px;}

@media screen and (min-width: 768px) {
    .logo-2 img, .error-wrap.renewal .logo-2 {width: 195px;}
    .error-wrap.renewal .logo-2 {padding-bottom: 50px;}
    .error-wrap.renewal .error {padding: 50px 0;}
    .error-wrap {font-size: 18px;}
    .error-wrap .error-top {height: auto;}
    .error-wrap .error-top img {max-width: 100%; width: 400px;}
    .error-wrap .error-bottom .txt {width: auto; font-weight: 500;}
    .error-wrap .error strong {font-size: 36px; white-space: nowrap;}
    .error-wrap .error-bottom {padding-top: 0; text-align: left; padding-left: 2%; display: flex; flex-direction: column; justify-content: center;}
    .error-wrap .error {display: flex; flex-direction: row; padding: 0 20px 30px;}
    .error-wrap .error>* {width: auto;}
    .error-wrap .btn-wrap {justify-content: flex-start; font-size: 16px; padding-top: 45px; gap: 10px;}
    .error-wrap .btn-wrap>a {height: 50px; width: 100%; max-width: 176px;}
    .error-wrap .book-application {padding: 20px; box-sizing: border-box;}
    .error-wrap .book-application .sub-title {font-size: 20px;}
    .error-wrap .book-application ul {gap: 29px;}
    .error-wrap .book-application ul li {max-width: 255px; border-radius: 20px; min-width: 220px;}
    .error-wrap .book-application ul li a {display: flex; align-items: center; font-weight: 500; height: 98px; justify-content: center; padding: 20px;}
    .error-wrap .book-application .icon-img {margin: 0 20px 0 0; width: 60px; height: 60px;}
    .error-wrap .book-application .icon-img img {width: 46px;}
    .error-wrap .book-application ul li a > p {font-size: 18px; padding-top: 0;}
}
@media screen and (min-width: 1024px) {
    .error-wrap .error strong {font-size: 40px;}
    .error-wrap .btn-wrap>a {border-width: 3px;}
    .error-wrap .book-application ul li {min-width: 255px; height: 100px;}
    .error-wrap .book-application ul li:hover {border-radius: 49px; border: 1px solid var(--point-color); box-shadow: inset 0 0 0 1px var(--point-color);}
}

/* 테이블 스크롤 s */
.table-dimmed-wrap {width: 100%; position: relative;}
.table-wrap.scroll-y .table:before, .table-wrap.scroll-y .table:after {display: none;}
.table-wrap. .table {transition: .2s;}
.table:before, .table:after {opacity: 0;}
.table.end-dimm:before {content: ''; display: block; position: absolute; width: 50px; height: calc(100% - 25px); top: calc(50% - 5px); right: 0;transform: translateY(-50%); background: linear-gradient(90deg, rgba(255,255,255,0) 20%, rgba(255,255,255,1) 100%); transition: .3s; opacity: 1;}
.table.start-dimm:after {content: ''; display: block; position: absolute; width: 50px; height: calc(100% - 25px); top: calc(50% - 5px); left: 0;transform: translateY(-50%); background: linear-gradient(270deg, rgba(255,255,255,0) 20%, rgba(255,255,255,1) 100%); transition: .3s; opacity: 1;}
/* 테이블 스크롤 e */

/* 이메일 무단수집거부 s */
.note-box.type-email {display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 40px 20px;}
.note-box.type-email .icon-area {display: flex; justify-content: center; align-items:center; width: 120px; height: 120px; background: #F7F8FB; border-radius: 120px; }
.note-box.type-email .icon-area img {width: 60px; height: 60px;}
.note-box.type-email .title {padding-top: 30px; font-size: 20px; font-weight: bold; text-align: center; color: var(--black);}
.note-box.type-email .text-box {padding-top: 20px; text-align: center; font-size: 15px;}

@media screen and (min-width: 1024px) {
    .note-box.type-email {padding: 60px 40px 80px;}
    .note-box.type-email .icon-area {width: 160px; height: 160px; border-radius: 160px;}
    .note-box.type-email .icon-area img {width: 80px; height: 80px;}
    .note-box.type-email .text-box {font-size: 18px;}
}
/* 이메일 무단수집거부 e */

/* 추가 s*/
.note-box.survey > .title {font-size: 18px;}
.note-box.survey > .note-list li {font-size: 15px;}
.img-box.survey img {display: block; max-width: 500px; margin: 0 auto;}
@media screen and (min-width: 1024px) {
    .note-box.survey > .title {font-size: 22px;}
    .note-box.survey > .note-list li {font-size: 18px;}
}
/* 추가 e*/

/* 전자도서 s*/
.shortcut-box-wrap {display: flex; flex-direction:column; gap: 30px;}
.shortcut-box-wrap .shortcut-box {flex-direction: column; align-items: center;}
.shortcut-box-wrap .shortcut-box div {align-items: center;}
.shortcut-box-wrap  .shortcut-box div > .link-btn {align-self: center;}

@media screen and (min-width: 768px) {
    .shortcut-box-wrap {flex-direction:row; gap: 30px;}
}
/* 전자도서 e*/

/* 휴대폰 본인 인증 25 추가 s*/
.certify-box {border-radius: 1.2rem; border: 1px solid var(--egray); background: #F8F8F8; padding: 4rem;}
.certify-txt {font-size: 1.7rem;}
.ico-certify {width: 2.8rem; height: 2.8rem; display: inline-block; margin-right: 1.5rem; background: url("/_user/support/img/sub/ico-certify.svg") no-repeat center / cover;}
.btn-certify {height: 5.6rem; display: flex; align-items: center; justify-content: center;  background: var(--point-color); border-radius: 0.8rem; color: var(--white); font-size: 1.7rem; margin: 4rem auto 0; max-width: 50rem; transition: .3s;}

@media screen and (min-width: 768px) {
    .certify-box {display: flex; gap: 3rem; align-items: center; justify-content: space-between;}
    .btn-certify {min-width: 9rem; height: 9rem; border-radius: 10rem; margin: 0; font-size: 1.8rem;}
    .btn-certify:hover {opacity: 0.8;}
    .certify-cont {padding-right: 1rem; border-right: 1px dashed #C6C6C6; flex: 1;}
    .certify-txt {font-size: 1.8rem;}
}

@media screen and (min-width: 1024px) {
    .btn-certify {min-width: 10rem; height: 10rem; font-size: 1.9rem;}
    .certify-txt {font-size: 1.9rem;}
    .certify-box {gap: 4rem;}
    .certify-box .sub-title {font-size: 2.5rem;}
}
/* 휴대폰 본인 인증 25 추가 e*/

/* 스마트 : ai 신장 측정하기 s*/
.sub-section .border-box {padding: 3rem 2rem 2rem; border: 1px solid #C6C6C6; border-radius: 2rem;}
.sub-section .border-box .form-tit {padding-bottom: 2rem; font-size: 1.6rem;}
.info-bullet-list {margin-top: 20px;}
.border-box .inner {max-width: 800px; margin: 0 auto;}
.ai-height-result {display: flex; align-items: center; justify-content: center; gap: 1rem; font-size: 2rem; text-align: center; padding-top: 3rem; font-weight: 500;}
.ai-height-result > span {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem;}
.data-height {display: inline-flex; align-items: center; justify-content: center; width: 10rem; height: 5.2rem; border-radius: 0.8rem; border: 1px dashed #C6C6C6; color: var(--point-color); font-weight: 700;}
.inner-gray-box {background: #f0f0f0; border-radius: 0.8rem; max-width: 100rem; margin: 0 auto;}
.gray-box + .gray-box {margin-top: 1rem;}
.gray-box .img-box {background: #7E7E7E; height: 150px;}
.ico-height {width: 4rem; height: 4rem; margin-right: 0.5rem; background: url("/_user/support/img/sub/ico-height.svg") no-repeat center / cover;}
/* 파일 업로드 */
.ico-upload {min-width: 2rem; height: 2rem; background: url("/_user/support/img/sub/ico-upload.svg") no-repeat center / cover;}
.file-box {display: flex; flex-wrap: wrap; gap: 1rem; position: relative;overflow: hidden;}
.file-box:nth-child(n+2) {margin-top: 5px;}
.file-box .file-uploaded {width: 100%; height: 5.2rem; background: #F0F0F0; border: 1px dashed #C6C6C6; border-radius: 8px; padding-left: 10px; color: var(--point-color); font-size: 1.3rem;}
.file-box .file-uploaded::placeholder {font-weight: 300; position: relative; top: 1px;}
.file-box .file-uploaded input.upload {border: none;}
.file-box .file-uploaded >input[type="text"]:focus-visible {outline: 5px dashed red; outline-offset: -3px}
.file-box .file-choice {display: flex; flex: 1; justify-content: center; align-items: center; width: 22px; height: 5.2rem; min-height: 5.2rem; gap: 4px; padding: 0 10px; border-radius: 8px; background-color: #EFF5FF; border: 1px solid #246BEB; cursor: pointer; color: var(--point-color);}
.file-box .file-choice .btn-file {cursor: pointer; text-align: center; color: #333; line-height: 42px;}
.file-box .file-del {display: none;}
.file-box .file-uploaded .file {position: absolute;}
.table.type-mcard .label-notice {margin: 0;}
@media screen and (min-width: 1024px) {
    .file-box {flex-wrap: nowrap; gap: 2.4rem;}
    .file-box .file-uploaded {font-size: 1.5rem;}
    .file-box .file-choice {min-width: 145px;}
    .sub-section .border-box {border-radius: 3rem; padding: 8rem 5rem;}
    .sub-section .border-box .form-tit {font-size: 2.5rem;}
    .info-bullet-list li + li {padding-top: 0.5rem;}
    .ai-height-result {font-size: 2.5rem; padding-top: 4rem;}
    .gray-box + .gray-box {margin-top: 2rem;}
    .gray-box.type-flex {display: flex; gap: 3rem;}
    .gray-box .cont-box {width: 50%;}
    .gray-box .img-box {width: 50%; height: 120px;}
    .table.type-mcard .label-notice {margin: 0 auto;}
}
/* 스마트 : ai 신장 측정하기 e*/
/* 스마트 : 이전 데이터 보기 s*/
.board-top-box {padding-bottom: 3rem; justify-content: flex-start;}
.board-top-box .board-top {justify-content: flex-start; align-items: flex-start; font-size: 1.8rem; margin-bottom: 0.5rem; font-weight: 600;}
.table-ul-list{list-style:none;padding:0;margin:0;border:1px solid #ddd; border-radius: 1rem; overflow: hidden; text-align: center; font-size: 1.7rem;}
.table-ul-list li{display:flex;align-items:center;padding:12px 10px;border-bottom:1px solid #eee;}
.table-ul-list .col{flex:1;}
.table-ul-list .no{flex:0.4;text-align:center;}
.table-ul-list .date{text-align:center;}
.table-ul-list .info{color: var(--point-color); font-weight: 700;}
.table-ul-list .list-header{font-weight:bold; background: #F7F8FB;}
.table-ul-list .list-header .info {color: inherit;}
@media screen and (min-width: 1200px) {
    .board-top-box {display: flex; justify-content: space-between;}
    .board-top-box .board-top {font-size: 2.1rem;}
    .table-ul-list {font-size: 1.8rem;}
    .table-ul-list li {padding: 2rem 1.5rem;}
}
/* 스마트 : 이전 데이터 보기 e*/
/* 성장발달 : ai 분석 s */
.chart-table-tit {display: flex; align-items: center; gap: 0.5rem; color: #51A500; font-size: 1.6rem; font-weight: 700; padding-bottom: 1rem;}
.chart-table-tit::before {content: ''; display: inline-block; width: 1.8rem; height: 1.8rem; background: url("/_user/support/img/sub/ico-table-tit.svg") no-repeat center / contain;}
.chart-table-ul-list {border:1px solid #ddd; border-radius: 1rem; text-align: center; overflow: hidden; margin-bottom: 1rem;}
.chart-table-ul-list li{display:flex;align-items:center; border-bottom:1px solid #eee;}
.chart-table-ul-list li:last-of-type {border-bottom: none;}
.chart-table-ul-list li > span {padding:12px 10px;}
.chart-table-ul-list .list-header {display:flex;align-items:center; border-bottom:1px solid #eee; color: #fff;}
.chart-table-ul-list .list-header span {background: var(--point-color);}
.chart-table-ul-list .col {flex:1;}
.chart-table-ul-list .no {flex:0.4; background: #F8F8F8; color: var(--point-color);}
.chart-table-ul-list li:nth-of-type(1) .no {color: #fff;}
.inner-chart-box img {border-radius: 1rem; display: flex; margin: 0 auto;}
.inner-chart-box + .inner-chart-box {padding-top: 4rem;}
.aianalysis-new-chart-item {border-radius: 1.2rem; border: 1px solid #ECEDF0; box-shadow: 0 4px 25px 0 rgba(17, 17, 17, 0.08); padding: 1.5rem;}
.inner-chart-wrap {margin-top: 1rem; height: 280px !important;}
.inner-chart-wrap > canvas {width: 100% !important;}

@media screen and (min-width: 1200px) {
    .aianalysis-new-chart-item {position: relative; display: flex; gap: 2rem; justify-content: space-between; padding: 5rem 6rem; border-radius: 2rem;}
    .aianalysis-new-chart-item::before {content: ''; width: 1px; height: 85%; background: #E4E4E4; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
    .chart-table-tit {font-size: 2rem; padding-bottom: 1.5rem;}
    .chart-table-ul-list {font-size: 1.6rem; margin-bottom: 2rem;}
    .inner-chart-wrap {height: 280px !important;}
    .inner-chart-box + .inner-chart-box {padding-top: 0;}
    .inner-chart-box {width: 50%; max-width: 59rem;}
    .inner-chart-box.w-full {width: 100%; max-width: unset;}
    .aianalysis-new-chart-item.w-full::before {content: none;}
    .w-full .chart-table-ul-list .no {flex: 1;}
}
/* 성장발달 : ai 분석 e */
/* 스마트 : 사업소개 s */
.about-wrap .img-box {border-radius: 2rem; overflow: hidden; max-width: 98rem; margin: 3rem auto 0;}
.title-box + .img-box {margin-top: 1rem;}
@media screen and (min-width: 1024px) {
    .about-wrap .img-box {border-radius: 4rem; margin-top: 4rem;}
    .about-wrap .sub-section:nth-of-type(3) .sub-deco-title-s {max-width: 60%;}
    .about-wrap .sub-deco-title-s {max-width: 40%;}
    .title-box + .img-box {margin-top: 3rem;}
}
/* 스마트 : 사업소개 e */
/* 스마트 : 운영현황 s */
.status-wrap .sub-deco-title-s {max-width: 90%;}
@media screen and (min-width: 1024px) {
    .status-wrap .sub-deco-title-s {max-width: 70%;}
}
/* 스마트 : 운영현황 e */
/* 스마트 : 미래비전 s */
.vision-wrap .sub-deco-title-s {max-width: 90%;}
.vision-list {}
.vision-item {padding: 2rem 2rem 3rem; border-radius: 2rem; font-size: 1.6rem;}
.vision-item + .vision-item {margin-top: 2rem;}
.vision-item.item01 {background: #D7EAFF;}
.vision-item.item02 {background: #1277D6; color: rgba(255, 255, 255, 0.8)}
.vision-item.item03 {background: #2A356F; color: rgba(255, 255, 255, 0.8)}
.ico-vision {display: block; width: 6rem; height: 6rem; margin: 0 auto; background-color: var(--white) !important; border-radius: 7.5rem;}
.vision-item.item01 .ico-vision {background: url("/_user/support/img/sub/ico-vision-01.png") no-repeat center / 4rem;}
.vision-item.item02 .ico-vision {background: url("/_user/support/img/sub/ico-vision-02.png") no-repeat center / 4rem;}
.vision-item.item03 .ico-vision {background: url("/_user/support/img/sub/ico-vision-03.png") no-repeat center / 4rem;}
.vision-item .num {font-size: 8rem; padding: 0 1.5rem; color: rgba(255, 255, 255, 0.50); font-weight: 700; line-height: 1;}
.vision-header {display: flex; align-items: center; gap: 1rem; padding-top: 1rem;}
.vision-header .tit {color: var(--black); font-size: 1.8rem; font-weight: 700;}
.vision-item.item02 .vision-header .tit, .vision-item.item03 .vision-header .tit {color: var(--white);}
.vision-cont .desc {padding-top: 1rem;}

@media screen and (min-width: 1024px) {
    .vision-wrap .sub-deco-title-s {max-width: 70%;}
    .vision-item {display: flex; justify-content: space-between; border-radius: 3rem; padding: 6rem; position: relative; font-size: 2rem; overflow: hidden;}
    .ico-vision {width: 13rem; height: 13rem; margin: 0; background-size: 7rem !important;}
    .vision-item .num {font-size: 25rem; position: absolute; bottom: -5rem; left: 20%;}
    .vision-header .tit {font-size: 3rem;}
    .vision-cont {width: 67%;}
}
/* 스마트 : 미래비전 e */
/* 스마트 : 플랫폼홍보 s */
.promotion-item {width: 97%; position: relative; display: flex; justify-content: space-between; border-radius: 1.2rem; padding: 3rem; box-sizing: border-box; background: #1277D6; font-size: 1.6rem; word-break: keep-all;}
.promotion-item.item02 {background: #5C6ED2;}
.promotion-item + .promotion-item {margin-top: 2rem;}
.promotion-item::before {content: ''; width: 100%; height: 100%; border: 1px solid #1277D6; position: absolute; left: 2%; bottom: -4%; border-radius: 1.2rem;}
.promotion-item.item02::before {border-color: #5C6ED2;}
.promotion-cont {width: 80%;}
.promotion-item .tit {color: var(--white); font-size: 2.2rem; font-weight: 700; line-height: 1.2;}
.promotion-item .tit-sub {color: #66CEFF; padding-top: 1rem;}
.promotion-item .desc {color: rgba(255, 255, 255, 0.80); padding-top: 1rem;}
.img-promotion {display: block; width: 6rem; height: 6.4rem;}
.promotion-item.item01 .img-promotion {background: url("/_user/support/img/sub/img-promotion-01.png") no-repeat center / contain;}
.promotion-item.item02 .img-promotion {background: url("/_user/support/img/sub/img-promotion-02.png") no-repeat center / contain;}
.shadow-box {padding: 4rem 3rem; box-shadow: 0 5px 40px 0 rgba(10, 22, 107, 0.10); border-radius: 2rem; font-size: 1.6rem; color: var(--black);}
.shadow-box .point-color {font-weight: 700; padding-top: 2rem;}
@media screen and (min-width: 768px) {
    .promotion-item {padding: 4rem; font-size: 2rem;}
    .promotion-item + .promotion-item {margin-top: 4rem;}
    .img-promotion {width: 10rem; height: 10.4rem;}
    .promotion-item .tit {font-size: 3rem;}
    .promotion-item .tit-sub {padding-top: 2rem;}
    .promotion-item::before {bottom: -5%;}
    .shadow-box {font-size: 2rem;}
}
@media screen and (min-width: 1200px) {
    .promotion-list {display: flex; gap: 5rem;}
    .promotion-item {padding: 6rem 5rem 6rem 8rem; border-radius: 2.5rem; font-size: 2.5rem;}
    .promotion-item::before {border-radius: 2.5rem;}
    .promotion-item + .promotion-item {margin-top: 0;}
    .img-promotion {width: 15.2rem; height: 14rem;}
    .promotion-item .tit {font-size: 4.2rem;}
    .promotion-item .tit-sub {padding-top: 1rem;}
    .promotion-item .desc {padding-top: 4rem;}
    .shadow-box {font-size: 2rem; padding: 5rem;}
    .shadow-box .txt {max-width: 66%; margin: 0 auto;}

}
/* 스마트 : 플랫폼홍보 e */
/* 스마트 : 운영현황 s */
.status-item {border-radius: 2.5rem; overflow: hidden; color: var(--black);}
.status-item + .status-item {margin-top: 3rem;}
.status-thumbnail {position: relative;  overflow: hidden;}
.status-thumbnail > img {aspect-ratio: 33 / 16; object-fit: cover;}
.status-tit {padding-bottom: 1rem; font-size: 2.2rem; text-align: center; font-weight: 700;}
.status-item .bullet-list {font-size: 1.6rem; color: #444;}
.status-item .bullet-list > li {gap: 0;}
.status-item .status-cont {height: -webkit-fill-available; padding: 2rem 3rem; background: #F6F6F8;}
.status-data {padding: 3rem 0; font-size: 4rem; font-weight: 800; color: var(--point-color); text-align: center;}
@media screen and (min-width: 768px) {
    .status-list {display: flex; flex-wrap: wrap; gap: 3rem;}
    .status-item {width: calc(50% - 2rem);}
    .status-item + .status-item {margin-top: 0;}
}
@media screen and (min-width: 1024px) {
    .status-list {gap: 2.4rem;}
    .status-item {width: calc(25% - 1.8rem);}
    .status-thumbnail > img {aspect-ratio: 33 / 20;}
    .status-item  .bullet-list > li + li {margin-top: 1rem;}
    .status-tit {font-size: 3rem; padding-bottom: 2.4rem;}
    .status-data {font-size: 6rem;}
}
/* 스마트 : 운영현황 e */
/* 스마트 : 프로그램 s */
.dash-box {text-align: center; border: 3px dashed #006FD9; border-radius: 4rem; background: #F8FCFF; padding: 3rem 2rem; font-size: 1.6rem; word-break: keep-all;}
.dash-box .dash-tit {display: flex; align-items: center; justify-content: center; font-size: 2.1rem; margin-bottom: 2.2rem; font-weight: 800; color: var(--black);}
.dash-box .dash-tit::before {content: ''; display: inline-block; margin-right: 1rem; width: 2.9rem; height: 2.9rem; background: url("/_user/support/img/sub/ico-dash-tit.svg") no-repeat center / cover;}
.program-list {max-width: 87.4rem; margin: 0 auto; padding-bottom: 7rem;}
.program-item {display: flex; align-items: flex-start; padding-bottom: 2rem; gap: 1rem; font-size: 1.5rem;}
.program-item .round-tit {min-width: 9.7rem; padding: 0.7rem 1.2rem; border-radius: 1.2rem; background: #47B0EC; color: var(--white); text-align: center;}
.program-item .round-tit.none {background: transparent !important;}
.program-item.blue02 .round-tit, .program-item.blue02 .program-bullet, .program-item.blue02 .program-bullet::before {background: #0067B5;}
.program-item.blue03 .round-tit, .program-item.blue03 .program-bullet, .program-item.blue03 .program-bullet::before {background: #003B69;}
.program-item.blue04 .round-tit, .program-item.blue04 .program-bullet, .program-item.blue04 .program-bullet::before {background: #7AD5EA;}
.program-item.blue05 .round-tit, .program-item.blue05 .program-bullet, .program-item.blue05 .program-bullet::before {background: #018BBA;}
.program-item.blue06 .round-tit, .program-item.blue06 .program-bullet, .program-item.blue06 .program-bullet::before {background: #00435A;}

.program-bullet {display: flex; align-items: center; justify-content: center; min-width: 2.4rem; height: 2.4rem; border-radius: 2.4rem; background: #47B0EC; color: #fff; font-style: normal;}
.program-bullet::before {content: ''; width: 2px; height: 100%; position: absolute; bottom: 0; background: #47B0EC; z-index: -1;}
.program-item:last-of-type .program-bullet::before {height: 100px; bottom: -59px;}
.program-item:last-of-type .program-bullet::after {content: ''; width:0; height:0; border-left: 6px solid transparent; border-right: 6px solid transparent;border-top:10px solid #003c76; z-index: -1; position: absolute; bottom: -6rem;}
.desc-list > li {position: relative; display: flex; align-items: baseline; color: var(--black);}
.desc-list > li::before {content: ''; display: inline-block; min-width: 5px; height: 5px; margin-right: 1rem; border-radius: 5px; background: var(--black); position: relative; top: -3px;}

@media screen and (min-width: 768px) {
    .program-item .round-tit {min-width: 17rem;}
    .program-item {font-size: 1.7rem;}
    .dash-box {font-size: 1.8rem;}
    .dash-box .dash-cont {max-width: 50rem; margin: 0 auto;}
    .program-item:last-of-type .program-bullet::before {height: 13rem;}
}

@media screen and (min-width: 1024px) {
    .program-list {max-width: 87.4rem;}
    .program-item {gap: 1.5rem; font-size: 2rem; padding-bottom: 4rem;}
    .program-item .round-tit {min-width: 41rem; font-size: 2.5rem; border-radius: 6rem;}
    .dash-box {padding: 4rem 5rem 5.5rem; border-radius: 14rem; font-size: 2.4rem;}
    .dash-box .dash-tit {font-size: 3rem;}
    .dash-box .dash-cont {max-width: 80rem;}
    .program-bullet {min-width: 3rem; height: 3rem; font-size: 2.4rem;}
    .desc-list {padding-left: 2rem;}
}
/* 스마트 : 프로그램 e */

/* 스마트 : 기술 및 데이터 공통 s */
.inner-tab-nav {position:relative; margin-bottom: 2rem;}
.inner-tab-list::before {content: ''; display: block; width: 100%; height: 2px; background: #ddd; position: absolute; bottom: 0; left: 0; z-index: 0;}
.inner-tab-list {display:flex; overflow-x:auto; white-space:nowrap;}
.inner-tab-list::-webkit-scrollbar {display:none;}
.inner-tab-item {position: relative; display:flex; align-items:center; justify-content:center; height:5rem; padding:0 1.5rem; box-sizing: border-box; box-sizing:border-box; font-size:1.6rem; font-weight:700; flex:0 0 auto; border-bottom:2px solid #ddd;}
.inner-tab-item.active {color:var(--point-color); border-color:var(--point-color);}
.inner-tab-nav::before,
.inner-tab-nav::after {content:''; position:absolute; top:0; width:30px; height:100%; pointer-events:none; z-index:2;}
.inner-tab-nav::before {left:0; background:linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));}
.inner-tab-nav::after {right:0; background:linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));}
.hide-left::before {opacity:0; transition:opacity .2s;}
.hide-right::after {opacity:0; transition:opacity .2s;}

.data-txt-box .sub-deco-title {line-height: 1.6;}
.sub-data-tit {word-break: keep-all; font-size: 1.6rem; content: var(--black);}
.sub-data-tit + .title-box {padding-top: 4rem;}
.data-box-wrap .img-box {border-radius: 1.2rem; padding: 2rem 3rem; box-sizing: border-box; box-shadow: 0 0 25px -4px rgba(0, 0, 0, 0.08); margin-top: 4rem;}
.data-card-item {padding: 3rem 2rem; box-sizing: border-box; border-radius: 1.2rem; background: #F6F6F6; text-align: center; font-size: 1.5rem;}
.data-card-item + .data-card-item {margin-top: 3rem;}
.ico-data {display: block; width: 6rem; height: 6rem; background-size: cover; background-repeat: no-repeat; margin: 0 auto 1rem;}
.ico-data-b {display: block; width: 13.4rem; height: 8rem; background-size: cover; background-repeat: no-repeat; margin: 0 auto 1rem;}
.data-card-tit {display: block; font-size: 1.6rem; font-weight: 700; color: var(--point-color); line-height: 3.3rem;}
.data-card-txt-02 {font-size: 2rem; color: var(--point-color); font-weight: 600;}
.data-card-label {height: 3.8rem; max-width: fit-content; display: flex; align-items: center; justify-content: center; padding: 0 2rem; border-radius: 4rem; background: #7698E8; color: var(--white); margin: 1.5rem auto 0;}
.sub-data-tit + .data-card-list {padding-top: 3rem;}
@media screen and (min-width: 400px) {
    .inner-tab-list {justify-content: center;}
}
@media screen and (min-width: 768px){
    .inner-tab-nav {margin-bottom: 5rem;}
    .data-card-list {display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem;}
    .data-card-item {width: calc(50% - 1rem);}
    .data-card-item + .data-card-item {margin-top: 0;}
}
@media screen and (min-width: 1200px){
    .inner-tab-nav {margin-bottom: 10rem;}
    .inner-tab-item {height: 6rem; font-size: 1.9rem; padding: 0 2rem;}
    .data-txt-box {max-width: 60%;}
    .sub-data-tit {font-size: 2rem;}
    .data-card-list {gap: 3rem;}
    .data-card-item {display: flex; flex-direction: column; justify-content: space-between; width: calc(33.33% - 2rem); padding: 4rem 3rem; border-radius: 2rem; font-size: 1.8rem;}
    .data-card-txt-02 {font-size: 3rem; padding: 1rem 0 0;}
    .data-card-tit {font-size: 2rem; padding-bottom: 1rem;}
    .data-card-label {height: 4rem; margin: 2rem auto 0;}
    .ico-data {margin: 0 auto 2rem;}
    .ico-data-b {width: 20rem; height: 12rem;}
    .data-box-wrap {display: flex; justify-content: space-between;}
    .data-box-wrap .img-box {max-width: 39rem; padding: 2rem; margin: 0;}
}
/* 스마트 : 기술 및 데이터 공통 e */

/* 스마트 : 기술 및 데이터 DIDIM s */
.ico-didim-01 {background-image: url("/_user/support/img/sub/ico-didim-01.svg");}
.ico-didim-02 {background-image: url("/_user/support/img/sub/ico-didim-02.svg");}
.ico-didim-03 {background-image: url("/_user/support/img/sub/ico-didim-03.svg");}
.ico-didim-04 {background-image: url("/_user/support/img/sub/ico-didim-04.svg");}
.ico-didim-05 {background-image: url("/_user/support/img/sub/ico-didim-05.svg");}
.ico-didim-06 {background-image: url("/_user/support/img/sub/ico-didim-06.svg");}
.didim-box {padding: 3rem; background: #F6F6F8; border-radius: 1.2rem; margin-top: 3rem;}
.check-bullet-list {padding-top: 3rem; font-size: 1.6rem;}
.check-bullet-list > li {display: flex; align-items: baseline;}
.check-bullet-list > li + li {margin-top: 1.5rem;}
.check-bullet-list > li::before {content: ''; display: inline-block; margin-right: 0.7rem; min-width: 1.7rem; height: 1.7rem; background: url("/_user/support/img/sub/ico-cheak-bullet.svg") no-repeat center / cover; position: relative; top: 0.3rem;}
.didim-box + .data-txt-box {padding-top: 3rem;}
.didim-box .img-box {background: #fff; display: flex; justify-content: center; border-radius: 1rem;}
.data-border-list {border-radius: 1.2rem; padding: 3rem; border: 1px solid #C6C6C6; margin-top: 1rem; text-align: center;}
.data-border-tit {color: var(--black); font-weight: 700; font-size: 1.8rem; padding-bottom: 1rem;}
.data-border-txt {word-break: keep-all; font-size: 1.5rem;}
.data-border-item {box-sizing: border-box;}
.data-border-item + .data-border-item {margin-top: 3rem; padding-top: 3rem; border-top: 1px solid #C6C6C6;}
@media screen and (min-width: 768px){
    .data-border-list {display: flex; text-align: left; padding: 4rem; border-radius: 2rem;}
    .data-border-item {width: 50%;}
    .data-border-item + .data-border-item {margin-top: 0; border-top: unset; padding: 0 0 0 3rem; border-left: 1px solid #C6C6C6;}
}
@media screen and (min-width: 1200px){
    .didim-box {display: flex; padding: 6rem; border-radius: 3rem; gap: 6rem;}
    .didim-box .img-box {width: 34%; border-radius: 2rem;}
    .check-bullet-list {font-size: 2rem;}
    .didim-box + .data-txt-box {padding-top: 6rem;}
    .data-border-list {padding: 6rem;}
    .data-border-item + .data-border-item {padding: 0 0 0 4rem; }
    .data-border-tit {font-size: 2.6rem;}
    .data-border-txt {font-size: 2rem;}
}
/* 스마트 : 기술 및 데이터 DIDIM e */
/* 스마트 : 기술 및 데이터 INBODY s */
.ico-inbody-01 {background-image: url("/_user/support/img/sub/ico-inbody-01.svg");}
.ico-inbody-02 {background-image: url("/_user/support/img/sub/ico-inbody-02.svg");}
.ico-inbody-03 {background-image: url("/_user/support/img/sub/ico-inbody-03.svg");}
.ico-inbody-04 {background-image: url("/_user/support/img/sub/ico-inbody-04.svg");}
.ico-inbody-05 {background-image: url("/_user/support/img/sub/ico-inbody-05.svg");}
.ico-inbody-06 {background-image: url("/_user/support/img/sub/ico-inbody-06.svg");}
.ico-inbody-c {background-image: url("/_user/support/img/sub/ico-inbody-c.svg");}
.ico-inbody-i {background-image: url("/_user/support/img/sub/ico-inbody-i.svg");}
.ico-inbody-d {background-image: url("/_user/support/img/sub/ico-inbody-d.svg");}
/* 스마트 : 기술 및 데이터 INBODY e */
/* 스마트 : 심박수 s */
.ico-heartrate-01 {background-image: url("/_user/support/img/sub/ico-heartrate-01.svg");}
.ico-heartrate-02 {background-image: url("/_user/support/img/sub/ico-heartrate-02.svg");}
.ico-heartrate-03 {background-image: url("/_user/support/img/sub/ico-heartrate-03.svg");}
.ico-heartrate-04 {background-image: url("/_user/support/img/sub/ico-heartrate-04.svg");}
.data-border-top {font-weight: 700; font-size: 1.6rem; padding: 2.5rem 0 1rem; color: var(--point-color);}
.data-border-txt + .data-border-tit {display: block; padding: 1rem 0 0;}
.data-card-list + .sub-title-light {padding-top: 3rem;}
.data-card-list + .sub-data-tit {padding-top: 2rem;}
@media screen and (min-width: 768px){
    .data-border-list.type-wide {flex-wrap: wrap; justify-content: center; gap: 3rem 0; padding: 6rem 1rem; text-align: center;}
    .data-border-list.type-wide .data-border-item {padding: 0 1rem; border: none;}
    .data-border-list.type-wide .data-border-item + .data-border-item {padding: 0 1rem;}
}
@media screen and (min-width: 1200px){
    .data-border-top {font-size: 2rem; padding: 4rem 0 1.5rem;}
    .data-border-list.type-wide {margin-top: 4rem;}
    .data-border-list.type-wide .data-border-txt {font-size: 1.8rem;}
    .data-border-list.type-wide .data-border-item {padding: 0 3rem;}
    .data-border-list.type-wide.col-4 .data-border-item {width: 25%;}
    .data-border-list.type-wide.col-3 .data-border-item {width: 33.33%;}
    .data-border-list.type-wide .data-border-item + .data-border-item {padding: 0 3rem; border-left: 1px solid #ddd;}
    .data-card-list + .sub-title-light {padding-top: 6rem;}
}
/* 스마트 : 심박수 e */
/* 스마트 : 행동분석 s */
.ico-behavior-01 {background-image: url("/_user/support/img/sub/ico-behavior-01.svg");}
.ico-behavior-02 {background-image: url("/_user/support/img/sub/ico-behavior-02.svg");}
.ico-behavior-03 {background-image: url("/_user/support/img/sub/ico-behavior-03.svg");}
.ico-behavior-04 {background-image: url("/_user/support/img/sub/ico-behavior-04.svg");}
.ico-behavior-05 {background-image: url("/_user/support/img/sub/ico-behavior-05.svg");}
.ico-behavior-06 {background-image: url("/_user/support/img/sub/ico-behavior-06.svg");}
.ico-behavior-07 {background-image: url("/_user/support/img/sub/ico-behavior-07.svg");}
.ico-behavior-08 {background-image: url("/_user/support/img/sub/ico-behavior-08.svg");}
.ico-behavior-09 {background-image: url("/_user/support/img/sub/ico-behavior-09.svg");}
.ico-behavior-10 {background-image: url("/_user/support/img/sub/ico-behavior-10.svg");}
.ico-behavior-11 {background-image: url("/_user/support/img/sub/ico-behavior-11.svg");}
.data-wrap .growth-step-list {margin-top: 3rem}
.data-wrap .growth-step-list .growth-step-item {border-radius: 4rem; border: 1.5px dashed #1277D6; background: #F8FCFF; text-align: center; padding: 1.5rem;}
.data-wrap .growth-step-item + .growth-step-item::before {}
.data-wrap .growth-step-item > em {background: transparent; color: var(--point-color); font-size: 1.8rem;}
.data-wrap .step-num {width: 3rem; height: 3rem; background: var(--point-color); color: #fff;}
.data-wrap .step-bullet::before {display: none;}
.data-wrap .notice {padding: 1.5rem; flex-wrap: wrap; text-align: left; align-items: flex-start; border-radius: 2rem;}
.data-wrap .notice span {padding-top: 1rem;}
.behavioral-list {padding-top: 3rem; color: var(--white);}
.behavioral-item {position: relative; padding: 3rem 2rem 0; border-radius: 3rem; background: #1380B9;}
.behavioral-item.item02 {background: #323F9A;}
.behavioral-item + .behavioral-item {margin-top: 1rem;}
.behavioral-item::after {content: ''; display: block; padding-top: 2rem; width: 100%; height: 12rem; background:  url("/_user/support/img/sub/img-behavior-01.png") no-repeat center bottom / contain;}
.behavioral-item.item02::after {background:  url("/_user/support/img/sub/img-behavior-02.png") no-repeat center bottom / contain;}
.behavioral-tit {position: relative; font-size: 2.2rem; padding-bottom: 2rem; font-weight: 700;}
.behavioral-tit::before {content: ''; display: inline-block; width: 2.2rem; height: 2.2rem; background: url("/_user/support/img/sub/ico-check-behavior.svg") no-repeat center / cover; position: relative; top: 0.2rem; margin-right: 1rem;}
.behavioral-bullet-list > li {display: flex; align-items: baseline; font-size: 1.6rem; font-weight: 400;}
.behavioral-bullet-list > li::before {content: ''; min-width: 4px; height: 4px; border-radius: 4px; background: #fff; margin: 0 1rem; position: relative; top: -0.4rem;}
.data-border-list.type02 {padding: 3rem 2rem;}
.data-border-list.type02 .data-border-item {display: flex; text-align: left; gap: 2rem;}
.data-border-list.type02 .data-border-item:first-of-type {padding-right: 2rem;}
.data-border-list.type02 .data-border-item .ico-data-b {min-width: 8rem; width: 8rem; height: 5.3rem; margin: 0;}
.sub-data-tit {}
@media screen and (min-width: 1024px){
    .behavioral-list {display: flex; gap: 1rem; padding-top: 6rem;}
    .behavioral-tit {font-size: 3rem;}
    .behavioral-tit::before {width: 3.2rem; height: 3.2rem; top: 0.5rem;}
    .behavioral-item {width: 50%; border-radius: 6rem; padding: 4rem 4rem 0;}
    .behavioral-item::after {height: 25rem;}
    .behavioral-bullet-list > li {font-size: 1.8rem;}
    .behavioral-item + .behavioral-item {margin-top: 0;}
    .title-box + .data-border-list.type-wide {margin-top: 1rem;}
    .data-border-list.type02 .data-border-item .ico-data-b {min-width: 20rem; height: 11.4rem;}
    .data-wrap .growth-step-list {margin-top: 4rem}
    .data-wrap .growth-step-list .growth-step-item {padding: 4rem 5rem; border-radius: 14rem; border-width: 3px;}
    .data-wrap .growth-step-item > em {font-size: 3rem; font-weight: 800;}
    .data-wrap .step-bullet {font-size: 2.4rem;}
    .data-wrap .step-num {font-size: 2.2rem;}
    .data-wrap .notice {border-radius: 5rem; padding: 2rem; align-items: center;}
}
/* 스마트 : 행동분석 e */