/* 팝업 */
.pop-parent {
    position: fixed;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    transition: all 0.2s;
}

.pop-parent .m-ratioBox-wrap {
    width: 100%;
    padding-top: 58%;
    position: relative;
    overflow: hidden;
}
.pop-parent .m-ratioBox-wrap .m-ratioBox {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
}
/*
.m-ratioBox-wrap .m-ratioBox:after {content:""; width:83px; height:28px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:url("../img/logo.png") no-repeat; background-size:100%; opacity:0.4;}
 */
.pop-parent .m-ratioBox-wrap img {
    display: block;
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 1;
}
.pop-parent .m-ratioBox-wrap iframe {
    width: 105%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 1;
}

.pop-parent .swiper {
    overflow: hidden;
}
.pop-parent .swiper-container {
    overflow: visible;
}
.pop-parent .swiper-pagination {
    display: flex;
}
.pop-parent .pop {
    width: 700px;
    position: relative;
}
.pop-parent .pop .btn-toggle {
    width: 40px;
    height: 40px;
    position: relative;
    background-color: black;
    cursor: pointer;
    display: none;
}
.pop-parent .pop .btn-toggle img {
    width: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.3s;
}
.pop-parent .pop-btns {
    display: flex;
    justify-content: space-between;
    position: absolute;
    width: 100%;
    bottom: -40px;
    left: 0px;
    background-color: #3c3c3c;
    opacity: 1;
}
.pop-parent .pop-btns a {
    color: #fff;
    padding: 7px 14px;
}
.pop-parent .pop-btns #oneday_check {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}
.pop-parent .pop-btns #oneday_check + label {
    display: flex;
    align-items: center;
    padding: 0 10px;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
}
.pop-parent .pop-btns #oneday_check + label:before {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 10px;
    border: 1px solid #fff;
}
.pop-parent .pop-btns #oneday_check:checked + label .icon {
    position: absolute;
    left: 7px;
    top: 7px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("/img/check_checked.png") no-repeat center center;
}

.pop-parent .pop .swiper-btn-control {
    width: 8px;
    height: 11px;
    margin-left: 16px;
    position: relative;
    top: 2px;
}
.pop-parent .swiper-control {
    display: flex;
    align-items: center;
    position: absolute;
    top: 21px;
    right: 20px;
    z-index: 2;
}
.pop-parent .swiper-control .swiper-pagination {
    position: static;
}
.pop-parent .swiper-pagination-bullet {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    border-radius: 0;
    border: 1px solid white;
    opacity: 0.5;
    background-color: transparent;
}
.pop-parent .swiper-pagination-bullet-active {
    background-color: #fff;
    opacity: 1;
}
.pop-parent.active {
    right: -700px;
}
.pop-parent.active .btn-toggle {
    transform: rotate(180deg);
}

.pop-parent .pop .btn-close {
    display: block;
    width: 40px;
    height: 40px;
    position: relative;
    background-color: black;
}

.pop-parent .pop .btn-close i { 
  line-height: 40px;
 }

/* @media screen and (max-width: 1200px) {

} */

