/* ボタン */
.btn{
    background: linear-gradient(to top,#ffffff, #d4d3d3);
    font-size: 14px;
    text-align: center;
    border: 1px solid #c8c8c8;
    width: 100px;
    height: 30px;
}

/* 無効化ボタン */
.btn-active{
    /* ICS:
	    background: linear-gradient(to top,#FFC0CB 0%,#fa7f95 50%,#FFC0CB 100%);
	    font-size: 14px;
	    text-align: center;
	    border: 1px solid #c8c8c8;
	    width: 100px;
	    height: 30px;
    */
    
    /* HMCS fds-btn--outlined.fds-btn--secondary */
    color: #7382be;
    border-color: #7382be;
    
    /* HMCS fds-btn--outlined */
    background-color: #fff;
    
    /* HMCS fds-btn--tiny */
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    line-height: 150%;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    display: flex;
    align-items: center;
    gap: 8px;
    
    /* HMCS fds-btn--outlined */
    background-color: #ffffff;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.14), 0px 2px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    
}
.btn-active:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    color: #9da8d2;
}

/* 有効化ボタン */
.btn-invalid{
    /* ICS:
        background: linear-gradient(to top,#b8c8ff 0%,#5c81ff 50%,#b8c8ff 100%);
        font-size: 14px;
        text-align: center;
        border: 1px solid #c8c8c8;
        width: 100px;
        height: 30px;
    */
    
    /* HMCS fds-btn--outlined.fds-btn--primary */
    color: #f57300;
    border-color: #f57300;
    
    /* HMCS fds-btn--outlined */
    background-color: #fff;
    
    /* HMCS fds-btn--tiny */
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    line-height: 150%;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    display: flex;
    align-items: center;
    gap: 8px;
    
    /* HMCS fds-btn--outlined */
    background-color: #ffffff;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.14), 0px 2px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    
}
.btn-invalid:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    color: #f69137;
}

/* 無効化ボタン（非活性） */
.btn-active-disabled{
    /* ICS:
        background: linear-gradient(to top,#fff0f5 0%,#FFC0CB 50%,#fff0f5 100%);
        font-size: 14px;
        text-align: center;
        border: 1px solid #c8c8c8;
        width: 100px;
        height: 30px;
        color:#888;
    */
    
    /* HMCS fds-btn--outlined.fds-btn--secondary:disabled */
    border-color : #e0e0e0;
    color : #bdbdbd;
    
    /* HMCS fds-btn--outlined */
    background-color: #fff;
    
    /* HMCS fds-btn--tiny */
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    line-height: 150%;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    display: flex;
    align-items: center;
    gap: 8px;
}
.btn-active-disabled:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    
}

/* 有効化ボタン（非活性） */
.btn-invalid-disabled{
    /* ICS:
        background: linear-gradient(to top,#f0f8ff 0%,#b8c8ff 50%,#f0f8ff 100%);
        font-size: 14px;
        text-align: center;
        border: 1px solid #c8c8c8;
        width: 100px;
        color:#888;
    */
    
    /* HMCS .fds-btn--outlined.fds-btn--primary:disabled */
    border-color : #e0e0e0;
    color : #bdbdbd;
    
    /* HMCS fds-btn--outlined */
    background-color: #fff;
    
    /* HMCS fds-btn--tiny */
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    line-height: 150%;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    display: flex;
    align-items: center;
    gap: 8px;
}   
.btn-invalid-disabled:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    
}

/** 一覧内のボタン */
.list-btn{
	width: 100%;
	height: 100%;
	padding: 0px;
    text-shadow: 0 0 1px rgb(0 0 0 / 70%);
    font-size: 14.5px;
    text-align: center;
}
/** 一覧内のボタン（拡張指定用） */
.table-row-btnEx {
	width: 60px;
}

/* ファイル選択ボタンラベル */
.file-btn {
    cursor: pointer; /* カーソルを指カーソルに変更*/
}

/* 検索条件 */
.radius-box {
    /* HMCSレイアウトに変更
        border: solid black 1px;
        border-radius: 5px;
        margin-top: 10px;
        margin-bottom: 10px;
    */
    
    background-color: rgb(227, 230, 242);
    display: flex;
    flex-direction: column;
    /* padding: 10px; */
    padding: 10px 10px 0 10px;
    border-color: rgb(224, 224, 224);
    border-style: solid;
    border-width: 1px;
}

/* 検索条件ラベル */
.text{
    width : 140px; 
    font-size: 14px; /*12px;*/
    line-height: 100%;
    color: rgb(73, 89, 156);
}
select{
    text-rendering: auto;
    /* color: -internal-light-dark(black, white); */
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: auto;
    box-sizing: border-box;
    align-items: center;
    white-space: pre;
    -webkit-rtl-ordering: logical;
    background-color: -internal-light-dark(rgb(255, 255, 255), rgb(59, 59, 59));
    cursor: pointer;
    margin: 0em;
    /* font: 400 13.3333px Arial; */
    border-radius: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133));
    border-image: initial;
    
    /* Chromeブラウザデフォルト指定の上書き */
    font-family: "Yu Gothic", YuGothic;
    font-size: 14px;
    font-weight: 500;
    color: #2c2e35;

}
select:disabled {
    cursor: default;
}
/* Chromeブラウザ専用指定　かつ　
   Chromeデフォルト指定と同じため、指定不要
select:not(:-internal-list-box) {
    overflow: visible !important;
}
*/

