#loading {
  background: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 9999;
}
#loading p {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  width:100%;
  text-align: center;
  font-size:2.2rem;
  color: #bbb;
}
#loading p .loading_logo{
  width:150px;
}

#loading p .loading_img{
  width:32px;
}

#loading p .loading_gif{
  width:32px;
}
#header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
  padding: 42px 54px;
}

@media screen and (max-width: 767px) {
  #header {
    padding: 15px;
  }
}


#header .flex-header .logo img{
  width: 150px;
}

@media screen and (max-width: 767px) {
#header .flex-header .logo img{
  width: 100px;
}
#loading p {
    font-size:1.4rem;
}
}


#header.UpMove{
  animation: FadeOut 0.3s ease-out forwards;
}

@keyframes FadeOut{
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/*　フェードインの動き　*/

#header.DownMove{
  animation: FadeIn 0.3s ease-out forwards;
}
@keyframes FadeIn{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


.scrolldown1{
  position:absolute;
  left:50%;
  bottom:20px;
  height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
  position: absolute;
  left:-2.5rem;
  top: -2.6rem;
  color: #fff;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after{
  content: "";
  position: absolute;
  top: 0;
  width: 1px;
  height: 30px;
  background: #fff;
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*SPのみ表示される*/
.scrolldown2{
  position:absolute;
  left:50%;
  top:10vh;
  height:50px;
  transform: translateX(-50%);
}

.scrolldown2 span{
  position: absolute;
  left:-1.2rem;
  top: -1.5rem;
  color: #bbb;
  font-size: 0.9rem;
  letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown2::after{
  content: "";
  position: absolute;
  top: 0;
  width: 1px;
  height: 30px;
  background: #d7d7d7;
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

@media screen and (max-width: 767px) {

  .scrolldown1{
  bottom:15vh;
}
.scrolldown1 span{
    /*描画位置*/
  position: absolute;
  left:-1.6rem;
  top: -1.8rem;
    /*テキストの形状*/
  color: #fff;
  font-size: 1.2rem;
}

}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:30px;
    opacity: 1;
  }
  100%{
    height:0;
    top:50px;
    opacity: 0;
  }
}


.mv-sec {
  position: relative;
}

.hide{
	opacity:0;
}

#scrollArea{
    transition: .5s; /* スクロール時に一瞬で消えると物足りないので.hideの処理を0.5秒で行う */
}

.mv-img {
  width: 60%;
  margin-left: auto;
}


.mv-sec .inner{
position:absolute;
height: auto;
    width: calc(100% - 25px);
  left: 25px;
  top: 35%;
    bottom: inherit;
    transform: translateY(-20%);
}

.mv-sec .inner p{
  font-size: 7.5vw;
  letter-spacing: -0.1vw;
  text-shadow: 1px 2px 2px rgba(255, 255, 255, 0.6);
}

.mv-sec .inner h1{
  font-size: 10vw; 
  line-height: 1.1; 
  padding: 0;
  font-weight:normal;
  text-shadow: 1px 2px 2px rgba(255, 255, 255, 0.6);
  }


@media screen and (max-width: 767px) {

  .mv-sec .inner{
position:absolute;
height: auto;
    width: 100%;
  left: 0;
  top: 40%;
    bottom: inherit;
    transform: translateY(0);
}

.mv-sec .inner p{
  text-align: center;
  font-size:12vw;
    text-shadow: 1px 2px 2px rgba(255, 255, 255, 0.6);
    font-weight:bold;
}

.mv-sec .inner h1{
  display: block;
  text-align: center;
  font-size:12vw;
  letter-spacing: -1px;
  text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.3);
      font-weight:bold;
  }

}


:root {
  --delay: 0;
  --duration: 800ms;
  --iterations: 1;
}
/* •·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•· */
.effect-text{opacity:0;
font-family: 'EB Garamond', serif;
}

.reveal-text,
.reveal-text::after {
  animation-delay: var(--animation-delay, 2s);
  animation-iteration-count: var(--iterations, 1);
  animation-duration: var(--duration, 800ms);
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
  opacity:1;
}