@media screen and (max-width: 768px) {
    .pop-parent .pop {
        width: 310px;
    }

    .pop-parent {
        top: 50%;
        right: unset;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .pop-parent .pop-btns {
        transform: translateY(100%);
        top: unset;
        bottom: 0;
        left: 0;
        width: 100%;
        justify-content: space-between;
    }
    .pop-parent .pop .btn-toggle {
        display: none;
    }
    .pop-parent .pop .btn-close {
        display: block;
    }
}


/*///////////////////////// 공통 css /////////////////////////*/

/* form */
.form-wrap { gap: 32px; }
.form-list { width: 100%; gap: 32px; flex-flow: wrap; }
.form-list.border { padding-bottom: 32px; border-bottom: 1px solid #c5c5c5; }
.form-item { gap: 8px; width: 100%; }
.form-item.half { width: calc( 50% - 16px ); }
.form-item .item-default { font-size: 16px; font-weight: bold; }
.form-item .item-default .guide-txt { font-weight: normal; margin-top: 4px; }
.form-item .item-user { gap: 16px;}
.form-input-wrap { gap: 8px; color: #fff; }
.form-input-wrap.col-group { align-items: center; }
.form-input-wrap .form-input { min-width: unset; }
.form-input { width: 100%; padding: 0 16px; height: 52px; border: 1px solid #d8d8d8; font-size: 16px; border-radius: 4px; }
.form-input.disable { background: #f5f5f5; }
.form-date { padding-right: 30px; cursor: pointer; background-image: url(../images/icon-calendar.png); background-repeat: no-repeat; background-size: 18px; background-position: right 8px center; }
.form-textarea { width: 100%; padding: 16px; border: 1px solid #d8d8d8; background: #fff; height: 250px; font-size: 17px; }
.form-input::placeholder, .form-textarea::placeholder { color: #aeaeae; }
.form-search-wrap { position: relative; max-width: 360px; width: 100%;}
.form-search-input { height: 56px; padding: 0 24px; padding-right: 48px; width: 100%; background-color: #fff; border: 1px solid #e4e4e4; border-radius: 28px; font-size: 16px; font-weight: 600; }
.form-search-input::placeholder { color: #aeaeae; }
.form-search-btn { font-size: 20px; color: #01946f; position: absolute; right: 24px; top: 50%; transform: translateY(-50%);}

.form-label-wrap { display: flex; gap: 8px; flex-flow: wrap; }
.form-label-wrap.border:not(:first-child) { padding-top: 16px; border-top: 1px solid #e4e4e4; margin-top: 16px; }
.form-label-wrap.per4 .form-label { width: calc( ( 100% - 8px * 3 ) / 4 ); }
.form-label-wrap.per2 .form-label { width: calc( ( 100% - 8px ) / 2 ); }
.form-label-item { display: flex; justify-content: center; align-items: center; gap: 8px; height: 52px; border: 1px solid #e4e4e4; background: #fff; font-size: 16px; color: #aeaeae; transition: .2s; }
.form-label-item .icon { color: #fff; font-size: 20px; display: none; }
input:checked + .form-label-item, .form-label-item.active { border: 1px solid #01946f; background: #01946f; color: #fff; }
input:checked + .form-label-item .icon, .form-label-item.active .icon { display: block; }

.form-btn-wrap { gap: 8px; width: 100%; }
.form-btn-wrap .form-btn { width: 138px; height: 52px; font-size: 16px; font-weight: 600; color: #fff; border: 1px solid #fff; border-radius: 4px; text-align: center; display: flex; align-items: center; justify-content: center; transition: .2s; background: #01946f; }
/* .form-btn-wrap .form-btn:hover { background: #fff; color: #222; } */
.form-btn-wrap .form-btn.submit { background: #484848; }
.form-btn-wrap .form-btn.done { background: #707070; }
.form-btn-wrap .form-btn.disable { background: #e4e4e4; }
.form-btn-wrap .form-input { width: calc( 100% - 146px ); }

.form-sticker-wrap { position: relative; }
.form-sticker-wrap .form-sticker{ font-size: clamp( 14px, 0.83vw, 16px ); color: #fff; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); }
.form-sticker-wrap .form-input { padding-right: 64px; }

.form-footer-wrap { margin-top: 40px; }
.form-footer-txt { text-align: center; font-size: 18px; font-weight: 600; line-height: 1.5; margin-bottom: 24px; }
.form-submit-btn { width: 100%; max-width: 860px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 16px; height: 72px; background: #484848; text-align: center; font-size: 18px; font-weight: bold; color: #fff; transition: .2s; border-radius: 4px; }
.form-submit-btn.submit { background: #01946f; }
.form-submit-btn.disable { background: #e4e4e4; border-color: #e4e4e4; color: #fff; }
.form-submit-btn .icon { font-size: 24px; }

.guide-txt-wrap { display: flex; flex-flow: column; gap: 4px; }
.guide-txt { font-size: 14px; line-height: 1.5; position: relative; }
.guide-txt.dot { padding-left: 16px; }
.guide-txt.dot::after { content: ''; display: block; position: absolute; width: 4px; height: 4px; background: #707070; left: 0; top: 10px; border-radius: 50%; }

@media screen and (max-width: 1440px) {
  .form-wrap { gap: 40px; }
  .form-list { gap: 24px 8px; }
  .form-item { gap: 8px; }
  .form-item.half { width: 100%; }
  .form-item .item-default { font-size: 14px; }
  .form-input-wrap { gap: 8px; }
  .form-input { font-size: 14px; height: 48px; }
  .form-textarea { padding: 16px; height: 160px; font-size: 14px; }
  .form-search-wrap { position: relative; }
  .form-search-input { height: 48px; border-radius: 24px; padding-right: 32px; font-size: 14px; }
  .form-search-btn { font-size: 20px; right: 16px; }

  .form-label-wrap.per4 .form-label { width: calc( ( 100% - 8px * 2 ) / 3 ); }
  .form-label-item { gap: 4px; height: 48px; font-size: 14px; }
  .form-label-item .icon { font-size: 16px; }

  .form-btn-wrap { gap: 8px; }
  .form-btn-wrap .form-btn { width: 120px; height: 48px; font-size: 14px; line-height: 48px; }
  .form-btn-wrap .form-input { width: calc( 100% - 128px ); }

  .form-footer-wrap { margin-top: 24px; }
  .form-footer-txt { font-size: 14px; margin-bottom: 16px; }
  .form-submit-btn { height: 48px; line-height: 48px; font-size: 14px; }

  .guide-txt { font-size: 12px; }
}

/* form - 체크박스 */
.checked-item { align-items: flex-start; gap: 8px; }
.checked-item .icon { width: 20px; height: 20px; border: 1px solid #9999a6; border-radius: 2px; display: flex; align-items: center; justify-content: center; }
.checked-item .icon i { color: #aeaeae; font-weight: bold; font-size: 12px; line-height: 12px; }
.checked-item .txt { width: calc( 100% - 28px ); font-size: 16px; font-weight: 400; color: #202020; line-height: 1.5; }
.checked-item .link { margin-left: auto; font-size: 14px; text-decoration: underline; color: #fff; }
.form-checkbox:checked + .checked-item .txt { font-weight: 600; }
.form-checkbox:checked + .checked-item .icon { border: 1px solid #01946f; background: #01946f; }
.form-checkbox:checked + .checked-item .icon i { color: #fff; }

@media screen and (max-width: 1440px) {
  .checked-item  { gap: 6px; }
  .checked-item .txt { font-size: 14px; }
}

/* form - 라디오 */
.form-radio + .checked-item .icon { width: 20px; height: 20px; border: 1px solid #e4e4e4; background: #fff; border-radius: 50%; display: block; position: relative; }
.form-radio + .checked-item .icon::after { content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #01946f; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; }
.form-radio:checked + .checked-item .txt { color: #fff; }
/* .form-radio:checked + .checked-item .icon { border: 1px solid #01946f; background: #01946f; } */
.form-radio:checked + .checked-item .icon::after { display: block; }
@media screen and (max-width: 1440px) {
  .form-radio + .checked-item .icon { width: 20px; height: 20px; border: 1px solid #bfbfbf; background: #fff; border-radius: 50%; display: block; position: relative; }
  .form-radio + .checked-item .icon::after { content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #01946f; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; }
  .form-radio:checked + .checked-item { color: #01946f; }
  .form-radio:checked + .checked-item .icon { border: 1px solid #01946f; background: #fff; }
  .form-radio:checked + .checked-item .icon::after { display: block; }
}

/* modal */
.modal-container { position: fixed; top: 0; right: 0; left: 0; bottom: 0; z-index: 99999; background: rgba(0, 0, 0, 0.6); display: none; }
.modal-wrap { background: #fff; width: fit-content; height: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 16px; position: absolute; padding: 40px 32px; }
.modal-wrap::-webkit-scrollbar { display: none; }
.close-btn { position: absolute; font-size: 32px; cursor: pointer; top: 24px; right: 24px; z-index: 9; }
.modal-scroll-container .modal-scroll-wrap { width: 100%; }
.modal-scroll-wrap { max-height: 50dvh; overflow: auto; }
.modal-title-wrap { margin-bottom: 16px; }
.modal-title-wrap.border { padding-bottom: 16px; border-bottom: 1px solid #c4c4c4; }
.modal-title-wrap.center { text-align: center; }
.modal-title { font-size: 24px; font-weight: bold; }
.modal-sub-title { font-size: 16px; line-height: 1.5; margin-top: 12px; color: #707070; }

.modal-footer { align-items: center; margin-top: 40px; gap: 8px; justify-content: center; }
.modal-footer-btn { width: 100%; height: 56px; border-radius: 0; text-align: center; line-height: 54px; font-size: 16px; font-weight: bold; color: #202020; background: #fff; border: 1px solid #202020; padding: 0 24px; border-radius: 4px; }
.modal-footer-btn.close-btn { position: static; font-size: 16px; background: #aeaeae; color: #fff; border: 1px solid #aeaeae; }
.modal-footer-btn.submit-btn { background: #01946f; color: #fff; border: 1px solid #01946f; }
.modal-footer-btn.submit-btn.disable { background: #aeaeae; border: 1px solid #aeaeae; }
.modal-footer-btn.cancel-btn { background: #707070; color: #fff; border-color: #707070; }
.modal-footer-btn.write-btn { color: #01946f; border-color: #01946f; }

.modal-alert { border: 2px solid #e4e4e4; height: auto; width: calc( 100% - 80px ); padding: 40px 32px 32px; max-width: 560px; text-align: center; border-radius: 16px; left: 50%; right: unset; top: 50%; bottom: unset; transform: translate(-50%, -50%); }
.modal-alert .icon { display: block; width: 24px; margin: 0 auto; font-size: 24px; margin-bottom: 16px; }
.modal-alert .modal-title-wrap { margin-bottom: 16px; }
.modal-alert .modal-title-wrap .icon { margin-bottom: 8px; font-size: 40px; }
.modal-alert .modal-title { font-size: 32px; }
.modal-alert-txt { font-size: 18px; line-height: 1.5; }
.modal-alert .modal-footer { margin-top: 32px; }
.modal-alert .modal-footer-btn { width: 100%; height: 56px; line-height: 54px; font-size: 16px; }
.modal-alert .close-btn { font-size: 24px; top: 16px; right: 16px; }

.modal-select-wrap { width: 100%; top: unset; height: auto; transform: translateX(-50%) translateY(100%); bottom: 0; border-radius: 0; border-top-left-radius: 20px; border-top-right-radius: 20px; padding: 16px; transition: .2s; }
.modal-container.active .modal-select-wrap { transform: translateX(-50%) translateY(0%); }
.modal-select-wrap .modal-title-wrap { text-align: center; padding-top: 20px; position: relative; margin-bottom: 16px; }
.modal-select-wrap .modal-title-wrap::after { content: ''; display: block; width: 104px; height: 2px; background: #f0f0f0; border-radius: 2px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
.modal-select-wrap .close-btn { top: 36px; }

.select-item:not(:last-child) { border-bottom: 1px solid #f0f0f0; }
.select-check { height: 50px; }
.select-check .icon { width: 22px; height: 22px; border-radius: 50%; border: 1px solid #e1e1e1; position: relative; background: #fff; transition: .2s;  }
.select-check .icon::after { content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #01946f; opacity: 0; transition: .2s; }
input:checked ~ .select-check .icon { border: 1px solid #01946f; }
input:checked ~ .select-check .icon::after { opacity: 1; }

.select-group.wrap .select-item { width: 50%; }
.select-item.checkbox .select-check .icon { width: 17px; height: 17px; border-radius: 2px; }
.select-item.checkbox .select-check .icon::after { display: none; }
.select-item.checkbox .select-check .icon i { width: 100%; font-size: 12px; text-align: center; line-height: 15px; color: #fff; font-weight: bold; }
.select-item.checkbox input:checked ~ .select-check .icon { background: #01946f; }

.modal-menu-wrap { top: 0; left: unset; height: 100dvh; width: 300px; right: 0; transform: translateX(100%); transition: .2s; }
.modal-container.active .modal-menu-wrap { transform: translateX(0); }
.modal-menu-wrap .select-group { max-height: calc( 100dvh - 151px ); overflow: auto; }
.modal-menu-wrap .select-group::-webkit-scrollbar { display: none; }

.modal-notice-txt { position: fixed; top: 50%; width: calc( 100% - 32px ); max-width: 480px; left: 50%; transform: translate(-50%, -50%); z-index: 99999; padding: 12px 16px; font-size: 14px; font-weight: 500; text-align: center; line-height: 1.25; background: #000; border-radius: 4px; color: #fff; opacity: 0; display: none; transform: .2s; }
.modal-notice-txt.active { display: block; animation: fadeInOut 2s forwards; }
@keyframes fadeInOut {
  0%, 99% { opacity: 0; }
  10%, 90% { opacity: .75; }
  100% { display: none; }
}

@media screen and (max-width: 1280px) {
  .modal-container { background: none; }
  .modal-wrap { max-width: unset; width: 100%; height: 100dvh; border-radius: 0; padding: 40px 20px; }
  .close-btn { font-size: 24px; top: 20px; right: 20px; }
  .modal-title { font-size: 20px; }
  .modal-sub-title { font-size: 14px; margin-top: 8px; }

  .modal-footer { margin-top: 24px; }
  .modal-footer-btn { height: 48px; line-height: 48px; font-size: 16px; padding: 0 16px; }

  .modal-alert { border: 1px solid #e4e4e4; height: auto; width: calc( 100% - 40px ); padding: 40px 32px 32px; max-width: 320px; text-align: center; border-radius: 16px; left: 50%; right: unset; top: 50%; bottom: unset; transform: translate(-50%, -50%); }
  .modal-alert .icon { display: block; width: 24px; margin: 0 auto; font-size: 24px; margin-bottom: 16px; }
  .modal-alert .modal-title-wrap { margin-bottom: 16px; }
  .modal-alert .modal-title-wrap .icon { margin-bottom: 8px; }
  .modal-alert .modal-title { font-size: 20px; }
  .modal-alert-txt { font-size: 14px; line-height: 1.5; }
  .modal-alert .modal-footer { margin-top: 32px; }
  .modal-alert .modal-footer-btn { width: 100%; height: 48px; line-height: 46px; font-size: 14px; }
  .modal-alert .close-btn { font-size: 24px; top: 16px; right: 16px; }

  .modal-select-wrap { width: 100%; top: unset; height: auto; transform: translateX(-50%) translateY(100%); bottom: 0; border-radius: 0; border-top-left-radius: 20px; border-top-right-radius: 20px; padding: 16px; transition: .2s; }
  .modal-container.active .modal-select-wrap { transform: translateX(-50%) translateY(0%); }
  .modal-select-wrap .modal-title-wrap { text-align: center; padding-top: 20px; position: relative; margin-bottom: 16px; }
  .modal-select-wrap .modal-title-wrap::after { content: ''; display: block; width: 104px; height: 2px; background: #f0f0f0; border-radius: 2px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
  .modal-select-wrap .close-btn { top: 36px; }

  .select-item:not(:last-child) { border-bottom: 1px solid #f0f0f0; }
  .select-check { height: 50px; }
  .select-check .icon { width: 22px; height: 22px; border-radius: 50%; border: 1px solid #e1e1e1; position: relative; background: #fff; transition: .2s;  }
  .select-check .icon::after { content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #01946f; opacity: 0; transition: .2s; }
  input:checked ~ .select-check .icon { border: 1px solid #01946f; }
  input:checked ~ .select-check .icon::after { opacity: 1; }

  .select-group.wrap .select-item { width: 50%; }
  .select-item.checkbox .select-check .icon { width: 17px; height: 17px; border-radius: 2px; }
  .select-item.checkbox .select-check .icon::after { display: none; }
  .select-item.checkbox .select-check .icon i { width: 100%; font-size: 12px; text-align: center; line-height: 15px; color: #fff; font-weight: bold; }
  .select-item.checkbox input:checked ~ .select-check .icon { background: #01946f; }

  .modal-menu-wrap { top: 0; left: unset; height: 100dvh; width: 300px; right: 0; transform: translateX(100%); transition: .2s; }
  .modal-container.active .modal-menu-wrap { transform: translateX(0); }
  .modal-menu-wrap .select-group { max-height: calc( 100dvh - 151px ); overflow: auto; }
  .modal-menu-wrap .select-group::-webkit-scrollbar { display: none; }

  .modal-notice-txt { position: fixed; top: 50%; width: calc( 100% - 32px ); max-width: 480px; left: 50%; transform: translate(-50%, -50%); z-index: 99999; padding: 12px 16px; font-size: 14px; font-weight: 500; text-align: center; line-height: 1.25; background: #000; border-radius: 4px; color: #fff; opacity: 0; display: none; transform: .2s; }
  .modal-notice-txt.active { display: block; animation: fadeInOut 2s forwards; }
  @keyframes fadeInOut {
    0%, 99% { opacity: 0; }
    10%, 90% { opacity: .75; }
    100% { display: none; }
  }
}

/* index - s1 */
.s1 { height: 100dvh; text-align: center; position: relative; background: #fff; overflow: hidden; }
.s1-circle { position: absolute; border-radius: 50%; background: #c9d9d3; width: 200px; height: 200px; opacity: .6; -webkit-filter: blur(20px); filter: blur(20px); animation: circle_scale 3s linear infinite; }
@keyframes circle_scale {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(2); }
}
.s1-circle-1 { top: 30dvh; right: 64px; animation-delay: 1.5s; }
.s1-circle-2 { top: 48dvh; left: 24px; }
.s1 .container { height: 100%; justify-content: flex-end; gap: clamp( 80px, 16.7dvh, 180px ); }
.s1 .title-wrap { font-size: clamp( 32px, 3.33vw, 64px ); display: flex; flex-flow: column; align-items: center; gap: clamp( 24px, 3.7dvh, 40px ); }
.s1 .title { font-size: clamp( 48px, 3.33vw, 64px ); font-weight: 600; }
.s1 .sub-title { font-size: clamp( 14px, 2.22dvh, 24px ); }
.s1 .circle { position: absolute; width: clamp( 100px, 9.375vw, 180px ); height: clamp( 100px, 9.375vw, 180px ); background: #fff; border-radius: 50%; box-shadow: 2px 1px 6px 0 rgba(0, 0, 0, 0.16); padding: 8px; left: 50%; transform: translateX(-50%) translateY(-50%); z-index: 1; }
.s1 .circle-txt { display: block; animation: circle_txt 6s linear infinite; }
@keyframes circle_txt {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.s1 .circle-icon { font-size: 28px; color: #202020; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.s1 .img-wrap { position: relative; height: 46dvh; padding-bottom: 12dvh; box-sizing: content-box; }
.s1 .img-box { position: absolute; left: 50%; bottom: 12dvh; border-radius: 23dvh; overflow: hidden; width: 75vw; height: 46dvh; transform: translateX(-50%); }
.s1 .img-box video { display: block; position: absolute; height: 100%; width: 100%; top: 0; left: 0; bottom: 0; right: 0; object-fit: cover; }
.s1 .title-box { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; display: flex; flex-flow: column; gap: 100dvh; height: 145px; opacity: 0; overflow: hidden; }
.s1 .title-box .title, .s1 .title-box .sub-title { color: #fff; }
.s1 .title-2 .title { font-size: clamp( 40px, 5.2dvh, 56px ); line-height: 1.5; transform: translateY(100%); }

@media screen and (max-width: 1280px) {
  .s1 { height: 100vh; }
  .s1-circle { display: none; }
  .s1 .title-wrap { gap: 16px; }
  .s1 .title { font-size: 28px; font-weight: bold; }
  .s1 .sub-title { font-size: 14px; }
  .s1 .circle { width: 100px; height: 100px; }
  .s1 .circle-icon { font-size: 20px; }
  .s1 .img-wrap { position: relative; height: 24vh; padding-bottom: 20vh; }
  .s1 .img-box { bottom: 20vh; border-radius: 12vh; width: calc( 100% - 32px ); height: 24vh; }
  .s1 .title-box { gap: 100vh; height: 67px; }
  .s1 .title-2 .title { font-size: 24px; transform: translateY(200%);  }
}

@media screen and (max-width: 640px) {
  .s1 .title-2 .title { font-size: 20px; }
}

/* index - s2 */
.s2 { height: 100dvh; position: relative; background: #fff; overflow: hidden; }
.s2 .bg-txt { font-size: 100px; -webkit-text-stroke: 1px #e4e4e4; font-weight: bold; position: absolute; top: 13dvh; right: -64px; color: transparent; }
.s2 .container { justify-content: space-between; height: 100%; align-items: center; }
.s2 .img-wrap { width: 30%; opacity: 0; }
.s2 .img-1 { transform: translateY(40px); }
.s2 .img-2 { transform: translateY(120px); }
.s2 .img-wrap img { display: block; margin-bottom: 32px; }
.s2 .txt { font-size: 20px; line-height: 1.6; color: #6e6e6e; }
.s2 .title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, calc( -100% + 40px )); text-align: center; font-size: 48px; font-weight: bold; line-height: 1.4; opacity: 0; }

@media screen and (max-width: 1920px) {
  .s2 .container { max-width: 75vw; }
}

@media screen and (max-width: 1280px) {
  .s2 { height: 100vh; }
  .s2 .bg-txt { font-size: 30px; top: 24px; right: -32px;  }
  .s2 .container { flex-flow: column; align-items: flex-start; padding-top: 80px; padding-bottom: 80px; }
  .s2 .img-wrap {display: flex; flex-flow: column; width: 40%; max-width: 320px; }
  .s2 .img-1 { position: absolute; left: 16px; top: 96px; }
  .s2 .img-2 { position: absolute; right: 16px; bottom: 56px; align-items: flex-end; }
  .s2 .img-wrap img { margin-bottom: 16px; }
  .s2 .txt { font-size: 13px; white-space: nowrap; }
  .s2 .img-2 .txt { text-align: right; }
  .s2 .title { width: 100%; font-size: 20px; top: calc( 50% + 42px ); }
}

/* index - s3 */
.s3 { height: 100dvh; position: relative; background: #fff; overflow: hidden; }
.s3 .page-btn { position: absolute; width: 200px; height: 200px; border-radius: 50%; background: #01946f; display: flex; flex-flow: column; gap: 24px; align-items: center; text-align: center; justify-content: center; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 99; }
.s3 .page-btn::after { content: ''; display: block; position: absolute; width: 64px; height: 2px; background: #fff; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.s3 .page-num { font-size: 32px; font-weight: 500; color: #fff; opacity: .3; }
.s3 .page-num.active { opacity: 1; }
.s3-c .img-wrap { width: 50%; height: 100%; transform: translateY(100%); position: absolute; top: 0; right: 0; }
.s3-c1 .img-wrap { transform: translateY(0); }
.s3-c .img-wrap img { height: 100%; display: block; object-fit: cover; object-position: center; }
.s3-c .txt-wrap { width: 50%; height: 100%; display: flex; flex-flow: column; align-items: center; text-align: center; justify-content: center; gap: 24px; padding: 0 7vw; position: absolute; left: 0; top: 0; visibility: hidden; }
.s3-c .txt-wrap .icon { width: auto; height: 48px; transition: .4s 0s; transform: translateY(40px); opacity: 0; }
.s3-c .txt-wrap .sub-title { font-size: 18px; font-weight: 500; transition: .4s .05s; transform: translateY(40px); opacity: 0; }
.s3-c .txt-wrap .title { font-size: 48px; font-weight: bold; transition: .4s .1s; transform: translateY(40px); opacity: 0; }
.s3-c .txt-wrap .txt { margin: 16px 0; font-size: 20px; line-height: 1.6; color: #6e6e6e; transition: .4s .15s; transform: translateY(40px); opacity: 0; }
.s3-c .txt-wrap .btn { display: flex; align-items: center; gap: 16px; font-size: 20px; font-weight: 500; transition: .4s .2s; transform: translateY(40px); opacity: 0; }
.s3-c .txt-wrap .btn-icon { width: 32px; height: 32px; transition: .2s; }
.s3-c .txt-wrap .btn:hover .btn-icon { transform: translateX(10px); }

.s3-c .txt-wrap.active { visibility: visible; }
.s3-c .txt-wrap.active .icon,
.s3-c .txt-wrap.active .sub-title,
.s3-c .txt-wrap.active .title,
.s3-c .txt-wrap.active .txt,
.s3-c .txt-wrap.active .btn { transform: translateY(0px); opacity: 1; }

@media screen and (max-width: 1280px) {
  .s3 { height: 100vh; position: relative; background: #fff; overflow: hidden; }
  .s3 .page-btn { width: 80px; height: 80px; gap: 12px; top: 65%; }
  .s3 .page-btn::after { width: 32px; height: 1px; }
  .s3 .page-num { font-size: 16px; }
  .s3-c .img-wrap { width: 100%; height: 35%; top: unset; bottom: 0; }
  .s3-c .txt-wrap { width: 100%; height: 65%; gap: 16px; padding: 0 16px; }
  .s3-c .txt-wrap .icon { height: 32px; transform: translateY(24px); }
  .s3-c .txt-wrap .sub-title { font-size: 12px; transform: translateY(24px); }
  .s3-c .txt-wrap .title { font-size: 20px; transform: translateY(24px); }
  .s3-c .txt-wrap .txt { margin: 8px 0; font-size: 13px; transform: translateY(24px); }
  .s3-c .txt-wrap .btn { gap: 8px; font-size: 12px; transform: translateY(24px); }
  .s3-c .txt-wrap .btn-icon { width: 24px; height: 24px; transition: .2s; }
  .s3-c .txt-wrap .btn:hover .btn-icon { transform: translateX(10px); }
}

/* index - s4 */
.s4 { height: 100dvh; position: relative; background: #fff; }
.s4 .bg-txt { font-size: 100px; -webkit-text-stroke: 1px #e4e4e4; font-weight: bold; position: absolute; bottom: 0; left: 0; color: transparent; }
.s4 .circle { position: absolute; width: clamp( 100px, 9.375vw, 180px ); height: clamp( 100px, 9.375vw, 180px ); background: #fff; border-radius: 50%; box-shadow: 2px 1px 6px 0 rgba(0, 0, 0, 0.16); padding: 8px; z-index: 2; right: calc( ( 100vw - 1440px ) / 2 ); transform: translateY(-50%); }
.s4 .circle-txt { display: block; animation: circle_txt 6s linear infinite; }
@keyframes circle_txt {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.s4 .circle-icon { font-size: 28px; color: #202020; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.s4 .container { padding-left: calc( ( 100vw - 1440px ) / 2 );  height: 100%; display: flex; flex-flow: column; justify-content: center;}
.s4 .title-wrap { display: flex; flex-flow: column; gap: 24px; margin-bottom: 36px; }
.s4 .sub-title { font-size: 18px; font-weight: 500; color: #01946f; }
.s4 .title { font-size: clamp( 24px, 2.5vw, 48px ); font-weight: bold; line-height: 1.4; }
.s4 .pj-slide-wrap { position: relative; }
.s4 .pj-slide { width: 100%; padding-right: 16px; border-radius: 8px; overflow: hidden; }
.s4 .pj-slide .swiper-slide , .s4 .pj-slide .swiper-wrapper { height: fit-content; }
.s4 .img-container { padding-top: 75%; border-radius: 8px; overflow: hidden; }
.s4 .txt { position: absolute; font-size: 24px; font-weight: 600; color: #fff; bottom: 32px; left: 24px; width: calc( 100% - 48px ); line-height: 1.5; transform: translateY(40px); opacity: 0; transition: .4s; z-index: 1; }
.s4 .img-container::after { content: ''; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); z-index: 0; opacity: 0; transition: .4s; }
.s4 .img-container:hover .txt { transform: translateY(0); opacity: 1; }
.s4 .img-container:hover::after { opacity: 1; }
.s4 .slide-btn-wrap { display: flex; justify-content: flex-end; gap: 16px; padding-right: calc( ( 100vw - 1440px ) / 2 ); margin-top: 48px; align-items: center; }
.s4 .slide-btn { width: 48px; height: 48px; text-align: center; line-height: 48px; background: #fff; border-radius: 50%; border: 1px solid #e4e4e4; font-size: 24px; cursor: pointer; transition: .2s; }
.s4 .slide-btn:hover { background: #f5f5f5; }

@media screen and (max-width: 1920px) {
  .s4 .container { padding-left: calc( ( 100vw - 75vw ) / 2 ); }
}
@media screen and (max-width: 1440px) {
  .s4 .circle { width: 100px; height: 100px; right:  16px; }
  .s4 .container { padding-left: 16px; }
  .s4 .slide-btn-wrap { padding-right: 0; }
}

@media screen and (max-width: 1280px) {
  .s4 { height: 100vh; }
  .s4 .bg-txt { font-size: 30px; -webkit-text-stroke: 0.5px #e4e4e4; }
  .s4 .circle { width: 100px; height: 100px; }
  .s4 .circle-icon { font-size: 20px; }
  .s4 .title-wrap { gap: 16px; margin-bottom: 56px; }
  .s4 .sub-title { font-size: 12px; }
  .s4 .title { font-size: 20px; }
  .s4 .txt { font-size: 16px; bottom: 16px; left: 16px; width: calc( 100% - 32px ); transform: translateY(0px); opacity: 1; }
  .s4 .slide-btn-wrap { gap: 8px; margin-top: 24px; }
  .s4 .slide-btn { width: 40px; height: 40px; line-height: 40px; font-size: 16px; }
}

/* index - s5 */
.s5 { height: 100dvh; text-align: center; position: relative; background: #fff; overflow: hidden; }
.s5 .img-wrap { height: 100%; position: relative; }
.s5 .img-box { position: absolute; left: 50%; top: 50%; border-radius: 23dvh; overflow: hidden; width: 75vw; height: 46dvh; transform: translate(-50%, -50%); }
.s5 .img-box> img { display: block; position: absolute; height: 100%; width: 100%; top: 0; left: 0; bottom: 0; right: 0; object-fit: cover; }
.s5 .title-wrap { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; display: flex; flex-flow: column; align-items: center; gap: 40px; opacity: 0; }
.s5 .title-wrap * { color: #fff; }
.s5 .title {  font-size: 48px; font-weight: bold; line-height: 1.33; transition: .4s .0s; transform: translateY(40px); opacity: 0; }
.s5 .txt { font-size: 20px; line-height: 1.6; transition: .4s .05s; transform: translateY(40px); opacity: 0; }
.s5 .btn { display: flex; align-items: center; gap: 16px; font-size: 20px; font-weight: 500; transition: .4s .1s; transform: translateY(40px); opacity: 0; justify-content: center; }
.s5 .btn-icon { width: 32px; height: 32px; transition: .2s; filter: invert(1); }
.s5 .btn:hover .btn-icon { transform: translateX(10px); }

.s5 .title-wrap.active .title,
.s5 .title-wrap.active .txt,
.s5 .title-wrap.active .btn { transform: translateY(0); opacity: 1; }

@media screen and (max-width: 1280px) {
  .s5 { height: 100vh; }
  .s5 .img-box { border-radius: 12vh; width: calc( 100% - 32px ); height: 24vh; }
  .s5 .title-wrap { gap: 24px; }
  .s5 .title { font-size: 24px; transform: translateY(24px); }
  .s5 .txt { font-size: 14px; transform: translateY(24px); }
  .s5 .btn { gap: 8px; font-size: 12px; transform: translateY(24px); }
  .s5 .btn-icon { width: 24px; height: 24px; }
}

/* subpage */
.subpage #header { background: #fff; border-bottom: 1px solid #e4e4e4; }
.subpage #header.invert { background: transparent; border-color: transparent; }
.subpage-top { height: 730px; max-height: 100dvh; background-repeat: no-repeat; background-size: cover; background-position: center; }
.subpage-top .container { height: 100%; display: flex; justify-content: space-between; align-items: center; position: relative; }
.subpage-top .container::after { content: ''; display: block; width: calc( ( var(--after-width, 0px) ) - 40px ); height: 1px; background: #fff; position: absolute; top: 50%; transform: translateY(-50%); left: var(--after-left, 0px); }
.subpage-top-title { font-size: 40px; font-weight: bold; line-height: 1.35; color: #fff;  }
.subpage-top-txt { text-align: right; font-size: 18px; font-weight: 500; line-height: 1.78; color: #fff; text-transform: uppercase; }

.subpage-content { padding: 80px 0 120px; }
.section-wrap { gap: 120px; }
.section-title-wrap { gap: 40px; }
.section-title-wrap.margin-bottom { margin-bottom: 80px; }
.section-title { font-size: 48px; font-weight: bold; line-height: 1.4; }
.section-txt { font-size: 20px; line-height: 1.7; color: #6e6e6e; }

@media screen and (max-width: 1280px) {
  .subpage-top { height: 100vh; max-height: 650px; }
  .subpage-top .container { flex-flow: column; justify-content: center; gap: 16px; align-items: unset; }
  .subpage-top .container::after { content: ''; display: block; width: calc( ( var(--after-width, 0px) ) - 40px ); height: 1px; background: #fff; position: absolute; top: 50%; transform: translateY(-50%); left: var(--after-left, 0px); }
  .subpage-top-title { font-size: 24px; }
  .subpage-top-txt { font-size: 14px; }

  .subpage-content { padding: 40px 0 80px; }
  .section-wrap { gap: 80px; }
  .section-title-wrap { gap: 24px; }
  .section-title-wrap.margin-bottom { margin-bottom: 32px; }
  .section-title { font-size: 20px; }
  .section-txt { font-size: 13px; }
}

/* subpage - about */
.subpage-top.about { background-image: url(../images/subpage_top_about.png); }

@media screen and (max-width: 640px) {
  .subpage-top.about { background-image: url(../images/subpage_top_about_mb.png); }
}

/* subpage - vision */
.subpage-top.vision { background-image: url(../images/subpage_top_vision.png); }
.subpage-tab-group { justify-content: center; }
.subpage-tab { width: 100%; max-width: 230px; line-height: 70px; text-align: center; font-size: 18px; font-weight: 500; border-bottom: 2px solid transparent; }
.subpage-tab.active { font-weight: bold; color: #01946f; border-color: #01946f; }
.vision-content .item-wrap { gap: 24px; }
.vision-content .item { width: 100%; position: relative; }
.vision-content .item .img { position: absolute; left: 0; top: 0; right: 0; bottom: 0; height: 100%; object-fit: cover; object-position: center; z-index: -1; }
.vision-content .item .txt-wrap { padding: 165px 0 186px; gap: 40px; text-align: center; align-items: center; }
.vision-content .item .title { font-size: 24px; font-weight: 600; color: #fff; }
.vision-content .item .txt { font-size: 20px; line-height: 1.4; color: #fff; }

@media screen and (max-width: 1280px) {
  .subpage-tab-wrap { border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5; position: relative; z-index: 9; }
  .subpage-tab-group { display: none; width: 100%; background: #f5f5f5; position: absolute; top: 48px; padding: 0; }
  .subpage-tab-wrap.active .subpage-tab-group { display: block; }
  .subpage-tab { width: 100%; max-width: unset; line-height: 40px; border-bottom: 1px solid #e4e4e4; text-align: left; font-size: 13px; padding: 0 16px; }
  .subpage-tab-default { display: flex; height: 48px; padding: 0 16px; justify-content: space-between; align-items: center; font-size: 14px; font-weight: bold; font-weight: bold; color: #01946f; }

  .vision-content .item-wrap { flex-flow: column; }
  .vision-content .item .txt-wrap { padding: 56px 0; gap: 16px; }
  .vision-content .item .title { font-size: 20px; }
  .vision-content .item .txt { font-size: 13px; }
}
@media screen and (max-width: 640px) {
  .subpage-top.vision { background-image: url(../images/subpage_top_vision_mb.png); }
}

/* subpage - rcc */
.subpage-top.rcc { background-image: url(../images/subpage_top_rcc.png); }
.subpage-title-wrap { height: 420px; overflow: auto; position: relative; }
.subpage-title-wrap::-webkit-scrollbar { display: none; }
.subpage-title-wrap .img { z-index: -1; margin-top: -420px; position: relative; }
.subpage-title-wrap .img img { display: block; }
.subpage-title-wrap .img::after { content: ''; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); position: absolute; left: 0; top: 0; }
.subpage-title-wrap .container { height: 420px; display: flex; flex-flow: column; justify-content: center; gap: 24px; position: sticky; top: 0; left: 0; right: 0; }
.subpage-sub-title { font-size: 32px; font-weight: 500; color: #fff; }
.subpage-title { font-size: 48px; font-weight: bold; color: #fff; }
.subpage-txt { font-size: 20px; line-height: 1.7; color: #fff; }

.rcc-content .item-wrap { gap: 48px; }
.rcc-content .item { gap: 56px; }
.rcc-content .item.reverse { flex-flow: row-reverse; }
.rcc-content .item .img-wrap { width: 100%; }
.rcc-content .item .img-wrap img { display: block; }
.rcc-content .item .txt-wrap { width: 100%; justify-content: center; gap: 40px; border-top: 1px solid #c4c4c4; border-bottom: 1px solid #c4c4c4; }
.rcc-content .item .title { font-size: 24px; font-weight: bold; }
.rcc-content .item .txt { font-size: 20px; line-height: 1.8; }
.rcc-content .item .txt-group { gap: 0px; }
.rcc-content .item .txt.dot { padding-left: 12px; position: relative; }
.rcc-content .item .txt.dot::after { content: ''; display: block; position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #222; left: 0; top: calc( (( 1em * 1.8 ) - 3px ) / 2 ); }

@media screen and (max-width: 1280px) {
  .subpage-title-wrap { min-height: 248px; height: auto; padding: 24px 0; }
  .subpage-title-wrap .img { margin-top: 0; position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; }
  .subpage-title-wrap .img img { height: 100%; object-fit: cover; }
  .subpage-title-wrap .container { min-height: 248px; height: auto; gap: 16px; position: static; }
  .subpage-sub-title { font-size: 20px; }
  .subpage-title { font-size: 20px; }
  .subpage-txt { font-size: 13px; }

  .rcc-content .item-wrap { gap: 40px; }
  .rcc-content .item { gap: 24px; flex-flow: column; }
  .rcc-content .item.reverse { flex-flow: column; }
  .rcc-content .item .txt-wrap { padding: 24px 0; gap: 16px; }
  .rcc-content .item .title { font-size: 16px; }
  .rcc-content .item .txt { font-size: 13px; }
}
@media screen and (max-width: 640px) {
  .subpage-top.rcc { background-image: url(../images/subpage_top_rcc_mb.png); }
}

/* subpage - 프로젝트 소개 */
.subpage-top.project { background-image: url(../images/subpage_top_project.png); }
.subpage-content .tab-wrap { display: flex; justify-content: center; align-items: center; margin-bottom: 80px; }
.subpage-content .tab { width: 100%; max-width: 230px; line-height: 70px; border-radius: 35px; background: #fff; text-align: center; font-size: 18px; cursor: pointer; transition: .2s; }
.subpage-content .tab:hover { font-weight: bold; color: #01946f; }
.subpage-content .tab.active { background: #01946f; color: #fff; font-weight: bold; }
.subpage-content .tab-content { display: none; }
.subpage-content .tab-content.active { display: block; }
.project-slide-wrap { width: 100%; max-width: 1632px; padding: 0 96px; margin: 0 auto; position: relative; }
.project-slide .img-container { padding-top: 46.5%; }
.project-slide { width: 100%; }
.project-slide-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 64px; height: 64px; border-radius: 50%; border: 1px solid #01946f; text-align: center; line-height: 62px; background: #fff; font-size: 32px; color: #01946f; z-index: 9; transition: .2s; cursor: pointer; }
.project-slide-btn:not(.swiper-button-disabled):hover { background-color: #01946f; color: #fff; }
.project-slide-btn.swiper-button-disabled { opacity: 0; visibility: hidden; }
.project-slide-prev { left: 0; }
.project-slide-next { right: 0; }
.project-img-container { width: 100%; position: relative; padding-top: 53.33%; }
.project-img-container iframe { width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; }
.prepare-wrap { display: flex; flex-flow: column; align-items: center; text-align: center; padding-top: 40px; }
.prepare-wrap .img { max-width: 152px; width: 100%; display: block; margin-bottom: 80px; }
.prepare-wrap .title { font-size: 48px; font-weight: bold; margin-bottom: 24px; }
.prepare-wrap .txt { font-size: 24px; line-height: 1.33; }

@media screen and (max-width: 1632px) {
  .project-slide-wrap { padding: 0 16px; }
}

@media screen and (max-width: 1280px) {
  .subpage-content .tab-wrap { margin-bottom: 32px; overflow: auto; justify-content: flex-start; padding: 0 16px; }
  .subpage-content .tab-wrap::-webkit-scrollbar { display: none; }
  .subpage-content .tab { max-width: unset; min-width: 136px; line-height: 40px; border-radius: 20px; font-size: 12px; }
  .project-slide .img-container { padding-top: 46.5%; }
  .project-slide { width: 100%; }
  .project-slide-btn { width: 24px; height: 24px; line-height: 22px; font-size: 16px; }
  .project-slide-prev { left: 8px; }
  .project-slide-next { right: 8px; }
  .prepare-wrap { padding-top: 12px; }
  .prepare-wrap .img { max-width: 76px; margin-bottom: 24px; }
  .prepare-wrap .title { font-size: 20px; margin-bottom: 16px; }
  .prepare-wrap .txt { font-size: 13px; }
}
@media screen and (max-width: 640px) {
  .subpage-top.project { background-image: url(../images/subpage_top_project_mb.png); }
}

/* subpage - 자료실 */
.subpage-top.data { background-image: url(../images/subpage_top_data.png); }
.board-top-wrap { padding-bottom: 32px; border-bottom: 2px solid #222; }
.board-top-title { text-align: center; font-size: 44px; font-weight: bold; margin-bottom: 80px; }
.board-top-group { justify-content: space-between; align-items: flex-end; }
.board-top-txt { font-size: 18px; }
.search-wrap { display: flex; justify-content: flex-end; position: relative; }
.search-input { width: 100%; max-width: 360px; height: 56px; border: 2px solid #e4e4e4; background: #fff; padding: 0 32px; padding-right: 56px; font-size: 18px; }
.search-input::placeholder { color: #9d9d9d; }
.search-btn { position: absolute; width: 48px; height: 48px; line-height: 48px; border-radius: 50%; background: #01946f; font-size: 24px; color: #e4e4e4; right: 4px; top: 50%; transform: translateY(-50%); }
.board-wrap { border-bottom: 2px solid #202020; }
.board-item { display: flex; align-items: center; padding: 32px; gap: 40px; justify-content: space-between; transition: .2s; }
.board-item:hover { background: #f5faff; }
.board-item:not(:last-child) { border-bottom: 1px solid #e4e4e4; }
.board-item .txt-wrap { gap: 16px; max-width: calc( 100% - 72px ); }
.board-item .title { font-size: 18px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-item .sub-txt { font-size: 16px; color: #9d9d9d; }
.board-item .btn { width: 32px; height: 32px; border-radius: 50%; line-height: 30px; border: 1px solid #9d9d9d; text-align: center; font-size: 17px; color: #9d9d9d; transition: .2s; }
.board-item:hover .btn { border-color: #79926b; color: #79926b; }
.board-item .label { width: fit-content; min-width: 60px; padding: 0 16px; border-radius: 30px; line-height: 32px; border: 1px solid #01946f; text-align: center; font-size: 16px; font-weight: bold; color: #01946f; }

@media screen and (max-width: 1280px) {
  .subpage-top.data { max-height: 450px; }
  .board-top-wrap { padding-bottom: 16px; }
  .board-top-title { font-size: 22px; margin-bottom: 24px; }
  .board-top-txt { font-size: 14px; white-space: nowrap; }
  .search-wrap { width: 100%; }
  .search-input { height: 48px; border: 1px solid #e4e4e4; padding: 0 16px; padding-right: 40px; font-size: 14px; }
  .search-btn { width: 32px; height: 32px; line-height: 32px; font-size: 16px; }
  .board-item { padding: 16px 0; gap: 24px; }
  .board-item .txt-wrap { gap: 8px; max-width: calc( 100% - 56px ); }
  .board-item .title { font-size: 14px; }
  .board-item .sub-txt { font-size: 12px; }
  .board-item .label { font-size: 14px; line-height: 24px; }
}
@media screen and (max-width: 640px) {
  .subpage-top.data { background-image: url(../images/subpage_top_data_mb.png); }
  .board-top-group { flex-flow: column-reverse; align-items: flex-start; gap: 24px; }
}

/* 게시글 상세 */
.board_detail { padding-top: 160px; padding-bottom: 120px; min-height: calc( 100vh - 217px ); }
.board_detail .title-wrap { align-items: center; padding: 40px; border-top: 2px solid #333; border-bottom: 1px solid #a4a4a4; gap: 16px; }
.board_detail .title-wrap .sub-title { font-size: 16px; font-weight: bold; }
.board_detail .title-wrap .title { font-size: 24px; font-weight: bold; line-height: 1.25; }
.board_detail .title-wrap .txt-group { gap: 32px; }
.board_detail .title-wrap .txt { font-size: 16px; }
.board_detail .con-wrap { padding: 40px 0 80px; }
.board_detail .con-wrap * { word-break: break-all; white-space: pre-line; }
.board_detail .con-wrap img { max-width: 100%; width: unset;}
.file-download-group { gap: 16px; }
.file-download-wrap { height: 43px; align-items: center; padding: 0 16px; background: #f5f5f5; border-radius: 4px; gap: 8px; }
.file-download-wrap .icon { font-size: 19px; color: #a4a4a4; }
.file-download-wrap .file-title { font-size: 16px; min-width: 136px; font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.file-download-wrap { height: 52px; padding: 0 24px; }
.file-download-wrap i { font-size: 20px; }
.file-download-wrap .file-title { font-size: 17px; font-weight: 600; width: calc( 100% - 56px ); }
.board_detail .btm-wrap { margin-top: 40px; justify-content: space-between; align-items: center; position: relative; width: 100%; border-top: 1px solid #202020; padding-top: 24px; }
.board_detail .btm-wrap .btn { font-size: 17px; font-weight: bold; display: flex; gap: 8px; align-items: baseline; width: calc( (100% - 88px ) / 2 ); cursor: pointer; }
.board_detail .btm-wrap .next-btn { justify-content: flex-end; }
.board_detail .btm-wrap .btn .title { color: #a4a4a4; font-weight: 300; max-width: calc( 100% - 92px ); font-size: 17px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 1.5; }
.board_detail .btm-wrap .list-btn { width: 56px; height: 56px; border-radius: 50%; border: 2px solid #aeaeae; text-align: center; cursor: pointer; }
.board_detail .btm-wrap .list-btn i { font-size: 24px; color: #aeaeae; line-height: 52px; }

.board-detail-list { gap: 24px; }
.board-detail-item .item-title { width: 122px; font-size: 17px; font-weight: bold; position: relative; line-height: 1.5; }
.board-detail-item .item-title::after { content: ''; display: block; position: absolute; width: 2px; height: 18px; background: #d5d5d5; right: 0; top: 4px; }
.board-detail-item .item-txt { width: calc( 100% - 122px ); padding-left: 24px; font-size: 17px; line-height: 1.5; }

@media screen and (max-width:1280px) {
  .board_detail { padding-top: 80px; padding-bottom: 80px; }
  .board_detail .title-wrap { align-items: flex-start; padding: 0; padding-bottom: 24px; border-top: 0; gap: 12px; }
  .board_detail .title-wrap .sub-title { font-size: 14px; }
  .board_detail .title-wrap .title { font-size: 18px;}
  .board_detail .title-wrap .txt-group { gap: 24px; width: 100%; justify-content: center; }
  .board_detail .title-wrap .txt { font-size: 13px; }
  .board_detail .con-wrap { padding: 24px 0; }
  .file-download-group { gap: 8px; }
  .file-download-wrap { height: 40px; padding: 0 16px; }
  .file-download-wrap i { font-size: 16px; }
  .file-download-wrap .file-title { font-size: 14px; width: calc( 100% - 48px ); }
  .board_detail .btm-wrap { padding-top: 16px; }
  .board_detail .btm-wrap .btn { font-size: 14px; width: calc( (100% - 64px ) / 2 ); }
  .board_detail .btm-wrap .btn .title { display: none; }
  .board_detail .btm-wrap .list-btn { width: 32px; height:32px; border: 1px solid #aeaeae; }
  .board_detail .btm-wrap .list-btn i { font-size: 16px; line-height: 30px; }

  .board-detail-list { gap: 16px; }
  .board-detail-item .item-title { width: 96px; font-size: 14px; }
  .board-detail-item .item-title::after { height: 14px; }
  .board-detail-item .item-txt { width: calc( 100% - 96px ); padding-left: 16px; font-size: 14px; }
}

/* subpage - 자료실 - 제안요청서(RFP) */
.modal-wrap .join-agree-wrap { margin-top: 24px; }

/* subpage - 고객센터 - 자주묻는질문 */
.subpage-top.cs { background-image: url(../images/subpage_top_cs.png); }
.board-top-group .board-top-title { margin-bottom: 0; }
.faq-contents-wrap { border-bottom: 2px solid #202020; }
.faq-contents-item { border-bottom: 1px solid #e4e4e4; width: 100%;  cursor: pointer;  }
.faq-contents-item .icon { display: block; font-size: 32px; line-height: 56px; }
.faq-contents-item .content-wrap { padding: 20px 24px; display: flex; width: 100%; align-items: flex-start; min-height: 88px; position: relative; background: #fff; transition: .2s;}
.faq-contents-item .faq-text { width: 56px; height: 56px; border-radius: 50%; text-align: center; background: #484848; font-size: 32px; line-height: 56px; font-weight: bold; color: #fff; }
.faq-contents-item .faq-title { width: calc( 100% - 88px ); padding: 0 24px; padding-top: 13px; font-size: 20px; font-weight: 300; line-height: 1.5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.faq-contents-item .answer-wrap { background: #f5f5f5; border-top: 1px solid #e4e4e4; display: none; }
.faq-contents-item .answer-wrap .content-wrap { align-items: flex-start; padding-top: 40px; padding-bottom: 40px; background: none; }
.faq-contents-item .answer-wrap .faq-text { background: #fff; color: #202020; }
.faq-contents-item .answer-wrap .faq-title { white-space: unset; padding-top: 0; }

.faq-contents-item.active .faq-title { white-space: unset; }
.faq-contents-item.active .answer-wrap { display: block; }
.faq-contents-item.active .icon { transform: rotate(180deg); }

@media screen and (max-width: 1280px) {
  .board-top-group.faq-group { flex-flow: column; text-align: center;  align-items: center; }
  .subpage-top.cs { max-height: 450px; }
  .faq-contents-wrap { border-bottom: 1px solid #202020; }
  .faq-contents-item .icon { font-size: 16px; line-height: 40px; }
  .faq-contents-item .content-wrap { padding: 16px 8px; min-height: 72px; }
  .faq-contents-item .faq-text { width: 24px; height: 24px; font-size: 14px; line-height: 24px; }
  .faq-contents-item .faq-title { width: calc( 100% - 40px ); padding: 0 16px; padding-top: 0; font-size: 14px; ine-height: 1.5; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: calc((14px* 1.5)* 2); white-space: unset; }
  .faq-contents-item .answer-wrap .content-wrap { padding-top: 16px; padding-bottom: 16px; }
  .faq-contents-item.active .faq-title { height: auto; display: block; }
}
@media screen and (max-width: 640px) {
  .subpage-top.cs { background-image: url(../images/subpage_top_cs_mb.png); }
}

/* subpage - 고객센터 - 문의하기 */
.subpage-content .form-wrap { padding-top: 40px; }
.file-upload-wrap { width: 100%; gap: 16px; }
.file-upload-btn { width: 148px; display: flex; justify-content: center; gap: 8px; height: 52px; background-color: #7d7d7d; text-align: center; align-items: center; font-size: 17px; font-weight: 300; color: #fff; }
.select-preview-wrap { width: 100%; display: flex; flex-flow: column; gap: 8px; }
.select-preview-item { width: 100%; height: 52px; display: flex; align-items: center; padding: 0 16px; background: #f5f5f5; }
.select-preview-item .icon { font-size: 20px; }
.select-preview-wrap .title { width: calc( 100% - 36px ); font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 8px; }
.select-preview-wrap .del-btn { font-size: 16px; color: #aeaeae; }
.policy-agree-txt-wrap { padding: 32px; background: #f9f9f9; }
.policy-agree-txt-wrap .title { font-size: 18px; font-weight: 500; margin-bottom: 24px; }
.policy-agree-txt-group { gap: 12px; }
.policy-agree-txt-item .item-title { width: 136px; font-size: 16px; font-weight: 300; color: #999; line-height: 1.5; }
.policy-agree-txt-item.eng .item-title { width: 200px; }
.policy-agree-txt-item .item-txt { width: calc( 100% - 136px ); font-size: 16px; font-weight: 300; color: #999; line-height: 1.5; }
.policy-agree-txt-item.eng .item-txt { width: calc( 100% - 200px ); }

@media screen and (max-width: 1280px) {
  .board-top-group.sp-bt { flex-flow: row; align-items: baseline; }
  .subpage-content .form-wrap { padding-top: 24px; }
  .file-upload-wrap { gap: 8px; }
  .file-upload-btn { width: 128px; height: 48px; font-size: 14px; }
  .select-preview-item { height: 48px; }
  .select-preview-item .icon { font-size: 16px; }
  .select-preview-wrap .title { font-size: 14px; }
  .select-preview-wrap .del-btn { font-size: 14px; }
  .policy-agree-txt-wrap { padding: 24px 16px; }
  .policy-agree-txt-wrap .title { font-size: 14px; margin-bottom: 16px; }
  .policy-agree-txt-group { gap: 8px; }
  .policy-agree-txt-item { flex-flow: column; }
  .policy-agree-txt-item .item-title { width: auto; font-size: 13px; font-weight: bold; }
  .policy-agree-txt-item .item-txt { width: 100%; font-size: 13px; }
  .policy-agree-txt-item.eng .item-txt { width: 100%; }
}

/* 로그인 */
.login { padding: 160px 0 120px; display: flex; flex-flow: column; justify-content: center; align-items: center; background-image: url(../images/login_bg.png); background-size: cover; }
.login .user-section { padding: 80px 88px; background: #fff; border-radius: 20px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); }
.user-section .user-wrap { width: 520px; margin: 0 auto; }
.user-section .user-wrap .title-wrap { text-align: center; padding-bottom: 30px; border-bottom: 1px solid #202020; margin-bottom: 30px; gap: 24px; }
.user-section .user-wrap .title-wrap .title { font-size: 40px; font-weight: bold; }
.user-section .user-wrap .title-wrap .txt { font-size: 17px; word-break: keep-all; line-height: 1.5; }
.user-section .user-wrap .input-wrap { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px;}
.user-section .user-wrap .form-input:focus { border-color: #01946f; box-shadow: inset 0 3px 6px 0 rgba(1, 148, 111, 0.16); }
.user-section .login-btn { width: 100%; height: 56px; border-radius: 4px; background: #01946f; font-size: 17px; font-weight: bold; color: #fff; margin-bottom: 24px; }
.user-section .user-link-wrap { display: flex; align-items: center; justify-content: center; padding-bottom: 32px; border-bottom: 1px solid #202020; margin-bottom: 40px; }
.user-section .user-link-wrap .div-mark { width: 1px; height: 19px; background-color: #e4e4e4; margin: 0 15.5px; }
.user-section .user-link-wrap .find-btn { font-size: 16px; font-weight: 300; color: #949599; }
.user-section .login-sns-wrap { display: flex; flex-direction: column; gap: 16px; padding-bottom: 32px; border-bottom: 1px solid #202020; margin-bottom: 32px; }
.user-section .login-sns-wrap .btn { width: 100%; height: 56px; border-radius: 4px; overflow: hidden; display: flex; align-items: center; gap: 16px; justify-content: center; font-size: 16px; font-weight: 600; }
.user-section .login-sns-wrap .btn img { height: 100%; object-fit: cover; object-position: center; }
.user-section .login-sns-wrap .btn .icon { font-size: 24px; }
.user-section .user-wrap .sub { text-align: center; font-size: 18px; font-weight: 600; color: #202020; margin-bottom: 24px; }
.user-section .join-btn { width: 100%; height: 56px; text-align: center; line-height: 52px; border-radius: 4px; font-size: 16px; color: #01946f; border: 2px solid #01946f; font-weight: bold; background-color: #fff; margin-bottom: 24px; transition: .2s; }
.user-section .join-btn:hover { background: #01946f; color: #fff; }

@media screen and (max-width: 1280px) {
  .login { padding: 0; background: #fff; }
  .login .user-section { padding: 80px 16px; width: 100%; background: #fff; border-radius: 20px; box-shadow: none; }
  .user-section .user-wrap { width: 100%; padding-top: 0; }
  .user-section .user-wrap .title-wrap { padding-bottom: 24px; margin-bottom: 24px; gap: 16px; }
  .user-section .user-wrap .title-wrap .title { font-size: 24px; }
  .user-section .user-wrap .title-wrap .txt { font-size: 14px; }
  .user-section .user-wrap .input-wrap { gap: 8px; margin-bottom: 8px; }
  .user-section .login-btn { height: 48px; font-size: 14px; margin-bottom: 16px; }
  .user-section .user-link-wrap { margin-bottom: 24px; }
  .user-section .user-link-wrap .div-mark { margin: 0 20px; height: 12px; }
  .user-section .user-link-wrap .find-btn { font-size: 14px; }
  .user-section .login-sns-wrap { gap: 8px; padding-bottom: 24px; margin-bottom: 24px; }
  .user-section .login-sns-wrap .btn { height: 48px; font-size: 14px; gap: 8px; }
  .user-section .user-wrap .sub { font-size: 14px; margin-bottom: 16px; }
  .user-section .join-btn { height: 48px; line-height: 44px; font-size: 14px; margin-bottom: 0; }
}

/* 회원가입 */
.join .user-section { padding: 160px 0 120px; height: 100%; min-height: calc( 100vh - 220px ); display: flex; flex-flow: column; justify-content: center; }
.user-section .form-submit-btn { height: 56px; font-size: 16px; }
.join-agree-wrap { gap: 8px; }
.join-agree-item-all { background: #f5f5f5; }
.join-agree-item { justify-content: space-between; align-items: center; padding: 12px 16px; }
.join-agree-item label { width: calc( 100% - 56px - 8px ); }
.join-agree-item .more-btn { font-size: 14px; font-weight: 500; color: #373948; text-decoration: underline; width: 56px; text-align: right; }
.checked-item-sub { padding-left: 48px; gap: 24px; margin-top: 8px; }
.checked-item-sub .checked-item .txt { font-size: 14px; font-weight: normal; }

@media screen and (max-width: 1280px) {
  .join .user-section { padding: 80px 16px; height: 100%; }
  .user-section .form-submit-btn { height: 48px; font-size: 16px; }
  .join-agree-item { padding: 8px; }
  .join-agree-item label { width: calc( 100% - 40px - 8px ); }
  .join-agree-item .more-btn { font-size: 12px; width: 40px; }
  .checked-item-sub { padding-left: 48px; gap: 24px; margin-top: 8px; }
}

/* 결과페이지 */
.result-wrap { text-align: center; }
.result-wrap .mb { display: none;}

.result-wrap .icon { font-size: 48px; }
.result-wrap .result-title { font-size: 48px; font-weight: 500; margin-top: 16px; line-height: 1.25; }
.result-wrap .result-title span { font-weight: bold; }
.result-wrap .sub-wrap { margin-top: 32px; }
.result-wrap .sub-wrap .sub { font-size: 18px; font-weight: 300; color: #202020; line-height: 1.44; }
.result-wrap .sub-wrap .sub .link { display: inline-block; color: #127be5; text-decoration: underline; }
.result-wrap .btn-wrap { justify-content: center; margin-top: 56px; gap: 16px; align-items: center; }
.result-wrap .btn-wrap .btn { width: 240px; height: 64px; border-radius: 4px; border: 2px solid #01946f; text-align: center; line-height: 60px; font-size: 18px; font-weight: bold; color: #01946f; background: #fff; }
.result-wrap .btn-wrap .btn.green { background: #01946f; border: 2px solid #01946f; color: #fff; }
.result-wrap .btn-wrap .sub-btn { font-size: 18px; text-decoration: underline; }

@media screen and (max-width: 1280px) {
    .result-wrap .icon { font-size: 32px; }
    .result-wrap .result-title { font-size: 32px; margin-top: 8px; }
    .result-wrap .sub-wrap { margin-top: 16px; }
    .result-wrap .sub-wrap .sub { font-size: 14px; }
    .result-wrap .btn-wrap { margin-top: 32px; }
    .result-wrap .btn-wrap .btn { width: 100%; height: 48px; line-height: 44px; font-size: 14px; }
    .result-wrap .btn-wrap .sub-btn { font-size: 14px; }
}

/* 마이페이지 */
.mypage { padding-top: 160px; padding-bottom: 120px; display: flex; align-items: flex-start; gap: 40px; justify-content: center; }
.mypage-nav { width: 280px; background: #fff; border-radius: 20px; border: 1px solid #e4e4e4; overflow: hidden; position: sticky; top: 120px;}
.mypage-nav-title { width: 100%; line-height: 60px; text-align: center; background: #01946f; font-size: 24px; color: #fff; font-weight: bold; }
.mypage-nav-wrap { padding: 32px; padding-top: 0; }
.mypage-nav-item { height: 60px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #e4e4e4; font-size: 17px; font-weight: 500; white-space: nowrap; }
.mypage-nav-item.active { color: #01946f; }
.mypage-nav .logout-btn { width: 100%; max-width: 126px; height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; font-size: 16px; color: #aeaeae; border: 1px solid #aeaeae; border-radius: 4px; background: #fff; margin-top: 16px; transition: .2s; }
.mypage-nav .logout-btn:hover { background: #f5f5f5; }
.mypage-wrap { width: 100%; max-width: 1280px; }
.mypage-section:not(:last-child) { margin-bottom: 80px; }
.mypage-title-wrap {  }
.mypage-title-wrap.border { padding-bottom: 24px; border-bottom: 1px solid #333; }
.mypage-title { position: relative; padding-left: 20px; font-size: 32px; font-weight: bold; }
.mypage-title::after { content: ''; display: block; position: absolute; width: 8px; height: 36px; background: #01946f; left: 0; top: 50%; transform: translateY(-50%); }

@media screen and (max-width: 1280px) {
  .mypage { padding-top: 56px; padding-bottom: 80px; flex-flow: column; gap: 16px; background: #f5f5f5; }
  .mypage-nav { width: 100%; background: #fff; border-radius: 0; border: 0; position: static; padding: 40px 16px; }
  .mypage-nav-title { line-height: 1; text-align: left; background: none; font-size: 20px; color: #202020; padding-left: 12px; position: relative; border-bottom: 1px solid #333; padding-bottom: 16px; }
  .mypage-nav-title::after { content: ''; display: block; position: absolute; width: 3px; height: 24px; background: #01946f; left: 0; top: -2px; }
  .mypage-nav-wrap { padding: 0; }
  .mypage-nav-item { height: 52px; padding: 0 16px; font-size: 16px; }
  .mypage-wrap { background: #fff; }
  .mypage-section { padding: 24px 16px; }
  .mypage-section:not(:last-child) { margin-bottom: 0; }
  .mypage-title-wrap.border { padding-bottom: 16px; }
  .mypage-title { padding-left: 12px; font-size: 20px; }
  .mypage-title::after { width: 3px; height: 24px; }
}

/* 마이페이지 - 다운로드 내역 */
.null-txt-wrap { padding: 80px; display: flex; flex-flow: column; gap: 16px; align-items: center; text-align: center; }
.null-txt-wrap .icon { font-size: 32px; color: #aeaeae; }
.null-txt { font-size: 20px; color: #aeaeae }
.mp-board-list {}
.mp-board-item { padding: 24px 0; border-bottom: 1px solid #e4e4e4; display: flex; align-items: center; }
.mp-board-item .label { width: 160px; text-align: center; font-size: 18px; font-weight: 600; }
.mp-board-item .title { width: calc( 100% - 160px - 124px ); font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mp-board-item .date { width: 124px; text-align: center; font-size: 16px; color: #aeaeae; }

@media screen and (max-width: 1280px) {
  .null-txt-wrap { padding: 40px; }
  .null-txt-wrap .icon { font-size: 20px; }
  .null-txt { font-size: 13px; }
  .mp-board-item { padding: 16px 0; }
  .mp-board-item .label { width: 56px; font-size: 14px; }
  .mp-board-item .title { width: calc( 100% - 56px - 64px ); font-size: 13px; }
  .mp-board-item .date { width: 64px; text-align: center; font-size: 12px; }
}

/* 마이페이지 - 문의 내역 */
.toggle-title { cursor: pointer; }
.toggle-active .toggle-title .icon { transform: rotate(180deg); }
.toggle-content { display: none; }
.toggle-active .toggle-content { display: block; }

.inquiry-item { background: #fff; border-bottom: 1px solid #e4e4e4; }
.inquiry-item .q-item { position: relative; }
.inquiry-item .q-item .item-txt { display: flex; }
.inquiry-item .label { width: fit-content; padding: 0 24px; white-space: nowrap; min-width: 104px; line-height: 40px; border-radius: 20px; background: #aeaeae; text-align: center; font-size: 16px; font-weight: 600; color: #FFF; }
.inquiry-item .label.active { background: #01946f; }
.inquiry-item.toggle-active .q-item { border-bottom: 1px solid #e4e4e4; }
.inquiry-item .item-txt { font-size: 16px; line-height: 1.5; align-items: flex-start; }
.inquiry-item .txt { font-size: 18px; font-weight: 600; line-height: 1.5; }
.inquiry-item .sub-txt { color: #aeaeae; font-size: 14px; }
.inquiry-item .q-item .item-txt { font-weight: 500; width: calc( 100% - 40px ); padding: 16px 0; padding-right: 40px;}
.inquiry-item .q-item .item-txt .sub-txt { padding-top: 16px; margin-left: auto; width: 80px; }
.inquiry-item .q-item .item-txt .txt { padding-left: 16px; padding-top: 6px; width: calc( 100% - 186px - 80px ); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inquiry-item.toggle-active .q-item .item-txt .txt { white-space: unset; }
.inquiry-item .q-item .icon { position: absolute; font-size: 24px; right: 16px; top: 24px; }
.inquiry-item .q-content { padding: 24px; }
.inquiry-item .btn-wrap { justify-content: center; margin: 24px 0; gap: 16px; align-items: center; }
.inquiry-item .btn { width: 154px; height: 52px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 17px; font-weight: bold; border-radius: 4px; color: #fff; }
.inquiry-item .btn.del-btn { background: #aeaeae; }
.inquiry-item .btn.edit-btn { background: #01946f; }
.inquiry-item .a-content { padding: 24px; background: #f5f5f5; }
.inquiry-item .a-content .txt-group { align-items: baseline; gap: 16px; margin-bottom: 16px; }

@media screen and (max-width:1280px) {
  .inquiry-item .q-item { position: relative; }
  .inquiry-item .q-item .item-txt { display: flex; }
  .inquiry-item .label { width: 72px; line-height: 32px; border-radius: 16px; font-size: 12px; position: absolute; right: -80px; top: 50%; transform: translateY(-50%); }
  .inquiry-item .item-txt { font-size: 12px; }
  .inquiry-item .txt { font-size: 14px; }
  .inquiry-item .sub-txt { font-size: 12px; }
  .inquiry-item .q-item .item-txt { width: calc( 100% - 80px ); padding: 16px 0; padding-right: 0; position: relative; flex-flow: column; gap: 8px; }
  .inquiry-item .q-item .item-txt .sub-txt { padding-top: 0; margin-left: auto; width: 100%; text-align: left; }
  .inquiry-item .q-item .item-txt .txt { padding-left: 0; padding-top: 0; width: 100%; }
  .inquiry-item.toggle-active .q-item .item-txt .txt { white-space: unset; }
  .inquiry-item .q-item .icon { display: none; }
  .inquiry-item .q-content { padding: 16px; }
  .inquiry-item .btn-wrap { margin: 8px 0 24px; gap: 8px; }
  .inquiry-item .btn { width: 56px; height: 32px; font-size: 12px; }
  .inquiry-item .a-content { padding: 16px; }
  .inquiry-item .a-content .txt-group { gap: 8px; margin-bottom: 8px; }
}

/* 마이페이지 - 회원정보 수정 */
.mypage-wrap .user-section .user-wrap { margin: 0; padding-top: 40px; }
.leave-btn { background: #fff; color: #aeaeae; font-weight: 500; }
.modal-wrap .user-section .user-wrap .title-wrap { gap: 16px; }
.modal-wrap .user-section .user-wrap .title-wrap .title { font-size: 32px; }

@media screen and (max-width:1280px) {
  .mypage-wrap .user-section .user-wrap { padding-top: 24px; }
  .modal-wrap .user-section .user-wrap .title-wrap .title { font-size: 20px; }
}

/* 개인정보 처리방침 */
.subpage-top.policy { background-image: url(../images/subpage_top_policy.png); }
.subpage-top.policy .container { justify-content: center; }
.policy-wrap { display: flex; flex-flow: column; gap: 48px; }
.policy-wrap * { font-size: 20px; line-height: 1.8; }
.policy-top { padding: 40px 48px; background: #CCEAE2; }
.policy-title { font-weight: bold; }
.policy-sub-txt { font-size: 16px; color: #707070; margin-top: 16px; }
.policy-group { display: flex; flex-flow: column; gap: 8px; }
.policy-wrap .padding-left { padding-left: 16px; }

@media screen and (max-width:1280px) {
  .subpage-top.policy { max-height: 450px; }
  .subpage-top.policy .subpage-top-title { text-align: center; }
  .policy-wrap { gap: 32px; }
  .policy-wrap * { font-size: 14px; }
  .policy-top { padding: 16px; }
  .policy-sub-txt { font-size: 12px; margin-top: 8px; }
  .policy-wrap .padding-left { padding-left: 8px; }
}