@font-face {
    font-family: 'Noto Sans JP';
    src: url('../fonts/Noto_Sans_JP/NotoSansJP-Regular.woff') format("woff");
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Sans JP';
    src: url('../fonts/Noto_Sans_JP/NotoSansJP-Bold.woff') format("woff");
    font-weight: bold;
    font-display: swap;
}


/* ▼common▼　-------------------------------------------------- */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body,
div,
span,
p,
h1,
h2,
h3,
h4,
h5,
h6,
a,
img,
ul,
li,
form,
table,
tr,
th,
td,
header,
footer {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    font: inherit;
    font-family: "Noto Sans JP";
    color: #696969;
}

/* site title */
h1 {
    float: left;
    height: 30px;
    padding-left: 36px;
    font-size: 26px;
}

/* page title */
h2 {
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 600;
}

/* page sub title */
h3 {
    margin-bottom: 10px;
    font-size: 18px;
}

/* section title */
h4 {
    font-size: 16px;
    font-weight: bold;
}

/* section title */
h4.search {
    height: 34px;
    padding-top: 5px;
    padding-left: 40px;
    background: url(../img/search.png) no-repeat;
}

/* heading */
hr {
    margin: 0;
    padding: 0;
    border: 0;
    border-top: 1px solid #CCCCCC;
}

/* link */
a {
    outline: none;
    color: inherit;
}

a:hover {
    text-decoration: underline;
}

/* img */
img {
    border: none;
}

a img {
    border: none;
}

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

/* form */
input,
select,
textarea,
button {
    color: inherit;
    border: solid 1px #BBB;
    border-radius: 4px;
    box-shadow: none;
}

[disabled] {
    color: #000000;
    background-color: #BBBBBB;
}

[disabled] option {
    background-color: #BBBBBB;
}

/* button */
button[type="submit"],
input[type="button"],
input[type="submit"],
input[type="reset"],
.buttonLogout {
    display: inline-block;
    margin: 1px;
    border-style: none;
    border-radius: 5px;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
}

button[type="submit"]:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.buttonLogout:hover {
    text-decoration: none;
}

button[type="submit"].buttonBaseMin,
input[type="button"].buttonBaseMin,
input[type="submit"].buttonBaseMin,
input[type="reset"].buttonBaseMin {
    color: #FFFFFF;
    font-size: 12px;
    background-color: #337ab7;
}

button[type="submit"].buttonBaseMin:hover,
input[type="button"].buttonBaseMin:hover,
input[type="submit"].buttonBaseMin:hover,
input[type="reset"].buttonBaseMin:hover {
    background-color: #2b689c;
}

input[type="button"].buttonRedMin {
    color: #FFFFFF;
    font-size: 12px;
    background-color: #C1272D;
}

input[type="reset"].buttonRedMin:hover {
    background-color: #D74045;
}

button[type="submit"].buttonBase,
input[type="button"].buttonBase,
input[type="submit"].buttonBase,
input[type="reset"].buttonBase,
input[type="button"].buttonRed,
input[type="submit"].buttonRed,
input[type="reset"].buttonRed,
input[type="button"].buttonEasys,
input[type="submit"].buttonEasys,
input[type="reset"].buttonEasys {
    padding: 5px;
    color: #FFFFFF;
    font-size: 14px;
}

button[type="submit"].buttonBase,
input[type="button"].buttonBase,
input[type="submit"].buttonBase,
input[type="reset"].buttonBase {
    /* background-color: #337ab7; */
    background-color: #A3A3A3;
}

button[type="submit"].buttonBase:hover,
input[type="button"].buttonBase:hover,
input[type="submit"].buttonBase:hover,
input[type="reset"].buttonBase:hover {
    /* background-color: #2b689c; */
    background-color: #BFBFBF;
}

button[type="submit"].buttonBaseEasys,
input[type="button"].buttonBaseEasys,
input[type="submit"].buttonBaseEasys,
input[type="reset"].buttonBaseEasys {
    background-color: #A3A3A3;
    padding: 5px;
    color: #FFFFFF;
    font-size: 14px;
}

button[type="submit"].buttonBaseEasys:hover,
input[type="button"].buttonBaseEasys:hover,
input[type="submit"].buttonBaseEasys:hover,
input[type="reset"].buttonBaseEasys:hover {
    background-color: #BFBFBF;
    padding: 5px;
    color: #FFFFFF;
    font-size: 14px;
}

button[type="submit"].buttonBaseSelected,
input[type="button"].buttonBaseSelected,
input[type="submit"].buttonBaseSelected,
input[type="reset"].buttonBaseSelected {
    padding: 5px;
    color: #FFFFFF;
    font-size: 14px;
    background-color: #43B5DF;
}

input[type="button"].buttonRed,
input[type="submit"].buttonRed,
input[type="reset"].buttonRed {
    background-color: #C1272D;
}

input[type="button"].buttonRed:hover,
input[type="submit"].buttonRed:hover,
input[type="reset"].buttonRed:hover {
    background-color: #D74045;
}

input[type="button"].buttonEasys,
input[type="submit"].buttonEasys,
input[type="reset"].buttonEasys {
    background-color: #FA9996;
}

input[type="button"].buttonEasys:hover,
input[type="submit"].buttonEasys:hover,
input[type="reset"].buttonEasys:hover {
    background-color: #FACAC8;
}

input[type="button"].buttonSummerSkyM {
    width: auto;
    height: 31px;
    padding: 0 10px;
    background-color: #43B5DF;
    font-size: 14px;
    color: #FFFFFF;
}

input[type="button"].buttonSummerSkyM:hover {
    background-color: #6AC5E5;
}

/* disabledはhoverのあとに記述 */
button[type="submit"].buttonBase:disabled,
input[type="button"].buttonBase:disabled,
input[type="submit"].buttonBase:disabled,
input[type="reset"].buttonBase:disabled,
button[type="submit"].buttonSummerSkyM:disabled,
input[type="button"].buttonSummerSkyM:disabled,
input[type="submit"].buttonSummerSkyM:disabled,
input[type="reset"].buttonSummerSkyM:disabled,
input[type="button"].buttonRed:disabled,
input[type="submit"].buttonRed:disabled,
input[type="reset"].buttonRed:disabled,
input[type="button"].buttonEasys:disabled,
input[type="submit"].buttonEasys:disabled,
input[type="reset"].buttonEasys:disabled {
    color: #FFF;
    background-color: #d3d3d3;
}

button[type="submit"].buttonCsv,
input[type="button"].buttonCsv,
input[type="submit"].buttonCsv {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 14px;
    background: url(../img/csv_icon.png) no-repeat;
    background-position: 5px;
    background-color: #8FBC8B;
}

button[type="submit"].buttonCsv:hover,
input[type="button"].buttonCsv:hover,
input[type="submit"].buttonCsv:hover {
    background-color: #90EE90;
}

button[type="submit"].buttonCsv2,
input[type="button"].buttonCsv2,
input[type="submit"].buttonCsv2 {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 14px;
    background: url(../img/csv_icon.png) no-repeat;
    background-position: 5px;
    background-color: #e4007f;
}

button[type="submit"].buttonCsv2:hover,
input[type="button"].buttonCsv2:hover,
input[type="submit"].buttonCsv2:hover {
    background-color: #ef5b9c;
}

button[type="submit"].buttonCsv3,
input[type="button"].buttonCsv3,
input[type="submit"].buttonCsv3 {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 14px;
    background: url(../img/csv_icon2.png) no-repeat;
    background-position: 5px;
    background-color: #8FBC8B;
}

button[type="submit"].buttonCsv3:hover,
input[type="button"].buttonCsv3:hover,
input[type="submit"].buttonCsv3:hover {
    background-color: #90EE90;
}

button[type="submit"].buttonCsvMini,
input[type="button"].buttonCsvMini,
input[type="submit"].buttonCsvMini {
    padding: 5px 3px 5px 27px;
    color: #FFFFFF;
    font-size: 12px;
    background: url(../img/csv_icon_mini.png) no-repeat;
    background-position: 5px;
    background-color: #8FBC8B;
}

button[type="submit"].buttonCsvMini:hover,
input[type="button"].buttonCsvMini:hover,
input[type="submit"].buttonCsvMini:hover {
    background-color: #90EE90;
}

button[type="submit"].buttonPdf,
input[type="button"].buttonPdf,
input[type="submit"].buttonPdf {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 14px;
    background: url(../img/pdf_icon.png) no-repeat;
    background-position: 5px;
    background-color: #F01A20;
}

button[type="submit"].buttonPdf:hover,
input[type="button"].buttonPdf:hover,
input[type="submit"].buttonPdf:hover {
    background-color: #e3797d;
}

/* buttonRedL */
input[type="button"].buttonRedL {
    width: auto;
    height: 40px;
    padding: 0 20px;
    background-color: #C1272D;
    font-size: 18px;
    color: #FFFFFF;
}

input[type="button"].buttonRedL:hover {
    background-color: #D74045;
}

/* buttonSummerSkyL */
input[type="button"].buttonSummerSkyL {
    width: auto;
    height: 40px;
    padding: 0 20px;
    background-color: #43B5DF;
    font-size: 18px;
    color: #FFFFFF;
}

input[type="button"].buttonSummerSkyL:hover {
    background-color: #6AC5E5;
}

input[type="submit"].buttonSummerSkyL {
    width: auto;
    height: 40px;
    padding: 0 20px;
    background-color: #43B5DF;
    font-size: 18px;
    color: #FFFFFF;
}

input[type="submit"].buttonSummerSkyL:hover {
    background-color: #6AC5E5;
}

input[type="submit"].buttonSummerSkyS {
    width: auto;
    height: 25px;
    padding: 0 10px;
    background-color: #43B5DF;
    font-size: 12px;
    color: #FFFFFF;
}

input[type="submit"].buttonSummerSkyS:hover {
    background-color: #6AC5E5;
}

input[type="button"].buttonSummerSkyS {
    width: auto;
    height: 25px;
    padding: 0 10px;
    background-color: #43B5DF;
    font-size: 12px;
    color: #FFFFFF;
}

input[type="button"].buttonSummerSkyS:hover {
    background-color: #6AC5E5;
}

input[type="button"].buttonGray {
    width: auto;
    height: 25px;
    padding: 0 10px;
    background-color: #A3A3A3;
    font-size: 12px;
    color: #FFFFFF;
}

input[type="button"].buttonGray:hover {
    background-color: #BFBFBF;
}


.buttonLogout {
    padding: 3px 15px;
    background-color: #A3A3A3;
    color: #FFFFFF;
    font-size: 15px;
}

.buttonLogout:hover {
    background-color: #BFBFBF;
}

/* button */
input[type="button"].buttonL,
input[type="submit"].buttonL
{
    padding: 7px 10px !important;
    font-size: 18px !important;
}

.buttonExternal {
    width: 200px;
    height: 40px;
}

.buttonMachine {
    width: 220px;
    height: 110px;
}

.buttonMachineM {
    width: 220px;
    height: 60px;
}

.buttonStep {
    width: 250px;
    height: 110px;
}

.buttonArea {
    width: 200px;
    height: 50px;
}

.buttonAdmin {
    width: 250px;
}

/* 2020.07.20 Mizuno Button Search */
button[type="submit"].buttonSearch,
input[type="button"].buttonSearch,
input[type="submit"].buttonSearch,
input[type="reset"].buttonSearch {
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 18px;
    border-radius: 7px;
    width: 140px;
    height: 40px;
    background-color: #43B5DF;
    border: 2px solid #43B5DF;
}

button[type="submit"].buttonSearch:hover,
input[type="button"].buttonSearch:hover,
input[type="submit"].buttonSearch:hover,
input[type="reset"].buttonSearch:hover {
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 18px;
    border-radius: 7px;
    width: 140px;
    height: 40px;
    background-color: #7AC0DA;
    border: 2px solid #43B5DF;
}

/* 2020.07.20 Mizuno Button Reset */
button[type="submit"].buttonReset,
input[type="button"].buttonReset,
input[type="submit"].buttonReset,
input[type="reset"].buttonReset {
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #43B5DF;
    font-size: 18px;
    border-radius: 7px;
    width: 140px;
    height: 40px;
    background-color: #ffffff;
    border: 3px solid #43B5DF;
    padding: 10px;
}

button[type="submit"].buttonReset:hover,
input[type="button"].buttonReset:hover,
input[type="submit"].buttonReset:hover,
input[type="reset"].buttonReset:hover {
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #43B5DF;
    font-size: 18px;
    border-radius: 7px;
    width: 140px;
    height: 40px;
    background-color: #E0ECFF;
    border: 3px solid #43B5DF;
    padding: 10px;
}

/* 2023.05.15 Mizuno Button Back */
button[type="submit"].buttonBack,
input[type="button"].buttonBack,
input[type="submit"].buttonBack {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #6a6a6a;
    font-size: 14px;
    border-radius: 7px;
    height: 35px;
    background-color: #ffffff;
    border: 3px solid #6a6a6a;
    padding: 13px;
    margin-bottom: 10px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonBack:hover,
input[type="button"].buttonBack:hover,
input[type="submit"].buttonBack:hover {
    color: #6a6a6a;
    background-color: #d0d0d0;
    border: 3px solid #6a6a6a;
}

/* 2023.06.19 Mizuno Button Save */
button[type="submit"].buttonSave,
input[type="button"].buttonSave,
input[type="submit"].buttonSave {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    border-radius: 7px;
    height: 35px;
    background: #43B5DF;
    border: 3px solid #228bc8;
    padding-left: 10px;
    padding-right: 10px;
    padding: 10px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonSave:hover,
input[type="button"].buttonSave:hover,
input[type="submit"].buttonSave:hover {
    /* background: #228bc8; */
    background: #FFF;
    color: #43B5DF;
    border: 3px solid #228bc8;
}

button[type="submit"].buttonSave:disabled,
input[type="button"].buttonSave:disabled,
input[type="submit"].buttonSave:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 3px solid #dcdcdc;
}

button[type="submit"].buttonSave_s,
input[type="button"].buttonSave_s,
input[type="submit"].buttonSave_s {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 12px;
    border-radius: 5px;
    height: 25px;
    background: #43B5DF;
    border: 2px solid #228bc8;
    padding-left: 10px;
    padding-right: 10px;
    padding: 10px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonSave_s:hover,
input[type="button"].buttonSave_s:hover,
input[type="submit"].buttonSave_s:hover {
    /* background: #228bc8; */
    background: #FFF;
    color: #43B5DF;
    border: 2px solid #228bc8;
}

button[type="submit"].buttonSave_s:disabled,
input[type="button"].buttonSave_s:disabled,
input[type="submit"].buttonSave_s:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 2px solid #dcdcdc;
}

/* 2023.06.23 Mizuno Button Delete */
button[type="submit"].buttonDel,
input[type="button"].buttonDel,
input[type="submit"].buttonDel {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    border-radius: 7px;
    height: 35px;
    background: #B20000;
    border: 3px solid #880000;
    padding-left: 10px;
    padding-right: 10px;
    padding: 10px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonDel:hover,
input[type="button"].buttonDel:hover,
input[type="submit"].buttonDel:hover {
    background: #FFF;
    color: #B20000;
    border: 3px solid #880000;
}

button[type="submit"].buttonDel:disabled,
input[type="button"].buttonDel:disabled,
input[type="submit"].buttonDel:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 3px solid #dcdcdc;
}

/* 2023.06.30 Mizuno Button Delete s */
button[type="submit"].buttonDel_s,
input[type="button"].buttonDel_s,
input[type="submit"].buttonDel_s {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    border-radius: 5px;
    height: 30px;
    background: #B20000;
    border: 2px solid #880000;
    padding-left: 10px;
    padding-right: 10px;
    padding: 3px 7px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonDel_s:hover,
input[type="button"].buttonDel_s:hover,
input[type="submit"].buttonDel_s:hover {
    background: #FFF;
    color: #B20000;
    border: 2px solid #880000;
}

button[type="submit"].buttonDel_s:disabled,
input[type="button"].buttonDel_s:disabled,
input[type="submit"].buttonDel_s:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 2px solid #dcdcdc;
}

/* 2023.06.30 Mizuno Button Delete ss */
button[type="submit"].buttonDel_ss,
input[type="button"].buttonDel_ss,
input[type="submit"].buttonDel_ss {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 12px;
    border-radius: 5px;
    height: 20px;
    background: #B20000;
    border: 2px solid #880000;
    padding-left: 10px;
    padding-right: 10px;
    padding: 3px 7px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonDel_ss:hover,
input[type="button"].buttonDel_ss:hover,
input[type="submit"].buttonDel_ss:hover {
    background: #FFF;
    color: #B20000;
    border: 2px solid #880000;
}

button[type="submit"].buttonDel_ss:disabled,
input[type="button"].buttonDel_ss:disabled,
input[type="submit"].buttonDel_ss:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 2px solid #dcdcdc;
}

/* 2024.10.23 Mizuno No.4 ButtonCheck */
button[type="submit"].buttonCheck,
input[type="button"].buttonCheck,
input[type="submit"].buttonCheck {
    align-items: center;
    justify-content: center;
    line-height: 0;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    border-radius: 7px;
    height: 35px;
    background: #A3A3A3;
    border: 3px solid #6a6a6a;
    padding-left: 10px;
    padding-right: 10px;
    padding: 10px;
    transition-duration: 0.2s;
}

button[type="submit"].buttonCheck:hover,
input[type="button"].buttonCheck:hover,
input[type="submit"].buttonCheck:hover {
    /* background: #228bc8; */
    background: #FFF;
    color: #A3A3A3;
    border: 3px solid #6a6a6a;
}

button[type="submit"].buttonCheck:disabled,
input[type="button"].buttonCheck:disabled,
input[type="submit"].buttonCheck:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
    border: 3px solid #dcdcdc;
}

