@charset "Shift_JIS";

html {
  font-size: 14px;
}

/*@media (min-width: 768px) {*/
    @media (min-width: 768px) {
        html {
            font-size: 16px;
        }
    }

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/*body {
    height: 100%;
    width :100%;
    padding-bottom: 0;
}*/

.container {
    max-width: 85%;
    /*margin-left:100px;*/
}


/*「ファイルが選択されていません」を非表示*/
/*input[type="file"] {
    display: none;
}*/

/*追加*/
#header02 {
    background-image: url(../images/common/header_bg.jpg);
    background-repeat: repeat-x;
    background-position: 0px 50px;
    width: 100%;
    height: 112px;
    clear: both;
    position: fixed;
    margin-top: 0;
    z-index: 1;
}

ul li {
    /*list-style: none;*/
}

.flexbox div {
    background: skyblue;
    margin: 10px;
    width: 200px;
    height: 100px;
}

. /*form_conf {
    text-align: center;
}

    .form_conf form {
        display: inline-block;
        margin: 0 10px;
    }*/
/*タイトル*/
/*.Title {
    background-color ="red";
}*/

/*コピータイトル-*/
/*h2 {
    color: white;
    background-color: blue;
    font-size: 40px;
}*/



/*経理編集タイトル-*/
/*.KeiriColor {
    color: white;
    background-color: red ;*/
    /*font-size :40px;*/
/*}*/

/*コピータイトル-*/
.CopyColor1 {
    color: white;
    background-color: blue;
    /*font-size: 40px;*/
}

/*経理編集タイトル-*/
.KeiriColor1 {
    color: white;
    background-color: red;
    /*font-size: 40px;*/
}

/*↓名前がCopyColorだとうまくいかないので名前変えた*/
/*コピータイトル-*/
.KeiriColor2 {
    color: white;
    background-color: blue;
    /*font-size: 40px;*/
}

/*差戻編集タイトル-*/
.KeiriColor3 {
    color: white;
    background-color: greenyellow;
    /*font-size: 40px;*/
}


/*登録ボタン位置*/
.fixed_btn {
    position: fixed;
    bottom: 110px;
    right: 100px;
    padding: 6px 40px;
}


/*編集(経理)ボタン位置*/
.fixed_btn_Keiri {
    position: fixed;
    bottom: 110px;
    right: 100px;
    padding: 6px 20px;
}


/*戻る関係のボタンの位置*/
.fixed_btn2 {
    position: fixed;
    bottom: 210px;
    right: 100px;
    padding: 6px 20px;/*40pxを20px*/
}

/*カウントダウン画面の位置*/
.fixed_btn3 {
    position: fixed;
    top : 60px;
    right : 10px;/*-200何故かマイナスにしないと配置が中央になる・・・*/
    padding: 6px 40px;
}

.fixed_btn3-2 {
    position: fixed;
    top: 110px;
    right: 10px; /*-200何故かマイナスにしないと配置が中央になる・・・*/
    padding: 6px 40px;
}

/*ローディング画面の位置*/
/*中央*/
.fixed_btn4 {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/*メニューで使用　中央*/
.fixed_btn4-2 {
    position: fixed;
    top: 0;
    right : 0;
}

/*メニューで使用　ローディング中の画面全体の色変更テスト*/
.fixed_btn4-3 {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.5);
    top: 0;
    left: 0;
    z-index: 1000;
}

/*削除ボタン位置*/
.fixed_btn5 {
    position: fixed;
    bottom: 160px;
    right: 100px;
    padding: 6px 40px;
}

/*仮登録ボタン位置*/
.fixed_btn6 {
    position: fixed;
    bottom: 60px;
    right: 100px;
    padding: 6px 30px;
    /*width:113px;
    text-align:justify;
    text-shadow:inherit;*/
}

/*コピーボタン位置*/
.fixed_btn66 {
    position: fixed;
    bottom: 60px;
    right: 100px;
    padding: 6px 40px;
    /*width:113px;
    text-align:justify;
    text-shadow:inherit;*/
}

/*チェックボックス　コピーの位置*/
.fixed_btn7 {
    position: fixed;
    bottom: 110px;
    right: 200px;
    padding: 6px 30px;
}

