.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-remote {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px; /* 아이콘과 텍스트 사이 간격 */
    padding: 3px 6px;
    font-size: 16px;
    font-weight: bold;
    color: #fff !important; /* 기본 배경색 강제 적용 */
    background-color: #00a1cd !important; /* 기본 배경색 강제 적용 */
    border: 1px solid #00a1cd;
    border-radius: 5px; /* 둥근 모서리 */
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
    
    background-size: 20px 20px; /* 이미지 크기 조정 */
    width: 31px ;
    min-width: 31px ;  
}

.btn-remote:hover {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px; /* 아이콘과 텍스트 사이 간격 */
    padding: 3px 6px;
    font-size: 16px;
    font-weight: bold;
    color: #fff !important; /* 기본 배경색 강제 적용 */
    background-color: #007aa8 !important; /* 기본 배경색 강제 적용 */
    border: 1px solid #007aa8;
    border-radius: 5px; /* 둥근 모서리 */
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
    
    background-size: 20px 20px; /* 이미지 크기 조정 */
    width: 31px ;
    min-width: 31px ;  
    transform: translateY(-1px); /* 살짝 위로 올라감 */
}


.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 {width: 150px; 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;}

/*내부 페이지 테이블타입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-auto {padding: 0; height: calc(100vh - 289px); overflow-x: scroll; position: relative;}
.card-body-auto2 {padding: 0; height: calc(100vh - 324px); 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 tr:hover td {background-color: #f5f5f5;}
.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: 10px 0 10px 0;}
.table-caption h5 {font-size: 16px;}

/*내부 페이지 타이틀부*/
.menu-area {width: 100%; padding: 5px 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: 10px; font-weight: 400; font-size: 18px;}
.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;}

/*게시판 내용부*/
.board-contents .table4 tr:hover td {background-color: #fff;}
.board-contents .board-date { border-bottom: none; padding-bottom: 0; font-size: 13px; font-weight: 300; text-align: left;}
.board-contents .board-title {color: #222; font-size: 20px; text-align: left; line-height: 1.2;}
.board-contents .board-title input::placeholder {color: #bbb;}
.board-time {font-size: 13px;}
.board-contents .board-cotain>div{min-height: 100px;}
.board-contents .board-data,.board-contents .board-data-upload {border: 0; width: 100%; min-height: 100px; max-height: 200px; overflow: auto; padding: 15px 20px; box-sizing: border-box; text-align: left;}
.board-contents .board-data {border: 1px dashed #aaa;}
.board-contents .board-data-upload { background-color: #f0f0f0;}
.board-contents .board-data li {padding : 4px 0;}
.board-contents .board-data li a:hover {color: #999; transition: 0.5s;}
.board-contents .board-data-title {vertical-align: middle; color: #222; font-weight: bold; border-bottom: 0; padding-bottom: 0; text-align: left; font-size: 16px; border-top: 1px dotted #ccc;}

/*문의게시판*/
.board-contents .board-answer{ border-bottom: none; padding-bottom: 0; font-size: 15px; font-weight: 700; text-align: left;}
.answer-modal {width: 1000px;}

/*서비스 상담 게시판*/
.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: 33.3333%; display:flex; align-items: center; margin: 5px 0;}
.service-borad-item h6 {width: 100px; text-align: left; padding: 0 10px}
.service-borad-content {display:flex; align-items: center}	
.service-borad-content .service-borad-item2 {width:10%;}

/*바로회계 페이지*/
section.solid-bg {background-color: #f7f7f7}
section.bg-sky {background-color: #f6fcff}
section.blue-bg {background-color: #007bff}
.banner-area {height: 300px; display: flex; justify-content: flex-start; align-items: center; padding-left: 20%; background-position: center; background-size: auto; background-repeat: no-repeat;}
.banner-area.page01 {background-image: url(../images/banner/banner1.jpg); } 
.banner-area.page02 {background-image: url(../images/banner/banner2.jpg); }
.banner-area.page03 {height: 100px;  background-color: #416fdf;}
.banner-area.page03 h2 { color: #fff;}
.banner-area .banner-details, .banner-title-text {margin-top:20px;}
.banner-area .banner-details li, .banner-title-text { font-size: 16px; line-height: 2; color: #fff; font-weight: 400;} /*2312수정*/
.banner-area .banner-details li:before {content:'\2714'; color: #63a7ff; margin-right: 10px;} /*2312수정*/

.banner-area .banner-title {font-size: 36px;}
.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;}

.good-point {margin-top: 40px;}
.good-point ul{display: flex; flex-wrap: wrap;}
.good-point ul li {width: 50%; padding: 10px; margin-bottom: 40px;}
.good-point ul li h5 {font-size: 18px; line-height: 2;}
.good-point ul li p {line-height:1.5; font-size: 15px;}
.good-point ul li p:before{content:"\f058"; color: #333; margin-right: 5px; }
.good-point ul li img {width: 100px; margin-bottom: 10px;}

.system-view-item {margin: 3% 0 5%; padding: 5%;}
.system-view-item img {width: 95%; border-radius: 10px; box-shadow: 0 0 10px 4px rgba(150,150,150,0.2)}
.system-view-item h6 {color: #999; margin: 20px 0 10px;}
.system-view-item p {margin: 10px 0; font-size: 18px; font-weight: 600;  width: fit-content; color: #444; line-height: 1.5; letter-spacing: -0.5px; position: relative; left: 10px;}
.system-view-item p:before {content: '\2714'; color: #007bff; margin-right: 10px; margin-left: -23px;}

section.btn-section {padding: 80px 0;}
.btn-section .row div {display: flex; align-items: center; flex-direction: column; justify-content: space-between;}
.btn-section .row div p {font-size: 20px; color: #fff; margin-bottom: 15px; line-height: 1.5;}
.btn-section .row div .btn {font-size: 24px; font-weight: 400;}

/*청솔세무회계 페이지*/
.introduce-text {text-align: center;}
h4.introduce-text {font-size: 22px; line-height: 1.7; font-family: 'Chosunilbo_myungjo'; }
h5.introduce-text {font-size: 20px;}
.introduce-text p {font-size: 17px; line-height: 1.6; color: #333; font-weight: 300; /*font-family: 'Chosunilbo_myungjo';*/	}
.introduce-img {width: 100px; margin-bottom: 20px;}
.introduce-img img {width: 100%;}
.modal-body .card-body {min-width: 800px;}


/*23.12.추가부분*/
.section-title {margin: 30px auto; font-size: 36px; text-align: center;}
.section-title-min {font-size: 24px;}
.point-item {margin: 30px 0 50px; padding: 30px 20px; /*box-shadow: 0 4px 10px 3px rgb(100 120 150 / 5%); background-color: #fff;*/}
.banner-title {color: #fff;}
.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;}
.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;}