@import url('sub.css'); 

/* 예약 안내 */
.basic_cont:has(.reservation_cont) {width: 100%; max-width: 100%; margin-bottom: 0;}

.reservation_top {display: flex;}
.reservation_top .txtbox {flex: 1; padding: 80px; border-radius: var(--borderR20); border: 1px solid var(--border);}
.reservation_top .contact {display: flex; flex-direction: column; gap: 8px; margin-bottom: 30px; position: relative; padding-right: 90px;}
.reservation_top .contact::after {content: ''; position: absolute; top: 5px; right: 0; width: 82px; aspect-ratio: 82 / 78; background: url('/info/img/contact.svg') center / cover no-repeat; opacity: 0.5;}
.reservation_top .contact dd {display: flex; gap: 7px; align-items: center;}
.reservation_top .contact dd::before {font-size: 32px; content: '\e61d';}
.reservation_top .hour {margin-bottom: 30px;}
.reservation_top .hour .hour_top {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 8px; flex-wrap: wrap; gap: 5px 10px;}
.reservation_top .hour .hour_table {width: 100%; border-collapse:separate; border-spacing:0; border-top:2px solid var(--main); text-align:center;}
.reservation_top .hour .hour_table thead th,
.reservation_top .hour .hour_table tbody td,
.reservation_top .hour .hour_table tbody th {padding: 12px 10px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);}
.reservation_top .contact_btn {gap: 2px;}
.reservation_top .contact_btn a {display: flex; gap: 8px; align-items: center; justify-content: center; padding: 14px 10px; border-radius: 5px; border: 1px solid;}

.reservation_top .contact_btn a .contact_btn_icon {position: relative; display: flex;}
.reservation_top .contact_btn a .contact_btn_icon img {transition: all 0.7s cubic-bezier(0.215,0.61,0.355,1);}
.reservation_top .contact_btn a:not(.kakao) .contact_btn_icon img:last-child {opacity: 0; position: absolute; left: 0; top: 0;}

