@charset "UTF-8";

#video {
    word-wrap: break-word;
    color: #1a005d;
    font-family: "游ゴシック", "Yu Gothic", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
    line-height: 1.6667;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%
}

img {
    width: 100%;
    height: auto;
}

@media screen and (min-width: 900px) {

  .pc_none {
      display: none !important;
  }

  .about-body {
      padding-bottom: 50px;
  }
  .about-inner {
      width: 750px;
      max-width: 100%;
      margin: 0 auto;
      padding: 0 15px;
  }

  .about-linettl {
      font-size: 24px;
      font-weight: bold;
      position: relative;
      padding-left: 23px;
      letter-spacing: 1.25px;
      line-height: 1.4;
      margin-bottom: 26px;
	  color: #1a005d;
  }

  .about-linettl::before,
  .about-linettl::after {
      content: '';
      width: 4px;
      height: -webkit-calc( 100% - 7.5px );
      height: calc( 100% - 7.5px );
      display: block;
      position: absolute;
      top: 3px;
      left: 0;
  }

  .about-linettl::before {
      background: #1a005d;
  }

  .about-linettl::after {
      height: 8px;
      background: #8ec300;
  }

  /* =====================
    video
  ===================== */

  /*#video {
      padding-top: 77px;
  }*/

  .video__contents {
    padding: 80px 0;
    position: relative;
  }

  .video__contents:nth-of-type(even)::before {
      content: '';
      width: 100vw;
      height: 100%;
      display: block;
      background: #f5f5f5;
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -50vw;
  }

  .video__list:first-of-type {
      padding-top: 0;
  }

  .video__item {
      margin-bottom: 115px;
  }

  .video__item:last-child,
  .video__item:nth-last-child(2):nth-child(odd) {
      margin-bottom: 0;
  }

  .video__thum {
      cursor: pointer;
      margin-bottom: 27px;
  }

  .card-img {
      overflow: hidden
  }

  .card-img img {
      transition: -webkit-transform 1.3s cubic-bezier(.215, .61, .355, 1);
      transition: transform 1.3s cubic-bezier(.215, .61, .355, 1);
      transition: transform 1.3s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1.3s cubic-bezier(.215, .61, .355, 1);
  }

  a.video__item:hover .card-img img {
      transition: -webkit-transform 1.8s cubic-bezier(.215, .61, .355, 1);
      transition: transform 1.8s cubic-bezier(.215, .61, .355, 1);
      transition: transform 1.8s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1.8s cubic-bezier(.215, .61, .355, 1);
      -webkit-transform: scale(1.1);
      transform: scale(1.1);
  }

  p.video__link {
      cursor: pointer;
      color: #000;
      font-weight: bold;
      font-size: 20px;
      letter-spacing: 1px;
      line-height: 1.4;
      transition: 0.1s;
  }

  a.video__item:hover {
      text-decoration: none;
  }
  a.video__item:hover p.video__link {
      color: #453679;
      text-decoration: none;
  }

  p.video__link span {
      font-feature-settings: "palt";
      margin-right: 5px;
      letter-spacing: 0;
  }

  .video__modal {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      height: 100vh;
      width: 100%;
      z-index: 1000;
  }

  .video__modal-bg {
      position: absolute;
      top: 0;
      left: 0;
      height: 100vh;
      width: 100%;
      background: rgba(0, 0, 0, 0.8);
      z-index: 1001;
  }

  .video__modal-content {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 1150px;
      max-width: 100%;
      padding: 15px;
      z-index: 1002;
  }

  .video__modal-iframe {
      width: 100%;
      height: 0;
      padding-bottom: 56.25%;
      position: relative;
  }

  .video__modal-content .iframeMovie {
      width: 100%;
      height: 100%;
      display: none;
      position: absolute;
      top: 0;
      left: 0;
      border: none;
  }

  .video__modal-close_btn {
      width: 51.5px;
      position: absolute;
      top: -81.5px;
      right: 15px;
      cursor: pointer;
  }

  body.fixed {
      position: fixed;
      width: 100%;
      height: 100%;
      left: 0;
  }

  @media (max-height: 900px) {
    .video__modal-content {
      padding-top: 80px;
    }
    .video__modal-iframe {
      height: 80vh;
      padding: 0;
    }
    .video__modal-close_btn {
      top: 0;
    }
  }

}

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

  .sp_none {
      display: none !important;
  }

  .about-inner {
      max-width: 560px;
      margin: 0 auto;
  }

  .about-linettl {
      font-size: 18px;
      font-weight: bold;
      position: relative;
      padding-left: 15px;
      letter-spacing: 1px;
      line-height: 1.4;
      margin-bottom: 25px;
	  color: #1a005d;
  }

  .about-linettl::before,
  .about-linettl::after {
      content: '';
      width: 3px;
      height: -webkit-calc( 100% - 4.69px );
      height: calc( 100% - 4.69px );
      display: block;
      position: absolute;
      top: 2px;
      left: 0;
  }

  .about-linettl::before {
      background: #1a005d;
  }

  .about-linettl::after {
      height: 6px;
      background: #8ec300;
  }

  /* =====================
    video
  ===================== */

  #video {
      padding-top: 15px;
  }

  .video__contents {
    padding: 60px 0;
    position: relative;
  }

  .video__contents:nth-of-type(even)::before {
      content: '';
      width: 100vw;
      height: 100%;
      display: block;
      background: #f5f5f5;
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -50vw;
  }

  .video__list:first-of-type {
      padding-top: 0;
  }

  .video__contents .about-linettl {
      max-width: 560px;
      margin-left: auto;
      margin-right: auto;
  }

  .video__item {
      margin-bottom: 70px;
      display: -webkit-flex;
      display: flex;
      -webkit-flex-wrap: wrap;
      flex-wrap: wrap;
  }

  .video__item:last-child {
      margin-bottom: 0;
  }

  p.video__link {
      width: 100%;
      color: #000;
      font-weight: bold;
      font-size: 16px;
      letter-spacing: 1px;
      order: 2;
  }

  p.video__link span {
      font-feature-settings: "palt";
      margin-right: 5px;
      letter-spacing: 0;
  }

  .video__modal {
      width: 100%;
      margin-bottom: 11px;
      order: 1;
  }

  .video__modal-iframe {
      width: 100%;
      height: 0;
      padding-bottom: 56.25%;
      position: relative;
  }

  .video__modal-iframe .iframeMovie {
      width: 100%;
      height: 100%;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border: none;
  }
}