/*終わり*/
body {
    /* ICS:  background-color: #F5F5F5; */
    text-align: left;
    /* ICS:  padding-top: 20px; */
    font-family: "Yu Gothic", YuGothic; /* ICS: "Meiryo UI"; */
    font-size: 12px;
    line-height: 23px;
    color: rgb(0 0 0 / 87%);
    letter-spacing: 0;
    font-weight: 500;
    margin: 0;
}
pre {
    font-family: "Yu Gothic", YuGothic; /* ICS: "Meiryo UI"; */
    font-size: 12px;
    color: rgb(0 0 0 / 87%);
    font-weight: 500;
}
/* 画面前提 */
.wrapper {
    /* min-width: 1000px;
    min-height: 700px; */
    width: 98vw;
    /* ICS:  margin-left: 50px; */
    /* ICS:  border: 1px solid #000000; */
    display: flex;
}

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 15px;
    padding-bottom: 10px;
    background-color: #ffffff;
    width: 300px;
    min-width: 300px;
    max-width: 300px;
    border-right: 1px solid #000000;
    display: flex;
    flex-direction: column;
}
*/ 

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu h1 {
    background: #f0f0f0;
    font-size: 15px;
    font-weight: lighter; 
    padding: 10px;
    height: 80px;
    border: inset 1px #f0f0f0;
    border-radius: 5px;
}
*/ 


/* 機能別メインペイン */
.service {
    /* HMCSレイアウト対応により不要
        background-color: #ffffff;
        width: 1000px;
        max-width: 959px;
        padding-left: 10px;
        padding-right: 10px; 
    */
    /* padding: 12px 0px 0px 16px; */
    padding: 0px 0px 0px 16px;
    height: 100vh;
    width: calc(100% - 200px);
}

/* 機能フレーム */
.navi-frame {
    border:0;
    min-width: 900px;
    width: calc(100vw - 250px); /*84vw; */
    height: 94vh; /*calc(100vh - 45px);*/

}
/* 機能フレーム・縦サイズ中 */
.navi-frame-middle {
    height: calc(94vh - 48px) !important;
}

/* ヘッダメニュー */
#hulHeaderMenus {
    display: flex;
}
/* ヘッダメニュー下線 */
div.hul-header-menus-line {
    margin-top: 5px;
    margin-right: 5px;
    width: calc(100vw - 250px);

    /* 下線 */
    border-bottom-width: 3px;
    border-bottom-color: rgba(33,33,33,0.05); /*#212121; 透過 0.05 */
    border-bottom-style: solid;
}
button {
    cursor: pointer;
}
button:disabled {
    cursor: default;
}
/* ヘッダ・戻るボタン */
button.hul-head-return-btn {
    height: 38px;
    width: 142px;
    line-height: 15px;
    font-size: clamp(10px, 1vw, 14px);
}
/* ヘッダメニュー・ボタン */
button.hul-head-menu-btn {
    /* 表示文言 */
    font-size: clamp(10px, 1vw, 14px);
    font-weight: 400;
    box-sizing: border-box;
    text-align-last: justify;
    text-justify: inter-ideograph;
    color: #9E9E9E;
    line-height: 15px;

    /* ボタンサイズ */
    padding-left: 2px;
    padding-right: 2px;
    height: 38px;
    width: 98px;
    
    /* ボタンデザイン */
    background: white;
    border: none;
}
/* ヘッダメニュー・ボタン・クリック後 */
button.hul-head-menu-btn-click {
    /* 表示文言 */
    color: #212121;

    /* 下線 */   
    border-bottom-width: 3px !important;
    border-bottom-color: #F57300 !important;
    border-bottom-style: solid !important;
}

/* フッター */
div.hul-footer {
    border-top-width: 1px;
    border-top-color: rgb(189, 189, 189);
    border-top-style: solid;
    /* padding: 10px 0px; */
    /* margin: 10px 36px; */
    width: calc(100vw - 250px); /* 80vw; */
    height: 26px;
}
/* フッター（copy right） */
.copyright-box {
    text-align: right;
    
    font-size: 12px;
    line-height: 20px; /* 170%; */
    color: rgb(117, 117, 117);

    margin-block-start: 6px;
    margin-block-end: 0;
}
.service p small{
    color: #FFFFFF;
    text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.3);
    padding-right: 5px;
}

/* xxx HMCS不要 xxx（以前から未使用）.service h2 {
    text-align: left;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.3);
    font-size: 20px;
    padding-left: 20px;
    height: 40px;
}*/

/* 機能別-画面タイトル */
.title h2 {
    font-size: 24px;
    /* line-height: 170%; */
    font-weight: 500;
    /* margin-top: 10px; */
    margin-top: 22px;
    margin-bottom: 10px;
}

/* xxx HMCS不要 xxx（HMCSメニューに置換）.logout-btn {
    background: linear-gradient(to top,#ffffff, #d4d3d3);
    font-size: 14px;
    text-align: center;
    border: 1px solid #c8c8c8;
    width: 100px;
    height: 30px;
    float: right;
}*/

