@charset "UTF-8";
/**
* Easing
*------------------------------------*/
/**
* Font-Face
*------------------------------------*/
@font-face {
  font-family: "CP-YuGothic";
  font-weight: 100;
  src: local("YuGothic-Light"), local("Yu Gothic Light");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 200;
  src: local("YuGothic-Light"), local("Yu Gothic Light");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 300;
  src: local("YuGothic-Regular"), local("Yu Gothic");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 400;
  src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 500;
  src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 600;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 700;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 800;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

@font-face {
  font-family: "CP-YuGothic";
  font-weight: 900;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

/* FUTURA / Design Cuts Licence (Full extended license) */
@font-face {
  font-family: "Futura";
  src: url("/font/Futura/Futura-DemObl.eot?#iefix") format("embedded-opentype"), url("/font/Futura/Futura-DemObl.woff") format("woff"), url("/font/Futura/Futura-DemObl.ttf") format("truetype");
  /* ttf - Safari, Android, iOS */
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Futura";
  src: url("/font/Futura/Futura-Med.eot?#iefix") format("embedded-opentype"), url("/font/Futura/Futura-Med.woff") format("woff"), url("/font/Futura/Futura-Med.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Futura";
  src: url("/font/Futura/Futura-Lig.eot?#iefix") format("embedded-opentype"), url("/font/Futura/Futura-Lig.woff") format("woff"), url("/font/Futura/Futura-Lig.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}

/*! Yaku Han JP (Gothic - All Include) v2.0.0 SIL by Qrac / Based on Noto Sans CJK JP */
@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 100;
  src: url("/font/YakuHanJP/YakuHanJP-Thin.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Thin.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Thin.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 200;
  src: url("/font/YakuHanJP/YakuHanJP-Light.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Light.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Light.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 300;
  src: url("/font/YakuHanJP/YakuHanJP-DemiLight.eot");
  src: url("/font/YakuHanJP/YakuHanJP-DemiLight.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-DemiLight.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 400;
  src: url("/font/YakuHanJP/YakuHanJP-Regular.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Regular.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Regular.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 500;
  src: url("/font/YakuHanJP/YakuHanJP-Medium.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Medium.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Medium.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 700;
  src: url("/font/YakuHanJP/YakuHanJP-Bold.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Bold.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Bold.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: 900;
  src: url("/font/YakuHanJP/YakuHanJP-Black.eot");
  src: url("/font/YakuHanJP/YakuHanJP-Black.woff2") format("woff2"), url("/font/YakuHanJP/YakuHanJP-Black.woff") format("woff");
}

/**a
* Color
*------------------------------------*/
/**
* Size
*------------------------------------*/
/**
* Reset
*------------------------------------*/
input,
select,
textarea {
  -moz-appearance: menulist-button;
  /* Firefox 36+ */
  -webkit-appearance: menulist-button;
  /* Chrome 41+ */
  outline: none;
  border: none;
  line-height: 1.7;
}

textarea {
  word-break: break-all;
}

input::-ms-clear {
  visibility: hidden;
}

input::-ms-reveal {
  visibility: hidden;
}

input:-webkit-autofill {
  box-shadow: 0 0 0px 1000px #fff inset;
}

/**
* Initialize
*------------------------------------*/
*,
*:before,
*:after {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-text-size-adjust: none;
  box-sizing: border-box;
}

*::selection {
  background: #242424;
  color: #FFFEFC;
}

html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

html {
  color: #443E3C;
  font-family: "Montserrat", "Noto Sans Japanese", "CP-YuGothic", YuGothic, "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", sans-serif;
  font-size: 14px;
  letter-spacing: 0.35px;
  letter-spacing: 0.025rem;
  font-feature-settings: 'pkna' 1;
  -webkit-text-size-adjust: 100%;
}

body {
  background: #FFFEFC;
}

a {
  outline: none;
  text-decoration: none;
  color: #443E3C;
}

a:hover {
  color: tint(#443E3C, 50%);
}

a[href^="tel:"] {
  cursor: default;
}

a[href^="tel:"]:hover {
  color: #443E3C;
}

ul,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.btn {
  background: transparent;
  -webkit-appearance: none;
          appearance: none;
  border-radius: 0;
  border: none;
  cursor: pointer;
}

.btn:focus {
  outline: none;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.video-source {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.img-responsive {
  max-width: 100%;
  height: auto;
  display: block;
}

.row {
  font-family: sans-serif;
  font-size: 0;
  letter-spacing: 0;
}

.col {
  font-family: "Montserrat", "Noto Sans Japanese", "CP-YuGothic", YuGothic, "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", sans-serif;
  font-size: 14px;
  display: inline-block;
  vertical-align: top;
}

.ff-futura {
  font-family: "Futura", sans-serif;
}

.ff-montserrat {
  font-family: "Montserrat", sans-serif;
}

.ff-main {
  font-family: "Libre Baskerville", sans-serif;
}

.ff-sub {
  font-family: "Montserrat", sans-serif;
}

.article-container {
  background: #FFFEFC;
}

.article-container .article-first-view {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

.article-container .breadcrumb {
  padding: 80px 180px 40px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.article-container .breadcrumb .icon-arrow {
  width: 24px;
  margin: 0;
}

.article-container .breadcrumb .icon-arrow .line,
.article-container .breadcrumb .icon-arrow .shaft {
  background: #FFFEFC;
}

.article-container .breadcrumb .icon-arrow .shaft {
  width: 6px;
}

.article-container .breadcrumb .icon-arrow.hover-hidden .shaft--top {
  transform: translate3d(-1px, -1.5px, 0) rotate(-40deg);
}

.article-container .breadcrumb .icon-arrow.hover-hidden .shaft--bottom {
  transform: translate3d(-1px, 1.5px, 0) rotate(40deg);
}

.article-container .breadcrumb .icon-arrow.hover-visible .shaft--top {
  transform: translate3d(-1px, 0, 0) rotate(0deg);
}

.article-container .breadcrumb .icon-arrow.hover-visible .shaft--bottom {
  transform: translate3d(-1px, 0, 0) rotate(0deg);
}

.article-container .breadcrumb .nav-link {
  display: table;
  overflow: hidden;
  position: relative;
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: .6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

.article-container .breadcrumb .text {
  padding-left: 32px;
  display: inline-block;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  color: #FFFEFC;
  font-size: 12px;
  font-size: 11.999px;
  font-size: 0.85714rem;
  letter-spacing: 1.4px;
  letter-spacing: .1rem;
  line-height: 17px;
  vertical-align: top;
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-hidden {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-hidden .shaft {
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-visible {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-visible .shaft {
  transition: transform 2s 0.35s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-hidden {
  transform: translate3d(-120%, 0, 0);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-hidden .shaft--top {
  transform: translate3d(-1px, 0, 0) rotate(0deg);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-hidden .shaft--bottom {
  transform: translate3d(-1px, 0, 0) rotate(0deg);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-visible {
  transform: translate3d(-100%, 0, 0);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-visible .shaft--top {
  transform: translate3d(-1px, -1.5px, 0) rotate(-40deg);
}

.article-container .breadcrumb .nav-link:hover .icon-arrow--prev.hover-visible .shaft--bottom {
  transform: translate3d(-1px, 1.5px, 0) rotate(40deg);
}

.article-container .breadcrumb .nav-link:hover {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.article-container .breadcrumb .nav-link:hover .text--prev {
  transform: translate3d(-30px, 0, 0);
}

.article-container .article-overview {
  width: 100%;
  padding: 0 180px 160px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-direction: column;
      flex-direction: column;
  z-index: 1;
}

.article-container .article-overview .heading .title {
  margin: 0 auto;
  text-align: center;
  color: #FFFEFC;
  font-size: 100px;
  font-size: 100px;
  font-size: 7.14286rem;
  font-weight: 500;
  white-space: nowrap;
}

.article-container .article-overview .info {
  margin-top: 32px;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  letter-spacing: .1em;
  line-height: 1.7;
}

.article-container .article-overview .info .title {
  color: #FFFEFC;
  font-weight: 600;
}

.article-container .article-overview .info .divide {
  color: #FFFEFC;
  padding: 0 8px;
}

.article-container .article-overview .info .content {
  color: rgba(255, 254, 252, 0.85);
  font-style: italic;
  font-weight: 400;
}

.article-container .article-overview .info-row {
  text-align: center;
}

.article-container .article-overview .info-row + .info-row {
  margin-top: 10px;
}

.article-container .scroll-to-content,
.article-container .scroll-to-top {
  padding: 48px 24px;
  line-height: 0;
  z-index: 2;
}

.article-container .scroll-to-content .btn-scroll,
.article-container .scroll-to-top .btn-scroll {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: block;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  line-height: 0;
}

.article-container .scroll-to-content .btn-scroll:focus, .article-container .scroll-to-content .btn-scroll:active,
.article-container .scroll-to-top .btn-scroll:focus,
.article-container .scroll-to-top .btn-scroll:active {
  outline: none;
}

.article-container .scroll-to-content .btn-scroll:hover,
.article-container .scroll-to-top .btn-scroll:hover {
  cursor: pointer;
}

.article-container .scroll-to-content .icon,
.article-container .scroll-to-top .icon {
  width: 18px;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.article-container .scroll-to-content {
  padding: 0;
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 80px;
}

.article-container .scroll-to-content .btn-scroll {
  border: 2px solid #FFFEFC;
  background: transparent;
}

.article-container .scroll-to-content .icon {
  top: 4px;
}

.article-container .scroll-to-content .path {
  fill: #FFFEFC;
}

.article-container .scroll-to-top {
  max-width: 1560px;
  background: #EEECEB;
  margin: 0 auto;
  visibility: hidden;
}

.article-container .scroll-to-top .btn-scroll {
  border: 2px solid #443E3C;
  background: transparent;
}

.article-container .scroll-to-top .icon {
  bottom: 4px;
}

.article-container .scroll-to-top .path {
  fill: #443E3C;
}

.article-container .overlay-divide {
  width: calc(100% - 240px);
  height: 200%;
  background: linear-gradient(to top, #eeeceb 80%, rgba(238, 236, 235, 0));
  border: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.article-container .overlay-divide:before, .article-container .overlay-divide:after {
  width: 120px;
  height: 100%;
  background: linear-gradient(to top, #fffefc 80%, rgba(255, 254, 252, 0));
  display: block;
  content: '';
  position: absolute;
  top: 0;
}

.article-container .overlay-divide:before {
  left: -120px;
}

.article-container .overlay-divide:after {
  right: -120px;
}

.article-container .article-main {
  background: #FFFEFC;
  padding: 0 120px;
  position: relative;
}

.article-container .article-main .content {
  max-width: 1560px;
  background: #EEECEB;
  margin: 0 auto;
  padding: 60px 120px 120px;
}

.article-container .article-main .content a {
  color: #3793c4;
}

.article-container .article-main .content a:hover {
  color: #5da9d1;
}

.article-container .article-main .heading {
  display: table;
  margin: 0 0 72px;
  position: relative;
  font-size: 40px;
  font-size: 39.999px;
  font-size: 2.85714rem;
  line-height: 1.4;
}

.article-container .article-main .heading:before {
  width: calc(100% - 32px);
  height: 16px;
  background: linear-gradient(135deg, #A388E3 0%, #5AC4F2 100%);
  content: '';
  position: absolute;
  right: -32px;
  bottom: 0;
}

.article-container .article-main .heading .title {
  position: relative;
}

.article-container .article-main .section {
  margin-top: 72px;
  line-height: 2.5;
}

.article-container .article-main .section:first-child {
  margin-top: 0;
}

.article-container .article-main .section + .section .heading {
  margin-top: 144px;
}

.article-container .article-main .section--figure {
  line-height: 0;
}

.article-container .article-main .section--figure img {
  max-width: 100%;
  width: auto;
  height: auto;
  border-radius: 2px;
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.15);
}

.article-container .article-main .section--grid .row {
  margin: 0 -24px -48px;
}

.article-container .article-main .section--grid .col {
  width: 50%;
  padding: 0 24px 48px;
}

.article-container .article-main .section--cta {
  background: #242424;
  padding: 64px;
  text-align: center;
  color: #FFFEFC;
  font-size: 16px;
  font-size: 16px;
  font-size: 1.14286rem;
}

.article-container .article-main .section--cta p + p {
  margin-top: 24px;
}

.article-container .article-main a.btn {
  width: 100%;
  height: 100%;
  background: #fff;
  padding: 16px;
  margin-top: 48px;
  border: 1px solid #EEECEB;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-align: center;
      align-items: center;
  color: #242424;
  font-size: 18px;
  font-size: 17.999px;
  font-size: 1.28571rem;
  font-weight: 500;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
  cursor: pointer;
}

.article-container .article-main a.btn:hover {
  background: transparent;
  color: #FFFEFC;
}

.article-container .article-main figure {
  margin: 0;
}

.article-container .article-main figure.image-figure {
  margin: 56px 0;
}

.article-container .article-main .iframe {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.article-container .article-main .iframe iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.article-container .article-main img {
  max-width: 100%;
}

.article-container .article-main p {
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  letter-spacing: 1.4px;
  letter-spacing: .1rem;
  margin: 0;
}

.article-container .article-main p + p {
  margin-top: 56px;
}

.article-container .article-main ul, .article-container .article-main ol {
  padding-left: 24px;
  margin-top: 56px;
  margin-bottom: 56px;
}

.article-container .article-main ul.is-strong li, .article-container .article-main ol.is-strong li {
  font-weight: 600;
}

.article-container .article-main ul.is-none, .article-container .article-main ol.is-none {
  padding-left: 8px;
}

.article-container .article-main ul.is-none > li, .article-container .article-main ol.is-none > li {
  list-style: none;
}

.article-container .article-main ul > li {
  list-style: initial;
}

.article-container .article-main ol > li {
  list-style: inherit;
}

.article-container .article-main .video-container {
  position: relative;
  padding-top: 100%;
}

.article-container .article-main .video-container .video, .article-container .article-main .video-container .img {
  max-width: 720px;
  width: 100%;
  height: auto;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
}

.article-container .article-main .video-container .video-controls {
  width: 100%;
  height: 100%;
  background: transparent;
  position: absolute;
  top: 0;
  left: 0;
}

.article-container .article-main .video-container .btn {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  background-size: 75px;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  transition: visibility 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .article-main .video-container .btn--play {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 75'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cpath id='iconmonstr-video-13' class='cls-1' d='M37.5,0A37.5,37.5,0,1,0,75,37.5,37.5,37.5,0,0,0,37.5,0ZM28.125,53.125V21.875L56.25,37.956Z'/%3E%3C/svg%3E%0A");
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.article-container .article-main .video-container .btn--pause {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 75'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cpath id='除外_1' data-name='除外 1' class='cls-1' d='M37.5,75a37.325,37.325,0,0,1-20.966-6.4A37.612,37.612,0,0,1,2.947,52.1,37.449,37.449,0,0,1,6.4,16.534,37.612,37.612,0,0,1,22.9,2.947,37.448,37.448,0,0,1,58.466,6.4,37.613,37.613,0,0,1,72.053,22.9,37.448,37.448,0,0,1,68.6,58.466,37.612,37.612,0,0,1,52.1,72.053,37.262,37.262,0,0,1,37.5,75Zm3.722-52.115V52.32h7.461V22.885Zm-14.921,0V52.32h7.461V22.885Z' transform='translate(0 0)'/%3E%3C/svg%3E%0A");
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.article-container .article-main .video-container.is-play .btn--play {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  pointer-events: none;
}

.article-container .article-main .video-container.is-play .img {
  visibility: hidden;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.article-container .article-main .video-container.is-play .btn--pause {
  pointer-events: auto;
  visibility: visible;
}

.article-container .article-main .video-container.is-play.is-hover .btn--pause {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.article-container .icon-arrow {
  width: 134px;
  height: 16px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .icon-arrow .line, .article-container .icon-arrow .shaft {
  height: 1px;
  background: #242424;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}

.article-container .icon-arrow .line {
  width: 100%;
}

.article-container .icon-arrow .shaft {
  width: 8px;
}

.article-container .icon-arrow--prev.hover-hidden, .article-container .icon-arrow--next.hover-hidden {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.article-container .icon-arrow--prev.hover-hidden .shaft, .article-container .icon-arrow--next.hover-hidden .shaft {
  transition: transform 2s 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .icon-arrow--prev.hover-visible, .article-container .icon-arrow--next.hover-visible {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.article-container .icon-arrow--prev.hover-visible .shaft, .article-container .icon-arrow--next.hover-visible .shaft {
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .icon-arrow--prev {
  left: 0;
}

.article-container .icon-arrow--prev .line, .article-container .icon-arrow--prev .shaft {
  left: 0;
}

.article-container .icon-arrow--prev.hover-hidden .shaft--top {
  transform: translate3d(-1px, -2.5px, 0) rotate(-40deg);
}

.article-container .icon-arrow--prev.hover-hidden .shaft--bottom {
  transform: translate3d(-1px, 2.5px, 0) rotate(40deg);
}

.article-container .icon-arrow--prev.hover-visible {
  left: 100%;
}

.article-container .icon-arrow--prev.hover-visible .shaft--top {
  transform: translate3d(1px, 0, 0) rotate(0deg);
}

.article-container .icon-arrow--prev.hover-visible .shaft--bottom {
  transform: translate3d(1px, 0, 0) rotate(0deg);
}

.article-container .icon-arrow--next {
  right: 0;
}

.article-container .icon-arrow--next .line, .article-container .icon-arrow--next .shaft {
  right: 0;
}

.article-container .icon-arrow--next.hover-hidden .shaft--top {
  transform: translate3d(1px, 2.5px, 0) rotate(-40deg);
}

.article-container .icon-arrow--next.hover-hidden .shaft--bottom {
  transform: translate3d(1px, -2.5px, 0) rotate(40deg);
}

.article-container .icon-arrow--next.hover-visible {
  right: 100%;
}

.article-container .icon-arrow--next.hover-visible .shaft--top {
  transform: translate3d(1px, 0, 0) rotate(0deg);
}

.article-container .icon-arrow--next.hover-visible .shaft--bottom {
  transform: translate3d(1px, 0, 0) rotate(0deg);
}

.article-container .article-nav {
  max-width: 1560px;
  width: 100%;
  height: 160px;
  background: #FFFEFC;
  margin: 0 auto;
  position: relative;
}

.article-container .article-nav .nav {
  width: 50%;
  color: #242424;
  position: absolute;
  top: 50%;
  transform: translate3d(0, -50%, 0);
}

.article-container .article-nav .nav .nav-link {
  display: table;
  overflow: hidden;
  position: relative;
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: .6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

.article-container .article-nav .nav .text {
  display: inline-block;
  line-height: 1.7;
}

.article-container .article-nav .nav .text .nav-title {
  font-size: 12px;
  font-size: 11.999px;
  font-size: 0.85714rem;
  transition: transform 1.25s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .article-nav .nav .text .article-title {
  font-size: 24px;
  font-size: 24px;
  font-size: 1.71429rem;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-container .article-nav .nav--prev {
  left: 0;
  text-align: left;
}

.article-container .article-nav .nav--prev .text {
  padding-left: 150px;
}

.article-container .article-nav .nav--prev .nav-link {
  margin-left: 0;
  margin-right: auto;
}

.article-container .article-nav .nav--next {
  right: 0;
  text-align: right;
}

.article-container .article-nav .nav--next .text {
  padding-right: 150px;
}

.article-container .article-nav .nav--next .nav-link {
  margin-left: auto;
  margin-right: 0;
}

@media all and (min-width: 1024px) {
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-hidden, .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-hidden {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-hidden .shaft, .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-hidden .shaft {
    transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-visible, .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-visible {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-visible .shaft, .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-visible .shaft {
    transition: transform 2s 0.35s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-hidden {
    transform: translate3d(-120%, 0, 0);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-hidden .shaft--top {
    transform: translate3d(1px, 0, 0) rotate(0deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-hidden .shaft--bottom {
    transform: translate3d(1px, 0, 0) rotate(0deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-visible {
    transform: translate3d(-100%, 0, 0);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-visible .shaft--top {
    transform: translate3d(-1px, -2.5px, 0) rotate(-40deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--prev.hover-visible .shaft--bottom {
    transform: translate3d(-1px, 2.5px, 0) rotate(40deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-hidden {
    transform: translate3d(120%, 0, 0);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-hidden .shaft--top {
    transform: translate3d(1px, 0, 0) rotate(0deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-hidden .shaft--bottom {
    transform: translate3d(1px, 0, 0) rotate(0deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-visible {
    transform: translate3d(100%, 0, 0);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-visible .shaft--top {
    transform: translate3d(1px, 2.5px, 0) rotate(-40deg);
  }
  .article-container .article-nav .nav-link:hover .icon-arrow--next.hover-visible .shaft--bottom {
    transform: translate3d(1px, -2.5px, 0) rotate(40deg);
  }
  .article-container .article-nav .nav-link:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  .article-container .article-nav .nav-link:hover .text--prev .nav-title,
  .article-container .article-nav .nav-link:hover .text--prev .article-title {
    transform: translate3d(-150px, 0, 0);
  }
  .article-container .article-nav .nav-link:hover .text--next .nav-title,
  .article-container .article-nav .nav-link:hover .text--next .article-title {
    transform: translate3d(150px, 0, 0);
  }
}

/**
* Labページ
*---------------------------------------------*/
.page--lab .article-overview .heading .title {
  font-size: 40px;
  font-size: 39.999px;
  font-size: 2.85714rem;
  white-space: normal;
}

.page--lab .article-overview .info-row > .title,
.page--lab .article-overview .info-row > .divide,
.page--lab .article-overview .info-row > .content {
  display: none;
}

.page--lab .article-overview .info-row .content {
  color: #FFFEFC;
}

/**
* 記事が表示されている時
*---------------------------------------------*/
.page--article.is-visible-article .scroll-to-top {
  visibility: visible;
}

/**
* 記事が表示されていない時（ファーストビューのヘッダーフッター周り）
*---------------------------------------------*/
.page--article:not(.is-visible-article):not(.is-menu-open) .frame .line {
  background: #FFFEFC;
}

.page--article:not(.is-visible-article):not(.is-menu-open) .header-logo .path--header-logo {
  fill: #FFFEFC;
}

.page--article:not(.is-visible-article):not(.is-menu-open) .menu-button .toggle-icon .btn-text {
  color: #FFFEFC;
}

.page--article:not(.is-visible-article):not(.is-menu-open) .text-hover-link--1 a:before,
.page--article:not(.is-visible-article):not(.is-menu-open) .icon-hamburger .path {
  background: #FFFEFC;
}

.page--article:not(.is-visible-article):not(.is-menu-open) .site-footer,
.page--article:not(.is-visible-article):not(.is-menu-open) .site-footer a {
  color: #FFFEFC;
}

.page--article:not(.is-visible-article):not(.is-menu-open) .site-footer {
  background: transparent;
  transition: background 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.page--article.is-menu-open .site-footer {
  background: #FFFEFC;
  transition: background 1s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

@media all and (max-width: 1365px) {
  .article-container .article-overview {
    padding: 0 120px;
  }
}

@media all and (max-width: 1023px) {
  .article-container .breadcrumb {
    padding-left: 64px;
  }
  .article-container .article-overview {
    padding: 0 48px;
  }
  .article-container .article-overview .heading .title {
    font-size: 30px;
    font-size: 9.375vm;
    font-size: 9.375vmin;
  }
  .article-container .article-overview .info {
    font-size: 10px;
    font-size: 0.71429rem;
  }
  .article-container .scroll-to-content {
    bottom: 40px;
  }
  .article-container .overlay-divide {
    width: 100%;
    background: linear-gradient(to top, #eeeceb 80%, rgba(238, 236, 235, 0));
  }
  .article-container .overlay-divide:before, .article-container .overlay-divide:after {
    display: none;
  }
  .article-container .article-main {
    padding: 0;
  }
  .article-container .article-main .content {
    padding: 64px 32px;
  }
  .article-container .article-main .heading {
    font-size: 18px;
    font-size: 5.625vm;
    font-size: 5.625vmin;
    margin: 0 0 32px;
  }
  .article-container .article-main figure.image-figure {
    margin: 32px 0;
  }
  .article-container .article-main p + p {
    margin-top: 32px;
  }
  .article-container .article-main ul, .article-container .article-main ol {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .article-container .article-main .section {
    margin-top: 48px;
  }
  .article-container .article-main .section + .section .heading {
    margin-top: 48px;
  }
  .article-container .article-main .section--figure + .section--figure {
    margin-top: 24px;
  }
  .article-container .article-main .section--grid .row {
    margin: 0 -12px -24px;
  }
  .article-container .article-main .section--grid .col {
    padding: 0 12px 24px;
  }
  .article-container .article-nav {
    height: auto;
    margin-top: 0;
    padding: 64px 32px 48px;
  }
  .article-container .article-nav .nav {
    width: 100%;
    position: static;
    top: auto;
    transform: translate3d(0, 0, 0);
  }
  .article-container .article-nav .nav .text .nav-title {
    font-size: 10px;
    font-size: 0.71429rem;
  }
  .article-container .article-nav .nav .text .article-title {
    font-size: 16px;
    font-size: 5vm;
    font-size: 5vmin;
  }
  .article-container .article-nav .nav .nav-link {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  .article-container .article-nav .nav--prev {
    padding-top: 40px;
  }
  .article-container .article-nav .nav--prev .text {
    padding-left: 64px;
  }
  .article-container .article-nav .nav--next .text {
    padding-right: 64px;
  }
  .article-container .article-nav .icon-arrow {
    width: 48px;
  }
}

@media all and (max-width: 640px) {
  .article-container .breadcrumb {
    padding-top: 64px;
    padding-left: 32px;
    padding-bottom: 24px;
  }
  .article-container .breadcrumb .text {
    font-size: 10px;
    font-size: 0.71429rem;
  }
  .article-container .article-overview {
    padding: 0 32px;
  }
  .article-container .article-main .section--grid .col,
  .article-container .article-main .section--video .col {
    width: 100%;
  }
}

.article-mv-video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.article-mv-video:after {
  width: 100%;
  height: 100%;
  background: rgba(36, 36, 36, 0.25) url("../img/patterns/gridtile.png") repeat;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.article-mv-canvas {
  width: 100%;
  height: 100%;
  position: relative;
  line-height: 0;
}

.article-mv-canvas canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.article-visual {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  overflow: hidden;
}

.article-visual .image-eyecatch {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  right: -50%;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  transform: translate3d(-280px, -50%, 0);
}

.article-visual .image-eyecatch .img-container {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  z-index: -1;
  line-height: 0;
}

.article-visual .image-eyecatch .img-container:after {
  width: 100%;
  height: 100%;
  background: rgba(36, 36, 36, 0.15) url("../img/patterns/gridtile.png") repeat;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.article-visual .image-eyecatch .img-container .img {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.article-visual .overlay-image {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: -50%;
  transform: translate3d(-280px, 0, 0);
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: visible;
}

.article-visual .overlay-image #gradient-overlay {
  width: 100%;
  height: auto;
  fill: url(#linear-gradient);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform-style: preserve-3d;
  transform: translate3d(-50%, -50%, 0);
  transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-visual .overlay-image.is-hide #gradient-overlay {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.article-visual .overlay-page .block {
  width: 100%;
  height: 100%;
  background: #FFFEFC;
  position: absolute;
  top: 0;
  transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-visual .overlay-page .block__left {
  right: 440px;
}

.article-visual .overlay-page .block__right {
  right: -100%;
  transform: translate3d(-120px, 0, 0);
}

@media all and (min-width: 1600px) {
  .article-visual .image-eyecatch {
    transform: translate3d(-344px, -50%, 0);
  }
  .article-visual .overlay-image {
    transform: translate3d(-344px, 0, 0);
  }
  .article-visual .overlay-page .block__left {
    right: 567px;
  }
}

@media all and (max-width: 1023px) {
  .article-visual {
    display: none;
  }
}

.frame {
  position: fixed;
  overflow: hidden;
}

.frame--hr {
  width: calc(100% - 120px);
  height: 1px;
}

.frame--vt {
  width: 1px;
  height: calc(100% - 120px);
}

.frame--top {
  top: 60px;
  left: 60px;
}

.frame--right {
  top: 60px;
  right: 60px;
}

.frame--left {
  top: 60px;
  left: 60px;
}

.frame--bottom {
  left: 60px;
  bottom: 60px;
}

.frame .line {
  width: 100%;
  height: 100%;
  background: #443E3C;
  content: '';
  display: block;
}

@media all and (max-width: 1023px) {
  .page .frame .line {
    opacity: .4;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  }
  .page--home .frame--vt {
    display: none;
  }
  .page--home .frame--hr {
    width: 100%;
    display: none;
  }
  .page--home .frame--top {
    top: 60px;
    left: 0;
  }
  .page--home .frame--top .line {
    background: #FFFEFC;
  }
  .page--home .frame--bottom {
    left: auto;
    right: 0;
    bottom: 60px;
  }
  .page--home .frame--bottom .line {
    background: #EEECEB;
  }
}

.google-map-container {
  width: 100%;
  position: relative;
}

#google-map {
  width: 100%;
  padding-top: 66.64062%;
}

#google-map .info-window {
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  font-family: "Montserrat", "Noto Sans Japanese", "CP-YuGothic", YuGothic, "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", sans-serif;
}

@media all and (max-width: 640px) {
  .section--map #google-map {
    padding-top: 100%;
  }
  .page--contact .section:nth-child(odd):not(.section--first-view).section--map .section__inner--left .section__content:before {
    padding-top: 100%;
  }
}

/*
  Overlay
-------------------- */
.overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform-style: preserve-3d;
  will-change: transform;
  overflow: hidden;
}

.overlay--global-menu {
  width: calc(100% - 60px);
  background: rgba(36, 36, 36, 0.9);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  transition: visibility 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.overlay--page {
  visibility: hidden;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.overlay .preloader-logo {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  line-height: 0;
}

.overlay .logo {
  width: 250px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
}

.overlay .logo .path {
  fill: #242424;
}

.overlay--color-1 {
  background: #242424;
  opacity: .85;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
}

.overlay--color-1 .logo .path {
  fill: #FFFEFC;
}

.overlay--color-2 {
  background: #EEECEB;
}

.overlay--color-2 .logo .path {
  fill: #443E3C;
}

.overlay--color-3 {
  background: #FFFEFC;
}

.overlay--color-3 .logo .path {
  fill: #242424;
}

@media all and (max-width: 1023px) {
  .overlay--global-menu {
    width: 100%;
  }
  .overlay .logo {
    width: 150px;
  }
}

/*
  Preloader
-------------------- */
#preloader {
  background: #FFFEFC;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

#preloader .preloader-logo {
  width: 250px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  line-height: 0;
}

#preloader .logo {
  width: 100%;
  height: auto;
}

#preloader .logo .path {
  fill: #242424;
}

@media all and (max-width: 1023px) {
  #preloader .preloader-logo {
    width: 150px;
  }
}

/* --------------------------------------------------
    SNS Links
---------------------------------------------------- */
.sns-links {
  height: 60px;
  padding: 0 60px;
  position: fixed;
  left: 0;
  bottom: 0;
  transition: visibility 2s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1), transform 2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.sns-links .icon-list {
  margin-top: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: left;
      justify-content: left;
  -ms-flex-align: center;
      align-items: center;
  line-height: 0;
}

.sns-links .icon-list-item + .icon-list-item {
  margin-left: 16px;
}

.sns-links .icon {
  width: 24px;
  height: auto;
}

.sns-links .icon .path {
  fill: #443E3C;
}

@media all and (max-width: 1023px) {
  .sns-links {
    height: 13px;
    padding: 0;
    margin: 20px 16px;
  }
  .sns-links .icon-list {
    margin-top: 0;
    position: absolute;
    top: 50%;
    left: 0;
    -ms-transform: translateY(-50%);
        transform: translateY(-50%);
  }
  .sns-links .icon {
    width: 20px;
  }
}

.container-article-list {
  min-height: 768px;
  min-height: 100vh;
}

.tab-works {
  width: 152px;
  height: 100%;
  position: fixed;
  top: 144px;
  left: 120px;
}

.tab-works .menu-item {
  position: relative;
  overflow: hidden;
  padding: 8px 0;
  margin-top: -8px;
}

.tab-works .menu-item a {
  display: block;
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.tab-works .menu-item.is-current-page a {
  pointer-events: none;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.tab-works .menu-item .link-text {
  background: #FFFEFC;
  padding: 0 16px;
  display: inline-block;
  position: relative;
  z-index: 1;
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;
}

.tab-works .menu-item .link-text:before {
  width: 0;
  height: 2px;
  background: #443E3C;
  content: '';
  position: absolute;
  top: 0;
  left: 8px;
  bottom: 0;
  margin: auto;
  transition: width 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 0.75s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.tab-works .menu-item .link-text:hover span {
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
}

.tab-works .menu-item:not(.is-current-page) a:hover .link-text:before {
  width: calc(100% - 16px);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.tab-works .menu-item:not(.is-current-page) .line.line--active {
  display: none;
}

.tab-works .line {
  width: 100%;
  height: 2px;
  background: #443E3C;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}

.col--article-list {
  width: 61.80556%;
}

.article-list {
  padding: 144px 0 144px 334px;
}

.article-list .lists {
  margin-top: -32px;
}

.article-list .lists:hover .list-item a,
.article-list .lists:hover .list-item:hover a {
  transition: opacity 2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.article-list .lists:hover .list-item a {
  opacity: .5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}

.article-list .lists:hover .list-item:hover a {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.article-list .lists.is-comingsoon {
  margin-bottom: 48px;
}

.article-list .lists.is-comingsoon .list-item {
  line-height: 2;
}

.article-list .lists.is-comingsoon .list-item:first-child {
  padding: 16px 32px 30px 0;
}

.article-list .lists.is-comingsoon .list-item.title {
  padding-top: 0;
  font-size: 40px;
  font-size: 39.999px;
  font-size: 2.85714rem;
}

.article-list .lists.is-comingsoon .list-item .text {
  margin: 0;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  letter-spacing: 2.1px;
  letter-spacing: .15rem;
}

.article-list .lists.is-comingsoon .list-item .text + .text {
  margin-top: 16px;
}

.article-list .list-item {
  display: block;
}

.article-list a {
  display: inline-block;
  transition: opacity 6s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.solution-list .article-list .list-item:hover a:after {
  transform: translate3d(70%, 0, 0);
  visibility: visible;
}

.solution-list .article-list a {
  padding: 24px 32px 24px 0;
  position: relative;
  overflow: hidden;
}

.solution-list .article-list a:after {
  width: 100%;
  height: 24px;
  background: linear-gradient(135deg, #A388E3 0%, #5AC4F2 100%);
  content: '';
  position: absolute;
  left: 0;
  bottom: 32px;
  z-index: 1;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  transform: translate3d(-100%, 0, 0);
  visibility: hidden;
}

.solution-list .article-list .link-text {
  white-space: nowrap;
  color: #443E3C;
  font-size: 64px;
  font-size: 7.19101vm;
  font-size: 7.19101vmin;
  position: relative;
  z-index: 2;
}

.lab-list .article-list .lists {
  padding: 24px 32px 24px 0;
}

.lab-list .article-list .link-text {
  font-size: 26px;
  font-size: 2.92135vm;
  font-size: 2.92135vmin;
}

.lab-list .article-list a {
  line-height: 1.75;
  letter-spacing: .05em;
}

.lab-list .article-list a span {
  background: linear-gradient(135deg, #A388E3 0%, #5AC4F2 100%);
  background-size: 0 8px;
  background-repeat: no-repeat;
  background-position: left 100%;
  transition: background-size 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.lab-list .article-list a:hover span {
  background-size: 100% 8px;
}

@media all and (max-width: 1365px) {
  .container-article-list > .col {
    display: block;
  }
  .tab-works {
    height: auto;
    top: 52px;
  }
  .tab-works .menu {
    width: 200px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
  }
  .tab-works .menu-item {
    margin-top: 0;
  }
  .tab-works .menu-item:not(.is-current-page) {
    opacity: .6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .tab-works .menu-item:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  .tab-works .menu-item + .menu-item {
    margin-left: 16px;
  }
  .article-list {
    padding: 144px 0 144px 134px;
  }
}

@media all and (max-width: 1023px) {
  .tab-works {
    left: -5px;
  }
  .tab-works .menu-item + .menu-item {
    margin-left: 0;
  }
  .tab-works .menu-item .link-text {
    font-size: 12px;
    font-size: 0.85714rem;
  }
  .col--article-list {
    width: 80%;
  }
  .article-list {
    padding: 144px 0 144px 40px;
  }
  .article-list .is-comingsoon .title {
    font-size: 64px;
    font-size: 7.19101vm;
    font-size: 7.19101vmin;
  }
  .article-visual .overlay-image #gradient-overlay {
    width: auto;
    height: 250%;
  }
  .article-visual .overlay-page .block__left {
    right: 50%;
  }
  .article-visual .overlay-page .block__right {
    display: none;
  }
  .frame--left {
    left: 16px;
  }
  .frame--right {
    right: 16px;
  }
}

/* --------------------------------------------------
    Main Visual
---------------------------------------------------- */
.mv-video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.mv-container {
  max-width: 1680px;
  width: 100%;
  padding: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  overflow: hidden;
}

.mv-container .inner {
  width: 100%;
  position: relative;
}

@media all and (min-width: 1023px) {
  .mv-container {
    padding: 0 100px;
  }
}

@media all and (min-width: 1280px) {
  .mv-container {
    padding: 0 200px;
  }
}

.mv-canvas {
  width: 100%;
  padding-top: 56.25%;
  position: relative;
  line-height: 0;
}

.mv-canvas canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.mv-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  line-height: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform-style: preserve-3d;
}

.mv-overlay .mv-mask {
  width: 100%;
  position: relative;
}

.mv-overlay .mv-mask .polygon--black {
  fill: #242424;
}

.mv-overlay .mv-mask.is-play .polygon--black {
  fill: rgba(0, 0, 0, 0.15);
}

.mv-overlay .mv-deco-container {
  width: 50%;
  height: 50%;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
}

.mv-overlay .mv-deco-container .mv-lines {
  width: 120%;
  height: 100%;
  -ms-transform: rotate(29.5deg);
      transform: rotate(29.5deg);
  -ms-transform-origin: right bottom;
      transform-origin: right bottom;
  position: absolute;
  right: -10.5%;
  bottom: 0;
}

.mv-overlay .mv-deco-container .mv-line {
  position: absolute;
  right: 10%;
  bottom: 0;
  transform: translate3d(0, 0, 0);
}

.mv-overlay .mv-deco-container .mv-line .rect {
  fill: #EEECEB;
}

.mv-heading-container {
  width: 50%;
  height: 50%;
  position: absolute;
  left: 0;
  bottom: 0;
  white-space: nowrap;
  pointer-events: none;
}

.mv-heading {
  padding-top: 16px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate3d(0, -50%, 0);
}

.mv-heading .heading-title .mv-link {
  color: #FFFEFC;
  font-size: 80px;
  font-size: 80px;
  font-size: 5.71429rem;
}

.mv-heading .heading-info {
  display: inline-block;
  margin-top: 16px;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
}

.mv-heading .heading-info .title {
  color: #FFFEFC;
}

.mv-heading .heading-info .divide {
  padding: 0 8px;
}

.mv-heading .heading-info .content {
  color: rgba(255, 254, 252, 0.85);
  font-style: italic;
}

.mv-heading .info-row {
  white-space: nowrap;
}

.mv-heading .info-row + .info-row {
  margin-top: 8px;
}

.mv-heading .mv-link,
.mv-heading .heading-info span {
  pointer-events: auto;
}

.mv-heading .mo {
  overflow: hidden;
  text-align: justify;
}

.mv-heading .mo span {
  display: inline-block;
}

.mask-mv-heading__rotate {
  width: 120%;
  height: 100%;
  -ms-transform: rotate(29.5deg);
      transform: rotate(29.5deg);
  -ms-transform-origin: left top;
      transform-origin: left top;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.mask-mv-heading__adjust {
  width: 100%;
  height: 100%;
  background: #EEECEB;
  -ms-transform: rotate(-29.5deg);
      transform: rotate(-29.5deg);
  -ms-transform-origin: left top;
      transform-origin: left top;
  position: absolute;
}

.mask-mv-heading .mv-heading .heading-title .mv-link {
  color: #b4b4b4;
}

.mask-mv-heading .mv-heading .heading-info .title {
  color: #443E3C;
}

.mask-mv-heading .mv-heading .heading-info .content {
  color: rgba(68, 62, 60, 0.85);
}

.mask-mv-heading .mv-heading .mo {
  overflow: visible;
}

.mv-link:hover {
  cursor: pointer;
}

.mv-slide-nav {
  padding-left: 24px;
  position: absolute;
  top: 50%;
  right: 0;
  -ms-transform: translate(100%, -50%);
      transform: translate(100%, -50%);
}

.mv-slide-nav .nav {
  width: 16px;
  height: 9px;
  background-size: 100%;
  background-position: center center;
  margin-left: auto;
  margin-right: auto;
  cursor: pointer;
}

.mv-slide-nav .nav--prev {
  margin-bottom: 32px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%209.707%205.561%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20none%3B%20stroke%3A%20%23443e3c%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_3%22%20data-name%3D%22%E3%83%91%E3%82%B9%203%22%20class%3D%22cls-1%22%20d%3D%22M0%2C0%2C4.5%2C4.5%2C9%2C0%22%20transform%3D%22translate(9.354%205.207)%20rotate(180)%22%2F%3E%3C%2Fsvg%3E");
}

.mv-slide-nav .nav--next {
  margin-top: 32px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%209.707%205.561%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20none%3B%20stroke%3A%20%23443e3c%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_2%22%20data-name%3D%22%E3%83%91%E3%82%B9%202%22%20class%3D%22cls-1%22%20d%3D%22M0%2C0%2C4.5%2C4.5%2C9%2C0%22%20transform%3D%22translate(0.354%200.354)%22%2F%3E%3C%2Fsvg%3E");
}

.mv-slide-nav .dot {
  width: 24px;
  height: 24px;
  cursor: pointer;
  position: relative;
}

.mv-slide-nav .dot:before, .mv-slide-nav .dot:after {
  transition: transform 2s cubic-bezier(0.075, 0.82, 0.165, 1);
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.mv-slide-nav .dot:before {
  width: 24px;
  height: 24px;
  border: 1px solid #443E3C;
  border-radius: 100%;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  -ms-transform: scale(0);
      transform: scale(0);
}

.mv-slide-nav .dot:after {
  width: 8px;
  height: 8px;
  background: #443E3C;
  border-radius: 100%;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -ms-transform: scale(0.75);
      transform: scale(0.75);
}

.mv-slide-nav .dot + .dot {
  margin-top: 8px;
}

.mv-slide-nav .dot.is-current:before, .mv-slide-nav .dot.is-current:after {
  -ms-transform: scale(1);
      transform: scale(1);
}

.mv-slide-progress {
  width: 80px;
  height: 8px;
  position: absolute;
  right: 32px;
  bottom: 32px;
}

.mv-slide-progress .progress-bar {
  width: inherit;
  height: inherit;
  background: rgba(255, 254, 252, 0.5);
  overflow: hidden;
}

.mv-slide-progress .progress-bar__current {
  width: inherit;
  height: inherit;
  background: #FFFEFC;
}

.mv-slide-progress .slide-number {
  position: absolute;
  top: 50%;
  left: -8px;
  transform: translate3d(-100%, -50%, 0);
}

.mv-slide-progress .slide-number .num {
  margin-right: 8px;
  color: rgba(255, 254, 252, 0.75);
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 10px;
  letter-spacing: .05em;
}

.mv-slide-progress .slide-number .num--current {
  color: #FFFEFC;
  font-size: 20px;
}

@media all and (max-width: 1023px) {
  .mv-container {
    max-width: 100%;
    height: 100%;
    padding: 0;
    position: fixed;
    top: 50%;
    left: 50%;
  }
  .mv-container .inner {
    width: 100%;
    height: 100%;
  }
  .mv-container .mv-slide-nav {
    display: none;
  }
  .mv-container .mv-slide-progress {
    right: 16px;
    bottom: 89px;
  }
  .mv-container .mask-mv-heading {
    display: none;
  }
  .mv-container .mo {
    overflow: visible;
  }
  .mv-canvas {
    width: 177.77778vh;
    height: 100%;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
  }
  .mv-heading-container {
    width: 100%;
    padding: 0 16px;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    text-align: center;
  }
  .mv-heading {
    padding-top: 0;
    right: 0;
    margin: auto;
  }
  .mv-heading .heading-title {
    text-align: center;
  }
  .mv-heading .heading-title .mv-link {
    color: #FFFEFC;
    font-size: 32px;
    font-size: 2.28571rem;
    font-size: 8vm;
    font-size: 8vmin;
  }
  .mv-heading .heading-info {
    margin-top: 32px;
    font-size: 12px;
    font-size: 0.85714rem;
  }
  .mv-heading .heading-info .info-row {
    text-align: center;
    white-space: normal;
  }
  .mv-heading .heading-info .info-row + .info-row {
    margin-top: 16px;
  }
  .mv-heading .heading-info .divide {
    display: none;
  }
  .mv-heading .heading-info .title, .mv-heading .heading-info .content {
    color: #FFFEFC;
    display: block;
  }
  .mv-heading .heading-info .title {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    font-weight: 600;
  }
  .mv-heading .heading-info .content {
    margin-top: 6px;
    opacity: .8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    line-height: 1.7;
  }
  .mv-overlay {
    width: 100%;
    height: 100%;
  }
  .mv-overlay .mv-deco-container {
    display: none;
  }
  .mv-overlay .mv-mask {
    width: 177.77778vh;
    height: 100%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
  }
}

/* --------------------------------------------------
    Menu Button
---------------------------------------------------- */
.icon-hamburger {
  background: transparent;
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  width: 40px;
  height: 15px;
}

.icon-hamburger .path {
  width: 32px;
  height: 2px;
  background: #443E3C;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.icon-hamburger .path--top, .icon-hamburger .path--bottom {
  left: 0;
}

.icon-hamburger .path--top {
  top: -12px;
}

.icon-hamburger .path--bottom {
  bottom: -12px;
}

.icon-hamburger--anim .path {
  transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), background-color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  will-change: transform, width;
}

.icon-hamburger--anim .path--top {
  transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.icon-hamburger--anim .path--bottom {
  transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), width 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.menu-button {
  width: 60px;
  height: 100%;
  padding: 59px 0;
  position: fixed;
  top: 0;
  left: 0;
}

.menu-button .toggle-menu-button {
  width: 100%;
  height: 100px;
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate3d(0, -50%, 0);
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.menu-button .toggle-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0) rotate(-90deg);
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.menu-button .toggle-icon .icon, .menu-button .toggle-icon .btn-text {
  padding: 0 4px;
  position: absolute;
  top: 50%;
  left: 50%;
}

.menu-button .toggle-icon .icon {
  transform: translate3d(-100%, -50%, 0);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.menu-button .toggle-icon .btn-text {
  transform: translate3d(0%, -50%, 0);
  color: #443E3C;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  font-weight: 600;
  line-height: 15px;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

/* --------------------------------------------------
    Global Menu
---------------------------------------------------- */
.global-nav {
  width: 467px;
  height: 100%;
  background: #FFFEFC;
  padding: 0 60px 0 104px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: left;
      align-items: left;
  -ms-flex-direction: column;
      flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  transform: translate3d(-100%, 0, 0);
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.global-nav .menu-container {
  width: 100%;
}

.global-nav .menu-item {
  padding: 6px 0;
  position: relative;
  overflow: hidden;
}

.global-nav .menu-item a {
  display: block;
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  transition: opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.global-nav .menu-item.is-current-page:before {
  width: 100%;
  height: 2px;
  background: #443E3C;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  transform: translate3d(-100%, 0, 0);
  transition: transform 1s 1s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 1s 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.global-nav .menu-item.is-current-page a {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.global-nav .menu-item .link-text {
  background: #FFFEFC;
  padding: 0 16px;
  display: inline-block;
  position: relative;
  z-index: 1;
  font-size: 32px;
  text-transform: uppercase;
}

.global-nav .menu-item .link-text:before {
  width: 0;
  height: 2px;
  background: #443E3C;
  content: '';
  position: absolute;
  top: 0;
  left: 8px;
  bottom: 0;
  margin: auto;
  transition: width 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 0.75s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.global-nav .menu-item .link-text:hover span {
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
}

.global-nav .menu-item:not(.is-current-page) a:hover .link-text:before {
  width: calc(100% - 16px);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.global-nav .menu:hover .menu-item:not(.is-current-page) a {
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
}

.global-nav .menu:hover .menu-item:hover a,
.global-nav .menu:hover .menu-item.is-current-page a {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

/* --------------------------------------------------
    メニューオープン時
---------------------------------------------------- */
.page.is-menu-open .global-nav {
  visibility: visible;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  transform: translate3d(0, 0, 0);
}

.page.is-menu-open .overlay--global-menu {
  visibility: visible;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.page.is-menu-open:not(.page--home) .site-header .header-logo {
  width: 100%;
  transform: translate3d(0, 0, 0);
}

.page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path {
  background: #443E3C;
}

.page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path--top, .page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path--bottom,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path--top,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path--bottom {
  width: 32px;
}

.page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path--top,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path--top {
  transform: translate3d(0, 5.5px, 0) rotate(45deg);
}

.page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path--bottom,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path--bottom {
  transform: translate3d(0, -5.5px, 0) rotate(-45deg);
}

.page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path--middle,
.page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path--middle {
  width: 0;
}

.page.is-menu-open .menu-item.is-current-page:before {
  transform: translate3d(0, 0, 0);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

@media all and (min-width: 1024px) {
  /* --------------------------------------------------
    メニューボタン(PC)
  ---------------------------------------------------- */
  .toggle-menu-button:hover .toggle-icon .btn-text,
  .toggle-menu-button:hover .toggle-icon .icon {
    transform: translate3d(-50%, -50%, 0);
  }
  .toggle-menu-button:hover .icon-hamburger--anim .path--top,
  .toggle-menu-button:hover .icon-hamburger--anim .path--bottom {
    width: 0;
  }
  .toggle-menu-button:hover .icon-hamburger--anim .path--middle {
    width: 100%;
  }
  /* --------------------------------------------------
    メニューオープン時(PC)
  ---------------------------------------------------- */
  .page.is-menu-open .menu-button .toggle-menu-button {
    transform: translate3d(50%, -50%, 0);
  }
  .page.is-menu-open .menu-button .toggle-menu-button .icon {
    transform: translate3d(-50%, -50%, 0);
  }
  .page.is-menu-open .menu-button .toggle-menu-button .btn-text {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    transform: translate3d(-50%, -50%, 0);
  }
  .page.is-menu-open .site-header {
    transform: translate3d(62px, 40px, 0);
  }
  .page.is-menu-open .sns-links {
    transform: translate3d(62px, -40px, 0);
  }
  .page.is-menu-open.is-show-article .site-footer {
    background: #FFFEFC;
    color: #443E3C;
    transition: background 1s cubic-bezier(0.075, 0.82, 0.165, 1), color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .page.is-menu-open.is-show-article .site-footer a {
    color: #443E3C;
    transition: color 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
}

@media all and (max-width: 1023px) {
  .global-nav {
    width: calc(100% - 67px);
    padding: 0 30px 0 12px;
  }
  .menu-button {
    width: 40px;
    height: auto;
    padding: 0;
    top: 23px;
    left: auto;
    right: 12px;
  }
  .menu-button .toggle-menu-button {
    height: 20px;
    top: 0;
    left: auto;
    right: 0;
    transform: translate3d(0, 0, 0);
  }
  .menu-button .toggle-icon {
    top: 0;
    left: 0;
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  .menu-button .toggle-icon .icon {
    top: 0;
    left: 0;
    transform: translate3d(0%, 0, 0);
  }
  .menu-button .btn-text {
    display: none;
  }
  .page.is-menu-open .menu-button .toggle-menu-button .icon-hamburger--anim .path,
  .page.is-menu-open .menu-button .toggle-menu-button:hover .icon-hamburger--anim .path {
    background: #FFFEFC;
  }
  .page.is-menu-open .site-header {
    transform: translate3d(16px, 40px, 0) !important;
  }
  .page.is-menu-open .sns-links {
    transform: translate3d(16px, -40px, 0);
  }
  .page.is-menu-open .site-footer {
    z-index: 101;
  }
}

/* --------------------------------------------------
    Footer
---------------------------------------------------- */
.site-footer {
  width: 60px;
  height: 100%;
  padding: 59px 0;
  position: fixed;
  top: 0;
  right: 0;
  white-space: nowrap;
}

.site-footer .inner {
  width: 100%;
  height: 100%;
  position: relative;
}

.site-footer .text-link, .site-footer .copyright {
  display: inline-block;
  position: absolute;
}

.site-footer .text-link {
  top: -16px;
  left: 16px;
  -ms-transform: rotate(90deg);
      transform: rotate(90deg);
  -ms-transform-origin: left bottom;
      transform-origin: left bottom;
  font-size: 12px;
  font-size: 11.999px;
  font-size: 0.85714rem;
  font-weight: 500;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
}

.site-footer .copyright {
  left: 16px;
  bottom: -10px;
  -ms-transform: translateX(-100%) rotate(90deg);
      transform: translateX(-100%) rotate(90deg);
  -ms-transform-origin: right bottom;
      transform-origin: right bottom;
  font-size: 10px;
  font-size: 10px;
  font-size: 0.71429rem;
  font-weight: 400;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
}

.page:not(.page--home) .site-footer {
  padding: 18px 0;
}

@media all and (max-width: 1023px) {
  .site-footer {
    height: 30px;
    padding: 0;
    top: auto;
    bottom: 0;
  }
  .site-footer .text-link {
    display: none;
  }
  .site-footer .copyright,
  .site-footer .copyright a {
    left: auto;
    bottom: 0;
    right: 16px;
    -ms-transform: translateX(0) rotate(0);
        transform: translateX(0) rotate(0);
    color: #FFFEFC;
  }
  .site-footer .copyright {
    margin: 20px 0;
  }
  .page:not(.page--home) .site-footer {
    width: 100%;
    height: auto;
    padding: 0 32px 0 16px;
    position: relative;
  }
  .page:not(.page--home) .site-footer .copyright {
    width: 100%;
    padding: 16px 0;
    display: block;
    margin: 0;
    text-align: right;
  }
  .page:not(.page--home) .site-footer .copyright,
  .page:not(.page--home) .site-footer .copyright a {
    position: static;
    left: auto;
    bottom: auto;
    right: auto;
    color: #443E3C;
  }
  .page--article .site-footer {
    background: #FFFEFC;
    z-index: 50;
  }
}

/* --------------------------------------------------
    Header
---------------------------------------------------- */
.site-header {
  height: 60px;
  padding: 0 60px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.header-logo {
  line-height: 0;
}

.header-logo .path--header-logo {
  fill: #443E3C;
}

@media all and (max-width: 1023px) {
  .site-header {
    padding: 0 16px;
  }
  .page--home:not(.is-menu-open) .header-logo .path--header-logo {
    fill: #FFFEFC;
  }
  .page:not(.page--home) .site-header {
    transform: translate3d(40px, 0, 0);
  }
}

.no-scroll {
  overflow: hidden;
}

/* --------------------------------------------------
    Compornents
---------------------------------------------------- */
.text-hover-link {
  overflow: hidden;
}

.text-hover-link a {
  padding: 0 4px;
  display: block;
  position: relative;
  z-index: 1;
}

.text-hover-link a:before {
  transition: transform 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.75s cubic-bezier(0.075, 0.82, 0.165, 1), visibility 0.75s cubic-bezier(0.075, 0.82, 0.165, 1);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
}

.text-hover-link--1 a:before {
  width: 100%;
  height: 2px;
  background: #443E3C;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  transform: translate3d(-100%, 0, 0);
}

.text-hover-link--1 a:hover:before {
  transform: translate3d(0, 0, 0);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.text-hover-link--2 a:before {
  width: 100%;
  height: 40%;
  background: linear-gradient(135deg, #A388E3 0%, #5AC4F2 100%);
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  transform: translate3d(100%, 0, 0);
}

.text-hover-link--2 a:hover:before {
  transform: translate3d(40%, 0, 0);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
}

.table {
  table-layout: fixed;
}

.table tr + tr > th,
.table tr + tr > td {
  padding-top: 56px;
}

.table th, .table td {
  vertical-align: top;
  text-align: left;
  font-weight: 400;
}

.table th {
  width: 34.69388%;
  white-space: nowrap;
}

/* --------------------------------------------------
    z-index
---------------------------------------------------- */
.frame {
  z-index: 100;
}

#preloader {
  z-index: 10000;
}

.overlay {
  z-index: 101;
}

.overlay--page {
  z-index: 10001;
}

.global-nav {
  z-index: 200;
}

.menu-button {
  z-index: 201;
  transform-style: preserve-3d;
}

.site-header,
.site-footer,
.sns-links {
  z-index: 202;
}

/* --------------------------------------------------
    PAGE - Home
---------------------------------------------------- */
.page--home {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.page--home .stage,
.page--home .main {
  overflow: hidden;
}

.page--home .nav-link {
  position: absolute;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  font-weight: 400;
}

.page--home .nav-link--left-top {
  top: 40px;
  left: 32px;
}

.page--home .nav-link--left-bottom {
  left: 32px;
  bottom: 40px;
}

.page--home .nav-link--right-top {
  top: 40px;
  right: 32px;
}

.page--home .nav-link--right-bottom {
  right: 32px;
  bottom: 40px;
}

.page:not(.page--home) .header-logo {
  width: 18px;
  overflow: hidden;
  transition: width 1s cubic-bezier(0.075, 0.82, 0.165, 1), transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  transform: translate3d(-39px, 0, 0);
}

.page:not(.page--home) .frame--vt {
  height: 100%;
  top: 0;
  opacity: .4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
}

.page:not(.page--home) .stage {
  padding: 0;
}

.page--solution .stage:before,
.page--lab .stage:before {
  display: none;
}

/* --------------------------------------------------
    PAGE - About / Recruit / Contact
---------------------------------------------------- */
.page--about .stage:before,
.page--recruit .stage:before,
.page--contact .stage:before {
  transform: translate3d(100%, 0, 0);
}

.page--about .main,
.page--recruit .main,
.page--contact .main {
  padding-bottom: 80px;
}

.page--about .section,
.page--recruit .section,
.page--contact .section {
  max-width: 1800px;
  margin: 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
      align-items: flex-start;
  -ms-flex-pack: center;
      justify-content: center;
  position: relative;
}

.page--about .section .section__inner,
.page--recruit .section .section__inner,
.page--contact .section .section__inner {
  position: relative;
}

.page--about .section .img,
.page--recruit .section .img,
.page--contact .section .img {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.page--about .section--first-view,
.page--recruit .section--first-view,
.page--contact .section--first-view {
  height: 100vh;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}

.page--about .section--first-view .heading,
.page--recruit .section--first-view .heading,
.page--contact .section--first-view .heading {
  position: relative;
}

.page--about .section--first-view .heading-title,
.page--recruit .section--first-view .heading-title,
.page--contact .section--first-view .heading-title {
  margin: 0;
  padding-top: 54px;
  font-size: 80px;
  font-size: 80px;
  font-size: 5.71429rem;
}

.page--about .section--first-view .heading-subtitle,
.page--recruit .section--first-view .heading-subtitle,
.page--contact .section--first-view .heading-subtitle {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  font-weight: 500;
}

.page--about .section--first-view .heading-description,
.page--recruit .section--first-view .heading-description,
.page--contact .section--first-view .heading-description {
  margin: 36px 0 0;
  font-size: 13px;
  font-size: 12.999px;
  font-size: 0.92857rem;
  line-height: 2;
  letter-spacing: 1.4px;
  letter-spacing: .1rem;
}

.page--about .section--row .heading,
.page--recruit .section--row .heading,
.page--contact .section--row .heading {
  padding-top: 140px;
  padding-bottom: 70px;
}

.page--about .section--row .heading-title,
.page--recruit .section--row .heading-title,
.page--contact .section--row .heading-title {
  margin: 0;
  display: inline-block;
  position: relative;
  font-size: 40px;
  font-size: 39.999px;
  font-size: 2.85714rem;
  font-weight: 500;
}

.page--about .section--row .heading-title .text,
.page--recruit .section--row .heading-title .text,
.page--contact .section--row .heading-title .text {
  position: relative;
}

.page--about .section--row .heading-title:before,
.page--recruit .section--row .heading-title:before,
.page--contact .section--row .heading-title:before {
  width: 100%;
  height: 16px;
  background: linear-gradient(135deg, #A388E3 0%, #5AC4F2 100%);
  content: '';
  position: absolute;
  right: -32px;
  bottom: 0;
}

.page--about .section + .section,
.page--recruit .section + .section,
.page--contact .section + .section {
  margin-top: 140px;
}

.page--about .section:nth-child(odd):not(.section--first-view):before,
.page--recruit .section:nth-child(odd):not(.section--first-view):before,
.page--contact .section:nth-child(odd):not(.section--first-view):before {
  max-width: 959px;
  width: 50%;
  background: #EEECEB;
  padding-top: 40%;
  padding-left: 60px;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
}

.page--about .section:nth-child(odd):not(.section--first-view) .heading,
.page--recruit .section:nth-child(odd):not(.section--first-view) .heading,
.page--contact .section:nth-child(odd):not(.section--first-view) .heading {
  padding-top: 245px;
  padding-bottom: 70px;
}

.page--about .section:nth-child(odd):not(.section--first-view) .block-image,
.page--recruit .section:nth-child(odd):not(.section--first-view) .block-image,
.page--contact .section:nth-child(odd):not(.section--first-view) .block-image {
  padding-top: 40%;
}

.page--about .section:nth-child(odd) .section__inner--left,
.page--recruit .section:nth-child(odd) .section__inner--left,
.page--contact .section:nth-child(odd) .section__inner--left {
  width: 38.26923%;
  padding-left: 150px;
  padding-right: 30px;
}

.page--about .section:nth-child(odd) .section__inner--right,
.page--recruit .section:nth-child(odd) .section__inner--right,
.page--contact .section:nth-child(odd) .section__inner--right {
  width: 61.28205%;
  padding-left: 30px;
  padding-right: 150px;
}

.page--about .section:nth-child(even):before,
.page--recruit .section:nth-child(even):before,
.page--contact .section:nth-child(even):before {
  max-width: 959px;
  width: 50%;
  background: #EEECEB;
  padding-top: 40%;
  padding-left: 60px;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.page--about .section:nth-child(even) .section__inner--left,
.page--recruit .section:nth-child(even) .section__inner--left,
.page--contact .section:nth-child(even) .section__inner--left {
  width: 61.28205%;
  padding-left: 150px;
  padding-right: 30px;
}

.page--about .section:nth-child(even) .section__inner--right,
.page--recruit .section:nth-child(even) .section__inner--right,
.page--contact .section:nth-child(even) .section__inner--right {
  width: 38.26923%;
  padding-left: 30px;
  padding-right: 150px;
}

.page--about .section:nth-child(even) .section__content,
.page--recruit .section:nth-child(even) .section__content,
.page--contact .section:nth-child(even) .section__content {
  padding-top: 340px;
}

.page--about .text-block,
.page--recruit .text-block,
.page--contact .text-block {
  font-size: 15px;
  font-size: 15px;
  font-size: 1.07143rem;
  line-height: 2;
  letter-spacing: 1.4px;
  letter-spacing: .1rem;
}

.page--about .text-block h3,
.page--recruit .text-block h3,
.page--contact .text-block h3 {
  margin-top: 3em;
  margin-bottom: 1em;
}

.page--about .text-block p,
.page--recruit .text-block p,
.page--contact .text-block p {
  margin: 0;
}

.page--about .text-block p + p,
.page--recruit .text-block p + p,
.page--contact .text-block p + p {
  margin-top: 32px;
}

.page--about .contact-info,
.page--recruit .contact-info,
.page--contact .contact-info {
  font-size: 14px;
  font-size: 14px;
  font-size: 1rem;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
  line-height: 1.7;
}

.page--about .contact-info .info-row + .info-row,
.page--recruit .contact-info .info-row + .info-row,
.page--contact .contact-info .info-row + .info-row {
  margin-top: 16px;
}

.page--about .contact-info .title,
.page--recruit .contact-info .title,
.page--contact .contact-info .title {
  font-weight: 600;
}

.page--about .contact-info .divide,
.page--recruit .contact-info .divide,
.page--contact .contact-info .divide {
  padding: 0 8px;
}

.page--about .contact-info .content,
.page--recruit .contact-info .content,
.page--contact .contact-info .content {
  font-weight: 400;
}

.page--about .contact-buttons,
.page--recruit .contact-buttons,
.page--contact .contact-buttons {
  margin: 0 -16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: stretch;
      align-items: stretch;
}

.page--about .contact-buttons .btn-col,
.page--recruit .contact-buttons .btn-col,
.page--contact .contact-buttons .btn-col {
  max-width: 232px;
  width: 100%;
  margin-top: 56px;
  padding: 0 16px;
}

.page--about .contact-buttons .btn,
.page--recruit .contact-buttons .btn,
.page--contact .contact-buttons .btn {
  width: 100%;
  height: 100%;
  padding: 16px;
  border: 1px solid #393939;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-align: center;
      align-items: center;
  font-size: 12px;
  font-size: 11.999px;
  font-size: 0.85714rem;
  font-weight: 500;
  letter-spacing: 0.7px;
  letter-spacing: .05rem;
  cursor: pointer;
}

.page--about .contact-buttons .btn:hover,
.page--recruit .contact-buttons .btn:hover,
.page--contact .contact-buttons .btn:hover {
  background: #393939;
  color: #FFFEFC;
}

.page--about .contact-buttons .btn:hover .path,
.page--recruit .contact-buttons .btn:hover .path,
.page--contact .contact-buttons .btn:hover .path {
  fill: #FFFEFC;
}

.page--about .contact-buttons .icon,
.page--recruit .contact-buttons .icon,
.page--contact .contact-buttons .icon {
  padding-left: 8px;
  line-height: 0;
}

.page--recruit .section--row {
  -ms-flex-pack: start;
      justify-content: flex-start;
}

.page--recruit .section__inner {
  max-width: 1200px;
  width: 100%;
  padding-left: 150px;
  padding-right: 150px;
}

/* --------------------------------------------------
    stage
---------------------------------------------------- */
.stage {
  width: 100%;
  height: 100%;
  background: #FFFEFC;
  padding: 60px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}

.stage:before {
  width: 50%;
  height: 100%;
  background: #EEECEB;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.main {
  width: 100%;
  height: 100%;
  position: relative;
}

@media all and (max-width: 1365px) {
  /* --------------------------------------------------
    PAGE - About / Contact
  ---------------------------------------------------- */
  .page--about .section,
  .page--recruit .section,
  .page--contact .section {
    display: block;
  }
  .page--about .section--first-view,
  .page--recruit .section--first-view,
  .page--contact .section--first-view {
    height: auto;
    display: block;
  }
  .page--about .section--first-view .section__inner--left,
  .page--recruit .section--first-view .section__inner--left,
  .page--contact .section--first-view .section__inner--left {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .page--about .section:nth-child(odd) .section__inner--left,
  .page--about .section:nth-child(odd) .section__inner--right,
  .page--about .section:nth-child(even) .section__inner--left,
  .page--about .section:nth-child(even) .section__inner--right,
  .page--recruit .section:nth-child(odd) .section__inner--left,
  .page--recruit .section:nth-child(odd) .section__inner--right,
  .page--recruit .section:nth-child(even) .section__inner--left,
  .page--recruit .section:nth-child(even) .section__inner--right,
  .page--contact .section:nth-child(odd) .section__inner--left,
  .page--contact .section:nth-child(odd) .section__inner--right,
  .page--contact .section:nth-child(even) .section__inner--left,
  .page--contact .section:nth-child(even) .section__inner--right {
    width: 100%;
    padding-left: 120px;
    padding-right: 120px;
  }
  .page--about .section:nth-child(even) .section__content,
  .page--recruit .section:nth-child(even) .section__content,
  .page--contact .section:nth-child(even) .section__content {
    padding-top: 60px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view),
  .page--recruit .section:nth-child(odd):not(.section--first-view),
  .page--contact .section:nth-child(odd):not(.section--first-view) {
    position: relative;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__content,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__content,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__content {
    padding-top: 60px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before {
    width: 100%;
    box-sizing: content-box;
    display: block;
    content: '';
    padding-top: 66.61417%;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__inner--right,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__inner--right,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__inner--right {
    position: absolute;
    top: 265px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .heading,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .heading,
  .page--contact .section:nth-child(odd):not(.section--first-view) .heading {
    padding-top: 143px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .block-image,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .block-image,
  .page--contact .section:nth-child(odd):not(.section--first-view) .block-image {
    padding-top: 0;
  }
  .page--about .table,
  .page--recruit .table,
  .page--contact .table {
    width: 80%;
  }
}

@media all and (max-width: 1023px) {
  .page--home .stage {
    padding: 60px 0;
  }
  .page--home .nav-link {
    display: none;
  }
  .page--about .stage:before,
  .page--recruit .stage:before,
  .page--contact .stage:before {
    height: 50%;
  }
  .page--about .section + .section,
  .page--recruit .section + .section,
  .page--contact .section + .section {
    margin-top: 70px;
  }
  .page--about .section--first-view .section__inner--left,
  .page--recruit .section--first-view .section__inner--left,
  .page--contact .section--first-view .section__inner--left {
    padding-bottom: 48px;
  }
  .page--about .section:nth-child(odd) .section__inner--left,
  .page--about .section:nth-child(odd) .section__inner--right,
  .page--about .section:nth-child(even) .section__inner--left,
  .page--about .section:nth-child(even) .section__inner--right,
  .page--recruit .section:nth-child(odd) .section__inner--left,
  .page--recruit .section:nth-child(odd) .section__inner--right,
  .page--recruit .section:nth-child(even) .section__inner--left,
  .page--recruit .section:nth-child(even) .section__inner--right,
  .page--contact .section:nth-child(odd) .section__inner--left,
  .page--contact .section:nth-child(odd) .section__inner--right,
  .page--contact .section:nth-child(even) .section__inner--left,
  .page--contact .section:nth-child(even) .section__inner--right {
    width: 100%;
    padding-left: 32px;
    padding-right: 32px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view):before,
  .page--about .section:nth-child(even):before,
  .page--recruit .section:nth-child(odd):not(.section--first-view):before,
  .page--recruit .section:nth-child(even):before,
  .page--contact .section:nth-child(odd):not(.section--first-view):before,
  .page--contact .section:nth-child(even):before {
    width: 80%;
    padding-top: 60%;
  }
  .page--recruit .section__inner {
    padding-left: 32px;
    padding-right: 32px;
  }
}

@media all and (max-width: 640px) {
  .page--about .stage:before,
  .page--recruit .stage:before,
  .page--contact .stage:before {
    height: 70%;
  }
  .page--about .section:nth-child(odd):not(.section--first-view):before,
  .page--about .section:nth-child(even):before,
  .page--recruit .section:nth-child(odd):not(.section--first-view):before,
  .page--recruit .section:nth-child(even):before,
  .page--contact .section:nth-child(odd):not(.section--first-view):before,
  .page--contact .section:nth-child(even):before {
    width: 80%;
    padding-top: 90%;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content {
    padding-top: 24px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__inner--left .section__content:before {
    height: 20px;
  }
  .page--about .section:nth-child(odd):not(.section--first-view) .section__inner--right,
  .page--recruit .section:nth-child(odd):not(.section--first-view) .section__inner--right,
  .page--contact .section:nth-child(odd):not(.section--first-view) .section__inner--right {
    top: 230px;
  }
  .page--about .section:nth-child(even) .heading,
  .page--recruit .section:nth-child(even) .heading,
  .page--contact .section:nth-child(even) .heading {
    padding-bottom: 53px;
  }
  .page--about .section--first-view .heading-title,
  .page--recruit .section--first-view .heading-title,
  .page--contact .section--first-view .heading-title {
    font-size: 48px;
    font-size: 3.42857rem;
  }
  .page--about .section--row .heading-title,
  .page--recruit .section--row .heading-title,
  .page--contact .section--row .heading-title {
    font-size: 24px;
    font-size: 1.71429rem;
  }
  .page--about .contact-buttons,
  .page--recruit .contact-buttons,
  .page--contact .contact-buttons {
    -ms-flex-direction: column;
        flex-direction: column;
  }
  .page--about .contact-buttons .btn-col,
  .page--recruit .contact-buttons .btn-col,
  .page--contact .contact-buttons .btn-col {
    max-width: none;
  }
  .page--about .contact-buttons .btn-col + .btn-col,
  .page--recruit .contact-buttons .btn-col + .btn-col,
  .page--contact .contact-buttons .btn-col + .btn-col {
    margin-top: 32px;
  }
}