@charset "utf-8";
/*--------------------------------------
 * style css (スタッフマイページ用CSS)
 *------------------------------------*/
/*--------------------------------------
 * 全体の定義
 * ページ背景色・背景画像
 * 文字色・サイズ
 *------------------------------------*/
body {
    background-color:#ffffff;
    color:#333333;
    font-size:15px;
    line-height:150%;
    margin: 0px;
    padding: 0px;
    text-align:center;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica,sans-serif;
}
tr,td,th,div {
    color: #333333;
    font-size: 15px;
    line-height: 150%;
}
form {
    margin: 0px;
    padding: 0px;
}
img {
    border:0px;
}
hr {
    border:none;
    border-top: 1px dashed #afaeae;
    height: 1px;
    color:#ffffff;
}
ul {
    margin:0px;
    padding:2px;
    list-style-type: disc;
    list-style-position: outside;
}
li {
    padding:0px;
    margin:2px 0px 2px 20px;
}

span.hidden {
    display: none;
}

.smart_disp {
    display: none;
}

.t10    { font-size: 10px;line-height: 130%; }
.t12    { font-size: 12px;line-height: 130%; }
.t18    { font-size: 18px;line-height: 150%; }

.floatleft  { float: left; }
.floatright { float: right; }
.left       { text-align: left; }
.center     { text-align: center; }
.right      { text-align: right; }

/*--------------------------------------
 * リンク 通常時(link,visited,active)
 * リンク マウスが当たっている時(hover)
 *------------------------------------*/
a:link    { color:#1a9bd2; text-decoration:underline; }
a:visited { color:#1a9bd2; text-decoration:underline; }
a:active  { color:#1a9bd2; text-decoration:underline; }
a:hover   { color:#b57100; text-decoration:underline; background-color:#fff7b2; }
a.blocklink {width:100%;display:block;}

a.gray:link    { color:#c0c0c0; text-decoration:underline; }
a.gray:visited { color:#c0c0c0; text-decoration:underline; }
a.gray:active  { color:#c0c0c0; text-decoration:underline; }
a.gray:hover   { color:#b57100; text-decoration:underline; background-color:#fff7b2; }

a.bgtrans:link    { text-decoration:none; }
a.bgtrans:visited { text-decoration:none; }
a.bgtrans:active  { text-decoration:none; }
a.bgtrans:hover   { text-decoration:none; background-color: transparent; }

/*--------------------------------------
 * input box / text area / select menu
 *------------------------------------*/
.frm_num {
    border: 1px solid #afaeae;
    background-color:#ffffff;
    font-size:15px;
    color:#333333;
    ime-mode: disabled;
}

.frm_str {
    border: 1px solid #afaeae;
    background-color:#ffffff;
    font-size:15px;
    color:#333333;
    ime-mode: active;
}

.frm_area {
    border: 1px solid #afaeae;
    background-color:#ffffff;
    font-size:15px;
    color:#333333;
    overflow-y:auto;
    ime-mode: active;
}

.frm_y {
    border: 1px solid #afaeae;
    background-color:#ffffff;
    font-size:15px;
    ime-mode: disabled;
    width: 40px !important;
}

.frm_m, .frm_d, .frm_h, .frm_i {
    border: 1px solid #afaeae;
    background-color:#ffffff;
    font-size:15px;
    ime-mode: disabled;
    width: 25px !important;
}

input[type="text"][disabled],
input[type="text"][readonly],
input[type="tel"][disabled],
input[type="tel"][readonly],
textarea[disabled],
textarea[readonly],
select[disabled] {
    border: 1px solid #afaeae;
    background-color:#e4e4e4;
    color:#666666;
}

input[type="button"], input[type="submit"] {
    font-size: 15px;
}

/*--------------------------------------
 * 外枠
 *------------------------------------*/
#wrapper {
    background-color:#ffffff;
    width: 960px;
    margin: 0px auto;
}

#wrapper_flex {
    background-color:#ffffff;
    width: 100%;
    margin: 0px auto;
}

/*--------------------------------------
 * ドロワーメニュー
 *------------------------------------*/
#drawer_area {
    display: none;
}

/*--------------------------------------
 * ヘッダ
 *------------------------------------*/
#header_area {
    /* background-color: #303030; */
    background-color: #e74515;
    border-top:solid 1px #afaeae;
    border-left:solid 1px #afaeae;
    border-right:solid 1px #afaeae;
    border-bottom:solid 1px #afaeae;
    padding: 5px 5px;
    text-align: left;
    position: relative;
}

#header_logo {
    float: left;
    margin: 0;
}

#header_navi {
    float: right;
    margin: 5px;
}
#header_navi::after {
  content: "";
  clear: both;
  display: block;
}
#header_navi ul {
    margin: 0;
    padding: 0;
    list-style-type:none;
}
#header_navi ul li {
    float: left;
    padding: 0 10px 0 10px;
    margin: 0;
    color: #fff;
}
#header_navi ul li:not(:first-child) {
    border-left: 1px solid #fff;
    padding: 0 10px 0 10px;
}
#header_navi ul li:last-child {
    padding: 0 0 0 10px;
}
#header_navi ul li a:link,
#header_navi ul li a:visited,
#header_navi ul li a:active {
    color: #fff;
    text-decoration:none;
}
#header_navi ul li a:hover {
    color: #b57100;
    text-decoration:underline;
    background-color:#fff7b2;
}

