﻿body {
}

.Container {
    /* Desktop (w1920) sample-1 */
    /* Auto layout */
    background: url('../../../images/icq/w1920/bg.png') no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    /*    padding: 96px 340px 24px;*/
    gap: 125px;
    position: relative;
    /*    width: 1920px;*/
    /*    height: 1080px;*/
    width: 100%;
    height: 100%;
}

.Content {
    /* Content */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    gap: 24px;
    margin: 0 auto;
    width: 1024px;
    height: 843px;
/*    overflow-y: scroll;*/
    border-radius: 12px 12px 0px 0px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}


.Frame_1321316058 {
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 800px;
    height: 795px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

/* 午別 & 更新時間 */
.Frame_625527 {
    /* Frame 625527 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 800px;
    height: 40px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.Frame_noon {
    /* Frame 625527 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 476px;
    height: 40px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
/*    flex-grow: 1;*/
    flex-grow: 0;
}

.tagMorning {
    /* tag */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    gap: 10px;
    position: relative;
    width: 64px;
/*    height: 40px;*/
    background: #D4E9FF;
    border-radius: 8px;
}

.tagAfternoon {
    /* tag */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    gap: 10px;
    position: relative;
    width: 64px;
/*    height: 40px;*/
    background: #D1FADF;
    border-radius: 8px;
}

.tagNight {
    /* tag */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    gap: 10px;
    width: 64px;
/*    height: 40px;*/
    background: #FFEFD3;
    border-radius: 8px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.labelMorning {
    /* Label */

    width: 32px;
    height: 20px;
    /* headline-s */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 125%;
    /* identical to box height, or 20px */
    display: flex;
    align-items: center;
    text-align: right;
    color: #2B7CFF;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.labelAfternoon {
    /* Label */

    width: 32px;
    height: 20px;
    /* headline-s */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 125%;
    /* identical to box height, or 20px */
    display: flex;
    align-items: center;
    text-align: right;
    color: #12B76A;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.labelNight {
    /* Label */

    width: 32px;
    height: 20px;
    /* headline-s */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 125%;
    /* identical to box height, or 20px */
    display: flex;
    align-items: center;
    text-align: right;
    color: #F49C0D;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.Group_625524 {
    /* Group 625524 */

    width: 252px;
    height: 40px;

    display: flex;

    /* Inside auto layout */
    flex: none;
    order: 1;
    flex-grow: 0;
}

.Frame_1171275204 {
    /* Frame 1171275204 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 8px;
/*    position: absolute;*/
    width: 252px;
    height: 40px;
    left: 492px;
    top: 0px;
}

.Frame_1171275209 {
    /* Frame 1171275209 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
/*    padding: 8px 16px;*/
    padding: 0px;
    gap: 10px;
    width: 96px;
    height: 40px;
    background: #EEF0F2;
    border-radius: 8px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.timeTitle {
    /* Frame 1171275209 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
/*    padding: 8px 16px;*/
    padding: 8px 0px;
    gap: 10px;
    width: 96px;
/*    height: 40px;*/
    background: #EEF0F2;
    border-radius: 8px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.Frame_1171275202 {
    /* Frame 1171275202 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 4px;
    width: 148px;
    height: 40px;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

.dateTime {
    /* 2025/07/15 下午03:10 */

    width: 148px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    text-align: right;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

.Frame_1321316050 {
    /* Frame 1321316050 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 8px;
    width: 40px;
    height: 40px;
    /* Inside auto layout */
    flex: none;
    order: 2;
    flex-grow: 0;
}

.btnReload {
    /* button */
    box-sizing: border-box;
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px;
    gap: 4px;
    isolation: isolate;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    background: #FEFEFE;
    border: 1px solid #CECFD3;
    border-radius: 12px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
}

/* 科別下拉選單 */
.Frame_1321315992 {
    /* Frame 1321315992 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 16px;
    width: 800px;
    height: 36px;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

/* 看診中 未開診 已關診 */
.Frame_1321315991 {
    /* Frame 1321315991 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 12px;
    width: 800px;
    height: 43px;
    /* Inside auto layout */
    flex: none;
    order: 2;
    align-self: stretch;
    flex-grow: 0;
}

.Frame_1321315985 {
    /* Frame 1321315985 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 10px;
    width: 800px;
    height: 43px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.switch_tab {
    /* Switch-tab */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4px;
    gap: 2px;
/*    width: 800px;
    height: 43px;*/
    width: 792px;
    height: 35px;
    background: #EEF0F2;
    border-radius: 100px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 1;
}

.tab_active {
    /* tabs/Active */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 12px 8px;
    gap: 10px;
/*    width: 262.67px;
    height: 35px;*/
    width: 380px;
    height: 14px;
/*    background: #D4E9FF;*/
    border-radius: 100px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 1;
}

.tab_active_background {
    background: #D4E9FF;
}

.label_active {
    /* Title */

    width: 246.67px;
    height: 11px;
    /* label-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
/*    display: flex;*/
    display: inline;
    align-items: center;
    text-align: center;
/*    color: #1D59B1;*/
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 1;
}

.label_active_color {
    color: #1D59B1;
}

.tab_normal {
    /* tabs/Normal */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 12px 8px;
    gap: 10px;
/*    width: 262.67px;
    height: 35px;*/
    width: 380px;
    height: 14px;
    border-radius: 100px;
    /* Inside auto layout */
    flex: none;
    order: 1;
    flex-grow: 1;
}

.label_normal {
    /* Title */

    width: 246.67px;
    height: 11px;
    /* label-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
/*    display: flex;*/
    display: inline;
    align-items: center;
    text-align: center;
/*    color: #8C8E94;*/
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 1;
}

.label_normal_color {
    color: #8C8E94;
}

/* 看診進度 */
.Frame_1321315997 {
    background: url('../../../images/icq/w1920/item-progress.png') no-repeat;
    /* Frame 1321315997 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 12px;
    isolation: isolate;
    width: 800px;
    height: 145px;
    border-radius: 12px;
    /* Inside auto layout */
    flex: none;
    order: 3;
    align-self: stretch;
    flex-grow: 0;
}

/* 看診進度 2 */
.Frame_1171275169 {
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 12px;
    width: 800px;
    height: 145px;
    /* Inside auto layout */
    flex: none;
/*    order: 1;*/
    order: 0;
    align-self: stretch;
    flex-grow: 0;
    z-index: 1;
}

.button_card {
    /* button/card */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 16px;
    gap: 16px;
/*    width: 800px;
    height: 145px;*/
    border-radius: 12px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 1;
}

.Frame_1171275173 {
    /* Frame 1171275173 */
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 768px;
    height: 113px;
    /* Inside auto layout */
    flex: none;
/*    order: 1;*/
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

/* 看診醫師 & 科別 */
.Frame_1171275185 {
    /* Frame 1171275185 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 113px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 1;
}

/* 看診醫師 */
.Frame_doctor {
    /* Frame 625328 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 52px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.doctorTitle {
    /* 看診醫師 */

    width: 180px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.doctor {
    /* 王小明 */

    width: 180px;
    height: 25px;
    /* headline-m */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 125%;
    /* identical to box height, or 25px */
    display: flex;
    align-items: center;
    /* Gray/700 */
    color: #383C3F;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

/* 科別 */
.Frame_division {
    /* Frame 625331 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 4px;
    width: 180px;
    height: 45px;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

.divisionTitle {
    /* 科別 */

    width: 180px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.division {
    /* 家庭醫學科(家醫科) */

    width: 180px;
    height: 30px;
    /* body-xl */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 150%;
    /* identical to box height, or 30px */
    display: flex;
    align-items: center;
    /* Gray/700 */
    color: #383C3F;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}


/* 診別 */
.Frame_1171275189 {
    /* Frame 1171275189 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 113px;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 1;
}

.Frame_clinic {
    /* Frame 625332 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 52px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.clinicTitle {
    /* 診別 */

    width: 180px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.clinic {
    /* 一診 */

    width: 180px;
    height: 25px;
    /* headline-m */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 125%;
    /* identical to box height, or 25px */
    display: flex;
    align-items: center;
    /* Gray/700 */
    color: #383C3F;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}



/* 目前號碼 */
.Frame_1171275187 {
    /* Frame 1171275187 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 113px;
    /* Inside auto layout */
    flex: none;
    order: 2;
    align-self: stretch;
    flex-grow: 1;
}

.Frame_callNum {
    /* Frame 625328 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 4px;
    width: 180px;
    height: 65px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.callNumTitle {
    /* 目前號碼 */

    width: 180px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.callNum {
    /* 1 */

    width: 180px;
    height: 50px;
    /* display-l */
/*    font-family: 'Inter';*/
    font-family: 'Arial';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 125%;
    /* identical to box height, or 50px */
    display: flex;
    align-items: center;
    /* Secondary/400 */
    color: #FD6F8E;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

/* 候診人數 */
.Frame_1171275188 {
    /* Frame 1171275188 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 16px;
    width: 180px;
    height: 113px;
    /* Inside auto layout */
    flex: none;
    order: 3;
    align-self: stretch;
    flex-grow: 1;
}

.Frame_waitCount {
    /* Frame 625331 */
    /* Auto layout */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 4px;
    width: 180px;
    height: 65px;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.waitCountTitle {
    /* 候診人數 */

    width: 180px;
    height: 11px;
    /* title-s */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 125%;
    /* or 18px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    display: flex;
    align-items: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.waitCount {
    /* 10 */

    width: 180px;
    height: 50px;
    /* display-l */
/*    font-family: 'Inter';*/
    font-family: 'Arial';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 125%;
    /* identical to box height, or 50px */
    display: flex;
    align-items: center;
    /* Gray/700 */
    color: #383C3F;
    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
}

.Copyright {
    /* Copyright */

    margin: 0 auto;
    width: 316px;
    height: 23px;
    /* body-xs */
    font-family: 'Microsoft JhengHei UI';
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 150%;
    /* or 15px */
    /* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
    leading-trim: both;
    text-edge: cap;
    text-align: center;
    color: #8C8E94;
    /* Inside auto layout */
    flex: none;
    order: 1;
    flex-grow: 0;
}