/* xxx HMCS不要 xxx（以前から未使用）.acd-check{
    display: none;
}*/

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu-element {
    margin: 20px;
    font-size: 16px;
    display: none;
}*/

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu-area {
    height: 600px;
    border-radius: 5px;
    background-color: #f0f0f0;
    border: inset 1px #f0f0f0;
}*/

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu_button {
    font-size: 18px;
    font-weight: 600; 
    width: 150px;
    height: 30px;
    vertical-align: bottom;
}*/


/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu_list {
    height: 0px;
    font-size: 14px;
    visibility: hidden;
    margin-left: 20px;
}*/

/* xxx HMCS不要 xxx（HMCSメニューに置換）.menu-details-p{
    font-size: 14px;
    margin-left:15px;
}*/

/* サマリー（行の開閉）設定 */
summary {
    cursor: pointer; /* カーソルを指カーソルに変更 */
}

/* サイドメニューの開閉アイコン */
.hul-summary::after {
    cursor: pointer; /* カーソルを指カーソルに変更*/
}

/* 機能別コンテンツ-親 */
.service-content {
    display: flex;
    /* HMCSレイアウト対応により不要
        justify-content: center;
        background-color: #f0f0f0;
        border: inset 1px #f0f0f0;
        border-radius: 5px;
    */
    /* height: 76%; */
}

/* 機能別コンテンツ-子 */
.service-elements{
    width: 95%;
    /* HMCSレイアウト対応により不要
        padding-top:10px;
        padding-bottom:10px;
    */
    height: calc(100vh - 64px); /* 88.4vh; */
}

/*１行分の表示 */
.flex-record{
    margin:6px auto;
    width:85%;
    display:flex;
    justify-content: space-between
}

/*１項目分の表示 */
.record-sec{
    width: 42%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.record-sec-top{
    margin-top: 4px;
    align-items: start !important;
}
.record-sec p{
    margin:0px;
    font-size: 14px;
    color: rgb(73, 89, 156); /* HMCS */
    /* padding: 6px 0px; */
    margin-top: 6px;
    margin-bottom: 6px;
}
/*項目の注意書き用*/
.record-sec-notes{
    font-size: 10px;
}

/* グリッド */
.hul-input-column {
    display: grid;
    row-gap: 6px; /* 16px;*/
    column-gap: 16px;
}
.hul-input-column--col4 {
    grid-template-columns: repeat(4, minmax(50%, 1fr));
    width: 48%;
}
.hul-input-column--col4_span_1_4 {
    grid-column: 1 / 4;
}
.hul-input-column--col4_span_1_5 {
    grid-column: 1 / 5;
}
.hul-input-column--col4_span_2_5 {
    grid-column: 2 / 5;
}
.hul-input-column--col4_span_3_4 {
    grid-column: 3 / 4;
}
.hul-input-column--col4_span_3_5 {
    grid-column: 3 / 5;
}
.hul-input-column--col4_span_4_5 {
    grid-column: 4 / 5;
}
.hul-input-column--col5 {
    grid-template-columns: repeat(5, minmax(38%, 1fr));
    width: 48%;
}
.hul-input-column--col5_span_2_6 {
    grid-column: 2 / 6;
}
.hul-input-column p{
    margin:0px;
    font-size: 14px;
    color: rgb(73, 89, 156); /* HMCS */
    /* padding: 6px 0px; */
    margin-top: 6px;
    margin-bottom: 6px;
}

/* 入力欄（テキストボックス） */
input.record-sec-text{
    width: 172px;
    height: 22px; /* ICS: 16px; */
    
    /* padding: 8px; */
    border-width: 1px;
    background-color: #fff;
    color: #2c2e35;
    line-height: 150%;
    border-radius: 4px;
    border-color: #bdbdbd;
    border-style: solid;

    /* Chromeブラウザデフォルト指定の上書き */
    font-family: "Yu Gothic", YuGothic;
    font-size: 14px;
    font-weight: 500;

}
/* 入力欄（テキストボックス）非活性 */
input.record-sec-text:disabled{
    background-color : #fafafa;
    color : #bdbdbd;
    -webkit-text-fill-color: #bdbdbd;   /* オートフィル（-webkit-autofill）の文字色を上書きする */
    /* pointer-events : none; */
}
/* テキストボックス（日付）:カレンダーアイコン
   テキストボックス（時間）:時計アイコン 
   chrome、edge: アイコンあり
   firefox     : アイコンなし（制御適用外）*/
input::-webkit-calendar-picker-indicator {
    cursor: pointer;  /* カーソルを指カーソルに変更 */
}

/* チェックボックス */
input[type="checkbox"] {
    cursor: pointer;  /* カーソルを指カーソルに変更 */
}
/* チェックボックスが非活性の場合 */ 
input:disabled[type="checkbox"] {
    cursor: default;  /* カーソルを矢印カーソルに変更 */
} 

/* ラジオボタン */
input[type="radio"] {
    cursor: pointer;  /* カーソルを指カーソルに変更 */
}
/* ラジオボタンが非活性の場合 */
input:disabled[type="radio"] {
    cursor: default;  /* カーソルを矢印カーソルに変更 */
} 

/* 入力欄（ラベル） */
p.record-sec-text{
    width: 172px;
    height: 22px; /* ICS: 16px; */
    color: #2c2e35;
}

/* 入力欄（ドロップダウン） */
.record-sec-list{
    width: 178px; /* ICS: 180px; */
    height: 26px; /* ICS: 22px; */
    
    position: relative;
    border-color: #bdbdbd;
    border-style: solid;
    border-width: 1px;
    background-color: #fff;
    text-align: left;
    font-size: 14px; /* 12px; */
    line-height: 170%;
    /* padding: 8px; */
    /* height: 40px; */
    /* width: 100%; */
    border-radius: 4px;
}
/* 入力欄（ドロップダウン）非活性 */
input.record-sec-list:disabled{
    background-color : #fafafa;
    color : #bdbdbd;
}
/* 入力欄（テキスト付ドロップダウン） */
.chosen-container {
    /* chosenデフォルト指定の上書き */
    font-size: 14px !important;
}

.record-sec-date{
    width: 175px;
    height: 19px;
}

.sub-title{
	/* text-align: center; */
	font-size: 15px;
	margin-left: 10px;
    margin-bottom: 10px;
}

/*csvボタン*/
.csv{
    margin-top: 5px;
    text-align: right;
}
.csv-btn{
    height:26px;
    width: 50px;
}

.csv-detail{
    margin-left: 12px;
    text-align: right;
}

.csv-detail-btn {
    width: 100px !important;
    margin-left: 5px;
}

/* ボタン右上配置 */
.btn-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width:91vw;
}
.btn-bar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width:91.5vw;
    margin: 5px;
}
/* 検索ボタン */
#search-btn {
    width: 100px !important;
}
/* 新規登録ボタン */
#signin-btn {
    width: 100px !important;
    margin-inline-start: 16px;
    margin-inline-end: 0 !important;
}


