@charset "UTF-8";

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
リセット
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

html,
body {
  width: 100%;
}
html,
body,
div,
span,
object,
iframe {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
dl,
dt,
dd,
ol,
ul,
li {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
fieldset,
form,
label,
legend {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  color: #333;
  background: transparent;
  transition: opacity 0.3s;
}
a:hover {
  opacity: 0.7;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
}
th,
td {
  vertical-align: top;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
img {
  border: 0;
  vertical-align: bottom;
}
pre {
  padding: 30px;
  background-color: #f4f4f4;
  margin-top: 15px;
}
pre strong {
  color: #f00;
}
body {
  color: #333;
  font-weight: 300;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
    "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
レイアウト
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*-------------------------------------------------------------
スクロールボックス
-------------------------------------------------------------*/
.scrollBox {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
#main > .scrollBox {
  height: 100vh !important;
  overflow: auto;
}
.contentScroll {
  height: 100%;
  overflow: auto;
}

/*-------------------------------------------------------------
グリッド分割パターン（メインコンテンツ）
-------------------------------------------------------------*/

/*1列3行_中央可変*/
.grid1-3 {
  /*height: calc(100vh - 70px);*/
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2" "g3";
}
.grid1-3 > .top {
  grid-area: g1;
  box-sizing: border-box;
}
.grid1-3 > .middle {
  grid-area: g2;
  box-sizing: border-box;
}
.grid1-3 > .bottom {
  grid-area: g3;
  margin-bottom: 0;
  box-sizing: border-box;
}

/*1列2行_2行目可変*/
.grid1-2 {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
}
.grid1-2 > .top {
  grid-area: g1;
  box-sizing: border-box;
}
.grid1-2 > .bottom {
  grid-area: g2;
  box-sizing: border-box;
  overflow-y: auto;
  height: 100%;
  position: relative;
}
.grid1-2 > .bottom > .inner {
  height: 100%;
}

/*1列2行_1行目可変*/
.grid1-2-2 {
  height: 100%;
  display: grid;
  grid-template-rows: 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
}
.grid1-2-2 > .top {
  grid-area: g1;
  box-sizing: border-box;
  overflow-y: auto;
  height: 100%;
  position: relative;
}
.grid1-2-2 > .bottom {
  grid-area: g2;
  box-sizing: border-box;
}
.grid1-2-2 > .top > .inner {
  height: 100%;
}

/*1列2行_可変*/
.grid1-2-3 {
  height: 100%;
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
}
.grid1-2-3 > .top {
  grid-area: g1;
  box-sizing: border-box;
  overflow-y: hidden;
  position: relative;
}
.grid1-2-3 > .bottom {
  grid-area: g2;
  box-sizing: border-box;
  overflow-y: hidden;
  position: relative;
}
.grid1-2-3 > .top > .inner {
  height: 100%;
}
.grid1-2-3 > .bottom > .inner {
  height: 100%;
}

/*-------------------------------------------------------------
ボックス分割パターン
-------------------------------------------------------------*/
.box {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.box > .col {
  overflow-x: visible;
}
.box > .col > .inner {
  padding: 30px 30px 20px;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 6px;
}
.box.flexStart {
  justify-content: flex-start;
}

/*box1 _ 100%*/
.box1 {
  display: block !important;
  background-color: transparent;
}
.box1 > .col {
}

/*box2-1 _ 50:50*/
.box2-1 {
  background-color: transparent;
}
.box2-1 > .col {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 20px) / 2);
  max-width: calc((100% - 20px) / 2);
  margin-top: 20px;
}
.box2-1 > .col:nth-of-type(-n + 2) {
  margin-top: 0;
}

/*box2-2 _ 40:60*/
.box2-2 {
  background-color: transparent;
}
.box2-2 > .col {
  margin-top: 20px;
}
.box2-2 > .col:first-of-type {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 20px) * 0.4);
  max-width: calc((100% - 20px) * 0.4);
}
.box2-2 > .col:last-of-type {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 20px) * 0.6);
  max-width: calc((100% - 20px) * 0.6);
}
.box2-2 > .col:nth-of-type(-n + 2) {
  margin-top: 0;
}

/*box2-3 _ 60:40*/
.box2-3 {
  background-color: transparent;
}
.box2-3 > .col {
  margin-top: 20px;
}
.box2-3 > .col:first-of-type {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 20px) * 0.6);
  max-width: calc((100% - 20px) * 0.6);
}
.box2-3 > .col:last-of-type {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 20px) * 0.4);
  max-width: calc((100% - 20px) * 0.4);
}
.box2-3 > .col:nth-of-type(-n + 2) {
  margin-top: 0;
}

/*box2-4 _ 左可変:300px固定*/
.box2-4 {
  background-color: transparent;
}
.box2-4 > .col {
  margin-top: 20px;
}
.box2-4 > .col:first-of-type {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
}
.box2-4 > .col:last-of-type {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 320px;
  max-width: 320px;
  margin-left: 20px;
}
.box2-4 > .col:nth-of-type(-n + 2) {
  margin-top: 0;
}

/*box3-1 _ 33:33:33*/
.box3-1 {
  background-color: transparent;
}
.box3-1 > .col {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 40px) / 3);
  max-width: calc((100% - 40px) / 3);
  margin-top: 20px;
}
.box3-1 > .col:nth-of-type(-n + 3) {
  margin-top: 0;
}

/*box3-2 _ 25:50:25*/
.box3-2 {
  background-color: transparent;
}
.box3-2 > .col {
  margin-top: 20px;
}
.box3-2 > .col:nth-of-type(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 40px) * 0.25);
  max-width: calc((100% - 40px) * 0.25);
}
.box3-2 > .col:nth-of-type(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 40px) * 0.5);
  max-width: calc((100% - 40px) * 0.5);
}
.box3-2 > .col:nth-of-type(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc((100% - 40px) * 0.25);
  max-width: calc((100% - 40px) * 0.25);
}
.box3-2 > .col:nth-of-type(-n + 3) {
  margin-top: 0;
}

/*最下部（余白なし）*/
.box.footer {
  margin-bottom: 0;
}

/*背景白枠なし*/
.noBg {
  padding: 0 !important;
  background-color: transparent !important;
  border-radius: 0 !important;
}

/*白枠*/
.bg {
  padding: 30px !important;
  background-color: #fff;
  box-sizing: border-box;
}

/*ボックス見出し*/
.colTtl {
  width: 100%;
  margin-bottom: 20px;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
}
.colTxt {
  width: 100%;
  margin-bottom: 20px;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6em;
}

/*白枠・グレー枠*/
.pd20W {
  padding: 20px !important;
  background: #fff !important;
  box-sizing: border-box;
}
.pd30W {
  padding: 30px !important;
  background: #fff !important;
  box-sizing: border-box;
}
.pd20G {
  padding: 20px !important;
  background: var(--bgColor) !important;
  box-sizing: border-box;
}
.pd40G {
  padding: 40px !important;
  background: var(--bgColor) !important;
  box-sizing: border-box;
}
.pdRBL20W {
  padding: 0 20px 20px !important;
  background: #fff !important;
  box-sizing: border-box;
}
.pdTRL20W {
  padding: 20px 20px 0 !important;
  background: #fff !important;
  box-sizing: border-box;
}

/*-------------------------------------------------------------
非表示
-------------------------------------------------------------*/

/*display none*/
.none {
  display: none !important;
}

/*背景非表示*/
.bgNon {
  background: none !important;
  padding-left: 0 !important;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
共通要素
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*リンク*/
#main a {
  color: var(--mainColor);
}

/*リンクボタン*/
a.linkBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 35px;
  padding: 0 25px;
  font-size: 0.875rem;
  color: var(--fontcolorBtn) !important;
  font-weight: 500;
  text-decoration: none;
  border-radius: 4px;
  background-color: var(--mainColor);
  box-sizing: border-box;
  transition: opacity 0.3s;
}
a.linkBtn:hover {
  opacity: 0.7;
}
a.linkBtn.disabled {
  opacity: 0.3;
  pointer-events: none;
}
a.linkBtn.btnBlack {
  background-color: var(--subColor);
}

/*注意文・赤文字*/
.emphasis {
  color: var(--attentionColor);
}

/*------------------------------------------------------------
下方余白
-------------------------------------------------------------*/
.btnArea > .inner,
.tabList > .inner,
.tableArea > .inner,
.formGroup > .inner {
  margin-bottom: 10px;
}
.box.footer .inner {
  margin-bottom: 0;
}

/*------------------------------------------------------------
幅
-------------------------------------------------------------*/

/*汎用*/
.w1em {
  width: 1em !important;
}
.w2em {
  width: 2em !important;
}
.w3em {
  width: 3em !important;
}
.w4em {
  width: 4em !important;
}
.w5em {
  width: 5em !important;
}
.w6em {
  width: 6em !important;
}
.w7em {
  width: 7em !important;
}
.w8em {
  width: 8em !important;
}
.w9em {
  width: 9em !important;
}
.w10em {
  width: 10em !important;
}
.w11em {
  width: 11em !important;
}
.w12em {
  width: 12em !important;
}
.w13em {
  width: 13em !important;
}
.w14em {
  width: 14em !important;
}
.w15em {
  width: 15em !important;
}
.w16em {
  width: 16em !important;
}
.w17em {
  width: 17em !important;
}
.w18em {
  width: 18em !important;
}
.w19em {
  width: 19em !important;
}
.w20em {
  width: 20em !important;
}
.w21em {
  width: 21em !important;
}
.w22em {
  width: 22em !important;
}
.w23em {
  width: 23em !important;
}
.w24em {
  width: 24em !important;
}
.w25em {
  width: 25em !important;
}
.w30em {
  width: 30em !important;
}
.w31em {
  width: 31em !important;
}
.w32em {
  width: 32em !important;
}
.w33em {
  width: 33em !important;
}
.w10per {
  width: 10% !important;
}
.w20per {
  width: 20% !important;
}
.w25per {
  width: 25% !important;
}
.w30per {
  width: 30% !important;
}
.w33per {
  width: 33% !important;
}
.w40per {
  width: 40% !important;
}
.w50per {
  width: 50% !important;
}
.w60per {
  width: 60% !important;
}
.w70per {
  width: 70% !important;
}
.w80per {
  width: 80% !important;
}
.w90per {
  width: 90% !important;
}
.w100per {
  width: 100% !important;
}
.h100per {
  height: 100% !important;
}

/*------------------------------------------------------------
マージン
-------------------------------------------------------------*/

/*全方向*/
.maS {
  margin: 3px !important;
}
.maM {
  margin: 5px !important;
}
.maL {
  margin: 8px !important;
}
.maXL {
  margin: 10px !important;
}
.maXXL {
  margin: 15px !important;
}
.maXXXL {
  margin: 20px !important;
}
.maXXXXL {
  margin: 25px !important;
}
.maNon {
  margin: 0 !important;
}

/*上*/
.mtS {
  margin-top: 3px !important;
}
.mtM {
  margin-top: 5px !important;
}
.mtL {
  margin-top: 8px !important;
}
.mtXL {
  margin-top: 10px !important;
}
.mtXXL {
  margin-top: 15px !important;
}
.mtXXXL {
  margin-top: 20px !important;
}
.mtXXXXL {
  margin-top: 25px !important;
}
.mtNon {
  margin-top: 0 !important;
}

/*右*/
.mrS {
  margin-right: 3px !important;
}
.mrM {
  margin-right: 5px !important;
}
.mrL {
  margin-right: 8px !important;
}
.mrXL {
  margin-right: 10px !important;
}
.mrXXL {
  margin-right: 15px !important;
}
.mrXXXL {
  margin-right: 20px !important;
}
.mrXXXXL {
  margin-right: 25px !important;
}
.mrNon {
  margin-right: 0 !important;
}

/*下*/
.mbS {
  margin-bottom: 3px !important;
}
.mbM {
  margin-bottom: 5px !important;
}
.mbL {
  margin-bottom: 8px !important;
}
.mbXL {
  margin-bottom: 10px !important;
}
.mbXXL {
  margin-bottom: 15px !important;
}
.mbXXXL {
  margin-bottom: 20px !important;
}
.mbXXXXL {
  margin-bottom: 25px !important;
}
.mbNon {
  margin-bottom: 0 !important;
}

/*左*/
.mlS {
  margin-left: 3px !important;
}
.mlM {
  margin-left: 5px !important;
}
.mlL {
  margin-left: 8px !important;
}
.mlXL {
  margin-left: 10px !important;
}
.mlXXL {
  margin-left: 15px !important;
}
.mlXXXL {
  margin-left: 20px !important;
}
.mlXXXXL {
  margin-left: 25px !important;
}
.mlNon {
  margin-left: 0 !important;
}

/*------------------------------------------------------------
パディング
-------------------------------------------------------------*/

/*全方向*/
.paS {
  padding: 3px !important;
}
.paM {
  padding: 5px !important;
}
.paL {
  padding: 8px !important;
}
.paXL {
  padding: 10px !important;
}
.paXXL {
  padding: 15px !important;
}
.paXXXL {
  padding: 20px !important;
}
.paNon {
  padding: 0 !important;
}

/*上*/
.ptS {
  padding-top: 3px !important;
}
.ptM {
  padding-top: 5px !important;
}
.ptL {
  padding-top: 8px !important;
}
.ptXL {
  padding-top: 10px !important;
}
.ptXXL {
  padding-top: 15px !important;
}
.ptXXXL {
  padding-top: 20px !important;
}
.ptNon {
  padding-top: 0 !important;
}

/*右*/
.prS {
  padding-right: 3px !important;
}
.prM {
  padding-right: 5px !important;
}
.prL {
  padding-right: 8px !important;
}
.prXL {
  padding-right: 10px !important;
}
.prXXL {
  padding-right: 15px !important;
}
.prXXXL {
  padding-right: 20px !important;
}
.prNon {
  padding-right: 0 !important;
}

/*下*/
.pbS {
  padding-bottom: 3px !important;
}
.pbM {
  padding-bottom: 5px !important;
}
.pbL {
  padding-bottom: 8px !important;
}
.pbXL {
  padding-bottom: 10px !important;
}
.pbXXL {
  padding-bottom: 15px !important;
}
.pbXXXL {
  padding-bottom: 20px !important;
}
.pbNon {
  padding-bottom: 0 !important;
}

/*左*/
.plS {
  padding-left: 3px !important;
}
.plM {
  padding-left: 5px !important;
}
.plL {
  padding-left: 8px !important;
}
.plXL {
  padding-left: 10px !important;
}
.plXXL {
  padding-left: 15px !important;
}
.plXXXL {
  padding-left: 20px !important;
}
.plNon {
  padding-left: 0 !important;
}

/*------------------------------------------------------------
角丸
-------------------------------------------------------------*/
.cRAll {
  border-radius: 6px !important;
}
.cRT {
  border-top-left-radius: 6px !important;
  border-top-right-radius: 6px !important;
}
.cRTL {
  border-top-left-radius: 6px !important;
}
.cRTR {
  border-top-right-radius: 6px !important;
}
.cRB {
  border-bottom-right-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}
