/*sub 공통*/
.sector_title {padding-left: 16px; position: relative}
.sector_title::before {content: ''; display: block; width: 8px; height: 20px; background: var(--key-color); border-radius: 0 5px 0 5px; position: absolute; left: 0; top: 3px}

.sub_list {min-height: 900px}

/*나의 진료정보*/

/*진료예약 최근수정일 25.05.13*/
/*진료예약 공통*/
.top_res_process {position: sticky; left: 0; top: 90px; background: #fff; z-index: 3}
.top_res_process .inner_container {position: relative}
.reservation_area {background: url(../img/sub/res_bg.png) no-repeat center / cover}
.reservation_area .inner_container {display: grid; grid-template-columns: calc(50% + 10px) calc(50% - 10px)}
.reservation_area .left_introduce {display: grid; grid-template-rows: 1fr auto}
.reservation_area .left_introduce .txt_top {padding-bottom:120px}
.reservation_area .left_introduce .txt_top .txt_wrap {position: sticky; left: 0; top: 250px}
.reservation_area .left_introduce .txt_bottom {position: sticky; left: 0; bottom: -300px; transition: all .4s;}
.reservation_area .left_introduce .txt_bottom.scrolled {bottom: 20px}
.reservation_area .right_apply_area {background: var(--white); min-height:1076px}
.reservation_area .right_apply_area > * {height: 100%}
.reservation_area .right_apply_area .inner {display: grid; grid-template-rows:auto 1fr auto; height: 100%}
.reservation_area .right_apply_area .inner.cont {padding-top:54px}
.reservation_area .right_apply_area .inner.cont_type2 {grid-template-rows: auto 1fr auto}

.reservation_area .head_process {position: sticky; z-index: 2; left: 0; top: 184px}
.reservation_area .head_process ul {background: var(--bg-gray4); display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 16px}
.reservation_area .head_process ul li {height: 54px; display: flex; align-items: center; justify-content: center; position: relative}
.reservation_area .head_process ul li.on {background: var(--key-color)}
.reservation_area .head_process ul li.on span {color:var(--white); font-weight: 700}
.reservation_area .head_process ul li::after {content: ''; display: block; width: 16px; height: 54px; background: url(../img/sub/apply_process_deco.svg) no-repeat center / cover; position: absolute; right: -16px}
.reservation_area .head_process ul li.on::after {background: url(../img/sub/apply_process_deco_active.svg) no-repeat center / cover}
.reservation_area .head_process ul li.on.on_before::after {background: url(../img/sub/apply_process_deco_active_before.svg) no-repeat center / cover; width: 18px; height: 56px; right: -17px}
.reservation_area .head_process ul li:last-child::after {display: none}

.reservation_area .right_apply_area .footer_butn {background: #F4F7FA; border-top: 1px solid var(--line2); display: flex; justify-content: space-between; position: sticky; left: 0; bottom: 0}
.reservation_area .right_apply_area .footer_butn.last {justify-content: flex-end}
.reservation_area .right_apply_area .footer_butn.single {justify-content: flex-end}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"] {margin:0}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"] input[type="button"],
.reservation_area .right_apply_area .footer_butn [class *="butn_style"] input[type="submit"] {text-indent: 0}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"]::before {-webkit-mask-image: url(../img/sub/icon_butn_prev.svg); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 16px; -webkit-mask-position: center; margin: 0}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"].prev::before {left: 15px; top: 50%; transform: translateY(-50%)}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"].next input {text-align: left; padding-left: 20px}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"].next::before {left: auto; right: 0; top: 50%; transform: rotate(180deg) translateY(-50%); transform-origin: -1px 0;}
.reservation_area .right_apply_area .footer_butn [class *="butn_style"].next::after {content:''; display: block; width: 1px; height: 10px; background: #3774B6; position: absolute; left: 51px; top: 50%; transform: translateY(-50%)}

/*진료예약 - 진료과 선택*/
.reservation_area .right_apply_area .part_list > ul{display: grid; grid-template-columns: repeat(4, 1fr)}
.reservation_area .right_apply_area .part_list > ul li {position: relative; text-align: center}
.reservation_area .right_apply_area .part_list > ul li input {position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0}
.reservation_area .right_apply_area .part_list > ul li input + label {font-size: 16px; cursor: pointer; display: flex; flex-direction: column; gap:10px 0; border: 1px solid transparent; transition: all .2s}
.reservation_area .right_apply_area .part_list > ul li input + label:hover,
.reservation_area .right_apply_area .part_list > ul li input:checked + label,
.reservation_area .right_apply_area .part_list > ul li input:focus-visible + label {background: #EAF4FF; border-radius: 20px; border: 1px dashed var(--mid-blue); box-shadow: 6px 6px 6px 0 rgba(117, 183, 255, 0.1)}
.reservation_area .right_apply_area .part_list > ul li img {width: 70px}

/*진료예약 - 날짜/시간 선택 (건강교실에서 재활용)*/
.select_schedule_area .calendar_head {display: flex; justify-content: center}
.select_schedule_area .calendar_head .inner {display: grid; grid-template-columns: 20px 1fr 20px; gap: 0 15px}
.select_schedule_area .calendar_head .inner * {align-self: center;}
.select_schedule_area .calendar_head .prev,
.select_schedule_area .calendar_head .next {width: 20px; height: 20px; cursor: pointer; position: relative; border:none; padding:0; background: none}
.select_schedule_area .calendar_head .prev::after,
.select_schedule_area .calendar_head .next::after {content: ''; display: block; width: 100%; height: 100%; background: #444; position: absolute; left: 0; top: 0}
.select_schedule_area .calendar_head .prev input,
.select_schedule_area .calendar_head .next input {width: 100%; height: 100%; background: transparent; border: none; font-size: 0}
.select_schedule_area .calendar_head .prev:hover::after,
.select_schedule_area .calendar_head .next:hover::after {background: var(--key-color2)}

.select_schedule_area .calendar_weekdays {display: grid; grid-template-columns: repeat(7, 1fr); background: #EBEFF2; border: 1px solid var(--line2)}
.select_schedule_area .calendar_weekdays .weekday {font-size: 14px; font-weight: 600; text-align: center; height: 58px; display: flex; align-items: center; justify-content: center; border-left: 1px solid var(--line2)}
.select_schedule_area .calendar_weekdays .weekday:first-child {border-left: none}

.select_schedule_area .calendar_days {position: relative}
.select_schedule_area .calendar_days .calendar_bg {display: grid; grid-template-columns: repeat(7, 1fr)}
.select_schedule_area .calendar_days .calendar_bg .day_bg {height: 58px; border-left: 1px solid var(--line2); border-bottom: 1px solid var(--line2)}
.select_schedule_area .calendar_days .calendar_bg .day_bg:nth-child(7n) {border-right: 1px solid var(--line2)}

.select_schedule_area .calendar_days_btn {display: grid; grid-template-columns: repeat(7, 1fr); position: absolute; left: 0; top: 0; width: 100%}
.select_schedule_area .calendar_days_btn .day {height: 58px; position: relative}
.select_schedule_area .calendar_days_btn .day .day_btn {position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0}
.select_schedule_area .calendar_days_btn .day .day_btn + label {width: calc(100% - 1px); height: calc(100% - 1px); border: none; background: none; cursor: pointer; transition: all .2s; margin-bottom: 1px; margin-left: 1px; display: flex; align-items: center; justify-content: center}
.select_schedule_area .calendar_days_btn .day .day_btn:focus-visible + label {border: 2px dashed var(--key-color2)}
.select_schedule_area .calendar_days_btn .day:nth-child(7n) .day_btn + label {width: calc(100% - 2px)}
.select_schedule_area .calendar_days_btn .day.allDay .day_btn + label {background: #D8EBFA}
.select_schedule_area .calendar_days_btn .day.am .day_btn + label {background: #FAE8D0}
.select_schedule_area .calendar_days_btn .day.pm .day_btn + label {background: #CEF1EB}
.select_schedule_area .calendar_days_btn .day.night .day_btn + label {background: #E5D6FD}
.select_schedule_area .calendar_days_btn .day:hover .day_btn + label,
.select_schedule_area .calendar_days_btn .day .day_btn:checked + label {background: var(--mid-blue); color: var(--white)}

.select_schedule_area .schedule_info {display: flex; justify-content: center; gap: 0 20px}
.select_schedule_area .schedule_info li {position: relative; padding-left: 22px}
.select_schedule_area .schedule_info li::before {content:''; width: 14px; height: 14px; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%)}
.select_schedule_area .schedule_info li:nth-child(1)::before {background: #D8EBFA}
.select_schedule_area .schedule_info li:nth-child(2)::before {background: #FAE8D0}
.select_schedule_area .schedule_info li:nth-child(3)::before {background: #CEF1EB}
.select_schedule_area .schedule_info li:nth-child(4)::before {background: #E5D6FD}


/*진료예약 - 내 정보 입력*/
.reservation_area .right_apply_area .top_line {width: 100%; height: 3px; background: var(--key-color)}

/* 진료예약 - 내 정보 입력 LDH 25.03.17 레이아웃 수정 */
.frame_calendar {width:100%;}
.chk_tab {width:calc(100% + 50px); background: var(--bg-gray4); transform: translateX(-25px)}
.chk_tab {display: flex}
.chk_tab li {flex-basis: 33.3333%; position:relative}
.chk_tab.col2 li {flex-basis: 50%}
.chk_tab li input {position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0}
.chk_tab li label {display:block; width: 100%; height: 50px; display: flex; justify-content: center; align-items: center; cursor:pointer; transition: all .2s; color:#999; border-bottom:1px solid var(--line2)}
.chk_tab li input:checked + label {background: #fff; border-bottom:none; border-left:1px solid var(--line2); border-right:1px solid var(--line2); color: var(--key-color)}
.chk_tab li input:focus + label,
.chk_tab li input:focus-visible + label{outline: 2px dashed var(--key-color2)}
.chk_tab li:first-child input:checked + label {border-left:none}
.chk_tab li:last-child input:checked + label {border-right:none}
.chk_tab li label:hover {color: var(--key-color)}

/* 진료예약 - 내 정보 입력 LDH 25.05.12 진료과 안내 추가 */
.part_res_info {border-radius: 5px; background: #EFF5FA}
.part_res_info .inner {border-radius: 5px; border: 1px solid #C2DBF2; background: var(--white); overflow: hidden}
.part_res_info .inner .title {padding: 7px 15px; background: linear-gradient(180deg, #D2E5F6, #C2DBF2)}

/* 진료예약 -LDH 25.05.19 상단 진료과 > 의료진 네비게이션 추가 */
.res_nav {background: var(--bg-gray4); border-radius: 5px; border:1px solid var(--line2)}
.res_nav p {color:#666}
.res_nav p span {display: inline-block; width:5px; height:10px; background: #666; vertical-align: middle; margin-bottom:3px;
  -webkit-mask-image: url(../img/common/bread_icon.svg);     
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: cover; font-size:0}

/*인터넷 증명서 발급*/
.internet_certi_link_wrap {display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 20px}
.internet_certi_link_wrap .item > p {height: 44px}

/*제증명/진단서, 의무기록, 의무영상 사본 안내*/
.cirti_process_wrap {display: flex; justify-content: space-between; align-items: center; position: relative}
.cirti_process_wrap::before {content: ''; display: block; width: 100%; height: 180px; background: #e9f5ff; z-index: 1; position: absolute; left: 0; top: 0; border-radius: 180px}
.cirti_process_wrap [class*="circle"] {position: relative; z-index: 2}
.cirti_process_wrap [class*="circle"] .item {width: 180px; height: 180px; background: var(--key-color2); border-radius: 50%; display: flex; flex-direction: column}
.cirti_process_wrap [class*="circle"] .item.color_1 {background: var(--icon)}
.cirti_process_wrap [class*="circle"] .item.color_2 {background: var(--mid-blue)}
.cirti_process_wrap [class*="circle"] .item.color_3 {background: #009FC6}
.cirti_process_wrap [class*="circle"] .item.color_4 {background: #08B39A}
.cirti_process_wrap [class*="circle"] .item.color_5 {background: #00B2C6}
.cirti_process_wrap .circle_long .item {width: 400px; border-radius: 180px} 
.cirti_process_wrap .circle_2 .inner {display: flex; justify-content: center; gap: 0 20px}
.cirti_process_wrap [class*="circle"] .item p {color: var(--white)}
.cirti_process_wrap .arrow {width: 161px; height: 10px; background: url(../img/sub/dot_line.svg) no-repeat center / cover; transform: translateY(-20px); position: relative; z-index: 2}
.cirti_process_wrap .arrow.style2 {width: 64px; background: url(../img/sub/dot_line_02.svg) no-repeat center / cover}
.cirti_process_wrap .arrow.style3 {width:338px; background: url(../img/sub/dot_line_03.svg) no-repeat center / cover}

.notion_box_icon {border: 1px solid var(--line2); display: flex; align-items: center; gap: 0 30px}

/*건강교실*/
.select_schedule_area.style2 .calendar_weekdays .weekday {background: var(--bg-gray4)}
.select_schedule_area.style2 .calendar_bg {border-left: 1px solid var(--line2); border-right: 1px solid var(--line2)}
.select_schedule_area.style2 .calendar_bg .day_bg {height: 100px; width: 100%}
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(1), 
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(8),
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(15),
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(22),
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(29) {border-left: none}
.select_schedule_area.style2 .calendar_bg .day_bg:nth-child(7n) {border-right: none; width: calc(100% + 1px)}
.select_schedule_area.style2 .calendar_days_btn {border-left: 1px solid var(--line2); border-right: 1px solid var(--line2)}
.select_schedule_area.style2 .calendar_days_btn .day {position: relative; height: 100px; width: 100%; display: block; transition: all .2s}
.select_schedule_area.style2 .calendar_days_btn .day.online {background: #D8EBFA; border-bottom: 1px solid var(--line2); border-left: 1px solid var(--line2)}
.select_schedule_area.style2 .calendar_days_btn .day.offline {background: #FAE8D0; border-bottom: 1px solid var(--line2); border-left: 1px solid var(--line2)}
.select_schedule_area.style2 .calendar_days_btn .day.lecture {background: #CEF1EB; border-bottom: 1px solid var(--line2); border-left: 1px solid var(--line2)}
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(1), 
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(8),
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(15),
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(22),
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(29) {border-left: none}
.select_schedule_area.style2 .calendar_days_btn .day:nth-child(7n) {border-right: none; width: calc(100% + 1px)}
.select_schedule_area.style2 .calendar_days_btn .day > * {position: relative; z-index: 2; display: block}
.select_schedule_area.style2 .calendar_days_btn .day .num {display: block}
.select_schedule_area.style2 .calendar_days_btn .day .shd {max-width: 80%; margin:0 auto; display: -webkit-box}
.select_schedule_area.style2 .calendar_days_btn .day:hover {background: var(--mid-blue)}
.select_schedule_area.style2 .calendar_days_btn .day:hover > * {color: var(--white)}
.select_schedule_area.style2 .schedule_info {gap: 0 40px}

.lecture_list {display: grid; grid-template-columns: repeat(2, calc((100% - 20px) / 2)); gap: 20px}
.lecture_list .item {border: 1px solid var(--line2); display: grid; grid-template-columns: 240px 1fr; gap: 0 25px; transition: all .2s}
.lecture_list .item:hover {background: rgba(76, 144, 218, 0.1); box-shadow: 0 0 0 2px var(--icon); border: 1px solid transparent}
.lecture_list .item:hover .txt h3 {color: var(--icon)}

/*건강교실 상세*/
.lecture_detail {border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 280px 1fr; gap: 0 35px; align-items: center}

.lecture_info_wrap *{font-size:16px!important; line-height:1.5!important; color:var(--black)!important}

/*의료진/진료과 (의료진 리스트 진료예약에서 재활용됨)*/

/*의료진 리스트*/
.team_list {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px}
.team_list .item {border: 1px dashed var(--line2); padding: 20px}
.team_list .item .inner {display: grid; grid-template-columns: 180px 1fr 115px}
.team_list .item .inner .profile {overflow: hidden}
.team_list .item .inner .profile img {border-radius: 10px}
.team_list .item .inner .doctor_info p {word-break: keep-all; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal; line-clamp: 2; -webkit-line-clamp: 2}
.team_list .item .inner .res_btn_wrap {align-self: center; display: flex; flex-direction: column-reverse; height: 100%; max-height:152px}
.team_list .item .inner .res_btn_wrap .res_btn {flex-shrink: 0; height: 32px; /*margin-bottom: 5px;*/ display: flex; align-items: center; justify-content: center; /*flex-direction: column;*/ line-height: 1.6; gap:0 4px}
.team_list .item .inner .res_btn_wrap *:not(.res_btn) {margin-bottom:5px; height: 100%; display: flex; justify-content: center; align-items: center}
.team_list .item .inner .res_btn_wrap .res_btn::before {content: ''; display: block; width: 21px; height: 21px; background: url(../img/sub/calender_illust.svg) no-repeat center / cover}
.team_list .item .inner ul.dot li {color: var(--key-color)}
.team_list .item .inner ul.dot li::before {background: var(--key-color)}

/*의료진 - 진료예약에 사용*/
.team_list.col1 {grid-template-columns: 100%; gap: 0; padding-bottom:15px}
.team_list.col1 .item {border-bottom: 1px solid var(--line2); border-top:none; border-left:none; border-right:none; padding: 20px 25px}
.team_list.col1 .item .inner {grid-template-columns: 140px 1fr 120px}
.team_list.col1 .item .inner .res_btn_wrap {height: auto}
.team_list.col1 .item .inner .res_btn_wrap > *{height: 32px;}

/*의료진 상세*/
.doctor_area {background: var(--white) url(../img/sub/doctor_detail_bg.png) no-repeat center / cover}
.doctor_area .doctor_detail_wrap {display: flex; gap: 0 10px;}
.doctor_area .doctor_detail_wrap .doctor_info {width: 680px; flex-shrink: 0; position: relative; z-index: 1}
.doctor_area .doctor_detail_wrap .doctor_info .d_subject {display: flex; gap: 0 20px}
.doctor_area .doctor_detail_wrap .doctor_info .d_subject > p:first-child {flex-shrink: 0}
.doctor_area .doctor_detail_wrap .doctor_info .d_subject > p:last-child {word-break: keep-all}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_head {display: flex; gap: 0 10px; align-items: center; justify-content: space-between}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_head #cal_btn {background: var(--icon); display: none}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table {border-top: 2px solid #4c4c4c}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table {width: 100%; border-spacing: 0; border-collapse: 0}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr td {height: 50px; border-bottom: 1px solid rgba(0,0,0,0.1); text-align: center; font-size: 16px; font-weight: 500}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr + tr td {font-weight: 400}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr + tr td:first-child {background: rgba(0,0,0,0.1)}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr td .marker {display: inline-block; position: relative}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr td .marker::before {content:''; display: inline-block; width: 16px; height: 16px; border-radius: 50%; background: var(--key-color); vertical-align: middle}
.doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_table table tr td .marker > span {padding-left: 5px}
.doctor_area .doctor_detail_wrap .doctor_info .news_link {transition:all .2s}
.doctor_area .doctor_detail_wrap .doctor_info .news_link:hover {color:var(--key-color); text-decoration:underline}

.doctor_area .doctor_detail_wrap .doctor_img {width: 680px; flex-shrink: 0}
.doctor_area .doctor_detail_wrap .doctor_img .inner {position: sticky; right: 0; top: calc(100% - 1158px); z-index: 2; width: 100%; height: 1158px}
.doctor_area .doctor_detail_wrap .doctor_img .inner img {width: 100%; height:100%; object-position: bottom; object-fit: cover}

.part_img_holder img {width:100%;}

/* LDH 25.04.11 : 의료진 상세 스케줄 추기 */
.doctor_schedule_area {background: var(--key-color)}
.doctor_schedule_wrap::after {content: ''; display: block; clear: both}
.doctor_schedule_wrap .month_wrap {width: 100px; height:136px; float: left; border-left: 1px solid rgba(255,255,255,0.5); border-top: 1px solid rgba(255,255,255,0.5); border-bottom: 1px solid rgba(255,255,255,0.5); position: relative; z-index:2}
.doctor_schedule_wrap .month_wrap h3,
.doctor_schedule_wrap .month_wrap h4 {color: var(--white)}
.doctor_schedule_wrap .month_wrap::before,
.doctor_schedule_wrap .month_wrap::after {content: ''; display: block; width: 1px; height: 100%; position: absolute; right: -1px; top: 0}
.doctor_schedule_wrap .month_wrap::before {background: var(--key-color)}
.doctor_schedule_wrap .month_wrap::after {background: rgba(255,255,255,0.5)}
.doctor_schedule_wrap .month_wrap button {background: var(--white); border: none; padding: 0; margin: 0; font-size: 0; color: inherit; cursor: pointer; width:24px; height:24px}
.doctor_schedule_wrap .month_wrap ul {display: flex; justify-content: center; gap: 0 10px}
.doctor_schedule_wrap .month_wrap ul li {position: relative}
.doctor_schedule_wrap .month_wrap ul li::after {content:''; display: block; width: 1px; height: 15px; background: var(--white); position: absolute; right: -6px; top: 5px}
.doctor_schedule_wrap .month_wrap ul li:last-child::after {display: none}
.doctor_schedule_wrap .month_wrap button.slick-disabled {opacity: .5}
.doctor_schedule_wrap .ds_slider {width: calc(100% - 100px); float: left}
.doctor_schedule_wrap .ds_slider table {border-collapse: collapse; border-spacing: 0; width: 100%}
.doctor_schedule_wrap .ds_slider table th,
.doctor_schedule_wrap .ds_slider table td {border: 1px solid rgba(255,255,255,.5); padding: 5px; text-align: center; height: 45px; color: var(--white); font-size: 14px; font-weight: 400}
.doctor_schedule_wrap .ds_slider table td span {display: block; width: 10px; height: 10px; background:#ffe97b; border-radius: 50%; font-size: 0; margin:0 auto}

.select_schedule_area .calendar_days_table table{width:100%; border-collapse: separate; border-spacing: 2px}
.select_schedule_area .calendar_days_table table th,
.select_schedule_area .calendar_days_table table td {text-align: center; height: 38px; font-size: 13px}
.select_schedule_area .calendar_days_table table .weekend {color:#aaa}

.select_schedule_area .calendar_days_table table td.allDay{background: #D0E9F0}
.select_schedule_area .calendar_days_table table td.morning{background: #D6E8AC}
.select_schedule_area .calendar_days_table table td.afternoon{background: #F8D4D4}

.select_schedule_area .schedule_info.type2 li::before {width: 12px; height: 12px}
.select_schedule_area .schedule_info.type2 li:nth-child(1)::before {background: #D0E9F0}
.select_schedule_area .schedule_info.type2 li:nth-child(2)::before {background: #D6E8AC}
.select_schedule_area .schedule_info.type2 li:nth-child(3)::before {background: #F8D4D4}

/* LDH 25.04.34 : 의료진 상세 진료과장 만나보기 */
.video_pop {position: fixed; width: 100%; height: 100%; z-index: 9999; left: 0; top: 0; transition: all .3s; visibility: hidden; opacity: 0}
.video_pop .pop_bg {position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.5); z-index: 1}
.video_pop .pop_wrap {position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); z-index: 9999}
.video_pop .pop_wrap .close {position: absolute; display: block; right: 0; top: 8px; width: 24px; height: 24px; background: var(--white); transition: all .2s}
.video_pop .pop_wrap .close:hover {background: var(--key-color)}
.video_pop .pop_wrap {max-width: 1200px; width: 90%}
.video_pop.open {visibility: visible; opacity: 1}

.video_pop_scroll_area {max-height: 50vh; overflow-y: auto}
.video_pop .pop_wrap.detail.wide .pop_scroll_area {min-height: 450px}

.video_pop #video-pop {position: relative; padding-bottom: 56.22%; box-shadow: 0 0 5px 0 rgba(0,0,0,0.4)}
.video_pop iframe {display: block; position: absolute; left: 0; top: 0}

.video_pop .pop_scroll_area {max-height: 100vh; overflow-y: auto; padding: 40px 0; position: relative}

.video_pop .close.mo_only {position: absolute; display: block; right: 10px; top: 10px; width: 24px; height: 24px; background: var(--white); transition: all .2s; z-index: 2;}


/*LDH 25.03.22 : 의료진 검색 리스트 (질환백과에서 재사용)*/
.part_sch_wrap {display:grid; grid-template-columns: 1fr 44px 44px; gap: 0 10px; align-items: center}
.part_sch_list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px}
.part_sch_list li {border:1px solid var(--line2)}
.part_sch_list li a {display:block; width:100%; height:100%; transition: all .2s}
.part_sch_list li a:hover, 
.part_sch_list li a.on {background: var(--key-color2); color:#fff}
.part_sch_list.grid6 {grid-template-columns: repeat(6, 1fr)}

.part_doc_wrap {display:grid; grid-template-rows: auto minmax(auto, 930px)}
.part_doc_wrap .part_doc_list {background: var(--bg-gray4)}
.part_doc_wrap .part_doc_list .team_list {max-height:100%; overflow-y:auto; grid-template-columns: 100%}
.part_doc_wrap .part_doc_list .team_list .item {background:var(--white)}
.part_doc_wrap .part_doc_list .team_list .item .inner {grid-template-columns: 130px 1fr 100px}



/*센터·클리닉 소개(마이페이지에서 재활용)*/
.center_wrap {display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px}
.center_wrap .item {border: 1px dashed var(--line2); transition: all .2s}
.center_wrap .item:hover {background: rgba(76, 144, 218, 0.1); box-shadow: 0 0 0 2px var(--icon); border: 1px solid transparent}
.center_wrap .item:hover > p + p {color: var(--icon); font-weight: 700}
.center_wrap .item:hover ul li a {background: var(--icon); color: var(--white)}
.center_wrap .item:hover ul li a::before {background: var(--white)}
.center_wrap .item:hover ul li a:hover {background: var(--key-color)}
.center_wrap .item img {width: 70px}

.map_box {border: 1px dashed var(--line2)}

/* LDH 25.04.22  센터·클리닉 소개 진료협력센터 진료의뢰 상세설명 보기 팝업 내용*/
.convention_process {display: grid; grid-template-columns: repeat(6, 1fr); gap: 0 10px}
.convention_process > li {border: 1px solid var(--line2); display: flex; align-items: center; justify-content: center; border-radius: 5px; position: relative}
.convention_process > li::after {content: ''; display: block; width: 6px; height: 11px; background: var(--key-color); position: absolute; right: -9px; top: 50%; transform: translateY(-50%); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: cover; -webkit-mask-image: url(../img/common/arrow_icon.png)}
.convention_process > li:last-child::after {display: none}
.convention_process > li.gray {background: #586172; color: var(--white); text-align: center}
.convention_process > li.gray ul li {text-align: left}
.convention_process > li.blue {background: #389def; color: var(--white); text-align: center}
.convention_process > li.blue ul li {text-align: left}
.convention_process > li > ul {position: absolute; left: 0; bottom: -80px; width: 100%}
.convention_process > li > ul li {color:var(--font)}
.convention_process.grid5 {grid-template-columns: repeat(5, 1fr)}

.cooperation_sort ul {display: flex; gap:0 5px}
.cooperation_sort ul li {width: calc((100% - (5px * 15)) / 16);}
.cooperation_sort ul li span {border:1px solid var(--line2); display: block; text-align: center; font-size: 15px; cursor:pointer; padding: 10px 0; color: var(--key-color); transition: .3s}
.cooperation_sort ul li span:hover,
.cooperation_sort ul li.on span  {background: var(--key-color); color: var(--white)}

.cooperation_table table {table-layout: fixed}
.cooperation_table table th,
.cooperation_table table td {width: 33.33%;  overflow-wrap: break-word; word-break: break-word; white-space: normal}

/*고객이용안내*/

/* 찾아오시는 길 */
.map_wrap .root_daum_roughmap .wrap_map {height: calc(100% - 32px)}

.inter_wrap {border: 1px solid var(--line2); display: grid; grid-template-columns: repeat(3, 1fr)}
.inter_wrap > .col {border-right: 1px solid var(--line2)}
.inter_wrap > .col:last-child {border-right: none}
.inter_wrap > .col.row2 {display: grid; grid-template-rows: repeat(2, 1fr)}
.inter_wrap > .col.row2 .item + .item {border-top: 1px solid var(--line2)}
.inter_wrap > .col .item {min-height: 220px}
.inter_wrap > .col .item.auto_h {min-height: auto}

.inter_wrap.col2 {grid-template-columns: repeat(2, 1fr)}

.inter_mark {display: flex; gap: 0 10px; align-items: center}
.inter_mark::before {content: ''; display: block; width: 40px; height: 40px; border-radius: 50%; background-color: var(--line3); background-position: center; background-repeat: no-repeat}

.inter_mark.metro::before {background-image: url(../img/sub/icon_metro.svg)}
.inter_mark.bus::before {background: #2BC5C5 url(../img/sub/icon_bus.svg) no-repeat center}
.inter_mark.airline::before {background: #0095DA url(../img/sub/icon_air.svg) no-repeat center}
.inter_mark.car::before {background: #4C4C4C url(../img/sub/icon_car.svg) no-repeat center}

.inter_mark.metro.ic_line1::before {background-color: #87B2D8}
.inter_mark.metro.line1::before {background-color: #005DAA}
.inter_mark.metro.airline::before {background-color: #0095DA}
.inter_mark.metro.line7::before {background-color: #677717}

.inter_line_wrap > li {min-height: 40px; padding-left: 40px; position: relative}
.inter_line_wrap > li::before {content: ''; display: block; width: 1px; height: 100%; border-left:1px dashed var(--line); position: absolute; left: 18px; top: 0; z-index: 1}
.inter_line_wrap > li:first-child::before {height: 80%; bottom: 0; top: auto}
.inter_line_wrap > li:last-child::before {height: 20%}
.inter_line_wrap > li::after{content: ''; display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--line2); position: absolute; left: 14px; top:3px; z-index: 2}

.inter_line_wrap > li.ic_line1::after {background: #87B2D8}
.inter_line_wrap > li.line1::after {background: #005DAA}
.inter_line_wrap > li.airline::after {background: #0095DA}
.inter_line_wrap > li.line7::after {background: #677717}
.inter_line_wrap > li.bus::after {background: #2BC5C5}
.inter_line_wrap > li.txc_key::after {background: var(--key-color)}

.inter_line_wrap > li .caption {color: #666; position: relative; padding-left: 11px}
.inter_line_wrap > li .caption::before {content: ''; display: block; width: 1px; height: 12px; background: var(--line2); position: absolute; left: 5px; top: 2px}

.inter_label {display: inline-block; background: var(--line2); padding: 3px 7px; border-radius: 15px; transform: translateY(-1px); margin-right: 5px}
.inter_label.green {background: #D7F5CC; color: #259B11}
.inter_label.blue {background: #D1E1FF; color: #003499}
.inter_label.yellow {background: #FFF3D2; color: #E5B11F}
.inter_label.red {background: #FFD2D4; color: #DF121A}


/* 원내 배치도 / 편의시설 */
.sticky_img_wrap {display: grid; grid-template-columns: 480px 1fr; gap: 0 70px}
.sticky_img_wrap .img_wrap {position: sticky; left: 0; top: 180px}

.floor_list {display: flex; gap: 30px 0; flex-direction: column}
.floor_list > li {display: grid; grid-template-columns: 100px 1fr; gap: 0 10px}
.floor_list > li .floor_name {position: relative}
.floor_list > li .floor_name::before {content: ''; width: 100%; height: 5px; background: var(--key-color); position: absolute; left: 0; top: 0}
.floor_list > li .floor_name + * {position: relative}
.floor_list > li .floor_name + *::before {content: ''; width: 100%; height: 1px; background: var(--black); position: absolute; left: 0; top: 0}
.floor_list > li:last-child {grid-template-columns: 140px 1fr}

/* 입·퇴원 안내(예약안내에서 재활용) */
.adminfo_list .item {border-bottom: 1px solid var(--line2); display: grid; grid-template-columns: 380px 1fr; gap: 0 70px}
.adminfo_list .item:last-child {border-bottom: none}
.adminfo_list ul li {letter-spacing: -0.5px}

.adm_process {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 90px}
.adm_process .item {background: #E9F5FF; position: relative}
.adm_process .item:nth-child(1) {border-radius: 0 0 0 50px}
.adm_process .item:nth-child(3) {border-radius: 0 50px 0 0}
.adm_process .item + .item::before {content:''; display: block; width: 96px; height: 12px; background: url(../img/sub/dot_line_key.svg) no-repeat center / cover; position: absolute; left: -96px; top: 50%; transform: translateY(-50%)}

.adm_caution_list {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px}
.adm_caution_list .caution_item {background: #E9F5FF; min-height: 100px; display: grid; grid-template-columns: 60px 1fr; gap: 0 10px;}
.adm_caution_list .caution_item  > * {align-self: center}

.info_cont_wrap {display: grid; grid-template-columns: 480px 1fr; gap: 0 70px}

/*장례식장 안내*/
.funeral_info {background: #F0F1F3 url(../img/sub/funeral_bg.png) no-repeat left bottom; display: grid; grid-template-columns: 550px 1fr}
.funeral_info .txt {grid-column: 2 / 3}

/*응급진료 안내*/
.emer_process {display: grid; grid-template-columns: 1fr 100px 1fr}
.emer_process > * {align-self: center}
.emer_process .item {display: flex; justify-content: space-between; border-radius: 150px}
.emer_process .item.gray {background: var(--bg-gray4)}
.emer_process .item.blue {background: #E9F5FF}
.emer_process .item.green {background: #E2FAF6}

.emer_process .item .circle {width: 150px; height: 150px; background: var(--white); box-shadow:inset 0 0 0 2px var(--line2); border-radius: 50%; display: flex; justify-content: center; align-items: center; position: relative}
.emer_process .item .circle + .circle::before {content:''; display: block; width: 54px; height: 10px; background: #666; position: absolute; left: -55px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url(../img/sub/dot_line_emer.svg); -webkit-mask-size: cover; -webkit-mask-position: center}

.emer_process .item.blue .circle {box-shadow: none; background: url(../img/sub/circle_bg_blue.png) no-repeat center / cover}
.emer_process .item.blue .circle:last-child {background: var(--icon)}
.emer_process .item.blue .circle:last-child p {color: var(--white)}
.emer_process .item.blue .circle::before {background: var(--icon)}

.emer_process .item.green .circle {box-shadow: none; background: url(../img/sub/circle_bg_green.png) no-repeat center / cover}
.emer_process .item.green .circle:last-child {background: #08B39A}
.emer_process .item.green .circle:last-child p {color: var(--white)}
.emer_process .item.green .circle::before {background: #08B39A}

.emer_process .ium {display: grid; grid-template-columns:repeat(2, 50%)}
.emer_process .ium .line {align-self: center}
.emer_process .ium .line:first-child {background: url(../img/sub/dot_line_ium01.svg) no-repeat center / cover; width: 56px; height: 8px; transform: translateX(-4px)}
.emer_process .ium .line:last-child {background: url(../img/sub/dot_line_ium02.svg) no-repeat center / cover; width: 52px; height: 210px;}

.duty_part_list {display: grid; grid-template-columns: repeat(8, 1fr); gap: 10px}
.duty_part_list .item {border: 1px dashed var(--line2)}


/* 외래진료 */
ul.dot.flex_ul {display: flex;  align-items: center;  gap: 20px;}
ul.dot.flex_ul li + li {margin-top:0}
.notion_text.bg_box {background: #f5f7f8;  padding: 0.4em;}
.notion_box.bg_white {background: #fff;  border: 1px solid #D9DCDF;}
.notion_box.bg_white .icon {width:130px}
.notion_box.bg_white  .desc {flex: 1;}

/*비급여진료비*/
.search_box {background: #f5f7f8;   display: flex;  align-items: center;  justify-content: center;}
.search_box  form {  display: flex;  align-items: center;   justify-content: flex-end;}
.search_box .select_box {  width: 200px;   margin-right: 10px;}
.search_box .check_wrap label {font-size: 15px;    font-weight: bold;    display: block;    position: relative;    padding-left: 1.8em;    margin-right: 2.5em; }
.search_box .check_wrap label input {position:absolute; visibility:hidden}
.search_box .check_wrap label input + span:before {content: "";    position: absolute;    left: 0;    top: 0;    width: 18px;    height: 18px;    border: 1px solid #ddd;    border-radius: 100%;    background: #fff;}
.search_box .check_wrap label input:checked + span:before {  border: 1px solid var(--key-color);   }
.search_box .check_wrap label input:checked + span:after {content: "";    position: absolute;    left: 4px;    top: 4px;    width: 10px;    height: 10px;    border-radius: 100%;    background: var(--key-color);  }
.search_box select {  background-color: #fff;  border: 1px solid #ddd;    width: 100%;    height: 45px;    font-size: 14px;    color: #666;    padding: 1em;    border-radius: 6px; background-image: url(../img/sub/select_arrow.png); background-size: 11px 7px; background-repeat:no-repeat; background-position:95% 50%; -webkit-appearance: none;-moz-appearance: none;}
.search_box .sch_input {  width: calc(100% - 120px);  height: 45px;    border: 1px solid #ddd;    padding: 0 10px;    color: #999;    font-size: 14px;    border-radius: 6px;}
.search_box .sch_bar {  display: flex; gap: 10px;  width: 400px;  border: none;}
.search_box  .sch_btn:before {    content: '';    display: inline-block;    width: 16px;    height: 16px;    margin-right: 5px;    margin-bottom: 2px;    vertical-align: middle;    position: absolute;    left: 50%;    top: 50%;    transform: translate(calc(-50% - 15px), -50%);    background: #fff;     -webkit-mask-image: url(../img/sub/sch_icon.png);    -webkit-mask-repeat: no-repeat;    -webkit-mask-position: center;    -webkit-mask-size: cover;}
.search_box  .sch_btn {    height: 45px;    color: #fff;    background-color: var(--key-color);    border: 0;    width: 110px;    font-size: 14px;    position: relative;    border-radius: 6px;    text-indent: 22px;    transition: all 0.15s;}
.search_box  .sch_btn:hover {    background: var(--key-color2);}
.tbl_wrap table .border {border-right: 1px solid var(--line2) !important; }
.tbl_wrap table .dv {width: 67px;}
.tbl_wrap table .date {width: 100px;}
.tbl_wrap table .nom {width: 90px;}
.tbl_wrap table .name {width: 140px;}
.tbl_wrap table th, .tbl_wrap table td {font-size:15px; word-break:keep-all}

/* LDH 25.04.04 비급여 진료비 분류버튼 추가*/
.non_insure_search form{display: flex; flex-direction: column; gap: 20px 0}
.radio_btn.non_insure {display: flex; flex-wrap: wrap; gap:10px; justify-content: center; max-width: 800px; width: 100%}
.radio_btn.non_insure .btn_wrap {position: relative}
.radio_btn.non_insure .btn_wrap input {position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0}
.radio_btn.non_insure .btn_wrap input:focus-visible {outline: none}
.radio_btn.non_insure .btn_wrap input:focus-visible + label {outline: 2px dashed var(--key-color2)} 
.radio_btn.non_insure .btn_wrap input:checked + label {background: var(--key-color); color: #fff; box-shadow: 0 0 0px 1px var(--key-color)}

/*원외약국안내 */
.ico_info_wrap {display: flex;  align-items: center;   gap: 20px;}
#bo_btn_top_ph {display: flex;  align-items: center;   justify-content: space-between;  margin-bottom: 20px;}
#bo_v.pharm > header {background: var(--bg-gray4);  border-top: 1px solid var(--black);display: flex;    align-items: center;    justify-content: space-between;}
#bo_v.pharm #bo_v_title {   width: calc(100% - 150px);}
#bo_v.pharm #bo_v_atc {min-height: 400px; border-bottom: 1px solid var(--line2)} 
/* #bo_v.pharm .bo_v_nb {display:none} */
#bo_list.pharm .tbl_head01 tbody tr:hover td {   background: #F2F8FD;}

/*예약 안내 25.03.23*/
.adm_caution_list.resinfo .caution_item {grid-template-columns:80px 1fr; gap:0 20px; height:120px}
.adm_caution_list.resinfo .caution_item > div {display:grid; grid-template-columns: 100px 1fr; gap:0 10px}
.adm_caution_list.resinfo .caution_item > div > * {align-self: center}
.adm_caution_list.resinfo .caution_item.full {grid-column: 1 / 3}

/*질환백과*/
.disease_issue {display: grid; grid-template-columns: repeat(6, 1fr); gap:0 10px}
.disease_issue .item {background: #E9F5FF}
.disease_issue .item .thumbnail {width: 120px; height:120px; overflow: hidden; margin:0 auto}
.disease_issue .item .thumbnail img {object-fit: cover; object-position: center; width: 100%; height: 100%}

.chosung_sch {display: grid; grid-template-columns: 434px 1fr; gap:0 41px}
.chosung_sch .left_sch {display: grid; grid-template-columns: 1fr 86px; gap:0 10px; position: relative}
.chosung_sch .left_sch::after {content:''; display: block; width: 1px; height: 44px; position: absolute; right: -20px; background: var(--line2); grid-column: 1 / 3}
.chosung_sch .right_btn ul {display:flex; gap:0 5px}
.chosung_sch .right_btn ul li {width:calc((100% - 65px) / 10)}
.chosung_sch .right_btn ul li > *:hover,
.chosung_sch .right_btn ul li > *.on {background: var(--key-color); box-shadow: 0 0 0px 1px var(--key-color); color: #fff}

.chosung_sch.type2 {grid-template-columns: 100%; gap: 0}
.chosung_sch.type2 .left_sch::after {width:100%; height: 1px; position: static; margin:20px 0}
.chosung_sch.type2 .right_btn ul {width: auto}
.chosung_sch.type2 .right_btn ul li {width: auto}
.chosung_sch.type2 .right_btn ul li > *{padding:0 20px}

.keyword_list {display:flex; gap:5px; flex-wrap: wrap}
.keyword_list li {background: var(--bg-gray4); border: 1px solid var(--line); padding:5px 15px; border-radius: 5px; line-height: 1.7}

.disease_item {border-bottom:1px solid var(--line2); transition: all .2s}
.disease_item:hover {background: var(--bg-gray4)}
.disease_item .disease_cont *{background: transparent!important}

.disease_item.col2 {display: grid; grid-template-columns: repeat(2, 50%)}
.disease_item.col2:hover {background: var(--white)}
.disease_item.col2 > * {transition: all .2s}
.disease_item.col2 > *:hover {background: var(--bg-gray4)}

.disease_cont > * {font-size:15px; color:var(--black); line-height: 1.5}

.disease_detail .img_holder + div > * {color:var(--black)}
.disease_detail .sector_title + div > * {color:var(--black)}

/* LDH 25.04.27 IOS 폰트 맞춤 */
.disease_item .disease_cont *,
.disease_item .disease_cont p,
.disease_item .disease_cont span {font-family: 'Pretendard'!important}

.disease_detail *,
.disease_detail p,
.disease_detail span {font-family: 'Pretendard'!important}

/***게시판 공통***/

.tab_box {background: var(--bg-gray4)}

/*게시판 공통 basic 스타일 기반*/
/*목록*/
#bo_list .tbl_wrap .td_chk {border-top: 1px solid var(--line2); border-bottom: 1px solid var(--line2)}
#bo_list .tbl_wrap tbody .even td {background: transparent}
#bo_list .tbl_wrap tbody .even:hover td {background: #fbfbfb}
#bo_list .tbl_wrap tbody .bo_notice td {background: #F2F8FD!important}

.tbl_wrap {border-top: 1px solid var(--black)}
.tbl_wrap.tbl_head01 thead th {background: var(--bg-gray4); font-size: 14px; font-weight: 600; border-right: 1px solid var(--line2); border-bottom: 1px solid var(--line2)}
.tbl_wrap.tbl_head01 thead th:last-child {border-right: none}
.tbl_wrap.tbl_head01 td {border-right: 1px solid var(--line2); border-bottom: 1px solid var(--line2); text-align: center; font-size: 14px; color: var(--black)}
.tbl_wrap.tbl_head01 td:last-child {border-right: none}
.tbl_wrap.tbl_head01 td.td_subject {text-align: left}
.tbl_wrap.tbl_head01 td.td_subject .bo_tit {padding-left: 15px}
.tbl_wrap.tbl_head01 td.td_subject .bo_tit a {font-weight: 400; color: var(--black)}
.tbl_wrap.tbl_head01 td .thumb {width: 200px; height: 150px; overflow: hidden; margin: 15px auto}
.tbl_wrap.tbl_head01 td .thumb img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: center}
.tbl_wrap.tbl_head01 .no-border {border-right: none !important}

.tbl_wrap.scrollbar_style {overflow-x: auto}
.tbl_wrap.scrollbar_style table {min-width: 1000px}
.tbl_wrap.scrollbar_style.mw_700 table {min-width: 700px}
.tbl_wrap.scrollbar_style.mw_600 table {min-width: 600px}
.tbl_wrap.scrollbar_style.mw_500 table {min-width: 500px}
.tbl_scroll_wrap {position: relative}
.tbl_scroll_wrap::after {content: ''; display: block; width: 40px; height: 100%; background: linear-gradient(-90deg, var(--white) , transparent); position: absolute; right: 0; top: 0; display: none}
.tbl_scroll_wrap.ended::after {display: none}

/* 예외 스타일 */
.tbl_head01.td_left tr td {text-align: left}
.tbl_head01.td_left tr td:first-child {text-align: center}
.tbl_head01.td_left.no_first tr td:first-child {text-align:left}

/* LDH : 예약내역 조회에서 본인 지인 구분 시 사용*/
.tbl_wrap.tbl_head01 .bg_color1 {background: #edf6ff}
.tbl_wrap.tbl_head01 .bg_color2 {background: #ededff}
.tbl_wrap.tbl_head01 .bg_color3 {background: #edfeff}
.tbl_wrap.tbl_head01 .bg_color4 {background: #ffedf3}
.tbl_wrap.tbl_head01 .bg_color5 {background: #ffffed}
.tbl_wrap.tbl_head01 .bg_color6 {background: #edfff5}
.tbl_wrap.tbl_head01 .bg_color7 {background: #ffedfe}
.tbl_wrap.tbl_head01 .bg_color8 {background: #ffeded}
.tbl_wrap.tbl_head01 .bg_color9 {background: #f4ffed}
.tbl_wrap.tbl_head01 .bg_color10 {background: #f8edff}

/* LDH 25.04.28 예약 내역 호버 효과 변경 */
.my_res_list .tbl_head01 tbody tr td {transition: .2s;}
.my_res_list .tbl_head01 tbody tr:hover td {background: var(--mid-blue); color: var(--white)}

/* LDH 25.04.27 리스트 게시판 IOS 맞춤 */
.tbl_wrap table {table-layout: fixed}
.tbl_wrap.tbl_head01 thead th,
.tbl_wrap.tbl_head01 td { overflow-wrap: break-word; word-break: break-word; white-space: normal}

/* 갤러리 */
.gall_img {border-radius:5px; overflow: hidden}
.gall_img img {width:100%}
.gall_row {display:flex; gap:50px 20px; flex-wrap:wrap}
.blank_img {height:200px; object-fit: cover}
.gall_text_href {padding-top:15px}
.gall_text_href a {font-size:16px; font-weight:400; color:var(--black); line-height: 1.5}
.gall_img:hover .borders {transform: scale(1.1); transition: all .4s}


/*예외 스타일*/
.tbl_wrap.tbl_head01.line_full thead th:first-child {border-left: 1px solid var(--line2)}
.tbl_wrap.tbl_head01.line_full td:first-child {border-left: 1px solid var(--line2)}
.tbl_wrap.tbl_head01.line_full thead th:last-child {border-right: 1px solid var(--line2)}
.tbl_wrap.tbl_head01.line_full td:last-child {border-right: 1px solid var(--line2)}

.tbl_wrap.tbl_head01 thead th.f_15 {font-size: 15px}
.tbl_wrap.tbl_head01 td.f_15 {font-size: 15px}

.tbl_wrap.tbl_head01 td.pd_15 {padding: 15px}

.tbl_wrap.tbl_head01.no_hover tr td {background: var(--white)}
.tbl_wrap.tbl_head01.no_hover tr td.bg {background: var(--bg-gray4)}
.tbl_wrap.tbl_head01.no_hover tr td.thin {height: 42px}

.tbl_wrap.tbl_head01 td.left {text-align: left}

.tbl_wrap.tbl_head01 tr.h_80 td {height: 80px}

#bo_list .bo_tit [class*="fa-"]{display: none!important} /*게시판 리스트에 나오는 모든 아이콘 숨김*/
#bo_list .bo_tit .new_icon {display:none!important}

/*상세*/
#bo_v > header {background: var(--bg-gray4); border-top: 1px solid var(--black)}
#bo_v_atc #bo_v_con {min-height: auto}

#bo_v .bo_v_nb li .nb_tit.txc_bk {color: var(--blank)}
#bo_v .bo_v_nb li .nb_date.txc_bk {color: var(--blank)}
#bo_v .bo_v_nb li.btn_prv,
#bo_v .bo_v_nb li.btn_next {border-top: 1px solid var(--line2)}
#bo_v .bo_v_nb li.btn_next {border-bottom: 1px solid var(--line2)}

.bo_v_nb li {display: grid; grid-template-columns: auto 1fr auto}
.bo_v_nb li a {display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap}

/* 상세 이전,다음글 */
.bo_v_nb {position:relative;margin:20px 0;clear:both;text-align:left}
.bo_v_nb:after {display:block;visibility:hidden;clear:both;content:""}
.bo_v_nb li {border-top:1px solid #f1f1f1;padding:13px}
.bo_v_nb li:last-child {border-bottom:1px solid #f1f1f1}
.bo_v_nb li:hover {background:#f6f6f6}
.bo_v_nb li i {font-size:13px;color:#b3b3b3}
.bo_v_nb li .nb_tit {display:inline-block;padding-right:20px;color:#b3b3b3}
.bo_v_nb li .nb_date {float:right;color:#b3b3b3}

/*커스텀 게시판 - 검색박스*/
.sch_box {background: var(--bg-gray4)}
.sch_box .inner_grid {display: grid; grid-template-columns: auto 1fr auto; gap: 0 30px}
.sch_box .inner_grid.gap20 {gap: 0 20px}
.sch_box .inner_grid > div {display: flex; align-items: center}
.sch_box .inner_grid .period_area {gap: 0 5px}
.sch_box .inner_grid .search_area {gap: 0 10px}
.sch_box .inner_grid .search_area .select_basic,
.sch_box .inner_grid .search_area [class*="butn_style"] {flex-shrink: 0}
.sch_box .inner_grid .excel_area {justify-self: flex-end; gap: 0 10px}
.sch_box .inner_grid > div > span {white-space: nowrap; display: block}

/*페이저*/
.pg_wrap {float:none; width: 100%; display: flex; justify-content: center; padding-top: 15px; margin: 30px 0}
.pg_wrap .pg > * {margin: 0 3px}
.pg_page,
.pg_current {width: 36px; height: 36px; border-radius: 50%; line-height: 36px; font-size: 14px; font-weight: 400}
.pg_current {background-color: var(--key-color); border: none}
.pg_page {color: #7C7C7C; background-color: var(--white); border: none}
.pg_page.pg_start,
.pg_page.pg_end,
.pg_page.pg_prev,
.pg_page.pg_next {box-shadow: 0px 0px 0px 1px var(--line2)}
.pg_page.pg_prev {margin-right: 20px; background-image: url(../img/sub/pg_prev_icon.svg); background-position: center}
.pg_page.pg_next {margin-left: 20px; background-image: url(../img/sub/pg_next_icon.svg); background-position: center}
.pg_page.pg_start {background-image: url(../img/sub/pg_start_icon.svg); background-position: center}
.pg_page.pg_end {background-image: url(../img/sub/pg_end_icon.svg); background-position: center}

/*게시판 캘린더 스타일 기반*/
#calendar .fc-button-primary.fc-today-button,
#calendar .fc-button-primary#btn-settings {display: none}

/*웹진게시판*/
#show_box {display:grid; grid-template-columns:440px 1fr; gap:0 70px}
#show_box .img_area .thumbnail {border:1px solid var(--line2)}
#show_box .img_area .qr_wrap {border:1px solid var(--line2); display:grid; grid-template-columns: 120px 1fr; grid-template-rows: auto 1fr; gap:0 30px}
#show_box .img_area .qr_wrap .qr {grid-row: 1 / 3}
#show_box .img_area .date.mo {display:none}
#show_box .img_area .title.mo {display:none}

#show_box .cont_area .date {color:#666}
#show_box .cont_area .links {display:grid; grid-template-columns: repeat(3, 1fr); gap:0 10px}
#show_box .cont_area .content > *{line-height:1.7; color:var(--black)!important; font-size:16px!important; font-family: 'Pretendard'!important}
#show_box .cont_area .content b,
#show_box .cont_area .content b > *{font-size: 22px!important; display: block!important; font-weight: 600!important; line-height: 1.3!important; padding-bottom: 20px!important; padding-left: 16px!important; position: relative!important; font-family: 'Pretendard'!important}
#show_box .cont_area .content b > * {padding-left:0!important; padding-bottom:0!important; font-family: 'Pretendard'!important}
#show_box .cont_area .content b::before {content:''; display: block; width: 8px; height: 20px; background: var(--key-color); border-radius: 0 5px 0 5px; position: absolute; left: 0; top: 3px}

#bo_gall.webzine_list .gall_li {border:1px solid var(--line2)}



/* 게시판 mypage */
.tbl_wrap.tbl_head01.mypage thead th {font-size:15px; border-right:none}
.tbl_wrap.tbl_head01.mypage td {font-size:15px; border-right:none}

/* 게시판 비디오 */
#video-container {display: block; position: relative; padding-top: 57.5%}
#video-container iframe {position: absolute; left: 0; top: 0}

/*나눔이야기 (국내/해외)*/
.sharing_cont {display:grid; grid-template-columns: 590px 1fr; gap:0 50px}

/*LDH 25.03.24 통합검색*/
#sch_res_detail {display:flex; justify-content: center; gap: 0 10px; background: var(--bg-gray4)}
#sch_res_detail .sch_wr {display:flex; gap:0 10px; align-items: center}
#sch_res_detail .sch_wr input {width:calc(100% - 120px)}
#sch_res_detail .sch_wr .btn_submit {display: block; width: 100%; height: 100%; border: none; background: transparent; cursor: pointer; text-indent: 22px; position:absolute; left:0; top:0}

#sch_res_ov {display: flex; justify-content: space-between; align-items: flex-end}
#sch_res_ov li.none {display: none}

.sch_res_list .search_board_result .board_result_head {display: flex; justify-content: space-between; align-items: flex-end}
.sch_res_list .search_board_result .board_result_head a:hover {color: var(--key-color)}
.sch_res_list .search_board_result .board_result_head a {color: var(--black)}
.sch_res_list .search_board_result + .search_board_result {padding-top:30px}

.sch_res_list li {display: flex; gap:0 20px; padding-bottom:20px}
.sch_res_list li .thumb_img {width: 120px; flex-shrink: 0}
.sch_res_list li .thumb_img img {width:100%}
.sch_res_list li .dis_guide_thumb {width: 120px; height: 80px; flex-shrink: 0; border:1px solid var(--line2)}
.sch_res_list li .dis_guide_thumb img {width:100%}
.sch_res_list li .thumb_img.none {display:none}
.sch_res_list li .cont_wrap {flex-grow: 1}
.sch_res_list p + .sch_info {padding-top:20px}

.sch_info {font-size:13px}

.pagination {display: flex; justify-content: center; margin:0 0 30px}
.pagination a {text-align:center; width: 36px;
    height: 36px;
    border-radius: 50%;
    line-height: 36px;
    font-size: 14px;
    font-weight: 400;     color: #7C7C7C;
    background-color: var(--white);
    border: none; display:block; margin:0 3px}
.pagination a:hover {background-color:#fafafa}
.pagination a.active {background-color: var(--key-color); color:var(--white)}

#sch_res_board a {border: 1px solid var(--line2); color: var(--black); font-size:16px; transition: all .2s}
#sch_res_board a:hover{border: 1px solid var(--line2); color: var(--white); background: var(--key-color)}
#sch_res_board a strong {font-weight: 400}
#sch_res_board .sch_on {z-index:2;background:var(--key-color);color:#fff;font-weight:bold;border:1px solid var(--key-color); font-weight: 600}

/* LDH25.04.10 질환백과 추가 */
.sch_res_list.dis_guide li {display:block}

.sch_res_list .disease_item ul {padding-top:10px; border:none}
.sch_res_list .disease_item ul li{padding-bottom:0; border:none; background:none}

.sch_res_list .dis_guide_list {border-top:none; padding-top:15px}
.sch_res_list .dis_guide_list li{padding:15px 0}
.sch_res_list .dis_guide_list li p{position:relative; padding-left:10px}
.sch_res_list .dis_guide_list li p:first-child::before {content:''; display:block; width:3px; height:3px; background: var(--black); position:absolute; left:0; top:8px}

/* LDH 25.04.25 검색 레이아웃 수정추가 */
.sch_res_list li .cont_wrap .sch_cont.none {display: none}

/* 보도자료 검색 예외 수정 */
.sch_res_list.sch_news_list li {padding-bottom: 0}
.sch_res_list.sch_news_list .sch_tit {padding:0}
.sch_res_list.sch_news_list li .cont_wrap {display: grid; padding: 15px 0; grid-template-columns: auto 150px}
.sch_res_list.sch_news_list li .cont_wrap .sch_tit {display: flex; align-items: center; gap: 0 5px; overflow: hidden; width: 100%}
.sch_res_list.sch_news_list li .cont_wrap .sch_tit a {margin-bottom: 0; transition: .3s;}
.sch_res_list.sch_news_list li .cont_wrap .sch_tit a:not(.pop_a){display: inline-block; max-width:calc(100% - 50px)}
.sch_res_list.sch_news_list li .cont_wrap .sch_tit a .inner_title {display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}
.sch_res_list.sch_news_list li .cont_wrap .sch_tit a:hover {color: var(--key-color2)}
.sch_res_list.sch_news_list li .sch_cont {display: none}
.sch_res_list.sch_news_list .sch_info {padding-top: 0; align-self: center}

/* 질환백과 검색 예외 수정 */
.sch_res_list.dis_guide.none {display: none}
.sch_res_list.dis_guide .sch_dis_guide {border: none}
.sch_res_list.dis_guide .sch_dis_guide > li {padding-bottom:0}
.sch_res_list.dis_guide .sch_dis_guide > li:last-child {border-bottom: none}
.sch_res_list.dis_guide .sch_dis_guide > li:first-child {border-top: 1px solid var(--black); border-bottom:none}
.sch_res_list.dis_guide .sch_dis_guide + h3 {padding-top:50px}
.sch_res_list.dis_guide .sch_dis_guide.none + h3 {padding-top:0}
.sch_res_list.dis_guide .disease_item img {width: 200px; height: 150px; object-fit: cover}


/***** LDH 25.03.28 마이페이지 *****/
.center_wrap.mypage {grid-template-columns: repeat(4, 1fr); gap: 20px}
.center_wrap.mypage .item p:nth-child(2) {height: 44px; display: flex; align-items: center; justify-content: center}

.sub_page.mypage {min-height:845px}

/* 마이페이지 - 진료내역*/
.mypage_period_select {display: flex; justify-content: center}
.mypage_period_select .inner {max-width: 550px; width: 100%; display: grid; grid-template-columns: 220px 1fr; gap: 0 10px}
.mypage_period_select .inner.single {max-width:calc(550px - 220px); grid-template-columns:100%}
.mypage_period_select .box_chk_wrap {align-self: center}
.mypage_period_select .box_chk_wrap .box_chk {height:44px}
.mypage_period_select .box_chk_wrap .box_chk label {border: 1px solid var(--line2); background: #fff}
.mypage_period_select .box_chk_wrap .box_chk label:hover, .mypage_period_select .box_chk_wrap .box_chk input:checked + label {background: var(--mid-blue)}

.center_wrap.mypage.mypage_appointment_list {grid-template-columns: repeat(4, minmax(calc((100% - 60px) / 4), 1fr))}
.center_wrap.mypage.mypage_appointment_list .item p + p {height: auto; display: block}
.center_wrap.mypage.mypage_appointment_list .item:hover {background: transparent; box-shadow: none; border: 1px dashed var(--line2)}
.center_wrap.mypage.mypage_appointment_list .item:hover p + p {font-weight: 400; color: var(--font)}

/* 마이페이지 - 투약정보 */
.mypage_medication_list {border-top:2px solid var(--black)}
.mypage_medication_list ul li {border-bottom:1px solid var(--line2); display: flex; justify-content: space-between}
.mypage_medication_list ul li > * {display:block}
.mypage_medication_list ul li > *:first-child {flex: 1}

/* LDH 25.04.27 mong9로 작성한 글 IOS 와 폰트 맞춤 */
.m9-grid-block *,
.m9-grid-block p,
.m9-grid-block span {font-family: 'Pretendard'!important}

/* LDH 25.04.30 마이페이지 내가 쓴 글 */
.mypage #bo_v_con *{font-size:16px; color:var(--black);  line-height:1.5}

/************ KYL ************/




/* 진료상담예약 */
.mbskin.medical_app .mbskin_box {width: auto;}
.mbskin.medical_app .mbskin_box .input_basic_col3 {display: flex; align-items: center;}
.mbskin.medical_app .mbskin_box .input_basic_col3 > div {width: calc(100% / 3);}
.mbskin.medical_app .mbskin_box .input_basic_col3.auto > div {width: auto;}
.mbskin.medical_app .mbskin_box .input_basic_col3 .item + .item {margin-left: 30px;}
.mbskin.medical_app .mbskin_box .input_basic_col3 .item.etc {flex-grow: 1;}
.mbskin.medical_app .mbskin_box .radio_wrapper {display: flex; align-items: center; position: relative;}
.mbskin.medical_app .mbskin_box .radio_wrapper label {display: inline-flex; align-items: center; cursor: pointer; padding-left: 28px; position: relative;}
.mbskin.medical_app .mbskin_box .radio_wrapper input[type="text"] {margin-left: 10px; flex-grow: 1; width: auto;}



/* 치매원스톱 서비스 */
.mbskin.dementia .mbskin_box .info_cont_wrap h2 b {color: #004EA2}
.mbskin.dementia .mbskin_box .result_wrap .result {padding: 20px 30px;}
.mbskin.dementia .mbskin_box .result_wrap .result.good {background-color: #EAF9EC;}
.mbskin.dementia .mbskin_box .result_wrap .result.bad {background-color: #FFEFF0;}
.mbskin.dementia .mbskin_box .result_wrap .result p:not(.txt_green):not(.caution_txt) {color: #222;}
.mbskin.dementia .mbskin_box .result_wrap .result p span {vertical-align: text-bottom;}
.mbskin.dementia .mbskin_box .result_wrap .result.bad p span {color: #ED2931;}
.mbskin.dementia .mbskin_box .result_wrap .result .left {align-items: center;}
.mbskin.dementia .mbskin_box .result_wrap .result .left .icon + p {width: 200px; display: flex; align-items: center;}

.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table {border-collapse:collapse; border-spacing: 0; width: 100%;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table tr {border: 1px solid #D9DCDF; border-top: 0;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table th {background-color: #3787DD; color: #fff; padding: 8px 0; position: relative;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table th:nth-child(2)::before, 
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table th:nth-child(3)::before {content: ''; width: 1px; height: 18px; background-color: #2A6AAF; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td {padding: 22px 0; position: relative;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td:not(:first-child) {text-align: center; background-color: #F5F7F8;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td.dfbox {align-items: center;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td:nth-child(2)::before, 
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td:nth-child(3)::before {content: ''; width: 1px; height: 18px; background-color: #D9DCDF; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td p {color: #222;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td p span {color: #004EA2;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td .line {width: 1px; height: 11px; background-color: #D9D9D9; margin: 0 10px;}
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap.radio_wrapper table td label:before,
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap.radio_wrapper table td input[type="radio"]:checked + label:after {left: 50%; top: 50%; transform: translate(-50%, -50%);}

.mbskin.dementia .mbskin_box {width: auto;}
.mbskin.dementia .mbskin_box .input_basic_col3 {display: flex; align-items: center;}
.mbskin.dementia .mbskin_box .input_basic_col3 > div {width: calc(100% / 3);}
.mbskin.dementia .mbskin_box .input_basic_col3 .item + .item {margin-left: 20px;}

/* LDH 25.04.38 치매원스톱 서비스 수정 추가 */
.mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td label {font-size:0}



/* 인사말 */
.greeting .info_cont_wrap {grid-template-columns: 354px 1fr; gap: 0 60px;}
.greeting .info_cont_wrap ul li {line-height: 1.875; color: #222; word-break: keep-all;}
.greeting .info_cont_wrap ul li span {color: #004EA2;}
.greeting .info_cont_wrap .sign {align-items: center; gap: 15px;}
.greeting .info_cont_wrap .sign p {color: #000;}



/* 병원역사 - 비전과 핵심가치 */
.sub_page.vision p:not(.txc_key) {color: var(--black);}
.sub_page .mission {text-align: center;}
.sub_page.vision .vision .vision_box {border-radius: 0 30px 0 30px; align-items: center;}
.sub_page.vision .vision .vision_box.green {background-color: #E2FAF6; padding: 40px 50px;}
.sub_page.vision .vision .vision_box.blue {background-color: #E9F5FF; padding: 45px 50px;}
.sub_page.vision .vision .vision_box.green h3 span, .vision .vision .vision_box.green p {color: #13826F;}
.sub_page.vision .vision .vision_box .line {width: 30px; height: 2px; background-color: #004EA2; margin: 0 30px;}
.sub_page.vision .vision .vision_box.green .line {background-color: #13826F;}
.sub_page.vision .value ul {justify-content: space-between;}
.sub_page.vision .value ul li {width: 284px; height: 284px; border-radius: 50%; overflow: hidden; background-color: #EBEFF2; position: relative;}
.sub_page.vision .value ul li .bg {width: 100%; height: 50%; position: absolute; left: 0; top: 0;}
.sub_page.vision .value ul li:nth-child(1) .bg {background-color: #C3E0FC;}
.sub_page.vision .value ul li:nth-child(2) .bg {background-color: #75B7FF;}
.sub_page.vision .value ul li:nth-child(3) .bg {background-color: #4C90DA;}
.sub_page.vision .value ul li:nth-child(4) .bg {background-color: #004EA2;}
.sub_page.vision .value ul li .cont {flex-direction: column; width: 100%; height: 100%; justify-content: center; align-items: center; position: relative;}
.sub_page.vision .value ul li .cont::before {content: ''; width: calc(100% - 34px); height: calc(100% - 34px); background-color: #fff; border-radius: 50%; z-index: 1; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.sub_page.vision .value ul li .cont * {position: relative; z-index: 5; text-align: center;}
.sub_page.vision .value ul li .cont strong {display: block;}
.sub_page.vision .value ul li .cont .line {width: 28px; height: 1px; background-color: #D9D9D9; margin: 14px 0;}


/* 병원역사 - 브랜드 스토리 */
.sub_page.story {text-align: center;}
.sub_page.story p:not(.txc_key) {color: var(--black);}
.sub_page.story .rows {justify-content: space-between;}
.sub_page.story .rows .boxs {flex-direction: column; align-items: center;}
.sub_page.story .rows .boxs .img_wrap {border-radius: 50%; overflow: hidden; position: relative;}
.sub_page.story .rows .boxs .img_wrap .txts {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; width: 212px; height: 212px; border-radius: 50%; flex-direction: column; justify-content: center; align-items: center;}
.sub_page.story .rows .boxs .line {width: 1px; height: 30px; background-color: #222;}
.sub_page.story .rows .boxs ul li strong {display: block;}


/* 병원역사 - HI */
.sub_page.hi p:not(.txc_key) {color: var(--black);}
.sub_page.hi .intro {text-align: center;}
.sub_page.hi .btns {gap: 10px; justify-content: center;}
.sub_page.hi .btns > div {width: 180px;}
.sub_page.hi .btns > div.butn_style2 a {color: var(--key-color);}
.sub_page.hi .btns > div.butn_style1 a {color: #fff;}
.sub_page.hi .symbol_wrap {align-items: center; justify-content: center; column-gap: 188px; border: 1px solid #D9DCDF;}
.sub_page.hi .symbol_wrap ul.left {text-align: left;}
.sub_page.hi .symbol_wrap ul.right {text-align: right;}
.sub_page.hi .symbol_wrap ul li {position: relative;}
.sub_page.hi .symbol_wrap ul li + li {margin-top: 56px;}
.sub_page.hi .symbol_wrap ul li::before {content :''; position: absolute; right: -37%; top: 50%; transform: translate(100%, -50%); background: url(../img/sub/hi_arrow.png) no-repeat; background-size: cover; width: 140px; height: 12px;}
.sub_page.hi .symbol_wrap ul.left li::before {right: auto; left: -37%; transform: translate(-100%, -50%) rotate(180deg);}
.sub_page.hi .symbol_wrap strong {display: block;}


/* 병원역사 - 세종병원체 */
.sub_page.font p:not(.txc_key) {color: var(--black);}
.sub_page.font .intro, .sub_page.font .concept {text-align: center;}
.sub_page.font .cont .boxs {border: 1px solid #D9DCDF;}
.sub_page.font .cont .boxs img {margin: 0 auto; display: block;}
.sub_page.font .cont1 .intro {border-bottom: 1px solid #D9DCDF;}
.sub_page.font .cont1 .intro .fonts {background-color: var(--key-color); border-radius: 0 30px 0 30px;}
.sub_page.font .cont1 .btns {gap: 10px; justify-content: center;}
.sub_page.font .cont1 .btns > div {width: 180px;}
.sub_page.font .cont1 .btns > div.butn_style1 a {color: #fff;}
.sub_page.font .cont1 .btns > div.butn_style2 a {color: var(--key-color);}
.sub_page.font .cont1 .concept ul {justify-content: space-between;}
.sub_page.font .cont1 .concept ul li {width: 284px; height: 284px; background-color: #E9F5FF; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.sub_page.font .cont2 .boxs .img {text-align: center;}
.sub_page.font .cont2 .boxs ul {flex-wrap: wrap; column-gap: 20px; row-gap: 60px; justify-content: center; padding: 0 68px;}
.sub_page.font .cont2 .boxs ul li {width: calc((100% - 20px) / 2); column-gap: 30px;}
.sub_page.font .cont7 table {border-collapse:collapse; border-spacing: 0; width: 100%;}
.sub_page.font .cont7 table th, .sub_page.font .cont7 table td {border: 1px solid #D9DCDF;}
.sub_page.font .cont7 table th {background-color: #F5F7F8;}


/* 병원역사 - 연혁 */
.sub_page.history p:not(.txc_key) {color: var(--black);}
.sub_page.history .hisyory_list {justify-content: space-between;}
.sub_page.history .hisyory_list .year {border-top: 2px solid var(--key-color); width: 300px;}
.sub_page.history .hisyory_list .cont_box {border-top: 1px solid #D9DCDF; width: calc(100% - 320px);}
.sub_page.history .hisyory_list .cont_box .cont + .cont {border-top: 1px solid #D9DCDF;}
.sub_page.history .hisyory_list .cont>p {width: 100px;}
.sub_page.history .hisyory_list .cont ul {width: calc(100% - 100px); padding-left: 5px;}
.sub_page.history .hisyory_list .cont ul li {line-height: 1.866;}
.sub_page.history .hisyory_list .cont ul li p:first-child {width: 50px;}
.sub_page.history .hisyory_list .cont ul li p:last-child {width: calc(100% - 50px);}
.sub_page.history .tab_style.type2.sticky {background:transparent}

/* LDH 25.05.14 연혁 탭 넓이 유동적으로 수정 */
#history_tabs {min-width:995px; width:100%}
#history_tabs ul {display: flex; flex-wrap: nowrap; width: 100%}
#history_tabs ul li {width: 100%}

/* 사랑YES 희망 YES 후원 - 세종병원 과제 */
.sub_page.task {text-align: center;}
.sub_page.task p:not(.txc_key) {color: var(--black);}
.sub_page.task h2 {line-height: 1.2;}
.sub_page.task .cont_wrap {position: relative;}
.sub_page.task .cont_wrap .bg {background-color: #F5F7F8; width: 422px; height: 422px; border-radius: 50%; margin: 0 auto; position: relative;}
.sub_page.task .cont_wrap .bg .bg_cont {width: 100%; height: 100%; background-color: #fff; border: 2px dashed var(--key-color); border-radius: 50%; justify-content: center; align-items: center;}
.sub_page.task .cont_wrap .blue_circle {width: 284px; height: 284px; background-color: #E9F5FF; border-radius: 50%; flex-direction: column; justify-content: center; position: absolute;}
.sub_page.task .cont_wrap .blue_circle.first {left: 50%; top: 0; transform: translate(-50%, 10%);}
.sub_page.task .cont_wrap .blue_circle.second {left: 0; bottom: 5%; transform: translate(80%, 10%);}
.sub_page.task .cont_wrap .blue_circle.third {right: 0; bottom: 5%; transform: translate(-80%, 10%);}




/* 입원·퇴원 안내 - 중환자실 이용안내 */
.sub_page.icu_info .info_cont_wrap {grid-template-columns: 570px 1fr; align-items: center;}
.sub_page.icu_info .info_cont_wrap.reverse {direction: rtl;}
.sub_page.icu_info .info_cont_wrap.reverse .right_txt {text-align: left;}


/* 입원·퇴원 안내 - 치료과정참여 */
.sub_page.treat_join .info_cont_wrap {align-items: end;}
.sub_page.treat_join .info_cont_wrap .right_txt ul {margin-top: 48px;}
.sub_page.treat_join .info_cont_wrap .right_txt ul li {background-color: #E9F5FF; align-items: center; column-gap: 10px;}


/* 입원·퇴원 안내 - 간호간병 통합서비스 */
.sub_page.nursing_care .info_cont_wrap {align-items: center;}
.sub_page.nursing_care .info_cont_wrap.reverse {direction: rtl;}
.sub_page.nursing_care .info_cont_wrap.reverse .right_txt {text-align: left; direction: ltr;}
.sub_page.nursing_care .info_cont_wrap.reverse .right_txt p {word-break: keep-all;}
.sub_page.nursing_care .info {border: 1px solid #D9DCDF; align-items: center; column-gap: 30px;}
.sub_page.nursing_care table {border-collapse:collapse; border-spacing: 0; width: 100%;}
.sub_page.nursing_care table th {width: 200px; background-color: #F5F7F8; border: 1px solid #D9DCDF; height: 80px;}
.sub_page.nursing_care table td {width: calc(100% - 200px); border: 1px solid #D9DCDF; height: 80px;}


/* 편의시설 안내 - 병원 내 편의시설 */
.sub_page.convenin_list .info_cont_wrap {grid-template-columns: 380px 1fr; align-items: center;}
.sub_page.convenin_list .info_cont_wrap + .info_cont_wrap {border-top: 1px solid #D9DCDF;}
.sub_page.convenin_list .info_cont_wrap ul.dot li {line-height: 1.5;}
.sub_page.convenin_list .info_cont_wrap ul.dot li + li {margin-top: 10px;}


/************ KYL ************/


@media (max-height: 1080px) and (max-width: 1920px) {
    /*의료진/진료과 의료진 상세*/
    .doctor_area .doctor_detail_wrap .doctor_img {width: 35.41vw; flex-shrink: 0}
    .doctor_area .doctor_detail_wrap .doctor_img .inner {position: sticky; right: 0; top: 91px; z-index: 2; width: 100%; height: 60.31vw}
    .doctor_area .doctor_detail_wrap .doctor_img .inner {top: calc((100% - 60.31vw) + 15.83vw)}
}



/****************** Media Query ******************/

@media (max-width: 1920px) {
    .reservation_area .left_introduce .txt_top h2{font-size: 40px}  
    .reservation_area .left_introduce .txt_top h3{font-size: 22px}  
}

/* laptop ~ table */

@media (max-width: 1279px) {
    /* 마이페이지 */
    .tbl_wrap.tbl_head01.mypage thead th,.tbl_wrap.tbl_head01.mypage td {font-size: 1.25rem;}
}

/* table ~ mobile */

@media (max-width: 1024px) {
    /* 게시판 공통 */

    .tab_box {padding:15px}
    .tbl_wrap.tbl_head01 thead th {padding:10px 0}
    .tbl_wrap.tbl_head01 td {height:40px; padding:10px 5px}

    .tbl_scroll_wrap::after {display: block}

    /*웹진게시판*/
    #show_box {grid-template-columns: 42.97vw 1fr; gap: 0 40px;}
    #show_box .img_area .thumbnail {border:1px solid var(--line2)}
    #show_box .img_area .qr_wrap {border:1px solid var(--line2); display:grid; grid-template-columns: 90px 1fr; grid-template-rows: auto 1fr; gap:0 20px}
    #show_box .img_area .qr_wrap .qr {grid-row: 1 / 3}
    #show_box .img_area .date {color:#666}

    #show_box .cont_area .links {display:grid; grid-template-columns: repeat(3, 1fr); gap:0 5px}
    #show_box .cont_area .content > *{line-height:1.7; color:var(--black); font-size:16px}
    #show_box .cont_area .content b,
    #show_box .cont_area .content b > *{font-size: 18px!important; display: block!important; font-weight: 600!important; line-height: 1.3!important; padding-bottom: 20px!important; padding-left: 12px!important; position: relative!important}
    #show_box .cont_area .content b > * {padding-left:0!important; padding-bottom:0!important}
    #show_box .cont_area .content b::before {content:''; display: block; width: 6px; height: 18px; background: var(--key-color); border-radius: 0 4px 0 4px; position: absolute; left: 0; top: 2px}

    #bo_gall.webzine_list .gall_li {border:1px solid var(--line2); padding:10px}

    /* 진료예약 */
    .center_wrap {grid-template-columns: repeat(3, 1fr)!important}

    /* 의료진 소개*/
    .doctor_schedule_area {display: none}
    .doctor_area .doctor_detail_wrap .doctor_info .d_schedule .shd_head #cal_btn {display: block}

    /* 의료진 소개 상세 */
    .video_pop .pop_wrap .close.pc_only {display: block!important}
    .video_pop .close.mo_only {display: none!important}

    /* LDH 25.04.22  센터·클리닉 소개 진료협력센터 진료의뢰 상세설명 보기 팝업 내용*/
    .convention_process,
    .convention_process.grid5 {grid-template-columns: 100%; gap: 10px}
    .convention_process > li {min-height: 60px; text-align:center; justify-content: center; flex-direction: column}
    .convention_process > li::after {right: auto; left: 50%; transform: translateX(-50%) rotate(90deg); top: auto; bottom:-12px}
    .convention_process > li > ul {position: static; display: flex; flex-direction: column; width: auto; padding-top:10px}
    .convention_process > li > ul li {display: inline-block; text-align: left; font-size: 14px}
    .convention_process > li.blue > ul li{color: var(--white)}
    .convention_process > li.blue > ul li::before {background: var(--white)}

    .cooperation_sort ul {gap: 5px; flex-wrap: wrap}
    .cooperation_sort ul li {width: calc((100% - (5px * 5)) / 6)}

    /* LDH 25.05.14 병원역사 - 연혁 */
    #history_tabs {width:100%; min-width:100%}
    #history_tabs ul {
    display: flex;
    flex-wrap: wrap;
  }

  #history_tabs ul li {
    width: calc(100% / var(--tab-count));
    box-sizing: border-box;
  }

  /* LDH 25.05.14 병원역사 - 연혁 */
    #history_tabs ul li a {
    padding:4px 23px;
  }

    /* 마이페이지 */

    /* 마이페이지 - 진료내역 */
    .mypage_period_select .inner {max-width: 100%; gap: 10px 0; grid-template-columns: 100%}

    .center_wrap.mypage.mypage_appointment_list {grid-template-columns: repeat(3, minmax(calc((100% - 40px) / 3), 1fr))!important}
}

/* mobile only */

@media (max-width: 768px) {
    
    /* 게시판 공통 */
    .gall_row {display: flex; gap: 30px 10px; flex-wrap: wrap}

    .view_answer {flex-direction: column}
    .view_answer .icon {width:50px!important}

    /*웹진게시판*/
    #show_box {grid-template-columns: 100%; gap:0}

    #show_box .img_area .date.mo {display:block}
    #show_box .img_area .title.mo {display:block}

    #show_box .cont_area .date {display:none}
    #show_box .cont_area .title {display:none}

    #show_box .img_area .thumbnail {margin-top:20px; padding:15px}
    #show_box .img_area .thumbnail img {width:100%}

    #show_box + .divider {margin:20px 0}

    /* 진료예약 */
    .center_wrap {grid-template-columns: repeat(2, 1fr)!important; gap: 12px!important}

    /* 진료상담예약 */
    /* 치매원스톱서비스 */
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table colgroup {display:none}
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table tr {display:grid; grid-template-columns: repeat(3, 1fr)}
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table tr th:first-child,
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table tr .dfbox {grid-column: 1 / 4; flex-direction:row; gap:0 4px; align-items: flex-start}
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table tr .dfbox p:first-child {flex-shrink: 0}
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td .line {display:block; margin: 4px 2px 0}

    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap table td label {font-size:14px; white-space:nowrap; position: relative}

    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap.radio_wrapper table td label:before {left:4px; top:12px; position: relative; display: inline-block}
    .mbskin.dementia .mbskin_box .dementia_selftest .table_wrap.radio_wrapper table td input[type="radio"]:checked + label:after{left:4px; top: 7px}

    /* 의료진 소개 상세 */
    .video_pop .pop_wrap {width: 100%}
    .video_pop .pop_bg {background: #000}

    .video_pop .pop_wrap .close.pc_only {display: none!important}
    .video_pop .close.mo_only {display: block!important}

    /* 페이저 */
    .pg_wrap {float:none; width: 100%; display: flex; justify-content: center; padding-top: 30px; margin:0}
    .pg_wrap .pg > * {margin: 0 3px}
    .pg_page,
    .pg_current {width: 20px; height: 20px; border-radius: 50%; line-height: 21px; font-size: 11px; font-weight: 400; padding: 0; min-width: 20px}
    .pg_current {background-color: var(--key-color); border: none}
    .pg_page {color: #7C7C7C; background-color: var(--white); border: none}
    .pg_page.pg_start,
    .pg_page.pg_end,
    .pg_page.pg_prev,
    .pg_page.pg_next {box-shadow: 0px 0px 0px 1px var(--line2)}
    .pg_page.pg_prev {margin-right: 10px; background-image: url(../img/sub/pg_prev_icon.svg); background-position: center; background-size: 6px}
    .pg_page.pg_next {margin-left: 10px; background-image: url(../img/sub/pg_next_icon.svg); background-position: center; background-size: 6px}
    .pg_page.pg_start {background-image: url(../img/sub/pg_start_icon.svg); background-position: center; background-size: 10px}
    .pg_page.pg_end {background-image: url(../img/sub/pg_end_icon.svg); background-position: center; background-size: 10px}

    /* 마이페이지 */
    .sub_page.mypage {min-height: auto}

    /* 마이페이지 - 진료내역 */
    .mypage_period_select .box_chk_wrap .box_chk label {padding-left: 30px}
    .mypage_period_select .box_chk_wrap .box_chk label::before {left: 8px}
    .mypage_period_select .box_chk_wrap .box_chk input:checked + label::after {left: 12px}

    /* 마이페이지 - 투약정보 */
    .mypage_medication_list ul li {flex-direction: column; gap: 10px 0}

    .center_wrap.mypage.mypage_appointment_list {grid-template-columns: repeat(2, minmax(calc((100% - 12px) / 2), 1fr))!important}

}

@media (max-width: 480px) {
    /* LDH 25.05.14 병원역사 - 연혁 */
    #history_tabs ul li a {
    padding:4px 12px;
  }
}