/* 一覧ブロック */
.block{
    margin-top:5px;
    width:100%;
    font-size: 12px;
	overflow-x: scroll;
}
.jtable{
    /* ICS:
       border-collapse: collapse;
       border-spacing: 0;
       border: 1px solid #C8C8C8;
    */
    width:100%;
    word-break:break-word;
    
    background-color: #ffffff;
    border-collapse: separate;
    border-spacing: 0;
    
}

.table-header{
    display: block;
    position: relative;
}
.table-header table thead{
    /* background: url(../../lightcolor/bg-thead.png) repeat-x scroll top left #dddddd; */
    /* ICS:
        border-top: 1px solid #fff;
        border-bottom: 1px solid #C8C8C8;
    */
    font-family: "Yu Gothic", YuGothic; /* 未設定ワーニング対策のための仮設定 */
}
.table-header table thead tr th{
    /* ICS: background: linear-gradient(#ffffff 50%, #d4d3d3);*/
    /* ICS: font-size: 12px; */
    /* text-align: center; */
    /* ICS: border: 1px solid #c8c8c8; */

    height: 40px;
    padding: 0 24px;
    font-size: 14px;
    font-weight: 700;
    line-height: 130%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0,0,0,0.03);
    background-color: #eee;
    
}

/* 一覧-データ部 */
.scroll-box{
    overflow-y: scroll;
    /* min-height: 150px; */
	height: calc(100vh - 320px); 
}

thead{
    display: table-header-group;
    vertical-align: middle;
    border-color: inherit;
}
tbody{
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}
tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
    height:30px;
}

.scroll-box table thead{
    /* ICS:
        background: repeat-x scroll top left #dddddd;
        border-top: 1px solid #fff;
        border-bottom: 1px solid #C8C8C8; */
    font-family: "Yu Gothic", YuGothic; /* 未設定ワーニング対策のための仮設定 */
}

.table-data-header{
    display: none;
}

/* 一覧データ部：行レイアウト */
.table-data-row {
    /* ICS:
        padding: 2px;
        background: #f8f8f8;
        height: 30px; */
    height: 40px;
    
}
/* 一覧データ部：セルレイアウト */
.table-data-row td {
    /* padding: 5px;  ←この指定があるとテーブルの列幅がずれる （ナカ追記：ずれは別が原因です）  */ 
    /* ICS: border-left: 1px dotted #bebebe; */
    
    padding: 0 24px;
    font-size: 14px;
    line-height: 170%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0,0,0,0.03);
    
    /* display: table-cell; */
    /* vetical-align: inherit; */
}
/* 一覧セル（遷移あり） */
.table-data-trns  {
    cursor: pointer; /* カーソルを指カーソルに変更　*/
}
/* 一覧データ部：行レイアウト：偶数行（デフォルト） */
.table-row-even {
    /* ICS: background: #f0f0f0; */
    font-family: "Yu Gothic", YuGothic; /* 未設定ワーニング対策のための仮設定 */
}
/* 一覧データ部：行レイアウト：奇数行（薄青） */
.table-row-odd-blue {
    background: #ebedfc;
}
/* 一覧データ部：行レイアウト：偶数行（薄青） */
.table-row-even-blue {
    background: #dce0fa;
}
/* 一覧データ部：隠し行レイアウト */
.table-row-none {
    display: none;
    padding: 0;
}