.reservation_top .contact_btn a.call {background-color: var(--main); border-color: var(--main);}
.reservation_top .contact_btn a.naver {background-color: #00BD60; border-color: #00BD60;}
.reservation_top .contact_btn a.kakao {background-color: #FEDA0D; color: #3C1F1E; border-color: #FEDA0D;}

.reservation_top .contact_btn a:hover {background: var(--white) !important;}
.reservation_top .contact_btn a.call:hover {color: var(--main); border-color: var(--main);}
.reservation_top .contact_btn a.naver:hover {color: #00BD60; border-color: #00BD60;}
.reservation_top .contact_btn a.kakao:hover {border-color: #3C1F1E;}

.reservation_top .contact_btn a:not(.kakao):hover .contact_btn_icon img:last-child {opacity: 1;}
.reservation_top .contact_btn a:not(.kakao):hover .contact_btn_icon img:first-child {opacity: 0;}


.reservation_top .imgbox {width: 45%; max-width: 620px; flex-shrink: 0; border-radius: var(--borderR20); overflow: hidden;}
.reservation_top .imgbox img {width: 100%; height: 100%; object-fit: cover;}

.reservation_detail article+article {margin-top: 30px;}
.reservation_detail article {display: flex; align-items: center;}
.reservation_detail article .imgbox {width: 50%; max-width: 750px; flex-shrink: 0;}
.reservation_detail article .imgbox img {width: 100%; height: auto; border-radius: var(--borderR280) var(--borderR20) var(--borderR280) var(--borderR20);}
.reservation_detail article .txtbox {flex: 1; padding-left: 80px;}
.reservation_detail article .txtbox h4 {margin-bottom: 30px;}
.reservation_detail article ol {display: flex; flex-direction: column; gap: 12px; counter-reset: li;}
.reservation_detail article ol li {counter-increment: li; position: relative; padding-left: 38px;}
.reservation_detail article ol li span.black {text-decoration: underline;}
.reservation_detail article ol li::before {content: '0'counter(li); position: absolute; left: 0; top: 0; font-size: 1rem; font-weight: 500; color: var(--white); background: var(--main); border-radius: 50%; width: 28px; aspect-ratio: 1/1; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-family: var(--eng);}

.reservation_detail article:last-of-type {flex-direction: row-reverse;}
.reservation_detail article:last-of-type .txtbox {padding-left: 0; padding-right: 80px;}
.reservation_detail article:last-of-type .imgbox img {border-radius: var(--borderR20) var(--borderR280) var(--borderR20) var(--borderR280);}


/* 지원 사업 / 보험 / 서류 발급 안내 */
.basic_cont:has(.business_cont) {width: 100%; max-width: 100%; margin-bottom: 0;}

.reservation_top.business_top {padding-bottom: 150px;}
.reservation_top.business_top h4 {margin-bottom: 8px;}
.reservation_top.business_top .txtbox {border: 0; background: var(--grayBg);}
.business_top ul {display: flex; flex-direction: column; gap: 6px;}
.business_top ul li {position: relative; padding-left: 12px;}
.business_top ul li::before {content: ''; position: absolute; left: 0; top: 13px; width: 3px; aspect-ratio: 1/1; background: var(--main);}

.business_top ul li dl {display: flex; flex-wrap: wrap; gap: 10px;}
.business_top ul li dt {min-width: 172px;}
.business_top ul li dd {flex: 1; display: flex; gap: 5px 10px; flex-wrap: wrap;}
.business_top ul li dd > a {display: flex; gap: 5px; align-items: center;}
.business_top ul li dd > a::before {width: 28px; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; background: rgba(196, 211, 178, 0.3); border-radius: 5px; content: '\e61d'; color: var(--main); flex-shrink: 0; font-size: 20px;}
.business_top ul li dd > a.site::before {content: '\e88a';}

.business_top ul li:last-child dt {width: 100%;}
.business_top ul li:last-child dd {width: 100%; flex: auto; display: block; padding-top: 40px;}
.business_top ul li:last-child dd a {background: var(--white); border: 1px solid var(--border);}
.business_top ul li:last-child dd a img {max-width: 100%;}
.business_top ul li:last-child dd a:hover {border-color: var(--black);}

.business_list > li {padding: 50px 50px 160px 50px; border-radius: var(--borderR20); border: 1px solid var(--border); position: relative;}
.business_list > li h4 {margin-bottom: 20px;}
.business_list > li .iconbox {position: absolute; right: 50px; bottom: 40px;}
.business_list > li .dot_list {display: flex; flex-direction: column; gap: 6px;}

.certi_in {display: flex; flex-direction: column; gap: 50px;}
.certi_list {counter-reset: certi;}
.certi_list li {counter-increment: certi; display: flex; padding: 50px 20px; flex-direction: column; align-items: center; gap: 20px; border-radius: var(--borderR20); background: var(--white); position: relative; text-align: center;}
.certi_list li::before {content: '0'counter(certi); display: flex; width: 28px; height: 28px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 50%; background: var(--sub); color: var(--white); font-family: var(--eng); font-size: 1rem; font-weight: 500; line-height: 166.667%;}
.certi_list li:not(:last-child)::after {position: absolute; content: ''; top: 50%; right: 0; transform: translate(50%, -50%); width: 23px;  background: var(--border); aspect-ratio: 23/15; background: url('/info/img/certi_arrow.svg') center / cover no-repeat;}

.certi_article {display: flex; align-items: flex-start; gap: 30px;}
.certi_article h3 {flex-shrink: 0; width: 230px;}
.certi_article .cont {flex: 1;}
.certi_article .cont > small {display: block; margin-bottom: 10px;}
.certi_article .cont .common_table_wrap {margin-bottom: 30px;}
.certi_article .cont .common_table th,
.certi_article .cont .common_table td {word-break: break-all;}

.certi_article .cont .dot_list {position: relative; padding-right: 280px; gap: 6px; display: flex; flex-direction: column;}
.certi_article .cont .dot_list::after {content: ''; position: absolute; top: 26px; right: 72px; width: 193px; aspect-ratio: 193/229; background: url('/info/img/certi_deco.svg') center / cover no-repeat;}


/* 비급여 비용 안내 */
.nonpayment_cont .nonpayment_table {margin-top: 10px;}
.nonpayment_cont .nonpayment_table .nonpayment_table_img {width: 100%; height: auto; border-radius: 10px 10px 0 0;}


/*******************************************************************************
    @media ~1700px
*******************************************************************************/
@media all and (max-width:1700px){
/* 지원 사업 / 보험 / 서류 발급 안내 */
.business_list > li br {display: none;}

}

/*******************************************************************************
    @media ~1500px
*******************************************************************************/
@media all and (max-width:1500px){
}

/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){
/* 예약 안내 */
.reservation_top .txtbox {padding: 50px;}
.reservation_top .contact {padding-right: 80px;}
.reservation_top .contact dd {font-size: 1.6rem;}
.reservation_top .contact::after {width: 70px;}
.reservation_top .contact_btn a {font-size: 17px;}
.reservation_top .contact_btn a.call img {width: 26px;}
.reservation_top .contact_btn a.naver img {width: 16px;}
.reservation_top .contact_btn a.kakao img {width: 22px;}

.reservation_detail article {align-items: flex-start;}
.reservation_detail article .txtbox {padding-left: 50px;}
.reservation_detail article:last-of-type .txtbox {padding-right: 50px;}

/* 지원 사업 / 보험 / 서류 발급 안내 */
.business_top ul li dl {flex-wrap: wrap;}
.business_top ul li dt {width: 100%;}
.business_top ul li dd {flex: auto; width: 100%;}

.business_list {gap: 15px;}
.business_list > li {padding: 35px 35px 130px 35px;}
.business_list > li .iconbox {right: 35px; bottom: 30px;}
.business_list > li .iconbox img {width: 80px; height: auto;}

.certi_list {gap: 15px;}
.certi_list li {padding: 40px 20px;}
.certi_list li:not(:last-child)::after {width: 20px;}

.certi_article h3 {width: 180px;}
.certi_article .cont .dot_list {padding-right: 210px; gap: 3px;}
.certi_article .cont .dot_list::after {width: 150px; right: 30px;}
}

/*******************************************************************************
    @media ~980px
*******************************************************************************/
@media all and (max-width:980px){
/* 예약 안내 */
.reservation_top {flex-direction: column;}
.reservation_top .imgbox {width: 100%; max-width: 100%;}
.reservation_top .txtbox {padding: 35px;}
.reservation_top .contact {gap: 5px; padding-right: 70px;}
.reservation_top .contact dd::before {font-size: 28px;}
.reservation_top .contact::after {width: 60px;}
.reservation_top .hour .hour_top {margin-bottom: 5px; gap: 2px 10px;}

.reservation_detail br {display: none;}
.reservation_detail article {flex-direction: column !important;}
.reservation_detail article .imgbox {width: 100%; max-width: 100%;}
.reservation_detail article .txtbox {padding-left: 0; padding-top: 15px; flex: auto; width: 100%;}
.reservation_detail article .txtbox h4 {margin-bottom: 15px; font-size: 1.6rem;}
.reservation_detail article:last-of-type .txtbox {padding-right: 0;}
.reservation_detail article ol {gap: 9px;}
.reservation_detail article ol li::before {width: 26px;}
.reservation_detail article ol li {padding-left: 34px;}

/* 지원 사업 / 보험 / 서류 발급 안내 */
.reservation_top.business_top {padding-bottom: 100px;}
.business_top ul li dd > a::before {width: 26px; font-size: 18px;}
.business_top ul li dl {gap: 5px;}
.business_top ul li::before {top: 12px;}
.business_top ul li:last-child dd {padding-top: 30px;}
.business_top ul li:last-child dd a {padding: 10px;}

.business_list {gap: 10px; grid-template-columns: repeat(2, 1fr);}
.business_list > li {padding: 25px 25px 115px 25px;}
.business_list > li h4 {font-size: 1.3rem; margin-bottom: 10px;}
.business_list > li .dot_list {gap: 3px;}
.business_list > li .iconbox {bottom: 20px; right: 25px;;}
.business_list > li .iconbox img {width: 70px;}

.certi_list {gap: 10px;}
.certi_list li {padding: 30px 15px; gap: 15px;}
.certi_list li::before {width: 26px; height: 26px;}
.certi_list li:not(:last-child)::after {width: 18px;}
.certi_list li .iconbox img {height: 75px; width: auto; max-width: 100%;}

.certi_article {display: block;}
.certi_article h3 {width: 100%; margin-bottom: 15px;}
.certi_article .cont > small {margin-bottom: 5px;}
.certi_article .cont .common_table_wrap {margin-bottom: 20px;}
.certi_article .cont .dot_list {padding-right: 150px;}
.certi_article .cont .dot_list::after {width: 120px; top: 0; right: 0;}

/* 비급여 비용 안내 */
.nonpayment_cont .nonpayment_table {overflow-x: auto; position: relative;}
.nonpayment_cont .nonpayment_table .responsive-dim.show {display: block;}
.nonpayment_cont .nonpayment_table .responsive-dim p {top: 130px; transform: none;}
.nonpayment_cont .nonpayment_table .nonpayment_table_img {width: 980px;}
}

/*******************************************************************************
    @media ~680px
*******************************************************************************/
@media all and (max-width:680px){
/* 예약 안내 */
.reservation_top .txtbox {padding: 25px;}
.reservation_top .contact {padding-right: 60px; margin-bottom: 20px;}
.reservation_top .contact dd {font-size: 1.5rem;}
.reservation_top .contact dd::before {font-size: 24px;}
.reservation_top .contact::after {width: 50px;}
.reservation_top .hour {margin-bottom: 20px;}
.reservation_top .contact_btn {grid-template-columns: 1fr;}
.reservation_top .contact_btn a {padding: 8px;}
.reservation_top .contact_btn a.call img {width: 22px;}
.reservation_top .contact_btn a.naver img {width: 14px;}
.reservation_top .contact_btn a.kakao img {width: 18px;}

.reservation_detail article ol {gap: 7px;}
.reservation_detail article ol li {padding-left: 30px;}
.reservation_detail article ol li::before {width: 23px;}


/* 지원 사업 / 보험 / 서류 발급 안내 */
.reservation_top.business_top {padding-bottom: 50px;}
.business_top ul li {padding-left: 10px;}
.business_top ul li::before {top: 9px;}
.business_top ul li:last-child dd {padding-top: 20px;}
.business_top ul li dd > a::before {font-size: 16px; width: 24px;}

.business_list {grid-template-columns: 1fr;}
.business_list > li {padding: 20px 20px 95px 20px;}
.business_list > li span {line-height: inherit;}
.business_list > li .iconbox {right: 20px; bottom: 20px;}
.business_list > li .iconbox img {width: 60px;}

.certi_list li {padding: 20px 10px;}
.certi_list li::before {width: 23px; height: 23px;}
.certi_list li:not(:last-child)::after {width: 15px;}
.certi_list li .iconbox img {height: 60px;}

.certi_article h3 {margin-bottom: 10px;}
.certi_article .cont .dot_list {padding-right: 0;}
.certi_article .cont .dot_list::after {display: none;}

.certi_article .cont .common_table_wrap {overflow-x: auto; position: relative;}
.certi_article .cont .common_table_wrap .responsive-dim.show {display: block;}
.certi_article .cont .common_table_wrap .common_table {width: 680px;}

/* 비급여 비용 안내 */
.nonpayment_cont .nonpayment_table .nonpayment_table_img {width: 800px;}
}