/*--------------------------------------
 * フッタ
 *------------------------------------*/
#footer_area {
    background-color:#ffffff;
    border-left:solid 1px;
    border-right:solid 1px;
    border-bottom:solid 1px;
    border-color:#afaeae;
    padding:0px 0px 0px 0px;
    text-align:center;
}
.footer {
    font-size: 15px;
    color: #909090;
}

/*--------------------------------------
 * メインコンテンツ
 *------------------------------------*/
#main_area {
    background-color:#ffffff;
    border-left:solid 1px;
    border-right:solid 1px;
    border-color:#afaeae;
    margin: 0px;
    text-align:center;
    min-height: 460px;
}

#main_cont {
    background-color:#ffffff;
    text-align:left;
    /* padding:10px; */
    /* padding:10px 80px 20px 80px; */
    padding:10px 60px 20px 60px;
}

.clearing {
    clear: both;
    font-size: 1px;
    height: 1px;
}

/*--------------------------------------
 * 共通枠
 *------------------------------------*/
.waku {
    border: 1px solid;
    border-color: #afaeae;
    padding:10px;
    margin:0px auto;
}

/*--------------------------------------
 * ページタイトル
 *------------------------------------*/
.title  {
    font-size: 18px;
    font-weight: bold;
    color: #666666;
    background-color: #ffffff;
    /* border-bottom:3px solid #afaeae; */
    border-bottom:3px solid #e74515;
    padding: 5px 3px 3px 0.5em;
    margin:0px 0px 8px 0px;
}

.title2 {
    font-size: 15px;
    font-weight: bold;
    color: #666666;
    background-color: #ffffff;
    border-left: 10px solid #7f0119;
    padding: 3px 3px 3px 0.5em;
    margin:0px 0px 3px 0px;
}

/*--------------------------------------
 * テーブル
 *------------------------------------*/
/* 通常テーブル枠 */
.tbl, .tbl_leave {
    border-collapse: collapse;
    border: 1px solid #cccccc;
}
.tbl th, .tbl_leave th {
    border: 1px solid #cccccc;
    background-color: #f0f0f0;
    padding: 3px;
    color:#333333;
    text-align: left;
    font-weight: normal;
    white-space:nowrap;
}
.tbl td, .tbl_leave td {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    padding: 3px;
    color:#333333;
}

/* 個別背景色指定 */
.tbl th.gray, .tbl td.gray,
.tbl_leave th.gray, .tbl_leave td.gray {
    background-color:#e4e4e4;
}
.tbl th.yellow, .tbl td.yellow,
.tbl_leave th.yellow, .tbl_leave td.yellow {
    background-color:#fffab4;
}

.tbl th.today, .tbl td.today,
.tbl_leave th.today, .tbl_leave td.today {
    background-color:#ffffcc;
}
.tbl th.holiday, .tbl td.holiday,
.tbl_leave th.holiday, .tbl_leave td.holiday {
    background-color:#fff0f0;
}
.tbl th.saturday, .tbl td.saturday,
.tbl_leave th.saturday, .tbl_leave td.saturday {
    background-color:#f0f7ff;
}

/* 横線のみ指定 */
.row_only th, .row_only td {
    border-width: 1px 0px !important;
}

/* 縦線のみ指定 */
.col_only th, .col_only td {
    border-width: 0px 1px !important;
}

/*------------------------------------*/
.tbl_trans, .tbl_trans th, .tbl_trans td {
    border-style: none;
}

/*--------------------------------------
 * 強調文字
 *------------------------------------*/
.stress {
    color: #cc0000;
    font-weight: bold;
}
.stress2 {
    color: #cc0000;
}