/*
ページング
*/
.pages-btn{
    width: 35px;
    height: 20px;
    margin: 5px 5px 0 5px;
    background-color: #fff;
    border: #555 solid 1px;
    padding: 0px;
}
.pages-btn-current{
    background-color: #acc2ec;
}
.flex-between{
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 20px;
    height: 20px;
}

/* 
ダイアログ
*/
#modal-overlay {
    /* ICS:
        z-index:1;
        display:none;
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background-color:rgba(30,144,255,0.20);
    */
    
    /* HMCS:fds-dialog-container */
    position:fixed;
    z-index:100;
    padding:40px;
    justify-content:center;
    background: #00000033;
    align-items:center;
    
    display: none;  /* flex; */
    width:100%;
    top:0px;
    left:0px;
    height:100vh;
    
}

div.dialog {
    display: none;  /* 初期表示は非表示 */
    /* ICS: 
        position: fixed; 
        z-index:2;
        left: 1200px;
        top: 500px;
    */
    width: 400px;
    height: 150px;
    /* ICS:
        margin-left: -500px;
        margin-top: -100px;
        background-color: gainsboro;
        border-radius: 5px;
    */
    text-align: center;
    
    /* HMCS */
    z-index:200;
    position: absolute;
    left: 0; /*200px; 240px; */
    top:  0;
    bottom: 0;
    right: 200px;
    margin: auto;
        
    /* HMCS:fds-dialog-container--fade-in */
    animation:fadeIn 0.5s ease 0s 1 normal;
    
    /* HMCS:fds-dialog--message */
    background-color: #fafafa;
    border-radius: 8px;
    
    /* HMCS:fds-dialog*/
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.2);
    padding: 32px;
    /* position: relative; */
    
    /* HMCS:fds-content-small--regular */
    font-size: 14px;
    line-height: 170%;
    font-weight: 500;
    
}

/* HMCS: font-content-base--bold */
#check {
    font-size: 16px;
    line-height: 170%;
    font-weight: 700;
}
/* HMCS ICSから使用されていない */
div.dialog-big {
    top: 350px;
    width: 700px;
    height: 350px;
}

/* HMCS ICSから使用されていない */
.dialog div,.dialog-big div{
    display: flex;
    justify-content: center;
}

div.dialog-qr {
    display: none;  /* 初期表示は非表示 */
    width: 450px;
    height: 350px;
    text-align: center;

    /* HMCS */
    z-index:200;
    position: absolute;
    left: 280px; /*200px; 240px; */
    top:  0;
    bottom: 0;
    right: 200px;
    margin: auto;
        
    /* HMCS:fds-dialog-container--fade-in */
    animation:fadeIn 0.5s ease 0s 1 normal;
    
    /* HMCS:fds-dialog--message */
    background-color: #fafafa;
    border-radius: 8px;
    
    /* HMCS:fds-dialog*/
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.2);
    padding: 32px;
    /* position: relative; */
    
    /* HMCS:fds-content-small--regular */
    font-size: 14px;
    line-height: 170%;
    font-weight: 500;
}

/* ダイアログテキスト */
.secret-key-text {
    width: 90%;
    margin:0 auto;
    text-align: left;
}

/*
ダイアログボタン
*/
.no {
    width: 100px;
    /* height: 25px; */
    /* border-radius: 5px; */
    margin-left: 20px;
    
    /* HMCS fds-btn--outlined.fds-btn--secondary */
    color: #7382be;
    border-color: #7382be;
    
    /* HMCS fds-btn--outlined */
    background-color: #fff;
    
    /* HMCS fds-btn--large*/
    font-family: Yu Gothic;
    font-size: 14px;
    line-height: 150%;
    font-weight: 700;
    height: 44px;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    /* height: 32px;*/
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    /* display: flex; */
    align-items: center;
    gap: 8px;
    
    /* HMCS fds-btn--outlined */
    background-color: #ffffff;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.14), 0px 2px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    
}
.no:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    color: #9da8d2;
}


.yes{
    width: 100px;
    /* height: 25px; */
    /* border-radius: 5px; */
    margin-right: 20px;
    
    /* HMCS fds-btn--contained.fds-btn--primary */
    border-color: #f57300;
    background-color: #f57300;
    
    /* HMCS fds-btn--large*/
    font-family: Yu Gothic;
    font-size: 14px;
    line-height: 150%;
    font-weight: 700;
    height: 44px;
    
    /* HMCS fds-btn */
    align-items: center;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    /* height: 32px;*/
    justify-content: center;
    padding: 0 10px;
    cursor: pointer;
    
    /* HMCS fds-btn__content */
    /* display: flex; */
    align-items: center;
    gap: 8px;
    
    /* HMCS fds-btn--contained */
    color: #ffffff;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.14), 0px 2px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
    
}
.yes:hover {
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14), 0px 2px 2px 0px rgba(0,0,0,0.12), 0px 1px 3px 0px rgba(0,0,0,0.2);
    background-color: #f5a000;
    border-color: #f5a000;
    color:white; /* #f69137; */
}
/*
.counts {
    margin: 5px 0px 0px 0px;
}
*/