/* table */

table {
    width: auto;
    margin: 5px 0;
    border-collapse: collapse;
    background-color: #FFFFFF;
    font-size: 13px;
}

.loginBOX1 {
    width: fit-content;
    padding: 5px;
    background: #EEEEEE;
    border: 2px solid #DDDDDD;
    margin-bottom: 10px;
}

.searchBOX1 {
    width: min-content;
    /*margin-top:10px;*/
    padding: 5px;
    /*background:#FFF8FF; */
    /* 20210720 Mizuno 修正
	background:#FFF8FF;
  */
    border: 4px solid #EEE;
    margin-bottom: 10px;
}

.searchBOX2 {
    width: 300px;
    /*margin-top:10px;*/
    padding: 5px;
    /*background:#FFF8FF; */
    background: #FFF;
    border: 4px solid #EEE;
}

.searchBOX3 {
    display: table;
    /*margin-top:10px;*/
    padding: 5px;
    /*background:#FFF8FF; */
    /* 20210720 Mizuno 修正
	background:#FFF8FF;
  */
    border: 4px solid #EEE;
    margin-bottom: 10px;
}

.searchtable {
    width: auto;
    margin: 5px 0;
    border-collapse: collapse;
    border: 2px;
    border-collapse: separate;
    border-spacing: 1px;
    border-color: grey;
    /* 20210720 Mizuno 修正
	background:#FFF8FF;
  */
}

.searchtable2 {
    width: auto;
    margin: 5px 0;
    border-collapse: collapse;
    background-color: #FFFFFF;
    border: 2px;
    border-collapse: separate;
    border-spacing: 1px;
    border-color: grey;
}

.calendar_area {
    width: 100%;
    height: 100%;
}

.calendar_area_left {
    float: left;
    width: 49%;
    height: 100%;
}

.calendar_area_right {
    float: right;
    width: 49%;
    height: 100%;
}

.calendartable {
    width: 100%;
    /* height: 95%; */
    /* 2023.05.31 Mizuno 新デザイン用に高さ調整 */
    height: 80vh;
    border-collapse: collapse;
    border: 3px solid #CCCCCC;
}

.calendartable th,
.calendartable td {
    border: solid 1px #CCCCCC;
    text-align: center;
    vertical-align: top;
}

.calendartable th {
    font-weight: bold;
    font-size: 1.2em;
    height: 20px;
}

.calendar_table_detail {
    border: 0;
    padding: 0;
    width: 100%;
    margin: 0;
}

.calendar_table_detail th {
    text-align: left;
    border: 0;
    padding: 0;
}

.calendar_table_detail td {
    text-align: right;
    border: 0;
    padding: 0;
}

.calendar_arrow {
    text-decoration: none;
    display: inline-grid;
    text-decoration: none;
    background: #BBB;
    color: #FFF !important;
    width: 25px;
    height: 25px;
    line-height: 27px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    transition: .4s;
    font-weight: bold;
    font-size: 1em;
    margin: 0px;
}

.calendar_num {
    font-size: 1.2em;
    padding: 0;
}

.calendar_today {
    padding: 0px 3px 0px 5px;
    border-radius: 50%;
    background: #e6e6fa;
}

.calendar_text {
    font-size: 9px;
    width: 30px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0;
}

.calendar_mcn_number {
    font-size: 9px;
    padding: 0;
}

.calendar_baloon_p {
    position: relative;
}

.calendar_baloon_span {
    font-size: 12px;
    color: #FFFFFF;
}

.calendar_input {
    color: #000000;
}

.calendar_select {
    color: #000000;
    font-size: 9px;
}

.calendar_baloon {
    display: none;
    font-size: 9px;
    position: absolute;
    padding: 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background: #333;
    color: #fff;
}

.calendar_baloon_left {
    right: 100%;
}

.calendar_baloon_bottom {
    bottom: -17px;
}

/*.calendar_baloon:after {
  position: absolute;
  bottom: 100%;
  left: 10%;
  width: 0;
  height: 0;
  margin-left: -10px;
  background: #333;
  border: solid transparent;
  border-color: rgba(51, 51, 51, 0);
  border-bottom-color: #333;
  border-width: 10px;
  pointer-events: none;
  content: " ";
}*/

table th,
table td {
    padding: 3px 5px;
    vertical-align: middle;
    white-space: nowrap;
}

table.tableFrame {
    border: solid 3px #CCCCCC;
}

table.tableBase th {
    background-color: #888888;
    color: #FFFFFF;
}

table.tableBase th.invoice_bg {
    background-color: #ffa500;
}
table.tableBase th.invoice_cancel_bg {
    background-color: #f08080;
}

table.tableBase th a {
    color: #FFFFFF;
}

table.tableBase th,
table.tableBase td {
    border: solid 1px #CCCCCC;
}

table.tableBase td.td_select:hover {
    background-color: #9dd39d;
    cursor: pointer;
}

.td_select {
    border: solid 1px #CCCCCC;
}

table.tableBase th img,
table.tableBase td img {
    vertical-align: middle;
}

table.tablePadW th,
table.tablePadW td {
    padding: 10px;
}

/*ソート*/
table.tableSort th {
    position: relative;
}

.tableSortSpace {
    padding-right:30px; /* 文字とアイコンの間に余白を作る */
}

.sort-icons {
    position: absolute;
    right: 8px; /* アイコンを右詰めに配置 */
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px; /* アイコンを大きくする */
    display: flex;
    flex-direction: column;
    gap: 0; /* アイコン間のスペースを最小限にする */
}

.sort-icons a {
    text-decoration: none;
    color: #FFF !important; /* Default color */
    margin: 0; /* マージンをリセット */
    padding: 0; /* パディングをリセット */
    line-height: 1; /* 行の高さをリセット */
}

.sort-icons a:hover {
    color: black; /* Hover color */
}

.sort-icons .active a {
    color: #43B5DF !important; /* Active color */
}

.sort-icons span {
    display: block;
    margin: 0;
    padding: 0;
    line-height: 1;
}
/*ソート*/



table.searchtable th,
table.searchtable td {
    border: none;
}

table.searchtable th {
    background-color: #F1F1F1;
    color: #696969;
    /* font-weight: bold; */
}

table.searchtable th a {
    color: #FFFFFF;
}

table.tableVtaLeft th {
    text-align: left;
}

table.tableVtaRight th {
    text-align: right;
}

table.tableSummerSky th {
    background-color: #43B5DF;
    color: #FFFFFF;
}

table.tableDeepCerise th {
    background-color: #E73278;
    color: #FFFFFF;
}

table.tablePacificBlue th {
    background-color: #009AE1;
    color: #FFFFFF;
}

table.tableGreen th {
    background-color: #42bd41;
    color: #FFFFFF;
}

.tableBackBlue {
    background-color: #d8ecff;
}

table.tableNoBorder {
    border: none;
}

table.tableNoBorder td {
    border: none;
}

table.innerTable {
    border: none;
}

table.innerTable th {
    border: none;
    background-color: #FFFFFF;
    color: #4682b4;
}

table.innerTable td {
    min-width: 50px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px #CCCCCC;
}

/* 導入 */
tr.putMcn {
    background-color: #ff9393;
}

tr.putMcn td {
    color: #000000;
}



/* 予定 */
/*
tr.reserveMove { background-color: #ADD8E6; }
tr.reserveMove td { color: #000000; }
tr.reserveSale { background-color: #f08080; }
tr.reserveSale td { color: #000000; }
tr.reserveBack { background-color: #FFFFCC; }
tr.reserveBack td { color: #000000; }
tr.reserveTrd { background-color: #77c; }
tr.reserveTrd td { color: #000000; }
tr.reserveDis { background-color: #A3A3A3; }
tr.reserveDis td { color: #000000; }
tr.outDatePlan { background-color: #dda0dd; }
tr.outDatePlan td { color: #000000; }
tr.memoWar {}
tr.memoWar td { color: #ff0000; }
*/
tr.reserveMove {
    background-color: #cee7ef;
}

tr.reserveMove td {
    color: #000000;
}

tr.reserveSale {
    background-color: #ffdada;
}

tr.reserveSale td {
    color: #000000;
}

tr.reserveBack {
    background-color: #f1f1d3;
}

tr.reserveBack td {
    color: #000000;
}

tr.reserveTrd {
    background-color: #b4b4ce;
}

tr.reserveTrd td {
    color: #000000;
}

tr.reserveDis {
    background-color: #bfbfbf;
}

tr.reserveDis td {
    color: #000000;
}

tr.alertCert {
    background-color: #ffff00;
}

tr.alertCert td {
    color: #000000;
}

td.reserveMove {
    background-color: #cee7ef;
}

td.reserveSale {
    background-color: #ffdada;
}

td.reserveBack {
    background-color: #f1f1d3;
}

td.reserveTrd {
    background-color: #b4b4ce;
}

td.reserveDis {
    background-color: #bfbfbf;
}

tr.outDatePlan {
    background-color: #dda0dd;
}

tr.outDatePlan td {
    color: #000000;
}

tr.memoWar {}

tr.memoWar td {
    color: #ff0000;
}

/* Kplus導入 */
tr.kplusAddMcn {
    background-color: #FFFFFF;
}

/* 選択 */
tr.selectProc {
    background-color: #DCDCDC;
}

tr.selectProc td {
    color: #000000;
}

tr.selectProcMachinesSearch {
    background-color: #DCDCDC;
}

/* 検定日、公示日、検定番号　未登録 */
tr.noInsDates {
    background-color: #f08080;
}

tr.noInsDates td {
    color: #000000;
}

/* 枠利用 */
td.etcType2 {
    background-color: #FFD700;
}

/* 移転枠利用 */
td.moveType2 {
    background-color: #ADD8E6;
}

/* 検定日公示日店舗登録 */
td.insAddHall {
    background-color: #77d6c1;
}

/* エラー色 */
td.biz_error {
    background-color: #ffb6c1;
}

/* writing-mode */
.wmVertical {
    height: 90px;
    writing-mode: vertical-rl;
}

/* white-space */
.wsNormal {
    white-space: normal;
}

.wsNowrap {
    white-space: nowrap;
}

/* visible */
.visVisible {
    visibility: visible;
}

.visHidden {
    visibility: hidden;
}

/* table */

.td27 td{
    height: 27px;
}

.th35 th{
    height: 35px;
}

.th40 th{
    height: 40px;
}

/* position */
.clear {
    clear: both;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.mt5 {
    margin-top: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.ml10 {
    margin-left: 10px;
}

.ml300 {
    margin-left: 300px;
}

.mr5 {
    margin-right: 5px;
}

.mr30 {
    margin-right: 30px;
}

.pl10 {
    padding-left: 10px;
}

.pr30 {
    padding-right: 30px;
}

.vaTop {
    vertical-align: top;
}

.vaMiddle {
    vertical-align: middle;
}

.vaBottom {
    vertical-align: bottom;
}

.aCenter {
    margin-left: auto;
    margin-right: auto;
}

/* background */
.bgRed {
    background-color: #FF0000;
}

.bgBlack {
    background-color: #000000;
}

/* border */
.borderFrame {
    border: solid 3px #CCCCCC;
}

.borderLSolid {
    border-left: solid 1px #CCCCCC;
}

.borderBSolid {
    border-bottom: solid 1px #CCCCCC;
}

.borderBDashed {
    border-bottom: dashed 1px #CCCCCC;
}

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

.taLeft {
    text-align: left;
}

.taRight {
    text-align: right;
}

.tdUnderline {
    text-decoration: underline;
}

/* font */
.fcRed {
    color: #C1272D;
}

.fcGreen {
    color: #2FBF28;
}

.fcBlue {
    color: #282FBF;
}

.fcYellow {
    color: #ffa500;
}

.fcBlack {
    color: #000000;
}

.fcGray {
    color: #808080;
}

.fcSummerSky {
    color: #43B5DF;
}

.fcSaphir {
    color: #006AB9;
}

.fcWhite {
    color: #FFFFFF;
}

.fcMemoWar {
    color: #ff99ff;
}

.fcOutDatePlan {
    color: #00bfff;
}

/* bussines font */
.fcBzReserveMove {
    color: #0000FF;
}

.fs10px {
    font-size: 10px;
}

.fs11px {
    font-size: 11px;
}

.fs12px {
    font-size: 12px;
}

.fs13px {
    font-size: 13px;
}

.fs14px {
    font-size: 14px;
}

.fs15px {
    font-size: 15px;
}

.fs16px {
    font-size: 16px;
}

.fs18px {
    font-size: 18px;
}

.fs20px {
    font-size: 20px;
}

.fs25px {
    font-size: 25px;
}

.fwBold {
    font-weight: bold;
}

/* ime */
.imeZenkaku {
    ime-mode: active;
}

.imeHankaku {
    ime-mode: inactive;
}

.imeDisabled {
    ime-mode: disabled;
}

.ofScroll {
    overflow: scroll;
}


/* header */
#header {
    width: 100%;
    max-width: 100vw;
    height: 70px;
    padding: 10px;
    box-sizing: border-box;
    /* background: #f1f1f1; 2025.06.18 Mizuno No.54 色変更 */
    background: #FFF;
    display: flex;
    justify-content: space-between;
}

#headerSide {
    margin-top: 7px;
    margin-right: 47px;
    margin-left: auto;
    /* これを追加 */
    height: 45px;
    display: flex;
    align-items: center;
    /* 中央寄せ */
}

#headerSide p {
    display: inline-block;
    vertical-align: middle;
}

/* breadcrumbs */
#breadcrumbs {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 0 30px;
}

/* 2023.05.01 Mizuno allWrapper */
#allWrapper {
    position: relative;
    min-height: calc(100% - 70px);
    height: auto !important;
    height: 100%;
    min-width: 100%;
    background: #FFF;
    margin-bottom: 0px;
    display: inline-table;
}

