@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
.top {
  /*
  .case{
    padding: 0 0 120px;
    position: relative;

    @include mq(md){
      padding: 0 0 100px;
    }

    &:after{
      content: '';
      display: block;
      width: 724px;
      height: 240px;
      background: url(/product/assets/img/top/img_line_right_pc.png)no-repeat;
      background-size: cover;
      position: absolute;
      right: 0;
      bottom: 0;

      @include mq(md){
        width: 100%;
        height: 172px;
        background: url(/product/assets/img/top/img_line_right_sp.png)no-repeat;
        background-size: cover;
      }
    }
    .inner{
      padding-top: 100px;
      border-top: 1px solid $border;

      @include mq(md){
        padding: 80px 0 0;
        width: 90%;
        margin: 0 auto;
      }
    }
    .case-contents{
      margin-bottom: 40px;
      .case-list{
        display: flex;
        flex-wrap: wrap;

        li{
          margin-right: 1px;

          &:last-of-type{
            margin-right: 0;
          }

          a{
            .img-inner{
              aspect-ratio: 599 / 340;

              @include mq(md){
                aspect-ratio: 173 / 180;
              }

              img{
                width: 100%;
                height: 100%;
                object-fit: cover;
              }
            }
          }
        }

        &.col02{
          li{
            width: 599px;
            @include mq(md){
              width: calc((100% / 2) - 1px);
            }
          }
        }

        &.col04{
          li{
            width: 299px;

            @include mq(md){
              width: calc(25% - 1px);
            }
          }
        }


      }
    }
  }
  */
}
.top .mv {
  width: 100%;
  height: 570px;
  aspect-ratio: 1400/570;
  background: url(/product/assets/img/top/mv_pc.jpg) no-repeat;
  background-size: cover;
  background-position: bottom center;
  overflow: hidden;
  position: relative;
  opacity: 0;
  animation-name: fadein;
  animation-duration: 5s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media screen and (max-width: 767px) {
  .top .mv {
    aspect-ratio: 390/596;
    height: auto;
    background: url(/product/assets/img/top/mv_sp.jpg) no-repeat;
    background-size: cover;
    background-position: bottom center;
  }
}
.top .mv .mv-contents {
  /*padding-top: 195px;*/
  width: 570px;
  height: 100%;
  margin: 0 auto;
  padding-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: flex-end;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents {
    width: 90%;
    padding-top: 45%;
    padding-bottom: 20px;
    justify-content: space-between;
  }
}
.top .mv .mv-contents .mv-item {
  width: 570px;
  margin: 13% auto 0;
  position: relative;
  opacity: 0;
  animation-name: fadein-item;
  animation-duration: 1s;
  animation-delay: 5.7s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@keyframes fadein-item {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-item {
    width: 100%;
    margin: 0 auto;
  }
}
.top .mv .mv-contents .mv-item img {
  width: 100%;
  display: block;
  margin: 0 auto;
}
.top .mv .mv-contents .mv-item .win {
  width: 61%;
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-item .win {
    top: -35px;
  }
}
.top .mv .mv-contents .mv-item .win img {
  /* マスクの適用 */
  -webkit-mask-image: radial-gradient(rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-image: radial-gradient(rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%);
  mask-repeat: no-repeat;
  mask-position: center;
  /* 初期スケール */
  -webkit-mask-size: 0% 0%;
  mask-size: 0% 0%;
  animation-name: fadein-win;
  animation-duration: 1.5s;
  animation-delay: 6.3s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@keyframes fadein-win {
  0% {
    -webkit-mask-size: 0% 0%;
    mask-size: 0% 0%;
  }
  100% {
    -webkit-mask-size: 150% 150%;
    mask-size: 150% 150%;
  }
}
.top .mv .mv-contents .mv-copy {
  width: 570px;
  margin: 0 auto 30px;
  /*width: 660px;
  margin-top: 60px;
  margin-right: calc((100% - 1200px) / 2);*/
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy {
    width: 100%;
    position: relative;
    z-index: 2;
  }
}
.top .mv .mv-contents .mv-copy p {
  font-family: "Zen Kaku Gothic New", serif;
  font-size: 2.25rem;
  color: #0081CC;
  text-align: center;
  font-weight: 500;
  line-height: 1;
  text-shadow: 0px 0px 15px rgba(203, 233, 248, 0.7);
  opacity: 0;
  animation-name: fadein-txt;
  animation-duration: 1s;
  animation-delay: 2.5s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@keyframes fadein-txt {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.top .mv .mv-contents .mv-copy p:nth-of-type(2) {
  animation-delay: 3.2s;
  position: relative;
}
.top .mv .mv-contents .mv-copy p:nth-of-type(2) img {
  position: relative;
  width: auto;
  max-width: 530px;
  display: block;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p:nth-of-type(2) img {
    width: 100%;
    padding-right: 15px;
  }
}
.top .mv .mv-contents .mv-copy p:nth-of-type(2) span {
  position: absolute;
  bottom: 40px;
  right: 5px;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p:nth-of-type(2) span {
    bottom: 23px;
  }
}
.top .mv .mv-contents .mv-copy p:nth-of-type(3) {
  animation-delay: 3.6s;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p {
    font-size: 1.8125rem;
    text-align: center;
  }
}
.top .mv .mv-contents .mv-copy p .small {
  font-size: 1.9375rem;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p .small {
    font-size: 1.5rem;
  }
}
.top .mv .mv-contents .mv-copy p img {
  width: 100%;
}
.top .mv .mv-contents .mv-copy p.strong-point {
  font-size: 3.1875rem;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p.strong-point {
    font-size: 2.25rem;
  }
}
.top .mv .mv-contents .mv-copy p.strong-point .strong {
  font-size: 4.5rem;
  background: rgb(0, 129, 204);
  background: linear-gradient(45deg, rgb(0, 129, 204) 0%, rgb(33, 160, 191) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p.strong-point .strong {
    font-size: 3rem;
  }
}
.top .mv .mv-contents .mv-copy p.strong-point .strong02 {
  font-size: 3.5625rem;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-contents .mv-copy p.strong-point .strong02 {
    font-size: 2.4375rem;
  }
}
.top .mv .mv-parts {
  width: 43%;
  position: absolute;
  right: 0;
  top: 35px;
  -webkit-mask-image: url(/product/assets/img/top/mv_parts_mask.png);
          mask-image: url(/product/assets/img/top/mv_parts_mask.png);
  mask-mode: alpha;
  -webkit-mask-position: center bottom;
          mask-position: center bottom;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: auto 200%;
          mask-size: auto 200%;
  opacity: 0;
  animation-name: mv_parts_animation;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.55, 0, 1, 0.45);
  animation-delay: 5.4s;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-parts {
    width: 83%;
    aspect-ratio: 325/185;
    top: 60px;
    z-index: 1;
  }
}
@keyframes mv_parts_animation {
  0% {
    -webkit-mask-position: center bottom;
            mask-position: center bottom;
    opacity: 0;
  }
  20% {
    opacity: 0.8;
  }
  to {
    -webkit-mask-position: center 0%;
            mask-position: center 0%;
    -webkit-mask-size: auto 500%;
            mask-size: auto 500%;
    opacity: 0.8;
  }
}
.top .mv .mv-item-wrap {
  position: relative;
  width: 100%;
  height: 180px;
  margin: 13% auto 0;
  opacity: 0;
  animation-name: fadein-item;
  animation-duration: 1s;
  animation-delay: 4.5s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}
@media screen and (max-width: 767px) {
  .top .mv .mv-item-wrap {
    width: 100%;
  }
}
@keyframes fadein-item {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.top .mv .mv-item-wrap .mv-item-box {
  width: 280px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  /*@include mq(md){
    @keyframes scale {
      0% {
        transform: scale(0.3);
        opacity: 0;
      }
      40%{
        transform: scale(0.5);
        opacity: 1.0;
      }
      40%{
        opacity: 1.0;
      }
      50% {
        transform: scale(1.0);
        opacity: 1.0;
      }
      60%{
        opacity: 1.0;
      }
      100% {
        transform: scale(0.3);
        opacity: 0;
      }
    }
  }*/
}
@media screen and (max-width: 767px) {
  .top .mv .mv-item-wrap .mv-item-box {
    width: 60%;
  }
}
@keyframes animX {
  0% {
    left: -40px;
  }
  45% {
    left: 145px;
  }
  55% {
    left: 145px;
  }
  100% {
    left: 330px;
  }
  /*0% { left: -30px; }
  40% { left: 150px; } 
  50% { left: 285px; } 
  60% { left: 285px; } 
  100% { left: 320px; } */
}
@media screen and (max-width: 767px) {
  @keyframes animX {
    0% {
      left: -15%;
    }
    45% {
      left: 20%;
    }
    55% {
      left: 20%;
    }
    100% {
      left: 50%;
    }
  }
}
@keyframes animZ {
  0% {
    z-index: 0;
  }
  100% {
    z-index: 5;
  }
}
@keyframes scale {
  0% {
    transform: scale(0.3);
    opacity: 0;
  }
  40% {
    transform: scale(0.5);
    opacity: 1;
  }
  45% {
    transform: scale(1.15);
  }
  55% {
    transform: scale(1.15);
    opacity: 1;
  }
  60% {
    transform: scale(0.5);
    opacity: 1;
  }
  100% {
    transform: scale(0.3);
    opacity: 0;
  }
}
.top .mv .mv-item-wrap .mv-item-box.item01 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate;
}
.top .mv .mv-item-wrap .mv-item-box.item02 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate;
}
.top .mv .mv-item-wrap .mv-item-box.item03 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate;
}
.top .mv .mv-item-wrap .mv-item-box.item04 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -20s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate;
}
.top .important-info {
  background: rgba(204, 236, 252, 0.85);
}
.top .important-info .important-info-wrap {
  width: 1000px;
  margin: 0 auto;
  padding: 50px 0 40px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /*.important-ttl{
    width: 335px;
    font-size: rem(25);
    font-weight: 500;
    font-family: $font-family-en;
    color: $blue;
    text-align: center;

    @include mq(md){
      width: 100%;
    }

    .sub{
      display: block;
      font-size: rem(14);
      font-weight: normal;
    }

    a{
      color: $blue;
      line-height: 1.0;
      position: relative;

      .sub{
        color: $font-color;
      }

      &:after{
        content: '';
        display: block;
        margin: 5px auto 0;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 3px solid transparent;
        border-left: 3px solid transparent;
        border-top: 6px solid #FC1F6A;
        border-bottom: 0;
      }
    }
  }*/
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap {
    width: 100%;
    padding: 35px 5% 30px;
  }
}
.top .important-info .important-info-wrap .important-info-list {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap .important-info-list {
    width: 100%;
  }
}
.top .important-info .important-info-wrap .important-info-list li {
  text-align: center;
  font-size: 0.875rem;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap .important-info-list li {
    text-align: left;
  }
}
.top .important-info .important-info-wrap .important-info-list li:last-of-type {
  margin-bottom: 0;
}
.top .important-info .important-info-wrap .important-info-list li a {
  display: block;
  font-size: 0.875rem;
}
.top .important-info .important-info-wrap .important-info-list li a:hover {
  color: #0081CC;
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap .important-info-list li a:hover {
    color: #222222;
  }
}
.top .important-info .important-info-wrap .important-info-list li a.topics-link:after {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  background: url(/product/assets/img/common/icon_blank.png) no-repeat;
  background-size: contain;
}
.top .important-info .important-info-wrap .important-info-list li a.pdf:after {
  content: "";
  display: inline-block;
  width: 11px;
  height: 14px;
  background: url(/product/assets/img/common/icon_pdf_b.png) no-repeat;
  background-size: contain;
  margin-left: 5px;
  position: relative;
  top: 3px;
}
.top .important-info .important-info-wrap .important-info-list li .date {
  width: 90px;
  font-weight: bold;
  margin-right: 30px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap .important-info-list li .date {
    margin-bottom: 10px;
  }
}
.top .important-info .important-info-wrap .important-info-list li .date:after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #0081CC;
  position: absolute;
  right: -10px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.top .important-info .important-info-wrap .important-info-list li .txt {
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .important-info .important-info-wrap .important-info-list li .txt {
    width: 100%;
  }
}
.top .item {
  padding: 70px 0 90px;
}
@media screen and (max-width: 767px) {
  .top .item {
    padding: 55px 0 80px;
  }
}
.top .item .inner {
  position: relative;
}
.top .item .item-slide {
  margin: 0 70px;
}
@media screen and (max-width: 767px) {
  .top .item .item-slide {
    margin: 0 40px;
  }
}
.top .item .item-slide .swiper-slide .slide-img {
  margin-bottom: 10px;
  padding: 3px;
  border: 1px solid #DBDBDB;
}
.top .item .item-slide .swiper-slide .slide-img img {
  width: 100%;
}
.top .item .swiper-button-prev,
.top .item .swiper-button-next {
  width: 36px;
  height: 36px;
  background: #0081CC;
  border-radius: 50%;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .top .item .swiper-button-prev,
  .top .item .swiper-button-next {
    width: 30px;
    height: 30px;
  }
}
.top .item .swiper-button-prev:after,
.top .item .swiper-button-next:after {
  font-size: 0.625rem;
}
.top .item .swiper-button-prev {
  left: 20px;
}
@media screen and (max-width: 767px) {
  .top .item .swiper-button-prev {
    left: 5%;
  }
}
.top .item .swiper-button-next {
  right: 20px;
}
@media screen and (max-width: 767px) {
  .top .item .swiper-button-next {
    right: 5%;
  }
}
.top .airsolution {
  padding-top: 160px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .airsolution {
    padding-top: 80px;
  }
}
.top .airsolution:before {
  content: "";
  display: block;
  width: calc(837px + (100% - 1200px) / 2);
  height: 420px;
  background: url(/product/assets/img/top/img_airsolution_background.jpg) no-repeat;
  background-size: cover;
  background-position: top center;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .top .airsolution:before {
    width: 78%;
    height: 335px;
    background: url(/product/assets/img/top/img_airsolution_background_sp.jpg) no-repeat;
    background-size: cover;
    background-position: top center;
  }
}
.top .airsolution .airsolution-wrap {
  background: #F2F6F7;
  margin-right: calc((100% - 1200px) / 2);
  padding-right: 100px;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap {
    margin-right: 5%;
    padding: 0 5%;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents {
  width: 1100px;
  margin: 0 0 0 auto;
  padding: 90px 0;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents {
    width: 100%;
    margin: 0;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .top-category .copy {
  width: 620px;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .top-category .copy {
    width: 100%;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .top-category .copy .large {
  font-size: 1.5625rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 11px;
}
.top .airsolution .airsolution-wrap .airsolution-contents .top-category .copy .large em {
  font-style: normal;
  color: #0081CC;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image {
  position: relative;
  margin-bottom: 40px;
  background-image: url(/product/assets/img/top/img_airsolution_pc.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image {
    min-height: 556px;
  }
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image {
    margin-bottom: 30px;
    background-image: url(/product/assets/img/top/img_airsolution_sp.jpg);
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer {
  padding: 0 !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    padding: 30px 0 30px !important;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer .pl-title {
  border: 2px solid #fff;
  background: #0081CC;
  border-radius: 500px;
  padding: 7.5px 8px;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer .pl-title {
    position: absolute;
    top: 10px;
    left: 10px;
  }
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer .pl-title {
    max-width: 262px;
    margin: 0 auto 20px;
    text-align: center;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-outer .pl-title span {
  display: block;
  font-size: 1.125rem;
  font-weight: 600;
  color: #fff;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list {
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list {
    padding: 0 28px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body {
  display: block;
  background: #fff;
  border-radius: 165px;
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.5));
  position: absolute;
  top: 0;
  left: 0;
  padding: 18px;
  opacity: 1 !important;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body {
    position: relative;
    max-width: 262px;
    margin: 0 auto;
    padding: 11px 15px;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:hover {
    background-color: transparent;
  }
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 25px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #0081CC;
    border-right: 2px solid #0081CC;
    transform: translateY(-50%) rotate(45deg);
  }
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text {
    text-align: center;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t01 {
  line-height: 1;
  margin: 0 0 8px;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t01 {
    margin: 0 0 5px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t01 span {
  font-family: "Roboto", sans-serif;
  display: inline-block;
  font-size: 0.75rem;
  line-height: 1;
  color: #fff;
  background: #24428F;
  border-radius: 500px;
  font-weight: 600;
  padding: 4px 8px 3px;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02 {
  line-height: 1;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02 span {
  position: relative;
  display: inline-block;
  font-size: 1.375rem;
  line-height: 1;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02 span {
    font-size: 1.125rem;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02 span::after {
    content: "";
    position: absolute;
    top: 60%;
    right: -15px;
    width: 9px;
    height: 9px;
    border-top: 2px solid #0081CC;
    border-right: 2px solid #0081CC;
    transform: translateY(-50%) rotate(45deg);
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02_sub {
  line-height: 1;
  margin-top: 6px;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02_sub span {
  position: relative;
  display: inline-block;
  font-size: 0.875rem;
  line-height: 1;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t02_sub span {
    font-size: 0.75rem;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t03 {
  position: relative;
  display: block;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5;
  margin: 12px 0 0;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .text .t03 {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img) .text {
    width: calc(100% - 140px);
    padding-left: 22px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img) .img {
  width: 140px;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img) .img {
    display: none;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img) .img img {
  transition: 0.3s all;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:not(.no-img):hover .img img {
    opacity: 0;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body.no-img {
    padding-left: 50px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body.no-img .text .t02 span::after {
  border-top: 1px solid #0081CC;
  border-right: 1px solid #0081CC;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: block;
  background: #fff;
  border-radius: 80px;
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.5));
  padding: 32px 40px;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s all;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents {
    display: none;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents ul li {
  position: relative;
  color: #fff;
  font-size: 0.9375rem;
  padding-left: 1em;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents ul li::after {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents ul li + li {
  margin-top: 3px;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents .h-btn {
  background: #fff;
  border-radius: 1000px;
  max-width: 148px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  min-height: 36px;
  padding: 5px 16px;
  margin: 17px 0 0;
  position: relative;
  font-weight: 500;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents .h-btn span {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body .hover-contents .h-btn::after {
  position: absolute;
  margin: auto;
  content: "";
  vertical-align: middle;
  top: 50%;
  right: 15px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #0081CC;
  border-right: 2px solid #0081CC;
  transform: translateY(-50%) rotate(45deg);
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body:hover .hover-contents {
    opacity: 1;
    visibility: visible;
  }
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link01 {
    top: 65px;
    left: 10%;
    width: 468px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link01 .text .t01 span {
  background: #24428F;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link01 .hover-contents {
  background-color: #24428F;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link02 {
    top: 265px;
    left: 2.5%;
    width: 324px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link02 .text .t01 span {
  background: #2B8896;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link02 .hover-contents {
  background-color: #2B8896;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link03 {
    top: 353px;
    left: 32.5%;
    width: 399px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link03 .text .t01 span {
  background: #BE8601;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link03 .hover-contents {
  background-color: #BE8601;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link04 {
    top: 86px;
    left: 56%;
    width: 429px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link04 .text .t01 span {
  background: #179626;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link04 .hover-contents {
  background-color: #179626;
}
@media screen and (min-width: 768px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link05 {
    top: 285px;
    left: 69.7%;
    width: 319px;
    padding-top: 26px;
    padding-bottom: 31px;
  }
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link05 .text .t01 span {
  background: #B84E8F;
}
.top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body#page-link05 .hover-contents {
  background-color: #B84E8F;
  border-radius: 60px;
  padding: 32px 25px;
}
@media screen and (max-width: 767px) {
  .top .airsolution .airsolution-wrap .airsolution-contents .airsolution-image .page-link-list .page-link-body + .page-link-body {
    margin-top: 16px;
  }
}
.top .product-top {
  padding: 100px 0;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .product-top {
    padding: 85px 0 75px;
  }
}
.top .product-top:before {
  content: "";
  display: block;
  width: 724px;
  height: 283px;
  background: url(/product/assets/img/top/img_line_left_pc.png) no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .top .product-top:before {
    width: 100%;
    height: 198px;
    background: url(/product/assets/img/top/img_line_left_sp.png) no-repeat;
    background-size: cover;
  }
}
.top .product-top:after {
  content: "";
  display: block;
  width: 724px;
  height: 240px;
  background: url(/product/assets/img/top/img_line_right_pc.png) no-repeat;
  background-size: cover;
  position: absolute;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .top .product-top:after {
    width: 100%;
    height: 172px;
    background: url(/product/assets/img/top/img_line_right_sp.png) no-repeat;
    background-size: cover;
  }
}
.top .product-top .product-top-contents {
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents {
    margin-bottom: 30px;
  }
}
.top .product-top .product-top-contents .product-top-category-list {
  display: flex;
  flex-wrap: wrap;
}
.top .product-top .product-top-contents .product-top-category-list li {
  margin-right: 20px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list li {
    margin-right: 0;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list li:last-of-type {
    margin-bottom: 20px;
  }
}
.top .product-top .product-top-contents .product-top-category-list li img {
  width: 100%;
}
.top .product-top .product-top-contents .product-top-category-list li .btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  position: absolute;
  bottom: 25px;
}
.top .product-top .product-top-contents .product-top-category-list li .btn .link-arrow {
  width: 36px;
  height: 36px;
  position: absolute;
  right: 15px;
  bottom: -10px;
  border: 1px solid #0081CC;
  background: transparent;
}
.top .product-top .product-top-contents .product-top-category-list li .btn .link-arrow:before {
  top: 15px;
  left: 13px;
  border-right: 1px solid #0081CC;
  border-bottom: 1px solid #0081CC;
}
.top .product-top .product-top-contents .product-top-category-list li a:hover .link-arrow {
  background: #0081CC;
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list li a:hover .link-arrow {
    background: transparent;
  }
}
.top .product-top .product-top-contents .product-top-category-list li a:hover .link-arrow:before {
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list li a:hover .link-arrow:before {
    border-right: 1px solid #0081CC;
    border-bottom: 1px solid #0081CC;
  }
}
.top .product-top .product-top-contents .product-top-category-list.col03 li {
  width: calc((100% - 40px) / 3);
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list.col03 li {
    width: 100%;
  }
}
.top .product-top .product-top-contents .product-top-category-list.col03 li:nth-of-type(3n) {
  margin-right: 0;
}
.top .product-top .product-top-contents .product-top-category-list.col04 li {
  width: 285px;
}
@media screen and (max-width: 767px) {
  .top .product-top .product-top-contents .product-top-category-list.col04 li {
    width: 100%;
  }
}
.top .product-top .product-top-contents .product-top-category-list.col04 li:nth-of-type(4n) {
  margin-right: 0;
}
.top .case {
  padding-top: 160px;
  position: relative;
  margin-bottom: 120px;
}
@media screen and (max-width: 767px) {
  .top .case {
    padding-top: 80px;
    margin-bottom: 60px;
  }
}
.top .case:before {
  content: "";
  display: block;
  width: calc(837px + (100% - 1200px) / 2);
  height: 420px;
  background: url(/product/assets/img/top/img_airsolution_background.jpg) no-repeat;
  background-size: cover;
  background-position: top center;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .top .case:before {
    width: 78%;
    height: 335px;
    background: url(/product/assets/img/top/img_airsolution_background_sp.jpg) no-repeat;
    background-size: cover;
    background-position: top center;
  }
}
.top .case .case-wrap {
  background: #F2F6F7;
  margin-right: calc((100% - 1200px) / 2);
  padding-right: 100px;
}
@media screen and (max-width: 767px) {
  .top .case .case-wrap {
    margin-right: 5%;
    padding: 0 5%;
  }
}
.top .case .case-wrap .case-contents {
  width: 1100px;
  margin: 0 0 0 auto;
  padding: 90px 0;
}
@media screen and (max-width: 767px) {
  .top .case .case-wrap .case-contents {
    width: 100%;
    margin: 0;
  }
}
.top .case .case-wrap .case-contents .top-category .copy {
  width: 620px;
}
@media screen and (max-width: 767px) {
  .top .case .case-wrap .case-contents .top-category .copy {
    width: 100%;
  }
}
.top .case .case-slide-outer {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .top .case .case-slide-outer {
    margin-bottom: 30px;
  }
}
.top .case .case-slide-outer .swiper-slide .img-inner {
  aspect-ratio: 599/340;
}
@media screen and (max-width: 767px) {
  .top .case .case-slide-outer .swiper-slide .img-inner {
    aspect-ratio: 173/180;
  }
}
.top .case .case-slide-outer .swiper-slide .img-inner img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.top .link-area {
  padding: 100px 0;
  background: url(/product/assets/img/top/img_link_area_pc.jpg) no-repeat;
  background-size: cover;
  background-position: center center;
}
@media screen and (max-width: 767px) {
  .top .link-area {
    padding: 70px 0;
  }
}
@media screen and (max-width: 767px) {
  .top .link-area {
    background: url(/product/assets/img/top/img_link_area_sp.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
  }
}
.top .link-area .link-list {
  width: 910px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list {
    width: 78%;
  }
}
.top .link-area .link-list li {
  width: 290px;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li {
    width: 100%;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li:first-of-type img {
    width: 171px;
    height: auto;
  }
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li:first-of-type a {
    padding: 10px;
  }
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li:last-of-type {
    margin-bottom: 0;
  }
}
.top .link-area .link-list li a {
  width: 100%;
  height: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 25px;
  font-size: 1.125rem;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li a {
    font-size: 1rem;
  }
}
.top .link-area .link-list li a .icon-catalog {
  margin-right: 10px;
}
.top .link-area .link-list li a .icon-catalog:before {
  font-size: 2.1875rem;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li a .icon-catalog:before {
    font-size: 1.3125rem;
  }
}
.top .link-area .link-list li a .icon-dl {
  margin-right: 10px;
}
.top .link-area .link-list li a .icon-dl:before {
  font-size: 2.1875rem;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li a .icon-dl:before {
    font-size: 1.4375rem;
  }
}
.top .link-area .link-list li a:hover {
  opacity: 1;
  background: #0081CC;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li a:hover {
    background: #fff;
    color: #222222;
  }
}
.top .link-area .link-list li a:hover .icon-catalog:before,
.top .link-area .link-list li a:hover .icon-dl:before {
  color: #fff;
}
@media screen and (max-width: 767px) {
  .top .link-area .link-list li a:hover .icon-catalog:before,
  .top .link-area .link-list li a:hover .icon-dl:before {
    color: #0081CC;
  }
}
.top .topics {
  padding: 100px 0 120px;
}
@media screen and (max-width: 767px) {
  .top .topics {
    padding: 80px 0 100px;
  }
}
@media screen and (max-width: 767px) {
  .top .topics .inner {
    padding: 0 10%;
  }
}
.top .topics .topics-contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
.top .topics .topics-contents .top-category {
  width: 340px;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .top-category {
    width: 100%;
    display: block;
  }
}
.top .topics .topics-contents .top-category .ttl-line {
  position: relative;
}
.top .topics .topics-contents .top-category .ttl-line:before {
  content: "";
  display: block;
  width: 3px;
  height: 20px;
  background: #0081CC;
  position: absolute;
  left: 0;
  top: -16px;
}
.top .topics .topics-contents .top-category .ttl-line:after {
  content: "";
  display: block;
  background: #D9D9D9;
  width: 3px;
  height: 50px;
  position: absolute;
  left: 0;
  top: 7px;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .top-category .ttl-line:after {
    height: 40px;
    top: 5px;
  }
}
.top .topics .topics-contents .top-category .btn {
  margin-top: 35px;
  margin-left: 22px;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .top-category .btn {
    margin-top: 25px;
    margin-left: 0;
  }
}
.top .topics .topics-contents .topics-list {
  width: 630px;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .topics-list {
    width: 100%;
  }
}
.top .topics .topics-contents .topics-list li {
  border-bottom: 1px solid #C6C6C6;
}
.top .topics .topics-contents .topics-list li:first-of-type {
  border-top: 1px solid #C6C6C6;
}
.top .topics .topics-contents .topics-list li.no-link {
  padding: 15px 10px;
}
.top .topics .topics-contents .topics-list li a {
  display: block;
  padding: 15px 10px;
  position: relative;
}
.top .topics .topics-contents .topics-list li a:hover {
  background: #F2F6F7;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .topics-list li a:hover {
    background: #fff;
  }
}
.top .topics .topics-contents .topics-list li a:hover .txt {
  color: #0081CC;
}
@media screen and (max-width: 767px) {
  .top .topics .topics-contents .topics-list li a:hover .txt {
    color: #222222;
  }
}
.top .topics .topics-contents .topics-list li a.topics-link:after {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  background: url(/product/assets/img/common/icon_blank.png) no-repeat;
  background-size: contain;
}
.top .topics .topics-contents .topics-list li a.pdf:after {
  content: "";
  display: inline-block;
  width: 11px;
  height: 14px;
  background: url(/product/assets/img/common/icon_pdf_b.png) no-repeat;
  background-size: contain;
}
.top .topics .topics-contents .topics-list li .date {
  display: block;
  font-family: "Roboto", sans-serif;
  color: #0081CC;
}
.top .top-category {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 45px;
}
@media screen and (max-width: 767px) {
  .top .top-category {
    margin-bottom: 30px;
  }
}
.top .top-category .ttl-line {
  font-size: 2.5rem;
  padding-left: 23px;
  line-height: 1.3;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line {
    font-size: 1.75rem;
    padding-left: 16px;
    margin-bottom: 20px;
  }
}
.top .top-category .ttl-line .jp {
  position: relative;
}
.top .top-category .ttl-line .jp:before {
  content: "";
  display: block;
  width: 3px;
  height: 50px;
  background: #D9D9D9;
  position: absolute;
  top: 0;
  left: -23px;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .jp:before {
    height: 40px;
    left: -16px;
  }
}
.top .top-category .ttl-line .jp02 {
  display: block;
  font-size: 1.0625rem;
  color: #0081CC;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .jp02 {
    font-size: 1rem;
  }
}
.top .top-category .ttl-line .jp02:before {
  content: "";
  display: block;
  width: 3px;
  height: 20px;
  background: #0081CC;
  position: absolute;
  top: 0;
  left: -23px;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .jp02:before {
    left: -16px;
  }
}
.top .top-category .ttl-line .en {
  display: block;
  font-size: 1.25rem;
  color: #0081CC;
  font-family: "Roboto", sans-serif;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .en {
    font-size: 1rem;
  }
}
.top .top-category .ttl-line .en:before {
  content: "";
  display: block;
  width: 3px;
  height: 20px;
  background: #0081CC;
  position: absolute;
  top: 0;
  left: -23px;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .en:before {
    left: -16px;
  }
}
.top .top-category .ttl-line .en02 {
  font-family: "Roboto", sans-serif;
  position: relative;
}
.top .top-category .ttl-line .en02:before {
  content: "";
  display: block;
  width: 3px;
  height: 45px;
  background: #D9D9D9;
  position: absolute;
  top: 0;
  left: -23px;
}
@media screen and (max-width: 767px) {
  .top .top-category .ttl-line .en02:before {
    height: 40px;
    left: -16px;
  }
}
.top .top-category .copy {
  width: 712px;
}
@media screen and (max-width: 767px) {
  .top .top-category .copy {
    width: 100%;
  }
}
.top .btn a .link-arrow {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #0081CC;
  position: relative;
  transition: 0.3s all;
}
.top .btn a .link-arrow:before {
  top: 15px;
  left: 13px;
  border-color: #fff;
}
.top .test {
  position: relative;
  width: 300px; /* 画像サイズに合わせる */
  height: 100px;
  border-radius: 50%;
  margin: 0 auto;
  border: 1px solid #000000;
}
.top .test .content {
  width: 50%;
  height: 50%;
  position: absolute;
  left: 25%;
  top: 25%;
  border: 1px solid #000000;
}
.top .test .content.top {
  animation: rotate_top 60s linear infinite;
}
@keyframes rotate_top {
  0% {
    transform: rotate(0deg) translate(0, -50px) rotate(0deg) scale(0.5);
  }
  25% {
    transform: rotate(90deg) translate(150px, -50px) rotate(-90deg) scale(1);
  }
  50% {
    transform: rotate(180deg) translate(0, -50px) rotate(-180deg) scale(1.5);
  }
  75% {
    transform: rotate(270deg) translate(-150px, -50px) rotate(-270deg) scale(1);
  }
  100% {
    transform: rotate(360deg) translate(0, -50px) rotate(-360deg) scale(0.5);
  }
}
.top .test .content.right {
  animation: rotate_right 60s linear infinite;
}
@keyframes rotate_right {
  0% {
    transform: rotate(0deg) translateX(100%) rotate(0deg) scale(1);
  }
  25% {
    transform: rotate(90deg) translateX(100%) rotate(-90deg) scale(1.5);
  }
  50% {
    transform: rotate(180deg) translateX(100%) rotate(-180deg) scale(1);
  }
  75% {
    transform: rotate(270deg) translateX(100%) rotate(-270deg) scale(0.5);
  }
  100% {
    transform: rotate(360deg) translateX(100%) rotate(-360deg) scale(1);
  }
}
.top .test .content.bottom {
  animation: rotate_bottom 60s linear infinite;
}
@keyframes rotate_bottom {
  0% {
    transform: rotate(0deg) translateY(100%) rotate(0deg) scale(1.5);
  }
  25% {
    transform: rotate(90deg) translateY(100%) rotate(-90deg) scale(1);
  }
  50% {
    transform: rotate(180deg) translateY(100%) rotate(-180deg) scale(0.5);
  }
  75% {
    transform: rotate(270deg) translateY(100%) rotate(-270deg) scale(1);
  }
  100% {
    transform: rotate(360deg) translateY(100%) rotate(-360deg) scale(1.5);
  }
}
.top .test .content.left {
  animation: rotate_left 60s linear infinite;
}
@keyframes rotate_left {
  0% {
    transform: rotate(0deg) translateX(-100%) rotate(0deg) scale(1);
  }
  25% {
    transform: rotate(90deg) translateX(-100%) rotate(-90deg) scale(0.5);
  }
  50% {
    transform: rotate(180deg) translateX(-100%) rotate(-180deg) scale(1);
  }
  75% {
    transform: rotate(270deg) translateX(-100%) rotate(-270deg) scale(1.5);
  }
  100% {
    transform: rotate(360deg) translateX(-100%) rotate(-360deg) scale(1);
  }
}
.top #lopp {
  width: 300px;
  height: 100px;
  border-radius: 50%;
  position: relative;
  margin: 0 auto;
  /*@keyframes animX{
      0% {left: 0px;}
    100% {left: 500px;}
  }
  @keyframes animY{
      0% {top: 0px;}
    100% {top: 0px;}
  }
  @keyframes animZ{
      0% {z-index: 0;}
    100% {z-index: 5;}
  }
   @keyframes scale {

      0% {
        transform: scale(0.5);
        opacity: 0;
      }
      50% {
        transform: scale(1.5);
        opacity: 1.0;
      }
      100% {
        transform: scale(0.5);
        opacity: 0;
     }
  }*/
  /*.ball1 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate;

  }

  .ball2 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -7.857s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -2.857s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -2.857s infinite alternate;
  }

  .ball3 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -10.714s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -5.714s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -5.714s infinite alternate;
  }

  .ball4 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -13.571s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -8.571s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -8.571s infinite alternate;
  }

  .ball5 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -16.428s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -11.428s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -11.428s infinite alternate;
  }

  .ball6 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -19.285s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -14.285s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -14.285s infinite alternate;
  }

  .ball7 {
    animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -22.142s infinite alternate,
    animY 10s cubic-bezier(0.36, 0, 0.64, 1) -17.142s infinite alternate,
    scale 20s cubic-bezier(0.36, 0, 0.64, 1) -17.142s infinite alternate;
  }*/
}
.top #lopp .ball {
  width: 350px;
  height: 350px;
  border-radius: 50%;
  position: absolute;
}
.top #lopp .ball1 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) 0s infinite alternate;
}
.top #lopp .ball3 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -5s infinite alternate;
}
.top #lopp .ball5 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -10s infinite alternate;
}
.top #lopp .ball7 {
  animation: animX 10s cubic-bezier(0.36, 0, 0.64, 1) -20s infinite alternate, animZ 10s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate, scale 20s cubic-bezier(0.36, 0, 0.64, 1) -15s infinite alternate;
}

#top-mv {
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(/product/assets/img/top/mv_pc.jpg);
}
@media screen and (max-width: 767px) {
  #top-mv {
    background-image: url(/product/assets/img/top/mv_sp.jpg);
  }
}

#top-mv-outer {
  margin: 0 auto;
  overflow: hidden;
}
#top-mv-outer .head-title {
  font-size: 1.875rem;
  font-weight: 600;
  color: #0081CC;
  position: absolute;
  z-index: 10;
  left: 7%;
  top: 75px;
  letter-spacing: 0.1em;
  text-shadow: 0px 0px 20px rgb(255, 255, 255);
  width: 15rem;
}
@media screen and (max-width: 767px) {
  #top-mv-outer .head-title {
    font-size: 1.25rem;
    width: 14.5rem;
  }
}
#top-mv-outer #top-mv-swiper-outer {
  position: relative;
}
#top-mv-outer #top-mv-swiper-outer::before, #top-mv-outer #top-mv-swiper-outer::after {
  content: "";
  position: absolute;
  z-index: 2;
}
#top-mv-outer #top-mv-swiper-outer::before {
  top: 0;
  right: 0;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url(/product/assets/img/top/mv_pc_cover_02.png);
  width: 29.15%;
  height: 40%;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer::before {
    background-image: url(/product/assets/img/top/mv_sp_cover_02.png);
    width: 68.15%;
    height: 0;
    padding-top: 48%;
  }
}
#top-mv-outer #top-mv-swiper-outer::after {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 33%;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url(/product/assets/img/top/mv_pc_cover.png);
}
@media screen and (min-width: 1240px) {
  #top-mv-outer #top-mv-swiper-outer::after {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer::after {
    background-image: url(/product/assets/img/top/mv_sp_cover.png);
    width: 33.4%;
    margin: 0;
    height: 0;
    padding-top: 95%;
  }
}
#top-mv-outer #top-mv-swiper-outer .text-block-outer {
  position: absolute;
  width: 100%;
  height: 0;
  bottom: 15%;
  left: 0;
  z-index: 3;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer .text-block-outer {
    top: 67.5%;
    bottom: auto;
  }
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box {
  position: absolute;
  right: 8%;
  bottom: 15%;
  text-align: right;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer .slide-text-box {
    right: 6%;
    bottom: auto;
    top: 68%;
  }
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub01,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02 {
  padding: 0;
  margin: 0;
  display: inline-block;
  color: #fff;
  text-align: left;
  line-height: 1;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text span,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub01 span,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02 span {
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.5));
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text span em,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub01 span em,
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02 span em {
  font-style: normal;
  transition: all 1.2s;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  max-width: 0%;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text {
  font-size: 3.75rem;
  font-weight: 700;
  font-family: "Roboto", sans-serif;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text {
    font-size: 2.5rem;
  }
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text span {
  line-height: 1.1;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub01 {
  font-size: 1rem;
  padding-bottom: 10px;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub01 span {
  line-height: 1.3;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02 {
  font-size: 1.125rem;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02 span {
  line-height: 1.5;
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02:not(.none) {
  padding-top: 10px;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper-outer .slide-text-box .slide-text-sub02:not(.none) {
    padding-top: 0px;
  }
}
#top-mv-outer #top-mv-swiper-outer .slide-text-box.active .slide-text span em,
#top-mv-outer #top-mv-swiper-outer .slide-text-box.active .slide-text-sub01 span em,
#top-mv-outer #top-mv-swiper-outer .slide-text-box.active .slide-text-sub02 span em {
  max-width: 100%;
}
#top-mv-outer #top-mv-swiper {
  height: 570px;
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  overflow: visible;
}
@media screen and (max-width: 767px) {
  #top-mv-outer #top-mv-swiper {
    height: 596px;
    max-width: 390px;
  }
}
#top-mv-outer #top-mv-swiper .inner-images {
  vertical-align: bottom;
  position: relative;
  display: block;
  z-index: 1;
  transition: 0.6s all;
}
#top-mv-outer #top-mv-swiper .swiper-wrapper {
  opacity: 0;
}
@media screen and (min-width: 768px) {
  #top-mv-outer #top-mv-swiper .swiper-wrapper {
    transform-style: initial;
  }
}
#top-mv-outer #top-mv-swiper.swiper-initialized .swiper-wrapper {
  opacity: 1;
}
#top-mv-outer .swiper-slide {
  position: relative;
  overflow: visible !important;
  display: flex;
  align-items: flex-end;
  padding-bottom: 165px;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  #top-mv-outer .swiper-slide {
    padding-bottom: 280px;
  }
}
#top-mv-outer .swiper-slide::after {
  content: "";
  transition: all 2.4s;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url(/product/assets/img/top/mv_slide_dec.png);
  position: absolute;
  bottom: calc(-9% + 195px);
  left: 50%;
  transform: translateX(-50%);
  width: 127%;
  height: 0;
  padding-top: 42.4%;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  #top-mv-outer .swiper-slide::after {
    bottom: calc(-1.5% + 280px);
  }
}
#top-mv-outer .swiper-slide.swiper-slide-active::after {
  opacity: 1;
}
@media screen and (min-width: 768px) {
  #top-mv-outer .swiper-slide.swiper-slide-active:hover .inner-images {
    transform: scale(1.04);
  }
}
#top-mv-outer .swiper-wrapper {
  transition: transform 0.6s cubic-bezier(0.5, 0, 0.75, 0);
}

#case-swiper .swiper-wrapper {
  transition-timing-function: linear;
}/*# sourceMappingURL=top.css.map */