/*--------------------------------------
 * フォーム注意書き文字
 *------------------------------------*/
.note {            /* stress */
    font-size: 10px;
    color: #ff0000;
}
.note2 {        /* normal */
    font-size: 10px;
    color: #333333;
}

/*--------------------------------------
 * エラーメッセージボックス
 *------------------------------------*/
.errbox {
    background-color: #ffffcc;
    border: 1px solid;
    border-color: #ff0000;
    padding: 4px 2px 4px 5px;
    margin:10px auto;
    text-align: left;
    color:#ff0000;
    font-size:14px;
}

.errmsg {
    color:#ff0000;
}

/*--------------------------------------
 * 更新完了メッセージボックス
 *------------------------------------*/
.updatedbox {
    background-color: #ffffef;
    border: 1px solid;
    border-color: #cccccc;
    padding: 4px 2px 4px 5px;
    margin:10px auto;
    text-align: left;
    color:#666666;
    font-size:14px;
}

/*--------------------------------------
 * 強調メッセージボックス
 *------------------------------------*/
.stressbox {
    background-color: #ffeae0;
    border: 1px solid;
    border-color: #ff809f;
    padding: 4px 2px 4px 5px;
    margin:10px auto;
    text-align: left;
    color:#333333;
    font-size:14px;
}

/*--------------------------------------
 * お知らせボックス
 *------------------------------------*/
.infobox {
    border: 1px solid;
    border-color: #cccccc;
    padding: 4px 2px 4px 5px;
    margin:10px;
    text-align: left;
    color:#666666;
    font-size:14px;
}

/*--------------------------------------
 * リンク抑制文字色
 *------------------------------------*/
.linkoff {
    color: #c0c0c0;
    text-decoration: underline;
}

/*--------------------------------------
 * 入力支援カレンダー(calendar.js)関連
 *------------------------------------*/
/* カレンダーボタン */
.cal_btn {
    background: url(../img/icon_calendar.gif) no-repeat center;
    border: solid 1px #cccccc;
    margin:0px 1px 2px 0px;
    padding: 0px;
    color: #999999;
    background-color:#ffffff;
    width: 22px;
    height: 20px;
    vertical-align:middle;
}
/* カレンダーウィンドウ */
.lyrCalCalendar {
    visibility:hidden;
    position:absolute;
    z-index:10;
}

/*--------------------------------------
 * ステップバー
 *------------------------------------*/
.stepBar {
    position: relative;
    list-style: none;
    margin: 0 0 10px 0;
    padding: 0px;
    text-align: center;
    width: 100%;
    overflow: hidden;
}
.stepBar::after {
    content: "";
    display: block;
    clear: both;
}
.stepBar .step {
    position: relative;
    float: left;
    display: inline-block;
    line-height: 40px;
    /* margin: 0px;        -DEL 2019-05-30 2行対応 */
    margin: 0 0 2px 0;  /* -INS 2019-05-30 2行対応 */
    padding: 0 40px 0 20px;
    background-color: #eee;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.stepBar .step::before, .stepBar .step::after {
    position: absolute;
    left: -15px;
    display: block;
    content: '';
    background-color: #eee;
    border-left: 4px solid #fff;
    width: 20px;
    height: 20px;
}
.stepBar .step::after {
    top: 0;
    -moz-transform: skew(30deg);
    -ms-transform: skew(30deg);
    -webkit-transform: skew(30deg);
    transform: skew(30deg);
}
.stepBar .step::before {
    bottom: 0;
    -moz-transform: skew(-30deg);
    -ms-transform: skew(-30deg);
    -webkit-transform: skew(-30deg);
    transform: skew(-30deg);
}
.stepBar .step:first-child {
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.stepBar .step:first-child::before, .stepBar .step:first-child::after {
    content: none;
}
.stepBar .step:last-child {
    -moz-border-radius-topright: 4px;
    -webkit-border-top-right-radius: 4px;
    border-top-right-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.stepBar .step.current {
    color: #fff;
    background-color: #777;
}
.stepBar .step.current::before, .stepBar .step.current::after {
    background-color: #777;
}
.stepBar.step2 .step {
    width: 50%;
}
.stepBar.step3 .step {
    width: 33.333%;
}
.stepBar.step4 .step {
    width: 25%;
}
.stepBar.step5 .step {
    width: 20%;
}

.stepBar_smart {
    display: none;
}

/*--------------------------------------
 * スタッフ登録
 *------------------------------------*/
.staff_kenshu_tbl {
    border-collapse: collapse;
    border: 1px solid #cccccc;
}
.staff_kenshu_tbl th {
    border: 1px solid #cccccc;
    background-color: #f0f0f0;
    padding: 3px;
    color:#333333;
    text-align: left;
    font-weight: normal;
    white-space:nowrap;
}
.staff_kenshu_tbl td {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    padding: 3px;
    color:#333333;
}

.staff_careea_tbl {
    border-collapse: collapse;
    border: 1px solid #cccccc;
}
.staff_careea_tbl th {
    border: 1px solid #cccccc;
    background-color: #f0f0f0;
    padding: 3px;
    color:#333333;
    text-align: left;
    font-weight: normal;
    white-space:nowrap;
}
.staff_careea_tbl td {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    padding: 3px;
    color:#333333;
}

/*--------------------------------------
 * マイページメニュー
 *------------------------------------*/
#mypage_menu {
    margin: 0 auto;
    width: 262px;
}

#mypage_menu::after {
  content: "";
  clear: both;
  display: block;
}