/* contents */
#contents {
    width: 100%;
    /* min-width: 1360px; */
    height: auto;
    margin: 0;
    padding: 20px 30px 150px 30px;
    /*overflow: auto;*/
    /* 2023.05.01 Mizuno 調整 */
    background: #FFF;
    /* 2025.06.18 Mizuno No.54 色調整 */
    /* border: 1px solid #e0e0e0; */
    /* border-top: 1px solid #e0e0e0; 2025.06.26 */
    /* box-shadow: 0 4px 8px -2px rgba(0, 0, 0, 0.06); */
    /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); */
    /*    background-color: #ECF4D9;	 後で消す */
}

#contents_calendar {
    width: 100%;
    height: 90%;
    margin: 0;
    padding: 10px;
}

/* footer */
#footer {
    position: absolute;
    bottom: 0;
    width: 98%;
    height: 110px;
    margin: 0;
    padding: 0;
    text-align: center;
    border-top: 2px;
}

#footer .footer_email {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
}

#footer .label {
    margin: 0;
    padding: 0;
    font-size: 12px;
    position: absolute;
    top: 3px;
    left: 873px;
}

#footer .label a {
    color: #808080;
}

/* ▲common▲　-------------------------------------------------- */



/* ▼admin▼ ---------------------------------------------------- */
/* menu */
#menu {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #43B5DF;
    font-size: 13px;
}

/* table */
tr.evenEdit {
    background-color: #CCFFFF;
}

tr.evenNew {
    background-color: #FFFFCC;
}

/* makerList */
.makerList {
    padding: 10px;
}

ul.makerList {
    list-style-type: disc;
}

ul.makerList li {
    margin-left: 10px;
    line-height: 1.5em;
}

/* ▲admin▲ ---------------------------------------------------- */



/* ▼office/hall▼ ---------------------------------------------- */
/* header */
.headerBG {}

/* footer */
.footerBG {}

/* menuTop */
#menuTopO,
#menuTopH {
    width: 100%;
    margin: 0;
    padding: 0;
    margin-bottom: 0px;
}

#menuTopO ul {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
    /* background-color: #F1F1F1; 2025.06.18 Mizuno No.54 色修正 */
    background: #FFF;
    margin-bottom: 0px;
    border-bottom: solid 3px #666666;
    padding-left: 20px;
}
#menuTopH ul {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
    /* background-color: #F1F1F1; 2025.06.18 Mizuno No.54 色修正 */
    background: #FFF;
    margin-bottom: 0px;
    border-bottom: solid 3px #43B5DF;
    padding-left: 20px;
}

/*
#menuTopO ul {
	background-color: #666666;
  border-top: 2px solid #666666;
	border-bottom: 2px solid #666666;
}

#menuTopH ul {
	background-color: #F2F2F2;
}

#menuTopO ul li, #menuTopH ul li {
	display: inline-block;
	position: relative;
	margin-left: -1px;
    font-size: 15px;
	line-height: 2.5em;
}
*/

#menuTopO ul li,
#menuTopH ul li {
    display: inline-block;
    position: relative;
    margin-left: 0px;
    font-size: 16px;
    line-height: 2.5em;
    /* border: 2px solid #fff; */
    /* margin-right: 5px; */
    margin-left: 5px;
    /* border-radius: 10px 15px 0 0; */
    /* width: 156px; */
    min-width: 100px;
    text-align: center;
}

#menuTopO ul li a,
#menuTopH ul li a {
    display: block;
    padding: 3px 20px 0px 20px;
    text-decoration: none;
    border-radius: 10px 10px 0 0;
}

#menuTopO ul li a {
    background-color: #D3D3D3;
    color: #FFFFFF;
    font-weight: bold;
    /* box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06); */
    /* border: 1px solid #e0e0e0; */
    border-bottom: none;
}

#menuTopH ul li a {
    /* background-color: #43B5DF; */
    background-color: #D3D3D3;
    color: #fff;
    font-weight: bold;
    /* box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06); */
    /* border: 1px solid #e0e0e0; */
    border-bottom: none;
}

#menuTopO ul li a:hover {
    background-color: #666666;
}

#menuTopH ul li a:hover {
    background-color: #43B5DF;
}

#menuTopH ul li:first-child a {
    /*
	background-color: #BBDDFF;
	color: #FFFFFF;
	*/
}

/*
#menuTopH ul li:first-child a:hover { background-color: #6AC5E5; }
*/

/* menuSide */
#menuSide {
    float: left;
    width: 18%;
    margin: 0;
    padding: 0;
}

#menuSide ul {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
}

#menuSide ul li {
    display: block;
    position: relative;
    margin-top: -1px;
    background-color: #43B5DF;
    border: solid 1px #FFFFFF;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 3em;
}

#menuSide ul li a {
    display: block;
    padding-left: 40px;
    text-decoration: none;
}

#menuSide ul li a:hover {
    background-color: #6AC5E5;
}

/* main */
#main {
    float: left;
    width: 78%;
    height: 100%;
    padding-left: 30px;
    padding-bottom: 30px;
    overflow: auto;
    /*    background-color: #FFFCDB;	 後で消す */
}

#leftBox {
    float: left;
    width: 75%;
    /*    background-color: #FADCE9;	 後で消す */
}

#RightBox {
    float: right;
    width: 25%;
    padding-left: 30px;
    /*    background-color: #FEECD2;	 後で消す */
}

.AdobeBox p {
    display: table-cell;
    vertical-align: middle;
}

.innerBox p {
    display: inline-block;
    vertical-align: middle;
    line-height: 1em;
}

/*
.section {
	width: auto;
    height: auto;
	margin: 0 auto;
}
*/

/* breadcrumb */
.breadcrumb {
    margin-bottom: 10px;
    list-style: none;
    overflow: hidden;
}

.breadcrumb li {
    float: left;
}

.breadcrumb li a {
    display: block;
    position: relative;
    float: left;
    padding: 10px 40px;
    background-color: #F2F2F2;
    border: 1px solid #CCCCCC;
    color: #B3B3B3;
    font-size: 18px;
    text-decoration: none;
    width: 230px;
}

.breadcrumb li a:after {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 1;
    top: -1px;
    left: 210px;
    bottom: 0;
    margin: auto;
    width: 34px;
    height: 34px;
    background-color: #F2F2F2;
    border-top: 2px solid #CCCCCC;
    border-right: 2px solid #CCCCCC;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.breadcrumb li:last-child a:after {
    width: 0;
    height: 0;
    background-color: transparent;
    border: 0;
}

.breadcrumb li a:hover {
    background-color: #F5F5F5;
}

.breadcrumb li a:hover:after {
    background-color: #F5F5F5;
}

.breadcrumb li.current a {
    background-color: #43B5DF;
    color: #FFFFFF;
}

.breadcrumb li.current a:after {
    background-color: #43B5DF;
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}

.breadcrumb li.current:last-child a:after {
    width: 0;
    height: 0;
    background-color: transparent;
    border: 0;
}

.breadcrumb li.current a:hover {
    background-color: #6AC5E5;
}

.breadcrumb li.current a:hover:after {
    background-color: #6AC5E5;
}


.breadcrumb li.done a {
    background-color: #bdf;
    color: #FFFFFF;
}

.breadcrumb li.done a:after {
    background-color: #bdf;
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}

.breadcrumb li.done:last-child a:after {
    width: 0;
    height: 0;
    background-color: transparent;
    border: 0;
}

.breadcrumb li.done a:hover {
    background-color: #6AC5E5;
}

.breadcrumb li.done a:hover:after {
    background-color: #6AC5E5;
}

/* mapNo */
.mapNo {
    list-style: none;
    overflow: hidden;
    margin-top: 10px;
}

.mapNo li {
    float: left;
}

.mapNo li a {
    display: inline-block;
    float: left;
    padding: 6px 15px;
    background-color: #FFFFFF;
    border: 1px solid #F1F1F1;
    color: #848586;
    font-size: 12px;
    text-decoration: none;
}

.mapNo li a:hover {
    background: #e0e0e0;
    color: #848586;
}

.mapNo li.current a {
    background-color: #43B5DF;
    color: #FFF;
}

.mapNo li.current a:hover {
    background-color: #43B5DF;
}

/* buttonSetting */
.buttonSetting {
    display: inline-block;
    position: relative;
    padding: 0;
    width: 200px;
    height: 40px;
    background-color: #43B5DF;
    border-radius: 5px;
    text-decoration: none;
}

.buttonSetting:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    left: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 24px;
    height: 23px;
    background: url(../img/setting.png) no-repeat;
}

.buttonSetting:hover {
    background-color: #6AC5E5;
}

input[type="button"].buttonSetting {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-left: 20px;
    width: 200px;
    height: 40px;
    background-color: transparent;
    color: #FFFFFF;
    font-size: 18px;
}

/* buttonParts */
.buttonParts {
    display: inline-block;
    position: relative;
    padding: 0;
    width: 140px;
    height: 40px;
    background-color: #43B5DF;
    border-radius: 5px;
    text-decoration: none;
}

.buttonParts:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    left: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 24px;
    height: 23px;
    background: url(../img/parts_b.png) no-repeat;
}

.buttonParts:hover {
    background-color: #6AC5E5;
}

input[type="button"].buttonParts {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-left: 20px;
    width: 140px;
    height: 40px;
    background-color: transparent;
    color: #FFFFFF;
    font-size: 18px;
}

/* buttonArrow */
.buttonArrow,
.buttonArrowL {
    display: inline-block;
    position: relative;
    padding: 0;
    background-color: #43B5DF;
    border-radius: 5px 0 0 5px;
    text-decoration: none;
}

.buttonArrow {
    width: 120px;
    height: 40px;
}

.buttonArrowL {
    width: 230px;
    height: 50px;
}

.buttonArrow:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 95px;
    bottom: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-top: solid 10px transparent;
    border-bottom: solid 10px transparent;
    border-left: solid 10px #FFFFFF;
}

.buttonArrow:after,
.buttonArrowL:after {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    margin: auto;
    background-color: #43B5DF;
    border-radius: 2px 5px 2px 5px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.buttonArrow:after {
    left: 106px;
    width: 29px;
    height: 29px;
}

.buttonArrowL:after {
    left: 213px;
    width: 36px;
    height: 36px;
}

.buttonArrow:hover,
.buttonArrowL:hover {
    background-color: #6AC5E5;
}

.buttonArrow:hover:after,
.buttonArrowL:hover:after {
    background-color: #6AC5E5;
}

input[type="button"].buttonArrow,
input[type="button"].buttonArrowL,
input[type="submit"].buttonArrow,
input[type="submit"].buttonArrowL {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-right: 20px;
    background-color: transparent;
    color: #FFFFFF;
}

input[type="button"].buttonArrow,
input[type="submit"].buttonArrow {
    width: 120px;
    height: 40px;
    font-size: 18px;
}

input[type="button"].buttonArrowL,
input[type="submit"].buttonArrowL {
    width: 256px;
    height: 50px;
    font-size: 20px;
}

/* buttonCancel */
.buttonCancel {
    display: inline-block;
    position: relative;
    padding: 0;
    width: 140px;
    height: 30px;
    background-color: #C1272D;
    border-style: none;
    border-radius: 5px;
    text-decoration: none;
}

.buttonCancel:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    left: 12px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 18px;
    height: 2px;
    background-color: #FFFFFF;
    transform: rotate(45deg);
}

.buttonCancel:after {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 1;
    left: 20px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 2px;
    height: 18px;
    background-color: #FFFFFF;
    transform: rotate(45deg);
}

.buttonCancel:hover {
    background-color: #D74045;
}

input[type="button"].buttonCancel {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-left: 20px;
    width: 140px;
    height: 30px;
    background-color: transparent;
    color: #FFFFFF;
    font-size: 16px;
}

/* Arrow */
.arrowLeft,
.arrowRight,
.arrowUp,
.arrowDown {
    display: inline-block;
    position: relative;
    padding: 0 0 0 16px;
    vertical-align: middle;
    text-decoration: none;
    color: #808080;
    font-size: 15px;
}

.arrowLeft::before,
.arrowLeft::after,
.arrowRight::before,
.arrowRight::after,
.arrowUp::before,
.arrowUp::after,
.arrowDown::before,
.arrowDown::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

.arrowLeft::before,
.arrowRight::before,
.arrowUp::before,
.arrowDown::before {
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    border: 1px solid #6AC5E5;
}

.arrowLeft::after,
.arrowRight::after,
.arrowUp::after,
.arrowDown::after {
    box-sizing: border-box;
    width: 6px;
    height: 6px;
    border: 6px solid transparent;
}

.arrowLeft::after {
    right: 10px;
    border-right: 6px solid #6AC5E5;
}

.arrowRight::after {
    left: 7px;
    border-left: 6px solid #6AC5E5;
}

.arrowUp::after {
    left: 3px;
    bottom: 7px;
    border-bottom: 6px solid #6AC5E5;
}

.arrowDown::after {
    left: 3px;
    top: 7px;
    border-top: 6px solid #6AC5E5;
}

/* help */
.help {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 1px solid #43B5DF;
    text-align: center;
    color: #43B5DF;
    font-size: 12px;
}

.help:hover {
    background-color: #EDF8FC;
}

/* ▲office/hall▲ ---------------------------------------------- */



/* ▼office▼ --------------------------------------------------- */
/* ▲office▲ --------------------------------------------------- */



/* ▼hall▼ ----------------------------------------------------- */
/* addpartsSelect */
/* buttonArrow */
.buttonAddpartsSelect {
    display: inline-block;
    position: relative;
    padding: 0;
    background-color: #43B5DF;
    border-radius: 5px;
    text-decoration: none;
}

.buttonAddpartsSelect {
    width: 300px;
    height: 40px;
}

.buttonAddpartsSelect:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 50px;
    bottom: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-top: solid 10px transparent;
    border-bottom: solid 10px transparent;
    border-left: solid 10px #FFFFFF;
}

.buttonAddpartsSelect:hover {
    background-color: #6AC5E5;
}

input[type="button"].buttonAddpartsSelect {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-left: 20px;
    background-color: transparent;
    color: #FFFFFF;
}

input[type="button"].buttonAddpartsSelect {
    width: 300px;
    height: 40px;
    font-size: 18px;
}

#addpartsSelect {
    position: absolute;
    top: 230px;
    right: 30px;
    padding: 10px;
    background-color: #FFFFFF;
    border: solid 3px #CCCCCC;
}

/* button */
.buttonOption {
    width: 300px;
    height: 60px;
}

.simuAddButton {
    width: 220px;
    height: 60px;
    background-color: #A3A3A3;
    margin: 60px 30px;
}

.simuAddButton:hover {
    background-color: #c2c2c2;
}

.simuAddButton span {
    color: #FFF;
    font-size: 16px;
    font-weight: bold;
}

/* simazu backgroundColor */
.simaBgWhite {
    background-color: #FFFFFF;
    color: #FFFFFF;
}

.simaBgNeonPink {
    background-color: #FF66CC;
    color: #FF66CC;
}

.simaBgHotMagenta {
    background-color: #FF00CC;
    color: #FF00CC;
}

.simaBgYellow {
    background-color: #FFFF00;
    color: #FFFF00;
}

.simaBgLaRioja {
    background-color: #CCCC00;
    color: #CCCC00;
}

.simaBgBrightGreen {
    background-color: #66FF00;
    color: #66FF00;
}

.simaBgRobinEggBlue {
    background-color: #00CCCC;
    color: #00CCCC;
}

.simaBgAqua {
    background-color: #00FFFF;
    color: #00FFFF;
}

.simaBgRed {
    background-color: #FF0000;
    color: #FF0000;
}

.simaBgBlue {
    background-color: #0000FF;
    color: #0000FF;
}

.simaBgPersianRed {
    background-color: #CC3333;
    color: #CC3333;
}

