@charset "utf-8";


.container { 
    min-height: 639px; margin-bottom: 50px; 
    @media screen and (max-width:1024px) {
        margin-top: 66px;
    }
}
/*============================================================= 
협력병원 현황 
=============================================================== */
.search_bar { 
    display: -webkit-box; display: -ms-flexbox; display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    background: var(--hl-icegray-5);
    @media screen and (max-width:500px) {   
        > label { width: 100%; }
        > input { width: 75%; }
    }
}
.scr120_area {
    > .tab_area {
        font-size: 1.7rem;
        padding: 10px 0;
        > a {
            &:hover { color: var(--hl-primary); border-bottom: 1px solid var(--hl-primary); }
        }
    }
}

.new_page { 
    display: inline-flex; align-items: center;
    padding: 4px 10px; border-radius: 4px; background: var(--hl-icegray-5);
    &:hover { color: var(--hl-primary); text-decoration: underline; background: var(--hl-icegray-10);}
    > img { margin-left: 5px; }
}

.sch_input {
    position: relative;
    display: inline-flex;
    width: 30%;
    min-width: 300px;
    > input { 
        width: 100%;
    }
    > .ico_sch {
        position: absolute;
        top: 50%; right: 16px;
        width: 24px; height: 24px;
        opacity: 0.7;
        transform: translateY(-50%);
        background: url('../img/search_icon.png') no-repeat;
        &:focus {
            border-radius: 8px;
            outline-offset: 0.4rem;
            outline: 2px solid rgba(36, 107, 235, 0.8);
        }
    }
    @media screen and (max-width:600px) { 
        width: 100%; min-width: auto;
    }
}

/*============================================================= 
로그인
=============================================================== */
.login_area {
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    align-items: center; justify-content: center; align-items: stretch;
    width: 80%; margin: 80px auto 0 auto; border-radius: 10px;
    > .left {
        display: inline-flex; justify-content: center; flex-direction: column; align-items: center;
        width: 50%; text-align: center;
        border-radius: 10px 0 0 10px; background: #f3f7fb; 
        > img { width: 300px; 
            @media screen and (max-width:1280px) { width: 50%; }
        }
    }
    > .right {
        width: 50%; padding: 30px; 
        border-radius: 0 10px 10px 0; background: var(--hl-icegray-5);
        .login_field {
            > .login { 
                margin-bottom: 10px;
                > dt { margin-bottom: 5px; }
                > dd { 
                    margin-bottom: 20px; 
                    > input { width: 100%; }
                }
            }
            > .login_btn > a { width: 100%; }
            > .chk_area { margin-bottom: 30px; }
            > .login_bottom {
                display: -webkit-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 10px;
                > .btn:hover { text-decoration: underline; }
            }
        }
    }
    @media screen and (max-width:1280px) { 
        width: 100%; 
    }
    @media screen and (max-width:650px) { 
        margin: 50px auto 0 auto;
        > .left { display: none; }
        > .right { width: 100%; padding: 20px; border-radius: 10px; }
    }
}


/*============================================================= 
비밀번호 찾기 - 탭메뉴
=============================================================== */
.tabs {
    .manual {
        display: -webkit-box; display: -ms-flexbox; display: flex;
        .focus {
            width: 50%; height: 50px; text-align: center; color: #757575; font-size: 1.8rem; 
            padding: 10px 20px; background: #ddd; 
            cursor: pointer;
            &:hover {
                color: #333; background: var(--hl-primary-20);
            }
            &:focus,
            &[aria-selected="true"]{
                color: var(--hl-primary); font-weight: bold;
                border-top: 3px solid var(--hl-primary); 
                background: var(--hl-primary-5); 
            }
        }
    }
}
.tab_contents { padding: 15px 20px; background: var(--hl-primary-5); }

/* .tabs .manual { display: -webkit-box; display: -ms-flexbox; display: flex; }
.tabs .manual > .focus { width: 50%; height: 50px; text-align: center; color: #757575; font-size: 1.8rem; padding: 10px 20px; background: #ddd; cursor: pointer;}
.tabs .manual > .focus:hover { color: #333; background: var(--hl-primary-20); }
.tabs .manual > .focus:focus,
.tabs .manual > .focus[aria-selected="true"]
{ color: var(--hl-primary); border-top: 3px solid var(--hl-primary); background: var(--hl-primary-5); font-weight: bold; }
.tab_contents { padding: 15px 20px; background: var(--hl-primary-5); }
.unVisual{ display: none; } */