/*チェックボックス　コピーの位置*/
.fixed_btn8 {
    position: fixed;
    bottom: 110px;
    right: 240px;
    padding: 6px 30px;
}

/*フッターのマニュアルボタンの位置*/
.fixed_btn10 {
    position: fixed;
    bottom: 5px;
    right: 20px;
    padding: 6px 20px;
    /*background-color :red;
    color:black;*/
}

.text9 {
    color: #333;
    text-shadow: 0 20px 10px rgba(0, 0, 0, .5);
}

.text11 {
    color: #fff;
    text-shadow: 4px 4px 0px #444, 6px 6px 0px rgba(255, 255, 255, .7);
}

.text12 {
    color: #fff;
    text-shadow: 1px 1px 0 rgba(85, 85, 85, 1), 2px 2px 0 rgba(85, 85, 85, .95), 3px 3px 0 rgba(85, 85, 85, .9), 4px 4px 0 rgba(85, 85, 85, .85), 5px 5px 0 rgba(85, 85, 85, .8), 6px 6px 0 rgba(85, 85, 85, .75), 7px 7px 0 rgba(85, 85, 85, .7), 8px 8px 0 rgba(85, 85, 85, .65), 9px 9px 0 rgba(85, 85, 85, .6), 10px 10px 0 rgba(85, 85, 85, .55), 11px 11px 0 rgba(85, 85, 85, .5), 12px 12px 0 rgba(85, 85, 85, .45), 13px 13px 0 rgba(85, 85, 85, .4), 14px 14px 0 rgba(85, 85, 85, .35), 15px 15px 0 rgba(85, 85, 85, .3), 16px 16px 0 rgba(85, 85, 85, .2), 17px 17px 0 rgba(85, 85, 85, .15), 18px 18px 0 rgba(85, 85, 85, .1);
}

.text13 {
    color: #333;
    text-shadow: 0 1px 0 #888, -1px 0 0 #ccc, -1px 2px 0 #888, -2px 1px 0 #ccc, -2px 3px 0 #888, -3px 2px 0 #ccc, -3px 4px 0 #888, -4px 3px 0 #ccc, -4px 5px 0 #888, -5px 4px 0 #ccc, -5px 6px 0 #888, -6px 5px 0 #ccc, -6px 7px 0 #888;
}

.text14 {
    color: #aaa;
    text-shadow: 0 5px 10px rgba(0, 0, 0, .6), 0 -2px 0 rgba(255, 255, 255, 1);
}

.text15 {
    color: #fff;
    text-shadow: 0 0 10px rgba(255, 255, 255, .7);
}

.text16 {
    color: #fff;
    text-shadow: 0 0 15px rgba(255, 255, 255, .5), 0 0 30px rgba(255, 255, 255, .5), 0 0 40px rgba(52, 152, 219, 1), 0 0 50px rgba(52, 152, 219, 1), 0 0 60px rgba(52, 152, 219, 1), 0 0 70px rgba(52, 152, 219, 1);
}

.text16-2 {
    color: #fff;
    animation: neon 2s ease-in-out infinite alternate;
}

text17 {
    color: black;
    text-shadow: 0 5px 10px rgba(0, 0, 0, .6), 0 -2px 0 rgba(255, 255, 255, 1);
}

@keyframes neon {
    from {
        text-shadow: 0 0 15px rgba(255, 255, 255, .5), 0 0 30px rgba(255, 255, 255, .5), 0 0 40px rgba(255,0,255, 1), 0 0 50px rgba(255,0,255, 1), 0 0 60px rgba(255,0,255, 1), 0 0 70px rgba(255,0,255, 1);
    }

    to {
        text-shadow: 0 0 7px rgba(255, 255, 255, .5), 0 0 15px rgba(255, 255, 255, .5), 0 0 20px rgba(255,0,255, 1), 0 0 25px rgba(255,0,255, 1), 0 0 30px rgba(255,0,255, 1), 0 0 35px rgba(255,0,255, 1);
    }
}

.box3 {
    width: 400px;
    height: 50px;
    background: limegreen;
    border-radius: 70px 0;
}