/* simazu textColor */
.simaTxtBlack {
    background-color: #000000;
    color: #000000;
}

.simaTxtRed {
    background-color: #FF0000;
    color: #FF0000;
}

.simaTxtPurple {
    background-color: #660066;
    color: #660066;
}

.simaTxtOrange {
    background-color: #FF6600;
    color: #FF6600;
}

.simaTxtCitrus {
    background-color: #999900;
    color: #999900;
}

.simaTxtLaPalma {
    background-color: #339900;
    color: #339900;
}

.simaTxtPersianGreen {
    background-color: #009999;
    color: #009999;
}

.simaTxtBlue {
    background-color: #0000FF;
    color: #0000FF;
}

.simaTxtPersianRed {
    background-color: #CC3333;
    color: #CC3333;
}

.simaTxtNeonPink {
    background-color: #FF66CC;
    color: #FF66CC;
}

.simaTxtYellow {
    background-color: #FFFF00;
    color: #FFFF00;
}

.simaTxtBrightGreen {
    background-color: #66FF00;
    color: #66FF00;
}

/*
.mapGrid {
    min-width: 600px;
    min-height: 300px;
	border: solid 1px #696969;
    background-color: #E0FFFF;

    background-image: linear-gradient(transparent 98%, #696969 2%)
                    , linear-gradient(90deg, transparent 98%, #696969 2%);
    background-size: 30px 30px;
    background-repeat: repeat;
}
*/

.mapGrid {
    min-width: 600px;
    min-height: 300px;
    border: solid 2px #DDDDDD;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -o-text-overflow: clip;
    text-overflow: clip;
    background: -webkit-linear-gradient(90deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(0deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(90deg, #DDDDDD 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(0deg, #DDDDDD 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;
    background: -moz-linear-gradient(0deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(90deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(0deg, #DDDDDD 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(90deg, #DDDDDD 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;

    background: linear-gradient(0deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), linear-gradient(90deg, #DDDDDD 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%),
        linear-gradient(0deg, #DDDDDD 0, #FFFFFF 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), linear-gradient(90deg, #DDDDDD 0, #FFFFFF 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;
    background-position: 0px 0px, -2px -2px, 1px 1px, -1px -1px;
    background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
    background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
}

.mapGridUser {
    min-width: 600px;
    min-height: 300px;
    border: solid 2px #DDDDDD;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -o-text-overflow: clip;
    text-overflow: clip;
    background: -webkit-linear-gradient(90deg, #E0FFFF 0, #E0FFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(0deg, #E0FFFF 0, #E0FFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(90deg, #E0FFFF 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), -webkit-linear-gradient(0deg, #E0FFFF 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;
    background: -moz-linear-gradient(0deg, #E0FFFF 0, #FFFFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(90deg, #E0FFFF 0, #E0FFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(0deg, #E0FFFF 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), -moz-linear-gradient(90deg, #E0FFFF 0, rgba(255, 255, 255, 0.298039) 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;

    background: linear-gradient(0deg, #E0FFFF 0, #E0FFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%), linear-gradient(90deg, #E0FFFF 0, #E0FFFF 2px, rgba(0, 0, 0, 0) 2px, rgba(0, 0, 0, 0) 100%),
        linear-gradient(0deg, #E0FFFF 0, #E0FFFF 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), linear-gradient(90deg, #E0FFFF 0, #E0FFFF 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%), #E0FFFF;
    background-position: 0px 0px, -2px -2px, 1px 1px, -1px -1px;
    background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
    background-size: 150px 150px, 150px 150px, 30px 30px, 30px 30px;
}

/* MAP吹き出し */
#balloon {
    font-size: 12px;
    padding: 5px;
    background-color: #FFFFFF;
    border: solid 3px #DDDDDD;
    z-index: 99;
}

#balloon_lite {
    position: absolute;
    font-size: 12px;
    min-width: 200px;
    min-height: 50px;
    padding: 3px;
    background-color: #FFFFFF;
    border: solid 3px #DDDDDD;
    z-index: 99;
}

#balloon_lite td {
    padding: 0px 5px;
}

/* Map BOX */
#cnt-box {
    width: 100%;
    height: 100%;
    padding: 0.5em;
    overflow: auto;
}

#cnt-boxFrame {
    width: 600px;
    height: 400px;
    padding: 10px;
    background-color: #DDD;
    position: fixed;
    top: 250px;
    left: 400px;
    overflow: hidden;
    min-height: 70px;
    min-width: 80px;
    max-width: 850px;
    z-index: 99;
}

/* Mizuno Simu 追加 */

.mapSbsButton {
    min-height: 76px;
}

.mapSbsButton table {
    margin: 0;
}

.mapSbsButton ul{
    display: flex;
    justify-content: space-evenly;
}

.buttonSbs,
.buttonSbs a {
    min-width: 60px;
    height: 40px;
    line-height: 30px;
    text-decoration: none;
    background: #FFF; /* デフォルトのグレーカラー */
    text-align: center;
    color: #848586;
    font-size: 12px;
    font-weight: bold;
    border-radius: 0px;
    margin-left: -1px;
}

.buttonSbs:hover,
.buttonSbs a:hover {
    background: #e0e0e0;
    color: #848586;
    box-shadow: none; 
}

.buttonSbs.active,
.buttonSbs a.active {
    background: #43B5DF;
    color: #FFFFFF;
    box-shadow: none;
}

/* #cnt-boxFrame2 {
    width: 1100px;
    height: 610px;
    background-color: #E8A3B5;
    background-color: #FFF;
    border: solid 5px #E8A3B5;
    position: fixed;
    top: 250px;
    left: 600px;
    overflow: hidden;
    min-height: 70px;
    min-width: 80px;
    z-index: 99;
} */
#cnt-boxFrame2 {
    width: 1200px;
    height: 640px;
    background-color: #F0F0F0;
    border: solid 3px #BBB;
    position: fixed;
    top: 250px;
    left: 600px;
    overflow: hidden;
    min-height: 70px;
    min-width: 80px;
    z-index: 99;
}
#cnt-boxFrame2 .ui-widget-content {
    border: none;
}

#cnt-boxFrame3 {
    width: 615px;
    height: 610px;
    /* background-color: #76b6d4; */
    background-color: #FFF;
    border: solid 5px #76b6d4;
    position: fixed;
    top: 250px;
    left: 1300px;
    overflow: hidden;
    min-height: 70px;
    min-width: 80px;
    z-index: 98;
}
#cnt-boxFrame3 .ui-widget-content {
    border: none;
}

.cnt-box2 {
    width: 100%;
    height: 100%; /* 2025.01.28 Mizuno 下のグレー枠の削除 */
    /* padding: 0.5em 0em; */
    padding: 0px;
    overflow-x: hidden;
    overflow-y: scroll;
    /* background-color: #E8A3B5; */
    background-color: #FFF;
    border:none !important;
    box-sizing: border-box;
}

.cnt-box3 {
    width: 100%;
    height: 100%; /* 2025.01.28 Mizuno 下のグレー枠の削除 */
    /* padding: 0.5em 0em; */
    padding: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    /* background-color: #76b6d4; */
    background-color: #FFF;
    border:none !important;
    box-sizing: border-box;
}

.boxFrameMenuContainer {
    display: flex;
    align-items: center;
    gap: 20px;
  }
  
#boxFrameIslandMenu ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
}

#boxFrameIslandMenu ul li {
margin-right: 10px;
}

#disposalWindow {
    margin-left: -20px;
}

.tableFrame {
margin-left: 20px;
margin-right: 20px;
}

.simuHeaderButton{
    /* margin-right: 10px; */
}

.simuHeaderButton span{
    color: #808080 !important;
}

.simuTable {
    margin: 0;
}
table.simuTable th {
    background-color: #bbbbbb;
    color: #FFFFFF;
}

table.simuTable th a {
    color: #FFFFFF;
}

table.simuTable th,
table.simuTable td {
    border: solid 1px #CCCCCC;
}

.boxFrameContainer {
    display: flex;
    flex-direction: column;
    padding-bottom: 20px;
}

.boxFrame {
    width: auto;
    border: 1px solid #ccc;
    /* margin: 0px 15px 0px 0px; */
    overflow: hidden;
    transition: height 0.3s;
}

/* .boxFrameHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #808080;
    padding: 5px;
    cursor: pointer;
    font-size: 14px;
    margin: 0;
    min-width: 0; 
}

.boxFrameHeader > * {
    min-width: 0; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
} */

.boxFrameHeaderPut {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #E8A3B5;
    padding: 5px;
    cursor: pointer;
    font-size: 14px;
    margin: 0;
    min-width: 0;
    height: 36px;
}

.boxFrameHeaderPut > * {
    min-width: 0; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
}

.boxFrameHeaderOut {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #76b6d4;
    padding: 5px;
    cursor: pointer;
    font-size: 14px;
    margin: 0;
    min-width: 0; 
    height: 36px;
}

.boxFrameHeaderOut > * {
    min-width: 0; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
}


.boxFrameContent {
    display: block;
    margin: 0;
    background-color: #FFF;
    overflow-x: scroll;
}

.boxFrameToggle {
    cursor: pointer;
}

.boxPutTitle {
    background-color: #f08080;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 5px 15px;
    margin-top: 10px;
    margin-bottom: 20px;
    display: inline-block;
    height: 34px;
    width: 62px;
}

.boxOutTitle {
    background-color: #43B5DF;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 5px 15px;
    margin-top: 10px;
    margin-bottom: 20px;
    display: inline-block;
    height: 34px;
    width: 62px;
    min-width: 62px;
}

.map-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
}

.map-modal .modal-content {
    background-color: #fff;
    position: absolute;
    padding: 20px;
    border: 1px solid #888;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 5px !important;
    overflow-x: auto;
    max-height: 90vh !important;
}

.map-modal-close {
    position: fixed;
    right: 30px;
    top: 30px;
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    transition: 0.3s;
}


.map-modal-close:hover,
.map-modal-close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* 2024.09.22 Mizuno No.4 */
/* モーダル全体のスタイル台追加 */

/* モーダルオープン中の背景ロック処理 */
body.modal-open {
    overflow: hidden;
}

#machines-modal .modal-content {
    margin: 0 auto;  /* 上部スペースを元に戻す */
    padding: 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-height: 95vh;
    overflow-y: auto;
    width: 1000px;
    width: 80%;  
}

/* 見出しスタイル（下線を消す、色を#808080に変更） */
#machines-modal h4 {
    font-size: 16px;
    font-weight: bold;
    color: #808080;  /* テキストカラーを#808080に設定 */
    margin-bottom: 10px;
    text-align: left;
    border-bottom: none;  /* 下線を削除 */
}

/* テーブルのスタイル */
#machines-modal table {
    /* width: 60%;  テーブルの幅を80%に設定 */
    border-collapse: collapse;
    margin-bottom: 15px;
    text-align: left;
    /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); */
}

/* テーブルヘッダー（TH）のスタイル */
#machines-modal th {
    text-align: left;
    padding: 6px 10px;
    background-color: #F0F0F0;
    border-bottom: 1px solid #ddd;
    width: auto;
    white-space: nowrap;  /* 折り返しを防ぐ */
}

/* テーブルセルのスタイル */
#machines-modal td {
    padding: 6px 10px;
    vertical-align: middle; 
    border-bottom: 1px solid #ddd;
    width: auto;  /* 自動幅に設定 */
}

/* #machines-modal .modal-content tr:hover td {
    background-color: #f1f3f5;
} */


/* 検定の有効期間のテキストが右に突き抜けないように調整 */
#machines-modal #spn_pri_ins_date,
#machines-modal #spn_pri_ins_date_text {
    display: block;
    max-width: 100%;  /* 幅を100%に制限 */
    white-space: normal;  /* 折り返しを許可 */
    word-wrap: break-word;  /* 長い単語を途中で折り返す */
}

/* 入力フォームとセレクトボックス */
#machines-modal input[type="text"],
#machines-modal select {
    padding: 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

/* テーブルの幅調整（#machine_numbersテーブルにのみ適用） */
#machines-modal #machine_numbers th,
#machines-modal #machine_numbers td {
    padding: 8px;
    border: 1px solid #ccc;
    vertical-align: middle;
    text-align: left;
}

/* #machine_numbersテーブル内のinputのサイズ調整 */
#machines-modal #machine_numbers input {
    padding: 6px;
    box-sizing: border-box;
}

/* #machine_numbersのsymbol, serial, island_numの特定フィールド幅を個別に設定 */
#machines-modal #machine_numbers .symbolS {
    width: 35px;
}

#machines-modal #machine_numbers .symbolL {
    width: 90px;
}

#machines-modal #machine_numbers input[id^="delimiter_"] {
    width: 20px;  /* 記号用のinputフィールドの幅を設定 */
}

#machines-modal #machine_numbers input[id^="serial_"] {
    width: 100px;  /* 番号用のinputフィールドの幅を設定 */
}

#machines-modal #machine_numbers input[id^="island_num_"] {
    width: 80px;  /* 台番号用のinputフィールドの幅を設定 */
}

/* .noneBorder クラスの罫線を無くす（他のテーブルには影響しない） */
#machines-modal .noneBorder {
    border: none;  /* テーブル全体の罫線を無くす */
}

#machines-modal .noneBorder td,
#machines-modal .noneBorder th {
    border: none;  /* テーブルのセルの罫線を無くす */
}

#machines-modal .nonePdL th,
#machines-modal .nonePdL td{
    padding-left: 0;
}

#machines-modal .nonePdT th,
#machines-modal .nonePdT td{
    padding-top: 0;
}

/* 空のセルおよび   のみを含むセルに右罫線を適用しない */
#machines-modal #machine_numbers th:empty, 
#machines-modal #machine_numbers td:empty {
    /* border-right: none; */
}

#machines-modal #machine_numbers th,
#machines-modal #machine_numbers td {
    border-right: 1px solid #ccc; /* デフォルトの右罫線 */
}

/* 特定の空白や   が含まれるセルに対して */
#machines-modal #machine_numbers td {
    border-right: 1px solid #ccc;
}

#machines-modal #machine_numbers td[style*=" "],
#machines-modal #machine_numbers th[style*=" "] {
    border-right: none;
}

/* inputフィールドとtextareaの選択時に水色のグラデーションで光るようにする */
#machines-modal input[type="text"],
#machines-modal select,
#machines-modal textarea {
    box-sizing: border-box; /* フォーカス時のサイズ変化を防ぐ */
    border: 1px solid #ccc; /* 通常時のボーダーは1pxに設定 */
    padding: 8px; /* 内側の余白を設定してバランスを保つ */
    transition: border 0.2s, box-shadow 0.2s; /* フォーカス時のボーダーと影を滑らかに変化 */
    overflow: hidden; /* フォーカス時にスクロールバーが表示されないようにする */
}

#machines-modal input[type="text"]:focus,
#machines-modal select:focus,
#machines-modal textarea:focus {
    outline: none; /* デフォルトのアウトラインを削除 */
    border: 1px solid #66ccff; /* フォーカス時の水色のボーダーは2pxに設定 */
    background-image: linear-gradient(white, white), linear-gradient(to right, #66ccff, #00bfff);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 0 5px rgba(102, 204, 255, 0.75); /* フォーカス時の影を表示 */
    box-sizing: border-box; /* サイズが変わらないようにする */
    overflow: hidden; /* スクロールバーが表示されないように */
}
/* ここまで */

/* 2024.09.29 Mizuno No.4  シミュレーション編集CSS*/
#machines-modal-kplus th {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #F0F0F0;
}

#machines-modal-kplus .bgGray{
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #e3e3e3
}

#machines-modal-kplus td {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
}

