@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2026-01-06
******************************************************** */

#content {
	background-color: var(--color-gray00);
	box-sizing: border-box;
	width: calc(100%);
	padding: 24px 40px;
	min-height: calc(100vh - 50px);
}

.input-box-wrap {
	border: 1px solid var(--color-gray04);
	padding: 14px 20px;
	box-sizing: border-box;
	border-radius:4px;
	box-shadow: 0px 1px 4px 1px rgba(0,0,0,0.15);
}
.input-box-wrap.type01 {
    border: 0;
    box-shadow: none;
    padding: 0;
}
.input-box-wrap,.input-box {
	display: flex;
}
.input-box-wrap.side {
	justify-content: space-between
	}
@media all and (max-width:1326px) {
	.input-box-wrap {
		flex-wrap: wrap;
		gap: 4px;
	}
	.input-box {margin-right: 24px;}
	.input-box + .input-box {margin-left: 0px; margin-right: 0px;}
}

/* **********************
	*  실제 컨텐츠 내용영역
********************** */
/* .cont-wrap {height: calc(100% - 98px);} */
.cont-wrap-title {
	margin-bottom: 12px;
	height: 32px;
	color: var(--color-gray0/);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.table_title {
	margin-bottom: 12px;
	height: 42px;
	color: var(--color-gray0);
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--color-gray03);
    box-sizing: border-box;
}


/* **********************
	* 컨텐츠 영역 (공통)
********************** */
#rightContent {
	width: 100%;
	min-height: 100%;
}
.grid-cont-wrap {
	margin-top: 12px;	
}
.grid-cont {
	border: 1px solid var(--color-gray01);
	overflow-y: scroll;
}
.grid-cont.type01 {
	height: calc(100vh - 320px);	
	}
.grid-cont.type02 {
	height: calc(100vh - 360px);	
	}
.grid-cont.type03 {
	height: calc(100vh - 380px);	
	}
.grid-cont.type04 {
	height: calc(100vh - 410px);	
	}
	
.grid-cont.type05 {
	height: calc(100vh - 430px);	
	}
	
.grid-cont.type06 {
	height: calc(100vh - 520px);
	}
	
.grid-tool {
	height: 40px;
	padding: 8px;
	box-sizing:border-box;
	border-bottom: none;	
	display:flex;
    align-items: center;
	justify-content: flex-end
}
.grid-tool .reload-time{
	font-weight: 300;
	color: var(--color-gray06);
}


/* **********************
	* 이용정보/가입계약서/변경이력
********************** */
.user-info {
	border: 1px solid var(--color-gray04);
	padding: 40px;
}
table.table-join {
	width: 100%;
}
table.table-join {
	border-top: 1px solid var(--color-gray05);
}
table.table-join :is(th, td) {
 padding: 8px;
 box-sizing: border-box;
 border-bottom: 1px solid var(--color-gray03);
 border-right: 1px solid var(--color-gray03);
}
table.table-join.bdr-none :is(th, td) {
 border-right: none;
 text-align:left;
}
table.table-join :is(th, td):last-child {
 border-right: none;
}
table.table-join :is(th, td):last-child.bd1 {
	border-right: 1px solid var(--color-gray03);
}
table.table-join :is(th, td).bd0 {
	border-right: none;
}

table.table-join td {
	font-size: 14px;
	text-align: left;
	line-height: 1.5;
}
table.table-join th {
	height: 30px;
	background-color: var(--color-gray01);
	color: var(--color-gray05);
	line-height: 1.25;
	text-align:center;
}
.flex-table-wrap {
	display: flex;
	gap: 16px;
}
.flex-table {
	width: 50%;
	padding: 8px 8px 16px;
	border: 1px solid var(--color-gray05);
	box-sizing: border-box;
}
.flex-table table {
	width: 100%;
}
.flex-table table th {
	text-align: left;
}
.flex-table table :is(th,td) {
	padding: 8px; 
	position: relative;
}
.flex-table .system-tag {
	height: 22px;
    text-align: center;
    width: 46px;
}
.stamp-comp {
    width: 70px;
    height: 70px;
    position: absolute;
    top: -20px;
    mix-blend-mode: multiply;
    left: 50%;
	margin-left: -35px;
}
.stamp-user {
    width: 70px;
    height: 70px;
    position: absolute;
    top: -20px;
    mix-blend-mode: multiply;
    left: 50%;
	display: none;
	margin-left: -35px;
}
@media all and ( max-width: 1200px ) {
	.flex-table-wrap {
		flex-direction: column;}
	.flex-table {
		width: 100%
}
}
.sub-box {margin-top: 32px;
	border: 1px solid var(--color-gray04);
	padding: 16px;
}

