@charset "UTF-8";
/* variables */
:root {
  --jp-red: #cc0000;
  --myhover: #0a58ca;
  --jp-muted: #ced4da;
}
/* Japanize */
/*! jpn.css for Bootsrap4 | MIT License | Copyright 2017 @kokushing */
@font-face {
  font-family: YuGothicMedium;
  src: local("Yu Gothic Medium");
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}
html {
  line-height: 1.15;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", "游ゴシック Medium", "Yu Gothic", YuGothic, YuGothicMedium,
    "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  line-height: 1.7;
}
/* Bassic Layout */
.container {
  max-width: 1080px;
}
/* Basic Tools */
.fc-jpred {
  color: var(--jp-red);
}
.fc-jpmuted {
  color: var(--jp-muted) !important;
}
.text-center-left span {
  display: inline-block;
  text-align: left;
}

/* Basic Parts */
.bd-callout {
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border: 1px solid #e9ecef;
  border-left-width: 0.4rem;
  border-radius: 0.25rem;
}
.bd-callout-primary {
  border-left-color: var(--bs-primary);
}
.bd-callout-secondary {
  border-left-color: var(--bs-secondary);
}
.bd-callout-success {
  border-left-color: var(--bs-success);
}
.bd-callout-info {
  border-left-color: var(--bs-info);
}
.bd-callout-warning {
  border-left-color: var(--bs-warning);
}
.bd-callout-danger {
  border-left-color: var(--bs-danger);
}
.bd-callout-dark {
  border-left-color: var(--bs-dark);
}
.bd-callout-jpred {
  border-left-color: var(--jp-red);
}
.mytooltip {
  /* color: #0d6efd; */
  text-decoration: underline;
  cursor: pointer;
}
.mytooltip:after {
  margin-left: 2px;
  content: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%237c858d" class="bi bi-chat-left-text" viewBox="0 0 16 16"><path d="M14 1a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H4.414A2 2 0 0 0 3 11.586l-2 2V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12.793a.5.5 0 0 0 .854.353l2.853-2.853A1 1 0 0 1 4.414 12H14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="M3 3.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zM3 6a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9A.5.5 0 0 1 3 6zm0 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/></svg>');
}
.mytooltip:hover {
  color: #0a58ca;
}
.svgbtn {
  cursor: pointer;
}
.feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  margin-bottom: 1rem;
  font-size: 2rem;
  color: #fff;
  border-radius: 0.75rem;
}
.form-floating-h {
  height: calc(3.5rem + 2px);
}
hr.hr-dashed {
  border-top: 1px dashed white;
}

/* parsley error msg ------------------------------------- */
.parsley-error-msg {
  width: 100%;
}
.is-invalid ~ .parsley-error-msg .invalid-feedback {
  display: block;
}