/* D1400:ダイアログ設定 */
.modal-overlay-base {
    /* HMCS:fds-dialog-container */
    position:fixed;
    padding:40px;
    justify-content:center;
    background: #00000033;
    align-items:center;
    
    display: none;  /* flex; */
    width:100%;
    top:0px;
    left:0px;
    height:100vh;
}
#modal-overlay-top {
    z-index:90;
}
#hulMainFrame {
    z-index:89;
    position: relative;
    background: white;
}
#modal-overlay-iframebk {
    z-index: 88;
}
#division-dialog-top{
    display: none;  /* 初期表示は非表示 */
    text-align: center;
    
    /* HMCS */
    z-index:200;
    position: absolute;
    left: 30px;
    top:  50px;
    width: 1170px;
    /* height: 550px; */
    
    /* HMCS:fds-dialog-container--fade-in */
    animation:fadeIn 0.5s ease 0s 1 normal;
    
    /* HMCS:fds-dialog--message */
    background-color: #fafafa;
    border-radius: 8px;
    
    /* HMCS:fds-dialog*/
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.2);
    padding: 32px;
    /* position: relative; */
    
    /* HMCS:fds-content-small--regular */
    font-size: 14px;
    line-height: 170%;
    font-weight: 500;
    
}

#division-body-display{
	display: block;
	width: 100%;
}

#division-body-msg{
	text-align: left;
	/* ICS: margin-left: 30px; */
	/* ICS: margin-right: 30px; */
	/* ICS: background-color: white; */
    margin-bottom: 10px;
	padding-top: 10px;
}


.dialogMsgB-table{
    border-spacing: 0;
}
.dialogMsgB-table-tr-herder{
	height: 25px;
}

.dialogMsgB-table-ip{
	width: 13%;
}
.dialogMsgB-table-port{
	width: 18%;
}
.dialogMsgB-table-ditail{
	padding-left: 5px;
}

.dialogMsgB-span{
	display: inline-block;
	width: 180px;
}

.dialogMsgB-table {
	margin-top: 5px;
	margin-left: 40px;
	margin-right: 40px;
	margin-bottom: 20px;
	border-right: 1px solid #333;
    border-bottom: 1px solid #333;
}

.dialogMsgB-table td{
    border-top: 1px solid #333;
    border-left: 1px solid #333;
	vertical-align: top;
	padding-left: 5px;
}
.dialogMsgB-table-td-2row{
	margin-top: 5px;
}


/*ローディング*/
#loading {
    display: flex; /* table;*/
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #fff;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* 透明度なしとする opacity: 0.8; */
}
/*   
#loading .loadingMsg {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: 100px;
    height:100px;
    padding-top: 140px;
    background: url("../images/loading.gif") center center no-repeat; 
}*/
#loading .loadingMsg {
    /*   .hul-loading__label { */
    margin-bottom:48px;
    text-align:center;
    color:#757575;
    font-size:32px;
    line-height:170%;
    font-weight:50;
    width: 150px;
    padding-left: 4px;

    
    /* position: absolute; */
    /* top: 33%;  50%; */
    /* left: 45%; 50%; */
    /* margin-right: -50%; */
    /* transform: translate(-50%, -50%); */
}


#hul-loading__spinner {
    width: 150px;
    /* position: absolute; */
    /* top: 40%;   50%; 
    left: 40%; 50%; */
    /* margin-right: -50%; */
    /* transform: translate(-50%, -50%); */
 
    animation: hul-loading-anime 3s linear infinite;
}
#hul-loading__spinner-inner   {
    stroke-dasharray : 300;
    stroke-dashoffset : 0;
    stroke-linecap : round;
    stroke-miterlimit : 10;
    stroke-width : 10;
    fill : transparent;
    stroke : #5aaaaa;  /* #51BBA7;  */
    animation : hul-loading-circle-anime 2s linear infinite
}
@keyframes hul-loading-anime {
    0% { transform: rotate(0); }
    100% { transform: rotate(360deg);}
}
@keyframes hul-loading-circle-anime {
    0% { stroke-dashoffset: 0}
    100% { stroke-dashoffset: -600;}
}

/*
    パスワード
*/
.password-div{
    position: relative;
}
.password-toggle{
    position: absolute;
    top: 3px;
    left: 80%;
    -webkit-user-drag: none;
    cursor: pointer;
}

.password-toggle:disabled {
    cursor: default;
}
/*
    チェックボックス
*/
.record-sec-checkbox{
    width: 100% !important;
    justify-content: left !important;
}
.checkbox-div-top{
    margin-bottom: 0px;
}
.checkbox-div-middle{
    margin-top:0px;
    margin-bottom:0px;
}
.checkbox-div-under{
    margin-top: 0px;
}
.checkbox-div-on-text{
    display: flex;
    justify-content: flex-start;
    align-self: flex-start;
    align-items: center;
    /* ICS: margin-left: 10px; */
}
.checkbox-div-on-text-over-child{
    position: absolute;
}
.checkbox-div-on-text-over-parent{
    position: relative;
}