#machines-modal-upd input[type="text"]:focus,
#machines-modal-upd select:focus,
#machines-modal-upd textarea:focus {
    outline: none; /* デフォルトのアウトラインを削除 */
    border: 1px solid #66ccff; /* フォーカス時の水色のボーダーは2pxに設定 */
    background-image: linear-gradient(white, white), linear-gradient(to right, #66ccff, #00bfff);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 0 5px rgba(102, 204, 255, 0.75); /* フォーカス時の影を表示 */
    box-sizing: border-box; /* サイズが変わらないようにする */
    overflow: hidden; /* スクロールバーが表示されないように */
}

/* #machine_numbersのsymbol, serial, island_numの特定フィールド幅を個別に設定 */
#machines-modal-upd .symbolS {
    width: 50px;
}

#machines-modal-upd .symbolL {
    width: 65px;
}

#machines-modal-upd input[id^="upd_delimiter_"] {
    width: 20px;  /* 記号用のinputフィールドの幅を設定 */
    text-align: center;
}

#machines-modal-upd input[id^="upd_serial_"] {
    width: 70px;  /* 番号用のinputフィールドの幅を設定 */
}

#machines-modal-upd input[id^="upd_island_num_"] {
    width: 40px;  /* 台番号用のinputフィールドの幅を設定 */
}

/* テーブルの調整 */
#machines-modal-upd .multiple-inputs {
    padding: 0;
    width: auto; /* 幅を自動調整 */
    white-space: nowrap; /* inputフィールドが折り返されないようにする */
}

/* 各input要素の配置をinline-blockにして、marginで調整 */
#machines-modal-upd .multiple-inputs input {
    display: inline-block;
    vertical-align: middle; /* 中央揃え */
    white-space: nowrap; /* 折り返しを防止 */
    margin-right: 5px;
}

/* 3つ目のinputにスペースを追加 */
#machines-modal-upd .multiple-inputs input:nth-child(3) {
    margin-right: 0px; /* 右に10pxのスペース */
}
  
#machines-modal-upd .multiple-inputs input[id^="upd_serial_"] {
    margin-left: auto; /* 左の要素をすべて押し出して右端に配置 */
}

#machines-modal-upd .multiple-inputs .flex-container {
    margin: 0 5px;
    display: flex;
    justify-content: space-between; /* 例: セルの中身を左右に配置 */
}

#machines-modal-upd th {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #F0F0F0;
}

#upd_machine_numbers td {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
}

#upd_machine_numbers tr:hover td {
    /*background-color: #f8f8f8;*/
}
/* ここまで */

/* 2025.01.17 Mizuno No.36 */
/* 枠固定用 */
#upd_list_move_com_2 {
    position: sticky;
    top: 0;
    z-index: 1000;
    background:  #f4f4f4;
    border: 1px solid #ddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    padding: 15px;
    border-radius: 8px;
    max-height: 200px;
    overflow-y: auto; 
}

/* ここまで */


/* 2024.09.22 Mizuno No.4 */
/* モーダル全体のスタイル日付追加、変更 */
#modal-dates-upd .modal-content {
    margin: 0 auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-height: 95vh;
    overflow-y: auto;
    width: 60vw; /* 幅を80%に設定 */
}

/* 見出しスタイル */
#modal-dates-upd .modal-content h2 {
    font-size: 24px; /* フォントサイズを24pxに設定 */
    font-weight: bold;
    color: #808080; /* テキストカラーを#808080に設定 */
    margin-bottom: 10px;
    border-bottom: none; /* 下線を削除 */
    padding-bottom: 5px;
    margin-top: 10px; /* 上にスペースを開ける */
}

/* テーブルスタイル */
#modal-dates-upd .modal-content table {
    width: 100%; /* テーブルの幅を100%に設定 */
    border-collapse: collapse;
    margin-bottom: 15px;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* テーブルヘッダーのスタイル */
#modal-dates-upd .modal-content th {
    text-align: left;
    padding: 10px;
    background-color: #F0F0F0;
    border-bottom: 1px solid #ddd;
    white-space: nowrap;
}

/* テーブルセルのスタイル */
#modal-dates-upd .modal-content td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    vertical-align: top;
}

#modal-dates-upd .modal-content tr:hover td {
    background-color: #f1f3f5;
}

/* 日付入力フィールドの横幅を広げる */
#modal-dates-upd .modal-content input[type="text"].imeHankaku,
#modal-dates-upd .modal-content select { 
    width: 150px; /* 日付入力フィールドとセレクトボックスの幅を120pxに設定 */
    padding: 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 14px;
}

/* チェックボックスとラベルのスタイル */
#modal-dates-upd .modal-content input[type="checkbox"] {
    margin-right: 5px;
}

#modal-dates-upd .modal-content label {
    font-size: 14px;
    color: #333;
}

/* センター配置のボタン */
#modal-dates-upd .modal-content .center-box {
    text-align: center;
    margin-top: 20px;
}

#modal-dates-upd .modal-content .center-box input {
    margin: 10px 0;
}

/* テキストエリア */
#modal-dates-upd .modal-content textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    box-sizing: border-box;
    resize: vertical; /* 高さを自由に調整可能に */
}

/* ボタンの位置調整 */
#modal-dates-upd .modal-content .buttonBase {
    margin-left: 5px;  /* ボタン間のマージン */
    padding: 5px 10px;
}

/* フロート解除とクリア */
#modal-dates-upd .modal-content .clear {
    clear: both;
}

/* フロート要素 */
#modal-dates-upd .modal-content .floatLeft {
    float: left;
}

/* チェックボックスとラベルをインラインに配置 */
#modal-dates-upd .modal-content label[for="print_open"] {
    margin-left: 5px;
    display: inline-block;
}

/* inputフィールドとtextareaの選択時に水色のグラデーションで光るようにする */
#modal-dates-upd .modal-content input[type="text"],
#modal-dates-upd .modal-content select,
#modal-dates-upd .modal-content textarea {
    box-sizing: border-box; /* サイズ変更を防ぐための設定 */
    border: 1px solid #ccc; /* 通常時に薄いグレーのボーダーを設定 */
    padding: 8px; /* 内側の余白を設定 */
    transition: border 0.2s, box-shadow 0.2s; /* アニメーションで滑らかに変化 */
    overflow: hidden; /* フォーカス時にスクロールバーが表示されないようにする */
}

#modal-dates-upd .modal-content input[type="text"]:focus,
#modal-dates-upd .modal-content select:focus,
#modal-dates-upd .modal-content textarea:focus {
    outline: none; /* デフォルトのアウトラインを削除 */
    border: 1px solid #66ccff; /* フォーカス時の水色のボーダーを1pxに設定 */
    background-image: linear-gradient(white, white), linear-gradient(to right, #66ccff, #00bfff);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 0 5px rgba(102, 204, 255, 0.75); /* 薄い水色の影を表示 */
    box-sizing: border-box; /* サイズが変わらないようにする */
    overflow: hidden; /* フォーカス時にスクロールバーが表示されないように */
}
/* ここまで */

/* 2024.09.22 Mizuno No.4 */
/* モーダル全体のスタイル台追加 */

/* モーダルオープン中の背景ロック処理 */

#machines-modal-move-dtl .modal-content {
    margin: 0 auto;  /* 上部スペースを元に戻す */
    padding: 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-height: 95vh;
    overflow-y: auto;
    width: 1000px;
    width: 80%;  
}

/* 見出しスタイル（下線を消す、色を#808080に変更） */
#machines-modal-move-dtl h4 {
    font-size: 16px;
    font-weight: bold;
    color: #808080;  /* テキストカラーを#808080に設定 */
    margin-bottom: 10px;
    text-align: left;
    border-bottom: none;  /* 下線を削除 */
}

/* テーブルのスタイル */
#machines-modal-move-dtl table {
    /* width: 60%;  テーブルの幅を80%に設定 */
    border-collapse: collapse;
    margin-bottom: 15px;
    text-align: left;
    /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); */
}

/* テーブルヘッダー（TH）のスタイル */
#machines-modal-move-dtl th {
    text-align: left;
    padding: 6px 10px;
    background-color: #F0F0F0;
    border-bottom: 1px solid #ddd;
    width: auto;
    white-space: nowrap;  /* 折り返しを防ぐ */
}

/* テーブルセルのスタイル */
#machines-modal-move-dtl td {
    padding: 6px 10px;
    vertical-align: middle; 
    border-bottom: 1px solid #ddd;
    width: auto;  /* 自動幅に設定 */
}


/* 検定の有効期間のテキストが右に突き抜けないように調整 */
#machines-modal-move-dtl #spn_pri_ins_date,
#machines-modal-move-dtl #spn_pri_ins_date_text {
    display: block;
    max-width: 100%;  /* 幅を100%に制限 */
    white-space: normal;  /* 折り返しを許可 */
    word-wrap: break-word;  /* 長い単語を途中で折り返す */
}

/* 入力フォームとセレクトボックス */
#machines-modal-move-dtl input[type="text"],
#machines-modal-move-dtl select {
    padding: 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

/* テーブルの幅調整（machines-modal-move-dtl-tbテーブルにのみ適用） */
#machines-modal-move-dtl .machines-modal-move-dtl-tb th,
#machines-modal-move-dtl .machines-modal-move-dtl-tb td {
    padding: 8px;
    border: 1px solid #ccc;
    vertical-align: middle;
    text-align: left;
}

/* .machines-modal-move-list-tbテーブル内のinputのサイズ調整 */
#machines-modal-move-dtl .machines-modal-move-dtl-tb input {
    padding: 6px;
    box-sizing: border-box;
}

/* .machines-modal-move-dtl-tbのsymbol, serial, island_numの特定フィールド幅を個別に設定 */
#machines-modal-move-dtll .machines-modal-move-dtl-tb .symbolS {
    width: 35px;
}

#machines-modal-move-dtl .machines-modal-move-dtl-tb .symbolL {
    width: 90px;
}

#machines-modal-move-dtl .machines-modal-move-dtl-tb input[id^="delimiter_"] {
    width: 20px;  /* 記号用のinputフィールドの幅を設定 */
}

#machines-modal-move-dtl .machines-modal-move-dtl-tb input[id^="serial_"] {
    width: 100px;  /* 番号用のinputフィールドの幅を設定 */
}
#machines-modal-move-dtl .machines-modal-move-dtl-tb input[id^="island_num_"] {
    width: 80px;  /* 台番号用のinputフィールドの幅を設定 */
}

/* .noneBorder クラスの罫線を無くす（他のテーブルには影響しない） */
#machines-modal-move-dtl .noneBorder {
    border: none;  /* テーブル全体の罫線を無くす */
}

#machines-modal-move-dtl .noneBorder td,
#machines-modal-move-dtl .noneBorder th {
    border: none;  /* テーブルのセルの罫線を無くす */
}

#machines-modal-move-dtl .nonePdL th,
#machines-modal-move-dtl .nonePdL td{
    padding-left: 0;
}

/* 空のセルおよび   のみを含むセルに右罫線を適用しない */
#machines-modal-move-dtl #machine_numbers th:empty, 
#machines-modal-move-dtl #machine_numbers td:empty {
    /* border-right: none; */
}

#machines-modal-move-dtl #machine_numbers th,
#machines-modal-move-dtl #machine_numbers td {
    border-right: 1px solid #ccc; /* デフォルトの右罫線 */
}

/* 特定の空白や   が含まれるセルに対して */
#machines-modal-move-dtl #machine_numbers td {
    border-right: 1px solid #ccc;
}

#machines-modal-move-dtl #machine_numbers td[style*=" "],
#machines-modal-move-dtl #machine_numbers th[style*=" "] {
    border-right: none;
}

/* inputフィールドとtextareaの選択時に水色のグラデーションで光るようにする */
#machines-modal-move-dtl input[type="text"],
#machines-modal-move-dtl select,
#machines-modal-move-dtl textarea {
    box-sizing: border-box; /* フォーカス時のサイズ変化を防ぐ */
    border: 1px solid #ccc; /* 通常時のボーダーは1pxに設定 */
    padding: 8px; /* 内側の余白を設定してバランスを保つ */
    transition: border 0.2s, box-shadow 0.2s; /* フォーカス時のボーダーと影を滑らかに変化 */
    overflow: hidden; /* フォーカス時にスクロールバーが表示されないようにする */
}

#machines-modal-move-dtl input[type="text"]:focus,
#machines-modal-move-dtl select:focus,
#machines-modal-move-dtl textarea:focus {
    outline: none; /* デフォルトのアウトラインを削除 */
    border: 1px solid #66ccff; /* フォーカス時の水色のボーダーは2pxに設定 */
    background-image: linear-gradient(white, white), linear-gradient(to right, #66ccff, #00bfff);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 0 5px rgba(102, 204, 255, 0.75); /* フォーカス時の影を表示 */
    box-sizing: border-box; /* サイズが変わらないようにする */
    overflow: hidden; /* スクロールバーが表示されないように */
}

#machines-modal-move-list th {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #F0F0F0;
}

#machines-modal-move-list td {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
}
/* ここまで */

/* 2024.09.29 Mizuno No.4  シミュレーション編集CSS*/
#machines-modal-upd input[type="text"]:focus,
#machines-modal-upd select:focus,
#machines-modal-upd textarea:focus {
    outline: none; /* デフォルトのアウトラインを削除 */
    border: 1px solid #66ccff; /* フォーカス時の水色のボーダーは2pxに設定 */
    background-image: linear-gradient(white, white), linear-gradient(to right, #66ccff, #00bfff);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    box-shadow: 0 0 5px rgba(102, 204, 255, 0.75); /* フォーカス時の影を表示 */
    box-sizing: border-box; /* サイズが変わらないようにする */
    overflow: hidden; /* スクロールバーが表示されないように */
}

/* #machine_numbersのsymbol, serial, island_numの特定フィールド幅を個別に設定 */
#machines-modal-upd .symbolS {
    width: 50px;
}

#machines-modal-upd .symbolL {
    width: 65px;
}

#machines-modal-upd input[id^="upd_delimiter_"] {
    width: 20px;  /* 記号用のinputフィールドの幅を設定 */
    text-align: center;
}

#machines-modal-upd input[id^="upd_serial_"] {
    width: 70px;  /* 番号用のinputフィールドの幅を設定 */
}

#machines-modal-upd input[id^="upd_island_num_"] {
    width: 50px;  /* 台番号用のinputフィールドの幅を設定 */
    text-align: right
}

#machines-modal-upd input[id^="upd_amount_"] {
    text-align: right
}

/* テーブルの調整 */
#machines-modal-upd .multiple-inputs {
    padding: 0;
    width: auto; /* 幅を自動調整 */
    white-space: nowrap; /* inputフィールドが折り返されないようにする */
}

/* 各input要素の配置をinline-blockにして、marginで調整 */
#machines-modal-upd .multiple-inputs input {
    display: inline-block;
    vertical-align: middle; /* 中央揃え */
    white-space: nowrap; /* 折り返しを防止 */
    margin-right: 5px;
}

/* 3つ目のinputにスペースを追加 */
#machines-modal-upd .multiple-inputs input:nth-child(3) {
    margin-right: 0px; /* 右に10pxのスペース */
}
  
#machines-modal-upd .multiple-inputs input[id^="upd_serial_"] {
    margin-left: auto; /* 左の要素をすべて押し出して右端に配置 */
}

#machines-modal-upd .multiple-inputs .flex-container {
    margin: 0 5px;
    display: flex;
    justify-content: space-between; /* 例: セルの中身を左右に配置 */
}

#machines-modal-upd th {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #F0F0F0;
}

#machines-modal-upd .bgGray{
    border: 1px solid #ccc; /* 1pxの灰色実線 */
    background: #e3e3e3
}

#upd_machine_numbers td {
    border: 1px solid #ccc; /* 1pxの灰色実線 */
}

#upd_machine_numbers tr:hover td {
    /*background-color: #f1f3f5;*/
}
/* ここまで */