.cRBR {
  border-bottom-right-radius: 6px !important;
}
.cRBL {
  border-bottom-left-radius: 6px !important;
}
.cRNon {
  border-radius: 0 !important;
}
.cRTNon {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.cRTLNon {
  border-top-left-radius: 0 !important;
}
.cRTRNon {
  border-top-right-radius: 0 !important;
}
.cRBNon {
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.cRBRNon {
  border-bottom-right-radius: 0 !important;
}
.cRBLNon {
  border-bottom-left-radius: 0 !important;
}

/*-------------------------------------------------------------
フォームパーツ
-------------------------------------------------------------*/

/*エラー*/
.errorBox {
  margin-top: 4px;
  color: #f30;
  font-size: 0.9rem;
}
select.error {
  border: 3px solid #f30 !important;
  border-radius: 5px;
}
input.error::placeholder {
  background-color: transparent !important;
}
input[type="text"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="password"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="date"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="search"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="tel"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="email"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
input[type="number"].error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
.radioBtn.error label {
  border-top: 3px solid #f30 !important;
  border-bottom: 3px solid #f30 !important;
}
.radioBtn.error label:nth-of-type(1) {
  border-left: 3px solid #f30 !important;
}
.radioBtn.error label:nth-last-of-type(1) {
  border-right: 3px solid #f30 !important;
}
.checkboxBtn.error label {
  border: 3px solid #f30 !important;
}
.error input[type="checkbox"] + label.checkBox:after {
  border: 1px solid #f30 !important;
}
.error label.radioBox:after {
  border: 1px solid #f30 !important;
  border: none;
}
textarea.error {
  border: 3px solid #f30 !important;
  background-color: #ffe9e4 !important;
}
.fileBtn.error label span {
  border: 3px solid #f30 !important;
}
input[type="checkbox"].error {
  outline-color: #f30 !important;
}

/*基本形*/
input[type="text"] {
  height: 35px;
  padding: 0 10px;
  font-size: var(--fontsizeMain);
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
}
input[type="text"]::placeholder {
  color: #d7d7d7;
  background-color: #fff;
}
input[type="text"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
/*input[type="text"]:read-only { background-color: var(--bgColor); }*/
input[type="button"] {
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  color: var(--fontcolorBtn);
  font-weight: 500;
  line-height: 1;
  border: none;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: var(--mainColor);
  cursor: pointer;
  transition: opacity 0.3s;
}
input[type="button"]:hover {
  opacity: 0.7;
}
input[type="password"] {
  margin: 0;
  -webkit-appearance: none;
  font-weight: 300;
  display: inline-block;
  width: 100%;
  height: 35px;
  padding: 0 10px;
  border-radius: 3px;
  box-sizing: border-box;
  resize: vertical;
  vertical-align: middle;
  position: relative;
  font-size: 100%;
  overflow: auto;
  border-width: 1px;
  border-style: solid;
  border-color: #ccc;
  color: #333;
}
input[type="password"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
input[type="password"]::placeholder {
  color: #d7d7d7;
}
input[type="date"] {
  height: 35px;
  padding: 0 30px 0 10px;
  font-size: var(--fontsizeMain);
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
  background: url("../images/ico_date.svg") no-repeat right 10px center;
  background-size: 19px 19px;
  background-color: #fff;
}
input[type="date"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
/*input[type="date"]:read-only { background-color: var(--bgColor); }*/
input[type="date"]::placeholder {
  color: #d7d7d7;
}
input[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
}
input[type="search"] {
  height: 35px;
  padding: 0 10px;
  font-size: var(--fontsizeMain);
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
}
input[type="search"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
/*input[type="search"]:read-only { background-color: var(--bgColor); }*/
input[type="search"]::placeholder {
  color: #d7d7d7;
  background-color: #fff;
}
input[type="search"]:focus {
  outline-offset: -2px;
}
input[type="tel"] {
  height: 35px;
  padding: 0 10px;
  font-size: var(--fontsizeMain);
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
}
input[type="tel"]::placeholder {
  color: #d7d7d7;
  background-color: #fff;
}
input[type="tel"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
/*input[type="tel"]:read-only { background-color: var(--bgColor); }*/
input[type="submit"] {
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  color: var(--fontcolorBtn);
  font-weight: 500;
  line-height: 1;
  border: none;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: var(--mainColor);
  cursor: pointer;
  transition: opacity 0.3s;
}
input[type="submit"]:hover {
  opacity: 0.7;
}
input[type="email"] {
  height: 35px;
  padding: 0 10px;
  font-size: var(--fontsizeMain);
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
}
input[type="email"]::placeholder {
  color: #d7d7d7;
  background-color: #fff;
}
input[type="email"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
/*input[type="email"]:read-only { background-color: var(--bgColor); }*/
input[type="number"] {
  width: 80px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  display: inline-block;
  line-height: 1;
  font-size: var(--fontsizeMain) !important;
  white-space: nowrap;
  height: 35px;
  padding: 0 10px 0 10px !important;
  margin: 0; /*background-image: url("../images/ico_arrow_down.svg"); background-position: right 12px center; background-size: 10px 6px; background-repeat: no-repeat;*/
  box-sizing: border-box;
  cursor: text;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}
input[type="number"]:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
}
select {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  display: inline-block;
  line-height: 1;
  font-size: var(--fontsizeMain) !important;
  white-space: nowrap;
  height: 35px;
  padding: 0 35px 0 10px !important;
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../images/ico_arrow_down.svg");
  background-position: right 12px center;
  background-size: 10px 6px;
  background-repeat: no-repeat;
  box-sizing: border-box;
  cursor: pointer;
  max-width: 100%;
}
select::-ms-expand {
  display: none;
}
select[multiple] {
  vertical-align: top;
}
select:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
textarea {
  margin: 0;
  -webkit-appearance: none;
  font-weight: 300;
  display: inline-block;
  width: 100%;
  padding: 10px;
  border-radius: 3px;
  box-sizing: border-box;
  resize: vertical;
  vertical-align: middle;
  position: relative;
  font-size: 100%;
  overflow: auto;
  border-width: 1px;
  border-style: solid;
  border-color: #ccc;
}
textarea::placeholder {
  color: #d7d7d7;
}
textarea:disabled {
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
}
input + span,
select + span {
  display: inline-block;
  margin-left: 10px;
  font-size: 0.9375rem;
  font-weight: 500;
}

/*フォーカス*/
input:focus,
select:focus,
textarea:focus {
  outline: 0;
  border-color: var(--mainColor);
  box-shadow: 0 0 0 1px var(--mainColor) inset;
}

/*ボタン*/
button {
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  color: var(--fontcolorBtn);
  font-weight: 500;
  line-height: 1;
  border: none;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: var(--mainColor);
  cursor: pointer;
  transition: opacity 0.3s;
}
button:hover {
  opacity: 0.7;
}
button.delete {
  padding: 0 15px !important;
  background-color: var(--cautionColor) !important;
}
button.cancel {
  background-color: var(--cancelColor) !important;
}
button.return {
  background-color: var(--cancelColor) !important;
}
button.save {
  background-color: var(--mainColor) !important;
}
button.pdf {
  background-color: var(--subColor) !important;
}
button.pdf span {
  padding: 2px 0 2px 25px;
  background: url("../images/ico_pdf_white.svg") no-repeat left 0 center;
  background-size: 17px 20px;
}
button.export {
  background-color: #7280ff !important;
  margin-right: 10px;
}
button.export span {
  padding-left: 20px;
  background: url("../images/ico_export_folder.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}
button.import {
  background-color: #f3acff !important;
  margin-right: 10px;
}
button.import span {
  padding-left: 20px;
  background: url("../images/ico_import_folder.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}
button.download {
  background-color: var(--subColor) !important;
}
button.download span {
  padding-left: 20px;
  background: url("../images/ico_download_white.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}
button.register {
  font-size: var(--fontsizeBtn);
  background-color: var(--addColor);
}
button.register span {
  line-height: 1;
}
button.register.newAdd span {
  padding-left: 22px;
  background: url("../images/ico_plus.svg") no-repeat left 0 top 2px;
  background-size: 16px 16px;
}
button.registerS {
  height: 28px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  background-color: var(--addColor);
}
button.registerS span {
  line-height: 1;
}
button.registerS.newAdd span {
  padding-left: 18px;
  background: url("../images/ico_plus.svg") no-repeat left 0 top 3px;
  background-size: 13px 13px;
}
.tabBox .register {
  position: absolute;
  top: -10px;
  right: 0;
}
.tableTtlBox button.registerS {
  margin-top: -10px;
}
button.btnBlack {
  background-color: var(--subColor);
}
button:disabled {
  opacity: 0.5;
  cursor: default;
}
button.trash {
  width: 20px;
  height: 25px;
  text-indent: -9999px;
  background: url("../images/ico_trash.svg") no-repeat center;
  background-size: 20px 25px;
}
button.downloadS {
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  border: 1px solid var(--borderColor);
  background: #fff url("../images/ico_download_s.svg") no-repeat center;
  background-size: 16px 15px;
}
button.deleteS {
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  border: 1px solid var(--borderColor);
  background: #fff url("../images/ico_trash_s.svg") no-repeat center;
  background-size: 12px 15px;
}
button.attention {
  background-color: var(--attentionColor) !important;
}
button.contactBtn {
  width: 250px;
  height: 44px;
}
input.delete {
  padding: 0 15px !important;
  background-color: var(--cautionColor) !important;
}
input.cancel {
  background-color: var(--cancelColor) !important;
}
input.return {
  background-color: var(--cancelColor) !important;
}
input.save {
  background-color: var(--mainColor) !important;
}
input.pdf {
  background-color: var(--subColor) !important;
}
input.pdf span {
  padding: 2px 0 2px 25px;
  background: url("../images/ico_pdf_white.svg") no-repeat left 0 center;
  background-size: 17px 20px;
}
input.download {
  background-color: var(--subColor) !important;
}
input.download span {
  padding-left: 20px;
  background: url("../images/ico_download_white.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}
input.register {
  font-size: var(--fontsizeBtn);
  background-color: var(--addColor);
}
input.register span {
  line-height: 1;
}
input.register.newAdd span {
  padding-left: 22px;
  background: url("../images/ico_plus.svg") no-repeat left 0 top 2px;
  background-size: 16px 16px;
}
input.registerS {
  height: 28px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  background-color: var(--addColor);
}
input.registerS span {
  line-height: 1;
}
input.registerS.newAdd span {
  padding-left: 18px;
  background: url("../images/ico_plus.svg") no-repeat left 0 top 3px;
  background-size: 13px 13px;
}
.tableTtlBox input.registerS {
  margin-top: -10px;
}
input.btnBlack {
  background-color: var(--subColor);
}
input:disabled {
  opacity: 0.5;
  cursor: default;
}
input.trash {
  width: 20px;
  height: 25px;
  text-indent: -9999px;
  background: url("../images/ico_trash.svg") no-repeat center;
  background-size: 20px 25px;
}

/*ラジオボタン_テキスト型*/
input[type="radio"] {
  border: none;
  top: -2px;
  margin-right: 5px;
  cursor: pointer;
}
input[type="radio"]:checked + label.radioBox:before {
  opacity: 1;
}
label.radioBox {
  box-sizing: border-box;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0 12px 0 30px;
  vertical-align: middle;
  cursor: pointer;
}
label.radioBox:empty {
  padding: 12px 12px 12px 13px;
}
label.radioBox:before {
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 8px;
  display: block;
  margin-top: -6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  content: "";
  opacity: 0;
  z-index: 1;
  background-color: #3b4043;
}
label.radioBox:after {
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;
  left: 4px;
  display: block;
  margin-top: -10px;
  width: 16px;
  height: 16px;
  content: "";
  border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  border-color: #d1d1d1;
  background-color: #fff;
}
label.radioBox:hover:after {
  border-color: var(--mainColor);
}
input[type="radio"][disabled] {
  cursor: default;
}
input[type="radio"][disabled] + label.radioBox {
  cursor: default;
  color: #bbb;
}
input[type="radio"][disabled] + label.radioBox:hover:after {
  border-color: #ddd;
}
input[type="radio"][checked][disabled] + label.radioBox {
  cursor: default;
}

/*ラジオボタン_ボタン型*/
.radioBtn {
  display: flex;
  border-radius: 4px;
}
.radioBtn input[type="radio"] {
  display: none;
}
.radioBtn label {
  display: flex;
  align-items: center;
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  font-weight: 500;
  line-height: 1;
  border-top: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
  border-right: 1px solid var(--borderColor);
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s;
  background-color: #fff;
}
.radioBtn label:first-of-type {
  border-left: 1px solid var(--borderColor);
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.radioBtn label:last-of-type {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.radioBtn label:hover {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.radioBtn label span {
  padding-left: 3px;
}
.radioBtn input[type="radio"]:checked + label {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.radioBtn input[type="radio"][disabled] + label {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: #d7d7d7;
}
.radioBtn input[type="radio"][disabled] + label:hover {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: #d7d7d7;
  border-color: var(--borderColor);
}
.radioBtn input[type="radio"][checked][disabled] + label {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
}
.radioBtn input[type="radio"][checked][disabled] + label:hover {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}

/*チェックボックス_テキスト型*/
input[type="checkbox"] {
  border: none;
  top: -2px;
  margin-left: 3px;
  margin-right: 8px;
  cursor: pointer;
  outline-width: 3px;
  outline-style: solid;
  outline-color: #f5f5f5;
}
input[type="checkbox"]:checked + label.checkBox:before {
  opacity: 1;
}
label.checkBox {
  box-sizing: border-box;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  margin-bottom: 3px;
  padding: 0 12px 0 30px;
  line-height: 20px;
  vertical-align: middle;
  cursor: pointer;
}
label.checkBox:empty {
  padding: 12px 12px 12px 13px;
}
label.checkBox:before {
  transition: opacity 0.1s linear;
  position: absolute;
  top: 6px;
  left: 8px;
  display: block;
  width: 12px;
  height: 9px;
  content: "";
  opacity: 0;
  z-index: 1;
  background: url("../images/ico_check_checkbox.svg") no-repeat center;
  background-size: 12px 9px;
}
label.checkBox:after {
  transition: border-color 0.1s linear;
  position: absolute;
  top: 0;
  left: 4px;
  display: block;
  width: 20px;
  height: 20px;
  content: "";
  border-width: 1px;
  border-style: solid;
  border-color: #959ea7;
  background-color: #fff;
  border-radius: 4px;
  box-sizing: border-box;
}
label.checkBox:hover:after {
  border-color: var(--mainColor);
}
input[type="checkbox"][disabled] + label.checkBox {
  cursor: default;
  color: #bbb;
}
input[type="checkbox"][disabled] + label.checkBox:after {
  border-color: rgba(149, 158, 167, 0.5);
}
input[type="checkbox"][disabled] + label.checkBox:hover:after {
  border-color: rgba(149, 158, 167, 0.5);
}
input[type="checkbox"][checked][disabled] + label.checkBox {
}

/*チェックボックス_ボタン型*/
.checkboxBtn {
  display: flex;
}
.checkboxBtn input[type="checkbox"] {
  display: none;
}
.checkboxBtn label {
  display: flex;
  align-items: center;
  height: 35px;
  margin-right: 5px;
  padding: 0 15px 1px;
  font-size: var(--fontsizeBtn);
  font-weight: 500;
  line-height: 1;
  border: 1px solid var(--borderColor);
  border-radius: 4px;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s;
  background-color: #fff;
}
.checkboxBtn label:first-of-type {
}
.checkboxBtn label:last-of-type {
  margin-right: 0;
}
.checkboxBtn label:hover {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.checkboxBtn input[type="checkbox"]:checked + label {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.checkboxBtn input[type="checkbox"][disabled] + label {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: #d7d7d7;
}
.checkboxBtn input[type="checkbox"][disabled] + label:hover {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: #d7d7d7;
  border-color: var(--borderColor);
}
.checkboxBtn input[type="checkbox"][checked][disabled] + label {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
}
.checkboxBtn input[type="checkbox"][checked][disabled] + label:hover {
  cursor: default;
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}

/*ソートボタン*/
.dlListBox {
  display: inline-flex;
  align-items: center;
  border-radius: 4px;
}
.dlListBox dt {
  margin-right: 10px;
  font-size: 0.9375rem;
  font-weight: 500;
}
.dlListBox input[type="checkbox"] {
  display: none;
}
.dlListBox input[type="radio"] {
  display: none;
}
.dlListBox label {
  display: flex;
  align-items: center;
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  font-weight: 500;
  line-height: 1;
  border-top: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
  border-right: 1px solid var(--borderColor);
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s;
}
.dlListBox label:first-of-type {
  border-left: 1px solid var(--borderColor);
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.dlListBox label:last-of-type {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.dlListBox label:hover {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.dlListBox input[type="checkbox"]:checked + label {
  color: var(--fontcolorBtn);
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}

/*ファイル選択ボタン*/
.fileBtn input[type="file"] + label {
  height: 35px;
  padding: 0 15px;
  font-size: var(--fontsizeBtn);
  color: var(--fontcolorBtn);
  font-weight: 500;
  line-height: 35px;
  border: none;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: var(--subColor);
  cursor: pointer;
  transition: opacity 0.3s;
}
.fileBtn input[type="file"] + label span {
  padding: 2px 0 2px 20px;
  background: url("../images/ico_upload_white.svg") no-repeat left 0 center;
  background-size: 14px 14px;
}
.fileBtn input[type="file"] + label:hover {
  opacity: 0.7;
}

/*フォームエリア*/
.formTitle.ttlImp,
.colTtl.ttlImp {
  position: relative;
  padding-left: 10px;
}
.formTitle.ttlImp:before,
.colTtl.ttlImp:before {
  content: "*";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  margin-right: 3px;
  font-size: 0.9375rem;
  color: var(--cautionColor);
  line-height: 1;
}
.partsBox label {
  cursor: pointer;
}

/*フォームエリア*/
.formGroup .inner:last-of-type .partsBox {
  margin-right: 0;
}

/*フォームエリア_インライン*/
.formBlockLine {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.formBlockLine .formTitle {
  margin-bottom: 5px;
  font-size: var(--fontsizeTtl);
  font-weight: 500;
}
.formBlockLine .partsBox {
  margin-right: 20px;
  font-size: var(--fontsizeMain) !important;
  display: flex;
  align-items: center;
}
.formBlockLine > .inner {
  margin-bottom: 10px;
}

/*フォームエリア_ブロック*/
.formBlock {
  display: block;
}
.formBlock .formTitle {
  margin-bottom: 5px;
  font-size: var(--fontsizeTtl);
  font-weight: 500;
}
.formBlock .partsBox {
  font-size: var(--fontsizeMain) !important;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.formBlock .inner {
  margin-bottom: 10px;
}
#firsthearing .formBlock .inner {
  margin-bottom: 20px;
}
#firsthearing .formBlock .partsBox > div > .inner:nth-last-of-type(1) {
  margin-bottom: 0;
}

/*選択項目をブロックにしたい場合*/
.partsBox.partsBlock {
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.partsBox.partsBlock label {
  width: 100%;
  margin-bottom: 5px;
}

/*選択項目を2列にしたい場合*/
.partsBox.partsBlock2 {
  display: inline-block;
  flex-wrap: wrap;
  width: 50%;
  position: relative;
  z-index: 1;
}
.partsBox.partsBlock2 label {
  width: 100%;
  margin-bottom: 5px;
}

/*日付*/
.datetime-reset-button {
  padding-inline: 10px;
}

/*期日アイコン*/
.partsBox.date input[type="text"] {
  font-size: var(--fontsizeMain);
  background: url("../images/ico_date.svg") no-repeat right 10px center;
  background-size: 19px 19px;
  background-color: #fff;
  cursor: pointer;
}
.datePicker input.dateCalander {
  font-size: var(--fontsizeMain);
  background: url("../images/ico_date.svg") no-repeat right 10px center;
  background-size: 19px 19px;
  background-color: #fff;
  cursor: pointer;
}
.partsBox.date .formTitle {
  padding-left: 20px;
  background: url("../images/ico_clock.svg") no-repeat left 0 center;
  margin-right: 5px;
}
.partsBox.date input[type="text"]:disabled {
  background-image: none;
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
  cursor: auto;
}
.partsBox.date .vc-popover-content-wrapper {
  z-index: 25;
}

/*ツールチップ_テキスト*/
.tooltip {
  display: inline-block;
  width: 21px;
  height: 21px;
  position: relative;
  margin-right: 8px;
  padding: 0;
  cursor: pointer;
  background-color: transparent;
  background: url("../images/ico_tooltip.svg") no-repeat center;
  background-size: 21px 21px;
}
.tooltip .outer {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: calc(100% + 10px);
  top: -20px;
  display: inline-block;
  padding: 15px;
  white-space: nowrap;
  font-size: 0.9375rem;
  line-height: 1.3;
  background-color: var(--subColor);
  box-shadow: 0px 0px 15px -6px rgba(0, 0, 0, 0.1);
  color: #fff;
  border-radius: 5px;
  cursor: default;
  transition: 0.3s;
  z-index: 2;
}
.tooltip:hover .outer {
  opacity: 1;
  visibility: visible;
}
.tooltip:hover {
  opacity: 1;
}
.tooltip .outer:before {
  content: "";
  position: absolute;
  top: 20px;
  left: -7px;
  margin-left: -7px;
  border: 7px solid transparent;
  border-right: 7px solid var(--subColor);
}
.tooltip .inner {
  display: block;
  padding-bottom: 20px !important;
  margin-bottom: 20px;
  border-bottom: 1px dotted #fff;
}
.tooltip .inner:last-of-type {
  border-bottom: none;
  padding-bottom: 0 !important;
  margin-bottom: 0;
}
.tooltip .inner .tooltipTtl {
  display: block;
  text-align: start;
  margin-bottom: 10px;
}
.tooltip .inner .tooltipTxt {
  display: block;
  text-align: start;
  white-space: normal;
  width: 100%;
  max-width: 400px;
  min-width: 100px;
}
.tooltip .inner .tooltipTxt ul li {
  margin-bottom: 7px;
}
.tooltip .inner .tooltipTxt a {
  padding: 3px 0 3px 23px;
  color: #fff !important;
  text-decoration: underline;
  background: url("../images/ico_pdf_white_s.svg") no-repeat left 0 center;
  background-size: 17px 20px;
  transition: opacity 0.3s;
}
.tooltip .inner .tooltipTxt a:hover {
  opacity: 0.7;
}
.tooltip .inner .tooltipTxt table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  border-top: 1px solid #999;
}
.tooltip .inner .tooltipTxt table td {
  font-size: 12px;
  padding-right: 5px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #999;
}
.tooltip .inner .tooltipTxt table td:nth-last-of-type(1) {
  padding-right: 0;
}

/*入力ロック*/
input[type="checkbox"].inputLock {
  display: none;
}
input[type="checkbox"].inputLock + label {
  display: inline-block;
  width: 18px;
  height: 21px; /*margin-left: 8px;*/
  text-indent: -9999px;
  background-image: url("../images/ico_key_unlock.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 17px;
  cursor: pointer;
  transition: background 0.3s;
  position: relative;
  z-index: 1;
}
input[type="checkbox"].inputLock:checked + label {
  background-image: url("../images/ico_key_lock.svg");
  background-size: 18px 17px;
}
input[type="checkbox"].inputLock + label:hover {
  background-image: url("../images/ico_key_lock.svg");
  background-size: 18px 17px;
}
#firsthearing input[type="checkbox"].inputLock + label {
  margin-bottom: 5px;
}

/*修正依頼アイコン*/
/*.modificationRequest { display: block; width: 19px; height: 15px; text-indent: -9999px; background: url("../images/ico_mail_black.svg") no-repeat center; }
#firsthearing .modificationRequest { margin-bottom: 3px; }
#hearingMain .modificationRequest { margin-bottom: 4px; }*/
input[type="checkbox"].modificationRequest {
  display: none;
}
input[type="checkbox"].modificationRequest + label {
  display: inline-block;
  width: 19px;
  height: 15px; /*margin-left: 8px;*/
  text-indent: -9999px;
  background-image: url("../images/ico_mail_black_disable.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 19px 15px;
  cursor: pointer;
  transition: background 0.3s;
  position: relative;
  z-index: 1;
}
input[type="checkbox"].modificationRequest:checked + label {
  background-image: url("../images/ico_mail_black.svg");
  background-size: 19px 15px;
}
input[type="checkbox"].modificationRequest + label:hover {
  background-image: url("../images/ico_mail_black.svg");
  background-size: 19px 15px;
}
#firsthearing input[type="checkbox"].modificationRequest + label {
  margin-bottom: 4px;
  margin-left: 5px;
}
#hearingMain input[type="checkbox"].modificationRequest + label {
  margin-left: 5px;
}

/*郵便番号ハイフン*/
.hyphen {
  display: inline-block;
  width: 20px;
  position: relative;
  margin-left: 0;
  text-indent: -9999px;
}
.hyphen:after {
  content: "";
  display: block;
  width: 9px;
  height: 2px;
  position: absolute;
  top: 50%;
  left: 5px;
  background-color: #707070;
}

/*プラスボタン*/
input[type="button"].plusBtn {
  display: none;
}
input[type="button"].plusBtn + label {
  display: block;
  width: 24px;
  height: 24px;
  margin-left: 10px;
  text-indent: -9999px;
  border-radius: 50%;
  background: url("../images/ico_plus_s.svg") no-repeat center;
  background-color: var(--mainColor);
  cursor: pointer;
  transition: background 0.3s;
}
input[type="button"].plusBtn + label:hover {
  opacity: 0.7;
}

/*テーブル表示切り替えボタン*/
.viewType {
  display: flex;
  border-radius: 4px;
}
.viewType input[type="radio"] {
  display: none;
}
.viewType label {
  width: 35px;
  height: 35px;
  text-indent: -9999px;
  border-top: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
  border-right: 1px solid var(--borderColor);
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s;
  background-color: #fff;
}
.viewType label:first-of-type {
  border-left: 1px solid var(--borderColor);
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.viewType label:last-of-type {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.viewType label span {
  padding-left: 3px;
}
.viewType input[type="radio"]:checked + label {
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.viewType input[type="radio"].ListOrder + label {
  background: url("../images/ico_viewType_list_gray.svg") no-repeat center;
  background-size: 15px 14px;
}
.viewType input[type="radio"]:checked.ListOrder + label {
  background: url("../images/ico_viewType_list_white.svg") no-repeat center;
  background-size: 15px 14px;
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.viewType input[type="radio"].abcOrder + label {
  background: url("../images/ico_viewType_abc_gray.svg") no-repeat center;
  background-size: 15px 14px;
}
.viewType input[type="radio"]:checked.abcOrder + label {
  background: url("../images/ico_viewType_abc_white.svg") no-repeat center;
  background-size: 15px 14px;
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.viewType input[type="radio"].ListOrder + label:hover {
  background: url("../images/ico_viewType_list_white.svg") no-repeat center;
  background-size: 15px 14px;
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}
.viewType input[type="radio"].abcOrder + label:hover {
  background: url("../images/ico_viewType_abc_white.svg") no-repeat center;
  background-size: 15px 14px;
  background-color: var(--mainColor);
  border-color: var(--mainColor);
}

/*絞り込みボタン*/
.btnSpecialise {
  padding: 0 40px 0 35px;
  border: 1px solid var(--borderColor);
  background-color: #fff;
  font-size: var(--fontsizeBtn);
  color: #333;
  background-image: url("../images/ico_narrowdown.svg"),
    url("../images/ico_arrow_down.svg");
  background-repeat: no-repeat, no-repeat;
  background-position: left 10px top 50%, right 10px top 50%;
}

/*吹きだし*/
.balloonBox {
  display: inline-block;
  position: absolute;
  border-radius: 4px;
  background-color: #fff;
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
  z-index: 20;
} /*elementでフキダシ位置を指定*/
.balloonBox > .inner {
  position: relative;
  padding: 30px;
}
.balloonBox.top > .inner .angle {
  position: absolute;
  top: -7px;
  margin-top: -7px;
  border: 7px solid transparent;
  border-bottom: 7px solid #fff;
} /*elementでシッポ位置（right or left）を指定*/
.balloonBox.right > .inner .angle {
  position: absolute;
  right: -7px;
  margin-right: -7px;
  border: 7px solid transparent;
  border-left: 7px solid #fff;
} /*elementでシッポ位置（top or bottom）を指定*/
.balloonBox.bottom > .inner .angle {
  position: absolute;
  bottom: -7px;
  margin-bottom: -7px;
  border: 7px solid transparent;
  border-top: 7px solid #fff;
} /*elementでシッポ位置（right or left）を指定*/
.balloonBox.left > .inner .angle {
  position: absolute;
  left: -7px;
  margin-left: -7px;
  border: 7px solid transparent;
  border-right: 7px solid #fff;
} /*elementでシッポ位置（top or bottom）を指定*/
.balloonBox .btnArea {
  background-color: #f5f6fa;
  padding: 15px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.balloonBox .btnArea .inner {
  margin: 0;
  display: flex;
  justify-content: space-between;
}
.balloonBox .btnArea .inner .col:nth-of-type(1) {
  text-align: left;
}
.balloonBox .btnArea .inner .col:nth-last-of-type(1) {
  text-align: right;
}
.balloonBox a.btnClose {
  position: absolute;
  top: 7px;
  right: 7px;
  display: block;
  width: 25px;
  height: 25px;
  transition: opacity ease 0.3s;
}
.balloonBox a.btnClose:hover {
  opacity: 0.6;
}
.balloonBox a.btnClose span {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 25px;
  height: 25px;
  background-image: url("../images/ico_close_gray.svg");
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: center center;
  text-indent: -9999px;
  transition: all 0.2s;
}

/*-------------------------------------------------------------
テーブル
-------------------------------------------------------------*/

/*テーブルエリア*/
.inner.listBox {
}
.tableArea {
  height: 100%;
}
.tableArea > .inner {
  height: 100%;
  margin-bottom: 20px;
}
.tableArea > .inner .tableBox {
  position: relative;
  height: 100%;
}
.tableArea > .inner .tableBox > .inner {
  position: absolute;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
}

/*scrollTableX*/
table[class^="scrollTable"].scrollX th,
table[class^="scrollTable"].scrollX td {
  white-space: nowrap;
}

/*セル固定でない*/
.tableArea.w100 .scrollTable {
  display: block;
}
.scrollTable {
  display: inline-block;
  table-layout: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 100%;
  max-width: 100%;
  border-collapse: separate;
  box-sizing: border-box;
  border: 1px solid var(--tableBorderColor);
}
.scrollTable thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* tbody内のセルより手前に表示する */
  padding: 11px 20px;
  font-weight: 500;
  color: #131523;
  white-space: nowrap;
  line-height: 1;
  border-bottom: none;
  background: var(--bgColor);
  z-index: 12;
}
.scrollTable thead th:before {
  content: "";
  position: absolute;
  display: block;
  border-bottom: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
}
.scrollTable thead th:after {
}
.scrollTable thead th:last-of-type {
  border-right: none;
}
.scrollTable th,
.scrollTable td {
  font-size: var(--fontsizeMain);
  color: #131523;
  text-align: left;
  min-width: 100px;
  padding: 18px 20px;
  font-weight: 300;
  border-right: 1px solid var(--tableBorderColor);
  border-bottom: 1px dotted var(--tableBorderColor);
  box-sizing: border-box;
}
.scrollTable td {
  height: 56px;
}
.scrollTable tbody tr td {
  position: relative;
  word-wrap: break-word;
}
.scrollTable tbody tr td:last-of-type {
  border-right: none;
}
.scrollTable tbody tr:last-child th,
.scrollTable tbody tr:last-child td {
  border-bottom: none;
}
.scrollTable tbody th {
  z-index: 2;
}
.scrollTable tbody tr:nth-of-type(1) td {
}
.scrollTable tbody tr:nth-child(even) th {
  background: var(--bgColor);
}
.scrollTable tbody tr:nth-child(even) td {
  background: var(--bgColor);
}
.scrollTable tbody tr:nth-child(odd) th {
  background: #fff;
}
.scrollTable tbody tr:nth-child(odd) td {
  background: #fff;
}
.tableArea.w100 .scrollTable th {
  width: 100%;
}
.scrollTable th label,
.scrollTable td label {
  z-index: 10;
  position: relative;
}

/*左端セル固定*/
.tableArea.w100 .scrollTableFixL {
  display: block;
}
.scrollTableFixL {
  display: inline-block;
  table-layout: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 100%;
  max-width: 100%;
  border-collapse: separate;
  box-sizing: border-box;
  border: 1px solid var(--tableBorderColor);
}
.tableKp{
  width: 100%;
  border-collapse: separate;
  box-sizing: border-box;
  border: 1px solid var(--tableBorderColor);
}
.scrollTableFixL thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* tbody内のセルより手前に表示する */
  padding: 11px 20px;
  font-weight: 500;
  color: #131523;
  white-space: nowrap;
  line-height: 1;
  border-bottom: none;
  background: var(--bgColor);
  z-index: 12;
}
.tableKp thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* tbody内のセルより手前に表示する */
  padding: 11px 20px;
  font-weight: 500;
  color: #131523;
  white-space: nowrap;
  line-height: 1;
  border-bottom: none;
  background: var(--bgColor);
  z-index: 12;
}
.scrollTableFixL thead th:before {
  content: "";
  position: absolute;
  display: block;
  border-bottom: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
}
.scrollTableFixL thead th:after {
}
.scrollTableFixL thead th:first-child {
  /* 行内の他のセルより手前に表示する */
  z-index: 15 !important;
}
.scrollTableFixL thead th:last-of-type {
  border-right: none;
}
.scrollTableFixL th:first-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  border-right: none;
}
.scrollTableFixL td:first-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  border-right: none;
  z-index: 11;
}
.scrollTableFixL th:first-child:before,
.scrollTableFixL td:first-child:before {
  content: "";
  position: absolute;
  display: block;
  border-right: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  right: 0;
  top: 0;
  height: 100%;
}
.scrollTableFixL th,
.scrollTableFixL td {
  font-size: var(--fontsizeMain);
  color: #131523;
  text-align: left;
  min-width: 100px;
  padding: 18px 20px;
  font-weight: 300;
  border-right: 1px solid var(--tableBorderColor);
  border-bottom: 1px dotted var(--tableBorderColor);
  box-sizing: border-box;
}
.scrollTableFixL td {
  height: 56px;
}
.scrollTableFixL tbody th {
  z-index: 2;
}
.scrollTableFixL tbody tr td {
  position: relative;
  word-wrap: break-word;
}
.scrollTableFixL tbody tr td:last-of-type {
  border-right: none;
}
/*.scrollTableFixL tbody tr:last-child th,
.scrollTableFixL tbody tr:last-child td { border-bottom: none; }*/
.scrollTableFixL tbody tr:nth-of-type(1) td {
}
.scrollTableFixL tbody tr:nth-child(even) th {
  background: var(--bgColor);
}
.scrollTableFixL tbody tr:nth-child(even) td {
  background: var(--bgColor);
}
.scrollTableFixL tbody tr:nth-child(odd) th {
  background: #fff;
}
.scrollTableFixL tbody tr:nth-child(odd) td {
  background: #fff;
}
.tableArea.w100 .scrollTableFixL th {
  width: 100%;
  z-index: 11;
}
.scrollTableFixL th label,
.scrollTableFixL td label {
  z-index: 10;
  position: relative;
}

/*右端セル固定*/
.tableArea.w100 .scrollTableFixR {
  display: block;
}
.tableArea.w100 .scrollTableFixR th {
  width: 100%;
}
.scrollTableFixR {
  display: inline-block;
  table-layout: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 100%;
  max-width: 100%;
  border-collapse: separate;
  box-sizing: border-box;
  border: 1px solid var(--tableBorderColor);
}
.scrollTableFixR thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* tbody内のセルより手前に表示する */
  padding: 11px 20px;
  font-weight: 500;
  color: #131523;
  white-space: nowrap;
  line-height: 1;
  border-bottom: none;
  background: var(--bgColor);
  z-index: 12;
}
.scrollTableFixR thead th:before {
  content: "";
  position: absolute;
  display: block;
  border-bottom: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
}
.scrollTableFixR thead th:after {
}
.scrollTableFixR thead th:last-child {
  /* 行内の他のセルより手前に表示する */
  z-index: 15;
}
.scrollTableFixR thead th:first-of-type {
  border-left: none;
}
.scrollTableFixR th:last-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  border-left: none;
}
.scrollTableFixR th:last-child:before {
  content: "";
  position: absolute;
  display: block;
  border-left: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}
.scrollTableFixR tr {
  width: 100%;
}
.scrollTableFixR th,
.scrollTableFixR td {
  font-size: var(--fontsizeMain);
  color: #131523;
  text-align: left;
  width: 100%;
  min-width: 100px;
  padding: 18px 20px;
  font-weight: 300;
  border-left: 1px solid var(--tableBorderColor);
  border-bottom: 1px dotted var(--tableBorderColor);
  box-sizing: border-box;
}
.scrollTableFixR tbody th:first-of-type {
  border-left: none;
}
.scrollTableFixR tbody td:last-child {
  z-index: 2;
}
.scrollTableFixR tbody tr td {
  position: relative;
  word-wrap: break-word;
}
.scrollTableFixR tbody tr td:first-of-type {
  border-right: none;
}
.scrollTableFixR tbody tr td:first-child {
  border-left: none;
}
.scrollTableFixR tbody tr td:last-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  border-left: none;
}
.scrollTableFixR tbody tr td:last-child:before {
  content: "";
  position: absolute;
  display: block;
  border-left: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}
.scrollTableFixR tbody tr:last-child th,
.scrollTableFixR tbody tr:last-child td {
  border-bottom: none;
}
.scrollTableFixR tbody tr:nth-of-type(1) td {
}
.scrollTableFixR tbody tr:nth-child(even) th {
  background: var(--bgColor);
}
.scrollTableFixR tbody tr:nth-child(even) td {
  background: var(--bgColor);
}
.scrollTableFixR tbody tr:nth-child(odd) th {
  background: #fff;
}
.scrollTableFixR tbody tr:nth-child(odd) td {
  background: #fff;
}
.scrollTableFixR th label,
.scrollTableFixR td label {
  z-index: 10;
  position: relative;
}

/*両端セル固定*/
.tableArea.w100 .scrollTableFixBoth {
  display: block;
}
.tableArea.w100 .scrollTableFixBoth th {
  width: 100%;
}
.scrollTableFixBoth {
  display: inline-block;
  table-layout: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 100%;
  max-width: 100%;
  border-collapse: separate;
  box-sizing: border-box;
  border: 1px solid var(--tableBorderColor);
}
.scrollTableFixBoth thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* tbody内のセルより手前に表示する */
  padding: 11px 20px;
  font-weight: 500;
  color: #131523;
  white-space: nowrap;
  line-height: 1;
  border-bottom: none;
  background: var(--bgColor);
  z-index: 12;
}
.scrollTableFixBoth thead th:before {
  content: "";
  position: absolute;
  display: block;
  border-bottom: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
}
.scrollTableFixBoth thead th:after {
}
.scrollTableFixBoth thead th:last-child {
  /* 行内の他のセルより手前に表示する */
  z-index: 15;
}
.scrollTableFixBoth thead th:first-of-type {
  border-left: none;
}
.scrollTableFixBoth thead th:nth-of-type(2) {
  border-left: none;
}
.scrollTableFixBoth thead th:first-child {
  /* 行内の他のセルより手前に表示する */
  z-index: 15;
}
.scrollTableFixBoth th:first-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  border-right: none;
}
.scrollTableFixBoth th:first-child:before {
  content: "";
  position: absolute;
  display: block;
  border-right: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  right: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}
.scrollTableFixBoth th:last-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  border-left: none;
}
.scrollTableFixBoth th:last-child:before {
  content: "";
  position: absolute;
  display: block;
  border-left: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}
.scrollTableFixBoth tr {
  width: 100%;
}
.scrollTableFixBoth th,
.scrollTableFixBoth td {
  font-size: var(--fontsizeMain);
  color: #131523;
  text-align: left;
  width: 100%;
  min-width: 100px;
  padding: 18px 20px;
  font-weight: 300;
  border-left: 1px solid var(--tableBorderColor);
  border-bottom: 1px dotted var(--tableBorderColor);
  box-sizing: border-box;
}
.scrollTableFixBoth tbody th:first-of-type {
  border-left: none;
  z-index: 2;
}
.scrollTableFixBoth tbody th:first-of-type + td {
  border-left: none;
}
.scrollTableFixBoth tbody td:first-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  border-right: none;
  border-left: none;
  z-index: 2;
}
.scrollTableFixBoth tbody td:first-child:before {
  content: "";
  position: absolute;
  display: block;
  border-right: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  right: 0;
  top: 0;
  height: 100%;
}
.scrollTableFixBoth tbody td:first-child + td {
  border-left: none;
}
.scrollTableFixBoth tbody tr td:last-child {
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  right: 0;
  border-left: none;
}
.scrollTableFixBoth tbody tr td:last-child:before {
  content: "";
  position: absolute;
  display: block;
  border-left: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}
.scrollTableFixBoth tbody tr td {
  position: relative;
  word-wrap: break-word;
}
.scrollTableFixBoth tbody tr td:first-of-type {
  border-right: none;
}
.scrollTableFixBoth tbody tr:last-child th,
.scrollTableFixBoth tbody tr:last-child td {
  border-bottom: none;
}
.scrollTableFixBoth tbody td:last-child {
  z-index: 2;
}
.scrollTableFixBoth tbody tr:nth-of-type(1) td {
}
.scrollTableFixBoth tbody tr:nth-child(even) th {
  background: var(--bgColor);
}
.scrollTableFixBoth tbody tr:nth-child(even) td {
  background: var(--bgColor);
}
.scrollTableFixBoth tbody tr:nth-child(odd) th {
  background: #fff;
}
.scrollTableFixBoth tbody tr:nth-child(odd) td {
  background: #fff;
}
.scrollTableFixBoth th label,
.scrollTableFixBoth td label {
  z-index: 10;
  position: relative;
}

/*テーブルタイトルボックス*/
.tableTtlBox {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.tableTtl {
  margin-bottom: 5px;
  font-size: var(--fontsizeTtl);
  font-weight: 500;
}
.tableTxt {
  width: 100%;
  margin-bottom: 10px;
  font-size: 0.875rem;
}

/*ソートボタン*/
.sort {
  cursor: pointer;
}
.sort.default span {
  padding-right: 20px;
  background: url("../images/ico_sort_def.svg") no-repeat right 0 center;
}
.sort.ascending span {
  padding-right: 20px;
  background: url("../images/ico_sort_asc.svg") no-repeat right 0 center;
}
.sort.descending span {
  padding-right: 20px;
  background: url("../images/ico_sort_des.svg") no-repeat right 0 center;
}

/*テーブル内_詳細ボタン*/
.tableDetailBtn {
  width: 80px;
  cursor: pointer;
}
.tableDetailBtn .detailBtn {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.detailBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 30px;
  padding: 0;
  font-size: 0.875rem;
  color: var(--fontcolorBtn) !important;
  font-weight: 500;
  text-decoration: none;
  border-radius: 4px;
  background-color: var(--mainColor);
  box-sizing: border-box;
  transition: opacity 0.3s;
}
.detailBtn:hover {
  opacity: 0.7;
}
.detailBtn.disabled {
  opacity: 0.3;
  pointer-events: none;
}

/*中央表示*/
th.center,
td.center {
  text-align: center;
}

/*テーブル内_フォームパーツ*/
td.tablePdS,
td.tablePdS {
  padding: 10px 20px;
}

/*-------------------------------------------------------------
モーダル内タブ
-------------------------------------------------------------*/
.modalWindow .tabList ul {
  display: flex;
}
.modalWindow .tabList ul li {
  margin-right: 5px;
}
.modalWindow .tabList ul li .tab {
  display: block;
  padding: 10px 30px 9px;
  font-size: 0.9375rem;
  color: #43425d !important;
  font-weight: 500;
  text-decoration: none;
  box-sizing: border-box;
  background-color: #e5e7ed;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  transition: all 0.3s;
}
.modalWindow .tabList ul li.active .tab,
.modalWindow .tabList ul li .tab:hover {
  color: #000 !important;
  background-color: #fff;
  cursor: pointer;
}
.modalWindow .tabList ul li.active .tab:hover {
  cursor: default;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ログイン画面
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#login {
}
#login .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  background-color: var(--bgColor);
}
.loginBox {
  position: relative;
  width: 575px;
  padding: 95px 85px 110px;
  border-radius: 6px;
  box-sizing: border-box;
  background-color: var(--loginBgColor);
}
.loginBox .logo {
  height: 62px;
  margin-bottom: 12px;
  font-size: 2.375rem;
  text-align: center;
  font-weight: 500;
  text-indent: -9999px; /*background: url("../images/logo_login_blue.svg") no-repeat center center; background-size: 228px 47px;*/
}
.loginBox .notes {
  margin-bottom: 50px;
  color: #a6a7ad;
  text-align: center;
}
.loginBox .inputArea {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 30px;
  padding-bottom: 10px;
  font-weight: 300;
  border-bottom: 1px solid var(--loginBorderColor);
  box-sizing: border-box;
}
.loginBox .inputArea .ttl {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100px;
  padding-right: 20px;
  box-sizing: border-box;
  font-size: 0.9375rem !important;
}
.loginBox .inputArea .ttlRemind {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 140px;
  padding-right: 20px;
  box-sizing: border-box;
  font-size: 0.9375rem !important;
}
.loginBox .inputArea .inputTxt {
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: auto;
}
.loginBox .inputArea .inputTxt input {
  width: 100%;
  font-size: 0.9375rem;
  border: none;
  background-color: transparent;
}
.loginBox .inputArea .inputTxt input:focus {
  outline: none;
  box-shadow: none;
}
.loginBox .inputArea .errorBox {
  flex-basis: 100%;
  width: 100%;
}
.loginBox .forget {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 50px;
}
.loginBox .forget .linkTxt {
  font-size: 0.9375rem;
  color: var(--loginLinkColor) !important;
}
.loginBox .forget .linkTxt:hover {
  opacity: 1;
  text-decoration: none;
}
.loginBox .login {
  text-align: center;
}
.loginBox .login input {
  width: 185px;
  height: 50px;
  font-size: 1.125rem;
  color: #fff;
  font-weight: 300;
  background-color: var(--mainColor);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: opacity 0.3s;
}
.loginBox .login input:hover {
  opacity: 0.7;
}
.loginBox #errors {
  margin-bottom: 10px;
  font-size: 0.9375rem;
  color: #ff475c; /*font-weight: 500;*/
}
.loginBox .terms {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  font-size: 0.6875rem;
}
.loginBox input[type="button"]:disabled {
  opacity: 1;
  transition: opacity 0.3s;
}
.loginBox input[type="button"]:disabled:hover {
  opacity: 0.5;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
パスワード変更画面
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#password-change {
}
#password-change .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  background-color: var(--bgColor);
}
#remind-update-password .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  background-color: var(--bgColor);
}
#remind-confirm .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  background-color: var(--bgColor);
}
.pwChangeBox {
  position: relative;
  width: 575px;
  padding: 95px 85px 110px;
  border-radius: 6px;
  box-sizing: border-box;
  background-color: var(--loginBgColor);
}
.pwChangeBox .logo {
  height: 47px;
  margin-bottom: 12px;
  font-size: 2.375rem;
  text-align: center;
  font-weight: 500;
  text-indent: -9999px; /*background: url("../images/logo_login_blue.svg") no-repeat center center;*/
  background-size: 228px 47px;
}
.pwChangeBox .notes {
  margin-bottom: 50px;
  color: #a6a7ad;
  text-align: center;
}
.pwChangeBox .formBlock .inner {
  margin-bottom: 20px;
}
.pwChangeBox .save {
  margin-top: 50px;
  text-align: center;
}
.pwChangeBox .save input {
  width: 185px;
  height: 50px;
  font-size: 1.125rem;
  color: #fff;
  font-weight: 300;
  background-color: var(--mainColor);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: opacity 0.3s;
}
.pwChangeBox .save input:hover {
  opacity: 0.7;
}
.pwChangeBox #errors {
  margin-bottom: 10px;
  font-size: 0.9375rem;
  color: #ff475c;
  font-weight: 500;
}
.pwChangeBox .terms {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  font-size: 0.6875rem;
}
.pwChangeBox input[type="button"]:disabled {
  opacity: 1;
  transition: opacity 0.3s;
}
.pwChangeBox input[type="button"]:disabled:hover {
  opacity: 0.5;
}
.pwChangeBox .ttl {
  width: 100%;
  font-size: 1.125rem;
  font-weight: 500;
  text-align: center;
}
.pwChangeBox .txt {
  width: 100%;
  text-align: center;
}
.pwChangeBox .txt span {
  display: inline-block;
  text-align: left;
}
#staffing-agency {
}
#staffing-agency .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  background-color: var(--bgColor);
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
メイン画面
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*-------------------------------------------------------------
レイアウト
-------------------------------------------------------------*/
#main {
  height: 100vh;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(100vw - 280px);
  min-width: 1400px;
}
.mainBox {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
}
.mainBox .pageHeader {
  grid-area: g1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 70px;
  padding: 0 30px;
  font-size: 1.0625rem;
  box-sizing: border-box;
  background-color: #fff;
}
.mainBox .mainContent {
  grid-area: g2;
  padding: 30px 30px 0;
  box-sizing: border-box;
  overflow-y: auto;
  background-color: var(--bgColor);
}
.mainBox .mainContent.grid1-3 {
  padding: 30px;
}
.mainBox .mainContent.grid1-3:after {
  content: none;
}
/*.mainBox .mainContent:after { content: ""; display: block; height: 30px; }*/
/*#logs .mainBox .mainContent:after { content: ""; display: block; height: 30px; }*/
#dashboard .mainBox .mainContent:after {
  content: "";
  display: block;
  height: 10px;
}

/*-------------------------------------------------------------
ヘッダー
-------------------------------------------------------------*/
.pageHeader .col {
  flex: 0 1 auto;
}
.pageHeader .ttlList {
  display: flex;
  align-items: center;
  padding-left: 28px;
  background-repeat: no-repeat;
  background-position: left 0 bottom 0;
  background-size: 22px 22px;
}
input[type="checkbox"].naviButton:checked
  + label
  + aside
  + main
  .pageHeader
  .ttlList {
  margin-left: 35px;
}
input[type="checkbox"].naviButton:checked + label + aside + main {
  flex-basis: 100vw !important;
  min-width: 100vw !important;
}
.pageHeader .ttlList .mainTtl {
  margin-right: 20px;
  font-weight: 500;
  font-size: 1.0625rem;
}
.pageHeader .ttlList .secTtl {
}
.pageHeader .ttlList .secTtl ul {
  display: flex;
  align-items: center;
}
.pageHeader .ttlList .secTtl .item {
  padding-left: 27px;
  background: url("../images/arrow_breadcrumbslist.svg") no-repeat left 12px top
    4px;
  background-size: 6px 10px;
}
.pageHeader .ttlList .secTtl .item:first-of-type {
  padding-left: 0;
  background: none;
}
.pageHeader .ttlList .secTtl .item {
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1;
}
.pageHeader .ttlList .secTtl .item a {
  color: var(--mainColor);
  text-decoration: none;
  transition: opacity 0.3s;
}
.pageHeader .ttlList .secTtl .item a:hover {
  opacity: 0.7;
}
.pageHeader .rightBox {
  display: flex;
  align-items: center;
}
.pageHeader .search {
  display: flex;
  align-items: center;
}
.pageHeader .search .searchTtl {
  font-size: 0.9375rem;
  font-weight: 500;
  margin-right: 5px;
}
.pageHeader .search .searchInput input[type="text"] {
  font-size: 0.9375rem;
}
.pageHeader .search .searchInput input[type="button"] {
  font-size: 0.9375rem;
}
.pageHeader .ttlList.dashboard {
  background-image: url("../images/ico_sidenavi_dashboard_gray.svg");
}
.pageHeader .ttlList.users {
  background-image: url("../images/ico_sidenavi_customer_gray.svg");
}
.pageHeader .ttlList.earnings {
  background-image: url("../images/ico_sidenavi_earnings_gray.svg");
}
.pageHeader .ttlList.system {
  background-image: url("../images/ico_sidenavi_system_gray.svg");
}
.pageHeader .ttlList.informations {
  background-image: url("../images/ico_sidenavi_news_gray.svg");
}
.pageHeader .ttlList.questions {
  background-image: url("../images/ico_sidenavi_questionnaire_gray.svg");
}
.pageHeader .ttlList.accounts {
  background-image: url("../images/ico_sidenavi_account_gray.svg");
}
.pageHeader .ttlList.coupons {
  background-image: url("../images/ico_sidenavi_coupon_gray.svg");
}
.pageHeader .ttlList.maintenance {
  background-image: url("../images/ico_sidenavi_maintenance_gray.svg");
}
.pageHeader .ttlList.processes {
  background-image: url("../images/ico_sidenavi_process_gray.svg");
}
.pageHeader .ttlList.recruiting {
  background-image: url("../images/ico_sidenavi_recruiting_gray.svg");
}
.pageHeader .ttlList.mail {
  background-image: url("../images/ico_sidenavi_mail.svg");
}
.pageHeader .ttlList.recipient {
  background-image: url("../images/ico_sidenavi_recruiting_gray.svg");
}
.pageHeader .ttlList.support-agency {
  background-image: url("../images/ico_sidenavi_recruiting_gray.svg");
}
.pageHeader .ttlList.staffing-agency {
  background-image: url("../images/ico_sidenavi_recruiting_gray.svg");
}
.pageHeader .ttlList.sending-agency {
  background-image: url("../images/ico_sidenavi_recruiting_gray.svg");
}
.pageHeader .ttlList.applicants {
  background-image: url("../images/ico_sidenavi_customer_gray.svg");
}
.pageHeader .ttlList.scriveners {
  background-image: url("../images/ico_sidenavi_customer_gray.svg");
}
.pageHeader .ttlList.sub-users {
  background-image: url("../images/ico_sidenavi_subaccount_gray.svg");
}
.pageHeader .ttlList.statement {
  background-image: url("../images/ico_sidenavi_statement.svg");
}
.pageHeader .ttlList.log {
  background-image: url("../images/ico_sidenavi_log.svg");
}

/*-------------------------------------------------------------
サイドメニュー
-------------------------------------------------------------*/
#wrap {
  display: flex;
  position: relative;
}
#side {
  height: 100%;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 280px;
  position: sticky;
  top: 0;
  padding: 0 30px;
  box-sizing: border-box;
  background-color: var(--sideBgColor);
  z-index: 5;
  transition: opacity ease 0.5s;
}
#side:after {
  content: "";
  display: block;
  width: 5px;
  height: 100vh;
  position: absolute;
  top: 0;
  right: -5px;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.02) 0%,
    rgba(0, 0, 0, 0) 100%
  );
}
input[type="checkbox"].naviButton {
  display: none;
}
input[type="checkbox"].naviButton + label {
  position: absolute;
  top: 25px;
  left: 230px;
  display: block;
  width: 22px;
  height: 20px;
  text-indent: -9999px;
  cursor: pointer;
  z-index: 10;
  transition: opacity ease 0.3s;
  background-size: 22px 20px;
}
input[type="checkbox"].naviButton + label:hover {
  opacity: 0.6;
}
input[type="checkbox"].naviButton:checked + label {
  right: auto;
  left: 20px;
}
input[type="checkbox"].naviButton:checked + label + #side {
  opacity: 0;
  flex-basis: 0;
  overflow: hidden;
  padding: 0;
}
.sideNavi {
  height: 100vh;
  display: grid;
  grid-template-rows: 70px 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2" "g3";
}
.sideNavi > .top {
  grid-area: g1;
  display: flex;
  align-items: center;
  position: relative;
}
.sideNavi > .middle {
  grid-area: g2;
  padding: 30px 0 20px 0;
  box-sizing: border-box;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
}
.sideNavi > .middle .top {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  align-self: flex-start;
  margin-bottom: 30px;
}
.sideNavi > .middle .bottom {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  align-self: flex-end;
}
.sideNavi > .bottom {
  grid-area: g3;
}
.sideNavi .logo {
  width: 100%;
  height: 100%;
  line-height: 1;
  text-indent: -9999px;
  border-bottom: 1px solid var(--borderColor);
  box-sizing: border-box;
}
.sideNavi .userAccount {
  position: relative;
  display: flex;
  align-items: center;
  height: 80px;
  border-top: 1px solid var(--borderColor);
}
.sideNavi .userAccount .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-right: 5px;
  padding-bottom: 1px;
  box-sizing: border-box;
  font-size: 0.9375rem;
  color: #fff;
  font-weight: 500;
  line-height: 1;
  border-radius: 50%;
  background-color: var(--mainColor);
}
.sideNavi .userAccount .name {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1;
}
.sideNavi .subNaviList {
  position: absolute;
  top: 25px;
  right: 30px;
  display: flex;
  list-style: none;
  z-index: 1;
}
.sideNavi .subNaviList li {
  display: block;
  width: 22px;
  height: 20px;
}
.sideNavi .subNaviList li:nth-of-type(1) {
  margin-right: 13px;
}
.sideNavi .subNaviList li a {
  display: block;
  width: 22px;
  height: 20px;
  text-indent: -9999px;
  transition: opacity ease 0.3s;
}
.sideNavi .subNaviList li a.information {
  background: url("../images/ico_sidenavi_top_information.svg") no-repeat center;
  position: relative;
}
.sideNavi .subNaviList li a.information span {
  position: absolute;
  top: -4px;
  right: -5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 100%;
  background-color: #f0142f;
  color: #fff;
  font-size: 10px;
  line-height: 1;
  text-indent: 0;
}
.sideNavi .subNaviList li a.setting {
  background: url("../images/ico_sidenavi_top_setting.svg") no-repeat center;
}
.sideNavi .subNaviList li a:hover {
  opacity: 0.6;
}
.sideNavi .naviHeading {
  margin-bottom: 10px;
  padding-left: 12px;
  font-size: 0.625rem;
  font-weight: 700;
}
.sideNavi .naviList {
}
.sideNavi .naviList li {
  margin-bottom: 10px;
}
.sideNavi .naviList li:last-of-type {
  margin-bottom: 0;
}
.sideNavi .naviList .menu {
  position: relative;
  display: flex;
  align-items: center;
  height: 38px;
  padding-left: 40px;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  border-radius: 5px; /*background-color: #FFF;*/
  background-repeat: no-repeat;
  background-position: left 10px center;
  background-size: 22px 22px;
  transition: all 0.3s;
}
.sideNavi .naviList .menu:hover {
  color: #fff;
  background-color: var(--mainColor);
}
.sideNavi .naviList li.active .menu {
  color: #fff;
  background-color: var(--mainColor);
}
.sideNavi .naviList li input.localNavCheck {
  display: none;
}
.sideNavi .naviList li input.localNavCheck + label.localNavLabel {
  cursor: pointer;
}
.sideNavi
  .naviList
  li
  input.localNavCheck
  + label.localNavLabel
  + ul.localNaviList {
  display: none;
}
.sideNavi
  .naviList
  li
  input.localNavCheck:checked
  + label.localNavLabel
  + ul.localNaviList {
  display: block;
}
.sideNavi .localNaviList li {
  margin-top: 10px;
}
.sideNavi .localNaviList li a {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  flex-basis: 100%;
  display: flex;
  align-items: center;
  height: 38px;
  padding-left: 40px;
  box-sizing: border-box;
  border-radius: 5px;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1;
  background-repeat: no-repeat;
  background-position: left 10px center;
  background-size: 22px 22px;
  text-decoration: none !important;
  transition: all 0.3s;
}
.sideNavi .localNaviList li a:hover {
  color: #fff !important;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
メインコンテンツ
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*-------------------------------------------------------------
レイアウト
-------------------------------------------------------------*/
.mainContent > .top .tabBox {
  margin-bottom: 0;
  position: relative;
}
.mainContent > .top .tabBox .col {
  height: 40px;
}
.mainContent > .middle {
  border-radius: 6px;
}
.mainContent > .top + .middle {
  border-top-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.mainContent > .middle.contentBox {
  overflow-y: auto;
  margin-bottom: 0;
}
.mainContent > .bottom {
  padding-top: 30px;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  box-sizing: border-box;
}
.mainContent > .bottom.pagerBox {
  padding: 0 30px 30px;
  background-color: #fff;
  text-align: center;
}
.mainContent > .middle > .box:last-of-type {
  margin-bottom: 0;
}

/*大枠１つの場合*/
.mainContent.mainFull {
  padding: 30px;
  overflow: hidden;
}
.mainContent.mainFull > .inner {
  height: 100%;
}
.mainContent.mainFull > .inner > .box {
  height: 100%;
  margin-bottom: 0;
}
.mainContent.mainFull > .inner > .box > .col {
  height: 100%;
}
.mainContent.mainFull > .inner > .box > .col > .inner {
  padding: 0;
  border-radius: 0;
}
.mainContent.mainFull .tableArea > .inner {
  margin-bottom: 0;
}

/*-------------------------------------------------------------
top
-------------------------------------------------------------*/

/*タブ*/
.mainContent .tabList ul {
  display: flex;
}
.mainContent .tabList ul li {
  margin-right: 5px;
}
.mainContent .tabList ul li .tab {
  display: block;
  padding: 10px 30px 9px;
  font-size: 0.9375rem;
  color: #43425d !important;
  font-weight: 500;
  text-decoration: none;
  box-sizing: border-box;
  background-color: #e5e7ed;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  transition: all 0.3s;
}
.mainContent .tabList ul li.active .tab,
.mainContent .tabList ul li .tab:hover {
  color: #000 !important;
  background-color: #fff;
  cursor: pointer;
}
.mainContent .tabList ul li.active .tab:hover {
  cursor: default;
}

/*-------------------------------------------------------------
bottom
-------------------------------------------------------------*/

/*ページャー*/
.pager {
  margin: auto 30px;
}
.pagination {
  display: flex;
  justify-content: center;
}
.pagination li {
  margin-right: 5px;
}
.pagination li:last-of-type {
  margin-right: 0;
}
.pagination li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: var(--mainColor);
  text-decoration: none;
  border-radius: 4px;
  background-color: #fff;
  transition: all 0.3s;
}
.pagination li a:hover {
  color: var(--fontcolorBtn) !important;
  background-color: var(--mainColor);
}
.pagination li.active a {
  color: var(--fontcolorBtn) !important;
  background-color: var(--mainColor);
}
.pagination li.pre a {
  text-indent: -9999px;
  background: url("../images/pager_arrow_left.svg") no-repeat center;
  transition: opacity 0.3s;
  background-size: 8px 15px;
}
.pagination li.pre a:hover {
  opacity: 0.7;
}
.pagination li.next a {
  text-indent: -9999px;
  background: url("../images/pager_arrow_right.svg") no-repeat center;
  transition: opacity 0.3s;
  background-size: 8px 15px;
}
.pagination li.next a:hover {
  opacity: 0.7;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
案件詳細
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*発注者*/
.clientName {
  font-size: 1.25rem;
  font-weight: 500;
}

/*担当者*/
.mainContent .userAccount dl {
  position: relative;
  display: flex;
  align-items: center;
}
.mainContent .userAccount dl .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-right: 5px;
  padding-bottom: 1px;
  box-sizing: border-box;
  font-size: 0.9375rem;
  color: #fff;
  font-weight: 500;
  line-height: 1;
  border-radius: 50%;
  background-color: var(--mainColor);
}
.mainContent .userAccount dl .name {
  font-size: 0.875rem;
  font-weight: 500;
  margin-right: 15px;
}
.mainContent .userAccount dl .name:last-of-type {
  margin-left: 0;
}
.mainContent .userAccount dl:before {
  content: "担当者";
  position: relative;
  margin-right: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
}

/*申請種別*/
.applType {
  padding-left: 17px;
  position: relative;
}
.applType:before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  border-radius: 50%;
}
.applType.issue:before {
  background-color: #a454e9;
}
.applType.change:before {
  background-color: #78d52a;
}
.applType.renewal:before {
  background-color: #5b98ed;
}

/*申請フロー*/
td.applFlow {
  padding: 10px 20px;
}
.applFlow ul {
  display: flex;
  justify-content: space-between;
  max-width: 520px;
}
.applFlow ul li {
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 62px;
  width: 62px;
  margin-right: 7px;
  box-sizing: border-box;
  text-align: center;
}
.applFlow ul li:last-of-type {
  margin-right: 0;
}
.applFlow ul li .flowIco {
  position: relative;
  display: block;
  width: 19px;
  height: 19px;
  margin: 0 auto;
  text-indent: -9999px;
  border-radius: 50%;
  background-color: var(--cancelColor);
}
.applFlow ul li .flowIco:before,
.applFlow ul li .flowIco.done:before {
  content: "";
  position: absolute;
  top: 13px;
  left: 5px;
  display: block;
  margin-top: -7px;
  width: 9px;
  height: 7px;
  z-index: 1;
  background: url("../images/ico_check_flow.svg") no-repeat center;
  background-size: 9px 7px;
}
.applFlow ul li .flowIco.processing:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  display: block;
  margin-top: -7px;
  width: 3px;
  height: 13px;
  z-index: 1;
  background: url("../images/ico_excl_flow.svg") no-repeat center;
  background-size: 3px 13px;
}
.applFlow ul li .flowIco.caution:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  display: block;
  margin-top: -7px;
  width: 3px;
  height: 13px;
  z-index: 1;
  background: url("../images/ico_excl_flow.svg") no-repeat center;
  background-size: 3px 13px;
}
.applFlow ul li .flowIco:after {
  content: "";
  position: absolute;
  top: 50%;
  left: -48px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  display: block;
  width: 45px;
  height: 2px;
  background-color: var(--cancelColor);
}
.applFlow ul li .flowIco.done,
.applFlow ul li .flowIco.done:after {
  background-color: var(--mainColor);
}
.applFlow ul li .flowIco.processing,
.applFlow ul li .flowIco.processing:after {
  background-color: #78d52a;
}
.applFlow ul li .flowIco.caution,
.applFlow ul li .flowIco.caution:after {
  background-color: var(--addColor);
}
.applFlow ul li:first-of-type .flowIco:after {
  content: none;
}
.applFlow ul li .date {
  margin-top: 5px;
  padding-left: 11px;
  font-size: 0.625rem;
  line-height: 1;
  background: url("../images/ico_clock_ss.svg") no-repeat left 0 top 1px;
}
.applFlow ul li .flowIco.done + .date {
  padding-left: 0;
  background: none;
}

/*●チェックマーク*/
.icoCheck {
  padding-left: 28px;
  position: relative;
  line-height: 1;
}
.icoCheck:after {
  content: "";
  display: block;
  width: 19px;
  height: 19px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  background: var(--cancelColor) url("../images/ico_check_flow.svg") no-repeat
    center;
  border-radius: 50%;
}
.icoCheck.check:after {
  background-color: var(--mainColor);
}

/*送信*/
.icoSendDate {
  padding-left: 25px;
  line-height: 1;
  background: url("../images/ico_sendmail.svg") no-repeat left 0 center;
}
.icoSendDate .time {
  padding-left: 10px;
}

/*期日*/
.icoDeadline {
  padding-left: 21px;
  line-height: 1;
  background: url("../images/ico_clock.svg") no-repeat left 0 center;
}
.icoDeadline .time {
  padding-left: 10px;
}

/*配信*/
.sent a {
  padding-left: 10px;
}

/*-------------------------------------------------------------
書類一覧
-------------------------------------------------------------*/
.appliDate {
  margin-bottom: 5px;
}
.appliDate:before {
  position: relative;
  content: "申請日：";
  padding-right: 3px;
}
.appliNumber:before {
  position: relative;
  content: "申請番号：";
  padding-right: 3px;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
顧客詳細
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*-------------------------------------------------------------
基本情報エリア
-------------------------------------------------------------*/
.customerName {
  margin-bottom: 20px;
}
.customerName input[type="text"] {
  width: 100%;
  height: 38px;
  padding: 0 2px;
  font-size: 1.75rem;
  border: none;
  background-color: transparent;
}
.customerName input[type="text"]:focus {
  padding: 0 1px;
  border: 1px solid var(--mainColor);
}
.basicInfo + .btnArea {
  margin-top: 10px;
}

/*テーブル幅*/
.loginList .tableBox .scrollTable thead tr th:first-of-type {
  width: 30%;
}
.loginList .tableBox .scrollTable tbody tr th:first-of-type {
  width: 30%;
}

/*ボタン左寄せ*/
.btnArea.toRight {
  text-align: right;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
入館申請
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*-------------------------------------------------------------
入館申請テーブル
-------------------------------------------------------------*/
.admissionTable {
  height: 100%;
}
.admissionTable.scrollTableFixL tbody tr:last-child th,
.scrollTableFixL tbody tr:last-child td {
  border-bottom: 1px dotted var(--tableBorderColor);
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
モーダルウインドウ
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

.modalOuter {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  z-index: 1002;
  background-color: rgba(56, 56, 56, 0.7);
}
.modalWindow {
  position: relative;
  max-width: 96vw;
  min-width: 700px;
  box-shadow: 0 0 18px 9px rgba(0, 0, 0, 0.13);
  border-radius: 6px;
}
.modalWindow.full {
  width: calc(100% - 80px);
  max-width: calc(100% - 80px);
  height: calc(100% - 80px);
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2" "g3";
}
.modalWindow.full .head {
  grid-area: g1;
}
.modalWindow.full .mainBox {
  grid-area: g2;
}
.modalWindow.full .footer {
  grid-area: g3;
}
.modalWindow .head {
  padding: 0 20px;
  height: 55px;
  border-radius: 6px 6px 0 0;
  background-color: var(--mainColor);
}
.modalWindow .head .title {
  font-size: 1.125em;
  color: #fff;
  line-height: 55px;
  font-weight: 500;
}
.modalWindow .scrollBox {
  max-height: 70vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  position: relative;
  background-color: #fff;
}
.modalWindow .scrollBox > .inner {
  padding: 20px 20px 0 20px;
}
.modalWindow .scrollBox > .inner > .box {
  margin-bottom: 25px;
  padding-bottom: 15px;
  border-bottom: 1px dotted var(--dottedColor);
}
.modalWindow .scrollBox > .inner > .box:last-of-type {
  margin-bottom: 0;
  padding-bottom: 10px;
  border-bottom: none;
}
.modalWindow .scrollBox > .inner > .box > .col {
  overflow-x: visible;
}
.modalWindow .scrollBox > .inner > .box > .col > .inner {
  padding: 0;
  height: auto;
}
.modalWindow .mainBox {
  max-height: 70vh;
  min-height: 50vh;
  overflow: hidden;
  position: relative;
  background-color: #fff;
}
.modalWindow.full .mainBox {
  max-height: none;
}
.modalWindow > .modalOuter > .modalWindow > .mainBox {
  min-height: 50vh;
  display: flex;
  flex-wrap: wrap;
}
.modalWindow > .modalOuter > .modalWindow > .mainBox > .inner {
  width: 100% !important;
}
.modalWindow .mainBox > .inner {
  padding: 20px 20px 0 20px;
  box-sizing: border-box;
}
.modalWindow .mainBox > .inner:last-of-type {
  padding: 20px;
}
.modalWindow .mainBox > .inner > .box {
  height: 100%;
  margin-bottom: 25px;
  padding-bottom: 15px;
  border-bottom: 1px dotted var(--dottedColor);
}
.modalWindow .mainBox > .inner > .box:last-of-type {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.modalWindow .mainBox > .inner > .box > .col {
}
.modalWindow .mainBox > .inner > .box > .col > .inner {
  padding: 0;
  border-radius: 0;
}
.modalWindow .mainBox > .inner > .box > .col > .inner a {
  white-space: nowrap;
}
.modalWindow .mainBox .innerFullBox {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.modalWindow .mainBox .innerFullBox .inner.bottom {
  padding: 0;
}
.modalWindow .mainBox .innerFullBox .scrollBox {
  position: absolute;
  top: 20px;
  right: 20px;
  bottom: 20px;
  left: 20px;
}
.modalWindow .mainBox .innerFullBox .scrollBox.formType3 {
  height: auto !important;
}
.modalWindow .mainBox .innerFullBox .scrollBox .col > .inner {
  padding: 0;
}
.modalWindow .footer {
  background-color: var(--bgColor);
  border-radius: 0 0 6px 6px;
}
.modalWindow a.btnClose {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 55px;
  height: 55px;
}
.modalWindow a.btnClose span {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 55px;
  height: 55px;
  background-image: url("../images/ico_close_white.svg");
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: center center;
  text-indent: -9999px;
  transition: opacity ease 0.2s;
}
.modalWindow a.btnClose span:hover {
  opacity: 0.7;
}
.modalWindow .footer.btnBox {
  padding: 20px;
}
.modalWindow .footer.btnBox button.register span {
  padding-left: 0;
  background: none;
  line-height: 1;
}
.modalWindow .grid1-2 > .bottom {
  overflow: hidden;
}
.modalWindow .mainBox > .inner > .box.borderNon {
  margin-bottom: 10px;
  padding-bottom: 0;
  border-bottom: none;
}

/*モーダル_進捗担当表示エリア*/
.stateBox {
  padding-top: 15px !important;
  background-color: var(--bgColor);
  position: sticky;
  top: 0;
  z-index: 20;
}
.stateBox .box > .col > .inner {
  background-color: var(--bgColor);
}
.stateBox .formBlockLine > .inner {
  padding-bottom: 0 !important;
}
.stateBox .box {
  margin-bottom: 0 !important;
  padding-bottom: 15px !important;
  border-bottom: none !important;
}
.stateBox .formBlockLine .formTitle {
  margin-bottom: 0;
}
.stateBox .formBlockLine .formTitle + select + p {
  margin-left: 10px;
}

/*フォーム_タイプ2*/
.formType2 {
  height: 100%;
}
.formType2 > .inner {
  height: 100%;
  padding: 40px 40px 30px 40px !important;
  box-sizing: border-box;
  overflow: auto;
  background-color: var(--bgColor) !important;
  overflow-x: hidden;
}
.formType2 > .inner > .box {
  margin-bottom: 35px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
}
.formType2 > .inner > .box:last-of-type {
  margin-bottom: 0 !important;
}
.formType2 .colTtl {
  margin-bottom: 15px;
  padding-bottom: 10px;
  font-size: 0.9375rem;
  border-bottom: 1px dotted var(--dottedColor);
  box-sizing: border-box;
}
.formType2 .formTitle {
  font-size: 0.8125rem;
  margin-right: 8px;
}
.formType2 > .inner > .box > .col > .inner {
  padding: 0;
  background-color: transparent;
}
#firsthearing .formType2 > .inner {
  overflow: visible;
}
#firsthearing .formType2 .colTtl {
  margin-bottom: 25px;
}
.formType2 input[type="checkbox"].inputLock + label {
  margin-bottom: 5px;
}
.formType2 .tooltip {
  margin-bottom: 5px;
}
.formType2.proccessFirstHearingForm .inner {
}
.formType2.proccessFirstHearingForm > .inner > .box:last-of-type {
  position: sticky;
  bottom: 0;
  background-color: var(--bgColor);
  z-index: 2;
}
.formType2.proccessFirstHearingForm > .inner > .box:last-of-type:before {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 0;
  display: block;
  width: calc(100% + 40px);
  height: 85px;
  background-color: var(--bgColor);
  z-index: -1;
}
.formType2.proccessFirstHearingForm .formGroup .inner .partsBox .formTitle {
  max-width: calc(100% - 40px);
}
.formType2.proccessFirstHearingForm
  .formGroup
  .inner
  .partsBox
  .tooltip
  + .formTitle {
  max-width: calc(100% - 70px);
}

/*フォーム_タイプ3*/
.formType3 {
  height: 100%;
}
.formType3 > .inner {
  height: 100%;
  padding: 20px 20px 10px 20px !important;
  box-sizing: border-box;
  overflow: auto;
  background-color: #fff !important;
  overflow-x: hidden;
}
.formType3 > .inner > .box {
  margin-bottom: 35px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
}
.formType3 > .inner > .box:last-of-type {
  margin-bottom: 0 !important;
}
.formType3 .colTtl {
  margin-bottom: 15px;
  padding-bottom: 10px;
  font-size: 0.9375rem;
  border-bottom: 1px dotted var(--dottedColor);
}
.formType3 .formTitle {
  font-size: 0.8125rem;
}
.formType3 > .inner > .box > .col > .inner {
  padding: 0;
  background-color: transparent;
}
.mailTpl .partsBox {
  align-items: flex-start;
}

/*フォーム_タイプ4*/
.formType4 {
  height: 100%;
}
.formType4 > .inner {
  height: 100%;
  padding: 30px 30px 20px 30px !important;
  box-sizing: border-box;
  overflow: auto;
  overflow-x: hidden;
}
.formType4 > .inner.bottom {
  padding: 20px 30px !important;
}
.formType4 > .inner > .box {
  margin-bottom: 35px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
}
.formType4 > .inner > .box:last-of-type {
  margin-bottom: 0 !important;
}
.formType4 .colTtl {
  margin-bottom: 20px;
  padding-bottom: 10px;
  font-size: 0.9375rem;
  border-bottom: 1px dotted var(--dottedColor);
}
.formType4 .formGroup .inner {
  display: flex;
  margin-bottom: 20px;
}
.formType4 .formGroup .inner:last-of-type {
  margin-bottom: 0;
}
.formType4 .formTitle {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 125px;
  margin-top: 8px;
  margin-bottom: 0;
  font-size: 0.8125rem;
  box-sizing: border-box;
}
.formType4 > .inner > .box > .col > .inner {
  padding: 0;
  background-color: transparent;
}
.formType4 .errorBox {
  margin-bottom: 20px;
}
#accounts .formType4 .formTitle {
  flex-basis: 140px;
}
#accounts .formType4 .box.footer {
  justify-content: flex-end;
}
#accounts .formType4 > .inner:last-of-type {
  padding: 10px 30px 30px 30px !important;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
警告ウインドウ
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

.alertOuter {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  z-index: 2000;
  background-color: rgba(56, 56, 56, 0.7);
}
.alertWindow {
  position: relative;
  width: 370px;
  box-shadow: 0 0 18px 9px rgba(0, 0, 0, 0.13);
  border-radius: 6px;
}
.alertWindow .head {
  padding: 0 20px;
  height: 55px;
  border-radius: 6px 6px 0 0;
  background-color: var(--mainColor);
}
.alertWindow .head .title {
  font-size: 1.125em;
  color: #fff;
  line-height: 55px;
  font-weight: 500;
}
.alertWindow a.btnClose {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 55px;
  height: 55px;
}
.alertWindow a.btnClose span {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 55px;
  height: 55px;
  background-image: url("../images/ico_close_white.svg");
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: center center;
  text-indent: -9999px;
  transition: all 0.2s;
}
.alertWindow a.btnClose span:hover {
  opacity: 0.7;
}
.alertWindow .mainBox {
  max-height: 70vh;
  padding: 20px;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  background-color: #fff;
}
.alertWindow .mainBox .partsBox .ttl {
  width: 100%;
  font-size: 1.125rem;
  font-weight: 400;
  text-align: center;
}
.alertWindow .mainBox .partsBox .txt {
  font-size: 0.875rem;
  line-height: 1.6em;
}
.alertWindow .footer {
  background-color: var(--bgColor);
  border-radius: 0 0 6px 6px;
}
.alertWindow .footer.btnBox {
  padding: 10px 20px;
  text-align: center;
}
.alertWindow .footer.btnBox button {
  min-width: 115px;
}
.alertWindow .footer.btnBox button.register span {
  padding-left: 0;
  background: none;
  line-height: 1;
}
.alertWindow .mainBox .formBlock .inner {
  margin-bottom: 15px;
}

/*-------------------------------------------------------------
警告ウインドウ
-------------------------------------------------------------*/
.alertWindow.attention .mainBox .partsBox .ttl {
  min-width: 55px;
  padding-top: 55px;
  color: var(--attentionColor);
  background: url("../images/ico_attention.svg") no-repeat center top 0;
}
.alertWindow .mainBox .emphasis {
  color: var(--attentionColor);
}

/*-------------------------------------------------------------
プラン変更ウインドウ
-------------------------------------------------------------*/
.alertWindow.changePlan {
  width: 520px;
}
.changePlanDetail {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.changePlanDetail .name {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 35%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9375rem;
  color: #fff;
  font-weight: 500;
  background-color: #2e98cc;
}
.changePlanDetail .detail {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 65%;
  padding: 10px 15px;
  font-weight: 500;
  box-sizing: border-box;
  background-color: var(--bgColor);
}
.changePlanDetail .detail .people .number {
  padding-left: 5px;
}
.changePlanDetail.standard .name {
  background-color: var(--standardColor);
}
.changePlanDetail.standard .detail .people .number,
.changePlanDetail.standard .detail .fee {
  color: var(--standardColor);
}
.changePlanDetail.business .name {
  background-color: var(--businessColor);
}
.changePlanDetail.business .detail .people .number,
.changePlanDetail.business .detail .fee {
  color: var(--businessColor);
}
.changePlanDetail.professional .name {
  background-color: var(--professionalColor);
}
.changePlanDetail.professional .detail .people .number,
.changePlanDetail.professional .detail .fee {
  color: var(--professionalColor);
}
.changePlanDetail.enterprise .name {
  background-color: var(--enterpriseColor);
}
.changePlanDetail.enterprise .detail .people .number,
.changePlanDetail.enterprise .detail .fee {
  color: var(--enterpriseColor);
}
.changePlanDetail.option .name {
  background-color: var(--optionColor);
}
.changePlanDetail.option .detail .people .number,
.changePlanDetail.option .detail .fee {
  color: var(--optionColor);
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ローディング
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

.loadingOuter {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  z-index: 9999;
  background-color: rgba(56, 56, 56, 0.7);
}
.loadingOuter .loader {
  width: 200px;
  height: 200px;
  text-indent: -9999px;
  background: url("../images/ico_loader.svg") no-repeat center;
  background-size: 174px 174px;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ダミー
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

.dummy {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 30px;
  color: #909090;
  font-weight: 500;
  background-color: var(--cancelColor);
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ヒアリングフォーム
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*レイアウト*/
#hearingMain {
  height: 100vh;
}
#hearingMain a {
  color: var(--mainColor);
}
.hearingMainBox {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2" "g3";
}
.hearingMainBox .pageHeader {
  grid-area: g1;
  height: 70px;
  margin: 0 auto;
}
.hearingMainBox .mainContent {
  grid-area: g2;
  background-color: var(--bgColor);
  overflow-y: scroll;
}
.hearingMainBox .pageFooter {
  grid-area: g3;
  height: 70px;
  background-color: var(--mainColor);
}
.hearingMainBox.first .pageHeader {
  width: 680px;
}
.hearingMainBox.main .pageHeader {
  width: 1350px;
}
.document-header-style {
  width: 80%!important;
}
.hearingMainBox .logo {
  height: 100%;
  background: url("../images/logo2.png") no-repeat left 0 center;
  text-indent: -9999px;
  background-size: 223px 60px;
}
.hearingMainBox.first .mainContent > .inner {
  width: 680px;
  margin: 0 auto;
}
.hearingMainBox.main .mainContent > .inner {
  width: 1350px;
  margin: 0 auto;
}
.hearingMainBox .preambleArea {
  padding: 30px 0;
}
.hearingMainBox .preambleArea .heading {
  margin-bottom: 15px;
  font-size: 1.1875rem;
  font-weight: 500;
}
.hearingMainBox .preambleArea .preamble {
  font-size: 0.9375rem;
  line-height: 2em;
}
.hearingMainBox .formType2 {
  margin-bottom: 30px;
}
.hearingMainBox .formType2 > .inner {
  background-color: #fff !important;
}
.hearingMainBox .footerBtn {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.hearingMainBox .footerBtn button {
  color: #fff;
  border: 1px solid #fff;
  background-color: var(--mainColor);
}

/*本聴取ヒアリングフォーム*/
.hearingMainBox .questionInputList {
  height: 100%;
}
.hearingMainBox .questionInputList > .inner {
  height: 100%;
  margin-bottom: 30px;
  padding: 40px;
  box-sizing: border-box;
  background-color: #fff;
}
.hearingMainBox .questionInputList .listBox {
  position: relative;
  height: 100%;
}
.hearingMainBox .questionInputList .listBox > .inner {
  height: 100%;
}
.hearingMainBox .questionInputList .lists {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
  height: 100%;
}
.hearingMainBox .questionInputList .lists .listHeader {
  grid-area: g1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
}
.hearingMainBox .questionInputList .lists .listHeader > div {
  flex-grow: 0;
  flex-shrink: 0;
  padding: 11px 16px;
  line-height: 1;
  background: var(--bgColor);
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  box-sizing: border-box;
  font-weight: 500;
  font-size: var(--fontsizeMain);
}
.hearingMainBox .questionInputList .lists .listHeader > div:nth-of-type(1) {
  flex-basis: 200px;
}
.hearingMainBox .questionInputList .lists .listHeader > div:nth-of-type(2) {
  flex-basis: 200px;
}
.hearingMainBox .questionInputList .lists .listHeader > div:nth-of-type(3) {
  flex: 1;
}
.hearingMainBox .questionInputList .lists .listHeader > div:nth-of-type(4) {
  flex-basis: 160px;
}
.hearingMainBox .questionInputList .lists .listHeader > div:nth-of-type(5) {
  flex-basis: 150px;
}
.hearingMainBox .questionInputList .lists .listBody {
  grid-area: g2;
  position: relative;
  font-size: var(--fontsizeMain);
}
.hearingMainBox .questionInputList .lists .listBody > .inner {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.hearingMainBox .questionInputList .lists .listBody > .inner > dl.list1 {
  display: flex;
  justify-content: space-between;
  border-right: 1px solid #ddd;
}
.hearingMainBox .questionInputList .lists .listBody > .inner > dl.list1 > dt {
  flex-basis: 200px;
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  box-sizing: border-box;
  position: relative;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dt
  > div {
  top: 0;
  padding: 14px 16px;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dt
  > div
  span {
  display: inline-block;
}
.hearingMainBox .questionInputList .lists .listBody > .inner > dl.list1 > dd {
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.hearingMainBox .questionInputList .lists .listBody > .inner > dl.list1 > dd {
  flex: 1;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2 {
  display: flex;
  justify-content: space-between;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dt {
  border-right: 1px solid #ddd;
  flex-basis: 200px;
  border-bottom: 1px dotted #ddd;
  box-sizing: border-box;
  position: relative;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dt
  > div {
  top: 0;
  padding: 14px 16px;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dt
  > div
  span {
  display: inline-block;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2:nth-last-of-type(1)
  > dt {
  border-bottom: none;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd {
  flex: 1;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3 {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px dotted #ddd;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2:nth-last-of-type(1)
  > dd
  > dl.list3:nth-last-of-type(1) {
  border-bottom: none;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dt {
  padding: 10px 16px;
  border-right: 1px solid #ddd;
  flex: 1;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dt
  .formBlockLine
  > .inner,
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dt
  .formBlock
  > .inner {
  margin-bottom: 0;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dt
  .formGroup
  > .inner
  .formTitle {
  font-size: 13px;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dt
  .formGroup
  > .inner
  > .partsBox:first-of-type
  .formTitle {
  max-width: calc(100% - 70px);
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dd {
  flex-basis: 150px;
  padding: 10px 16px;
  box-sizing: border-box;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dd:nth-last-of-type(2) {
  flex-basis: 160px;
  border-right: 1px solid #ddd;
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dd:nth-last-of-type(1) {
}
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dd
  .formBlockLine
  > .inner,
.hearingMainBox
  .questionInputList
  .lists
  .listBody
  > .inner
  > dl.list1
  > dd
  > dl.list2
  > dd
  > dl.list3
  > dd
  .formBlock
  > .inner {
  margin-bottom: 0;
}
.hearingMainBox .questionInputList .lists .titleToggle {
  display: none;
}
.hearingMainBox .questionInputList .lists .titleToggle + label {
  position: absolute;
  top: 13px;
  left: 16px;
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: #fff;
  background-image: url("../images/ico_plus_gray.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 10px;
  text-indent: -9999px;
  cursor: pointer;
}
.hearingMainBox .questionInputList .lists .titleToggle:checked + label {
  background-image: url("../images/ico_minus_gray.svg");
  background-size: 10px 10px;
}
.hearingMainBox .qf38 input[type="text"],
.hearingMainBox .qf220 input[type="text"] {
  min-width: 7em;
}

/*ヒアリングフォーム_見出しについてるツールチップの高さ調節*/
#hearingMain .tooltip {
  top: -3px;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
会員登録・退会手続き
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*レイアウト*/
#signup {
  height: 100vh;
  width: 100vw;
}
#signup a {
  color: var(--mainColor);
}
.signupMainBox {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2" "g3";
}
.signupMainBox .pageHeader {
  grid-area: g1;
  height: 70px;
  width: 680px;
  margin: 0 auto;
}
.signupMainBox .mainContent {
  grid-area: g2;
  padding-bottom: 50px;
  background-color: var(--bgColor);
  overflow-y: scroll;
}
.signupMainBox .pageFooter {
  grid-area: g3;
  height: 70px;
  background-color: var(--mainColor);
}
.signupMainBox .logo {
  height: 100%;
  background: url("../images/logo2.png") no-repeat left 0 center;
  background-size: 223px 60px;
  text-indent: -9999px;
}
.signupMainBox .mainContent > .inner {
  width: 680px;
  margin: 0 auto;
}
.signupMainBox .preambleArea {
  padding: 30px 0;
}
.signupMainBox .preambleArea .heading {
  margin-bottom: 15px;
  font-size: 1.1875rem;
  font-weight: 500;
}
.signupMainBox .preambleArea .preamble {
  font-size: 0.9375rem;
  line-height: 2em;
}
.signupMainBox .formType2 {
  margin-bottom: 20px;
}
.signupMainBox .formType2 > .inner {
  background-color: #fff !important;
}
.signupMainBox .footerBtn {
  display: flex;
  align-items: center;
}
.signupMainBox .footerBtn button {
  height: 50px;
  font-size: 1.125rem;
}
.signupMainBox .footerBtn input[type="submit"] {
  height: 50px;
  font-size: 1.125rem;
}
.signupMainBox .footerBtn a.linkBtn {
  height: 50px;
  font-size: 1.125rem;
}
.signupMainBox .footerBtn a.linkBtn.cancel {
  background-color: var(--cancelColor);
}

/*プラン*/
.selectedPlan {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 55px;
  padding: 0 20px;
  box-sizing: border-box;
  background-color: #ededed;
}
.selectedPlan .planName {
  font-weight: 500;
}
.renewal .plan {
  padding-right: 5px;
}
.renewal .unit {
  letter-spacing: 0.3em;
}
#signup .planBox .col.standard .planName {
  padding-left: 20px;
}

/*カード情報*/
#card-element.MyCardElement {
  height: 35px;
  padding: 7px 10px;
  border: 1px solid var(--borderColor);
  border-radius: 3px;
  box-sizing: border-box;
}
.availableCards {
  margin-top: 5px;
}
.availableCards dl {
  display: flex;
  align-items: center;
}
.availableCards dl dt {
  margin-right: 5px;
  font-size: 0.8125rem;
  font-weight: 400;
}
.availableCards dl dd img {
  padding-right: 3px;
  width: 30px;
  height: 20px;
}

/*料金表*/
.planBox {
  display: flex;
  margin-right: -10px;
  margin-bottom: 10px;
  font-weight: 400;
}
.planBox .col {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -ms-flex-preferred-size: calc((100% / 5) - 10px);
  flex-basis: calc((100% / 5) - 10px);
  max-width: calc((100% / 5) - 10px);
  margin-right: 10px;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 1fr;
  grid-template-rows: auto 1fr;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "g1" "g2";
  min-width: 230px;
}
.planBox .col.small {
  margin-right: 100px;
}
.planBox .col .top {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: g1;
  position: relative;
}
.planBox .planName {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 60px;
  font-size: 20px;
  color: #fff;
  font-weight: 500;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  box-sizing: border-box;
}
.planBox .detail {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 15px 0;
}
.planBox .detail dl {
  text-align: center;
}
.planBox .detail dl dt {
  font-size: 14px;
}
.planBox .detail dl dd > span {
  padding-right: 5px;
  font-size: 28px;
  font-weight: 500;
}
.planBox .detail dl dd > span > span {
  padding: 0 3px;
  font-size: 15px;
  font-weight: 400;
}
.planBox .col.option .detail dl {
  height: 60px;
  display: flex;
  align-items: center;
}
.planBox .campaignIcon {
  position: absolute;
  top: -15px;
  left: -7px;
  width: 62px;
  height: 62px;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  border-radius: 50%;
  box-sizing: border-box;
  background-color: #f7465c;
}
.planBox .campaignIcon .first {
  margin: 10px 0 1px;
  font-size: 13px;
  font-weight: 400;
}
.planBox .campaignIcon .number {
  font-size: 25px;
  font-weight: 700;
}
.planBox .col.minimum .planName {
  background-color: #e88f25;
}
.planBox .col.minimum .detail {
  background-color: rgba(232, 143, 37, 0.2);
}
.planBox .col.small .planName {
  background-color: #debd32;
}
.planBox .col.small .detail {
  background-color: rgba(222, 189, 50, 0.2);
}
.planBox .col.standard .planName {
  background-color: #4fbbc1;
}
.planBox .col.standard .detail {
  background-color: rgba(79, 187, 193, 0.2);
}
.planBox .col.business .planName {
  background-color: #2e98cc;
}
.planBox .col.business .detail {
  background-color: rgba(46, 152, 204, 0.2);
}
.planBox .col.professional .planName {
  background-color: #756bc3;
}
.planBox .col.professional .detail {
  background-color: rgba(117, 107, 195, 0.2);
}
.planBox .col.enterprise .planName {
  background-color: #4d6bbc;
}
.planBox .col.enterprise .detail {
  background-color: rgba(77, 107, 188, 0.2);
}
.planBox .col.option .planName {
  background-color: #70ff00;
}
.planBox .col.option .detail {
  background-color: rgba(112, 255, 0, 0.2);
}
.planBox .col .bottom {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: g2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 10px 15px 5px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #f5f6fa;
}
.planBox .col.minimum .bottom,
.planBox .col.small .bottom {
  align-items: flex-start;
}
.planBox .fee {
  width: 100%;
  margin-bottom: 10px;
}
.planBox .col.option .fee dt {
  margin-bottom: 50px;
}
.planBox .fee dt {
  text-align: center;
}
.planBox .fee dt .people {
  padding-right: 8px;
  font-size: 14px;
}
.planBox .fee dt .number {
  font-size: 20px;
  font-weight: 500;
}
.planBox .fee dt .number span {
  font-size: 15px;
}
.planBox .fee dd .feeBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 90px;
  padding: 0 5px;
  color: #333 !important;
  text-decoration: none;
  text-align: left;
  border: 4px solid #efefef;
  border-radius: 5px;
  box-sizing: border-box;
  background: url("../common-img/ico_plan_arrow.svg") no-repeat right 10px
    center;
  background-size: 12px 19px;
  background-color: #fff;
  transition: border 0.3s;
}
.planBox .fee dd .feeBtn:hover {
  border: 4px solid #f9ba4a;
  opacity: 1;
}
.planBox .fee dd .feeBtn.active {
  border: 4px solid #f9ba4a;
  opacity: 1;
}
.planBox .fee .feeInner {
  display: block;
  text-align: center;
}
.planBox .fee .feeInner > span {
  display: block;
}
.planBox .fee .regularPrice {
  padding-bottom: 5px;
  font-size: 12px;
  line-height: 1;
}
.planBox .fee .monthlyPrice {
  padding-bottom: 2px;
  font-size: 14px;
  line-height: 1;
}
.planBox .fee .monthlyPrice .price {
  padding-right: 5px;
  font-family: "Noto Sans", sans-serif;
  font-size: 30px;
  font-weight: 700;
}
.planBox .fee .monthlyPrice .unit {
  margin-left: 0;
  margin-right: 0;
}
.planBox .col.minimum .fee .monthlyPrice .price {
  color: #e38210;
}
.planBox .col.small .fee .monthlyPrice .price {
  color: #debd32;
}
.planBox .col.standard .fee .monthlyPrice .price {
  color: #4fbbc1;
}
.planBox .col.business .fee .monthlyPrice .price {
  color: #2e98cc;
}
.planBox .col.professional .fee .monthlyPrice .price {
  color: #756bc3;
}
.planBox .col.option .fee .monthlyPrice .price {
  color: #70ff00;
}
.planBox .fee .yearlyPrice {
  font-size: 12px;
  line-height: 1;
}
.planBox .fee .yearlyPrice .Strikethrough {
  padding-right: 5px;
}
.planBox .fee .yearlyPrice .price {
  font-size: 15px;
  padding-right: 2px;
}
.planBox .fee .yearlyPrice .unit {
  margin-left: 0;
  margin-right: 0;
}
.planBox .estimate {
  margin-bottom: 20px;
  text-align: center;
}
.planBox .estimate p {
  margin-bottom: 10px;
  line-height: 1.5em;
}
.planBox .estimate .LinkBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 40px;
  padding-bottom: 2px;
  font-size: 17px;
  color: #fff !important;
  text-decoration: none;
  border-radius: 5px;
  box-sizing: border-box;
  background-color: #535353;
  transition: opacity 0.3s;
}
.planBox .estimate .LinkBtn.conversion {
  border: none;
  background-color: #f9b923;
}
.planBox .estimate .LinkBtn:hover {
  opacity: 0.7;
}
.planBox .fee .Strikethrough {
  text-decoration: line-through;
}
.planBox .fee .emphasis {
  color: #f7465c !important;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ゲスト用ダッシュボード
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*お知らせ*/
.newsBox {
  height: 45px;
  overflow-y: auto;
}
.newsBox ul {
  list-style: none;
}
.newsBox ul li {
  margin-bottom: 5px;
}
.newsBox ul li {
}
.newsBox ul li dl {
  display: flex;
}
.newsBox ul li dl dt {
  margin-top: 1px;
  margin-right: 15px;
  font-size: 0.75rem;
  font-weight: 500;
}
.newsBox ul li dl dd {
  font-size: 0.875rem;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ゲスト用_書類一覧
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#documentList {
  height: 100vh;
}

/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
テーブル_セル幅
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*顧客管理_顧客一覧*/
.usersIndexTable thead th:first-child,
.usersIndexTable tbody th:first-child {
  width: 200px !important;
  min-width: 200px !important;
  white-space: normal;
}
.usersIndexTable thead th:nth-of-type(2),
.usersIndexTable tbody td:nth-child(2) {
  width: 130px !important;
  min-width: 130px !important;
}
.usersIndexTable thead th:nth-of-type(3),
.usersIndexTable tbody td:nth-child(3) {
  white-space: normal;
}
.usersIndexTable thead th:nth-of-type(4),
.usersIndexTable tbody td:nth-child(4) {
  width: 140px !important;
  min-width: 140px !important;
}
.usersIndexTable thead th:nth-of-type(5),
.usersIndexTable tbody td:nth-child(5) {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}
.usersIndexTable thead th:nth-of-type(7),
.usersIndexTable tbody td:nth-child(7) {
  width: 120px !important;
  min-width: 120px !important;
  white-space: normal;
}

/*お知らせ管理_お知らせ一覧*/
.informationsIndexTable thead th:nth-of-type(2),
.informationsIndexTable tbody td:nth-child(2) {
  white-space: normal;
}

/*案件_案件一覧*/
.processesIndexTable thead th:first-child,
.processesIndexTable tbody td:first-child {
  min-width: 230px !important;
  white-space: normal;
}
.processesIndexTable thead th:nth-of-type(2),
.processesIndexTable tbody td:nth-child(2) {
  width: 230px !important;
  min-width: 230px !important;
  white-space: normal;
}
.processesIndexTable thead th:nth-of-type(3),
.processesIndexTable tbody td:nth-child(3) {
  width: 220px !important;
  min-width: 220px !important;
  white-space: normal;
}
.processesIndexTable thead th:nth-of-type(4),
.processesIndexTable tbody td:nth-child(4) {
  width: 140px !important;
  min-width: 140px !important;
  white-space: normal;
}
.processesIndexTable thead th:nth-of-type(5),
.processesIndexTable tbody td:nth-child(5) {
  width: 130px !important;
  min-width: 130px !important;
  white-space: normal;
}
.processesIndexTable thead th:last-child,
.processesIndexTable tbody td:last-child {
  width: 520px !important;
  min-width: 520px !important;
  white-space: normal;
}

/*案件_案件詳細_申請情報*/
.processesInfoAppliinfoTable thead th:first-child,
.processesInfoAppliinfoTable tbody th:first-child {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}
.processesInfoAppliinfoTable thead th:nth-of-type(2),
.processesInfoAppliinfoTable tbody td:nth-child(2) {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}

/*案件_案件詳細_関係機関*/
.processesInfoOrganizationsTable thead th:first-child,
.processesInfoOrganizationsTable tbody th:first-child {
  width: 320px !important;
  min-width: 320px !important;
  white-space: normal;
}
.processesInfoOrganizationsTable thead th:nth-of-type(4),
.processesInfoOrganizationsTable tbody td:nth-child(4) {
  width: 320px !important;
  min-width: 320px !important;
  white-space: normal;
}
.processesInfoOrganizationsTable thead th:nth-of-type(6),
.processesInfoOrganizationsTable tbody td:nth-child(6) {
  width: 220px !important;
  min-width: 220px !important;
  white-space: normal;
}
.processesInfoOrganizationsTable thead th,
.processesInfoOrganizationsTable tbody td:last-child {
  width: 50px !important;
  min-width: 50px !important;
}

/*案件_案件詳細_書類一式*/
.processesInfoDocumentlistTable thead th:first-child,
.processesInfoDocumentlistTable tbody td:first-child {
  width: 400px !important;
  min-width: 400px !important;
  white-space: normal;
}
.processesInfoDocumentlistTable thead th:nth-of-type(2),
.processesInfoDocumentlistTable tbody td:nth-child(2) {
}
.processesInfoDocumentlistTable thead th:nth-of-type(3),
.processesInfoDocumentlistTable tbody td:nth-child(3) {
  width: 135px !important;
  min-width: 135px !important;
  white-space: normal;
}
.processesInfoDocumentlistTable thead th:nth-of-type(4),
.processesInfoDocumentlistTable tbody td:nth-child(4) {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}

/*案件_初回聴取_配信スケジュール追加*/
.firstHearingScheduledTable thead th:first-child,
.firstHearingScheduledTable tbody th:first-child {
  width: 170px !important;
  min-width: 170px !important;
}
.firstHearingScheduledTable thead th:nth-of-type(2),
.firstHearingScheduledTable tbody td:nth-child(2) {
  white-space: normal;
}
.firstHearingScheduledTable thead th:nth-of-type(3),
.firstHearingScheduledTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.firstHearingScheduledTable thead th:nth-of-type(4),
.firstHearingScheduledTable tbody td:nth-child(4) {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}
.firstHearingScheduledTable thead th:last-child,
.firstHearingScheduledTable tbody td:last-child {
  width: 50px !important;
  min-width: 50px !important;
}

/*案件_初回聴取_配信済リスト*/
.firstHearingSendingListTable thead th:first-child,
.firstHearingSendingListTable tbody th:first-child {
  width: 130px !important;
  min-width: 130px !important;
}
.firstHearingSendingListTable thead th:nth-of-type(2),
.firstHearingSendingListTable tbody td:nth-child(2) {
  width: 180px !important;
  min-width: 180px !important;
  white-space: normal;
}
.firstHearingSendingListTable thead th:nth-of-type(3),
.firstHearingSendingListTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.firstHearingSendingListTable thead th:nth-of-type(4),
.firstHearingSendingListTable tbody td:nth-child(4) {
  white-space: normal;
}
.firstHearingSendingListTable thead th:last-child,
.firstHearingSendingListTable tbody td:last-child {
  width: 310px !important;
  min-width: 310px !important;
}

/*案件_本聴取_配信*/
.mainHearingSendTable thead th:first-child,
.mainHearingSendTable tbody td:first-child {
  width: 130px !important;
  min-width: 130px !important;
  white-space: normal;
}
.mainHearingSendTable thead th:nth-of-type(2),
.mainHearingSendTable tbody td:nth-child(2) {
  white-space: normal;
}

/*案件_保聴取_配信スケジュール追加*/
.mainHearingScheduledTable thead th:first-child,
.mainHearingScheduledTable tbody th:first-child {
  width: 200px !important;
  min-width: 200px !important;
}
.mainHearingScheduledTable thead th:nth-of-type(2),
.mainHearingScheduledTable tbody td:nth-child(2) {
  white-space: normal;
}
.mainHearingScheduledTable thead th:nth-of-type(3),
.mainHearingScheduledTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.mainHearingScheduledTable thead th:nth-of-type(4),
.mainHearingScheduledTable tbody td:nth-child(4) {
  width: 270px !important;
  min-width: 270px !important;
  white-space: normal;
}

/*案件_本聴取_配信済リスト*/
.mainHearingSendingListTable thead th:first-child,
.mainHearingSendingListTable tbody th:first-child {
  width: 130px !important;
  min-width: 130px !important;
}
.mainHearingSendingListTable thead th:nth-of-type(2),
.mainHearingSendingListTable tbody td:nth-child(2) {
  white-space: normal;
}
.mainHearingSendingListTable thead th:nth-of-type(3),
.mainHearingSendingListTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.mainHearingSendingListTable thead th:nth-of-type(4),
.mainHearingSendingListTable tbody td:nth-child(4) {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}
.mainHearingSendingListTable thead th:last-child,
.mainHearingSendingListTable tbody td:last-child {
  width: 380px !important;
  min-width: 380px !important;
}

/*案件_書類収集_担当設定*/
.docGatheringPICTable thead th:first-child,
.docGatheringPICTable tbody td:first-child {
  width: 400px !important;
  min-width: 400px !important;
  white-space: normal;
}
.docGatheringPICTable thead th:nth-of-type(2),
.docGatheringPICTable tbody td:nth-child(2) {
}
.docGatheringPICTable thead th:nth-of-type(3),
.docGatheringPICTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
  white-space: normal;
}
.docGatheringPICTable thead th:last-child,
.docGatheringPICTable tbody td:last-child {
  width: 190px !important;
  min-width: 190px !important;
}

/*案件_書類収集_メール送信*/
.docGatheringSendTable thead th:first-child,
.docGatheringSendTable tbody td:first-child {
  width: 300px !important;
  min-width: 300px !important;
}

/*案件_書類収集_収集状況*/
.docGatheringStatusTable thead th:nth-of-type(1),
.docGatheringStatusTable tbody td:nth-child(1) {
  min-width: 300px !important;
  white-space: normal;
}
.docGatheringStatusTable thead th:nth-of-type(2),
.docGatheringStatusTable tbody td:nth-child(2) {
  width: 500px !important;
  min-width: 500px !important;
  white-space: normal;
}
.docGatheringStatusTable thead th:nth-of-type(3),
.docGatheringStatusTable tbody td:nth-child(3) {
  width: 180px !important;
  min-width: 180px !important;
}
.docGatheringStatusTable thead th:nth-of-type(4),
.docGatheringStatusTable tbody td:nth-child(4) {
  width: 150px !important;
  min-width: 150px !important;
}
.docGatheringStatusTable thead th:nth-of-type(5),
.docGatheringStatusTable tbody td:nth-child(5) {
  width: 130px !important;
  min-width: 130px !important;
}

/*案件_書類収集_収集状況_配信スケジュール追加*/
.docGatheringScheduledTable thead th:first-child,
.docGatheringScheduledTable tbody th:first-child {
  width: 200px !important;
  min-width: 200px !important;
}
.docGatheringScheduledTable thead th:nth-of-type(2),
.docGatheringScheduledTable tbody td:nth-child(2) {
  white-space: normal;
}
.docGatheringScheduledTable thead th:nth-of-type(3),
.docGatheringScheduledTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.docGatheringScheduledTable thead th:nth-of-type(4),
.docGatheringScheduledTable tbody td:nth-child(4) {
  width: 270px !important;
  min-width: 270px !important;
  white-space: normal;
}

/*案件_書類収集_収集状況_送信済リスト*/
.docGatheringSendingListTable thead th:first-child,
.docGatheringSendingListTable tbody th:first-child {
  width: 180px !important;
  min-width: 180px !important;
}
.docGatheringSendingListTable thead th:nth-of-type(2),
.docGatheringSendingListTable tbody td:nth-child(2) {
  white-space: normal;
}
.docGatheringSendingListTable thead th:nth-of-type(3),
.docGatheringSendingListTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.docGatheringSendingListTable thead th:nth-of-type(4),
.docGatheringSendingListTable tbody td:nth-child(4) {
  width: 330px !important;
  min-width: 330px !important;
  white-space: normal;
}
.docGatheringSendingListTable thead th:last-child,
.docGatheringSendingListTable tbody td:last-child {
  width: 170px !important;
  min-width: 170px !important;
}

/*案件_書類収集_署名・押印*/
.docGatheringSignatureTable thead th:nth-of-type(2),
.docGatheringSignatureTable tbody td:nth-child(2) {
  width: 130px !important;
  min-width: 130px !important;
}
.docGatheringSignatureTable thead th:nth-of-type(3),
.docGatheringSignatureTable tbody td:nth-child(3) {
  width: 130px !important;
  min-width: 130px !important;
}

/*案件_追加依頼_メール送信*/
.extraRequestSendTable thead th:first-child,
.extraRequestSendTable tbody td:first-child {
  width: 250px !important;
  min-width: 250px !important;
}

/*案件_追加依頼_メール送信_配信スケジュール追加*/
.extraRequestScheduledTable thead th:first-child,
.extraRequestScheduledTable tbody th:first-child {
  width: 200px !important;
  min-width: 200px !important;
}
.extraRequestScheduledTable thead th:nth-of-type(2),
.extraRequestScheduledTable tbody td:nth-child(2) {
  white-space: normal;
}
.extraRequestScheduledTable thead th:nth-of-type(3),
.extraRequestScheduledTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.extraRequestScheduledTable thead th:nth-of-type(4),
.extraRequestScheduledTable tbody td:nth-child(4) {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}

/*案件_追加依頼_メール送信_送信済リスト*/
.extraRequestSendingListTable thead th:first-child,
.extraRequestSendingListTable tbody th:first-child {
  width: 180px !important;
  min-width: 180px !important;
}
.extraRequestSendingListTable thead th:nth-of-type(2),
.extraRequestSendingListTable tbody td:nth-child(2) {
  white-space: normal;
}
.extraRequestSendingListTable thead th:nth-of-type(3),
.extraRequestSendingListTable tbody td:nth-child(3) {
  width: 120px !important;
  min-width: 120px !important;
}
.extraRequestSendingListTable thead th:nth-of-type(4),
.extraRequestSendingListTable tbody td:nth-child(4) {
  width: 320px !important;
  min-width: 320px !important;
  white-space: normal;
}
.extraRequestSendingListTable thead th:last-child,
.extraRequestSendingListTable tbody td:last-child {
  width: 170px !important;
  min-width: 170px !important;
}

/*案件_申請結果*/
.applicationResultTable thead th:first-child,
.applicationResultTable tbody th:first-child {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}
.applicationResultTable thead th:nth-of-type(2),
.applicationResultTable tbody td:nth-child(2) {
  white-space: normal;
}

/*ゲスト_ダッシュボード*/
.guestDashboardMainTable thead th:first-child,
.guestDashboardMainTable tbody th:first-child {
  width: 400px !important;
  min-width: 400px !important;
}
.guestDashboardMainTable thead th:nth-of-type(2),
.guestDashboardMainTable tbody td:nth-child(2) {
  white-space: normal;
}
.guestDashboardMainTable thead th:nth-of-type(3),
.guestDashboardMainTable tbody td:nth-child(3) {
  width: 180px !important;
  min-width: 180px !important;
}
.guestDashboardMainTable thead th:nth-of-type(4),
.guestDashboardMainTable tbody td:nth-child(4) {
  width: 150px !important;
  min-width: 150px !important;
}

/*ゲスト用_書類一覧*/
.hearingformDocumentTable thead th:first-child,
.hearingformDocumentTable tbody td:first-child {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}
.hearingformDocumentTable thead th:nth-of-type(2),
.hearingformDocumentTable tbody td:nth-child(2) {
  min-width: 500px !important;
  white-space: normal;
}
.hearingformDocumentTable thead th:nth-of-type(3),
.hearingformDocumentTable tbody td:nth-child(3) {
  width: 50px !important;
  min-width: 50px !important;
}
.hearingformDocumentTable thead th:nth-of-type(4),
.hearingformDocumentTable tbody td:nth-child(4) {
  width: 50px !important;
  min-width: 50px !important;
}
.hearingformDocumentTable thead th:nth-of-type(5),
.hearingformDocumentTable tbody td:nth-child(5) {
}
.hearingformDocumentTable thead th:nth-of-type(6),
.hearingformDocumentTable tbody td:nth-child(6) {
}

/*登録支援機関_詳細_担当者*/
.supportAgencyDetailStaff thead th:first-child,
.supportAgencyDetailStaff tbody td:first-child {
  width: 250px !important;
  min-width: 250px !important;
}

/*登録支援機関_詳細_事業所*/
.supportAgencyDetailOffice thead th:first-child,
.supportAgencyDetailOffice tbody td:first-child {
  white-space: normal;
}
.supportAgencyDetailOffice thead th:nth-of-type(3),
.supportAgencyDetailOffice tbody td:nth-child(3) {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}

/*受入先_詳細_担当者*/
.recipientDetailStaff thead th:first-child,
.recipientDetailStaff tbody td:first-child {
  width: 250px !important;
  min-width: 250px !important;
}

/*受入先_詳細_事業所*/
.recipientDetailOffice thead th:first-child,
.recipientDetailOffice tbody td:first-child {
  white-space: normal;
}
.recipientDetailOffice thead th:nth-of-type(3),
.recipientDetailOffice tbody td:nth-child(3) {
  width: 300px !important;
  min-width: 300px !important;
  white-space: normal;
}

/*操作ログ*/
#logs .taskTable thead th:first-child,
#logs .taskTable tbody td:first-child {
  width: 250px !important;
  min-width: 250px !important;
  white-space: normal;
}

/*四半期報告書*/
.plus {
  background-image: url("../images/plus.svg");
  background-size: 20px, 20px;
  background-repeat: no-repeat;
  padding-left: 20px;
}
.minus {
  background-image: url("../images/minus.svg");
  background-size: 20px, 20px;
  background-repeat: no-repeat;
  padding-left: 20px;
}

.iconSendWhite {
  padding-left: 25px;
  line-height: 1;
  background: url("../images/ico_sendmail_white.svg") no-repeat left 0 center;
}
/*NOBORDER-21*/
button.btn-request-document {
  font-size: var(--fontsizeBtn);
  background-color: var(--addColor);
}
button.btn-request-document span {
  padding-left: 22px;
  background: url("../images/ico_email.svg") no-repeat left 0 top 0;
  background-size: 19px 19px;
}
button.btn-filter-question {
  font-size: var(--fontsizeBtn);
}
button.btn-filter-question span {
  padding-left: 22px;
  background: url("../images/ico_filter.svg") no-repeat left 0 top 0;
  background-size: 19px 19px;
}
.pr-20 {
  padding-right: 20px;
}
.d-flex {
  display: flex;
}

.documentList .vc-day .vc-day-content {
  margin-left: 0px !important;
}

input.memo {
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-select input[type="search"] {
  height: auto !important;
  padding: 0 10px !important;
  font-size: var(--fontsizeMain);
  border: none !important;
}

.vs--single .vs__selected {
  padding-left: 10px;
}
.v-select .vs__clear {
  display: none;
}

input.checkbox_send_mail {
  outline: none !important;
  outline-style: none !important;
}

dt.form-document {
  display: flex;
  align-items: center;
}

.v-toast__item .v-toast__text {
  padding: 0.75em 1em !important;
}

.v-toast__item {
  min-height: 2em !important;
}

.scrollTableFixR {
  display: block;
}

.w50per {
  width: 50% !important;
}
.w25per {
  width: 25% !important;
}
.w20per {
  width: 20% !important;
}
.w15per {
  width: 15% !important;
}

.modalWindow .scrollBox {
  overflow-x: hidden;
}

.head .download span {
  padding-left: 20px;
  background: url("../images/ico_download_white.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}

span.iconWaste {
  padding-left: 20px;
  background: url("../images/waste.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}

span.iconDanger {
  padding-left: 20px;
  background: url("../images/danger.svg") no-repeat left 0 center;
  background-size: 16px 15px;
}

.btnDownload {
  padding-left: 25px;
  background: url("../images/ico_download_white.svg") no-repeat left 0 center;
  background-size: 30px 15px;
}
.title-mail {
  padding-left: 10px;
  font-weight: 500;
}
.template-mail {
  padding: 10px 100px;
}

.vc-popover-content-wrapper {
  z-index: 9999 !important;
}

.questionInputListMaster .formBlock .inner .partsBox span {
  font-weight: 500;
}

.questionInputListMaster .formBlock .partsBox {
  margin-bottom: 5px;
}

.questionInputListMaster .item-question {
  margin-bottom: 30px;
}
button.setting span,
.modal-setting-applicants span {
  padding-left: 25px;
  background: url(../images/laptop.svg) no-repeat left 0 center;
  background-size: 20px 20px;
}
button.setting-memo span,
.modal-setting-memo span {
  padding-left: 25px;
  background: url(../images/ico_settings.svg) no-repeat left 0 center;
  background-size: 18px 18px;
}
button.setting-memo {
  margin-right: 10px;
  background-color: #bebfc2;
}
button.reset-setting {
  margin-left: 10px;
  background-color: #bebfc2;
}
/* 進行状況バー */
.progress-container {
  width: 100%;
  height: 20px;
  background-color: #e0e0e0;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: inset 0 -2px 4px rgba(255, 255, 255, 0.6),
    inset 0 2px 4px rgba(0, 0, 0, 0.2);
  position: relative;
}
.progress-bar {
  height: 100%;
  background: linear-gradient(to right, #ff6b8b, #ffb347, #2ecc71, #3498db);
  border-radius: 10px;
  position: relative;
  transition: width 0.3s ease;
  box-shadow: inset 0 -2px 4px rgba(255, 255, 255, 0.4),
    inset 0 2px 4px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0, 0, 0, 0.2);
}
.progress-bar::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.6),
    rgba(255, 255, 255, 0)
  );
  border-radius: 10px;
  z-index: 1;
  pointer-events: none;
}
.progress-bar::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 50%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
  border-radius: 10px;
  z-index: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

.result-process-visa.date input[type="text"]:disabled {
  background-image: url("../images/ico_date.svg");
  background-color: var(--disabledBgColor);
  color: var(--disabledTxtColor);
  opacity: 1;
  cursor: auto;
}
.manual-link {
  color: #5b98ec;
}

.vs--disabled .vs__clear,
.vs--disabled .vs__dropdown-toggle,
.vs--disabled .vs__open-indicator,
.vs--disabled .vs__search,
.vs--disabled .vs__selected {
  background-color: var(--disabledBgColor) !important;
  color: var(--disabledTxtColor) !important;
  cursor: not-allowed !important;
}

/* Cố định cột áp cuối */
.scrollTableFixTwoCol thead th:nth-last-child(2),
.scrollTableFixTwoCol tbody td:nth-last-child(2) {
  position: -webkit-sticky;
  position: sticky;
  right: 120px;
  background: var(--bgColor);
}

.scrollTableFixTwoCol thead th:nth-last-child(2) {
  z-index: 15;
}

.scrollTableFixTwoCol thead th:nth-last-child(2):before,
.scrollTableFixTwoCol tbody td:nth-last-child(2):before {
  content: "";
  position: absolute;
  display: block;
  border-left: 1px solid var(--tableBorderColor);
  box-sizing: border-box;
  left: 0;
  top: 0;
  z-index: 5;
  height: 100%;
}

.modalWindowInquiry {
  width: 70%;
  min-width: 900px;
}

.box-document-list table.table-documents td.col-document-name {
  width: 38% !important;
}

.modalWindowInquiry .scrollable-content {
  max-height: 70vh !important;
  min-height: 50vh !important;
  position: relative !important;
  overflow: auto !important;
  background: var(--bgColor) !important;
}

#Interview .formType2 > .inner {
  height: 100%;
  padding: 40px 40px 30px 40px !important;
  box-sizing: border-box;
  overflow: hidden !important;
}