@charset "UTF-8";


:root {
    /* 1_1_1_1 */
    --iconBorderBoxBgImageP1111: url("/images/content/page1/monitor_heart.png");
    
    /* 1_1_2_1 */
    --resvTypeTabAreaLineBg: #1b3c88;
    --resvTypeTabBtnBg: #f4f5f8;
    --resvTypeTabBtnBgOn: #ffffff;
    --resvTypeTabBtnBorder: 1px solid #d9d9d9;
    --resvTypeTabBtnBorderOn: 2px solid #1b3c88;

    /* 1_1_3_1 */
    --iconBorderBoxBgImagep1131: url("/images/content/page1/document.png");
    
    /* 1_2_1_1 */
    --skyblueFontColor: #1b3c88;

    /* 1_3_1_1 */
    --gridHeaderBg : #f8f8f8;
    
    /* 1_4_1_1 */
    --medicalProceduresSpace : 30px;
    --medicalProceduresBg1: #0e3091;
    --medicalProceduresBg2: #ffffff;
    --medicalProceduresBg3: #f4f5f8;
    
    /* 1_4_5_1 */
    --iconBorderBoxBgImageP1451: url("/images/content/page1/hospital_bed.png");
    --fegBgImageP1451_1: url("/images/content/page1/admission_icon1.png");
    --fegBgImageP1451_2: url("/images/content/page1/admission_icon2.png");
    --fegBgImageP1451_3: url("/images/content/page1/admission_icon3.png");
}
:root[color-theme='dark'] {
    /* 1_1_1_1 */
    --iconBorderBoxBgImageP1111: url("/images/content/page1/monitor_heart_white.png");
    
    /* 1_1_2_1 */
    --resvTypeTabAreaLineBg: #1b3c88;
    --resvTypeTabBtnBg: #171d2f;
    --resvTypeTabBtnBgOn: #272e3d;
    --resvTypeTabBtnBorder: 1px solid #454059;
    --resvTypeTabBtnBorderOn: 2px solid #1b3c88;

    /* 1_1_3_1 */
    --iconBorderBoxBgImagep1131: url("/images/content/page1/document_white.png");
    
    /* 1_2_1_1 */
    --skyblueFontColor: #a6bffc;
    
    /* 1_3_1_1 */
    --gridHeaderBg : #4e4e4e;
    
    /* 1_4_1_1 */
    --medicalProceduresBg1: #0e3091;
    --medicalProceduresBg2: #101525;
    --medicalProceduresBg3: #162657;
    
    /* 1_4_5_1 */
    --iconBorderBoxBgImageP1451: url("/images/content/page1/hospital_bed_white.png");
    --fegBgImageP1451_1: url("/images/content/page1/admission_icon1_white.png");
    --fegBgImageP1451_2: url("/images/content/page1/admission_icon2_white.png");
    --fegBgImageP1451_3: url("/images/content/page1/admission_icon3_white.png");
}




/* 1_1_1_1 */
.iconBorderBox.p1111::before { background-image:var(--iconBorderBoxBgImageP1111); }
.iconBorderBox.p1111 .discDesignOl > li { font-weight:300; }

.skyblueContentBox.p1111 { font-size:clamp(17px,1.042vw,20px); color:var(--fontColor555); }
.skyblueContentBox.p1111 .pageContSmallTitle { margin-bottom:8px; }
.skyblueContentBox.p1111 ol.blueBorderOl { margin-bottom:25px; }
.skyblueContentBox.p1111 ol.blueBorderOl > li,
.flexEvenGrid.p1111 ol.blueBorderOl > li { color:var(--fontColor555); }
.skyblueContentBox.p1111 ol.blueBorderOl > li .fontMedium,
.flexEvenGrid.p1111 ol.blueBorderOl > li .fontMedium { color:var(--fontColor000); }

.flexEvenGrid.p1111 { gap:20px; }
.flexEvenGrid.p1111 > div { display:flex; }
.flexEvenGrid.p1111 > div > div:nth-child(1) { flex-shrink:0; width:115px; }
.flexEvenGrid.p1111 > div > div:nth-child(2) { flex-grow:1; }

.iconSkyblue { 
    width:84px; height:84px; border-radius:16px; 
    background-color:var(--bgSkyBlue3); background-repeat:no-repeat; background-position:center center; 
}
.iconSkyblue.p1111_1 { background-image:url("/images/content/page1/icon_hospital.png"); }
.iconSkyblue.p1111_2 { background-image:url("/images/content/page1/icon_signboard.png"); }