.box4 {
    width: 250px;
    height: 30x;
    background: limegreen;
    border-radius: 50px 0;
}

.required::after {
    content: "必須";
    background-color: #f0ad4e;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border-radius: 10px;
    display: inline-block;
}

.required2::after {
    content: "必須";
    /*background-color: #fff;*/
    color: #EF4F51;
    font-size: 10px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px red solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    display: inline-block;
}

.required3::after {
    content: "PDFファイルのみ添付可能";
    /*background-color: #fff;*/
    color: forestgreen;
    font-size: 10px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px forestgreen solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    display: inline-block;
}

.required4::after {
    content: "1,000文字以内で入力して下さい。";
    /*background-color: #fff;*/
    color: forestgreen;
    font-size: 10px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px forestgreen solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    display: inline-block;
}

.Syounin::after {
    content: "承認";
    /*background-color: #fff;*/
    color: red;
    font-size: 20px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px red solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    display: inline-block;
}

.Kakutei::after {
    content: "確定";
    /*background-color: #fff;*/
    color: white;
    font-size: 20px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px red solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    background-color:red;
    display: inline-block;
}

.Syounincyu::after {
    /*content: "閲中";*/
    content: "回覧中";
    /*background-color: #fff;*/
    color: orange;
    font-size: 15px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 5px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px orange solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    display: inline-block;
}


.Machi::after {
    content: "待ち";
    /*background-color: #fff;*/
    color: blue;
    font-size: 20px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 9px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px blue solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    display: inline-block;
}

.Hinin::after {
    /*content: "否認";*/
    content: "差戻";
    /*background-color: #fff;*/
    color: white;
    font-size: 20px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 7px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px black solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    background-color: black;
    display: inline-block;
}

.Shinseicyu::after {
    /*content: "閲中";*/
    content: "申請中";
    /*background-color: #fff;*/
    color: blue;
    font-size: 15px;
    font-weight: bold;
    min-width: 10px;
    padding: 3px 5px;
    margin: 0px 5px;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    border: 1px blue solid; /* 枠線を引く */
    /*border-color: #EF4F51;*/
    border-radius: 5px;
    border-width: 3px;
    display: inline-block;
}

/*追加カウンター用*/
. /*container {*/
/*text-align: center;*/
/*}*/
.announce {
    text-align: center;
    font-family: 'MS Gothic';
    font-size: 15px;
    font-weight: 300;
    color: #fff;
    /*color: skyblue ;*/
    width: 250px;
    /*background-color: #65A7D6;*/ /*#f94f7e;*/
    background-color: #65A7D6; /*#f94f7e;*/
    margin: 1rem auto 0;
    box-shadow: 0 4px 4px rgb(0 0 0 / 20%);
}

.timer {
    text-align: center;
    font-family: 'MS Gothic';
    font-size: 15px;
    font-weight: 300;
    color: #fff;
    margin: 1rem auto 0;
    width: 300px;
    background-color: #65A7D6;
    box-shadow: 0 4px 4px rgb(0 0 0 / 20%);
}

.timer2 {
    text-align: center;
    font-family: 'MS Gothic';
    font-size: 15px;
    font-weight: 300;
    color: #505050;
    margin: 0 auto;
    width: 300px;
    background-color: #f1f1f1;
    box-shadow: 0 4px 0px rgb(0 0 0 / 20%);
}

.date {
    font-size: 2em;
    color: #f94f7e;
}

.hour,
.min,
.sec {
    font-size: 1.7em;
    color: #ff6a00;
    margin-left: 0.5rem;
}

.load-circle {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 10px solid rgba(255, 255, 255, 0.5);
    border-top-color: rgba(255, 255, 255, 1);
    animation: rotate 1s linear infinite;
}

/* ロゴ専用：文字中央寄せ */
.logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    box-sizing: border-box;
}



