@charset "UTF-8";
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Medium");
}

@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}

html { scroll-behavior: smooth;}

main {
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", serif;
  font-family: "解ミン 宙 M JIS2004 AP","Kaimin Sora Medium JIS2004 AP";
}

main *,
main *:before,
main *:after {
  box-sizing: border-box;
}

main *::-moz-selection {
  background-color: #505050;
  color: #FFF;
}

main *::selection {
  background-color: #505050;
  color: #FFF;
}

a {
  color: #000;
}

a:not([class]) {
  color: #2159a0;
  text-decoration: underline;
}

a:not([class]):hover {
  text-decoration: none;
}

.lPage__holder {
  /* padding-bottom: 100px; */
}

@media only screen and (max-width: 767px) {
  .lPage__holder {
    /* padding-bottom: 23.07692vw; */
  }
}

.lContainer {
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
  padding-left: 20px;
  padding-right: 20px;
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
  .lContainer {
    max-width: 100%;
    padding-left: 5.12821vw;
    padding-right: 5.12821vw;
  }
}

@media only screen and (max-width: 767px) and (orientation: landscape) {
  .lContainer {
    max-width: 100%;
    padding-left: 2.9985vw;
    padding-right: 2.9985vw;
  }
}

.mCircleButton {
  font-size: 0.875rem;
  letter-spacing: 0.1em;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  background-color: #FFF;
  color: #000;
  border-radius: 50%;
  width: 8.42857em;
  height: 8.42857em;
  text-decoration: none;
}

@media (hover: hover) {
  .mCircleButton {
    transition: background-color 0.3s ease,color 0.3s ease;
  }
  .mCircleButton:hover {
    color: #FFF;
    background-color: #2159a0;
  }
  .mCircleButton:hover .mCircleButton__text--open {
    transform: translateY(0em);
  }
  .mCircleButton:hover .mCircleButton__text--attention {
    opacity: 1;
    transform: translateY(0);
  }
}

.mCircleButton.-hover {
  color: #FFF;
  background-color: #2159a0;
}

.mCircleButton.-hover .mCircleButton__text--open {
  transform: translateY(0em);
}

.mCircleButton.-hover .mCircleButton__text--attention {
  opacity: 1;
  transform: translateY(0);
}

.mCircleButton__text {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.mCircleButton__text > * {
  min-height: 1px;
  max-width: 100%;
}

.mCircleButton__text--open {
  transform: translateY(0.71429em);
  transition: transform .3s ease;
}

.mCircleButton__text--attention {
  font-style: normal;
  font-size: 0.71429em;
  display: block;
  margin-top: 0.8em;
  transition: transform .3s ease,opacity .3s ease;
  transform: translateY(-1.5em);
  opacity: 0;
}


.mRoundButton {
  font-size: 0.875rem;
  letter-spacing: 0.1em;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, .2);
  background-image: url('../img/common/arrow_down.png');
  background-repeat: no-repeat;
  background-position: right 50%;
  color: #000;
  text-align: center;
  border-radius: 2.4em;
  border-color: #FFF;
  border: 1px solid;
  margin: 0 auto;
  width: fit-content;
  padding: 0 3.6em;
  color: #FFF;
  height: 4.8em;
  text-decoration: none;
}

.pTerm__wrapper .mRoundButton {
  margin-top: 1em;
  background-color: #2159a0;
  background-image: none;
}

@media (hover: hover) {
  .mRoundButton{
    transition: background-color 0.3s ease,color 0.3s ease;
  }
  .mRoundButton:hover {
    color: #000;
    background-color: #fff;
    background-image: url('../img/common/arrow_down_hover.png');
  }
  .pTerm__wrapper .mRoundButton:hover {
    background-image: none;
  }
}

@media only screen and (max-width: 767px) {
  .mCircleButton {
    font-size: 3.07692vw;
    width: 25.64103vw;
    height: 25.64103vw;
  }
}

.pKv__outer {
  position: relative;
  padding-bottom: 150px;
}

.pKv__contents--holder {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  height: 480px;
}

.pKv__contents--holder > * {
  min-height: 1px;
  max-width: 100%;
}