/* Header ------------------------------------- */
.header-bg {
  background-image: url("../../img/header-l.svg"),
    url("../../img/header-bar.png");
  background-repeat: no-repeat, repeat-x;
  background-position: left top, left top;
  background-size: auto 100%, auto 100%;
  height: 40px;
}
/* Footer ------------------------------------- */
.footer-bg {
  background-image: url("../../img/footer-l.svg"),
    url("../../img/footer-bar.png");
  background-repeat: no-repeat, repeat-x;
  background-position: left bottom, left bottom;
  background-size: auto 100%, auto 100%;
  height: 20px;
}
/* animation ------------------------------------- */
.animationWrapper {
  overflow: hidden;
}
.animation {
  opacity: 0;
  backface-visibility: hidden;
  overflow: hidden;
}
.animated {
  animation-duration: 1.3s;
  animation-fill-mode: both;
}
.slideInB2T {
  animation-name: SlideB2T;
}
.slideInT2B {
  animation-name: SlideT2B;
}
.slideInL2R {
  animation-name: SlideL2R;
}
.slideInR2L {
  animation-name: SlideR2L;
}
/* CSS Animation Settings */
@keyframes SlideB2T {
  0% {
    opacity: 0;
    transform: translateY(32px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes SlideT2B {
  0% {
    opacity: 0;
    transform: translateY(-32px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes SlideR2L {
  0% {
    opacity: 0;
    transform: translateX(64px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes SlideL2R {
  0% {
    opacity: 0;
    transform: translateX(-32px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@media (min-width: 768px) {
  .animationWrapper {
    overflow: visible;
  }
}
/* Navigation Quotation------------------------------------- */
.multi-steps > li.is-active:before,
.multi-steps > li.is-active ~ li:before {
  content: counter(stepNum);
  font-family: inherit;
  font-weight: 700;
}
.multi-steps > li.is-active:after,
.multi-steps > li.is-active ~ li:after {
  background-color: #ededed;
}
.multi-steps {
  display: table;
  table-layout: fixed;
  width: 100%;
}
.multi-steps > li {
  counter-increment: stepNum;
  text-align: center;
  display: table-cell;
  position: relative;
  color: seagreen;
}
.multi-steps > li:before {
  content: "\f00c";
  content: "\2713;";
  content: "\10003";
  content: "\10004";
  content: "\2713";
  display: block;
  margin: 0 auto 4px;
  background-color: honeydew;
  width: 36px;
  height: 36px;
  line-height: 32px;
  text-align: center;
  font-weight: bold;
  border-width: 2px;
  border-style: solid;
  border-color: seagreen;
  border-radius: 50%;
}
.multi-steps > li:after {
  content: "";
  height: 2px;
  width: 100%;
  background-color: seagreen;
  position: absolute;
  top: 16px;
  left: 50%;
  z-index: -1;
}
.multi-steps > li:last-child:after {
  display: none;
}
.multi-steps > li.is-active:before {
  background-color: #fff;
  border-color: seagreen;
}
.multi-steps > li.is-active ~ li {
  color: #808080;
}
.multi-steps > li.is-active ~ li:before {
  background-color: #ededed;
  border-color: #ededed;
}

/* Navigation Application------------------------------------- */
.multi-steps-app > li.is-active:before,
.multi-steps-app > li.is-active ~ li:before {
  content: counter(stepNum);
  font-family: inherit;
  font-weight: 700;
}
.multi-steps-app > li.is-active:after,
.multi-steps-app > li.is-active ~ li:after {
  background-color: #ededed;
}
.multi-steps-app {
  display: table;
  table-layout: fixed;
  width: 100%;
  counter-reset: stepNum 5;
}
.multi-steps-app > li {
  counter-increment: stepNum;
  text-align: center;
  display: table-cell;
  position: relative;
  color: darkred;
}
.multi-steps-app > li:before {
  content: "\f00c";
  content: "\2713;";
  content: "\10003";
  content: "\10004";
  content: "\2713";
  display: block;
  margin: 0 auto 4px;
  background-color: lavenderblush;
  width: 36px;
  height: 36px;
  line-height: 32px;
  text-align: center;
  font-weight: bold;
  border-width: 2px;
  border-style: solid;
  border-color: darkred;
  border-radius: 50%;
}
.multi-steps-app > li:after {
  content: "";
  height: 2px;
  width: 100%;
  background-color: darkred;
  position: absolute;
  top: 16px;
  left: 50%;
  z-index: -1;
}
.multi-steps-app > li:last-child:after {
  display: none;
}
.multi-steps-app > li.is-active:before {
  background-color: #fff;
  border-color: darkred;
}
.multi-steps-app > li.is-active ~ li {
  color: #808080;
}
.multi-steps-app > li.is-active ~ li:before {
  background-color: #ededed;
  border-color: #ededed;
}

/* My Accordion------------------------------------- */

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: rotate(180deg);
}
.accordion-button:not(.collapsed) {
  color: inherit;
  background-color: inherit;
  box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);
}
.accordion-button:focus {
  z-index: 3;
  border-color: unset;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgb(0 0 0 / 5%);
}
.accordion-btn-white .accordion-button::after {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-left: auto;
  content: "";
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22white%22%20class%3D%22bi%20bi-chevron-down%22%20viewBox%3D%220%200%2016%2016%22%3E%20%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M1.646%204.646a.5.5%200%200%201%20.708%200L8%2010.293l5.646-5.647a.5.5%200%200%201%20.708.708l-6%206a.5.5%200%200%201-.708%200l-6-6a.5.5%200%200%201%200-.708z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform 0.2s ease-in-out;
}
.accordion-btn-white .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22white%22%20class%3D%22bi%20bi-chevron-down%22%20viewBox%3D%220%200%2016%2016%22%3E%20%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M1.646%204.646a.5.5%200%200%201%20.708%200L8%2010.293l5.646-5.647a.5.5%200%200%201%20.708.708l-6%206a.5.5%200%200%201-.708%200l-6-6a.5.5%200%200%201%200-.708z%22%2F%3E%3C%2Fsvg%3E");
  transform: rotate(180deg);
}

/* ds-070 Select Font Decoration------------------------------------- */

#jobName option:nth-of-type(n + 2):nth-child(-n + 6) {
  font-weight: bold;
}

/* ie alert------------------------------------- */
#ie-alert div.ie_alert {
  margin: 0 5px 5px 5px;
  text-align: center;
  background-color: #ddd;
  padding: 5px;
}

/* tooltip ------------------------------------- */
.tooltip-inner {
  text-align: left;
}