/*============================================================= 
신규의사 등록, 협력병원 신청
=============================================================== */
.scr920_area { margin-top: 50px; }
.agree_field { 
    > .chk_area {
        display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: flex-end;
        @media screen and (max-width:600px) { 
            flex-direction: column;
            align-items: flex-end;
        }
    }
    > .tit { font-size: 1.25em; color: #143556; padding: 1em 0; border-bottom: 2px solid #143556; text-align: left;}
    > .agreebox { height: 250px; border: 1px solid #e5e5e5; padding: 10px; margin: 0 0 8px 0; overflow: auto; line-height: 150%; font-weight: normal; background: #f5f5f5;}
    > .agreebox { 
        > p { padding-left: 10px; margin-top: 0; word-break: keep-all;}
    }
}

/*============================================================= 
신규의사 등록 - 아이핀 인증, 휴대전화 인증
=============================================================== */
.scr921_area { 
    > .flex {
        display: -webkit-box; display: -ms-flexbox; display: flex;
        > .left  { 
            width: 50%; 
            padding: 20px; 
            border-right: 1px dashed #ccc;
        }
        > .right { 
            width: 50%; padding: 20px; 
            > .confirm_01 { 
                > dl { 
                    display: -webkit-box; display: -ms-flexbox; display: flex; 
                    align-items: center;
                    &:nth-of-type(1),
                    &:nth-of-type(2) { border-top: 2px solid #ccc; }
                    > dt { 
                        width: 20%; height: 48px; 
                        line-height: 48px;
                        text-align: center;
                        border-bottom: 1px solid #ccc;
                        background: var(--hl-icegray-10);
                        > label { display: block; width: 100%; text-align: center; }
                    }
                    > dd { 
                        display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center;
                        width: 100%; height: 48px;
                        padding: 5px;
                        border-bottom: 1px solid #ccc;
                        > input { height: 40px; margin-right: 10px; width: 230px; }
                    }
                }
            }
            > .confirm_02 {
                display: -webkit-box; display: -ms-flexbox; display: flex;
                padding: 10px 0;
                input { margin-right: 10px; }
            }
        }

        @media screen and (max-width:1024px) { 
            flex-direction: column;
            > .left  { 
                width: 100%;
                padding: 30px 0;
                border-right: none; 
                border-bottom: 1px dashed #ccc;
            }
            > .right { 
                width: 100%; 
                padding: 30px 0; 
                > .confirm_01 {
                    margin-bottom: 20px;
                    > dl { 
                        flex-direction: column;
                        align-items: left;
                        > dt, 
                        > dd {
                            width: 100%;
                            height: auto;
                            > input { width: 100%; }
                            > a { width: 100%; }
                            &.item {
                                > input { width: 60%;}
                                > a { width: 40%;}
                            }
                        }
                    }
                }
                > .confirm_02 {
                    > input { width: 60%; }
                    > a { width: 40%; }
                }
            }
        }
    }
    /* 의사등록 */
    .confirm_03 {
        padding: 20px 0; border-top: 2px solid #ccc; border-bottom: 2px solid #ccc;
        > dl { 
            display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center;
            > dt { 
                width: 30%; height: 48px; line-height: 48px; text-align: center;
                > label { display: block; width: 100%; }
            }
            > dd { 
                display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center;
                width: 100%; height: 48px; padding: 5px;
                > input { height: 40px; margin-right: 10px; width: 230px; }
            }
        }
        @media screen and (max-width:500px) {
            > dl { flex-direction: column; align-items: flex-start; }
            > dl > dt { width: 100%; text-align: left; }
            > dl > dd > input { width: 100%; }
        }
    }
}

/*============================================================= 
의사정보수정
=============================================================== */
.scr922_area .flex  { 
    @media screen and (max-width:800px) {
        display: -webkit-box; display: -ms-flexbox; display: flex;
        flex-direction: column;
        align-items: flex-start !important;
        > input { margin-bottom: 10px; }
        > select { width: 100%; }
    }
}



/*============================================================= 
의뢰하기 - 진료의뢰
=============================================================== */
/* 탭메뉴 */
.scr200_area {
    > .top_flex { 
        display: -webkit-box; display: -ms-flexbox; display: flex;
        justify-content: space-between;
        > p { width: 80%; }
        @media screen and (max-width:600px) {
            flex-direction: column; margin-bottom: 10px;
            > p { width: 100%; }
        }
    }

    > .tab_w50 { 
        width: 50%; margin: 0 auto 40px auto; 
        @media screen and (max-width:1024px) {
            width: 100%;
        }
        @media screen and (max-width: 600px) {
            display: none;
        }
    }

    > .tab_w80 { 
        width: 80%; margin: 0 auto 40px auto; 
        @media screen and (max-width:1024px) {
            width: 100%;
        }
        @media screen and (max-width:600px) {
            display: none;
        }
    }

    .tab_select { 
        display: none; 
        @media screen and (max-width:600px) {
            display: block; width: 100%; 
            .t_select { width: 100%; background: #fff url('../img/sch_arr_icon.png') no-repeat right 20px center; border: 1px solid #777; }
        }
    }

    .sub_tab01 { display: table; width: 100%; table-layout: fixed; }
    .sub_tab01 li { display: table-cell; border: 1px solid #cccccc; text-align: center; border-right: none; vertical-align: middle; list-style-type: none; } 
    .sub_tab01 li:last-child { border-right: 1px solid #cccccc; } 
    .sub_tab01 li a { padding: 12px 10px; display: block; font-weight: 500; font-size: 1.8rem; line-height: 1.5; transition: all 0.5s; } 
    .sub_tab01 li:hover { background: var(--hl-primary); transition: all 0.5s; }
    .sub_tab01 li:hover a { color: #fff; transition: all 0.5s; }
    .sub_tab01 li.active { background: var(--hl-primary); border: 1px solid var(--hl-primary); } 
    .sub_tab01 li.active a {color: #fff !important;}
}
/* 테이블 - 입력양식 */
.requests_field {
    .style {
        > tbody > tr > td {
            .w_01 { min-width: 300px; height: 4rem; border-radius: 6px;} 
            .w_01:disabled { color: #777; background: #eeeeee;}
            .w_02 { width: 50px; height: 4rem; border-radius: 6px;} 
            .w_03 { min-width: 200px; height: 4rem;  }
            .flex { display: -webkit-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; align-items: flex-end; width: 100%;}
            .flex .text_desc { width: 80%; height: 120px; padding: 10px; border-radius: 6px; margin-right: 10px; }
            
            @media screen and (max-width:1000px) {
                .w_01 { min-width: 250px; }
                .flex { flex-wrap: wrap; }
                .flex .text_desc { width: 100%; }
            }
            @media screen and (max-width:800px) {
                .mo_check { flex-wrap: wrap; gap: 5px;}
                .w_01 { width: 100%; min-width: auto;}
                .select_01 { margin-bottom: 5px; }
            }
        }
        @media screen and (max-width:800px) {
            > tbody > tr > th > label > br { display: none;}
        }
    }

    /* 의뢰환자조회 - 진료의뢰 */
    .style_01 {
        > thead > tr > th { font-size: 1.5rem; padding: 6px 4px; }
        > tbody > tr > td { 
            font-size: 1.4rem; text-align: center;
            padding: 6px 4px; 
            > a { display: block; text-decoration: underline; }
        }

    }
}
/* 팝업 스타일 */
.position_r { position: relative; width: 100%; }
.pop_schedule {
    position: absolute; top: 50px; left: -10px; width: 900px; background:#fff; opacity:0; transition: all 0.3s; z-index: -1;
    box-shadow: 0 13px 27px -5px hsl(240deg 30% 28% / 25%), 0 8px 16px -8px hsl(0deg 0% 0% / 30%), 0 -6px 16px hsl(0deg 0% 0% / 3%);
    -webkit-box-shadow: 0 13px 27px -5px hsl(240deg 30% 28% / 25%), 0 8px 16px -8px hsl(0deg 0% 0% / 30%), 0 -6px 16px hsl(0deg 0% 0% / 3%);

    &.open { opacity:1; visibility:visible; z-index: 100;}
    .head_01 { 
        display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: space-between;
        width: 100%; padding: 10px 20px; background:#526daa; 
        .modal_title { display: inline-flex; font-size: 2.0rem; font-weight: 600; color: #fff; }
        .btn_close { display: block; width: 32px; height: 32px; }
        .btn_close::before, 
        .btn_close::after { content:''; width: 26px; height: 3px; display: block; background: #fff;}
        .btn_close::before { margin-top: 15px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
        .btn_close::after { margin-top: -3px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }
    }
    .pop_con { height: auto; padding: 20px; }
    .pop_con > .date_con { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 10px; padding: 10px; justify-content: center;}
    
    /* 팝업 테이블 */
    .style {
        > thead > tr,
        > tbody > tr {
            > th { font-size: 1.6rem; padding: 5px; }
            > td { font-size: 1.4rem; }
            .name1 > a { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 4px 6px; }
        }
    }
    @media screen and (max-width:1050px) {
        width: 80vw; top: 90px;
    }
    @media screen and (max-width:800px) {
        width: 93vw; left: 0;
        &.open { display: block; }
        .pop_con > .date_con > .body_m { font-size: 1.6rem; word-break: keep-all; }
        .style {
            > thead > tr,
            > tbody > tr {
                > td { padding: 0; }
                .name1 > a { flex-wrap: wrap; justify-content: center; }
            }
        }
    }
    @media screen and (max-width:600px) {
        .pop_con > .date_con > .body_m { font-size: 1.4rem; }
        .style {
            > thead > tr,
            > tbody > tr {
                > th { font-size: 1.2rem; padding: 0; font-weight: normal; }
                > td { font-size: 1.2rem; padding: 0;  }
                .name1 > a { font-size: 1.2rem; padding: 0;}
            }
        }
    }
}

/*============================================================= 
의뢰하기 - 검사의뢰
=============================================================== */
.request_check { 
    position: relative; width: 100%;
    > .chk_area { display: -webkit-box; display: -ms-flexbox; display: flex; flex-direction: column; align-items: flex-start;
        > .form_check { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }
    }
}

/* 처방내용 - 검사항목 및 비용에 관한 스타일 */
.layer_area {
    position: relative;
    > .layer1 { 
        position: absolute; left: 220px; top: 0px;  
        width: 600px; height: auto; 
        padding: 10px; 
        border:1px solid var(--hl-primary); 
        background-color:#fff; 
        z-index: 99;
        > .btn_close { 
            display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: flex-end; width: 100%;
            > img { padding: 10px; }
        }
        > .layer_con {
            overflow:auto; padding-top:10px;
            > table > tbody > tr > th { font-size: 1.4rem; }
            > table > tbody > tr > td { font-weight: normal; font-size: 1.4rem; }
        }
    }
    @media screen and (max-width:860px) {
        > .layer1 {  width: 95vw; top: 190px; left: 0; }
    }
    @media screen and (max-width:500px) {
        display: -webkit-box; display: -ms-flexbox; display: flex; gap: 20px;
        > .layer1 {
            > .layer_con {
                > table > tbody > tr > th,
                > table > tbody > tr > td { padding: 2px; font-size: 1.2rem;}
            }
        }
    }
}

/* 처방내용에 관한 팝업 스타일 */
.layer_info { 
    position: absolute; 
    top: 0; right: 0; 
    width: 450px; height: auto;
    padding: 10px; 
    border: 1px solid var(--hl-primary); 
    background-color:#fff; 
    z-index: 98; overflow: auto; 
    > .top { 
        display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: space-between; 
        margin-bottom: 10px;
        > .tit { font-weight: bold; font-size: 1.6rem;}
        > .btn_close > img { padding: 5px;}
    }
    @media screen and (max-width:500px) {
        width: 90vw; top: 200px; 
        > ul > li { font-size: 1.4rem; }

    }
}

/*============================================================= 
의뢰환자조회 - 검사의뢰
=============================================================== */
/* searchform */
.search_area { display: -webkit-box; display: -ms-flexbox; display: flex; }
.search_01 { display: -webkit-box; display: -ms-flexbox; display: flex; }
.div_sh { display: inline-block; margin-right: 10px; }
.div_date { display: inline-block; }

@media screen and (max-width:800px) {
    .search_area { flex-direction: column; }
    .search_01 { flex-direction: column; }
}
/*----------------------------------------------------------------*/
/* 테이블 스크롤 */
@media screen and (max-width:1000px) {
    .table_100 { width: 100%; overflow: auto; 
        > fieldset { min-width: 1000px; }
    }
}
@media screen and (max-width:800px) {
    .mo_hidden { display: none; }
}

/* 툴팁 option */
.tooltip {
    position: relative;
    > .tool_table {
        > tbody > tr > th { padding: 4px 6px; font-size: 1.4rem; background: var(--hl-primary-20); }
        > tbody > tr > td { padding: 4px 6px; font-size: 1.4rem; background: #fff; white-space: nowrap; }
        > tbody > tr > th:not(:last-child),
        > tbody > tr > td:not(:last-child) { border-right: 1px solid var(--hl-primary-30); }
        position: absolute;
        display: none;
        width: auto;
        bottom: -120%;
        left: 0;
        text-align: center;
        border: 1px solid var(--hl-primary);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        z-index: 98;
    } 
    &:hover > .tool_table ,
    &:focus > .tool_table { 
        display: block; 
        @media screen and (max-width:800px) {
            display: none;
        }
    } 
}

/* 검사결과 테이블 */
.table_hidden {
    display: none;
    &.open { display: contents;}
}
.table_wrap_01 {
    position: relative; left: 0; background: #fff; z-index: 1; width: 100%; 
    padding: 10px; margin: 10px 0; 
    border: 2px solid var(--hl-primary);
    transition: all 0.3s;
    .table_top { 
        position: relative; padding: 10px; margin-bottom: 10px; background: #f0f0f0;
        > .title_03 { margin-bottom: 0; }
        > .btn_close { 
            position: absolute; top: 5px; right: 0; z-index: 1;
                > img { padding: 10px; }
            }
    }
    .board_area { 
        position: relative;
        display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; 
        > .board1 { width:38%; margin-bottom: 10px; margin-right: 2%; }
        > .board2 { width:60%; margin-bottom: 10px; }
        > .board3 { width:100%; }
        .board_top { display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
        .boardList	{ border-top: 2px solid var(--hl-primary); border-bottom: 1px solid #ddd; }
        .boardList > thead > tr > th { border-left:0; border-right:0; padding:6px 4px; background:#f8f8f8; }
        .boardList > tbody > tr > td { padding: 6px 0 4px 0; text-align: center; border-top: 1px solid #ddd; }
        .boardList > tbody > tr > td > a { text-decoration: underline; }
        .date1 { color:#888; }

        @media screen and (max-width:800px) {
            flex-direction: column;
            > .board1 { width: 100%; }
            > .board2 { width: 100%; }
        }
        @media screen and (max-width:500px) {
            .boardList > thead > tr > th { font-size: 1.4rem; }
            .boardList > tbody > tr > td { font-size: 1.4rem; }
        }
    }
} 

/* layer - popup */
.layer_pop_s { position: absolute; display: block; top: 0; left: 0; background:#fff; border: 2px solid var(--hl-point);padding:15px;}
.layer_pop_s > p { text-align: center; margin-bottom: 10px; }



/*============================================================= 
Print - 진료의뢰서
=============================================================== */
.print_contents {
    padding: 20px;
    max-width: 780px;
    .print_logo { 
        display: -webkit-box; display: -ms-flexbox; display: flex; 
        justify-content: space-between;
        align-items: center;
        > .logo_01 {
            > img { width: 180px; }
        }
        > .logo_02 { font-size: 3.0rem; color: #757575;}
    }

    .print_table { 
		border-top: 3px solid var(--hl-point-90);
        &.padding_no {
            tbody > tr > th { padding: 0 4px; }
            tbody > tr > td { 
                padding: 0 4px; 
                input { height: 36px; font-size: 1.3rem; margin-top: 1px; }
                label { font-size: 1.5rem; padding: 6px; }
            }
        } 

		> tbody > tr {
            font-size: 1.3rem;
			> th {
				text-align: center; word-break: keep-all;
				padding: 8px;
				background-color: var(--hl-point-5); 
				border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; 
				vertical-align: middle; 
				&:first-child { border-left: none;}
			}
			> td { 
				color: #555; word-break: keep-all;
				padding: 8px; 
				vertical-align: middle; 
				border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; 
				&:first-child { border-left: none; }
			}
            .input_box_kn {
                > input { width: 70px; height: 34px !important; }
            }
		}
	}

    .table_in { 
        border-top: 1px solid #ddd;
        > tbody > tr { border-bottom: 1px solid #ddd; 
            > th { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 4px; background: var(--hl-point-5); }
            > td { padding: 6px; }
        }
    }
    .agree {
        padding: 10px 20px;
        border: 4px solid #ddd; 
        > .flex { 
            display: -webkit-box; display: -ms-flexbox; display: flex;
            justify-content: flex-end;
            > .right { 
                float: right;
                .noline { border: none !important; height: 36px;}
                > p, strong { font-size: 1.4rem; }
            }
        }
    }
    .agree_kn {
        padding: 10px 20px;
        border: 4px solid #ddd; 
        > .flex { 
            font-size: 1.2rem;
            > .left {
                input { width: 100px; height: 26px; font-size: 1.2rem; border-radius: 0; border: none; border-bottom: 1px solid #ccc;}
            }
            > .right { 
                float: right;
                .noline { border: none !important; height: 36px; font-size: 1.2rem;}
            }
        }
    }
    .footer { font-size: 1.2rem; font-family: '나눔고딕';}
    .footer_cc { 
        font-size: 1.3rem; font-family: '나눔고딕';
        display: -webkit-box; display: -ms-flexbox; display: flex; 
        align-items: center; justify-content: space-between; 
        padding: 0;
        > ul { 
            width: 50%; 
            &:last-child { text-align: right; }
        }
    }

    .print_check .flex { 
        display: -webkit-box; display: -ms-flexbox; display: flex; 
        > .chk_list { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; margin-right: 10px; }
        > .chk_list > input[type="checkbox"] { width: 18px; height: 18px; }
    } 
    .print_check_kn .flex { 
        display: -webkit-box; display: -ms-flexbox; display: flex; flex-direction: column;
        > .chk_list { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; margin-right: 10px; 
            > label { font-size: 1.2rem; padding-top: 0; }
        }
        > .chk_list > input[type="checkbox"] { width: 16px; height: 16px; }
    } 

}

@media print { 
    @page {
        size:A4;
    }
	html, body {
        height: auto; 
        margin: 0 !important; 
        padding: 0 !important;
        overflow: hidden;
    }
    /* 빈 페이지를 방지하기 위한 설정 */
    .empty-page {
        display: none; /* 빈 페이지로 간주되는 요소 숨김 */
    }
    .print_top { display: none; }
    .body_s { font-size: 1.3rem; }
}
/*============================================================= 
새창으로 보기 - 검사결과
=============================================================== */
.pop_table_wrap {
    position: relative; 
    padding: 10px; margin: 10px; 
    border: 2px solid var(--hl-primary);
    background: #fff; 
    transition: all 0.3s;
    .table_top { 
        padding: 10px; margin-bottom: 10px; background: #f0f0f0;
        > .title_03 { margin-bottom: 0; }
        > .btn_close { 
            position: absolute; top: 15px; right: 10px; z-index: 1;
            > img { padding: 10px; }
        }
    }
    @media all and (max-width:600px){
        > .table_area > table {
            tr { display: -webkit-box; display: -ms-flexbox; display: flex; flex-direction: column; }
            th { border-left: none!important;}
            td { border-left: none!important;}
        }
    }
}

/*============================================================= 
새창으로 보기 - 병원선택 팝업(의사정보수정 페이지)
=============================================================== */
.pop_hospital_01 {  
    position: relative; 
    margin:5px;
    border: 2px solid var(--hl-primary);
    background: #fff; 
    transition: all 0.3s;
    > .table_top { 
        padding: 10px; margin-bottom: 10px; background: #f0f0f0;
        > .title_03 { margin-bottom: 0; }
        > .btn_close { 
            position: absolute; top: 2px; right: 0; z-index: 1;
            > img { padding: 10px; }
        }
    }
    > .table_con { 
        padding: 10px;
        > .table_01 { 
            border-top: 3px solid var(--hl-point-90); 
            border-bottom: 1px solid #5d5d5d;
            > thead > tr,
            > tbody > tr {
                &:hover { 
                    background-color: var(--hl-gray-5); cursor: pointer; 
                }
                > th {
                    text-align: center; word-break: keep-all;
                    padding: 5px; font-size: 1.5rem;
                    border-bottom: 1px solid #ddd; 
                    background-color: var(--hl-point-5); 
                    &:first-child { border-left: none;}
                }
                
                > td { 
                    color: #555;
                    vertical-align: middle;
                    padding: 5px; font-size: 1.4rem; 
                    border-bottom: 1px solid #ddd; 
                    &:first-child { border-left: none; }
                }
            }
            .selected { background: #ffeeee !important; }
        }
        > form > .search_bar { padding: 10px; }
    }
}

/*============================================================= 
회송환자조회 
=============================================================== */
.modal_pop { 
    width:100%; height:100%; position:fixed; top:0; left:0; background:rgba(0,0,0,0.75); visibility:hidden; opacity:0; 
    -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out; z-index: 100;
}
.modal_pop.open { opacity:1; visibility:visible; }
.modal_pop .modal { 
    position:relative; display:block; top:0; left:0; width:50%; margin: 0 25%; background:#fff; opacity:0;
    -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;
}
.modal_pop.open .modal { margin-top: 10%; opacity:1; }
.modal_pop .modal .head { width: 100%; padding: 10px 20px; overflow: hidden; background:#f0f0f0; }
.modal_pop .modal .head > h2 { display: inline-block; font-size: 2rem; font-weight: 600; }
.modal_pop .modal .btn_close { width: 26px; height: 30px; display: block; float: right; }
.modal_pop .modal .btn_close::before, 
.modal_pop .modal .btn_close::after { content:''; width: 26px; height: 2px; display: block; background: #333;}
.modal_pop .modal .btn_close::before { margin-top: 15px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
.modal_pop .modal .btn_close::after { margin-top: -2px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }

.modal_pop .modal .con { padding: 20px; }
.btn_area { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; gap: 10px;}


@media all and (max-width:1280px){
    .modal_pop .modal { width: 90%; margin-left: 5%; }
}
@media all and (max-width:600px){
    .btn_area { flex-wrap: wrap; justify-content: space-between;}
    .btn_area > input { width: 100%; margin-bottom: 20px;}
    .btn_area > input:nth-of-type(2) { width: 47%; }
    .btn_area > input:nth-of-type(3) { width: 47%; }
}

/*============================================================= 
연수강좌/교육
=============================================================== */
/* 달력 */
.calendar { position: relative; }
.calendar .cal_top { text-align: center; margin-bottom: 30px;}
.calendar .cal_top .ca_dateY { font-size: 1.6rem; padding: 5px 16px; min-width: 110px; }
.calendar .cal_top .ca_dateM { font-size: 1.6rem; padding: 5px 16px; min-width: 90px; }

.cal_tab { width: 100%; }
.cal_tab > a { display: inline-block; min-width: 7%; margin-bottom: 10px; }
.cal_tab .btn_cal { display: block; color: #555; text-align: center; background: #f6f6f6; border-radius: 20px; padding: 5px 15px; transition: all 0.4s;}
.cal_tab .btn_cal:hover,
.cal_tab .btn_cal.on { border-radius: 20px; background-color: var(--hl-point); color:#fff; }

/* 달력 요일 */
.cal_bottom .cal_header { display:-webkit-box; display:-ms-flexbox; display:flex; text-align: center; background: #f3f3f3; border-top: 3px solid #143556; border-bottom: 1px solid #ddd; }
.cal_bottom .cal_header > div { height: 46px; line-height: 46px; font-weight: bold; color: #666; border-right: 1px solid #ddd; }
.cal_bottom .cal_header > div:last-child { border-right: 0; }
.cal_bottom .cal_header .Sun { color: #cc2220; }
.cal_bottom .cal_header .Sun, .cal_bottom .cal_date .Sun { width: 12%; }
.cal_bottom .cal_header .Mon, .cal_bottom .cal_date .Mon { width: 15%; }
.cal_bottom .cal_header .Tue, .cal_bottom .cal_date .Tue { width: 15%; }
.cal_bottom .cal_header .Wed, .cal_bottom .cal_date .Wed { width: 15%; }
.cal_bottom .cal_header .Thu, .cal_bottom .cal_date .Thu { width: 15%; }
.cal_bottom .cal_header .Fri, .cal_bottom .cal_date .Fri { width: 15%; }
.cal_bottom .cal_header .Sat, .cal_bottom .cal_date .Sat { width: 13%; color:#2453a5; }

/* 달력 날짜 */
.cal_bottom .cal_date { display:-webkit-box; display:-ms-flexbox; display:flex; }
.cal_bottom .cal_date .today { background:#fff8cf; }
.cal_bottom .cal_date .Sun { color:#cc2220; }
.cal_bottom .cal_date > div { min-height: 80px; padding: 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.cal_bottom .cal_date > div:last-child { border-right: 0; }
.cal_bottom .cal_date time .Ym { display: none; }
.cal_bottom .cal_date time .W { display: none; }
.cal_bottom .cal_date .holiday { font-size: 1.4rem; color: #cc2220; }

/* 교육별 컬러구분 */
.cal_bottom .cal_date > div .dal_con { margin-top: 10px; }
.cal_bottom .cal_date .dal_con > a { display: block;  font-size: 1.4rem; margin-bottom: 10px; }
.cal_bottom .cal_date .dal_con > a:hover { color: var(--hl-point); text-decoration: underline; }
.cal_bottom .cal_date .dal_con .dead_box { margin-right: 5px; padding: 2px 5px; border-radius: 5px; color: #333 !important; background-color:#ddd; }
.cal_bottom .cal_date .dal_con .sch_box  { margin-right: 5px; padding: 2px 5px; border-radius: 5px; color: #fff !important; background-color:#4460cf; }
.cal_bottom .cal_date .dal_con .reg_box  { margin-right: 5px; padding: 2px 5px; border-radius: 5px; color: #fff !important; background-color:#d6386d; }


@media all and (max-width:800px){ 
    .edu_tab .sub_tab02 { width: 55%; }
    .edu_tab .sub_tab02 li a { font-size: 1.6rem; padding: 12px 10px; }
    .edu_tab .btn_edu { font-size: 1.6rem; }

    .cal_bottom > ul { border-top: 3px solid #143556; }
    .cal_bottom .cal_header { display: none; }
    .cal_bottom .cal_date { width: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
    .cal_bottom .cal_date > div { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100% !important; padding: 0; border-right: 0; }
    .cal_bottom .cal_date > div .dal_con { width: 70%; padding: 10px; }
    .cal_bottom .cal_date time { width: 30%; padding: 10px; font-weight: 600; background: #f4f4f4; }
    .cal_bottom .cal_date time .Ym { display: block; font-weight: normal; margin-bottom: 5px; }
    .cal_bottom .cal_date time .W { display: inline-block; }
    .cal_bottom .cal_date .deliberate1 { padding: 10px 0; width: 48%; display: inline-block; }
    .cal_bottom .cal_date .deliberate2 { padding: 10px 0; width: 48%; display: inline-block; }
    .cal_bottom .cal_date .holiday { display: block; }
}

@media all and (max-width:400px){
    .modal_wrapper.open { overflow: auto; }
    .cal_bottom .cal_date > div .dal_con { width: 60%; }
    .cal_bottom .cal_date time { width: 40%;}
    .cal_bottom .cal_date time .Ym { font-size: 1.4rem; }
    .cal_bottom .cal_date .deliberate1 { width: 100%; }
    .cal_bottom .cal_date .deliberate2 { width: 100%; }

    .edu_tab { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
    .edu_tab .sub_tab02 { width: 100%; }
    .edu_tab .btn_edu { width: 100%; margin-bottom: 20px; }
}


/* 오른쪽 배경없는 검색창 */
.search_right { position: relative; text-align: center; padding: 15px 0 15px; }
.search_right input { width: 40%; background: #eee; border: none;}
.search_right fieldset { display: -webkit-box; display: -ms-flexbox; display: flex; 
	-webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; 
	-ms-flex-line-pack: center; align-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; 
	-webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; 
}

@media all and (max-width:1024px){ 
	.search_area input { width: 60%;}
}
@media all and (max-width:800px){ 
	.search_area input { width: 50%;}
	.search_right input { width: 80% }
}
@media all and (max-width:500px){ 
	.search_area { text-align: left;}
	.search_area fieldset { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
	.search_area input { width: 80%;}
}


/* 교육알림신청 - 팝업 */
.scr400_area {
    > .modal_pop {
        .chk_area { 
            display: -webkit-box; display: -ms-flexbox; display: flex; flex-wrap: wrap;
            > strong { width: 14%; }
            @media all and (max-width:500px){ 
                > strong { width: 50%; }
                > input { width: 100%; }
            }
        }
    }
}

/*============================================================= 
이용문의
=============================================================== */
.scr500_area { position: relative; }
.btn_regis { display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: flex-end; margin-bottom: 10px;}

.filebox > label { 
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    cursor: pointer;
    > .file_name {
        display: block;
        height: 46px; 
        padding: 0 12px; 
        font-size: 1.6rem; 
        line-height: 42px;
        overflow: hidden;
        white-space: nowrap; 
        margin-right: 5px;
        text-overflow: ellipsis;
        border-radius: 6px;
        border: 1px solid #ddd;
        &:focus,
        &:hover { 
            outline-offset: -0.4rem; 
            outline: 2px solid var(--hl-information);
        }
    }
    > input[type="file"] {overflow: hidden;position: absolute;width: 1px;height: 1px;margin: -1px;font-size: initial;clip: rect(0 0 0 0);}
    > input[type="file"]:focus-visible ~ .file_btn, 
    .file_cus:hover .file_btn {
        outline-offset: -0.4rem; 
        outline: 2px solid var(--hl-primary);   
    }
    @media all and (max-width:500px){
        flex-direction: column;
        > .file_name {
            margin-bottom: 10px;
        }
    }
}

.table_502 {
    > tr > td .w_size1 { width: 30%; }
    > tr > td .w_size2 { width: 80%; }

    @media all and (max-width:1024px){ 
        > tr > th { width: 25%; }
        > tr > td .w_size1 { width: 100%; }
        > tr > td .w_size2 { width: 100%; }
    }
    @media all and (max-width:500px){
        > tr > th { display: block; width: 100%; text-align: left !important; }
        > tr > td { display: block; width: 100%; border-left: none !important; }
    }
}


/*============================================================= 
약품정보검색, 건강정보 자료실
=============================================================== */
.scr590_area {
    .search_bar { 
        > .select_01 { width: 23%; }
        > .sch_input { width: 40%; }
        @media all and (max-width:1024px){
            > label { display: block; }
        }
        @media all and (max-width:600px){
            flex-direction: column;
            > .select_01 { width: 100%; }
            > .sch_input { width: 100%; }
        }
    }
    @media (max-width: 800px){
    > .table_area > .table_02 > tbody > tr > td {
            padding: 1px 10px 1px 10px; 
            > a { width: 85%; 
                &:active { text-decoration: underline; }
            }
            &:before { 
                position: relative;
                width: 15%; 
                text-align: left; 
            }
        }
    }
}

/*============================================================= 
건강정보 자료실 - 상세페이지
=============================================================== */
.news_area {
    width: 100%;
    border-top: 3px solid var(--hl-point-90);
    border-bottom: 1px solid #5d5d5d;
    > .news_top  { 
        > .tit  { padding: 15px 10px; border-bottom: 1px solid #ddd;  font-size: 1.8rem; 
            @media all and (max-width:800px){
                font-size: 1.6rem;
            }
        }
        > .date { padding: 15px 10px; border-bottom: 1px solid #ddd; }
    }
    > .news_con  { 
        padding: 30px 10px;
        > .video {
            position: relative;
            width: 100%;
            height: 0; 
            padding-bottom: 56.25%; 
            > iframe { 
                position: absolute;
                top: 0; 
                left: 0;
                width: 100% !important; 
                height: 100% !important; 
            }
        }
        > img { display: block; margin-inline: auto; }
    }
    > .news_file { 
        border-top: 1px solid #999; 
        padding: 15px 10px; 
        background: #efefef; 
        > li { 
            display: block; margin-bottom: 10px; 
            /* @media all and (max-width:600px){
                > a {         
                    display: block; 
                    overflow: hidden;
                    text-overflow: ellipsis;
                    line-height: 40px;
                }
            } */
        }
    }

    > .news_list { 
        > p { 
            font-size: 1.8rem;
            padding: 15px 10px; 
            border-top: 1px solid #ddd; 
            > a:hover { color: var(--hl-primary); text-decoration: underline; }
            @media all and (max-width:800px){
                > b { height: 100%; display: block;}
                font-size: 1.6rem;
            }
        }
    }
}


/*============================================================= 
교육장소 이용안내
=============================================================== */
.scr480_area {
    > .flex { 
        display: -webkit-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; gap: 20px;
        > .tBox { 
            width: calc(100%/3 - 14px); 
            @media all and (max-width:800px){
                width: calc(100%/2 - 10px);
            }
            @media all and (max-width:500px){
                width: 100%;
            }
        }
    }
}

/*============================================================= 
동탄 - 센터장 인사말
=============================================================== */
.dt_scr110_area {  
    > .flex { 
        display: -webkit-box; display: -ms-flexbox; display: flex; 
        align-items: flex-start; 
        > img { width: 25%; flex-basis: 330px; }
        > .text { width: 75%; padding: 20px; }
        @media all and (max-width:600px){
            flex-direction: column;
            align-items: center;
            padding-top: 20px;
            > img { width: 50%; flex-basis: auto;}
            > .text { width: 100%; }
        }
    }
}

/*============================================================= 
동탄 - 검사의뢰 안내
=============================================================== */
.dt_scr140_flex { 
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    flex-wrap: wrap;
    gap: 20px; margin: 20px 0 0 20px;
    > .tBox { width: calc(100%/2 - 10px); }
    @media all and (max-width:800px){
        margin: 20px 0 0 0; gap: 0;
        > .tBox { width: 100%; }
    }
}

/*============================================================= 
동탄 - 검사의뢰 안내 - 251208 컨텐츠 수정
=============================================================== */
.dt_scr140_251208 {
    .process_01 { margin-bottom: 40px; }
    .process_01 .flex > li .t01 { display: inline-block; width: 50px; text-align: center; padding: 4px 10px; border-radius: 6px; margin-right: 10px; color: var(--hl-white); background:#198754; }
    .process_01 .flex > li .t02 { display: inline-block; width: 50px; text-align: center; padding: 4px 10px; border-radius: 6px; margin-right: 10px; color: var(--hl-white); background:#d63384; }
    .process_01 { width: 100%; margin: 0 auto; }
    .process_01 .flex { position: relative; display: flex; align-items: center; gap: 20px; padding: 10px; border-radius: 10px; margin-bottom: 80px; background: #edf0f6; }
    .process_01 .flex:not(:last-child)::after { position: absolute; display: block; content: ''; bottom: -60px; left: 50%; width: 44px; height: 46px; margin-left: -22px; background: url('../img/arrBlue.png') no-repeat; }
    .process_01 .flex > li:nth-of-type(1) { display: flex; align-items: center; gap: 20px; min-width: 300px; font-size: 2.0rem; font-weight: 600; word-break: keep-all; }
    .process_01 .flex > li:nth-of-type(1) > span { display: flex; padding: 20px; border-radius: 10px; background: var(--hl-white);}
    .process_01 .flex > li:nth-of-type(2) { width: 75%; word-break: keep-all; }

    .process_02 { padding-left: 20px; }
    .process_02 .flex { display: flex; gap: 20px; }
    .process_02 .flex > li { position: relative; }
    .process_02 .flex > li > span { position: absolute; display: flex; justify-content: center; align-items: center; 
        top: -10px; left: -10px; width: 40px; height: 40px; 
        font-size: 2.2rem; color: var(--hl-white); border-radius: 6px; background: var(--hl-point); 
    }
    .process_02 .flex > li > img { border-radius: 10px; }

    @media all and (max-width:800px) {
        .process_01 .flex { align-items: flex-start; flex-direction: column; }
        .process_01 .flex > li:nth-of-type(2) { width: 100%; }
        .process_02 .flex { flex-wrap: wrap; }
        .process_02 .flex > li { width: calc(100%/2 - 10px); }
    }
    @media all and (max-width:500px) {
        .process_01 .flex > li:nth-of-type(1) { min-width: auto; }
        .process_02 .flex > li { width: calc(100%/2 - 10px); }
    }
    @media all and (max-width:360px) {
        .process_02 .flex > li { width: 100%; }
    }
} 

/*============================================================= 
춘천 - 메인진료의뢰서
=============================================================== */
.email_send { 
    position: absolute;
    right: 0;
    border-radius: 10px;
    padding: 10px; 
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    input { font-size: 1.3rem; }
    select { font-size: 1.3rem; }
}

/*============================================================= 
공통 - 이용가이드 팝업
=============================================================== */
.pop_hospital_01 {
    .tab_aria_01 { position: relative; z-index: 10; }
    .tab_aria_01 > ul > li > a {
        display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; transition: all 0.3s;
        &:hover { background: var(--hl-point); }
        &:focus { outline: 2px solid var(--hl-white); }
        &[aria-selected="true"] {
            color: var(--hl-white); background: var(--hl-point); border: 1px solid var(--hl-point); }
        }
    .swiper { width: 100%; height: 100%; }
    .swiper-slide { display: flex; align-items: center; justify-content: center; font-size: 18px; text-align: center; }
    .swiper-slide img { display: block; max-width: 800px; width: 100%; height: auto; margin: -2px auto 40px auto;}
    .swiper-pagination-bullet { width: 20px; height: 20px; text-align: center; line-height: 20px; font-size: 12px; color: #000; opacity: 1; background: rgba(0, 0, 0, 0.2); }
    .swiper-pagination-bullet-active { color: #fff; background: var(--hl-point); }
    .swiper-button-next, .swiper-button-prev { height: 70px; padding: 20px; color: var(--hl-point); transition: all 0.3s; background: rgba(0, 0, 0, 0.2);}
    .swiper-button-next:hover, .swiper-button-prev:hover { background:var(--hl-point); color: #fff;  }
}