.sortable-container {
}
/*.table-content {
    overflow: hidden;
}
table {
    width: 100%;
    border-collapse: collapse;
}
th, td {
    padding: 8px;
    text-align: left;
    border: 1px solid #ddd;
}*/
.draggable { cursor: grab; }
.ui-sortable-placeholder { 
    border: 1px dashed #ddd; 
    height: 35px; 
    background: #f0f0f0; 
}
.dragging { background-color: #e0e0e0; }

/* 必須アイコン */
.required-icon {
    background-color: red;
    color: white;
    font-size: 10px;
    padding: 2px 8px 3px 8px;
    border-radius: 5px;
    display: inline-block;
    margin-left: 5px;
}

/* input用背景 */
input[type="text"]::placeholder {
    color: #d0d0d0;
}

/* ボタン */
/* 2024.09.26 Mizuno No.4 シミュレーションボタン*/

.buttonBase, .buttonCsv, .buttonSimu {
    display: inline-block; /* インラインブロックで横並びに */
    vertical-align: middle; /* 垂直方向に中央揃え */
    line-height: 1.5; /* ボタン内のテキストの行の高さを設定 */
    padding: 10px 20px; /* ボタン内の余白を調整 */
    margin: 5px; /* ボタン間の余白を調整 */
    box-sizing: border-box; /* ボックスモデルを調整 */
}

button[type="submit"].buttonSimu,
input[type="button"].buttonSimu,
input[type="submit"].buttonSimu {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 14px;
    background: url(../img/simu_icon.png) no-repeat;
    background-position: 5px;
    background-color: #A3A3A3;
}

button[type="submit"].buttonSimu:hover,
input[type="button"].buttonSimu:hover,
input[type="submit"].buttonSimu:hover {
    background-color: #BFBFBF;
}

button[type="submit"].buttonExcel,
input[type="button"].buttonExcel,
input[type="submit"].buttonExcel {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    background: url(../img/excel_icon.png) no-repeat;
    background-position: 5px;
    background-color: #00a267;
    /* letter-spacing: 0.3em; */
    padding-right: 10px;
    margin-right: 10px;
}

button[type="submit"].buttonExcel:hover,
input[type="button"].buttonExcel:hover,
input[type="submit"].buttonExcel:hover {
    background-color: #90EE90;
}

button[type="submit"].buttonSimuCheck,
input[type="button"].buttonSimuCheck,
input[type="submit"].buttonSimuCheck {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    background: url(../img/simuCheck.png) no-repeat;
    background-position: 8px center;
    background-color: #43B5DF;
    /* letter-spacing: 0.3em; */
    min-width: 100px;
    margin-right: 10px;
    padding-right: 10px;
}

button[type="submit"].buttonSimuCheck:hover,
input[type="button"].buttonSimuCheck:hover,
input[type="submit"].buttonSimuCheck:hover {
    background-color: #6AC5E5;
}

button[type="submit"].buttonSimuSave,
input[type="button"].buttonSimuSave,
input[type="submit"].buttonSimuSave {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    background: url(../img/simuSave.png) no-repeat;
    background-position: 8px center;
    background-color: #43B5DF;
    /* letter-spacing: 0.3em; */
    min-width: 100px;
    margin-right: 10px;
    padding-right: 10px;
}

button[type="submit"].buttonSimuSave:hover,
input[type="button"].buttonSimuSave:hover,
input[type="submit"].buttonSimuSave:hover {
    background-color: #6AC5E5;
}

button[type="submit"].buttonSimuBack,
input[type="button"].buttonSimuBack,
input[type="submit"].buttonSimuBack {
    padding: 10px 5px 10px 38px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    background: url(../img/simuBack.png) no-repeat;
    background-position: 8px center;
    background-color: #43B5DF;
    /* letter-spacing: 0.3em; */
    min-width: 100px;
    margin-right: 10px;
    padding-right: 10px;
}

button[type="submit"].buttonSimuBack:hover,
input[type="button"].buttonSimuBack:hover,
input[type="submit"].buttonSimuBack:hover {
    background-color: #6AC5E5;
}

/* 2025.02.11 Mizuno Simuボタン小 */
.buttonSimuS,
.buttonSimuS a {
    min-width: 60px;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    background: #E9E9E9; /* デフォルトのグレーカラー */
    text-align: center;
    color: #848586;
    font-size: 12px;
    font-weight: bold;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.buttonSimuS:hover,
.buttonSimuS a:hover,
.buttonSimuS.active, /* アクティブ状態のスタイル */
.buttonSimuS a.active {
    background: #43B5DF;
    color: #FFFFFF;
    box-shadow: none;
}




/* 各BOXヘッダー */
.simuHeaderCount {
    color: rgb(255, 255, 255);
    font-weight: bold;
    margin-right: auto; /* 要素を左寄せにする */
    text-align: left;
    margin-left: 15px;
}

.simuHeaderBox{
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 95vw;
}

.simuLogo {
    display: flex;
    align-items: center;
    width: 400px;
}

.simuLogo img {
    height: 40px; /* アイコンの高さ */
    margin-right: 10px; /* アイコンとテキストの間のスペース */
}

.simuTitle {
    font-size: 24px;
    color:#808080;
    font-weight: bold;
    margin-right: 30px;
}

.map-nav {
    list-style: none;
    overflow: hidden;
    margin-left: 10px;
}

.map-nav li {
    text-align: center;
    background-color: #E9E9E9;
    float: left;
    margin-right: 2px;
    height: 28px;
}

.map-nav li.active {
    text-align: center;
    background-color: #43B5DF;
    float: left;
    margin-right: 2px;
    height: 28px;
}

.map-nav li.add {
    text-align: center;
    border:solid 2px #218CB3;
    background: #FFF;
    float: left;
    margin-right: 2px;
    height: 28px;
    margin-right: 10px;
}

.map-nav li.none {
    text-align: center;
    border:solid 2px #FFF;
    background: #FFF;
    float: left;
    margin-right: 2px;
    height: 28px;
    font-weight: bold;
}

.map-nav li a {
    text-decoration: none;
    color: #000000;
    /*font-weight: bold;*/
    padding: 5px 10px;
    position: relative;
    top: 1.2px; /* 3px 下にずらす */
}

.map-nav li a.active {
    text-decoration: none;
    color: #FFF;
    font-weight: bold;
    padding: 5px 10px;
    position: relative;
    top: 1.2px; /* 3px 下にずらす */
}

.map-nav li a.add {
    text-decoration: none;
    color: #20A1C2;
    font-weight: bold;
    padding: 5px 7px 5px 2px;
    position: relative;
    top: -0.6px; /* 3px 下にずらす */
}

.map-nav li:hover {
    background-color: #43B5DF;
}

.map-nav li:hover a {
    color: #FFF;
}

.map-nav li:hover.active {
    background-color: #43B5DF;
}

.map-nav li:hover.add {
    background-color: #a6e7ff;
}

.map-nav li:hover.none {
    background-color: unset;
    cursor: pointer;
}


.map-m0 {
    margin-left: 0px;
    margin-right: 0px;
}

.simuHeaderTable {
    border-spacing: 10px 0px; /* セル間のスペースを指定 */
    border-collapse: separate; /* border-spacingを有効にするために必要 */
}

.simuHeaderTable th {
    padding: 3px 0 0 0; /* 右側のパディングは削除 */
    position: relative;
    background-color: white; /* 背景色で右側のスペースを隠す */
    font-size: 15px;
}

.simuHeaderTable th span {
    display: inline-block;
    margin-right: 10px;
    background-color: white; /* 下線を背景色で隠す */
    border-bottom: solid 2px #e6e6e6;
}


.simuBoxContainer2 {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    padding: 0 20px 5px 20px;
    margin-top: 5px;
    background-color: #F0F0F0;
}

.simuBoxContainer3 {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    padding: 0 20px 5px 20px;
    background-color: #76b6d4;
}

.simuBoxTitle {
    display: flex;
    align-items: center;
    margin-right: auto;
}

.simuBoxTitle span {
    font-size: 24px;
    font-weight: bold;
    margin-right: 10px;
    color: white;
}

.simuBoxTitle img {
    width: auto;
    height: auto;
}

.simuBoxButtons {
    display: inline-flex;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
    margin: 5px 0px;
    min-width: 70px;
    max-width: calc(100% - 80px); /* 右側の固定幅分を引く */
    overflow: hidden; /* 横スクロール防止 */
    white-space: nowrap;
    justify-content: flex-start;
}

.simuBoxButtons > *, .simuBoxButtonsRight > * {
    flex-shrink: 1;
    min-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.simuBoxButtonsRight {
    display: inline-flex;
    width: 80px; /* ← 固定幅 */
    justify-content: flex-end;
    gap: 5px;
    vertical-align: top; /* inline-flex の位置揃え */
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0; 
}


.simuBoxButtonsRight > span {
    cursor: pointer; /* クリック可能な見た目のフィードバックを提供 */
    padding: 0 5px; /* 左右のパディングを5pxに設定 */
    min-width: 20px; /* 最小幅を20pxに設定 */
    text-align: center; /* テキストを中央揃え */
}

.simuBoxButtons #chk_show_put_mcn {
    transform: scale(0.5);
    margin-right: -36px;
}

.simuBoxButtons label[for="chk_show_put_mcn"] {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    margin: 0;
    padding-left: 0;
}
.simuBoxButtons #chk_show_out_mcn {
    transform: scale(0.5);
    margin-right: -36px;
}

.simuBoxButtons label[for="chk_show_out_mcn"] {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    margin: 0;
    padding-left: 0;
}


.simuBoxButton {
    display: flex;
    align-items: center;
    background-color: #d3d3d3;
    padding: 2px 5px; /* 縦のスペースを狭くする */
    border-radius: 5px;
    margin-left: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    transition: background-color 0.3s;
    height:33px;
    min-width: 80px;
}

.simuBoxButton img {
    width: auto;
    height: auto;
    margin-right: 10px;
}

.simuBoxButton span {
    font-size: 14px;
    font-weight: bold;
}

.simuBoxButton .off-label {
    font-size: 12px;
    display: block;
    text-align: center;
}

.simuBoxButton:hover,
.simuBoxButton.active {
    background-color: white;
    text-decoration: none; /* ホバー時の下線を消す */
    border-bottom: 2px solid #20B3DC; /* 下線を追加 */
}

.simuBoxButtonSub {
    display: flex;
    align-items: center;
    background-color: #d3d3d3;
    padding: 2px 5px; /* 縦のスペースを狭くする */
    border-radius: 5px;
    margin-left: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    transition: background-color 0.3s;
}

.simuBoxButtonSub img {
    width: auto;
    height: auto;
    margin-right: 10px;
}

.simuBoxButtonSub span {
    font-size: 14px;
    font-weight: bold;
}

.simuBoxButtonSub .off-label {
    font-size: 12px;
    display: block;
    text-align: center;
}

.simuBoxButtonSub:hover,
.simuBoxButtonSub.active {
    background-color: white;
    text-decoration: none; /* ホバー時の下線を消す */
    border-bottom: 2px solid #20B3DC; /* 下線を追加 */
}


/* 2024.10.27 Mizuno No.4 Simu分割用
.splitContainer {
    display: flex;
    position: relative;
    height: 100%;
}

.leftFrame, .rightFrame {
    height: 100%;
    overflow: auto;
}

.leftFrame {
    flex-basis: 600px;
    height: 100%;
    overflow: auto;
}

.rightFrame {
    flex-basis: 594px;
    flex-grow: 1;
}

.splitter {
    z-index: 9999;
    width: 8px;
    min-width: 8px;
    height: 100%;
    background-color: #DDD;
    left: calc(50% - 4px); 
    cursor: col-resize;
    display: flex;
    align-items: center;
    justify-content: center; 
}

.splitter::before {
    content: '';
    display: block;
    width: 2px; 
    height: 100%;
    background: repeating-linear-gradient(
      to bottom,
      #aaa,
      #aaa 1px,
      transparent 1px,
      transparent 3px
    );
}

2024.10.27 Mizuno Simu分割用 ここまで */

/* 2025.01.28 Mizuno No.4 Simu分割用 */
.splitContainer {
    display: flex;
    position: relative;
    height: 100%;
    width: 100%;
}

.leftFrame, .rightFrame {
    height: 90%;
    overflow: auto;
    flex: 1; /* 左右の幅を等分 */
}

.splitter {
    width: 8px; /* splitterの幅 */
    height: 100%;
    background-color: #DDD;
    cursor: col-resize;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; /* splitterの幅を固定 */
}

.splitter::before {
    content: '';
    display: block;
    width: 2px;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        #aaa,
        #aaa 1px,
        transparent 1px,
        transparent 3px
    );
}
/* 2025.01.28 Mizuno Simu分割用 ここまで */


/* Mizuno Simu 追加 ここまで */



/* order_table */
.order_tr:hover {
    background-color: #DDDDDD;
}

/* Radio */
#cnt-box input[type=radio] {
    width: 20px;
    height: 20px;
    margin: 0px;
    vertical-align: middle;
}

/* Frame ポップアップ用 */
.Frame_table {
    margin-bottom: 10px;
}

.Frame_table td {
    margin: 0;
    padding: 0;
}

.Frame_table input[type="radio"]:checked+label {
    background-color: #c6f0c6;
    color: #333;
}

.Frame_table label {
    display: block;
    width: auto;
    height: auto;
    text-align: center;
    padding: 5px;
    border: solid 1px #dddddd;
}

.Frame_table label p {
    margin: 0;
    padding: 0;
}

/* ファイル出力画面 */
#reports {
    background-color: #d9edf7;
    padding: 10px;
    width: 100%;
    overflow: hidden;
    height: auto;
    margin-bottom: 150px;
}

#reports .file {
    width: 160px;
    height: 100px;
    float: left;
    font-size: 12px;
    text-align: center;
}

.BGC {
    background-color: Blue;
}

/* ▲hall▲ ----------------------------------------------------- */

.error-message {
    color: #FF0000;
}

/* Kplus */
#drag-drop-area {
    background-color: #d9edf7;
    width: 500px;
    height: 400px;
    padding: 10px;
}

.drag-drop-inside {
    border-style: dashed;
    border-color: #A9A9A9;
    border-width: 5px;
    width: 480px;
    height: 380px;
    padding: 50px 10px 10px 10px;
    text-align: center;
}

.tool_tip {
    background-color: #CCC;
    display: none;
    /*-- 基本は非表示 --*/
    padding: 5px;
    position: absolute;
    z-index: 0;
}

#pulldown li ul {
    display: none;
    position: absolute;
    top: 30px;
    left: -1px;
    padding: 5px;
    width: 210px;
    background: #eee;
    border: solid 1px #ccc;
}

#pulldown li ul li {
    margin: 0;
    padding: 0;
    width: 200px;
    border: none;
}

#btnCart {
    width: 80px;
    height: 40px;
    color: #6699FF;
    background: url(../img/cart_button.png) no-repeat;
}

.badge {
    position: absolute;
    top: 0;
    right: 0%;
    font-size: 11px;
    line-height: 13px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    background-color: #ff0000;
    border: 3px solid #ff0000;
    color: #ffffff;
    text-align: center;
}

/* モーダルウィンドウのスタイル */
.modal {
    position: absolute;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    display: none;
}

/* オーバーレイのスタイル */
.overLay {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(200, 200, 200, 0.8);
    width: 100%;
    height: 100vh;
    z-index: 10;
}

/* モーダルウィンドウの中身のスタイル */
.modal .inner {
    position: absolute;
    z-index: 11;
    top: 100px;
    left: 50%;
    min-width: 200px;
    max-width: 1000px;
    transform: translate(-50%, -0%);
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    background-color: #FFFFFF;
    padding: 10px 20px 10px 20px;
    /*transform:translate(-50%,-50%);*/
    border-radius: 10px;
    box-shadow: 0 0 8px gray;
}