@media all and ( max-width: 768px ) {
	.flex-table-wrap {flex-direction: column;}
	.flex-table {width: 100%}

}
.footer-list {
    display: flex;
    font-size: 13px;
    font-weight: 500;
}
.footer-list li {
    border-right: 1px solid var(--color-gray04);;
	padding: 0 12px
}
.footer-list li:hover {
	cursor: pointer;
	color: var(--color-gray05);
 }
.footer-list li:last-child {
	border-right: none;
}

/* 이용약관 팝업 */
.pop-section{
	padding: 8px;
}
.pop-section p {
	color: var(--color-gray08);
}
.pop-section h6:after {
	content: '';
	display: inline-block;
	width: calc(100% - 16px);
	height: 1px;
	background-color: var(--color-gray03);
}
.pop-section h6 {
	white-space: nowrap;
	color: var(--color-gray08);
    display: flex;
    align-items: center;
    gap: 8px;
	margin-bottom: 8px;
}

/* 결재란 설정 */
.confirm-line .confirm-field-left,
.confirm-line .confirm-field-right {
	width: 100%;
}
.confirm-line .confirm-field-left table td {
	border : 1px dotted #aaa;
	line-height: 30px; 
	position:relative;
	text-align: center; 
	font-size: 15px;
}
.confirm-line .confirm-field-right {
	max-width: 280px;
	padding-left: 16px;
}
.confirm-line .confirm-field-right #form-wrap {
	zoom: 0.38;
	height: 100%;
}
.confirm-line .confirm-field-right #form-wrap .content03 {
	margin: 0 auto; 
	border: 1px solid var(--color-gray08); 
	padding: 24px 16px 0px; 
	box-sizing: border-box;
	height: 100%;
}
.confirm-line .confirm-field-right table tbody :is(td,th) {
	height: 20px; 
	padding: 5px; 
	border: 1px solid #000; 
	text-align: center; 
	font-size: 12px; 
	font-weight: 100; 
	color: #000;
}
.confirm-line .confirm-field-right table + table tbody :is(td,th) {
	border-left: none;
}
.confirm-line .confirm-field-right table tbody td.borderNone {
	border: 0;
}
.confirm-line .confirm-field-right table tbody td.hih {
	height: 60px;
}
.confirm-line .confirm-field-right table tbody .borderBottom {
	border-bottom: 0;
}
.confirm-line .confirm-field-right table tbody .borderTop {
	border-top: 0;
}

/*비활성화*/
.confirm-line .confirm-field-left .confirm-table {
	opacity: 0.3; 
	background: #ddd;
}
.confirm-line .confirm-field-left .confirm-table .confirm-name {
	height: 40px;
}
.confirm-line .confirm-field-left .confirm-table .stamp-warp {
	width: 100%; 
	height:100%;
}
.confirm-line .confirm-field-left .confirm-table .stamp {
	width: 95px;
	height: 100%;
	margin: 0 auto;
	position:relative; 
	display: flex;
	justify-content: center;
	align-items: center;
}
.confirm-line .confirm-field-left .confirm-table .stamp img {
	width: 100%;
}
.confirm-line .confirm-field-left .confirm-table .add-stamp button i {
	font-size: 20px; margin-bottom:5px;
}
.confirm-line .confirm-field-left .confirm-table tr:nth-child(2) td {
	height: 140px;
}
.confirm-line .confirm-field-left .confirm-table .add-stamp button{
	cursor:default;
}
.confirm-line .confirm-field-left .confirm-table .fileLoader {
	display:none;
}
.confirm-line .confirm-field-left .cont-txt {
	font-size: 14px;
}