ol.roundedNumberOl.p1111 > li:nth-child(-n+3)::before { background:#0e3799; }
ol.roundedNumberOl.p1111 > li:nth-child(n+4)::before { background:#e60000; }




@media (max-width: 767px) {                             /* var(--mobile) */
    .flexEvenGrid.p1111 { flex-direction: column; }
    .flexEvenGrid.p1111 > div > div:nth-child(1) { width:80px; }
    .iconSkyblue { width: 64px; height: 64px; border-radius: 10px; background-size: 60%; }
}
@media (min-width: 768px) and (max-width: 1023px) {     /* var(--mobile) and var(--tablet) */

}
@media (min-width: 1024px) {                            /* var(--desktop) */

}


/* 1_1_2_1 */
.skyblueContentBox.p1121 { font-size:clamp(15px,1.042vw,16px); color:var(--fontColor222); padding:50px 40px; margin:40px 0 0; }
.skyblueContentBox.p1121 .pageContSmallTitle { font-size:clamp(17px,1.042vw,20px); }
.skyblueContentBox.p1121 ol.discDesignOl > li { font-size:clamp(15px,1.042vw,16px); padding-left:15px; }
.skyblueContentBox.p1121 ol.discDesignOl > li::before { top:8px; background-color:var(--fontColor555); }

.resvTypeTabArea { display:grid; grid-template-columns: repeat(3, 1fr); position:relative; margin:0 0 40px 0; }
.resvTypeTabArea::before { content:""; display:block; position:absolute; left:0; bottom:0; right:0; width:100%; height:2px; z-index:25; background:var(--resvTypeTabAreaLineBg); }
.resvTypeTabArea > .resvTypeTabBtn {
    height:55px; line-height:55px; margin-right:-1px; position:relative; z-index:20;
    font-size:clamp(16px,1.042vw,18px); font-weight:600; color:var(--fontColor000); background:var(--resvTypeTabBtnBg); border:var(--resvTypeTabBtnBorder); 
}
.resvTypeTabArea > .resvTypeTabBtn.on {
    line-height:51px; background:var(--resvTypeTabBtnBgOn); border:var(--resvTypeTabBtnBorderOn); border-bottom:0px; z-index:30;
}



#resvWrap { display:flex; border:var(--topMenuBorder); }
#resvWrap > .resvWrap_department { flex-grow: 1; }
#resvWrap > .resvWrap_doctor { flex-grow: 1; }
#resvWrap > .resvWrap_disease { flex-grow: 1; }
#resvWrap > .resvWrap_department > div,
#resvWrap > .resvWrap_doctor > div,
#resvWrap > .resvWrap_disease > div { padding:50px 7% 40px; }
#resvWrap > .resvWrap_pt { flex-shrink:0; width:340px; background:var(--resvTypeTabAreaLineBg); padding:40px 13px; color:#fff; }
#resvWrap > .resvWrap_pt > hr { width:100%; height:1px; background:rgba(255,255,255,0.3); border:0px; margin:40px 0; }
#resvWrap > .resvWrap_pt > div { padding:0 20px; }
#resvWrap > .resvWrap_pt .rw_pt_title { font-size:clamp(20px,1.042vw,24px); font-weight:600; line-height:normal; padding:0 0 25px; }
#resvWrap > .resvWrap_pt .rw_pt_title i,
#resvWrap > .resvWrap_pt .rw_pt_title svg { font-size:clamp(23px,1.042vw,27px); margin:0 10px 0 0; }
    .rw_pt_grid { display:flex; flex-direction:column; gap:10px; }
    .rw_pt_grid > .rpgItem { display:flex; align-items: flex-start; flex-direction: row; }
    .rw_pt_grid > .rpgItem.rpgItemAlignCenter { align-items: center; }
    .rw_pt_grid > .rpgItem .rpg1 { flex-shrink:0; width:82px; position:relative; font-size:clamp(16px,1.042vw,18px); font-weight:600; line-height:normal; }
    .rw_pt_grid > .rpgItem .rpg1::after { content:""; display:block; position:absolute; right:0px; top:5px; width:2px; height:12px; background:rgba(255,255,255,0.2); }
    .rw_pt_grid > .rpgItem .rpg2 { flex-grow:1; margin-left:18px; font-size:clamp(16px,1.042vw,18px); font-weight:400; line-height:normal; }

.resvTitle1 { font-size:clamp(23px,1.042vw,30px); font-weight:600; color:var(--fontColor000); text-align:center; padding:0 0 35px; }

.resvStxWrap { display:flex; flex-direction:row; height:75px; }
.resvStxWrap > div:nth-child(1) { flex-grow:1; }
.resvStxWrap > div:nth-child(2) { flex-shrink:0; width:120px; margin:0 0 0 10px; }
.resvStxWrap > div:nth-child(3) { flex-shrink:0; width:120px; margin:0 0 0 5px; }
.resvStxWrap .resvStxInput { width:100%; height:100%; padding:0 35px; font-size:clamp(18px,1.042vw,24px); background:var(--frmInputBg); border:var(--resvTypeTabBtnBorderOn); }
.resvStxWrap .resvStxBtn { width:100%; height:100%; line-height:normal; margin:0; padding:0; border:0; font-size:clamp(17px,1.042vw,20px); font-weight:600; color:#fff; background:var(--resvTypeTabAreaLineBg); }
.resvStxWrap .resvStxClearBtn { width:100%; height:100%; line-height:normal; margin:0; padding:0; border:0; font-size:clamp(17px,1.042vw,20px); font-weight:600; color:#fff; background:#222222; }
.resvStxWrap .resvStxBtn i,
.resvStxWrap .resvStxBtn svg,
.resvStxWrap .resvStxClearBtn i,
.resvStxWrap .resvStxClearBtn svg { font-size:clamp(18px,1.042vw,23px); display:inline-block; margin:-3px 0 0 8px; vertical-align:middle; }



.resvSatTitle { font-size:clamp(17px,1.042vw,20px); font-weight:700; color:var(--fontColor000); padding:0px 0 15px; }
.resvDeptList { display: flex; gap: 10px; margin-top:40px; }
.resvDeptList .resvDeptListRow { display: flex; flex-direction: column; gap: 10px; width:30%; }
.resvDeptList .resvDeptListRow .resvDeptListItem { font-size:clamp(16px,1.042vw,18px); font-weight:500; color:var(--fontColor000); }
.resvDeptList .resvDeptListRow .resvDeptListItem > a:hover,
.resvDeptList .resvDeptListRow .resvDeptListItem > a:focus,
.resvDeptList .resvDeptListRow .resvDeptListItem.on > a { color:var(--resvTypeTabAreaLineBg); font-weight:bold; }

.stepBtnWrap { display:flex; gap:5px; height:70px; margin:50px 0 0; }
.stepBtnWrap > .stepBtnCancel { flex-shrink:0; width:220px; position:relative; }
.stepBtnWrap > .stepBtnCancel > button { width:100%; height:100%; margin:0; padding:0; border:0; background:var(--tableThBg1); font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor555); }
.stepBtnWrap > .stepBtnCancel > button::after { content:"\f104"; font-family:"Font Awesome 6 Free"; position:absolute; left:20px; top:50%; transform: translateY(-50%); font-weight:800; font-size:clamp(21px,1.042vw,24px); }
.stepBtnWrap > .stepBtnNext { flex-grow:1; position:relative; }
.stepBtnWrap > .stepBtnNext > button { width:100%; height:100%; margin:0; padding:0; border:0; background:#1f4bb4; font-size:clamp(17px,1.042vw,20px); font-weight:600; color:#fff; }
.stepBtnWrap > .stepBtnNext > button::after { content:"\f105"; font-family:"Font Awesome 6 Free"; position:absolute; right:20px; top:50%; transform: translateY(-50%); font-weight:800; font-size:clamp(21px,1.042vw,24px); }

#resvDoctorListWrap,
#resvDiseaseListWrap { max-height:530px; overflow:auto; }
.resvDoctorList { display: flex; flex-direction: column; }
.resvDoctorList .resvDoctorListItem { display: flex; gap:clamp(15px,1.042vw,35px); border:2px solid transparent; border-bottom:var(--topMenuBorder); padding:20px 20px 21px; }
.resvDoctorList .resvDoctorListItem:not(.noItem):hover,
.resvDoctorList .resvDoctorListItem.on { border:2px solid var(--resvTypeTabAreaLineBg); padding:20px 20px 20px; }
.resvDoctorListItem .doc_img { flex-shrink:0; width:clamp(80px,1.042vw,120px); }
.resvDoctorListItem .doc_img > img { width:100%; height:auto; display:block; }
.resvDoctorListItem .doc_info { flex-grow:1; display: flex; flex-direction: column; }
.resvDoctorListItem .doc_info .doc_name { 
    display:flex; align-items: center; gap:10px;
    font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); margin-bottom:15px; 
}
.resvDoctorListItem .doc_info .doc_name .dept_name { font-size:0.8em; color:var(--fontColorblue2); font-weight:500; font-family:"Noto Sans KR"; }
.resvDoctorListItem .doc_info .doc_detail { display:flex; flex-direction:column; gap:10px; }
.resvDoctorListItem .doc_info .doc_detail > .docDetailItem { display:flex; align-items: flex-start; flex-direction: row; }
.resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi1 { flex-shrink:0; width:120px; position:relative; font-size:clamp(15px,1.042vw,18px); font-weight:600; line-height:normal; }
.resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi2 { flex-grow:1; font-size:clamp(15px,1.042vw,18px); font-weight:400; line-height:normal; }

#resvCalendarTop { display: flex; justify-content: space-between; height:75px; align-items:center; background:var(--resvTypeTabBtnBg); }
#resvCalendarTop > div { font-size:clamp(21px,1.042vw,24px); color:var(--fontColor000); font-weight:600; min-width:60px; text-align:center; }
#resvCalendarTop > div > button { color:inherit; font-size:inherit; font-weight:600; margin:0; padding:10px; border:0; background:none; }

#resvCalendarWrap { display:flex; flex-wrap:wrap; margin-top:60px; }
#resvCalendarWrap .rcw1 { order:1; padding:10px clamp(5px,7%,55px) 0; flex-grow:1; border-right:var(--topMenuBorder); }
#resvCalendarWrap .rcw2 { order:3; width:100%; border-top:var(--topMenuBorder); margin-top:55px; padding:20px 0 0 40px; }
#resvCalendarWrap .rcw2 > div { position:relative; display:inline-block; line-height:28px; font-size:clamp(15px,1.042vw,16px); color:var(--fontColor000); font-weight:600; padding-left:35px; }
#resvCalendarWrap .rcw2 > div::before { content:""; display:block; position:absolute; left:0px; top:50%; transform: translateY(-50%); border:2px solid #1f4bb3; border-radius:50%; width:26px; height:26px; }
#resvCalendarWrap .rcw2 > div.rcw2_1::before { }
#resvCalendarWrap .rcw2 > div.rcw2_2::before { background:#1f4bb3; }
#resvCalendarWrap .rcw3 { order:2; padding:10px 0 0 35px; flex-shrink:0; width:260px; display:flex; flex-direction:column; justify-content: space-between; }
#resvCalendarWrap .rcw3 #resvTimeChoAlert { margin-top:30px; word-break:keep-all; font-size:clamp(16px,1.042vw,17px); font-weight:500; }
#resvCalendarWrap .rcw3 #resvTimeChoAlert #resvTimeCho_disabled { color:#ce1313; word-break:keep-all; margin-bottom:10px; font-size:0.9em; }

#resvCalendarTable { width:100%; border-collapse: separate; border-spacing: 10px; }
#resvCalendarTable > thead > tr > th,
#resvCalendarTable > tbody > tr > td { font-size:clamp(16px,1.042vw,18px); color:var(--fontColor000); font-weight:600; text-align:center; }
#resvCalendarTable > tbody > tr > td .td_date_day { min-width:40px; min-height:40px; display:flex; align-items: center; justify-content:center; }
#resvCalendarTable > tbody > tr > td .dayYoilSat { color:#1e43cd; }
#resvCalendarTable > tbody > tr > td .dayYoilSun { color:#ce1313; }
#resvCalendarTable > tbody > tr > td.today_td .td_date_day > span,
#resvCalendarTable > tbody > tr > td.today_td .td_date_day > a { display: inline-block; width:40px; height:40px; line-height:38px; border:2px solid #1f4bb3; border-radius:50%; }
#resvCalendarTable > tbody > tr > td .td_date_day > a { display: inline-block; width:40px; height:40px; line-height:38px; border:2px solid #1f4bb3; border-radius:50%; background:#1f4bb3; color:#fff; }
#resvCalendarTable > tbody > tr > td .td_date_day > a > span { color:inherit; }
#resvCalendarTable > tbody > tr > td .td_date_day.on > a { border:2px solid #01681b; background:#01681b; }


#resvTimeGrid { display:flex; flex-wrap: wrap; gap:10px; }
#resvTimeGrid button.resvTimeItemButton { min-width:100px; height:40px; margin:0; padding:0; border:0; background:transparent; border-radius:19px; font-size:clamp(16px,1.042vw,18px); color:var(--fontColor000); font-weight:600; }
#resvTimeGrid button.resvTimeItemButton.on { color:#fff; background:#1f4bb3; }
#resvTimeGrid button.resvTimeItemButton.disabled { color:#ce1313; }
#resvTimeGrid button.resvTimeItemButton.disabled.on { color:#fff; background:#ce1313; }

@media (max-width: 767px) {         /* @media (max-width: var(--mobile))  */
    .skyblueContentBox.p1121 { padding:6% 6%; }
    #resvWrap { flex-direction: column; border:0px; }
    #resvWrap > .resvWrap_department > div,
    #resvWrap > .resvWrap_doctor > div,
    #resvWrap > .resvWrap_disease > div { padding:0px 0px 40px; }
    
    .resvTypeTabArea { grid-template-columns: repeat(2, 1fr); }

    .resvStxWrap { display:flex; flex-direction:row; height:50px; }
    .resvStxWrap > div:nth-child(2) { flex-shrink:0; width:80px; margin:0 0 0 10px; }
    .resvStxWrap > div:nth-child(3) { display:none; }
    .resvStxWrap .resvStxInput { padding:0 10px; }

    .resvDeptList { flex-wrap: wrap; }
    .resvDeptList .resvDeptListRow { flex-direction: row; width:100%; flex-wrap: wrap; }
    .resvDeptList .resvDeptListRow .resvDeptListItem { flex: 1 1 40%; }
    .resvDeptList .resvDeptListRow .resvDeptListItem > a { padding:5px 5px; white-space: nowrap; display:inline-block; }


        
    .resvDoctorList .resvDoctorListItem { padding:20px 0px 21px; }
    .resvDoctorList .resvDoctorListItem:not(.noItem):hover,
    .resvDoctorList .resvDoctorListItem.on { border:2px solid var(--resvTypeTabAreaLineBg); padding:20px 0px 20px; }
    .resvDoctorListItem .doc_info { flex-grow:1; display: flex; flex-direction: column; }
    .resvDoctorListItem .doc_info .doc_name { font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); margin-bottom:15px; }
    .resvDoctorListItem .doc_info .doc_detail { display:flex; flex-direction:column; gap:10px; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem { align-items:baseline; flex-direction: column; gap:5px; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi1 { flex-shrink:1; width:100%; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi2 { flex-grow:1; }

    .stepBtnWrap > .stepBtnCancel { width:40%; }
    
    #resvCalendarWrap { margin-top:10px; }
    #resvCalendarWrap .rcw1 { padding:10px 0px 0px; border-right:0px; }
    #resvCalendarWrap .rcw2 { margin-top:20px; padding:0px 0 20px; order:2; border-top:0px; border-bottom:var(--topMenuBorder);  }
    #resvCalendarWrap .rcw3 { padding:20px 0 0; width:100%; order:3; }

    #resvCalendarTable > tbody > tr > td .td_date_day { min-width:30px; min-height:30px; }
    
    #resvWrap > .resvWrap_pt { width:100%; }
}

@media (min-width: 768px) and (max-width: 1023px) {     /* @media (min-width: var(--mobile)) and (max-width: var(--tablet))  */
    #resvWrap { border:0px; }
    #resvWrap > .resvWrap_department > div,
    #resvWrap > .resvWrap_doctor > div,
    #resvWrap > .resvWrap_disease > div { padding:0px 20px 40px 0; }
    
    #resvWrap > .resvWrap_pt { width:280px; }
    #resvWrap > .resvWrap_pt > div { padding:0 0px; }

    .resvTypeTabArea { grid-template-columns: repeat(2, 1fr); }

    .resvStxWrap { display:flex; flex-direction:row; height:50px; }
    .resvStxWrap > div:nth-child(2) { flex-shrink:0; width:80px; margin:0 0 0 10px; }
    .resvStxWrap > div:nth-child(3) { display:none; }
    .resvStxWrap .resvStxInput { padding:0 10px; }
    
    .resvDeptList { flex-wrap: wrap; }
    .resvDeptList .resvDeptListRow { flex-direction: row; width:100%; flex-wrap: wrap; }
    .resvDeptList .resvDeptListRow .resvDeptListItem { flex: 1 1 40%; }
    .resvDeptList .resvDeptListRow .resvDeptListItem > a { padding:5px 5px; white-space: nowrap; display:inline-block; }

    

        
    .resvDoctorList .resvDoctorListItem { padding:20px 0px 21px; }
    .resvDoctorList .resvDoctorListItem:not(.noItem):hover,
    .resvDoctorList .resvDoctorListItem.on { border:2px solid var(--resvTypeTabAreaLineBg); padding:20px 0px 20px; }
    .resvDoctorListItem .doc_info { flex-grow:1; display: flex; flex-direction: column; }
    .resvDoctorListItem .doc_info .doc_name { font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); margin-bottom:15px; }
    .resvDoctorListItem .doc_info .doc_detail { display:flex; flex-direction:column; gap:10px; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem { align-items:baseline; flex-direction: column; gap:5px; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi1 { flex-shrink:1; width:100%; }
    .resvDoctorListItem .doc_info .doc_detail > .docDetailItem .ddi2 { flex-grow:1; }

    .stepBtnWrap > .stepBtnCancel { width:40%; }
    
    #resvCalendarWrap { margin-top:10px; }
    #resvCalendarWrap .rcw1 { padding:10px 0px 0px; border-right:0px; }
    #resvCalendarWrap .rcw2 { margin-top:20px; padding:0px 0 20px; order:2; border-top:0px; border-bottom:var(--topMenuBorder);  }
    #resvCalendarWrap .rcw3 { padding:20px 0 0; width:100%; order:3; }

    #resvCalendarTable > tbody > tr > td .td_date_day { min-width:30px; min-height:30px; }
    
    #resvTimeGrid { gap:7px; }

}

@media (min-width: 1024px) {        /* @media (min-width: var(--desktop))  */
}


/* 1_1_2_2 */
.resvResultWrap { text-align:center; padding:0px 0 20px; }
.resvResultBg { height:270px; background:url("/images/regiResult.png") no-repeat calc(50% - 20px) top; }
.resvResultText1 { font-size:36px; color:var(--fontColorblue2); }
.resvResultText2 { font-size:clamp(16px,1.042vw,18px); color:var(--fontColor555); padding:5px 0 30px; }
.resvResultBtnWrap { text-align:center; padding:50px 0 0; }
.resvResultBtnWrap > a { display:inline-block; width:220px; max-width:40%; height:60px; line-height:60px; font-size:clamp(17px,1.042vw,20px); font-weight:600; border-radius:5px; margin:0 10px; }
.resvResultBtnWrap > a.resvResultHomeBtn { color:var(--fontColor555); background:var(--bgDeptListItem); border:var(--topMenuBorder); }
.resvResultBtnWrap > a.resvResultHomeBtn:hover { color:#fff; background:var(--bgDarkGray222); border:1px solid var(--bgDarkGray222); }
.resvResultBtnWrap > a.resvResultListBtn { color:#fff; background:var(--bgBlue3); border:1px solid var(--bgBlue3); }
.resvResultBtnWrap > a.resvResultListBtn:hover { background:var(--bgBlue2); border:1px solid var(--bgBlue2); }
.basicInfoTable.p1122 > tbody > tr > td { text-align:left; }


/* 1_1_3_1 */
.iconBorderBox.p1131::before { background-image:var(--iconBorderBoxBgImagep1131); }

.skyblueContentBox.p1131 { margin-bottom:30px; }
.skyblueContentBox.p1131 ol.blueBorderOl > li { color:var(--fontColor555); }



.CertificateDocumentTable {  }
.CertificateDocumentTable > tbody > tr > th { text-align:center; font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); padding:30px 0; border-bottom:var(--topMenuBorder); border-top:2px solid #545a63; background:#f4f5f8; }
.CertificateDocumentTable > tbody > tr > td { text-align:center; font-size:clamp(17px,1.042vw,20px); font-weight:400; color:var(--fontColor000); padding:30px 0; border-bottom:var(--topMenuBorder); border-right:var(--topMenuBorder); word-break:keep-all; }
.CertificateDocumentTable > tbody > tr > td:last-child { border-right:0px; }



/* 1_2_1_1 */
.skyblueContentBox.p1211 { color:var(--fontColor222); margin-bottom:50px; font-size:clamp(15px,1.042vw,16px); }
.skyblueContentBox.p1211 .pageContSmallTitle { font-size:clamp(17px,1.042vw,20px); margin-bottom:15px; }
.skyblueContentBox.p1211 ol.discDesignOl > li { font-size:clamp(15px,1.042vw,16px); padding-left:15px; }
.skyblueContentBox.p1211 ol.discDesignOl > li::before { background-color:var(--fontColor555); top:8px; }
.skyblueContentBox.p1211 ol.discDesignOl > li:nth-last-child(-n+2) { color:var(--skyblueFontColor); font-weight:600; }


.resvCancelBtn { margin:0; padding:clamp(5px,1.042vw,10px) clamp(10px,1.042vw,20px); border:0; font-size:clamp(16px,1.042vw,18px); color:#fff; font-weight:600; border-radius:5px; background:#ff5e5e; }
.resvOKspan { display:inline-block; line-height:35px; padding:0 5px; font-size:clamp(16px,1.042vw,18px); color:#fff; font-weight:600; border-radius:5px; background:#1b3c88; }



/* 1_3_1_1 */
.skyblueContentBox.p1311 .pageContSmallTitle { margin-bottom:15px; }
.skyblueContentBox.p1311 .pageContSmallTitle:not(:first-child) { margin-top:50px; }

.flexEvenGrid.p1311 { gap:24px; color:var(--fontColor000); text-align:center; counter-reset:cnt; }
.flexEvenGrid.p1311 > div { position:relative; display:flex; flex-direction: column; border:var(--topMenuBorder); }
.flexEvenGrid.p1311 > div::before { 
    position:absolute; left:0; top:0; width:60px; height:60px; line-height:58px; border-bottom-right-radius:30px; background:#333;
    counter-increment:cnt; content:"0"counter(cnt); font-size:clamp(20px,1.042vw,24px); font-weight:600;  color:#fff; 
}
.flexEvenGrid.p1311 > div:not(:first-child)::after { content: "\f105"; font-family:"Font Awesome 6 Free"; font-weight: 800; font-size:20px; position:absolute; left:-18px; top:50%; transform:translateY(-50%); }
.flexEvenGrid.p1311 > div > div:nth-child(1) { display:flex; align-items: center; justify-content:center; height:100px; background:var(--gridHeaderBg); font-size:clamp(20px,1.042vw,24px); font-weight:600; padding:0 60px; line-height:1.5em; }
.flexEvenGrid.p1311 > div > div:nth-child(2) { display:flex; align-items: center; justify-content:center; height:100px; font-size:clamp(15px,1.042vw,18px); line-height:1.5em; }

.flexEvenGrid.p1311_2 ol.blueBorderOl > li { color:var(--fontColor555); }
.skyblueContentBox.p1311_2 ol.blueBorderOl > li .fontMedium,
.flexEvenGrid.p1311_2 ol.blueBorderOl > li .fontMedium { color:var(--fontColor000); }

.flexEvenGrid.p1311_2 { gap:20px; }
.flexEvenGrid.p1311_2 > div { display:flex; }
.flexEvenGrid.p1311_2 > div > div:nth-child(1) { flex-shrink:0; width:115px; }
.flexEvenGrid.p1311_2 > div > div:nth-child(2) { flex-grow:1; }

.iconSkyblue.p1311_2_1 { background-image:url("/images/content/page1/icon_pay.png"); }


.skyblueContentBox.p1311_2 { font-size:clamp(17px,1.042vw,20px); color:var(--fontColor555); }

.flexEvenGrid.p1311_3 { gap:25px; margin:25px 0 0; }
.flexEvenGrid.p1311_3 > div { display:flex; flex-direction: column; flex-wrap: wrap; gap:10px; padding:30px 25px; background-color:var(--bgDeptListItem); border:var(--topMenuBorder); }
.flexEvenGrid.p1311_3 > div > div:nth-child(1) { font-size:clamp(17px,1.042vw,20px); color:var(--fontColor000); font-weight:600; min-height:70px; }
.flexEvenGrid.p1311_3 > div > div:nth-child(2) { display:flex; justify-content:space-between; gap:10px; height:50px; }
.flexEvenGrid.p1311_3 > div > div:nth-child(2) > div { width:50%; }
.flexEvenGrid.p1311_3 > div > div:nth-child(2) > div > a { width:100%; }





.RequiredDocumentsTable { border-top:var(--tableTopBorder); background:var(--iconBorderBoxBeforeBg); border-collapse:collapse; }
.RequiredDocumentsWrap .RequiredDocumentsTable { margin:40px auto; }
.RequiredDocumentsTable > thead > tr > th,
.RequiredDocumentsTable > tbody > tr > th,
.RequiredDocumentsTable > tbody > tr > td { color:var(--fontColor000); border:var(--topMenuBorder); word-break:keep-all; }

.RequiredDocumentsTable > thead > tr > th { background:var(--tableThBg2); padding:15px 5px; }
.RequiredDocumentsTable > tbody > tr > th { background:var(--tableThBg1); padding:15px 5px; }

.RequiredDocumentsTable > tbody > tr > td { padding:10px; }


.iconSkyblue.p1311_2_2 { background-image:url("/images/content/page1/icon_loca.png"); }


@media (max-width: 767px) {         /* @media (max-width: var(--mobile))  */
    .flexEvenGrid.p1311 { flex-direction: column; gap:60px; }
    .flexEvenGrid.p1311 > div:not(:first-child)::after { content: "\f107"; font-size:25px; left:50%; top:-30px; transform:translate(-50%,-50%); }
    
    
    .flexEvenGrid.p1311_2 > div > div:nth-child(1) { width:80px; }

    
    .flexEvenGrid.p1311_3 { gap:20px; margin:25px 0 0; flex-direction: column; }
    .flexEvenGrid.p1311_3 > div > div:nth-child(1) { min-height:auto; margin:0 0 20px; }
}

@media (min-width: 768px) and (max-width: 1023px) {     /* @media (min-width: var(--mobile)) and (max-width: var(--tablet))  */
    .flexEvenGrid.p1311 { flex-direction: column; gap:60px; }
    .flexEvenGrid.p1311 > div:not(:first-child)::after { content: "\f107"; font-size:25px; left:50%; top:-30px; transform:translate(-50%,-50%); }
    
    
    .flexEvenGrid.p1311_2 > div > div:nth-child(1) { width:80px; }

    
    .flexEvenGrid.p1311_3 { gap:20px; margin:25px 0 0; flex-direction: column; }
    .flexEvenGrid.p1311_3 > div > div:nth-child(1) { min-height:auto; margin:0 0 20px; }
    
}

@media (min-width: 1024px) {        /* @media (min-width: var(--desktop))  */
}



/* 1_4_1_1 */
.medicalProceduresWrapper { text-align:center; width:90%; margin:0 auto; max-width:1200px; }
.medicalProcedures { font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); padding:5px; position:relative; display:flex; align-items: center;  justify-content: center; line-height:normal; }
.medicalProcedures > div {  }
.medicalProcedures1 {
    width: 40%; min-height:90px; color:#fff;
    margin: 0 auto var(--medicalProceduresSpace);
    background:var(--medicalProceduresBg1); border:1px solid var(--medicalProceduresBg1); 
}

.medicalProcedures1::before {
    content: "";
    position: absolute;
    top: calc(100% + 1px);
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg1);
}
.medicalProcedures1 > div > p { padding-top:5px; font-weight:400; color:inherit; font-size:clamp(17px,1.042vw,20px); }

.medicalProcedures2 {
    width: 40%; min-height:90px; border:var(--topMenuBorder); border-top:2px solid var(--medicalProceduresBg1);
    margin: 0 auto var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg2); 
}

.medicalProcedures2::before {
    content: "";
    position: absolute;
    top: calc(100% + 1px);
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg1);
}


.medicalProcedures3Wrapper {
    position: relative; padding-top:var(--medicalProceduresSpace);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.medicalProcedures3Wrapper::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 25%;
    width: 50%;
    height: 2px;
    background: var(--medicalProceduresBg1);
}

.medicalProcedures3Wrapper::after {
    display: none;
    content: "";
    position: absolute;
    left: -20px;
    bottom: -30px;
    width: calc(100% + 20px);
    height: 2px;
    background: var(--medicalProceduresBg1);
}

.medicalProcedures3Wrapper > li {
    position: relative;
}

.medicalProcedures3Wrapper > li::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg1);
}

.medicalProcedures3 {
    width: 80%; min-height:60px; border:var(--topMenuBorder);
    margin: 0 auto var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg3);
}

.medicalProcedures3:not(.noMoreLine)::before {
    content: "";
    position: absolute;
    top: calc(100% + 1px);
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: var(--medicalProceduresSpace);
    background: var(--medicalProceduresBg1);
}

.medicalProcedures3::after {
    display: none;
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translate(-100%, -50%);
    width: var(--medicalProceduresSpace);
    height: 2px;
    background: var(--medicalProceduresBg1);
}


.medicalProcedures4 {
    width: 80%; min-height:60px; margin:0 auto; border:var(--topMenuBorder);
    background: var(--medicalProceduresBg2);  position:relative;
}

.medicalProcedures4::before {
    content: "퇴원 후 외래 치료"; text-align:center; font-size:clamp(15px,1.042vw,16px); font-weight:400; padding:6px 0 3px 0; 
    position: absolute;
    bottom: 50%;
    right: calc(100% + 1px);
    width: 76%;
    border-bottom:2px solid var(--medicalProceduresBg1); border-left:2px solid var(--medicalProceduresBg1);
}

.medicalProcedures4::after {
    content: ""; 
    position: absolute; border-top:2px solid var(--medicalProceduresBg1); border-right:2px solid var(--medicalProceduresBg1);
    bottom: calc(50% + 21px); transform:rotate(-45deg);
    right: calc(176% - 5px);
    width: 10px; height:10px;
}


@media (max-width: 767px) {         /* @media (max-width: var(--mobile))  */
    .medicalProceduresWrapper { width:100%; }
    .medicalProcedures1,
    .medicalProcedures2 { width:80% }
    .medicalProcedures3,
    .medicalProcedures4 { width:96%; }
}

@media (min-width: 768px) and (max-width: 1023px) {     /* @media (min-width: var(--mobile)) and (max-width: var(--tablet))  */
    
}

@media (min-width: 1024px) {        /* @media (min-width: var(--desktop))  */
}




/* 1_4_2_1 */
.pageDeptList { display:flex; flex-wrap: wrap; gap:25px; text-align:center; }
.pageDeptList .pageDeptItem { flex: 0 1 calc(16.66% - 25px); height:150px; border:var(--topMenuBorder); }
.pageDeptList .pageDeptItem > a { display: flex; flex-direction: column; align-items: center; justify-content: center; width:100%; height:100%; background:var(--iconBorderBoxBeforeBg); border:5px solid transparent; }
.pageDeptList .pageDeptItem > a:hover,
.pageDeptList .pageDeptItem > a:focus { border:5px solid #0063dd; }
.pageDeptList .pageDeptItem > a > .mdiIcon { width:100%; height:57px; background-repeat:no-repeat; background-position:center center; }
.pageDeptList .pageDeptItem > a > .mdiName { font-size:clamp(17px,1.042vw,20px); font-weight:600; color:var(--fontColor000); padding:2px 0; } /* font-size:clamp(16px,1.5vw,20px); */
.pageDeptList .pageDeptItem > a > .mdiName.longStr > span { font-size:0.9em; }
.pageDeptList .pageDeptItem > a > .mdiText { font-size:clamp(13px,1.042vw,14px); font-weight:600; color:var(--fontColor707070); padding:5px 0 0; }



@media (max-width: 767px) {         /* @media (max-width: var(--mobile))  */
    .pageDeptList { gap:20px; justify-content: space-between; }
    .pageDeptList .pageDeptItem { flex: 0 1 calc(50% - 10px); }
    
}

@media (min-width: 768px) and (max-width: 1023px) {     /* @media (min-width: var(--mobile)) and (max-width: var(--tablet))  */
    .pageDeptList { gap:20px; justify-content: start; }
    .pageDeptList .pageDeptItem { flex: 0 1 calc(20% - 20px); }
    
}

@media (min-width: 1024px) {        /* @media (min-width: var(--desktop))  */
}




/* 1_4_5_1 */
.iconBorderBox.p1451::before { background-image:var(--iconBorderBoxBgImageP1451); }

.flexEvenGrid.p1451 { display:flex; flex-wrap: wrap; gap:25px; margin:60px 0 0; }
.flexEvenGrid.p1451 > div { 
    flex: 1 1 calc(33.33% - 25px); min-height:235px; border:var(--topMenuBorder); background-color:var(--iconBorderBoxBeforeBg); 
    display: flex; flex-direction: column;  padding:35px 40px 30px; 
}
.flexEvenGrid.p1451 > div:nth-child(1) { background-image:var(--fegBgImageP1451_1); background-position:right 39px top 44px; background-repeat:no-repeat; }
.flexEvenGrid.p1451 > div:nth-child(2) { background-image:var(--fegBgImageP1451_2); background-position:right 37px top 38px; background-repeat:no-repeat; }
.flexEvenGrid.p1451 > div:nth-child(3) { background-image:var(--fegBgImageP1451_3); background-position:right 37px top 42px; background-repeat:no-repeat; }
.flexEvenGrid.p1451 .fegNo { color:var(--bbtBtnFontColor); font-size:clamp(15px,1.042vw,16px); font-weight:600; }
.flexEvenGrid.p1451 .fegTitle { color:var(--fontColor000); font-size:clamp(17px,1.042vw,20px); font-weight:600; padding:7px 0 30px; }
.flexEvenGrid.p1451 .fegContent { color:var(--fontColor000); font-size:clamp(16px,1.042vw,18px); font-weight:400; }

.PatientDocGuideTable.p1451 > tbody > tr > td > .fontSemiBold { color:var(--fontColor000); margin-top:20px; }
.PatientDocGuideTable.p1451 > tbody > tr > td > .fontSemiBold:first-child { margin-top:0px; }
.PatientDocGuideTable.p1451 > tbody > tr > td .fontBlue { color:var(--bbtBtnFontColor); }













.ExcelDownloadWrap { display:flex; margin-top:15px; }
.ExcelDownloadBtn { 
	height:25px; line-height:21px; margin:0; padding:0 10px 0 0; box-sizing:border-box;
	font-size:clamp(12px,1.042vw,13px); font-weight:500; color:#222; background:#e1ede1; 
	border:2px solid transparent; 
    border-image: linear-gradient(to bottom, #90ab86 0%, #2d572d 100%);
    border-image-slice: 1;
}
.ExcelDownloadBtn:hover { 
	color:#fff; background: #90ab86;
	background: linear-gradient(to bottom, #90ab86 0%, #2d572d 100%);
}
.ExcelDownloadBtn > img { margin:-2px 10px 0px -2px; display:inline-block; vertical-align:top; }



@media (max-width: 767px) {         /* @media (max-width: var(--mobile))  */
    .flexEvenGrid.p1451 { display:flex; flex-wrap: wrap; gap:25px; margin:60px 0 0; }
    .flexEvenGrid.p1451 > div { flex: 1 1 100%; min-height:auto; padding:35px 20px 30px;  }

    .PatientDocGuideTable.p1451 > tbody > tr > td { flex-direction: column; }
}

@media (min-width: 768px) and (max-width: 1023px) {     /* @media (min-width: var(--mobile)) and (max-width: var(--tablet))  */
    .flexEvenGrid.p1451 { display:flex; flex-wrap: wrap; gap:25px; margin:60px 0 0; }
    .flexEvenGrid.p1451 > div { flex: 1 1 100%; min-height:auto; padding:35px 20px 30px;  }
    
}

@media (min-width: 1024px) {        /* @media (min-width: var(--desktop))  */
}


/* 
Loading 시작 
<div id="loading_circle" ><strong>Loading...</strong><span></span></div>
*/
#loading_circle {
	margin: 80px auto;
	position: relative;
	width: 100px;
	height: 100px;
	-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
			border-radius: 50px;
	background: #ccc;
	font: 12px "Lucida Grande", Sans-Serif;
	text-align: center;
	line-height: 100px;
	color: white;
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	
}
#loading_circle:before {
	content: "";
	position: absolute;
		left: -20px;
		top: -20px;
	bottom: -20px;
		right: -20px;
	-webkit-border-radius: 70px;
		-moz-border-radius: 70px;
			border-radius: 70px;
	background: #eee;
	z-index: -2;
	-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.2);
	box-shadow: inset 0 0 10px rgba(0,0,0,0.2);
}
#loading_circle span {
	position: absolute;
	width: 0;
	height: 0;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-top: 80px solid rgba(255,255,255,0.7);
	z-index: -1;
	top: -28px;
	left: 0px;
	-webkit-animation: ticktock 5s linear infinite;
	-webkit-transform-origin: 50px 80px;
}
#loading_circle strong {
	overflow: hidden;
	display: block;
	margin: 0 auto;
	-webkit-animation: expand 2.5s linear infinite;
}

@-webkit-keyframes expand {
	0% {
			width: 0;
	}
	70% {
			width: 60px;
	}
	100% {
			width: 60px;
	}
}

@-webkit-keyframes ticktock {
	0% {
			-webkit-transform: rotate(0);
	}
	100% {
			-webkit-transform: rotate(360deg);
	}
}
/* Loading 끝 */