/* トースト */
.hul-toast {
    display: flex;
    font-size:14px;
    line-height:170%;
    font-weight:500;
    padding:8px 16px;
    min-height:56px;
    width:430px;
    justify-content:space-between;
    border-radius:8px;
    /* box-shadow:0px 8px 10px 0px rgba(0,0,0,0.14)
          ,0px 3px 14px 0px rgba(0,0,0,0.12)
          ,0px 4px 5px 0px rgba(0,0,0,0.2);
     */

    /* display:none;*/
    position: absolute;
    top: 30px;
    /* left: 30px; */
    z-index: 300;

    /* HMCS:fds-dialog--message */
    background-color: #fafafa;
    
    /* HMCS:fds-dialog*/
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.2);
   

}
.hul-toast-anime--success {
    animation: slideInAnime 1.6s ease
              ,fadeOutAnime 1.6s ease 3.6s;
}
.hul-toast-anime--error {
    animation: slideInAnime 1.6s ease
              ,fadeOutAnime 1.6s ease 5s;
}
.hul-toast-anime--info {
    animation: slideInAnime 1.6s ease
              ,fadeOutAnime 1.6s ease 5s;
}
.hul-toast-anime--warning {
    animation: slideInAnime 1.6s ease
              ,fadeOutAnime 1.6s ease 5s;
}
@keyframes slideInAnime {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeOutAnime {
    0% { opacity: 1; }
    100% { opacity: 0; }
}


.hul-toast--title-only {
    align-items:center;
}    
.hul-toast__icon {
    padding-top:10px;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 24px 24px;
    margin-left: 4px;
}
.hul-toast__message-area {
    width:calc(100% - 52px);
}
.hul-toast__message {
    margin-left: 14px;
}
pre.hul-toast__message {
    font-family: "Yu Gothic", YuGothic; /* ICS: "Meiryo UI"; */
    font-size:14px;
    color: rgb(0 0 0 / 87%);
    font-weight: 500;
    /* overflow-x: auto; */
}
.hul-toast__action {
    color:#f57300;
    cursor:pointer;
}
.hul-toast__close {
    padding-top:4px;
}
.hul-toast__close-button {
    padding:0;
    cursor:pointer;
    background-color:transparent;
    border:0
}
.hul-toast__close-button:focus {
    outline:0
}



/* アイコン */
.hul-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    margin-left: 4px;
  
  }

/* アイコン：閉じる（Xマーク） */
.hul-toast__close-button {
    background-image: url('../images/hmcs/hul-ic_close.svg');
}
/* アイコン：トースト：成功 */
.hul-toast__icon--success {
    background-image: url('../images/hmcs/hul-ic_check_green.svg');
}
/* アイコン：トースト：失敗 */
.hul-toast__icon--error {
    background-image: url('../images/hmcs/hul-ic_do_not_disturb_alt_orange.svg');
}
/* アイコン：トースト：情報 */
.hul-toast__icon--info {
    background-image: url('../images/hmcs/hul-ic_info_outline_blue.svg');
}
/* アイコン：トースト：警告 */
.hul-toast__icon--warning {
    background-image: url('../images/hmcs/hul-ic_warning_orange.svg');
}

/* 項目補足ラベル */
div.hul-info-val-block {
    display:flex;
    flex-direction: column;
}
span.hul-info-label {
    position: relative;
    font-size:12px;
    color: rgb(73, 89, 156);
    top: -6px;
    left: -2px;
}
span.hul-info-label::before {
    position: relative;
    top:10px;
    left: 4px;
    display: inline-block;
    width: 20px;
    height: 20px;
    content: '';
    background: url('../images/hmcs/hul-ic_info_outline_blue.svg') no-repeat;
    background-size: contain;
}


/* 吹き出し */
.balloonPar {
    position: relative;                  /* 指定した分だけ相対的に移動 */
}
.balloonPar:hover .balloon {
    display: inline;                     /* インライン要素として表示 */
}
/* --- 吹き出し ------------------ */
.balloon {
    display: none;                        /* 要素を非表示 */
    position: absolute;                   /* 親要素を基準 */
    padding: 2px;                         /* テキストの前後の余白 */
    background-color: rgba(246, 255, 127, 0.941);  /* 背景色（透明度） */
    width: max-content;                          /* 吹き出し全体の幅 */
    left : 0%;                           /* 表示位置 */
    top : 100%;                           /* 表示位置 */
    margin-top : 12px;                    /* 表示位置 */
    font-size: 100%;                       /* 文字サイズ */
    border-style: solid;
    border-width: 1px;
    z-index: 2;
}
.balloon:after{
    border-bottom: 12px solid  rgba(246, 255, 127, 0.941);  /* 吹き出し口の高さ・色 */
    border-left: 10px solid transparent;   /* 吹き出し口の幅１／２ */
    border-right: 10px solid transparent;  /* 吹き出し口の幅１／２ */
    top: -12px;                            /* 吹き出し口の位置調整 */
    left : 5%;                         /* 吹き出し口の横位置 */
    content: "";                       /* コンテンツの挿入 */
    position: absolute;                /* 親要素を基準 */
}



/* ボタン-共通 */
.hul-btn {
    align-items:center;
    border-radius:4px;
    border-style:solid;
    border-width:1px;
    display:inline-flex;
    height:32px;
    justify-content:center;
    padding:0 10px;
    cursor:pointer;
}
/* ボタン内要素 */
.hul-btn__content {
    display:flex;
    align-items:center;
    gap:8px;
}
/* ボタン-サイズ */
.hul-btn--large {
    height:44px;
    font-family:Yu Gothic;
    font-size:14px;
    line-height:150%;
    font-weight:700;
}
.hul-btn--medium {
    height:32px;
    font-family:Yu Gothic;
    font-size:12px;
    line-height:150%;
    font-weight:700;
}
.hul-btn--small {
    height:24px;
    font-family:Yu Gothic;
    font-size:12px;
    line-height:150%;
    font-weight:700;
}
.hul-btn--tiny {
    height:20px;
    font-family:Yu Gothic;
    font-size:12px;
    line-height:150%;
    font-weight:700;
}