/*활성화*/
.confirm-line .confirm-field-left .confirm-table .remove-stamp {
	position: absolute;
	right: 16px;
	bottom: 0px;
}
.confirm-line .confirm-field-left .confirm-table .remove-stamp button {
	width: 24px; 
	height:24px; 
	padding: 3px; 
	box-sizing:border-box; 
	border-radius: 20px; 
	font-size: 26px; 
	color: var(--color-gray03); 
	line-height:18px;
}
.confirm-line .confirm-field-left .confirm-table .remove-stamp button:hover {
	color: var(--color-gray05); 
	transition: 0.3s;
}
.confirm-line .confirm-field-left .confirm-table.able .confirm-name input{
	display: block;
}
.confirm-line .confirm-field-left .confirm-table.able {
	opacity: 1; 
	background:#fff;
}
.confirm-line .confirm-field-left .confirm-table.able .add-stamp button{
	cursor:pointer;
	opacity: 0.5;
}
.confirm-line .confirm-field-left .confirm-table.able .add-stamp button:hover {
	opacity: 1;
}

/* *************************	*1:1 문의 게시판 작성************************* */
/* 2026.04.06 추가 */
.text-area textarea.board-wright {min-height:320px;}
.board-type01.inquiry th {padding-left: 24px;}
.inquiry-type-btn {background: var(--color-blue05);color: #fff;padding: 10px 12px;border-radius: 4px;font-weight: 600;flex: none;}

.upload-box-min.inquiry .file-up-min{align-items: start;height: auto;padding: 0;border: 0;gap: 4px;}
.upload-box-min.inquiry .file-up-min .file-in-box {border: 1px solid var(--color-gray04);border-radius: 4px;width: 100%;min-height: 38px;}
.upload-box-min.inquiry .file-up-min label.btn {background: #e5e5e5;border: 1px solid var(--color-gray03);}
.upload-box-min.inquiry .file-up-min .file {margin: 7px 0;padding: 3px 12px;}
.upload-box-min.inquiry .file-up-min .file::before {display: none;}
.upload-box-min.inquiry .file-up-min .file a {background: #6b6c6f;width: 18px;height: 18px;display: inline-flex;align-items: center;border-radius: 10px;justify-content: center;color: #fff;font-size: 12px;margin-left: 6px;}

.upload-files-desc {margin-bottom: 8px;}
.upload-files-desc p {font-size: 14px;font-weight: 500;}
.upload-files-desc ul {font-size: 14px;padding-left: 12px;color:var(--color-gray07);}
.upload-files-desc ul li {line-height: 22px;}

.file-box.tp2 {flex-direction: column;gap: 2px;}
.file-box.tp2 .file-link {border: 0;padding: 0;justify-content: flex-start;}

.file-box.blue {padding-top: 4px;flex-wrap: wrap;gap: 4px;}
.file-box.blue .file-link {font-size: 14px;border: 1px solid var(--color-blue05);}

/* *************************************
	* 원천세 신고 요청 최종 점검 안내 
************************************* */
.datepicker-wrap.none-border,
.input-form.none-border {
	border-color: #ffffff00;
}
.input-box.h30px, 
.input-box.h30px .datepicker-wrap {
	height: 30px;
}
.input-box.h30px .datepicker-wrap :is(.datepicker-open-input, .datepicker-month-open-input, .datepicker-year-open-input){
	height: 28px;
    padding: 0;
    top: -7px;
}
.input-box.h30px .datepicker-wrap i {
	top: -4px;
}
table.table-type04 td.bdt {
    border-top: 1px solid var(--color-gray03);
}
.select-wrap.h-auto,
.select-wrap.h-auto .select-form
{
	height: 100%;
	line-height: 30px;
	font-size: 13px;
}

.input-form.h30px {
	height: 30px;
}
.h118px {height: 118px}
 table.table-type04.h118px tr:last-child td {border-bottom: none;}


 /* *************************************
	* 25년 연말정산 신청 
************************************* */
/* step01(메인) */
#container.taxsettle2025.step01 {
	height: 100vh;
    align-items: center;
    justify-content: center;
	max-width: 1400px;
	min-width: 1024px;
}

.taxsettle2025.step01 h2 {
	font-size: 36px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.taxsettle2025.step01 h2 .tag {
	font-size: 20px;
	font-weight: 700;
	display: inline-block;
	background: #04A4A5;
	background: linear-gradient(180deg, rgba(4, 164, 165, 1) 0%, rgba(0, 130, 131, 1) 100%);
	color: var(--color-gray00);
	padding: 4px 4px 4px 12px;
	border-radius: 50px;
}
.taxsettle2025 .step01-contbox {
	height: 500px;
	width: 100%;
}
.taxsettle2025 .title-box {
    display: flex;
    justify-content: space-between;
}
.taxsettle2025 .date-alert {
	margin-top: 16px;
	border: 2px dotted var(--color-system-warn03);
	padding: 8px 6px 8px 16px;
	border-radius: 40px;
    display: flex;
    align-items: center;
	width: fit-content;
}
.taxsettle2025 .date-alert span {
	color: var(--color-gray09);
	letter-spacing: 0.5px;
}

.taxsettle2025 .date-alert.finish {
	border-color: var(--color-gray04);
}

.taxsettle2025 .date-alert .system-tag {
	font-size: 18px;
}
.taxsettle2025 .title-box .btn {
	height: 100%;
	padding: 16px 56px;
	font-size: 24px;
	font-weight: 700;
}
.taxsettle2025 .title-box .btn.btn-solid-blue {
	box-shadow: 0px 4px 10px 2px rgb(50 105 200 / 51%);
}
.taxsettle2025 .step01-contbox .cont-list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
	box-sizing: border-box;

}
.taxsettle2025 .step01-contbox .cont-list>div {
	border: 1px solid var(--color-blue03);
	border-radius: 8px;
	padding: 8px 16px;
	box-sizing: border-box;
	position: relative;
}
.taxsettle2025 .step01-contbox .cont-list>div:nth-child(3)::after {
	content: '';
	text-align: right;
	color: #fff;
	display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 50px 50px 0px;
    border-color: transparent var(--color-blue04) transparent transparent;
	position: absolute;
	top: -1px;
	right: -1px;
}
.taxsettle2025 .step01-contbox .cont-list>div:nth-child(3)::before {
    content: '?';
    position: absolute;
    top: 5px;
    right: 9px;
    z-index: 2;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-gray00);
}
.taxsettle2025 .step01-contbox .cont-list h5 {
	padding: 8px 8px 12px;
	border-bottom: 1px solid var(--color-blue02);
}
.taxsettle2025 .step01-contbox .cont-list ul {
	padding-top: 16px;
	padding-bottom: 40px;
}
.taxsettle2025 .step01-contbox .list-cont-box {
    height: calc(100% - 50px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.taxsettle2025 .step01-contbox .list-cont-box .card-btn {
	height: 48px;
	background-color: var(--color-blue01);
	border-radius: 8px;
	font-weight: bold;
	font-size: 18px;
	color: var(--color-blue05);
}
.taxsettle2025 .step01-contbox .list-cont-box .card-btn:hover {
	background-color: #c3e0ff;
	color: var(--color-blue07);
	transition: 0.4s;
}

/* step02(모달 내용) */
.taxsettle2025.step02 .taxsettle-cont .cont-box{
    border: 1px solid #ccc;
	padding: 16px 24px;
	border-radius: 8px;
}
.taxsettle2025.step02 .taxsettle-cont .cont-box>div {
	height: 50%;
}
.taxsettle2025.step02 .taxsettle-cont .cont-box h4 {
	font-size: 18px;
}
.taxsettle2025.step02 .select-container01 {
	box-sizing: border-box;
}
.taxsettle2025.step02 .select-container01 label {
	display: block;
	width: 100%;
	border: 1px solid var(--color-gray03);
	box-sizing: border-box;
	padding: 16px 24px;
	cursor: pointer;
	border-radius: 16px;
	opacity: 0.8;
	display: flex;
	align-items: flex-start;
    flex-direction: column;
	gap: 8px;
}
.taxsettle2025.step02 .select-container01 label:hover {
	opacity: 1;
}
.taxsettle2025.step02 .select-container01>input[type='radio'] {
	display: none;
}

.taxsettle2025.step02 .select-container01>input[type='radio']:checked + label {
	border-color: var(--color-blue04);
	box-shadow: 0px 0px 0px 1px var(--color-blue04) inset;
	background-color: #d6e9fc70 !important;
	opacity: 1;
}
.taxsettle2025.step02 .select-container01 label .bank-info {
	display: none;
    padding-left: 22px;	
	margin-top: 8px;
}
.taxsettle2025.step02 .select-container01>input[type='radio']:checked + label .bank-info {
	display: block;
}
.taxsettle2025.step02 .select-container01 label h5 {
	font-size: 20px;
}
.taxsettle2025.step02 .select-container01 label .ck-div {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 1px solid var(--color-gray05);
	margin-right: 8px;
	border-radius: 50px;
}
.taxsettle2025.step02 .select-container01>input[type='radio']:checked + label h5{
	color:  var(--color-blue05);
	transition: 0.2s;
}
.taxsettle2025.step02 .select-container01>input[type='radio']:checked + label .ck-div {
	border-color: var(--color-blue05);
	box-shadow: 0px 0px 0px 1px var(--color-blue04) inset;
	transition: 0.2s;
}
.taxsettle2025.step02 .select-container01>input[type='radio']:checked + label .ck-div:after {
	content: '';
	width: 10px;
	height: 10px;
	display: block;
	background-color: var(--color-blue05);
	border-radius: 50px;
	position: relative;
	top: 3px;
	left: 3px;
	transition: 0.4s;
}
.taxsettle2025.step02 .select-container-title {
	display: flex;
	height: 100%;
	align-items: flex-start;
}
.taxsettle2025.step02 .select-container02 .tit {
	width: 220px;
}
.taxsettle2025.step02 .select-container02 .input-box {
    align-items: flex-start;
	height: auto;
}
.taxsettle2025.step02 .select-container02 .input-box>div {
	width: calc(100% - 240px);
}
.taxsettle2025.step02 .select-container02 .add-box {
	width: 540px;
	background-color: var(--color-gray01);
	padding: 12px 12px 12px 20px;
	box-sizing: border-box;
	display: none;
	gap: 16px;
}
.taxsettle2025.step02 .select-container02 .add-box h6 {
	white-space: nowrap;
}
.taxsettle2025.step02 .select-container02 input.add-input:checked ~ .add-box {
	display: flex;
}
.taxsettle2025.step02 .select-container02 .add-box>div:nth-child(1) {
	width: 100px;
}
.taxsettle2025.step02 .select-container02 .add-box>div:nth-child(2) {
	width: 416px;
}

.taxsettle2025.step02 .select-container02 .add-box .add-tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}
.taxsettle2025.step02 .select-container02 .add-box .add-tag-list p {
	border: 1px solid var(--color-gray02);
	color: var(--color-gray07);
	font-size: 14px;
	background-color: var(--color-gray00);
	width: fit-content;
	height: 18px;
	line-height: 18px;
	padding: 4px 8px;
}
.taxsettle2025.step02 .select-container02 .add-box .add-tag-list p span {
	cursor: pointer;
	color: var(--color-gray05);
}
.taxsettle2025.step02 .select-container02 .add-box .add-tag-list p span:hover {
	color: var(--color-gray09);
}

/*연말정산 일정안내 table custome*/
.table-grid-5col {
    display: grid;
    grid-template-columns: 1fr 2.5fr 2.5fr 2.5fr 2.5fr 2.5fr;
    align-content: stretch;
}
.table-grid-5col-02 {
    display: grid;
    grid-template-columns: 1fr 2.5fr 2fr 2fr 2fr 2fr;
    align-content: stretch;	
}
.table-type01.select-table {
	border: 1px solid var(--color-blue05);
	box-shadow: 0px 0px 0px 2px var(--color-blue05);
	position: relative;
	z-index: 1;
	line-height: 1.5;
	font-style: normal;
	font-weight: 500;
}
.table-type01.select-table tr:first-child th {
	border-top: 1px solid var(--color-blue05);
	border-bottom: 1px solid var(--color-blue03);
	background-color: var(--color-blue01);
	color: var(--color-blue06);
}

table.table-type01.select-table td {
	border-right: 1px solid var(--color-blue05);
	line-height: 1.5;
}
table.table-type01.select-table tr:last-child td {
	border-bottom: 1px solid var(--color-blue05);
}
table.table-type01.select-table tr:last-child td p {
	color: var(--color-blue04);	
} 

.list-type.lg-txt p {
	font-size: 16px;
}