﻿@charset "UTF-8";


/* content-header
----------------------------------- */

/* ヘッダー部改行調整 */

#content .content-header .content-header__inner .txt .bg-gray br {
  display: block;
}

/* 1枚目 */
@keyframes fadeImg01 {
  0% {
    opacity: 1;
  }

  40% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  90% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* 2枚目 */
@keyframes fadeImg02 {
  0% {
    opacity: 0;
  }

  40% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.content-header__txt {
  z-index: 3;
}

.fadeSlider {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.fadeSlider span[class^='fadeSlider'] {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* 画像1 */
.fadeSlider_01 {
  background-image: url(/img/product/bcp/bg_header_index_01.jpg);
  animation: fadeImg01 10s ease-in-out infinite;
}

/* 画像2 */
.fadeSlider_02 {
  background-image: url(/img/product/bcp/bg_header_index_02.jpg);
  animation: fadeImg02 10s ease-in-out infinite;
}

@media screen and (max-width: 500px) {
  .fadeSlider span.fadeSlider_01 {
    background-image: url(/img/product/bcp/bg_header_index_01_sp.jpg);
    animation: fadeImg01 10s ease-in-out infinite;
  }

  .fadeSlider span.fadeSlider_02 {
    background-image: url(/img/product/bcp/bg_header_index_02_sp.jpg);
    animation: fadeImg02 10s ease-in-out infinite;
  }
}

/* ヘッダー部改行調整 */
/* section outline
----------------------------------- */
.outline .item.item__txt .marker_yellow {
  background-color: #B5FF14;
}

.list-lineup+.ttl_section {
  margin-top: 50px;
}

.content-section.bg-video {
  height: 690px;
}

.outline .item.item__img {
  text-align: center;
  padding-bottom: 13px;
}

.outline .item.item__txt {
  color: #fff;
  padding: 0 0 10px 0;
  font-size: 16px;
  font-weight: 600;
}

.outline .item.item__txt p {
  margin-bottom: 20px;
}

.outline .item.item__txt .for_tab,
.is-tb,
.is-tb02,
.under768,
.only768 {
  display: none;
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
  .is-tb {
    display: block;
  }
}

@media screen and (min-width: 500px) and (max-width: 768px) {
  .is-tb02 {
    display: block;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1243px) {
  .outline .item.item__txt .for_tab {
    display: inline;
  }

}

@media screen and (min-width: 700px) and (max-width: 990px) {
  .outline .item.item__txt .for_tab {
    display: inline;
  }

  .outline .item.item__txt br.over500 {
    display: none;
  }
}

.item__img.img01_scale {
  margin: 17px auto 20px;
}

.outline .col3 {
  max-width: 640px;
  margin: 0 auto;
}

.outline .col3 .item {
  width: calc(50% - 20px);
  background-color: #f2f2f2;
  color: #333333;
  text-align: center;
  padding: 20px 17px 12px;
  margin: 0px;
}

.outline .col3 .item:hover {
  opacity: 0.7;
}

.outline .col3 .item .ttl {
  font-size: 22px;
}

.outline .col3 .item .ttl.line1 {
  padding-top: 15px;
  padding-bottom: 10px;
}

.outline .col3 .item .img {
  margin: 2px auto 15px;
}

.outline .col3 .item .img img {
  height: auto;
}

.outline .col3 .item .img img {
  margin-top: 8px;
}

.outline .col3 .item .desc {
  text-align: left;
}

.outline .col2 {
  max-width: 1079px;
  margin: 0 auto;
  flex-direction: column;
      flex-wrap: nowrap;
  margin-bottom: -3px;
  padding: 70px 0 ;
    align-items: center;
    text-align: center;
    gap: 17px;
}

.outline .col2 .item.item__img {
  max-width: 936px;
  width: 100%;
}

.outline .col2 .item.item__img img {
  width: 100%;
  height: auto;
}

.outline .item.item__txt {
  width: calc(100% - 400px);
}

.outline .item.item__txt p {
  margin-bottom: 20px
}

@media screen and (max-width: 1400px) {
  .over1400 {
    display: none;
  }
}

@media screen and (max-width: 1440px) {
  .outline .col2 .item.item__img {
    padding: 0 12px 0
  }
}

@media screen and (max-width: 1200px) {
  .outline .col2 {
    flex-direction: column;
    padding: 0;
  }

  .outline .item.item__txt {
    width: 100%;
    padding: 66px 52px 10px 56px;
    text-align: center;
  }

  .outline .item.item__txt .arw_rightwards_yellow {
    padding: 11px 6px;
    margin-top: 29px
  }

  .outline .col2 .item.item__img {
    width: 100%;
    padding: 10px 12px 70px;
    text-align: center
  }

}

.video-wrapper,
.bg-video video {
  width: 100%;
  height: auto;
}

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

  .video-wrapper,
  .bg-video video {
    width: auto;
    height: 100%;
  }
}

@media screen and (max-width: 1024px) {
  .outline .item.item__txt {
    padding: 50px 25px 10px 25px
  }

  .video-wrapper {
    height: 110vh;
    margin-left: 0px;
  }

  .bg-video video {
    height: 110vh;
    margin-left: 0px;
  }
}

@media screen and (max-width: 1246px) {
  .item__img.img01_scale img {
    max-width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 1024px) {
  .video-wrapper {
    height: 110vh;
  }

  .outline .col3 .item .ttl span.is-sp {
    display: inline !important;
  }

  .outline .col3 .item .ttl.line1 {
    padding-top: 0px;
    padding-bottom: 0px;
  }
}

@media screen and (max-width: 1024px) and (min-aspect-ratio: 2/1) {
  .video-wrapper {
    min-height: 120vh;
    height: auto;
    min-width: 100%;
  }

  .bg-video video {
    min-height: 120vh;
    height: auto;
    min-width: 100%;
  }
}

@media screen and (min-width: 501px) and (max-width: 768px) {
  .only768 {
    display: block;
  }
}

@media screen and (max-width: 768px) {
  .over768 {
    display: none;
  }

  .under768 {
    display: block;
  }

  .outline .item.item__img {
    padding: 0px 8px 20px 20px;
  }

  .outline .col3 {
    flex-direction: column;
    max-width: calc(100% - 30px);
  }

  .outline .col3 .item {
    width: 100%;
    padding: 14px 18px 4px;
    margin: 0 auto 32px;
  }

  .outline .col3 .item:nth-child(1),
  .outline .col3 .item:nth-child(2) {
    margin: 0 auto 42px;
  }

  .outline .col3 .item .ttl {
    font-size: 19px;
  }

  .outline .col3 .item .img {
    margin: 9px auto 12px;
  }

  .outline .col3 .item:nth-child(1) .img img {
    margin-left: -14px;
  }

  .outline .col3 .item:nth-child(2) .img img {
    margin-left: 0px;
  }

  .outline .col3 .item:nth-child(3) .img img {
    margin-left: 0px;
  }

  .outline .col3 .item .desc {
    font-size: 14px;
    padding: 4px 0px 13px;
    text-align: center;
  }
}

@media screen and (max-width: 415px) {
  .outline .item.item__txt {
    padding: 45px 15px 10px 15px;
  }


  .outline .item.item__img {
    padding: 24px 10px 25px;
  }

  .outline .item.item__img img {
    max-width: 100%;
  }

  .outline .col3 {
    flex-direction: column;
    max-width: calc(100% - 30px);
  }

  .outline .col3 .item {
    width: 100%;
    padding: 14px 14px 2px;
    margin: 0 auto 32px;
  }

  .outline .col3 .item:nth-child(1),
  .outline .col3 .item:nth-child(2) {
    margin: 0 auto 32px;
  }

  .outline .col3 .item .ttl {
    font-size: 19px;
    letter-spacing: -0.5px;
  }

  .outline .col3 .item .img {
    margin: 9px auto 12px;
  }

  .outline .col3 .item .desc {
    font-size: 17px;
    text-align: left;
  }

  .outline .col3 .item:nth-child(1) .img img {
    margin-left: -22px;
    width: calc(80px * 1.2)
      /* 114px */
    ;
  }

  .outline .col3 .item:nth-child(2) .img img {
    width: calc(80px * 1.2)
      /* 70px */
    ;
  }
}

/* section lineup
----------------------------------- */
/* section related
----------------------------------- */

.related .col2.list-related .item .related_technology_p2_04 {
  background-image: url(/img/product/product_common/related_technology_p2_04.png.webp)
}

.webp .related .col2.list-related .item .related_technology10 {
  background-image: url(/img/product/product_common/related_technology10.png.webp);
}

.related .col2.list-related .item .related_technology10 {
  background-image: url(/img/product/product_common/related_technology10.png);
}

@media screen and (max-width: 1024px) {
  .related .col2.list-related .item .related_technology_p2_04 {
    background-image: url(/img/product/product_common/related_technology_p2_04_tb.png);
    background-position-y: -60px;
  }

.webp .related .col2.list-related .item .related_technology10 {
  background-image: url(/img/product/product_common/related_technology10_tb.png.webp);
}

.related .col2.list-related .item .related_technology10 {
  background-image: url(/img/product/product_common/related_technology10_tb.png);
}
}

@media screen and (max-width: 415px) {
  .related .col2.list-related .item .related_technology_p2_04 {
    background-image: url(/img/product/product_common/related_technology_p2_04_sp.png.webp);
    background-position-y: -60px;
  }

  .webp .related .col2.list-related .item .related_technology10 {
    background-image: url(/img/product/product_common/related_technology10_sp.jpg.webp);
  }

  .related .col2.list-related .item .related_technology10 {
    background-image: url(/img/product/product_common/related_technology10_sp.jpg);
  }
}