@import "family_checkup.css";

:root{
    /* 색상 */
    --BG-Light_Color:#F7F7FB;
    --BG-White_Color:#FFF;
    --BG-Regular_Color:#F1F1F5;
    
    --Line-Regular_Color:#E5E5EC;
    --Line-Light_Color:#F1F1F5;
    --Line-black_Color:#111;
    --Line-Disabled:#CACAD7;
    --Line-White_Color:#FFF;
    
    --Font-01_White:#FFF;
    --Font-02_black:#111;
    --Font-03_Gray:#505050;
    --Font-04_Gray:#767676;
    --Font-05_Gray_Disabled:#999;
    
    --Button-Disable:#F1F1F5;
    --Button-Light_Color:#F7F7FB;
    --Button-Regular_Gray:#E5E5EC;
    --Button-White:#FFF;
    
    --brand_color:#0161FF;
    --sub_color:#5187FF;
    --sub_color_2:#31BBA3;
    --BG-RED:#EE0000;
    --test_color:#4E545E;
    --logo_gray:#63666A;
    --logo_black:#1D252D;
    
    /* 폰트 */
    --font_size_t1: 24px;
    --font_size_t2: 20px;
    --font_size_t3: 18px;
    --font_size_t4: 16px;
    --font_size_b1: 14px;
    --font_size_b2: 12px;
    
    --line_height_t1: 34px;
    --line_height_t2: 28px;
    --line_height_t3: 26px;
    --line_height_t4: 24px;
    --line_height_b1: 20px;
    --line_height_b2: 18px;
    
    --font_weight_sb: 600;
    --font_weight_rg: 400;
    
}

.font_t1_rg {
    font-size: var(--font_size_t1, 24px);
    line-height: var(--line_height_t1, 34px);
    font-weight: var(--font_weight_rg, 400);
}

.font_t1_sb {
    font-size: var(--font_size_t1, 24px);
    line-height: var(--line_height_t1, 34px);
    font-weight: var(--font_weight_sb, 600);
}

.font_t2_rg {
    font-size: var(--font_size_t2, 20px);
    line-height: var(--line_height_t2, 28px);
    font-weight: var(--font_weight_rg, 400);
}

.font_t2_sb {
    font-size: var(--font_size_t2, 20px);
    line-height: var(--line_height_t2, 28px);
    font-weight: var(--font_weight_sb, 600);
}

.font_t3_rg {
    font-size: var(--font_size_t3, 18px);
    line-height: var(--line_height_t3, 26px);
    font-weight: var(--font_weight_rg, 400);
}

.font_t3_sb {
    font-size: var(--font_size_t3, 18px);
    line-height: var(--line_height_t3, 26px);
    font-weight: var(--font_weight_sb, 600);
}

.font_t4_rg {
    font-size: var(--font_size_t4, 16px);
    line-height: var(--line_height_t4, 24px);
    font-weight: var(--font_weight_rg, 400);
}

.font_t4_sb {
    font-size: var(--font_size_t4, 16px);
    line-height: var(--line_height_t4, 24px);
    font-weight: var(--font_weight_sb, 600);
}

.font_b1_rg {
    font-size: var(--font_size_b1, 14px);
    line-height: var(--line_height_b1, 20px);
    font-weight: var(--font_weight_rg, 400);
}

.font_b1_sb {
    font-size: var(--font_size_b1, 14px);
    line-height: var(--line_height_b1, 20px);
    font-weight: var(--font_weight_sb, 600);
}

.font_b2_rg {
    font-size: var(--font_size_b2, 12px);
    line-height: var(--line_height_b2, 18px);
    font-weight: var(--font_weight_rg, 400);
}

.font_b2_sb {
    font-size: var(--font_size_b2, 12px);
    line-height: var(--line_height_b2, 18px);
    font-weight: var(--font_weight_sb, 600);
}

.hidden {
    display: none !important;
}

.hidden_visibility {
    visibility:hidden;
}