.reveal-text {
  --animation-delay: var(--delay, 0);
  --animation-duration: var(--duration, 800ms);
  --animation-iterations: var(--iterations, 1);
  position: relative;
  animation-name: clip-text;
  white-space: nowrap;
  cursor: default;
    color: transparent;
  background: linear-gradient(0deg, #bb9222 0%, #d1ba3b 45%, #fff3b0 70%, #d1ba3b 85%, #bb9222 90% 100%);
  -webkit-background-clip: text;
  }
.reveal-text::after {
    content: "";
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f2f2f2;
    transform: scaleX(0);
    transform-origin: 0 50%;
    pointer-events: none;
    animation-name: text-revealer;
  }
  
  .text-shadow{
    text-shadow:
text-shadow: 1px 2px 5px rgba(255,255,255,1);
  }
@keyframes clip-text {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}


@keyframes text-revealer {
  
  0%, 50% {
    transform-origin: 0 50%;
  }
  
  60%, 100% {
    transform-origin: 100% 50%;   
  }

  
  60% {
    transform: scaleX(1);
  }
  
  100% {
    transform: scaleX(0);
  }
}





.mv-img img {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
}

@media screen and (max-width: 767px) {
  .mv-img {
    width: 100%;
  }
  .mv-img img {height: 100vh;}
}



.gradation-bg{
  position:relative;
  background: linear-gradient(-45deg, #ede2cf, #f2f2f2, #ede2cf, #fff) fixed;
  background-size: 800% 800%;
  animation: GradietionAnimation 18s ease infinite;
  background: url(https://rich2016.jp/images/bg/bg_top_tile.png) top center;
  background-attachment: fixed;
}

.gradation-bg::after{
  content: "";
  position: absolute;
  width:100%;
  top:0;
  height:200px ;
   background-image: linear-gradient(0deg, transparent 0 30%, #FFF 70% 100%);
   z-index: 1;
}
@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
*/
.t-mainArea--top {
  overflow: hidden;

}

.mainVisual {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 800px
}

.mainVisual__ttl {
  font-size: 5.8333333333vw;
  font-weight: bold;
  pointer-events: none;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .05s
}

.mainVisual--fadeIn .mainVisual__ttl {
  opacity: 1
}

.mvTtl__item {
  display: block;
  line-height: 1;
  letter-spacing: -0.02em;
  overflow: hidden
}

.mvTtl__item+.mvTtl__item {
  margin-top: .0520833333vw
}

.mvTtl__item:nth-child(1) {
  text-align: left;
  transform: translateX(1.4em)
}

.mvTtl__item:nth-child(2) {
  text-align: center
}

.mvTtl__item:nth-child(3) {
  text-align: right;
  transform: translateX(0.34em)
}

.mvTtlChara {
  display: inline-block;
  height: 1em;
  line-height: 1
}

.mvTtlCharaInner {
  display: inline-block;
  transform: translateY(1em);
  transition-property: transform;
  transition-timing-function: ease;
  transition-duration: .2s
}

.mvTtl__item--active .mvTtlCharaInner {
  transform: translateY(0em)
}

.mainVisual__txt {
  display: inline;
  font-size: 1.0416666667vw;
  line-height: 1.6;
  font-weight: bold;
  position: absolute;
  top: calc(50% - 7.3958333333vw);
  left: calc(50% + 1.9791666667vw);
  pointer-events: none;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .4s
}

.mainVisual__txt--active {
  opacity: 1
}

.mainVisual__tmb {
  width: 10.9375vw;
  height: 5.9895833333vw;
  min-width: 11vw;
  min-height: 6vw;
  position: fixed;
  top: 12.6041666667vw;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 10px;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transition-property: opacity, top, left, right, bottom, border-radius;
  transition-timing-function: ease;
  transition-duration: .4s;
  z-index:2;
}

.mainVisual__tmb::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, .5);
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.mainVisual__tmb>video {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.mainVisual__tmb--active {
  opacity: 1
}

.mainVisual__tmb--zoomIn {
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 1
}

.mainVisual__tmb--outlineStart {
  border-radius: 0
}

.mainVisual__tmb--outlineStart::after {
  opacity: 1
}

.mainVisual__tmb--outlineEnd {
  position: absolute;
  top: auto !important;
  left: 0 !important;
  bottom: 0 !important;
  transform: translateY(0) !important;
  border-radius: 0
}

.mainVisual__tmb--outlineEnd::after {
  opacity: 1
}

@keyframes areaMoving {
  0% {
    transform: translateY(0px)
  }
  25% {
    transform: translateY(-3.125vw)
  }
  50% {
    transform: translateY(0px)
  }
  75% {
    transform: translateY(3.125vw)
  }
  100% {
    transform: translateY(0px)
  }
}



@media screen and (max-width: 767px) {
  .mainVisual {
    height: 90vh;
    position: relative
  }
  .mainVisual__ttl {
    font-size: 13.3333333333vw;
    position: absolute;
    top: 46.1333333333vw;
    left: 0;
    right: 0;
    margin: auto;
    width: calc(100% - 50px)
  }
  .mvTtl__item+.mvTtl__item {
    margin-top: .5333333333vw
  }
  .mvTtl__item:nth-child(1) {
    text-align: center;
    transform: translateX(0em)
  }
  .mvTtl__item:nth-child(2) {
    text-align: left
  }
  .mvTtl__item:nth-child(3) {
    text-align: left;
    transform: translateX(0em)
  }
  .mvTtl__item:nth-child(4) {
    text-align: right;
    transform: translateX(0em)
  }
  .mainVisual__txt {
    font-size: 3.4666666667vw;
    top: 101.8666666667vw;
    left: calc(50% - 13.3333333333vw)
  }
  .mainVisual__tmb {
    width: 43.2vw;
    height: 14vh;
    top: 78.4vw;
    /*left: calc(50% - 33.0666666667vw);*/
    bottom: auto
  }
  @keyframes areaMoving {
    0% {
      transform: translateY(9.6vw)
    }
    25% {
      transform: translateY(4.2666666667vw)
    }
    50% {
      transform: translateY(9.6vw)
    }
    75% {
      transform: translateY(14.9333333333vw)
    }
    100% {
      transform: translateY(9.6vw)
    }
  }

  .waveObjectArea {
    width: 132.8vw;
    height: 90vh;
    margin-left: -16.5333333333vw
  }
  .waveObjectArea__item {
    width: 8.5333333333vw;
    border-radius: 4.2666666667vw
  }
  .waveObjectArea__item>.waveObject {
    background-size: 8.5333333333vw 170.6666666667vw;
    background-position: 0 -64vw
  }
  .waveObjectArea__item:nth-child(2) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item:nth-child(3) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item:nth-child(4) {
    height: 30.2702702703vw
  }
  .waveObjectArea__item:nth-child(5) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item:nth-child(6) {
    height: 55.9459459459vw
  }
  .waveObjectArea__item:nth-child(7) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item:nth-child(8) {
    height: 30.2702702703vw
  }
  .waveObjectArea__item:nth-child(9) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item:nth-child(10) {
    height: 40.5405405405vw
  }
  .waveObjectArea__item--set:nth-child(2), .waveObjectArea__item--set:nth-child(3), .waveObjectArea__item--set:nth-child(4), .waveObjectArea__item--set:nth-child(5), .waveObjectArea__item--set:nth-child(6), .waveObjectArea__item--set:nth-child(7), .waveObjectArea__item--set:nth-child(8), .waveObjectArea__item--set:nth-child(9), .waveObjectArea__item--set:nth-child(10) {
    height: 8.5333333333vw
  }
  .waveObjectArea__item--ball:nth-child(2), .waveObjectArea__item--ball:nth-child(3), .waveObjectArea__item--ball:nth-child(4), .waveObjectArea__item--ball:nth-child(5), .waveObjectArea__item--ball:nth-child(6), .waveObjectArea__item--ball:nth-child(7), .waveObjectArea__item--ball:nth-child(8), .waveObjectArea__item--ball:nth-child(9), .waveObjectArea__item--ball:nth-child(10), .waveObjectArea__item--ballStart:nth-child(2), .waveObjectArea__item--ballStart:nth-child(3), .waveObjectArea__item--ballStart:nth-child(4), .waveObjectArea__item--ballStart:nth-child(5), .waveObjectArea__item--ballStart:nth-child(6), .waveObjectArea__item--ballStart:nth-child(7), .waveObjectArea__item--ballStart:nth-child(8), .waveObjectArea__item--ballStart:nth-child(9), .waveObjectArea__item--ballStart:nth-child(10) {
    height: 8.5333333333vw
  }
  .waveObjectArea__item--start:nth-child(2) {
    transform: translateY(-2.4vw)
  }
  .waveObjectArea__item--start:nth-child(2) .waveObject {
    background-position: 0 -61.6vw
  }
  .waveObjectArea__item--start:nth-child(3) {
    transform: translateY(-10.6666666667vw)
  }
  .waveObjectArea__item--start:nth-child(3) .waveObject {
    background-position: 0 -53.3333333333vw
  }
  .waveObjectArea__item--start:nth-child(4) {
    transform: translateY(-21.8666666667vw)
  }
  .waveObjectArea__item--start:nth-child(4) .waveObject {
    background-position: 0 -42.1333333333vw
  }
  .waveObjectArea__item--start:nth-child(5) {
    transform: translateY(-10.9333333333vw)
  }
  .waveObjectArea__item--start:nth-child(5) .waveObject {
    background-position: 0 -53.0666666667vw
  }
  .waveObjectArea__item--start:nth-child(6) {
    transform: translateY(-1.3333333333vw)
  }
  .waveObjectArea__item--start:nth-child(6) .waveObject {
    background-position: 0 -62.6666666667vw
  }
  .waveObjectArea__item--start:nth-child(7) {
    transform: translateY(9.3333333333vw)
  }
  .waveObjectArea__item--start:nth-child(7) .waveObject {
    background-position: 0 -73.3333333333vw
  }
  .waveObjectArea__item--start:nth-child(8) {
    transform: translateY(21.8666666667vw)
  }
  .waveObjectArea__item--start:nth-child(8) .waveObject {
    background-position: 0 -85.8666666667vw
  }
  .waveObjectArea__item--start:nth-child(9) {
    transform: translateY(9.3333333333vw)
  }
  .waveObjectArea__item--start:nth-child(9) .waveObject {
    background-position: 0 -73.3333333333vw
  }
  .waveObjectArea__item--start:nth-child(10) {
    transform: translateY(-4.2666666667vw)
  }
  .waveObjectArea__item--start:nth-child(10) .waveObject {
    background-position: 0 -59.7333333333vw
  }
  .waveObjectArea__item--down {
    transition-duration: 2s
  }
  .waveObjectArea__item--down .waveObject {
    transition-duration: 2s
  }
  .waveObjectArea__item--up {
    transition-duration: 3s
  }
  .waveObjectArea__item--up .waveObject {
    transition-duration: 3s
  }
  .waveObjectArea__item--down:nth-child(2) {
    height: 26.6666666667vw;
    transform: translateY(-4.2666666667vw)
  }
  .waveObjectArea__item--down:nth-child(2) .waveObject {
    background-position: 0 -67.7333333333vw
  }
  .waveObjectArea__item--down:nth-child(3) {
    height: 28vw;
    transform: translateY(9.3333333333vw)
  }
  .waveObjectArea__item--down:nth-child(3) .waveObject {
    background-position: 0 -81.3333333333vw
  }
  .waveObjectArea__item--down:nth-child(4) {
    height: 24.5333333333vw;
    transform: translateY(16vw)
  }
  .waveObjectArea__item--down:nth-child(4) .waveObject {
    background-position: 0 -88vw
  }
  .waveObjectArea__item--down:nth-child(5) {
    height: 29.3333333333vw;
    transform: translateY(9.3333333333vw)
  }
  .waveObjectArea__item--down:nth-child(5) .waveObject {
    background-position: 0 -81.3333333333vw
  }
  .waveObjectArea__item--down:nth-child(6) {
    height: 47.2vw;
    transform: translateY(-0.5333333333vw)
  }
  .waveObjectArea__item--down:nth-child(6) .waveObject {
    background-position: 0 -58.6666666667vw
  }
  .waveObjectArea__item--down:nth-child(7) {
    height: 33.3333333333vw;
    transform: translateY(9.6vw)
  }
  .waveObjectArea__item--down:nth-child(7) .waveObject {
    background-position: 0 -81.6vw
  }
  .waveObjectArea__item--down:nth-child(8) {
    height: 23.2vw;
    transform: translateY(16vw)
  }
  .waveObjectArea__item--down:nth-child(8) .waveObject {
    background-position: 0 -88vw
  }
  .waveObjectArea__item--down:nth-child(9) {
    height: 36vw;
    transform: translateY(9.3333333333vw)
  }
  .waveObjectArea__item--down:nth-child(9) .waveObject {
    background-position: 0 -81.3333333333vw
  }
  .waveObjectArea__item--down:nth-child(10) {
    height: 37.3333333333vw;
    transform: translateY(-4.2666666667vw)
  }
  .waveObjectArea__item--down:nth-child(10) .waveObject {
    background-position: 0 -67.7333333333vw
  }
  .waveObjectArea__item--up:nth-child(2) {
    transform: translateY(-2.6666666667vw)
  }
  .waveObjectArea__item--up:nth-child(2) .waveObject {
    background-position: 0 -49.3333333333vw
  }
  .waveObjectArea__item--up:nth-child(3) {
    transform: translateY(-5.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(3) .waveObject {
    background-position: 0 -46.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(4) {
    transform: translateY(-21.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(4) .waveObject {
    background-position: 0 -30.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(5) {
    transform: translateY(-5.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(5) .waveObject {
    background-position: 0 -46.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(6) {
    transform: translateY(-0.5333333333vw)
  }
  .waveObjectArea__item--up:nth-child(6) .waveObject {
    background-position: 0 -38.6666666667vw
  }
  .waveObjectArea__item--up:nth-child(7) {
    transform: translateY(-5.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(7) .waveObject {
    background-position: 0 -46.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(8) {
    transform: translateY(-21.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(8) .waveObject {
    background-position: 0 -30.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(9) {
    transform: translateY(-5.8666666667vw)
  }
  .waveObjectArea__item--up:nth-child(9) .waveObject {
    background-position: 0 -46.1333333333vw
  }
  .waveObjectArea__item--up:nth-child(10) {
    transform: translateY(-2.6666666667vw)
  }
  .waveObjectArea__item--up:nth-child(10) .waveObject {
    background-position: 0 -49.3333333333vw
  }
  .waveObjectArea--phase0 .waveObjectArea__item .waveObject--0, .waveObjectArea--phase1 .waveObjectArea__item .waveObject--1, .waveObjectArea--phase2 .waveObjectArea__item .waveObject--2, .waveObjectArea--phase3 .waveObjectArea__item .waveObject--3, .waveObjectArea--phase4 .waveObjectArea__item .waveObject--4 {
    opacity: 1
  }
}

.outlineArea {
  position: relative
}

.outlineArea__box {
  padding: 2600px 0 400px;
  position: relative;
  z-index: 2;
}

.outlineArea__boxInner {
  position: relative
}

@keyframes movin {
  0% {
    transform: rotate(0deg)
  }
  100% {
    transform: rotate(360deg)
  }
}

.playMovie {
  width: 137px;
  height: 137px;
  position: absolute;
  right: 80px;
  bottom: 0;
  cursor: pointer;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.playMovie:hover {
  opacity: .8
}

.playMovie img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto
}

.playMovie img:nth-child(1) {
  width: 100px;
  height: 100px
}

.playMovie img:nth-child(2) {
  animation-name: movin;
  animation-timing-function: linear;
  animation-duration: 4s;
  animation-iteration-count: infinite
}

.outlineArea__ttl {
  font-size: 60px;
  font-weight: bold;
  line-height: 1.66;
  color: #fff;
  margin-bottom: 66px
}

.outlineArea__txt {
  font-size: 17px;
  line-height: 2.23;
  color: #fff
}

.outlineArea__txt+.outlineArea__txt {
  margin-top: 28px
}

.c-transitionBtn--outline {
  margin-top: 45px
}

@media screen and (max-width: 1024px) {
  .playMovie {
    right: 60px
  }
}

@media screen and (max-width: 767px) {
  .outlineArea__box {
    padding: 1350px 0 300px
  }
  .playMovie {
    width: 80px;
    height: 80px;
    right: 25px
  }
  .playMovie img:nth-child(1) {
    width: 60px;
    height: 60px
  }
  .outlineArea__ttl {
    font-size: 27px;
    line-height: 1.48;
    margin-bottom: 37px
  }
  .outlineArea__txt {
    font-size: 14px;
    line-height: 1.85
  }
  .outlineArea__txt+.outlineArea__txt {
    margin-top: 24px
  }
  .c-transitionBtn--outline {
    margin-top: 36px
  }
}

.reserch {
  width: 100vw;
 /* margin-top: 200px;*/
  position: relative
}


.reserch--pc .cast_list{
  position: absolute;
  bottom:30px;
  left:50%;
  transform: translateX(-50%);
}
.reserch--pc {
  display: block;
  overflow: hidden;
}

.reserch--sp {
  display: none
}

@keyframes underShadow {
  0% {
    transform: translateY(5.2083333333vw) scaleX(1.2) scaleY(1)
  }
  50% {
    transform: translateY(5.2083333333vw) scaleX(1.2) scaleY(2)
  }
  100% {
    transform: translateY(5.2083333333vw) scaleX(1.2) scaleY(1)
  }
}

.reserchBgWrapper {
  position: relative;
  width: 100%;
  width: 100vw;
  height: 100vh;
  min-height: 750px;
  overflow: hidden
}

.reserchBgWrapper--fix {
  position: fixed;
  top: 0;
  left: 0
}

.reserchBgWrapper--end {
  position: absolute;
  top: auto;
  bottom: 0
}

.reserchBgWrapper::after {
  content: "";
  width: 100%;
  height: 10.4166666667vw;
  background-color: #fff;
  position: absolute;
  left: 0;
  bottom: 0;
  filter: blur(3.125vw);
  transform: translateY(5.2083333333vw) scaleX(1.2);
  animation-name: underShadow;
  animation-timing-function: ease;
  animation-duration: 6.6s;
  animation-iteration-count: infinite
}

.reserchBg {
  width: 26.40625vw;
  height: 26.40625vw;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: scale(0);
  transition-property: transform, width, height, border-radius;
  transition-timing-function: cubic-bezier(0.49, 0.19, 0, 0.99);
  transition-duration: .8s
}

.reserchBg--active {
  transform: scale(1)
}

.reserchBgWrapper--cover .reserchBg {
  width: 100%;
  height: 100%;
  border-radius: 0px
}

.reserchBg__txt {
  font-size: 1.5625vw;
  font-weight: bold;
  color: #fff;
  position: relative;
  z-index: 1;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchBg__txt--fadeOut {
  opacity: 0
}

.reserchBg__item {
  background: #004cac;
   background: linear-gradient(108deg, rgb(255, 255, 255) 0%, rgb(229, 205, 160) 45%, rgb(229, 222, 165) 55%, rgb(223, 181, 99) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchBg__item--1 {
  background: #004cac;
 background: linear-gradient(108deg, rgb(255, 255, 255) 0%, rgb(229, 205, 160) 45%, rgb(229, 222, 165) 55%, rgb(223, 181, 99) 100%);
}

.reserchBg__item--2 {
  background: #0f5dbe;
  background: linear-gradient(108deg, rgb(229, 205, 160) 0%, rgb(255, 178, 178) 50%, rgb(245, 245, 245) 100%);
  opacity: 0
}

.reserchBg__item--3 {
  background: #6289bb;
  background: linear-gradient(108deg, rgb(235, 235, 235) 0%, rgb(171, 231, 249) 50%, rgb(255, 210, 156) 100%);
  opacity: 0
}

.reserchBg__item--4 {
  background: #0b3c79;
  background: linear-gradient(108deg, rgb(11, 60, 121) 0%, rgb(119, 75, 144) 50%, rgb(240, 185, 133) 100%);
  opacity: 0
}

.reserchBg__item--5 {
  background: #1558ab;
  background: linear-gradient(108deg, rgb(21, 88, 171) 0%, rgb(63, 69, 104) 50%, rgb(2, 0, 67) 100%);
  opacity: 0
}

.reserchBg[data-current="1"] .reserchBg__item--1, .reserchBg[data-current="2"] .reserchBg__item--2, .reserchBg[data-current="3"] .reserchBg__item--3, .reserchBg[data-current="4"] .reserchBg__item--4, .reserchBg[data-current="5"] .reserchBg__item--5 {
  opacity: 1
}

@keyframes waveUpDown {
  0% {
    transform: translateY(0px)
  }
  50% {
    transform: translateY(-9.375vw)
  }
  100% {
    transform: translateY(0px)
  }
}

@keyframes wave {
  0% {
    background-position-x: 0%
  }
  100% {
    background-position-x: -100vw
  }
}

.wave {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s;
  animation-name: waveUpDown;
  animation-timing-function: ease;
  animation-duration: 6.6s;
  animation-iteration-count: infinite
}

.reserchBgWrapper--cover .wave {
  opacity: 1
}

.wave::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(/img/top/wave.png);
  background-position: 0 0;
  background-size: 100%;
  background-repeat: repeat-x;
  filter: blur(3.125vw);
  transform: scale(1.2) translateY(-3.125vw);
  animation-name: wave;
  animation-timing-function: cubic-bezier(0, 0, 0.9, 0.98);
  animation-duration: 2.2s;
  animation-iteration-count: infinite
}

@media screen and (max-width: 767px) {

  .reserch {
  margin-top: 1rem;
}
  .reserch--pc {
    display: none
  }
  .reserch--sp {
    display: block;
    min-height: 300vh
  }
  .reserchBg {
    width: 252px;
    height: 252px
  }
  .reserchBg__txt {
    font-size: 15px
  }
  @keyframes waveUpDown {
    0% {
      transform: translateY(0px)
    }
    50% {
      transform: translateY(-8vw)
    }
    100% {
      transform: translateY(0px)
    }
  }
  .wave::before {
    transform-origin: top;
    transform: scaleX(2.2) scaleY(2) translateY(-5.3333333333vw);
    animation-timing-function: cubic-bezier(0, 0, 0.9, 0.98);
    animation-duration: 2.2s
  }
}

.reserchSlideWrapper {
  position: relative;
  width: 100%;
  padding: 100vh 0 100vh;
  box-sizing: border-box;
  opacity: 0;
  pointer-events: auto;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchSlideWrapper--active {
  opacity: 1;
  pointer-events: auto
}

.reserchSlide {
  padding-top: 25vw
}

.reserchSlide__item {
  width: 100vw;
  height: 100vh;
  min-height: 750px;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s;
  pointer-events: none;
}


.reserchSlide__item--current {
  opacity: 1;
  pointer-events:auto;
}

.reserchSlide__itemInner {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center
}

.reserchSlideWrapper--end .reserchSlide__itemInner {
  position: absolute;
  top: auto;
  bottom: 0
}

.reserchSlide__tmb {
  height: 90vh;
  width: calc(90vh * 2 / 3);
  overflow: hidden;
}

.reserchNavWrapper {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchSlideWrapper--active .reserchNavWrapper {
  opacity: 1;
  pointer-events:none;
}

.reserchSlideWrapper--end .reserchNavWrapper {
  position: absolute;
  top: auto;
  bottom: 0;
}

.reserchNav {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transform: translateX(-30vw);
  width: 28vw;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  transition-property: transform;
  transition-timing-function: ease;
  transition-duration: .4s
}

.reserchNav[data-current="1"] {
  transform: translateX(-27.5vw) translateY(3em)
}

.reserchNav[data-current="2"] {
  transform: translateX(-27.5vw) translateY(1.5em)
}

.reserchNav[data-current="3"] {
  transform: translateX(-27.5vw) translateY(0em)
}

.reserchNav[data-current="4"] {
  transform: translateX(-27.5vw) translateY(-1.5em)
}

.reserchNav[data-current="5"] {
  transform: translateX(-27.5vw) translateY(-3em)
}

.reserchNav__item {
  color: #757575;
  position: relative;
  opacity: .7;
  display: inline-block;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s;
  height: 2.7083333333vw;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  pointer-events:none;
}

.reserchNav__item--current {
  opacity: 1;
}

.reserchNav__item:hover {
  opacity: 1
}

.reserchNav__txt {
  font-size: 1vw;
  line-height: 1;
  text-align: left;
  transition-property: font-size, font-weight;
  transition-timing-function: ease;
  transition-duration: .4s;
  transform: translateY(-0.4em);
  margin-bottom:2rem;
  padding:5px 0;
}

.reserchNav__item--current .reserchNav__txt {
  font-size: 1.55vw;
  font-weight: bold;
  pointer-events:auto;
  color:#2f2f2f;
  text-shadow:2px 2px 2px #ffffff;
  background:#ffffff8a;
  padding:5px 0;
  
}

.reserchNav__icon {
  position: absolute;
  top: -.7291666667vw;
  left: -1.5625vw;
  font-size: .625vw;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .4s;
  transform: translateY(-0.4em)
}

.reserchNav__item--current .reserchNav__icon {
  opacity: 1
}

.reserchBtnWrapper {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: auto;
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchSlideWrapper--active .reserchBtnWrapper {
  opacity: 1
}

.reserchSlideWrapper--end .reserchBtnWrapper {
  position: absolute;
  top: auto;
  bottom: 0
}

.reserchBtn {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transform: translateX(26.0416666667vw);
  width: 10.4166666667vw;
  height: 10.4166666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto
}

.reserchBtn__icon {
  display: inline-block;
  text-align: center;
  font-size: .625vw;
  color: #fff;
  position: absolute;
  top: -1.7708333333vw;
  left: 0;
  right: 0;
  margin: auto
}

.reserchBtn__item {
  display: none;
  width: 100%;
  height: 100%;
  position: relative;
  border: solid 1px #fff;
  border-radius: 50%
}



.reserchBtn__item::after {
  transition-delay: .2s
}

.reserchBtn__item:hover::before {
  transform: translateX(0%);
  opacity: 1;
  transition-delay: .2s
}

.reserchBtn__item:hover::after {
  transform: translateX(100%);
  opacity: 0;
  transition-delay: 0s
}

.reserchBtn[data-current="1"] .reserchBtn__item--1, .reserchBtn[data-current="2"] .reserchBtn__item--2, .reserchBtn[data-current="3"] .reserchBtn__item--3  {
  display: block
}

.reserchBgTxt__item {
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: ease;
  transition-duration: .3s
}

.reserchBgTxt[data-current="1"] .reserchBgTxt__item--1, .reserchBgTxt[data-current="2"] .reserchBgTxt__item--2, .reserchBgTxt[data-current="3"] .reserchBgTxt__item--3  {
  opacity: 1
}

.reserchBgTxt__itemWrapper {
  position: absolute;
  left: 0;
  bottom: 9vw;
  width: 100%
}

.reserchTxtSlide__item {
  vertical-align: bottom;
  font-size: 13.0208333333vw;
  font-weight: bold;
  color: rgba(255, 255, 255, .15);
  line-height: 1
}

@media screen and (max-width: 1024px) {
  .reserchNav {
    transform: translateX(-35.15625vw);
    width: 36.1328125vw
  }
  .reserchNav[data-current="1"] {
    transform: translateX(-35.15625vw) translateY(3em)
  }
  .reserchNav[data-current="2"] {
    transform: translateX(-35.15625vw) translateY(1.5em)
  }
  .reserchNav[data-current="3"] {
    transform: translateX(-35.15625vw) translateY(0em)
  }
  .reserchNav[data-current="4"] {
    transform: translateX(-35.15625vw) translateY(-1.5em)
  }
  .reserchNav[data-current="5"] {
    transform: translateX(-35.15625vw) translateY(-3em)
  }
  .reserchNav__item {
    height: 5.078125vw
  }
  .reserchNav__txt {
    font-size: 1.5625vw
  }
  .reserchNav__item--current .reserchNav__txt {
    font-size: 1.5625vw
  }
  .reserchNav__icon {
    top: -0.48828125vw;
    left: -0.48828125vw;
    font-size: 1.3671875vw
  }
  .reserchBtn {
    transform: translateX(23.4375vw);
    width: 9.765625vw;
    height: 9.765625vw
  }
  .reserchBtn__icon {
    font-size: 1.171875vw;
    top: -3.3203125vw
  }
  .reserchBtn__item::before, .reserchBtn__item::after {
    width: 3.515625vw;
    height: 2.24609375vw
  }
  .reserchBgTxt__itemWrapper {
    bottom: 44vw
  }
  .reserchTxtSlide__item {
    font-size: 12.20703125vw
  }
}

@media screen and (max-width: 767px) {
  .reserch--sp {
    overflow: hidden
  }
  .reserchBg__item--1 {
    background: #004cac;
    background: linear-gradient(108deg, rgb(255, 255, 255) 0%, rgb(229, 205, 160) 45%, rgb(229, 222, 165) 55%, rgb(223, 181, 99) 100%)
  }
  .reserchBg__item--2 {
    background: #0f5dbe;
    background: linear-gradient(108deg, rgb(15, 93, 190) 0%, rgb(77, 176, 255) 50%, rgb(185, 223, 238) 100%);
    opacity: 0
  }
  .reserchBg__item--3 {
    background: #6289bb;
    background: linear-gradient(108deg, rgb(98, 137, 187) 0%, rgb(139, 156, 209) 50%, rgb(202, 175, 143) 100%);
    opacity: 0
  }
  .reserchBg__item--4 {
    background: #0b3c79;
    background: linear-gradient(108deg, rgb(11, 60, 121) 0%, rgb(119, 75, 144) 50%, rgb(240, 185, 133) 100%);
    opacity: 0
  }
  .reserchBg__item--5 {
    background: #1558ab;
    background: linear-gradient(108deg, rgb(21, 88, 171) 0%, rgb(63, 69, 104) 50%, rgb(2, 0, 67) 100%);
    opacity: 0
  }
  .reserchBg[data-current="1"] .reserchBg__item--1, .reserchBg[data-current="2"] .reserchBg__item--2, .reserchBg[data-current="3"] .reserchBg__item--3, .reserchBg[data-current="4"] .reserchBg__item--4, .reserchBg[data-current="5"] .reserchBg__item--5 {
    opacity: 0
  }
  .reserchBg[data-gauge-current="1"] .reserchBg__item--1, .reserchBg[data-gauge-current="2"] .reserchBg__item--2, .reserchBg[data-gauge-current="3"] .reserchBg__item--3, .reserchBg[data-gauge-current="4"] .reserchBg__item--4, .reserchBg[data-gauge-current="5"] .reserchBg__item--5 {
    opacity: 1
  }
  .reserchSlide {
    width: 100vw;
    height: 100vh;
    padding: 0
  }
  .reserchSlideInner {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: center;
    opacity: 0;
    transition-property: opacity;
    transition-timing-function: ease;
    transition-duration: .3s
  }
  .reserchSlideWrapper--active .reserchSlideInner {
    opacity: 1
  }
  .reserchBgWrapper--end+.reserchSlideWrapper .reserchSlideInner {
    position: absolute;
    top: auto;
    bottom: 0
  }
  .reserchMobileSlide {
    width: 75vw;
    position: relative;
    z-index: 1
  }
  .reserchMobileSlide .slick-list {
    overflow: visible
  }
  .reserchMobileSlide__item {
    padding: 0 20px;
    box-sizing: border-box;
    position: relative
  }
  .reserchMobileSlide__ttl {
    width: 100%;
    text-align: center;
    color: #a78369;
    font-size: 1.1rem;
    line-height: 1.1;
    font-weight: bold;
    position: relative;
    padding: 0;
    box-sizing: border-box;
    margin-bottom: 0.4rem;
  }
  .reserchMobileSlide__ttl span{
    font-size: 0.9rem;
    font-weight: normal;
  }
  .reserchMobileSlide__icon {
    display: inline-block;
    font-size: 12px;
    position: absolute;
    top: -20px;
    left: 0
  }
  .reserchMobileBtn {
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    right: 20px;
    bottom: 0
  }
  .reserchMobileBtn__icon {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #333;
    border-radius: 50%;
    position: relative
  }
  .reserchMobileBtn__icon::after {
    content: "";
    display: block;
    width: 15px;
    height: 10px;
    background: url(/img/common/icon_transition-arrow.svg) 0 0/contain no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
  }
  .reserchMobileBtn__txt {
    color: #fff;
    font-size: 12px;
    line-height: 1.5;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    margin: auto;
    text-align: center;
    display: block
  }
  .reserchMobileSlideNav {
    width: 100%;
    padding: 0 25px;
    box-sizing: border-box;
    margin-top: 95px;
    display: flex;
    align-items: center;
    justify-content: space-between
  }
  .reserchMobileSlideGauge {
    width: calc(100% - 45px - 36px);
    height: 3px;
    border-radius: 1px;
    background-color: #fff;
    position: relative
  }
  .reserchMobileSlideGauge__item {
    display: block;
    width: 100%;
    height: 5px;
    border-radius: 2px;
    overflow: hidden;
    transform-origin: left;
    position: absolute;
    top: -1px;
    left: 0;
    transition-property: width;
    transition-duration: .3s;
    transition-timing-function: linear
  }
  .reserchMobileSlideGauge[data-gauge-current="1"] .reserchMobileSlideGauge__item {
    width: 20%
  }
  .reserchMobileSlideGauge[data-gauge-current="2"] .reserchMobileSlideGauge__item {
    width: 40%
  }
  .reserchMobileSlideGauge[data-gauge-current="3"] .reserchMobileSlideGauge__item {
    width: 60%
  }
  .reserchMobileSlideGauge[data-gauge-current="4"] .reserchMobileSlideGauge__item {
    width: 80%
  }
  .reserchMobileSlideGauge[data-gauge-current="5"] .reserchMobileSlideGauge__item {
    width: 100%
  }
  .reserchMobileSlideGauge__box {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition-property: opacity;
    transition-duration: .3s;
    transition-timing-function: ease
  }
  .reserchMobileSlideGauge__box--1 {
    background: #004cac;
    background: linear-gradient(108deg, rgb(0, 76, 172) 0%, rgb(160, 203, 229) 45%, rgb(185, 223, 238) 55%, rgb(255, 191, 68) 100%)
  }
  .reserchMobileSlideGauge__box--2 {
    background: #0f5dbe;
    background: linear-gradient(108deg, rgb(15, 93, 190) 0%, rgb(77, 176, 255) 50%, rgb(185, 223, 238) 100%)
  }
  .reserchMobileSlideGauge__box--3 {
    background: #6289bb;
    background: linear-gradient(108deg, rgb(98, 137, 187) 0%, rgb(139, 156, 209) 50%, rgb(202, 175, 143) 100%)
  }
  .reserchMobileSlideGauge__box--4 {
    background: #0b3c79;
    background: linear-gradient(108deg, rgb(11, 60, 121) 0%, rgb(119, 75, 144) 50%, rgb(240, 185, 133) 100%)
  }
  .reserchMobileSlideGauge__box--5 {
    background: #1558ab;
    background: linear-gradient(108deg, rgb(21, 88, 171) 0%, rgb(63, 69, 104) 50%, rgb(2, 0, 67) 100%)
  }
  .reserchMobileSlideGauge[data-gauge-current="1"] .reserchMobileSlideGauge__box--1, .reserchMobileSlideGauge[data-gauge-current="2"] .reserchMobileSlideGauge__box--2, .reserchMobileSlideGauge[data-gauge-current="3"] .reserchMobileSlideGauge__box--3, .reserchMobileSlideGauge[data-gauge-current="4"] .reserchMobileSlideGauge__box--4, .reserchMobileSlideGauge[data-gauge-current="5"] .reserchMobileSlideGauge__box--5 {
    opacity: 1
  }
  .reserchMobileSlideDots .slick-dots li button {
    font-size: 0
  }
  .reserchMobileSlideArrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: auto;
    width: 45px;
    vertical-align: bottom
  }
  .reserchMobileSlideArrow .slick-arrow {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    display: inline-block;
    width: 7px;
    height: 11px;
    font-size: 0;
    background: url(/img/top/icon_reserch-slide-mobile-arrow.png) 0 0/contain no-repeat;
    transform: translate(0px)
  }
  .reserchMobileSlideArrow .slick-arrow::before {
    content: none
  }
  .reserchMobileSlideArrow .slick-arrow.slick-next {
    transform: rotate(180deg)
  }
  .reserchBgTxtMobile {
    font-size: 100px;
    width: 600px;
    position: absolute;
    top: 270px;
    left: 0;
    bottom: 0;
    margin: auto;
    height: 1em;
    z-index: 0
  }
  .reserchBgTxtMobile__item {
    font-size: 100px;
    color: rgba(255, 255, 255, .15);
    font-weight: bold;
    width: 100%
  }
}

.contentsHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
  margin-bottom: 55px
}

.contentsHead__ttl {
  font-size: 60px;
  line-height: 1.5;
  font-weight: bold
}

.contentsHead__ttl::before {
  content: "";
  display: inline-block;
  width: 50px;
  height: 40px;
  vertical-align: middle;
  transform: translateY(-0.1em);
  background: url(/img/top/icon_publications.png) 0 0/contain no-repeat;
  margin-right: 21px
}

.contentsBottom {
  display: none
}

@media screen and (max-width: 1024px) {
  .contentsHead__box {
    display: none
  }
  .contentsBottom {
    display: block
  }
  .c-transitionBtn--contents {
    display: block;
    margin: 60px auto 0;
    width: 240px
  }
}

@media screen and (max-width: 767px) {
  .contentsHead {
    display: block;
    margin-bottom: 30px
  }
  .contentsHead__ttl {
    font-size: 35px;
    font-weight: bold
  }
  .contentsHead__ttl::before {
    width: 25px;
    height: 20px;
    margin-right: 15px
  }
  .c-transitionBtn--contents {
    margin: 30px auto 0
  }
}

.s-design{
    margin-left: auto;
    width:90%;
}


.s-design__unit {
    display: flex;
    justify-content: space-between
}

@media screen and (max-width: 767px) {

  .s-design{
    margin-left: 0;
    margin:0 auto;
    width:90%;
}
    .s-design__unit {
        display:block
    }
}
.s-design__unit--2 {
    margin: 22rem 0 0;
    flex-direction: row;
}

@media screen and (max-width: 767px) {
    .s-design__unit--2 {
        margin:6rem 0 0;
    }
}

.s-design__frame {
    width: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

}

@media screen and (max-width: 767px) {
.s-design__frame {
        width:100%;
        padding-left: 0
    }
}


.s-design__info {
    width: 45%;
    padding: 1rem 0 4rem;
    padding-bottom: 10rem;
    border-bottom: .1rem solid rgba(19,19,29,.25)
}

@media screen and (max-width: 767px) {
    .s-design__info {
        width:100%;
        padding: 1.8rem 0 1rem;
        border-bottom: none;
    }
}


.s-design__label {
  width:120%;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: .8rem;
    border-bottom: .1rem solid rgba(19,19,29,.25)
}

.s-design__head {
    font-size: 1.2rem;
    letter-spacing: .08em;
    color: #131314
}

@media screen and (max-width: 767px) {
    .s-design__head {
        font-size:1rem
    }
    .s-design__label {
  width:100%;
    display: flex;
}
}

.s-design__index {
    font-size: 1rem;
    letter-spacing: .08em;
    color: #131314
}



.s-design__copy {
    font-size: 2.2rem;
    line-height: 1.625;
    margin-top: 8.4rem;
    color: #131314
}

@media screen and (max-width: 767px) {
.s-design__copy {
        font-size:1.4rem;
        line-height: 1.8889;
        margin-top: 1rem
    }
}

.s-design__text {
    font-size: 1.2rem;
    line-height: 2.1333;
    margin-top: 4rem;
    color: #131314
}

.smaller-txt {
  margin-top: 2rem;
  font-size: 1rem;
  line-height: 2.1333;
}
#table01 tr {
  border-bottom: 1px solid #b5b1b1;
}

#table01 th,
#table01 td {
  padding: 0.8rem 0;
  border: none;
}

#table01 th {
  width: 40%;
}

@media screen and (max-width: 767px) {
    .s-design__text {
        font-size:1rem;
        line-height: 1.6923;
        margin-top: 2rem;
        color: #2f2f31
    }
    .smaller-txt {
      margin-top: 2rem;
      line-height: 1.4;
      font-size: 0.9rem;
    }
    #table01 tr {
      border-bottom: none;
    }
    
    #table01 th,
    #table01 td {
      width: 100%;
      display: block;
      font-size:0.9rem;
      padding: 0.rem 0 0;
    }
  
    #table01 th {
      width: 100%;
    }
  
    #table01 td {
      padding-top: 0;
    }
}

.s-design__slider--1{

  width:90%;
}
.s-design__slider--2{
  position: absolute;
  top:50%;
  left:0;
  width:80%;
}

@media screen and (max-width: 767px) {
.s-design__slider--1{
  position: relative;
  width:100%;
  z-index: 2;
}
}

#millvi{
  width:90%;
  max-width: 1240px;
  margin:5rem auto 0;
  padding:0;
}

@media screen and (max-width: 767px) {
#millvi{
  width:100%;
  max-width: 100%;
}
}

#concept-companion-wrap {
    width:1200px;
    margin:0 auto;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    }



.box-companion  {
    width: 16.66%;
    text-align: center;
    padding: 0;
    border: 0;
}

@media screen and (max-width: 767px) {
#concept-companion-wrap{
  width:100%;
  max-width: 100%;
}

.box-companion  {
    width: 25%;
    text-align: center;
    padding: 0;
    border: 0;
}
}

.trim-wrap {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    overflow: hidden;
}

.content_img img {
    width: 100%;
    height: auto;
    vertical-align: top;
}

.trim-wrap>img {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    width: 100%;
    max-height: initial;
}

.thankyou_txt{font-size:32px;margin:120px auto 200px;color:#999;}
.sp{display:none;}
.pc{display:inline-block;}

@media screen and (max-width: 767px) {

.thankyou_txt{font-size:1rem;margin:5rem auto;}
.pc{display:none;}
.sp{display:inline-block;}

}