@charset "UTF-8";
/*mixin.sass/common*/
html, body, .wrapper, form:not(#selectform3) {
height: calc(100%);
}
body {
font-family: Helvetica, Arial, LiHei Pro, sans-serif, Microsoft JhengHei;
margin: 0 auto;
max-width: 100%;
}
body.login {
background: url(../img/main_bg.png) bottom right #e6e6e6 no-repeat;
padding: 20px;
min-height: 100vh;
}
body.main {
background: url(../img/main_bg2.png) bottom right #e6e6e6 no-repeat;
min-height: 100vh;
}
body.page {
background: #eeeeee;
}
.login_top {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}
.login_top .logo {
padding: 10px;
}
.login_top .logo img {
height: 50px;
}
.login_top .login_title {
font-size: 24px;
font-weight: 500;
}
.login_box {
margin: 40px auto;
width: 980px;
-webkit-box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
-moz-box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.login_box .login_head {
font-size: 24px;
text-align: center;
background: #ffffff;
padding: 20px 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom: 1px solid #cccccc;
}
.login_box .login_body {
background: #ffffff;
padding: 50px 20px 10px 20px;
display: flex;
align-items: center;
justify-content: center;
height: 340px;
}
.login_box .login_body .login_AccPw, .login_box .login_body .login_FBGoogle {
width: 40%;
padding: 0px 20px;
height: 100%;
}
.login_box .login_body .login_AccPw .login_icon, .login_box .login_body .login_FBGoogle .login_icon {
padding-right: 10px;
width: 40px;
text-align: center;
}
.login_box .login_body .login_AccPw .login_inputBox, .login_box .login_body .login_FBGoogle .login_inputBox {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 20%;
background: #e6e6e6;
padding: 7px 20px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.login_box .login_body .login_AccPw .login_inputBox .login_input, .login_box .login_body .login_FBGoogle .login_inputBox .login_input {
width: calc(100% - 31px);
}
.login_box .login_body .login_AccPw .login_inputBox .login_input input, .login_box .login_body .login_FBGoogle .login_inputBox .login_input input {
background: none;
border: none;
font-size: 16px;
line-height: 24px;
width: 100%;
}
.login_box .login_body .login_AccPw a.login_fb, .login_box .login_body .login_AccPw a.login_google, .login_box .login_body .login_FBGoogle a.login_fb, .login_box .login_body .login_FBGoogle a.login_google {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 5%;
padding: 9px 20px;
border-radius: 30px;
}
.login_box .login_body .login_AccPw a.login_fb, .login_box .login_body .login_FBGoogle a.login_fb {
background: #0076c3;
}
.login_box .login_body .login_AccPw a.login_google, .login_box .login_body .login_FBGoogle a.login_google {
background: #dd4b39;
}
.login_box .login_body .login_AccPw .login_FbGoo_project, .login_box .login_body .login_FBGoogle .login_FbGoo_project {
color: #ffffff;
}
.login_box .login_body .login_divider {
display: flex;
align-items: center;
justify-content: center;
background: url(../img/divider.png) center center repeat-y;
height: 100%;
width: 10%;
}
.login_box .login_body .login_divider .login_divider_text {
background: #ffffff;
padding: 10px;
}
.login_box .login_foot {
background: #ffffff;
padding: 20px 0;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
text-align: center;
}
.login_box .login_foot .login_foot_btn {
padding-bottom: 30px;
}
.login_box .login_foot .login_foot_btn button.login_submit {
background: url(../img/btn_login.png) center center no-repeat #cccccc;
border: none;
font-size: 24px;
font-weight: bold;
color: #ffffff;
width: 351px;
height: 60px;
cursor: pointer;
-webkit-box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
-moz-box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.32);
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
margin-top: 10px;
margin-bottom: 10px;
transition: 0.3s;
}
.login_box .login_foot .login_foot_btn button.login_submit:hover {
margin-top: 5px;
margin-bottom: 15px;
}
.login_box .login_foot .copyright {
text-align: center;
color: #999999;
}
.wrapper {
display: table;
width: 100%;
}
.wrapper .sidebar {
display: table-cell;
width: 330px;
vertical-align: top;
padding-top: 30px;
}
.wrapper .sidebar .avatar {
width: 109px;
margin: 0 auto 20px;
}
.wrapper .sidebar .avatar_img {
position: relative;
}
.wrapper .sidebar .avatar_admin {
position: absolute;
margin-top: -37px;
margin-left: 80px;
}
.wrapper .sidebar .userLv {
text-align: center;
font-size: 22px;
font-weight: bold;
margin-bottom: 10px;
}
.wrapper .sidebar .userTitle {
text-align: center;
}
.wrapper .sidebar .leftMenu {
margin-left: 69px;
margin-top: 80px;
}
.wrapper .sidebar .leftMenu_top {
display: flex;
align-items: flex-end;
justify-content: flex-start;
padding-bottom: 30px;
border-bottom: 1px solid #ffffff;
}
.wrapper .sidebar .leftMenu_icon {
padding-right: 20px;
}
.wrapper .sidebar .leftMenu_icon img {
width: 70px;
}
.wrapper .sidebar .leftMenu_title {
color: #ffffff;
font-size: 24px;
font-weight: bold;
}
.wrapper .sidebar .leftMenu_body {
padding: 20px 0;
}
.wrapper .sidebar .leftMenu_body a {
display: block;
color: #000000;
padding: 10px 0;
font-weight: bold;
font-size: 18px;
}
.wrapper .sidebar .leftMenu_body a:hover, .wrapper .sidebar .leftMenu_body a.active {
color: #ffffff;
cursor: pointer;
}
.wrapper .sidebar .backMain {
padding: 30px;
}
.wrapper .sidebar .backMain a.backMain_btn {
display: block;
width: 200px;
margin: 0 auto;
background: url(../img/btn_back_hover.png) center center no-repeat;
background-size: 100%;
}
.wrapper .sidebar .backMain a.backMain_btn img {
width: 200px;
transition: 0.3s;
}
.wrapper .sidebar .backMain a.backMain_btn:hover img {
opacity: 0;
}
.wrapper .content {
display: table-cell;
width: calc(100% - 330px);
vertical-align: top;
padding: 30px;
}
.wrapper .content .mainbav {
display: flex;
align-items: center;
justify-content: center;
}
.wrapper .content .mainbav_top {
display: flex;
align-items: center;
justify-content: center;
width: calc(100% - 100px);
}
.wrapper .content .logo {
padding: 10px;
}
.wrapper .content .mainbav_title {
font-size: 24px;
font-weight: 500;
}
.wrapper .content .subnav {
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
border: 1px solid #ccc;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
width: 100px;
cursor: pointer;
background: #e6e6e6;
cursor: pointer;
}
.wrapper .content .subnav_avatar img {
height: 50px;
}
.wrapper .content .subnav_btn {
padding: 12px 16px;
}
.wrapper .content .subnav_slide {
position: absolute;
background: #ffffff;
padding: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border: 1px solid #ccc;
margin-top: 148px;
-webkit-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
-moz-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
}
.wrapper .content .subnav_slide a {
color: #000000;
display: block;
padding: 5px;
font-size: 14px;
font-weight: 700;
}
.wrapper .content .main_options {
/*margin-top: 50px;*/
margin-top: 25px;
width: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
}
.wrapper .content .main_options a {
margin: 25px;
width: calc(25% - 89px);
}
.wrapper .content .main_options a img {
width: 100%;
}
.wrapper .content .main_options a span.optionsNotice {
background-color: red;
color: #ffffff;
padding: 5px 13px;
font-size: 18px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
position: absolute;
margin-top: -10px;
}
.wrapper .content .main_options a.main_options01 {
background: url(../img/main_icon01.png) center center no-repeat;
background-size: 100%;
order: 1;
}
.wrapper .content .main_options a.main_options02 {
background: url(../img/main_icon02.png) center center no-repeat;
background-size: 100%;
order: 5;
}
.wrapper .content .main_options a.main_options03 {
background: url(../img/main_icon03.png) center center no-repeat;
background-size: 100%;
order: 2;
}
.wrapper .content .main_options a.main_options04 {
background: url(../img/main_icon04.png) center center no-repeat;
background-size: 100%;
order: 6;
}
.wrapper .content .main_options a.main_options05 {
background: url(../img/main_icon05.png) center center no-repeat;
background-size: 100%;
order: 3;
}
.wrapper .content .main_options a.main_options06 {
background: url(../img/main_icon06.png) center center no-repeat;
background-size: 100%;
order: 7;
}
.wrapper .content .main_options a.main_options07 {
background: url(../img/main_icon07.png) center center no-repeat;
background-size: 100%;
order: 4;
}
.wrapper .content .main_options a.main_options08 {
background: url(../img/main_icon08.png) center center no-repeat;
background-size: 100%;
order: 8;
}
.wrapper .content .main_options a.main_list {
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.wrapper .content .main_options a.main_list01 {
background: url(../img/main_bg01.jpg) top center no-repeat;
background-size: 100% 100%;
order: 1;
border: 5px solid #ea5605;
}
.wrapper .content .main_options a.main_list02 {
background: url(../img/main_bg02.jpg) top center no-repeat;
background-size: 100% 100%;
order: 2;
border: 5px solid #da459b;
}
.wrapper .content .main_options a.main_list03 {
background: url(../img/main_bg03.jpg) top center no-repeat;
background-size: 100% 100%;
order: 3;
border: 5px solid #0181cc;
}
.wrapper .content .main_options a.main_list04 {
background: url(../img/main_bg04.jpg) top center no-repeat;
background-size: 100% 100%;
order: 4;
border: 5px solid #46a94a;
}
.wrapper .content .main_options a.main_list05 {
background: url(../img/main_bg05.jpg) top center no-repeat;
background-size: 100% 100%;
order: 5;
border: 5px solid #87191b;
}
.wrapper .content .main_options a.main_list06 {
background: url(../img/main_bg06.jpg) top center no-repeat;
background-size: 100% 100%;
order: 6;
border: 5px solid #693291;
}
.wrapper .content .main_options a.main_list07 {
background: url(../img/main_bg07.jpg) top center no-repeat;
background-size: 100% 100%;
order: 7;
border: 5px solid #00389a;
}
.wrapper .content .main_options a.main_list08 {
background: url(../img/main_bg08.jpg) top center no-repeat;
background-size: 100% 100%;
order: 8;
border: 5px solid #825612;
}
.wrapper .content .main_options a.main_list09 {
background: url(../img/main_bg09.jpg) top center no-repeat;
background-size: 100% 100%;
order: 9;
border: 5px solid #a29b43;
}
.wrapper .content .main_options a.main_list10 {
background: url(../img/main_bg10.jpg) top center no-repeat;
background-size: 100% 100%;
order: 9;
border: 5px solid #D99A6F;
}
.wrapper .content .main_options a.main_list11 {
background: url(../img/main_bg11.jpg) top center no-repeat;
background-size: 100% 100%;
order: 9;
border: 5px solid #3178c3;
}
.wrapper .content .main_options .main_list_img {
padding: 55px 55px 30px;
}
.wrapper .content .main_options .main_list_img img {
width: 100%;
}
.wrapper .content .main_options .main_list_text {
padding: 0 0 30px;
text-align: center;
color: #ffffff;
font-size: 24px;
}
.wrapper .content .main_options.box6a {
width: calc(100% - 340px);
margin-left: auto;
margin-right: auto;
}
.wrapper .content .main_options.box6a a {
width: calc(33.3% - 89px);
}
.wrapper .content .top_bar {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 40px;
}
.wrapper .content .top_subTitle {
font-size: 24px;
color: #ffffff;
background: #00a8d4;
padding: 15px;
}
.wrapper .content .searchBar {
/*width: calc(100% - 126px);*/
width: calc(100%);
display: flex;
align-items: center;
justify-content: center;
}
.wrapper .content .search_bar {
display: table;
background: #f2f2f2;
border: 1px solid #aeaeae;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
min-height: 65px;
padding: 0 15px;
}
.wrapper .content .serch_iptAre {
display: table-cell;
vertical-align: middle;
flex-wrap: wrap;
/*max-width: 950px;*/
vertical-align: middle;
}
.wrapper .content .search_inputBox {
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 5px;
background: #ffffff;
border: 1px solid #b1b1b1;
margin: 7px 10px 7px 0px;
}
.wrapper .content .search_inputBox input {
border: none;
font-size: 14px;
width: 140px;
text-align: center;
}
.wrapper .content .search_inputBox select {
font-size: 14px;
border: none;
/*margin-right: 50px;*/
}
.wrapper .content .search_inputBox .search_boxClose {
cursor: pointer;
}
.wrapper .content .search_divider {
background: url(../img/divider.png) center center repeat-y;
width: 10px;
height: 100%;
display: table-cell;
}
.wrapper .content .search_btn {
padding: 15px;
cursor: pointer;
display: table-cell;
vertical-align: middle;
}
.wrapper .content .search_close {
padding: 15px 5px 15px 15px;
cursor: pointer;
display: table-cell;
vertical-align: middle;
}
.wrapper .content .sub_bar {
display: flex;
align-items: center;
justify-content: flex-start;
margin: 30px 0px 30px 0px;
}
.wrapper .content .sub_bar1 {
/*display: flex;
align-items: center;*/
justify-content: flex-start;
margin: 30px 0px 30px 0px;
}
.wrapper .content .sub_checkbox {
margin: 0 20px;
}
.user2yn_checkbox {
width: 26px;
height: 26px;
}
.user2yn_td_name {
vertical-align: middle;
}
.user2yn_td {
text-align: center;
vertical-align: middle;
}
.wrapper .content .sub_checkbox input {
width: 26px;
height: 26px;
}
.wrapper .content .sub_delete_btn {
padding: 0 10px;
}
.wrapper .content .sub_delete_btn button {
border: none;
background: none;
cursor: pointer;
}
.wrapper .content .sub_page_bar {
display: flex;
align-items: center;
justify-content: center;
/*width: calc(100% - 100px);*/
width: calc(100%);
}
.wrapper .content a.previous, .wrapper .content a.next {
padding: 5px 10px;
font-size: 22px;
font-weight: bold;
color: #a0a0a0;
font-family: Microsoft JhengHei;
cursor: pointer;
}
.wrapper .content .page_num input, .wrapper .content .page_quantity input {
/*width: 23px;*/
width: 46px;
text-align: center;
font-size: 16px;
border: 1px solid #a0a0a0;
}
.wrapper .content .page_text {
padding: 10px;
}
.wrapper .content div.sub_folder {
position: absolute;
right: 5%;
}
.wrapper .content .sub_folder button {
border: none;
background: none;
cursor: pointer;
/*width: 90px;*/
}
/*.wrapper .content .sub_folder button span.span_purple {
color: #BE63F9;
font-weight:bold;
font-size:medium;
display: block;
}
.wrapper .content .sub_folder button span.span_red {
color: #FC573B;
font-weight:bold;
font-size:medium;
display: block;
}
.wrapper .content .sub_folder button span.span_blue {
color: #26C6DA;
font-weight:bold;
font-size:medium;
display: block;
}
.wrapper .content .sub_folder button span.span_gray {
color: #303C42;
font-weight:bold;
font-size:medium;
display: block;
}*/
.wrapper .content .sub_folder button span.span_orange,
.wrapper .content .m_sub_folder button span.span_orange,
.span_orange {
padding: 10px;
color: #FFFFFF;
background: #FF8C00;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
font-size: medium;
display: block;
}
.wrapper .content .sub_folder button span.span_red,
.wrapper .content .m_sub_folder button span.span_red {
padding: 10px;
color: #FFFFFF;
background: #FC573B;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
font-size: medium;
display: block;
}
.wrapper .content .sub_folder button span.span_blue,
.wrapper .content .m_sub_folder button span.span_blue,
.span_blue {
padding: 10px;
color: #FFFFFF;
background: #26C6DA;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
font-size: medium;
display: block;
}
.wrapper .content .sub_folder button span.span_green,
.wrapper .content .m_sub_folder button span.span_green,
.span_green {
padding: 10px;
color: #FFFFFF;
background: #AADC00;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
font-size: medium;
display: block;
}
.span_green:hover {
cursor: pointer;
background: #97bf0c;
}
.wrapper .content .sub_folder button span.span_gray,
.wrapper .content .m_sub_folder button span.span_gray {
padding: 10px;
color: #FFFFFF;
background: #808080;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
font-size: medium;
display: block;
}
.wrapper .content .data_table table.data tbody tr .status_gray {
padding: 10px;
color: #fff;
background: #808080;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight: bold;
}
.wrapper .content .data_table table.data tbody tr .status_gray:hover {
cursor: pointer;
background: #676565;
}
.wrapper .content .data_table {
margin-top: 10px;
}
.wrapper .content .data_table table.data {
border-collapse: collapse;
border-spacing: 0;
display: block;
}
.wrapper .content .data_table table.data thead {
display: block;
}
.wrapper .content .data_table table.data thead tr {
background: #808080;
display: flex;
align-items: center;
justify-content: flex-start;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.wrapper .content .data_table table.data thead tr th {
padding: 15px 5px;
color: #ffffff;
text-align: left;
display: block;
}
.wrapper .content .data_table table.data thead tr th.col01 {
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
text-align: center;
}
.wrapper .content .data_table table.data thead tr .col02 {
width: 80px;
}
.wrapper .content .data_table table.data thead tr th.col11 {
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
text-align: center;
}
.wrapper .content .data_table table.data tbody {
display: block;
}
.wrapper .content .data_table table.data tbody tr {
background: #ffffff;
display: flex;
align-items: center;
justify-content: flex-start;
margin: 5px 0;
border: 1px solid #ffffff;
}
.wrapper .content .data_table table.data tbody tr:hover, .wrapper .content .data_table table.data tbody tr:focus {
background: #f0ffb9;
border: 1px solid #87cf1f;
}
.wrapper .content .data_table table.data tbody tr td {
padding: 10px 5px;
text-align: left;
display: block;
}
.wrapper .content .data_table table.data tbody tr td.col01 {
text-align: center;
}
.wrapper .content .data_table table.data thead tr th.col01 input.deleteAll_select {
width: 26px;
height: 26px;
}
.wrapper .content .data_table table.data tbody tr td.col01 input.delete_select {
width: 26px;
height: 26px;
}
.wrapper .content .data_table table.data tbody tr td.col11 {
text-align: center;
}
.wrapper .content .data_table table.data tbody tr td.col11 img {
padding: 0 10px;
cursor: pointer;
}
.wrapper .content .data_table table.data tbody tr td.col11 .data_slide {
position: absolute;
width: 51px;
margin-left: 50px;
display: none;
}
.wrapper .content .data_table table.data tbody tr td.col11 .data_slide a {
background: #ffffff;
display: block;
margin-bottom: 10px;
padding: 5px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
text-align: center;
-webkit-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
-moz-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
margin-right: 5px;
}
.wrapper .content .data_table table.data tbody tr td.col11 .data_slide a img {
padding: 0;
opacity: 0.6;
transition: 0.3s;
}
.wrapper .content .data_table table.data tbody tr td.col11 .data_slide a:hover img {
opacity: 1;
}
.wrapper .content .box_span_red,
.wrapper .content .data_table table.data tbody tr .status_no {
padding: 10px;
background: red;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-weight: bold;
}
.wrapper .content .box_span_green,
.wrapper .content .data_table table.data tbody tr .status_ok {
padding: 10px;
color: #FFFFFF;
background: #aadc00;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight: bold;
}
.wrapper .content .data_table table.data tbody tr .status_ok:hover {
cursor: pointer;
background: #97bf0c;
}
.wrapper .content .data_table table.data tbody tr .status_blue {
padding: 10px;
color: #fff;
background: #348fe2;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight: bold;
}
.wrapper .content .data_table table.data tbody tr .status_blue:hover {
cursor: pointer;
background: #97bf0c;
}
.wrapper .content .data_table table.data tbody tr .status_red {
padding: 10px;
color: #fff;
background: #ff5b57;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight: bold;
}
.wrapper .content .data_table table.data tbody tr .status_red:hover {
cursor: pointer;
background: #97bf0c;
}
.wrapper .content .data_table table.data tbody tr.active {
background: #f0ffb9;
border: 1px solid #87cf1f;
}
.wrapper .content .data_table table.data .col01 {
width: 5%;
}
.wrapper .content .data_table table.data .col02 {
width: 80px;
}
.wrapper .content .data_table table.data .col03 {
width: 8%;
}
.wrapper .content .data_table table.data .col04 {
width: 5%;
}
.wrapper .content .data_table table.data .col05 {
width: 7%;
}
.wrapper .content .data_table table.data .col06 {
width: 6%;
}
.wrapper .content .data_table table.data .col07 {
width: 14%;
}
.wrapper .content .data_table table.data .col08 {
width: 13%;
}
.wrapper .content .data_table table.data .col09 {
width: 16%;
}
.wrapper .content .data_table table.data .col10 {
width: 16%;
}
.wrapper .content .data_table table.data .col11 {
width: 5%;
}
.wrapper .content .data_table table.data .col_005 {
width: 5%;
}
.wrapper .content .data_table table.data .col_010 {
width: 10%;
}
.wrapper .content .data_table table.data .col_015 {
width: 15%;
}
.wrapper .content .data_table table.data .col_020 {
width: 20%;
}
.wrapper .content .data_table table.data .col_025 {
width: 25%;
}
.wrapper .content .data_table table.data .col_030 {
width: 30%;
}
.wrapper .content .data_table table.data .col_035 {
width: 35%;
}
.wrapper .content .data_table table.data .col_040 {
width: 40%;
}
.wrapper .content .data_table table.data .col_045 {
width: 45%;
}
.wrapper .content .staff_table {
margin-top: 10px;
}
.wrapper .content .staff_table table.data {
border-collapse: collapse;
border-spacing: 0;
display: block;
}
.wrapper .content .staff_table table.data thead {
display: block;
}
.wrapper .content .staff_table table.data thead tr {
background: #808080;
display: flex;
align-items: center;
justify-content: flex-start;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.wrapper .content .staff_table table.data thead tr th {
padding: 15px 5px;
color: #ffffff;
text-align: left;
display: block;
}
.wrapper .content .staff_table table.data thead tr th.col01 {
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
text-align: center;
}
.wrapper .content .staff_table table.data thead tr th.col06 {
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
.wrapper .content .staff_table table.data tbody {
display: block;
}
.wrapper .content .staff_table table.data tbody tr {
background: #ffffff;
display: flex;
align-items: center;
justify-content: flex-start;
margin: 5px 0;
border: 1px solid #ffffff;
}
.wrapper .content .staff_table table.data tbody tr:hover, .wrapper .content .staff_table table.data tbody tr:focus {
background: #f0ffb9;
border: 1px solid #87cf1f;
}
.wrapper .content .staff_table table.data tbody tr td {
padding: 10px 5px;
text-align: left;
display: block;
}
.wrapper .content .staff_table table.data tbody tr td.col01 {
text-align: center;
}
.wrapper .content .staff_table table.data tbody tr td.col01 input.delete_select {
width: 26px;
height: 26px;
}
.wrapper .content .staff_table table.data tbody tr .status_no {
padding: 10px;
background: red;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-weight: bold;
width: 70px;
}
.wrapper .content .staff_table table.data tbody tr .status_ok {
padding: 10px;
background: #aadc00;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight: bold;
width: 70px;
}
.wrapper .content .staff_table table.data tbody tr.active {
background: #f0ffb9;
border: 1px solid #87cf1f;
}
.wrapper .content .staff_table table.data .col01 {
width: 5%;
}
.wrapper .content .staff_table table.data .col02 {
width: 15%;
}
.wrapper .content .staff_table table.data .col03 {
width: 17%;
}
.wrapper .content .staff_table table.data .col04 {
width: 12%;
}
.wrapper .content .staff_table table.data .col05 {
width: 23%;
}
.wrapper .content .staff_table table.data .col06 {
width: 23%;
}
.wrapper .content .step_bar {
display: flex;
align-items: center;
justify-content: center;
margin-top: 10px;
}
.wrapper .content .step_list {
display: flex;
align-items: center;
justify-content: center;
}
.wrapper .content .step_box {
display: flex;
align-items: center;
justify-content: center;
}
.wrapper .content .step_num {
/*font-size: 70px;*/
font-size: 35px;
border: 2px solid #808080;
color: #808080;
/*padding: 10px 26px;*/
padding: 5px 13px;
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
border-radius: 60px;
margin: 0 10px;
}
.wrapper .content .step_text {
text-align: center;
line-height: 28px;
font-size: 22px;
font-weight: bold;
color: #808080;
width: 100px;
}
.wrapper .content .step_arrow01 {
background: url(../img/next.png) center center no-repeat;
width: 29px;
height: 61px;
margin: 10px 30px;
}
.wrapper .content .step_arrow02 {
background: url(../img/last.png) center center no-repeat;
width: 25px;
height: 32px;
margin: 10px 20px;
}
.wrapper .content .step_list.active .step_num {
border: 2px solid #00a8d4;
background: #00a8d4;
color: #ffffff;
}
.wrapper .content .step_list.active .step_text {
color: #00a8d4;
}
.wrapper .content .step_list.active .step_arrow01 {
background: url(../img/next_active.png) center center no-repeat;
}
.wrapper .content .step_list.active .step_arrow02 {
background: url(../img/last_active.png) center center no-repeat;
}
table.fillFino_table {
border-spacing: 0;
width: 100%;
margin-top: 20px;
background: #ffffff;
border: 2px solid #00a8d4;
}
table thead.fillFino_table_thead {
background-color: #00a8d4;
color: white;
}
table.fillFino_table th, td {
padding: 20px;
text-align: center;
}
table.fillFino_table tbody tr:nth-child(even) {
background-color: #eeeeee;
}
table.studentstr {
border-spacing: 0;
background: #ffffff;
}
table.studentstr th, td {
padding: 3px;
text-align: left;
}
.wrapper .content .fillFino {
margin-top: 20px;
background: #ffffff;
border: 2px solid #00a8d4;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
padding: 20px;
}
.wrapper .content .fillFino2 {
margin-top: 20px;
padding: 20px;
}
.wrapper .content .fillFino_border {
display: flex;
/*align-items: flex-start;
justify-content: center;*/
padding: 20px 0;
}
.wrapper .content .fillFino_box {
padding-top: 20px;
padding-bottom: 0px;
padding-left: 40px;
padding-right: 0px;
}
.wrapper .content .fillFino_box_title {
width: 120px;
font-size: 18px;
}
.wrapper .content .fillFino_box_project {
border: 1px solid #ccc;
width: 215px;
padding: 5px;
}
.wrapper .content .fillFino_box_project input {
padding: 6px 5px;
border: none;
width: calc(100% - 10px);
font-size: 16px;
background: none;
color: #666666;
}
.wrapper .content .fillFino_box_project textarea {
width: calc(100% - 5px);
background: none;
border: none;
font-size: 14px;
color: #666666;
}
.wrapper .content .fillFino_left {
background: url(../img/divider.png) top right repeat-y;
padding-right: 50px;
padding-left: 50px;
/*padding-bottom: 50px;*/
}
.wrapper .content .fillFino_left_row {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 20px;
}
.wrapper .content .fillFino_left_title {
width: 100px;
font-size: 18px;
}
.wrapper .content .fillFino_left_project input {
padding: 10px;
border: none;
font-size: 16px;
}
.wrapper .content .fillFino_right {
padding-left: 50px;
}
.wrapper .content .fillFino_right_row01 {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 20px;
}
.wrapper .content .fillFino_right_list {
display: flex;
align-items: center;
justify-content: flex-start;
margin-right: 20px;
}
.wrapper .content .fillFino_right_title {
font-size: 18px;
width: 125px;
}
.wrapper .content .fillFino_table_project {
border: 1px solid #ccc;
padding: 5px;
/*width: 215px;*/
width: 100%;
}
.wrapper .content .fillFino_right_project {
border: 1px solid #ccc;
width: 215px;
padding: 5px;
}
.wrapper .content .fillFino_right_project_box {
border: 1px solid #fff;
width: 215px;
padding: 5px;
}
.wrapper .content .fillFino_right_project_radio {
border: 1px solid #fff;
padding: 5px;
}
.wrapper .content .fillFino_right_project select {
font-size: 16px;
padding: 5px;
border: none;
color: #666666;
width: 100%;
}
.wrapper .content .fillFino_right_project input {
padding: 6px 0;
border: none;
width: 100%;
background: none;
color: #666666;
}
.wrapper .content .fillFino_table_project input {
text-align: center;
padding: 6px 0;
border: none;
width: 100%;
background: none;
color: #666666;
}
.wrapper .content .fillFino_right_row02 {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 20px;
}
.wrapper .content .fillFino_right_project01 {
border: 1px solid #ccc;
width: 279px;
padding: 5px;
margin-right: 20px;
}
.wrapper .content .fillFino_right_project01 input {
padding: 6px 0;
border: none;
width: 100%;
background: none;
color: #666666;
}
.wrapper .content .fillFino_right_project02 {
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #ccc;
width: 279px;
padding: 5px;
margin-right: 20px;
}
.wrapper .content .fillFino_interval {
width: 20%;
text-align: center;
font-size: 16px;
font-weight: bold;
color: #666666;
align-self: center;
}
.wrapper .content select.fillFino_select {
padding: 5px;
background: #fcfcfc;
border: 1px solid #cccccc;
align-self: center;
}
.wrapper .content .fillFino_H, .wrapper .content .fillFino_M {
width: 30%;
}
.wrapper .content .fillFino_H select, .wrapper .content .fillFino_M select {
width: 100%;
padding: 5px;
border: none;
font-size: 18px;
color: #666666;
}
.wrapper .content .fillFino_right_row03 {
display: flex;
align-items: flex-start;
justify-content: flex-start;
margin-bottom: 20px;
}
.wrapper .content .fillFino_right_row03 .fillFino_right_project {
width: 579px;
}
.wrapper .content .fillFino_right_row03 .fillFino_right_project textarea {
width: 100%;
background: none;
border: none;
font-size: 14px;
color: #666666;
}
.wrapper .content .fillFino_btn {
text-align: right;
max-width: 1102px;
margin: 10px auto;
}
.wrapper .content button.fillFino_cancel, .wrapper .content a.fillFino_cancel {
border: none;
background: #e6e6e6;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #666666;
}
.wrapper .content button.fillFino_add, .wrapper .content a.fillFino_add {
border: none;
background: #ff8c00;
font-size: 16px;
padding: 10px 15px;
font-weight: 600;
color: #ffffff;
}
.wrapper .content button.fillFino_submit, .wrapper .content a.fillFino_submit {
border: none;
background: #00a8d4;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #ffffff;
margin: 0px 0 10px 0;
}
.wrapper .content button.fillFino_submit_red, .wrapper .content a.fillFino_submit_red {
border: none;
background: #FF0000;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #ffffff;
margin: 0px 0 10px 0;
}
.wrapper .content button.fillFino_submit_Mineral_Blue, .wrapper .content a.fillFino_submit_Mineral_Blue {
border: none;
background: #004D99;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #ffffff;
margin: 0px 0 10px 0;
}
.wrapper .content .fillFino_border02 {
width: 100%;
max-width: 1100px;
margin: 10px auto;
}
.wrapper .content .fillFino_H1 {
/*margin: 30px;*/
margin: 15px;
text-align: center;
font-size: 18px;
font-weight: bold;
width: 100%;
}
.wrapper .content .fillFino_title, .wrapper .content .confirm_title {
margin-bottom: 20px;
}
.wrapper .content span.Fino_title {
color: #00a8d4;
font-size: 20px;
font-weight: bold;
margin-right: 40px;
}
.wrapper .content span.Fino_title2 {
color: #ff8c00;
font-size: 20px;
font-weight: bold;
margin-right: 40px;
}
.wrapper .content .fillFino_part01 {
margin-bottom: 40px;
}
.wrapper .content .fillFino_part01_row {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 15px;
}
.wrapper .content .part01_title01 {
width: 240px;
font-weight: bold;
}
.wrapper .content .part01_name {
width: 230px;
background: #f2f2f2;
border: 2px dashed #cccccc;
margin-right: 10px;
}
.wrapper .content .part01_name input {
border: none;
box-sizing: border-box;
width: 100%;
background: none;
padding: 8px;
font-size: 16px;
}
.wrapper .content .part01_mail {
width: 320px;
background: #f2f2f2;
border: 2px dashed #cccccc;
margin-right: 10px;
}
.wrapper .content .part01_mail input {
border: none;
box-sizing: border-box;
width: 100%;
background: none;
padding: 8px;
font-size: 16px;
}
.wrapper .content button.part_submit, .wrapper .content a.part_submit {
background: #00a8d4;
border: none;
box-sizing: border-box;
padding: 5px 15px;
font-size: 16px;
color: #ffffff;
}
.wrapper .content .fillFino_part01_list {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 5px;
}
.wrapper .content .list01_name {
width: 230px;
border: 1px solid #ccc;
padding: 7px 10px;
margin-right: 10px;
}
.wrapper .content .list01_mail {
width: 320px;
border: 1px solid #ccc;
padding: 7px 10px;
margin-right: 10px;
}
.wrapper .content .list01_plate {
width: 230px;
border: 1px solid #ccc;
padding: 7px 10px;
margin-right: 10px;
}
.wrapper .content button.part_close, .wrapper .content a.part_close {
background: none;
border: 1px solid #cccccc;
padding: 5px 6px;
}
.wrapper .content .fillFino_part02_row {
display: flex;
align-items: center;
justify-content: flex-start;
}
.wrapper .content .part02_name_box {
width: 230px;
margin-right: 10px;
}
.wrapper .content .part02_title01 {
margin-bottom: 15px;
font-weight: bold;
}
.wrapper .content .part02_mail_box {
width: 320px;
margin-right: 10px;
}
.wrapper .content .part02_project {
background: #f2f2f2;
border: 2px dashed #cccccc;
margin-bottom: 15px;
}
.wrapper .content .part02_project input {
border: none;
box-sizing: border-box;
width: 100%;
background: none;
padding: 8px;
font-size: 16px;
}
.wrapper .content .part02_project select {
border: none;
box-sizing: border-box;
width: 100%;
background: none;
padding: 8px;
font-size: 16px;
}
.wrapper .content .part02_project_box {
/*background: #f2f2f2;
border: 2px dashed #cccccc;*/
margin-bottom: 15px;
margin-left: 10%
}
.wrapper .content .fillFino_part_submit02 {
margin-top: 13px;
}
.wrapper .content .fillFino_part03_list {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 5px;
}
.wrapper .content .Fino_addbtn {
text-align: right;
margin-bottom: 20px;
}
.wrapper .content button.addbutton, .wrapper .content a.addbutton {
background: #00a8d4;
border: none;
box-sizing: border-box;
/*padding: 5px 15px;*/
padding: 10px 15px;
font-size: 16px;
color: #ffffff;
}
.wrapper .content .Fino_photoBox {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 30px;
}
.wrapper .content .photoBox_btn {
padding: 5px;
border: 1px solid #ccc;
cursor: pointer;
height: 120px;
display: flex;
align-items: center;
justify-content: space-between;
}
.wrapper .content #prev, .wrapper .content #next {
position: absolute;
width: 19px;
height: 120px;
margin-left: -5px;
}
.wrapper .content .photoBox_list {
margin: 0 20px;
width: calc(100% - 80px);
overflow: hidden;
}
.wrapper .content .photoBox_list_over {
display: flex;
align-items: center;
justify-content: flex-start;
width: -webkit-fit-content;
width: fit-content;
transition: 0.3s;
}
.wrapper .content .photoBox_list_box {
margin: 0 5px;
width: 170px;
height: 120px;
background: #f2f2f2;
border: 2px dashed #cccccc;
}
.wrapper .content .photoBox_list_box.hasPhoho {
border: none;
}
.wrapper .content .photoBox_list_close {
position: relative;
margin-top: -119px;
margin-left: 145px;
cursor: pointer;
z-index: 2;
}
.wrapper .content .fillFino_border03 {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
width: 100%;
max-width: 1100px;
margin: 0 auto;
}
.wrapper .content .confirm_left {
padding-right: 50px;
}
.wrapper .content .confirm_left_row {
display: flex;
align-items: center;
justify-content: flex-start;
/*margin-bottom: 20px;*/
margin-bottom: 30px;
}
.wrapper .content .confirm_left_title {
font-weight: bold;
width: 100px;
}
.wrapper .content .confirm_left_project {
color: #808080;
}
.wrapper .content .confirm_right {
width: calc(100% - 300px);
padding-left: 50px;
border-left: 1px solid #cccccc;
}
.wrapper .content .confirm_right_row01 {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 20px;
padding-top: 20px;
border-bottom: 1px solid #ccc;
}
.wrapper .content .confirm_right_rowBox {
display: flex;
align-items: center;
justify-content: flex-start;
/*width: 50%;*/
}
.wrapper .content .confirm_right_title {
font-weight: bold;
color: #808080;
width: 187px;
}
.wrapper .content .confirm_right_project {
width: 187px;
font-weight: bold;
}
.wrapper .content .confirm_right_project02 {
font-weight: bold;
width: calc(100% - 187px);
}
.wrapper .content .confirm_right_project02 input {
width: 26px;
height: 26px;
vertical-align: middle;
}
.wrapper .content .confirm_right_title01 {
font-weight: bold;
color: #808080;
width: 187px;
}
.wrapper .content .confirm_right_project03 {
font-weight: bold;
width: calc(100% - 187px);
}
.wrapper .content .confirm_right_row02 {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 20px;
padding-top: 20px;
}
.wrapper .content .confirm_right_box {
margin-bottom: 20px;
}
.wrapper .content .confirm_subtitle {
font-weight: bold;
font-size: 18px;
margin-bottom: 20px;
}
.wrapper .content .confirm_right_row03 {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 15px;
padding-top: 15px;
border-bottom: 1px solid #ccc;
padding-left: 20px;
font-weight: bold;
}
.wrapper .content .confirm_right_row04 {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 30px;
}
.wrapper .content .confirm_right_name {
width: 35%;
}
.wrapper .content .confirm_right_mail {
width: 35%;
}
.wrapper .content .member_options {
display: flex;
align-items: center;
justify-content: center;
margin-top: 50px;
}
.wrapper .content .member_options a {
display: block;
width: 130px;
height: 140px;
margin: 10px 20px;
-webkit-box-shadow: 3px 3px 11px 1px rgba(0, 0, 0, 0.32);
-moz-box-shadow: 3px 3px 11px 1px rgba(0, 0, 0, 0.32);
box-shadow: 3px 3px 11px 1px rgba(0, 0, 0, 0.32);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
transition: 0.3s;
}
.wrapper .content .member_options a:hover {
margin: 0px 20px 20px;
}
.wrapper .content .member_options a.member_options01 {
background: url(../img/guard_icon01.png) top center no-repeat #cccccc;
}
.wrapper .content .member_options a.member_options02 {
background: url(../img/guard_icon02.png) top center no-repeat #cccccc;
}
.wrapper .content .member_options a.member_options03 {
background: url(../img/guard_icon03.png) top center no-repeat #cccccc;
}
.wrapper .content .member_options a.member_options04 {
background: url(../img/guard_icon04.png) top center no-repeat #cccccc;
}
.wrapper .content .check_member {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 50px;
padding-left: 50px;
}
.wrapper .content .check_member_tick {
margin-right: 30px;
}
.wrapper .content .check_member_subT {
font-weight: bold;
margin-right: 20px;
margin-top: 10px;
}
.wrapper .content .check_member_name {
font-size: 30px;
font-weight: bold;
}
.wrapper .content .check_content {
margin-top: 40px;
}
.wrapper .content .check_are {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.wrapper .content .check_box {
padding: 50px;
background: #ffffff;
width: calc(100% - 20px);
border-radius: 20px;
min-height: 500px;
margin-bottom: 20px;
}
.wrapper .content .check_box_upload, .wrapper .content .check_box_water {
padding: 50px;
background: #ffffff;
/*width: calc(100% - 20px);*/
width: calc(100%);
border-radius: 20px;
/*min-height: 500px;*/
margin-bottom: 20px;
text-align: center;
}
.wrapper .content .check_box:first-child, .wrapper .content .check_box_water:first-child {
margin-right: 40px;
}
.wrapper .content .check_topT {
font-weight: bold;
margin-bottom: 20px;
}
.wrapper .content .check_link {
display: block;
margin-bottom: 20px;
}
.wrapper .content .check_link_box {
display: block;
margin-bottom: 10px;
}
.wrapper .content .check_link button {
border: none;
background: none;
padding: 0;
cursor: pointer;
}
.wrapper .content .check_link_box button {
border: none;
background: none;
padding: 0;
cursor: pointer;
}
.wrapper .content .check_order {
display: flex;
align-items: center;
justify-content: space-between;
background: #e6e6e6;
padding: 10px 15px;
margin-bottom: 10px;
}
.wrapper .content .check_order_list {
padding: 10px 15px;
border-bottom: 1px solid #ccc;
cursor: pointer;
}
.wrapper .content .check_order_list:last-child {
border: none;
}
.wrapper .content .check_photo {
display: flex;
align-items: flex-start;
justify-content: space-between;
flex-wrap: wrap;
}
.wrapper .content .check_photo_box {
background: #f2f2f2;
border: 1px dashed #cccccc;
margin-bottom: 20px;
width: calc(33.3% - 10px);
}
.wrapper .content .check_photo_box > img {
width: 100%;
}
.wrapper .content .check_photo_close {
position: absolute;
z-index: 2;
cursor: pointer;
text-align: right;
margin-top: 5px;
margin-left: -5px;
}
.wrapper .content .check_btn {
text-align: right;
margin-bottom: 20px;
}
.wrapper .content .sub_page_bar2 {
display: flex;
align-items: center;
justify-content: center;
width: calc(100% - 230px);
}
.wrapper .content .sub_page_bar3 {
display: flex;
align-items: center;
justify-content: center;
width: calc(100% - 250px);
}
.wrapper .content .sub_mode {
display: flex;
align-items: center;
justify-content: flex-start;
}
.wrapper .content .sub_mode_inp select {
padding: 5px;
background: #fcfcfc;
border: 1px solid #cccccc;
}
.wrapper .content .sub_mode_btn button {
padding: 0;
border: 0;
background: none;
cursor: pointer;
margin-top: 2px;
margin-left: 10px;
}
.wrapper .content .staff_list {
margin-top: 20px;
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
}
.wrapper .content .staff_box {
margin: 10px;
background: #fff;
padding: 15px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
width: calc(25% - 20px);
}
.wrapper .content .staff_box_top {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.wrapper .content .staff_photo {
-webkit-border-radius: 75px;
-moz-border-radius: 75px;
border-radius: 75px;
overflow: hidden;
}
.wrapper .content .staff_photo img {
margin-bottom: -3px;
}
.wrapper .content .staff_right01 {
padding-left: 20px;
width: calc(100% - 72px);
}
.wrapper .content .staff_right_row {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.wrapper .content .staff_date {
width: calc(100% - 36px);
}
.wrapper .content .staff_date_title {
font-size: 14px;
margin-bottom: 5px;
}
.wrapper .content .staff_date_text {
font-size: 24px;
letter-spacing: 2px;
}
.wrapper .content .staff_check {
margin-left: 10px;
width: 26px;
height: 26px;
}
.wrapper .content .staff_check.check {
background: url(../img/icon_checked.png) center center no-repeat;
}
.wrapper .content .staff_check.check img {
opacity: 0;
}
.wrapper .content .fettle_list01, .wrapper .content .fettle_list02 {
text-align: center;
width: calc(50% - 10px);
margin: 5px;
padding: 5px;
background: #cccccc;
color: #ffffff;
font-weight: bold;
}
.wrapper .content .fettle_list01.check {
background: red;
}
.wrapper .content .fettle_list02.check {
background: #96c800;
}
.wrapper .content .staff_box_body {
padding: 20px;
text-align: center;
}
.wrapper .content .staff_name {
margin-bottom: 10px;
font-size: 40px;
font-weight: bold;
}
.wrapper .content .staff_box_foot {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.wrapper .content .staff_detail {
width: 50%;
border-top: 1px solid #cccccc;
padding: 10px;
text-align: center;
}
.wrapper .content .staff_detail:first-child {
border-right: 1px solid #cccccc;
}
.wrapper .content .staff_detail_row1 {
margin-bottom: 5px;
}
.wrapper .content .staff_detail_row2 {
font-size: 36px;
}
.wrapper .content .top_bar2 {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 40px;
}
.wrapper .content .top_zoom button {
border: none;
padding: 0;
cursor: pointer;
background: none;
}
.wrapper .content .permit {
margin-top: 20px;
background: #ffffff;
border: 2px solid #ff8c00;
border-radius: 20px;
padding: 20px;
padding-top: 50px;
}
.wrapper .content .fill_person {
color: #ffffff;
background: #ff8c00;
position: absolute;
margin-top: -70px;
padding: 10px;
font-size: 18px;
margin-left: 162px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.wrapper .content .permit_foot {
width: 100%;
margin-top: 30px;
}
.wrapper .content .permit_button {
text-align: right;
}
.wrapper .content .confirm_remarks {
text-align: center;
}
.wrapper .content .permit_button button.cancel {
border: none;
background: #e6e6e6;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #666666;
}
.wrapper .content .permit_button button.submit {
border: none;
background: #ff8c00;
font-size: 16px;
padding: 10px 25px;
font-weight: 600;
color: #ffffff;
}
.wrapper .sidebar.cramH {
height: 100vh;
}
.wrapper.bgB .sidebar {
background: url(../img/left_bg01.png) top left no-repeat #00a8d4;
background-size: 100%;
}
.wrapper.bgB .sidebar .user {
color: #ffffff;
}
.wrapper.bgB .content {
padding: 30px 80px 30px 30px;
}
.wrapper.bgO .sidebar {
background: url(../img/left_bg02.png) top left no-repeat #ff8c00;
background-size: 100%;
}
.wrapper.bgO .sidebar .user {
color: #ffffff;
}
.wrapper.bgO .content {
padding: 30px 80px 30px 30px;
}
.wrapper.bgO .content .top_subTitle {
background: #ff8c00;
}
.wrapper.bgB.forSize, .wrapper.bgO.forSize {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
/*lightbox*/
.lightBox {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: #00000085;
display: flex;
align-items: center;
justify-content: center;
overflow-y: scroll;
}
.lightBox_are {
min-width: 600px;
}
.lightBOX_head {
padding: 20px;
background: #fff;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}
.lightBox_title {
font-size: 18px;
font-weight: bold;
}
.lightBox_body {
background: #ffffff;
padding: 20px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
min-height: 150px;
}
.searchBox_content_row,
.searchBox_content_row span,
.searchBox_content_row input,
.searchBox_content_row select {
width: calc(100%);
margin: 10px 0px 0px 0px;
text-align: center;
}
.searchBox_content_row button.button_gray {
font-weight: bold;
width: calc(20%);
height: 40px;
margin: 10px 0px 0px 0px;
background-color: #808080;
color: #FFFFFF;
border: 0;
font-size: large;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.searchBox_content_row button.button_blue {
font-weight: bold;
width: calc(20%);
height: 40px;
margin: 10px 0px 0px 0px;
background-color: #00a8d4;
color: #FFFFFF;
border: 0;
font-size: large;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.searchBox_content_row button.button_green {
font-weight: bold;
width: calc(20%);
height: 40px;
margin: 10px 0px 0px 40%;
background-color: #aadc00;
color: #FFFFFF;
border: 0;
font-size: large;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.searchBox_content_row button.button_red {
font-weight: bold;
width: calc(20%);
height: 40px;
margin: 10px 0px 0px 40%;
background-color: #FF0000;
color: #FFFFFF;
border: 0;
font-size: large;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.lightBox_content textarea {
width: 100%;
border: none;
font-size: 16px;
}
.lightBox_foot {
padding: 20px;
background: #ffffff;
-webkit-border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 20px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
text-align: right;
}
.lightBox_foot button.cancel {
padding: 5px 15px;
background: #999999;
border: none;
font-size: 16px;
color: #ffffff;
}
.lightBox_foot button.disagree {
padding: 5px 15px;
background: #c1272d;
border: none;
font-size: 16px;
color: #ffffff;
}
.lightBox_foot button.agree {
padding: 5px 15px;
background: #89b700;
border: none;
font-size: 16px;
color: #ffffff;
}
.lightBox_foot button.return {
padding: 5px 15px;
background: #da7a0d;
border: none;
font-size: 16px;
color: #ffffff;
}
.light_btn {
float: right;
}
.light_btn button, .light_btn div {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 5px 10px;
background: #a0a0a0;
border: none;
color: #ffffff;
font-size: 16px;
}
input.searchBox_name {
width: 100%;
padding: 5px;
border: 1px solid #9c9c9c;
box-sizing: border-box;
margin-bottom: 10px;
}
input.searchBox_name_40 {
width: 40%;
padding: 5px;
border: 1px solid #9c9c9c;
box-sizing: border-box;
margin-bottom: 10px;
}
select.searchBox_time {
width: 100%;
padding: 5px;
border: 1px solid #9c9c9c;
box-sizing: border-box;
margin-bottom: 10px;
}
/*lightbox end*/
/*隱藏手機用物件*/
.m_mainbav, .m_mainbav2, .m_top_title, .m_top_bar, .m_sub_bar, .m_data_table, .member_optionsM, .m_sub_bar2, .m_staff_list, .foot_page {
display: none;
}
.browse_row {
margin: 10px auto;
}
a.lnk_template {
color: #fff;
background: #00a8d4;
display: inline-block;
padding: 10px;
}
a.lnk_template img {
height: 15px;
vertical-align: middle;
padding: 0 5px;
}
.file {
position: relative;
display: inline-block;
padding: 5px 10px 5px 5px;
overflow: hidden;
color: #000000;
text-decoration: none;
text-indent: 0;
line-height: 20px;
vertical-align: middle;
border: 1px solid #b7b7b7;
}
button.fileSubmit {
border: none;
background: #00a8d4;
color: #fff;
padding: 7px;
vertical-align: middle;
font-size: 14px;
cursor: pointer;
}
/*end 隱藏手機用物件*/
@media all and (max-width: 1440px) {
.wrapper .content .fillFino_border {
flex-wrap: wrap;
}
.wrapper .content .fillFino_left {
background: none;
}
.wrapper .content .check_photo_box {
width: calc(50% - 10px);
}
.wrapper .content .staff_box {
margin: 5px;
padding: 10px;
width: calc(25% - 10px);
}
.wrapper .content .staff_right01 {
padding-left: 10px;
width: calc(100% - 72px);
}
.wrapper .content .staff_date {
width: calc(100% - 31px);
}
.wrapper .content .staff_date_text {
font-size: 16px;
letter-spacing: inherit;
}
.wrapper .content .staff_check {
margin-left: 5px;
}
.wrapper .content .fettle_list01, .wrapper .content .fettle_list02 {
font-size: 14px;
padding: 5px 0;
margin: 3px;
}
.wrapper .content .staff_box_body {
padding: 10px;
}
.wrapper .content .staff_detail {
padding: 5px;
}
.wrapper .content .staff_detail_row2 {
font-size: 26px;
}
.wrapper .content .fill_person {
margin-left: 0;
}
.wrapper .content .main_options.box6a {
width: calc(100% - 250px);
}
.wrapper .content .main_options .main_list_img {
padding: 25px 25px 10px;
}
.wrapper .content .main_options .main_list_text {
font-size: 18px;
}
}
@media all and (max-width: 1024px) {
/*隱藏電腦用物件*/
.wrapper .sidebar {
display: none;
}
.wrapper .content .mainbav, .wrapper .content .top_bar, .wrapper .content .sub_bar, .wrapper .content .data_table, .wrapper .content .member_option, .wrapper .content .staff_list, .wrapper .content .staff_table, .wrapper .content .top_bar2, .wrapper .content .fillFino_H1, .wrapper .content .member_options {
display: none;
}
/*end 隱藏電腦用物件*/
body.main {
background: #cccccc;
}
body.login {
background: #ffffff;
min-height: auto;
padding: 0;
}
body.login .login_box {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
margin: 10px auto;
width: 100%;
}
body.login .login_box .login_head {
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius: 0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom: none;
}
body.login .login_box .login_body {
height: auto;
flex-wrap: wrap;
padding: 10px 0;
max-width: 350px;
margin: 0 auto;
}
body.login .login_box .login_body .login_AccPw, body.login .login_box .login_body .login_FBGoogle {
width: 100%;
}
body.login .login_box .login_body .login_AccPw .login_inputBox, body.login .login_box .login_body .login_AccPw .login_fb, body.login .login_box .login_body .login_AccPw .login_google, body.login .login_box .login_body .login_FBGoogle .login_inputBox, body.login .login_box .login_body .login_FBGoogle .login_fb, body.login .login_box .login_body .login_FBGoogle .login_google {
margin-top: 20px;
}
body.login .login_box .login_body .login_divider {
background: url(../img/divider2.png) center center repeat-x;
width: 100%;
margin: 20px 20px 0;
}
body.login .login_box .login_foot {
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
padding-top: 50px;
}
body.login .login_box .login_foot .login_foot_btn button.login_submit:hover {
margin-top: 10px;
margin-bottom: 10px;
}
.wrapper {
display: block;
}
.wrapper .content {
display: block;
width: 100%;
padding: 0;
}
.wrapper .content .m_mainbav {
display: block;
padding: 10px 10px 20px;
background: #e6e6e6;
}
.wrapper .content .m_mainbav_top {
display: flex;
align-items: center;
justify-content: flex-end;
}
.wrapper .content .logo {
padding: 5px 10px;
}
.wrapper .content .logo img {
width: 30px;
}
.wrapper .content .m_subnav {
display: flex;
align-items: flex-end;
justify-content: flex-start;
}
.wrapper .content .m_subnav_avatar {
padding-right: 20px;
}
.wrapper .content .m_avatar_img img {
width: 70px;
}
.wrapper .content .m_avatar_admin {
position: absolute;
margin-top: -28px;
margin-left: 50px;
}
.wrapper .content .m_avatar_admin img {
width: 30px;
}
.wrapper .content .m_user {
width: calc(100% - 135px);
}
.wrapper .content .userLv {
font-weight: bold;
font-size: 18px;
padding-bottom: 10px;
}
.wrapper .content .userTitle {
font-size: 15px;
}
.wrapper .content .m_subnav_btn {
padding: 25px 20px 0;
}
.wrapper .content .m_subnav_slide {
position: absolute;
background: #ffffff;
padding: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border: 1px solid #ccc;
-webkit-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
-moz-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
left: calc(100% - 88px);
margin-top: 12px;
}
.wrapper .content .m_subnav_slide a {
color: #000000;
display: block;
padding: 5px;
font-size: 14px;
font-weight: 700;
}
.wrapper .content .main_options {
margin-top: 0;
padding: 10px 0;
}
.wrapper .content .main_options a {
margin: 10px;
width: calc(25% - 20px);
}
.wrapper .content .main_options.box6a {
margin-top: 0;
padding: 10px 0;
width: 100%;
}
.wrapper .content .main_options.box6a a {
margin: 10px;
width: calc(25% - 20px);
}
.wrapper .content .m_mainbav2 {
display: block;
background: #00a8d4;
}
.wrapper .content .m_mainbav_row {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 10px;
}
.wrapper .content .m_mainbav_logo {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(100% - 142px);
}
.wrapper .content .m_mainbav_logo .logo {
padding-right: 10px;
}
.wrapper .content .m_mainbav_logo .logo img {
width: 45px;
}
.wrapper .content a.m_mainbav_home {
display: block;
padding-right: 15px;
}
.wrapper .content a.m_mainbav_home img {
width: 45px;
}
.wrapper .content .m_subnav_avatar2 {
width: 45px;
margin-right: 10px;
}
.wrapper .content .m_subnav_avatar_img2 {
width: 100%;
}
.wrapper .content .m_subnav_avatar_img2 img {
width: 100%;
}
.wrapper .content .m_subnav_avatar_admin2 {
position: absolute;
margin-top: -23px;
margin-left: 28px;
}
.wrapper .content .m_subnav_avatar_admin2 img {
height: 20px;
}
.wrapper .content .m_subnav_btn2 {
padding: 10px 5px;
}
.wrapper .content .m_mainbav_subrow {
display: flex;
align-items: center;
justify-content: center;
}
.wrapper .content .m_mainbav_title {
font-size: 24px;
font-weight: bold;
color: #ffffff;
padding-right: 10px;
padding-block: 15px;
}
.wrapper .content .m_top_title {
display: block;
padding: 20px 10px;
font-size: 24px;
font-weight: bold;
min-height: 64px;
}
.wrapper .content .m_top_search {
float: right;
}
.wrapper .content .m_top_bar {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 10px;
}
.wrapper .content .top_subTitle {
font-size: 18px;
color: #ffffff;
background: #00a8d4;
padding: 10px;
}
.wrapper .content .top_page {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(100% - 92px);
padding-left: 15px;
}
.wrapper .content .top_page .page_quantity {
padding: 0 10px;
}
.wrapper .content .top_page .page_quantity input {
width: 25px;
text-align: center;
}
.wrapper .content .foot_page {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
margin: 10px auto;
}
.wrapper .content .foot_page .page_quantity {
padding: 0 10px;
}
.wrapper .content .foot_page .page_quantity input {
width: 25px;
text-align: center;
}
.wrapper .content .m_sub_bar {
padding: 10px;
display: flex;
align-items: center;
justify-content: flex-start;
}
.wrapper .content .m_sub_checkbox {
margin-right: 10px;
}
.wrapper .content .m_sub_checkbox input {
width: 26px;
height: 26px;
}
.wrapper .content .m_sub_delete_btn {
width: calc(100% - 105px);
}
.wrapper .content .m_sub_delete_btn button {
border: none;
background: none;
}
.wrapper .content .m_sub_folder button {
border: none;
background: none;
}
.wrapper .content .m_sub_folder button img {
height: 40px;
}
.wrapper .content .m_data_table {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 10px;
background: #ffffff;
}
.wrapper .content .m_status {
background: #ffffff;
padding: 10px;
}
.wrapper .content .m_data_table.noCheck .m_status {
padding-left: 0;
padding-right: 0;
}
.wrapper .content .m_data_table.noCheck .m_SContent {
/*width: calc(100% - 86px);*/
width: calc(100% - 20px);
}
.wrapper .content .m_data_table.noCheck .m_data_name {
font-size: 20px;
}
.wrapper .content .m_data_table.noCheck .m_data_Numbering {
font-size: 16px;
font-weight: bold;
}
.wrapper .content .m_data_table.noCheck .m_data_in, .wrapper .content .m_data_table.noCheck .m_data_out {
padding: 5px;
}
.wrapper .content .m_data_table.noCheck .m_data_inDate .m_inDate_date, .wrapper .content .m_data_table.noCheck .m_data_inDate .m_outDate_date, .wrapper .content .m_data_table.noCheck .m_data_outDate .m_inDate_date, .wrapper .content .m_data_table.noCheck .m_data_outDate .m_outDate_date {
font-size: 14px;
}
.wrapper .content .m_status_chechBox {
padding: 5px;
}
.wrapper .content .m_status_chechBox input {
width: 26px;
height: 26px;
}
.wrapper .content .notOK_gray {
background: #808080;
color: #fff;
font-size: 18px;
padding: 7px;
width: 33px;
line-height: 26px;
-webkit-border-radius: 5px;
}
.wrapper .content .notOK {
background: red;
color: #fff;
font-size: 18px;
padding: 7px;
width: 33px;
line-height: 26px;
-webkit-border-radius: 5px;
}
.wrapper .content .staOK {
background: #96c800;
color: #fff;
font-size: 18px;
padding: 7px;
width: 33px;
line-height: 26px;
-webkit-border-radius: 5px;
}
.wrapper .content .m_SContent {
width: calc(100% - 53px);
background: #ffffff;
padding: 10px;
}
.wrapper .content .m_SContent_top {
display: flex;
align-items: center;
justify-content: space-between;
padding-right: 10px;
}
.wrapper .content .m_data_name {
font-size: 24px;
font-weight: bold;
padding-right: 10px;
}
.wrapper .content .m_data_Numbering {
font-size: 20px;
width: calc(55% - 41px);
}
.wrapper .content .m_SContent_bottom {
display: flex;
align-items: center;
justify-content: space-between;
padding: 11px 0;
}
.wrapper .content .m_data_group {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(50% - 18px);
}
.wrapper .content .m_data_group_5 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(5%- 18px);
}
.wrapper .content .m_data_group_05 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(5%);
}
.wrapper .content .m_data_group_10 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(10%);
}
.wrapper .content .m_data_group_15 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(15%);
}
.wrapper .content .m_data_group_20 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(20%);
}
.wrapper .content .m_data_group_25 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(25%);
}
.wrapper .content .m_data_group_30 {
display: flex;
align-items: center;
justify-content: flex-start;
width: calc(30%);
}
.wrapper .content .m_data_in, .wrapper .content .m_data_out {
font-size: 24px;
font-weight: bold;
padding: 10px;
}
.wrapper .content .m_data_inDate .m_inDate_date, .wrapper .content .m_data_inDate .m_outDate_date, .wrapper .content .m_data_outDate .m_inDate_date, .wrapper .content .m_data_outDate .m_outDate_date {
font-size: 18px;
}
.wrapper .content .m_data_inDate .m_inDate_time, .wrapper .content .m_data_inDate .m_outDate_time, .wrapper .content .m_data_outDate .m_inDate_time, .wrapper .content .m_data_outDate .m_outDate_time {
font-size: 28px;
}
.wrapper .content .m_data_more {
padding: 10px 15px;
margin: 0 0 0 30px;
}
.wrapper .content .data_slide {
position: absolute;
width: 51px;
margin-left: -70px;
display: none;
}
.wrapper .content .data_slide a {
background: #ffffff;
display: block;
margin-bottom: 10px;
padding: 5px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
text-align: center;
-webkit-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
-moz-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
margin-right: 5px;
}
.wrapper .content .data_slide a img {
padding: 0;
}
.wrapper .content .step_bar {
margin-top: 20px;
}
.wrapper .content .step_box {
display: block;
}
.wrapper .content .step_num {
font-size: 26px;
padding: 10px 17px;
border-radius: 60px;
display: block;
width: 50px;
margin: 0 auto;
border: 1px solid #808080;
}
.wrapper .content .step_text {
width: auto;
margin-top: 10px;
text-align: center;
font-size: 16px;
}
.wrapper .content .step_arrow01 {
width: 14px;
height: 30px;
background-size: 100%;
margin: 10px 15px;
}
.wrapper .content .step_arrow02 {
width: 14px;
height: 18px;
background-size: 100%;
margin: 10px 15px;
}
.wrapper .content .step_list.active .step_num {
border: 1px solid #00a8d4;
background: #00a8d4;
color: #ffffff;
}
.wrapper .content .step_list.active .step_text {
color: #00a8d4;
}
.wrapper .content .step_list.active .step_arrow01 {
background-size: 100%;
}
.wrapper .content .step_list.active .step_arrow02 {
background-size: 100%;
}
.wrapper .content .fillFino, .wrapper .content .fillFino2 {
padding: 20px 10px;
margin: 10px;
}
.wrapper .content .fillFino_div {
margin: 10px;
}
.wrapper .content .fillFino_border {
display: block;
}
.wrapper .content .fillFino_left {
background: none;
padding: 0;
padding-bottom: 20px;
}
.wrapper .content .fillFino_left_row {
margin-bottom: 10px;
}
.wrapper .content .fillFino_left_title {
font-size: 16px;
width: 80px;
}
.wrapper .content .fillFino_left_project {
width: calc(100% - 80px);
}
.wrapper .content .fillFino_left_project input {
width: 100%;
box-sizing: border-box;
}
.wrapper .content .fillFino_right {
padding: 0;
}
.wrapper .content .fillFino_right_row01 {
display: block;
}
.wrapper .content .fillFino_right_list {
display: block;
margin: 0;
}
.wrapper .content .fillFino_right_title {
font-size: 16px;
width: 100%;
margin-bottom: 10px;
}
.wrapper .content .fillFino_right_project {
width: 100%;
margin-bottom: 20px;
}
.wrapper .content .fillFino_right_row02 {
flex-wrap: wrap;
}
/*.wrapper .content .fillFino_right_project01 {
width: calc(50% - 10px);
}
.wrapper .content .fillFino_right_project02 {
margin: 0;
width: calc(50% - 10px);
}*/
.wrapper .content .fillFino_right_row03 {
display: block;
}
.wrapper .content .fillFino_right_row03 .fillFino_right_project {
width: 100%;
}
.wrapper .content .fillFino_btn {
text-align: center;
width: 100%;
word-wrap: break-word;
word-break: normal;
}
.wrapper .content .fillFino_H, .wrapper .content .fillFino_M {
width: 40%;
}
.wrapper .content .fillFino_border02 {
width: 100%;
}
.wrapper .content span.Fino_title, .wrapper .content span.Fino_title2 {
display: block;
margin-right: 0;
margin-bottom: 10px;
font-size: 18px;
}
.wrapper .content .fillFino_H1 {
margin: 20px;
}
.wrapper .content .fillFino_part01 {
padding-bottom: 40px;
border-bottom: 1px solid #ccc;
}
.wrapper .content .fillFino_part02_row {
display: block;
}
.wrapper .content .part02_name_box {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
}
.wrapper .content .part02_title01 {
margin-bottom: 10px;
}
.wrapper .content .part02_mail_box {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
}
.wrapper .content .part04_mail_box {
width: 230px;
margin-right: 10px;
}
.wrapper .content .fillFino_part_submit02 {
text-align: center;
margin: 30px 0;
}
.wrapper .content .fillFino_part01_list {
flex-wrap: wrap;
margin-bottom: 10px;
}
.wrapper .content .fillFino_part03_list {
/*flex-wrap: wrap;*/
margin-bottom: 10px;
}
.wrapper .content .list01_name {
width: 100%;
margin: 0;
border: none;
font-size: 18px;
font-weight: bold;
padding: 5px;
}
.wrapper .content .list01_mail {
/*width: calc(100% - 40px);
padding: 0;*/
width: calc(100% - 100px);
padding: 0 0 0 5;
border: none;
}
.wrapper .content .fillFino_part_close {
margin-top: -15px;
}
.wrapper .content .part01_title01 {
width: 100%;
}
.wrapper .content .part01_name {
width: calc(100% - 72px);
}
.wrapper .content .confirm_left {
width: 100%;
padding: 0;
margin-bottom: 20px;
}
.wrapper .content .confirm_left_project {
width: calc(100% - 100px);
background: #eeeeee;
padding: 5px;
}
.wrapper .content .confirm_right {
width: 100%;
padding-left: 0;
border: none;
}
.wrapper .content .confirm_right_row01 {
padding: 10px 0;
flex-wrap: wrap;
}
.wrapper .content .confirm_right_row03 {
padding: 10px 0;
/*flex-wrap: wrap;*/
}
.wrapper .content .confirm_right_title {
width: 40%;
}
.wrapper .content .confirm_right_project {
width: 60%;
}
.wrapper .content .confirm_right_rowBox {
width: 100%;
}
.wrapper .content .confirm_right_rowBox:first-child {
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
}
.wrapper .content .confirm_right_rowBox:last-child {
padding-top: 10px;
}
.wrapper .content .confirm_right_project02 {
width: 60%;
}
.wrapper .content .confirm_right_row02 {
flex-wrap: wrap;
padding: 15px 0;
}
.wrapper .content .confirm_right_title01 {
width: 100%;
margin-bottom: 10px;
}
.wrapper .content .confirm_right_project03 {
width: 100%;
}
.wrapper .content .confirm_subtitle {
color: #808080;
margin-bottom: 10px;
}
.wrapper .content .confirm_title {
color: red;
}
.wrapper .content .member_optionsM {
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
}
.wrapper .content .member_optionsM a {
margin: 10px;
}
.wrapper .content .member_optionsM a.member_optionsM01 {
background: url(../img/guard_iconM01.png) top center no-repeat;
}
.wrapper .content .member_optionsM a.member_optionsM02 {
background: url(../img/guard_iconM02.png) top center no-repeat;
}
.wrapper .content .member_optionsM a.member_optionsM03 {
background: url(../img/guard_iconM03.png) top center no-repeat;
}
.wrapper .content .member_optionsM a.member_optionsM04 {
background: url(../img/guard_iconM04.png) top center no-repeat;
}
.wrapper .content .member_optionsM_text {
color: #000000;
margin-top: 10px;
font-weight: bold;
}
.wrapper .content .check_member {
padding: 10px;
margin: 0;
}
.wrapper .content .check_content {
margin-top: 20px;
padding: 0px 10px;
}
.wrapper .content .check_are {
flex-wrap: wrap;
}
.wrapper .content .check_box {
padding: 20px;
width: 100%;
min-height: auto;
}
.wrapper .content .check_box:first-child {
margin-right: 0;
margin-bottom: 40px;
}
.wrapper .content .check_link {
text-align: center;
}
.wrapper .content .check_photo_box {
width: calc(50% - 5px);
margin-bottom: 10px;
}
.wrapper .content .m_sub_bar2 {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 10px;
margin-bottom: 10px;
}
.wrapper .content .m_sub_select select {
border: 1px solid #ccc;
padding: 5px;
background: #ffffff;
}
.wrapper .content .m_sub_btn button {
border: 1px solid #cccccc;
padding: 5px 10px;
background: #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.wrapper .content .m_staff_list {
display: block;
padding: 10px;
}
.wrapper .content .m_staff_box {
display: flex;
align-items: flex-start;
justify-content: flex-start;
background: #ffffff;
padding: 10px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-bottom: 10px;
}
.wrapper .content .m_staff_left {
width: 27px;
}
.wrapper .content .m_fettle_list01, .wrapper .content .m_fettle_list02 {
font-size: 14px;
padding: 9px 5px;
background: #cccccc;
margin-bottom: 5px;
color: #fff;
}
.wrapper .content .m_fettle_list01.check {
background: red;
}
.wrapper .content .m_fettle_list02.check {
background: #96c800;
}
.wrapper .content .m_staff_right {
padding-left: 10px;
width: calc(100% - 27px);
}
.wrapper .content .m_staff_row1 {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
}
.wrapper .content .m_staff_dateTitle {
font-size: 14px;
margin-right: 10px;
}
.wrapper .content .m_staff_check {
width: 26px;
}
.wrapper .content .m_staff_check.check {
background: url(../img/icon_checked.png) center center no-repeat;
}
.wrapper .content .m_staff_check.check img {
opacity: 0;
}
.wrapper .content .m_staff_row2 {
display: flex;
align-items: flex-end;
justify-content: flex-start;
margin-bottom: 10px;
}
.wrapper .content .m_staff_name {
width: 50%;
font-size: 30px;
}
.wrapper .content .m_staff_detail01 {
padding: 14px 0;
width: 15%;
text-align: center;
background: #ececec;
}
.wrapper .content .m_staff_detail02 {
width: 35%;
padding-left: 5px;
}
.wrapper .content .m_detail_date {
margin-bottom: 5px;
}
.wrapper .content .m_detail_time {
font-size: 22px;
}
.wrapper .content .check_btn {
text-align: center;
}
.wrapper .content .permit {
margin: 10px;
}
.wrapper .content .permit .confirm_left {
border-bottom: 1px solid #cccccc;
}
.wrapper .content .permit .confirm_right_title {
color: #000000;
}
.wrapper .content .permit .confirm_right_row04 {
padding-bottom: 20px;
}
.wrapper .content .permit .confirm_right_box {
margin-bottom: 0;
}
.wrapper .content .permit .permit_foot {
margin-top: 10px;
}
.wrapper .content .permit .confirm_remarks {
margin-bottom: 10px;
}
.wrapper .content .permit .permit_button {
text-align: center;
}
.wrapper .content .m_slideNav {
position: absolute;
width: 100%;
background: #eee;
padding: 10px 20px;
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46);
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46);
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46);
z-index: 9999;
}
.wrapper .content .m_slideNav a {
color: #2f2f2f;
display: block;
width: 200px;
margin: 0 auto;
padding: 15px;
font-weight: bold;
font-size: 18px;
}
.wrapper .content .m_slideNav a.active {
color: #00a8d4;
}
.wrapper.bgB .content, .wrapper.bgO .content {
padding: 0;
}
.wrapper.bgB .content .m_subnav, .wrapper.bgO .content .m_subnav {
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
border: 1px solid #ccc;
border-radius: 5px;
cursor: pointer;
background: #00a8d4;
}
.wrapper.bgB .content .m_subnav_slide, .wrapper.bgO .content .m_subnav_slide {
position: absolute;
background: #ffffff;
padding: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border: 1px solid #ccc;
margin-top: 148px;
-webkit-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
-moz-box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
box-shadow: 3px 3px 4px 1px rgba(0, 0, 0, 0.21);
}
.wrapper.bgB .content .m_subnav_slide a, .wrapper.bgO .content .m_subnav_slide a {
color: #000000;
display: block;
padding: 5px;
font-size: 14px;
font-weight: 700;
}
.wrapper.bgO .content {
padding: 0;
}
.wrapper.bgO .content .m_subnav {
background: #ff8c00;
}
.wrapper.bgO .content .m_mainbav2 {
background: #ff8c00;
}
.wrapper.bgO .content .confirm_left_project {
background: #ffffff;
}
.wrapper.bgO .content .m_slideNav a.active {
color: #ff8c00;
}
.browse_row {
margin: 10px;
}
a.lnk_template {
width: 100%;
text-align: center;
}
.file {
width: calc(50% - 2px);
text-align: center;
}
button.fileSubmit {
width: calc(50% - 3px);
}
}
@media all and (max-width: 800px) {
.wrapper .content .main_options a, .wrapper .content .main_options.box6a a {
margin: 10px;
width: calc(50% - 20px);
}
.wrapper .content .mainbav_title {
font-size: 18px;
}
.wrapper .content .main_options .main_list_img {
padding: 50px 50px 20px;
}
.wrapper .content .main_options .main_list_text {
font-size: 32px;
}
.lightBox_are {
min-width: auto;
width: 100%;
margin: 0px 5px;
}
}
@media all and (max-width: 480px) {
.wrapper .content .main_options .main_list_img {
padding: 35px 35px 10px;
}
.wrapper .content .main_options .main_list_text {
font-size: 22px;
}
}
@media all and (max-width: 350px) {
.login_box .login_foot .login_foot_btn {
padding: 0 10px;
}
.login_box .login_foot .login_foot_btn button.login_submit {
width: 100%;
height: auto;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: url(../img/btn_login.png) center center no-repeat;
background-size: 100%;
padding: 4% 0;
}
.wrapper .content .notOK {
font-size: 16px;
width: 30px;
line-height: 24px;
}
.wrapper .content .m_SContent {
padding: 10px 0;
width: calc(100% - 50px);
}
.wrapper .content .m_data_name {
font-size: 18px;
padding: 0;
}
.wrapper .content .m_data_Numbering {
width: auto;
}
.wrapper .content .m_data_in, .wrapper .content .m_data_out {
font-size: 18px;
padding: 10px;
}
.wrapper .content .m_inDate_date, .wrapper .content .m_outDate_date {
font-size: 16px;
}
.wrapper .content .m_inDate_time, .wrapper .content .m_outDate_time {
font-size: 24px;
}
.wrapper .content .mainbav_title {
font-size: 14px;
}
.wrapper .content .fillFino_H, .wrapper .content .fillFino_M {
width: 45%;
}
.wrapper .content .fillFino_interval {
width: 10%;
}
.wrapper .content button.fillFino_cancel, .wrapper .content button.fillFino_submit {
padding: 10px 20px;
}
.wrapper .content .member_optionsM a {
margin: 10px 5px;
}
.wrapper .content .m_data_table.noCheck .m_data_name {
font-size: 18px;
}
.wrapper .content .main_options .main_list_img {
padding: 35px 35px 10px;
}
.wrapper .content .main_options .main_list_text {
font-size: 18px;
}
}
/*啟動開關*/
.btn-box {
display: inline-block;
vertical-align: middle;
width: 60px;
height: 30px;
border-radius: 100px;
background-color: #f00;
box-shadow: 0px 3px 0px rgba(0,0,0,.13) inset;
}
.btn-box .btn {
display: inline-block;
width: 30px;
height: 30px;
border-radius: 50%;
background-color: #fff;
margin-left: 0; /*動畫從ml為0開始*/
transition: .5s;
box-shadow: 1px 2px 5px rgba(0,0,0,.3);
}
.checkbox {
position: absolute;
opacity: 0;
}
.checkbox:checked + .btn-box {
background-color: #aadc00;
}
.checkbox:checked + .btn-box .btn {
margin-left: 30px;
}
.box_text {
vertical-align: middle;
}
.alert {
border: none;
border-radius: 4px;
padding: 15px;
}
.alert.alert-success {
background: #7cdda7;
color: #3c763d;
}
.alert.alert-info {
background: #93cfe5;
color: #31708f;
}
.alert.alert-danger {
background: #f8b2b2;
color: #8a6d3b;
}
.alert.alert-warning {
background: #ffead0;
color: #a94442;
}
.close {
float: right;
font-size: 21px;
font-weight: 700;
line-height: 1;
color: #000;
text-shadow: 0 1px 0 #fff;
filter: alpha(opacity=20);
opacity: .2;
-webkit-appearance: none;
padding: 0;
cursor: pointer;
background: 0 0;
border: 0;
}
span.required:before {
content: "*";
display: inline;
color: #E6674A;
}
/*breadcrumb麵包屑*/
.nav_breadcrumb {
font-weight: 700;
font-size: 13px;
}
ul.breadcrumb {
padding: 0;
margin: 0;
}
ul.breadcrumb li.breadcrumb-item {
float: left;
}
ul.breadcrumb li.breadcrumb-item a {
color: #05a8d5;
}
ul.breadcrumb li.breadcrumb-item a:hover {
text-decoration: underline;
}
ul.breadcrumb li.breadcrumb-item span:hover {
text-decoration: underline;
}
li.breadcrumb-item:not(:first-child)::before {
content: ">";
color: #8a969c;
margin: 0 6px;
padding: 0;
}
.title_row {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.title_row h3.page_title {
color: #00a8d4;
font-size: 18px;
font-weight: bold;
text-decoration: solid underline #00a8d4 3px;
}
.title_row h3.page_title2 {
color: #ff8c00;
font-size: 18px;
font-weight: bold;
text-decoration: solid underline #ff8c00 3px;
}
.title_row button {
border: none;
}
.title_row .btn_collapse {
float: right;
width: 20px;
height: 20px;
display: inline-block;
text-rendering: auto;
background: url(../img/icon_next.png) center no-repeat;
cursor: pointer;
position: relative;
left: 40px;
}
.title_row .btn_collapse {
transform: rotate(0deg);
}
.title_row .btn_collapse.active {
transform: rotate(-180deg);
}
.title_row .btn_collapse1 {
float: right;
width: 20px;
height: 20px;
display: inline-block;
text-rendering: auto;
background: url(../img/icon_next.png) center no-repeat;
cursor: pointer;
position: relative;
left: 40px;
}
.title_row .btn_collapse1 {
transform: rotate(0deg);
}
.title_row .btn_collapse1.active {
transform: rotate(-180deg);
}
@media all and (max-width: 1440px) {
.title_row .btn_collapse {
transform: rotate(90deg);
}
.title_row .btn_collapse.active {
transform: rotate(-90deg);
}
.title_row .btn_collapse1 {
transform: rotate(90deg);
}
.title_row .btn_collapse1.active {
transform: rotate(-90deg);
}
}
@media all and (max-width: 1024px) {
.title_row .btn_collapse {
transform: rotate(90deg);
left: 0;
}
.title_row .btn_collapse.active {
transform: rotate(-90deg);
left: 0;
}
.title_row .btn_collapse1 {
transform: rotate(90deg);
left: 0;
}
.title_row .btn_collapse1.active {
transform: rotate(-90deg);
left: 0;
}
}
/*fillFino_left_box*/
#fillFino_left_box {
display: none;
visibility: hidden;
}
#fillFino_left_box.active {
display: block;
visibility: visible;
}
#fillFino_left_box1 {
display: none;
visibility: hidden;
}
#fillFino_left_box1.active {
display: block;
visibility: visible;
}
.wrapper .page_content {
position: relative;
padding: 1% 3% 3%;
}
/*# sourceMappingURL=css.css.map */