/* ボタン-contained-共通 */
.hul-btn--contained {
    color:#fff;
    box-shadow:0px 0px 2px 0px rgba(0,0,0,0.14),0px 2px 2px 0px rgba(0,0,0,0.12),0px 1px 3px 0px rgba(0,0,0,0.2);
}
.hul-btn--contained.hul-btn--large {
    min-width:200px;
}

/* ボタン-塗りタイプ-プライマリ */
.hul-btn--contained.hul-btn--primary {
    border-color:#f57300;
    background-color:#f57300;
}
.hul-btn--contained.hul-btn--primary:hover {
    border-color:#f5a000;
    background-color:#f5a000;
}
.hul-btn--contained.hul-btn--primary:active {
    border-color:#f5be00;
    background-color:#f5be00;
}
.hul-btn--contained.hul-btn--primary:disabled {
    color:#bdbdbd;
    border-color:#e0e0e0;
    background-color:#e0e0e0;
}

/* ボタン-外枠タイプ-共通 */
.hul-btn--outlined {
    background-color:#fff;
}

/* ボタン-外枠タイプ-セカンダリ */
.hul-btn--outlined.hul-btn--secondary {
    color:#7382be;
    border-color:#7382be;
}
.hul-btn--outlined.hul-btn--secondary:hover {
    color:#9da8d2;
    border-color:#9da8d2;
}
.hul-btn--outlined.hul-btn--secondary:active {
    border-color:#49599c;
    color:#49599c;
}
.hul-btn--outlined.hul-btn--secondary:disabled {
    border-color:#e0e0e0;
    color:#bdbdbd;
}

/* マージン制御 */
.hul-mb-8 {
    margin-bottom:8px;
}
.hul-mt-8 {
    margin-top:8px;
}
.hul-mt-16 {
    margin-top:16px;
}
.hul-mr-16 {
    margin-right:16px;
}


.hul-form-container--full-width {
    width:98%;
}
.hul-form-container--full-width .hul-form-input {
    width:98%;
}
.hul-flex {
    display:flex;
}
.hul-flex--column {
    flex-direction:column;
}
.hul-flex--align-end {
    align-items:flex-end;
}
.hul-full-width {
    width:100%;
}


/* ラベル */
.hul-form-label {
    font-family:Yu Gothic;
    font-size:12px;
    line-height:100%;
    font-weight:500;
    align-items:center;
    color:#49599c;
    display:flex;
    gap:8px;
    margin-bottom:6px;
}
.hul-label--gray {
    color:#424242;
}

/* テキストボックス */
.hul-form-input {
    padding:8px;
    border-width:1px;
    background-color:#fff;
    color:#2c2e35;
    font-family:inherit;
    font-size:14px;
    line-height:150%;
    font-weight:500;
    border-radius:4px;
    border-color:#bdbdbd;
    border-style:solid;
}
.hul-form-input:focus {
    border-color:#f57300;
    outline:0;
}
.hul-form-input:hover {
    border-color:#616161;
}
.hul-form-input-icon-container {
    position:relative;
}
.hul-form-input--regular .hul-form-input-icon--left {
    left:8px;
}
.hul-form-input--large .hul-form-input-icon--left {
    left:16px;
}    

/* コンテンツ-フッタ */
.service-content .hul-content__footer {
    margin-top:48px;
    width:100%;
}

.required-text {
    position: relative;
    left: -28px;
}

.required-text::before {
    /* 文字化けを起こす可能性があるので、unicodeで記載 */
    content: "\5FC5\9808";
    color: #EB4600;
}


/* ボタン枠（左右揃え） */
.btn-area {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
}
/* ボタン枠内・右揃え */
.btn-area-right {
    text-align: right;
}
/* ボタン枠内・ボタン間の余白 */
.btn-area-right .btn {
    margin-left: 10px;
}
/* 下部のボタン枠 */
#bottom-btn-area {
    padding-top: 10px;
    padding-bottom: 10px;
}


/* 項目グループ内要素・タイトル枠 */
.radius-title-area {
    display: flex;
    justify-content: space-between;
    padding:10px;
}
/* 項目グループ内要素・タイトル文言 */
.radius-title-h3 {
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 5px;
}

/* 「ファイルを選択」疑似ボタン・枠 */
.file-dummy-btn {
    width: 110px;
    height: 30px;
}
/* 「ファイルを選択」疑似ボタン・文言 */
#file-dummy-btn-title {
    color: black;
    margin: 4px 4px 4px 0px;
}
/* 「ファイルを選択」疑似ボタン・補足・枠 */
#hul-info-div {
    padding-top: 6px;
}
/* 「ファイルを選択」疑似ボタン・補足・アイコン */
#file-dummy-btn-info::before {
    top:8px;
}