@charset "utf-8";
/* CSS Document */


.no-padding {padding: 0;}
.gap-60 {clear: both; height: 60px;}
.gap-40 {clear: both; height: 40px;}
.gap-30 {clear: both; height: 30px;}
.gap-20 {clear: both; height: 20px;}

/********************
* margin&padding *
********************/
.mgt0 {margin-top: 0 !important;}
.mgt5 {margin-top: 5px;}
.mgt10 {margin-top: 10px;}
.mgt15 {margin-top: 15px;}
.mgt20 {margin-top: 20px;}
.mgt30 {margin-top: 30px;}
.mgt40 {margin-top: 40px;}
.mgt50 {margin-top: 50px;}
.mgt100 {margin-top: 100px;}

.mgb0 {margin-bottom: 0px;}
.mgb5 {margin-bottom: 5px;}
.mgb10 {margin-bottom: 10px;}
.mgb15 {margin-bottom: 15px;}
.mgb20 {margin-bottom: 20px;}
.mgb30 {margin-bottom: 30px;}
.mgb40 {margin-bottom: 40px;}
.mgb50 {margin-bottom: 50px;}
.mgb100 {margin-bottom: 100px;}
.mrb-30 {margin-bottom: 30px;}

.mgl0 {margin-left: 0px;}
.mgl5 {margin-left: 5px;}
.mgl10 {margin-left: 10px;}
.mgl15 {margin-left: 15px;}
.mgl20 {margin-left: 20px;}
.mgl30 {margin-left: 30px;}
.mgl40 {margin-left: 40px;}
.mgl50 {margin-left: 50px;}
.mgl100 {margin-left: 100px;}

.mgr0 {margin-right: 0px;}
.mgr5 {margin-right: 5px;}
.mgr10 {margin-right: 10px;}
.mgr15 {margin-right: 15px;}
.mgr20 {margin-left: 20px;}
.mgr30 {margin-right: 30px;}
.mgr40 {margin-right: 40px;}
.mgr50 {margin-left: 50px;}
.mgr100 {margin-right: 100px;}

.pdt0 {padding-top: 0 !important;}
.pdt5 {padding-top: 5px;}
.pdt10 {padding-top: 10px;}
.pdt15 {padding-top: 15px;}
.pdt20 {padding-top: 20px;}
.pdt30 {padding-top: 30px;}
.pdt40 {padding-top: 40px;}
.pdt50 {padding-top: 50px;}
.pdt100 {padding-top: 100px;}

.pdb0 {padding-bottom: 0px;}
.pdb5 {padding-bottom: 5px;}
.pdb10 {padding-bottom: 10px;}
.pdb15 {padding-bottom: 15px;}
.pdb20 {padding-bottom: 20px;}
.pdb30 {padding-bottom: 30px;}
.pdb40 {padding-bottom: 40px;}
.pdb50 {padding-bottom: 50px;}
.pdb100 {padding-bottom: 100px;}

.pdl0 {padding-left: 0px;}
.pdl5 {padding-left: 5px;}
.pdl10 {padding-left: 10px;}
.pdl15 {padding-left: 15px;}
.pdl20 {padding-left: 20px;}
.pdl30 {padding-left: 30px;}
.pdl40 {padding-left: 40px;}
.pdl50 {padding-left: 50px;}
.pdl100 {padding-left: 100px;}

.pdr0 {padding-right: 0px;}
.pdr5 {padding-right: 5px;}
.pdr10 {padding-right: 10px;}
.pdr15 {padding-right: 15px;}
.pdr20 {padding-left: 20px;}
.pdr30 {padding-right: 30px;}
.pdr40 {padding-right: 40px;}
.pdr50 {padding-left: 50px;}
.pdr100 {padding-right: 100px;}

/*넓이*/
.w100 {width: 100% !important;}
.w90 {width: 90% !important;}
.w80 {width: 80% !important;}
.w70 {width: 70% !important;}
.w60 {width: 60% !important;}
.w50 {width: 50% !important;}
.w40 {width: 40% !important;}
.w30 {width: 30% !important;}
.w25 {width: 25% !important;}
.w20 {width: 20% !important;}
.w10 {width: 10% !important;}