#mypage_menu ul {
    margin: 0px;
    padding: 0px;
    list-style-type:none;
    overflow: hidden;
}

#mypage_menu ul a {
    color: #666666;
    text-decoration: none;
}

#mypage_menu ul a:hover {
}

#mypage_menu ul li {
    margin: 10px 0px 20px 0px;
    padding: 0px;
    width: 262px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9),
color-stop(1, #e9e9e9));
    background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr
='#e9e9e9',GradientType=0);
    background-color:#f9f9f9;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border:1px solid #dcdcdc;
    font-weight: bold;
    font-size: 16px;
    color: #666666;
}

#mypage_menu ul li:last-child {
    margin-bottom: 10px;
}

#mypage_menu ul li.red {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffeae0),
color-stop(1, #ffc0a2));
    background:-moz-linear-gradient(top, #ffeae0 5%, #ffc0a2 100%);
    background:-webkit-linear-gradient(top, #ffeae0 5%, #ffc0a2 100%);
    background:-o-linear-gradient(top, #ffeae0 5%, #ffc0a2 100%);
    background:-ms-linear-gradient(top, #ffeae0 5%, #ffc0a2 100%);
    background:linear-gradient(to bottom, #ffeae0 5%, #ffc0a2 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeae0', endColorstr
='#ffc0a2',GradientType=0);
    background-color:#ffeae0;
}

#mypage_menu ul li a {
    display: block;
    line-height: 50px;
    text-align: center;
    border-width:1px 0 1px 0;
}

/*--------------------------------------
 * 業務報告
 *------------------------------------*/
.ghokoku_kotsu_tbl {
    border-collapse: collapse;
    border: 1px solid #cccccc;
}
.ghokoku_kotsu_tbl th {
    border: 1px solid #cccccc;
    background-color: #f0f0f0;
    padding: 3px;
    color:#333333;
    text-align: left;
    font-weight: normal;
    white-space:nowrap;
}
.ghokoku_kotsu_tbl td {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    padding: 3px;
    color:#333333;
}

/*--------------------------------------
 * smart
 *------------------------------------*/
@media screen and (max-width: 767px) {

    .smart_hidden {
        display: none;
    }
    .smart_disp {
        display: inline;
    }

    /*--------------------------------------
     * input box / text area / select menu
     *------------------------------------*/
    input[type="text"],
    input[type="tel"],
    input[type="password"],
    input[type="file"],
    select:not(.width_not100),
    textarea {
        width: 100%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* -INS 2024-02-26 START */
    .frm_y {
        width: 55px !important;
    }
    .frm_m, .frm_d, .frm_h, .frm_i {
        width: 35px !important;
    }
    /* -INS 2024-02-26 END */

    /*--------------------------------------
     * テーブル
     *------------------------------------*/
    .tbl {
        border: none !important;
        width: 100%;
        margin: 0px;
        padding: 0px;
    }
    .tbl tr {
        display: block;
    }
    .tbl th {
        font-weight: bold;
    }
    .tbl th, .tbl td {
        display: list-item;
        border: none;
        list-style-type: none;
        margin: 0px;
        padding: 3px 3px;
        width: 100%;
    }

    /*--------------------------------------
     * カレンダーのテーブル
     *------------------------------------*/
    .lyrCalCalendar table.tbl {
        border-collapse: collapse;
        border: 1px solid #cccccc;
        width: auto !important;
    }
    .lyrCalCalendar table.tbl tr {
        display: table-row !important;
    }
    .lyrCalCalendar table.tbl th {
        border: 1px solid #cccccc;
        background-color: #f0f0f0;
        padding: 3px;
        color:#333333;
        text-align: left;
        font-weight: normal;
        white-space:nowrap;
        display: table-cell !important;
        width: 20px !important;
    }
    .lyrCalCalendar table.tbl td {
        border: 1px solid #cccccc;
        background-color: #ffffff;
        padding: 3px;
        color:#333333;
        display: table-cell !important;
        width: 20px !important;
    }
    /*--------------------------------------
     * 外枠
     *------------------------------------*/
    #wrapper {
        width: 100%;
    }

    /*--------------------------------------
     * ドロワーメニュー
     *------------------------------------*/
    #drawer_area {
        display: block;
    }
    .drawer-hamburger {
        position: absolute;
        padding: 12px;
    }
    .drawer-hamburger-icon,
    .drawer-hamburger-icon::before,
    .drawer-hamburger-icon::after {
        /* height: 2px; */
        /* background-color: #222; */
        height: 3px;
        background-color: #fff;
    }

    ul.drawer-menu li {
        border-bottom: 1px solid #afaeae;
        margin: 0;
        padding: 0;
        text-align: left;
    }
    a.drawer-menu-item {
        color: #666;
        text-decoration:none;
    }

    /*--------------------------------------
     * ヘッダ
     *------------------------------------*/
    #header_navi {
        display: none;
    }

    /*--------------------------------------
     * メインコンテンツ
     *------------------------------------*/
    #main_area {
        min-height: 350px;
    }

    #main_cont {
        padding:10px 10px 20px 10px;
    }

    /*--------------------------------------
     * ステップバー
     *------------------------------------*/
    .stepBar {
        display: none;
    }

    .stepBar_smart {
        display: block;
        text-align: right;
    }

    /*--------------------------------------
     * スタッフ登録
     *------------------------------------*/
    .staff_kenshu_tbl {
        border-collapse: separate;
        border: 0;
    }
    .staff_kenshu_tbl thead {
        display: none;
    }
    .staff_kenshu_tbl td {
        border: none;
        display: block;
        width: 100%;
        border-bottom: 1px solid #cccccc;
        text-align:left;
    }
    .staff_kenshu_tbl td::before {
        content: attr(data-title) "";
    }
    .staff_kenshu_tbl td:nth-child(1) {
        text-align: left;
        background-color: #f0f0f0;
    }

    .staff_careea_tbl {
        border-collapse: separate;
        border: 0;
    }
    .staff_careea_tbl thead {
        display: none;
    }
    .staff_careea_tbl td {
        border: none;
        display: block;
        width: 100%;
        border-bottom: 1px solid #cccccc;
        text-align: left;
    }
    .staff_careea_tbl td:nth-child(1) {
        background-color: #f0f0f0;
        text-align: left;
    }
    .staff_careea_tbl td::before {
        content: attr(data-title) "";
    }
    .staff_careea_tbl td:nth-child(4)::before,
    .staff_careea_tbl td:nth-child(6)::before {
        display: inline-block;
        height: 20px;
        vertical-align: top;
    }

    .staff_careea_tbl td:nth-child(3) input[type="text"],
    .staff_careea_tbl td:nth-child(3) input[type="tel"],
    .staff_careea_tbl td select,
    .staff_careea_tbl td textarea {
        width: 70% !important; 
    }


    /*--------------------------------------
     * マイページメニュー
     *------------------------------------*/
    #mypage_menu {
        width: 100%;
    }
    #mypage_menu ul {
        width: 100%;
    }
    #mypage_menu ul li {
        width: 100%;
    }

    /*--------------------------------------
     * 業務報告
     *------------------------------------*/
    .ghokoku_rimg, .ghokoku_kimg, .ghokoku_simg {
        width: 100%;
    }

    .ghokoku_kotsu_tbl {
        border-collapse: separate;
        border: 0;
    }
    .ghokoku_kotsu_tbl thead {
        display: none;
    }
    .ghokoku_kotsu_tbl td {
        border: none;
        display: block;
        width: 100%;
        border-bottom: 1px solid #cccccc;
        text-align:right;
    }
    .ghokoku_kotsu_tbl td::before {
        content: attr(data-title) "";
    }
    .ghokoku_kotsu_tbl td:nth-child(1) {
        text-align: left;
        background-color: #f0f0f0;
    }
    .ghokoku_kotsu_tbl td:nth-child(7) {
        margin-bottom: 10px;
    }
    .ghokoku_kotsu_tbl tr:last-child th {
        display: none;
    }
}