/* ページネーションスタイル */
.pager {
    vertical-align: middle;
}

.pager .count {
    vertical-align: middle;
}

.pager .pagination {
    padding: 0;
    margin: 0;
    text-align: left;
}

.pager .pagination li {
    display: inline;
    margin: 0 2px;
    padding: 0;
    display: inline-block;
    background: #EEEEEE;
    width: 30px;
    height: 30px;
    text-align: center;
    position: relative;
    border-radius: 7px;
    font-size: 12px;
}


.pager .pagination li a {
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    display: table;
    color: #fff;
    text-decoration: none;
}


.pager .pagination li a span {
    display: table-cell;
    vertical-align: middle;
}

.pager .pagination li span {
    width: 30px;
    height: 30px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.pager .pagination li a:hover,
.pager .pagination li a.active {
    color: #fff;
    background: #43B5DF;
    border-radius: 7px;
}

.pager .pagination li.current {
    color: #fff;
    background: #43B5DF;
    border-radius: 7px;
}

.pager .pagination li a:hover span,
.pager .pagination li a.active span,
.pager .pagination li.current span {
    color: #FFF;
}

.pager .pagination span.count {
    display: inline;
    padding: 0;
    display: inline-block;
    height: 30px;
    text-align: center;
    position: relative;
    border-radius: 7px;
    font-size: 12px;
    font-size: 12px;
}

.error {
    color: #C1272D;
}

/* 2020.02.13 STEP3島図Tableタグ化 */

.fcMcnTypeP {
    color: #000000;
}

.fcMcnTypeS {
    color: #0061ff;
}

.islandTable {
    background: #F1F1F1;
    table-layout: fixed;
    word-wrap: break-word;
}

.islandTable td {
    padding: 0;
    min-width: 30px;
    min-height: 30px;
    width: 30px;
    height: 30px;
    text-align: center;
    /* line-height: 90%; */
    line-height: 120%;
}

.islandTdMcnBlank {
    border: 1px #696969 solid;
    background: #FFFFFF;
    font-size: 14px;
    font-family: serif;
}

.islandTdMcnStay {
    border: 1px #696969 solid;
    background: #f5deb3;
    font-size: 14px;
    font-family: serif;
}

.islandTdMcnStayFlash {
    animation: flashStay 1.5s linear infinite;
}

@keyframes flashStay {
    50% {
        /*background: #ff4500;*/
        background: #00bfff;
    }
}

.islandTdMcnNew {
    border: 1px #696969 solid;
    background: #f08080;
    font-size: 14px;
    font-family: serif;
}

.islandTdMcnNewFlash {
    animation: flashNew 1.5s linear infinite;
}

@keyframes flashNew {
    50% {
        /*background: #dc143c;*/
        background: #00bfff;
    }
}

.islandTdMcnMove {
    border: 1px #696969 solid;
    background: #90ee90;
    font-size: 14px;
    font-family: serif;
}

.islandTdMcnMoveFlash {
    animation: flashMove 1.5s linear infinite;
}

@keyframes flashMove {
    50% {
        /*background: #008000;*/
        background: #00bfff;
    }
}

.islandTdMcnFlashAlertCert {
    animation: flashAlertCert 1.5s linear infinite;
}

@keyframes flashAlertCert {
    50% {
        background: #ffff00;
    }
}

.islandTdMcnFlashAlertMemoWar {
    animation: flashAlertMemoWar 1.5s linear infinite;
}

@keyframes flashAlertMemoWar {
    50% {
        background: #ff99ff;
    }
}

.islandTdMcnPart {
    border: 1px #696969 solid;
    background: #ea9d17;
    font-size: 14px;
    font-family: serif;
}

.islandTdLbl {
    background: #E9E9E9;
    font-size: 8px;
    vertical-align: middle;
}

.islandTdLblTop {
    border-top: 1px #000000 solid;
    border-left: 1px #000000 solid;
    border-right: 1px #000000 solid;
    font-size: 9px;
}

.islandTdLblRight {
    border-top: 1px #000000 solid;
    border-right: 1px #000000 solid;
    border-bottom: 1px #000000 solid;
    font-size: 9px;
}

.islandTdLblBottom {
    border-right: 1px #000000 solid;
    border-bottom: 1px #000000 solid;
    border-left: 1px #000000 solid;
    font-size: 9px;
}

.islandTdLblLeft {
    border-top: 1px #000000 solid;
    border-left: 1px #000000 solid;
    border-bottom: 1px #000000 solid;
    font-size: 9px;
}

.islandTdBoxW {
    border: 2px #696969 solid;
    background: #FFFFFF;
}

.islandTdBoxB {
    border: 2px #696969 solid;
    background: #696969;
}

.islandTdBoxX {
    border: 2px #696969 solid;
    background: #C0C0C0;
    font-size: 20px;
    color: #000000;
}

.islandTdLineW {
    border-top: 2px #696969 solid;
}

.islandTdLineL {
    border-left: 2px #696969 solid;
}

.islandTdLineSU {
    background-image: linear-gradient(to top left, transparent, transparent 49%, gray 49%, gray 51%, transparent 51%, transparent);
}

.islandTdLineSD {
    background-image: linear-gradient(to top right, transparent, transparent 49%, gray 49%, gray 51%, transparent 51%, transparent);
}

#island_menu {
    width: 100%;
}

#island_menu ul {
    width: 100%;
    font-size: 0;
}

#island_menu ul li {
    display: inline-block;
    position: relative;
    font-size: 15px;
    line-height: 2.5em;
    margin-right: 5px;
}

#island_menu ul li a {
    display: block;
    text-decoration: none;
}

/* 2020.06.18 Mizuno put-rate-for-out-mcns用 色付 */
.put-rate1 {
    background-color: #F3D5CA !important;
}

.put-rate2 {
    background-color: #DDEBF7 !important;
}

.put-rate3 {
    background-color: #E2EFDA !important;
}

/* 2020.03.10 Popup NEWS用 */
.popup_news_box {
    padding: 15px 10px 15px 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    background: #eff6f9;
}

/* 2020.06.26 Mizuno TOPページお知らせ用 */
.top_news_box {
    width: 900px;
    hight: auto;
    margin-bottom: 40px;
    padding-bottom: 10px;
    border-bottom: dotted 1px #A6A6A6;
    text-align: left;
    padding-left: 40px;
    padding-right: 40px;
}

.news_label {
    width: 66px;
    padding: 0.2em 0.5em 0.2em 0.5em;
    margin: 0px 0px 5px 0px;
    background: #D9D9D9;
    /*背景色*/
}

.news_label p {
    font-weight: bold;
    margin: 0;
    padding: 0;
    color: #555 !important;
}

/* 2023.04.11 Mizuno */
.news_box_sub {
    border-left: solid 2px #20B3DC;
    margin-bottom: 50px;
    padding-left: 10px;
}

/* 2020.07.20 Mizuno 検定満了日用BOX */
.top_ins_box {
    width: 900px;
    hight: auto;
    margin-bottom: 40px;
    border-bottom: dotted 1px #A6A6A6;
    text-align: left;
}

/* 2020.07.20 Mizuno ご確認用BOX */
.top_confirmation_box {
    width: 900px;
    hight: auto;
    text-align: left;
}

.news_history {
    width: 900px;
    hight: auto;
    margin-bottom: 40px;
    text-align: left;
    padding: 40px;
    border: solid 1px #666666;
}

.login_box_in {
    width: 90%;
    background-color: #FFFFFF;
    font-size: 12px;
    text-align: left;
    padding: 5px;
}

/* 2020.03.29 Mizuno ボタン固定用 */
.fixed_btn {
    position: fixed;
    bottom: 10px;
    right: 450px;
    padding: 6px 40px;
    background-color: #43B5DF;
    color: #FFFFFF;
}

/*　ハンディ用(画面サイズが max-width 以下の場合に適用)　*/
@media screen and (max-width:480px) {

    /* table */
    table th,
    table td {
        padding: 3px;
    }

    /* オーバーレイのスタイル */
    .overLay {
        height: 100%;
    }

    /* モーダルウィンドウの中身のスタイル */
    .modal .inner {
        left: 0%;
        transform: translate(0%, 0%);
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        padding: 5px 3px;
    }
}

#overlay-loading {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    display: none;
    background: rgba(0, 0, 0, 0.6);
}

.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #2e93e6 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}

@keyframes sp-anime {
    100% {
        transform: rotate(360deg);
    }
}

.is-hide {
    display: none;
}

/* Element.QrReader.toggle #00de00 #5895F4 */
switch,
.switch {
    cursor: pointer;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 45px;
    height: 27px;
    max-width: 100%;
    background: #BBBBBB;
    border-radius: 100em;
    box-shadow: inset 0px 1px 1px 1px #d6d6d6, inset 0 -1px 1px 1px #ececec, inset 0 0 0px 2px #f5f5f5;
}

switch::before,
.switch::before {
    content: "";
    display: block;
    position: absolute;
    left: 5%;
    top: 10%;
    width: 50%;
    height: 80%;
    background: white;
    border-radius: 100%;
    box-shadow: -2px 2px 2px 0 #bbbbbb, 0px 0px 10px 0 #e4e4e4;
    transition: all .2s;
}

switch.on,
.switch.on {
    background: #00de00;
    box-shadow: unset;
}

switch.on::before,
.switch.on::before {
    margin-left: 40%;
    box-shadow: 2px 2px 2px 0 #bbbbbb, 0px 0px 10px 0 #e4e4e4;
}

/* ミニサイズバージョン */
.switch.switch--mini {
    width: 30px;
    height: 18px;
}

.switch.switch--mini::before {
    left: 5%;
    top: 10%;
    width: 50%;
    height: 80%;
    transition: all .2s;
}

/* ON状態のときの移動距離調整 */
.switch.switch--mini.on::before {
    margin-left: 40%;
}

.switch-tr-disabled {
  background-color: #dcdcdc;
}

/* Element.QrReader.toggle #00de00 #5895F4 */

/* 2021.09.24 Mizuno ヘッダー用ボタン */
.account_header {
    background: url(../img/account.png) no-repeat;
    height: 40px;
    width: 45px;
}

.account_header:hover {
    background: url(../img/account_h.png) no-repeat;
    height: 40px;
    width: 45px;
}

.logout_header {
    background: url(../img/logout.png) no-repeat;
    height: 40px;
    width: 45px;
}

.logout_header:hover {
    background: url(../img/logout_h.png) no-repeat;
    height: 40px;
    width: 45px;
}

.easys_logout_header {
    background: url(../img/easys_logout.png) no-repeat;
    height: 40px;
    width: 45px;
}

.easys_logout_header:hover {
    background: url(../img/easys_logout_h.png) no-repeat;
    height: 40px;
    width: 45px;
}

.login_office {
    background: url(../img/login_office.png) no-repeat;
    height: 40px;
    width: 45px;
}

.login_office:hover {
    background: url(../img/login_office_h.png) no-repeat;
    height: 40px;
    width: 45px;
}

.spmode_header {
    background: url(../img/sp.png) no-repeat;
    height: 40px;
    width: 45px;
}

.spmode_header:hover {
    background: url(../img/sp_h.png) no-repeat;
    height: 40px;
    width: 45px;
}

.border_dark {
    border-bottom: solid 2px #CCCCCC;
}

.cur_pointer {
    cursor: pointer;
}

/* 2023.05.22 Mizuno お問い合わせボタン */
#popupBackground {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 100;
}

#common_popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 5px;
    z-index: 101;
    max-height: 80%; /* 画面の高さの80%まで */
    overflow-y: auto; /* 内容が超えたらスクロールバーを表示 */
}

#common_popup h2 {
    background-color: #2b689c;
    /* 背景色を青に設定 */
    text-align: center;
    color: #FFF;
    /* 文字色を白に設定 */
    padding: 5px;
    /* パディングを追加してテキストが枠にぴったりとつかないようにする */
}

#common_popup h3{
    background-color: #FF6F1A;
    /* 背景色を青に設定 */
    text-align: center;
    color: #FFF;
    /* 文字色を白に設定 */
    padding: 5px;
    /* パディングを追加してテキストが枠にぴったりとつかないようにする */
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 600;
}


.common_hidden {
    display: none;
}

#contactButton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    text-decoration: none;
    color: #fff;
    background-color: #337ab7;
    border: none;
    border-radius: 5px;
    transition: background-color 0.5s ease;
    position: relative;
    font-weight: bold;
    margin-right: auto;
    cursor: pointer;
    height: 30px;
    margin-top: auto;
    margin-bottom: auto;
}

#contactButton::before {
    content: "";
    background-image: url(../img/contactButton.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

#contactButton:hover {
    background-color: #2b689c;
}

#closeButton {
    margin-top: 20px;
    cursor: pointer;
}

.popup-content {
    text-align: center;
}

.popup-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.popup-content .contact-info .phone h2 {
    background-color: #0000ff;
    color: #ffffff;
    padding: 10px;
    border-radius: 5px;
}

.popup-content .phone p {
    margin: 0;
}

.popup-content .email p {
    margin: 2px 0;
}

.popup-content .email .copy-btn {
    background-color: #999999;
    color: #ffffff;
    border: none;
    border-radius: 5px;
    padding: 5px 10px;
    cursor: pointer;
}

.popup-content .email .copy-btn:hover {
    background-color: #777777;
}

.popup-content h2 {
    background-color: #2b689c;
    /* 背景色を青に設定 */
    text-align: center;
    color: #FFF;
    /* 文字色を白に設定 */
    padding: 5px;
    /* パディングを追加してテキストが枠にぴったりとつかないようにする */
}

.popup-content .phone-number {
    font-size: 22px;
    /* フォントサイズを大きく設定 */
    text-align: center;
    padding: 0;
    margin: 0;
}

.popup-content .email-line {
    display: flex;
    align-items: center;
    /* メールアドレスとCOPYボタンを中央寄せにする */
    gap: 10px;
    /* メールアドレスとCOPYボタンの間隔を設定 */
}