.pKv__titles--wrapper {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  max-width: 41.5625rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.pKv__titles--product {
  width: 32.4812%;
  flex-shrink: 0;
  margin: 0;
  font-size: 100%;
  line-height: 0;
  opacity: 0;
}

.pKv__titles--product img {
  width: 100%;
}

.-loaded .pKv__titles--product {
  opacity: 1;
  transition: opacity 2.0s;
}

.pKv__titles--site {
  width: 64.21053%;
  flex-shrink: 0;
  margin: 0;
  font-size: 100%;
  line-height: 0;
  position: relative;
}

.pKv__titles--site img {
  width: 100%;
}

.pKv__titles--en, .pKv__titles--ja {
  display: block;
}

.pKv__titles--en img, .pKv__titles--ja img {
  opacity: 0;
  display: block;
}

.pKv__titles--ja {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 29.97658%;
}

.-loaded .pKv__titles--ja img {
  opacity: 1;
  transition: opacity 2.0s;
}

.pKv__titles--en img {
  opacity: 0;
}

.-loaded .pKv__titles--en img {
  opacity: 1;
  transition: opacity 2.0s;
}

.pKv__anchor {
  margin: -6.5rem auto 0;
  opacity: 0;
}
.pKv__environment__text {
  margin: 5em auto;
  opacity: 0;
}

.-loaded .pKv__environment__text {
  opacity: 1;
  transition: opacity 1.55s 1.45s,background-color 0.3s ease,color 0.3s ease;
}

.-loaded .pKv__anchor {
  opacity: 1;
  transition: opacity 1.55s 1.45s,background-color 0.3s ease,color 0.3s ease;
}

.pKv__anchor--bottom {
  margin-top: 5.625rem;
  background-color: #2159a0;
  color: #fff;
}

.pKv__lead--holder {
  font-size: 1.125rem;
  background-color: #FFF;
  width: 36.94444em;
  margin-left: auto;
  margin-right: auto;
  margin-top: 4.44444rem;
  padding-top: 4.44444rem;
  padding-bottom: 4.44444rem;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  position: relative;
  opacity: 0;
}

.-loaded .pKv__lead--holder {
  opacity: 1;
  transition: opacity 1.4s 1.35s;
}

.pKv__lead--wrapper {
  line-height: 2;
  letter-spacing: 0.1em;
  position: relative;
  overflow: hidden;
}

.pKv__lead--wrapper::after {
  content: "";
  display: block;
  width: 220%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 1;
  transform: translateX(-54%);
  background-image: linear-gradient(-35deg, #FFF 55%, rgba(255, 255, 255, 0) 75%);
}

.-loaded .pKv__lead--wrapper::after {
  opacity: 0;
  transform: translateX(52%);
  transition: opacity 1.08s cubic-bezier(0.47, 0.11, 0.86, 0.73) 1.65s, transform 1.8s cubic-bezier(0.46, 0.12, 0.8, 0.67) 1.55s;
}

.pKv__lead {
  position: relative;
  margin: 0;
  overflow: hidden;
  text-align: center;
}

.pKv__supervisor--holder {
  font-size: 0.66667em;
  letter-spacing: 0.1em;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  margin: 5.42857em auto 0;
  opacity: 0;
}

 .pKv__supervisor--holder.-action {
  opacity: 1;
  transition: opacity 1s;
}

.pKv__supervisor--ttl {
  line-height: 1.16667;
  align-self: center;
  margin: initial;
  padding-right: 1.42857em;
}

.pKv__supervisor--wrapper {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  position: relative;
}

.pKv__supervisor--wrapper::before {
  content: "";
  display: block;
  width: 1px;
  height: calc(100% - 0.42857em);
  background-color: #b4b4b4;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.pKv__supervisor--data {
  margin: initial;
  margin-left: 1.42857em;
}

.pKv__supervisor--role {
  font-size: 0.85714em;
  display: block;
  font-style: normal;
}

.pKv__supervisor--name {
  font-size: 1em;
  display: block;
  margin-top: 0.14286em;
}

.pKv__supervisor--alt {
  font-size: 0.85714em;
}

@media only screen and (max-width: 767px) {
  .pKv__outer {
    padding-bottom: 16.92308vw;
  }
  .pKv__contents--holder {
    height: calc(100vh - 50px - 34.35897vw);
    height: 133.33333vw;
  }
  .pKv__titles--wrapper {
    max-width: 89.23077vw;
  }
  .pKv__anchor {
    margin-top: -38.97436vw;
  }
  .pKv__anchor--bottom {
    margin-top: 16.92308vw;
  }
  .pKv__lead--holder {
    width: 79.48718vw;
    font-size: 4.10256vw;
    padding-top: 3.25rem;
    padding-bottom: 3.375rem;
  }
  .pKv__lead--wrapper {
    line-height: 2;
  }
  .pKv__supervisor--holder {
    font-size: 0.70588em;
    margin-top: 5em;
  }
  .pKv__supervisor--ttl {
    padding-right: 1.25em;
    text-align: center;
  }
  .pKv__supervisor--wrapper {
    display: flex;
    flex-flow: column nowrap;
  }
  .pKv__supervisor--wrapper > * {
    min-height: 1px;
    max-width: 100%;
  }
  .pKv__supervisor--wrapper::before {
    height: calc(100% - 0.66667em);
  }
  .pKv__supervisor--data {
    margin-left: 1.25em;
  }
  .pKv__supervisor--data + .pKv__supervisor--data {
    margin-top: 1em;
  }
  .pKv__supervisor--role {
    font-size: 0.83333em;
  }
  .pKv__supervisor--name {
    font-size: 1em;
    margin-top: 0.125em;
  }
}

.pKvBg__wrapper {
  position: absolute;
  left: 0;
  top: -55px;
  display: block;
  width: 100%;
  height: 838px;
  z-index: -1;
  overflow: hidden;
  filter: brightness(0);
}

.-loaded .pKvBg__wrapper {
  -webkit-animation: bg 2.4s cubic-bezier(0.61, 0.23, 0.39, 0.78) forwards;
          animation: bg 2.4s cubic-bezier(0.61, 0.23, 0.39, 0.78) forwards;
}

.pKvBg__pic--wrapper {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  overflow: hidden;
  background-position: top center;
  background-repeat: no-repeat;
  background-image: url("../img/kv/pc-wide.jpg");
  background-size: cover;
}

.pKvBg__video {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  -o-object-fit: cover;
     object-fit: cover;
}

@media only screen and (min-width: 900px) {
  .pKvBg__pic--wrapper {
    background-image: url("../img/kv/pc-wide.jpg");
    background-size: 294.11765vh 193.23529vh;
  }
}

@media only screen and (max-width: 899px) {
  .pKvBg__pic--wrapper {
    background-image: url("../img/kv/tab.jpg");
  }
}

@media only screen and (max-width: 767px) {
  .pKvBg__pic--wrapper {
    background-image: url("../img/kv/sp.jpg");
    background-position-x: 31.4%
  }
  .pKvBg__wrapper {
    top: 0;
    height: 25.5%;
  }
}

@media only screen and (max-width: 767px) and (min-aspect-ratio: 767 / 1300) {
  .pKvBg__pic--wrapper {
    background-image: url("../img/kv/tab.jpg");
  }
}

@-webkit-keyframes bg {
  0% {
    filter: brightness(0);
  }
  100% {
    filter: brightness(1);
  }
}

@keyframes bg {
  0% {
    filter: brightness(0);
  }
  100% {
    filter: brightness(1);
  }
}

.pTerm__outer {
  background-color: #FFF;
  padding-top: 140px;
}

.pTerm__holder {
  position: relative;
  font-size: 1rem;
  border: 1px solid #000;
  padding: 3.75em 3.625em;
}

.pTerm__title {
  font-size: 1.3125em;
  letter-spacing: 0.1em;
  text-align: center;
  margin: 0;
  font-weight: initial;
}

.pTerm__wrapper {
  margin-top: 2.125em;
}

.pTerm__lead {
  letter-spacing: 0.1em;
  line-height: 1.5;
  margin: 0;
}

.pTerm__lead + .pTerm__lead {
  margin-top: 1.25em;
}

.pTerm__spec--holder {
  margin-top: 1.5em;
  letter-spacing: 0.1em;
}

.pTerm__spec--title {
  position: relative;
  margin: 0;
}

.pTerm__spec--title::before {
  content: "";
  display: block;
  width: 100%;
  background-color: #b4b4b4;
  height: 1px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.pTerm__spec--titleInner {
  background-color: #FFF;
  position: relative;
  display: inline-block;
  padding-right: 0.5em;
}

.pTerm__each--wrapper {
  display: table;
  table-layout: fixed;
  padding-left: 0.5em;
  margin-top: 1.3125em;
}

.pTerm__each {
  display: table-row;
  margin: 0;
}

.pTerm__each--machine, .pTerm__each--version {
  margin: 0;
  display: table-cell;
  line-height: 1.5;
}

.pTerm__each--machine {
  width: 12em;
}

.pTerm__each--machine span {
  font-size: 0.875em;
}

.pTerm__memo {
  font-size: 0.875em;
  margin: 1.42857em auto 0;
  line-height: 1.71429;
  letter-spacing: 0.1em;
}
.pTerm__youtube {
  font-size: 1em;
  margin-top: 3.6em;
  text-align: center;
  line-break: auto;
}

@media only screen and (max-width: 767px) {
  .pTerm__outer {
    padding-top: 30.76923vw;
  }
  .pTerm__holder {
    position: relative;
    font-size: 3.58974vw;
    padding: 2.85714em 2.85714em;
  }
  .pTerm__title {
    font-size: 1.21429em;
  }
  .pTerm__lead {
    line-height: 1.5;
  }
  .pTerm__spec--holder {
    margin-top: 2em;
  }
  .pTerm__each--wrapper {
    display: block;
    padding-left: 0.5em;
  }
  .pTerm__each {
    display: block;
    margin-top: 0.92857em;
  }
  .pTerm__each--machine, .pTerm__each--version {
    display: block;
    line-height: 1.5;
  }
  .pTerm__each--machine {
    width: 100%;
  }
  .pTerm__each--machine span {
    font-size: 0.85714em;
  }
  .pTerm__each--version {
    margin-left: 0.71429em;
  }
  .pTerm__memo {
    font-size: 0.85714em;
    margin-top: 1.5em;
    line-height: 1.5;
  }
}

.pNarrator__holder {
  background-color: #FFF;
  margin-top: 100px;
  width: 100%;
}

.pNarrator__title {
  font-size: 1.125rem;
  letter-spacing: 0.1em;
  position: relative;
  padding-bottom: 0.66667em;
  margin: 0 auto;
  text-align: center;
  font-weight: initial;
  opacity: 0;
}

.pNarrator__title::before {
  content: "";
  display: block;
  width: 2.38095em;
  height: 1px;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background-color: #b4b4b4;
}

.pNarrator__holder.-action .pNarrator__title {
  opacity: 1;
  transition: opacity 1s;
}

.pNarrator__wrapper {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  font-size: 1rem;
  margin-top: 2.5em;
  max-width: 32.5625em;
}

.pNarrator__each {
  margin: 0;
  opacity: 0;
  writing-mode: vertical-rl;
}

.pNarrator__holder.-action .pNarrator__each {
  opacity: 1;
  transition-property: opacity;
  transition-duration: 1.4s;
}

.pNarrator__pic {
  width: 7.25em;
  display: block;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  border-radius: 50%;
  line-height: 0;
}

.pNarrator__pic img {
  width: 100%;
}

.pNarrator__info {
  /* -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl; */
  text-align: left;
  margin: 0 auto;
}

.pNarrator__section, .pNarrator__name {
  display: block;
  font-feature-settings: normal;
}

.pNarrator__section {
  font-size: 0.875em;
  letter-spacing: 0.11em;
  line-height: 1.5;
}

.pNarrator__name {
  font-size: 1.14286em;
  letter-spacing: 0.10em;
  margin-right: 0.14286em;
  white-space: nowrap;
}

.pNarrator__name--inner {
  text-align: center;
}

.pNarrator__each:nth-of-type(1) {
  transition-delay: 0.4s;
}

.pNarrator__each:nth-of-type(2) {
  transition-delay: 0.54s;
}

.pNarrator__each:nth-of-type(3) {
  transition-delay: 0.68s;
}

.pNarrator__each:nth-of-type(4) {
  transition-delay: 0.82s;
}

.pNarrator__each:nth-of-type(5) {
  transition-delay: 0.96s;
}

.pNarrator__each:nth-of-type(6) {
  transition-delay: 1.1s;
}

.pNarrator__each:nth-of-type(7) {
  transition-delay: 1.24s;
}

@media only screen and (max-width: 899px) {
  .pNarrator__wrapper {
    max-width: 516px;
  }
}

@media only screen and (max-width: 767px) {
  .pNarrator__holder {
    margin-top: 15.38462vw;
  }
  .pNarrator__title {
    font-size: 4.10256vw;
  }
  .pNarrator__title::before {
    width: 1.875em;
  }
  .pNarrator__wrapper {
    flex-flow: row wrap;
    font-size: 3.58974vw;
    margin-top: 2.57143em;
    max-width: 61.53846vw;
    padding-left: 0;
    padding-right: 0;
  }
  .pNarrator__each {
    display: flex;
    align-items: center;
    margin-top: 2.57143em;
    width: 33%;
    margin-top: 3.375em;
  }
  .pNarrator__each:nth-of-type(1), .pNarrator__each:nth-of-type(2), .pNarrator__each:nth-of-type(3) {
    margin-top: 0;
  }
  .pNarrator__each:nth-of-type(1) {
    transition-delay: 0.4s;
  }
  .pNarrator__each:nth-of-type(2) {
    transition-delay: 0.54s;
  }
  .pNarrator__each:nth-of-type(3) {
    transition-delay: 0.68s;
  }
  .pNarrator__each:nth-of-type(4) {
    transition-delay: 0.4s;
  }
  .pNarrator__each:nth-of-type(5) {
    transition-delay: 0.54s;
  }
  .pNarrator__each:nth-of-type(6) {
    transition-delay: 0.68s;
  }
  .pNarrator__each:nth-of-type(7) {
    transition-delay: 0.4s;
  }
  .pNarrator__pic {
    width: 6em;
  }
  .pNarrator__section {
    font-size: 0.85714em;
    line-height: 1.5;
  }
  .pNarrator__name {
    font-size: 1.14286em;
    letter-spacing: 0.10em;
  }
}

@media only screen and (min-width: 768px) {
  .uHidden__pc {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .uHidden__sp {
    display: none;
  }
}