﻿@charset "utf-8";

/* 팩스 보내기
------------------------------ */
/* 전송문서 입력 */
.title-wrap + .inp-text {margin-top:.6rem;}
.title-wrap + .form-wrap {margin-top:4.2rem;}

/* [modal] 내문서함(팩스) */
.my-document .file-info {padding: 2.5rem 0 2.5rem 1rem; text-align: left;}
.my-document .file-info .radio-wrap {height: auto;}
.my-document .file-info .radio-wrap label {align-items: center;}
.my-document .file-info .radio-wrap label::after {top:50%; transform: translateY(-50%);}
.my-document .file-info .radio-wrap .name {overflow: hidden; line-height: 2.8rem; word-break: break-all;}

/* [modal] 주소록 */
.tab-address .search-wrap {top: 8.1rem;}
.tab-address .search-wrap .underline {padding-left:1rem;}
.tab-address .search-wrap .inp-select.underline {background-position:calc(100% - .5rem) center;}
.tab-address .top-util {margin-top: 0;}
.search-wrap.type-individual {flex-direction:column; padding:4rem var(--layout-padding) 1rem; border:none; box-shadow:none;}
.search-wrap.type-individual::after {display:none;}
.search-wrap.type-individual + .section {padding-top:1.5rem;}
.search-wrap .search-inner {width: 100%; padding:2rem 1.5rem; border-radius:1rem; background-color: #efeff1;}
.search-wrap .txt-result {display:none;}
/* 주소록 탭에서 검색 버튼 눌렀을 때 */
.addr-search-result .inp-select {display:none;} 
.addr-search-result .txt-result {display:block; height:7rem; padding:0 2.5rem; line-height:7rem; border:1px solid var(--gray200); border-radius:1.4rem; background-color:var(--white);}

/* [modal] 자주 보내는 번호 */
#frequentlyNumber .modal-foot::before {height: 5rem;}

/* 문자 보내기
------------------------------ */
.sms-type {font-weight:700; text-transform:uppercase;}
.sms-date {color:var(--gray800);}
.sms-byte {display:inline-block; margin-left:1rem; color:var(--gray800);}
.sms-byte em {color:var(--error);}
.sms-context {min-height:18rem; height:auto; width:calc(100% + 2.5rem); margin-right:-2.5rem; padding-right:2.5rem;}
.sms-context:focus {outline:none;}
.sms-act .btn-preview {transition:background .3s ease-in, border .3s .2s ease-in;}
.photo-detail-dimm {position:fixed; left:0; top:0; z-index:100; width:100%; height:var(--full-height); display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex !important; align-items:center; justify-content:center; background-color:rgba(0,0,0, 0);}
.photo-detail-dimm.ready,
.photo-detail-dimm.show {background-color: rgba(0,0,0, .5);}
.photo-detail-dimm {animation:fadeOut .3s ease-in 1 forwards;}
.photo-detail-dimm.show {animation:fadeIn .3s ease-in 1 forwards;}
.photo-detail-dimm > img {max-width:100%; max-height:100%; width:100%; object-fit:contain;}
.photo-edit-wrap {overflow:hidden; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:center; flex-direction:column; width:100%; height:var(--full-height); padding:1rem 0;}
.photo-edit-wrap .photo-img {padding:2.5rem 0 3rem; max-height:calc(var(--full-height) - 4.5rem - 5.5rem); display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content: center; align-items: center; overflow: hidden;}
.photo-edit-wrap .photo-img img {max-width:100%; max-height:100%; width:100%; object-fit:contain;}
.photo-edit-wrap .photo-action {width:100%; padding:0 2.5rem; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; gap:1rem;}
.photo-edit-wrap .photo-action button {width:100%;}
.photo-edit {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; background-color:var(--white); border-radius:1rem;}
.photo-edit button {display:block; width:7.9rem; height:5.9rem; background-repeat:no-repeat; background-position:center center; background-size:contain;}
.photo-edit button + button {border-left:1px solid #4c4c4c;}
.photo-edit .btn-rotate-left {background-image: url('../img/icon/ico_rotate_left.png');}
.photo-edit .btn-rotate-right {background-image: url('../img/icon/ico_rotate_right.png');}
.photo-edit .btn-rotate-horizon {background-image: url('../img/icon/ico_rotate_horizon.png');}
.photo-edit .btn-rotate-vertical {background-image: url('../img/icon/ico_rotate_vertical.png');}

/* [modal] 특수문자 */
.char-list li {display:inline;}
.char-list button {display:inline-block; width:3rem; height:3rem;}
.char-list.type-face button {width:7rem; height:3.5rem;}

/* [modal] 내문서함(문자) */
.keyboard-on body {position:fixed;} /* 모바일 키보드 스크롤 밀림 방지 */
.tab-sms-doc .search-wrap {top:8rem;}
.sms-list {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-wrap:wrap; padding-bottom:2rem;}
.sms-list-item {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction:column; width:49%; margin-top:1.5rem; border:1px solid var(--gray200); border-radius:var(--radius);}
.sms-list-item:nth-child(1),
.sms-list-item:nth-child(2) {margin-top:0;}
.sms-list-item:nth-child(2n) {margin-left:.8rem;}
.sms-list-item .head {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; height:5.5rem; padding:0 1.5rem;}
.sms-list-item .head .radio-wrap {width:100%;}
.sms-list-item .head label {width:100%;}
.sms-list-item .body {/* flex:1; */ overflow-y:auto; height:40rem; padding:1.5rem; border-top:1px solid var(--gray200); border-bottom:1px solid var(--gray200);}
.sms-list-item .body .inp-textarea {overflow:hidden; height:100%; color:var(--gray800); resize:none;}
.sms-list-item .body .inp-textarea:focus {outline:none;}
.sms-list-item .body .sms-message {white-space:pre-wrap; word-break:break-all;}
.sms-list-item .foot {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; width:100%; height:5rem; padding:0 1.5rem; border-bottom-left-radius:var(--radius); border-bottom-right-radius:var(--radius); background-color:#efeff1;}
.sms-list-item .foot .sms-summary {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:space-between; width:100%;}
.sms-list-item .swiper-mms {margin:-1.5rem -1.5rem 1rem;}

.swiper-mms {margin:0; background-color:#efeff1; z-index:inherit;}
.swiper-mms .swiper-slide {padding:1.2rem 0; text-align: center;}
.swiper-mms .swiper-slide img {display:inline-block; height:23.6rem;}
.swiper-mms .swiper-button-prev,
.swiper-mms .swiper-button-next {z-index:1; width:6rem; height:6rem; background:url('../img/common/btn_swiper_controls.png') no-repeat left top; background-size:12rem auto;}
.swiper-mms .swiper-button-prev {left:0;}
.swiper-mms .swiper-button-next {right:0; background-position:right 0;}

/* [modal] 문자 미리보기 */
.section-sms-preview {overflow-y:auto; width:40rem; max-height:100%; margin:3.5rem auto !important; padding:2.5rem 3.8rem !important; background-color:var(--white); border-radius:var(--radius);}
.section-sms-preview .preview-message {word-break:break-all;}
.section-sms-preview .preview-message pre {white-space:pre-line;}
.section-sms-preview .preview-photos {margin-bottom:1.8rem; text-align:center;}

/* 광고용툴팁 */
.ad-exam > li+li {margin-top:3.5rem}
.exam-box {margin-top:1rem;padding:3.2rem;background-color:#ebebeb;text-align:center;}

/* 전송결과
------------------------------ */
/* 팩스/문자 전송결과 공통 */
.clusterize-scroll.page-result-fax {
    max-height: calc(var(--full-height) - var(--header-height) - var(--footer-height) - 4.4rem);
    padding:0 var(--layout-padding) 2rem;
    margin: 0 var(--layout-padding-negative) -2rem;
}
.clusterize-scroll.page-result-fax .stickyArea {padding-top:1rem;}
.clusterize-scroll.page-result-fax .table-controls.type-bg {margin-top:0;}
/* 문자 전송결과 */
.table-result-view {table-layout:auto;}
.table-result-view .clusterize-no-data {border-top:none !important;}
.table-result-view td.name,
.table-result-view td.phone {padding-left:0; padding-right:0;}
.table-result-view td.name .nowrap {text-align:center;}
.table-result-view td.name .ellips:last-child {width:90%;}
.table-result-view td.name .bracket .ellips {overflow:hidden; width:auto; padding:0px 3px;}
.table-result-view td .break-all {word-break:break-all;}
.result-item + .result-item {margin-top:1rem;}
.result-list .result-info .n3,
.result-list .result-info .n4 {float:left; width:50%;}
.result-list .result-info .item:first-child {padding-top:0;}
.result-list .result-info .item {padding:.2rem 0;}
.result-list .result-info .item-summary {clear:both;}
.result-list .result-info .item-summary ul {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center;}
.result-list .result-info .item-summary li {position:relative; white-space: nowrap;}
.result-list .result-info .item-summary li + li::before {content:''; display: inline-block; vertical-align: middle; width:1px; height:1.8rem; margin:0 .3rem 0 .7rem; background-color: var(--gray900);}
.result-list .result-info .item-summary .subject {font-weight:700;}
.result-list .btn-modify-reserv {min-width:9rem; height:3rem; line-height:3rem; border-radius:3rem; color:var(--error); border-color:var(--error); font-weight:500;}



/* 수신함
------------------------------ */
/* 팩스수신함 */
.clusterize-scroll.page-receive-fax {
    max-height: calc(var(--full-height) - var(--header-height) - var(--footer-height) - 4.4rem);
    padding:0 var(--layout-padding) 2rem;
    margin: 0 var(--layout-padding-negative) -2rem;
}
.search-wrap.type-inbox {flex-direction:column;}
.search-wrap.type-inbox .inp-select {width:24rem;}
.search-wrap.type-inbox .search-act {right:1rem;}
.search-wrap.type-inbox .search-act .btn-basic + .btn-basic {margin-left:1rem;}
.result-item.inbox .ico-mail-open,
.result-item.inbox .ico-mail-notopen {position: absolute; top:1rem; right:2.5rem;}
.result-item.inbox .result-info .ellips {display:inline-block; width:70%;}
.result-item.inbox .result-info .n3 {width:100%;}
.result-item.inbox .result-info .n3 .bracket {display:inline-block; width:50%;}

/* 신청 - 잔액부족 */
.payment-method {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; margin-right:-2.5rem;}
.payment-method .radio-wrap {margin-left:2rem; font-weight:700;}
.payment-method .radio-wrap label {color:var(--gray900);}

/* 변경 */
.fax-prod-info:first-child {margin:-1rem 0 4rem;}
.fax-prod-info ul {width:100%;}
.fax-prod-info li {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:space-between;}
.fax-prod-info .tit {font-weight:700;}
.fax-prod-form.modify .form-item:first-child .form-body {padding-top:3.5rem;}
.fax-prod-form.modify .form-item + .form-item {margin-top:3.5rem;}


/* 주소록
------------------------------ */
.search-addr {position:relative; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; flex-direction:column; margin:0 var(--layout-padding-negative); background:var(--white);}
.search-addr.is-sticky {position:sticky; top:calc(var(--header-height) + var(--tab-height)); z-index:1;}
.search-addr .search-core {position:relative; width:100%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; padding: 4rem var(--layout-padding);  border-bottom: 6px solid var(--gray100);}
.search-addr .search-core::after {content:''; display:block; z-index:1; position:absolute; bottom:0; left:0; right:0; border-bottom: 1px solid var(--gray400);}
.search-addr .search-core .inp-select {width:24rem; margin-right: 1.5rem;}
.search-addr .search-core .underline {border-radius:0 !important; border: none; border-bottom: 1px solid var(--gray200);}
.search-addr .search-core .inp-text {padding-right:10rem;}
.search-addr .search-core .search-act {position: absolute; right:3.5rem;}
.search-addr .search-core .search-act .btn-basic + .btn-basic {margin-left:1rem;}
.search-addr .search-downer {width:100%; margin:2.6rem 0 1rem; padding: 0 var(--layout-padding);}
.search-addr .search-downer .search-inner {width: 100%; padding:2rem 1.5rem; border-radius:1rem; background-color: #efeff1;}
tr.addr-group td {background-color:#f3f7f2;}
tr.addr-group .addr-group-name {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:center; padding:0 2.5rem; white-space:nowrap;}
tr.addr-group .addr-group-name .ellips {width:auto; max-width:auto; margin-left:.3rem;}
@media (orientation: landscape) {
    .is-mobile .search-addr.is-sticky {position:static; top:auto; z-index:1;}
}

/* [modal] 개별번호 번호 추가 */
.addr-add-number {flex-wrap:wrap; justify-content:space-around;}
.addr-add-number .inp-text {flex-basis:calc(50% - .6rem); margin: .3rem 0;}
.addr-add-number .btn-basic {flex-basis:100%; margin-top:1.2rem;}

/* [tab] 주소록목록 */
.clusterize-scroll.scroll-phoneBook {min-height:15rem; max-height:calc(var(--full-height) - 54rem) !important;}

/* [tab] 개별번호 */
.clusterize-scroll.scroll-phoneBookDetail {
    max-height: calc(var(--full-height) - var(--header-height) - var(--footer-height) - 13.4rem);
    padding:0 var(--layout-padding);
    margin: 0 var(--layout-padding-negative);
}
.clusterize-scroll.scroll-phoneBookDetail .stickyArea {padding:1rem 0;}
.clusterize-scroll.scroll-phoneBookDetail .stickyArea .table-controls{margin:0;}

/* 충전하기
------------------------------ */
.item-charge-amount .inp-selection-wrap {width:auto; margin:-.5rem -.4rem; flex-flow:row wrap;}
.item-charge-amount .inp-selection-item {flex-basis:24%; padding:.5rem .4rem; margin-left:0 !important;}
.article-preview-charge {margin-top:5rem;}
.preview-charges-list {padding:2.5rem; border-radius:var(--radius); border: 1px solid var(--gray200); background:#efeff1;}
.preview-charges-list ul {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:space-between;}
.preview-charges-item {flex-basis:20%;}
.preview-charges-item .subject {font-size:2.2rem;}
.preview-charges-item .desc {display: block;}
.preview-charges-item .desc .num {font-size:2.8rem; font-weight:700;}
.preview-charges-item .desc .unit {font-size:2.2rem;}
.section-charge-paymethod .list-wrap .list-wrap {margin-top:2.5rem;}
/* 요금안내 레이어 */
.fee-summary {margin:2.5rem 0 3rem;}
.table-fee-summary {overflow:hidden; border-collapse:collapse; border-style:hidden; box-shadow:0 0 0 1px var(--gray200); border-radius:1.5rem;}
.table-fee-summary thead th {height:7rem; background:#efeff1;}
.table-fee-summary th,
.table-fee-summary td {border:1px solid var(--gray200); text-align:center; font-size:2rem;}
.table-fee-summary td {height:8rem; color:var(--gray900);}
.table-fee-summary td .num {font-size:3.3rem; font-weight:700;}
.table-fee-info {border-top-width:1px;}
.table-fee-info thead th {border-bottom:1px solid var(--gray800);background-color:#f3f7f2;}
.table-fee-info .divider td {border-bottom-color:var(--gray800)}

/* 결제중 */
.charge-progress {margin-top:13rem;}

/* 결제완료 */
.payment-info:first-child {margin:-1rem 0 4rem;}
.payment-info ul {width:100%;}
.payment-info li {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:space-between;}
.payment-info .tit {font-weight:700;}


/* 입출금내역
------------------------------ */
.search-wrap.type-details {flex-direction:column; padding-top:2rem;}
.search-wrap.type-details .search-act {position:static; margin-left:1rem;}
.table-basic .txt-value {display:block; text-align:right;}
.total-money {margin:1rem 2.5rem;}
.total-money li {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex;}
.total-money li + li {margin-top:1rem;}
.total-money li .tit {flex:1; font-weight:700; text-align: left;}
.total-money li .value {text-align: right;}
.total-money li .value .num {color:var(--error);}
.table-basic .txt-value .num.up {color:var(--primary);}
.table-basic .txt-value .num.down {color:var(--error);}
.clusterize-scroll.page-billing {
    max-height: calc(var(--full-height) - var(--header-height) - var(--footer-height) - 17rem);
}
.clusterize-scroll.page-billing .section {padding-left:1px;padding-right:1px;}

/* 후결제 */
.fee-list-wrap {padding:1.5rem 3rem; border:1px solid var(--gray200); border-radius:2rem;}
.fee-list .fee-item {padding:1.5rem 0;}
.fee-list .fee-item + .fee-item {border-top:1px solid var(--gray200);}
.fee-module {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:space-between; padding:.2rem 0;}
.fee-module .unit {display:inline-block; margin-left:.2rem;}
.charge-search .form-item {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center;}
.charge-search .form-item > *:not(:first-child) {margin-left:.5rem;}
.charge-search .form-item .inp-select {background-position: calc(100% - 1.5rem) center}
.charge-search .form-item + .form-item {margin-top:.8rem;}
.charge-history {margin-top:4rem;}
.charge-history-module + .charge-history-module {margin-top:1rem;}
.charge-history-module {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; padding:1.5rem 2.5rem; border:1px solid var(--gray200); border-radius:2rem;}
.charge-history-module .core {width:14rem; text-align:center;}
.charge-history-module .billing-month {font-weight:700;}
.charge-history-module .btn-payment {display:inline-block; margin-top:.3rem; width:10.7rem; height:4rem; border-radius:4rem; line-height:4rem; font-size:1.8rem; color:var(--error); font-weight:700; border:1px solid var(--error);}
.charge-history-module .btn-payment.incomplete {color:var(--white); border-color:#bdbdbd; background-color:#bdbdbd;}
.charge-history-module .btn-payment.complete {color:#a8a8a8; border-color:#a8a8a8; background-color:var(--white);}
.charge-history-module .btn-payment[disabled] {opacity:1 !important;}
.charge-history-module .detail {flex:1; margin-left:5rem;}
.charge-history-module .detail-fee > li {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:space-between;}
.charge-history-module .detail-fee > li .unit {display:inline-block; margin-left:.2rem;}


/* 내문서함
------------------------------ */
.sms-list.type-mydoc {}

/* 회원가입
------------------------------ */
.join-message {margin:3.5rem 0 7rem;}
.join-message .hello {font-size:4.3rem; line-height:5rem; font-weight:700;}
.join-message .txt-basic {margin-top:2.5rem;}

/* step */
.step-wrap {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; margin:1rem var(--layout-padding-negative); padding:2rem var(--layout-padding); background-color:#ebebec;}
.step-wrap .tit {flex:1; font-size:2.6rem;}
.step-wrap .step-list {text-align:right;}
.step-wrap .step-item {position:relative; display:inline-block; margin-left:.3rem;}
.step-wrap .step-item .num {display:inline-block; width:3.3rem; height:3.3rem; line-height:3.3rem; text-align:center; border-radius:50%; background-color:var(--white); color:#b9b9b9;} 
.step-wrap .step-item.current .num {background-color:var(--primary); color:var(--white);}

/* 약관동의 */
.check-all-wrap {margin:3.5rem var(--layout-padding-negative) 2.5rem; padding:2rem var(--layout-padding); border-top:1px solid var(--gray200); border-bottom:1px solid var(--gray200); background-color:#ebebec;}
.check-all-wrap label {color:var(--gray900); font-size:2.3rem;}
.join-terms-item + .join-terms-item {margin-top:3.5rem;}
.join-terms-item .terms-head {margin-bottom:1rem;}
.join-terms-item .terms-box {height:18rem; margin:0;}
.join-terms-item .terms-head label {color:var(--gray900); font-size:2.3rem;}

/* 정보입력 */
.form-wrap.type-join {margin-bottom:9.5rem;}
.form-wrap.type-join .field-wrap {border-bottom:1px solid var(--gray200);}
.form-wrap.type-join .inp-text {border:none; border-radius:0;}
.form-wrap.type-join .btn-basic.round {flex-shrink:0; padding-left:2rem; padding-right:2rem;}
.txt-extrainfo {margin-top:2rem; color:var(--gray800);}
.ad-agree-wrap {margin-top:5rem;}
.ad-agree-item {padding:0 0 3.5rem;}
.ad-agree-item ul {margin-top:2rem;}
.ad-agree-item li label {font-size:1.8rem;}
.ad-agree-item li + li {margin-top:1rem;}
.ad-agree-item + .ad-agree-item {padding-top:3.5rem; border-top:1px solid var(--gray200);}

.ico-required {position:absolute; left:0;}
.ico-required::before {content:'*'; font-size:2.6rem; font-weight:700; color:var(--error);}
.purpos-terms {margin-top:3.5rem;}

/* [modal] ars 인증 */
.cert-num-form .btn-basic.round {min-width:10.2rem;}

/* [modal] 사업자 등록번호 확인 */
.join-business-already {margin:1.5rem 0 5rem; font-size:2.5rem; font-weight:700; text-align: center;}

/* 이미 등록된 회원일 경우 */
.join-already-message {margin:5rem 0 7.5rem; padding-bottom:7.5rem; border-bottom:1px solid #e5e5e6; text-align:center;}
.join-already-message .strong {margin-bottom:2.5rem; font-size:2.8rem;}
.join-already-message .strong::before {content:''; display:block; width:20rem; height:20rem; margin:0 auto 2rem; background-image: url('../img/icon/ico_message_join_already.png'); background-repeat: no-repeat; background-position: center center; background-size: contain}
.join-already-message .txt-basic {font-size:2.3rem;}

/* 휴면상태 회원일 경우 */
.join-dormancy-message {margin:5rem 0 7.5rem; padding-bottom:7.5rem; border-bottom:1px solid #e5e5e6; text-align:center;}
.join-dormancy-message .strong {margin-bottom:2.5rem; font-size:2.8rem;}
.join-dormancy-message .strong::before {content:''; display:block; width:20rem; height:20rem; margin:0 auto 2rem; background-image: url('../img/icon/ico_message_join_dormancy.png'); background-repeat: no-repeat; background-position: center center; background-size: contain}
.join-dormancy-message .txt-basic {font-size:2.3rem;}

/* 가입완료 */
.join-complete-message {margin:8rem 0 0; text-align:center;}
.join-complete-message .bye {font-size:3.5rem;}
.join-complete-message .bye::before {content:''; display:block; width:20rem; height:20rem; margin:0 auto 2rem; background-image: url('../img/icon/ico_message_join_complete.png'); background-repeat: no-repeat; background-position: center center; background-size: contain}
.join-complete-message .txt-basic {margin-top:2.5rem; font-size:2.5rem; line-height:3.5rem;}


/* 마이페이지
------------------------------ */
.form-view {margin:2rem 0;}
.form-view .form-item-group + .form-item-group {margin-top:2rem;}
.form-view .form-item {flex:1; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:flex-start;}
.form-view .form-head {position:relative; padding-left:1.5rem; width:16.5rem; padding-top:.4rem;}
.form-view .form-head .form-label {font-size: 2.2rem;font-weight: 700; color: var(--gray900);}
.form-view .form-body {flex:1; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; margin:0; padding:0;}
.form-view .form-item + .form-item {margin-top:1.5rem;}
.form-view .field-wrap {flex:1; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction: column;}
.form-view .field-item {position:relative; width: 100%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:flex-start;}
.form-view .txt-value {width:100%; padding:.8rem 0;}

/* 내 정보관리 비번입력 */
.myinfo-message {margin:2.5rem 0 4.5rem; font-size:2.3rem;}

/* [modal] 주소 변경 */
.field-addr {width:100%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction:column; gap:.5rem;}
.field-addr .field-post {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; gap:.7rem;}

/* [modal] 이메일 변경 */
.field-email {width:100%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction:column; gap:.5rem;}
.field-email .field-aa {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; gap:.7rem;}
.field-email .inp-select {width:21rem; flex-shrink:0;}

/* 내 정보관리 탈퇴신청 */
.withdraw-info li + li {margin-top:3rem;}

/* 발송 차단 번호 */
.block-item + .block-item {margin-top:1rem;}
.block-list .result-info .item {float:left; width:50%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items: center;}
.block-list .result-info .item.n5 {float:none; width:100%;}



/* 고객센터
------------------------------ */
/* 1:1 상담하기 */
.inquiry-write .inp-file {padding-right:16rem;}
.form-body.reply-noti .check-wrap {white-space:nowrap; margin-right:3rem;}

/* 1:1 답변보기 */
.inquiry-view table {border-top:3px solid var(--gray900); border-bottom: 1px solid var(--gray200);}
.inquiry-view table tbody tr:first-child th,
.inquiry-view table tbody tr:first-child td {padding-top:3rem;}
.inquiry-view table tbody tr:last-child th,
.inquiry-view table tbody tr:last-child td {padding-bottom:3rem;}
.inquiry-view table th,
.inquiry-view table td {padding:.5rem 0;}
.inquiry-view table th {text-align:left; font-weight:700; vertical-align: top;}
.inquiry-view.type-answer .title-h3 {color:var(--primary);}
.inquiry-view.type-answer table {border-top-color:var(--primary);}
.inquiry-view.type-answer .attach th,
.inquiry-view.type-answer .attach td {padding-bottom:3rem;}
.inquiry-view.type-answer .attach + .answer th,
.inquiry-view.type-answer .attach + .answer td {padding-top:3rem; border-top:1px solid var(--gray200);}

/* 공지사항 */
.notice-list {margin:0 var(--layout-padding-negative);}
.notice-item {border-bottom:1px solid var(--gray200);}
.notice-item.new .subject {color:var(--error);}
.notice-item.active .notice-head {border-bottom:6px solid var(--gray100); }
.notice-item.active .notice-head::after {content:''; display:block; z-index:1; position:absolute; bottom:0; left:0; right:0; border-bottom: 1px solid var(--gray400);}
.notice-item.active .notice-head .subject {font-weight:700; color:var(--gray900);}
.notice-item.active .btn-notice-head::after {transform:rotate(180deg);}
.notice-head {position:relative; padding:2rem var(--layout-padding);}
.notice-head .subject {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items: center; font-size:2.3rem; color:var(--error);}
.notice-head .subject .ico-new {margin-left:.5rem;}
.notice-head .date {display:block; margin-top:.5rem; color:#888;}
.notice-head .btn-notice-head {position:absolute; left:0; top:0; display:block; width:100%; height:100%;}
.notice-head .btn-notice-head::after {content:''; position: absolute; right:2rem; top:50%; margin-top:-1.5rem; display:block; width:3rem; height:3rem; background:url('../img/icon/ico_notice_arr.png') no-repeat center center; background-size:contain; transition:transform .3s;}
.notice-body {overflow:hidden; padding:0 var(--layout-padding); max-height:0; transition:max-height 0.3s ease;}
.notice-body-inner {padding:4rem 0;}
.clusterize-scroll.page-notice {
    max-height: calc(var(--full-height) - var(--header-height) - var(--footer-height) + 3rem);
    padding:0 var(--layout-padding);
    margin: 0 var(--layout-padding-negative);
}


/* 모아샷 소개
------------------------------ */
/* 모아샷 서비스 */
.section-intro {margin:0 var(--layout-padding-negative); background:url('../img/intro/bg_intro_1.png') repeat-x center top; background-size:59rem auto;}
.section-intro .visual {position:relative; margin:0 0 3rem; padding:7rem 0 0;}
.section-intro .visual .cont {max-width:60rem; margin:0 auto; padding: 0 4.5rem;}
.section-intro .visual .txt {width:24.4rem;}
.section-intro .visual .img {position: absolute; right:0; top:3rem; width:32rem; height:43rem; background:url('../img/intro/img_intro_1.png') no-repeat left top; background-size:contain;}
.section-intro .detail {position:relative; width:100%; max-width:60rem; margin:0 auto; background-repeat: no-repeat; background-position:center 0; background-size:54rem auto;}
.section-intro .detail li {position:relative; padding-left:2rem; font-size:2rem; letter-spacing:-.2px;}
.section-intro .detail li::before {content:''; position:absolute; left:0; top:1.1rem; display:block; width:.9rem; height:.9rem; background-color:var(--primary); border-radius:50%;}
.section-intro .detail li + li {margin-top:.5rem;}
.section-intro .detail.n1 {padding:24rem 5rem 7rem; background-image:url('../img/intro/bg_detail_1.png');}
.section-intro .detail.n2 {padding:30rem 5rem 7rem; background-image:url('../img/intro/bg_detail_2.png');}
.section-intro .detail.n3 {padding:30rem 5rem 7rem; background-image:url('../img/intro/bg_detail_3.png'); margin-bottom: 7rem;}
.section-intro .detail.n3::after {content:''; z-index:1; position:absolute; left:0; bottom:0; display: block; width:100%; height:2rem; background:url('../img/intro/bg_detail_3.png') no-repeat center bottom; background-size:54rem auto;}

/* 모아샷 강점 */
.section-merit {margin:0 var(--layout-padding-negative);}
.section-merit .visual {position:relative; margin:0 0 3rem; padding:9rem 0 0;}
.section-merit .visual::after {content:''; position: absolute; left: 0; top: 0; display: block; width: 100%; height:81rem; background-color:#ebebeb;}
.section-merit .visual .cont {position:relative; z-index:1; max-width:60rem; margin:0 auto; padding:0 2.5rem;}
.section-merit .visual .txt {position:relative; width:42.8rem; margin:0 auto;}
.section-merit .visual .txt::before,
.section-merit .visual .txt::after {content:''; position:absolute; display:block; background-repeat:no-repeat; background-position:left top; background-size:contain;}
.section-merit .visual .txt::before {left:-4rem; top:-6rem; width:14.5rem; height:11rem; background-image:url('../img/intro/bg_merit_1.png');}
.section-merit .visual .txt::after  {right:-6rem; bottom:-12rem; width:14.7rem; height:11rem; background-image:url('../img/intro/bg_merit_2.png');}
.section-merit .visual .desc {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:center; margin:6rem 0 8rem;}
.section-merit .visual .desc .item {display:block; width:19rem;}
.section-merit .visual .desc .item.n2 {position:relative; z-index:1; margin:0 -2rem;}
.section-merit .detail {position:relative; z-index:1; max-width:60rem; margin:0 auto; padding:0 2.5rem;}
.section-merit .detail ul {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-wrap:wrap; gap:2.1rem;}
.section-merit .detail li {width:25.9rem;}
.section-merit .security {position:relative; z-index:1; max-width:60rem; margin:0 auto; padding:9rem 2.5rem 5rem;}
.section-merit .security .txt {text-align:center;}
.section-merit .security ul {margin-top:5rem;}
.section-merit .security li + li {margin-top:1.5rem;}

/* 로그인
------------------------------ */
/* 로그인 레이어 */
.login-open {overflow:hidden;}
.layout-login {position: fixed; top:0; right:-100%; z-index:100; overflow-y:auto; width:100%; height: 100%; background-color:var(--white); transition:right .3s ease-in;}
.layout-login.open {right:0;}
/* 로그인 페이지 */
.section-login {margin-top: 7rem;}
.section-login .txt-hello {font-size:4.2rem; line-height: 5.5rem; font-weight: 600;}
.section-login .txt-hello .img-moashot {display: inline-block; width: 24.5rem; margin-right: .5rem; margin-top: -.5rem; vertical-align:middle;}
.login-form {margin-top: 5.5rem;}
.login-form-item {position: relative; display: block; width: 100%;}
.login-form-item label {position: absolute; top: 50%; transform: translateY(-50%); font-size: 2.3rem; font-weight: 700;}
.login-form-item input {border:none; width: 100%; height: 6rem; padding-left: 12rem; border-bottom: 1px solid var(--gray900); font-size:2.3rem; background-color:var(--white);}
.login-form-item input:-webkit-autofill {
    transition: #ffffff 5000s ease-in-out 0s;
    -webkit-transition: #ffffff 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}
.login-form-item input:focus {outline: none;}
.login-form-item + .login-form-item {margin-top: 1.5rem;}
.login-form-item .btn-show-pw {position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); display:block; width:5rem; height:5rem; background:url('../img/icon/ico_login_pw_hide.png') no-repeat center center; background-size:contain;}
.login-form-item .btn-show-pw.active {background-image:url('../img/icon/ico_login_pw_show.png');}
.login-form-check {margin:2.7rem 0 5.3rem;}
.login-find {margin: 4rem 0 0; text-align: center;}
.login-find-item {display: inline-block;}
.login-find-item + .login-find-item::before {content:''; display: inline-block; width: 1px; height: 1.5rem; margin: 0 2rem; background-color:#ccc;}
.login-find-item a {display: inline-block;}
.login-ad {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; margin-top: 9rem;}
.login-ad-item {flex: 1;}
.login-ad-item a::before {content:''; display: block; width: 10.9rem; height: 10.9rem; margin: 0 auto 1.5rem; background-repeat: no-repeat; background-position: center center; background-size: contain;}
.login-ad-item a {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction: column; justify-content: center; height: 24.6rem; background-color:#e7e7e8; text-align: center; font-size: 2rem; letter-spacing: -.1rem;}
.login-ad-item em {color:var(--primary);}
.login-ad-item + .login-ad-item {margin-left: .8rem;}
.login-ad-item.n1 a::before {background-image: url('../img/icon/ico_login_ad1.png');}
.login-ad-item.n2 a::before {background-image: url('../img/icon/ico_login_ad2.png');}

/* 아이디찾기 */
.find-id-wrap {margin: 0 2rem;}
.find-id-wrap .txt {margin:7rem 0 4rem; font-size: 3.5rem; line-height: 4.5rem; text-align: center;}
.find-id-wrap .btn-certify {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction: column; justify-content: center; align-items: center; width: 27.8rem; height: 27.8rem; margin: 2.5rem auto; border-radius: 1.5rem; border: 1px solid var(--gray200);}
.find-id-wrap .btn-certify::before {content:''; display: block; width: 15rem; height: 15rem; background-image: url('../img/icon/ico_certify.png'); background-position: center center; background-size: contain;}
.find-id-wrap .btn-certify:focus {outline: none; border-color: #222;}
.find-id-wrap .btn-certify span {margin-top: 1rem; font-size:2.5rem;}
.find-id-wrap .field-wrap + .field-wrap {margin-top: 1rem;}
.find-id-wrap .field-item:first-child {max-width:13rem; font-weight: 700; font-size: 2.3rem;}
.find-id-wrap .inp-id {border-color:#333;}

/* 비밀번호 찾기 */
/* .find-id-wrap.for-phone .txt {margin-top:4rem;} */
.info-message {margin: 4.5rem 2rem -2.5rem; padding: 2.2rem 2.5rem 2.5rem; border: 1px solid var(--gray200); border-radius: var(--radius); background-color: #efeff1; font-size: 2.3rem; line-height: 2.8rem; text-align: left;}
/* [modal] 인증번호 입력 */
.auth-number .inp-wrap {position:relative; flex:1;}
.auth-number .inp-text {padding-right:12rem;}
.auth-number .txt-time {position:absolute; top:50%; right:2rem; transform:translateY(-50%); text-align:center; margin:0; color:var(--error);}

/* 이벤트
------------------------------ */
.page-event .popup-body {padding:0;}
.event-cont img {max-width:max-content; width:100%; margin:0 auto;}

/* 이벤트 레이어 */
.event-open {overflow:hidden;}
.layout-event {position: fixed; top:0; right:-100%; z-index:100; overflow-y:auto; width:100%; height: 100%; background-color:var(--white); transition:right .3s ease-in;}
.layout-event.open {right:0;}