@charset "utf-8";
/* modal */
.myModal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; display: none; width: 100%; height: 100%; /*overflow: hidden;*/ outline: 0; transition: all 0.5s ease-in-out; background: rgba(0,0,0,.7); }
.myModal-dialog { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: none; max-height: calc(100% - 1.5rem); margin: 1.75rem auto; }
.myModal-dialog:before { display: block; width: 100%; height: 0px; content: ""; }
.myModal-dialog:after { display: block; width: 100%; height: 0px; content: ""; }
.myModal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; border-radius: .3rem; outline: 0; overflow: hidden; max-height: calc(100vh - 3.5rem); top: -100px; transition: all 0.5s ease-in-out; }
.myModal-content.open { top: 0; opacity:1; visibility: visible; transition: all 0.5s ease-in-out; }
.myModal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 1rem 1rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: .3rem; border-top-right-radius: .3rem; flex-shrink: 0; }
.myModal-header .header-title { align-self: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.myModal-body { position: relative; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 1rem; overflow-y: auto; }
.myModal-body::-webkit-scrollbar{ width: 0px; }
.myModal-body::-webkit-scrollbar-thumb{ width: 0px; }
.myModal-body::-webkit-scrollbar-track{}
.myModal-footer { display: flex; align-items: center; justify-content: flex-end; padding: 1rem; border-top: 1px solid #dee2e6; border-bottom-right-radius: .3rem; border-bottom-left-radius: .3rem; flex-shrink: 0; }
.myModal .myModal-header button.closex,
.myModal .myModal-footer button.closex{ position: relative; width: 40px; height: 40px !important; padding: 0 !important; border-radius: 0; border: 0; background: transparent; outline: none; box-shadow: none; }
.myModal .myModal-header button.closex:before,
.myModal .myModal-header button.closex:after,
.myModal .myModal-footer button.closex:before, 
.myModal .myModal-footer button.closex:after{ content: ""; margin: auto; display: block; width: 50%; height: 1px; background: #fff; }
.myModal .myModal-header button.closex:before,
.myModal .myModal-footer button.closex:before{ transform: rotate(-45deg); }
.myModal .myModal-header button.closex:after,
.myModal .myModal-footer button.closex:after{ transform: rotate(45deg); }
.myModal .body-closex { position: absolute; right: 5px; top: 5px; width: 40px; height: 40px !important; padding: 0 !important; border-radius: 0; border: 0; background: transparent; outline: none; box-shadow: none; }
.myModal .body-closex:before,
.myModal .body-closex:after { content: ""; margin: auto; display: block; width: 50%; height: 1px; background: #000; }
.myModal .body-closex:before{ transform: rotate(-45deg); }
.myModal .body-closex:after{ transform: rotate(45deg); }
@media (max-width: 768px) {
    .myModal .myModal-dialog { height: 100vh; max-height: 100vh; margin: 0 auto; }
    .myModal .myModal-content { height: 100vh; max-height: 100vh; border-radius: 0; }
    .myModal .myModal-header,.myModal .myModal-footer { border-radius: 0; }
}

/* 전화상담 */
.modal-callcenter .myModal-dialog { max-width: 568px; }
.modal-callcenter .myModal-header { display: none; }
@media (max-width: 768px) {
    .modal-callcenter .myModal-dialog { height: 100vh; overflow-y: auto; }
    .modal-callcenter .myModal-dialog:before,
    .modal-callcenter .myModal-dialog:after { height: 0; }
    .modal-callcenter .myModal-content { height: 100vh; max-height: 100vh; }
    .modal-callcenter .myModal-body { padding: .5rem; }
}
/* 모달 로그인 */
.modal-login .myModal-dialog { max-width: 460px; height: 100vh; max-height: 100vh; justify-content: space-between; }
.modal-login .myModal-header { display: none; }
.modal-callcenter .pop-layer-inner { position: relative; }
.pop-layer-inner .pop-title { display: flex; padding: 0 0 15px 0; border-bottom: solid 2px #000; }
.pop-layer-inner .pop-title > span { display: inline-block;  color: #000; font-size: 22px; align-self: center; }
.pop-layer-inner .pop-title > .closex { margin-left: auto; width: 40px; height: 40px; text-indent: -999em; white-space: nowrap; background: url(/images/ico-close.png) no-repeat center center; overflow: hidden; }
.pop-layer-inner .pop-guide { margin: 10px 0 20px 0; }
.pop-layer-inner .pop-guide > li { font-weight: 600; letter-spacing: -0.5px; }
.pop-layer-inner .pop-guide > li.time { color: #dc3545; }
.pop-layer-inner .pop-guide > li.time > span { display: inline-block; }
.pop-layer-inner .pop-guide > li.time > span:not(:first-child) { margin-left: 10px; }
.pop-layer-inner .detail-items { padding: 15px 25px 15px 25px; background-color: #f9fafc; }
.pop-layer-inner .detail-items h3 { font-size: 16px; font-weight: 500; color: #000; padding: 10px 0 10px; }
.pop-layer-inner .detail-items .layer-model { display: flex; width: 100%; margin-bottom: 25px; }
.pop-layer-inner .detail-items .layer-model .image { flex: 0 0 90px; max-width: 90px; }
.pop-layer-inner .detail-items .layer-model .image img { width: 100%; height: auto; }
.pop-layer-inner .detail-items .layer-model .info { flex: 1 1 auto; max-width: calc( 100% - 90px); align-self: center; padding-left: 25px; }
.pop-layer-inner .detail-items .layer-model .info > p { line-height: 21px; }
.pop-layer-inner .detail-items .layer-model .info > p > span + span { margin-left: 5px; }
.pop-layer-inner .dtable-form { border: 0; }
.pop-layer-inner .dtable-form > .dl { display: flex; border: 0; font-size: 15px; }
.pop-layer-inner .dtable-form > .dl > .dth { flex: 1 1 25%; max-width: 25%; padding: 5px 10px 5px 10px; align-self: center; }
.pop-layer-inner .dtable-form > .dl > .dtd { flex: 1 1 75%; max-width: 75%; padding: 5px 10px 5px 10px; }
.pop-layer-inner .dtable-form > .dl > .dtd .input_text { width: 100%; }
.pop-layer-inner .dtable-form > .dl > .dtd select { padding: .375rem 1.25rem .375rem 1rem; width: 100%; border: 1px solid #eee; color: #575757; }
.pop-layer-inner .dtable-form > .dl > .dtd textarea { width: 100%; min-height: 100px; }
.pop-layer-inner .detail-input { padding: 10px 25px 10px 25px; }
.pop-layer-inner .radio_wrap { display: flex; }
.pop-layer-inner .radio_wrap .radio_box { flex: 1 1 33.333333%; max-width: 33.333333%; }
.pop-layer-inner .radio_wrap .radio_box .radio_box:last-child { margin-right: 0; }
.pop-layer-inner .radio_wrap .radio_box input[type="radio"] { position: absolute; z-index: -1; opacity: 0; }
.pop-layer-inner .radio_wrap .radio_box label { position: relative; cursor: pointer; width: 100%; text-align: center; border: 2px solid #ddd; border-radius: 0; background-color: #fff; }
.pop-layer-inner .radio_wrap input[type="radio"]:checked~ label { background-color: #fff; border-color: var(--accent); color: var(--accent); }
.pop-layer-inner .detail-agree { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 12px 15px 19px 15px; }
.pop-layer-inner .detail-agree .agree-item { }
.pop-layer-inner .detail-agree .agree-item + .agree-item { margin-top: 12px; }
.pop-layer-inner .detail-agree .agree-item-detail { padding-left: 17px; }
.pop-layer-inner .detail-agree .agree-content { display: none; }
.pop-layer-inner .detail-agree .agree-content.open { display: block; }
.pop-layer-inner .detail-agree .agree-content > .agree-content-inner { margin: 15px 0; padding: 8px 8px 12px 15px; border: 1px solid #ddd; max-height: 120px; overflow-y: auto; font-size: 12px !important; }
.pop-layer-inner .detail-agree .agree-check { position: relative; font-size: 15px; }
.pop-layer-inner .detail-agree .agree-check > label > .agree_req { display: inline-block; margin-left: 3px; color: #dc3545; }
.pop-layer-inner .detail-agree .agree-check > .btn-agree-toggle { display: block; position: absolute; top: 0; right: 3px; padding: 2px; }
.pop-layer-inner .detail-agree .agree-check > .btn-agree-toggle > span { display: inline-block; width: 20px; height: 20px; overflow: hidden; background-image: url(/images/btn_toggle_down.png); }
.pop-layer-inner .detail-agree .agree-check > .btn-agree-toggle.up > span { transform: rotate(180deg); }
.pop-layer-inner .button_wrap { margin: 25px 0 100px 0; text-align: center; }
.pop-layer-inner .button_wrap .btn-submit { padding: 0; height: 48px; line-height: 48px; font-size: 16px; width: 50%; font-weight: 700; }
.pop-layer-inner .button_wrap .btn-submit:hover { }
.pop-layer-inner .button_wrap .btn-round { border-radius: 25px; }
@media (max-width: 768px) {
    .pop-layer-inner .detail-items { padding: 10px 15px; }
    .pop-layer-inner .dtable-form > .dl { flex-wrap: wrap; }
    .pop-layer-inner .dtable-form > .dl.dlf > .dth { flex: 1 1 100%; max-width: 100%; }
    .pop-layer-inner .dtable-form > .dl.dlf > .dtd { flex: 1 1 100%; max-width: 100%; }
    .pop-layer-inner .detail-input { padding: 10px 0 10px 0; }
    .pop-layer-inner .button_wrap .btn-submit { width: 90%; }
}

.modal-booking .pop-layer-inner { padding: 25px; }
.modal-booking .pop-layer-inner .pop-title { display: block; text-align: center; border-bottom: none; }
.modal-booking .pop-layer-inner .pop-title > span { display: inline-block; color: #000; font-size: 22px; }
.modal-booking .pop-layer-inner .pop-guide { margin: 0 0 20px 0; }
.modal-booking .pop-layer-inner .pop-guide > li { font-size: 13px; letter-spacing: -0.5px; text-align: center; font-weight: 400; }
.modal-booking .pop-layer-inner .pop-guide > li.time { color: #dc3545; }
.modal-booking .pop-layer-inner .pop-guide > li.time > span { display: inline-block; }
.modal-booking .pop-layer-inner .dtable-form { }
.modal-booking .pop-layer-inner .dtable-form > .dl { display: flex; border: 0; font-size: 15px; height: 40px; }
.modal-booking .pop-layer-inner .dtable-form > .dl + .dl { margin-top: 15px; }
.modal-booking .pop-layer-inner .dtable-form > .dl > .dth { flex: 1 1 100px; max-width: 100px; align-self: center; font-size: 14px; padding: 0; }
.modal-booking .pop-layer-inner .dtable-form > .dl > .dtd { flex: 1 1 auto; max-width: calc( 100% - 100px ); align-self: center; font-size: 14px; padding: 0; }
.modal-booking .pop-layer-inner .dtable-form > .dl > .dtd .input_text { width: 100%; height: 40px; border-radius: 6px; }
.modal-booking .pop-layer-inner .dtable-form > .dl > .dtd select { padding: 0 1.25rem 0 1rem; width: 100%; border: 1px solid var(--colorgray); color: #575757; height: 40px; border-radius: 6px;}
.modal-booking .pop-layer-inner .dtable-form > .dl > .dtd textarea { width: 100%; height: 40px; min-height: unset; }
.modal-booking .pop-layer-inner .radio_wrap { display: flex; }
.modal-booking .pop-layer-inner .radio_wrap .radio_box { flex: 1 1 33.333333%; max-width: 33.333333%; margin-right: 0; }
.modal-booking .pop-layer-inner .radio_wrap .radio_box + .radio_box { margin-left: 5px; }
.modal-booking .pop-layer-inner .radio_wrap .radio_box .radio_box:last-child { margin-right: 0; }
.modal-booking .pop-layer-inner .radio_wrap .radio_box input[type="radio"] { position: absolute; z-index: -1; opacity: 0; }
.modal-booking .pop-layer-inner .radio_wrap .radio_box label { position: relative; cursor: pointer; width: 100%; text-align: center; border: 1px solid var(--lightgray); border-radius: 6px; background-color: var(--lightgray); font-size: 13px; white-space: nowrap; height: 40px; line-height: 40px; padding: 0; }
.modal-booking .pop-layer-inner .radio_wrap input[type="radio"]:checked~ label { background-color: #fff; border-color: var(--accent); color: var(--accent); }
.modal-booking .pop-layer-inner .button_wrap .btn-submit { padding: 0; height: 52px; line-height: 52px; background-color: var(--accent); color: #fff; text-align: center; border-radius: 6px; letter-spacing: 0; }
.modal-booking .pop-layer-inner button.closex { position: absolute; top: 0; right: 0; width: 40px; height: 40px !important; padding: 0 !important; border-radius: 0; border: 0; background: transparent; outline: none; box-shadow: none; font-size: 0; text-indent: -999em; }
.modal-booking .pop-layer-inner button.closex:before,
.modal-booking .pop-layer-inner button.closex:after { content: ""; margin: auto; display: block; width: 50%; height: 1px; background: #000; }
.modal-booking .pop-layer-inner button.closex:before { transform: rotate(-45deg); }
.modal-booking .pop-layer-inner button.closex:after { transform: rotate(45deg); }

.myModal.view-content { }
.myModal.view-content .myModal-dialog { max-width: 760px; height: 100vh; border-radius: 0; }
.myModal.view-content .myModal-dialog .myModal-content { border: none; border-radius: 0; }
.myModal.view-content .myModal-dialog .myModal-content .myModal-header { background: var(--primary); border-radius: 0; padding: 0; }
.myModal.view-content .myModal-dialog .myModal-content .myModal-header .header-title { color: #fff; padding-left: 10px; letter-spacing: -1px; font-size: 1.25rem; }
.myModal.view-content .content-view-wrap { }
.myModal.view-content .content-view-wrap h2 { padding-bottom: 8px; border-bottom: 1px solid #ddd; margin-bottom: 12px; }
.myModal.view-content .content-view-wrap .content-view-head { display: flex; }
.myModal.view-content .content-view-wrap .content-view-head > div { margin-left: 12px; }
.myModal.view-content .content-view-wrap .content-view-head > div.score { margin-left: auto; align-self: center; }
.myModal.view-content .content-view-wrap .content-view-body { margin-top: 10px; border: 1px solid #ddd; padding: 25px; min-height: 460px; }
.myModal.view-content .content-view-wrap .content-view-body img { width: 100%; height: auto; }
@media(max-width: 768px) {
    .myModal.view-content .content-view-wrap h2 { font-size: 18px; }
    .myModal.view-content .content-view-wrap .content-view-head { padding-bottom: 8px; border-bottom: 1px solid #ddd; }
    .myModal.view-content .content-view-wrap .content-view-head > div { }
    .myModal.view-content .content-view-wrap .content-view-head > div.score { }
    .myModal.view-content .content-view-wrap .content-view-body { border: none; padding: 15px 0; }
    .myModal.view-content .content-view-wrap .content-view-body img { width: 100%; height: auto; }
}

.myModal.modalcomparison { }
.myModal.modalcomparison .myModal-dialog { max-width: 1280px; }
.myModal.modalcomparison .myModal-header { padding: .5rem 1rem; border-bottom: 0; background-color: var(--darknavy); }
.myModal.modalcomparison .myModal-header .header-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; }
.comparison-section { position: relative; width: 100%; padding: 25px 50px; }
.comparison-section > div { display: flex; }
.comparison-section > div > div { flex: 1 1 33.333333%; max-width: 33.333333%; padding: 0 20px; }
.comparison-section > div > div > .section-item { border: 1px solid var(--boxbrbase); padding: 25px; border-radius: 12px; }
.comparison-section .section-model-box .section-item .model-image { width: 100%; padding: 15px; }
.comparison-section .section-model-box .section-item .model-image img { width: 100%; height: auto; }
.comparison-section .section-model-box .section-item p { text-align: center; }
.comparison-section .section-model-box .section-item .price { margin: 12px 0 15px 0; }
.comparison-section .section-model-box .section-item .section-btn > a { font-size: 14px; border-radius: 6px; font-weight: 600; }
.comparison-section > h2 { display: flex; margin-top: 35px; margin-bottom: 25px; }
.comparison-section .section-box { position: relative; padding: 25px; background-color: var(--boxbgbase); border-radius: 12px; }
.comparison-section .section-box + .section-box { margin-top: 25px; }
.comparison-section .section-box > dl { display: flex;  line-height: 25px;}
.comparison-section .section-box > dl > dt { padding-left: 10px; }
.comparison-section .section-box > dl > dd { margin-left: auto; padding-right: 10px; }
.comparison-section .section-box > dl.hd { font-weight: 700; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--boxbrbase); line-height: 1.5; }
.comparison-section .section-box > dl.hd > dt { font-size: 18px; align-self: flex-end; padding-left: 0; }
.comparison-section .section-box > dl.hd > dd { font-size: 22px; padding-right: 0; }
@media(max-width: 992px) {
    .myModal.modalcomparison { }
    .myModal.modalcomparison .myModal-dialog { border-radius: 0; }
    .myModal.modalcomparison .myModal-header { padding: .5rem 1rem; border-bottom: 0; background-color: var(--darknavy); }
    .myModal.modalcomparison .myModal-header .header-title { font-size: 22px; color: #fff; }
    .myModal.modalcomparison .myModal-body { padding: 1rem 10px; }
    .comparison-section { position: relative; width: 100%; padding: 25px 0; }
    .comparison-section > div { display: flex; margin: 0 -5px; }
    .comparison-section > div > div { flex: 0 0 70%; max-width: 70%; padding: 0 5px; }
    .comparison-section > div > div > .section-item { padding: 15px 10px; }
    .comparison-section .section-model-box .section-item .model-image { width: 100%; padding: 15px; }
    .comparison-section .section-model-box .section-item .model-image img { width: 100%; height: auto; }
    .comparison-section .section-model-box .section-item p { text-align: center; }
    .comparison-section .section-model-box .section-item .price { margin: 12px 0 15px 0; }
    .comparison-section .section-model-box .section-item .section-btn > a { font-size: 12px; }
    .comparison-section > h2 { display: flex; margin-top: 35px; margin-bottom: 25px; }
    .comparison-section .section-box { position: relative; padding: 25px 8px; background-color: var(--boxbgbase); border-radius: 12px; }
    .comparison-section .section-box + .section-box { margin-top: 25px; }
    .comparison-section .section-box > dl { display: flex; line-height: 25px; font-size: 12px; }
    .comparison-section .section-box > dl > dt { padding-left: 5px; }
    .comparison-section .section-box > dl > dd { margin-left: auto; padding-right: 5px; }
    .comparison-section .section-box > dl.hd { font-weight: 700; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--boxbrbase); line-height: 1.5; }
    .comparison-section .section-box > dl.hd > dt { font-size: 12px; align-self: flex-end; padding-left: 0; }
    .comparison-section .section-box > dl.hd > dd { font-size: 15px; padding-right: 0; }
}

.myModal.modalgift { }
.myModal.modalgift .myModal-dialog { max-width: 760px; }
.myModal.modalgift .myModal-header { padding: .5rem 1rem; border-bottom: 0; background-color: var(--darknavy); }
.myModal.modalgift .myModal-header .header-title { color: #fff; }
.myModal.modalgift .gift-content { position: relative; width: 100%; }
.myModal.modalgift .gift-content img { width: 100%; height: auto; }

/* modal-card-list */
.myModal.layer-card-list { }
.myModal.layer-card-list .myModal-dialog { max-width: 960px; }
.myModal.layer-card-list .myModal-header { background-color: #fff; border-bottom: 1px solid #ddd; }
.myModal.layer-card-list .myModal-header .closex:before,
.myModal.layer-card-list .myModal-header .closex:after { background-color: #000; }
.myModal.layer-card-list .card-list-title { display: flex; }
.myModal.layer-card-list .card-list-title .title { display: inline-block; align-self: center; margin-left: 5px; font-size: 24px; }
.myModal.layer-card-list .myModal-body { padding: 0 1rem; }
.layer-card-list .myModal-body { padding: 0 1rem; overflow: auto; }
.modal-card-wrap { position: relative; padding: 25px; }
.modal-card-list { position: relative; }
.modal-card-list > ul { position: relative; }
.modal-card-list > ul > li { position: relative; padding: 0 4px; cursor: pointer; height: auto; }
.modal-card-list > ul > li .card-box { border: 1px solid #ddd; height: 100%; }
.modal-card-list > ul > li .card-top { }
.modal-card-list > ul > li .card-top .card-image { padding: 15px 10px 10px 10px; text-align: center; height: 180px; overflow: hidden; }
.modal-card-list > ul > li .card-top .card-image img { width: auto; height: auto; max-width: 100%; max-height: 100%; }
.modal-card-list > ul > li .card-top p { font-size: 15px; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 10px; }
.modal-card-list > ul > li .card-top p.tel { height: 25px; }
.modal-card-list > ul > li .card-body { font-size: 15px; letter-spacing: -1px; padding: 1rem .5rem; }
.modal-card-list > ul > li .card-body li.dot { margin-bottom: 10px; }
.modal-card-list > ul > li .card-body li.dot p.con { position: relative; padding-left: 8px; color: #333; font-size: 13px; white-space: nowrap; }
.modal-card-list > ul > li .card-body li.dot p.con:before { position: absolute; content: ''; width: 5px; height: 5px; background-color: #333; border-radius: 3px; left: 0; top: 7px; }
.modal-card-list > ul > li .card-body li.dot p.con > span { display: block; }
.modal-card-list > ul > li .card-body li.dot p.exp { font-size: 12px; }
.modal-card-list > ul > li .card-body li.dot > div { margin-top: 5px; text-align: right; }
.modal-card-list > ul > li .card-body li.dot > div button { align-self: center; background-color: #333; color: #fff; padding: 2px 12px; border-radius: 3px; text-align: center; font-size: 13px; }
.modal-card-list > ul > li .card-content { margin: 0 10px 10px 10px; height: 220px; padding: 15px; font-size: 12px; overflow: auto; background-color: #f1f1f1; }
ul.card-guide { margin-top: 10px; font-size: 14px; }
.modal-card-wrap .swiper-button-next { right: -10px; }
.modal-card-wrap .swiper-button-prev { left: -10px; }
.modal-card-wrap .swiper-pagination { display: none; }
@media(max-width: 992px) {
    .myModal.layer-card-list .myModal-body { padding: 0; }
    .layer-card-list .myModal-body { padding: 0; }
    .modal-card-wrap { padding: 0; padding-top: 50px; }
    .modal-card-wrap .swiper-button-next { top: 30px; right: 5px; width: 30px; height: 30px; background-color: #000; border-radius: 50%; }
    .modal-card-wrap .swiper-button-prev { top: 30px; left: 5px; width: 30px; height: 30px; background-color: #000; border-radius: 50%;  }
    .modal-card-wrap .swiper-button-prev:after { width: 30px; height: 30px; line-height: 30px; font-size: 20px; text-align: center; display: inline-block; color: #fff !important; padding-right: 2px; }
    .modal-card-wrap .swiper-button-next:after { width: 30px; height: 30px; line-height: 30px; font-size: 20px; text-align: center; display: inline-block; color: #fff !important; padding-left: 2px; }
    ul.card-guide { margin: 10px 0; font-size: 12px; padding: 0 10px; }
}

/* modal-dispublic-list */
.myModal.layer-dispublic-list { }
.myModal.layer-dispublic-list .myModal-dialog { max-width: 500px; height: 100vh; max-height: 100vh; justify-content: space-between; }
.myModal.layer-dispublic-list .myModal-content { border-radius: 0; border: 0; }
.myModal.layer-dispublic-list .myModal-header { background-color: #fff; border-bottom: 1px solid #ddd; }
.myModal.layer-dispublic-list .myModal-header .closex:before,
.myModal.layer-dispublic-list .myModal-header .closex:after { background-color: #000; }
.myModal.layer-dispublic-list .dispublic-list-title { display: flex; }
.myModal.layer-dispublic-list .dispublic-list-title .title { display: inline-block; align-self: center; margin-left: 5px; }
.myModal.layer-dispublic-list .myModal-body { padding: 0; }
.myModal.layer-dispublic-list .myModal-body { padding: 0; }
.myModal.layer-dispublic-list .myModal-footer { display: flex; background-color: #e7305b; justify-content: center; border-radius: 0; padding: .75rem; }
.myModal.layer-dispublic-list .myModal-footer a.closex { color: #fff; }
.myModal.layer-dispublic-list .myModal-footer button.closex { display: none; }
/* modal-union-list */
.myModal.layer-union-list { }
.myModal.layer-union-list .myModal-dialog { max-width: 500px; height: 100vh; max-height: 100vh; justify-content: space-between; }
.myModal.layer-union-list .myModal-content { border-radius: 0; border: 0; }
.myModal.layer-union-list .myModal-header { background-color: #fff; border-bottom: 1px solid #ddd; }
.myModal.layer-union-list .myModal-header .closex:before,
.myModal.layer-union-list .myModal-header .closex:after { background-color: #000; }
.myModal.layer-union-list .union-list-title { display: flex; }
.myModal.layer-union-list .union-list-title .title { display: inline-block; align-self: center; margin-left: 5px; }
.myModal.layer-union-list .myModal-body { padding: 0; }
.myModal.layer-union-list .myModal-footer { display: flex; background-color: #e7305b; justify-content: center; border-radius: 0; padding: .75rem; }
.myModal.layer-union-list .myModal-footer a.closex { color: #fff; }
.myModal.layer-union-list .myModal-footer button.closex { display: none; }
/* modal list */
.layer-list-title { display: flex; }
.layer-list-title .title { display: inline-block; align-self: center; margin-left: 5px; font-size: 24px; }
.layer-list-wrap { position: relative; padding: 0;}
.layer-list-wrap ul { }
.layer-list-wrap ul li { }
.layer-list-wrap ul > li { position: relative; display: flex; padding: 18px 5px 18px 15px; cursor: pointer; border-bottom: 1px solid #ddd; font-size: 16px; }
.layer-list-wrap ul > li:hover { background: #f8f8f8; }
.layer-list-wrap ul > li:last-child { border-bottom: 0; }
.listunion { }
.listunion .ctt { flex: 1 1 75%; max-width: 75%; padding-right: 15px; }
.listunion .ctt b { display: block; font-size: 18px; }
.listunion .ctt span { display: block; font-size: 13px; }
.listunion .ctp { flex: 0 0 auto; align-self: center; line-height: 1; }
.listunion .ctp small { display: block; }
.listunion .ctp b { font-size: 16px; }
.listunion .ctp span { font-size: 13px; }
@media (max-width: 992px) {
    .myModal .myModal-dialog { padding: 0; }
    .myModal .myModal-dialog .myModal-content { border-radius: 0; }
    .swiper-button-next, .swiper-button-prev { }
    .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: -10px; }
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: -10px; }
    .layer-list-wrap ul > li { font-size: 13px; }
}

/* modal image */
.layer-model-image .myModal-dialog { max-width: 1200px; }
.layer-model-image .myModal-header { display: none; }
.layer-model-image .myModal-body { overflow-y: hidden; }
#image-slide { width: 100%; }
#image-slide li { text-align: center; }
.layer-model-image .swiper-pagination { display: none; }
.layer-model-image .swiper-button-prev, 
.layer-model-image .swiper-button-next { display:block; width: 28px; height: 52px; top: calc( 50% - 40px ); margin: 0; border-radius: 20px; background-color: transparent; background-size: 15px; border: 0; outline: 0; box-shadow: none; opacity: .75; transition: all 0.15s ease-in-out; z-index: 10; }
.layer-model-image .swiper-button-prev, 
.layer-model-image .swiper-button-next { background: url('<?php echo WZ_URL;?>/img/swiper_arr.png') no-repeat 50% 50%/auto 100%; }
.layer-model-image .swiper-button-prev:after,
.layer-model-image .swiper-button-next:after { content: ''; }
.layer-model-image .swiper-button-prev { left: 40px; }
.layer-model-image .swiper-button-next { right: 40px; }
.layer-model-image .swiper-button-prev { transform: scaleX(-1); }
.layer-model-image .swiper-button-prev:hover, 
.layer-model-image .swiper-button-next:hover { opacity: 1; width: 60px; background-color: transparent; }
.layer-model-image .swiper-button-prev:hover { left: 20px; }
.layer-model-image .swiper-button-next:hover { right: 20px; }
.layer-model-image .swiper-button-prev:focus, 
.layer-model-image .swiper-button-next:focus { outline: 0; box-shadow: none; }
@media (max-width: 992px) {
    .layer-model-image .myModal-dialog { height: 100vh; }
    .layer-model-image .myModal-content { height: 100vh; justify-content: center; }
    .layer-model-image .myModal-header { display: flex; background-color: transparent; }
    .myModal.layer-model-image .myModal-header .closex:before,
    .myModal.layer-model-image .myModal-header .closex:after { background-color: #000; }
    .layer-model-image .myModal-body { }
    #image-slide li img { width: 100%; height: auto; }
    .layer-model-image .swiper-button-prev, 
    .layer-model-image .swiper-button-next { display: none; }
}

.myModal.modal-clause {

}

.myModal.modal-clause .myModal-dialog {
    max-width: 560px;
    justify-content: center;
    align-items: center;
    height: 100%;
    flex: 1 1 auto;
}

.myModal.modal-clause .myModal-dialog .myModal-header {
    padding: .5rem;
    background-color: #111827;
    color: #fff;
    font-size: 24px;
}

.myModal.modal-clause .myModal-dialog .myModal-body {
    max-height: 560px;
}