@charset "UTF-8";
/* ----------------------------------*/
/* reset */
/* ----------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
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%;
  vertical-align: baseline;
  background: transparent; }

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
  display: block; }

audio, canvas, progress, video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

progress {
  vertical-align: baseline; }

template, [hidden] {
  display: none; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }
  a:active, a:hover {
    outline-width: 0; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

b, strong {
  font-weight: inherit; }

b, strong {
  font-weight: bolder; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

mark {
  background-color: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

img {
  border-style: none; }

svg:not(:root) {
  overflow: hidden; }

code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em; }

figure {
  margin: 1em 40px; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

button, input, select, textarea {
  font: inherit;
  margin: 0; }

optgroup {
  font-weight: bold; }

button, input {
  overflow: visible; }

input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

button, select {
  text-transform: none; }

button, html [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

textarea {
  overflow: auto; }

[type="checkbox"], [type="radio"] {
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }
  [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none; }

::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

* {
  box-sizing: border-box; }

@font-face {
  font-family: 'icon';
  src: url("../icon/icon.eot?togki3");
  src: url("../icon/icon.eot?togki3#iefix") format("embedded-opentype"), url("../icon/icon.ttf?togki3") format("truetype"), url("../icon/icon.woff?togki3") format("woff"), url("../icon/icon.svg?togki3#icon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block; }

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change ../icon/icon */
  font-family: 'icon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 14px;
  text-decoration: none;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-reference:before {
  content: "\e943"; }

.icon-receipt:before {
  content: "\e900"; }

.icon-menulist:before {
  content: "\e901"; }

.icon-invoice:before {
  content: "\e902"; }

.icon-alert:before {
  content: "\e903"; }

.icon-arrow:before {
  content: "\e904"; }

.icon-calendar:before {
  content: "\e905"; }

.icon-cancel:before {
  content: "\e906"; }

.icon-check:before {
  content: "\e907"; }

.icon-circle:before {
  content: "\e908"; }

.icon-comment_line:before {
  content: "\e909"; }

.icon-comment:before {
  content: "\e90a"; }

.icon-document_line:before {
  content: "\e90b"; }

.icon-document:before {
  content: "\e90c"; }

.icon-download:before {
  content: "\e90d"; }

.icon-edit:before {
  content: "\e90e"; }

.icon-exclamation_circle:before {
  content: "\e90f"; }

.icon-loupe:before {
  content: "\e910"; }

.icon-next:before {
  content: "\e911"; }

.icon-other:before {
  content: "\e912"; }

.icon-person_line:before {
  content: "\e913"; }

.icon-pin:before {
  content: "\e914"; }

.icon-plus:before {
  content: "\e915"; }

.icon-prev:before {
  content: "\e916"; }

.icon-printer:before {
  content: "\e917"; }

.icon-question_circle:before {
  content: "\e918"; }

.icon-reverse:before {
  content: "\e919"; }

.icon-setting:before {
  content: "\e91a"; }

.icon-sort:before {
  content: "\e91b"; }

.icon-star:before {
  content: "\e91c"; }

.icon-toggleslide:before {
  content: "\e91d"; }

.icon-trash:before {
  content: "\e91e"; }

.icon-upload-cloud_line:before {
  content: "\e91f"; }

.icon-upload-cloud:before {
  content: "\e920"; }

.icon-neutral_size:before {
  content: "\e922"; }

.icon-monochrome:before {
  content: "\e923"; }

.icon-singleline:before {
  content: "\e925"; }

.icon-journalize_open:before {
  content: "\e926"; }

.icon-detail_open:before {
  content: "\e927"; }

.icon-copy:before {
  content: "\e928"; }

.icon-help:before {
  content: "\e929"; }

.icon-prev1:before {
  content: "\e92a"; }

.icon-spoit:before {
  content: "\e92b"; }

.icon-send:before {
  content: "\e92c"; }

.icon-sendback:before {
  content: "\e92d"; }

.icon-passbook:before {
  content: "\e92e"; }

.icon-text:before {
  content: "\e92f"; }

.icon-copy_fill:before {
  content: "\e930"; }

.icon-paymentexport:before {
  content: "\e931"; }

.icon-export_makeleaps:before {
  content: "\e932"; }

.icon-update:before {
  content: "\e933"; }

.icon-history:before {
  content: "\e934"; }

.icon-documentmulti_line:before {
  content: "\e935"; }

.icon-documentalert_fill:before {
  content: "\e936"; }

.icon-documentalert_line:before {
  content: "\e937"; }

.icon-list-largeline:before {
  content: "\e938"; }

.icon-list-middleline:before {
  content: "\e939"; }

.icon-list-smallline:before {
  content: "\e93a"; }

.icon-journalize_close:before {
  content: "\e93b"; }

.icon-dashboard:before {
  content: "\e93c"; }

.icon-home:before {
  content: "\e93d"; }

.icon-rotate:before {
  content: "\e93e"; }

.icon-chatbot:before {
  content: "\e93f"; }

.icon-information_fill:before {
  content: "\e940"; }

.icon-link:before {
  content: "\e941"; }

.icon-circulation:before {
  content: "\e942"; }

.icon-upload:before {
  content: "\e921"; }

.icon-hand:before {
  content: "\e924"; }

.icon-skip {
  position: relative;
  width: 12px;
  height: 12px; }
  .icon-skip::before, .icon-skip::after {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%; }
  .icon-skip::before {
    border-radius: 50%;
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%);
    border: 2px solid #888888; }
  .icon-skip::after {
    background-color: #888888;
    width: 1px;
    height: 12px;
    transform: translate(-50%, -50%) rotate(45deg); }

/* ----------------------------------*/
/* 共通部分のスタイル */
/* ----------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  font-size: 12px;
  line-height: 1.5em;
  font-weight: normal;
  color: #373737;
  font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
  text-align: left;
  word-break: break-all;
  letter-spacing: 0;
  word-break: break-all;
  vertical-align: baseline;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased; }

html {
  height: 100%;
  font-size: 62.5%;
  overflow-y: auto; }

body {
  background-color: #f7f7f7;
  display: flex;
  min-width: 1280px;
  width: 100%;
  min-height: 100vh;
  overflow: hidden; }

main {
  transition: 0.33s ease-in-out; }

a {
  color: #373737;
  cursor: pointer;
  text-decoration: none; }

h2 {
  font-size: 18px;
  font-weight: bold; }

h3 {
  font-size: 16px;
  font-weight: bold; }

h4 {
  font-size: 14px;
  font-weight: bold; }

.textLink {
  color: #00B881; }
  .textLink:hover {
    text-decoration: underline; }

input, button {
  font-size: 14px;
  border-radius: 5px;
  padding: 10px; }

input {
  border: 1px solid #cccccc;
  line-height: 1em;
  padding-top: 3px;
  padding-bottom: 3px;
  background-color: #ffffff;
  color: #373737; }

input[type="date"] {
  padding-left: 4px; }

select {
  padding: 0 10px;
  font-size: 10px;
  padding-left: 12px;
  padding-right: 24px;
  line-height: 27px;
  height: 26px;
  width: 100%;
  color: #373737; }

select::-ms-expand {
  display: none; }

input[type="checkbox"] {
  width: 0;
  height: 0; }

.select {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ffffff;
  position: relative;
  border: 1px solid #cccccc;
  border-radius: 5px;
  padding-left: 0;
  padding-right: 0;
  height: 26px;
  z-index: 0; }
  .select::before, .select::after {
    content: "";
    border: 2px solid transparent;
    position: absolute;
    z-index: -1; }
  .select::before {
    border-bottom: 4px solid #373737;
    top: calc(50% - 4px);
    right: 8px;
    transform: translateY(-50%); }
  .select::after {
    border-top: 4px solid #373737;
    top: calc(50% + 4px);
    right: 8px;
    transform: translateY(-50%); }
  .select.select--disable {
    opacity: 0.55;
    background-color: #f5f5f5;
    pointer-events: none; }
  .select.select--transparent {
    background-color: transparent; }
  .select.select--small {
    font-size: 10px;
    height: 18px; }
    .select.select--small select {
      padding-left: 8px;
      padding-right: 16px; }

textarea {
  border: 1px solid #cccccc;
  line-height: 1.35em;
  padding: 4px 10px 3px;
  background-color: #ffffff;
  font-size: 14px;
  border-radius: 5px;
  color: #373737;
  min-height: 26px; }

input[type="text"],
input[type="email"],
input[type="password"] {
  height: 26px; }

input[type="date"]::-webkit-inner-spin-button {
  -webkit-appearance: none; }

input[type="date"]::-webkit-clear-button {
  -webkit-appearance: none; }

input[type="checkbox"] {
  opacity: 0; }

button {
  cursor: pointer;
  font-weight: bold;
  padding-top: 6px;
  padding-bottom: 6px; }
  button span[class*="icon-"]::before {
    vertical-align: -10%; }

::placeholder,
:placeholder-shown {
  font-size: 14px;
  color: rgba(51, 51, 51, 0.5);
  padding-top: 5px; }

:-ms-input-placeholder {
  letter-spacing: -0.045em;
  color: rgba(51, 51, 51, 0.5); }

.TradeAutomation {
  background-color: #F7F6F3; }

/* ----------------------------------*/
/* ボタンのスタイル */
/* ----------------------------------*/
.button {
  transition: 0.12s ease;
  cursor: pointer;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none; }
  .button:hover {
    opacity: 0.92; }
  .button span[class*="icon-"]::before {
    vertical-align: -10%; }

.button--red {
  background-color: #D0021B;
  color: #ffffff; }
  .button--red:active {
    background-color: #b60117;
    opacity: 1; }

.button--green {
  background-color: #00B881;
  color: #ffffff; }
  .button--green:active {
    background-color: #08805C;
    opacity: 1; }

.button--black {
  background-color: #373737;
  color: #ffffff; }
  .button--black span {
    color: #ffffff; }
  .button--black:active {
    background-color: #000000;
    opacity: 1; }

.button--white {
  background-color: #ffffff;
  color: #333333;
  border: 1px solid #cccccc; }
  .button--white:active {
    background-color: #f7f7f7;
    opacity: 1; }

.button--flat {
  background-color: #ffffff;
  color: #333333;
  border: 1px solid #cccccc;
  border-radius: 5px;
  font-size: 12px;
  padding: 16px;
  padding-top: 5px;
  padding-bottom: 6px; }
  .button--flat:active {
    background-color: #eeeeee;
    opacity: 1; }

.button--border {
  color: #333333;
  border: 1px solid #cccccc;
  border-radius: 5px;
  font-size: 12px;
  font-weight: normal;
  padding: 16px;
  padding-top: 5px;
  padding-bottom: 6px; }
  .button--border span {
    font-size: 12px;
    margin-right: 8px; }
  .button--border:active {
    opacity: 0.65; }

.button--textRed {
  color: #D0021B; }

.button--strong {
  border-color: #5a5a5a; }

.button--middle, .button--tiny, .button--small, .button--large {
  min-width: 144px;
  padding: 4px 20px;
  font-size: 12px;
  font-weight: normal; }

.button--large {
  min-width: 220px; }

.button--small {
  min-width: 72px; }

.button--tiny {
  min-width: 0;
  font-size: 10px;
  padding: 2px 8px; }

.button--narrow {
  min-width: 0; }

.button--disable {
  pointer-events: none;
  opacity: 0.2; }

.button__image {
  height: 12px;
  width: auto;
  margin-right: 4px;
  margin-bottom: -1px; }

.delivery .button--black {
  background-color: #224D3F; }
  .delivery .button--black:active {
    background-color: #284038; }

/* ----------------------------------*/
/* チェックボックスのスタイル */
/* ----------------------------------*/
.checkbox__check {
  border: 1px solid #cccccc;
  width: 12px;
  height: 12px;
  display: block;
  background-color: #ffffff;
  border-radius: 1px;
  position: relative;
  transition: 0.1s ease-out;
  margin-right: 4px; }
  .checkbox__check::before {
    content: "";
    width: 6px;
    height: 2px;
    border-left: 2px solid;
    border-bottom: 2px solid;
    border-color: #ffffff;
    position: absolute;
    top: 2px;
    left: 1px;
    transform: rotate(-45deg);
    opacity: 0;
    transition: 0.2s ease; }

.checkbox__check--tiny, .list__result__line--smallLine .checkbox__check {
  width: 9px;
  height: 9px;
  border-radius: 1px; }
  .checkbox__check--tiny::before, .list__result__line--smallLine .checkbox__check::before {
    width: 5px;
    height: 2px;
    top: 1px;
    left: 0px; }

.checkbox__check--large, .list__result__check--large .checkbox__check {
  width: 17px;
  height: 17px;
  transition: 0.12s ease-in-out;
  position: relative;
  border-color: #e0e0e0;
  border-radius: 4px;
  margin-right: 16px; }
  .checkbox__check--large::before, .list__result__check--large .checkbox__check::before {
    width: 8px;
    height: 3px;
    top: 4px;
    left: 3px; }

input:checked + .checkbox__check {
  background-color: #23D19D;
  border-color: #23D19D; }
  input:checked + .checkbox__check::before {
    opacity: 1; }

.checkbox__title {
  font-size: 10px;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none; }

.checkbox--text {
  display: flex;
  align-items: center;
  width: auto;
  transition: 0.12s ease opacity;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none; }
  .checkbox--text input[type="checkbox"] {
    display: none; }
  .checkbox--text .checkbox__check {
    width: 17px;
    height: 17px;
    border-radius: 4px;
    margin-right: 8px; }
    .checkbox--text .checkbox__check::before {
      width: 8px;
      height: 3px;
      top: 4px;
      left: 3px; }
  .checkbox--text .checkbox__check--small {
    width: 12px;
    height: 12px;
    border-radius: 1px; }
    .checkbox--text .checkbox__check--small::before {
      width: 6px;
      height: 2px;
      top: 2px;
      left: 1px; }
  .checkbox--text .checkbox__check--tiny, .checkbox--text .list__result__line--smallLine .checkbox__check, .list__result__line--smallLine .checkbox--text .checkbox__check {
    width: 9px;
    height: 9px;
    border-radius: 1px; }
    .checkbox--text .checkbox__check--tiny::before, .checkbox--text .list__result__line--smallLine .checkbox__check::before, .list__result__line--smallLine .checkbox--text .checkbox__check::before {
      width: 5px;
      height: 2px;
      top: 1px;
      left: 0px; }

.checkbox__text--small {
  font-size: 12px; }

.checkbox__text--minimum {
  font-size: 10px; }

.checkbox__text--gray {
  color: #888888; }

.checkbox--text--disable {
  opacity: 0.4;
  pointer-events: none;
  cursor: auto; }
  .checkbox--text--disable .checkbox__check {
    background-color: #f5f5f5;
    border-color: #e0e0e0; }
    .checkbox--text--disable .checkbox__check::before {
      border-color: #cccccc; }
  .checkbox--text--disable input:checked + .checkbox__check {
    background-color: #f5f5f5;
    border-color: #e0e0e0; }

/* ----------------------------------*/
/* ヘッダーのスタイル */
/* ----------------------------------*/
.header {
  width: 100%;
  background-color: #ffffff;
  box-sizing: border-box;
  border-bottom: 1px solid #e0e0e0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 32px;
  padding-left: 16px;
  z-index: 20;
  height: 44px; }

.menu--fixed ~ main .header {
  width: calc(100% - 40px);
  position: fixed;
  top: 0;
  left: 40px; }

.header__prev {
  font-size: 18px;
  margin-right: 12px; }

.header__title {
  margin-right: auto; }

.header__user {
  display: flex;
  align-items: center;
  cursor: pointer; }
  .header__user .subMenu {
    top: 34px;
    right: 0; }

.header__profile {
  margin-right: 12px;
  width: 26px;
  height: 26px; }

.header__name {
  font-size: 12px; }

.header__triangle {
  margin-top: 4px;
  margin-left: 12px; }

/* ----------------------------------*/
/* インプット全体に関するエリアのスタイル */
/* ----------------------------------*/
.input__error {
  border-color: #f794a6; }

.input__errorText {
  color: #D0021B;
  width: 100%;
  font-size: 10px;
  margin-top: 4px; }

.input__cautionText {
  color: #F0AD3E;
  width: 100%;
  font-size: 10px;
  margin-top: 4px; }

.input__errorText + .login__input {
  margin-top: 8px; }

.input__caution {
  border-color: #F0AD3E; }

input::-ms-clear {
  visibility: hidden;
  width: 0%; }

.input__alignRight {
  text-align: right; }

/* ----------------------------------*/
/* 日付エリアのスタイル */
/* ----------------------------------*/
.input__date {
  width: 104px;
  position: relative; }
  .input__date input {
    width: 100%;
    height: 26px;
    font-size: 10px;
    letter-spacing: -0.068em;
    line-height: 14px; }
  .input__date input[type="reset"] {
    display: none; }
  .input__date input[type=date]::-webkit-calendar-picker-indicator {
    z-index: 50;
    opacity: 0;
    height: 100%;
    cursor: pointer;
    width: 14px;
    height: 26px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1; }
  .input__date .icon-calendar {
    color: #373737;
    position: absolute;
    right: 8px;
    margin: 0;
    margin: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: #ffffff;
    z-index: 1;
    pointer-events: none; }

.input__date__calendar {
  position: absolute;
  top: 0;
  left: 0;
  padding: 12px 12px 20px;
  background-color: #ffffff;
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  width: 240px;
  border-radius: 5px;
  border: 1px solid #cccccc; }
  .input__date__calendar li {
    list-style: none; }
  .input__date__calendar a {
    text-decoration: none; }

.calendar__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%; }
  .calendar__header h6 {
    font-weight: bold;
    font-size: 10px; }

.calendar__header__leftpager {
  transform: rotate(90deg); }
  .calendar__header__leftpager .triangle {
    border: 4px solid transparent;
    border-top: 7px solid #333333; }

.calendar__header__rightpager {
  transform: rotate(-90deg); }
  .calendar__header__rightpager .triangle {
    border: 4px solid transparent;
    border-top: 7px solid #333333; }

.calendar__month__header {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 16px; }
  .calendar__month__header li {
    font-size: 10px;
    transform: scale(0.8);
    text-align: center;
    width: calc(100% / 7); }

.calendar__month {
  width: 100%; }

.calendar__month__body {
  margin-top: 4px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  .calendar__month__body li {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    width: calc(100% / 7);
    margin-top: 14px; }
  .calendar__month__body li:not(.calendar__disableDay) {
    background-color: #E5FFF7; }
  .calendar__month__body a {
    font-weight: bold; }

.calendar__disableDay a {
  pointer-events: none;
  color: #cccccc; }

.calendar__holiDay {
  color: #D0021B; }
  .calendar__holiDay a {
    color: #D0021B; }

.calendar__circleDay a {
  position: relative;
  z-index: 0;
  font-size: 12px; }
  .calendar__circleDay a::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 28px;
    height: 28px;
    transform: translateY(-50%) translateX(-50%);
    background-color: #ffffff;
    border-radius: 50%;
    border: 1px solid #373737;
    z-index: -1; }

/* ----------------------------------*/
/* 左メニューのスタイル */
/* ----------------------------------*/
.menu {
  width: 218px;
  height: 100%;
  min-height: 100vh;
  background-color: #373737;
  position: fixed;
  overflow: visible;
  z-index: 22;
  transition: 0.33s ease-in-out width;
  padding-bottom: 100px; }
  .menu::after {
    content: "";
    position: fixed;
    display: block;
    bottom: 0;
    left: 0;
    height: 56px;
    width: 218px;
    background: linear-gradient(to bottom, rgba(55, 55, 55, 0) 0%, #373737 28%, #373737 100%);
    z-index: 22;
    transition: 0.33s ease-in-out width; }

.menu__wrap {
  width: 218px;
  height: 100%;
  overflow: auto;
  padding-bottom: 100px;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .menu__wrap::-webkit-scrollbar {
    display: none; }

.menu--close {
  width: 40px; }
  .menu--close::after {
    height: 120px;
    width: 40px; }
  .menu--close .menu__logo {
    width: 40px;
    transition: 0.33s ease-in-out width; }
    .menu--close .menu__logo img {
      visibility: hidden;
      opacity: 0;
      transition: 0.33s ease-in-out; }
  .menu--close .menu__wrap__links {
    width: 40px; }
  .menu--close .menu__title {
    padding-left: 8px; }
  .menu--close .menu__title--current {
    padding-left: 14px; }
  .menu--close .menu__upload,
  .menu--close .menu__list,
  .menu--close .menu__setting,
  .menu--close .menu__circulation,
  .menu--close .menu__paymentExport,
  .menu--close .menu__makeleaps,
  .menu--close .menu__common {
    max-height: 60px;
    transition: 0.33s ease-in-out;
    overflow: hidden; }
  .menu--close .menu__links__link {
    display: none; }
  .menu--close .menu__border {
    max-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    opacity: 0;
    visibility: hidden; }
  .menu--close h4, .menu--close .menu__links {
    opacity: 0;
    transition: 0.09s ease; }
  .menu--close .menu__list__toggle {
    display: none; }
  .menu--close .menu__toggleSlide {
    width: 40px;
    padding-left: 30px; }
  .menu--close .menu__toggle__button {
    transform: rotate(180deg); }
  .menu--close .menu__help {
    transform: translateX(6px) translateY(-53px); }
  .menu--close .menu__chatbot {
    transform: translateX(-34px) translateY(-95px); }
  .menu--close .menu__toggleSlide {
    left: -14px; }
  .menu--close.menu--2column .menu__help,
  .menu--close.menu--2column .menu__chatbot,
  .menu--close.menu--2column .menu__option__setting {
    transform: translateX(0) translateY(-37px); }
  .menu--close .menu__wrap--2column {
    width: 40px;
    flex-direction: column; }
  .menu--close .menu__wrap__category {
    height: auto;
    position: relative;
    background-color: transparent; }
  .menu--close .menu__category:not(.menu__category--current) {
    height: 0;
    opacity: 0;
    display: none; }
  .menu--close .menu__category--current {
    background-color: transparent;
    height: 60px; }

.menu--open {
  width: 218px; }

.menu ~ main {
  width: calc(100% - 218px);
  margin-left: 218px; }

.menu--close ~ main {
  width: calc(100% - 40px);
  margin-left: 40px; }

.menu--open ~ main {
  width: calc(100% - 218px); }

.menu__logo {
  display: flex;
  align-items: center;
  height: 60px;
  border-left: 4px solid #D0021B;
  padding-left: 16px;
  margin: 0;
  background-color: #2d2d2d;
  z-index: 50;
  position: fixed;
  top: 0;
  left: 0;
  width: 218px;
  transition: 0.33s ease-in-out width; }
  .menu__logo img {
    width: 161px;
    transition: 0.33s ease-in-out; }

.menu__icon::before {
  color: #ffffff;
  font-size: 22px; }

.menu__title {
  height: 60px;
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 20px;
  padding-right: 24px;
  transition: 0.18s ease; }
  .menu__title h4 {
    font-size: 14px;
    font-weight: normal;
    color: #ffffff;
    margin-left: 16px; }

.menu__title--noIcon h4 {
  margin-left: 0; }

.menu__title--current h4 {
  font-weight: bold; }

.menu__title--current::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 4px;
  background-color: #ffffff; }

.menu__title--current::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #ffffff;
  opacity: 0.1; }

.menu__list__toggle {
  margin-left: auto;
  position: absolute;
  right: 24px;
  top: 24px;
  z-index: 12; }
  .menu__list__toggle::before {
    position: relative;
    z-index: 5; }
  .menu__list__toggle::after {
    content: "";
    background-color: #000000;
    border-radius: 50%;
    width: 29px;
    height: 29px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: 0.06s ease;
    transform: translateX(-50%) translateY(-50%) scale(0);
    z-index: 4; }
  .menu__list__toggle:active::after {
    transform: translateX(-50%) translateY(-50%) scale(1); }

.menu__upload,
.menu__list,
.menu__setting,
.menu__paymentExport,
.menu__makeleaps {
  width: 100%;
  position: relative;
  overflow: hidden;
  max-height: 600px;
  transition: 0.18s ease-in-out; }
  .menu__upload .menu__list__toggle::before,
  .menu__list .menu__list__toggle::before,
  .menu__setting .menu__list__toggle::before,
  .menu__paymentExport .menu__list__toggle::before,
  .menu__makeleaps .menu__list__toggle::before {
    transform: rotate(180deg); }

h4, .menu__links {
  opacity: 1;
  transition: 0.1s ease; }

.menu__section--close {
  max-height: 60px; }
  .menu__section--close .menu__list__toggle::before {
    transform: rotate(0deg); }

.menu__section--open,
.menu__section--open {
  max-height: auto; }

.menu__list__toggle::before {
  color: #ffffff;
  display: inline-block;
  transition: 0.18s ease; }

.menu__links {
  max-height: 800px;
  transition: 0.18s ease-out; }

.menu__links--open {
  max-height: 800px; }

.menu__links__link {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  color: #ffffff;
  font-size: 12px;
  margin-left: 4px;
  padding-left: 16px;
  padding-right: 20px; }

.menu__links__amount {
  color: #ffffff;
  width: 20px;
  height: 20px;
  margin-left: auto;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 5px;
  font-size: 10px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center; }

.menu__links__alert {
  color: #D0021B;
  margin-left: auto;
  background-color: #ffffff;
  border-radius: 50%;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center; }

.menu__links__link--current {
  position: relative; }
  .menu__links__link--current::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: #ffffff;
    opacity: 0.1; }

.menu__border {
  margin: 12px 20px;
  border: none;
  border-bottom: 1px solid #ffffff;
  opacity: 0.3;
  transition: 0.09s linear;
  max-height: 1px;
  width: calc(100% - 40px); }

.menu__toggleSlide {
  height: 29px;
  width: 29px;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 16px;
  left: 178px;
  padding: 0;
  transition: 0.33s ease-in-out all;
  z-index: 23; }

.menu__toggle__button {
  position: relative;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: rotate(0deg);
  transition: 0.33s ease-in-out; }
  .menu__toggle__button::before {
    color: #ffffff;
    position: relative;
    z-index: 12; }
  .menu__toggle__button::after {
    content: "";
    background-color: #000000;
    border-radius: 50%;
    width: 29px;
    height: 29px;
    position: absolute;
    top: -8px;
    left: -6px;
    transition: 0.06s ease;
    transform: scale(0);
    z-index: 4; }
  .menu__toggle__button:active::after {
    transform: scale(1); }

.menu__help,
.menu__chatbot,
.menu__option__setting {
  position: fixed;
  bottom: 0;
  left: 0;
  height: 29px;
  width: 29px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  border-radius: 50%;
  transform: translateX(16px) translateY(-16px);
  transition: 0.33s linear transform,0.18s ease-in-out opacity;
  z-index: 23; }
  .menu__help::before,
  .menu__chatbot::before,
  .menu__option__setting::before {
    font-size: 21px;
    color: #ffffff;
    position: relative;
    z-index: 10; }
  .menu__help:hover,
  .menu__chatbot:hover,
  .menu__option__setting:hover {
    opacity: 0.6; }

.menu__chatbot {
  left: 40px; }
  .menu__chatbot .icon-alert {
    color: #F0AD3E;
    position: absolute;
    top: -5px;
    right: -3px;
    z-index: 24; }

.menu__option__setting--current {
  background-color: #5a5a5a; }

.menu--2column::after {
  content: none; }

.menu--2column .menu__help,
.menu--2column .menu__chatbot,
.menu--2column .menu__option__setting {
  position: absolute;
  display: flex;
  width: 40px;
  height: 40px;
  left: 0;
  top: auto;
  bottom: 12px;
  transform: translateX(0) translateY(0px);
  border-radius: 0; }

.menu--2column .menu__help {
  bottom: 52px; }

.menu--2column .menu__option__setting {
  bottom: 92px; }

.menu--2column .menu__chatbot .icon-alert {
  top: -1px;
  right: 3px; }

.menu__wrap--2column {
  display: flex; }

.menu__wrap__category {
  width: 40px;
  height: 100%;
  background-color: #2d2d2d;
  position: fixed;
  display: flex;
  flex-direction: column;
  transition: 0.2s cubic-bezier(0, 0, 0.5, 1); }

.menu__category {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  transition: 0.2s cubic-bezier(0, 0, 0.5, 1); }

.menu__category--current {
  background-color: #5a5a5a; }

.menu__wrap__links {
  width: calc(218px - 40px);
  margin-left: auto; }

.delivery .menu {
  background-color: #224D3F; }
  .delivery .menu::after {
    background: linear-gradient(to bottom, rgba(34, 77, 63, 0) 0%, #224d3f 28%, #224d3f 100%); }

.delivery .menu__logo {
  background-color: #003A2B;
  border-color: #34CF5B; }

.delivery .menu__help,
.delivery .menu__chatbot {
  background-color: #224D3F; }

.TradeAutomation .menu {
  background-color: #FFF8DF; }
  .TradeAutomation .menu::after {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #FFF8DF 28%, #FFF8DF 100%); }

.TradeAutomation .menu__logo {
  background-color: #FE8133;
  border-color: #ffffff; }
  .TradeAutomation .menu__logo img {
    width: 182px; }

.TradeAutomation .menu__help {
  background-color: #FFF8DF; }
  .TradeAutomation .menu__help::before {
    color: #373737; }

.TradeAutomation .menu__icon::before {
  color: #373737; }

.TradeAutomation .menu__title h4 {
  color: #373737; }

.TradeAutomation .menu__title--current::before {
  background-color: #FE8133; }

.TradeAutomation .menu__title--current::after {
  background-color: #FE8133;
  opacity: 0.15; }

.TradeAutomation .menu__list__toggle::before {
  color: #373737; }

.TradeAutomation .menu__list__toggle::after {
  background-color: #ffffff; }

.TradeAutomation .menu__links__link {
  color: #373737; }

.TradeAutomation .menu__links__amount {
  background-color: #FE8133; }

.TradeAutomation .menu__links__link--current::after {
  background-color: #FE8133;
  opacity: 0.15; }

.TradeAutomation .menu__border {
  border-color: #5a5a5a; }

.TradeAutomation .menu__toggle__button::before {
  color: #373737; }

.TradeAutomation .menu__toggle__button::after {
  background-color: #ffffff; }

.receipt .menu {
  background-color: #806E42; }
  .receipt .menu::after {
    background: linear-gradient(to bottom, transparent 0%, #806E42 28%, #806E42 100%); }

.receipt .menu__wrap__category {
  background-color: #655731; }

.receipt .menu__category--current {
  background-color: #806E42; }

.receipt .menu__toggle__button::after {
  background-color: #3E331A; }

.commonDocument .menu {
  background-color: #496070; }

.commonDocument .menu__wrap__category {
  background-color: #304E64; }

.commonDocument .menu__category--current {
  background-color: #496070; }

.commonDocument .menu__option__setting--current {
  background-color: #496070; }

.commonDocument .menu__toggle__button::after {
  background-color: #1C374B; }

/* ----------------------------------*/
/* モーダルウィンドウのスタイル */
/* ----------------------------------*/
.modal {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 1000; }

.modal__background {
  opacity: 0.3;
  background-color: #000000;
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0; }

.modal__background--light {
  opacity: 0.2; }

.menu__logo, .menu__upload, .menu__list, .menu__border, .menu__setting {
  position: relative;
  top: 0;
  left: 0; }

.modal__background--fadein {
  opacity: 0;
  animation: backgroundFadein 0.33s ease-in 0s 1 normal forwards; }

@keyframes backgroundFadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.3; } }

.modal__background--fadeout {
  animation: backgroundFadeout 0.45s linear 0s 1 normal forwards,backgroundCompress 0s linear 0.45s 1 normal forwards; }

@keyframes backgroundFadeout {
  0% {
    opacity: 0.3; }
  100% {
    opacity: 0; } }

@keyframes backgroundCompress {
  0% {
    transform: scale(1); }
  100% {
    transform: scale(0); } }

.modal__background--loading {
  opacity: 0.3;
  background-color: #373737;
  transition: 0.8s ease; }

.modal__panel--small {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-left: calc(-564px / 2);
  padding-top: 40px;
  padding-bottom: 48px;
  width: 594px;
  z-index: 1001;
  transform: translateY(-50%); }
  .modal__panel--small .modal__buttonArea .button {
    margin-bottom: 0; }

.modal__panel--small--withPadding {
  padding-left: 44px;
  padding-right: 44px; }

.modal__panel--movable {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 624px;
  margin-left: calc(-624px / 2);
  padding-top: 28px;
  padding-bottom: 40px;
  padding-left: 44px;
  padding-right: 44px;
  transform: translateY(-50%);
  overflow: visible;
  cursor: grab; }
  .modal__panel--movable .modal__wrap {
    max-height: 422px;
    overflow: auto;
    padding: 8px 0; }
  .modal__panel--movable .confirm__modal__body,
  .modal__panel--movable .modal__buttonArea {
    cursor: default; }

.modal__panel--large {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 980px;
  margin-left: calc(-980px / 2);
  padding-top: 28px;
  padding-bottom: 40px;
  padding-left: 44px;
  padding-right: 44px;
  transform: translateY(-50%); }
  .modal__panel--large .modal__wrap {
    max-height: 422px;
    overflow: auto;
    padding: 8px 0; }
  .modal__panel--large .modal__wrap--scrollList {
    overflow: visible;
    max-height: 100%;
    padding: 0; }
    .modal__panel--large .modal__wrap--scrollList .list__result {
      max-height: calc(422px - 46px);
      margin-top: 0;
      padding-top: 20px;
      width: 100%;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      overflow: auto; }
    .modal__panel--large .modal__wrap--scrollList .list__result__header,
    .modal__panel--large .modal__wrap--scrollList .list__result__line {
      width: 100%; }
    .modal__panel--large .modal__wrap--scrollList .modal__buttonArea {
      margin-top: 24px; }

.modal__panel {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  max-height: 90vh;
  overflow: auto;
  box-sizing: border-box; }

.modal__title {
  text-align: center;
  margin-bottom: 24px; }

.modal__title--red {
  color: #D0021B; }

.modal__title--largeDelete {
  margin-top: 24px; }

.modal__cancel {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 4px;
  right: 4px;
  width: 36px;
  height: 36px;
  cursor: pointer; }
  .modal__cancel::before {
    transition: 0.1s ease; }
  .modal__cancel:active::before {
    transform: scale(0.8); }

.modal__header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #ffffff;
  width: 100%; }

.modal__body {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  background-color: #ffffff;
  width: 100%; }

.modal__buttonArea {
  width: 100%;
  text-align: center;
  position: relative; }
  .modal__buttonArea button {
    margin-bottom: 16px; }
  .modal__buttonArea button + button {
    margin-left: 12px; }

.modal__buttonArea__alertButton {
  color: #D0021B;
  font-size: 10px;
  font-weight: normal;
  border-radius: 0;
  padding: 0;
  padding-bottom: 4px;
  margin-left: auto;
  margin-top: 36px;
  width: 72px;
  position: absolute;
  right: 0;
  bottom: 0; }

.modal__icon {
  font-size: 34px;
  color: #cccccc;
  text-align: center;
  display: block;
  margin-bottom: 16px; }

.modal__icon--red {
  color: #b60117; }

.modal__errorText {
  font-size: 12px;
  color: #D0021B;
  text-align: center;
  display: block;
  width: 100%;
  margin-top: 8px;
  margin-bottom: 8px; }

.modal__strongTitle {
  font-size: 16px;
  color: #373737;
  font-weight: bold;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 16px; }

.modal__commonText {
  font-size: 14px;
  color: #373737;
  font-weight: bold;
  margin-bottom: 32px;
  text-align: center; }

.modal__commonText--red {
  color: #D0021B; }

.modal__note {
  font-size: 10px;
  color: #888888;
  width: 100%;
  line-height: 1.25em;
  text-align: center;
  margin-bottom: 32px; }

.modal__note--red {
  color: #D0021B; }

.modal__note--green {
  color: #08805C; }

.moddal__commonTextWrap {
  margin-bottom: 32px; }
  .moddal__commonTextWrap .modal__commonText {
    text-align: left;
    margin-bottom: 16px; }

.modal__smallItem {
  width: 304px;
  display: flex; }
  .modal__smallItem .select,
  .modal__smallItem textarea {
    width: 100%; }
  .modal__smallItem textarea {
    height: 80px;
    resize: vertical;
    font-size: 12px;
    padding-top: 8px; }
    .modal__smallItem textarea::placeholder, .modal__smallItem textarea:placeholder-shown {
      font-size: 12px;
      padding: 4px 4px 3px; }
    .modal__smallItem textarea:-ms-input-placeholder {
      letter-spacing: -0.045em; }
  .modal__smallItem.modal__commonText {
    justify-content: center; }

.modal__smallItem ~ .modal__smallItem {
  margin-top: 12px; }

.modal__smallItem:last-child {
  margin-bottom: 24px; }

.modal__definitionItem {
  width: 304px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto 32px; }
  .modal__definitionItem dt {
    width: 25%;
    font-size: 12px;
    color: #888888; }
  .modal__definitionItem dd {
    width: 75%; }

.modal__list {
  text-align: center;
  margin-bottom: 32px; }
  .modal__list li {
    text-align: center;
    font-size: 14px;
    border-bottom: 1px solid #cccccc;
    padding-bottom: 2px;
    list-style: none;
    margin-top: 8px; }

.modal__commonText + .modal__list {
  margin-top: -24px; }

.modal__commonText + .modal__note--red {
  margin-top: -16px;
  margin-bottom: 20px; }

.upload__finished__text + .modal__list {
  margin-top: 16px; }

.modal__bankSelect {
  width: 100%;
  margin: 0 72px 24px; }
  .modal__bankSelect .select::before, .modal__bankSelect .select::after {
    z-index: 1;
    pointer-events: none; }

.modal__bankSelect__header {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e0e0e0;
  padding-bottom: 4px;
  margin-top: -8px; }
  .modal__bankSelect__header .checkbox {
    display: flex;
    align-items: center;
    font-size: 10px; }
  .modal__bankSelect__header .checkbox__check {
    margin-right: 8px; }
  .modal__bankSelect__header span {
    font-size: 10px;
    color: #888888; }

.modal__bankSelect__line {
  padding: 8px 0;
  border-bottom: 1px solid #e0e0e0;
  display: flex;
  justify-content: space-between;
  width: 100%; }
  .modal__bankSelect__line dt,
  .modal__bankSelect__line .modal__bankSelect__title {
    font-size: 10px;
    color: #888888; }

.modal__bankSelect__line__right {
  width: 160px; }
  .modal__bankSelect__line__right input {
    width: 100%;
    text-align: right;
    font-size: 12px; }
  .modal__bankSelect__line__right dl {
    display: flex;
    align-items: center;
    height: 26px; }
  .modal__bankSelect__line__right dt {
    width: 48px;
    line-height: 1.2em; }
  .modal__bankSelect__line__right dd {
    width: calc(100% - 48px);
    text-align: right; }
  .modal__bankSelect__line__right dl + dl {
    margin-top: 4px; }

.modal__bankSelect__line__left {
  width: calc(100% - 160px - 16px); }
  .modal__bankSelect__line__left dl {
    display: flex;
    align-items: center; }
  .modal__bankSelect__line__left dt {
    margin-right: 8px; }
  .modal__bankSelect__line__left .modal__bankSelect__title {
    margin-top: 6px;
    display: block; }

.modal__bankSelect__info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  width: 100%; }
  .modal__bankSelect__info span {
    font-size: 10px;
    line-height: 1.2em; }
  .modal__bankSelect__info .modal__bankSelect__bankName {
    width: 19.5%; }
  .modal__bankSelect__info .modal__bankSelect__accountType {
    width: 15.5%; }
  .modal__bankSelect__info .modal__bankSelect__branchName {
    width: 15.5%; }
  .modal__bankSelect__info .modal__bankSelect__accountNumber {
    width: 19.5%; }
  .modal__bankSelect__info .modal__bankSelect__accountName {
    width: 27.5%; }

.modal__feeSelect__info {
  display: flex;
  margin-top: 4px;
  width: 100%; }
  .modal__feeSelect__info span {
    font-size: 10px;
    color: #888888;
    width: 100%; }
  .modal__feeSelect__info span ~ span {
    color: #373737;
    margin-left: 2px;
    text-align: right;
    padding-right: 2px; }
  .modal__feeSelect__info div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-right: 8px;
    width: calc(100% / 3); }
  .modal__feeSelect__info div ~ div {
    border-left: 1px solid #cccccc;
    padding-left: 8px; }

/* ----------------------------------*/
/* ページネーションのスタイル */
/* ----------------------------------*/
.pagination {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-top: 32px;
  text-align: center; }

.pagination__buttonArea {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

.pagination__button {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: normal;
  font-size: 10px;
  border: 1px solid #cccccc;
  background-color: #ffffff;
  padding: 0;
  height: 26px;
  min-width: 26px; }
  .pagination__button:active {
    background-color: #f5f5f5; }
  .pagination__button .icon-other {
    font-size: 10px;
    transform: scale(0.5); }

.pagination__button + .pagination__button {
  margin-left: 8px; }

.pagination__button--current {
  background-color: #373737;
  border-color: #373737;
  color: #ffffff;
  font-weight: bold; }
  .pagination__button--current:active {
    background-color: #000000; }

.pagination__prev {
  padding-left: 22px;
  padding-right: 8px;
  position: relative; }
  .pagination__prev .triangle {
    width: 6px;
    position: absolute;
    top: calc(50% - 4px);
    left: 8px;
    transform: rotate(90deg); }

.pagination__next {
  padding-left: 8px;
  padding-right: 22px;
  position: relative; }
  .pagination__next .triangle {
    width: 6px;
    position: absolute;
    top: calc(50% - 4px);
    right: 8px;
    transform: rotate(-90deg); }

.pagination__amount {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 16px; }
  .pagination__amount p {
    margin-left: 4px;
    margin-right: 12px; }
  .pagination__amount p ~ p {
    margin-right: 4px; }

.delivery .pagination__button--current {
  background-color: #224D3F;
  border-color: #224D3F; }
  .delivery .pagination__button--current:active {
    background-color: #284038; }

/* ----------------------------------*/
/* パネルのスタイル */
/* ----------------------------------*/
.panel {
  background-color: #ffffff;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 2px 0px rgba(0, 0, 0, 0.24);
  border-radius: 5px; }

.panel--fadeIn {
  animation: panelFadein 0.3s linear 0s 1 normal;
  animation-fill-mode: forwards;
  opacity: 0; }

.panel--fadeOut {
  animation: panelFadeout 0.6s linear 1s 1 normal;
  animation-fill-mode: forwards; }

.panel--noScrollBar {
  -ms-overflow-style: none;
  scrollbar-width: none; }

.panel--noScrollBar::-webkit-scrollbar {
  display: none; }

@keyframes panelFadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes panelFadeout {
  0% { }
  20% {
    opacity: 1; }
  80% {
    opacity: 0;
    min-height: 0; }
  100% {
    opacity: 0;
    min-height: 0; } }

/* ----------------------------------*/
/* 複合検索のスタイル */
/* ----------------------------------*/
.select__combine {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  border-radius: 5px;
  height: 26px;
  background-color: #ffffff;
  position: relative; }

.select__combine__select {
  padding-top: 0;
  padding-bottom: 0;
  background-color: transparent;
  border: none; }
  .select__combine__select select {
    min-width: 112px;
    height: 100%;
    border: none;
    border-radius: 0;
    padding-left: 12px;
    padding-right: 20px;
    box-sizing: content-box; }

.select__combine__select ~ .select__combine__select select {
  border-left: 1px solid #cccccc; }

/* ----------------------------------*/
/* 複合検索のスタイル */
/* ----------------------------------*/
.search__combine {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  border-radius: 5px;
  height: 26px;
  background-color: #ffffff;
  position: relative;
  flex-grow: 1;
  flex-basis: calc(100% - 136px - 136px - 4px - 4px); }

.search__combine--full {
  flex-basis: 100%; }

.search__combine--short {
  flex-grow: 0;
  flex-basis: 298px; }

.search__combine--date {
  flex-grow: 0;
  flex-basis: auto;
  width: 252px; }

.search__combine__wrap .list__search__subTitle {
  position: relative;
  top: 0;
  line-height: 1.5em; }

.search__combine__select {
  padding-top: 0;
  padding-bottom: 0;
  background-color: transparent;
  border: none; }
  .search__combine__select select {
    width: 104px;
    height: 100%;
    border: none;
    border-radius: 0;
    padding-left: 12px;
    padding-right: 20px;
    box-sizing: content-box; }

.search__combine__text {
  border-radius: 0;
  border: none;
  border-left: 1px solid #cccccc;
  background-color: transparent;
  margin: 0;
  padding-top: 0;
  padding-bottom: 0;
  width: calc(100% - 112px);
  font-size: 10px; }

.search__combine__text::placeholder, .search__combine__text:placeholder-shown {
  font-size: 12px; }

.search__combine__text--disable {
  opacity: 0.55;
  background-color: #f5f5f5;
  pointer-events: none; }

.search__combine__date {
  width: 112px; }
  .search__combine__date input {
    border: none;
    border-radius: 0;
    background-color: transparent;
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 15px; }

.search__combine__select + .search__combine__date {
  border-left: 1px solid #cccccc;
  padding-left: 6px; }

.search__combine__date + span {
  color: #888888;
  margin-left: auto;
  margin-right: auto; }

.search__combine__icon {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  background-color: #ffffff; }

/* ----------------------------------*/
/* サブメニューのスタイル */
/* ----------------------------------*/
*[class*="subMenu"] {
  position: relative; }

.subMenu {
  display: none;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 160px;
  background-color: #ffffff;
  border-radius: 5px;
  border: 1px solid #cccccc;
  overflow: hidden;
  position: absolute;
  z-index: 50; }
  .subMenu button {
    width: 100%;
    font-weight: normal;
    color: #5a5a5a;
    font-size: 12px;
    border-radius: 0; }
    .subMenu button:hover {
      background-color: #f5f5f5; }
  .subMenu button + button {
    border-top: 1px solid #cccccc; }
  .subMenu .button--textRed {
    color: #D0021B; }

.subMenu--small {
  width: 96px; }

.subMenu--open {
  display: flex; }

.subMenu__wrap {
  cursor: pointer; }

.subMenu__trigger {
  position: relative;
  z-index: 0;
  cursor: pointer;
  transition: 0.1s ease; }
  .subMenu__trigger::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: scaleY(0) translateY(-50%) translateX(-50%);
    transform-origin: top;
    z-index: -1;
    width: 54px;
    height: 54px;
    background-color: #000000;
    border-radius: 5px;
    opacity: 0.09;
    transition: 0.22s ease-out; }

.subMenu__trigger--checked::after {
  transform: scaleY(1) translateY(-50%) translateX(-50%); }

.subMenu__trigger--checked--noShadow::after {
  content: none; }

/* ----------------------------------*/
/* 三角アイコンのスタイル */
/* ----------------------------------*/
.triangle {
  border: 3px solid transparent;
  border-top: 5px solid #373737; }

.triangle--down {
  border: 3px solid transparent;
  border-top: 5px solid #373737; }

.triangle--up {
  border: 3px solid transparent;
  border-bottom: 5px solid #373737; }

/* ----------------------------------*/
/* ローダーのスタイル */
/* ----------------------------------*/
.loader,
.loader:before,
.loader:after {
  border-radius: 50%; }

.loader {
  color: #ffffff;
  font-size: 11px;
  margin: 55px auto;
  position: absolute;
  top: calc( 42% - 2vw);
  left: 50%;
  width: 7vw;
  height: 7vw;
  box-shadow: inset 0 0 0 0.65vw;
  opacity: 0.7;
  transform: translateX(-50%) scale(1.75) translateZ(0); }

.loader:before,
.loader:after {
  position: absolute;
  content: ''; }

.loader:before {
  width: 5.2vw;
  height: 10.2vw;
  background: #373737;
  border-radius: 10.2vw 0 0 10.2vw;
  top: calc(-0.1vw - 2vw);
  left: calc(-0.1vw - 2vw);
  transform-origin: 5.2vw 5.1vw;
  animation: load2 1.6s infinite ease 0.4s; }

.loader:after {
  width: 5.2vw;
  height: 10.2vw;
  background: #373737;
  border-radius: 0 10.2vw 10.2vw 0;
  top: calc(-0.1vw - 2vw);
  left: calc(5.1vw - 2vw);
  transform-origin: 0px 5.1vw;
  animation: load2 1.6s infinite ease; }

@keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

.loader__title {
  color: #ffffff;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  position: absolute;
  top: calc( 52% + 100px);
  left: 50%;
  transform: translateX(-50%); }

/* ----------------------------------*/
/* 帳票定義の選択位置（マーカー）スタイル */
/* ----------------------------------*/
.defineMark__mark {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
  opacity: 0.65;
  box-sizing: content-box;
  overflow: hidden; }

.defineMark__mark::after {
  content: "";
  position: absolute;
  left: 0%;
  top: auto;
  border-radius: 50%;
  width: 250%;
  height: 500%;
  border: none;
  animation: markerBlinking 2.49s linear 0s infinite normal; }

@keyframes markerBlinking {
  0% {
    left: -250%; }
  100% {
    left: 200%; } }

.defineMark__comment {
  padding: 2px 8px;
  font-size: 10px;
  position: absolute;
  font-weight: bold;
  z-index: 1;
  color: #ffffff;
  opacity: 0.9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); }

.defineMark__comment::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -16px;
  display: block;
  z-index: 1;
  border: 8px solid transparent; }

.defineMark__mark__detailTitle {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  opacity: 1; }

.defineMark__selecting {
  background-color: rgba(0, 184, 129, 0.6);
  opacity: 0.65;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-sizing: border-box; }

.defineMark__selecting::after {
  background: radial-gradient(cyan 0, rgba(0, 204, 143, 0) 60%); }

.defineMark__selecting:hover {
  background-color: rgba(224, 39, 111, 0.6);
  opacity: 0.5; }
  .defineMark__selecting:hover::after {
    background: radial-gradient(#ff3958 0, rgba(242, 18, 119, 0) 60%); }

.defineMark--default {
  background-color: rgba(0, 184, 129, 0.6); }
  .defineMark--default::after {
    background: radial-gradient(cyan 0, rgba(0, 204, 143, 0) 60%); }
  .defineMark--default.defineMark__comment, .defineMark--default .defineMark__mark__detailTitle {
    background-color: #00cc8f; }
  .defineMark--default.defineMark__comment::before {
    border-top: 8px solid #00cc8f; }

.defineMark--changed {
  background-color: rgba(224, 39, 111, 0.6); }
  .defineMark--changed::after {
    background: radial-gradient(#ff3958 0, rgba(242, 18, 119, 0) 60%); }
  .defineMark--changed.defineMark__comment, .defineMark--changed .defineMark__mark__detailTitle {
    background-color: #f21277; }
  .defineMark--changed.defineMark__comment::before {
    border-top: 8px solid #f21277; }

/* ----------------------------------*/
/*  ラジオボタンのスタイル */
/* ----------------------------------*/
.radiobox input[type="radio"] {
  display: none; }

.radiobox__check {
  border: 1px solid #cccccc;
  width: 12px;
  height: 12px;
  display: block;
  background-color: #ffffff;
  border-radius: 50%;
  position: relative;
  transition: 0.1s ease-out;
  margin-right: 4px; }
  .radiobox__check::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #ffffff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    opacity: 1;
    transition: 0.2s ease; }

input:checked + .radiobox__check {
  background-color: #23D19D;
  border-color: #23D19D; }
  input:checked + .radiobox__check::before {
    opacity: 1; }

/* ----------------------------------*/
/* 比較グラフのスタイル */
/* ----------------------------------*/
.list__companylist {
  width: 40%;
  border-top: 2px solid #cccccc;
  border-bottom: 2px solid #cccccc;
  border-right: 2px solid #cccccc; }

.list__companylist__header {
  display: flex;
  align-items: center;
  height: 36px;
  transition: 0.12s ease-out;
  position: relative;
  border-bottom: 1px solid #e0e0e0; }
  .list__companylist__header span {
    color: #888888; }

.list__companylist__header__companyName {
  width: 39%;
  padding-left: 8px; }
  .list__companylist__header__companyName span {
    font-size: 12px; }

.list__companylist__header_period {
  width: 30%; }
  .list__companylist__header_period span {
    font-size: 13px; }

.list__companylist__header__primaryPeriod {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .list__companylist__header__primaryPeriod::before {
    content: "";
    width: 5px;
    height: 17px;
    background-color: #23D19D;
    display: inline-block;
    position: absolute;
    left: -2px; }

.list__companylist__header__secondaryPeriod {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .list__companylist__header__secondaryPeriod::before {
    content: "";
    width: 5px;
    height: 17px;
    background-color: #B6DED2;
    position: absolute;
    left: -2px; }

.list__companylist__header__bottom {
  display: flex;
  align-items: center;
  height: 36px;
  border-bottom: 1px solid #e0e0e0; }
  .list__companylist__header__bottom span {
    color: #888888; }

.list__companylist__line {
  display: flex;
  align-items: center;
  cursor: default;
  height: 56px; }

.list__companylist__line ~ .list__companylist__line {
  border-top: 1px dashed #e0e0e0; }

.list__companylist__line__companyName {
  width: 39%;
  padding-left: 8px;
  padding-right: 12px; }

.list__companylist__line__total {
  width: 30%; }

.setting__dashboard .list__result__header__status {
  width: 30%; }
  .setting__dashboard .list__result__header__status::before {
    color: #888888; }

.setting__dashboard .list__result__header__status,
.setting__dashboard .list__companylist__line__total {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  padding-right: 16px; }
  .setting__dashboard .list__result__header__status::before,
  .setting__dashboard .list__companylist__line__total::before {
    content: "¥";
    position: absolute;
    left: -2px;
    font-size: 10px; }

.setting_companylist_area {
  width: 60%;
  background-color: #f1f1f1;
  border-top: 2px solid #cccccc;
  border-bottom: 2px solid #cccccc; }

.list__companylist__legend__primaryPeriod {
  margin-left: 17px;
  padding-top: 9px;
  height: 36px;
  transition: 0.12s ease-out;
  position: relative;
  display: flex;
  align-items: left;
  justify-content: left; }
  .list__companylist__legend__primaryPeriod a {
    padding-left: 16px;
    color: #888888;
    cursor: default; }
    .list__companylist__legend__primaryPeriod a::before {
      content: "";
      width: 5px;
      height: 17px;
      background-color: #23D19D;
      display: inline-block;
      position: absolute;
      left: -2px; }

.list__companylist__legend__secondaryPeriod {
  margin-left: 17px;
  padding-top: 21px;
  height: 36px;
  transition: 0.12s ease-out;
  position: relative;
  display: flex;
  align-items: left;
  justify-content: left; }
  .list__companylist__legend__secondaryPeriod a {
    padding-left: 16px;
    color: #888888;
    cursor: default; }
    .list__companylist__legend__secondaryPeriod a::before {
      content: "";
      width: 5px;
      height: 17px;
      background-color: #B6DED2;
      display: inline-block;
      position: absolute;
      left: -2px; }

.list__companylist__hidden {
  position: fixed;
  top: -1000px; }

/* ----------------------------------*/
/* 帳票定義の明細情報指定スタイル */
/* ----------------------------------*/
.confirm__preview__defineDetail__detailArea {
  position: absolute;
  border: 1px dashed rgba(0, 184, 129, 0.6);
  margin-top: -1px; }

.confirm__preview__defineDetail__detailArea__handle {
  position: absolute;
  bottom: -5px;
  left: calc(50% - 20px);
  height: 8px;
  width: 40px;
  background-color: #ffffff;
  border: 2px solid rgba(0, 184, 129, 0.6);
  z-index: 6; }

.confirm__preview__defineDetail__detailArea__border {
  position: absolute;
  background-color: #F6E739;
  z-index: 4;
  opacity: 0.8;
  margin-top: -1px; }

.confirm__preview__defineDetail__selector {
  position: absolute;
  border: 1px solid rgba(0, 184, 129, 0.6); }
  .confirm__preview__defineDetail__selector::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    opacity: 0.85;
    z-index: 0; }

.confirm__preview__defineDetail__selector--mirror {
  border-color: #08805C;
  border-width: 1px;
  opacity: 0.45; }
  .confirm__preview__defineDetail__selector--mirror::after {
    opacity: 1;
    background-color: #00B881; }

.confirm__preview__defineDetail__selector__title {
  position: absolute;
  white-space: nowrap;
  top: -15px;
  left: -1px;
  z-index: 3;
  opacity: 0.8;
  padding: 0 4px;
  font-size: 10px;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  color: #ffffff;
  background-color: #00B881;
  font-weight: bold; }

.confirm__preview__defineDetail__footer {
  position: absolute;
  bottom: 16px;
  left: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-left: 24px;
  padding-right: 16px;
  z-index: 6; }

.confirm__preview__defineDetail__showItemArea,
.confirm__preview__defineDetail__historyArea {
  display: flex;
  align-items: center; }
  .confirm__preview__defineDetail__showItemArea span,
  .confirm__preview__defineDetail__historyArea span {
    color: #08805C;
    font-weight: bold;
    font-size: 10px; }

.confirm__preview__defineDetail__historyArea {
  width: 100%;
  margin-bottom: 8px; }
  .confirm__preview__defineDetail__historyArea .button {
    height: 26px;
    width: 26px;
    margin-left: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0; }
    .confirm__preview__defineDetail__historyArea .button span {
      display: flex; }
    .confirm__preview__defineDetail__historyArea .button span::before {
      font-size: 12px;
      color: #00B881; }
  .confirm__preview__defineDetail__historyArea .button ~ .button {
    margin-left: 4px; }
    .confirm__preview__defineDetail__historyArea .button ~ .button span {
      transform: scale(-1, 1); }

.confirm__preview__defineDetail__showItem {
  border: 1px solid #00B881;
  border-radius: 5px;
  display: flex;
  overflow: hidden;
  margin-left: 8px;
  box-sizing: border-box; }

.confirm__preview__defineDetail__showItem__button {
  height: 26px;
  display: flex; }
  .confirm__preview__defineDetail__showItem__button input {
    display: none; }
  .confirm__preview__defineDetail__showItem__button span {
    display: flex;
    align-items: center;
    font-weight: bold;
    height: 100%;
    padding-left: 8px;
    padding-right: 8px;
    background-color: #00B881;
    color: rgba(255, 255, 255, 0.8);
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    opacity: 0.35; }
  .confirm__preview__defineDetail__showItem__button input:checked ~ span {
    opacity: 1; }

.confirm__preview__defineDetail__showItem__button ~ .confirm__preview__defineDetail__showItem__button span {
  border-left: 1px solid #00cc8f; }

div[class*="confirm__preview__defineDetail__selector__rect"] {
  width: 6px;
  height: 6px;
  background-color: #ffffff;
  border: 1px solid #00B881;
  position: absolute;
  z-index: 4;
  opacity: 1; }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Left"] {
    left: -4px; }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Center"] {
    left: calc(50% - 4px); }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Right"] {
    right: -4px; }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Top"] {
    top: -4px; }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Middle"] {
    top: calc(50% - 3px); }
  div[class*="confirm__preview__defineDetail__selector__rect"][class*="Bottom"] {
    bottom: -4px; }

/* ----------------------------------*/
/*  スイッチボタンのスタイル */
/* ----------------------------------*/
.switch {
  display: flex;
  align-items: center;
  font-size: 11px; }
  .switch .switch__parts {
    position: relative;
    margin-right: 8px; }
    .switch .switch__parts::before {
      content: "";
      width: 40px;
      height: 20px;
      background-color: #cccccc;
      border-radius: 20px;
      display: block;
      z-index: 0;
      transition: 0.09s ease; }
    .switch .switch__parts::after {
      content: "";
      position: absolute;
      width: 14px;
      height: 14px;
      background-color: #ffffff;
      border-radius: 50%;
      position: absolute;
      top: 50%;
      left: calc(50% - 8px);
      display: block;
      transform: translate(-50%, -50%);
      z-index: 1;
      transition: 0.12s ease; }
  .switch .switch__text {
    color: #373737;
    user-select: none; }
  .switch input:checked ~ .switch__text {
    color: #23D19D; }
  .switch input:checked ~ .switch__parts::before {
    background-color: #23D19D; }
  .switch input:checked ~ .switch__parts::after {
    left: calc(50% + 8px); }

/* ----------------------------------*/
/*  アイコン付スイッチボタンのスタイル */
/* ----------------------------------*/
.switch--icon {
  border: 1px solid #cccccc;
  border-radius: 5px;
  width: 72px;
  height: 26px;
  display: flex;
  overflow: hidden; }
  .switch--icon .switch--icon__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    cursor: pointer; }
  .switch--icon input[type="radio"] {
    display: none; }
  .switch--icon span {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #888888; }
    .switch--icon span::before {
      font-size: 14px;
      display: flex; }
  .switch--icon input[type="radio"]:checked ~ span {
    background-color: #f5f5f5;
    color: #23D19D; }
    .switch--icon input[type="radio"]:checked ~ span::before {
      border-color: #23D19D; }
    .switch--icon input[type="radio"]:checked ~ span::after {
      background-color: #23D19D; }

/* ----------------------------------*/
/*  表示切り替えスイッチボタンのスタイル */
/* ----------------------------------*/
.switch--display {
  border: 1px solid #cccccc;
  border-radius: 5px;
  display: flex;
  overflow: hidden;
  margin-left: 8px;
  box-sizing: border-box; }

.switch--display__button {
  height: 16px;
  display: flex;
  flex-grow: 1; }
  .switch--display__button input {
    display: none; }
  .switch--display__button span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    color: #888888;
    font-size: 10px;
    font-weight: bold;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none; }
  .switch--display__button input:checked ~ span {
    opacity: 1;
    color: #23D19D;
    background-color: #f5f5f5; }

.switch--display__button ~ .switch--display__button span {
  border-left: 1px solid #e0e0e0; }

.switch--display--icon {
  width: auto; }

/* ----------------------------------*/
/*  テキストのスイッチボタンのスタイル */
/* ----------------------------------*/
.switch--text {
  border: 1px solid #cccccc;
  border-radius: 5px;
  min-width: 72px;
  height: 26px;
  display: flex;
  overflow: hidden; }
  .switch--text .switch--text__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    cursor: pointer; }
  .switch--text input[type="radio"] {
    display: none; }
  .switch--text span {
    width: 100%;
    height: 100%;
    padding-left: 4px;
    padding-right: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #888888;
    font-size: 10px; }
    .switch--text span::before {
      font-size: 14px;
      display: flex; }
  .switch--text input[type="radio"]:checked ~ span {
    background-color: #f5f5f5;
    color: #23D19D;
    font-weight: bold; }
    .switch--text input[type="radio"]:checked ~ span::before {
      border-color: #23D19D; }
    .switch--text input[type="radio"]:checked ~ span::after {
      background-color: #23D19D; }

/* ----------------------------------*/
/*  タブスイッチボタンのスタイル */
/* ----------------------------------*/
.switch--tab {
  display: flex;
  flex-direction: column;
  margin-left: -23px;
  transform: translateY(8px);
  float: left;
  border-radius: 5px 0 0 5px;
  position: relative;
  background-color: transparent; }
  .switch--tab::after {
    content: "";
    position: absolute;
    background-color: #ffffff;
    height: 100%;
    width: 4px;
    right: -4px;
    top: 0px; }
  .switch--tab .switch--tab__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 23px;
    height: 40px;
    cursor: pointer; }
  .switch--tab .switch--tab__button:hover {
    opacity: 1; }
  .switch--tab input[type="radio"] {
    display: none; }
  .switch--tab span {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #888888;
    font-size: 10px;
    writing-mode: vertical-rl;
    text-orientation: upright;
    border-radius: 5px 0 0 5px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.08), 0px 2px 2px rgba(0, 0, 0, 0.12);
    background-color: #f5f5f5;
    color: #cccccc;
    font-weight: bold; }
  .switch--tab input[type="radio"]:checked ~ span {
    background-color: #ffffff;
    color: #23D19D; }

/* ----------------------------------*/
/* トグルボタンのスタイル */
/* ----------------------------------*/
.toggleButton {
  margin-left: 12px;
  position: relative; }
  .toggleButton::before {
    position: relative;
    z-index: 5;
    top: 0;
    display: inline-block;
    transform: rotate(180deg);
    transition: 0.15s ease; }
  .toggleButton::after {
    content: "";
    background-color: #e0e0e0;
    border-radius: 50%;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: 0.03s ease;
    transform: translateX(-50%) translateY(-50%) scale(0);
    z-index: 4; }
  .toggleButton:active::after {
    transform: translateX(-50%) translateY(-50%) scale(1); }

.toggleButton--close {
  transform: rotate(0deg);
  top: 1px; }

/* ----------------------------------*/
/* プログレスバーのスタイル */
/* ----------------------------------*/
.progressBar {
  width: 100%;
  background-color: #eeeeee;
  position: relative;
  height: 8px;
  border-radius: 5px;
  overflow: hidden; }

.progressBar__percentage {
  height: 100%;
  background-color: #23D19D;
  position: absolute;
  left: 0;
  border-radius: 5px; }

.progressBar--modal--small {
  width: 514px;
  margin-top: -8px;
  margin-bottom: 40px; }

/* ----------------------------------*/
/* コメント・ツールチップのスタイル */
/* ----------------------------------*/
.list__result__comment__fukidashi {
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 12px 16px;
  border-radius: 5px;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.24); }
  .list__result__comment__fukidashi p {
    line-height: 1em;
    width: 100%; }

.confirm__fillIn__comment__fukidashi {
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 12px 16px;
  border-radius: 5px;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.24); }
  .confirm__fillIn__comment__fukidashi p {
    line-height: 1em;
    white-space: normal; }

.comment,
.tooltip {
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 12px 16px;
  border-radius: 5px;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.24); }
  .comment p,
  .tooltip p {
    line-height: 1em;
    white-space: normal; }

/* ----------------------------------*/
/* 帳票確認・修正のレイアウト */
/* ----------------------------------*/
.confirm {
  display: flex;
  height: calc(100vh - 44px - 50px);
  overflow-y: hidden; }
  .confirm .switch--tab {
    transform: translateY(0px); }

.confirm__preview {
  height: calc(100vh - 44px - 50px);
  width: calc(100% - 650px);
  position: relative;
  z-index: 12;
  background: rgba(0, 0, 0, 0);
  background-color: #2d2d2d;
  overflow: hidden; }
  .confirm__preview iframe {
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 0; }

.confirm__preview #resizer {
  position: absolute;
  top: 0;
  right: 0;
  width: 4px;
  height: 100%; }

.confirm__loading {
  width: 100%;
  position: absolute; }
  .confirm__loading .loader {
    font-size: 11px;
    top: 36%;
    width: 10em;
    height: 10em;
    box-shadow: inset 0 0 0 1em;
    transform: translateX(-50%) scale(1) translateZ(0); }
  .confirm__loading .loader:before,
  .confirm__loading .loader:after {
    position: absolute;
    content: ''; }
  .confirm__loading .loader:before {
    width: 5.2em;
    height: 10.2em;
    border-radius: 10.2em 0 0 10.2em;
    top: -0.1em;
    left: -0.1em;
    transform-origin: 5.2em 5.1em; }
  .confirm__loading .loader:after {
    width: 5.2em;
    height: 10.2em;
    border-radius: 0 10.2em 10.2em 0;
    top: -0.1em;
    left: 5.1em;
    transform-origin: 0px 5.1em; }

.confirm__preview__canvas__shadow {
  width: 100%;
  height: 100%;
  opacity: 0.175;
  background-color: #000000;
  position: absolute;
  left: 0;
  top: 0; }

.confirm__preview__control {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 12px 0 12px;
  height: 40px;
  background-color: #2d2d2d; }

.confirm__preview__control__caption {
  color: #888888;
  margin: 0;
  font-size: 10px; }

.confirm__preview__control__page {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #888888;
  border-radius: 16px;
  padding: 4px 0;
  height: 28px;
  overflow: hidden;
  margin-left: 8px; }

.confirm__preview__control__prev, .confirm__preview__control__next {
  border-radius: 0;
  margin: 0;
  padding: 0;
  vertical-align: middle;
  position: relative;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center; }
  .confirm__preview__control__prev::before, .confirm__preview__control__next::before {
    content: "";
    border: 5px solid transparent;
    display: block; }
  .confirm__preview__control__prev:active, .confirm__preview__control__next:active {
    transform: scale(0.8); }

.confirm__preview__control__prev::before {
  border-right: 7px solid #cccccc;
  margin: 0 4px;
  margin-left: 0;
  transform-origin: right; }

.confirm__preview__control__next::before {
  border-left: 7px solid #cccccc;
  margin: 0 4px;
  margin-right: 0;
  transform-origin: left; }

.confirm__preview__control__menu {
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center; }
  .confirm__preview__control__menu button {
    background-color: transparent;
    color: #ffffff;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    position: relative;
    border-color: #888888;
    font-size: 15px;
    margin: 0 2px; }
    .confirm__preview__control__menu button::before {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%); }
    .confirm__preview__control__menu button:hover {
      opacity: 0.75; }
    .confirm__preview__control__menu button:active {
      background-color: #5a5a5a;
      transition-delay: 0.09s;
      transition: 0.09s ease; }
  .confirm__preview__control__menu .icon-monochrome {
    font-size: 12px; }
  .confirm__preview__control__menu .confirm__preview__control__OCRLine::before, .confirm__preview__control__menu .confirm__preview__control__OCRLine::after {
    content: "";
    display: block;
    background-color: #ffffff;
    width: 10px;
    height: 3px;
    position: absolute;
    top: 8px;
    left: 5px;
    transform: none; }
  .confirm__preview__control__menu .confirm__preview__control__OCRLine::after {
    top: 14px;
    width: 14px; }
  .confirm__preview__control__menu .confirm__preview__control__menu__activeButton {
    background-color: #23D19D;
    border-color: #eeeeee; }

.confirm__preview__control__menu--single {
  margin-left: 8px; }

.confirm__preview__control__number {
  display: flex;
  font-size: 0;
  height: 100%;
  border-left: 1px solid #888888;
  border-right: 1px solid #888888;
  padding: 0 8px 0 4px;
  margin: 0; }
  .confirm__preview__control__number span {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    color: #cccccc; }
    .confirm__preview__control__number span span {
      display: flex;
      box-sizing: border-box;
      justify-content: center;
      color: #ffffff;
      font-size: 11px;
      border-radius: 2px;
      border: none;
      padding: 0;
      width: 24px;
      height: 100%;
      margin-right: -4px;
      text-indent: 0px;
      text-align: center;
      overflow: visible; }
  .confirm__preview__control__number span + span {
    margin-left: 8px; }
    .confirm__preview__control__number span + span input[type="text"] {
      background-color: transparent; }
    .confirm__preview__control__number span + span::before {
      content: "/";
      margin-right: 4px;
      margin-left: 0;
      color: #cccccc; }
  .confirm__preview__control__number input[type="text"] {
    display: flex;
    box-sizing: border-box;
    justify-content: center;
    color: #ffffff;
    background-color: #000000;
    font-size: 11px;
    border-radius: 2px;
    border: none;
    padding: 0;
    width: 24px;
    height: 100%;
    margin-right: -4px;
    text-indent: 0px;
    text-align: center;
    overflow: visible; }

.confirm__preview__control__zoom {
  display: flex;
  align-items: center; }

.confirm__preview__control__zoomIn,
.confirm__preview__control__zoomOut,
.confirm__preview__control__neutral,
.confirm__preview__control__rect {
  background-color: transparent;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  margin-left: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0;
  border-color: #888888;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden;
  transition: 0.21s ease; }
  .confirm__preview__control__zoomIn::before,
  .confirm__preview__control__zoomOut::before,
  .confirm__preview__control__neutral::before,
  .confirm__preview__control__rect::before {
    color: #ffffff; }
  .confirm__preview__control__zoomIn:hover,
  .confirm__preview__control__zoomOut:hover,
  .confirm__preview__control__neutral:hover,
  .confirm__preview__control__rect:hover {
    opacity: 0.75; }
  .confirm__preview__control__zoomIn:active,
  .confirm__preview__control__zoomOut:active,
  .confirm__preview__control__neutral:active,
  .confirm__preview__control__rect:active {
    background-color: #5a5a5a;
    transition-delay: 0.09s;
    transition: 0.09s ease; }

.confirm__preview__control__zoomIn {
  margin-left: 8px; }

.confirm__preview__control__zoomOut {
  position: relative; }
  .confirm__preview__control__zoomOut::before {
    content: "";
    display: flex;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 15px;
    height: 2px;
    background-color: #ffffff;
    transform: translate(-50%, -50%); }

.confirm__preview__control__neutral,
.confirm__preview__control__rect {
  border-radius: 4px; }
  .confirm__preview__control__neutral::before,
  .confirm__preview__control__rect::before {
    font-size: 12px; }

.confirm__preview__control__option {
  display: flex;
  align-items: center;
  margin-left: 8px; }
  .confirm__preview__control__option .confirm__preview__control__rect:first-child {
    margin-left: 0; }

.confirm__preview__control__history__subMenu {
  top: 42px;
  left: 245px;
  max-height: 70vh;
  overflow: auto;
  width: 292px;
  background-color: #f5f5f5; }
  .confirm__preview__control__history__subMenu button {
    padding-left: 32px;
    box-sizing: content-box;
    text-align: left; }
    .confirm__preview__control__history__subMenu button:hover {
      background-color: #eeeeee; }

.confirm__preview__control__buttonChecked {
  position: relative;
  background-color: #ffffff; }
  .confirm__preview__control__buttonChecked::after {
    content: "";
    width: 7px;
    height: 3px;
    border-left: 2px solid;
    border-bottom: 2px solid;
    border-color: #23D19D;
    position: absolute;
    top: 12px;
    left: 11px;
    transform: rotate(-45deg); }

.confirm__preview__control__genponKakunin,
.confirm__preview__control__PDFconfirm {
  position: absolute;
  width: 100%;
  z-index: 20;
  background-color: transparent;
  padding-left: 0;
  height: 36px; }
  .confirm__preview__control__genponKakunin::before,
  .confirm__preview__control__PDFconfirm::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #2d2d2d;
    opacity: 0.9;
    z-index: -1; }
  .confirm__preview__control__genponKakunin .button,
  .confirm__preview__control__PDFconfirm .button {
    border: 1px solid #888888; }
    .confirm__preview__control__genponKakunin .button span[class*="icon"],
    .confirm__preview__control__PDFconfirm .button span[class*="icon"] {
      margin-right: 12px; }
  .confirm__preview__control__genponKakunin .button + .button,
  .confirm__preview__control__PDFconfirm .button + .button {
    margin-left: 8px; }

.confirm__preview__control__genponKakunin__label,
.confirm__preview__control__PDFconfirm__label {
  height: 100%;
  width: 5px;
  background-color: #F15C98; }

.confirm__preview__control__genponKakunin__cautionText,
.confirm__preview__control__PDFconfirm__cautionText {
  color: #F15C98;
  font-size: 12px;
  font-weight: bold;
  margin-left: 20px;
  margin-right: auto; }

.pdf_viewer__PDFconfirm {
  padding-top: 36px; }

.confirm__fillIn {
  padding-left: 32px;
  padding-top: 0;
  padding-right: 32px;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  max-width: 650px;
  overflow: auto; }

.confirm__status {
  display: flex;
  justify-content: flex-start;
  position: relative;
  margin-top: 16px;
  margin-bottom: 12px;
  transition: 0.52s ease-in-out;
  min-height: 22px;
  max-height: 800px; }

.confirm__status--close .confirm__status__toggle::before {
  transform: scale(1) rotate(0deg); }

.confirm__status--close .confirm__status__log {
  max-height: 30px;
  overflow: hidden; }
  .confirm__status--close .confirm__status__log p ~ p {
    display: none; }

.confirm__status--close .confirm__status__bumon, .confirm__status--close .confirm__status__fileID {
  justify-content: center; }

.confirm__status--close .confirm__status__subStatus {
  justify-content: center; }

.confirm__status--opened {
  max-height: 800px;
  overflow: visible; }

.confirm__status--sticky {
  position: sticky;
  top: 16px;
  z-index: 20; }
  .confirm__status--sticky::before {
    content: "";
    position: absolute;
    top: -16px;
    left: -24px;
    width: 100%;
    height: 100%;
    padding-top: 16px;
    padding-bottom: 12px;
    padding-left: 24px;
    padding-right: 24px;
    background-color: #f7f7f7; }

.confirm__status__label {
  display: flex;
  position: relative;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  height: 22px;
  border-left: 5px solid;
  font-weight: bold;
  padding-left: 12px; }
  .confirm__status__label span:not(.confirm__status__label__title) {
    font-weight: bold;
    font-size: 11px;
    height: 11px;
    line-height: 11px; }
  .confirm__status__label span:not(.confirm__status__label__title) ~ span:not(.confirm__status__label__title) {
    margin-left: 4px;
    padding-left: 4px;
    border-left: 1px solid; }

.confirm__status__label--withTitle {
  padding-left: 4px;
  border-left: 4px solid;
  font-size: 11px;
  height: 11px;
  transform: translateY(11px); }

.confirm__status__label--withTitle--hugWidth {
  flex-direction: column;
  align-items: flex-start;
  border-left: none;
  height: auto;
  transform: none;
  justify-content: flex-start;
  padding-left: 8px;
  line-height: 13px; }
  .confirm__status__label--withTitle--hugWidth::before {
    content: "";
    width: 4px;
    height: 11px;
    display: inline-flex;
    position: absolute;
    left: 0px;
    top: 11px;
    line-height: 1em; }
  .confirm__status__label--withTitle--hugWidth .confirm__status__label__title {
    position: relative;
    margin-left: -8px;
    left: 0;
    top: 0;
    line-height: 1em; }

.confirm__status__label--noLine {
  border-left: none;
  padding-left: 0; }
  .confirm__status__label--noLine .confirm__status__label__title {
    left: 0;
    margin-left: 0; }
  .confirm__status__label--noLine::before {
    width: 0; }
  .confirm__status__label--noLine.confirm__status__label--withTitle--hugWidth .confirm__status__label__title {
    margin-left: 0; }
  .confirm__status__label--noLine.confirm__status__label--withTitle--hugWidth::before {
    background-color: transparent; }

.confirm__status__label ~ .confirm__status__label {
  margin-left: 8px; }

.confirm__status__label ~ .confirm__status__label--noLine {
  margin-left: 20px; }
  .confirm__status__label ~ .confirm__status__label--noLine::before {
    content: "";
    position: absolute;
    left: -8px;
    top: -10px;
    height: calc(100% + 10px);
    border-left: 1px solid #cccccc; }
  .confirm__status__label ~ .confirm__status__label--noLine.confirm__status__label--withTitle--hugWidth::before {
    height: 100%;
    top: 0; }

.confirm__status__label__title {
  position: absolute;
  top: -14px;
  left: -4px;
  font-size: 10px;
  font-weight: normal; }

.confirm__status__label__title--gray {
  color: #888888; }

.confirm__status__label--pink {
  color: #F15C98;
  border-color: #F15C98; }
  .confirm__status__label--pink span {
    color: #F15C98; }
  .confirm__status__label--pink::before {
    background-color: #F15C98; }

.confirm__status__label--red {
  color: #b60117;
  border-color: #b60117; }
  .confirm__status__label--red span {
    color: #b60117; }
  .confirm__status__label--red::before {
    background-color: #b60117; }

.confirm__status__label--green {
  color: #23D19D;
  border-color: #23D19D; }
  .confirm__status__label--green span {
    color: #23D19D; }
  .confirm__status__label--green::before {
    background-color: #23D19D; }

.confirm__status__label--gray {
  color: #888888;
  border-color: #888888; }
  .confirm__status__label--gray span {
    color: #888888; }
  .confirm__status__label--gray::before {
    background-color: #888888; }

.confirm__status__label--black {
  color: #373737;
  border-color: #373737; }
  .confirm__status__label--black::before {
    background-color: #373737; }

.confirm__status__log {
  margin-left: 12px;
  display: flex;
  flex-direction: column;
  flex-shrink: 1;
  flex-grow: 1;
  position: relative;
  transition: 0.52s ease-in-out; }
  .confirm__status__log p {
    font-size: 10px;
    letter-spacing: -0.05em;
    line-height: 10px;
    width: 100%;
    display: flex;
    margin-top: auto;
    margin-bottom: auto;
    white-space: normal;
    word-break: break-all;
    position: relative; }
    .confirm__status__log p .confirm__status__fileID__text {
      position: absolute;
      left: 100%;
      top: 50%;
      transform: translateY(-50%);
      padding-left: 8px;
      white-space: nowrap; }
  .confirm__status__log p ~ p {
    margin-top: 12px; }

.confirm__status__log__wrap {
  display: flex;
  flex-grow: 1;
  overflow: auto; }

.confirm__status__log__option {
  padding-right: 10px;
  padding-left: 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  transition: 0.52s ease-in-out; }

.confirm__status__log__information {
  font-size: 10px;
  margin-top: 2px; }

.confirm__status__log__toolTip {
  position: absolute;
  right: 10px;
  top: 16px;
  width: 152px;
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 4px 8px;
  border-radius: 5px;
  font-size: 10px;
  line-height: 1.2em;
  z-index: 21; }

.confirm__status__toggle {
  margin-top: auto;
  width: 10px;
  height: 16px;
  position: relative;
  cursor: pointer;
  transition: 0.52s ease-in-out; }
  .confirm__status__toggle::before {
    position: relative;
    display: inline-block;
    z-index: 12;
    font-size: 10px;
    transition: 0.18s ease;
    transform: scale(1) rotate(180deg); }
  .confirm__status__toggle::after {
    content: "";
    background-color: #eeeeee;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: 0.06s ease;
    transform: translateX(-50%) translateY(-50%) scale(0);
    z-index: 4; }
  .confirm__status__toggle:active::after {
    transform: translateX(-50%) translateY(-50%) scale(1); }

.confirm__status__subStatus {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex-wrap: wrap;
  flex-shrink: 0;
  flex-grow: 0;
  min-width: 104px;
  padding-left: 8px;
  margin-left: auto;
  border-left: 1px solid #cccccc;
  transition: 0.52s ease-in-out; }
  .confirm__status__subStatus *[class*="icon"] {
    font-size: 11px;
    color: #888888;
    margin-right: 4px;
    width: 10px; }
  .confirm__status__subStatus div {
    line-height: 10px; }
  .confirm__status__subStatus div ~ div {
    margin-top: 4px; }
  .confirm__status__subStatus > div:only-child {
    height: 22px; }

.confirm__status__bumon, .confirm__status__fileID {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-self: flex-start;
  padding-left: 8px;
  padding-right: 8px;
  border-left: 1px solid #cccccc;
  transition: 0.52s ease-in-out;
  flex-shrink: 0;
  flex-grow: 0;
  min-width: 0px;
  max-width: 144px; }
  .confirm__status__bumon span, .confirm__status__fileID span {
    font-size: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: clip; }

.confirm__status__fileID {
  border-left: none;
  padding-right: 0;
  min-width: 76px; }
  .confirm__status__fileID .confirm__status__subStatus__caption {
    line-height: 1.5em; }
  .confirm__status__fileID .confirm__status__fileID__text {
    font-size: 12px; }

.confirm__status__fileID__text {
  font-size: 12px;
  letter-spacing: -0.05em; }

.confirm__status__log__option ~ .confirm__status__fileID {
  border-left: 1px solid #cccccc; }

.confirm__status__log__option ~ .confirm__status__fileID ~ .confirm__status__bumon, .confirm__status__log__option ~ .confirm__status__fileID ~ .confirm__status__fileID {
  margin-left: 8px; }

.confirm__status__OCRlearning,
.confirm__status__documentAlert {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  color: #373737;
  font-size: 10px; }

.confirm__status__OCRlearning--unlearned {
  color: #888888; }

.confirm__status__documentAlert {
  color: #b60117; }
  .confirm__status__documentAlert *[class*="icon"] {
    color: #D0021B; }

.confirm__status__documentAlert--orange {
  color: #FE8133; }
  .confirm__status__documentAlert--orange *[class*="icon"] {
    color: #FE8133; }

.confirm__status__subStatus__caption {
  font-size: 10px;
  letter-spacing: -0.05em;
  color: #888888; }

.confirm__fillIn__fee {
  text-align: right; }

.confirm__fillIn__alignRight {
  text-align: right; }

.confirm__fillIn__detail__unitPrice input {
  text-align: right; }

.confirm__fillIn__panel {
  max-height: calc(50% - 50px - 4px);
  min-height: 80px;
  overflow: auto; }
  .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable,
  .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable,
  .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable,
  .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable,
  .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable {
    opacity: 0.55; }
    .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable input, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable textarea, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.select,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable input,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable textarea,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.select,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable input,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable textarea,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.select,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable input,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable textarea,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.select,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable input,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable textarea,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.select {
      background-color: #f5f5f5; }
    .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable .confirm__fillIn__code__text,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable .confirm__fillIn__code__text,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable .confirm__fillIn__code__text,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable .confirm__fillIn__code__text,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable .confirm__fillIn__code__text {
      color: rgba(51, 51, 51, 0.5);
      opacity: 0.75; }
    .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.define__confirmSearch, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.spoit__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.define__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.spoit__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.define__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.spoit__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.define__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.spoit__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.define__confirmSearch,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.spoit__confirmSearch {
      background-color: #f5f5f5; }
      .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.define__confirmSearch input, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.define__confirmSearch textarea, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.spoit__confirmSearch input, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.spoit__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.define__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.define__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.spoit__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.spoit__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.define__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.define__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.spoit__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.spoit__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.define__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.define__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.spoit__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.spoit__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.define__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.define__confirmSearch textarea,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.spoit__confirmSearch input,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.spoit__confirmSearch textarea {
        background-color: transparent; }
    .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.confirm__fillIn--disable--clickable,
    .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.confirm__fillIn--disable--clickable,
    .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.confirm__fillIn--disable--clickable,
    .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.confirm__fillIn--disable--clickable,
    .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.confirm__fillIn--disable--clickable {
      opacity: 1; }
      .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.confirm__fillIn--disable--clickable input, .confirm__fillIn__panel .confirm__fillIn__customer .confirm__fillIn--disable.confirm__fillIn--disable--clickable textarea,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.confirm__fillIn--disable--clickable input,
      .confirm__fillIn__panel .confirm__fillIn__detail .confirm__fillIn--disable.confirm__fillIn--disable--clickable textarea,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.confirm__fillIn--disable--clickable input,
      .confirm__fillIn__panel .confirm__fillIn__debitCredit .confirm__fillIn--disable.confirm__fillIn--disable--clickable textarea,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.confirm__fillIn--disable--clickable input,
      .confirm__fillIn__panel .confirm__fillIn__payment .confirm__fillIn--disable.confirm__fillIn--disable--clickable textarea,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.confirm__fillIn--disable--clickable input,
      .confirm__fillIn__panel .confirm__fillIn__common .confirm__fillIn--disable.confirm__fillIn--disable--clickable textarea {
        background-color: #f5f5f5;
        opacity: 0.55; }

.confirm__fillIn__panel--full {
  max-height: calc(100% - 50px - 24px); }

.confirm__fillIn__panel--noLimit {
  max-height: none; }

.confirm__fillIn__panel--noLimit:last-child {
  margin-bottom: 24px; }

.confirm__fillIn__PanelResizer {
  height: 8px;
  width: 100%;
  cursor: row-resize; }

.confirm__fillIn__customer,
.confirm__fillIn__payment,
.confirm__fillIn__common {
  padding: 12px 20px 28px;
  background-color: #ffffff;
  border-radius: 5px 5px 0 0; }
  .confirm__fillIn__customer--noPadding,
  .confirm__fillIn__payment--noPadding,
  .confirm__fillIn__common--noPadding {
    padding-bottom: 8px; }
  .confirm__fillIn__customer--zeroPadding,
  .confirm__fillIn__payment--zeroPadding,
  .confirm__fillIn__common--zeroPadding {
    padding-bottom: 0; }
  .confirm__fillIn__customer textarea,
  .confirm__fillIn__payment textarea,
  .confirm__fillIn__common textarea {
    width: 100%;
    height: 26px;
    box-sizing: border-box;
    overflow-y: scroll;
    resize: vertical; }
  .confirm__fillIn__customer ::placeholder,
  .confirm__fillIn__customer :placeholder-shown,
  .confirm__fillIn__payment ::placeholder,
  .confirm__fillIn__payment :placeholder-shown,
  .confirm__fillIn__common ::placeholder,
  .confirm__fillIn__common :placeholder-shown {
    padding-top: 0.16em; }
  .confirm__fillIn__customer :-ms-input-placeholder,
  .confirm__fillIn__payment :-ms-input-placeholder,
  .confirm__fillIn__common :-ms-input-placeholder {
    letter-spacing: -0.045em; }
  .confirm__fillIn__customer ::-ms-input-placeholder,
  .confirm__fillIn__payment ::-ms-input-placeholder,
  .confirm__fillIn__common ::-ms-input-placeholder {
    letter-spacing: -0.045em; }
  .confirm__fillIn__customer .popup__text,
  .confirm__fillIn__payment .popup__text,
  .confirm__fillIn__common .popup__text {
    position: relative;
    display: flex;
    align-items: center; }
    .confirm__fillIn__customer .popup__text input,
    .confirm__fillIn__payment .popup__text input,
    .confirm__fillIn__common .popup__text input {
      width: 100%;
      padding-right: calc(100% - 154px);
      box-sizing: border-box;
      background-color: #ffffff; }
    .confirm__fillIn__customer .popup__text .confirm__fillIn__code__text,
    .confirm__fillIn__payment .popup__text .confirm__fillIn__code__text,
    .confirm__fillIn__common .popup__text .confirm__fillIn__code__text {
      width: calc(100% - 154px);
      left: 154px; }
  .confirm__fillIn__customer .popup__text--inputWord input,
  .confirm__fillIn__payment .popup__text--inputWord input,
  .confirm__fillIn__common .popup__text--inputWord input {
    padding-right: calc(100% - 184px); }
  .confirm__fillIn__customer .popup__text--inputWord .confirm__fillIn__code__text,
  .confirm__fillIn__payment .popup__text--inputWord .confirm__fillIn__code__text,
  .confirm__fillIn__common .popup__text--inputWord .confirm__fillIn__code__text {
    width: calc(100% - 184px);
    left: 184px; }
  .confirm__fillIn__customer .confirm__fillIn__code__text,
  .confirm__fillIn__payment .confirm__fillIn__code__text,
  .confirm__fillIn__common .confirm__fillIn__code__text {
    width: calc(100% - 88px);
    position: absolute;
    top: 0;
    left: auto;
    right: 0;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    user-select: none; }
  .confirm__fillIn__customer .confirm__fillIn__code__text::before,
  .confirm__fillIn__payment .confirm__fillIn__code__text::before,
  .confirm__fillIn__common .confirm__fillIn__code__text::before {
    content: ":";
    top: 0;
    margin-right: 4px; }
  .confirm__fillIn__customer .confirm__fillIn__code__tooltip,
  .confirm__fillIn__customer .confirm__fillIn__tooltip,
  .confirm__fillIn__payment .confirm__fillIn__code__tooltip,
  .confirm__fillIn__payment .confirm__fillIn__tooltip,
  .confirm__fillIn__common .confirm__fillIn__code__tooltip,
  .confirm__fillIn__common .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
    .confirm__fillIn__customer .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest,
    .confirm__fillIn__customer .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest,
    .confirm__fillIn__payment .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest,
    .confirm__fillIn__payment .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest,
    .confirm__fillIn__common .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest,
    .confirm__fillIn__common .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest {
      width: auto;
      top: 21px;
      cursor: pointer;
      left: 0;
      right: auto; }
    .confirm__fillIn__customer .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest--right,
    .confirm__fillIn__customer .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest--right,
    .confirm__fillIn__payment .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest--right,
    .confirm__fillIn__payment .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest--right,
    .confirm__fillIn__common .confirm__fillIn__code__tooltip.confirm__fillIn__tooltip--suggest--right,
    .confirm__fillIn__common .confirm__fillIn__tooltip.confirm__fillIn__tooltip--suggest--right {
      left: auto;
      right: 0; }
  .confirm__fillIn__customer .icon-edit,
  .confirm__fillIn__customer .icon-spoit,
  .confirm__fillIn__customer .icon-pin,
  .confirm__fillIn__payment .icon-edit,
  .confirm__fillIn__payment .icon-spoit,
  .confirm__fillIn__payment .icon-pin,
  .confirm__fillIn__common .icon-edit,
  .confirm__fillIn__common .icon-spoit,
  .confirm__fillIn__common .icon-pin {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer; }
    .confirm__fillIn__customer .icon-edit::after,
    .confirm__fillIn__customer .icon-spoit::after,
    .confirm__fillIn__customer .icon-pin::after,
    .confirm__fillIn__payment .icon-edit::after,
    .confirm__fillIn__payment .icon-spoit::after,
    .confirm__fillIn__payment .icon-pin::after,
    .confirm__fillIn__common .icon-edit::after,
    .confirm__fillIn__common .icon-spoit::after,
    .confirm__fillIn__common .icon-pin::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__customer .icon-edit:hover::after,
  .confirm__fillIn__customer .icon-spoit:hover::after,
  .confirm__fillIn__customer .icon-pin:hover::after,
  .confirm__fillIn__payment .icon-edit:hover::after,
  .confirm__fillIn__payment .icon-spoit:hover::after,
  .confirm__fillIn__payment .icon-pin:hover::after,
  .confirm__fillIn__common .icon-edit:hover::after,
  .confirm__fillIn__common .icon-spoit:hover::after,
  .confirm__fillIn__common .icon-pin:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__customer .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__customer .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__customer .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__customer .icon-spoit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__customer .icon-pin:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__customer .icon-pin:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__payment .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__payment .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__payment .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__payment .icon-spoit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__payment .icon-pin:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__payment .icon-pin:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__common .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__common .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__common .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__common .icon-spoit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__common .icon-pin:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__common .icon-pin:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__customer .icon-edit--disable,
  .confirm__fillIn__customer .icon-spoit--disable,
  .confirm__fillIn__payment .icon-edit--disable,
  .confirm__fillIn__payment .icon-spoit--disable,
  .confirm__fillIn__common .icon-edit--disable,
  .confirm__fillIn__common .icon-spoit--disable {
    opacity: 0.1;
    pointer-events: none; }
  .confirm__fillIn__customer .input__date:hover .confirm__fillIn__tooltip--suggest,
  .confirm__fillIn__payment .input__date:hover .confirm__fillIn__tooltip--suggest,
  .confirm__fillIn__common .input__date:hover .confirm__fillIn__tooltip--suggest {
    transform: scaleY(1);
    transition: 0.3s ease; }
  .confirm__fillIn__customer .confirm__fillIn__addItemLine,
  .confirm__fillIn__payment .confirm__fillIn__addItemLine,
  .confirm__fillIn__common .confirm__fillIn__addItemLine {
    margin-top: 4px;
    position: relative; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine input[type="text"],
    .confirm__fillIn__payment .confirm__fillIn__addItemLine input[type="text"],
    .confirm__fillIn__common .confirm__fillIn__addItemLine input[type="text"] {
      display: block;
      height: 26px;
      width: 100%; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .spoit__confirmSearch,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .spoit__confirmSearch,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .spoit__confirmSearch {
      display: block;
      height: 100%;
      width: 100%;
      padding: 0;
      border-radius: 0;
      border: none;
      background-color: transparent; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .confirm__fillIn__code__text,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .confirm__fillIn__code__text,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .confirm__fillIn__code__text {
      padding-right: 52px; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .popup__text .confirm__fillIn__code__text,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .popup__text .confirm__fillIn__code__text,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .popup__text .confirm__fillIn__code__text {
      width: 72%;
      left: 28%; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .popup__text input[type="text"],
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .popup__text input[type="text"],
    .confirm__fillIn__common .confirm__fillIn__addItemLine .popup__text input[type="text"] {
      padding-right: 72%; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .icon-spoit,
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .icon-edit,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .icon-spoit,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .icon-edit,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .icon-spoit,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .icon-edit {
      position: absolute;
      top: 6px;
      right: 8px; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .icon-edit,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .icon-edit,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .icon-edit {
      right: 32px; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine .icon-edit:last-child,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine .icon-edit:last-child,
    .confirm__fillIn__common .confirm__fillIn__addItemLine .icon-edit:last-child {
      right: 8px; }
    .confirm__fillIn__customer .confirm__fillIn__addItemLine input,
    .confirm__fillIn__payment .confirm__fillIn__addItemLine input,
    .confirm__fillIn__common .confirm__fillIn__addItemLine input {
      width: 100%;
      border: 1px solid #cccccc;
      line-height: 1em;
      padding-top: 3px;
      padding-bottom: 3px;
      background-color: #ffffff;
      color: #373737; }
  .confirm__fillIn__customer .switch--display,
  .confirm__fillIn__payment .switch--display,
  .confirm__fillIn__common .switch--display {
    margin-left: auto;
    margin-top: 8px;
    width: calc(100% / 3 - 24px);
    position: relative;
    z-index: 1; }
  .confirm__fillIn__customer .switch--display + .confirm__fillIn__inputArea,
  .confirm__fillIn__payment .switch--display + .confirm__fillIn__inputArea,
  .confirm__fillIn__common .switch--display + .confirm__fillIn__inputArea {
    margin-top: -14px;
    position: relative; }
  .confirm__fillIn__customer .switch--display + .confirm__fillIn__inputArea.confirm__fillIn__inputArea--locked,
  .confirm__fillIn__payment .switch--display + .confirm__fillIn__inputArea.confirm__fillIn__inputArea--locked,
  .confirm__fillIn__common .switch--display + .confirm__fillIn__inputArea.confirm__fillIn__inputArea--locked {
    margin-top: -8px; }

.confirm__fillIn__customer--singleLine {
  position: relative;
  padding-bottom: 12px;
  z-index: 21; }
  .confirm__fillIn__customer--singleLine .confirm__fillIn__title {
    margin-bottom: 0; }
  .confirm__fillIn__customer--singleLine .confirm__fillIn__inputArea {
    width: calc(50% - 12px);
    margin-bottom: 0; }
  .confirm__fillIn__customer--singleLine .switch--text {
    margin-right: 24px;
    margin-left: auto; }

.confirm__fillIn__customer ~ .confirm__fillIn__customer {
  border-top: 1px solid #e0e0e0; }

.confirm__fillIn__customer__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 100%; }
  .confirm__fillIn__customer__header .confirm__fillIn__cautionText {
    position: relative;
    width: 100%;
    top: 0;
    margin-top: 0;
    margin-top: -4px;
    margin-bottom: 8px; }
  .confirm__fillIn__customer__header .confirm__fillIn__half > .confirm__fillIn__cautionText {
    justify-content: flex-end;
    bottom: calc(100% + 4px);
    margin-bottom: 0; }

@keyframes cautionTextFadein {
  0% {
    opacity: 0;
    min-height: 0;
    max-height: 0;
    overflow: hidden; }
  99% {
    max-height: 0; }
  100% {
    opacity: 1;
    min-height: 15px;
    max-height: 90px;
    overflow: hidden; } }

.confirm__fillIn__inputArea + .confirm__fillIn__title {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #cccccc; }

.confirm__fillIn__title {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px; }
  .confirm__fillIn__title .toggleButton {
    margin-right: auto;
    align-self: center; }

.confirm__fillIn__bank {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin-top: 16px;
  border-top: 1px solid #e0e0e0;
  padding-bottom: 12px; }
  .confirm__fillIn__bank .confirm__addLineButton {
    margin-top: 8px; }
  .confirm__fillIn__bank .icon-edit--disable {
    opacity: 0.1;
    pointer-events: none; }

.confirm__fillIn__bank--locked {
  margin-top: 8px; }
  .confirm__fillIn__bank--locked dd {
    font-size: 14px;
    min-height: 21px; }

.confirm__fillIn__bank__payment ~ .confirm__fillIn__bank {
  margin-top: 0; }

.confirm__fillIn__bank--locked ~ .confirm__fillIn__bank--locked .confirm__fillIn__title {
  margin-bottom: 0; }

.confirm__fillIn__other {
  height: 28px;
  width: 28px;
  margin-left: 16px;
  display: flex;
  justify-content: center;
  align-items: center; }
  .confirm__fillIn__other .icon-other {
    font-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 28px;
    width: 28px;
    position: relative; }
    .confirm__fillIn__other .icon-other::before {
      display: flex;
      transition: 0.1s ease;
      position: absolute;
      left: -60%;
      top: 10px;
      transform: scale(0.5) translateX(50%); }
    .confirm__fillIn__other .icon-other::after {
      display: flex;
      width: 100%;
      height: 100%; }
    .confirm__fillIn__other .icon-other:active::before {
      transform: scale(0.36) translateX(68%); }
  .confirm__fillIn__other .subMenu {
    right: 31px;
    top: -2px; }

.confirm__fillIn__addBank {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 8px;
  font-weight: normal; }
  .confirm__fillIn__addBank .icon-plus {
    transform: translateY(2px);
    font-size: 12px;
    margin-right: 2px; }
  .confirm__fillIn__addBank button {
    width: 118px;
    margin-left: auto; }

.confirm__fillIn__delivery__header {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 80px);
  margin-left: auto;
  margin-top: -8px; }
  .confirm__fillIn__delivery__header .confirm__fillIn__half {
    display: flex;
    justify-content: flex-start;
    width: calc(50% + 28px);
    margin-left: auto; }
    .confirm__fillIn__delivery__header .confirm__fillIn__half dt {
      width: 80px;
      font-size: 10px;
      color: #888888;
      padding-top: 6px; }
    .confirm__fillIn__delivery__header .confirm__fillIn__half dd {
      width: calc(100% - 80px); }
      .confirm__fillIn__delivery__header .confirm__fillIn__half dd input {
        width: 100%;
        height: 26px;
        font-size: 14px; }

.confirm__fillIn__delivery__header__item {
  width: calc(25% - 28px); }

.confirm__fillIn__delivery__header__item ~ .confirm__fillIn__delivery__header__item {
  margin-left: 4px;
  margin-right: auto; }

.confirm__fillIn__delivery__header__item:only-of-type {
  width: calc(50% - 52px); }

.define__confirmSearch,
.spoit__confirmSearch {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 26px;
  width: 100%;
  padding: 0;
  border-radius: 5px;
  border: 1px solid #cccccc;
  line-height: 1em;
  background-color: #ffffff;
  color: #373737; }
  .define__confirmSearch .icon-pin,
  .define__confirmSearch .icon-spoit,
  .spoit__confirmSearch .icon-pin,
  .spoit__confirmSearch .icon-spoit {
    position: relative;
    font-size: 14px;
    cursor: pointer;
    right: 8px;
    top: 0; }
    .define__confirmSearch .icon-pin::after,
    .define__confirmSearch .icon-spoit::after,
    .spoit__confirmSearch .icon-pin::after,
    .spoit__confirmSearch .icon-spoit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .define__confirmSearch .confirm__detail__defineButton__tooltip,
  .define__confirmSearch .confirm__fillIn__tooltip,
  .spoit__confirmSearch .confirm__detail__defineButton__tooltip,
  .spoit__confirmSearch .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
  .define__confirmSearch .icon-pin:hover::after,
  .define__confirmSearch .icon-spoit:hover::after,
  .spoit__confirmSearch .icon-pin:hover::after,
  .spoit__confirmSearch .icon-spoit:hover::after {
    opacity: 0.1; }
  .define__confirmSearch .icon-pin:hover .confirm__detail__defineButton__tooltip,
  .define__confirmSearch .icon-pin:hover .confirm__fillIn__tooltip,
  .define__confirmSearch .icon-spoit:hover .confirm__detail__defineButton__tooltip,
  .define__confirmSearch .icon-spoit:hover .confirm__fillIn__tooltip,
  .spoit__confirmSearch .icon-pin:hover .confirm__detail__defineButton__tooltip,
  .spoit__confirmSearch .icon-pin:hover .confirm__fillIn__tooltip,
  .spoit__confirmSearch .icon-spoit:hover .confirm__detail__defineButton__tooltip,
  .spoit__confirmSearch .icon-spoit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .define__confirmSearch input,
  .spoit__confirmSearch input {
    border-color: transparent;
    background-color: transparent;
    padding-top: 0;
    padding-bottom: 0; }
  .define__confirmSearch div,
  .spoit__confirmSearch div {
    display: flex;
    align-items: flex-start;
    width: 100%; }
  .define__confirmSearch.input__caution,
  .spoit__confirmSearch.input__caution {
    border-color: #F0AD3E; }
  .define__confirmSearch:hover .confirm__fillIn__tooltip--suggest,
  .spoit__confirmSearch:hover .confirm__fillIn__tooltip--suggest {
    transform: scaleY(1);
    transition: 0.3s ease; }

.spoit__confirmSearch input {
  padding-right: 22px; }

.icon-pin--changed::before {
  color: #23D19D; }

.confirm__detail__defineButton__tooltip,
.confirm__fillIn__prorateButton__tooltip {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  right: -8px;
  top: 16px;
  font-weight: normal;
  color: #5a5a5a;
  border: 1px solid #cccccc;
  font-size: 12px;
  width: 152px;
  background-color: #eeeeee;
  padding: 4px 8px;
  transform: scaleY(0);
  transform-origin: top;
  transition: 0.15s ease;
  z-index: 20 !important; }

.confirm__fillIn__inputArea {
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px; }
  .confirm__fillIn__inputArea dl {
    display: flex;
    align-items: stretch;
    width: 100%; }
  .confirm__fillIn__inputArea dt {
    width: 80px;
    font-size: 10px;
    color: #888888;
    padding-top: 6px; }
  .confirm__fillIn__inputArea .confirm__fillIn__inputArea__title--multiLine {
    padding-top: 3px;
    line-height: 1.1em;
    padding-right: 4px; }
  .confirm__fillIn__inputArea dd {
    width: calc(100% - 80px);
    position: relative; }
    .confirm__fillIn__inputArea dd input {
      width: 100%;
      height: 26px;
      font-size: 14px; }
    .confirm__fillIn__inputArea dd > div ~ div {
      margin-top: 4px; }
  .confirm__fillIn__inputArea .confirm__fillIn__half {
    width: calc(50% - 12px); }
    .confirm__fillIn__inputArea .confirm__fillIn__half div:hover .confirm__fillIn__tooltip--suggest {
      transform: scaleY(1);
      transition: 0.3s ease; }
  .confirm__fillIn__inputArea .confirm__fillIn__oneThird {
    width: calc(100% / 3 - 4px);
    margin-top: auto; }
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__full {
      width: 100%;
      flex-wrap: wrap;
      margin-top: -2px; }
      .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__full dt, .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__full dd {
        width: 100%; }
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__half {
      width: 100%;
      flex-wrap: wrap;
      align-items: center;
      margin-top: 2px;
      transition: 0.3s ease,0.21s ease opacity; }
      .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__half dt {
        width: 54px;
        padding-top: 0;
        line-height: 1.1em;
        padding-right: 4px;
        text-align: right;
        letter-spacing: -0.04em; }
      .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__half dd {
        width: calc(100% - 54px); }
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__half:only-child {
      margin-bottom: 2px;
      margin-top: 0; }
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .icon-pin,
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .icon-spoit,
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .icon-edit {
      font-size: 12px; }
    .confirm__fillIn__inputArea .confirm__fillIn__oneThird .confirm__fillIn__close {
      max-height: 0;
      opacity: 0;
      margin: 0;
      overflow: hidden; }

.confirm__fillIn__inputArea--withCautionText {
  align-items: flex-end; }
  .confirm__fillIn__inputArea--withCautionText .confirm__fillIn__half {
    flex-wrap: wrap; }
    .confirm__fillIn__inputArea--withCautionText .confirm__fillIn__half > .confirm__fillIn__cautionText {
      position: relative;
      margin-bottom: 4px;
      margin-left: auto;
      justify-content: flex-end;
      animation: cautionTextFadein 0.6s ease 0s 1 normal;
      animation-fill-mode: forwards;
      width: 100%;
      opacity: 0;
      min-height: 0;
      max-height: 0;
      overflow: hidden; }

.confirm__fillIn__half {
  width: calc(50% - 12px);
  position: relative; }
  .confirm__fillIn__half > .confirm__fillIn__cautionText {
    position: absolute;
    left: auto;
    right: 0;
    top: auto;
    bottom: calc(100% + 2px); }

.confirm__fillIn__oneThird__cautionTextArea {
  margin-bottom: -14px; }
  .confirm__fillIn__oneThird__cautionTextArea .confirm__fillIn__cautionText {
    position: relative;
    top: auto;
    left: auto;
    max-width: calc(100% - 128px - 8px);
    align-items: flex-start; }
    .confirm__fillIn__oneThird__cautionTextArea .confirm__fillIn__cautionText *[class*="icon"] {
      transform: translateY(3px); }
  .confirm__fillIn__oneThird__cautionTextArea .confirm__fillIn__cautionText--added {
    animation: cautionTextFadein 0.6s ease 0s 1 normal;
    animation-fill-mode: forwards;
    opacity: 0;
    min-height: 0;
    max-height: 0;
    overflow: hidden; }

.confirm__fillIn__inputArea--toggleLine {
  flex-wrap: wrap;
  position: relative;
  margin-bottom: 0;
  padding-bottom: 0; }
  .confirm__fillIn__inputArea--toggleLine::before {
    content: "";
    position: absolute;
    left: -20px;
    top: 0;
    width: calc(100% + 20px + 20px);
    height: 1px;
    background-color: #e0e0e0;
    z-index: 1; }
  .confirm__fillIn__inputArea--toggleLine > .confirm__fillIn__half {
    width: calc(50% - 24px);
    margin-left: auto;
    margin-bottom: 8px; }
  .confirm__fillIn__inputArea--toggleLine > .confirm__fillIn__half ~ > .confirm__fillIn__half {
    margin-left: 0; }
  .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__totsugouToggle {
    right: auto;
    bottom: auto;
    left: 0;
    top: 5px; }
  .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__cautionText {
    position: relative;
    margin-top: 8px;
    margin-bottom: -4px; }
  .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__listLine__orderMeisaiArea.confirm__fillIn__detail__listLine__orderMeisaiArea--open {
    margin-top: 0; }
  .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__listLine__orderMeisaiArea::before {
    bottom: 0;
    height: 100%; }
  .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__listLine__orderMeisai:last-child:not(
.confirm__fillIn__detail__listLine__orderMeisai:only-child)::before {
    top: 0; }

.confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--toggleLine {
  padding-top: 8px; }
  .confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__totsugouToggle {
    top: 13px; }

.confirm__fillIn__title + .confirm__fillIn__inputArea--toggleLine::before {
  content: none; }

.confirm__fillIn__inputArea--fail {
  z-index: 1; }
  .confirm__fillIn__inputArea--fail::after {
    content: "";
    display: block;
    background-color: #FFFAE9;
    position: absolute;
    left: -20px;
    top: -8px;
    width: calc(100% + 20px + 20px);
    height: calc(100% + 8px);
    z-index: -1; }
  .confirm__fillIn__inputArea--fail > .confirm__fillIn__detail__totsugouTitle {
    font-size: 10px;
    position: absolute;
    left: -8px;
    top: -11px;
    color: #F0AD3E;
    background-color: #FFFAE9;
    border-radius: 5px;
    padding: 0 8px; }
  .confirm__fillIn__inputArea--fail .confirm__fillIn__detail__totsugouTitle + .confirm__fillIn__detail__totsugouToggle {
    top: 5px; }

.confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--fail::after {
  top: 0;
  height: 100%; }

.confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--fail > .confirm__fillIn__detail__totsugouTitle {
  top: -5px;
  z-index: 2; }

.confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--fail .confirm__fillIn__detail__totsugouTitle + .confirm__fillIn__detail__totsugouToggle {
  top: 13px; }

.confirm__fillIn__cautionText {
  position: absolute;
  display: flex;
  align-items: center;
  top: -10px;
  left: 0;
  font-size: 10px;
  color: #F0AD3E; }
  .confirm__fillIn__cautionText .icon-alert {
    font-size: 10px;
    color: #F0AD3E;
    margin-right: 4px; }

.confirm__fillIn__cautionText--common {
  position: static; }

.confirm__fillIn__full__multiItem {
  display: flex;
  flex-wrap: wrap; }
  .confirm__fillIn__full__multiItem * ~ * {
    margin-left: 4px; }
  .confirm__fillIn__full__multiItem .confirm__fillIn__cautionText {
    margin-left: 0;
    width: 100%; }
  .confirm__fillIn__full__multiItem .confirm__fillIn__detail__addItem,
  .confirm__fillIn__full__multiItem .popup__text {
    width: auto;
    flex-basis: 1;
    flex-grow: 1; }

.confirm__fillIn__full__multiItem__Item--variable {
  flex-basis: auto;
  flex-shrink: 0; }

.confirm__fillIn__inputArea--locked dl {
  min-height: 16px;
  margin-bottom: 2px; }

.confirm__fillIn__inputArea--locked dt {
  padding-top: 3px;
  padding-right: 4px; }

.confirm__fillIn__inputArea--locked dd {
  border-left: 1px dashed #cccccc;
  padding-left: 12px;
  font-size: 14px;
  min-height: 21px; }

.confirm__fillIn__inputArea--locked .confirm__fillIn__full__multiItem__Item--variable {
  font-size: 14px;
  border-left: 1px dashed #cccccc;
  padding-left: 12px;
  margin-left: 12px;
  font-size: 14px; }

.confirm__fillIn__inputArea--locked .confirm__fillIn__inputArea--subinput dt {
  padding-top: 3px; }

.confirm__fillIn__inputArea--locked .confirm__fillIn__inputArea--subinput dd {
  padding-left: 8px;
  font-size: 12px;
  padding-top: 2px; }

.confirm__fillIn__inputArea--locked--borderSolidBottom {
  border-bottom: 1px solid #cccccc;
  border-left: none; }
  .confirm__fillIn__inputArea--locked--borderSolidBottom dd {
    border-left: none; }

.confirm__fillIn__commonButtonArea {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: 8px;
  margin-bottom: 4px; }

.confirm__fillIn__commonButtonArea + .switch--display {
  margin-top: 4px; }

.confirm__fillIn__cleartaxvalue {
  width: calc(100% / 3 - 24px);
  border-radius: 5px;
  display: flex;
  justify-content: center; }

.confirm__fillIn__VATrelief {
  border-left: 1px solid #e0e0e0;
  padding-left: 4px;
  margin-top: 2px;
  margin-bottom: 2px; }

.confirm__fillIn__VATrelief__item {
  justify-content: space-between; }
  .confirm__fillIn__VATrelief__item dt {
    width: 46px;
    text-align: right;
    padding-right: 6px; }
  .confirm__fillIn__VATrelief__item dd {
    width: calc(100% - 46px);
    text-align: right; }
  .confirm__fillIn__VATrelief__item .define__confirmSearch,
  .confirm__fillIn__VATrelief__item .spoit__confirmSearch {
    height: 22px; }
    .confirm__fillIn__VATrelief__item .define__confirmSearch input,
    .confirm__fillIn__VATrelief__item .spoit__confirmSearch input {
      font-size: 12px;
      padding-left: 4px; }
    .confirm__fillIn__VATrelief__item .define__confirmSearch .icon-pin,
    .confirm__fillIn__VATrelief__item .spoit__confirmSearch .icon-pin {
      font-size: 12px; }

.confirm__fillIn__VATrelief__item ~ .confirm__fillIn__VATrelief__item {
  margin-top: 2px; }

.confirm__fillIn__inputArea--subinput {
  display: flex;
  width: 100%;
  margin-top: 4px; }
  .confirm__fillIn__inputArea--subinput dt,
  .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__title {
    width: 86px;
    padding-top: 4px; }
  .confirm__fillIn__inputArea--subinput dd,
  .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input {
    width: calc(100% - 86px); }
    .confirm__fillIn__inputArea--subinput dd .define__confirmSearch,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input .define__confirmSearch {
      height: 22px; }
    .confirm__fillIn__inputArea--subinput dd .icon-pin,
    .confirm__fillIn__inputArea--subinput dd .icon-spoit,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input .icon-pin,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input .icon-spoit {
      font-size: 12px; }
    .confirm__fillIn__inputArea--subinput dd input,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input input {
      font-size: 12px;
      padding-left: 4px;
      padding-top: 0; }
    .confirm__fillIn__inputArea--subinput dd :placeholder-shown,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input :placeholder-shown {
      letter-spacing: -0.045em;
      font-size: 12px;
      color: #373737; }
    .confirm__fillIn__inputArea--subinput dd ::-webkit-input-placeholder,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input ::-webkit-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      color: #373737; }
    .confirm__fillIn__inputArea--subinput dd :-moz-placeholder,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input :-moz-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      color: #373737; }
    .confirm__fillIn__inputArea--subinput dd ::-moz-placeholder,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input ::-moz-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      color: #373737; }
    .confirm__fillIn__inputArea--subinput dd :-ms-input-placeholder,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input :-ms-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      transform: translateY(1px);
      color: #373737; }
    .confirm__fillIn__inputArea--subinput dd ::-ms-input-placeholder,
    .confirm__fillIn__inputArea--subinput .confirm__fillIn__inputArea--subinput__input ::-ms-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      transform: translateY(1px);
      color: #373737; }

.confirm__fillIn__viewSwitch {
  border: 1px solid #cccccc;
  border-radius: 5px;
  width: 72px;
  height: 26px;
  display: flex;
  overflow: hidden;
  margin-right: auto; }
  .confirm__fillIn__viewSwitch .confirm__fillIn__viewSwitch__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    cursor: pointer; }
  .confirm__fillIn__viewSwitch input[type="radio"] {
    display: none; }
  .confirm__fillIn__viewSwitch span {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center; }
    .confirm__fillIn__viewSwitch span::before {
      font-size: 10px;
      display: flex; }
  .confirm__fillIn__viewSwitch .icon-detail_open::before {
    font-size: 12px; }
  .confirm__fillIn__viewSwitch input[type="radio"]:checked ~ span {
    background-color: #f5f5f5;
    color: #23D19D; }

.confirm__fillIn__viewSwitch--noSpace {
  margin-right: 0; }

.confirm__fillIn__detail__defineDetail,
.confirm__fillIn__prorateButton {
  height: 26px;
  padding: 0 8px;
  margin-left: 8px;
  margin-right: auto;
  border: 1px solid #cccccc;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative; }
  .confirm__fillIn__detail__defineDetail .icon-pin,
  .confirm__fillIn__prorateButton .icon-pin {
    margin-top: -1px; }
  .confirm__fillIn__detail__defineDetail .confirm__detail__defineButton__tooltip,
  .confirm__fillIn__detail__defineDetail .confirm__fillIn__prorateButton__tooltip,
  .confirm__fillIn__prorateButton .confirm__detail__defineButton__tooltip,
  .confirm__fillIn__prorateButton .confirm__fillIn__prorateButton__tooltip {
    left: 0;
    right: auto;
    top: 100%; }
  .confirm__fillIn__detail__defineDetail:active,
  .confirm__fillIn__prorateButton:active {
    background-color: #eeeeee; }
    .confirm__fillIn__detail__defineDetail:active::after,
    .confirm__fillIn__prorateButton:active::after {
      opacity: 0.1; }
  .confirm__fillIn__detail__defineDetail:hover .confirm__detail__defineButton__tooltip,
  .confirm__fillIn__detail__defineDetail:hover .confirm__fillIn__prorateButton__tooltip,
  .confirm__fillIn__prorateButton:hover .confirm__detail__defineButton__tooltip,
  .confirm__fillIn__prorateButton:hover .confirm__fillIn__prorateButton__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }

.confirm__fillIn__prorateButton {
  z-index: 5; }

.confirm__fillIn__journalize {
  max-height: 45%;
  min-height: 80px; }
  .confirm__fillIn__journalize.confirm__fillIn__panel--full {
    max-height: calc(100% - 140px - 8px - 50px - 24px); }

.confirm__fillIn__debitCredit {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
  height: 100%; }
  .confirm__fillIn__debitCredit dt {
    font-size: 10px;
    color: #888888; }
  .confirm__fillIn__debitCredit dd input {
    width: 100%;
    height: 26px;
    font-size: 10px; }
  .confirm__fillIn__debitCredit input {
    width: 100%;
    padding-left: 4px;
    font-size: 12px; }
  .confirm__fillIn__debitCredit select {
    font-size: 10px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 4px;
    padding-right: 12px;
    letter-spacing: -0.05em; }
  .confirm__fillIn__debitCredit .confirm__fillIn__half {
    width: calc(50% - 12px); }
  .confirm__fillIn__debitCredit .confirm__fillIn__full {
    width: 100%;
    margin-bottom: 4px; }
  .confirm__fillIn__debitCredit .popup__text {
    position: relative;
    display: flex;
    align-items: center; }
    .confirm__fillIn__debitCredit .popup__text input {
      width: 100%;
      padding-right: 166px;
      box-sizing: border-box;
      background-color: #ffffff; }
  .confirm__fillIn__debitCredit .confirm__fillIn__code {
    height: auto; }
    .confirm__fillIn__debitCredit .confirm__fillIn__code input {
      width: 100%;
      padding-right: calc(100% - 112px);
      box-sizing: border-box; }
  .confirm__fillIn__debitCredit .confirm__fillIn__code__tooltip,
  .confirm__fillIn__debitCredit .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
  .confirm__fillIn__debitCredit .icon-edit,
  .confirm__fillIn__debitCredit .icon-spoit {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer; }
    .confirm__fillIn__debitCredit .icon-edit::after,
    .confirm__fillIn__debitCredit .icon-spoit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__debitCredit .icon-edit:hover::after,
  .confirm__fillIn__debitCredit .icon-spoit:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__debitCredit .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__debitCredit .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__debitCredit .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__debitCredit .icon-spoit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__debitCredit .confirm__fillIn__code__text {
    width: calc(100% - 112px);
    position: absolute;
    top: 0;
    left: 88px;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    pointer-events: none; }
  .confirm__fillIn__debitCredit .confirm__fillIn__code__text::before {
    content: ":";
    top: 0;
    margin-right: 4px; }
  .confirm__fillIn__debitCredit :placeholder-shown {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__fillIn__debitCredit ::-webkit-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__fillIn__debitCredit :-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__fillIn__debitCredit ::-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__fillIn__debitCredit :-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .confirm__fillIn__debitCredit ::-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .confirm__fillIn__debitCredit .confirm__addLineButton {
    margin-top: 8px; }

.confirm__fillIn__debit, .confirm__fillIn__credit {
  width: calc(50% - 12px); }

.confirm__fillIn__debit--locked .confirm__fillIn__title, .confirm__fillIn__credit--locked .confirm__fillIn__title {
  margin-bottom: 12px; }

.confirm__fillIn__debit--locked .confirm__fillIn__full, .confirm__fillIn__credit--locked .confirm__fillIn__full {
  min-height: 16px;
  margin-bottom: 12px; }
  .confirm__fillIn__debit--locked .confirm__fillIn__full dd, .confirm__fillIn__credit--locked .confirm__fillIn__full dd {
    min-height: 21px; }

.confirm__fillIn__debit--locked dd, .confirm__fillIn__credit--locked dd {
  border-left: 1px dashed #cccccc;
  padding-left: 12px;
  height: 100%;
  font-size: 14px; }

.confirm__fillIn__debit--locked .confirm__fillIn__code, .confirm__fillIn__credit--locked .confirm__fillIn__code {
  flex-wrap: wrap;
  height: auto;
  margin-top: -4px;
  padding-bottom: 4px;
  border-bottom: 1px dashed #cccccc; }
  .confirm__fillIn__debit--locked .confirm__fillIn__code dt, .confirm__fillIn__credit--locked .confirm__fillIn__code dt {
    width: 100%;
    margin-bottom: 4px; }
  .confirm__fillIn__debit--locked .confirm__fillIn__code dd, .confirm__fillIn__credit--locked .confirm__fillIn__code dd {
    width: 100%;
    border-left: 1px dashed #cccccc; }

.confirm__fillIn__debit--locked .confirm__fillIn__code:last-of-type, .confirm__fillIn__credit--locked .confirm__fillIn__code:last-of-type {
  margin-top: 4px; }

.confirm__fillIn__debitCredit__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #ffffff;
  border-radius: 5px 5px 0 0;
  position: sticky;
  width: 100%;
  top: 0;
  z-index: 7; }
  .confirm__fillIn__debitCredit__header .confirm__fillIn__title {
    margin-bottom: 0;
    margin-right: 8px; }
  .confirm__fillIn__debitCredit__header .confirm__fillIn__code {
    width: 34%;
    margin-left: auto;
    margin-right: 4px; }
    .confirm__fillIn__debitCredit__header .confirm__fillIn__code input {
      padding-right: 60%; }
  .confirm__fillIn__debitCredit__header .confirm__fillIn__code__text {
    width: 62%;
    left: 38%; }
  .confirm__fillIn__debitCredit__header .input__date {
    width: 25%; }
  .confirm__fillIn__debitCredit__header .confirm__fillIn__cautionText {
    position: relative;
    top: 0;
    margin-top: -4px;
    margin-bottom: 6px;
    width: 100%; }

.confirm__fillIn__debitCredit__top,
.confirm__fillIn__debitCredit__sum,
.confirm__fillIn__debitCredit__lineArea,
.confirm__fillIn__debitCredit__bumon,
.confirm__fillIn__debitCredit__hojo,
.confirm__fillIn__debitCredit__zeikubun,
.confirm__fillIn__debitCredit__torihikisaki,
.confirm__fillIn__debitCredit__project {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  position: relative;
  z-index: 2; }
  .confirm__fillIn__debitCredit__top .icon-edit,
  .confirm__fillIn__debitCredit__top .icon-spoit,
  .confirm__fillIn__debitCredit__sum .icon-edit,
  .confirm__fillIn__debitCredit__sum .icon-spoit,
  .confirm__fillIn__debitCredit__lineArea .icon-edit,
  .confirm__fillIn__debitCredit__lineArea .icon-spoit,
  .confirm__fillIn__debitCredit__bumon .icon-edit,
  .confirm__fillIn__debitCredit__bumon .icon-spoit,
  .confirm__fillIn__debitCredit__hojo .icon-edit,
  .confirm__fillIn__debitCredit__hojo .icon-spoit,
  .confirm__fillIn__debitCredit__zeikubun .icon-edit,
  .confirm__fillIn__debitCredit__zeikubun .icon-spoit,
  .confirm__fillIn__debitCredit__torihikisaki .icon-edit,
  .confirm__fillIn__debitCredit__torihikisaki .icon-spoit,
  .confirm__fillIn__debitCredit__project .icon-edit,
  .confirm__fillIn__debitCredit__project .icon-spoit {
    font-size: 10px; }

.confirm__fillIn__debitCredit__top {
  z-index: 5; }

.confirm__fillIn__debitCredit__hojo {
  z-index: 4; }

.confirm__fillIn__debitCredit__bumon {
  z-index: 3; }

.confirm__fillIn__debitCredit__sum {
  margin-top: 12px;
  position: relative; }
  .confirm__fillIn__debitCredit__sum .confirm__fillIn__cautionText {
    margin-bottom: 0;
    top: -3px;
    position: relative;
    align-items: flex-start; }
    .confirm__fillIn__debitCredit__sum .confirm__fillIn__cautionText span[class*="icon-"] {
      padding-top: 3px; }
  .confirm__fillIn__debitCredit__sum dt {
    transform: translateY(-2px); }
  .confirm__fillIn__debitCredit__sum .confirm__fillIn__sum:first-of-type {
    margin-left: 0; }
  .confirm__fillIn__debitCredit__sum .confirm__fillIn__sum {
    border-bottom: none; }
    .confirm__fillIn__debitCredit__sum .confirm__fillIn__sum.confirm__fillIn__sum--subSum {
      border-bottom: 1px solid #e0e0e0; }

.confirm__fillIn__sum {
  border-bottom: 1px solid #e0e0e0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-bottom: 2px;
  padding-right: 8px;
  margin-left: auto; }
  .confirm__fillIn__sum dt {
    font-size: 10px;
    margin-right: 12px;
    margin-left: auto; }
  .confirm__fillIn__sum dd {
    display: flex;
    justify-content: flex-end;
    font-size: 14px;
    font-weight: bold; }

.confirm__fillIn__sum:only-child {
  margin-left: auto; }

.confirm__fillIn__sum--caution {
  border-color: #F0AD3E; }
  .confirm__fillIn__sum--caution dt {
    color: #F0AD3E; }

.confirm__fillIn__sum--subSum {
  align-items: center;
  padding-bottom: 4px; }
  .confirm__fillIn__sum--subSum dt {
    line-height: 10px;
    transform: none; }
  .confirm__fillIn__sum--subSum dd {
    font-size: 10px;
    line-height: 10px; }

.confirm__fillIn__sum + .confirm__fillIn__sum--subSum {
  margin-left: 0; }

.confirm__fillIn__debitCredit__top > div {
  display: flex;
  justify-content: space-between; }

.confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left {
  width: 34%;
  padding-right: 0;
  align-items: center;
  height: 39px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left input {
    width: 100%;
    height: 100%;
    padding-right: 16px;
    padding-top: 0;
    padding-bottom: 17px;
    background-color: #ffffff; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left :placeholder-shown {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left ::-webkit-input-placeholder {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left :-moz-placeholder {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left ::-moz-placeholder {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left :-ms-input-placeholder {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0;
    letter-spacing: -0.1em; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left ::-ms-input-placeholder {
    padding-top: 3px;
    padding-bottom: 0;
    padding-right: 0;
    transform: translateY(10px);
    letter-spacing: -0.1em; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .confirm__fillIn__code__text {
    width: calc(100% - 12px);
    left: 6px;
    top: auto;
    bottom: 6px;
    padding: 0;
    height: 12px;
    line-height: 12px;
    font-size: 12px; }
    .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .confirm__fillIn__code__text::before {
      content: none; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .icon-edit,
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .icon-spoit {
    top: 4px;
    right: 4px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .confirm__fillIn__code__tooltip,
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__left .confirm__fillIn__tooltip {
    right: auto;
    left: 170%;
    top: -4px; }

.confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center {
  width: 29%; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center .select select {
    padding-left: 2px;
    padding-right: 8px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center .select::before, .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center .select::after {
    right: 3px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center input, .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center label {
    height: 17px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__center input {
    margin-top: 4px;
    padding-right: 4px;
    text-align: right;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 12px; }

.confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right {
  width: 34%;
  height: 39px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right input {
    height: 100%;
    text-align: right;
    padding-right: 8px;
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right :placeholder-shown {
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right ::-webkit-input-placeholder {
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right :-moz-placeholder {
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right ::-moz-placeholder {
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right :-ms-input-placeholder {
    font-size: 14px; }
  .confirm__fillIn__debitCredit__top .confirm__fillIn__debitCredit__right :-ms-input-placeholder {
    font-size: 14px; }

.confirm__fillIn__debitCredit__top .confirm__fillIn--disable,
.confirm__fillIn__debitCredit__top input.confirm__fillIn--disable {
  background-color: #f5f5f5; }

.confirm__fillIn__debitCredit__bumon,
.confirm__fillIn__debitCredit__hojo,
.confirm__fillIn__debitCredit__zeikubun,
.confirm__fillIn__debitCredit__torihikisaki,
.confirm__fillIn__debitCredit__project {
  margin-top: 4px;
  transition: 0.3s ease,0.21s ease opacity; }
  .confirm__fillIn__debitCredit__bumon .icon-edit,
  .confirm__fillIn__debitCredit__bumon .icon-spoit,
  .confirm__fillIn__debitCredit__hojo .icon-edit,
  .confirm__fillIn__debitCredit__hojo .icon-spoit,
  .confirm__fillIn__debitCredit__zeikubun .icon-edit,
  .confirm__fillIn__debitCredit__zeikubun .icon-spoit,
  .confirm__fillIn__debitCredit__torihikisaki .icon-edit,
  .confirm__fillIn__debitCredit__torihikisaki .icon-spoit,
  .confirm__fillIn__debitCredit__project .icon-edit,
  .confirm__fillIn__debitCredit__project .icon-spoit {
    top: 8px; }

.confirm__fillIn__debitCredit__lineArea {
  width: 100%;
  height: calc(100% - 70px);
  overflow-y: auto;
  overflow-x: hidden;
  align-items: flex-start;
  align-content: flex-start;
  padding-bottom: 8px; }

.confirm__fillIn__debitCredit__bumon,
.confirm__fillIn__debitCredit__hojo,
.confirm__fillIn__debitCredit__zeikubun,
.confirm__fillIn__debitCredit__torihikisaki {
  max-height: 72px; }

.confirm__fillIn__debitCredit__note {
  max-height: 120px; }

.confirm__fillIn__debitCredit__lineArea--close .confirm__fillIn__debitCredit__bumon,
.confirm__fillIn__debitCredit__lineArea--close .confirm__fillIn__debitCredit__hojo,
.confirm__fillIn__debitCredit__lineArea--close .confirm__fillIn__debitCredit__project,
.confirm__fillIn__debitCredit__lineArea--close .confirm__fillIn__debitCredit__zeikubun,
.confirm__fillIn__debitCredit__lineArea--close .confirm__fillIn__debitCredit__note {
  max-height: 0;
  opacity: 0;
  margin: 0;
  overflow: hidden; }

.confirm__fillIn__debitCredit__line {
  width: 100%;
  padding: 8px 20px 8px;
  position: relative;
  border-bottom: 1px solid #e0e0e0; }
  .confirm__fillIn__debitCredit__line::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #eeeeee;
    opacity: 0;
    transition: 0.09s ease opacity;
    z-index: 1; }
  .confirm__fillIn__debitCredit__line:hover::before {
    opacity: 1; }
  .confirm__fillIn__debitCredit__line:hover .confirm__fillIn__detail__menu {
    display: flex;
    opacity: 1; }

.confirm__fillIn__debitCredit__line:only-child:hover::before {
  content: none; }

.confirm__fillIn__debitCredit__hojo {
  z-index: 11; }

.confirm__fillIn__debitCredit__bumon {
  z-index: 10; }

.confirm__fillIn__debitCredit__project {
  z-index: 9; }

.confirm__fillIn__debitCredit__zeikubun {
  z-index: 8; }

.confirm__fillIn__debitCredit__torihikisaki {
  z-index: 7; }

.confirm__fillIn__debitCredit__note {
  position: relative;
  width: 100%;
  margin-top: 4px;
  z-index: 6; }
  .confirm__fillIn__debitCredit__note dl {
    flex-wrap: wrap; }
  .confirm__fillIn__debitCredit__note dt {
    color: #888888;
    font-size: 10px;
    margin-bottom: 4px;
    width: 100%; }
  .confirm__fillIn__debitCredit__note input {
    width: 100%; }
  .confirm__fillIn__debitCredit__note textarea {
    width: 100%;
    height: 26px;
    box-sizing: border-box;
    overflow-y: scroll;
    resize: vertical; }
  .confirm__fillIn__debitCredit__note ::placeholder,
  .confirm__fillIn__debitCredit__note :placeholder-shown {
    padding-top: 0.16em; }
  .confirm__fillIn__debitCredit__note :-ms-input-placeholder {
    letter-spacing: -0.045em; }
  .confirm__fillIn__debitCredit__note ::-ms-input-placeholder {
    letter-spacing: -0.045em; }
  .confirm__fillIn__debitCredit__note dd {
    width: 100%; }

.confirm__fillIn__debitCredit__note-locked {
  margin-top: 2px;
  border-bottom: 1px dashed #cccccc; }
  .confirm__fillIn__debitCredit__note-locked dd {
    font-size: 14px;
    border-left: 1px dashed #cccccc;
    padding-left: 12px;
    height: 100%;
    min-height: 21px; }

.confirm__fillIn__separateLine {
  border: none;
  border-bottom: 1px solid #e0e0e0;
  margin: 24px 0 20px; }

.confirm__fillIn__creditItem__menu {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  margin-bottom: -8px; }
  .confirm__fillIn__creditItem__menu .confirm__fillIn__up {
    height: 26px; }
    .confirm__fillIn__creditItem__menu .confirm__fillIn__up::before {
      content: "";
      border: 6px solid transparent;
      border-bottom: 8px solid #373737;
      transform-origin: top;
      transform: translateY(-3px);
      cursor: pointer;
      transition: 0.1s ease; }
      .confirm__fillIn__creditItem__menu .confirm__fillIn__up::before:active {
        transform: scale(0.8); }
  .confirm__fillIn__creditItem__menu .confirm__fillIn__down {
    border: 6px solid transparent;
    border-top: 8px solid #373737;
    transform-origin: bottom;
    transform: translateY(3px);
    margin-left: 12px;
    cursor: pointer;
    transition: 0.1s ease; }
    .confirm__fillIn__creditItem__menu .confirm__fillIn__down:active {
      transform: scale(0.8); }

.confirm__fillIn__detail__menu {
  position: absolute;
  z-index: 6;
  right: 0;
  bottom: -24px;
  width: auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background-color: #eeeeee;
  padding-left: 12px;
  padding-right: 8px;
  border-radius: 0 0 5px 5px;
  display: none;
  opacity: 0;
  transition: 0.09s ease opacity; }
  .confirm__fillIn__detail__menu .confirm__fillIn__up {
    height: 26px;
    width: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    cursor: pointer;
    margin: 0; }
    .confirm__fillIn__detail__menu .confirm__fillIn__up::before {
      content: "";
      margin: 0;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-bottom: 8px solid #373737;
      margin-bottom: -4px;
      transform: translateY(-3px) scale(1);
      transition: 0.1s ease; }
  .confirm__fillIn__detail__menu .confirm__fillIn__up:active::before {
    transform: translateY(-3px) scale(0.8); }
  .confirm__fillIn__detail__menu .confirm__fillIn__down {
    height: 26px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    cursor: pointer;
    margin: 0; }
    .confirm__fillIn__detail__menu .confirm__fillIn__down::before {
      content: "";
      margin: 0;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-top: 8px solid #373737;
      margin-bottom: -4px;
      transform: translateY(-3px) scale(1);
      transition: 0.1s ease; }
  .confirm__fillIn__detail__menu .confirm__fillIn__down:active::before {
    transform: translateY(-3px) scale(0.8); }
  .confirm__fillIn__detail__menu .confirm__fillIn__copy {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    height: 26px;
    width: 26px; }
    .confirm__fillIn__detail__menu .confirm__fillIn__copy::before {
      font-size: 12px;
      transform: translateY(-3px) scale(1);
      transition: 0.1s ease; }
  .confirm__fillIn__detail__menu .confirm__fillIn__copy:active::before {
    transform: translateY(-3px) scale(0.8); }
  .confirm__fillIn__detail__menu .confirm__fillIn__delete {
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    height: 26px;
    width: 26px;
    cursor: pointer;
    margin: 0;
    margin-left: 6px;
    font-size: 12px; }
    .confirm__fillIn__detail__menu .confirm__fillIn__delete::before {
      transform: translateY(-3px) scale(1);
      transition: 0.1s ease; }
  .confirm__fillIn__detail__menu .confirm__fillIn__delete:active::before {
    transform: translateY(-3px) scale(0.8); }

.confirm__fillIn__detail {
  position: relative;
  border-top: 1px solid #e0e0e0; }
  .confirm__fillIn__detail dt {
    color: #888888;
    font-size: 10px;
    margin-bottom: 2px; }
  .confirm__fillIn__detail input {
    width: 100%; }
  .confirm__fillIn__detail .confirm__addLineButton {
    margin-top: 8px; }
  .confirm__fillIn__detail .icon-edit:hover::after,
  .confirm__fillIn__detail .icon-spoit:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__detail .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__detail .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail .icon-spoit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__detail .confirm__fillIn__tooltip,
  .confirm__fillIn__detail .confirm__fillIn__code__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 5; }

.confirm__fillIn__detail__subTitle {
  z-index: 1; }

.confirm__fillIn__detail__lineArea {
  width: 100%;
  height: calc(100% - 12px);
  padding-bottom: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  overflow: visible; }

.confirm__fillIn__detail__lineArea--noPadding {
  padding-bottom: 0; }

.confirm__fillIn__detail__extraLine {
  max-height: 120px; }
  .confirm__fillIn__detail__extraLine .popup__text {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%; }
    .confirm__fillIn__detail__extraLine .popup__text input {
      width: 100%;
      padding-right: 166px;
      box-sizing: border-box;
      background-color: #ffffff; }
  .confirm__fillIn__detail__extraLine .icon-edit,
  .confirm__fillIn__detail__extraLine .icon-spoit,
  .confirm__fillIn__detail__extraLine .icon-copy {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer;
    z-index: 12; }
    .confirm__fillIn__detail__extraLine .icon-edit::after,
    .confirm__fillIn__detail__extraLine .icon-spoit::after,
    .confirm__fillIn__detail__extraLine .icon-copy::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__detail__extraLine .icon-edit ~ .icon-copy,
  .confirm__fillIn__detail__extraLine .icon-spoit ~ .icon-copy {
    right: 30px; }
  .confirm__fillIn__detail__extraLine .icon-edit:hover::after,
  .confirm__fillIn__detail__extraLine .icon-spoit:hover::after,
  .confirm__fillIn__detail__extraLine .icon-copy:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__detail__extraLine .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail__extraLine .icon-edit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__detail__extraLine .icon-spoit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail__extraLine .icon-spoit:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__detail__extraLine .icon-copy:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail__extraLine .icon-copy:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__detail__extraLine .confirm__fillIn__code__text {
    width: calc(100% - 104px);
    position: absolute;
    top: 0;
    left: 104px;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    pointer-events: none;
    z-index: 1; }
  .confirm__fillIn__detail__extraLine .confirm__fillIn__code__text::before {
    content: ":";
    top: 0;
    margin-right: 4px; }
  .confirm__fillIn__detail__extraLine .confirm__fillIn__code__tooltip,
  .confirm__fillIn__detail__extraLine .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 5; }

.confirm__fillIn__detail__addItem {
  width: 100%; }

.confirm__fillIn__detail__lineArea--close .confirm__fillIn__detail__extraLine {
  max-height: 0;
  opacity: 0;
  margin: 0;
  overflow: hidden; }

.confirm__fillIn__detail__lineArea--close .confirm__fillIn__deliveryLine ~ .confirm__fillIn__deliveryLine {
  max-height: 0;
  opacity: 0;
  margin: 0;
  overflow: hidden; }

.confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine {
  z-index: 10; }

.confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine {
  z-index: 9; }

.confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine {
  z-index: 8; }

.confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine + .confirm__fillIn__addItemLine {
  z-index: 7; }

.confirm__fillIn__detail__addItem.popup__text input[type="text"] {
  padding-right: calc(100% - 154px); }

.confirm__fillIn__detail__addItem.popup__text .confirm__fillIn__code__text {
  width: calc(100% - 154px);
  left: 154px;
  padding-right: 44px; }

.confirm__fillIn__detail__addItem--withIcon {
  position: relative; }
  .confirm__fillIn__detail__addItem--withIcon input[type="text"] {
    padding-right: 44px; }

.confirm__fillIn__detail__header,
.confirm__fillIn__bank__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px 0;
  border-radius: 5px 5px 0 0;
  background-color: #ffffff;
  z-index: 20;
  position: sticky;
  top: -1px; }
  .confirm__fillIn__detail__header .confirm__fillIn__title,
  .confirm__fillIn__bank__header .confirm__fillIn__title {
    margin-bottom: 0;
    margin-right: 8px; }
  .confirm__fillIn__detail__header .confirm__fillIn__cautionText,
  .confirm__fillIn__bank__header .confirm__fillIn__cautionText {
    position: relative;
    top: 0;
    margin-top: -4px;
    margin-bottom: 4px;
    width: 100%; }

.confirm__fillIn__bank__header {
  z-index: 21; }

.confirm__fillIn__detail__header__totsugouOption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 8px; }

.confirm__fillIn__detail__header__totsugouSort--single {
  width: 136px; }

.confirm__fillIn__detail__header__totsugouSort--single:only-child {
  margin-left: auto; }

.confirm__detail__Areatitle {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 8px;
  margin-bottom: 4px; }

.confirm__detail__Areatitle_title {
  width: 100%;
  margin-bottom: 0; }

.confirm__detail__define {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: -20px; }

.confirm__detail__defineButtonWrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-bottom: 1px solid #cccccc;
  padding-bottom: 8px;
  padding-right: 4px;
  width: calc(75% - 1px); }

.confirm__detail__defineButtonWrap ~ .confirm__detail__defineButtonWrap {
  width: calc(25% - 2px);
  padding-right: 0; }

.confirm__detail__defineButton {
  display: flex;
  cursor: pointer;
  order: -1;
  position: relative; }
  .confirm__detail__defineButton::after {
    content: "";
    width: 20px;
    height: 20px;
    background-color: #000000;
    position: absolute;
    border-radius: 4px;
    right: -2px;
    top: 50%;
    opacity: 0;
    transition: 0.1s ease;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%); }
  .confirm__detail__defineButton:hover::after {
    opacity: 0.1; }

.confirm__detail__defineButton__text {
  font-size: 10px;
  text-decoration: underline;
  color: #888888; }

.confirm__detail__defineButton::before {
  display: flex;
  font-size: 14px;
  padding-left: 8px;
  order: 1; }

.confirm__fillIn__bank__header {
  width: 100%; }
  .confirm__fillIn__bank__header .confirm__fillIn__title {
    height: 26px; }
  .confirm__fillIn__bank__header .confirm__fillIn__half {
    display: flex;
    justify-content: flex-start;
    width: calc(50% - 12px);
    margin-left: auto; }
    .confirm__fillIn__bank__header .confirm__fillIn__half dt {
      width: 80px;
      font-size: 10px;
      color: #888888;
      padding-top: 6px; }
    .confirm__fillIn__bank__header .confirm__fillIn__half dd {
      width: calc(100% - 80px); }
      .confirm__fillIn__bank__header .confirm__fillIn__half dd input {
        width: 100%;
        height: 26px;
        font-size: 14px; }
  .confirm__fillIn__bank__header .confirm__fillIn__inputArea--locked dt {
    padding-top: 3px; }
  .confirm__fillIn__bank__header .confirm__fillIn__half:nth-of-type(even) {
    margin-left: 0; }
  .confirm__fillIn__bank__header .confirm__fillIn__half:nth-of-type(n + 1) {
    margin-top: 4px; }
  .confirm__fillIn__bank__header .confirm__fillIn__half:only-of-type {
    margin-top: 0;
    padding-bottom: 4px; }
  .confirm__fillIn__bank__header .input__date {
    position: static; }

.confirm__fillIn__detail__listLine,
.confirm__fillIn__bank__listLine {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  position: relative;
  padding: 8px 20px;
  border-bottom: 1px solid #e0e0e0; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check,
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name,
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__price,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__price {
    z-index: 1; }
  .confirm__fillIn__detail__listLine::before,
  .confirm__fillIn__bank__listLine::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #eeeeee;
    opacity: 0;
    transition: 0.09s ease opacity; }
  .confirm__fillIn__detail__listLine:hover::before,
  .confirm__fillIn__bank__listLine:hover::before {
    opacity: 1; }
  .confirm__fillIn__detail__listLine:hover .confirm__fillIn__detail__menu,
  .confirm__fillIn__bank__listLine:hover .confirm__fillIn__detail__menu {
    display: flex;
    opacity: 1; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check {
    width: 28px;
    height: 26px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 2px;
    padding-left: 4px;
    margin-bottom: auto;
    position: relative; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check::before,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check::before {
      position: absolute;
      bottom: -8px;
      left: 1px;
      content: "仕訳";
      font-size: 10px;
      color: #cccccc; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check input,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check input {
      display: none; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check .checkbox__check,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check .checkbox__check {
      width: 14px;
      height: 14px;
      margin-right: 0; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__check .checkbox__check::before,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__check .checkbox__check::before {
      width: 7px;
      height: 3px;
      top: 2px;
      left: 2px; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name {
    width: calc(100% - 28px - 88px);
    display: flex; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name ::placeholder,
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name :placeholder-shown,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name ::placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name :placeholder-shown {
      padding-top: 0.16em; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name :-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name :-ms-input-placeholder {
      letter-spacing: -0.045em; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__name ::-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__name ::-ms-input-placeholder {
      letter-spacing: -0.045em; }
  .confirm__fillIn__detail__listLine textarea, .confirm__fillIn__detail__listLine input[type="text"],
  .confirm__fillIn__bank__listLine textarea,
  .confirm__fillIn__bank__listLine input[type="text"] {
    width: 100%;
    height: 26px;
    font-size: 12px; }
  .confirm__fillIn__detail__listLine ::placeholder,
  .confirm__fillIn__detail__listLine :placeholder-shown,
  .confirm__fillIn__bank__listLine ::placeholder,
  .confirm__fillIn__bank__listLine :placeholder-shown {
    font-size: 12px; }
  .confirm__fillIn__detail__listLine :-ms-input-placeholder,
  .confirm__fillIn__bank__listLine :-ms-input-placeholder {
    font-size: 12px; }
  .confirm__fillIn__detail__listLine ::-ms-input-placeholder,
  .confirm__fillIn__bank__listLine ::-ms-input-placeholder {
    font-size: 12px; }
  .confirm__fillIn__detail__listLine textarea,
  .confirm__fillIn__bank__listLine textarea {
    resize: vertical;
    max-height: 62px; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__date,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__date {
    width: 136px;
    position: relative; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__date input,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__date input {
      padding-right: 24px; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__date .confirm__fillIn__tooltip,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__date .confirm__fillIn__tooltip {
      right: auto;
      left: 0; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__date ~ .confirm__fillIn__detail__note,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__date ~ .confirm__fillIn__detail__note {
    padding-left: 4px;
    width: calc(100% - 88px - 88px - 136px); }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__note,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__note {
    width: calc(100% - 88px - 88px); }
    .confirm__fillIn__detail__listLine .confirm__fillIn__detail__note input,
    .confirm__fillIn__bank__listLine .confirm__fillIn__detail__note input {
      padding-right: 24px; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__quantity,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__quantity {
    width: 88px;
    padding-left: 4px; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__detail__price,
  .confirm__fillIn__bank__listLine .confirm__fillIn__detail__price {
    width: 88px;
    padding-left: 4px;
    margin-bottom: auto; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankName,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankName,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber {
    width: calc(100% / 4 * 3);
    display: flex;
    margin-bottom: 4px; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankName ::placeholder,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankName :placeholder-shown,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber ::placeholder,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber :placeholder-shown,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankName ::placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankName :placeholder-shown,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber ::placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber :placeholder-shown {
      padding-top: 0.16em; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankName :-ms-input-placeholder,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber :-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankName :-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber :-ms-input-placeholder {
      letter-spacing: -0.045em; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankName ::-ms-input-placeholder,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber ::-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankName ::-ms-input-placeholder,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber ::-ms-input-placeholder {
      letter-spacing: -0.045em; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchName,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountHolderKanji,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountHolderKana,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankCode,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchCode,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountType,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchName,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountHolderKanji,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountHolderKana,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankCode,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchCode,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountType {
    width: calc(100% / 4 * 1);
    display: flex;
    margin-bottom: 4px; }
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchName .select,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountHolderKanji .select,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountHolderKana .select,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankCode .select,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchCode .select,
    .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountType .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchName .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountHolderKanji .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountHolderKana .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankCode .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchCode .select,
    .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountType .select {
      width: 100%; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchName,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountHolderKana,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__bankCode,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__branchCode,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountType,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchName,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountHolderKana,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__bankCode,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__branchCode,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountType {
    padding-left: 4px; }
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountNumber,
  .confirm__fillIn__detail__listLine .confirm__fillIn__bank__accountType,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountNumber,
  .confirm__fillIn__bank__listLine .confirm__fillIn__bank__accountType {
    margin-bottom: 0; }

.confirm__fillIn__detail__listLine--hiddencheck .confirm__fillIn__detail__check {
  display: none; }

.confirm__fillIn__detail__listLine--hiddencheck .confirm__fillIn__detail__name {
  width: calc(100% - 88px); }

.confirm__fillIn__detail__listLine--hiddencheck .confirm__fillIn__detail__extraLine {
  padding-left: 0; }

.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__name {
  width: calc(100% - 88px - 88px - 88px); }

.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__quantity,
.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__price,
.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__unitPrice {
  width: 88px;
  z-index: 1;
  padding-left: 4px; }

.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__date ~ .confirm__fillIn__detail__note {
  width: calc(100% - 136px);
  z-index: 13; }

.confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__note {
  width: 100%; }

.confirm__fillIn__bank__full {
  width: 100%; }
  .confirm__fillIn__bank__full.confirm__fillIn__bank__bankName, .confirm__fillIn__bank__full.confirm__fillIn__bank__branchName {
    width: 100%;
    padding-left: 0; }
  .confirm__fillIn__bank__full.confirm__fillIn__bank__bankName {
    z-index: 5; }
  .confirm__fillIn__bank__full.confirm__fillIn__bank__branchName {
    z-index: 4; }
  .confirm__fillIn__bank__full .confirm__fillIn__half,
  .confirm__fillIn__bank__full .confirm__fillIn__full {
    z-index: 0; }
  .confirm__fillIn__bank__full input[type="date"] {
    font-size: 12px; }

*[class*="confirm__fillIn__bank"] .popup__text {
  position: relative;
  display: flex;
  align-items: center; }
  *[class*="confirm__fillIn__bank"] .popup__text input {
    width: 100%;
    padding-right: calc(100% - 154px);
    box-sizing: border-box;
    background-color: #ffffff; }
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code__text {
    width: calc(100% - 154px);
    left: 154px; }
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code {
    height: auto; }
    *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code input {
      width: 100%;
      padding-right: calc(100% - 88px);
      box-sizing: border-box; }
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code__tooltip,
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
  *[class*="confirm__fillIn__bank"] .popup__text .icon-edit,
  *[class*="confirm__fillIn__bank"] .popup__text .icon-spoit {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer; }
    *[class*="confirm__fillIn__bank"] .popup__text .icon-edit::after,
    *[class*="confirm__fillIn__bank"] .popup__text .icon-spoit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  *[class*="confirm__fillIn__bank"] .popup__text .icon-edit:hover::after,
  *[class*="confirm__fillIn__bank"] .popup__text .icon-spoit:hover::after {
    opacity: 0.1; }
  *[class*="confirm__fillIn__bank"] .popup__text .icon-edit:hover .confirm__fillIn__code__tooltip,
  *[class*="confirm__fillIn__bank"] .popup__text .icon-edit:hover .confirm__fillIn__tooltip,
  *[class*="confirm__fillIn__bank"] .popup__text .icon-spoit:hover .confirm__fillIn__code__tooltip,
  *[class*="confirm__fillIn__bank"] .popup__text .icon-spoit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code__text {
    width: calc(100% - 154px);
    position: absolute;
    top: 0;
    left: 154px;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    pointer-events: none; }
  *[class*="confirm__fillIn__bank"] .popup__text .confirm__fillIn__code__text::before {
    content: ":";
    top: 0;
    margin-right: 4px; }

*[class*="confirm__fillIn__bank"] dd {
  position: relative; }

*[class*="confirm__fillIn__bank"] .confirm__fillIn__date {
  position: static; }

*[class*="confirm__fillIn__bank"] .confirm__fillIn__full {
  width: 100%; }

.confirm__fillIn__detail__listLine--totsugou {
  position: relative;
  transition: 0.3s ease; }
  .confirm__fillIn__detail__listLine--totsugou::before {
    content: none; }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__check::before {
    content: none; }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__note {
    z-index: 0; }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name {
    width: calc(100% - 64px - 88px); }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__extraLine {
    padding-left: 64px; }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name {
    position: relative; }
    .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name .icon-edit,
    .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name .icon-spoit,
    .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name .icon-pin {
      right: 13px; }
  .confirm__fillIn__detail__listLine--totsugou .icon-edit,
  .confirm__fillIn__detail__listLine--totsugou .icon-spoit,
  .confirm__fillIn__detail__listLine--totsugou .icon-pin {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer;
    z-index: 12; }
    .confirm__fillIn__detail__listLine--totsugou .icon-edit::after,
    .confirm__fillIn__detail__listLine--totsugou .icon-spoit::after,
    .confirm__fillIn__detail__listLine--totsugou .icon-pin::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__note:only-child {
    width: 100%; }
  .confirm__fillIn__detail__listLine--totsugou.confirm__fillIn__detail__listLine--commonBill > .confirm__fillIn__detail__name {
    width: calc(100% - 64px - 88px - 88px - 88px);
    z-index: 2; }
  .confirm__fillIn__detail__listLine--totsugou.confirm__fillIn__detail__listLine--commonBill > .confirm__fillIn__detail__note {
    z-index: 1;
    width: calc(100% - 88px - 88px); }
  .confirm__fillIn__detail__listLine--totsugou.confirm__fillIn__detail__listLine--commonBill > .confirm__fillIn__detail__note:only-child {
    width: 100%; }

.confirm__fillIn__detail__listLine--totsugou--fail {
  background-color: #FFFAE9; }
  .confirm__fillIn__detail__listLine--totsugou--fail > .confirm__fillIn__detail__totsugouTitleArea .confirm__fillIn__detail__totsugouTitle {
    color: #F0AD3E; }

.confirm__fillIn__detail__listLine--totsugou--fadeout {
  opacity: 0;
  overflow: hidden;
  max-height: 74px;
  animation: totsugouFadeout 0.6s linear 0s 1 normal;
  animation-fill-mode: forwards; }

@keyframes totsugouFadeout {
  0% { }
  20% {
    opacity: 1;
    max-height: 74px; }
  100% {
    opacity: 0;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border: none; } }

.confirm__fillIn__detail__listLine--totsugou--close {
  height: 0; }

.confirm__fillIn__detail__totsugouTitleArea {
  width: 64px;
  position: relative; }
  .confirm__fillIn__detail__totsugouTitleArea .confirm__fillIn__detail__totsugouTitle {
    color: #888888;
    font-size: 12px;
    margin-top: -10px; }
  .confirm__fillIn__detail__totsugouTitleArea .confirm__fillIn__detail__check--totsugou {
    width: 100%;
    height: 14px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 12px;
    left: 0px; }
    .confirm__fillIn__detail__totsugouTitleArea .confirm__fillIn__detail__check--totsugou .checkbox__check {
      margin-right: 4px; }

.confirm__fillIn__detail__totsugouToggle {
  font-size: 11px;
  transform: rotate(-90deg);
  transition: 0.15s ease;
  cursor: pointer;
  position: absolute;
  top: 30px;
  right: 15px;
  width: 16px;
  height: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1; }
  .confirm__fillIn__detail__totsugouToggle--open {
    transform: rotate(-180deg); }

.confirm__fillIn__detail__totsugouTitle + .confirm__fillIn__detail__totsugouToggle {
  top: 16px; }

.confirm__fillIn__detail__listLine__orderMeisaiArea {
  display: flex;
  position: relative;
  flex-wrap: wrap;
  width: 100%;
  z-index: -1;
  height: 0;
  overflow: hidden; }
  .confirm__fillIn__detail__listLine__orderMeisaiArea::before {
    content: "";
    position: absolute;
    left: -20px;
    bottom: -8px;
    background-color: #f7f7f7;
    width: calc(100% + 20px + 20px);
    height: calc(100% + 8px);
    z-index: 0;
    opacity: 0; }
  .confirm__fillIn__detail__listLine__orderMeisaiArea.confirm__fillIn__detail__listLine__orderMeisaiArea--open {
    margin-top: 8px;
    padding-top: 8px;
    height: auto;
    overflow: visible;
    z-index: 0; }
    .confirm__fillIn__detail__listLine__orderMeisaiArea.confirm__fillIn__detail__listLine__orderMeisaiArea--open::before {
      opacity: 1; }
  .confirm__fillIn__detail__listLine__orderMeisaiArea .confirm__addLineButton {
    z-index: 1;
    margin-left: 64px;
    margin-right: 0; }

.confirm__fillIn__detail__listLine__orderMeisai {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding-bottom: 8px;
  z-index: 1;
  position: relative; }
  .confirm__fillIn__detail__listLine__orderMeisai::before {
    content: "";
    position: absolute;
    left: -20px;
    top: -8px;
    width: calc(100% + 20px + 20px);
    height: 100%;
    border-top: 1px dashed #e0e0e0; }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--fail::after {
    content: "";
    background-color: #FFFAE9;
    width: calc(100% + 20px + 20px);
    height: calc(100% + 8px);
    position: absolute;
    top: -8px;
    left: -20px;
    z-index: -1; }
  .confirm__fillIn__detail__listLine__orderMeisai ~ .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--fail::after {
    height: 100%;
    top: 0px; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__totsugouTitle {
    margin-top: 4px;
    font-size: 10px; }
  .confirm__fillIn__detail__listLine__orderMeisai input[type="text"] {
    width: 100%;
    font-size: 12px; }
  .confirm__fillIn__detail__listLine__orderMeisai textarea {
    width: 100%;
    height: 26px;
    font-size: 12px;
    resize: vertical;
    max-height: 62px;
    overflow: auto; }
  .confirm__fillIn__detail__listLine__orderMeisai textarea::placeholder, .confirm__fillIn__detail__listLine__orderMeisai textarea:placeholder-shown {
    padding-top: 0.16em; }
  .confirm__fillIn__detail__listLine__orderMeisai ::placeholder,
  .confirm__fillIn__detail__listLine__orderMeisai :placeholder-shown {
    font-size: 12px; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__name {
    width: calc(100% - 64px - 88px);
    display: flex; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__extraLine {
    padding-left: 64px; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__note {
    width: calc(100% - 88px - 88px); }
    .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__note input {
      padding-right: 24px; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__quantity {
    width: 88px;
    padding-left: 4px; }
  .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__price {
    width: 88px;
    padding-left: 4px;
    margin-bottom: auto; }
    .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__price.confirm__fillIn__detail__price--locked {
      margin-bottom: auto; }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__name {
    width: calc(100% - 64px - 88px - 88px - 88px); }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__quantity,
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__price,
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__unitPrice {
    width: 88px;
    z-index: 1;
    padding-left: 4px; }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__date {
    width: 136px; }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__date ~ .confirm__fillIn__detail__note {
    width: calc(100% - 136px);
    z-index: 13;
    padding-left: 4px; }
  .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__note {
    width: 100%; }

.confirm__fillIn__detail__listLine__orderMeisai ~ .confirm__fillIn__detail__listLine__orderMeisai {
  padding-top: 8px; }
  .confirm__fillIn__detail__listLine__orderMeisai ~ .confirm__fillIn__detail__listLine__orderMeisai::before {
    top: 0; }

.confirm__fillIn__detail__listLine__orderMeisai:last-child.confirm__fillIn__detail__listLine__orderMeisai--fail::after {
  height: 100%; }

.confirm__fillIn__detail__listLine__orderMeisai:last-child.confirm__fillIn__detail__listLine__orderMeisai--fail:only-child::after {
  height: calc(100% + 8px); }

.confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__listLine__orderMeisai:last-child {
  padding-bottom: 0; }
  .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__listLine__orderMeisai:last-child.confirm__fillIn__detail__listLine__orderMeisai--fail::after {
    height: calc(100% + 8px); }

.confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__listLine__orderMeisai--fail:only-child.confirm__fillIn__detail__listLine__orderMeisai--fail::after {
  height: calc(100% + 16px); }

.confirm__fillIn__detail__listLineHeader {
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: -8px;
  border: none; }
  .confirm__fillIn__detail__listLineHeader::before {
    content: none; }
  .confirm__fillIn__detail__listLineHeader span {
    font-size: 10px;
    color: #888888; }
  .confirm__fillIn__detail__listLineHeader .confirm__fillIn__detail__check {
    margin-left: -4px;
    height: auto;
    margin-bottom: 0; }
  .confirm__fillIn__detail__listLineHeader .confirm__fillIn__detail__price {
    margin-bottom: 0; }

.confirm__fillIn__detail__listLine:first-of-type {
  margin-top: 8px; }

.confirm__fillIn__detail__listLine--locked {
  align-items: stretch; }
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__line {
    border-bottom: 1px dashed #cccccc;
    padding-bottom: 4px; }
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__name {
    width: calc(75% - 12px); }
  .confirm__fillIn__detail__listLine--locked dd {
    min-height: 21px; }
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__name.confirm__fillIn__detail--locked .confirm__detail__title,
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__price.confirm__fillIn__detail--locked .confirm__detail__title {
    height: 100%; }
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__name.confirm__fillIn__detail--locked dd,
  .confirm__fillIn__detail__listLine--locked .confirm__fillIn__detail__price.confirm__fillIn__detail--locked dd {
    height: calc(100% - 15px - 2px);
    display: flex;
    justify-content: flex-start;
    align-items: center; }

.confirm__fillIn__detail__listLine--locked + .confirm__fillIn__detail__listLine--locked {
  border: none;
  padding-top: 0; }

.confirm__fillIn__detail__line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%; }

.confirm__detail__code {
  width: calc(24% - 1px); }

.confirm__detail__amount {
  width: calc(16% - 1px); }

.confirm__detail__unitPrice {
  width: calc(30% - 1px); }

.confirm__detail__amountPrice {
  width: calc(30% - 1px); }

.confirm__fillIn__detail--locked {
  margin-bottom: 0; }
  .confirm__fillIn__detail--locked dl {
    margin-bottom: 0; }
  .confirm__fillIn__detail--locked dd {
    border-left: 1px dashed #cccccc;
    padding-left: 6px;
    font-size: 14px;
    min-height: 21px; }
  .confirm__fillIn__detail--locked .confirm__detail__code,
  .confirm__fillIn__detail--locked .confirm__detail__amountPrice,
  .confirm__fillIn__detail--locked .confirm__detail__amount,
  .confirm__fillIn__detail--locked .confirm__detail__unitPrice {
    border-bottom: 1px dashed #cccccc;
    padding-bottom: 4px;
    margin: 8px 0 4px; }
  .confirm__fillIn__detail--locked .confirm__detail__code {
    width: calc(24% - 8px); }
  .confirm__fillIn__detail--locked .confirm__detail__amount {
    width: calc(16% - 8px); }
  .confirm__fillIn__detail--locked .confirm__detail__unitPrice {
    width: calc(30% - 8px); }
  .confirm__fillIn__detail--locked .confirm__detail__amountPrice {
    width: calc(30% - 8px); }

.confirm__detail__title {
  width: 100%; }

.confirm__fillIn__detail--locked dd {
  min-height: 21px; }

.confirm__detail__note {
  width: 100%; }

.confirm__fillIn__detail--locked:nth-child(2) .confirm__detail__note {
  margin-top: 8px; }

.confirm__fillIn__detail__extraLine {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 28px;
  margin-top: 4px;
  transition: 0.3s ease,0.21s ease opacity; }
  .confirm__fillIn__detail__extraLine input {
    position: relative;
    z-index: 1; }
  .confirm__fillIn__detail__extraLine .confirm__fillIn__detail__unitPrice {
    width: 88px;
    padding-left: 4px; }

.confirm__fillIn__commonSection {
  padding: 12px 20px 8px;
  background-color: #ffffff; }
  .confirm__fillIn__commonSection .icon-edit,
  .confirm__fillIn__commonSection .icon-text {
    position: static;
    margin-right: 8px;
    font-size: 12px; }

.confirm__fillIn__commonSection--withBorderTop {
  border-top: 1px solid #e0e0e0; }

.confirm__fillIn__commonSection__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px; }
  .confirm__fillIn__commonSection__header .confirm__fillIn__title {
    margin-bottom: 0; }
  .confirm__fillIn__commonSection__header .confirm__fillIn__cautionText {
    position: relative;
    top: 0;
    margin-top: -4px;
    margin-bottom: 4px;
    width: 100%; }
  .confirm__fillIn__commonSection__header .icon-edit::after {
    content: none; }

.confirm__fillIn__payment {
  padding-bottom: 8px; }
  .confirm__fillIn__payment button {
    display: flex;
    position: relative;
    align-items: center; }
    .confirm__fillIn__payment button .icon-edit,
    .confirm__fillIn__payment button .icon-text {
      position: static;
      margin-right: 8px;
      font-size: 12px; }

.confirm__fillIn__payment__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px; }
  .confirm__fillIn__payment__header .confirm__fillIn__title {
    margin-bottom: 0; }
  .confirm__fillIn__payment__header .confirm__fillIn__cautionText {
    position: relative;
    top: 0;
    margin-top: -4px;
    margin-bottom: 4px;
    width: 100%; }
  .confirm__fillIn__payment__header .icon-edit::after {
    content: none; }

.confirm__fillIn__payment__smallLine dd {
  position: relative; }

.confirm__fillIn__payment__smallLine .confirm__fillIn__date {
  font-size: 12px;
  position: static; }
  .confirm__fillIn__payment__smallLine .confirm__fillIn__date input {
    height: 22px;
    font-size: 12px; }

.confirm__fillIn__payment__smallLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird .confirm__fillIn__full {
  border-bottom: none; }
  .confirm__fillIn__payment__smallLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird .confirm__fillIn__full dd {
    text-align: left; }

.confirm__fillIn__payment__largeLine {
  border-top: 1px solid #e0e0e0;
  margin-top: 12px;
  padding-top: 8px; }
  .confirm__fillIn__payment__largeLine .confirm__fillIn__full {
    border-bottom: none; }
  .confirm__fillIn__payment__largeLine dd {
    padding-top: 3px;
    height: calc(100% - 18px);
    min-height: 29px; }
  .confirm__fillIn__payment__largeLine .popup__text {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%; }
    .confirm__fillIn__payment__largeLine .popup__text input {
      width: 100%;
      box-sizing: border-box;
      background-color: #ffffff; }
  .confirm__fillIn__payment__largeLine .icon-edit {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer;
    z-index: 12; }
    .confirm__fillIn__payment__largeLine .icon-edit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__payment__largeLine .icon-edit:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__payment__largeLine .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__payment__largeLine .icon-edit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__payment__largeLine .confirm__fillIn__sum {
    width: calc(50% - 12px);
    min-height: 26px;
    margin-left: auto;
    margin-top: 8px; }
    .confirm__fillIn__payment__largeLine .confirm__fillIn__sum dt {
      margin-left: auto;
      width: auto; }
    .confirm__fillIn__payment__largeLine .confirm__fillIn__sum dd {
      width: auto;
      border-left: none; }
  .confirm__fillIn__payment__largeLine .confirm__fillIn__payment__largeLine--locked {
    margin-bottom: 0;
    border-bottom: 1px solid #e0e0e0; }
    .confirm__fillIn__payment__largeLine .confirm__fillIn__payment__largeLine--locked dd {
      border-left: none;
      align-items: center;
      padding-left: 4px;
      padding-top: 4px;
      padding-bottom: 4px;
      display: flex;
      align-items: center;
      font-size: 14px; }
      .confirm__fillIn__payment__largeLine .confirm__fillIn__payment__largeLine--locked dd.confirm__fillIn__fee {
        justify-content: flex-end; }
  .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked {
    align-items: stretch;
    margin-bottom: 0; }
    .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird {
      margin-top: 0;
      display: flex; }
      .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird .confirm__fillIn__full {
        margin-bottom: 0;
        border-bottom: 1px solid #e0e0e0; }
        .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird .confirm__fillIn__full dd {
          border-left: none;
          align-items: center;
          padding-left: 4px;
          padding-top: 4px;
          padding-bottom: 4px;
          display: flex;
          align-items: center; }
          .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__oneThird .confirm__fillIn__full dd.confirm__fillIn__fee {
            justify-content: flex-end; }
    .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__sum dt {
      padding-top: 6px; }
    .confirm__fillIn__payment__largeLine.confirm__fillIn__inputArea--locked .confirm__fillIn__sum dd {
      min-width: 0;
      border-left: none;
      padding-left: 0; }

.confirm__fillIn__deliveryLine {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100%;
  position: relative;
  z-index: 2;
  max-height: 120px;
  transition: 0.3s ease,0.21s ease opacity; }
  .confirm__fillIn__deliveryLine .popup__text {
    position: relative;
    display: flex;
    align-items: center; }
    .confirm__fillIn__deliveryLine .popup__text input {
      display: flex;
      width: 100%;
      padding-right: calc(100% - 116px);
      box-sizing: border-box; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__code__text {
    width: calc(100% - 116px);
    position: absolute;
    top: 0;
    left: 116px;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    pointer-events: none; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__code__text::before {
      content: ":";
      top: 0;
      margin-right: 4px; }
  .confirm__fillIn__deliveryLine .define__confirmSearch input,
  .confirm__fillIn__deliveryLine .spoit__confirmSearch input {
    width: 100%;
    padding-right: 22px; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__code__tooltip,
  .confirm__fillIn__deliveryLine .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
  .confirm__fillIn__deliveryLine .icon-pin, .confirm__fillIn__deliveryLine .icon-edit {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer; }
    .confirm__fillIn__deliveryLine .icon-pin::after, .confirm__fillIn__deliveryLine .icon-edit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__fillIn__deliveryLine .icon-pin:hover::after,
  .confirm__fillIn__deliveryLine .icon-edit:hover::after {
    opacity: 0.1; }
  .confirm__fillIn__deliveryLine .icon-pin:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__deliveryLine .icon-pin:hover .confirm__fillIn__tooltip,
  .confirm__fillIn__deliveryLine .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__fillIn__deliveryLine .icon-edit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird {
    width: calc(100% / 3 - 4px); }
    .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird .confirm__fillIn__half {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
      align-items: center;
      transition: 0.3s ease,0.21s ease opacity; }
      .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird .confirm__fillIn__half dt {
        width: 54px;
        padding-top: 0;
        line-height: 1.1em;
        padding-right: 4px;
        text-align: left;
        letter-spacing: -0.04em; }
      .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird .confirm__fillIn__half dd {
        width: calc(100% - 54px); }
    .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird .confirm__fillIn__inputArea--locked dt {
      padding-top: 0; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__oneThird .confirm__fillIn__inputArea--locked dd {
      border-bottom: none;
      font-size: 12px; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__half {
    display: flex;
    width: calc(50% - 12px);
    flex-wrap: wrap;
    align-items: center; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__half dt {
      width: 80px;
      font-size: 10px;
      color: #888888;
      padding-top: 6px; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__half dd {
      width: calc(100% - 80px); }
    .confirm__fillIn__deliveryLine .confirm__fillIn__half.confirm__fillIn__inputArea--locked {
      width: calc(50% - 12px); }
      .confirm__fillIn__deliveryLine .confirm__fillIn__half.confirm__fillIn__inputArea--locked dt {
        padding-top: 0; }
      .confirm__fillIn__deliveryLine .confirm__fillIn__half.confirm__fillIn__inputArea--locked dd {
        font-size: 12px; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__full.confirm__fillIn__inputArea--locked dt {
    padding-top: 0; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__full.confirm__fillIn__inputArea--locked dd {
    font-size: 12px; }
  .confirm__fillIn__deliveryLine--variableItem {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__slipNumber {
    flex-basis: calc(100% - 116px * 3 - 4px * 3); }
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__slipNumber .confirm__detail__defineButton__tooltip {
      right: auto;
      left: 0; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__slipNumber,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__slipCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__accountingCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__orderNumber {
    flex-grow: 1;
    width: 0; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__slipCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__accountingCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__orderNumber {
    margin-left: 4px;
    flex-basis: 116px; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__issueDate,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__delivaryDate {
    width: 116px;
    padding-left: 0;
    margin-bottom: auto; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__quantity,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__unitPrice,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__price {
    width: 76px;
    padding-left: 0;
    margin-bottom: auto; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__purchaseCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__taxIncludedCategory,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__taxRate {
    flex: 1 1 auto;
    width: 76px;
    display: flex;
    padding-left: 0;
    margin-left: 4px;
    margin-bottom: auto; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierCode {
    width: 47.35%;
    box-sizing: border-box; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierCode .confirm__fillIn__code__tooltip,
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierCode .confirm__fillIn__tooltip {
      top: -7px;
      left: 20px;
      right: auto;
      transform: scaleY(1) scaleX(0);
      transform-origin: left center; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierCode .icon-edit:hover .confirm__fillIn__code__tooltip,
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierCode .icon-edit:hover .confirm__fillIn__tooltip {
      transform: scaleY(1) scaleX(1); }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__summary {
    display: flex;
    width: calc(52.65% - 4px); }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__supplierName,
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__name {
    display: flex;
    width: calc(100% - 76px * 3 - 4px * 3); }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__note {
    width: calc(100% - 136px - 4px); }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__strageCode {
    width: 100%; }
    .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__strageCode .popup__text.confirm__fillIn__code {
      width: 100%; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__note:only-child {
    width: 100%; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__delivery__orderSerialNumber {
    width: 136px; }
  .confirm__fillIn__deliveryLine .confirm__fillIn__full {
    width: 100%; }
  .confirm__fillIn__deliveryLine .select select {
    padding-right: 16px; }
  .confirm__fillIn__deliveryLine textarea {
    width: 100%;
    height: 26px;
    font-size: 12px;
    resize: vertical;
    max-height: 62px; }
  .confirm__fillIn__deliveryLine input {
    font-size: 12px; }
  .confirm__fillIn__deliveryLine textarea::placeholder, .confirm__fillIn__deliveryLine textarea:placeholder-shown {
    padding-top: 0.16em; }
  .confirm__fillIn__deliveryLine ::placeholder,
  .confirm__fillIn__deliveryLine :placeholder-shown {
    font-size: 12px; }

.confirm__fillIn__customer .confirm__fillIn__deliveryLine {
  z-index: 9; }

.confirm__fillIn__customer .confirm__fillIn__deliveryLine ~ .confirm__fillIn__deliveryLine {
  z-index: 8; }

.confirm__fillIn__customer .confirm__fillIn__deliveryLine ~ .confirm__fillIn__deliveryLine ~ .confirm__fillIn__deliveryLine {
  z-index: 7; }

.confirm__fillIn__detail .confirm__fillIn__deliveryLine .confirm__fillIn__code {
  width: calc(100% - 76px * 3 - 4px * 3); }

.confirm__fillIn__deliveryLine ~ .confirm__fillIn__deliveryLine {
  margin-top: 4px; }

.confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine {
  z-index: 17; }

.confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine {
  z-index: 16; }

.confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine {
  z-index: 15; }

.confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine {
  z-index: 14; }

.confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine + .confirm__fillIn__deliveryLine {
  z-index: 13; }

.confirm__notice__processing {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap; }
  .confirm__notice__processing h4 {
    font-size: 28px;
    width: 100%;
    text-align: center;
    color: #888888;
    font-weight: normal; }
  .confirm__notice__processing p {
    font-size: 20px;
    width: 100%;
    text-align: center;
    color: #888888; }
  .confirm__notice__processing a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #888888;
    font-size: 20px;
    margin-top: 32px; }
    .confirm__notice__processing a span {
      font-size: 18px;
      margin-right: 16px;
      color: #888888; }

.confirm__fillIn__detail__footer {
  position: sticky;
  z-index: 6;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #eeeeee;
  border-radius: 0 0 5px 5px;
  padding: 4px 20px; }
  .confirm__fillIn__detail__footer .button {
    width: auto;
    height: auto;
    padding: 4px 12px;
    font-size: 10px; }
  .confirm__fillIn__detail__footer .button:last-of-type {
    margin-right: auto;
    margin-left: 4px; }

.confirm__fillIn__detail__footer--taxSum {
  background-color: #ffffff;
  z-index: 21;
  position: sticky;
  top: calc(100% - 52px);
  height: 52px;
  width: 100%; }
  .confirm__fillIn__detail__footer--taxSum .confirm__fillIn__full {
    position: relative;
    width: calc(25% - 3px); }
    .confirm__fillIn__detail__footer--taxSum .confirm__fillIn__full dd input {
      text-align: right; }
  .confirm__fillIn__detail__footer--taxSum .icon-pin,
  .confirm__fillIn__detail__footer--taxSum .icon-spoit {
    top: auto;
    position: absolute; }
  .confirm__fillIn__detail__footer--taxSum .confirm__fillIn__tooltip {
    top: calc(-100% - 22px);
    transform-origin: bottom; }

.confirm__fillIn__detail__footer--taxSum ~ .confirm__fillIn__detail__lineArea {
  margin-top: -52px;
  padding-bottom: 64px; }

.confirm__fillIn__detail__footer--taxSum.confirm__fillIn__detail__footer--taxSum--locked ~ .confirm__fillIn__detail__lineArea {
  margin-top: -44px;
  padding-bottom: 56px; }

.confirm__fillIn__detail__footer--taxSum--locked {
  display: flex;
  justify-content: space-between; }
  .confirm__fillIn__detail__footer--taxSum--locked .confirm__fillIn__full {
    border-bottom: 1px solid #e0e0e0;
    min-height: 26px;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 2px;
    padding-right: 8px;
    margin-left: auto;
    width: calc(25% - 8px); }
    .confirm__fillIn__detail__footer--taxSum--locked .confirm__fillIn__full dt {
      font-size: 10px;
      margin-bottom: 4px;
      width: auto; }
    .confirm__fillIn__detail__footer--taxSum--locked .confirm__fillIn__full dd {
      display: flex;
      justify-content: flex-end;
      font-size: 14px;
      font-weight: bold;
      width: auto;
      min-height: 21px; }

.confirm__fillIn__detail__visibleCheck {
  display: flex;
  align-items: center;
  margin-left: 0;
  margin-right: auto; }
  .confirm__fillIn__detail__visibleCheck input {
    display: none; }
  .confirm__fillIn__detail__visibleCheck span {
    font-size: 10px; }

.confirm__fillIn__detail__sum {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding-bottom: 0; }
  .confirm__fillIn__detail__sum dt {
    width: 100%;
    text-align: right;
    margin-right: 0;
    margin-bottom: 0; }
  .confirm__fillIn__detail__sum dd {
    width: 100%; }

.confirm__footer {
  position: relative;
  bottom: 0;
  height: 50px;
  width: 100%;
  background-color: #5a5a5a;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 32px;
  padding-left: 24px; }

.confirm__footer--modalThrough {
  z-index: auto; }

.checkbox--star {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.1s ease;
  margin-left: 20px; }
  .checkbox--star .icon-star {
    color: #5a5a5a;
    text-shadow: none;
    font-size: 16px;
    text-shadow: #ffffff 1px 1px 0, #ffffff -1px -1px 0, #ffffff -1px 1px 0, #ffffff 1px -1px 0, #ffffff 0px 1px 0, #ffffff -1px 0, #ffffff -1px 0 0, #ffffff 1px 0 0;
    /*上、下*/ }
  .checkbox--star:active {
    transform: scale(0.8); }
  .checkbox--star input:checked + .icon-star {
    color: #FADA77;
    text-shadow: #DBB54E 1px 1px 0, #DBB54E -1px -1px 0, #DBB54E -1px 1px 0, #DBB54E 1px -1px 0, #DBB54E 0px 1px 0, #DBB54E -1px 0, #DBB54E -1px 0 0, #DBB54E 1px 0 0;
    /*上、下*/
    font-size: 16px; }

.confirm__footer__subMenu {
  margin: 0;
  margin-left: 8px; }
  .confirm__footer__subMenu .icon-other {
    display: inline-block;
    font-size: 10px;
    transform: scale(0.45);
    color: #ffffff; }
    .confirm__footer__subMenu .icon-other::before {
      transition: 0.1s ease;
      display: flex;
      align-items: center;
      justify-content: center; }
  .confirm__footer__subMenu .subMenu {
    bottom: 26px;
    right: 8px; }

.confirm__footer__subMenu:active .icon-other::before {
  transform: scale(0.8); }

.confirm__footer__note {
  max-width: 488px;
  flex-grow: 1; }

.confirm__footer__buttonArea {
  margin-left: auto;
  display: flex;
  align-items: center;
  flex-grow: 0;
  flex-shrink: 1; }

.confirm__footer__button {
  color: #ffffff;
  border: 1px solid #fff;
  height: 26px;
  font-size: 14px;
  line-height: 1em;
  margin-left: 12px;
  transition: 0.042s ease; }
  .confirm__footer__button > span {
    vertical-align: -1px; }
  .confirm__footer__button.button--white {
    color: #373737; }
    .confirm__footer__button.button--white .icon-document, .confirm__footer__button.button--white .icon-reverse {
      color: #373737; }
  .confirm__footer__button span[class*="icon-"] {
    color: #ffffff;
    margin-right: 12px; }
  .confirm__footer__button:active {
    background-color: #373737; }
    .confirm__footer__button:active.button--white {
      background-color: #cccccc; }
  .confirm__footer__button span[class*="icon-"]::before {
    vertical-align: baseline; }

.confirm__footer__button--modalThrough {
  position: relative;
  z-index: 1001;
  transform: translate3d(0px, 0px, 2000px); }

.confirm__footer__prev {
  width: 26px;
  height: 26px;
  margin-left: 32px;
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 26px; }
  .confirm__footer__prev .icon-prev {
    font-size: 10px;
    color: #ffffff;
    position: absolute;
    z-index: 12;
    left: calc(50% - 4px);
    top: 7px; }
    .confirm__footer__prev .icon-prev::before {
      display: flex;
      position: absolute;
      left: 0;
      top: 0; }

.confirm__footer__next {
  width: 26px;
  height: 26px;
  margin-left: 8px;
  overflow: hidden;
  position: relative; }
  .confirm__footer__next .icon-next {
    font-size: 10px;
    color: #ffffff;
    position: absolute;
    z-index: 12;
    left: calc(50% - 4px);
    top: 7px; }
    .confirm__footer__next .icon-next::before {
      display: flex;
      position: absolute;
      left: 0;
      top: 0; }

.confirm__modal__code.modal__wrap {
  max-height: calc(422px - 46px);
  margin-top: 46px;
  padding-top: 0; }
  .confirm__modal__code.modal__wrap::after {
    content: "";
    display: flex;
    width: calc(100% / 3 + 3px);
    height: 0; }
  .confirm__modal__code.modal__wrap.confirm__modal__code--variable {
    max-height: 422px;
    margin-top: 0; }
    .confirm__modal__code.modal__wrap.confirm__modal__code--variable .confirm__modal__header {
      align-items: flex-start;
      position: sticky;
      top: 0;
      width: 100%;
      padding-bottom: 12px;
      margin-bottom: 4px;
      z-index: 1; }

.confirm__modal--bumon,
.confirm__modal--hojo,
.confirm__modal--payment,
.confirm__modal__code {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  .confirm__modal--bumon button:nth-of-type(n+4),
  .confirm__modal--hojo button:nth-of-type(n+4),
  .confirm__modal--payment button:nth-of-type(n+4),
  .confirm__modal__code button:nth-of-type(n+4) {
    margin-top: 8px; }

.confirm__modal__code.confirm__modal--payment {
  margin-top: 32px; }
  .confirm__modal__code.confirm__modal--payment .list__result {
    width: 100%; }
  .confirm__modal__code.confirm__modal--payment span {
    font-size: 12px; }

.confirm__modal__code ~ .modal__buttonArea {
  margin-top: 20px; }

.confirm__modal__header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #ffffff;
  width: calc(100% - 44px - 44px);
  position: absolute;
  top: 28px; }
  .confirm__modal__header .confirm__modal__header__prev {
    margin-right: 8px;
    margin-top: -2px; }
  .confirm__modal__header button {
    margin-left: auto; }
  .confirm__modal__header h5 {
    margin-left: 8px; }
  .confirm__modal__header .confirm__modal__header__subtitle {
    position: absolute;
    margin-left: 0;
    bottom: -16px;
    font-size: 10px;
    font-weight: bold;
    color: #888888; }

.confirm__modal__header__totsugouMeisaiItems {
  width: 490px;
  margin-left: 20px;
  margin-right: 8px;
  text-align: right; }

.confirm__modal__header__totsugouMeisaiItem {
  display: inline-flex;
  justify-content: flex-end; }
  .confirm__modal__header__totsugouMeisaiItem dt {
    color: #888888;
    font-size: 10px; }
  .confirm__modal__header__totsugouMeisaiItem dd {
    color: #888888;
    font-size: 10px;
    margin-left: 4px; }

.confirm__modal__header__totsugouMeisaiItem ~ .confirm__modal__header__totsugouMeisaiItem {
  margin-left: 8px; }

.confirm__modal__header__totsugouMeisaiItem--full {
  width: 100%;
  display: flex; }
  .confirm__modal__header__totsugouMeisaiItem--full dt {
    padding-top: 2px;
    min-width: 3em; }
  .confirm__modal__header__totsugouMeisaiItem--full dd {
    color: #373737;
    font-size: 12px;
    letter-spacing: -0.05em; }

.confirm__modal__body {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  background-color: #ffffff;
  width: 100%; }
  .confirm__modal__body::after {
    content: "";
    display: flex;
    width: calc(100% / 3 - 9px);
    height: 0; }

.confirm__modal__body__title {
  width: 100%;
  display: flex;
  margin-bottom: 8px; }
  .confirm__modal__body__title dl {
    display: inline-flex; }
  .confirm__modal__body__title dl ~ dl {
    margin-left: 12px; }
  .confirm__modal__body__title dt {
    font-size: 10px;
    color: #888888; }
  .confirm__modal__body__title dd {
    margin-left: 8px;
    font-size: 10px; }

.confirm__modal__body__title ~ .confirm__modal__body__title {
  margin-top: 12px; }

.confirm__kamoku__group {
  border-radius: 5px;
  border: 1px solid #cccccc;
  overflow: hidden;
  height: auto;
  width: 100%; }

.confirm__kamoku__group--open {
  margin-bottom: 8px; }

.confirm__kamoku__group--close {
  margin-bottom: 0;
  height: 38px; }

.confirm__kamoku__title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background-color: #5a5a5a;
  margin-bottom: 0;
  line-height: 1em;
  color: #ffffff;
  padding: 12px 16px; }
  .confirm__kamoku__title .icon-arrow {
    color: #ffffff;
    margin-left: 8px; }

.confirm__kamoku--open {
  transform: rotate(180deg); }

.confirm__kamoku__buttonArea {
  padding: 16px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  .confirm__kamoku__buttonArea button:nth-of-type(n+4) {
    margin-top: 8px; }

.confirm__modal__search {
  margin-left: auto;
  position: relative;
  width: calc(100% / 3 - 6px); }
  .confirm__modal__search input {
    height: 26px;
    width: 100%; }
  .confirm__modal__search input::placeholder,
  .confirm__modal__search input:placeholder-shown {
    font-size: 10px; }
  .confirm__modal__search .icon-loupe {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    background-color: #ffffff; }

.list__result__payment__bankName {
  width: calc(25% - 64px);
  padding-left: 8px; }

.list__result__payment__bankName:first-child {
  width: 25%;
  padding-left: 72px; }

.list__result__payment__image {
  width: 64px;
  padding-left: 16px; }
  .list__result__payment__image img {
    width: 26px; }
  .list__result__payment__image span.icon-spoit {
    font-size: 10px;
    color: #888888;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: -16px; }
    .list__result__payment__image span.icon-spoit::before {
      width: 20px;
      height: 20px;
      font-size: 18px;
      line-height: 20px;
      margin-bottom: 2px; }

.list__result__payment__bankCode,
.list__result__payment__branchName,
.list__result__header__branchCode,
.list__result__header__accountType,
.list__result__header__accountNumber,
.list__result__header__accountHolder {
  width: 12.5%;
  padding-left: 8px; }

.button__code {
  width: calc(100% / 3 - 6px);
  min-height: 48px;
  font-weight: normal;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  text-align: left; }
  .button__code span {
    font-size: 10px;
    color: #888888;
    width: 100%; }

.button__code--totsugouMeisai {
  display: flex;
  justify-content: space-between;
  flex-direction: row; }
  .button__code--totsugouMeisai > span {
    margin-top: auto;
    padding-top: 4px;
    width: 100%;
    display: flex;
    justify-content: space-between; }
    .button__code--totsugouMeisai > span span {
      width: 65%; }
    .button__code--totsugouMeisai > span span ~ span {
      width: 35%;
      text-align: right; }

.confirm__modal__body__section {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  .confirm__modal__body__section::after {
    content: "";
    display: flex;
    width: calc(100% / 3 - 9px);
    height: 0; }

.confirm__modal__body__section--border {
  border-top: 1px solid #cccccc;
  margin-top: 12px;
  padding-top: 12px; }

.confirm__modifiableList {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  padding-bottom: 40px;
  flex-wrap: wrap; }
  .confirm__modifiableList .popup__text {
    position: relative;
    display: flex;
    align-items: center; }
    .confirm__modifiableList .popup__text input {
      width: 100%;
      padding-right: 166px;
      box-sizing: border-box;
      background-color: #ffffff; }
  .confirm__modifiableList .confirm__fillIn__detail__addItem.popup__text {
    height: auto; }
    .confirm__modifiableList .confirm__fillIn__detail__addItem.popup__text input {
      width: 100%;
      padding-right: calc(100% - 88px);
      box-sizing: border-box; }
    .confirm__modifiableList .confirm__fillIn__detail__addItem.popup__text .confirm__fillIn__code__text {
      width: calc(100% - 96px);
      position: absolute;
      top: 0;
      left: 96px;
      padding-right: 22px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      color: #888888;
      box-sizing: border-box;
      height: 22px;
      line-height: 24px;
      pointer-events: none; }
  .confirm__modifiableList .confirm__fillIn__code__tooltip,
  .confirm__modifiableList .confirm__fillIn__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 20; }
  .confirm__modifiableList .icon-edit {
    position: absolute;
    top: 4px;
    right: 8px;
    cursor: pointer; }
    .confirm__modifiableList .icon-edit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
  .confirm__modifiableList .icon-edit:hover::after {
    opacity: 0.1; }
  .confirm__modifiableList .icon-edit:hover .confirm__fillIn__code__tooltip,
  .confirm__modifiableList .icon-edit:hover .confirm__fillIn__tooltip {
    transform: scaleY(1);
    transition: 0.3s ease;
    transition-delay: 0.75s; }

.confirm__modifiableList {
  width: calc(100% - 40px); }

.confirm__modifiableList__header {
  height: 20px;
  display: flex;
  position: sticky;
  top: 0;
  left: -50px;
  width: calc(100% + 30px);
  background-color: #ffffff;
  z-index: 5; }
  .confirm__modifiableList__header h4 {
    font-size: 10px;
    color: #888888; }
  .confirm__modifiableList__header .confirm__modifiableList__drag {
    cursor: default; }
    .confirm__modifiableList__header .confirm__modifiableList__drag::before, .confirm__modifiableList__header .confirm__modifiableList__drag::after {
      content: none; }

.confirm__modifiableList__body {
  width: 100%;
  border: 1px solid #cccccc;
  border-radius: 2px;
  counter-reset: number; }

.confirm__modifiableList__line {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  height: 40px; }
  .confirm__modifiableList__line:hover {
    background-color: #f5f5f5; }
    .confirm__modifiableList__line:hover .confirm__modifiableList__moveLine {
      opacity: 1;
      pointer-events: auto; }
    .confirm__modifiableList__line:hover .confirm__modifiableList__control {
      opacity: 1;
      transform: translateY(0); }
  .confirm__modifiableList__line input {
    width: 100%;
    height: 22px;
    font-size: 12px; }
  .confirm__modifiableList__line :placeholder-shown {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__modifiableList__line ::-webkit-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__modifiableList__line :-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__modifiableList__line ::-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .confirm__modifiableList__line :-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .confirm__modifiableList__line ::-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .confirm__modifiableList__line .select {
    width: 100%;
    box-sizing: border-box;
    height: 22px; }
  .confirm__modifiableList__line .confirm__modifiableList__drag {
    height: 100%;
    position: relative;
    cursor: grab; }
    .confirm__modifiableList__line .confirm__modifiableList__drag::before, .confirm__modifiableList__line .confirm__modifiableList__drag::after {
      content: "";
      width: 16px;
      height: 1px;
      background-color: #cccccc;
      display: block;
      position: relative;
      transform: translateY(-50%) translateX(-50%);
      left: 50%; }
    .confirm__modifiableList__line .confirm__modifiableList__drag::before {
      top: calc(50% - 4px); }
    .confirm__modifiableList__line .confirm__modifiableList__drag::after {
      top: calc(50% + 3px); }
  .confirm__modifiableList__line .confirm__fillIn--disable {
    opacity: 0.55; }
    .confirm__modifiableList__line .confirm__fillIn--disable input, .confirm__modifiableList__line .confirm__fillIn--disable textarea, .confirm__modifiableList__line .confirm__fillIn--disable.select {
      background-color: #f5f5f5; }
    .confirm__modifiableList__line .confirm__fillIn--disable .confirm__fillIn__code__text {
      color: rgba(51, 51, 51, 0.5);
      opacity: 0.75; }

.confirm__modifiableList__line + .confirm__modifiableList__line {
  border-top: 1px solid #cccccc; }
  .confirm__modifiableList__line + .confirm__modifiableList__line .confirm__modifiableList__control {
    height: 81px; }

.confirm__modifiableList__line:only-child .confirm__modifiableList__control {
  height: 81px; }

.confirm__modifiableList__line:only-child .confirm__modifiableList__delete {
  opacity: 0;
  pointer-events: none; }

.confirm__modifiableList__line:last-child::after {
  content: "";
  position: absolute;
  top: 39px;
  height: 39px;
  left: -1px;
  width: 100%;
  background-color: #f5f5f5;
  border-radius: 0 0 2px 2px;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  opacity: 0; }

.confirm__modifiableList__line:last-child:hover::after {
  opacity: 1; }

.confirm__modifiableList__line:last-child .confirm__modifiableList__addLine {
  border-left: none; }

.confirm__modifiableList__line--locked {
  pointer-events: none; }
  .confirm__modifiableList__line--locked:hover {
    background-color: #ffffff; }
  .confirm__modifiableList__line--locked .confirm__modifiableList__drag {
    cursor: default; }
    .confirm__modifiableList__line--locked .confirm__modifiableList__drag::before, .confirm__modifiableList__line--locked .confirm__modifiableList__drag::after {
      background-color: #eeeeee; }
  .confirm__modifiableList__line--locked .confirm__modifiableList__control {
    display: none; }

.confirm__modifiableList__drag {
  width: 46px; }

.confirm__modifiableList__bumon {
  width: calc(60% - 46px);
  padding-right: 8px; }

.confirm__modifiableList__numberType {
  width: 20%;
  padding-right: 8px; }

.confirm__modifiableList__number {
  width: 20%;
  padding-right: 8px;
  position: relative; }
  .confirm__modifiableList__number input {
    padding-right: 20px; }
  .confirm__modifiableList__number .confirm__modifiableList__number--suffix {
    position: absolute;
    right: 16px;
    top: 4px;
    font-size: 10px; }

.confirm__modifiableList__control {
  position: absolute;
  top: -1px;
  right: -28px;
  width: 28px;
  height: 82px;
  opacity: 0;
  transform: translateX(-9999px);
  background-color: #f5f5f5;
  border-top: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  border-radius: 0 2px 2px 0; }

.confirm__modifiableList__delete {
  height: 41px;
  width: 28px;
  padding: 0; }
  .confirm__modifiableList__delete::before {
    font-size: 10px;
    display: block;
    transform: scale(0.8);
    transition: 0.12s ease; }
  .confirm__modifiableList__delete:active::before {
    transform: scale(0.6); }

.confirm__modifiableList__addLine {
  height: 39px;
  width: 28px;
  border-left: 1px solid #cccccc;
  border-radius: 0;
  position: relative;
  padding: 0; }
  .confirm__modifiableList__addLine::before {
    font-size: 10px;
    display: block;
    transform: scale(0.9);
    transition: 0.12s ease; }
  .confirm__modifiableList__addLine::after {
    content: "";
    display: block;
    width: 16px;
    height: 1px;
    position: absolute;
    top: -2px;
    left: 6px;
    background-color: #cccccc; }
  .confirm__modifiableList__addLine:active::before {
    transform: scale(0.6); }

.confirm__modifiableList__moveLine {
  opacity: 0;
  pointer-events: none;
  margin-left: auto;
  padding-right: 8px; }
  .confirm__modifiableList__moveLine > label {
    display: flex;
    align-items: center; }
  .confirm__modifiableList__moveLine input {
    width: 34px;
    padding-right: 4px;
    padding-left: 0;
    text-align: right; }

.confirm__modifiableList__moveLine__title {
  margin-right: 8px; }

.confirm__savedNotice {
  position: fixed;
  bottom: 50px;
  left: 0;
  width: 100%;
  height: 50px;
  z-index: 10000;
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left center;
  animation: noticeFade 3s linear 0s 1 normal;
  animation-fill-mode: backwards; }
  .confirm__savedNotice p {
    font-size: 22px;
    font-weight: bold;
    letter-spacing: 0.13em;
    color: #ffffff;
    animation: noticeFade__text 3s ease 0s 1 normal; }

.confirm__savedNotice__background {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background-color: #23D19D;
  padding-right: 32px;
  width: 100%;
  height: 100%; }

.confirm__errorNotice__background {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background-color: #b60117;
  padding-right: 32px;
  width: 100%;
  height: 100%; }

@keyframes noticeFade {
  0% {
    opacity: 0;
    transform: scaleX(0); }
  9% {
    transform: scaleX(1); }
  20% {
    opacity: 1; }
  80% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scaleX(1); } }

@keyframes noticeFade__text {
  0% { }
  15% {
    opacity: 0; }
  30% {
    opacity: 1; }
  100% {
    opacity: 1; } }

.confirm__addLineButton {
  width: 100%;
  margin: 4px 20px 0;
  padding-top: 4px;
  padding-bottom: 4px;
  text-align: center;
  background-color: #f7f7f7; }

.confirm__fillIn--locked {
  word-break: break-all; }
  .confirm__fillIn--locked.confirm__fillIn--delivery .confirm__fillIn__customer {
    height: auto; }
  .confirm__fillIn--locked .confirm__fillIn__detail__lineArea {
    margin-top: 0;
    padding-top: 8px;
    height: calc(100% - 24px); }
  .confirm__fillIn--locked .confirm__fillIn__deliveryLine {
    align-items: stretch; }
    .confirm__fillIn--locked .confirm__fillIn__deliveryLine dl {
      display: flex;
      margin-bottom: 0; }
  .confirm__fillIn--locked .confirm__fillIn__deliveryLine:last-child {
    margin-bottom: 4px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__lineArea--close .confirm__fillIn__detail__extraLine {
    margin: 0; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__line {
    margin-top: 8px;
    padding-bottom: 16px; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__line:last-child {
    border-bottom: none; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine:first-of-type {
    margin-top: 0;
    padding-top: 0; }
    .confirm__fillIn--locked .confirm__fillIn__detail__listLine:first-of-type.confirm__fillIn__detail__listLine--totsugou--fail {
      padding-top: 8px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine:before,
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__line:before,
  .confirm__fillIn--locked .confirm__fillIn__bank__listLine:before {
    content: none; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine:hover .confirm__fillIn__detail__menu,
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__line:hover .confirm__fillIn__detail__menu {
    display: none; }
  .confirm__fillIn--locked .confirm__fillIn__bank__listLine:hover .confirm__fillIn__bank__menu {
    display: none; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine,
  .confirm__fillIn--locked .confirm__fillIn__bank__listLine {
    align-items: stretch;
    padding-top: 8px;
    padding-bottom: 12px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine:last-child,
  .confirm__fillIn--locked .confirm__fillIn__bank__listLine:last-child {
    border-bottom: none; }
  .confirm__fillIn--locked .confirm__fillIn__sum {
    padding-right: 0; }
    .confirm__fillIn--locked .confirm__fillIn__sum dd {
      min-width: 92px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__name--locked {
    width: 75%; }
  .confirm__fillIn--locked .confirm__fillIn__detail__price--locked {
    width: 24%;
    margin-bottom: 0; }
    .confirm__fillIn--locked .confirm__fillIn__detail__price--locked dd {
      font-size: 14px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__extraLine {
    padding-left: 0;
    margin-top: 4px;
    align-items: stretch; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou dd {
    font-size: 12px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__quantity--locked dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__unitPrice--locked dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__price--locked dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__quantity--locked dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__unitPrice--locked dd,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__price--locked dd {
    font-size: 12px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__extraLine,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__extraLine {
    padding-left: 64px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__note--locked {
    width: 55%; }
  .confirm__fillIn--locked .confirm__fillIn__detail__quantity--locked {
    width: 20%; }
    .confirm__fillIn--locked .confirm__fillIn__detail__quantity--locked dd {
      font-size: 14px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__unitPrice--locked {
    width: 24%; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__header {
    align-items: stretch; }
    .confirm__fillIn--locked .confirm__fillIn__debitCredit__header .confirm__fillIn__title {
      margin-top: 2px; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__lineArea {
    height: calc(100% - 68px - 20px); }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__top {
    align-items: stretch; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__left {
    width: 33%;
    height: auto; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__cennter {
    width: 33%; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__right {
    width: 33%;
    height: auto; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__taxQuantity--locked dd {
    justify-content: flex-end; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__taxCalc--locked dd {
    font-size: 10px;
    letter-spacing: -0.05em; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__taxCalc--locked,
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__taxQuantity--locked {
    height: 50%; }
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__bumon,
  .confirm__fillIn--locked .confirm__fillIn__debitCredit__right {
    align-items: stretch; }
    .confirm__fillIn--locked .confirm__fillIn__debitCredit__bumon .confirm__fillIn__debit,
    .confirm__fillIn--locked .confirm__fillIn__debitCredit__bumon .confirm__fillIn__credit,
    .confirm__fillIn--locked .confirm__fillIn__debitCredit__right .confirm__fillIn__debit,
    .confirm__fillIn--locked .confirm__fillIn__debitCredit__right .confirm__fillIn__credit {
      display: flex;
      flex-wrap: wrap; }
  .confirm__fillIn--locked .confirm__fillIn__VATrelief__item dd {
    padding-left: 4px; }
  .confirm__fillIn--locked .confirm__fillIn__oneThird {
    width: calc(100% / 3 - 4px); }
    .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__full {
      border-bottom: 1px dashed #cccccc; }
      .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__full dd {
        text-align: right;
        padding-right: 4px; }
    .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__half {
      margin-top: 6px; }
      .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__half dd {
        text-align: right;
        padding-right: 4px; }
    .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__half:only-child {
      margin-top: 4px;
      margin-bottom: 8px; }
    .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__close {
      min-height: 0;
      margin-top: 0; }
    .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__inputArea--locked--borderSolidBottom {
      border-bottom: 1px solid #cccccc;
      border-left: none; }
      .confirm__fillIn--locked .confirm__fillIn__oneThird .confirm__fillIn__inputArea--locked--borderSolidBottom dd {
        border-left: none; }
  .confirm__fillIn--locked .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__totsugouToggle {
    top: 3px; }
  .confirm__fillIn--locked .confirm__fillIn__inputArea--toggleLine ~ .confirm__fillIn__inputArea--toggleLine .confirm__fillIn__detail__totsugouToggle {
    top: 11px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill > .confirm__fillIn__detail__totsugouTitleArea {
    margin-top: 8px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__name--locked {
    width: 37%; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__quantity--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__unitPrice--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__price--locked {
    width: 20%;
    padding-left: 4px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__date ~ .confirm__fillIn__detail__note {
    width: calc(99% - 136px); }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--commonBill .confirm__fillIn__detail__note {
    width: 100%; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou {
    border-bottom: 1px solid #e0e0e0; }
    .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name--locked {
      width: calc(100% - 64px - 88px - 88px - 88px); }
    .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__quantity--locked,
    .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__unitPrice--locked,
    .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__price--locked {
      width: 88px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__name--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__name--locked {
    width: calc(100% - 64px - 88px); }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__quantity--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__unitPrice--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__price--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__quantity--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__unitPrice--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__price--locked {
    width: 88px; }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai .confirm__fillIn__detail__note--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou .confirm__fillIn__detail__note--locked {
    width: calc(100% - 88px - 88px); }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__name--locked,
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine--totsugou.confirm__fillIn__detail__listLine__orderMeisai--commonBill .confirm__fillIn__detail__name--locked {
    width: calc(100% - 64px - 88px - 88px - 88px); }
  .confirm__fillIn--locked .confirm__fillIn__detail__listLine__orderMeisai ~ .confirm__fillIn__detail__listLine__orderMeisai--fail::after {
    height: 100%; }

.confirm__fillIn__detail__name--locked,
.confirm__fillIn__detail__price--locked,
.confirm__fillIn__detail__note--locked,
.confirm__fillIn__detail__date--locked,
.confirm__fillIn__detail__quantity--locked,
.confirm__fillIn__detail__unitPrice--locked,
.confirm__fillIn__code--locked,
.confirm__fillIn__date--locked,
.confirm__fillIn__debitCredit__left--locked,
.confirm__fillIn__debitCredit__center--locked,
.confirm__fillIn__debitCredit__right--locked,
.confirm__fillIn__debitCredit__taxCalc--locked,
.confirm__fillIn__debitCredit__taxQuantity--locked,
.confirm__fillIn__code--locked,
.confirm__fillIn__addItem,
.confirm__fillIn__debitCredit__note--locked,
.confirm__fillIn__delivery__slipNumber--locked,
.confirm__fillIn__delivery__slipCategory--locked,
.confirm__fillIn__delivery__accountingCategory--locked,
.confirm__fillIn__delivery__orderNumber--locked,
.confirm__fillIn__delivery__slipCategory--locked,
.confirm__fillIn__delivery__accountingCategory--locked,
.confirm__fillIn__delivery__orderNumber--locked,
.confirm__fillIn__delivery__issueDate--locked,
.confirm__fillIn__delivery__delivaryDate--locked,
.confirm__fillIn__delivery__purchaseCategory--locked,
.confirm__fillIn__delivery__taxIncludedCategory--locked,
.confirm__fillIn__delivery__taxRate--locked,
.confirm__fillIn__delivery__supplierCode--locked,
.confirm__fillIn__delivery__summary--locked,
.confirm__fillIn__delivery__supplierName--locked,
.confirm__fillIn__delivery__name--locked,
.confirm__fillIn__delivery__quantity--locked,
.confirm__fillIn__delivery__unitPrice--locked,
.confirm__fillIn__delivery__price--locked,
.confirm__fillIn__delivery__strageCode--locked,
.confirm__fillIn__delivery__note--locked,
.confirm__fillIn__delivery__header__item--locked,
.confirm__fillIn__detail__addItem--locked,
.confirm__fillIn__deliveryLine .confirm__fillIn__inputArea--locked {
  flex-wrap: wrap;
  width: 100%; }
  .confirm__fillIn__detail__name--locked dt,
  .confirm__fillIn__detail__price--locked dt,
  .confirm__fillIn__detail__note--locked dt,
  .confirm__fillIn__detail__date--locked dt,
  .confirm__fillIn__detail__quantity--locked dt,
  .confirm__fillIn__detail__unitPrice--locked dt,
  .confirm__fillIn__code--locked dt,
  .confirm__fillIn__date--locked dt,
  .confirm__fillIn__debitCredit__left--locked dt,
  .confirm__fillIn__debitCredit__center--locked dt,
  .confirm__fillIn__debitCredit__right--locked dt,
  .confirm__fillIn__debitCredit__taxCalc--locked dt,
  .confirm__fillIn__debitCredit__taxQuantity--locked dt,
  .confirm__fillIn__code--locked dt,
  .confirm__fillIn__addItem dt,
  .confirm__fillIn__debitCredit__note--locked dt,
  .confirm__fillIn__delivery__slipNumber--locked dt,
  .confirm__fillIn__delivery__slipCategory--locked dt,
  .confirm__fillIn__delivery__accountingCategory--locked dt,
  .confirm__fillIn__delivery__orderNumber--locked dt,
  .confirm__fillIn__delivery__slipCategory--locked dt,
  .confirm__fillIn__delivery__accountingCategory--locked dt,
  .confirm__fillIn__delivery__orderNumber--locked dt,
  .confirm__fillIn__delivery__issueDate--locked dt,
  .confirm__fillIn__delivery__delivaryDate--locked dt,
  .confirm__fillIn__delivery__purchaseCategory--locked dt,
  .confirm__fillIn__delivery__taxIncludedCategory--locked dt,
  .confirm__fillIn__delivery__taxRate--locked dt,
  .confirm__fillIn__delivery__supplierCode--locked dt,
  .confirm__fillIn__delivery__summary--locked dt,
  .confirm__fillIn__delivery__supplierName--locked dt,
  .confirm__fillIn__delivery__name--locked dt,
  .confirm__fillIn__delivery__quantity--locked dt,
  .confirm__fillIn__delivery__unitPrice--locked dt,
  .confirm__fillIn__delivery__price--locked dt,
  .confirm__fillIn__delivery__strageCode--locked dt,
  .confirm__fillIn__delivery__note--locked dt,
  .confirm__fillIn__delivery__header__item--locked dt,
  .confirm__fillIn__detail__addItem--locked dt,
  .confirm__fillIn__deliveryLine .confirm__fillIn__inputArea--locked dt {
    width: 100%;
    height: 15px;
    margin-bottom: 0;
    font-size: 10px;
    color: #888888; }
  .confirm__fillIn__detail__name--locked dd,
  .confirm__fillIn__detail__price--locked dd,
  .confirm__fillIn__detail__note--locked dd,
  .confirm__fillIn__detail__date--locked dd,
  .confirm__fillIn__detail__quantity--locked dd,
  .confirm__fillIn__detail__unitPrice--locked dd,
  .confirm__fillIn__code--locked dd,
  .confirm__fillIn__date--locked dd,
  .confirm__fillIn__debitCredit__left--locked dd,
  .confirm__fillIn__debitCredit__center--locked dd,
  .confirm__fillIn__debitCredit__right--locked dd,
  .confirm__fillIn__debitCredit__taxCalc--locked dd,
  .confirm__fillIn__debitCredit__taxQuantity--locked dd,
  .confirm__fillIn__code--locked dd,
  .confirm__fillIn__addItem dd,
  .confirm__fillIn__debitCredit__note--locked dd,
  .confirm__fillIn__delivery__slipNumber--locked dd,
  .confirm__fillIn__delivery__slipCategory--locked dd,
  .confirm__fillIn__delivery__accountingCategory--locked dd,
  .confirm__fillIn__delivery__orderNumber--locked dd,
  .confirm__fillIn__delivery__slipCategory--locked dd,
  .confirm__fillIn__delivery__accountingCategory--locked dd,
  .confirm__fillIn__delivery__orderNumber--locked dd,
  .confirm__fillIn__delivery__issueDate--locked dd,
  .confirm__fillIn__delivery__delivaryDate--locked dd,
  .confirm__fillIn__delivery__purchaseCategory--locked dd,
  .confirm__fillIn__delivery__taxIncludedCategory--locked dd,
  .confirm__fillIn__delivery__taxRate--locked dd,
  .confirm__fillIn__delivery__supplierCode--locked dd,
  .confirm__fillIn__delivery__summary--locked dd,
  .confirm__fillIn__delivery__supplierName--locked dd,
  .confirm__fillIn__delivery__name--locked dd,
  .confirm__fillIn__delivery__quantity--locked dd,
  .confirm__fillIn__delivery__unitPrice--locked dd,
  .confirm__fillIn__delivery__price--locked dd,
  .confirm__fillIn__delivery__strageCode--locked dd,
  .confirm__fillIn__delivery__note--locked dd,
  .confirm__fillIn__delivery__header__item--locked dd,
  .confirm__fillIn__detail__addItem--locked dd,
  .confirm__fillIn__deliveryLine .confirm__fillIn__inputArea--locked dd {
    width: 100%;
    height: calc(100% - 15px);
    display: flex;
    align-items: center;
    border-left: 1px dashed #cccccc;
    border-bottom: 1px dashed #cccccc;
    padding-left: 4px;
    padding-bottom: 2px;
    min-height: 21px; }

.confirm__fillIn__detail__price--locked dd,
.confirm__fillIn__detail__unitPrice--locked dd,
.confirm__fillIn__debitCredit__right--locked dd {
  justify-content: flex-end;
  font-size: 14px; }

.confirm__fillIn__delivery__header--locked .confirm__fillIn__half {
  min-height: 21px;
  flex-basis: calc(50% + 28px);
  align-items: stretch;
  width: auto;
  flex-wrap: wrap;
  margin-top: 8px;
  margin-bottom: 12px; }
  .confirm__fillIn__delivery__header--locked .confirm__fillIn__half dt {
    width: 100%;
    padding-top: 0; }
  .confirm__fillIn__delivery__header--locked .confirm__fillIn__half dd {
    display: flex;
    align-items: center;
    border-left: 1px dashed #cccccc;
    border-bottom: 1px dashed #cccccc;
    padding-left: 12px;
    width: 100%;
    height: calc(100% - 15px);
    font-size: 14px;
    min-height: 21px; }

.confirm__fillIn__delivery__header__item--locked {
  margin-top: 8px;
  margin-bottom: 12px;
  width: auto;
  flex-basis: calc(25% - 28px);
  flex-grow: 1;
  display: flex;
  align-items: stretch; }

.confirm__fillIn__delivery__header__item--locked ~ .confirm__fillIn__delivery__header__item--locked {
  padding-right: 4px; }

.confirm__toggleArea {
  transition: 0.25s ease-in;
  max-height: 1000px; }

.confirm__toggleArea--close {
  max-height: 24px;
  overflow: hidden;
  transition: 0.54s ease-in-out; }
  .confirm__toggleArea--close .toggleButton::before {
    transform: rotate(0deg);
    top: 1px; }

.confirm__fillIn__title ~ .confirm__toggleArea {
  margin-top: 8px; }

.confirm__fillIn__commonTable {
  display: flex;
  position: relative;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%; }
  .confirm__fillIn__commonTable > * {
    padding-right: 8px; }

.confirm__fillIn__commonTable__header span {
  color: #888888;
  font-size: 10px; }

.confirm__fillIn__commonTable__header .setting__app__section__data.setting__app__section__addCustom__data {
  min-height: 0; }

.confirm__fillIn__commonTable__header .confirm__fillIn__commonTable__condition {
  margin-left: auto; }

.confirm__fillIn__commonTable + .confirm__fillIn__commonTable {
  margin-top: 8px; }

.confirm__fillIn__commonTable--alignCenter {
  align-items: center; }

.confirm__fillIn__commonTable__circulation__date {
  width: 128px; }

.confirm__fillIn__commonTable__circulation__approver {
  width: calc(50% - 128px);
  overflow: hidden;
  line-height: 12px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-overflow: clip; }
  .confirm__fillIn__commonTable__circulation__approver span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 12px; }

.confirm__fillIn__commonTable__circulation__status {
  width: 88px; }
  .confirm__fillIn__commonTable__circulation__status .confirm__status__label {
    padding-left: 4px;
    width: auto;
    height: auto;
    justify-content: flex-start; }

.confirm__fillIn__commonTable__circulation__comment {
  width: calc(50% - 88px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }
  .confirm__fillIn__commonTable__circulation__comment *[class*=icon]::before {
    margin-right: 8px;
    position: relative;
    top: 2px; }
  .confirm__fillIn__commonTable__circulation__comment .icon-comment {
    color: #e0e0e0; }

.confirm__fillIn__comment__fukidashi {
  position: absolute;
  right: 0;
  bottom: 24px;
  width: 100%;
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 12px 16px;
  border-radius: 5px; }
  .confirm__fillIn__comment__fukidashi p {
    line-height: 1em;
    white-space: normal; }

.confirm__fillIn__comment__fukidashi--full {
  position: absolute;
  right: 0;
  bottom: 100%;
  width: calc(100% + 80px); }

.delivery .confirm__footer {
  background-color: #274239; }

.delivery .checkbox--star .icon-star {
  color: #274239; }

.delivery .footer__button:active,
.delivery .confirm__footer__button:active {
  background-color: #003A2B; }

.delivery .footer__button.button--white:active,
.delivery .confirm__footer__button.button--white:active {
  background-color: #f7f7f7; }

.TradeAutomation .confirm__footer {
  background-color: #F0AD3E; }

.TradeAutomation .icon-star {
  color: #F0AD3E; }

.TradeAutomation .confirm__footer__button.button--white .icon-document {
  color: #FE8133; }

.TradeAutomation .confirm__footer__button:active {
  background-color: #FE8133; }
  .TradeAutomation .confirm__footer__button:active.button--white {
    background-color: #F0AD3E; }
    .TradeAutomation .confirm__footer__button:active.button--white:active {
      background-color: #FE8133; }
      .TradeAutomation .confirm__footer__button:active.button--white:active .icon-document {
        color: #FFF8DF; }

.receipt .confirm__preview__control {
  background-color: #3E331A; }

.receipt .confirm__preview {
  background-color: #3E331A; }

.receipt .confirm__footer {
  background-color: #AF9C6A; }

.receipt .checkbox--star .icon-star {
  color: #AF9C6A; }

.receipt .confirm__footer__button:active {
  background-color: #806E42; }

.pagebottom__addLineButton {
  margin-top: 16px !important;
  margin-bottom: 8px !important; }

/* ---------------------------------------------------------------*/
/* 領域リサイザー対応(CSSカスタムプロパティが使える場合のみ活性化)
 /* PDFプレビューと詳細パネルの幅：confirm__fillIn-widthがJSから動的に変更
 /* 詳細パネルの上段/下段の幅：confirm__upper__panel-heightがJSから動的に変更
 /* ---------------------------------------------------------------*/
@supports (--css: variables) {
  :root {
    --confirm__fillIn-width: 650px;
    --confirm__upper__panel-height: 300px; }
  .confirm__preview {
    width: calc(100% - var(--confirm__fillIn-width)); }
  .confirm__preview #resizer {
    background-color: #5a5a5a;
    cursor: col-resize; }
  .confirm__fillIn {
    max-width: var(--confirm__fillIn-width); }
  .confirm__upper__resizable {
    max-height: var(--confirm__upper__panel-height);
    height: var(--confirm__upper__panel-height); }
  .confirm__lower__resizable {
    max-height: calc(100% - 100px - var(--confirm__upper__panel-height)); } }

/* ----------------------------------*/
/* 帳票一覧のレイアウト */
/* ----------------------------------*/
.list {
  margin: 16px 32px; }

.list__localTabSwitch {
  width: 100%;
  display: flex;
  margin-bottom: 24px; }
  .list__localTabSwitch input {
    display: none; }

.list__localTabSwitch__tab {
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%; }

.list__localTabSwitch__text {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 14px;
  letter-spacing: 0.1em;
  color: #cccccc;
  background-color: #eeeeee;
  border-bottom: 1px solid #cccccc;
  cursor: pointer;
  position: relative;
  user-select: none; }

input:checked ~ .list__localTabSwitch__text {
  color: #23D19D;
  background-color: transparent;
  border-bottom: none;
  padding-top: 4px; }

.list__localTabSwitch__tab ~ .list__localTabSwitch__tab .list__localTabSwitch__text {
  border-left: 1px solid #cccccc; }

.list__search {
  padding: 12px 16px 24px;
  background-color: #eeeeee; }

.list__search__title {
  margin-bottom: 12px;
  width: 100%; }

.list__search__toggle {
  margin-left: 4px;
  position: relative; }
  .list__search__toggle::before {
    position: relative;
    z-index: 5;
    top: 0;
    display: inline-block;
    transform: rotate(180deg);
    transition: 0.15s ease; }
  .list__search__toggle::after {
    content: "";
    background-color: #e0e0e0;
    border-radius: 50%;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: 0.03s ease;
    transform: translateX(-50%) translateY(-50%) scale(0);
    z-index: 4; }
  .list__search__toggle:active::after {
    transform: translateX(-50%) translateY(-50%) scale(1); }

.list__search {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  transition: 0.25s ease-in;
  height: auto;
  max-height: 500px;
  overflow: hidden; }
  .list__search .checkbox--text {
    transform-origin: left;
    transform: scale(0.95);
    margin-top: -2px;
    margin-bottom: 10px; }
    .list__search .checkbox--text .checkbox__check {
      margin-right: 2px; }
    .list__search .checkbox--text .checkbox__text--gray {
      line-height: 9px; }

@media screen and (min-width: 1560px) {
  .list__search--variableLine .list__search__left {
    width: calc(100% - 664px); }
  .list__search--variableLine .list__search__right {
    width: 664px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start; }
  .list__search--variableLine .list__search__right__wrap {
    width: 324px; }
  .list__search--variableLine .list__search__date,
  .list__search--variableLine .list__search__range {
    display: inline-flex;
    width: 324px;
    margin-top: 0;
    margin-bottom: 8px; } }

.list__search--close {
  max-height: 44px;
  overflow: hidden;
  transition: 0.54s ease-in-out; }
  .list__search--close .list__search__toggle::before {
    transform: rotate(0deg);
    top: 1px; }
  .list__search--close .list__search__subTitle {
    opacity: 0;
    transition: 0.54s ease-in-out; }

.list__search--open {
  max-height: auto; }

.list__search__text {
  width: 100%;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between; }

.list__search__uploadUser,
.list__search__uploadBumon,
.list__search__selectWrap {
  flex-basis: 140px;
  margin-left: 4px;
  position: relative; }

.list__search__subTitle {
  font-size: 10px;
  color: #888888;
  position: absolute;
  top: -14px;
  line-height: 10px; }

.list__search__selectWrap {
  justify-content: flex-start; }
  .list__search__selectWrap .list__search__subTitle {
    position: relative;
    top: 0;
    line-height: 1.5em; }

.list__search__left {
  display: flex;
  justify-content: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
  width: calc(100% - 324px);
  padding-right: 16px; }

.list__search__right {
  width: 324px; }
  .list__search__right .search__combine {
    width: 100%;
    max-width: 324px;
    margin-bottom: 8px; }
  .list__search__right .search__combine--date {
    width: auto; }
  .list__search__right .search__combine__select {
    width: 88px; }

.list__search__right__wrap {
  display: flex;
  flex-wrap: wrap; }

.list__search--disable {
  pointer-events: none;
  opacity: 0.2; }

.list__search__line {
  display: flex;
  width: 100%; }
  .list__search__line .list__search__status__subCategory__title {
    padding-top: 0; }
  .list__search__line .list__search__status__subCategory__content .list__search__checkBox {
    height: 26px;
    padding-top: 0;
    padding-bottom: 0; }
  .list__search__line .list__search__status__subCategory__content .list__search__checkBox:only-child {
    margin-right: 0; }
  .list__search__line .list__search__status__subCategory--smallTitle {
    padding-left: 16px;
    flex-shrink: 0; }
  .list__search__line .search__combine__wrap {
    margin-left: 16px; }

.list__search__date,
.list__search__range {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px; }
  .list__search__date .input__date,
  .list__search__date input[type="text"],
  .list__search__range .input__date,
  .list__search__range input[type="text"] {
    width: 116px; }
    .list__search__date .input__date input,
    .list__search__date input[type="text"] input,
    .list__search__range .input__date input,
    .list__search__range input[type="text"] input {
      padding-right: 22px; }

.list__search__date__title,
.list__search__range__title {
  width: 64px;
  font-size: 10px;
  color: #5a5a5a;
  margin-right: 8px; }

.list__search__date__body,
.list__search__range__body {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .list__search__date__body span,
  .list__search__range__body span {
    margin: 0 4px;
    color: #5a5a5a; }

.list__search__status {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-left: -4px;
  width: calc(100% + 4px);
  flex-shrink: 0; }
  .list__search__status label {
    margin-left: 4px; }
  .list__search__status label:last-of-type {
    margin-right: auto; }
  .list__search__status .icon-star {
    margin-left: 4px;
    margin-top: -1px;
    font-size: 11px;
    color: #FADA77;
    text-shadow: #DBB54E 1px 1px 0, #DBB54E -1px -1px 0, #DBB54E -1px 1px 0, #DBB54E 1px -1px 0, #DBB54E 0px 1px 0, #DBB54E -1px 0, #DBB54E -1px 0 0, #DBB54E 1px 0 0;
    /*上、下*/ }
  .list__search__status .icon-comment_line {
    margin-left: 6px;
    font-size: 12px; }

.list__search__dummy {
  width: 0;
  height: 0; }

.list__search__status__subCategory {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  padding-left: 8px; }
  .list__search__status__subCategory dt {
    width: 80px;
    font-size: 10px;
    color: #888888;
    padding-top: 6px; }
  .list__search__status__subCategory dd {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 80px);
    padding-left: 4px; }

.list__search__status__subCategory--smallTitle {
  display: inline-flex;
  flex-direction: column;
  justify-content: flex-start;
  width: auto; }
  .list__search__status__subCategory--smallTitle .list__search__status__subCategory__title {
    width: 100%; }
  .list__search__status__subCategory--smallTitle .list__search__status__subCategory__content {
    padding-left: 0;
    align-items: flex-start;
    width: auto; }
    .list__search__status__subCategory--smallTitle .list__search__status__subCategory__content .list__search__checkBox {
      margin-left: 0;
      margin-right: 4px; }
    .list__search__status__subCategory--smallTitle .list__search__status__subCategory__content .select {
      height: 29px;
      margin-bottom: 4px;
      margin-left: 0;
      margin-right: 4px; }

.list__search__checkBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
  padding: 6px 8px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 5px;
  font-size: 10px;
  transition: 0.24s ease; }
  .list__search__checkBox:active {
    transform: scale(0.92); }

.list__search__checkBox--gray {
  background-color: #f5f5f5; }
  .list__search__checkBox--gray .checkbox__check {
    background-color: transparent; }

.list__search__checkBox ~ .list__search__checkBox {
  margin-left: 4px; }

.list__search__button {
  margin: auto;
  margin-top: 12px; }
  .list__search__button span {
    font-size: 14px;
    margin-right: 8px; }

.list__search--payment {
  display: flex;
  align-items: stretch;
  justify-content: space-between; }
  .list__search--payment .list__search__title {
    width: 104px;
    padding-top: 3px; }
  .list__search--payment .list__search--payment__inputArea {
    width: calc(100% - 104px);
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-start; }
  .list__search--payment .search__combine--full {
    margin-bottom: 8px; }
  .list__search--payment .list__search__status__subCategory {
    margin-right: 8px;
    width: auto; }
    .list__search--payment .list__search__status__subCategory dt {
      width: auto;
      margin-right: 8px; }
    .list__search--payment .list__search__status__subCategory dd {
      width: 122px; }
    .list__search--payment .list__search__status__subCategory .select {
      width: 100%; }
      .list__search--payment .list__search__status__subCategory .select select {
        padding-left: 8px;
        padding-right: 12px;
        letter-spacing: -0.05em; }
    .list__search--payment .list__search__status__subCategory.select {
      width: 133px; }
      .list__search--payment .list__search__status__subCategory.select select {
        padding-left: 8px;
        padding-right: 12px; }
  .list__search--payment .list__search__status__subCategory ~ .search__combine {
    flex-basis: 298px;
    flex-grow: 0; }
    .list__search--payment .list__search__status__subCategory ~ .search__combine .search__combine__select {
      width: 72px; }
  .list__search--payment .search__combine__date {
    width: 102px;
    padding-left: 0; }
  .list__search--payment .list__search__button {
    margin-top: 16px; }

.list__result__amount {
  display: flex;
  align-items: center;
  margin-bottom: 12px; }

.list__result__amount__strong, .list__result__paymentExportStatus__count .list__result__paymentExportStatus__strong {
  font-size: 16px;
  font-weight: bold;
  margin-right: 8px;
  margin-left: 8px;
  letter-spacing: -0.025em; }

.list__result {
  padding-top: 16px; }
  .list__result .switch--tab {
    top: 0;
    transform: none;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.12); }

.list__result__buttonArea {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 16px 20px 12px 12px; }
  .list__result__buttonArea .button {
    height: 26px; }
  .list__result__buttonArea .button + .button {
    margin-left: 8px; }
  .list__result__buttonArea .button--red {
    margin-right: auto; }
  .list__result__buttonArea .icon-download,
  .list__result__buttonArea .icon-trash,
  .list__result__buttonArea .icon-passbook,
  .list__result__buttonArea .icon-paymentexport {
    color: #ffffff;
    margin-right: 8px; }

.list__result__buttonArea__paymentNoteArea, .list__result__buttonArea__noteArea {
  width: 688px;
  display: flex;
  flex-wrap: wrap;
  align-items: center; }

.list__result__buttonArea__paymentNote, .list__result__buttonArea__note {
  display: flex;
  align-items: flex-start;
  margin-left: 20px;
  width: 100%; }
  .list__result__buttonArea__paymentNote span, .list__result__buttonArea__note span {
    color: #08805C;
    font-size: 10px;
    line-height: 1.18em; }
  .list__result__buttonArea__paymentNote span[class*="icon"], .list__result__buttonArea__note span[class*="icon"] {
    font-size: 11px;
    margin-right: 4px;
    line-height: 1.18em;
    width: 12px;
    display: inline-flex;
    justify-content: center; }
    .list__result__buttonArea__paymentNote span[class*="icon"]::before, .list__result__buttonArea__note span[class*="icon"]::before {
      color: #23D19D; }
  .list__result__buttonArea__paymentNote--red span {
    color: #b60117; }
  .list__result__buttonArea__paymentNote--red span[class*="icon"]::before {
    color: #D0021B; }
  .list__result__buttonArea__paymentNote--orange span {
    color: #d5962c; }
  .list__result__buttonArea__paymentNote--orange span[class*="icon"]::before {
    color: #F0AD3E; }

.list__result__buttonArea__paymentNote ~ .list__result__buttonArea__paymentNote, .list__result__buttonArea__note ~ .list__result__buttonArea__paymentNote, .list__result__buttonArea__paymentNote ~ .list__result__buttonArea__note, .list__result__buttonArea__note ~ .list__result__buttonArea__note {
  margin-top: 2px; }

.list__result__buttonArea__noteArea {
  width: auto;
  max-width: calc(100% - 504px); }

.list__result__buttonArea__note--red span {
  color: #b60117; }

.list__result__buttonArea__note--red span[class*="icon"]::before {
  color: #D0021B; }

.list__result__buttonArea__note--orange span {
  color: #d5962c; }

.list__result__buttonArea__note--orange span[class*="icon"]::before {
  color: #F0AD3E; }

.list__result__buttonArea__switch--display {
  height: 26px;
  margin-left: auto; }
  .list__result__buttonArea__switch--display .button {
    height: 100%; }
    .list__result__buttonArea__switch--display .button span {
      padding-left: 8px;
      padding-right: 8px; }
  .list__result__buttonArea__switch--display .button + .button {
    margin-left: 0; }

.list__result__buttonArea__amount {
  display: flex;
  align-items: center;
  margin-left: auto;
  height: 26px; }
  .list__result__buttonArea__amount span {
    color: #888888;
    margin-left: 8px; }

.list__result__buttonArea__switch--display ~ .list__result__buttonArea__amount {
  margin-left: 8px; }

.list__result__paymentExportStatus {
  width: calc(75% - 8px);
  display: flex;
  margin-top: 16px;
  margin-left: 8px;
  flex-wrap: wrap; }
  .list__result__paymentExportStatus .checkbox {
    margin-left: auto; }

.list__result__paymentExportStatus__count {
  font-size: 10px;
  margin-right: 8px; }
  .list__result__paymentExportStatus__count .list__result__paymentExportStatus__strong {
    margin-left: 4px;
    margin-right: 4px; }

.list__result__listOption {
  width: 25%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  padding-bottom: 4px; }

.list__result__header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-top: 2px solid #cccccc;
  background-color: #fbfbfb;
  height: 38px; }
  .list__result__header > div {
    display: flex;
    align-items: center;
    height: 100%; }
  .list__result__header span {
    font-weight: bold;
    color: #5a5a5a;
    font-size: 10px; }
  .list__result__header .select {
    width: 100%;
    height: 20px;
    font-weight: bold;
    background-color: transparent; }
    .list__result__header .select select {
      padding-left: 4px;
      padding-right: 16px; }
  .list__result__header .triangle {
    margin-bottom: -4px;
    margin-left: 8px;
    color: #5a5a5a; }
  .list__result__header .subMenu {
    top: 34px;
    left: -4px; }

.list__result__header__sort {
  cursor: pointer;
  position: relative;
  z-index: 0; }
  .list__result__header__sort::before {
    content: "";
    position: absolute;
    top: 0;
    left: -8px;
    background-color: transparent;
    height: 100%;
    width: calc(100% + 8px);
    z-index: -1;
    transition: 0.12s ease-out; }
  .list__result__header__sort:hover::before {
    background-color: #eeeeee; }
  .list__result__header__sort .triangle--up {
    margin-top: -3px;
    margin-left: 8px;
    border-bottom-color: #cccccc; }
  .list__result__header__sort .triangle--down {
    margin-bottom: -3px;
    margin-left: 8px;
    border-top-color: #cccccc; }

.list__result__header__sort--active .triangle--up {
  border-bottom-color: #373737; }

.list__result__header__sort--active .triangle--down {
  border-top-color: #373737; }

.list__result__line {
  display: flex;
  align-items: center;
  border-top: 1px solid #cccccc;
  height: 51px;
  transition: 0.12s ease-out;
  position: relative; }
  .list__result__line p, .list__result__line span {
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.35em;
    display: flex; }
  .list__result__line:hover {
    background-color: #f5f5f5; }
  .list__result__line > a {
    position: absolute;
    width: 100%;
    height: 100%; }
  .list__result__line .select {
    width: 100%;
    height: 20px;
    margin-bottom: 3px; }
    .list__result__line .select select {
      padding-left: 4px;
      padding-right: 16px; }
  .list__result__line .icon-paymentexport::before,
  .list__result__line .icon-download::before,
  .list__result__line .icon-alert::before,
  .list__result__line .icon-documentalert_fill::before,
  .list__result__line .icon-documentalert_line::before {
    position: absolute;
    left: 2px;
    top: 2px;
    font-size: 10px;
    color: #23D19D;
    transform: scale(0.9); }
  .list__result__line .icon-alert::before,
  .list__result__line .icon-documentalert_fill::before {
    font-size: 10px;
    color: #D0021B; }
  .list__result__line .icon-documentalert_line::before {
    color: #F0AD3E; }
  .list__result__line *[class*="icon"] ~ .icon-documentalert_fill::before,
  .list__result__line *[class*="icon"] ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-alert::before {
    left: 14px; }
  .list__result__line *[class*="icon"] ~ .icon-documentalert_fill ~ .icon-documentalert_fill::before, .list__result__line *[class*="icon"] ~ .icon-documentalert_fill ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-documentalert_line ~ .icon-documentalert_fill::before,
  .list__result__line *[class*="icon"] ~ .icon-documentalert_line ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-alert ~ .icon-documentalert_fill::before,
  .list__result__line *[class*="icon"] ~ .icon-alert ~ .icon-documentalert_line::before {
    left: 26px; }
  .list__result__line *[class*="icon"] ~ .icon-documentalert_fill ~ .icon-documentalert_fill ~ .icon-documentalert_line::before, .list__result__line *[class*="icon"] ~ .icon-documentalert_fill ~ .icon-documentalert_line ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-documentalert_line ~ .icon-documentalert_fill ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-documentalert_line ~ .icon-documentalert_line ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-alert ~ .icon-documentalert_fill ~ .icon-documentalert_line::before,
  .list__result__line *[class*="icon"] ~ .icon-alert ~ .icon-documentalert_line ~ .icon-documentalert_line::before {
    left: 38px; }

.list__result__line--evenly {
  display: flex;
  padding: 0 16px; }
  .list__result__line--evenly > div {
    width: 100%;
    flex-grow: 0;
    flex-shrink: 1;
    padding-right: 8px; }
  .list__result__line--evenly p, .list__result__line--evenly span {
    white-space: normal; }
  .list__result__line--evenly .list__result__check {
    width: 5%;
    flex-shrink: 0; }
  .list__result__line--evenly .list__result__option,
  .list__result__line--evenly .list__result__line__option {
    width: auto;
    min-width: 18px;
    padding-right: 0;
    margin-right: 0; }
    .list__result__line--evenly .list__result__option .list__result__comment,
    .list__result__line--evenly .list__result__line__option .list__result__comment {
      margin-right: 0;
      width: 18px; }
  .list__result__line--evenly .list__result__registDay--invoice {
    width: 12%;
    flex-shrink: 0; }
  .list__result__line--evenly .list__result__circulationStatus--invoice {
    width: 14%;
    flex-shrink: 0; }
  .list__result__line--evenly .list__result__registDay--delivery {
    overflow: hidden;
    max-height: 100%; }
  .list__result__line--evenly .list__result__slipDate--delivery {
    width: 92px;
    flex-shrink: 0; }
  .list__result__line--evenly .list__result__billingDay--delivery {
    width: 92px;
    flex-shrink: 0; }
  .list__result__line--evenly .list__result__bpoLimit--delivery {
    width: 92px;
    flex-shrink: 0; }

.list__result__line--smallLine {
  height: 30px; }
  .list__result__line--smallLine .icon-paymentexport::before,
  .list__result__line--smallLine .icon-download::before,
  .list__result__line--smallLine .icon-alert::before,
  .list__result__line--smallLine .icon-documentalert_fill::before,
  .list__result__line--smallLine .icon-documentalert_line::before {
    top: -1px;
    left: 1px;
    transform: scale(0.85); }
  .list__result__line--smallLine *[class*="icon"] ~ .icon-documentalert_fill::before,
  .list__result__line--smallLine *[class*="icon"] ~ .icon-documentalert_line::before,
  .list__result__line--smallLine *[class*="icon"] ~ .icon-alert::before {
    left: 11px; }
  .list__result__line--smallLine .list__result__line__companyName p {
    font-size: 10px; }
  .list__result__line--smallLine .list__result__comment__fukidashi {
    bottom: 27px; }

.list__result__line--middleLine {
  height: 40px; }
  .list__result__line--middleLine .list__result__comment__fukidashi {
    bottom: 35px; }

.list__result__line--largeLine {
  height: 50px; }

.list__result__line--zengin {
  height: 60px; }

.list__result__line--finished {
  background-color: #fbfbfb; }

.list__result__line--disable {
  pointer-events: none; }
  .list__result__line--disable > * {
    opacity: 0.2; }

.list__result__line--receipt {
  background-color: #FFFDF7; }
  .list__result__line--receipt:hover {
    background-color: #FAF5E9; }
  .list__result__line--receipt .list__result__documentType {
    color: #A17300; }
    .list__result__line--receipt .list__result__documentType span {
      color: #A17300; }

.list__result__check {
  width: 5%;
  height: 100%; }
  .list__result__check .checkbox {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%; }

.list__result__check--large {
  width: 8%; }

.list__result__documentType {
  width: 6%; }
  .list__result__documentType > span {
    display: flex;
    align-items: center; }
  .list__result__documentType [class*="icon"] {
    font-size: 14px;
    margin-right: 4px; }

.list__result__companyName {
  width: 17%;
  margin-right: 8px;
  overflow: hidden; }

.list__result__companyName:first-child,
.list__result__companyName--bpoOperator:first-child {
  margin-left: 16px; }

.list__result__fee {
  width: 9.5%;
  margin-right: 8px;
  padding-right: 1%;
  justify-content: flex-end; }
  .list__result__fee p, .list__result__fee span {
    justify-content: flex-end; }
  .list__result__fee .triangle {
    margin-left: 4px; }

.list__result__billingDay {
  width: 8%;
  margin-right: 8px; }

.list__result__paymentMethod {
  width: 5.5%;
  margin-right: 8px; }

.list__result__paymentStatus {
  width: 9%;
  margin-right: 8px; }

.list__result__paymentLimit {
  width: 6%;
  margin-right: 8px; }

.list__result__registDay,
.list__result__registDay--bpoOperator,
.list__result__registDay--bpoClient {
  width: 14%;
  margin-right: 8px; }

.list__result__slipDate {
  width: 7%;
  margin-right: 8px; }

.list__result__denshifileID {
  width: 7%;
  margin-right: 8px; }

.list__result__invoiceTaxType {
  width: 6%;
  margin-right: 8px; }

.list__result__status {
  width: 10%;
  margin-right: 8px; }

.list__result__totsugouStatus {
  width: 14%;
  margin-right: 8px; }

.list__result__media {
  width: 5%;
  margin-right: 8px; }

.list__result__circulationStatus {
  width: 12%;
  margin-right: 8px; }

.list__result__option,
.list__result__line__option {
  width: calc(10% - 64px);
  height: 100%;
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  z-index: 12; }
  .list__result__option span,
  .list__result__line__option span {
    overflow: visible; }
  .list__result__option > div:only-child,
  .list__result__line__option > div:only-child {
    margin-right: 16px; }

.list__result__companyName--bpoOperator,
.list__result__companyName--bpoClient {
  width: 11%; }

.list__result__fee--bpoOperator {
  width: 7.5%; }

.list__result__billingDay--bpoOperator {
  width: 7.5%; }

.list__result__paymentMethod--bpoOperator {
  width: 5.5%; }

.list__result__paymentStatus--bpoOperator {
  width: 8.5%; }

.list__result__paymentLimit--bpoOperator {
  width: 8%; }

.list__result__slipDate--bpoOperator {
  width: 6.5%; }

.list__result__bpoLimit {
  width: 8%; }

.list__result__pages {
  width: 9.5%;
  margin-right: 8px;
  padding-right: 1%;
  justify-content: flex-end; }
  .list__result__pages p, .list__result__pages span {
    justify-content: flex-end; }

.list__result__status--bpoOperator {
  width: 9%; }

.list__result__bpoLimit--red p, .list__result__bpoLimit--red span {
  color: #D0021B; }

.list__result__line__companyName {
  padding-top: 3px; }
  .list__result__line__companyName p {
    font-size: 12px;
    white-space: nowrap; }
  .list__result__line__companyName span {
    font-size: 10px;
    color: #888888; }

.list__result__line__billingDay p {
  font-size: 10px; }

.list__result__line__registDay {
  padding-top: 3px; }
  .list__result__line__registDay p {
    font-size: 10px;
    white-space: nowrap; }
  .list__result__line__registDay span {
    font-size: 10px;
    color: #888888; }

.list__result__line__slipDate p {
  font-size: 10px; }

.list__result__line__status span {
  font-size: 10px;
  color: #888888; }

.list__result__bank__name,
.list__result__bank__acount,
.list__result__bank__acountHolder {
  flex-wrap: wrap;
  flex-grow: 1; }

.list__result__bank__name {
  width: 36%; }
  .list__result__bank__name span {
    width: 100%;
    white-space: normal; }

.list__result__bank__acount {
  width: 29%; }
  .list__result__bank__acount span {
    width: 100%;
    white-space: normal; }

.list__result__bank__acountHolder {
  width: 35%; }
  .list__result__bank__acountHolder span {
    width: 100%;
    white-space: normal; }

.list__result__companyName--commonDocument {
  width: 14%; }
  .list__result__companyName--commonDocument.list__result__companyName--bpoClient {
    width: 6.5%; }

.list__result__status--commonDocument {
  width: 8.5%; }

.list__result__voucherType--voucher {
  width: 9%; }

.list__result__voucherType--voucher:first-child {
  padding-left: 20px; }

.list__result__customer--voucher {
  width: 27.5%;
  overflow: hidden; }
  .list__result__customer--voucher p,
  .list__result__customer--voucher span {
    width: 100%;
    display: block; }

.list__result__fee--voucher {
  width: 8%;
  margin-right: 0;
  padding-right: 1.5%; }

.list__result__transactionDay--voucher {
  width: 7%; }

.list__result__registDay--voucher {
  width: 11%;
  margin-right: 0; }

.list__result__inputProspectDay--voucher {
  width: 10%; }

.list__result__status--voucher {
  width: 11%;
  margin-right: 0; }

.list__result__media--voucher {
  width: 5%; }

.list__result__line__option--voucher {
  width: 10%; }

.list__result__registDay--TradeAutomation {
  width: 10%;
  flex-shrink: 0; }

.list__result__companyName--TradeAutomation {
  width: 10%; }

.list__result__status--TradeAutomation {
  width: 7%; }

.list__result__totsugouStatus--TradeAutomation {
  width: 8%; }

.list__result__toggle {
  width: 3%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 4px;
  position: relative;
  z-index: 1; }
  .list__result__toggle .icon-arrow {
    font-size: 11px;
    transform: rotate(-90deg);
    transition: 0.15s ease; }
  .list__result__toggle--open .icon-arrow {
    transform: rotate(-180deg); }

.list__result__check--paymentExportZengin,
.list__result__check--paymentExportPayment {
  width: 3%;
  position: relative;
  z-index: 1; }

.list__result__bank--paymentExportZengin {
  width: 10%;
  padding-left: 4px;
  max-width: 200px; }

.list__result__date--paymentExportZengin {
  width: 7.5%;
  max-width: 88px; }

.list__result__companyName--paymentExportZengin {
  width: 13%;
  padding-right: 4px;
  flex-wrap: wrap;
  margin-right: 0; }
  .list__result__companyName--paymentExportZengin span, .list__result__companyName--paymentExportZengin p {
    display: block;
    width: 100%; }
  .list__result__companyName--paymentExportZengin .list__result__bold {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: clip;
    white-space: normal; }
  .list__result__companyName--paymentExportZengin.list__result__header__companyName {
    flex-wrap: nowrap; }
    .list__result__companyName--paymentExportZengin.list__result__header__companyName span, .list__result__companyName--paymentExportZengin.list__result__header__companyName p {
      width: auto; }

.list__result__bankAccount--paymentExportZengin {
  width: 13%;
  margin: 0;
  padding-right: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center; }

.list__result__customerBank--paymentExportZengin {
  width: 7%; }

.list__result__customerBranchName--paymentExportZengin {
  width: 6%; }

.list__result__customerAccountType--paymentExportZengin {
  width: 5%; }

.list__result__customerAccountNumber--paymentExportZengin {
  width: 6%;
  padding-right: 12px; }

.list__result__transferFeeBearer--paymentExportZengin {
  width: 6.5%;
  padding-right: 12px; }
  .list__result__transferFeeBearer--paymentExportZengin span, .list__result__transferFeeBearer--paymentExportZengin p {
    justify-content: flex-end; }

.list__result__separatePayment--paymentExportZengin {
  width: 8.5%;
  justify-content: flex-end;
  padding-right: 12px; }
  .list__result__separatePayment--paymentExportZengin p, .list__result__separatePayment--paymentExportZengin span {
    text-align: right; }

.list__result__chargeBilling--paymentExportZengin {
  width: 7.5%;
  padding-right: 12px;
  max-width: 76px; }

.list__result__billingSum--paymentExportZengin,
.list__result__offset--paymentExportZengin {
  width: 7%;
  justify-content: flex-end;
  align-items: center;
  padding-right: 12px;
  flex-wrap: wrap;
  align-content: center;
  max-width: 84px;
  margin-left: auto; }
  .list__result__billingSum--paymentExportZengin span, .list__result__billingSum--paymentExportZengin p,
  .list__result__offset--paymentExportZengin span,
  .list__result__offset--paymentExportZengin p {
    justify-content: flex-end;
    display: inline; }
  .list__result__billingSum--paymentExportZengin input[type="text"],
  .list__result__offset--paymentExportZengin input[type="text"] {
    width: 100%; }

.list__result__offset--paymentExportZengin {
  width: 7%;
  margin-left: 0; }
  .list__result__offset--paymentExportZengin p, .list__result__offset--paymentExportZengin span {
    text-align: right; }

.list__result__charge--paymentExportZengin {
  width: 6.5%;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  height: 100%;
  max-width: 84px; }
  .list__result__charge--paymentExportZengin ::placeholder,
  .list__result__charge--paymentExportZengin :placeholder-shown {
    font-size: 12px; }
  .list__result__charge--paymentExportZengin ::-ms-input-placeholder {
    font-size: 12px; }
  .list__result__charge--paymentExportZengin .select {
    width: 53%;
    margin-bottom: 0; }
  .list__result__charge--paymentExportZengin input[type="text"] {
    height: 20px;
    z-index: 1;
    font-size: 10px;
    padding-right: 4px;
    padding-left: 4px;
    text-align: right;
    margin-left: auto; }
  .list__result__charge--paymentExportZengin .checkbox {
    position: absolute;
    top: 3px;
    right: 14px;
    z-index: 100; }
    .list__result__charge--paymentExportZengin .checkbox .checkbox__check {
      width: 10px;
      height: 10px;
      border-radius: 0;
      margin-right: 4px; }
      .list__result__charge--paymentExportZengin .checkbox .checkbox__check::before {
        width: 5px;
        height: 2px;
        left: 1px;
        top: 1px; }
    .list__result__charge--paymentExportZengin .checkbox span {
      opacity: 0;
      letter-spacing: -0.05em;
      transition: 0.2s ease; }
    .list__result__charge--paymentExportZengin .checkbox input:checked ~ span {
      opacity: 1; }
  .list__result__charge--paymentExportZengin:hover .checkbox span {
    opacity: 1; }

.list__result__withCheckbox {
  display: flex;
  position: relative;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  height: 100%; }
  .list__result__withCheckbox ::placeholder,
  .list__result__withCheckbox :placeholder-shown {
    font-size: 12px; }
  .list__result__withCheckbox ::-ms-input-placeholder {
    font-size: 12px; }
  .list__result__withCheckbox input[type="text"] {
    width: 88%;
    max-width: 80px;
    height: 20px;
    z-index: 1;
    font-size: 10px;
    padding-right: 4px;
    padding-left: 4px;
    text-align: right;
    margin-left: auto; }
  .list__result__withCheckbox .checkbox {
    position: absolute;
    top: 3%;
    right: 14px;
    z-index: 100; }
    .list__result__withCheckbox .checkbox .checkbox__check {
      width: 10px;
      height: 10px;
      border-radius: 0;
      margin-right: 4px; }
      .list__result__withCheckbox .checkbox .checkbox__check::before {
        width: 5px;
        height: 2px;
        left: 1px;
        top: 1px; }
    .list__result__withCheckbox .checkbox span {
      opacity: 0;
      letter-spacing: -0.05em;
      transition: 0.2s ease; }
    .list__result__withCheckbox .checkbox input:checked ~ span {
      opacity: 1; }
  .list__result__withCheckbox:hover .checkbox span {
    opacity: 1; }

.list__result__withCheckbox--withText > span {
  margin-top: 16px; }

.list__result__withCheckbox--withText > span:last-child {
  margin-top: 2px; }

.list__result__charge--paymentExportZengin {
  flex-wrap: nowrap; }
  .list__result__charge--paymentExportZengin input[type="text"] {
    width: 42px; }

.list__result__paymentAmount--paymentExportZengin,
.list__result__paymentAmount--paymentExportPayment {
  width: 7.5%;
  justify-content: flex-end;
  padding-right: 24px; }
  .list__result__paymentAmount--paymentExportZengin span, .list__result__paymentAmount--paymentExportZengin p,
  .list__result__paymentAmount--paymentExportPayment span,
  .list__result__paymentAmount--paymentExportPayment p {
    justify-content: flex-end; }

.list__result__bank--paymentExportZengin,
.list__result__customerBank--paymentExportZengin,
.list__result__customerBranchName--paymentExportZengin,
.list__result__charge--paymentExportZengin {
  flex-wrap: wrap;
  padding-right: 12px; }

.list__result__bank--paymentExportZengin span,
.list__result__customerBank--paymentExportZengin span,
.list__result__customerBranchName--paymentExportZengin span {
  white-space: normal;
  line-height: 10px;
  letter-spacing: -0.05em; }

.list__result__bank--paymentExportZengin span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  max-height: 30px; }

@media screen and (min-width: 1400px) {
  .list__result__bank--paymentExportZengin,
  .list__result__date--paymentExportZengin {
    padding-right: 16px; }
  .list__result__companyName--paymentExportZengin {
    width: calc(10% + (16% - 200px) + (8% - 88px) + (7.5% - 76px) + (7% - 84px));
    padding-right: 12px; } }

.list__result__billingDay--paymentExportPayment {
  width: 8%;
  margin: 0;
  padding-left: 4px;
  padding-right: 8px; }

.list__result__paymentDay--paymentExportPayment {
  width: 8%;
  margin: 0;
  padding-right: 8px; }

.list__result__companyName--paymentExportPayment {
  width: 19.5%;
  margin: 0;
  padding-right: 8px; }
  .list__result__companyName--paymentExportPayment .list__result__bold {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: clip;
    white-space: normal; }

.list__result__bank--paymentExportPayment {
  width: 13%;
  margin: 0;
  padding-right: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center; }

.list__result__paymentLimit--paymentExportPayment {
  width: 8%;
  margin: 0;
  padding-right: 8px; }

.list__result__billingSum--paymentExportPayment,
.list__result__offset--paymentExportPayment {
  width: 9%;
  margin: 0;
  padding-right: 16px;
  justify-content: flex-end; }
  .list__result__billingSum--paymentExportPayment span, .list__result__billingSum--paymentExportPayment p,
  .list__result__offset--paymentExportPayment span,
  .list__result__offset--paymentExportPayment p {
    justify-content: flex-end; }
  .list__result__billingSum--paymentExportPayment input[type="text"],
  .list__result__offset--paymentExportPayment input[type="text"] {
    height: 20px;
    z-index: 1;
    font-size: 10px;
    padding-right: 4px;
    padding-left: 4px;
    text-align: right;
    margin-left: auto; }

.list__result__separatePayment--paymentExportPayment {
  width: 8.5%;
  padding-right: 12px;
  justify-content: flex-end; }
  .list__result__separatePayment--paymentExportPayment span, .list__result__separatePayment--paymentExportPayment p {
    justify-content: flex-end;
    text-align: right; }

.list__result__offset--paymentExportPayment span, .list__result__offset--paymentExportPayment p {
  text-align: right; }

.list__result__billingSum--paymentExportPayment {
  width: 8%; }

.list__result__offset--paymentExportPayment {
  width: 7%; }

.list__result__withholdingTax--paymentExportPayment {
  width: 10%;
  justify-content: flex-end;
  padding-right: 4%; }
  .list__result__withholdingTax--paymentExportPayment span, .list__result__withholdingTax--paymentExportPayment p {
    justify-content: flex-end; }

.list__result__outputDate--history {
  width: 160px;
  padding-left: 4px;
  padding-right: 8px; }

.list__result__transferDate--history {
  width: 112px;
  padding-right: 8px; }

.list__result__transferNumber--history,
.list__result__transferForm--history {
  width: 80px;
  padding-right: 8px;
  justify-content: flex-end; }

.list__result__transferNumber--history,
.list__result__transferForm--history {
  margin-left: auto; }

.list__result__transferNumber--history ~ .list__result__transferForm--history,
.list__result__transferForm--history ~ .list__result__billingSum,
.list__result__transferForm--history ~ .list__result__charge {
  margin-left: 0; }

.list__result__line--history:hover:not(.list__result__header) {
  background-color: #eeeeee; }

.list__result__line--history .list__result__billingDay--paymentExportPayment {
  width: 7%; }

.list__result__line--history .list__result__paymentDay--paymentExportPayment {
  width: 7%; }

.list__result__line--history .list__result__companyName--paymentExportPayment {
  width: 17%; }

.list__result__line--history .list__result__bank--paymentExportZengin {
  width: calc(9% + 3%); }

.list__result__line--history .list__result__bank--paymentExportPayment {
  width: calc(13% + 3%); }

.list__result__line--history .list__result__charge--paymentExportZengin {
  margin-left: 0; }

.list__result__line--history .list__result__paymentLimit--paymentExportPayment {
  width: 7%; }

.list__result__line--history .list__result__withholdingTax--paymentExportPayment {
  width: 9.5%;
  padding-right: 3%; }

.list__result__line--history .list__result__paymentAmount--paymentExportPayment {
  width: 8%;
  padding-right: 20px; }

.list__result__line--history:not(.list__result__header) .list__result__outputDate--history span,
.list__result__line--history:not(.list__result__header) .list__result__transferDate--history span,
.list__result__line--history:not(.list__result__header) .list__result__transferNumber--history span,
.list__result__line--history:not(.list__result__header) .list__result__transferForm--history span {
  font-size: 12px; }

.list__result__setting__accessLimit__userName,
.list__result__setting__accessLimit__userId,
.list__result__setting__accessLimit__bumon,
.list__result__setting__accessLimit__role,
.list__result__setting__circulation__userName,
.list__result__setting__circulation__userId,
.list__result__setting__circulation__bumon,
.list__result__setting__circulation__role,
.list__result__setting__circulation__privilege {
  padding-right: 16px; }
  .list__result__setting__accessLimit__userName span,
  .list__result__setting__accessLimit__userId span,
  .list__result__setting__accessLimit__bumon span,
  .list__result__setting__accessLimit__role span,
  .list__result__setting__circulation__userName span,
  .list__result__setting__circulation__userId span,
  .list__result__setting__circulation__bumon span,
  .list__result__setting__circulation__role span,
  .list__result__setting__circulation__privilege span {
    font-size: 12px;
    white-space: normal; }

.list__result__setting__accessLimit__userName,
.list__result__setting__circulation__userName {
  width: 256px; }

.list__result__setting__accessLimit__userId,
.list__result__setting__circulation__userId {
  width: 256px; }

.list__result__setting__accessLimit__bumon,
.list__result__setting__circulation__bumon {
  width: 136px; }
  .list__result__setting__accessLimit__bumon span,
  .list__result__setting__circulation__bumon span {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: clip;
    white-space: normal; }

.list__result__setting__accessLimit__role {
  width: 144px; }

.list__result__setting__circulation__role {
  width: 144px; }

.list__result__setting__circulation__privilege {
  width: 144px; }

.list__result__line--evenly .list__result__setting__circulation__userName {
  width: 29%;
  flex-shrink: 0; }

.list__result__line--evenly .list__result__setting__circulation__userId {
  width: 100%;
  flex-shrink: 1; }

.list__result__line--evenly .list__result__setting__circulation__bumon {
  width: 15%;
  flex-shrink: 0; }

.list__result__line--evenly .list__result__setting__circulation__role {
  width: 10%;
  flex-shrink: 0; }

.list__result__line--evenly .list__result__setting__circulation__privilege {
  width: 17%;
  flex-shrink: 0; }

.list__result__star {
  margin-right: 16px;
  width: 32px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }
  .list__result__star .icon-star {
    color: #FADA77;
    text-shadow: #DBB54E 1px 1px 0, #DBB54E -1px -1px 0, #DBB54E -1px 1px 0, #DBB54E 1px -1px 0, #DBB54E 0px 1px 0, #DBB54E -1px 0, #DBB54E -1px 0 0, #DBB54E 1px 0 0;
    /*上、下*/
    font-size: 16px; }

.list__result__comment {
  margin-right: 8px;
  width: 32px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative; }
  .list__result__comment .icon-comment_line, .list__result__comment .icon-comment {
    font-size: 16px; }

.list__result__comment__fukidashi {
  position: absolute;
  right: -2px;
  bottom: 42px;
  width: 540px;
  background-color: #ffffff;
  border: 1px solid #5a5a5a;
  padding: 12px 16px;
  border-radius: 5px; }
  .list__result__comment__fukidashi p {
    line-height: 1em;
    width: 100%; }

.list__result__disable .icon-star, .list__result__disable .icon-comment {
  color: #e0e0e0;
  text-shadow: none; }

.list__result__other {
  margin-right: 16px;
  width: 40px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }
  .list__result__other .icon-other {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    transform: scale(0.5);
    height: 200%;
    width: 80px; }
    .list__result__other .icon-other::before {
      display: flex;
      justify-content: center;
      align-items: center;
      transition: 0.1s ease; }
    .list__result__other .icon-other:active::before {
      transform: scale(0.76); }
  .list__result__other .subMenu {
    right: 40px;
    top: 12px; }
  .list__result__other:hover .icon-other::before {
    opacity: 0.6; }

.list__result__errorTooltip {
  position: absolute;
  display: inline-flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  border-radius: 4px;
  left: 54px;
  top: 94%;
  font-weight: normal;
  color: #5a5a5a;
  border: 1px solid #D0021B;
  font-size: 12px;
  max-width: 928px;
  background-color: #FFE3E8;
  padding: 4px 16px;
  padding-left: 24px;
  transform: scaleY(0);
  opacity: 0;
  transform-origin: top;
  transition: 0.3s ease;
  z-index: 20; }
  .list__result__errorTooltip li {
    font-size: 10px;
    color: #b60117; }

.list__result__line:hover .list__result__errorTooltip {
  transform: scaleY(1);
  opacity: 1; }

.list__result__bold {
  font-weight: bold; }

.list__result__gray {
  color: #888888; }

.list__result__red {
  color: #b60117; }

span.list__result__bold,
span.list__result__gray,
span.list__result__red {
  display: inline; }

.list__input--disable {
  background-color: #f5f5f5; }

.list__result__LineChild {
  height: 0;
  overflow: hidden; }
  .list__result__LineChild--open {
    height: auto;
    overflow: visible; }
  .list__result__LineChild .list__result__line {
    background-color: #f7f7f7; }
    .list__result__LineChild .list__result__line:hover {
      background-color: #e0e0e0; }
  .list__result__LineChild .list__result__line ~ .list__result__line {
    border-style: dashed; }
  .list__result__LineChild .list__result__header {
    border-bottom: none;
    border-width: 1px;
    background-color: #f5f5f5;
    height: 32px; }
  .list__result__LineChild .list__result__line--history .list__result__toggle {
    margin-left: auto; }
  .list__result__LineChild .list__result__line--history .list__result__bank--paymentExportZengin {
    width: calc(9% + 3% - 36px); }

.list__result__LineChild--grandChild .list__result__line {
  background-color: #eeeeee; }
  .list__result__LineChild--grandChild .list__result__line:hover {
    background-color: #e0e0e0; }

.modal__listCSVSelect {
  margin: -16px auto 16px;
  width: 304px; }

/* ----------------------------------*/
/* ログインのレイアウト */
/* ----------------------------------*/
.login {
  align-items: flex-start;
  justify-content: center;
  min-width: 800px;
  padding-top: 160px; }

.login__area {
  width: 360px;
  display: flex;
  flex-wrap: wrap; }

.login__area--wide {
  width: 594px; }

.login__title {
  width: 224px;
  margin: auto;
  margin-bottom: 24px;
  text-align: center; }
  .login__title img {
    width: 100%; }

.login__panel {
  padding: 30px;
  max-width: 360px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center; }

.login__panel--wide {
  max-width: 594px; }
  .login__panel--wide .login__common__text {
    width: 100%; }

.login__panel__title {
  text-align: center;
  margin-top: 0;
  margin-bottom: 20px; }

.login__pass__text ~ .login__panel__error {
  margin-top: 8px; }

.login__panel__error ~ .login__input {
  margin-top: 12px; }

.login__panel__title--red {
  color: #D0021B;
  margin-bottom: 10px; }

.login__panel__note {
  font-size: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 24px;
  white-space: nowrap; }

.login__panel__error {
  color: #D0021B;
  font-size: 12px;
  margin-top: 16px; }

.login__input {
  width: 100%; }

.login__input + .login__input {
  margin-top: 10px; }

.login__button {
  margin-top: 20px;
  font-size: 12px;
  width: 100%;
  max-width: 360px; }

.login__button + .login__button {
  margin-top: 10px; }

.login__input ~ .login__button.button--black {
  margin-top: 24px; }

.login__note {
  font-size: 10px;
  margin-left: auto;
  margin-top: 10px; }

.login__pass__text,
.login__common__text {
  font-weight: normal;
  font-size: 14px;
  text-align: center;
  margin-bottom: 12px;
  margin-top: 8px; }

.login__pass__text--strong,
.login__common__text--strong {
  font-weight: bold; }

.login__pass__text--red,
.login__common__text--red {
  color: #D0021B;
  font-size: 14px; }

.login__input__note {
  font-size: 11px;
  margin-top: 5px;
  color: #888888; }

.login__extraSection {
  width: 100%;
  margin-top: 20px;
  border-top: solid 1px #e0e0e0; }

.login__link {
  color: #00B881; }
  .login__link:hover {
    text-decoration: underline; }

.invoice .login__title,
.delivery .login__title {
  width: 280px; }

.TradeAutomation .login__title {
  width: 320px; }

#accept-not-fit-client-area {
  margin-top: 20px;
  display: none; }
  #accept-not-fit-client-area .form-check label {
    display: flex;
    align-items: center;
    user-select: none; }
  #accept-not-fit-client-area a {
    text-decoration: underline; }

#login-btn:disabled {
  background: #ccc;
  cursor: inherit; }

/* ----------------------------------*/
/* 設定画面のレイアウト */
/* ----------------------------------*/
.setting__app {
  margin: 16px 32px;
  padding: 20px 30px; }
  .setting__app .setting__app__section {
    padding: 15px 0px;
    display: flex;
    align-items: center;
    position: relative;
    flex-wrap: wrap; }
    .setting__app .setting__app__section.setting__app__section--noPaddingTop {
      padding-top: 0; }
    .setting__app .setting__app__section.setting__app__section--noPaddingBottom {
      padding-bottom: 0; }
    .setting__app .setting__app__section.setting__app__section--hidden {
      height: 0;
      overflow: hidden;
      padding: 0; }
    .setting__app .setting__app__section .select {
      margin-right: 16px;
      width: 164px; }
    .setting__app .setting__app__section .setting__app__section__check {
      width: 24px;
      margin-right: 12px; }
      .setting__app .setting__app__section .setting__app__section__check .checkbox__check {
        margin: 0; }
    .setting__app .setting__app__section .setting__app__section__title {
      width: 140px; }
    .setting__app .setting__app__section .setting__app__section__data {
      margin-right: 50px;
      width: 200px;
      overflow: hidden; }
      .setting__app .setting__app__section .setting__app__section__data .setting__app__section__filename {
        width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 14px;
        line-height: 1.4em; }
      .setting__app .setting__app__section .setting__app__section__data .setting__app__section__update {
        color: #888888;
        line-height: 1em; }
      .setting__app .setting__app__section .setting__app__section__data .setting__app__section__changeNotice {
        position: absolute;
        font-size: 10px;
        font-weight: bold;
        color: #23D19D;
        bottom: -16px;
        left: 0; }
      .setting__app .setting__app__section .setting__app__section__data .setting__app__section__deleteNotice {
        font-size: 10px;
        font-weight: bold;
        color: #D0021B;
        display: flex;
        align-items: center; }
    .setting__app .setting__app__section .setting__app__section__delete {
      position: absolute;
      padding: 0;
      top: calc(50% - 6px);
      left: 392px;
      transition: 0.1s ease;
      backface-visibility: visible;
      transform: scale(1);
      color: #373737; }
      .setting__app .setting__app__section .setting__app__section__delete:active {
        transform: scale(0.7); }
    .setting__app .setting__app__section .setting__app__section__delete--disable {
      color: #e0e0e0;
      pointer-events: none; }
    .setting__app .setting__app__section .setting__app__import__button {
      border-radius: 5px; }
      .setting__app .setting__app__section .setting__app__import__button span:before {
        margin-right: 10px; }
      .setting__app .setting__app__section .setting__app__import__button input {
        display: none; }
    .setting__app .setting__app__section .setting__app__import__button ~ .checkbox {
      margin-left: 24px; }
  .setting__app .setting__app__section__masterTitle {
    border-top: 1px solid #cccccc;
    border-bottom: 1px dashed #cccccc;
    padding-top: 16px;
    padding-bottom: 8px; }
  .setting__app .setting__app__section__notice {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-top: 24px; }
    .setting__app .setting__app__section__notice .setting__app__noticeIcon {
      color: #D0021B;
      font-size: 38px;
      margin-right: 20px; }
    .setting__app .setting__app__section__notice .setting__app__noticeText {
      color: #D0021B;
      font-size: 14px; }
  .setting__app .setting__app__section__masterTitle ~ .setting__app__section + .setting__app__section {
    margin-top: 0; }
  .setting__app .setting__app__section__commonTitle {
    border-bottom: 1px dashed #cccccc;
    padding-bottom: 8px; }
  .setting__app .setting__app__section__commonTitle ~ .setting__app__section__commonTitle {
    margin-top: 12px; }
  .setting__app .setting__app__checkbox {
    display: flex;
    align-items: center;
    width: auto;
    transition: 0.12s ease opacity; }
  .setting__app .setting__app__checkbox ~ .setting__app__checkbox {
    margin-left: 20px; }
  .setting__app .setting__app__checkbox--loading,
  .setting__app .checkbox--text--disable {
    opacity: 0.4;
    pointer-events: none; }
  .setting__app .checkbox__check {
    width: 17px;
    height: 17px;
    transition: 0.12s ease-in-out;
    position: relative;
    border-color: #e0e0e0;
    border-radius: 4px;
    margin-right: 16px; }
    .setting__app .checkbox__check::before {
      width: 8px;
      height: 3px;
      top: 4px;
      left: 3px; }
  .setting__app .setting__app__section__slipDate {
    width: 100%; }
    .setting__app .setting__app__section__slipDate .select {
      width: 112px; }
    .setting__app .setting__app__section__slipDate .select__combine .select {
      margin-right: 0; }
    .setting__app .setting__app__section__slipDate .select__combine select {
      min-width: 0; }
  .setting__app .setting__app__section__slipDate__header {
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 8px; }
    .setting__app .setting__app__section__slipDate__header h4 {
      font-size: 10px;
      color: #888888; }
    .setting__app .setting__app__section__slipDate__header .setting__app__section__slipDate__slipDate {
      margin-right: 12px; }
  .setting__app .setting__app__section__slipDate__referenceDate {
    width: 100%;
    display: flex;
    margin-bottom: 8px; }
    .setting__app .setting__app__section__slipDate__referenceDate h4 {
      font-size: 10px;
      color: #888888; }
  .setting__app .setting__app__section__slipDate__billingDay {
    width: calc(112px * 4 + 40px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 12px; }
  .setting__app .setting__app__section__slipDate__slipDate {
    width: 112px; }
  .setting__app .setting__app__section__slipDate__line {
    display: flex;
    flex-wrap: wrap; }
    .setting__app .setting__app__section__slipDate__line .input__errorText {
      width: 100%; }
    .setting__app .setting__app__section__slipDate__line .setting__app__section__delete {
      position: relative;
      margin-left: 20px;
      margin-right: auto;
      left: auto; }
  .setting__app .setting__app__section__slipDate__line ~ .setting__app__section__slipDate__line {
    margin-top: 8px; }
  .setting__app .setting__app__addCustom__header,
  .setting__app .setting__app__commonTable__header,
  .setting__app .setting__app__section__header {
    padding-bottom: 4px; }
    .setting__app .setting__app__addCustom__header span:first-of-type,
    .setting__app .setting__app__commonTable__header span:first-of-type,
    .setting__app .setting__app__section__header span:first-of-type {
      margin-left: -1px; }
    .setting__app .setting__app__addCustom__header span,
    .setting__app .setting__app__commonTable__header span,
    .setting__app .setting__app__section__header span {
      color: #888888;
      font-size: 10px; }
    .setting__app .setting__app__addCustom__header .setting__app__section__data.setting__app__section__addCustom__data,
    .setting__app .setting__app__commonTable__header .setting__app__section__data.setting__app__section__addCustom__data,
    .setting__app .setting__app__section__header .setting__app__section__data.setting__app__section__addCustom__data {
      min-height: 0; }
    .setting__app .setting__app__addCustom__header .setting__app__addCustom__condition,
    .setting__app .setting__app__commonTable__header .setting__app__addCustom__condition,
    .setting__app .setting__app__section__header .setting__app__addCustom__condition {
      margin-left: auto; }
  .setting__app .setting__app__section__header + .setting__app__section {
    padding-top: 0; }
    .setting__app .setting__app__section__header + .setting__app__section .setting__app__section__delete {
      top: calc(50% - 6px - 8px); }
  .setting__app .setting__app__section__subTitle {
    font-size: 14px; }
  .setting__app .setting__app__section__commonTitle + .setting__app__section__subTitle {
    margin-top: 20px;
    margin-bottom: 4px; }
  .setting__app .setting__app__addCustom, .setting__app .setting__app__commonTable {
    padding: 0;
    min-height: 40px; }
    .setting__app .setting__app__addCustom .setting__app__section__delete, .setting__app .setting__app__commonTable .setting__app__section__delete {
      left: calc(35% + 27.5% - 36px);
      top: 15px;
      transform: scale(1); }
      .setting__app .setting__app__addCustom .setting__app__section__delete:active, .setting__app .setting__app__commonTable .setting__app__section__delete:active {
        transform: scale(0.7);
        transform-origin: center; }
    .setting__app .setting__app__addCustom .setting__app__section__data, .setting__app .setting__app__commonTable .setting__app__section__data {
      overflow: visible; }
  .setting__app .setting__app__addCustom + .setting__app__addCustom, .setting__app .setting__app__commonTable + .setting__app__addCustom, .setting__app .setting__app__addCustom + .setting__app__commonTable, .setting__app .setting__app__commonTable + .setting__app__commonTable {
    margin-top: 12px; }
  .setting__app .setting__app__addCustom:last-child, .setting__app .setting__app__commonTable:last-child {
    margin-bottom: 24px; }
  .setting__app .setting__app__addCustom__check {
    padding-right: 8px;
    width: 120px; }
    .setting__app .setting__app__addCustom__check .checkbox__check {
      margin-right: 8px; }
    .setting__app .setting__app__addCustom__check .setting__app__section__title {
      width: auto;
      font-size: 12px; }
  .setting__app .setting__app__addCustom__itemName {
    position: relative;
    padding-right: 20px;
    width: calc(35% - 120px); }
    .setting__app .setting__app__addCustom__itemName span {
      margin-right: 4px;
      font-size: 10px; }
    .setting__app .setting__app__addCustom__itemName input {
      width: 100%; }
    .setting__app .setting__app__addCustom__itemName .input__errorText {
      position: absolute;
      bottom: -18px;
      left: 40px; }
  .setting__app .setting__app__addCustom ~ .setting__app__section__commonTitle, .setting__app .setting__app__commonTable ~ .setting__app__section__commonTitle {
    border-top: 1px solid #e0e0e0;
    padding-top: 24px; }
  .setting__app .setting__app__addCustom ~ .setting__app__section__subTitle, .setting__app .setting__app__commonTable ~ .setting__app__section__subTitle {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #cccccc; }
  .setting__app .setting__app__section__commonTitle + .setting__app__addCustom, .setting__app .setting__app__section__commonTitle + .setting__app__commonTable {
    margin-top: 16px; }
  .setting__app .setting__app__section__data.setting__app__section__addCustom__data {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 27.5%;
    min-height: 26px;
    margin-right: 0;
    padding-right: 48px; }
    .setting__app .setting__app__section__data.setting__app__section__addCustom__data span {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      font-size: 10px; }
  .setting__app .setting__app__addCustom__condition {
    width: calc(36.5% - 234px); }
    .setting__app .setting__app__addCustom__condition.select {
      width: calc(36.5% - 234px);
      padding-left: 0;
      margin-right: 0;
      margin-left: auto; }
  .setting__app .setting__app__commonTable {
    min-height: 0;
    align-items: flex-start; }
    .setting__app .setting__app__commonTable:not(.setting__app__commonTable__header) .setting__app__commonTable__check {
      margin-top: 4px; }
    .setting__app .setting__app__commonTable .setting__app__section__delete {
      position: relative;
      left: auto;
      top: auto; }
  .setting__app .setting__app__commonTable--alignCenter {
    align-items: center; }
  .setting__app .setting__app__commonTable ~ .setting__app__section__commonTitle {
    border-top: none; }
  .setting__app .setting__app__commonTable__check {
    width: 120px; }
    .setting__app .setting__app__commonTable__check .setting__app__section__title {
      width: auto; }
  .setting__app .setting__app__commonTable__homeItemName {
    width: 152px; }
    .setting__app .setting__app__commonTable__homeItemName input {
      width: 100%; }
  .setting__app .setting__app__commonTable__accessLimit__userName,
  .setting__app .setting__app__commonTable__circulation__userName {
    width: 256px; }
  .setting__app .setting__app__commonTable__accessLimit__userId,
  .setting__app .setting__app__commonTable__circulation__userId {
    width: 256px; }
  .setting__app .setting__app__commonTable__accessLimit__bumon,
  .setting__app .setting__app__commonTable__circulation__bumon {
    width: 256px; }
  .setting__app .setting__app__commonTable__accessLimit__role,
  .setting__app .setting__app__commonTable__circulation__role {
    width: 144px; }
  .setting__app .setting__app__commonTable__circulation__privilege {
    width: 96px; }
  .setting__app .setting__app__commonTable__API__name {
    width: 168px; }
  .setting__app .setting__app__commonTable__API__key {
    padding-left: 8px;
    width: calc(100% - 168px);
    display: flex;
    align-items: center; }
    .setting__app .setting__app__commonTable__API__key .icon-cancel.setting__app__section__delete {
      position: relative;
      top: auto;
      left: auto;
      vertical-align: middle;
      margin-left: 20px; }
  .setting__app .setting__app__commonTable__API__systemInput {
    display: flex;
    align-items: center; }
    .setting__app .setting__app__commonTable__API__systemInput input[type="text"] {
      width: 168px; }
    .setting__app .setting__app__commonTable__API__systemInput .button {
      margin-left: 8px; }

.setting__app--csvOutput {
  padding-left: 0;
  padding-bottom: 8px; }
  .setting__app--csvOutput .setting__app__section__commonTitle {
    margin-left: 30px; }

.setting__app ~ .switch--tab {
  transform: translateX(8px);
  margin-left: 0; }
  .setting__app ~ .switch--tab .switch--tab__button {
    height: 72px; }

.setting__app__section__function__buttonArea {
  margin-top: 16px;
  padding-top: 16px;
  width: 100%;
  display: flex;
  position: relative;
  justify-content: center;
  border-top: 1px solid #cccccc; }
  .setting__app__section__function__buttonArea .button ~ .button {
    margin-left: 16px; }
  .setting__app__section__function__buttonArea .setting__app__section__function__leftButton {
    position: absolute;
    left: 0; }
    .setting__app__section__function__buttonArea .setting__app__section__function__leftButton span {
      font-size: 12px; }
      .setting__app__section__function__buttonArea .setting__app__section__function__leftButton span::before {
        font-size: 14px;
        margin-right: 8px; }
  .setting__app__section__function__buttonArea .setting__app__section__function__leftButton + .button {
    margin-left: 0; }
  .setting__app__section__function__buttonArea .setting__app__section__function__leftButton:only-child {
    position: relative;
    margin-right: auto; }
  .setting__app__section__function__buttonArea .setting__app__section__changeNotice {
    position: absolute;
    font-size: 10px;
    font-weight: bold;
    color: #23D19D;
    right: calc(50% - 280px);
    top: 22px;
    width: 104px; }

.setting__app__changedMasterText {
  position: absolute;
  left: 174px;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.05em;
  bottom: -6px;
  color: #23D19D; }

.setting__app__changedMasterText--delete {
  padding: 0;
  left: 174px;
  font-size: 10px;
  font-weight: bold;
  height: auto;
  letter-spacing: 0.05em;
  top: calc(50% - 7px);
  color: #D0021B; }

.setting__app__note {
  font-size: 10px;
  color: #888888;
  width: 100%;
  margin-left: 110px;
  line-height: 1.25em;
  margin-top: 8px; }

.setting__app__checkbox {
  width: 100%; }

.setting__singleLine {
  padding: 15px 0px;
  display: flex;
  align-items: center;
  position: relative;
  flex-wrap: wrap; }
  .setting__singleLine .select,
  .setting__singleLine input[type="text"] {
    margin-right: 16px;
    width: 595px; }
  .setting__singleLine .setting__singleLine__title {
    width: 140px; }
  .setting__singleLine .setting__singleLine__notice {
    font-size: 12px;
    margin-right: 16px; }
  .setting__singleLine .setting__singleLine__notice--strong {
    font-weight: bold; }
  .setting__singleLine .setting__singleLine__notice--checked {
    color: #23D19D; }
  .setting__singleLine .setting__singleLine__errorText--withTitle {
    margin-left: 140px; }

.setting__mail {
  margin: 16px 32px; }
  .setting__mail .setting__mail__header {
    border-bottom: 1px solid #cccccc; }
    .setting__mail .setting__mail__header .setting__mail__header__role {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: 10px 0px; }
      .setting__mail .setting__mail__header .setting__mail__header__role p {
        width: 100px;
        text-align: center; }
        .setting__mail .setting__mail__header .setting__mail__header__role p:last-child {
          margin-right: 30px; }
  .setting__mail .setting__mail__line {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-bottom: 1px solid #cccccc;
    padding: 10px 0px; }
    .setting__mail .setting__mail__line .setting__mail__line__mailinfo {
      display: flex;
      align-items: center;
      justify-content: start;
      flex-grow: 1;
      padding-left: 30px; }
      .setting__mail .setting__mail__line .setting__mail__line__mailinfo figure {
        text-align: center;
        width: 32px;
        margin: 0px; }
        .setting__mail .setting__mail__line .setting__mail__line__mailinfo figure span {
          color: #cccccc;
          font-size: 22px; }
        .setting__mail .setting__mail__line .setting__mail__line__mailinfo figure .icon-send {
          font-size: 21px; }
        .setting__mail .setting__mail__line .setting__mail__line__mailinfo figure .icon-sendback {
          font-size: 25px; }
      .setting__mail .setting__mail__line .setting__mail__line__mailinfo .setting__mail__name {
        margin: 0px 30px;
        font-size: 14px; }
    .setting__mail .setting__mail__line .setting__mail__line__role {
      display: flex;
      align-items: center;
      margin-right: 30px; }
      .setting__mail .setting__mail__line .setting__mail__line__role .setting__mail__role__check {
        width: 100px;
        height: 20px;
        border-right: 1px dashed #cccccc;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer; }
        .setting__mail .setting__mail__line .setting__mail__line__role .setting__mail__role__check:last-child {
          border-right: 0px dashed #cccccc; }
        .setting__mail .setting__mail__line .setting__mail__line__role .setting__mail__role__check:active .checkbox__check {
          transform: scale(0.7); }
        .setting__mail .setting__mail__line .setting__mail__line__role .setting__mail__role__check .checkbox__check {
          width: 17px;
          height: 17px;
          transition: 0.12s ease-in-out;
          position: relative;
          border-color: #e0e0e0;
          border-radius: 4px; }
          .setting__mail .setting__mail__line .setting__mail__line__role .setting__mail__role__check .checkbox__check::before {
            width: 8px;
            height: 3px;
            top: 4px;
            left: 3px; }
  .setting__mail .setting__mail__add_user {
    height: 60px;
    display: flex;
    padding-left: 20px;
    flex-direction: row;
    justify-content: start;
    align-items: center; }
  .setting__mail .setting__mail__footer {
    height: 60px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center; }

.setting__user {
  margin: 16px 32px; }
  .setting__user .setting__user__header {
    border-bottom: 1px solid #cccccc; }
    .setting__user .setting__user__header .setting__user__header__role {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: 10px 0px; }
      .setting__user .setting__user__header .setting__user__header__role p {
        width: 100px;
        text-align: center; }
        .setting__user .setting__user__header .setting__user__header__role p:last-child {
          margin-right: 100px; }
  .setting__user .setting__user__header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 10px 94px 10px 26px;
    width: 100%; }
    .setting__user .setting__user__header .setting__user__name,
    .setting__user .setting__user__header .setting__user__id,
    .setting__user .setting__user__header .setting__user__mail,
    .setting__user .setting__user__header .setting__user__bumon,
    .setting__user .setting__user__header .setting__user__line__roleSingle {
      font-size: 10px; }
  .setting__user .setting__user__line {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-bottom: 1px solid #cccccc;
    padding: 10px 0px;
    width: 100%; }
  .setting__user .setting__user__line__userinfo {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-grow: 1;
    padding-left: 30px;
    width: calc(100% - 136px - 104px); }
    .setting__user .setting__user__line__userinfo figure {
      margin: 0px; }
    .setting__user .setting__user__line__userinfo img {
      width: 26px;
      height: 26px; }
  .setting__user .setting__user__name {
    padding-left: 32px;
    font-size: 14px;
    width: 20%; }
  .setting__user .setting__user__id {
    padding-left: 16px;
    width: 20%; }
  .setting__user .setting__user__mail {
    padding-left: 16px;
    width: 40%; }
  .setting__user .setting__user__bumon {
    padding-left: 16px;
    width: 20%; }
  .setting__user .setting__user__line__role {
    display: flex;
    align-items: center; }
    .setting__user .setting__user__line__role .setting__user__role__check {
      width: 100px;
      height: 20px;
      border-right: 1px dashed #cccccc;
      display: flex;
      align-items: center;
      justify-content: center; }
      .setting__user .setting__user__line__role .setting__user__role__check:last-child {
        border-right: 0px dashed #cccccc; }
      .setting__user .setting__user__line__role .setting__user__role__check span {
        color: #23D19D;
        font-size: 22px; }
  .setting__user .setting__user__line__roleSingle {
    width: 120px;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-left: 16px; }
  .setting__user .setting__user__setting_btn {
    margin-right: 28px;
    width: 40px;
    margin-left: 24px; }
    .setting__user .setting__user__setting_btn .icon-setting {
      font-size: 16px;
      line-height: 20px; }
  .setting__user .setting__user__footer {
    height: 60px;
    display: flex;
    padding-left: 20px;
    padding-right: 20px;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; }
    .setting__user .setting__user__footer .icon-plus:before {
      margin-right: 10px; }

.setting__user__multiItem {
  display: flex;
  align-items: center;
  width: 100%;
  position: relative; }
  .setting__user__multiItem .confirm__fillIn__detail__addItem.popup__text {
    width: calc(100% - 68px); }
    .setting__user__multiItem .confirm__fillIn__detail__addItem.popup__text .icon-edit {
      z-index: auto; }
  .setting__user__multiItem .icon-cancel {
    position: absolute;
    padding: 0;
    right: 52px;
    transition: 0.1s ease;
    backface-visibility: visible;
    transform: scale(1);
    color: #373737;
    font-size: 10px; }
    .setting__user__multiItem .icon-cancel:active {
      transform: scale(0.7); }
  .setting__user__multiItem .button {
    position: absolute;
    right: 0; }

.setting__user__multiItem ~ .setting__user__multiItem {
  margin-top: 8px; }

.setting__customer__searchLine {
  margin: 16px 32px;
  display: flex;
  flex-wrap: wrap; }
  .setting__customer__searchLine .setting__customer__search {
    position: relative;
    width: 318px; }
    .setting__customer__searchLine .setting__customer__search input {
      height: 26px;
      width: 100%; }
    .setting__customer__searchLine .setting__customer__search input::placeholder,
    .setting__customer__searchLine .setting__customer__search input:placeholder-shown {
      font-size: 10px; }
    .setting__customer__searchLine .setting__customer__search .icon-loupe {
      position: absolute;
      top: 50%;
      right: 8px;
      transform: translateY(-50%);
      background-color: #ffffff; }
  .setting__customer__searchLine .button {
    margin-left: 8px; }
  .setting__customer__searchLine .list__result__amount {
    margin-left: auto;
    margin-bottom: 0; }

.setting__customer {
  margin: 16px 32px; }
  .setting__customer .setting__customer__buttonAreaLine {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    height: 60px;
    border-bottom: 1px solid #cccccc; }
    .setting__customer .setting__customer__buttonAreaLine .button {
      margin-right: 16px;
      border-radius: 5px; }
      .setting__customer .setting__customer__buttonAreaLine .button [class*="icon-"]::before {
        margin-right: 10px; }
    .setting__customer .setting__customer__buttonAreaLine input[type="file"] {
      display: none; }
  .setting__customer .setting__customer__header .setting__customer__companyName,
  .setting__customer .setting__customer__header .setting__customer__bankName,
  .setting__customer .setting__customer__header .setting__customer__branchName,
  .setting__customer .setting__customer__header .setting__customer__accountType,
  .setting__customer .setting__customer__header .setting__customer__accontNumber,
  .setting__customer .setting__customer__header .setting__customer__accountHolder {
    font-size: 10px; }
  .setting__customer .setting__customer__companyName {
    width: 25%; }
  .setting__customer .setting__customer__bankName {
    width: 15%; }
  .setting__customer .setting__customer__branchName {
    width: 13%; }
  .setting__customer .setting__customer__accountType {
    width: 6%; }
  .setting__customer .setting__customer__accontNumber {
    width: 9%; }
  .setting__customer .setting__customer__accountHolder {
    width: 20%; }
  .setting__customer .setting__customer__profile {
    margin-right: 32px; }
  .setting__customer .setting__customer__header {
    border-bottom: 1px solid #cccccc;
    display: flex;
    align-items: center; }
    .setting__customer .setting__customer__header .setting__customer__companyName {
      margin-left: 60px; }
  .setting__customer .setting__customer__line {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #cccccc;
    padding: 10px 28px; }
    .setting__customer .setting__customer__line p {
      font-size: 14px; }
    .setting__customer .setting__customer__line figure {
      margin-top: 0px;
      margin-bottom: 0px;
      margin-left: 0px; }
    .setting__customer .setting__customer__line img {
      width: 26px;
      height: 26px; }
    .setting__customer .setting__customer__line .setting__customer__setting_btn {
      width: 40px;
      margin-left: auto; }
      .setting__customer .setting__customer__line .setting__customer__setting_btn .icon-setting {
        font-size: 16px;
        line-height: 20px; }

.setting__dashboard {
  margin: 16px 32px;
  padding: 0px 30px; }
  .setting__dashboard .setting__dashboard__header {
    border-bottom: 1px solid #cccccc; }
    .setting__dashboard .setting__dashboard__header .setting__dashboard__period {
      display: flex;
      flex-direction: row;
      align-items: center;
      padding: 20px 0px 7px; }
      .setting__dashboard .setting__dashboard__header .setting__dashboard__period span {
        margin-left: auto;
        margin-right: 10px;
        color: #888888; }
  .setting__dashboard .setting__dashboard__title {
    display: flex;
    align-items: center;
    padding-top: 20px; }
  .setting__dashboard .setting__dashboard__sort {
    display: flex;
    align-items: center; }
    .setting__dashboard .setting__dashboard__sort span {
      margin-right: 10px;
      color: #888888; }
  .setting__dashboard .setting__dashboard__sort ~ .setting__dashboard__sort {
    margin-left: 20px; }
  .setting__dashboard .setting__app__section__subTitle + .setting__dashboard__sort {
    margin-left: auto; }
  .setting__dashboard .setting__viewSwitch {
    border: 1px solid #cccccc;
    border-radius: 5px;
    width: 72px;
    height: 26px;
    display: flex;
    overflow: hidden; }
    .setting__dashboard .setting__viewSwitch .setting__viewSwitch__button {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 50%;
      height: 100%;
      cursor: pointer; }
    .setting__dashboard .setting__viewSwitch input[type="radio"] {
      display: none; }
    .setting__dashboard .setting__viewSwitch span {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center; }
      .setting__dashboard .setting__viewSwitch span::before {
        font-size: 10px;
        display: flex; }
    .setting__dashboard .setting__viewSwitch .icon-detail_open::before {
      font-size: 12px; }
    .setting__dashboard .setting__viewSwitch input[type="radio"]:checked ~ span {
      background-color: #f5f5f5;
      color: #23D19D; }
  .setting__dashboard .setting__dashboard__body {
    padding-top: 15px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: row; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__date {
      margin-bottom: 12px; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__content {
      width: 100%; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__content .setting__dashboard__information {
        display: flex;
        justify-content: space-between; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea {
      max-height: calc(100vh - 320px);
      min-height: 400px;
      overflow: auto;
      box-sizing: border-box; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea .setting__viewSwitch {
        margin-left: 15px;
        margin-right: auto; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__header {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      position: sticky;
      top: 0;
      background-color: #ffffff;
      z-index: 3; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input {
      display: flex;
      align-items: center;
      margin-left: 15px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input span {
        font-size: 10px;
        color: #888888;
        margin-right: 8px; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text {
      position: relative; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text :placeholder-shown {
        letter-spacing: -0.045em;
        font-size: 12px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text ::-webkit-input-placeholder {
        letter-spacing: -0.045em;
        font-size: 12px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text :-moz-placeholder {
        letter-spacing: -0.045em;
        font-size: 12px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text ::-moz-placeholder {
        letter-spacing: -0.045em;
        font-size: 12px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text :-ms-input-placeholder {
        letter-spacing: -0.045em;
        font-size: 12px;
        transform: translateY(1px); }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text ::-ms-input-placeholder {
        letter-spacing: -0.045em;
        font-size: 12px;
        transform: translateY(1px); }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text input {
        width: 140px;
        padding-right: 24px;
        font-size: 12px; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text .icon-loupe {
        position: absolute;
        right: 0px;
        top: 7px; }
        .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__input--text .icon-loupe::before {
          color: #373737;
          font-size: 12px; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__monthLine {
      border-top: 2px solid #cccccc;
      border-bottom: 2px solid #cccccc;
      width: 100%;
      display: flex;
      margin-top: 10px; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__month {
      width: calc(100% / 12);
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      font-size: 14px;
      padding: 8px 0;
      cursor: pointer; }
      .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__month span {
        color: #888888; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__month--selected span {
      color: #00B881; }
    .setting__dashboard .setting__dashboard__body .setting__dashboard__graphArea__month__year {
      width: 100%;
      font-size: 10px;
      text-align: center;
      line-height: 1em; }
  .setting__dashboard .setting__dashboard__graphArea__graph {
    border-bottom: 2px solid #cccccc; }
  .setting__dashboard .setting__dashboard__graphArea__graph__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0; }
  .setting__dashboard .setting__dashboard__graphArea__toggle {
    position: relative;
    margin-left: auto;
    width: 10px;
    height: 10px;
    margin-right: 10px;
    transform: rotate(180deg);
    text-align: center;
    cursor: pointer;
    transition: 0.09s ease; }
    .setting__dashboard .setting__dashboard__graphArea__toggle::before {
      z-index: 2;
      position: relative;
      left: -1px;
      top: -3px;
      font-size: 10px;
      line-height: 10px; }
    .setting__dashboard .setting__dashboard__graphArea__toggle::after {
      content: "";
      background-color: #f5f5f5;
      border-radius: 50%;
      width: 29px;
      height: 29px;
      position: absolute;
      top: 50%;
      left: 50%;
      transition: 0.06s ease;
      transform: translateX(-50%) translateY(-50%) scale(0);
      z-index: 1; }
    .setting__dashboard .setting__dashboard__graphArea__toggle:active::after {
      transform: translateX(-50%) translateY(-50%) scale(1); }
  .setting__dashboard .setting__dashboard__graphArea__graph__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    transform-origin: top;
    opacity: 1;
    transform: scaleY(1);
    height: 42px; }
  .setting__dashboard .setting__dashboard__graphArea__fee {
    width: calc(100% / 12);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    cursor: pointer;
    position: relative;
    padding: 12px 0;
    color: #888888; }
  .setting__dashboard .setting__dashboard__graphArea__fee ~ .setting__dashboard__graphArea__fee::before {
    content: "";
    width: 1px;
    height: 18px;
    position: absolute;
    left: -0.5px;
    top: 50%;
    background-color: #cccccc;
    transform: translateY(-50%); }
  .setting__dashboard .setting__dashboard__graphArea__fee--selected span {
    color: #00B881; }
  .setting__dashboard .setting__dashboard__graphArea__fee--selected:after {
    content: "";
    height: 2px;
    width: 100%;
    background-color: #23D19D;
    position: absolute;
    bottom: -2px;
    left: 0;
    opacity: 1;
    transition: 0.03s ease opacity; }
  .setting__dashboard .setting__dashboard__graphArea__graph--closed .setting__dashboard__graphArea__toggle {
    transform: rotate(0); }
  .setting__dashboard .setting__dashboard__graphArea__graph--closed .setting__dashboard__graphArea__graph__footer {
    opacity: 0;
    height: 0;
    transform: scaleY(0); }
  .setting__dashboard .setting__dashboard__graphArea__graph--closed .setting__dashboard__graphArea__fee--selected:after {
    opacity: 0; }
  .setting__dashboard .setting__dashboard__list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px;
    flex-wrap: wrap; }
    .setting__dashboard .setting__dashboard__list .setting__dashboard__list__title {
      width: 100%;
      text-align: left;
      font-size: 10px; }
    .setting__dashboard .setting__dashboard__list .setting__dashboard__list__content {
      display: flex;
      align-items: center;
      width: 100%;
      margin-top: 2px; }
      .setting__dashboard .setting__dashboard__list .setting__dashboard__list__content *:only-child {
        margin-right: 0; }
      .setting__dashboard .setting__dashboard__list .setting__dashboard__list__content strong {
        font-size: 18px; }
      .setting__dashboard .setting__dashboard__list .setting__dashboard__list__content span {
        color: #888888; }
  .setting__dashboard .setting__dashboard__list--plan {
    border-left: 1px solid #cccccc;
    padding-left: 20px; }
  .setting__dashboard .setting__dashboard__list--count {
    width: 30%;
    border-bottom: 1px solid #cccccc;
    display: flex;
    min-height: 42px; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__title {
      width: 104px;
      margin-right: auto; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__content {
      width: calc(100% - 104px);
      display: flex;
      justify-content: flex-end;
      flex-wrap: wrap; }
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__content strong {
        margin: 0 4px;
        line-height: 1.2em;
        font-size: 20px; }
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__content span {
        margin-top: auto;
        font-size: 10px; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__subLine {
      display: flex;
      justify-content: flex-end;
      width: 100%; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__BPOcount,
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__failed {
      display: flex;
      justify-content: flex-end;
      align-items: flex-start;
      margin-bottom: 5px; }
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__BPOcount strong, .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__BPOcount span,
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__failed strong,
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__failed span {
        font-size: 10px;
        line-height: 1.6em;
        margin-top: 0;
        color: #888888; }
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__BPOcount strong,
      .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__failed strong {
        margin: 0 3px; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__failed {
      margin-left: 2px; }
    .setting__dashboard .setting__dashboard__list--count .setting__dashboard__list__BPOcount ~ .setting__dashboard__list__failed::before {
      content: "/";
      font-size: 10px;
      line-height: 1.6em;
      margin-top: 0;
      padding-right: 2px;
      color: #888888; }

.setting__buttonwrap {
  padding: 10px 30px;
  text-align: right; }
  .setting__buttonwrap button {
    margin-left: 10px; }
    .setting__buttonwrap button span:before {
      margin-right: 10px; }
  .setting__buttonwrap .setting__button__savedText {
    color: #23D19D; }

.setting__portButton {
  padding: 0; }

.setting__user__modal {
  width: 100%; }
  .setting__user__modal h4 {
    margin-bottom: 20px; }

.setting__user__modal__wrap,
.setting__modal__wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%; }
  .setting__user__modal__wrap h4,
  .setting__modal__wrap h4 {
    width: 100%; }

.setting__user__modal__left,
.setting__user__modal__right {
  width: calc(100% / 2 - 16px); }

.setting__user__modal__line,
.setting__modal__line {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%; }
  .setting__user__modal__line dt,
  .setting__modal__line dt {
    width: 96px;
    padding-top: 6px;
    padding-right: 8px;
    font-size: 10px; }
  .setting__user__modal__line dd,
  .setting__modal__line dd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% - 96px);
    min-height: 26px; }
    .setting__user__modal__line dd input[type="text"], .setting__user__modal__line dd input[type="email"],
    .setting__modal__line dd input[type="text"],
    .setting__modal__line dd input[type="email"] {
      width: 100%;
      font-size: 12px; }
    .setting__user__modal__line dd > img,
    .setting__modal__line dd > img {
      width: 26px;
      height: 26px;
      margin-left: 12px; }
    .setting__user__modal__line dd .button--flat,
    .setting__modal__line dd .button--flat {
      padding-top: 5px;
      padding-bottom: 4px;
      font-size: 8px; }

.setting__user__modal__line + .setting__user__modal__line {
  margin-top: 16px; }

.setting__user__modal__noticePassReset {
  font-size: 10px;
  color: #D0021B;
  width: 100%;
  text-align: right; }

.setting__profile__upload {
  background-color: #f5f5f5;
  width: calc(100% - 56px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 4px 12px;
  margin-left: auto; }
  .setting__profile__upload input[type="file"] {
    display: none;
    font-size: 12px; }
  .setting__profile__upload p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }

.setting__user__modal__buttonArea,
.setting__modal__buttonArea {
  width: 100%;
  margin-top: 40px;
  position: relative;
  text-align: center; }
  .setting__user__modal__buttonArea button,
  .setting__modal__buttonArea button {
    font-weight: normal; }
  .setting__user__modal__buttonArea button + button,
  .setting__modal__buttonArea button + button {
    margin-left: 12px; }

.cancel__text {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  color: #D0021B; }

.setting__customer__modal.modal__wrap {
  width: 100%;
  max-height: 100%; }

.setting__company {
  margin: 16px 32px;
  padding: 20px 30px; }

.setting__customer__modal__wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%; }

.setting__customer__modal__line,
.setting__company__line {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%; }

.setting__customer__modal__line + .setting__customer__modal__line,
.setting__company__line + .setting__company__line {
  margin-top: 12px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0; }

.setting__company__bankLine {
  border-top: 1px solid #e0e0e0;
  margin-top: 8px;
  padding-top: 16px;
  max-height: 400px;
  transition: 0.45s ease;
  overflow: hidden; }
  .setting__company__bankLine .setting__company__line + .setting__company__line {
    border-top: none;
    margin-top: 0;
    padding-top: 0; }

.setting__company__bankLine--closed {
  max-height: 36px; }
  .setting__company__bankLine--closed .setting__company__bankLine__header .setting__company__toggle {
    transform: rotate(0deg); }

.setting__company__bankLine__header {
  display: flex;
  justify-content: space-between;
  margin-top: -8px;
  margin-bottom: 8px; }
  .setting__company__bankLine__header .setting__company__title {
    width: 114px; }
  .setting__company__bankLine__header .radiobox {
    display: flex;
    align-items: center;
    margin-right: auto; }

.setting__company__toggle {
  position: relative;
  margin-left: auto;
  width: 24px;
  height: 24px;
  transform: rotate(180deg);
  text-align: center;
  transition: 0.09s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 4px;
  margin-top: 2px; }
  .setting__company__toggle::before {
    z-index: 2;
    position: relative; }
  .setting__company__toggle::after {
    content: "";
    background-color: #f5f5f5;
    border-radius: 50%;
    width: 29px;
    height: 29px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: 0.06s ease;
    transform: translateX(-50%) translateY(-50%) scale(0);
    z-index: 1; }
  .setting__company__toggle:active::after {
    transform: translateX(-50%) translateY(-50%) scale(1); }

.setting__company__fee__line {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px; }
  .setting__company__fee__line > div,
  .setting__company__fee__line > span {
    width: calc(100% / 6 - 8px);
    position: relative; }
  .setting__company__fee__line > span {
    margin-top: 8px; }
  .setting__company__fee__line span {
    font-size: 10px;
    color: #888888; }
  .setting__company__fee__line > div:first-child input {
    padding-right: 24px; }
  .setting__company__fee__line > div:first-child::after {
    content: "〜";
    position: absolute;
    right: 8px;
    top: 3px;
    font-size: 12px;
    color: #373737; }
  .setting__company__fee__line > div span {
    font-size: 12px;
    color: #373737; }
  .setting__company__fee__line input {
    width: 100%; }

.setting__customer__modal__title,
.setting__company__title {
  margin-top: 4px;
  width: 114px; }

.setting__customer__modal__content,
.setting__company__content {
  width: calc(100% - 114px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

.setting__customer__modal__line .modal__bankSelect__info,
.setting__customer__modal__line .modal__feeSelect__info {
  min-height: 15px; }

.select--disable ~ .modal__bankSelect__info,
.select--disable ~ .modal__feeSelect__info {
  opacity: 0.55; }

.setting__customer__modal__list,
.setting__company__list {
  width: 100%;
  display: inline-flex;
  margin-bottom: 8px; }
  .setting__customer__modal__list dt,
  .setting__company__list dt {
    width: 96px;
    padding-top: 6px;
    padding-right: 8px;
    font-size: 10px;
    color: #888888; }
  .setting__customer__modal__list dd,
  .setting__company__list dd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% - 96px);
    min-height: 26px; }
    .setting__customer__modal__list dd input[type="text"],
    .setting__customer__modal__list dd .select,
    .setting__company__list dd input[type="text"],
    .setting__company__list dd .select {
      width: 100%;
      font-size: 12px; }
    .setting__customer__modal__list dd > img,
    .setting__company__list dd > img {
      width: 26px;
      height: 26px;
      margin-left: 12px; }
    .setting__customer__modal__list dd :placeholder-shown,
    .setting__company__list dd :placeholder-shown {
      letter-spacing: -0.045em;
      font-size: 12px; }
    .setting__customer__modal__list dd ::-webkit-input-placeholder,
    .setting__company__list dd ::-webkit-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px; }
    .setting__customer__modal__list dd :-moz-placeholder,
    .setting__company__list dd :-moz-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px; }
    .setting__customer__modal__list dd ::-moz-placeholder,
    .setting__company__list dd ::-moz-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px; }
    .setting__customer__modal__list dd :-ms-input-placeholder,
    .setting__company__list dd :-ms-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      transform: translateY(1px); }
    .setting__customer__modal__list dd ::-ms-input-placeholder,
    .setting__company__list dd ::-ms-input-placeholder {
      letter-spacing: -0.045em;
      font-size: 12px;
      transform: translateY(1px); }
  .setting__customer__modal__list .popup__text,
  .setting__company__list .popup__text {
    position: relative;
    display: flex;
    align-items: center; }
    .setting__customer__modal__list .popup__text input,
    .setting__company__list .popup__text input {
      width: 100%;
      padding-right: calc(100% - 154px);
      box-sizing: border-box;
      background-color: #ffffff; }
    .setting__customer__modal__list .popup__text .confirm__fillIn__code__text,
    .setting__company__list .popup__text .confirm__fillIn__code__text {
      position: absolute;
      top: 0;
      padding-right: 22px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      color: #888888;
      box-sizing: border-box;
      line-height: 27px;
      pointer-events: none;
      z-index: 1;
      width: calc(100% - 154px);
      left: 154px; }
    .setting__customer__modal__list .popup__text .icon-edit,
    .setting__company__list .popup__text .icon-edit {
      position: absolute;
      top: 6px;
      right: 8px;
      cursor: pointer;
      z-index: 12; }
      .setting__customer__modal__list .popup__text .icon-edit::after,
      .setting__company__list .popup__text .icon-edit::after {
        content: "";
        width: 20px;
        height: 18px;
        background-color: #000000;
        position: absolute;
        border-radius: 4px;
        left: 50%;
        top: 50%;
        opacity: 0;
        transition: 0.1s ease;
        -webkit-transform: translateY(-50%) translateX(-50%);
        transform: translateY(-50%) translateX(-50%); }
      .setting__customer__modal__list .popup__text .icon-edit:hover::after,
      .setting__company__list .popup__text .icon-edit:hover::after {
        opacity: 0.1; }
      .setting__customer__modal__list .popup__text .icon-edit:hover .confirm__fillIn__code__tooltip,
      .setting__company__list .popup__text .icon-edit:hover .confirm__fillIn__code__tooltip {
        transform: scaleY(1);
        transition: 0.3s ease;
        transition-delay: 0.75s; }
    .setting__customer__modal__list .popup__text .icon-edit--disable,
    .setting__company__list .popup__text .icon-edit--disable {
      opacity: 0.1;
      pointer-events: none; }
    .setting__customer__modal__list .popup__text .confirm__fillIn__code__tooltip,
    .setting__company__list .popup__text .confirm__fillIn__code__tooltip {
      position: absolute;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 4px;
      right: -8px;
      left: auto;
      top: 16px;
      font-weight: normal;
      color: #5a5a5a;
      border: 1px solid #cccccc;
      font-size: 12px;
      width: 140px;
      background-color: #eeeeee;
      padding: 4px 8px;
      transform: scaleY(0);
      transform-origin: top;
      transition: 0.15s ease;
      z-index: 5; }

.setting__user__modal .popup__text {
  position: relative;
  display: flex;
  align-items: center; }
  .setting__user__modal .popup__text input {
    width: 100%;
    padding-right: calc(100% - 154px);
    box-sizing: border-box;
    background-color: #ffffff; }
  .setting__user__modal .popup__text .confirm__fillIn__code__text {
    position: absolute;
    top: 0;
    padding-right: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #888888;
    box-sizing: border-box;
    line-height: 27px;
    pointer-events: none;
    z-index: 1;
    width: calc(100% - 154px);
    left: 154px; }
  .setting__user__modal .popup__text .icon-edit {
    position: absolute;
    top: 6px;
    right: 8px;
    cursor: pointer;
    z-index: 12; }
    .setting__user__modal .popup__text .icon-edit::after {
      content: "";
      width: 20px;
      height: 18px;
      background-color: #000000;
      position: absolute;
      border-radius: 4px;
      left: 50%;
      top: 50%;
      opacity: 0;
      transition: 0.1s ease;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
    .setting__user__modal .popup__text .icon-edit:hover::after {
      opacity: 0.1; }
    .setting__user__modal .popup__text .icon-edit:hover .confirm__fillIn__code__tooltip {
      transform: scaleY(1);
      transition: 0.3s ease;
      transition-delay: 0.75s; }
  .setting__user__modal .popup__text .icon-edit--disable {
    opacity: 0.1;
    pointer-events: none; }
  .setting__user__modal .popup__text .confirm__fillIn__code__tooltip {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    right: -8px;
    left: auto;
    top: 16px;
    font-weight: normal;
    color: #5a5a5a;
    border: 1px solid #cccccc;
    font-size: 12px;
    width: 140px;
    background-color: #eeeeee;
    padding: 4px 8px;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.15s ease;
    z-index: 5; }

.setting__customer__modal__list--half,
.setting__company__list--half {
  width: calc(50% - 8px);
  align-items: flex-start; }

.setting__customer__modal__list--oneThird,
.setting__company__list--oneThird {
  width: calc(100% / 3 - 12px); }

.setting__company__list--oneThird:last-of-type:not(:nth-of-type(3n)) {
  margin-left: 18px;
  margin-right: auto; }

.setting__company__list--twoThird {
  width: calc(100% / 3 * 2 - 6px); }

.setting__company__list--oneQuarter {
  width: calc(100% / 4 - 12px);
  align-items: flex-start; }

.setting__company__checkboxFull {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start; }
  .setting__company__checkboxFull .checkbox {
    display: flex;
    align-items: center;
    margin-right: 16px;
    max-width: 200px; }
  .setting__company__checkboxFull .setting__company__note {
    padding-top: 2px;
    box-sizing: border-box;
    max-width: calc(100% - 200px); }

.setting__customer__modal__note {
  font-size: 10px;
  color: #888888;
  margin-top: 4px;
  margin-bottom: 8px; }

.setting__customer__modal__buttonArea,
.setting__company__buttonArea {
  width: 100%;
  margin-top: 12px;
  padding-top: 16px;
  position: relative;
  text-align: center;
  border-top: 1px solid #e0e0e0; }
  .setting__customer__modal__buttonArea button,
  .setting__company__buttonArea button {
    font-weight: normal; }
  .setting__customer__modal__buttonArea button + button,
  .setting__company__buttonArea button + button {
    margin-left: 12px; }

.setting__customer__modal__note {
  border-top: 1px solid #e0e0e0;
  width: 100%;
  margin-top: 8px;
  padding-top: 12px; }

.setting__customer__modal__buttonArea {
  border: none;
  margin-top: 0; }

.setting__company__buttonArea {
  border-top: none;
  padding-top: 0; }
  .setting__company__buttonArea .setting__app__section__changeNotice {
    position: absolute;
    top: 8px;
    right: calc(50% - 336px);
    transform: translateX(-50%);
    font-size: 10px;
    font-weight: bold;
    color: #23D19D; }

.setting__company__optionArea {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-top: 1px solid #e0e0e0;
  margin-top: 8px;
  padding-top: 12px; }
  .setting__company__optionArea .button {
    min-width: 160px; }
    .setting__company__optionArea .button span::before {
      margin-right: 10px; }

.setting__company__note {
  width: 100%;
  color: #888888;
  font-size: 10px; }
  .setting__company__note .setting__required {
    line-height: 1em; }

.setting__required {
  font-size: 16px;
  line-height: 0px;
  margin-left: 2px;
  color: #F0AD3E; }

.setting__company__list-multiColumn {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center; }

.setting__company__list-multiColumn ~ .setting__company__list-multiColumn {
  margin-top: 8px; }

.setting__company__list-multiColumn__title {
  font-size: 10px;
  color: #888888; }

.setting__company__list-multiColumn__check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 100%;
  margin-right: auto; }

.setting__company__list-multiColumn__column {
  width: calc(100% / 4 - 28px); }
  .setting__company__list-multiColumn__column input {
    width: 100%; }

.setting__company__list-multiColumn__column ~ .setting__company__list-multiColumn__column {
  margin-left: 20px; }

.setting__company__delete {
  transition: 0.1s ease;
  backface-visibility: visible;
  transform: scale(1);
  color: #373737; }
  .setting__company__delete:active {
    transform: scale(0.7); }

.setting__mail__modal__line {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  padding-right: 32px;
  border-bottom: 1px solid #e0e0e0; }
  .setting__mail__modal__line .setting__mail__modal__type {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0;
    margin-right: 20px;
    width: 44px; }
    .setting__mail__modal__line .setting__mail__modal__type span {
      font-size: 24px;
      color: #cccccc; }
  .setting__mail__modal__line dt {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 38%;
    padding-right: 16px; }
  .setting__mail__modal__line dd {
    display: flex;
    justify-content: space-between;
    width: 62%;
    min-height: 26px; }
  .setting__mail__modal__line .checkbox {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 14px; }
  .setting__mail__modal__line .checkbox__check {
    margin-right: 12px; }

.setting__app__section__csvOutput {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  padding-bottom: 8px;
  flex-wrap: wrap; }

.setting__app__section__csvOutput__panel {
  max-height: 420px;
  overflow-Y: scroll;
  overflow-X: visible;
  padding-right: 30px;
  padding-bottom: 41px;
  padding-left: 30px;
  position: relative;
  max-width: 682px; }

.setting__app--csvOutput .setting__app__section__csvOutput__format {
  margin-left: 30px; }
  .setting__app--csvOutput .setting__app__section__csvOutput__format .setting__app__section__title {
    width: 160px; }

.setting__app__section__csvOutput__format + .setting__app__section {
  padding-top: 20px; }
  .setting__app__section__csvOutput__format + .setting__app__section::before {
    content: "";
    background-color: #cccccc;
    height: 1px;
    width: calc(100% - 30px);
    position: absolute;
    top: 0;
    left: 30px; }

.setting__app__section__csvOutput__header {
  height: 20px;
  display: flex;
  position: sticky;
  top: 0;
  left: -50px;
  width: calc(100% + 30px);
  background-color: #ffffff;
  z-index: 5; }
  .setting__app__section__csvOutput__header::before {
    content: "";
    width: 30px;
    height: 20px;
    background-color: #fff;
    display: block;
    position: absolute;
    left: -30px;
    top: 0; }
  .setting__app__section__csvOutput__header h4 {
    font-size: 10px;
    color: #888888; }
  .setting__app__section__csvOutput__header .setting__app__section__csvOutput__drag {
    cursor: default; }
    .setting__app__section__csvOutput__header .setting__app__section__csvOutput__drag::before, .setting__app__section__csvOutput__header .setting__app__section__csvOutput__drag::after {
      content: none; }

.setting__app__section__csvOutput__body {
  width: 604px;
  border: 1px solid #cccccc;
  border-radius: 2px;
  counter-reset: number; }
  .setting__app__section__csvOutput__body span {
    font-size: 10px;
    color: #888888; }
  .setting__app__section__csvOutput__body .setting__app__section__csvOutput__quoteSource .select {
    width: 100%;
    box-sizing: border-box;
    height: 22px; }
    .setting__app__section__csvOutput__body .setting__app__section__csvOutput__quoteSource .select select {
      width: 100%;
      box-sizing: border-box; }

.setting__app__section__csvOutput__line {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  height: 40px; }
  .setting__app__section__csvOutput__line:before {
    counter-increment: number;
    content: counter(number);
    position: absolute;
    left: -16px;
    font-size: 10px;
    font-weight: bold;
    color: #cccccc;
    text-align: center;
    transform: translateX(-50%);
    letter-spacing: -0.1em; }
  .setting__app__section__csvOutput__line:hover {
    background-color: #f5f5f5; }
    .setting__app__section__csvOutput__line:hover .setting__app__section__csvOutput__moveLine {
      opacity: 1;
      pointer-events: auto; }
    .setting__app__section__csvOutput__line:hover .setting__app__section__csvOutput__control {
      opacity: 1;
      transform: translateY(0); }
  .setting__app__section__csvOutput__line input {
    height: 22px;
    font-size: 12px; }
  .setting__app__section__csvOutput__line :placeholder-shown {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .setting__app__section__csvOutput__line ::-webkit-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .setting__app__section__csvOutput__line :-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .setting__app__section__csvOutput__line ::-moz-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px; }
  .setting__app__section__csvOutput__line :-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .setting__app__section__csvOutput__line ::-ms-input-placeholder {
    letter-spacing: -0.045em;
    font-size: 12px;
    transform: translateY(1px); }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__drag {
    height: 100%;
    position: relative;
    cursor: grab; }
    .setting__app__section__csvOutput__line .setting__app__section__csvOutput__drag::before, .setting__app__section__csvOutput__line .setting__app__section__csvOutput__drag::after {
      content: "";
      width: 16px;
      height: 1px;
      background-color: #cccccc;
      display: block;
      position: relative;
      transform: translateY(-50%) translateX(-50%);
      left: 50%; }
    .setting__app__section__csvOutput__line .setting__app__section__csvOutput__drag::before {
      top: calc(50% - 4px); }
    .setting__app__section__csvOutput__line .setting__app__section__csvOutput__drag::after {
      top: calc(50% + 3px); }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__firstLine {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center; }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__columnTitle {
    padding-right: 8px; }
    .setting__app__section__csvOutput__line .setting__app__section__csvOutput__columnTitle input {
      width: 100%; }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__quoteSource {
    padding-right: 4px; }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__quoteSource__fixedValue {
    opacity: 0;
    pointer-events: none;
    padding-right: 8px; }
    .setting__app__section__csvOutput__line .setting__app__section__csvOutput__quoteSource__fixedValue input {
      width: 100%;
      padding-right: 8px;
      padding-left: 0;
      text-align: right; }
  .setting__app__section__csvOutput__line .setting__app__section__csvOutput__quoteSource__fixedValue--active {
    opacity: 1;
    pointer-events: auto; }

.setting__app__section__csvOutput__line + .setting__app__section__csvOutput__line {
  border-top: 1px solid #cccccc; }
  .setting__app__section__csvOutput__line + .setting__app__section__csvOutput__line .setting__app__section__csvOutput__control {
    height: 81px; }

.setting__app__section__csvOutput__line:only-child .setting__app__section__csvOutput__control {
  height: 81px; }

.setting__app__section__csvOutput__line:only-child .setting__app__section__csvOutput__delete {
  opacity: 0;
  pointer-events: none; }

.setting__app__section__csvOutput__line:last-child::after {
  content: "";
  position: absolute;
  top: 39px;
  height: 39px;
  left: -1px;
  width: 100%;
  background-color: #f5f5f5;
  border-radius: 0 0 2px 2px;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  opacity: 0; }

.setting__app__section__csvOutput__line:last-child:hover::after {
  opacity: 1; }

.setting__app__section__csvOutput__line:last-child .setting__app__section__csvOutput__addLine {
  border-left: none; }

.setting__app__section__csvOutput__line--locked {
  pointer-events: none; }

.setting__app__section__csvOutput__drag {
  width: 46px; }

.setting__app__section__csvOutput__firstLine {
  width: 56px; }

.setting__app__section__csvOutput__columnTitle {
  width: 172px; }

.setting__app__section__csvOutput__quoteSource {
  width: 160px; }

.setting__app__section__csvOutput__quoteSource__fixedValue {
  width: 96px; }

.setting__app__section__csvOutput__kanaChange .setting__app__checkbox {
  margin-left: 24px; }

.setting__app__section__csvOutput__control {
  position: absolute;
  top: -1px;
  right: -28px;
  width: 28px;
  height: 82px;
  opacity: 0;
  transform: translateX(-9999px);
  background-color: #f5f5f5;
  border-top: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  border-radius: 0 2px 2px 0; }

.setting__app__section__csvOutput__delete {
  height: 41px;
  width: 28px;
  padding: 0; }
  .setting__app__section__csvOutput__delete::before {
    font-size: 10px;
    display: block;
    transform: scale(0.8);
    transition: 0.12s ease; }
  .setting__app__section__csvOutput__delete:active::before {
    transform: scale(0.6); }

.setting__app__section__csvOutput__quoteSource + .setting__app__section__csvOutput__kanaChange {
  margin-left: 96px; }

.setting__app__section__csvOutput__addLine {
  height: 39px;
  width: 28px;
  border-left: 1px solid #cccccc;
  border-radius: 0;
  position: relative;
  padding: 0; }
  .setting__app__section__csvOutput__addLine::before {
    font-size: 10px;
    display: block;
    transform: scale(0.9);
    transition: 0.12s ease; }
  .setting__app__section__csvOutput__addLine::after {
    content: "";
    display: block;
    width: 16px;
    height: 1px;
    position: absolute;
    top: -2px;
    left: 6px;
    background-color: #cccccc; }
  .setting__app__section__csvOutput__addLine:active::before {
    transform: scale(0.6); }

.setting__app__section__csvOutput__moveLine {
  opacity: 0;
  pointer-events: none;
  margin-left: auto;
  padding-right: 8px; }
  .setting__app__section__csvOutput__moveLine > label {
    display: flex;
    align-items: center; }
  .setting__app__section__csvOutput__moveLine input {
    width: 34px;
    padding-right: 4px;
    padding-left: 0;
    text-align: right; }

.setting__app__section__csvOutput__moveLine__title {
  margin-right: 8px; }

.setting__app__section__csvOutput__setting {
  width: calc(100% - 682px);
  padding-left: 6px;
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: flex-start; }

.setting__app__section__csvOutput__settingLine {
  display: flex;
  width: 100%; }
  .setting__app__section__csvOutput__settingLine dt {
    width: 84px;
    font-weight: bold;
    color: #888888;
    border-right: 1px solid #cccccc;
    margin-right: 16px; }
  .setting__app__section__csvOutput__settingLine dd {
    width: calc(100% - 66px);
    display: flex; }
    .setting__app__section__csvOutput__settingLine dd .setting__app__radioBox:first-child {
      min-width: 70px; }
  .setting__app__section__csvOutput__settingLine .setting__app__radioBox ~ .setting__app__radioBox {
    margin-left: 8px; }

.setting__app__section__csvOutput__settingLine ~ .setting__app__section__csvOutput__settingLine {
  margin-top: 20px; }

.setting__app__section__csvOutput__settingLine--checkbox {
  border-bottom: 1px solid #cccccc;
  padding-bottom: 16px; }
  .setting__app__section__csvOutput__settingLine--checkbox .setting__app__checkbox {
    font-size: 10px; }
  .setting__app__section__csvOutput__settingLine--checkbox .checkbox__check {
    margin-right: 12px; }

.setting__app__radioBox {
  display: flex;
  align-items: center;
  min-width: 32px; }
  .setting__app__radioBox .radiobox__check {
    width: 17px;
    height: 17px;
    font-size: 14px;
    margin-right: 16px; }
    .setting__app__radioBox .radiobox__check::before {
      width: 7px;
      height: 7px;
      left: 4px;
      top: 4px;
      transform: none; }
  .setting__app__radioBox span {
    font-size: 12px; }

.setting__app__radioBox ~ .setting__app__radioBox {
  margin-left: 20px; }

.setting__app__radioBox--loading {
  opacity: 0.4;
  pointer-events: none; }

.setting__app__section__csvOutput__sample {
  margin-top: 0;
  padding-top: 16px;
  padding-bottom: 16px;
  margin-bottom: 20px;
  margin-left: 32px;
  border-bottom: 1px solid #cccccc; }
  .setting__app__section__csvOutput__sample h4 {
    font-size: 12px;
    color: #888888;
    margin-bottom: 8px; }
  .setting__app__section__csvOutput__sample p {
    color: #373737; }

.setting__app__section__csvOutput__footer {
  width: 100%;
  position: relative; }

.setting__app__section__csvOutput__buttonArea {
  width: 100%;
  display: flex;
  margin-top: auto;
  margin-left: auto;
  position: relative;
  justify-content: center;
  padding-left: 30px; }
  .setting__app__section__csvOutput__buttonArea .button ~ .button {
    margin-left: 16px; }
  .setting__app__section__csvOutput__buttonArea .setting__app__section__changeNotice {
    position: absolute;
    font-size: 10px;
    font-weight: bold;
    color: #23D19D;
    right: calc(50% - 280px - 15px);
    top: 6px;
    width: 104px; }

.setting__app__section__csvOutput__reset {
  color: #D0021B;
  font-size: 10px;
  font-weight: normal;
  border-radius: 0;
  padding: 0;
  padding-bottom: 4px;
  margin-left: auto;
  margin-top: 36px;
  width: 72px;
  position: absolute;
  right: 0;
  bottom: 0; }

/* ----------------------------------*/
/* アップロードのレイアウト */
/* ----------------------------------*/
.upload {
  align-items: flex-start;
  justify-content: flex-start;
  margin: 20px 32px;
  padding: 40px;
  padding-bottom: 32px;
  min-height: 272px;
  width: calc(100% - 32px - 32px); }
  .upload .select {
    width: 120px; }

.upload--finished {
  padding-top: 96px; }

.upload__fileInput__BPOstatus {
  height: 80px;
  width: 100%;
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center; }
  .upload__fileInput__BPOstatus::before {
    content: "";
    position: absolute;
    left: 0;
    top: -40px;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    opacity: 0.8;
    z-index: -1; }
  .upload__fileInput__BPOstatus .icon-person_line {
    margin-top: -76px;
    margin-right: 32px;
    font-size: 29px;
    position: relative;
    z-index: 1; }
    .upload__fileInput__BPOstatus .icon-person_line .upload__fileInput__BPOstatus__circle {
      display: block;
      width: 52px;
      height: 52px;
      border-radius: 50%;
      position: absolute;
      border: 3px solid #23D19D;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: -1; }
  .upload__fileInput__BPOstatus .upload__fileInput__BPOstatus__caption {
    margin-top: -72px;
    font-weight: bold;
    font-size: 14px;
    letter-spacing: 0.1em; }

.upload__fileInput__BPOstatus--check .icon-person_line,
.upload__fileInput__BPOstatus--check .upload__fileInput__BPOstatus__caption {
  color: #23D19D; }

.upload__fileInput__BPOstatus--check .icon-person_line .upload__fileInput__BPOstatus__circle {
  border-color: #23D19D; }

.upload__fileInput__BPOstatus--skip .icon-person_line,
.upload__fileInput__BPOstatus--skip .upload__fileInput__BPOstatus__caption {
  color: #cccccc; }

.upload__fileInput__BPOstatus--skip .icon-person_line .upload__fileInput__BPOstatus__circle {
  border-color: #cccccc; }

.upload__fileInput__BPOstatus--skip .upload__fileInput__BPOstatus__circle {
  background-color: #f7f7f7; }

.upload__fileInput__BPOstatus--skip .upload__fileInput__BPOstatus__circle::before {
  content: "";
  left: calc(50% + 2px);
  top: calc(50% + 2px);
  position: absolute;
  background-color: #cccccc;
  width: 2px;
  height: 100%;
  transform: translate(-50%, -50%) rotate(43deg); }

.upload__fileInput__form {
  background-color: #f5f5f5;
  border: 1px dashed #333333;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 40px 0 32px; }
  .upload__fileInput__form input[type="file"] {
    display: none; }

.upload__fileInput__form.valid_drag {
  border: 1px solid #333333; }

.upload__fileInput__text {
  width: 100%;
  text-align: center;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 20px; }

.upload__note {
  width: 100%;
  display: block;
  text-align: right;
  color: #5a5a5a; }

.upload__buttonArea {
  width: 100%;
  text-align: center;
  margin-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .upload__buttonArea .button.button--white {
    margin-right: auto; }
  .upload__buttonArea .button + .button {
    margin-left: 12px; }

.upload__buttonArea--singleButton .button.button--white {
  margin-left: auto; }

.upload--finished .button--middle, .upload--finished .button--large, .upload--finished .button--small, .upload--finished .button--tiny {
  margin-left: auto; }

.upload--finished .button--middle ~ .button--middle, .upload--finished .button--large ~ .button--middle, .upload--finished .button--small ~ .button--middle, .upload--finished .button--tiny ~ .button--middle, .upload--finished .button--middle ~ .button--large, .upload--finished .button--large ~ .button--large, .upload--finished .button--small ~ .button--large, .upload--finished .button--tiny ~ .button--large, .upload--finished .button--middle ~ .button--small, .upload--finished .button--large ~ .button--small, .upload--finished .button--small ~ .button--small, .upload--finished .button--tiny ~ .button--small, .upload--finished .button--middle ~ .button--tiny, .upload--finished .button--large ~ .button--tiny, .upload--finished .button--small ~ .button--tiny, .upload--finished .button--tiny ~ .button--tiny {
  margin-left: 12px;
  margin-right: auto; }

.upload__uploaded {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 20px 20% 16px;
  max-height: 50px;
  overflow: hidden; }

.upload__uploaded ~ .upload__uploaded {
  margin-top: 0; }

.uploaded__icon {
  margin-left: 14%;
  margin-right: 6%;
  font-size: 24px; }

.uploaded__title {
  padding-right: 12px;
  width: 55%;
  font-size: 14px;
  font-weight: normal;
  display: flex;
  flex-direction: column;
  line-height: 18px; }

.uploaded__title__file {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-overflow: clip;
  white-space: normal;
  overflow: hidden; }

.uploaded__note {
  font-size: 10px;
  line-height: 14px;
  color: #888888;
  width: 100%; }

.uploaded__note--red {
  color: #b60117; }

.uploaded__status {
  display: flex;
  align-items: center;
  white-space: nowrap; }

.uploaded__status__bar {
  background-color: #ffffff;
  width: 100%;
  height: 2px;
  overflow: hidden; }

.uploaded__status__progress {
  height: 2px;
  background-color: #23D19D; }

.uploaded__status__cancel {
  font-size: 10px;
  cursor: pointer; }

.uploaded__status__text--success {
  color: #23D19D; }

.uploaded__status__text--fail {
  color: #D0021B; }

.uploaded__status__text--cancel {
  color: #888888; }

.upload__uploadedArea {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  max-height: 800px;
  opacity: 1;
  overflow: auto; }

.upload__uploaded--fadeOut {
  animation: uploadedAreaFadeout ease 1.2s 0s 1 normal;
  animation-fill-mode: forwards; }

@keyframes uploadedAreaFadeout {
  0% {
    opacity: 1;
    overflow: hidden; }
  55% {
    opacity: 0; }
  100% {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    margin-bottom: 0; } }

.upload__fileInput__finished {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 32px; }

.upload__fileInput__finished__check {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 44px;
  position: relative; }
  .upload__fileInput__finished__check::before, .upload__fileInput__finished__check::after {
    content: "";
    display: block;
    position: absolute;
    height: 8px;
    background-color: #23D19D; }
  .upload__fileInput__finished__check::before {
    top: 16px;
    width: 12px;
    transform: rotate(45deg) translateX(-12px) translateY(8px); }
  .upload__fileInput__finished__check::after {
    top: 8px;
    width: 36px;
    transform: rotate(-45deg); }

.upload__finished__text {
  text-align: center;
  width: 100%;
  font-weight: bold;
  font-size: 14px; }

.upload__limitOver {
  text-align: center;
  width: 100%;
  font-weight: bold;
  font-size: 14px;
  min-height: 232px;
  display: flex;
  justify-content: center;
  align-items: center; }

.upload__BPOskip {
  width: calc(100% - 32px - 32px);
  margin: auto;
  display: flex;
  justify-content: flex-end;
  margin-top: 4px; }

.upload__BPOskip__link {
  color: #23D19D;
  font-size: 10px;
  border-bottom: 1px solid #23D19D;
  margin: 0;
  padding: 0;
  padding-bottom: 4px;
  font-weight: bold; }

.upload__BPOskip__modal,
.upload__modal {
  width: 100%; }
  .upload__BPOskip__modal > h4,
  .upload__modal > h4 {
    margin-bottom: 20px; }
  .upload__BPOskip__modal .upload__fileInput,
  .upload__modal .upload__fileInput {
    width: 100%; }
  .upload__BPOskip__modal .upload__fileInput__finished,
  .upload__modal .upload__fileInput__finished {
    margin-bottom: 12px;
    margin-top: 20px; }

.upload__BPOskip__modal__wrap,
.upload__modal__wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%; }

.upload__modal__errorText {
  font-size: 12px;
  color: #D0021B;
  text-align: center;
  display: block;
  width: 100%;
  margin-top: 8px;
  margin-bottom: 8px; }

.upload__fileInput__optionArea {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  margin-left: auto; }

.upload__fileInput__optionArea__bumon {
  display: flex;
  align-items: center; }
  .upload__fileInput__optionArea__bumon .select {
    margin-right: 8px; }

.upload__BPOskip__switch {
  display: flex;
  align-items: center;
  margin-left: auto; }

.upload__BPOskip__switch__caption {
  margin-right: 12px;
  font-weight: bold;
  color: #5a5a5a;
  font-size: 11px;
  letter-spacing: 0.025em; }

.upload__fileHistory {
  margin-bottom: 20px; }
  .upload__fileHistory .upload {
    padding-top: 20px;
    padding-bottom: 16px;
    min-height: auto;
    transition: 0.45s ease; }

.upload__section__title {
  border-bottom: 1px dashed #cccccc;
  padding-bottom: 8px; }

.upload__fileHistory__line {
  width: 100%;
  display: flex;
  justify-content: space-between;
  min-height: 56px;
  align-items: center;
  border-bottom: 1px solid #cccccc;
  transition: 0.45s ease; }

.upload__fileHistory__line:last-of-type {
  border-bottom: none; }

.upload__fileHistory__line--fadein {
  animation: lineFadein 0.9s ease 1.2s 1 normal;
  animation-fill-mode: forwards;
  opacity: 0;
  min-height: 0;
  max-height: 0;
  overflow: hidden; }

@keyframes lineFadein {
  0% {
    opacity: 0;
    min-height: 0;
    max-height: 0;
    overflow: hidden; }
  99% {
    max-height: 0; }
  100% {
    opacity: 1;
    min-height: 56px;
    max-height: 200px;
    overflow: hidden; } }

.upload__fileHistory__type {
  width: 72px;
  font-size: 22px;
  padding-left: 20px; }

.upload__fileHistory__name {
  width: calc(74% - 72px);
  display: flex;
  flex-direction: column; }
  .upload__fileHistory__name span {
    font-size: 12px;
    width: 100%;
    line-height: 18px; }
  .upload__fileHistory__name span:not(.upload__fileHistory__name__note) {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: clip;
    white-space: normal;
    overflow: hidden; }
  .upload__fileHistory__name .upload__fileHistory__name__note {
    font-size: 10px;
    line-height: 14px;
    color: #888888; }
  .upload__fileHistory__name .upload__fileHistory__name__note--red {
    color: #b60117; }

.upload__fileHistory__status,
.upload__fileHistory__date {
  width: 13%;
  text-align: right; }

.upload__fileHistory__status__success {
  color: #23D19D; }

.upload__fileHistory__status__fail {
  color: #D0021B; }

.upload__fileHistory__status__cancel {
  color: #888888; }

.upload--makeleaps {
  padding-top: 96px; }

.upload--makeleaps__text {
  text-align: center;
  width: 100%;
  font-weight: bold;
  font-size: 14px; }

.upload__buttonArea--makeleaps {
  justify-content: center; }

.receipt .upload__fileInput__form {
  background-color: #FAF5E9; }

/* ----------------------------------*/
/* 帳票定義関連のレイアウト */
/* ----------------------------------*/
.modal--defining ~ main .confirm__preview {
  z-index: 1001; }

.modal--defining ~ .menu {
  z-index: -1; }

.modal--defining ~ .menu {
  z-index: -1; }

.modal__defining__informationArea {
  width: 586px;
  height: 100%;
  padding: 0 20px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
  position: absolute;
  right: 0;
  top: auto;
  z-index: 1000; }

.modal__defining__title {
  font-size: 20px;
  color: #fff;
  text-align: center;
  margin-bottom: 32px; }
  .modal__defining__title span {
    display: block;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    width: 100%; }

.modal__panel--defining {
  width: 100%;
  max-height: 95%;
  position: relative;
  top: auto;
  left: auto;
  margin-left: 0;
  z-index: 1002;
  transform: none;
  overflow: auto; }
  .modal__panel--defining h4 {
    text-align: center;
    margin-bottom: 24px; }
  .modal__panel--defining p {
    text-align: center;
    font-size: 14px; }
  .modal__panel--defining .modal__wrap {
    max-height: 100%;
    overflow: visible; }

.modal__panel--definingRegistrationPoint {
  overflow: hidden; }

.modal__panel--definingRegistrationPoint::before {
  content: "";
  background-color: #000000;
  opacity: 0.3;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1; }

.defining__registration__wrap {
  margin-top: 32px;
  width: 492px;
  max-height: 30vh;
  min-height: 128px;
  margin-right: -16px;
  overflow: auto; }

.defining__registration__line {
  width: 100%;
  position: relative;
  padding-right: 32px; }

.defining__registration__line + .defining__registration__line {
  margin-top: 8px; }

.defining__registration__item {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 26px; }
  .defining__registration__item dt {
    width: 30%;
    padding-right: 8px;
    font-weight: bold;
    font-size: 14px;
    align-self: flex-start;
    padding-top: 3px; }
  .defining__registration__item dd {
    width: 70%; }
  .defining__registration__item p {
    text-align: left; }
  .defining__registration__item input {
    width: 100%; }
  .defining__registration__item :placeholder-shown {
    font-size: 12px;
    padding-top: 1px; }
  .defining__registration__item ::-webkit-input-placeholder {
    font-size: 12px;
    padding-top: 1px; }
  .defining__registration__item :-moz-placeholder {
    font-size: 12px;
    padding-top: 1px; }
  .defining__registration__item ::-moz-placeholder {
    font-size: 12px;
    padding-top: 1px; }
  .defining__registration__item :-ms-input-placeholder {
    font-size: 12px;
    padding-top: 1px; }
  .defining__registration__item ::-ms-input-placeholder {
    transform: scale(0.85) translateY(1px);
    transform-origin: left; }

.defining__registration__option {
  justify-content: flex-end; }
  .defining__registration__option dt, .defining__registration__option label, .defining__registration__option button {
    font-size: 10px;
    color: #888888; }
  .defining__registration__option label {
    cursor: pointer; }
  .defining__registration__option button {
    padding: 0;
    margin-left: -2px;
    border-bottom: 1px solid #888888;
    border-radius: 0; }
  .defining__registration__option dt, .defining__registration__option dd {
    width: auto; }
  .defining__registration__option dt {
    margin-right: 8px; }
  .defining__registration__option dd {
    display: flex;
    align-items: center; }
  .defining__registration__option .defining__registration__item {
    justify-content: flex-end; }
    .defining__registration__option .defining__registration__item dt {
      align-self: center; }

.defining__registration__addButton + .defining__registration__addButton {
  margin-left: 8px; }

.defining__registration__addButton::before {
  vertical-align: -10%; }

.defining__registration__delete {
  position: absolute;
  font-size: 10px;
  width: 12px;
  height: 12px;
  right: 12px;
  padding: 0;
  top: calc(50% - 6px + 1px);
  transition: 0.1s ease;
  backface-visibility: visible;
  transform: scale(1);
  color: #373737; }
  .defining__registration__delete:active {
    transform: scale(0.7); }

.defining__registration__attention {
  border-top: 1px solid #00B881;
  padding-top: 12px;
  padding-bottom: 4px;
  margin-top: 16px;
  font-size: 12px;
  text-align: center;
  color: #08805C; }

@media screen and (max-width: 1280px) {
  .modal--defining {
    position: absolute;
    width: 1280px; }
  .modal__defining__informationArea {
    left: auto;
    right: 0; } }

/* ----------------------------------*/
/* メニューリストのレイアウト */
/* ----------------------------------*/
.menuList {
  margin: 16px 32px; }
  .menuList .select {
    width: 144px; }

.menuList__Panel {
  margin-top: 16px;
  padding: 24px;
  width: 950px; }

.menuList__title {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 16px; }

.menuList__line {
  display: flex;
  gap: 8px; }

.menuList__line ~ .menuList__line {
  margin-top: 8px; }

.menuList__button {
  display: flex;
  flex-basis: 100%;
  align-items: center;
  border: 1px solid #cccccc;
  border-radius: 5px; }
  .menuList__button:hover {
    background-color: #f5f5f5; }

.menuList__button__description {
  font-size: 14px; }

.menuList__button__icon {
  display: flex;
  align-items: center;
  font-size: 40px;
  height: 40px; }
  .menuList__button__icon.icon-document {
    font-size: 36px; }

.menuList__button--big {
  flex-direction: column;
  gap: 16px;
  padding: 20px; }
  .menuList__button--big .menuList__button__description {
    font-weight: bold; }

.menuList__button--small {
  padding: 12px;
  gap: 12px; }
  .menuList__button--small .menuList__button__icon {
    font-size: 24px;
    height: auto; }

/* ----------------------------------*/
/* Angular-CDK向けデザイン */
/* ----------------------------------*/
.cdk-drag-preview {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #ffffff;
  height: 40px; }
  .cdk-drag-preview:hover {
    background-color: #ffffff; }
  .cdk-drag-preview::before {
    content: none; }
  .cdk-drag-preview .setting__app__section__csvOutput__firstLine {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 40px; }
    .cdk-drag-preview .setting__app__section__csvOutput__firstLine .checkbox__check {
      width: 17px;
      height: 17px;
      transition: 0.12s ease-in-out;
      border-color: #e0e0e0;
      border-radius: 4px;
      margin-right: 16px;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translateY(-50%) translateX(-50%); }
      .cdk-drag-preview .setting__app__section__csvOutput__firstLine .checkbox__check::before {
        width: 8px;
        height: 3px;
        top: 4px;
        left: 3px; }
  .cdk-drag-preview .setting__app__section__csvOutput__control,
  .cdk-drag-preview .setting__app__section__csvOutput__quoteSource__fixedValue,
  .cdk-drag-preview .setting__app__section__csvOutput__moveLine {
    display: none; }
  .cdk-drag-preview .select {
    visibility: hidden; }
  .cdk-drag-preview .setting__app__section__csvOutput__quoteSource__fixedValue {
    visibility: hidden; }
  .cdk-drag-preview .setting__app__checkbox,
  .cdk-drag-preview .setting__app__section__csvOutput__columnTitle {
    pointer-events: none; }

.cdk-drag-placeholder {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #f5f5f5;
  height: 40px; }
  .cdk-drag-placeholder::before {
    content: none; }
  .cdk-drag-placeholder .setting__app__section__csvOutput__control,
  .cdk-drag-placeholder .setting__app__section__csvOutput__quoteSource__fixedValue,
  .cdk-drag-placeholder .setting__app__section__csvOutput__moveLine {
    display: none; }
  .cdk-drag-placeholder .select {
    visibility: hidden; }
  .cdk-drag-placeholder .setting__app__section__csvOutput__quoteSource__fixedValue {
    visibility: hidden; }
  .cdk-drag-placeholder .setting__app__checkbox,
  .cdk-drag-placeholder .setting__app__section__csvOutput__columnTitle {
    pointer-events: none; }

/*# sourceMappingURL=style.css.map */