.border_selected {
    border: 1px solid var(--brand_color, #0161FF);
}

.border_gray {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.shadow_card {
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.shadow_bottom {
    box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);
}

.gradient_blue {
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
}

.solid_white {
    background: var(--BG-White_Color, #FFF);
}

::-webkit-scrollbar {
  display: none;
}

* {
    box-sizing: border-box;
}

div:lang(en), span:lang(en), button:lang(en), input:lang(en), textarea:lang(en) {
    letter-spacing: 0em;
}

html {
    width: 100vw;
    height: 100vh;
    letter-spacing: -0.02em;
}

button {
    letter-spacing: -0.02em;
}

body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    min-height: 812px;
    background: var(--BG-Light_Color, #F7F7FB);
    box-sizing: border-box;
    color: var(--Font-02_black, #111);
    overflow-y: auto;
}

header.main_header {
    width:100%;
    display: inline-flex;
    padding: 14px 20px;
    justify-content: space-between;
    align-items: center;
    box-sizing:border-box;
    position: fixed;
    top: 0px;
    z-index: 999;
    
    background: var(--BG-White_Color, #FFF);
}

.relative {
    position: relative;
}

.main_header .logo {
    height: 24px;
}

.main_header_wrap {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
}

.header_btn_wrap {
    display: flex;
    gap: 16px;
}

.header_btn_wrap .icon {
    display: flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
}

.header_menu_btn {
    display: flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
}


/* 사이드 메뉴 */
.side_menu_wrap {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    z-index: 1000;
    width: 75%;
    background: var(--BG-White_Color, #FFF);
    display: flex;
    flex-direction: column;
}

.side_gnb_wrap {
    height: 56px;
    background: var(--BG-White_Color, #FFF);
    display: flex;
    align-items: center;
    padding: 14px 20px;
    justify-content: space-between;
}

.side_menu_wrap .login_section {
    display: flex;
    padding: 40px 24px;
    align-items: center;
    gap: 6px;
    border-bottom: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
}

.side_menu_wrap .login_section .text {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    margin-bottom: 0px;
}

.side_menu_wrap .login_section.login {
    display: flex;
    flex-direction: column;
    padding: 52px 24px 40px 24px;
    align-items: start;
    gap: 12px;
}

.side_menu_wrap .login_section.login .text_wrap {
    display: flex;
    align-items: flex-end;
    gap: 4px;
}

.side_menu_wrap .login_section.login .text_wrap .name {
    color: var(--brand_color, #0161FF);
}

.side_menu_wrap .login_section.login .log_info {
    display: flex;
    align-items: center;
    gap: 6px;
}

.side_menu_wrap .login_section.login .line {
    width: 1px;
    height: 12px;
    background: var(--Line-Regular_Color, #E5E5EC);
}





.side_gnb_wrap .icon {
    width: 28px !important;
}

.side_gnb_wrap .left_icon_wrap {
    height: 28px;
    margin-right: auto;
    display: flex;
    gap: 16px;
}

.side_menu_wrap .side_content_wrap {
    padding: 20px 0;
    position: relative;
    height: 100%;
    overflow: auto;
}

.side_menu_wrap .drop_down {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 20px 24px;
}

.side_menu_wrap .title {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    color: var(--Font-04_Gray, #767676);
}

.side_menu_wrap .drop_down .title {
    color: var(--Font-02_black, #111);
}

.side_menu_wrap .gray {
    color: var(--Font-04_Gray, #767676);
}

.side_menu_wrap .side_sub_banner {
    padding: 20px 24px;
    position: absolute;
    bottom: calc(56px + 58px);
    left: 0;
    background: var(--test_color, #4E545E);
    color: var(--Font-01_White, #FFF);
    width: 100%;
}

/* 바텀 팝업 */
.main_bottom_popup {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000;
}

.main_bottom_popup .content {
    padding: 60px 32px;
    color: var(--Font-01_White, #FFF);
    background: var(--BG-Black_Color, #111);
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-radius: 16px 16px 0px 0px;
}

.main_bottom_popup .system {
    height: 82px;
    display: flex;
    padding: 15px 20px 49px 20px;
    justify-content: space-between;
    background: var(--BG-White_Color, #FFF);
}

.main_bottom_popup .not_today {
    color: var(--Font-04_Gray, #767676);
}


/* 메인 배너 시작 */

.main_banner_wrap {
    display: flex;
    background: var(--test_color, #4E545E);
    margin-top:50px;
}

.main_banner_wrap img{
    width: 100vw;
    height: auto;
}

#main_banner_text_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

#main_banner_title {
    color: var(--Font-01_White, #FFF);
    
    margin: 0;
}

#main_banner_caption {
    color: var(--Font-01_White, #FFF);
}

/* 메인 배너 끝 */

.main_content_wrap {
    width: 100%;
    height: auto;
    padding: 0px 20px 24px 20px; /* 32px 20px 24px 20px; */
    
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.main_btn_wrap {
    display: flex;
    gap: 12px;
}

.left_btn_wrap {
    display: flex;
    width: 40%;
    height: 180px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.left_btn_box {
    display: flex;
    height: 84px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    align-self: stretch;
    
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.left_btn_text {
    color: var(--Font-02_black, #111);
    text-align: center;
}

.left_btn_box .icon {
    display: flex;
    width: 32px;
    height: 32px;
    justify-content: center;
    align-items: center;
}

.main_reservation_btn_box {
    display: flex;
    width: 60%;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    flex: 1 0 0;
    position: relative;

    border-radius: 16px;
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
}

.main_reservation_btn_box .img {
    display: flex;
    width: 124px;
    height: 118px;
    justify-content: center;
    align-items: center;

    position: absolute;
    right: 0;
    bottom: 0;
}

.main_reservation_text_wrap {
    display: flex;
    height: 46px;
    flex-direction: column;
    align-items: flex-start;
    
}

#main_reservation_title {
    color: var(--Font-01_White, #FFF);
}

#main_reservation_caption {
    color: var(--Font-01_White, #FFF);
}

.main_save_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
}

.main_save_wrap > * {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}

.save_title_wrap {
    display: flex;
    padding: 0px 2px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.more_btn {
    display: flex;
    align-items: center;
    gap: 2px;
    height: 20px;
}

.record_content .more_btn {
    height: 36px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 32px;
}

.more_btn_text {
    text-align: right;

    font-size: var(--font_size_b1, 14px);
    line-height: var(--line_height_b1, 20px);
    font-weight: var(--font_weight_rg, 400);
    
    color: var(--Font-04_Gray, #767676);
}

.more_btn .icon {
    display: flex;
    width: 12px;
    height: 12px;
}

.save_content_box {
    height: 156px;
    align-self: stretch;

    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

/* 독바 시작 */
.dock_bar {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
    height: 90px;
    position: fixed;
    bottom: 0px;
    left: 0;
    z-index: 100;
    
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);
}

.dock_btn_wrap {
    display: flex;
    padding-bottom: 2px;
    height: 56px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    flex: 1 0 0;

    background: var(--BG-White_Color, #FFF);
}

.dock_btn_wrap .icon {
    display: flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
}

.dock_text {
    width: 62px;

    color: var(--Font-04_Gray, #767676);
    text-align: center;

    font-size: var(--font_size_b2, 12px);
    line-height: var(--line_height_b2, 18px);
    font-weight: var(--font_weight_rg, 400);
}
/* 독바 끝 */





/* ===== 건강검진 탭 시작 ===== */





header.medical_header {
    display: flex;
    width: 100%;
    height: 52px;
    padding-left: 8px;
    align-items: flex-start;
    position: fixed;
    background: var(--BG-White_Color, #FFF);
    z-index: 998;
}

.medical_header > * {
    height: 48px;
}


.medical_header_btn {
    display: flex;
    padding: 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    
    font-size: var(--font_size_t4);
    line-height: var(--line_height_t4);
    font-weight: var(--font_weight_sb);
}

.individual_btn {
    color: var(--Font-05_Gray_Disabled, #999);
    height: 100%;
}

.corporation_btn {
    color: var(--Font-05_Gray_Disabled, #999);
    height: 100%;
}
.individual_btn.on {
    color: var(--brand_color, #0161FF);
}

.corporation_btn.on {
    color: var(--brand_color, #0161FF);
}

.medical_content_wrap {
    width: 100%;
    top: 104px;
    padding: 0;
    margin-top: 52px;
    height: auto;
    overflow-y: scroll;
}


/* 이벤트 배너 */
.event_banner_wrap {
    display: flex;
    width: 100%;
    height: 40px;
    justify-content: center;
    align-items: center;
    
    background: var(--test_color, #4E545E);
    color: var(--Font-01_White, #FFF);
    
    font-size: var(--font_size_b1, 14px);
    line-height: var(--line_height_b1, 20px);
    font-weight: var(--font_weight_rg, 400);
}

.medical_content_box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 32px;
}

.medical_content_box .btn_wrap {
    display: flex;
    padding: 32px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
    
    background: var(--BG-White_Color, #FFF);
}

.medical_content_box .btn_box_wrap {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
}

.medical_content_box .title {
    padding: 0 2px;
}


.medical_content_box .btn_card {
    height: 115px;
    align-self: stretch;
    padding: 16px;
    position: relative;

    border-radius: 16px;
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
}

.medical_content_box .btn_card .img {
    display: flex;
    height: 100%;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    
    position: absolute;
    bottom: 0;
    right: 0;
}

.btn_text_wrap {
    display: flex;
    height: 46px;
    flex-direction: column;
    align-items: flex-start;
    flex-shrink: 0;
    
    position: absolute;
    top: 16px;
    left: 16px;
    
    color: var(--Font-01_White, #FFF);
}

.medical_content_box #btn_title {
    font-size: var(--font_size_t3, 18px);
    line-height: var(--line_height_t3, 26px);
    font-weight: var(--font_weight_sb, 600);
}

.medical_content_box #btn_caption {
    font-size: var(--font_size_b1, 14px);
    line-height: var(--line_height_b1, 20px);
    font-weight: var(--font_weight_rg, 400);
}

.medical_content_box .btn_list {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.btn_list .btn_item {
    display: flex;
    width: 25%;
    padding: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.btn_list #btn_text,
.btn_list #btn_text1,
.btn_list #btn_text2,
.btn_list #btn_text3,
.btn_list #btn_text4 {
    text-align: center;
    color: var(--Font-03_Gray, #505050);
    font-size: var(--font_size_b2, 12px);
    line-height: var(--line_height_b2, 18px);
    font-weight: var(--font_weight_rg, 400);
}

.program_content_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.program_title_wrap,.caution_title_wrap {
    display: flex;
    padding: 0px 2px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.program_title,.caution_title {
    color: var(--Font-02_black, #111);

    font-size: var(--font_size_t2, 20px);
    line-height: var(--line_height_t2, 28px);
    font-weight: var(--font_weight_sb, 600);
}

.program_content_box {
    display: flex;
    height: 136px;
    padding: 20px;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;

    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.card_info {
    display: flex;
    height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
}

.card_info_top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
}

#hospital_name {
    color: var(--Font-02_black, #111);

    font-size: var(--font_size_t4, 16px);
    line-height: var(--line_height_t4, 24px);
    font-weight: var(--font_weight_sb, 600);
}

.address_distance_wrap {
    color: var(--Font-04_Gray, #767676);
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.divider {
    width: 1px;
    height: 8px;
    display: flex;

    background: var(--Line-Disabled, #CACAD7);
}

.program_content_box img{
    width: 70px;
    height: 70px;
    border-radius: 8px;
}

.program_price {
    color: var(--brand_color, #0161FF);
    
    font-size: var(--font_size_t4, 16px);
    line-height: var(--line_height_t4, 24px);
    font-weight: var(--font_weight_sb, 600);
}




/* 검진기관 안내 페이지 시작 */

/* sub_gnb 컴포넌트 시작 */
.sub_gnb {
    display: flex;
    align-items: center;
    width: 100%;
    height: 56px;
    position: fixed;
    z-index: 1002;
    top: 0;
    
    background: var(--BG-White_Color, #FFF);
}

.sub_gnb.clear {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.00) 100%);
}

.sub_gnb_text {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sub_gnb .icon {
    width: 28px;
    height: 28px;
}

.sub_gnb .right_icon_wrap {
    display: inline-flex;
    position: absolute;
    right: 20px;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 16px;
}

.sub_gnb > img {
    position: absolute;
    left: 20px;
}
/* sub_gnb 컴포넌트 끝 */



.event_section {
    display: flex;
    width: 100%;
    padding: 6px 20px;
    align-items: flex-start;
    background: var(--BG-White_Color, #FFF);
    position: fixed;
    top: 56px;
    z-index: 999;
}

.event_section .event {
    display: flex;
    width: 100%;
    padding: 6px 0;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.filter_wrap {
    display: flex;
    padding: 10px 20px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    display: flex;
    overflow-x: auto;
    position: fixed;
    top: 56px;
    background: var(--BG-White_Color, #FFF);
    z-index: 998;
}

.filter_item {
    display: flex;
    height: 36px;
    padding: 9px 12px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 18px;
    background: var(--BG-Light_Color, #F7F7FB);
}


/* 하단 카드 컨텐츠 영역 시작 */

.examination_institution_contents_wrap {
    display: flex;
    width: 100%;
    padding: 0 20px;
    height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    position: absolute;
    top: 110px;
    overflow-y: auto;
}

.examination_institution_contents_wrap .content_card {
    display: flex;
    width: 100%;
    padding: 20px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;

    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.examination_institution_contents_wrap .content_card:first-of-type {
    margin-top: 24px;
}

.examination_institution_contents_wrap .content_card:last-of-type {
    margin-bottom: 24px;
}

.examination_institution_contents_wrap .card_top {
    display: flex;
    justify-content: space-between;
    align-items: top;
    align-self: stretch;
}

.examination_institution_contents_wrap .card_top img {
    width: 64px;
    height: 64px;
    border-radius: 8px;
}

.examination_institution_contents_wrap .card_info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.examination_institution_contents_wrap .info_top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}

.examination_institution_contents_wrap .sub_text_wrap, .examination_products_contents_wrap .sub_text_wrap {
    display: flex;
    align-items: center;
    gap: 4px;
}

.examination_institution_contents_wrap .type1, .examination_products_contents_wrap .type1 {
    color: var(--sub_color, #5187FF);
}

.examination_institution_contents_wrap .type2, .examination_products_contents_wrap .type2 {
    color: var(--sub_color_2, #31BBA3);
}

.examination_institution_contents_wrap .card_bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.rating_wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    visibility: hidden;
}

.rating_wrap .icon {
    width: 16px;
}

.rating_number {
    color: var(--brand_color, #0161FF);
}

.examination_institution_contents_wrap .partnership {
    color: var(--Font-04_Gray, #767676);
}

/* 검진기관 안내 페이지 끝 */

.examination_products_contents_wrap {
    display: flex;
    width: 100%;
    padding: 0 20px;
    height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    position: absolute;
    top: 100px;
    overflow-y: auto;
}

.examination_products_contents_wrap .content_card {
    display: inline-flex;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    width: 100%;

    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
    margin-bottom:20px;
}

.examination_products_contents_wrap .content_card:first-of-type {
    margin-top: 24px;
}

.examination_products_contents_wrap .content_card:last-of-type {
    margin-bottom: 24px;
}

.examination_products_contents_wrap .card_top {
    display: flex;
    justify-content: space-between;
    align-items: top;
    align-self: stretch;
}

.examination_products_contents_wrap .card_top img {
    width: 86px;
    height: 86px;
    border-radius: 8px;
}

.examination_products_contents_wrap .card_info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.examination_products_contents_wrap .hospital {
    color: var(--Font-04_Gray, #767676);
}

.examination_products_contents_wrap .card_bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}
            
.card_bottom_left_wrap {
    display: flex;
    align-items: center;
    gap: 32px;
}

.bottom_left_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.item_text1 {
    color: var(--Font-04_Gray, #767676);
}

.right_item_text2 {
    display: flex;
    align-items: flex-start;
}

.card_bottom_right_wrap .right_item_text2 {
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 3px;
}

.card_bottom_right_wrap .item_text1 {
    text-align: right;;
}

/* 검진기관 상세 시작 */

.hospital_detail_contents_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
    transform: translateY(-44px);
    
    background: var(--BG-White_Color, #FFF);
}

.contents_wrap_top > img {
    width: 100%;
    height: 200px;
}



.contents_wrap_top {
    width: 100%;
    display: flex;
    gap: 32px;
    flex-direction: column;
}

.hospital_wrap {
    display: flex;
    width: 100%;
    padding: 0 20px;
    gap: 24px;
    flex-direction: column;
    position: relative;
}

.hospital_info_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hospital_info {
    display: flex;
    flex-direction: column;
}

.hospital_info_wrap .divider {
    width: 1px;
    height: 10px;
    margin-top: 3px;

    background: var(--Line-Disabled, #CACAD7);
}

.sub_text_wrap {
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 8px;
}

.hospital_button .icon {
    width: 20px;
}

.hospital_button_wrap {
    display: flex;
    gap: 12px;
}

.hospital_button {
    width: 50%;
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 4px;
    
    padding: 14px;
    border-radius: 6px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.rectangle {
    width: 100%;
    height: 10px;
    
    background: var(--BG-Regular_Color, #F1F1F5);
}

.content_wrap_bottom {
    display: flex;
    flex-direction: column;
}

.announcement_title_wrap {
    display: flex;
    gap: 8px;
}

.announcement_title_wrap .icon {
    width: 20px;
}

.announcement_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 20px 16px 20px;
}

.announcement_box {
    display: flex;
    padding: 8px 16px;
    border-radius: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
    gap: 32px;
    align-items: flex-start;
}

.announcement_box .caption {
    overflow: hidden;
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    flex: 1;
}

.announcement_box .icon {
    width: 16px;
    margin-top: 4px;
}

.category_content_section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}



.category_content_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px 20px 130px 20px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.product_info_card {
    width: 100%;
    padding: 20px;
    display: flex;
    gap: 16px;
    flex-direction: column;
    
    
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.product_info_card:last-of-type {
    margin-bottom: 32px;
}

.product_info {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.product_info_top{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.product_info_top .caption{
    color: var(--Font-04_Gray, #767676);
}


.product_info_price_wrap {
    margin-left: auto;
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 5px;
}

.product_info_card_btn {
    border: none;
    height: 44px;
    color: var(--Font-01_White, #FFF);
    border-radius: 6px;
    background: var(--brand_color, #0161FF);
}


/* 검진 프로그램 페이지 시작 */
.program_page_content_wrap {
    width: 100%;
    padding-top: 83px;
    padding-bottom: 186px;
}

.program_base_wrap {
    width: 100%;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.program_base_card {
    display: flex;
    flex-direction: column;
    padding: 20px;
    gap: 16px;
    
    border-radius: 16px;
    border: 1px solid var(--sub_color, #5187FF);
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.12);
}

.program_base_card_info_wrap {
    display: flex;
    flex-direction: column;
    padding: 0 2px;
    gap: 12px;
}

.program_info_top {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.program_info_price_wrap {
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 5px;
    margin-left: auto;
}
.program_base_card .caption {
    color: var(--Font-04_Gray, #767676);
}

.program_base_card .sub_title {
    color: var(--brand_color, #0161FF);
}

.program_base_card .title_wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.program_base_card_button_wrap {
    width: 100%;
    display: flex;
    gap: 12px;
    align-self: stretch;
}

.program_base_card_button_wrap button {
    border: none;
    display: flex;
    height: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--Button-Light_Color, #F7F7FB);
    flex: 1;
    color: var(--Font-02_black, #111);
}

.base_program_wrap .base_subtext, .base_title_wrap .base_subtext {
    color: var(--Font-04_Gray, #767676);
}

.base_program_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.base_title_wrap {
    display: flex;
    padding: 0px 2px;
    flex-direction: column;
    gap: 6px;
}

.base_card_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.base_card {
    display: flex;
    width: 100%;
    height: 72px;
    padding: 24px 20px;
    justify-content: space-between;
    
    border-radius: 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.base_right {
    display: flex;
    gap: 6px;
    align-items: center;
    height: 24px;
}

.base_card > div {
    display: flex;
}

.base_right .text {
    display: flex;
    color: var(--brand_color, #0161FF);
    align-items: center;
}

.base_right .icon {
    width: 20px;
}

.program_page_content_wrap .rectangle {
    margin: 48px 0 32px 0;
}

.select_title_wrap .select_title:last-child {
    color: var(--brand_color, #0161FF);
}

.select_title_wrap .title_wrap {
    display: flex;
    gap: 3px;
}

.select_caption {
    color: var(--Font-04_Gray, #767676);
}

.select_title_wrap {
    display: flex;
    padding: 0px 2px;
    flex-direction: column;
    gap: 6px;
}

.select_program_wrap {
    display: flex;
    padding: 0px 20px;
    flex-direction: column;
    gap: 20px;
}

.select_program_content_wrap_big {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.select_subtitle_wrap {
    display: flex;
    padding-left: 2px;
    align-items: center;
    gap: 8px;
}

.select_subtitle_wrap .right_text_wrap span:first-child {
    color: var(--brand_color, #0161FF);
    padding-bottom: 2px;
}

.select_subtitle_wrap .right_text_wrap {
    display: flex;
    align-items: center;
    gap: 3px;
}

.select_content_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.select_card_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.select_card {
    display: flex;
    padding: 20px;
    justify-content: space-between;
    gap: 16px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.select_left_wrap {
    display: flex;
    align-items: center;
    gap: 16px;
}

.select_left_wrap .icon {
    width: 22px;
}

.select_card > img {
    width: 24px;
}

.select_info_wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.select_info_top {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.select_info_caption {
    color: var(--brand_color, #0161FF);
}

.select_subtitle_wrap .right_text_wrap .red {
    color: #E00 !important;
}

.add_program_wrap {
    display: flex;
    padding: 0px 20px;
    flex-direction: column;
    gap: 16px;
}

.add_program_content_more_btn_wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
}

.add_program_more_btn_wrap {
    display: flex;
    height: 36px;
    padding: 0 16px;
    align-items: center;
    gap: 4px;
    
    color: var(--brand_color, #0161FF);
}

.select_program_content_wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 12px;
}

.program_caution_box {
    margin: 40px 20px 0 20px;
    border-radius: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
}

.program_caution_list_wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.program_caution_list {
    display: flex;
    color: var(--Font-04_Gray, #767676);
}

.list_dot {
    width: 2px;
    height: 2px;
    background: var(--Font-04_Gray, #767676);
    margin: 8px 4px;
}


/* 바텀 시트 */
.program_bottom_sheet {
    border-radius: 16px 16px 0px 0px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);
    
    position: fixed;
    bottom: 0;
    width: 100%;
}

.bottom_sheet_handle {
    height: 40px;
}

.bottom_sheet_handle .icon {
    width: 24px;
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: 50%;
    transform: translateX(-50%);
}

.bottom_sheet_content {
    padding: 20px 20px 12px 20px;
    margin-bottom: 100px;
}

.bottom_sheet_line {
    width: 100%;
    height: 1px;
    margin-top: 24px;
    margin-bottom: 16px;
    
    background: var(--Line-Regular_Color, #E5E5EC);
}

.inspection_info_wrap {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 24px;
    padding: 0 2px;
}

.inspection_base_select_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.inspection_title_wrap  {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.inspection_price_wrap {
    display: flex;
    gap: 3px;
    color: var(--Font-03_Gray, #505050);
}

.inspection_content_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.inspection_list_wrap {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.inspection_list_title {
    display: flex;
    padding: 3px 0px;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

.inspection_list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.inspection_item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 16px;
    width: 100%;
}

.inspection_mini_box {
    display: flex;
    padding: 4px 8px;
    align-items: center;
    gap: 4px;
    height: 26px;
    
    flex-shrink: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    border-radius: 4px;
    background: var(--BG-Light_Color, #F7F7FB);
    color: var(--Font-03_Gray, #505050);
}

.inspection_mini_box > span {
    flex: 1;
    min-width: 0;
    height: 16px;
    white-space: nowrap;         /* 텍스트를 한 줄로 유지 */
    overflow: hidden;           /* 넘친 텍스트를 숨김 */
    text-overflow: ellipsis;    /* 넘친 부분에 ... 표시 */
}

.inspection_mini_box.not {
    height: 26px;
    display: flex;
    align-items: center;
    max-width: fit-content;
    border-radius: 4px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.inspection_price_wrap_mini {
    display: flex;
    gap: 3px;
    width: 90px;
    justify-content: right;
    text-align: right;
    white-space: nowrap;
    color: var(--Font-04_Gray, #767676);
}

.inspection_add_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.total_price_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2px;
}

.total_price_wrap .price_wrap {
    display: flex;
    gap: 3px;
    align-items: flex-end;
}

.total_price_wrap .price_wrap span:last-of-type {
    padding-bottom: 4px;
}

.bottom_sheet_button_wrap {
    width: 100%;
    padding: 10px 20px 44px 20px;
    justify-content: center;
    background: var(--BG-White_Color, #FFF);
    position: fixed;
    bottom: 0;
}

.bottom_sheet_button {
    width: 100%;
    height: 52px;

    border: none;
    border-radius: 12px;
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.bottom_sheet_button.on {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.total_price_wrap > span {
    padding-top: 2px;
}

.page_content_wrap {
    width: 100%;
    padding-top: 119px;
}

.date_select_title_wrap {
    padding: 0 20px;
}

.date_select_caption {
    margin-top: 12px;
}

.kmi_wrap {
    width: 100%;
    background: var(--BG-Light_Color, #F7F7FB);
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    align-items: flex-end;
}

.available_date_wrap {
    width: 100%;
    background: var(--BG-Light_Color, #F7F7FB);
    padding: 0px 20px;
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
    align-items: flex-end;
}

.available_date_right {
    margin-bottom: 2px;
}


.available_date_sub {
    color: var(--brand_color, #0161FF);
}

.date_select_caption {
    color: var(--Font-04_Gray, #767676);
}


.date_select_wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 0 20px;
}

.date_select_content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.date_select_content:last-child {
    margin-bottom: 138px;
}

.date_select_wrap .title {
    padding: 0 2px;
}

.date_select_box {
    display: flex;
    height: 52px;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}
.date_select {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background-color: transparent;
    -webkit-tap-highlight-color: transparent;
}
.date_select:focus,
.date_select:focus-visible,
.date_select:active {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}
.date_select::-webkit-focus-ring-color {
    outline: none !important;
}
.date_select:focus::-moz-focus-inner {
    border: 0 !important;
}
.date_select_box img {
    width: 24px;
}


.reservation_info_line {
    width: 100%;
    height: 1px;
    margin: 16px 0;
    
    background: var(--Line-Regular_Color, #E5E5EC);
}

.date_page_content_wrap {
    padding: 0 20px;
    width: 100%;
    padding-top: 83px;
    padding-bottom: 106px;
}

.reservation_info_card_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.reservation_info_card {
    padding: 20px;
    display: flex;
    flex-direction: column;
    margin-bottom: 32px;

    border-radius: 12px;
    border: 1px solid var(--sub_color, #5187FF);
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
}


.reservation_info_card .left_wrap .program_name {
    margin-top: 2px;
}

.reservation_info_card .detail_btn {
    display: flex;
    gap: 2px;
    align-items: center;
}


.reservation_info_card .name {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.reservation_info_card .hospital_name {
    color: var(--sub_color, #5187FF);
}

.reservation_info_card .hope_date {
    margin-bottom: 12px;
}

.reservation_info_card .date_wrap {
    display: flex;
    position: relative;
}

.reservation_info_card .date_right {
    position: absolute;
    left: 30px;
    display: flex;
    gap: 4px;
}

.info_check_wrap .title, .price_check_wrap .title_1 {
    margin-top: 32px;
    margin-bottom: 16px;
    padding: 0 2px;
}


.info_check_wrap .input_item {
    display: flex;
    align-items: center;
    position: relative;
    height: 44px;
}


.info_check_wrap input {
    position: absolute;
    left: 95px;
    right: 0;
    height: 44px;
    padding: 12px 16px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.info_check_wrap .disabled {
    background: var(--BG-Regular_Color, #F1F1F5);
}

.info_check_wrap .input_text {
    margin-left: 2px;
}

.info_check_wrap .abled {
    background: var(--BG-White_Color, #FFF);
}

.info_check_wrap button {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    left: 95px;
    right: 0;
    height: 44px;
    padding: 12px 16px;
    margin-bottom: 8px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
    background: var(--BG-White_Color, #FFF);
}

.info_check_wrap button img {
    width: 20px;
}

.info_check_wrap .input_item_button {
    display: flex;
    position: relative;
    height: 96px;
}

.input_item_button .input_text {
    padding-top: 12px;
}

.input_item_button input {
    bottom: 0;
}

.none_check_wrap {
    margin-left: 95px;
    margin-top: 10px;
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    align-items: center;
}

.bottom_consent_popup {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    
    border-radius: 24px 24px 0px 0px;
    background: var(--BG-White_Color, #FFF);
/*  box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);*/
}

.bottom_consent_popup .title {
    margin: 14px 0;
    text-align: center;
    display: flex;
    justify-content: center;
    width: 100%;
}

.bottom_consent_popup .content_wrap {
    padding: 16px 30px 24px 30px;
}

.bottom_consent_popup .all_item {
    display: flex;
    gap: 16px;
    align-items: center;
}

.bottom_consent_popup .line {
    margin: 16px 0;
    background: var(--Line-Regular_Color, #E5E5EC);
    height: 1px;
}

.bottom_consent_popup .check {
    width: 22px;
}

.bottom_consent_popup .item_wrap {
    display: flex;
    justify-content: space-between;
    padding-right: 4px;
}

.bottom_consent_popup .item_wrap .item_left {
    display: flex;
    gap: 16px;
    align-items: center;
}

.bottom_consent_popup .item_wrap {
    margin-bottom: 16px;
}

.bottom_consent_popup .item_wrap:last-of-type {
    margin-bottom: 0;
}

#last_input {
    display: flex;
    flex-direction: column;
    height: fit-content;
}

#last_input textarea {
    width: 100%;
    height: 44px;
    padding: 12px 16px;
    margin-top: 12px;
    min-height: 120px;
    align-items: flex-start;
    resize: none;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

input:disabled {
    background: var(--BG-Regular_Color, #F1F1F5);
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-05_Gray_Disabled, #999);
    opacity: 1; /* 투명도를 기본값으로 설정 */
    cursor: not-allowed; /* 비활성화 상태 커서 유지 */
}

input:focus, textarea:focus {
    outline: none !important; /* 기본 아웃라인 제거 */
    border: 1px solid var(--sub_color, #5187FF) !important;
    background: var(--BG-White_Color, #FFF) !important;
}

input:not(:placeholder-shown), textarea:not(:placeholder-shown) {
    color: var(--Font-02_black, #111) !important;
}


.date_alert_wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.date_alert {
    display: flex;
    width: 80%;
    flex-direction: column;

    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    z-index: 1001;
}

.date_alert_info_wrap {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
}

.date_alert_info_wrap .title {
    width: 100%;
    margin-top: 32px;
    height: 24px;
}

.date_alert_info_wrap .caption {
    width: 100%;
    color: var(--Font-04_Gray, #767676);
    margin-bottom: 32px;
}

.date_alert_wrap .btn_wrap {
    width: 100%;
    display: flex;
}

.date_alert_wrap .btn_wrap button {
    width: 50%;
    border: none;
    height: 52px;
}

.date_alert_wrap .btn_wrap button:first-child {
    border-bottom-left-radius: 12px;
    color: var(--Font-04_Gray, #767676);
    background: var(--BG-Light_Color, #F7F7FB);
}

.date_alert_wrap .btn_wrap button:last-child {
    border-bottom-right-radius: 12px;
    color: var(--Font-01_White, #FFF);
    background: var(--sub_color, #5187FF);
}

.consent_info_content_wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 20px;
}

.consent_info_content_wrap .main_icon {
    width: 100px;
    margin-top: 160px;
}

.consent_info_content_wrap .title {
    text-align: center;
    width: 100%;
    margin-top: 12px;
    margin-bottom: 6px;
}

.consent_info_content_wrap .caption {
    color: var(--Font-04_Gray, #767676);
}

.consent_card .check {
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.consent_card .line {
    height: 1px;
    width: 100%;
    background: var(--Line-Regular_Color, #E5E5EC);
    margin: 16px 0;
}

.consent_wrap .icon {
    width: 12px;
}

.consent_card {
    margin-top: 32px;
    width: 100%;
    padding: 24px 20px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.all_consent_wrap {
    display: flex;
    gap: 16px;
    align-items: center;
}

.consent_wrap {
    display: flex;
    padding-right: 4px;
    justify-content: space-between;
    align-items: center;
}

.consent_left {
    display: flex;
    align-items: center;
    gap: 16px;
}

.consent_card .consent_wrap:last-of-type{
    margin-top: 16px;
}

.consent_check_btn {
    width: 100% !important;
    height: 52px;
    border-radius: 0px 0px 12px 12px;
}


.login_content_wrap {
    padding: 72px 20px 0 20px;
}

.login_foreign {
    display: flex;
    margin-left: auto;
    background: none;
    border: none;
    border-bottom: 1px solid var(--Font-04_Gray, #767676);
    padding: 0 2px;
    color: var(--Font-04_Gray, #767676);
}

.login_content_wrap .id_text {
    margin: 12px 0 8px 2px;
}

.login_content_wrap input {
    display: flex;
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    margin-bottom: 16px;
    
    color: var(--Font-04_Gray, #767676);
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.login_content_wrap .password_text {
    margin: 16px 0 8px 2px;
}

.login_sub_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 48px;
    
    color: var(--Font-04_Gray, #767676);
}

.login_sub_wrap .keep_id {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-left: 2px;
}

.login_sub_wrap .keep_id .icon {
    width: 20px;
}

.login_sub_wrap .serch_id_password {
    display: flex;
    gap: 2px;
    align-items: center;
    margin-right: 2px;
}

.login_content_wrap .login_btn {
    display: flex;
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: none;
    margin-bottom: 16px;

    color: var(--Font-01_White, #FFF);
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
}

.login_content_wrap .login_btn_2 {
    display: flex;
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: none;
    margin-top: 8px;
    gap: 8px;
    
    color: var(--Font-03_Gray, #505050);
    border-radius: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.login_btn_2 .icon {
    width: 20px;
}

.join_membership {
    display: flex;
    margin: 0 auto;
    margin-top: 22px;
    background: none;
    border: none;
    border-bottom: 1px solid var(--brand_color, #0161FF);
    padding: 0;
    color: var(--brand_color, #0161FF);
}


.join_id_password_content_wrap {
    padding: 119px 20px 0px 20px;
    width: 100%;
}
    
    
.join_id_password_content_wrap .content_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
    
.join_id_password_content_wrap input, .code_input_wrap input {
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.join_id_password_content_wrap .nav_bar {
    height: 2px;
    background: var(--Line-Light_Color, #F1F1F5);
    width: 100%;
    margin: 16px 0 48px 0;
    display: flex;
}

.join_id_password_content_wrap .gauge {
    display: flex;
    background: var(--brand_color, #0161FF);
    width: 50%;
    height: 2px;
}

.join_id_password_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.join_id_password_content_wrap .item_wrap div {
    padding-left: 2px;
}

.join_id_password_content_wrap .caption {
    color: #E00
}

.join_id_password_content_wrap .bottom_sheet_button_wrap {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 12px 20px 36px 20px;
    justify-content: center;
    background: var(--BG-White_Color, #FFF);
}

.join_id_password_content_wrap .id_input_wrap {
    display: flex;
    gap: 8px;
    width: 100%;
}

.join_id_password_content_wrap .id_input_wrap button {
    display: flex;
    height: 52px;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    width: 30%;

    border: none;
    color: var(--Font-01_White, #FFF);
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
}

.join_id_password_content_wrap .id_input {
    width: 70%;
}

.info_entry_content_wrap {
    padding: 0px 20px 0px 20px;
    width: 100%;
    margin-top: 119px;
}

.info_entry_content_wrap .input_wrap {
    margin-top: 0;
}

.info_entry_content_wrap .title {
    margin-bottom: 16px;
}

.info_entry_content_wrap .input_item {
    display: flex;
    align-items: center;
    position: relative;
    height: 52px;
}

.info_entry_content_wrap input {
    position: absolute;
    left: 95px;
    right: 0;
    height: 52px;
    padding: 12px 16px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.info_entry_content_wrap .disabled {
    background: var(--BG-Regular_Color, #F1F1F5);
}

.info_entry_content_wrap .input_text {
    margin-left: 2px;
}

.info_entry_content_wrap .abled {
    background: var(--BG-White_Color, #FFF);
}

.info_entry_content_wrap button {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    left: 95px;
    right: 0;
    height: 52px;
    padding: 12px 16px;
    margin-bottom: 8px;
    
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
    background: var(--BG-White_Color, #FFF);
}

.info_entry_content_wrap button img {
    width: 20px;
}

.info_entry_content_wrap .input_item_button {
    display: flex;
    position: relative;
    height: 112px;
}

.info_entry_content_wrap .nav_bar {
    height: 2px;
    background: var(--Line-Light_Color, #F1F1F5);
    width: 100%;
    margin: 16px 0 48px 0;
    display: flex;
}

.info_entry_content_wrap .gauge {
    display: flex;
    background: var(--brand_color, #0161FF);
    width: 75%;
    height: 2px;
}

.join_finish_wrap .nav_bar {
    height: 2px;
    background: var(--Line-Light_Color, #F1F1F5);
    width: 100%;
    margin: 16px 0 48px 0;
    display: flex;
}

.join_finish_wrap .gauge {
    display: flex;
    background: var(--brand_color, #0161FF);
    width: 100%;
    height: 2px;
}

.join_finish_wrap .main_icon {
    width: 100px;
}

.join_finish_wrap .title {
    text-align: center;
    margin-top: 24px;
    margin-bottom: 12px;
}

.join_finish_wrap .caption {
    color: var(--Font-04_Gray, #767676);
    text-align: center;
}

.join_finish_wrap .content_wrap {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-left: 20px;
    margin-right: 20px;
    height: 100%;
}

.join_finish_wrap .content {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

.join_finish_wrap .content {
    position: absolute;
    top: 50%;
    transform: translateY(-60%);
}


/* 필터 */

.filter_sheet {
    background: var(--BG-White_Color, #FFF);
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
/*  box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);*/
    max-height: 698px;
    z-index: 1001;
}

.filter_sheet .title_wrap {
    height: 56px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 0;
}

.filter_sheet .item_wrap {
    padding: 16px 20px;
}

.filter_sheet .item_wrap.info {
    margin-bottom: 106px;
}

.filter_sheet .item_wrap.examination {
    padding: 16px 20px 16px 20px;
    overflow-y: auto;
    max-height: 486px;
    margin-bottom: 106px;
}

.filter_sheet .area_item_wrap, .filter_sheet .examination_item_wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.filter_sheet .array_item_wrap, .filter_sheet .gender_item_wrap {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 8px;
}

.filter_sheet .item {
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;

    border-radius: 8px;
    border: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-04_Gray, #767676);
}

.filter_sheet .px_44 {
    height: 44px;
}

.filter_sheet .px_48 {
    height: 48px;
}

.filter_sheet .item:focus {
    border: 1px solid var(--brand_color, #0161FF);
    color: var(--Font-02_black, #111);
}

.filter_sheet .cancle_wrap {
    width: 100%;
    height: 82px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.filter_sheet .cancle {
    width: 100%;
    display: flex;
    border: none;
    height: 48px;
    text-align: center;
    justify-content: center;
    align-items: center;

    background: var(--BG-White_Color, #FFF);
    color: var(--Font-04_Gray, #767676);
}

.filter_sheet .item_wrap_2 {
    display: flex;
    flex-direction: column;
    gap: 28px;
    width: 100%;
}

.filter_sheet .item_wrap_3 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.filter_sheet .btn_wrap {
    padding: 10px 20px;
    display: flex;
    gap: 8px;
    width: 100%;
}

.filter_sheet .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    height: 52px;
    border: none;
}

.filter_sheet .btn.no {
    width: 30%;
    background: var(--BG-Light_Color, #F7F7FB);
    color: var(--Font-05_Gray_Disabled, #999);
}

.filter_sheet .btn.ok {
    width: 70%;
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.sheet_btn_wrap {
    width: 100%;
    height: 106px;
    background: var(--BG-White_Color, #FFF);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: 1200;
    position: absolute;
    bottom: 0;
    left: 0;
}

.filter_sheet .sub_title {
    margin: 0 2px;
}

.filter_sheet .age_item_wrap, .filter_sheet .operation_item_wrap{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}


/* 검진비교 */

.compare_content_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.compare_top_content {
    display: flex;
    flex-direction: column;
    padding: 24px 20px 32px 20px;
    margin-top: 56px;
    width: 100%;

    background: var(--BG-White_Color, #FFF);;
}

.compare_top_content .title {
    padding: 0 2px;
}


.base_select_box_info {
    display: flex;
    flex-direction: column;
    padding: 20px;
    margin-top: 16px;

    border-radius: 16px;
    border: 1px solid var(--sub_color, #5187FF);
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
}

.base_select_box_info .hospital_name {
    color: var(--sub_color, #5187FF);
    margin-bottom: 2px;
    height: 20px;
}

.base_select_box_info .distance_wrap {
    margin-top: 4px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--Font-04_Gray, #767676);
}

.base_select_box_info .mini_line {
    width: 1px;
    height: 8px;
    background: var(--Line-Disabled, #CACAD7);
}

.compare_content_wrap .price_wrap {
    margin-left: auto;
    display: flex;
    gap: 3px;
}

.compare_bottom_content {
    width: 100%;
    padding: 24px 20px;
    background: var(--BG-Light_Color, #F7F7FB);
    margin-bottom: 110px;
}

.compare_bottom_content .title_wrap {
    display: flex;
    flex-direction: column;
    padding: 0 2px;
    gap: 8px;
    margin-bottom: 16px;
}

.compare_bottom_content .caption {
    color: var(--Font-04_Gray, #767676);
}

.compare_content_box_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.compare_check_box {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;

    border-radius: 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.compare_check_box img {
    width: 22px;
}

.compare_check_box .compare_select_box_info {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.compare_check_box .hospital_name {
    color: var(--sub_color, #5187FF);
}

.compare_check_box .distance_wrap {
    margin-top: 2px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--Font-04_Gray, #767676);
}

.compare_check_box .mini_line {
    width: 1px;
    height: 8px;
    background: var(--Line-Disabled, #CACAD7);
}

.compare_content_wrap .bottom_sheet_button_wrap {
    height: 110px;
}

/* 검진비교 2 */











/* 기록 */
.record_content_wrap {
    width: 100%;
    height: 100%;
    padding: 96px 20px 88px 20px;
    overflow-y: auto;
}

.record_content_wrap .record_title {
    display: flex;
    gap: 4px;
    margin-bottom: 40px;
}

.record_content_wrap .name {
    color: var(--brand_color, #0161FF);
}

.record_content_wrap .nim {
    margin-top: 5px;
}

.record_content_wrap .record_content {
    margin-bottom: 48px;
}

.record_content_wrap .title_wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 2px;
    margin-bottom: 16px;
}

.record_content_wrap .left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.record_content_wrap .confirm_wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--Font-04_Gray, #767676);
}

.record_content_wrap .update_wrap {
    display: flex;
    padding: 4px 12px;
    align-items: center;
    gap: 4px;
    height: 28px;
    
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.record_content_wrap .content_wrap {
    display: flex;
    flex-direction: column;
    padding: 24px 20px;
    gap: 24px;
    align-items: center;

    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.record_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.record_content_wrap .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.record_content_wrap .info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.record_content_wrap .text_sub {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--Font-04_Gray, #767676);
}

.record_content_wrap .line {
    width: 1px;
    height: 10px;
    background: var(--Line-Disabled, #CACAD7);
}


/* 결과 없음 */

.no_result_content_wrap {
    padding: 106px 20px 40px 20px;
    width: 100%;
    height: 100%;
    position: relative;
}

.no_result_content_wrap .no_result_title {
    display: flex;
    gap: 4px;
    margin-bottom: 40px;
}

.no_result_content_wrap .name {
    color: var(--brand_color, #0161FF);
}

.no_result_content_wrap .nim {
    margin-top: 5px;
}

.no_result_content_wrap .content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    align-items: center;
}

.no_result_content_wrap .text_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
}

.no_result_content_wrap button {
    display: flex;
    height: 44px;
    justify-content: center;
    align-items: center;
    border: none;
    padding: 0;
    width: 40%;
    
    color: var(--Font-01_White, #FFF);
    border-radius: 100px;
    background: var(--sub_color, #5187FF);
}

.no_result_content_wrap .sub_title {
    color: var(--Font-04_Gray, #767676);
}


/* 나의 기록 컴포넌트 */
.my_record_component {
    display: flex;
    padding: 24px 20px;
    gap: 24px;
    flex-direction: column;

    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.my_record_component .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.my_record_component .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.my_record_component .info_wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.my_record_component .caption_wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--Font-04_Gray, #767676);
}

.my_record_component .mini_line {
    width: 1px;
    height: 10px;
    background: var(--Line-Disabled, #CACAD7);
}

.my_record_component .more_btn {
    display: flex;
    width: 30%;
    height: 36px;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: auto;
    
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-05_Gray_Disabled, #999);
}


/* FAQ 컴포넌트 */
.faq_component {
    display: flex;
    width: 100%;
    flex-direction: column;

    border-bottom: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
}

.faq_component .base_wrap {
    display: flex;
    padding: 20px;
    align-items: center;
    justify-content: space-between;
}

.faq_component .text_wrap {
    display: flex;
    align-items: center;
    gap: 12px;
}

.faq_component .text {
    padding-right: 16px;
}

.faq_component .mark {
    color: var(--brand_color, #0161FF);
    align-self: flex-start;
}

.faq_component .open_wrap {
    display: none;
    flex-direction: column;
    padding: 0px 20px 32px 48px;
    gap: 12px;
}

.faq_component .caption {
    color: var(--Font-03_Gray, #505050);
}
.faq_component .icon {
    transform:rotate(90deg);
}
.faq_component.on .open_wrap {
    display:flex;
}
.faq_component.on .icon {
    transform:rotate(-90deg);
}



/* 검진프로그램 요약 컴포넌트 시작 */
.program_summary_component {
    background: var(--BG-White_Color, #FFF);
    border-radius: 24px 24px 0px 0px;
    position: fixed;
    bottom: 0;
    width: 100%;
    /* max-height: 572px; */
}

.program_summary_component .sheet_top {
    display: flex;
    height: 48px;
    align-items: center;
    justify-content: center;
    width: 100%;
}


.program_summary_component .info_wrap_outside {
    display: flex;
    padding: 0px 20px;
    align-items: flex-start;
    align-self: stretch;
    background: var(--BG-White_Color, #FFF);
    overflow-y: auto;
}

.program_summary_component .info_wrap {
    display: flex;
    padding: 16px 2px 0px 2px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
}

/* 짧은 바텀시트 버전 하단 라인 */
.program_summary_component .info_wrap.border {
    border-bottom: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.program_summary_component .basic_select_wrap, .place_pay_component .basic_select_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.program_summary_component .add_wrap {
    display: flex;
    padding-bottom: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.program_summary_component .title_wrap, .place_pay_component .title_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.program_summary_component .basic_select_price, .place_pay_component .basic_select_price {
    display: flex;
    gap: 3px;
    align-items: center;
    color: var(--Font-03_Gray, #505050);
}

.program_summary_component .item_wrap, .place_pay_component .item_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

.program_summary_component .select_wrap, .place_pay_component .select_wrap {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.program_summary_component .select_text, .place_pay_component .select_text {
    display: flex;
    padding: 3px 0px;
    justify-content: center;
    align-items: center;
    white-space : nowrap;
}

.program_summary_component .right_info_wrap, .place_pay_component .right_info_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.program_summary_component .info_item, .place_pay_component .info_item {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    gap: 16px;
    
    color: var(--Font-03_Gray, #505050);
}

.program_summary_component .item, .place_pay_component .item {
    display: flex;
    padding: 4px 8px;
    align-items: center;
    gap: 4px;
    word-break: break-all;
    
    border-radius: 4px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.program_summary_component .item_price, .place_pay_component .item_price {
    white-space : nowrap;
    text-align: right;
}

.program_summary_component .no_select {
    display: flex;
    padding: 4px 8px;
    align-items: center;
    
    border-radius: 4px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-05_Gray_Disabled, #999);
}


/* 총 검진 비용 */
.program_summary_component .total_wrap {
    display: flex;
    padding: 24px 22px 16px 22px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: var(--BG-White_Color, #FFF);
}

.program_summary_component .shadow {
    box-shadow: 0px -5px 24px 0px rgba(0, 0, 0, 0.08);
}

.program_summary_component .price_wrap, .place_pay_component .price_wrap {
    display: flex;
    align-items: flex-end;
    gap: 3px;
}

.program_summary_component .won, .place_pay_component .won {
    margin-bottom: 2px;
}

/* 검진프로그램 요약 컴포넌트 끝 */


/* 현장 수납 금액 컴포넌트 시작 */
.place_pay_component {
    display: flex;
    width: 100%;
    margin: 0 20px;
    flex-direction: column;
    align-items: flex-start;
}

.place_pay_component .pay_wrap {
    display: flex;
    padding: 24px 16px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;

    border-radius: 16px 16px 0px 0px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    border-bottom: none;
    background: var(--BG-Light_Color, #F7F7FB);
}


.place_pay_component .info_wrap {
    display: flex;
    padding: 16px 20px 0px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
    
    border-right: 1px solid var(--Line-Regular_Color, #E5E5EC);
    border-left: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.place_pay_component .add_wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.place_pay_component .btn_wrap {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 32px 0;
    gap: 4px;
    
    border-radius: 0px 0px 16px 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    border-top: none;
    background: var(--BG-White_Color, #FFF);
}

.place_pay_component .btn_wrap .text {
    color: var(--Font-04_Gray, #767676);
}



/* 검진 비교 컴포넌트 */
.compare_component {
    display: flex;
    flex-direction: column;

    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.compare_component .base {
    display: flex;
    align-items: center;
    position: relative;
}

.compare_component .base_item {
    display: flex;
    padding: 16px;
    gap: 4px;
    width: 50%;
}

.compare_component .icon {
    position: absolute;
    right: 16px;
    top: 18px;
}

.compare_component .base_caption {
    color: var(--Font-04_Gray, #767676);
}

.compare_component .base_item.left {
    border-right: 1px solid var(--Line-Light_Color, #F1F1F5);
}

/* content_wrap */

.compare_component .item_wrap {
    display: flex;
}

.compare_component .item {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 50%;
    padding: 8px 16px 16px 16px;
    border-right: 1px solid var(--Line-Light_Color, #F1F1F5);
}

.compare_component .title_wrap {
    display: flex;
    justify-content: space-between;
}

.compare_component .sub {
    color: var(--brand_color, #0161FF);
}

.compare_component .caption_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: var(--Font-04_Gray, #767676);
}

.compare_component .caption {
    word-break: break-all;
}



/* 체크 카드 컴포넌트 */
.check_card_component {
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.check_card_component .content_wrap {
    display: flex;
    align-items: center;
    gap: 16px;
}

.check_card_component .caption {
    padding-top: 4px;
    color: var(--brand_color, #0161FF);
}

.check_card_component .price {
    padding-top: 8px;
}

.check_card_component > .icon {
    margin-left: 16px;
}



/* 대상자 키드 컴포넌트 */
.name_card_selected_1 {
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    color: var(--Font-01_White, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.name_card_non_1 {
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-04_Gray, #767676);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.name_card_selected_2 {
    background: var(--BG-White_Color, #FFF);
    border: 1px solid var(--brand_color, #0161FF);
    color: var(--Font-03_Gray, #505050);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.name_card_non_2 {
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-04_Gray, #767676);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.name_card_dis {
    background: var(--BG-Regular_Color, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.tag_color_1 {
    border-radius: 6px;
    background: var(--BG-White_Opacity_20, rgba(255, 255, 255, 0.20));
}

.tag_color_2 {
    border-radius: 6px;
    background: var(--bg-black-opacity-3, rgba(0, 0, 0, 0.03));
}




.name_card_component {
    display: flex;
    border-radius: 16px;
    padding: 16px;
    flex-direction: column;
    gap: 10px;
}

.name_card_component .info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.name_card_component .info_item {
    display: flex;
    justify-content: space-between;
}

.name_card_component .tag_wrap, .hospital_detail_contents_wrap .tag_wrap {
    display: flex;
    gap: 6px;
}

.name_card_component .tag, .hospital_detail_contents_wrap .tag {
    display: flex;
    padding: 4px 8px;
    gap: 2px;
}


/* 검진상품 카드 컴포넌트 */
.program_card_component {
    display: flex;
    flex-direction: column;
    padding: 20px;
    gap: 24px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.program_card_component .info_top {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.program_card_component .dummy {
    width: 86px;
    height: 86px;
    border-radius: 8px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.program_card_component .type_wrap {
    display: flex;
    align-items: center;
    gap: 4px;
}

.program_card_component .type_1 {
    color: var(--sub_color, #5187FF);
}

.program_card_component .type_2 {
    color: var(--sub_color_2, #31BBA3);
}

.program_card_component .hospital, .program_card_component .adress {
    color: var(--Font-04_Gray, #767676);
}

.program_card_component .hospital {
    margin-top: 4px;
    margin-bottom: 4px;
}

.program_card_component .info_bottom, .program_info_component .info_bottom {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.program_card_component .left_wrap, .program_info_component .left_wrap {
    display: flex;
    gap: 32px;
    justify-content: space-between;
}

.program_card_component .text_1, .program_info_component .text_1{
    color: var(--Font-04_Gray, #767676);
}

.program_card_component .right .text_1, .program_info_component .right .text_1 {
    text-align: right;
}

.program_card_component .right .text_2, .program_info_component .right .text_2 {
    display: flex;
    gap: 3px;
    color: var(--brand_color, #0161FF);
}


/* DOCK */
.dock_component {
    background: var(--BG-White_Color, #FFF);
}

.dock_component .dock {
    display: flex;
    width: 100%;
}

.dock_component .item {
    width: 25%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px 0 2px 0;
    color: var(--Font-04_Gray, #767676);
}

.dock_component .item.select {
    color: var(--Font-02_black, #111);
}

.dock_component .margin {
    width: 100%;
    height: 34px;
    background: var(--BG-White_Color, #FFF);
}

.dock_component .text {
    text-align: center;
}


/* 상품안내 컴포넌트 */
.program_info_component .btn {
    width: 100%;
    height: 44px;

    border: none;
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.program_info_component {
    display: flex;
    padding: 20px;
    flex-direction: column;
    gap: 16px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.program_info_component .content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.program_info_component .info_wrap {
    display: flex;
    padding: 0px 2px;
    flex-direction: column;
    gap: 8px;
}

.program_info_component .caption {
    color: var(--Font-04_Gray, #767676);
}

.program_info_component .line {
    height: 1px;
    background: var(--Line-Light_Color, #F1F1F5);
}

.program_info_component .info_bottom {
    padding: 0px 2px;
}


/* 예약 정보 카드 컴포넌트 */
.reserve_info_card {
    display: flex;
    padding: 20px;
    flex-direction: column;
    gap: 16px;

    border-radius: 16px;
    border: 1px solid var(--sub_color, #5187FF);
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
}

.reserve_info_card .top_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2px;
}

.reserve_info_card .btn_wrap {
    display: flex;
    align-items: center;
    gap: 2px;
    border: none;
    background: var(--BG-White_Color, #FFF);
    height: 50px;
    padding: 0;
}

.reserve_info_card .hospital {
    color: var(--sub_color, #5187FF);
    margin-bottom: 2px;
}

.reserve_info_card .line {
    height: 1px;
    background: var(--Line-Light_Color, #F1F1F5);
}

.reserve_info_card .bottom_info {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 2px;
}

.reserve_info_card .date_wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.reserve_info_card .item {
    display: flex;
    position: relative;
}

.reserve_info_card .date_item {
    display: flex;
    position: absolute;
    left: 32px;
}

.reserve_info_card .date_item {
    display: flex;
    gap: 6px;
}



 #progress {
    appearance: none;
    width: 100%;
    position: fixed;
    height: 3px;
}

#progress::-webkit-progress-bar {
    background: var(--Line-Light_Color, #F1F1F5);
}

#progress::-webkit-progress-value {
    background: var(--brand_color, #0161FF);
}



/* 본인인증 */
.self_authentication {
    position: relative;
}

.self_authentication .sub_gnb {
    height: 56px;
    position: static;
}

.self_authentication .title {
    margin-top: 80px;
    margin-bottom: 32px;
}

.self_authentication .btn_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.self_authentication .btn {
    border: none;
    display: flex;
    height: 80px;
    padding: 24px;
    gap: 24px;
    align-items: center;
    width: 100%;
    border-radius: 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.self_authentication .content_wrap {
    width: 100%;
    padding: 0 20px;
}

section .sub_gnb {
    position: static;
}


/* 검진자 카드 영역 컴포넌트 */
.name_card_component_mini {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: 16px 20px;
    border-radius: 16px;
}

.name_card_component_mini .info_item {
    display: flex;
    justify-content: space-between;
}



/* 언더바 탭 컴포넌트 */
.tab_component_under_bar {
    width: 100%;
    height: 56px;
    display: flex;
    background: var(--BG-White_Color, #FFF);
}

.tab_component_under_bar .item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 0 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: var(--Font-04_Gray, #767676);
}

.tab_component_under_bar .item.select {
    border-bottom: 2px solid var(--Line-black_Color, #111);
    font-weight: 600;
    color: var(--Font-02_black, #111);
}


/* 고객사 카드 컴포넌트 */
.client_card_component {
    display: flex;
    height: 64px !important;
    align-items: center;
    gap: 8px;
    padding: 0 20px;
    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    border: none;
/*  border: 1px solid var(--Line-Regular_Color, #E5E5EC);*/
}

.client_card_component:has(input[type="checkbox"]:checked) {
    border: 1px solid var(--brand_color, #0161FF);
    padding: 0 20px;
}

.company2_content_wrap .client_card_component:has(input[type="checkbox"]:checked),
.company_serch_popup .client_card_component:has(input[type="checkbox"]:checked) {
    border: 1px solid var(--brand_color, #0161FF);
    padding: 0 19px;
}


/* 체크박스 커스텀 디자인 */
.custom-checkbox input[type="checkbox"] {
  display: none;
}

.custom-checkbox {
    display: flex;
    gap: 16px;
    align-items: center;
}

.custom-checkbox.no_email, .custom-checkbox.no_addr {
    gap: 8px;
}


/*/* 체크박스 디자인 */
.custom-checkbox .checkbox-design { /* 왜 인지, 이 부분이 없으면 컬러가 파란색으로 안 변함. 클래스명도 다른데, 왜 이 부분이 영향을 끼치는지 모르겠음. */
  width: 22px;
  height: 22px;
  border: 2px solid #E5E5EC;
  border-radius:50%; /* 둥글게 처리하려면 값 조정 */
  display: inline-block;
  position: relative;
  transition: background-color 0.3s, border-color 0.3s;
}
/* /*.custom-checkbox .checkbox-design:after {
 content: "";
 position: absolute;
 top: 2px;
 left: 7px;
 width: 6px;
 height: 10px;
 border: solid #E5E5EC;
 border-width: 0 2px 2px 0;
 transform: rotate(45deg);
} */

/* 체크박스 체크 상태 */
.custom-checkbox input[type="checkbox"]:checked + .ic_check_circle,
.custom-checkbox input[type="checkbox"]:checked + .checkbox-design {
  background: #0161FF; /* 체크 시 색상 */
  border-color: #0161FF;
}

.custom-checkbox.dis .ic_check_circle {
    background: #F1F1F5;
    border-color: #E5E5EC;
}
.custom-checkbox.dis .ic_check_item, .custom-checkbox.dis .ic_check_item::after {
    background: #FFF;
}

/* 체크 표시 (커스텀 체크마크) */
/*.custom-checkbox input[type="checkbox"]:checked + .checkbox-design::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  top: 2px;*/
/*  left: 7px;*/
/*  width: 6px;*/
/*  height: 10px;*/
/*  border: solid #fff;*/
/*  border-width: 0 2px 2px 0;*/
/*  transform: rotate(45deg);*/
/*}*/

.custom-checkbox input[type="checkbox"]:checked + .ic_check_circle .ic_check_item:after,
.custom-checkbox input[type="checkbox"]:checked + .ic_check_circle .ic_check_item {
    background: #fff;
}


/* 레이블 스타일 */
.custom-checkbox .checkbox-label {
    vertical-align: top;
}

.client_card_component .icon {
    margin-left: auto;
}

.bottom_consent_popup .item_wrap .icon {
    margin-left: 24px;
}


/* 기본검사 카드 컴포넌트 */
.base_program_card_component {
    display: flex;
    height: 72px;
    padding: 0 20px;
    align-items: center;
    justify-content: space-between;
    
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.base_program_card_component .info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.base_program_card_component .num {
    color: var(--Font-05_Gray_Disabled, #999);
}

/* 기본검사 카드 컴포넌트_상세 */
.base_program_card_component_detail {
    display: flex;
    height: 64px;
    padding: 0 20px;
    align-items: center;
    justify-content: space-between;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}


/* 필터 버튼 컴포넌트 */
.filter_btn_48 {
    display: flex;
    width: 100%;
    height: 48px;
    padding: 12px;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    
    color: var(--Font-04_Gray, #767676);
    border-radius: 6px;
    border: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
}

.filter_btn_44 {
    display: flex;
    height: 44px;
    padding: 12px;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    
    color: var(--Font-04_Gray, #767676);
    border-radius: 6px;
    border: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
}



/* 메인 컴텐츠 박스 컴포넌트 */
.main_content_box_component {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.main_content_box_component .title_wrap {
    display: flex;
    width: 100%;
    padding: 0px 2px;
    justify-content: space-between;
    align-items: center;
}

.main_content_box_component .more_btn {
    display: flex;
    height: 28px;
    padding: 4px 10px 4px 12px;
    align-items: center;
    gap: 2px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.main_content_box_component .content_box,
.medical_corporation_content .content_box
{
    display: flex;
    width: 100%;
    padding: 24px;
    flex-direction: column;
    gap: 32px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.main_content_box_component .item_wrap,
.medical_corporation_content .item_wrap {
    display: flex;
    align-items: center;
    gap: 20px;
}

.main_content_box_component .item_wrap .icon_wrap,
.medical_corporation_content .item_wrap .icon_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 100px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.main_content_box_component .info,
.medical_corporation_content .info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.main_content_box_component .sub {
    color: var(--Font-04_Gray, #767676);
}

/* 검진시 유의사항 */
.main_content_box_component .slide_wrap {
    width: 100%;
    display: flex;
    padding: 0px 20px;
    align-items: center;
    gap: 12px;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
}

.main_content_box_component .slide_content,
.medical_corporation_content .slide_content,
.medical_content_box .slide_content
{
    display: flex;
    width: 90%;
    height: 88px;
    padding: 20px;
    align-items: flex-start;
    gap: 8px;
    flex-shrink: 0;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.main_content_box_component .slide_content .text {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
}

.main_content_box_component.last {
    padding-bottom: 90px;
    transform: translateY(-8px);
}

.main_content_box_component.last .slide_wrap {
    padding-bottom: 32px
}

.main_content_box_component.last .mark {
    color: var(--brand_color, #0161FF);
}


/* 개인검진 페이지 */
.medical_content_box .bottom_wrap {
    width: 100%;
    padding-bottom: 90px;
}

.medical_content_box .section_wrap, .medical_corporation_content .section_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.medical_content_box .title_wrap, .medical_corporation_content .title_wrap {
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 0 22px;
    align-items: center;
}

.medical_content_box .more_btn, .medical_corporation_content .more_btn {
    display: flex;
    height: 28px;
    padding: 4px 10px 4px 12px;
    align-items: center;
    gap: 2px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.medical_content_box .slide_wrap, .medical_corporation_content .slide_wrap {
    display: flex;
    width: 100%;
    gap: 12px;
    padding: 0 20px 32px 20px;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
}

.medical_content_box .item, .medical_corporation_content .item {
    width: 90%;
    height: 136px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    padding: 20px;
}

.medical_content_box .info, .medical_corporation_content .section_wrap .info {
    position: relative;
    margin-right: 16px;
}

.medical_content_box .location, .medical_corporation_content .location {
    margin-top: 4px;
    color: var(--Font-04_Gray, #767676);
}

.medical_content_box .price, .medical_corporation_content .price {
    position: absolute;
    bottom: 0;
    color: var(--brand_color, #0161FF);
}

.medical_content_box .item_2, .medical_corporation_content .item_2 {
    width: 90%;
    padding: 20px;
    height: 88px;
    display: flex;
    gap: 8px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
}

.medical_content_box .mark, .medical_corporation_content .mark {
    color: var(--brand_color, #0161FF);
}

.medical_content_box .item_2 .text, .medical_corporation_content .item_2 .text {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
}

.medical_content_box .item .img_section, .medical_corporation_content .item .img_section {
    width: 70px;
    height: 70px;
    border-radius: 8px;
    background: var(--BG-Light_Color, #F7F7FB);
}


/* 기업검진 페이지*/
.select_corporation_btn {
    display: flex;
    gap: 6px;
    align-items: center;
}

.medical_header {
    position: relative;
}

.medical_header .toggle_wrap {
    position: absolute;
    right: 20px;
    top: 0;
    display: flex;
    gap: 16px;
    height: 52px;
    align-items: center;
}

.medical_header .toggle {
    display: flex;
    padding: 4px 5px 4px 12px;
    align-items: center;
    gap: 8px;
    border-radius: 100px;
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    color: var(--Font-01_White, #FFF);
}

.medical_header .toggle .icon.hide {
    transform:rotate(180deg);
}

.medical_corporation_content {
    margin-top: 52px;
}

.medical_corporation_content .name_card_section {
    width: 100%;
    height: 178px;
    background: var(--BG-Regular_Color, #F1F1F5);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06) inset, 0px -5px 10px 0px rgba(0, 0, 0, 0.06) inset;
}

.medical_corporation_content .main_btn_wrap {
    padding: 24px 20px 32px 20px;
}

.medical_corporation_content .main_reservation_btn_box {
    position: relative;
}

.medical_corporation_content .img {
    position: absolute;
    bottom: 0;
    right: 0;
}

.medical_corporation_content .content_box .img {
    position: static;
}

.medical_corporation_content .section_wrap:last-child {
    padding-bottom: 90px;
}

.medical_corporation_content .info_item.ver1 {
    color: var(--Font-03_Gray, #505050);
}

.medical_corporation_content .info_item.ver2 {
    color: var(--Font-02_black, #111);
}

.medical_corporation_content .name_card_section {
    display: flex;
    gap: 12px;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    padding: 24px 20px;
}

.medical_corporation_content .name_card_section.no_target {
    display: flex;
    padding: 24px 20px;
}



.medical_corporation_content .name_card_component {
    flex-shrink: 0;
    width: 90%;
}

.name_card_section.no_target .name_card_component {
    width: 100%;
}

.medical_corporation_content .name_card_component.dis {
    color: var(--Font-05_Gray_Disabled, #999);
}

.medical_corporation_content .name_card_component.new {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.medical_corporation_content .plus_icon_wrap {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    background: var(--sub_color, #5187FF);
}

.name_card_component.name_card_selected_2 {
    position: relative;
}

.name_card_component .discount {
    position: absolute;
    left: -6px;
    top: -14px;
    display: flex;
    padding: 4px 10px;
    align-items: center;
    gap: 4px;
    border-radius: 6px;
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
}

.name_card_component .price_discount {
    white-space: nowrap;
    color: var(--Font-01_White, #FFF);
}




/* 고객사 선택 시트 */
.sheet_select_corporation {
    width: 100%;
    background: var(--BG-Light_Color, #F7F7FB);
    border-radius: 24px 24px 0px 0px;
    position: fixed;
    bottom: 0;
    z-index: 200;
}

.sheet_select_corporation .sheet_header {
    display: flex;
    height: 56px;
    border-radius: 24px 24px 0px 0px;
    justify-content: center;
    align-items: center;
}

.sheet_select_corporation .content_wrap {
    display: flex;
    padding: 24px 20px 46px 20px;
    flex-direction: column;
    gap: 36px;
}

.sheet_select_corporation .list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sheet_select_corporation .list_plus_btn {
    display: flex;
    padding: 20px;
    gap: 16px;
    border-radius: 12px;
    align-items: center;
    border: none;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.sheet_select_corporation .btn_go_list {
    display: flex;
    padding: 14px 0;
    justify-content: center;
    align-items: center;
    background: none;
    border-radius: 100px;
    border: 1px solid var(--Line-Disabled, #CACAD7);
}



.close_btn {
   position:relative;
   width:28px;
   height:28px;
   border:none;
   background:none;
}
.close_btn:before {
   content:"";
   position:absolute;
   top:13px;
   left:0px;
   width:28px;
   height:0px;
   border-bottom:2px solid var(--Line-black_Color, #111);
   transform:rotate(45deg);
}

.close_btn:after {
   content:"";
   position:absolute;
   top:13px;
   left:0px;
   width:28px;
   height:0px;
   border-bottom:2px solid var(--Line-black_Color, #111);
   transform:rotate(-45deg);
}

.program_info_component_wrap {
    width: 100%;
    padding: 24px 20px 0 20px;
    display: flex;
    gap: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
    flex-direction: column;
}

.program_info_component:last-child {
    margin-bottom: 130px;
}

.hospital_detail_contents_wrap .btn_double {
    width: 52px;
    height: 114px;
    border-radius: 100px;
    background: linear-gradient(315deg, #FFF 50%, #F1F1F5 100%);
    box-shadow: 1px 1px 1px 0px #FFF inset, 4px 4px 10px 0px rgba(0, 0, 0, 0.08);
    position: absolute;
    right: 24px;
    top: -8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hospital_detail_contents_wrap .btn_item {
    display: flex;
    width: 52px;
    height: 52px;
    justify-content: center;
    align-items: center;
}

.hospital_detail_contents_wrap .btn_double .line {
    width: 36px;
    height: 1px;
    background: var(--Line-Regular_Color, #E5E5EC);
}

.more_btn_bottom {
    display: flex;
    width: 60%;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border-radius: 30px;
    background: linear-gradient(354deg, #FFF 4.75%, #F1F1F5 95.22%);
    box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.08), 1px 1px 1px 0px #FFF inset;
    position: fixed;
    bottom: 46px;
    color: var(--Font-03_Gray, #505050);
    padding: 18px 0;
    justify-content: center;
    align-items: center;
}

.more_btn_bottom .text {
    margin-left: 4px;
}


.page_content_wrap .client_card_component {
    margin: 0 20px 32px 20px;
}

.date_page_content_wrap .place_pay_component {
    margin: 0;
}


.price_check_wrap .service_price {
    margin-top: 24px;
    height: 82px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 16px;
    border-radius: 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-Light_Color, #F7F7FB);
}

.price_check_wrap .service_price > * {
    display: flex;
}

.price_check_wrap .service_price .info {
    align-items: center;
    gap: 4px;
}

.price_check_wrap .service_price .price_service {
    display: flex;
    gap: 3px;
}

.price_check_wrap .service_price .price_service {
    display: flex;
    align-items: flex-end;
}

.price_check_wrap .service_price .won {
    padding-bottom: 2px;
}


.date_page_content_wrap .guide {
    display: flex;
    height: 96px;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 16px;
    background: var(--BG-Light_Color, #F7F7FB);
    margin-top: 24px;
    margin-bottom: 32px;
}

.date_page_content_wrap .guide .item {
    display: flex;
    gap: 4px;
}




.ic_check_circle {
    position: relative;
    width: 22px;
    height: 22px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ic_check_item {
    display: flex;
    height: 9.5px;
    width: 2px;
    transform-origin:50% 100%;
    transform:rotate(42deg);
    background: #E5E5EC;
    border-radius: 2px;
    position: absolute;
    right: 11px;
    bottom: 6.15px;
}

.ic_check_item::after {
    content: "";
    height: 6px;
    width: 2px;
    transform-origin: 150% 115%;
    transform:rotate(-87deg);
    background: #E5E5EC;
    border-radius: 2px;
}


.filter_sheet .item_wrap_drag {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 20px 35px 20px;
}

.filter_sheet .item_wrap_drag .text_wrap {
    display: flex;
    color: var(--brand_color, #0161FF);
    gap: 6px;
    margin-top: 24px;
    margin-bottom: 32px;
}

.filter_sheet .item_wrap_drag .bar {
    width: 100%;
    height: 6px;
    background: var(--BG-Regular_Color, #F1F1F5);
    border-radius: 100px;
}





.agreement1_content_wrap {
    height: calc(100vh - 96px);
    overflow-y: auto;
    margin: 96px 20px 0px 20px;
    padding-bottom: 100px;
}

.agreement1_content_wrap .sub_title {
    margin-top: 60px;
    margin-bottom: 8px;
}

.agreement1_content_wrap .caption {
    margin-top: 12px;
}

.agreement1_content_wrap .caption_wrap {
    padding-top: 24px;
}


.join_finish_wrap {
    width: 100%;
    height: 100%;
    padding-top: 59px;
    padding-bottom: 106px;
}



.splash_wrap {
    width: 100%;
    height: 100%;
    display: flex;
}

.splash_wrap .content_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: center;
    align-items: center;
}



.foreign_email .content_wrap {
    padding: 32px 20px;
    display: flex;
    gap: 8px;
    flex-direction: column;
}

.foreign_email .email {
    display: flex;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-04_Gray, #767676);
}

.foreign_email .text {
    padding: 0 2px;
}

.foreign_email .email_input {
    display: flex;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-black_Color, #111);
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-02_black, #111);
}

.input_52 {
    width: 100%;
    display: flex;
    height: 52px;
    padding: 0 16px;
    align-items: center;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.input_52_120 {
    width: 100%;
    min-height: 160px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    resize: none;
}



.side_margin {
    margin: 0 20px;
}

.btn_52_dis {
    border: none;
    width: 100%;
    display: flex;
    padding: 14px 16px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 12px;
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.foreign_email2 .num {
    position: relative;
}

.foreign_email2 .re {
    color: var(--brand_color, #0161FF);
    border:none;
    position: absolute;
    padding: 14px 16px;
    right: 0;
    bottom: 0;
    background: none;
    border-radius: 12px;
}

.foreign_email2 .text_wrap {
    display: flex;
    justify-content: space-between;
}

.foreign_email2 .timer_wrap {
    display: flex;
    gap: 4px;
    color: var(--BG-RED, #E00);
}



.ic_radio {
    position: relative;
    width: 22px;
    height: 22px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    display: flex;
}

.ic_radio_item {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background: var(--BG-Regular_Color, #F1F1F5);
    flex-shrink: 0;
}


.foreign_email2 .item_wrap {
    display: flex;
    gap: 32px;
    margin-top: 12px;
    padding: 0 2px;
}

.foreign_email2 .item_wrap .item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.inquiry_1 {
    padding-top: 56px;
}

.inquiry_1 .content_wrap {
    padding: 32px 20px 0px 20px;
}

.bottom_sheet_button_wrap.ver2 {
    display: flex;
    gap: 8px;
}

.bottom_sheet_button_wrap .plus {
    background: var(--Button-Light_Color, #F7F7FB);
    width: 30%;
    color: var(--Font-03_Gray, #505050);
}

.bottom_sheet_button_wrap .go {
    width: 70%;
}

.client_content_wrap {
    display: flex;
    flex-direction: column;
    margin: 56px 0 160px 0;
    padding: 24px 20px;
    gap: 12px;
}

.client_content_wrap .client_card_component {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.client_content_wrap .icon {
    margin-left: auto;
}

.client_content_wrap .client_card_component .checkbox-label {
    white-space: nowrap;         /* 텍스트를 한 줄로 유지 */
    overflow: hidden;           /* 넘친 텍스트를 숨김 */
    text-overflow: ellipsis;    /* 넘친 부분에 ... 표시 */
}




/*.icon.arrow {*/
/*  transform:rotate(90deg);*/
/*}*/
/**/
/*.side_menu_wrap .drop_down { /* 드롭 다운 */
/*  display:block;*/
/*  background: lightblue;*/
/*}*/
/**/
/*.side_menu_wrap .drop_down .title {*/
/*  display:inline;*/
/*  background: green;*/
/*}*/
/**/
/*.drop_down_sub { /* 서브 메뉴 */
/*  display:block;*/
/*  align-self: stretch;*/
/*  flex-basis:auto;*/
/*  width:100%;*/
/*  height:0px;*/
/*  overflow:hidden;*/
/*  background: #fff;*/
/*/*    transform: translate(-24px, 20px);*/
/*}*/
/**/
/*.drop_down .title_wrap {*/
/*  padding: 24px 20px;*/
/*}*/
/**/
/*.drop_down_sub li {*/
/*  margin: 12px 24px;*/
/*}*/
/**/
/*.drop_down_sub li:first-child {*/
/*  padding-top: 8px;*/
/*}*/
/**/
/*.drop_down_sub li:last-child {*/
/*  padding-bottom: 8px;*/
/*}*/
/**/
/*.drop_down.on .icon.arrow {*/
/*  transform:rotate(-90deg);*/
/*}*/
/**/
/*.drop_down.on .drop_down_sub {*/
/*  height:auto;*/
/*}*/


.side_content_wrap .drop_down {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: start;
    padding: 0;
}

.side_content_wrap .title_wrap {
    width: 100%;
    padding: 20px 24px;
    display: flex;
    gap: 6px;
    align-items: center;
}


.side_content_wrap .drop_down_sub {
    width: 100%;
    display: flex;
    flex-direction: column;
    background: var(--BG-Light_Color, #F7F7FB);
    max-height: 0;
    overflow: hidden;
    transition: all 0.4s ease;
}

.side_content_wrap .drop_down_sub.on { /* 클릭할 경우 */
    max-height: 800px;
    transition: all 0.4s ease;
}


.side_content_wrap .item {
    padding: 12px 24px;
}

.side_content_wrap .item:first-child {
    padding: 12px 24px;
    margin-top: 8px;
}

.side_content_wrap .item:last-child {
    padding: 12px 24px;
    margin-bottom: 8px;
}

.side_content_wrap .drop_down_sub.on ~ .title_wrap .icon {
    transform: rotate(180deg);
}

.side_content_wrap .drop_down .icon {
    transition: transform 0.3s ease;
}


.client_content_none {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: calc(100% - 233px);
}

.client_content_none .caption {
    color: var(--Font-04_Gray, #767676);
}

.code_input_wrap {
    display: flex;
    gap: 8px;
    padding: 88px 20px 32px 20px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 24px 0px rgba(0, 0, 0, 0.03);
    flex-shrink: 0;
    width: 100%;
    z-index: 200;
}

.code_input_wrap input {
    width: 72%;
}


.code_input_wrap .btn {
    width: 28%;
    border: none;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 14px 16px;
    border-radius: 12px;
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.code_input_wrap .btn.on {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.company2_content_wrap {
    min-height: auto;
    width: 100%;
    height: 100%;
    padding-bottom: 106px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.company2_content_wrap .item_wrap {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px 20px;
    overflow-y: auto;
}



.company_serch_popup {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    background: var(--BG-White_Color, #FFF);
    border-radius: 24px 24px 0px 0px;
    z-index: 400;
    height:100%;
}

.company_serch_popup .header {
    border-radius: 24px 24px 0px 0px;
    width: 100%;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

.company_serch_popup .serch_section {
    display: flex;
    position: relative;
    height: 116px;
    justify-content: center;
    background: var(--Line-White_Color, #FFF);
}

.company_serch_popup input {
    border: none;
    width: 100%;
    display: flex;
    padding: 14px 20px 14px 46px;
    height: 52px;
    margin: 32px 20px;
    border-radius: 100px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.company_serch_popup .icon {
    position: absolute;
    top: 48px;
    left: 40px;
}

.company_serch_popup .item_wrap {
    width: 100%;
    height: 100%;
    flex-direction: column;
    gap: 12px;
    padding: 24px 20px 106px 20px;
    overflow-y: auto;
    background: var(--BG-Light_Color, #F7F7FB);
}

.company_serch_popup .item_wrap .client_card_component {
    margin-top: 12px;
}

.company_serch_popup .item_wrap .client_card_component:first-child {
    margin-top: 0;
}

.company_serch_popup .item_wrap .client_card_component:last-child {
    margin-bottom: 24px;
}

.find_id_content_wrap input, .find_pw_content_wrap input {
    display: flex;
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    margin-bottom: 16px;
    color: var(--Font-04_Gray, #767676);
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.find_id_content_wrap, .find_pw_content_wrap {
    width: 100%;
    height: 100%;
    padding: 60px 20px;
}

.find_id_content_wrap.complete, .find_pw_content_wrap.complete {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding: 0;
}

.find_id_content_wrap .caption, .find_pw_content_wrap .caption {
    margin-top: 12px;
    margin-bottom: 48px;
    color: var(--Font-04_Gray, #767676);
}

.find_id_content_wrap.complete {
    padding-top: 170px;
}

.find_pw_content_wrap.complete {
    padding-top: 140px;
}






/* 전체 컨테이너 */
.pop6 .trackSlider {
    width: 350px;
}

/* 제목 스타일 */
.pop6 .title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
}

/* 선택된 범위 표시 */
.pop6 .range-values {
    font-size: 16px;
    font-weight: bold;
    color: #0057ff;
    margin-bottom: 15px;
}

/* 슬라이더 컨테이너 */
.pop6 .slider-container {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
}

/* 기본 슬라이더 스타일 */
.pop6 input.slider {
    -webkit-appearance: none !important;
    width: 100% !important;
    position: absolute !important;
    background: transparent !important;
    pointer-events: none !important;
    border:none !important;
    margin-top:-16px;
    z-index:100;
}

/* 슬라이더 바 스타일 */
.pop6 .slider-track {
    position: absolute;
    height: 5px;
    width: 100%;
    background: var(--BG-Regular_Color, #F1F1F5);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 3px;
    z-index: 1;
}

/* 선택된 범위 바 */
.pop6 .slider-range {
    position: absolute;
    height: 4px;
    background: var(--brand_color, #0161FF);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 3px;
    z-index: 2;
}

/* 슬라이더 핸들 (thumb) 스타일 */
.pop6 .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 32px;
    height: 32px;
    background: var(--BG-White_Color, #FFF);
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    border-radius: 50%;
    cursor: pointer;
    pointer-events: auto;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.08);
}

.pop6 .slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: white;
    border: 3px solid #ccc;
    border-radius: 50%;
    cursor: pointer;
    pointer-events: auto;
}



/* 검진비교 */
.compare2_content_wrap {
	padding-top: 90px !important;
    width: 100%;
    padding: 24px 20px 58px 20px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    display: flex;
    flex-direction: column;
}

.compare2_content_wrap .card_wrap {
    display: flex;
    width: 100%;
    gap: 12px;
}

.compare2_content_wrap .card {
    position: relative;
    display: flex;
    width: 50%;
    flex-direction: column;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.compare2_content_wrap .icon {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 3;
}

.compare2_content_wrap .gradient {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 16px 16px 0px 0px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.00) 100%);
    z-index: 2;
}

.compare2_content_wrap .img {
    width: 100%;
    height: 120px;
    border-radius: 16px 16px 0px 0px;
    z-index: 1;
}

.compare2_content_wrap .hospital,
.compare2_content_wrap .program,
.compare2_content_wrap .price {
    padding-left: 2px;
    padding-right: 2px;
}

.compare2_content_wrap .hospital,
.compare2_content_wrap .program,
.compare2_content_wrap .price,
.compare2_content_wrap .btn {
    margin-left: 16px;
    margin-right: 16px;
}

.compare2_content_wrap .hospital {
    margin-top: 16px;
    color: var(--sub_color, #5187FF);
}

.compare2_content_wrap .program {
    margin-top: 2px;
}

.compare2_content_wrap .price {
    margin-top: 12px;
}

.compare2_content_wrap .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    margin-top: 16px;
    margin-bottom: 16px;
    height: 36px;
    border-radius: 8px;
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
    text-align: center;
    padding: 0;
}

.compare2_content_wrap .main_content_wrap_a .main_title {
    margin-left: 2px;
}

.compare2_nav .hospital {
    color: var(--sub_color, #5187FF);
}

.compare2_nav {
	position: fixed;
	z-index: 999;
    float: left;
    margin-top: 56px;
    height: 102px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 24px 0px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    width: 100%;
}

.compare2_nav > * {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 50%;
}

.compare2_nav .left {
    border-right: 1px solid var(--Line-Light_Color, #F1F1F5);
}

.compare2_nav * {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.compare2_nav .hospital, .compare2_nav .name {
    padding: 0 20px;
    width: 100%;
}











/* faq */
.faq_content_wrap {
    margin-top: 184px;
    position: absolute;
    top: 0;
    height: 100%;
    overflow-Y: auto;
    width:100%;
    background: #fff;
}

.faq_content_wrap .serch_section {
    position: fixed !important;
    width: 100%;
    top: 56px;
    display: flex;
    position: relative;
    height: 76px;
    justify-content: center;
    background: var(--Line-White_Color, #FFF);
}

.faq_content_wrap input {
    border: none;
    width: 100%;
    display: flex;
    padding: 14px 20px 14px 46px;
    height: 52px;
    margin: 12px 20px;
    border-radius: 100px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.faq_content_wrap .serch_section .icon {
    position: absolute;
    top: 28px;
    left: 40px;
}

.faq_content_wrap .tab_component_under_bar {
    position: fixed;
    top: 132px;
    border-bottom: 1px solid var(--Line-Light_Color, #F1F1F5);
    height: 52px;
}


/* 검진 대상자 */
.roster1_content_wrap {
    margin-top: 56px;
    padding: 32px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: calc(100vh - 160px);
    overflow-y: auto;

}

.roster1_content_wrap.none {
    height: calc(100% - 162px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
}

.roster1_content_wrap.none .caption {
    color: var(--Font-04_Gray, #767676);
}


.roster2_content_wrap .info_check_wrap input {
    height: 48px;
    left: 107px;
}

.roster2_content_wrap {
    margin-top: 56px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    display: flex;
    flex-direction: column;
}

.roster2_content_wrap .btn_wrap {
    display: flex;
    gap: 12px;
}

.roster2_content_wrap .btn {
    display: flex;
    width: 50%;
    padding: 14px 0;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    background: var(--Button-Light_Color, #F7F7FB);
    color: var(--Font-03_Gray, #505050);
}

.roster2_content_wrap .btn.on {
    background: #0161FF;
    color: #FFFFFF;
}

.roster2_content_wrap .btn.dis {
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.roster2_content_wrap .date_wrap {
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 4px;
    margin-left: auto;
}

.info_check_wrap.radio {
    display: flex;
    align-items: center;
    position: relative;
    margin-top: 12px;
    margin-bottom: 24px;
}

.info_check_wrap.radio .item_wrap {
    display: flex;
    position: absolute;
    left: 107px;
    gap: 32px;
    align-items: center;
}

.info_check_wrap.radio .item {
    display: flex;
    gap: 8px;
    align-items: center;
}

.info_check_wrap .btn_wrap {
    position: absolute;
    margin-left: 107px;
    display: flex;
    gap: 8px;
    width: calc(100% - 107px);
}

.info_check_wrap .btn {
    white-space: nowrap;
    display: flex;
    height: 48px;
    padding: 14px 16px;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    flex: 1;
}

.roster2_content_wrap .input_item {
    position: relative;
}

.roster2_content_wrap .info_check_wrap .btn {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
    color: var(--Font-02_black, #111);
}

.roster2_content_wrap .info_check_wrap .btn.dis {
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
    border: none;
}

.roster2_content_wrap .info_check_wrap.last .btn {
    position: absolute;
    left: 107px;
    width: calc(100% - 107px);
}

.roster2_content_wrap .client_card_component {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.filter_sheet.ver2 {
    display: flex;
    flex-direction: column;
}

.filter_sheet.ver2 .cancle_wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1001;
    background: var(--BG-White_Color, #FFF);
    height: 98px;
}

.filter_sheet.ver2 .cancle_wrap button {
    height: 64px;
    padding-top: 28px;
    padding-bottom: 12px;
}

.filter_sheet.ver2 .item_wrap {
    overflow-y: auto;
    margin-bottom: 98px;
}

.semi_gnb {
    height: 56px;
    background: var(--BG-White_Color, #FFF);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.semi_gnb .btn {
    padding: 16px;
    height: 100%;
    border: none;
    background: none;
}

.roster3_content_wrap {
    display: flex;
    flex-direction: column;
    padding: 32px 20px;
    gap: 16px;
    overflow-y: auto;
    margin-bottom: 106px;
}

.roster3_content_wrap .item_wrap {
    display: flex;
    width: 100%;
    gap: 20px;
    align-items: center;
}

.roster3_content_wrap .item_wrap .name_card_component {
    width: 100%;
}

.roster3_content_wrap + .delete_btn {
    height: 106px;
    padding-top: 24px;
    display: flex;
    justify-content: center;
    background: var(--BG-Regular_Color, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.roster3_content_wrap + .delete_btn.on,
.roster4_content_wrap + .delete_btn.on {
    background: var(--sub_color, #5187FF);
    color: var(--Font-01_White, #FFF);
}



.system_info_content_wrap .tab_component_under_bar {
    position: fixed;
    top: 56px;
    height: 52px;
}

.system_info_content_wrap .content_wrap {
    display: flex;
    flex-direction: column;
    padding: 0 20px;
    margin-top: 108px;
}

.system_info_content_wrap .content_wrap .item {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;

    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
    color: var(--Font-03_Gray, #505050);
}

.system_info_content_wrap .title {
    padding: 0 2px;
    padding-bottom: 4px;
    padding-top: 32px;
}

.system_info_content_wrap .sub_title {
    color: var(--brand_color, #0161FF);
}

.system_info_content_wrap .dot {
    width: 3px;
    height: 3px;
    background: var(--Font-03_Gray, #505050);
    border-radius: 50%;
    margin: 12px 10px;
    flex-shrink: 0;
}

.system_info_content_wrap li {
    display: flex;
}

.system_info_content_wrap .alert_wrap,
.result_content_wrap2 .alert_wrap {
    display: flex;
    gap: 6px;
    margin: 24px 20px 32px 4px;
    align-items: flex-start;
}

.result_content_wrap2 .alert_wrap {
    margin-top: 16px;
}

.system_info_content_wrap .alert_wrap .icon,
.result_content_wrap2 .alert_wrap .icon {
    padding-top: 2px;
}

.system_info_content_wrap .alert_wrap .text,
.result_content_wrap2 .alert_wrap .text {
    color: var(--Font-05_Gray_Disabled, #999);
}


.item_info_content_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 56px;
    padding: 24px 20px 48px 20px;
}

.item_info_content_wrap .left .icon_circle {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-radius: 50%;
    background: var(--BG-Light_Color, #F7F7FB);
}

.item_info_content_wrap .item {
    display: flex;
    padding: 20px;
    justify-content: space-between;
    align-items: center;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.item_info_content_wrap .left {
    display: flex;
    gap: 20px;
    align-items: center;
}

.bottom_sheet_info {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    border-radius: 24px 24px 0px 0px;
    background: var(--BG-White_Color, #FFF);
    max-height: calc(100% - 136px);
    z-index: 1200;
	width: 100%;
}



.bottom_sheet_info .header {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    padding: 14px 0;
}

.bottom_sheet_info .content_wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 16px 20px 0 20px;
    margin-bottom: 58px;
    overflow-y: auto;
}

.bottom_sheet_info .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}


.bottom_sheet_info.ver2 .item_wrap {
    gap: 2px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.bottom_sheet_info.ver2 .item_wrap .date {
    color: var(--Font-04_Gray, #767676);
}

.bottom_sheet_info .caption {
    color: var(--Font-04_Gray, #767676);
}


.program_detail_1_content_wrap {
    display: flex;
    flex-direction: column;
    padding: 132px 20px 48px 20px;
    width: 100%;
}

.program_detail_1_content_wrap .content_wrap,
.program_detail_2_content_wrap .content_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.program_detail_1_content_wrap .tab_component_under_bar,
.program_detail_2_content_wrap .tab_component_under_bar {
    position: fixed;
    top: 56px;
    left: 0;
    height: 52px;
}

.program_detail_1_content_wrap .item_wrap, .program_detail_2_content_wrap .item_wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    height: 72px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.program_detail_2_content_wrap .item_wrap {
    height: 64px;
}

.program_detail_1_content_wrap .num, .program_detail_2_content_wrap .num {
    color: var(--Font-05_Gray_Disabled, #999);
}

.program_detail_1_content_wrap .left, .program_detail_2_content_wrap .left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sub_gnb .sub_gnb_title_wrap .icon {
    width: 16px;
    height: 16px;
}

.sub_gnb .sub_gnb_title_wrap {
    display: flex;
    gap: 6px;
    align-items: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sub_gnb .sub_gnb_title_wrap .sub_gnb_text {
    position: static;
    left: 0;
    transform: none;
}

.program_detail_2_content_wrap {
    display: flex;
    flex-direction: column;
    padding: 80px 20px 48px 20px;
    width: 100%;
}



.reservation_detail_content_wrap {
    display: flex;
    flex-direction: column;
    padding: 24px 20px;
    margin-top: 56px;
    gap: 32px;
    padding-bottom: 106px;
}

.reservation_detail_content_wrap .content_wrap > .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2px;
    margin-bottom: 16px;
}

.reservation_detail_content_wrap .content_wrap {
    display: flex;
    flex-direction: column;
}

.reservation_detail_content_wrap .content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.reservation_detail_content_wrap .item {
    display: flex;
    padding: 20px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.reservation_detail_content_wrap .item.call {
    justify-content: space-between;
    align-items: center;
}

.reservation_detail_content_wrap .item.call .left {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.reservation_detail_content_wrap .item.call .left .location_wrap {
    display: flex;
    gap: 4px;
    align-items: center;
    color: var(--Font-04_Gray, #767676);
}

.reservation_detail_content_wrap .icon_circle {
    display: flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--BG-Regular_Color, #F1F1F5);
}

.reservation_detail_content_wrap .item.program {
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
    color: var(--Font-01_White, #FFF);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.reservation_detail_content_wrap .alert_info {
    display: flex;
    gap: 4px;
    padding: 4px 20px 0 4px;
    align-items: flex-start;
    color: var(--Font-05_Gray_Disabled, #999);
}

.reservation_detail_content_wrap .alert_info .icon {
    padding-top: 2px;
}

.reservation_detail_content_wrap .item.alpa {
    display: flex;
    flex-direction: column;
}

.reservation_detail_content_wrap .item_date {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.reservation_detail_content_wrap .item_date:first-of-type {
    border-bottom: 1px solid var(--Line-Regular_Color, #E5E5EC);
    padding-bottom: 20px;
}

.reservation_detail_content_wrap .item_date:last-of-type {
    padding-top: 20px;
}

.reservation_detail_content_wrap .right {
    display: flex;
    gap: 8px;
    align-items: center;
}

.reservation_detail_content_wrap .item.alpa .left {
    color: var(--Font-04_Gray, #767676);
}

.reservation_detail_content_wrap .btn {
    padding: 4px 12px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.reservation_detail_content_wrap .content.item {
    gap: 24px;
    flex-direction: column;
}

.reservation_detail_content_wrap .item_detail {
    display: flex;
    align-items: flex-start;
    min-height: 100%;
}

.reservation_detail_content_wrap .item_detail .left {
    padding: 3px 0;
    width: 51px;
    flex-shrink: 0;
}

.reservation_detail_content_wrap .right_info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-left: 24px;
}

.reservation_detail_content_wrap .right_item {
    padding: 4px 8px;
    border-radius: 8px;
    background: var(--BG-Light_Color, #F7F7FB);
    width: fit-content;
    color: var(--Font-03_Gray, #505050);
}

.reservation_detail_content_wrap .item.price_wrap {
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.reservation_detail_content_wrap .price {
    color: var(--brand_color, #0161FF);
    display: flex;
    gap: 3px;
    align-items: center;
}

.reservation_detail_content_wrap .item.dis {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-Regular_Color, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.reservation_detail_content_wrap .item.dis .price.dis {
    color: var(--Font-05_Gray_Disabled, #999);
}

.reservation_detail_content_wrap .price_wrap.dis {
    box-shadow: none;
}

.reservation_detail_content_wrap .content_wrap:last-of-type {
    margin-bottom: 48px;
}

.reservation_detail_content_wrap .item.confirm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.reservation_detail_content_wrap .item.confirm .date {
    color: var(--brand_color, #0161FF);
}




.get_result1_content_wrap {
    margin-top: 56px;
    padding: 24px 20px 102px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    height: 100%;
}

.get_result1_content_wrap .item {
    height: 50%;
    display: flex;
    flex-direction: column;
    padding: 20px;
    align-items: center;
    justify-content: space-between;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.get_result1_content_wrap .title {
    width: 100%;
    margin-bottom: 12px;
}

.get_result1_content_wrap .caption {
    color: var(--Font-04_Gray, #767676);
}

.get_result1_content_wrap .btn {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
    width: 100%;
    border: none;
    color: var(--Font-01_White, #FFF);
}



.get_result2_content_wrap {
    margin-top: 56px;
    display: flex;
    flex-direction: column;
    padding: 80px 20px;
}

.get_result2_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 32px;
}

.get_result2_content_wrap .item {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 56px;
    justify-content: center;
    border-radius: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
    color: var(--Font-03_Gray, #505050);
}


.get_result3_content_wrap + .bottom_sheet_button_wrap .bottom_sheet_button,
.get_result4_content_wrap + .bottom_sheet_button_wrap .bottom_sheet_button {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.get_result3_content_wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
    gap: 32px;
    align-items: center;
    height: 100%;
    margin-top: 56px;
    padding-bottom: 162px;
}

.get_result3_content_wrap .top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.get_result3_content_wrap .top .icon {
    margin-bottom: 4px;
}

.get_result3_content_wrap .caption {
    color: var(--Font-04_Gray, #767676);
}

.get_result3_content_wrap .item {
    display: flex;
    padding: 20px;
    gap: 12px;
    flex-direction: column;
    border-radius: 16px;
    background: var(--BG-Light_Color, #F7F7FB);
}

.get_result3_content_wrap li {
    color: var(--Font-04_Gray, #767676);
    display: flex;
    align-items: flex-start;
}

.get_result3_content_wrap .dot {
    width: 2px;
    height: 2px;
    margin: 9px 4px;
    background: var(--Font-04_Gray, #767676);
    border-radius: 50%;
    flex-shrink: 0;
}

.get_result3_content_wrap ul {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.get_result4_content_wrap {
    margin-top: 56px;
    padding: 80px 20px;
    display: flex;
    flex-direction: column;
}

.get_result4_content_wrap .title {
    margin-top: 48px;
    margin-bottom: 24px;
}

.get_result4_content_wrap .item {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.get_result4_content_wrap .item img {
    padding: 1px 0;
}

.get_result4_content_wrap .text_wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.get_result4_content_wrap .caption {
    color: var(--Font-04_Gray, #767676);
}

.get_result5_content_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}

.get_result5_content_wrap .title {
    margin-top: 24px;
    margin-bottom: 12px;
}

.get_result5_content_wrap .caption {
    color: var(--Font-04_Gray, #767676);
}



.get_result6_content_wrap {
    margin-top: 56px;
    padding: 100px 20px;
    height: 100%;
}

.get_result6_content_wrap + .bottom_sheet_button_wrap .alert{
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--Font-05_Gray_Disabled, #999);
    margin-bottom: 22px;
    align-items: flex-start;
}

.get_result6_content_wrap .item {
    color: var(--Font-03_Gray, #505050);
    height: 36px;
    border-radius: 18px;
    background: var(--BG-Light_Color, #F7F7FB);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 32px;
}


.filter_sheet.new {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    border-radius: 24px 24px 0px 0px;
    background: var(--BG-White_Color, #FFF);
    max-height: 563px;
}

.filter_sheet.new .item1 {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 20px;
    border-radius: 16px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.filter_sheet.new .item_wrap {
    overflow-y: auto;
    padding-top: 0;
    margin-top: 16px;
    margin-bottom: 106px;
}

.filter_sheet.new .item1:last-of-type {
    margin-bottom: 8px;
}

.filter_sheet.new .item1 .sub_text {
    color: var(--Font-04_Gray, #767676);
}

.filter_sheet.new .item1 .left .main_text {
    color: var(--brand_color, #0161FF);
    letter-spacing: 0;
}

.filter_sheet.new .item1 > * {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filter_sheet.new .item1 .right {
    text-align: right;
}

.filter_sheet.new .btn_wrap {
    height: 106px;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1200;
}

.filter_sheet.new button {
    height: 52px;
    width: 100%;
    border: none;
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Font-01_White, #FFF);
}



.get_result7_content_wrap {
    margin-top: 104px;
    display: flex;
    flex-direction: column;
}

.tab_component_under_bar.result7 {
    border-bottom: 1px solid var(--BG-Regular_Color, #F1F1F5);
    position: relative;
    height: 48px;
    position: fixed;
    top: 56px;
}

.tab_component_under_bar.result7 .item {
    height: 48px;
    position: absolute;
    width: 50%;
}

.tab_component_under_bar.result7 .item:first-of-type {
    left: 0;
}

.tab_component_under_bar.result7 .item:last-of-type {
    right: 0;
}

.tab_component_under_bar.result7 .item.select {
    color: var(--brand_color, #0161FF);
    border-bottom: 2px solid var(--brand_color, #0161FF);
}

.get_result7_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.get_result7_content_wrap .item_wrap .item {
    display: flex;
    align-items: center;
    height: 112px;
    width: 100%;
    border-bottom: 1px solid var(--BG-Regular_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
    padding: 24px 20px;
    justify-content: space-between;
}

.get_result7_content_wrap .info .sub {
    color: var(--sub_color, #5187FF);
}

.get_result7_content_wrap .info .date {
    color: var(--Font-04_Gray, #767676);
    margin-top: 4px;
}

.get_result7_content_wrap .item_wrap .item:last-of-type {
    border: none;
}

.get_result7_content_wrap .info + .icon {
    padding: 6px;
}

.get_result7_content_wrap .btn_wrap {
    margin: 32px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

.get_result7_content_wrap .btn_wrap .btn {
    width: 100%;
    color: var(--Font-01_White, #FFF);
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background: var(--sub_color, #5187FF);
    border: none;
}

.get_result7_content_wrap .btn_wrap .text {
    color: var(--Font-04_Gray, #767676);
}




.result_nav_wrap {
    background: var(--BG-White_Color, #FFF);
    height: 52px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 56px;
    left: 0;
    width: 100%;
    justify-content: center;
    z-index: 1000;
}

.result_nav_wrap .nav_wrap {
    border-radius: 18px;
    background: var(--BG-Light_Color, #F7F7FB);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px 12px;
    gap: 6px;
    color: var(--Font-03_Gray, #505050);
    width: 60%;
}

.result_nav_wrap .text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}



.result1_content_wrap {
    margin-top: 0;
    padding: 32px 20px;
}

.result1_content_wrap .title {
    padding: 0 2px;
    margin-bottom: 16px;
}

.result1_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.result1_content_wrap .item_wrap > * {
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    padding: 20px;
}

.result1_content_wrap .item2 {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.result1_content_wrap .item2 .grid {
    padding: 12px;
    padding-bottom: 0;
    
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: space-between;
    row-gap: 24px;
    
}

.result1_content_wrap .grid .item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.result1_content_wrap .icon_box {
    width: 75px;
    height: 75px;
    flex-shrink: 0;
    border-radius: 12px;
    background: var(--BG-Light_Color, #F7F7FB);
    align-items: center;
    justify-content: center;
    display: flex;
}

.result1_content_wrap .btn {
    color: var(--Font-01_White, #FFF);
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
    border: none;
}

.date_bottom_sheet1 {
    position: fixed;
    left: 0;
    bottom: 0;
    height: 728px;
    display: flex;
    flex-direction: column;
    border-radius: 24px 24px 0px 0px;
    background: var(--BG-White_Color, #FFF);
    width: 100%;
}

.date_bottom_sheet1 .header {
    width: 100%;
    border-radius: 24px 24px 0px 0px;
    padding: 14px 0;
    display: flex;
    height: 56px;
    align-items: center;
    justify-content: center;
    position: relative;
}

.date_bottom_sheet1 .header .icon {
    position: absolute;
    top: 14px;
    right: 20px;
}

.date_bottom_sheet1 .title_wrap {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
}

.date_bottom_sheet1 .date_bottom_sheet1_content_wrap {
    padding: 16px 20px 18px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.date_bottom_sheet1 .calendar_nav {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
    margin-top: 24px;
}

.date_bottom_sheet1 .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #FFAA00;
}

.date_bottom_sheet1 .info:first-of-type .dot {
    background: #E5E5EC;
}

.date_bottom_sheet1 .info:last-of-type .dot {
    background: #EE0000;
}

.date_bottom_sheet1 .info:nth-of-type(n+3):not(:last-of-type) .dot {
    background: #FF0080;
}

.date_bottom_sheet1 .info_wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
    width: 100%;
    justify-content: flex-end;
    padding-right: 2px;
}

.date_bottom_sheet1 .calendar_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 32px;
}

.date_bottom_sheet1 .info {
    display: flex;
    align-items: center;
    gap: 6px;
}

.date_bottom_sheet1 .btn_wrap {
    margin-top: 16px;
    width: 100%;
    display: flex;
    gap: 12px;
}

.date_bottom_sheet1 .btn_wrap .btn {
    width: 50%;
    height: 52px;
    border-radius: 12px;
    background: var(--Button-Light_Color, #F7F7FB);
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    color: var(--Font-03_Gray, #505050);
}

.date_bottom_sheet1 .btn_wrap .btn.dis {
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.date_bottom_sheet1 .btn_wrap .btn.on {
    color: var(--Font-01_White, #FFF);
    background: var(--brand_color, #0161FF);
}

.date_bottom_sheet1 .bottom_btn_wrap {
    height: 106px;
    width: 100%;
    margin-top: 18px;
    padding-top: 10px;
}

.date_bottom_sheet1 .bottom_btn_wrap .btn {
    width: 100%;
    height: 52px;
    border-radius: 12px;
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
    border: none;
}

.date_bottom_sheet1 .bottom_btn_wrap .btn.dis {
    background: var(--Button-Disable, #F1F1F5);
    color: var(--Font-05_Gray_Disabled, #999);
}

.date_bottom_sheet1 .calendar {
    height: 264px;
    margin: 24px 8px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.date_bottom_sheet1 .calendar .top_wrap {
    display: flex;
    justify-content: space-between;
    color: var(--Font-03_Gray, #505050);
}

.date_bottom_sheet1 .calendar .top_wrap *,
.date_bottom_sheet1 .calendar .grid * {
    width: 20px;
    text-align: center;
}

.date_bottom_sheet1 .calendar .grid {
    display: grid;
    grid-template-columns: repeat(7, auto);
    row-gap: 24px;
    justify-content: space-between;
    color: var(--Font-05_Gray_Disabled, #999);
}

.date_bottom_sheet1 .calendar .grid .on {
    color: var(--Font-02_black, #111);
    font-weight: 600;
}



.available_date_wrap + .client_card_component {
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
}

.date_bottom_sheet1 .calendar .loading {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.80);
    display: flex;
    justify-content: center;
    align-items: center;
}



.result_bottom_sheet {
    background: var(--BG-White_Color, #FFF);
    border-radius: 24px 24px 0px 0px;
    max-height: 377px;
    width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
}

.result_bottom_sheet .header {
    display: flex;
    position: relative;
    padding: 14px 0;
    align-items: center;
    justify-content: center;
}

.result_bottom_sheet .header .icon {
    position: absolute;
    top: 14px;
    right: 20px;
}

.result_bottom_sheet .content_wrap {
    overflow-y: auto;
    margin: 8px 20px 58px 20px;
    display: flex;
    flex-direction: column;
}

.result_bottom_sheet .item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 16px 0;
    border-bottom: 1px solid var(--Line-Regular_Color, #E5E5EC);
    gap: 24px;
}

.result_bottom_sheet .item:last-of-type {
    border: none;
}

.result_bottom_sheet .date {
    color: var(--Font-05_Gray_Disabled, #999);
    padding-left: 2px;
    width: 87px;
    letter-spacing: 0;
}

.result_bottom_sheet .name {
    padding-right: 2px;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.loading_wrap {
    width:100%;
    height:100%;
    position:fixed;
    z-index:9991;
    top:0px;
    left:0px;
    background-color:rgba(0,0,0,0.8);
}
.loading_icon {
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-20px;
    margin-left:-20px;
    animation: rotate 1s infinite;
}
@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.fade {
    display: none;
}

.popup_full {
    width: 100%;
    height: 100%;
    z-index: 9990;
    position: fixed;
    left: 0;
    bottom: 0;
    background: white;
    overflow-y: scroll;
    padding-bottom: 150px;
}

.popup_wrap {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9990;
    background-color: rgba(0, 0, 0, 0.6);
    align-items: center;
    justify-content: center;
}

.popup {
    background: white;
    border-radius: 16px; /* 둥근 모서리 */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 300px;
}

.popup_bottom {
    background: white;
    border-radius: 16px 16px 0px 0px; /* 둥근 모서리 */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    text-align: center;
    position: absolute;
    bottom: 0%;
    left: 0%;
    padding-top: 40px;
}

.popup_title {
    padding-top: 20px;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
}

.popup_message {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.5;
    padding: 10px;
}

.popup_buttons {
    text-align: center;
    display: flex;
}

.popup_btn {
    width: 100%;
    padding: 16px 0;
    border: none;
    background-color: #5187ff;
    color: white;
    font-size: 16px;
    font-weight: bold;
    border-radius: 0 0 16px 16px;
}

.popup_btn_ok {
    width: 50%;
    padding: 16px 0;
    border: none;
    background-color: #5187ff;
    color: white;
    font-size: 16px;
    font-weight: bold;
    border-radius: 0 0 16px 0px;
}

.popup_btn_no {
    width: 50%;
    padding: 16px 0;
    border: none;
    background-color: #f7f7fb;
    color: #767676;
    font-size: 16px;
    font-weight: bold;
    border-radius: 0 0 0px 16px;
}

.faq_content_wrap .faq_list {
    width: 100%;
    height: calc(100vh - 55px);
    padding-bottom: 150px;
    overflow-y: auto;
    position: relative;
}

.bg-gray {
    background: var(--BG-Light_Color, #F7F7FB);
}

.date_bottom_sheet1 .calendar .top_wrap *, .date_bottom_sheet1 .calendar .grid * {
    width:auto;
    padding:7px 10px;
}
.date_bottom_sheet1 .calendar .grid {
    row-gap:0px;
}
.day {
    position:relative;
    cursor:pointer;
}
.day.on.selected {
    background-color:#0161FF;
    color:#fff !important;
    border-radius:50%;
}
.day.holiday:after {
    content:"";
    position:absolute;
    top:3px;
    left:50%;
    margin-left:-3px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:red;
}
.day.am_off:after {
    content:"";
    position:absolute;
    top:3px;
    left:50%;
    margin-left:-3px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#FFAA00;
}
.day.pm_off:after {
    content:"";
    position:absolute;
    top:3px;
    left:50%;
    margin-left:-3px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#FF0080;
}
.day.off:after {
    content:"";
    position:absolute;
    top:3px;
    left:50%;
    margin-left:-3px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#E5E5EC;
}

.color-blue {
    color: var(--brand_color, #0161FF);
}

.color-red {
    color: #EE0000;
}

#insertEmployNoPopup input {
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
}

.item input[type='radio']{
    appearance:none;
    width:22px !important;
    height:22px !important;
    padding:0px;
    border-radius:50%;
    position:unset;
    display:flex;
    width:20px;
    border-color:#E5E5EC;
}
.item input[type='radio']:checked {
    appearance:none;
    border-color:#0161FF;
}
.item input[type='radio']:checked:before {
    appearance:none;
    content:"";
    background-color:#0161FF !important;
    width:14px;
    height:14px;
    border-radius:50%;
    margin-top:3px;
    margin-left:3px;
}
select {
    position:relative;
    appearance:none;
    background-image:url("/resources/new/img/common/ic_arrow_blk_16_dn.svg") !important;
    background-repeat:no-repeat !important;
    background-position:calc(100% - 15px) center !important;
}
select:disabled {
    background:var(--Button-Disable, #F1F1F5) !important;
    color:var(--Font-05_Gray_Disabled, #999) !important;
    border:none !important;
}

.ic_radio {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.result_content_wrap1 {
    position: sticky;
	top: 108px;
	z-index: 200;
}

.category.ver1 {
    position: static;
	top: 0;
    height: 48px;
    display: flex;
    width: 100%;
    background: var(--BG-White_Color, #FFF);
    z-index: 1000;
}

.category.ver1 .item_wrap {
    position: relative;
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding-left: 8px;
    padding-right: 56px;
    -webkit-overflow-scrolling: touch; /* 모바일 스크롤 부드럽게 */
    scrollbar-width: none; /* 파이어폭스에서 스크롤바 숨김 */
}

.category.ver1 .item_wrap::-webkit-scrollbar {
    display: none; /* 크롬, 사파리에서 스크롤바 숨김 */
}

.category.ver1 .item_box {
    display: flex;
    height: 48px;
    border: none;
    background: none;
    min-width: fit-content;
    padding: 0 12px;
}

.category.ver1 .item {
    padding: 12px 0;
    height: 48px;
    white-space: nowrap;
    color: var(--Font-03_Gray, #505050);
    display: flex;
    justify-content: center;
    line-height: 24px;
}

.category.ver1 .item.select {
    color: #1a73e8; /* 선택된 아이템 색상 */
    font-weight: 600;
    border-bottom: 2px solid var(--brand_color, #0161FF);
}

.category.ver1 .icon_wrap {
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(270deg, #FFF 70.83%, rgba(255, 255, 255, 0.00) 100%);
}





.result_content_wrap2 .btn_wrap {
    position: relative;
    height: 60px;
    display: flex;
    background: var(--BG-White_Color, #FFF);
    border-radius: 12px;
    overflow: hidden;
    padding: 6px;
    gap: 6px;
    margin-bottom: 16px;
}

.result_content_wrap2 .btn {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    z-index: 2;
    flex: 1;
    height: 48px;
    padding: 12px 0;
    text-align: center;
    color: var(--Font-05_Gray_Disabled, #999);
}

.result_content_wrap2 .btn.select {
    color: var(--Font-01_White, #FFF);
    border-radius: 8px;
    background: var(--sub_color, #5187FF);
}


.result_content_wrap2 .result_item_wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.result_content_wrap2 .item {
    padding: 20px;
    border-radius: 12px;
    background: var(--BG-White_Color, #FFF);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.result_content_wrap2 .title_wrap {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-items: flex-start;
}
.result_content_wrap2 .title_wrap .left {
    display: flex;
    gap: 4px;
    padding: 1px 0;
    align-items: center;
}

.result_content_wrap2 .title_wrap .right {
    display: flex;
    gap: 2px;
    flex-direction: column;
}

.result_content_wrap2 .text_wrap {
    display: flex;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    align-items: flex-end;
}

.result_content_wrap2 .num {
    color: var(--brand_color, #0161FF);
}

.result_content_wrap2 .num.bad {
    color: var(--BG-RED, #E00);
}

.result_content_wrap2 .caption {
    color: var(--BG-RED, #E00);
}

.result_content_wrap2 .content_wrap,
.result_content_wrap2 .content_wrap_ver2 {
    width: 100%;
    height: 40px;/* 임시 높이 입니다. */
    background: var(--BG-Regular_Color, #F1F1F5);
}


.category.ver2 {
    position: static;
	top: 0;
    display: flex;
    flex-direction: column;
    background: var(--BG-White_Color, #FFF);
    z-index: 1000;
}

.category.ver2 + .result_content_wrap2 {
    padding-top: 231px;
    padding-left: 20px;
    padding-right: 20px;
}

.category.hidden + .result_content_wrap2 {
    padding-top: 64px;
    padding-left: 20px;
    padding-right: 20px;
}


.category.ver2 .title_wrap {
    height: 48px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    padding: 13px 16px 13px 20px;
}

.category.ver2 .item_wrap {
    display: flex;
    flex-wrap: wrap;
    padding: 8px 20px 24px 20px;
    gap: 8px;
}

.category.ver2 .item {
    padding: 9px 12px;
    border-radius: 100px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--Button-White, #FFF);
    color: var(--Font-02_black, #111);
}

.category.ver2 .item.select {
    color: var(--brand_color, #0161FF);
    border: 1px solid var(--brand_color, #0161FF);
}





.result_content_wrap2 .caption_wrap_ver2 {
    color: var(--sub_color, #5187FF);
}

.result_content_wrap2 .item.ver2 {
    gap: 16px;
}

.result_content_wrap2 .slide_wrap {
    width: 100%;
    overflow-x: auto;
    display: flex;
    gap: 8px;
}

.result_content_wrap2 .slide_wrap .item {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: center;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    background: var(--BG-White_Color, #FFF);
}

.result_content_wrap2 .slide_wrap .text1 {
    color: var(--brand_color, #0161FF);
}

.result_content_wrap2 .slide_wrap .text2 {
    color: var(--Font-05_Gray_Disabled, #999);
}



.result_content_wrap2 .content_wrap_ver3 {
    color: var(--Font-04_Gray, #767676);
}

.result_content_wrap2 .item.ver3 {
    gap: 16px;
}


.result_content_wrap2 .slide_wrap .item.ver4 {
    align-items: flex-start;
    flex: 0 0 80%;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.result_content_wrap2 .slide_wrap .item.ver4 .date,
.result_content_wrap2 .slide_wrap .item.ver4 .caption {
    color: var(--Font-04_Gray, #767676);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* 원하는 줄 수로 변경 */
    -webkit-box-orient: vertical;
}

.result_content_wrap2 .slide_wrap .item.ver4 .btn {
    color: var(--brand_color, #0161FF);
    text-decoration: underline;
    text-underline-offset: 2px;
    padding: 4px 0;
    margin-top: 28px;
    margin-left: auto;
}

.result_content_wrap2 .slide_wrap.ver6 {
    width: 100%;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
}

.slide_wrap.ver6 .name {
    margin-top: 4px;
    margin-bottom: 12px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1; /* 원하는 줄 수로 변경 */
    -webkit-box-orient: vertical;
}

.footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 32px 20px 60px 20px;
    background: var(--BG-White_Color, #FFF);
}

.footer .top_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.footer .icon {
    height: 24px;
    margin-right: auto;
}

.footer .info_wrap {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.footer .text_wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: var(--Font-04_Gray, #767676);
}

.footer .btn_wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--Font-04_Gray, #767676);
}

.footer .btn:first-of-type {
    color: var(--Font-02_black, #111);
}

.footer .num_wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer .num_text, .footer .bottom_wrap {
    color: var(--Font-04_Gray, #767676);
}

.mypage_content_wrap {
    margin-top: 56px;
    padding: 24px 20px;
}

.mypage_content_wrap .hello {
    background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    border-radius: 16px;
    box-shadow: 0px 5px 16px 0px rgba(0, 122, 255, 0.15);
    color: var(--Font-01_White, #FFF);
    display: flex;
    justify-content: space-between;
    
    padding: 20px;
}

.mypage_content_wrap + .footer {
    padding-bottom: 150px;
}

.mypage_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 40px;
}

.mypage_content_wrap .title {
    padding: 0 2px;
}

.mypage_content_wrap .item {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 8px 0;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.mypage_content_wrap .item > * {
    padding: 16px 20px;
}

.mypage_content_wrap .logout,
.mypage2_content_wrap .exit {
    margin-top: 40px;
    margin-bottom: 36px;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.mypage2_content_wrap .exit {
    margin-bottom: 0;
}

.mypage2_content_wrap {
    margin-top: 56px;
    height: 100%;
    padding: 24px 20px;
    padding-bottom: 106px;
    display: flex;
    flex-direction: column;
}

.mypage2_content_wrap .item_wrap {
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.mypage2_content_wrap .item {
    display: flex;
    height: 72px;
    justify-content: space-between;
    margin: 0 20px;
    align-items: center;
    border-bottom: 1px solid var(--Line-Light_Color, #F1F1F5);
}

.mypage2_content_wrap .item:last-of-type {
    border: none;
}

.mypage2_content_wrap .type {
    color: var(--Font-04_Gray, #767676);
    padding-left: 2px;
    width: 30%;
}

.mypage2_content_wrap .value {
    padding-right: 2px;
}

.mypage2_content_wrap .item_wrap.pw {
    padding: 24px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

.mypage2_content_wrap + .bottom_sheet_button_wrap .bottom_sheet_button {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.mypage2_content_wrap .item .change-butoon {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
    width: 70px;
    height: 40px;
    border: none;
    border-radius: 12px;
}

.mypage_pw_content_wrap {
    margin-top: 56px;
    padding: 60px 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.mypage_pw_content_wrap input {
    height: 52px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
    margin-top: 32px;
    width: 100%;
}

.mypage_pw_content_wrap .title {
    padding: 0 2px;
}

.mypage_pw_content_wrap .sub {
    display: flex;
    text-align: right;
    margin-left: auto;
    padding: 0 2px;
    margin-top: 12px;
    color: var(--Font-04_Gray, #767676);
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

.reservation_detail_content_wrap.resv {
    gap:10px;
}
.name_card_component.name_card_non_1.confirmed {
	background: linear-gradient(133deg, #5187FF 0%, #0161FF 100%);
    color: var(--Font-01_White, #FFF);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.06);
}

.name_card_component.name_card_non_1.canceled {
    color: #D9D9D9
}

.hospital_detail_info_box {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 20px;
    margin: 24px 20px 16px;
    border-radius: 16px;
    background: var(--BG-White_Color, #FFF);
}

.hospital_detail_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.available_date_main {
    color: #767676;
}

.hospitals_detail_contents_wrap {
    margin-top: 56px;
}

.hospitals_detail_contents_wrap .hospital_info {
    display: flex;
    flex-direction: column;
    margin: 0 20px 24px;
    padding: 0 2px;
    margin-top:20px;
}

.hospitals_detail_contents_wrap .hospital_info .hospital {
    margin-top: 2px;
    margin-bottom: 6px;
}

.hospitals_detail_contents_wrap .hospital_info .type {
    color: var(--sub_color, #5187FF);
}

.hospitals_detail_contents_wrap .hospital_info .caption {
    color: var(--Font-04_Gray, #767676);
}
.hospital_detail_info_box + .alert_wrap {
    display: flex;
    align-items: flex-start;
    margin: 0 40px 48px 24px;
    gap: 4px;
    color: var(--Font-05_Gray_Disabled, #999);
}

.hospital_detail_info_box + .alert_wrap .icon {
    margin: 2px 0;
}

.bottom_sheet_button_wrap .call {
    background: var(--Button-Light_Color, #F7F7FB);
    color: var(--Font-03_Gray, #505050);
}

.bottom_sheet_button_wrap .homepage {
    background: var(--brand_color, #0161FF);
    color: var(--Font-01_White, #FFF);
}

.info_check_wrap input.addr_input {
	position:unset;
	width:100%;
	margin-bottom:6px;
}
.info_check_wrap input.addr_zip_input {
	width:60%;
	min-width:100px;
	background-image:url('../img/common/ic_arrow_gray_20.svg');
	background-repeat:no-repeat;
	background-position:calc(100% - 10px) center;
}
.addr_input_wrap {
	position:absolute;
	left:95px;
}
.info_check_wrap .input_item_button {
	height:144px;
}
.bankAccountPopup {
}
.bankAccountPopup select {
    width:100%;
    border-radius:12px;
    border:1px solid #E5E5EC;
    white-space: nowrap;
    display: flex;
    height: 48px;
    padding: 14px 16px;
    justify-content: space-between;
    align-items: center;
    gap: 6px;

}
.bankAccountPopup input {
    width:100%;
    height: 48px;
    left: 107px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid var(--Line-Regular_Color, #E5E5EC);
    color: var(--Font-04_Gray, #767676);
    margin-top:10px;
}

.find_pw_content_wrap .item_wrap .caption {
    color: #E00
}

#reservItemInfo {
    .bottom_sheet_info {min-height:calc(100% - 136px);}
    .bottom_sheet_info .content_wrap { padding: 16px 20px 65px 20px}

}

.no_customer_user {
    width: 300px;
    height: 60px;
    position: absolute;
    bottom: 115px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 30px;
    padding: 18px 28px 18px 32px;
    display: flex;
    gap: 6px;
    background: linear-gradient(to bottom, #FFFFFF, #F1F1F5);
    box-shadow: 
        inset 1px 1px 1px 0px #FFFFFF, 
        4px 4px 10px 0px rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    text-align: center;
}

.no_customer_user .text {
    font-family: "Pretendard", sans-serif;
    font-weight: 600;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -2.5%;
    text-align: center;
    color: #505050;
}

.toast {
    max-width: 90%;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 30%;
    border-radius: 8px;
    padding: 16px;
    gap: 10px;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 9991;
    font-family: "Pretendard", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #FFFFFF;
    text-align: center;
    word-break: keep-all;
    white-space: nowrap;
}

.announcement_box.open .caption {
    display: block; /* 열렸을 때 표시 */
}

.announcement_box .icon {
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease; /* 부드러운 회전 효과 */
}

.announcement_box.open .icon,
.toggle_wrap .toggle.on .icon{
    transform: rotate(180deg); /* 열렸을 때 화살표 회전 */
}

.reservation_detail_content_wrap .name {
    max-width: 50%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


.notice_content_wrap {
    width:100%;
    margin-top:120px;
}
.notice_component {
    display: flex;
    width: 100%;
    flex-direction: column;
    border-bottom: 1px solid var(--Line-Light_Color, #F1F1F5);
    background: var(--BG-White_Color, #FFF);
    cursor:pointer;
}

.notice_component .base_wrap {
    display: flex;
    padding: 20px;
    align-items: center;
    justify-content: space-between;
}

.notice_component .text_wrap {
    display: block;
    align-items: center;
    gap: 12px;
}

.notice_component .text {
    padding-right: 16px;
}

.notice_component .mark {
    color: var(--brand_color, #0161FF);
    align-self: flex-start;
}

.notice_component .open_wrap {
    display: none;
    flex-direction: column;
    padding: 0px 20px 32px 48px;
    gap: 12px;
}
.notice_component .caption {
    color: var(--Font-03_Gray, #505050);
}
.text.font_t4_sb.date {
    font-size:14px;
    color:#767676;
    font-weight:500;
}
.filter_item {
    cursor:pointer;
}
.filter_item.on {
    color:#fff;
    background-color:#5187FF;
}


.notice_content_detail_wrap {
    margin: 96px 20px 0px 20px;
    padding-bottom: 100px;
}
.notice_content_detail_wrap .title {
    padding-bottom:30px;
    border-bottom:1px solid #F1F1F5;
}
.notice_body {
    margin-top:30px;
}

.custom-checkbox input[type="radio"] {
    display: none;
}
.custom-checkbox input[type="radio"]:checked + .ic_check_circle, .custom-checkbox input[type="radio"]:checked + .checkbox-design {
    background: #0161FF;
    border-color: #0161FF;
}


.btn_list.new_main {
    background:#fff;
}
.btn_wrap.new_main {
    background:none;
}
.btn_list.new_main .img {
    height:42px;
}
.medical_content_box .btn_card .img.main {
    height:90px;
    top:0px;
}

#calendar.popup_wrap {
   overflow-y:scroll;
}
#calendar.popup_wrap .date_bottom_sheet1 {
   height:calc(100% - 50px);
   bottom:0px;
}
#calendar.popup_wrap .date_bottom_sheet1_content_wrap {
   height:100%;
   overflow-y:scroll;
}

#pharmacylist, #hosptialList {
   height:calc(100% - 210px);
   overflow-y:scroll;
   min-height:100px;
}

.rcmnd_badge {
	display: inline-block;
	position: relative;
	background: tan;
	color: #fff;
	border-radius: 3px;
	padding: 3px 5px;
	font-size: 10px;
	line-height: 12px;
	margin-top: -3px;
	vertical-align: top;
}

.popup-close-btn {
    position: absolute;
    top: 16px;
    right: 20px;
    font-size: 20px;
    font-weight: bold;
    color: #999;
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.2s ease;
}