/*↓********************************************************************************/
/*既存ボタン色テスト*/
/*btn-primary {
    background: var(--bs-primary);
    border: 2px solid var(--bs-primary);
}
    .btn-primary:hover, .btn-primary:focus,
    .btn-primary:active, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary:active.focus,
    .btn-primary.active, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.active.focus,
    .open > .dropdown-toggle.btn-primary,
    .open > .dropdown-toggle.btn-primary:hover,
    .open > .dropdown-toggle.btn-primary:focus,
    .open > .dropdown-toggle.btn-primary.focus,
    .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover,
    .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus,
    .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus
    {
        background:red;
        color :blue ;
       
        
    }

.btn-primary.outline {
    border: 6px solid;
    background: red;
    color: blue;
}*/

/*↑********************************************************************************/

/*.btn-primary {
    --bs-btn-font-weight: 600;
    --bs-btn-color: var(--bs-red);
    --bs-btn-bg: var(--bd-violet-bg);
    --bs-btn-border-color: var(--bd-violet-bg);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: #{shade-color($bd-violet, 10%)};
    --bs-btn-hover-border-color: #{shade-color($bd-violet, 10%)};
    --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
    --bs-btn-active-color: var(--bs-btn-hover-color);
    --bs-btn-active-bg: #{shade-color($bd-violet, 20%)};
    --bs-btn-active-border-color: #{shade-color($bd-violet, 20%)};
}*/

/*↓ボタンの色********************************************************************************/
/*ホバー時やクリック時はデフォルトのまま*/
/*ボタンカラーテスト2023/12/07 y.m*/

.btnx-indigo {
    background: var(--bs-indigo);
    border: 2px solid var(--bs-indigo);
}

.btnx-purpule {
    background: var(--bs-purple);
    border: 2px solid var(--bs-purple);
}

.btnx-pink {
    background: var(--bs-pink);
    border: 2px solid var(--bs-pink);
}

.btnx-orange {
    background: var(--bs-orange);
    border: 2px solid var(--bs-orange);
}

.btnx-teal {
    background: var(--bs-teal);
    border: 2px solid var(--bs-teal);
}

.btnx-cyan {
    background: var(--bs-cyan);
    border: 2px solid var(--bs-cyan);
}

.btnx-lime {
    background: #7CB342;
    border: 2px solid #7CB342;
}

.btnx-indigo-light {
    color: var(--bs-indigo);
    background: #9FA8DA;
    border: 2px solid #9FA8DA;
}

.btnx-purpule-light {
    color: var(--bs-purple);
    background: #CE93D8;
    border: 2px solid #CE93D8;
}

.btnx-pink-light {
    color: var(--bs-pink);
    background: #F48FB1;
    border: 2px solid #F48FB1;
}

.btnx-orange-light {
    color: var(--bs-orange);
    background: #FFCC80;
    border: 2px solid #FFCC80;
}

.btnx-teal-light {
    color: #004D40;
    background: #80CBC4;
    border: 2px solid #80CBC4;
}

.btnx-cyan-light {
    color: #006064;
    background: #80DEEA;
    border: 2px solid #80DEEA;
}

.btnx-lime-light {
    color: #827717;
    background: #C5E1A5;
    border: 2px solid #C5E1A5;
}
/*↑********************************************************************************/
/*↓ボタンの枠？*/
/*class="btn btn-light btnx--outline-indigo"とい感じにマウスオーバー時の色も変更可能？*/
.btnx--outline-indigo {
    color: var(--bs-indigo);
    background: var(--bs-white);
    border: 2px solid #9FA8DA;
}

.btnx-outline-purpule {
    color: var(--bs-purple);
    background: var(--bs-white);
    border: 2px solid #CE93D8;
}

.btnx-outline-pink {
    color: var(--bs-pink);
    background: var(--bs-white);
    border: 2px solid #F48FB1;
}

.btnx-outline-orange {
    color: var(--bs-orange);
    background: var(--bs-white);
    border: 2px solid #FFCC80;
}

.btnx-outline-teal {
    color: #004D40;
    background: var(--bs-white);
    border: 2px solid #80CBC4;
}

.btnx-outline-cyan {
    color: #006064;
    background: var(--bs-white);
    border: 2px solid #80DEEA;
}

.btnx-outline-lime {
    color: #827717;
    background: var(--bs-white);
    border: 2px solid #C5E1A5;
}

/*↑********************************************************************************/




