@charset "UTF-8";

.mtdn-20 {margin-top:2rem!important;}
.tbl {width:100%;}
.tbl-wrap .tbl.data th, 
.tbl-wrap .tbl.data td {padding: 0; border-bottom: 1px solid; line-height: 1.5; vertical-align: middle;}
.tbl-wrap .tbl.data thead th {vertical-align:top; height: 4rem; background-color: #edf1f5; border-left: 1px solid #99b0cb; border-right:1px solid #99b0cb; border-bottom: 1px solid #99b0cb; font-size: 1.5rem; color: #1d1d1d; font-weight: bold; text-align: left; padding:1rem 1.6rem;}
.tbl-wrap .tbl.data tbody th, 
.tbl-wrap .tbl.data tbody td {height: 2.5rem; padding-top: 1.3rem; padding-bottom: 1.4rem; background-color: #fff; border-bottom: 1px solid #d8d8d8; font-size: 1.7rem; color: #1d1d1d; font-weight: 400; text-align: left;}
.tbl-wrap .tbl.data td {padding: 0.5rem; border-bottom-color:#99b0cb; border-right:1px solid #ccc; border-left:1px solid #ccc;}
.tbl-wrap .tbl.data td .box {width:100%; display:flex; align-items:center; margin-bottom:0.5rem;}
.tbl-wrap .tbl.data td .box p.tit {position:relative; padding-left:1rem; font-size:1.5rem; font-weight:700; margin:0.25rem 0; flex-shrink:0; min-width:12%;}
.tbl-wrap .tbl.data td .box:last-child {margin-bottom:0;}
.tbl-wrap .tbl.data td textarea {display:block; width:100%; height: 10em; padding: 1rem; background-color: #fff; border: 1px solid #ccc; border-radius: 0.8rem !important;}
.tbl-wrap .tbl.data td select {display:block; width:100%; padding:0 0.5rem; height: 3.5rem; background-color: #fff; border: 1px solid #ccc; border-radius: 0.8rem !important; background-position:center right; background-image:url('/img/2021Renewal/ipe/ico_select_lg.svg'); background-repeat: no-repeat;}
.tbl-wrap .tbl.row {border-top: 1px solid #99b0cb;}
.tbl-wrap.scroll {overflow-x: auto; overflow-y: hidden;}
.tbl-wrap.scroll .tbl th, 
.tbl-wrap.scroll .tbl td {white-space: nowrap;}
.tbl-wrap {border-top:2px solid #333;}
.form-group .calendar {position:relative;}
.form-group .calendar button {position:absolute; right:1rem; top:50%; width:2rem; height:2rem; background:url('/img/2021Renewal/ipe/ico_calendar.svg') no-repeat 50% 50%; background-size:contain; margin-top:-1rem;}
.form-group {display:flex; flex-direction:column; gap:1.2rem;}

.tbl-wrap .hide {display:hide;}
.box.radio {flex-wrap:wrap; gap: 0.5rem 1rem; }
.form-control,
.form-select {position: relative; width: 100%; display:flex; align-items:center; height: 5.6rem; padding: 0 1.5rem; background:#fff; border: 1px solid #717171; border-radius: 0.8rem!important; font-family: inherit; font-size: 1.9rem; color: #1d1d1d; transition: 0.4s ease-in-out;}
.form-select {background:#fff url('/img/2021Renewal/ipe/ico_select_lg.svg') no-repeat calc(100% - 1rem) 50%;}
.form-text {position: relative; width: 60%; display:flex; align-items:center; height: 5.6rem; padding: 0 1.5rem; background:#fff; border: 1px solid #717171; border-radius: 0.8rem!important; font-family: inherit; font-size: 1.9rem; color: #1d1d1d; transition: 0.4s ease-in-out;}
.input-group {position: relative; width:100%; display:flex; gap:1rem;}
.input-group li {width:100%;}
.input-group.range.set {border-color:#ccc;}
.chxBox {display:flex; align-items:center; height:3.5rem;}
.vt-top {vertical-align:top!important;}
.page-btn-wrap.both .btn-wrap {margin:0;}
input[type="checkbox"].form-control + label {display:inline-block; cursor: pointer; font-size: 1.7rem; letter-spacing:-1px; font-weight:600; color:#000; text-align:center; margin-right:10px;}
input[type="checkbox"].form-control + label span {position:relative; display: inline-block; width: 20px; height: 20px; background:#fff; border:1px solid #ccc; margin:-2px 3px 0 0; vertical-align:middle;}
input[type="checkbox"].form-control:checked + label {color:#264beb;}
input[type="checkbox"].form-control:checked + label span {border-color:#264beb; background:#264beb url('/img/2021Renewal/ipe/ico_check_primary_checked.svg') no-repeat 50% 50%; background-size:contain;}
input[type="checkbox"].form-control {display: none;}
input[type="radio"].form-control + label {display:inline-block; cursor: pointer; font-size: 1.7rem; letter-spacing:-1px; font-weight:600; color:#000; text-align:center; margin-right:10px;}
input[type="radio"].form-control + label span {position:relative; display: inline-block; width: 20px; height: 20px; background:#fff; border:1px solid #ccc; margin:-2px 4px 0 0; vertical-align:middle; border-radius:50%;}
input[type="radio"].form-control + label span:before {content:''; position:absolute; width:18px; height:18px; left:50%; top:50%; border-radius:50%; transform:translate(-50%, -50%);}
input[type="radio"].form-control:checked + label {color:#264beb;}
input[type="radio"].form-control:checked + label span {background:#fff; border:1px solid #264beb;}
input[type="radio"].form-control:checked + label span:before {background:#264beb; border:3px solid #fff;}
input[type="radio"].form-control {display: none;}
.detail-box {display:none; width:100%; margin-top:2rem;}
.radio-detail-box .form-group,
.detail-box .form-group {margin-bottom:1.5rem;}

/* 추가 */
#middle .txt-box.bg-white .form-group {width:100%;}
#middle h4.box-tit1 {font-size:2.5rem; font-weight:700; color:#1d1d1d;}
#middle h5.box-tit2 {display: flex; position: relative;gap:0.8rem; font-size:1.9rem; font-weight:700; padding-left:0;}
#middle h5.box-tit2:not([data-icon=no]):before {display:none;}
#middle .agree-box {margin-top:0; align-items:flex-start; padding:1.5rem 2rem; height:auto; justify-content:flex-start;}
#middle .radio {margin-top:1rem; margin-bottom:2rem; display:flex; flex-direction:column; align-items:flex-start; gap:1.5rem;}
#middle .radio-detail-box {width:100%;}
#middle .textarea-count {font-size:1.5rem; width:100%; text-align:right;}
#middle textarea.form-control {height:20rem; padding:1.6rem; line-height:1.5;}
#middle .intro {padding:5rem 0;}
.txt-forms { margin-top:1.2rem; display:flex; justify-content:space-between;}
.txt-forms .form-hint {flex-shrink:0;}
.form-group [class^=form-hint] {padding-left: calc(2rem + 0.4rem);}
.form-group [class^=form-hint]::before {display: inline-flex; width: 2rem; height: 2rem; flex-shrink: 0; flex-grow: 0; content: ""; margin-left: calc((2rem + 0.4rem)* -1); margin-right: 0.4rem; vertical-align: top; background: url('/img/2021Renewal/ipe/ico_hint_20.svg') no-repeat center; background-size: contain;}
.words {display:flex; gap:1rem; /* justify-content:space-between; */ align-items:center;}
.total {display:flex; gap:1rem; justify-content:flex-start; align-items:center;}
.total strong {font-size:3rem; font-weight:900; color:#ed1a3b;}
.total p,
.words p {font-size:1.8rem; font-weight:700;}
.btn.ico-upload::before, 
.btn.ico-upload::after {background-image: url('/img/2021Renewal/ipe/ico_upload_20_wh.svg');}

#middle .terms-agree-ul .agree-box {display: flex; align-items: center; justify-content: space-between; height: auto; padding: 2rem 2.4rem;}
#middle .terms-agree-ul li {gap:0;}
#middle .page-btn-wrap.ar {justify-content:flex-end;}
#middle .outline {gap:2rem;}
#middle .outline .outline-tit {font-weight:700; color:#000;}
#middle p.msg {color:#ed1a3b; font-size:1.5rem;}
#middle .decimal {margin:0;}
#middle .info-list.decimal > li + li {margin-top:1rem;}
#middle .tbl-wrap {margin:0;}
#middle .tbl-wrap .tbl.data thead th,
#middle .tbl-wrap .tbl.data td {border-left:0; border-right:0;}
#middle .tbl-wrap .tbl.data th, 
#middle .tbl-wrap .tbl.data td {padding:1.5rem; font-size:1.5rem;}
.agree-tit { display: flex; flex-direction: column; gap: 2.4rem;}
.agree-box { display: flex; justify-content: space-between; align-items: center; height: auto; padding: 2rem 2.4rem;}
.outline .outline-tit::before {background-image: url('/img/2021Renewal/ipe/ico_outline.svg');}
.outline .check-list > li::before {background-image: url('/img/2021Renewal/ipe/ico_outline_chk.svg');}
.chk-area { display: flex; gap: var(--spacer-6); }
.chk-area.chk-column { flex-direction: column; }


.modal {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
	opacity:1;
	visibility: visible;
    background: rgba(0,0,0,0.5);
    padding: 20px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.modal-back {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

.modal.open {
    display: block;
	
}

.modal-back.open {
    display: block;
}
