
/* ======================== all page css start ======================== */
@charset "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
*{padding: 0px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;word-wrap:break-word;word-wrap:break-word;-ms-overflow-style: none;scrollbar-width: none;}
*:before,*:after{margin: 0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;word-wrap:break-word;word-wrap:break-word; -ms-overflow-style: none;scrollbar-width: none;}
* ::-webkit-scrollbar {display: none;}
/*=============*/
/*=============*/
html{font-size:16px;font-style:normal;word-wrap:break-word;padding: 0;margin: 0;height: 100%;width: 100%;}
body{font-family:Arial,'Noto Sans TC','Apple LiGothic Medium','Microsoft JhengHei','SimHei';width:100%;height:100%;font-size: 16px;}
img{width:100%;max-width:100%}
a{cursor:pointer}
a:hover,a:focus{text-decoration:blink;}
input:focus,textarea:focus{box-shadow:none;outline:0}
button:focus{outline: 0;}
input:focus,textarea:focus{box-shadow:none;outline:0}
ol, ul {list-style: none;margin-bottom: 0;}
/* ========================  all page css  end  ======================= */


/* ================================================================ */
/* ==                                                            == */
/* ==                        Header CSS Start                    == */
/* ==                                                            == */
/* ================================================================ */
.index_header_block{width: 100%;background-color:#032641;}
.index_header_block .header_img{padding: 15px 15%;}
.index_header_block .header_img img{width: 270px;/* height: 60px; */}

@media (max-width: 575.98px) { 
    .index_header_block .header_img img{width: 146px;height: auto;}
    .index_header_block .header_img{padding: 10px 15px;}
}
/* ================================================================ */
/* ==                                                            == */
/* ==                        Header CSS End                      == */
/* ==                                                            == */
/* ================================================================ */



/*============ index page content css start ============*/
.login_block{width:100%;padding:0 25%;flex-wrap:wrap;padding-top:50px}
.login_block .login_header{text-shadow:0 0 6px #0e33cd;font-family:Noto Sans TC;font-size:22px;font-weight:500;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:3.67px;text-align:center;color:#edf7fb;width:100%;display:flex;justify-content:center}
.login_block .titlestyle{width:100%;display:flex;text-shadow:0 0 5px #0e33cd;font-family:Noto Sans TC;font-size:16px;letter-spacing:2.5px;color:#eef8fc;position:relative;margin: 60px 0 20px;}
.login_block .inputstyle{background-color:rgba(255,255,255,0.9);display:flex;width:100%;height:35px;font-family:Noto Sans TC;font-size:15px;font-weight:400;letter-spacing:2px;text-align:left;color:#4b6677;padding:0 30px;border-radius:2px;border:0;box-shadow: 0 0 5px #0e33cd;}
.index_bgcolor{background-image:linear-gradient(to bottom,#032641,#084e75);height: calc(100vh - 130px);}
.login_block .titlestyle:nth-child(2)::after{content:"";background:url(../../assets/images/ic-username.svg)center center no-repeat;background-size:100%;width:25px;height:25px;position:absolute;left:38px}
.login_block .titlestyle:nth-child(4)::after{content:"";background:url(../../assets/images/ic-password.svg)center center no-repeat;background-size:100%;width:25px;height:25px;position:absolute;left:41px}
.login_block .login_btn{width:165px;height:50px;border-radius:1px;box-shadow:0 0 9px 1px rgba(55,135,255,0.75);background-color:#2dc3ed;display:flex;align-items:center;margin:120px auto 90px}
.login_block .login_btn .login_text{font-size:18px;font-weight:500;letter-spacing:3px;text-align:center;color:#ffffff;padding: 15px 60px 12px 63px;justify-content:center;}

.login_block ::-webkit-input-placeholder { color: #a4adb3;font-weight: 300;font-size: 14px; }
.login_block input::-moz-placeholder { color: #a4adb3;font-weight: 300;font-size: 14px; }
.login_block input::-moz-placeholder{color:#a4adb3;font-weight: 300;font-size: 14px;}
.login_block:-ms-input-placeholder{color: #a4adb3;font-weight: 300;font-size: 14px;}

.remember_btn{width: 100%;display: flex;text-shadow: 0 0 5px #0e33cd;font-family: Noto Sans TC;font-size: 16px;letter-spacing: 2.5px;color: #eef8fc;position: relative;margin: 40px 0 20px;}
.remember_style{}
.remember_btn .titlestyle{}
.remember_btn .remember_text{margin: 0 10px;}

.remember_btn input{background-color: #ff44cc;box-shadow: 0 0 5px #0e33cd;}




@media (max-width:575.98px){
    .login_block{padding:15%;padding-top:10px;padding-bottom:25%}
    .login_block .titlestyle{margin:30px 0 10px;font-size:15px}
    .login_block .login_btn{margin:70px auto 0}
    .index_bgcolor{height:calc(100vh - 123px)}
    .login_block .login_header{font-size:20px}
}

@media (min-width:576px) and (max-width:767.98px){
    .login_block{}
    .login_block .titlestyle{margin:50px 0 20px}
    .login_block .login_btn{margin:70px auto 0}
    .index_bgcolor{}
    .login_block .login_header{}
}

@media (min-width:768px) and (max-width:991.98px){
    .login_block{}.login_block .titlestyle{margin:50px 0 20px}
    .login_block .login_btn{margin:80px auto 0}
    .index_bgcolor{}
    .login_block .login_header{}
}

@media (min-width:992px) and (max-width:1199.98px){
    .login_block{}
    .login_block .titlestyle{}
    .login_block .login_btn{}
    .index_bgcolor{}
}

@media (min-width:1200px){}

/*============ index page content css end ============*/


/*============ other page content css start ============*/

/*== member_apply css start ==*/
.member_menu_bg{border-radius:1px;background-image:linear-gradient(to bottom,#032641,#084e75);padding:0 0 30px 0;width:100%}
.member_menu_bg .member_menu_position{width: calc(100% - 35%);display:flex;flex-wrap:nowrap;margin: 0 0 0 35%;border-bottom:1px solid #4790df;padding:40px 0 5px 0;}
.member_menu_position ul{text-shadow:0 2px 4px #0e33cd;font-family:Noto Sans TC;font-size:18px;font-weight:400;letter-spacing:4px;display:flex}
.member_menu_position ul li{display:flex;padding:0 20px;position:relative;margin:0 20px}
.member_menu_position ul li a{color:#ffffff;z-index: 99;}
.member_menu_bg .member_menu_position .list_style{font-size:17px;min-width:150px}
.member_menu_bg .member_menu_position .list_style.active::before{content:"";width: 143px;height: 12px;border-radius: 7px;box-shadow: 0 0 8px -2px #0791ff;background-color: #4790df;position: absolute;z-index: 0;left: 0;bottom: 0;}
.member_menu_bg .member_menu_position .list_style:nth-child(1)::after{content:"";background:url(../../assets/images/menu_upload.svg)center center no-repeat;background-size:100%;width:25px;height:25px;position:absolute;left:105px}
.member_menu_bg .member_menu_position .list_style:nth-child(2)::after{content:"";background:url(../../assets/images/menu_record.svg)center center no-repeat;background-size:100%;width:25px;height:25px;position:absolute;left:105px}
.member_menu_position .logout_text{font-size:14px;font-weight:300;letter-spacing:2.5px;text-align:center;color:#ffffff;padding:5px 0 0 20px;margin:0 0 0 40px;min-width:90px}
.member_menu_position .logout_but{font-size:15px;font-weight:300;letter-spacing:2.5px;text-align:center;padding:5px 0 0 5px;margin:0;min-width:40px}
.member_menu_position .logout_but a{color:#6bb2ff}

.apply_block{width:100%;flex-wrap:wrap;display:flex;margin: 100px 0 130px 0;}
.apply_block .apply_text_style{width:50%;margin:0;position:relative;font-size:16px;letter-spacing:2px;color:#6077af;margin:0}
.apply_block .apply_text_style.short{width:20%;min-width:120px;margin:0 80px}
.apply_block .apply_text_style:nth-child(1)::after{content:"";background:url(../../assets/images/info_name.svg)center center no-repeat;background-size:auto;width:20px;height:20px;position:absolute;left:-25px;top:0}
.apply_block .apply_text_style:nth-child(2)::after{content:"";background:url(../../assets/images/info_upload.svg)center center no-repeat;background-size:auto;width:20px;height:20px;position:absolute;left:-25px;top:0}
.category2 .apply_text_style:nth-child(1)::after{content:"";background:url(../../assets/images/info_remark.svg)center center no-repeat;background-size:auto;width:20px;height:20px;position:absolute;left:-25px;top:0}
.category2 .apply_text_style:nth-child(2)::after{content:"";background:url(../../assets/images/info_tooth.svg)center center no-repeat;background-size:auto;width:20px;height:20px;position:absolute;left:-25px;top:0}
.apply_text_style .inputstyle{width:100%;height:40px;background-color:#eff2f8;border:0;border-radius:2px;font-size: 15px;/* font-weight:500; */letter-spacing: 2.5px;color:#5f6783;padding:0 15px;margin: 5px 0 0 0;}
.apply_block .category{width:100%;display:flex;margin:30px 0}

.apply_block .login_btn{width:165px;height:50px;border-radius:1px;box-shadow: 0 0 9px 1px #4967af;background-color: #4967af;display:flex;align-items:center;margin: 80px 37% 90px;justify-content: center;}
.apply_block .login_btn .login_text{font-size:18px;font-weight:500;letter-spacing:3px;text-align:center;color:#ffffff;padding: 10px 35px;justify-content:center;}


.icon_select_mate{position:absolute;top:10px;font-size:16px;height:22px;transition:all 275ms;left:105px}
.select_mate{position:relative;width:120px;height:40px;box-shadow:1px 2px 10px -2px rgba(84,80,146,0.25);transition:all 375ms ease-in-out;font-size:15px;font-weight:500;letter-spacing:2px;text-align:center;color:#5b626f;background-color:#eff2f8}
.select_mate select{position:absolute;overflow:hidden;height:0;opacity:0;z-index:-1;display:flex}
.cont_list_select_mate{position:relative;float:left;width:100%}
.cont_select_int{position:absolute;left:-8%;z-index:999;overflow:scroll;width:116%;background-color:#fff;padding:0;margin-bottom:0;margin-top:0;border-radius:0 0 3px 3px;box-shadow:1px 4px 10px -2px rgba(0,0,0,0.2);transition:all 375ms ease-in-out;text-align:initial;height:0}
.cont_select_int li{position:relative;width:100%;border-bottom:1px solid #ffffff;list-style-type:none;padding:10px 2%;transition:all 275ms ease-in-out;display:block;cursor:pointer;background-color:#eff2f8;padding:5px 15px}
.cont_select_int li:last-child{border-radius:3px;border-bottom:0}
.cont_select_int li:hover{background-color:#6479b0;color:#fff}
.cont_select_int .active{background-color:#eff2f8}
.selecionado_opcion{cursor:pointer;padding:9px 0;text-align:initial;margin:0 0 10px 0}

.apply_text_style .inputstyle::-webkit-input-placeholder{font-weight:300}
.apply_text_style .inputstyle input::-moz-placeholder{font-weight:300}
.apply_text_style .inputstyle input::-moz-placeholder{font-weight:300}
.apply_text_style .inputstyle:-ms-input-placeholder{font-weight:300}

.apply_block .apply_text_style .upload_btn{border-radius:1px;border:solid 1px #4967af;font-size:15px;font-weight:400;letter-spacing:2.5px;text-align:center;color:#4967af;padding:2px 15px 1px;position:absolute;right:20px;top:35px;background-color:#eff2f8;cursor:pointer}
.apply_text_style .inputstyle.more_line{padding: 9px 15px;height: 90px;}



@media (max-width:479.98px){
    .member_menu_bg .member_menu_position{margin:0;width:100%}
    .member_menu_position ul{flex-wrap:wrap}
    .member_menu_bg .member_menu_position .list_style{font-size:15px;padding:0 0 0 10px;min-width:125px;margin:0 0 20px 20px}
    .member_menu_position .logout_text{margin:0 0 0 30px;width:75%;justify-content:flex-end}
    .member_menu_position .logout_but{padding:5px}
    .member_menu_bg .member_menu_position .list_style.active::before{width:120px;top:14px}
    .member_menu_bg .member_menu_position .list_style:nth-child(1)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:nth-child(2)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:first-child{margin:0 0 20px 40px}
    .apply_block{margin:30px 0 30px 0}
    .apply_block .category{flex-wrap:wrap;margin:0}
    .apply_block .apply_text_style.short{margin:0 30px 0 30px;width:100%}
    .apply_block .apply_text_style{margin:30px 30px 30px;width:100%}
    .apply_block .login_btn{margin:40px auto}
    .cont_select_int{width:110%;left:-5%}
    .apply_block .login_btn .login_text{}
}

@media (min-width:480px) and (max-width:575.98px){
    .member_menu_bg .member_menu_position{margin:0;width:100%}
    .member_menu_position ul{flex-wrap: wrap;}
    .member_menu_bg .member_menu_position .list_style{font-size: 15px;padding: 0 0 0 10px;min-width: 125px;margin: 0 0 20px 20px;}
    .member_menu_position .logout_text{margin: 0 0 0 30px;width: 75%;justify-content: flex-end;}
    .member_menu_position .logout_but{padding: 5px;}
    .member_menu_bg .member_menu_position .list_style.active::before{width:120px}
    .member_menu_bg .member_menu_position .list_style:nth-child(1)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:nth-child(2)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:first-child{margin: 0 0 20px 40px;}
    .apply_block{margin:96px 0 80px 0}
    .apply_block .category{}
    .apply_block .apply_text_style.short{margin:0 50px 0 30px}
    .apply_block .apply_text_style{margin:0 0 0 20px;width:57%;font-size:15px}
    .apply_text_style .inputstyle{font-size:14px}
    .cont_select_int{width:133%;left:-15%}
    .apply_text_style .inputstyle{font-size:14px}
    .apply_block .login_btn .login_text{padding:10px 15px;font-size: 16px;}
}

@media (min-width:576px) and (max-width:767.98px){
    .member_menu_bg .member_menu_position{margin:0;width:100%}
    .member_menu_position ul{margin:0 auto}
    .member_menu_bg .member_menu_position .list_style{font-size:15px;margin:0 0 0 15px;padding:0 0 0 10px;min-width:135px}
    .member_menu_position .logout_text{margin: 0 0 0 5px;}
    .member_menu_position .logout_but{}
    .member_menu_position .logout_but{}
    .member_menu_bg .member_menu_position .list_style.active::before{width:120px}
    .member_menu_bg .member_menu_position .list_style:nth-child(1)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:nth-child(2)::after{left:87px}
    .member_menu_bg .member_menu_position .list_style:first-child{margin:0 0 0 30px}
    .apply_block{margin:100px 0 120px 0}
    .apply_block .category{}
    .apply_block .apply_text_style.short{margin:0 50px 0 30px}
    .apply_block .apply_text_style{margin:0 0 0 20px;width:57%}
    .apply_text_style .inputstyle{font-size:14px}
    .cont_select_int{width:132%;left:-17%}
    .apply_block .login_btn .login_text{padding:10px 15px}
}

@media (min-width:768px) and (max-width:991.98px){
    .member_menu_bg .member_menu_position{margin:0 0 0 15%;width:calc(100% - 15%)}
    .member_menu_position ul{}
    .member_menu_bg .member_menu_position .list_style{}
    .member_menu_position .logout_text{margin: 0 0 0 5px;}
    .member_menu_position .logout_but{}
    .apply_block{margin:102px 0 100px 0}
}

@media (min-width:992px) and (max-width:1199.98px){}
@media (min-width:1200px){}

/*== member_apply css end ==*/





/*== member_record css start ==*/
table tr th{background:#337ab7;color:white;text-align:left;vertical-align:center}
.table>caption+thead>tr:first-child>td,.table>caption+thead>tr:first-child>th,.table>colgroup+thead>tr:first-child>td,.table>colgroup+thead>tr:first-child>th,.table>thead:first-child>tr:first-child>td,.table>thead:first-child>tr:first-child>th{background-color:#ccd4e2;font-size:14px;font-weight:400;letter-spacing:2.5px;color:#4967af;border:0;padding:5px 10px}
.table>thead:first-child>tr:first-child>th:nth-child(1){min-width:90px}
.table>thead:first-child>tr:first-child>th:nth-child(2){min-width:50px}
.table>thead:first-child>tr:first-child>th:nth-child(3){min-width: 730px;}
.table>thead:first-child>tr:first-child>th:nth-child(4){min-width:270px}
.table-striped>tbody>tr:nth-of-type(odd){background-color:#fff;border:0}
table.table-bordered.dataTable tbody th,table.table-bordered.dataTable tbody td{border:0;border-bottom:solid 1px #c5cad4;font-size:14px;letter-spacing:1.5px;color:#5f6783;padding:10px 10px;font-weight:300}
.panel-body{padding:0 15px 15px 15px}.list_contnet{background-color:#eff2f8;border:0}
.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{background-color:#4967af;border:0}.pagination>li>a,.pagination>li>span{border:0}.row{margin:20px 0;display:flex;flex-wrap:wrap}
.row.row:nth-child(1){justify-content:flex-end}.row.row:nth-child(2){overflow-x:scroll}
.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{background-color:#4967af;color:#fff}.date_choose_block{width:100%;display:flex;font-size:14px;letter-spacing:2.5px;color:#4967af;align-items:center;justify-content:flex-end;margin:40px 0 0}
.date_choose_block .date_but{width:158px;height:36px;border-radius:1px;background-color:#ccd4e2;margin:0 20px 0 10px}.date_choose_block .choose_but{width:63px;height:36px;border-radius:1px;border:solid 2px #4967af;background-color:#4967af;color:#fff;font-size:14px;display:flex;justify-content:center;align-items:center;margin:0 35px 0 0}
.timeform_ic{display:none}
.flatpickr_item input[type="text"],.flatpickr_item input[type="date"],.flatpickr_item input[type="datetime-local"],.flatpickr_item input[type="time"]{max-width:100%;background-color:#ccd4e2;border:0;-webkit-appearance: none;}

@media (max-width:575.98px){
    .date_choose_block{flex-wrap:wrap;justify-content:center}
    .date_choose_block .date_but{width:calc(100% - 40px);margin:5px 20px}
    .date_choose_block .choose_but{margin:10px 0}
    .row.row:nth-child(1){margin-right:10%;justify-content:center}
    .table>thead:first-child>tr:first-child>th:nth-child(3){min-width: 530px;}
}

@media (min-width:576px) and (max-width:767.98px){
    .date_choose_block{}
    .date_choose_block .date_but{}
    .date_choose_block .choose_but{}
    .date_choose_block .date_but:first-child{margin:0 10px 0 10px}
    .table>thead:first-child>tr:first-child>th:nth-child(3){min-width: 440px;}
}

@media (min-width: 768px) and (max-width: 991.98px) { 
.table>thead:first-child>tr:first-child>th:nth-child(3){min-width: 460px;}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
.table>thead:first-child>tr:first-child>th:nth-child(3){min-width: 460px;}
}

@media (min-width: 1200px) { }
/*== member_record css end ==*/

/*== model css start ==*/
.model_text_block{
    text-align: center;
}
section.modal{display:none;position:fixed;top:0;left:0;z-index:998}
section.modalWindow{display:none;position:fixed;top:12%;left:50%;z-index:999 !important;width:600px;margin-left:-300px;background:#FFF;cursor:default;height: 600px;}
section.modal.overlay{display:none;position:fixed;top:0;left:0;width:100%;min-height:100%;background:rgba(0,0,0,0.7);z-index:997;cursor:pointer}
section.modalWindow section.modalWrapper{margin: 30px auto;padding: 15px 30px;text-align:left;line-height:20px !important;display:flex;width:90%;flex-wrap:wrap;justify-content:center;align-items:center;}
.closeBtn{position:absolute;right:10px;top:6px;cursor:pointer;font-size: 20px;}
.model_header{font-size:20px;font-weight:500;letter-spacing:3.5px;color:#4967af;width:100%;display:flex;justify-content:center;margin: 30px 0 30px 0;padding-left: 19px;}
.model_content{font-size:15px;font-weight:500;line-height:1.5;letter-spacing:2.5px;color:#5f6783;width:100%;display:flex;text-align: center;}
.model_content_title{font-size:15px;font-weight:500;line-height:1.5;letter-spacing:2.5px;color: #b9b9b9;width:100%;display:flex;justify-content: center;/* padding-left: 13px; */margin: 20px 0 15px 0;}

.login_btn.model_btn .login_text{padding:15px 20px}
.login_btn.model_btn{margin: 50px 30% 0;width:100%;}
.login_btn.model_btn:first-child{}

@media (max-width:379.98px){
    section.modalWindow{width:320px;left: calc(90% - 5px);top: 5%;height: 500px;}
    section.modal{}
    section.modal.overlay{}
    section.modalWindow section.modalWrapper{}
    .model_header{margin: 0px 0 10px;padding-left: 19px;}
    .model_content{}
    .login_btn.model_btn .login_text{}
    .login_btn.model_btn{margin: 30px auto 10px;}
    .login_btn.model_btn:last-child{margin: 20px auto;}
}


@media (min-width:379.98px) and (max-width:479.98px){
    section.modalWindow{width: 330px;left: calc(82% + 10px);top: 6%;height:500px;}
    section.modal{}
    section.modal.overlay{}
    section.modalWindow section.modalWrapper{}
    .model_header{margin: 0px 0 10px;padding-left: 19px;}
    .model_content{}
    .login_btn.model_btn .login_text{}
    .login_btn.model_btn{margin: 30px auto 10px;}
    .login_btn.model_btn:last-child{margin: 20px auto;}
}

@media (min-width:479.98px) and (max-width:575.98px){
    section.modalWindow{width: 450px;left: 65%;}
    section.modal{}
    section.modal.overlay{}
    section.modalWindow section.modalWrapper{}
    .model_header{}
    .model_content{}
    .login_btn.model_btn .login_text{}
    .login_btn.model_btn{}
    .login_btn.model_btn:nth-child(4){}
}



@media (min-width:576px) and (max-width:767.98px){
    section.modalWindow{width: 495px;left: 57%;}
    section.modal{}
    section.modal.overlay{}
    section.modalWindow section.modalWrapper{}
    .model_header{}
    .model_content{}
    .login_btn.model_btn .login_text{}
    .login_btn.model_btn{}
    .login_btn.model_btn:first-child{}
}




/*== model css end ==*/

/*============ other page content css end ============*/


/* ================================================================ */
/* ==                                                            == */
/* ==                        Footer CSS Start                    == */
/* ==                                                            == */
/* ================================================================ */
footer{font-family:Noto Sans TC;font-size: 12px;letter-spacing:2px;color:#6f91ac;padding: 5px 10px;font-weight:300;line-height:2;}
footer .footer_text_style{display: flex;justify-content: center;width: 100%;flex-wrap: wrap;}


@media (max-width: 575.98px) { }

@media (min-width: 576px) and (max-width: 767.98px) { }

@media (min-width: 768px) and (max-width: 991.98px) { }

@media (min-width: 992px) and (max-width: 1199.98px) { }

@media (min-width: 1200px) { }
/* ================================================================ */
/* ==                                                            == */
/* ==                        footer CSS end                      == */
/* ==                                                            == */
/* ================================================================ */