@keyframes rotate {
    to {
        transform: rotate(360deg);
    }
}

/*/2023/08/17 y.m ホバーオーバーテーブルのホバーオーバーの色/*/
/*.table-hover thead tr:hover th, .table-hover tbody tr:hover td {*/
.table-hover tbody tr:hover td {
    background-color: #DDDDDD;
    /*color: #40e0d0;*/
}


/*↑の色
#99ccff(水色)
#D1D119（茶系）
#8FBC8F(濃いグリーン)
#40e0d0(明るいグリーン)
#FFFFFF(白)
#0033FF(ブルー)
#808080(濃いグレー)
#C0C0C0(シルバー)
#DDDDDD(薄いシルバー)

*/

/*下記は画面を暗くするテスト******************************/
#sample-popup-switch {
    /* チェックボックスを非表示 */
    display: none;
}

.sample-popup-background {
    /* 画面全体を暗くする透過背景 */
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.5);
    top: 0;
    left: 0;
    z-index: 1000;
}

.sample-popup-content {
    /* ポップアップ本体 */
    display: inline-block;
    position: fixed;
    width: 75%;
    z-index: 1100;
    background: #fff;
    padding: 2%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow-y: scroll;
}

.sample-popup-close {
    /* ポップアップ内の閉じるボタン */
    position: relative;
    display: inline-block;
    background: #09f;
    color: #fff;
    padding: 0 1em;
    border-radius: 3px;
    cursor: pointer;
    left: 50%;
    transform: translateX(-50%);
}

#sample-popup-switch:checked ~ .sample-popup-background, #sample-popup-switch:checked ~ .sample-popup-box {
    /* ポップアップ･透過背景を閉じる */
    display: none;
}


/*↑は画面を暗くするテスト******************************/

./*table-hover thead tr:hover th, .table-hover tbody tr:hover td {
    background-color: #D1D119;
}*/


 /*   .table-hover tbody tr:hover td {
        background: aqua;
    }*/


/*.cp_navi {
    background-color: #ffffff;
    border: 1px solid #dedede;
    border-radius: 4px;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
    color: #888888;
    display: block;
    margin: 1em 1%;
    overflow: hidden;
    width: 100%;
}

    .cp_navi ul {
        margin: 0;
        padding: 0;
    }

        .cp_navi ul li {
            display: inline-block;
            list-style-type: none;
            -webkit-transition: all 0.2s;
            transition: all 0.2s;
        }

    .cp_navi > ul > li > a > .caret {
        border-top: 4px solid #aaaaaa;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        content: '';
        display: inline-block;
        height: 0;
        width: 0;
        vertical-align: middle;
        -webkit-transition: color 0.1s linear;
        transition: color 0.1s linear;
    }

    .cp_navi > ul > li > a {
        color: #aaaaaa;
        display: block;
        line-height: 56px;
        padding: 0 10px;
        text-decoration: none;
    }

    .cp_navi > ul > li:hover {
        background-color: rgb(218, 60, 65);
    }

        .cp_navi > ul > li:hover > a {
            color: rgb( 255, 255, 255 );
        }

            .cp_navi > ul > li:hover > a > .caret {
                border-top-color: rgb( 255, 255, 255 );
            }

    .cp_navi > ul > li > div {
        background-color: rgb(218, 60, 65);
        border-top: 0;
        border-radius: 0 0 4px 4px;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
        display: none;
        margin: 0;
        opacity: 0;
        position: absolute;
        width: 165px;
        visibility: hidden;*/
        /*-webkit-transiton: opacity 0.2s;*/
        /*-webkit-transition: opacity 0.2s;
        transition: opacity 0.2s;
    }

    .cp_navi > ul > li:hover > div {
        display: block;
        opacity: 1;
        visibility: visible;
    }

    .cp_navi > ul > li > div ul > li {
        display: block;
    }

        .cp_navi > ul > li > div ul > li > a {
            color: #ffffff;
            display: block;
            padding: 12px 24px;
            text-decoration: none;
        }

        .cp_navi > ul > li > div ul > li:hover > a {
            background-color: rgba( 255, 255, 255, 0.1);
        }*/