.popup-content .message {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 10px 20px;
    background-color: #BBB;
    color: #fff;
    border-radius: 5px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* 2023.05.29 Mizuno 次へなどが横スクロールの右に行かないようにするBOX */
.box95vm {
    width: 100%;
    max-width: 95vw;
    box-sizing: border-box;
    justify-content: space-between;
}

/* 2023.06.23 本社画面に戻るボタン */
.backOffice {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    text-decoration: none;
    color: #fff;
    background-color: #B20000;
    border: none;
    border-radius: 5px;
    transition: background-color 0.5s ease;
    position: relative;
    font-weight: bold;
    margin-right: 10px;
    cursor: pointer;
    height: 30px;
    margin-top: auto;
    margin-bottom: auto;
}

.backOffice::before {
    content: "";
    background-image: url(../img/backOffice.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.backOffice:hover {
    background-color: #880000;
}

.backOffice,
#contactButton {
    /* 他のスタイル */
    font-size: 14px;
    /* 好みのサイズに調整 */
    line-height: 1.2;
    /* 好みの行間に調整 */
    box-sizing: border-box;
    vertical-align: middle;
}

.button-container {
    display: flex;
    align-items: center;
    text-align: initial;
    justify-content: flex-start;
}

.button-container a {
    text-decoration: none
}

.center-box {
    text-align: center;
}

/*** 2023.08.07 Mizuno EASYS LOGIN SUPER USER用 CSS ***/
/* 管理メニューTOP */
button[type="submit"].buttonLoginEasysSu,
input[type="button"].buttonLoginEasysSu,
input[type="submit"].buttonLoginEasysSu,
input[type="reset"].buttonLoginEasysSu {
    padding: 5px;
    color: #FFF;
    font-size: 14px;
}
button[type="submit"].buttonLoginEasysSu,
input[type="button"].buttonLoginEasysSu,
input[type="submit"].buttonLoginEasysSu,
input[type="reset"].buttonLoginEasysSu {
    background-color: #8949a6;
}
button[type="submit"].buttonLoginEasysSu:hover,
input[type="button"].buttonLoginEasysSu:hover,
input[type="submit"].buttonLoginEasysSu:hover,
input[type="reset"].buttonLoginEasysSu:hover {
    background-color: #b26ecf;
    color: #FFF;
}
button[type="submit"].buttonLoginEasysSu:disabled,
input[type="button"].buttonLoginEasysSu:disabled,
input[type="submit"].buttonLoginEasysSu:disabled,
input[type="reset"].buttonLoginEasysSu:disabled {
    color: #FFF;
    background-color: #d3d3d3;
}
/* 資産管理 */
.buttonMachineLoginEasysSu {
    width: 220px;
    height: 110px;
}
/* 文字色 */
.fcLoginEasysSu {
    color : #8949a6;
}
.fcLoginEasysSuLight {
    color : #b26ecf;
}
/*** 2023.08.07 Mizuno EASYS LOGIN用 CSS ***/
button[type="submit"].buttonLoginEasys,
input[type="button"].buttonLoginEasys,
input[type="submit"].buttonLoginEasys,
input[type="reset"].buttonLoginEasys {
    padding: 5px;
    color: #FFF;
    font-size: 14px;
}
button[type="submit"].buttonLoginEasys,
input[type="button"].buttonLoginEasys,
input[type="submit"].buttonLoginEasys,
input[type="reset"].buttonLoginEasys {
    background-color: #e4007f;
}
button[type="submit"].buttonLoginEasys:hover,
input[type="button"].buttonLoginEasys:hover,
input[type="submit"].buttonLoginEasys:hover,
input[type="reset"].buttonLoginEasys:hover {
    background-color: #ef5b9c;
    color: #FFF;
}
button[type="submit"].buttonLoginEasys:disabled,
input[type="button"].buttonLoginEasys:disabled,
input[type="submit"].buttonLoginEasys:disabled,
input[type="reset"].buttonLoginEasys:disabled {
    color: #BFBFBF;
    background-color: #dcdcdc;
}
/* 資産管理 */
.buttonMachineLoginEasys {
    width: 220px;
    height: 110px;
}
/* 島図ボタン */
.buttonSettingLoginEasys {
    display: inline-block;
    position: relative;
    padding: 0;
    width: 200px;
    height: 40px;
    background-color: #e4007f;
    border-radius: 5px;
    text-decoration: none;
}
.buttonSettingLoginEasys:before {
    content: " ";
    display: inline-block;
    position: absolute;
    z-index: 2;
    left: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 24px;
    height: 23px;
    background: url(../img/setting.png) no-repeat;
}
.buttonSettingLoginEasys:hover {
    background-color: #ef5b9c;
}
input[type="button"].buttonSettingLoginEasys {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    margin: 0;
    padding-left: 20px;
    width: 200px;
    height: 40px;
    background-color: transparent;
    color: #FFFFFF;
    font-size: 18px;
}
/* 文字色 */
.fcLoginEasys {
    color : #e4007f;
}
.fcLoginEasysLight {
    color : #ef5b9c;
}

/* 他社連携 */
.divAteru {
    border: #cd2c24 solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
table.tableAteru th {
    background-color: #222222;
    color: #E7151D;
}
table.tableAteru th a {
    color: #000000;
}
table.tableAteru th,
table.tableAteru td {
    border: solid 1px #CCCCCC;
}

.divGlory {
    border: #0D148D solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
.spnGlory {
    color: #0D148D;
    font-weight: bold;
}
table.tableGlory th {
    background-color: #0D148D;
    color: #FFFFFF;
}
table.tableGlory th a {
    color: #000000;
}
table.tableGlory th,
table.tableGlory td {
    border: solid 1px #CCCCCC;
}

.divSun {
    border: #005580 solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
.spnSun {
    color: #005580;
    font-weight: bold;
}
table.tableSun th {
    background-color: #005580;
    color: #FFFFFF;
}
table.tableSun th a {
    color: #000000;
}
table.tableSun th,
table.tableSun td {
    border: solid 1px #CCCCCC;
}

.divDmm {
    border: #000000 solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
.spnDmm {
    color: #000000;
    font-weight: bold;
}
table.tableDmm th {
    background-color: #000000;
    color: #FFFFFF;
}
table.tableDmm th a {
    color: #000000;
}
table.tableDmm th,
table.tableDmm td {
    border: solid 1px #CCCCCC;
}

.divDk {
    border: #12414F solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
table.tableDk th {
    background-color: #12414F;
    color: #FFFFFF;
}
table.tableDk th a {
    color: #000000;
}
table.tableDk th,
table.tableDk td {
    border: solid 1px #CCCCCC;
}

.divTora {
    border: #FF6600 solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
table.tableTora th {
    background-color: #FF6600;
    color: #FFFFFF;
}
table.tableTora th a {
    color: #000000;
}
table.tableTora th,
table.tableTora td {
    border: solid 1px #CCCCCC;
}

.divPbrain {
    border: #007fff solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
table.tablePbrain th {
    background-color: #007fff;
    color: #FFFFFF;
}
table.tablePbrain th a {
    color: #000000;
}
table.tablePbrain th,
table.tablePbrain td {
    border: solid 1px #CCCCCC;
}

.divPworld {
    border: #BA0C0C solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
}
table.tablePworld th {
    background-color: #BA0C0C;
    color: #FFFFFF;
}
table.tablePworld th a {
    color: #000000;
}
table.tablePworld th,
table.tablePworld td {
    border: solid 1px #CCCCCC;
}

.divUni {
    border: #009AE1 solid 3px;
    border-radius: 0.75em;
    background-color: #FFFFFF;
    margin:10px;
    padding:10px;
    text-align : center;
}
table.tableUni th {
    background-color: #009AE1;
    color: #000000;
}
table.tableUni th a {
    color: #000000;
}
table.tableUni th,
table.tableUni td {
    border: solid 1px #CCCCCC;
}

.chk_mark{
    padding: 5px;
}
.chk_mark::before{
    content: "";
    display: block;
    height: 7px;
    width: 13px;
    border-bottom: 4px solid #3cb371;
    border-left: 4px solid #3cb371;
    transform: rotate(-45deg);
}

.contact_on {
    float: left;
    color: #3cb371;
    font-weight: bold;
}
.contact_off {
    color: #db7093;
    font-weight: bold;
    font-size: 16px;
}

.divContactLink {
    background-color: #c6f0c6;
    border-radius: 0.75em;
}

.tblContactLink {
    background-color: #c6f0c6;
    border-radius: 0.75em;
}

.divContactUnlink {
    background-color: #F3D5CA;
    border-radius: 0.75em;
}

.tblContactUnlink {
    background-color: #F3D5CA;
    border-radius: 0.75em;
}

.pd0 {
    padding: 0;
}

/* 2024.01.15 Mizuno お問い合わせ内Q＆A */
.question {
    cursor: pointer;
    padding: 10px;
    margin: 5px 0;
    background-color: #fff8dc;
}
.answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-out;
    padding: 0 10px;
    margin: 5px 0;
}

/* 2024.10.23 Mizuno 検索内、フリーワードのポップアップ */
.fw-help-icon {
    width: 20px;
    height: 20px;
    background-color: #43B5DF;
    border-radius: 50%;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    line-height: 20px;
    position: relative;
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    top: -2px;
}

.fw-popup-content {
    display: none;
    position: absolute;
    width: auto;
    max-width: 95vw; 
    min-width: 310px;
    background-color: white;
    box-shadow: 0px 0px 5px #00000070;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid grey;
    left: 20px;
    bottom: 30px;
    z-index: 100;
    font-size: 12px;
    color: #808080;
    text-align: left;
    line-height: 1.8;
    white-space: normal; 
    overflow: hidden;
}

.fw-help-icon:hover .fw-popup-content {
    display: block;
}

.fw-label-with-icon {
    display: inline-block;
}

.fw-input-container {
    display: block; 
}

/* 2025.02.06 Mizuno No.38 History */
.history-selectbox {
    position: relative;
    z-index: 5;
}

.history-selectbox::before,
.history-selectbox::after {
    position: absolute;
    content: '';
    pointer-events: none;
}

.history-selectbox::before {
    display: inline-block;
    right: 0;
    width: 2.8em;
    height: 2.8em;
    border-radius: 0 3px 3px 0;
    background-color: #2589d0;
}

.history-selectbox::after {
    position: absolute;
    top: 50%;
    right: 1.4em;
    transform: translate(50%, -50%) rotate(45deg);
    width: 6px;
    height: 6px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
}

.history-selectbox select {
    appearance: none;
    min-width: 180px;
    height: 2.8em;
    padding: .4em 3.6em .4em .8em;
    border: none;
    border-radius: 3px;
    background-color: #f2f2f2;
    color: #333;
    font-size: 1em;
    cursor: pointer;
}

.history-selectbox select:focus {
    outline: 2px solid #2589d0;
}

/* 2025.03.10 Mizuno island-show */

.newMapAll {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 10px; /* ボタン内の余白を調整 */
    background-color: white;
    border: 3px solid #43B5DF;
    border-radius: 5px;
    transition: background-color 0.5s ease;
    font-weight: bold;
    cursor: pointer;
    height: 40px;
    margin: auto 10px auto auto;
    text-decoration: none !important; /* 下線を完全に削除 */
    color: #43B5DF !important;
    text-align: center;
    font-size: 14px; /* 文字サイズを適用 */
    width: auto;
}

/* ホバー時のボタンのスタイル */
.newMapAll:hover {
    background-color: #E0ECFF;
    border: 3px solid #43B5DF;
    text-decoration: none !important; /* ホバー時の下線を消す */
    color: #43B5DF !important;
}

.islandViewMode {
    font-size: 16px;
    line-height: 2;
    display: contents; 
}

.islandViewMode span {
    margin-right: 20px;
    display: inline-block;
}

.islandViewMode br {
    display: block;
    content: "";
}

.islandColorBox {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 7px;
}

.islandColorBox .islandRadioColumn .radioLabel {
    display: block;
    margin: 0 0 8px 0;
    padding: 0;
    line-height: 1.1;
    font-size: 14px;
    font-weight: bold;
    color: #848586;
}

.islandColorBox .islandSpanColumn span {
    display: inline-block;
    min-width: 100px !important;
    padding: 2px 12px;
    border: solid 1px #BBB;
    margin-right: 10px;
    margin-bottom: 5px !important;
    text-align: center;
}

.islandShowPagination {
    display: flex;
    gap: 20px;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 5px;
}

.islandShowPageBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border: 1px solid #ddd;
    background-color: #fff;
    color: #696969 !important;
    font-size: 16px;
    text-decoration: none;
    cursor: pointer;
    width: 200px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.islandShowPageBtn:hover {
    background-color: #e0e0e0;
    text-decoration: none;
    color: #696969 !important;
}

.islandShowPageBtn .islandShowArrow {
    font-size: 14px;
    margin: 0 5px;
    color: #696969 !important;
}

.islandShowCurrent {
    font-size: 16px;
    color: #696969 !important;
    font-weight: bold;
}

.checkbox-inline {
    display: flex;
    align-items: center;
}

.checkbox-inline input[type='checkbox'] {
    margin-right: 10px;
}

/* 2025.06.03 Mizuno No.51 ログインユーザー */
table.login_users {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

table.login_users th,
table.login_users td {
    border: 1px solid #DAE2E8;
    padding: 6px 8px;
    text-align: center;
    color: #A0A0A0;
}

table.login_users thead th {
    background-color: #FAFAFA;
    font-weight: bold;
    color: #A0A0A0;
}

table.login_users tbody tr:nth-child(even) td {
    background-color: #FAFAFA;
}

table.login_users tbody tr:nth-child(odd) td {
    background-color: transparent;
}

table.login_users th:last-child,
table.login_users td:last-child {
    text-align: right;
}

table.login_users .textRed {
    color: #D33; /* 少し落ち着いた赤（#D33 or #CC0000など） */
    /* font-weight: bold; 必要に応じて強調 */
}

/* 2025.06.03 Mizuno No.51 設置・在庫機種一覧スイッチ */
.machinesSwitch-wrapper {
    display: inline-flex;
    border: 1px solid #43B5DF;
    border-radius: 6px;
    overflow: hidden;
    font-size: 13px;
    }

.machinesSwitch-btn {
    padding: 5px 14px;
    text-decoration: none;
    color: #848586 !important;
    background-color: #fff;
    font-weight: 500;
    border: none;
    outline: none;
    transition: all 0.2s;
    display: inline-block;
    line-height: 1.5;
}

.machinesSwitch-btn:not(:last-child) {
    border-right: 1px solid #43B5DF;
}

.machinesSwitch-btn:hover {
    background-color: #e0e0e0;
    color: #848586;
    text-decoration: none;
}

.machinesSwitch-active {
    background-color: #43B5DF;
    color: #fff !important;
    text-decoration: none;
    pointer-events: none;
}

/* === 2025.06.16 Mizuno csv-hall-machines-container === */
.csv-hall-machines-container {
    display: flex;
    gap: 30px;
    align-items: flex-start;
    max-width: 1000px;
    margin: 0 auto; 
    font-size: 13px;
}

.csv-hall-machines-container .form-card {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 25px 30px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    flex: 1;
}

.csv-hall-machines-container .form-title {
    margin-top: 0;
    margin-bottom: 25px;
    font-size: 1.25rem;
    color: #1a1a1a;
    text-align: center;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

.csv-hall-machines-container .form-group {
    display: flex;
    margin-bottom: 15px;
    align-items: flex-start;
}

.csv-hall-machines-container .form-label {
    width: 80px;
    padding-top: 6px;
    color: #555;
    font-weight: 600;
    flex-shrink: 0;
}

.csv-hall-machines-container .form-controls {
    flex-grow: 1;
    text-align: left;
}

.csv-hall-machines-container .input-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.csv-hall-machines-container .date-input {
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 110px;
}

.csv-hall-machines-container .date-input:focus {
    outline: none;
    border-color: #84A832;
}

.csv-hall-machines-container .checkbox-group {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

.csv-hall-machines-container .checkbox-group label {
    margin-left: 8px;
}

.csv-hall-machines-container .checkbox-group input[type="checkbox"] {
    width: 15px;
    height: 15px;
}

.csv-hall-machines-container .checkbox-sub-group {
    margin-left: 10px;
    color: #666;
}

.csv-hall-machines-container .checkbox-sub-group input {
    margin-left: 5px;
}

.csv-hall-machines-container .checkbox-sub-group label {
    margin-left: 4px;
}

.csv-hall-machines-container .checkbox-list-container {
    border: 1px solid #e0e0e0;
    padding: 10px;
    background-color: #fafafa;
}

.csv-hall-machines-container .checkbox-list-container hr {
    border: none;
    border-top: 1px solid #e0e0e0;
    margin: 8px 0;
}

.csv-hall-machines-container .form-footer {
    text-align: center;
    margin-top: 20px;
}

/* 2025.07.02 Mizuno コンプリートアイコン */
.complete-icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0;
  line-height: 0;
  vertical-align: middle;
}

/* 未完了（点線の円＋青チェック） */
.complete-icon.incomplete {
  border: 1.5px dashed #43B5DF;
}

.complete-icon.incomplete::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 3px;
  border-left: 1.5px solid #43B5DF;
  border-bottom: 1.5px solid #43B5DF;
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* 完了（青背景＋白チェック） */
.complete-icon.complete {
  background-color: #43B5DF;
}

.complete-icon.complete::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 3px;
  border-left: 1.5px solid #ffffff;
  border-bottom: 1.5px solid #ffffff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.proc-status-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  margin-right: 10px;
}

.proc-label {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  margin: 0;
}