/* 링크 */
a {color: inherit; transition: 0.2s ease;}
a:link, a:visited {text-decoration: none;}
a:hover {text-decoration: none; color: #000;}
a.read-more {color: #ffb600; font-weight: 700; text-transform: uppercase;}
a.read-more:hover {color: #222;}
a:focus {outline: 0;}
a[href^=tel] {color: inherit; text-decoration: none;}

/* Title */
.title {font-size: 32px; line-height: 36px; margin-bottom: 20px;}

/**************
* Button-style *
**************/
.btn:active, .btn:focus {box-shadow: none !important;}
.btn, .btn-mid, .btn-min {border: 0; transition: 350ms; }
.btn { border-radius: 5px; padding: 6px 16px; font-weight: 700; font-size: 16px; margin: 0 2px; }
.btn-min {border-radius: 3px; padding: 5px; font-size: 13px;}
.btn-mid {border-radius: 3px; padding: 8px 12px; font-size: 14px;}
.btn.deact {cursor: default !important; background-color: #Bbb;  color: #888 !important;}/*비활성화 버튼*/
.btn.submit-btn {font-size: 20px;}
.btn.icon-btn {min-height: 36px; padding: 6px 12px;}
.btn.btn-lg {border-radius: 8px; font-size: 22px; padding: 8px 100px;}

.fc-white { color: #fff !important;}
.fc-blue { color: #0039BF !important;}
.fc-red { color: #ff3312 !important;}
.fc-gray { color: #888 !important;}
.fc-green { color: #00C359 !important;}

.bg-blue {background-color: #065bf9}
.bg-blue:hover {background-color: #0045C7;}
.bg-darkblue {background-color: rgb(0 50 137);}
.bg-darkblue:hover {background-color: #162242;}
.bg-lightblue {background-color: #12b2ff;}
.bg-lightblue:hover,.bg-lightblue:focus {background-color: #0062FB;}
.bg-gray {background-color: #555;}
.bg-gray:hover,.bg-gray:focus {background-color: #333;}
.bg-lightgray {background-color: #ddd;}
.bg-green {background-color: #00b360;}
.bg-red {background-color: #ff125f;}
.bg-white {background-color: #fff; border: 1px solid #ddd; box-sizing: border-box; color: #999;}
.bg-white:hover {background-color: #ededed; border: 1px solid #aaa;  color: #666;}

.btn.border-btn {border: 1px solid #bbb; color: #666;  padding: 5px 15px; } 
/**************
* input-style *
**************/
input {position: relative;}
.form-control {min-width: 40px; padding: 0 10px;}
.datepicker-wrap {position: relative;}
.datepicker-wrap::after {content:"\f133"; position: absolute; right: 15px; top: 10px; font-size: 16px; color: #555; cursor: pointer;}
.dropdown-menu.datepicker {padding: 20px; min-width: auto;}
.form-control.wpx-120 {width: 160px}
.form-control.wpx-160 {width: 160px}
.form-control.wpx-240 {width: 240px}

/*내부 페이지 테이블타입1*/
.card {border: 1px solid #ccc; background: #e6e9ed; position: relative; overflow: auto;}
.card-body {padding: 0; height: 650px; overflow-x: scroll; position: relative;}
.card-body-250 {padding: 0; height: 250px; overflow-x: scroll; position: relative;}
.table.total-table {position: sticky; bottom: 0; margin-bottom: 0; margin-top: -42px;}
.table.total-table td {border-bottom: 0;}
.table {margin-bottom: 3rem;}
.table thead {position: sticky; top: 0; z-index: 10}
.table tfoot {position: sticky; bottom: -1px;  z-index: 10}
.table tfoot td {background-color: #fff; font-weight: bold;}
.table thead th {background: #ddd; padding: 10px 5px; color: #111; border-left: 1px solid #fff; text-align: center; font-size: 15px; font-weight: 600; border-top: 0; vertical-align: middle;}
.table thead th p {font-size: 0.95em; font-weight: 100;}
.table th.imp:after {content:' *'; color: #ff3b59;}
.table th,.table td {white-space: nowrap; height: 22px; vertical-align: middle}
.table tbody td {padding: 5px; background-color:  #fff; border-left: 1px solid #ccc; font-size: 15px; font-weight: 400}
.table  tr:nth-child(2n) td {background-color:  #f7f7f7;}
.table tbody tr:last-child {box-shadow: 0 3px 3px 1px rgba(0,0,30,0.1); border-bottom:  1px solid #aaa; margin-bottom: 43px;}
.table :is(th,td):first-child {border-left: 0;}
.table :is(th,td).bdl {border-left: 1px solid #fff}
.table th.bdl2 {border-left: 2px solid #666}
.table td.bdl2 {border-left: 2px solid #666}
.table tbody tr:hover td{background-color:  rgba(100,100,100,0.1) !important;}
.table tbody tr.select-tr td{background-color:  rgb(130 255 0 / 10%);}
.table input {cursor: pointer;}
.table tbody td.bg-sky {background-color:  rgb(217 223 233) !important; border-bottom: 1px solid #b2bfd1; border-bottom: 1px solid #b2bfd1}
.table-btn {float: right; border: 1px solid #bbb; border-radius: 20px; color: #777; line-height: 1; letter-spacing: -1px; padding: 3px 6px 2px; font-size: 12.5px; font-weight: 300;}
.table-btn:hover {background: rgba(10,150,200,1); border: 1px solid rgba(10,150,200,1); color: #fff;}
.table-btn2 {font-size: 13px; font-weight: 400; border: 0; padding: 4px 6px; border-radius: 5px;transition: 0.5s;}
.table-btn2.submit {background-color: #0045C7; color: #fff;}
.table-btn2.submit:hover {background-color: #007EE7; }
.table-btn2.primary {background-color: #ccc; color: #111;}
.table-btn2.primary:hover {background-color: #888; color: #fff;	}
.table thead tr:nth-child(2) th {background: #bbbbbb;}
.table .form-control.min {padding: 5px; padding: 5px; height: 30px; min-width: 50px; margin: auto;}

/*테이블타입1-1(내용 많을 경우 - 조합원)*/
.table.max-table :is(th,td) { font-size: 13px;}

/*내부 페이지 테이블타입2*/
.sum-grid {width: 100%; border-top: 2px solid rgb(80 80 80);  border-bottom: 1px solid rgb(80 80 80);  border-right: 1px solid rgb(80 80 80); margin-top: 5px;}
.table2 {width: 100%;}
.table2 :is(th,td) {padding: 5px; height: 48px; font-size: 15px; white-space: nowrap; vertical-align: middle;}
.table2 th {background: rgb(120 120 120); color: #fff; font-weight: bold; }
.table2 td {background-color: #fff; color: #111;}

/*내부 페이지 테이블타입3 (결재라인)*/
.confirm-grid {margin-left: -1px; margin-top: -1px;}
.table3 {width: 100%;}
.table3 :is(th,td) {padding: 10px;}
.table3 th {background-color: #F6F1F1; font-weight: bold; border: 1px solid #bbb; vertical-align: middle; text-align: center; color: #222}
.table3 th.white-th {background: #fff; }
.table3 td {background-color: #fff; height: 180px; border: 1px solid #ccc;}
.table3 td .stamp-area {width: 80%; height: 100%; margin: auto;}

/*내부 페이지 테이블타입4 (메인페이지/게시판)*/
.table4 {width: 100%; border-top: 2px solid #222}
.table4 :is(th,td) {border-bottom: 1px solid #aaa;}
.table4 th {/*text-align: center;*/ font-weight: 700; padding: 10px; white-space: nowrap;}
.table4 td {/*text-align: center;*/ padding: 15px; color: #888; white-space: nowrap;}
.table4 td a {color: #111;}
.table4 th.imp:after {content:' *'; color: #ff3b59;}

/*페이징*/
.board-table .pagination{justify-content: center; } 
.board-table .paging .page-link {color: #444; border: none;}

/*테이블 제목*/
.table-caption {margin: 30px 0 15px 0;}
.table-caption h5 {font-size: 20px;}

/*내부 페이지 타이틀부*/
.menu-area {width: 100%; padding: 10px 0; background: #065bf9;}
.menu {height: inherit;}
.menu-category {display: flex; align-items: center}
/*.menu-category:before {content:''; display: inline-block; width: 5px; height: 5px; background-color: aliceblue; margin-right: 10px; border-radius: 5px;}*/
.menu-category li {font-size: 15px; color: #fff;}
.menu-category li a:hover {color: #aad3ff;}
.menu-category li:after {content:'>'; color: #dddddd80; margin: 0 10px;}
.menu-category li:last-child:after {content: '';}

/*보드 타이틀*/
.container-title {padding: 10px 0;}
.container-title h4 {font-size: 26px; font-weight: 700; color: #fff; margin-bottom: 0}
.container-title h4 span {font-weight: 200; font-size: 18px; color: #CDD4F9; letter-spacing:  -2px; margin-left: 5px;}

.notice-txt {padding: 10px 15px; border: 1px solid #138aff; border-radius: 10px; background-color: #fff; margin-bottom: 20px; margin-top: -10px;}
.notice-txt.mid-notice {margin-top: 0}
.notice-txt p {font-size: 16px; color: #0046c9;line-height: 1.5}
.notice-txt p:before{content:"\f06a"; color: #1667ff; margin-right: 5px;}
.input-group { padding: 5px 15px 0; flex-wrap: nowrap}/*231008 수정*/
.align-right{justify-content: flex-end}
.input-item {display: flex; align-items: center; margin-right: 20px;}
.input-item h6 {font-size: 16px; white-space: nowrap; margin: 5px 15px 5px 0;  min-width: 55px;}
.input-item input, .input-item select {}
.input-item label {cursor: pointer; white-space: nowrap;}
.input-item label input {position: relative; top: 3px; margin-right: 5px;}
.input-item input::placeholder {color: #aaa; font-weight: 200; width: 100%}

/*메인 헤더*/
.main-header {padding: 15px 0 10px 0; border-bottom: 1px solid #eee}
.main-header .logo img {height: 45px;}
.main-header .userbar {justify-content: space-between}
.main-page .logo {display: none;}

/*로그인 모달*/
.login {-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);}
.login .modal-body {padding: 1rem 2.5rem;}
.login .modal-title {font-size: 22px;}
.login input[type='text'] {width: max-content;}
.login label input[type='checkbox'] { position: relative;  top: 3px; margin-right: 5px;}
.login .modal-footer {justify-content: center; margin-top: 20px;}

/*팝업 모달*/
.modal-header { padding: 1rem 2rem 0;}
.modal-body .card-body {height: 450px;}
.popText-area {min-width: 450px; padding: 0 20px;}
.popText-area p {font-size: 17px; line-height: 1.5; color: #333;}
.popText-area.poptextSubmit {}
.popText-area.poptextSubmit p{}
.modal-textarea {min-width : 500px; border: 1px solid #ccc; min-height: 300px;}

/*메인페이지 보드부*/
.board-table {width: 100%;}
.section-sub-title {color: #666; margin-top: 5px; font-weight: 400; font-size: 20px;}
.board-list-tab {width: 100%; display: flex; margin-top: 20px;}
.board-list-tab li {width: 22%; text-align: center; padding: 10px; font-size: 17px; font-weight: 300; border-radius: 20px; border: 1px solid #ccc; margin : 0 1.5%; cursor: pointer; white-space: nowrap;}
.board-list-tab li:hover {background-color: #e3ecfd; border: 1px solid #e3ecfd; transition: 0.7s;}
.board-list-tab li.active {background-color: #065bf9; color: #fff; border: 1px solid #065bf9; font-weight: 500;}
.board-list-tab li label { cursor: pointer;}
.board-list-tab li input {display: none}
.board-table .btn:hover {background-color: #f7f7f7; border: 1px solid #f7f7f7; color:#111;}

/*바로회계 페이지*/
section.solid-bg {background-color: #f7f7f7}

.point-section,.work-section {margin-top: 30px; text-align: center;}
.point-section h3 {font-size:24px; font-weight: 600; color: #777;}

.point-section h3 span {font-size:24px; font-weight: 900; color: #222;}
.point-list,.work-list {}/*2312수정*/
.point-list li {font-size: 18px; line-height: 1.8; color: #222; text-align: left;}
.point-list li:before {content:'\2714'; color: #aaa; margin-right: 10px;}
.point-title {display:flex; align-items: center; margin-bottom: 15px;}
.work-title {margin-bottom: 10px;}
.point-title img,.work-title img {width: 32px; margin-right: 10px;	}
.point-title h3 {margin-bottom: 0;}
.work-list li{font-size: 18px; line-height: 2; color: #222;}
.work-title h4 {font-size: 18px; color: #333; margin-bottom: 10px; font-weight: 400; position: relative; left: 20px;}
.work-title h4:before {content:'\2714'; color: #416fdf; margin-right: 10px; margin-left: -30px;}


/*청솔세무회계 페이지*/
.introduce-text {text-align: left;}
h4.introduce-text {font-size: 22px; line-height: 1.7; }
h5.introduce-text {font-size: 20px;}
.introduce-text p {font-size: 17px; line-height: 1.8; color: #333; font-weight: 300;}
.introduce-img {width: 100px; margin-bottom: 20px;}
.introduce-img img {width: 100%;}
.modal-body .card-body {min-width: 800px;}
.owner-title {font-size: 20px; font-family: 'Chosunilbo_myungjo'; color: #111;}
.owner-profile {text-align: left; margin: auto;}
.subway h5 {font-size: 16px; color: #444;}
.subway {margin: 20px 0;}
.search-subway {font-weight: 600; font-size: 16px; color: #222; margin: 5px 0;}
.search-subway i {font-size: 15px; margin-right: 5px;color: #555;}
.subway-line {border-radius: 20px; padding: 3px; font-size:12px; color: #fff; min-width:20px; display: inline-block; text-align: center; height:20px;}
.subway-line.line7 {background-color: darkolivegreen}
.subway-line.linesl{background-color: #605b7d; padding: 3px 10px}
.subway-list {margin: 10px 0;}
.section-title {margin: 0px auto; font-size: 28px; text-align: center;}
.section-title-min {font-size: 24px;}
.point-item {margin: 30px 0 50px; padding: 30px 20px;}
.point-item-image img {width: 80%;}
.point-text {display: flex; flex-direction: column; justify-content: center;}
.work-img {text-align: left;}
.work-img img{width: 120px;}
.owner-title {font-size: 20px; font-family: 'Chosunilbo_myungjo'; color: #111;}
.owner-profile {width: 550px; text-align: left; margin: auto;}
.search-address {font-size: 18px;}

/*내용페이지 헤더*/
.banner-area {background-color: #196dff; padding: 8px;}
.banner-area .banner-heading h2 {color: #fff; font-size: 20px;}

/*내용페이지-프로그레스바*/
.progress-step {counter-reset: step;}
.progress-step li {list-style: none; display: inline-block; width: 24%; position: relative; text-align: center; cursor: pointer;}
.progress-step li:before {content: counter(step);  counter-increment: step; width: 40px; height: 40px; line-height : 40px; border: 1px solid #ddd; 
						  border-radius: 100%; display: block; text-align: center; margin: 0 auto 10px auto; background-color: #fff;}
.progress-step li:after {content: ""; position: absolute; width: 100%; height: 2px; background-color: #ddd; top: 20px; left: -50%; z-index : -1;}
.progress-step li:first-child:after {content: none;}
.progress-step li.active {color: #333;}
.progress-step li.active p {font-weight: bold;}
.progress-step li.active:before {background-color: #333; color: #fff; border-color: #333;} 
.progress-step li.active + li:after {background-color: #333;}

/*내용페이지-게시판 셀렉*/
.serv-body {width: 100%;}
.service-borad .table4 td{color: #222; cursor: pointer}
.service-borad-write .table4 td {padding: 5px 0;}
.service-borad-list {display:flex; flex-wrap: wrap;}
.service-borad-item {width: 100%; display:flex; align-items: center; margin: 5px 0;}
.service-borad-item h6 {min-width: 140px; text-align: left; padding: 0 10px}
.service-borad-content {display:flex; align-items: center}	
.service-borad-content .service-borad-item2 {width:10%;}
.service-borad-item h6.imp:after {content:' *'; color: #ff3b59;}

/*내용페이지-회원가입 프로그레스바*/
.join-progress-step {counter-reset: step;  display: flex; justify-content: space-between; align-items: stretch;}
.join-progress-step li {display: inline-block; width: 32%; position: relative; text-align: left; border: 1px solid #eee; background-color: #eee; padding: 8px 24px;}
.join-progress-step li:after {content:'';display: block; position: absolute; width: 12px; height: 12px; background: #ccc;clip-path: polygon(30% 0, 30% 100%, 100% 50%); top: 50%; right: -16px;}
.join-progress-step li:last-child:after {display: none;}
.join-progress-step li .step-text-s {font-size: 13px; line-height: 2; color: #bbb;}
.join-progress-step li .step-text {font-size: 18px;  line-height: 1.5; font-weight: 700; color: #aaa;}
.join-progress-step li.active {background: #007bff; }
.join-progress-step li.active:after {background: #888}
.join-progress-step li.active .step-text-s {color: #FFFFFFa0;}
.join-progress-step li.active .step-text {color: #fff;}

/*이용약관*/
.scroll-cont {overflow-x: scroll; max-width: 1140px;}
.hpx-160 {height: 160px;}
.chk-radio:checked + label {color: #111; font-weight: bold}

/*내부 페이지 테이블타입5 (약관동의)*/
.table5 {width: 100%; border-top: 2px solid #222}
.table5 :is(th,td) {border-bottom: 1px solid #aaa;}
.table5 th { font-weight: 700; padding: 8px 12px; }
.table5 td { padding: 8px; color: #444; font-size: 14px; line-height: 1.5; font-weight: 200;}
.table5 td a {color: #111;}
.table5 th.imp:after {content:' *'; color: #ff3b59;}

/*항목추가 테이블*/
.add-table-wrap {margin-top: 16px; display: flex; background-color: #f5f5f5; align-items: center;}
.add-table {display: flex; padding: 6px; align-items: center;}
.add-table h6 {padding: 0 14px;}
.add-check {padding: 4px 16px;}
.add-table .form-control {zoom: 0.8; width: 160px;}