@charset "utf-8";
/* mainVisual
---------------------------------------------------*/

.TopMvBl {
  position: relative;
  overflow: hidden;
}

.TopMvBl .slider {
  opacity: 0 /*slick読み込み時一瞬画像が縦並びになるのを防ぐ*/;
  transition: opacity 0.3s linear
    /*slick読み込み時一瞬画像が縦並びになるのを防ぐ*/;
}

.TopMvBl .slider.slick-initialized {
  opacity: 1 /*slick読み込み時一瞬画像が縦並びになるのを防ぐ*/;
}

/* スライダ―　slick
---------------------------------------------------*/

/* 前／次の矢印の設定 */

.slider {
  position: relative;
}

.slider_circle_s_1,
.slider_circle_s_2 {
  position: absolute;
  z-index: 1000;
  top: -12%;
  left: -10.4%;
  opacity: 0;
  transition: all 0.5s;
}

.slider_circle_s_1 {
  width: 62.7%;
}

.slider_circle_s_2 {
  width: 63.7%;
}

.TopMvBl .slick-circle-active.slider_circle_s_1 {
  /* animation: linear infinite rotation_s_1;
    animation-duration: 24s;
    opacity: 1; */
}

.TopMvBl .slider_circle_s_1 {
  animation: linear infinite rotation_s_1;
  animation-duration: 24s;
  opacity: 1;
}

.TopMvBl .slick-circle-active.slider_circle_s_2 {
  /* animation: linear infinite rotation_s_2;
    animation-duration: 24s;
    opacity: 1; */
}

.TopMvBl .slider_circle_s_2 {
  animation: linear infinite rotation_s_2;
  animation-duration: 24s;
  opacity: 1;
}

@keyframes rotation_s_1 {
  0% {
    transform: rotate(0);
  }
  2.5% {
    transform: rotate(70deg);
  }
  25% {
    transform: rotate(90deg);
  }
  27.5% {
    transform: rotate(160deg);
  }
  50% {
    transform: rotate(180deg);
  }
  52.5% {
    transform: rotate(250deg);
  }
  75% {
    transform: rotate(270deg);
  }
  77.5% {
    transform: rotate(340deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotation_s_2 {
  0% {
    transform: rotate(0);
  }
  2.5% {
    transform: rotate(70deg);
  }
  25% {
    transform: rotate(90deg);
  }
  27.5% {
    transform: rotate(160deg);
  }
  50% {
    transform: rotate(180deg);
  }
  52.5% {
    transform: rotate(250deg);
  }
  75% {
    transform: rotate(270deg);
  }
  77.5% {
    transform: rotate(340deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.TopMvBl .slider_circle_s_1.slick-active-1 {
  animation: linear infinite rotation_active_s1_1;
  animation-duration: 24s;
  opacity: 1;
}

.TopMvBl .slider_circle_s_1.slick-active-2 {
  animation: linear infinite rotation_active_s1_2;
  animation-duration: 24s;
  opacity: 1;
}

.TopMvBl .slider_circle_s_1.slick-active-3 {
  animation: linear infinite rotation_active_s1_3;
  animation-duration: 24s;
  opacity: 1;
}

.TopMvBl .slider_circle_s_1.slick-active-4 {
  animation: linear infinite rotation_active_s1_4;
  animation-duration: 24s;
  opacity: 1;
}

@keyframes rotation_active_s1_1 {
  0% {
    transform: rotate(0);
  }
  2.5% {
    transform: rotate(70deg);
  }
  25% {
    transform: rotate(90deg);
  }
  27.5% {
    transform: rotate(160deg);
  }
  50% {
    transform: rotate(180deg);
  }
  52.5% {
    transform: rotate(250deg);
  }
  75% {
    transform: rotate(270deg);
  }
  77.5% {
    transform: rotate(340deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotation_active_s1_2 {
  0% {
    transform: rotate(90deg);
  }
  2.5% {
    transform: rotate(160deg);
  }
  25% {
    transform: rotate(180deg);
  }
  27.5% {
    transform: rotate(250deg);
  }
  50% {
    transform: rotate(270deg);
  }
  52.5% {
    transform: rotate(340deg);
  }
  75% {
    transform: rotate(360deg);
  }
  77.5% {
    transform: rotate(70deg);
  }
  100% {
    transform: rotate(90deg);
  }
}

@keyframes rotation_active_s1_3 {
  0% {
    transform: rotate(180deg);
  }
  2.5% {
    transform: rotate(250deg);
  }
  25% {
    transform: rotate(270deg);
  }
  27.5% {
    transform: rotate(340deg);
  }
  50% {
    transform: rotate(360deg);
  }
  52.5% {
    transform: rotate(70deg);
  }
  75% {
    transform: rotate(90deg);
  }
  77.5% {
    transform: rotate(160deg);
  }
  100% {
    transform: rotate(180deg);
  }
}

@keyframes rotation_active_s1_4 {
  0% {
    transform: rotate(270deg);
  }
  2.5% {
    transform: rotate(340deg);
  }
  25% {
    transform: rotate(360deg);
  }
  27.5% {
    transform: rotate(70deg);
  }
  50% {
    transform: rotate(90deg);
  }
  52.5% {
    transform: rotate(160deg);
  }
  75% {
    transform: rotate(180deg);
  }
  77.5% {
    transform: rotate(250deg);
  }
  100% {
    transform: rotate(270deg);
  }
}

.TopMvBl .slider_circle_s_2.slick-active-1 {
  animation: linear infinite rotation_active_s2_1;
  animation-duration: 30s;
  /* animation-duration: 24s; */
  opacity: 1;
}

.TopMvBl .slider_circle_s_2.slick-active-2 {
  animation: linear infinite rotation_active_s2_2;
  animation-duration: 30s;
  /* animation-duration: 24s; */
  opacity: 1;
}

.TopMvBl .slider_circle_s_2.slick-active-3 {
  animation: linear infinite rotation_active_s2_3;
  animation-duration: 30s;
  /* animation-duration: 24s; */
  opacity: 1;
}

.TopMvBl .slider_circle_s_2.slick-active-4 {
  animation: linear infinite rotation_active_s2_4;
  animation-duration: 30s;
  /* animation-duration: 24s; */
  opacity: 1;
}

@keyframes rotation_active_s2_1 {
  0% {
    transform: rotate(0);
  }
  2.5% {
    transform: rotate(70deg);
  }
  25% {
    transform: rotate(90deg);
  }
  27.5% {
    transform: rotate(160deg);
  }
  50% {
    transform: rotate(180deg);
  }
  52.5% {
    transform: rotate(250deg);
  }
  75% {
    transform: rotate(270deg);
  }
  77.5% {
    transform: rotate(340deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotation_active_s2_2 {
  0% {
    transform: rotate(90deg);
  }
  2.5% {
    transform: rotate(160deg);
  }
  25% {
    transform: rotate(180deg);
  }
  27.5% {
    transform: rotate(250deg);
  }
  50% {
    transform: rotate(270deg);
  }
  52.5% {
    transform: rotate(340deg);
  }
  75% {
    transform: rotate(360deg);
  }
  77.5% {
    transform: rotate(70deg);
  }
  100% {
    transform: rotate(90deg);
  }
}

@keyframes rotation_active_s2_3 {
  0% {
    transform: rotate(180deg);
  }
  2.5% {
    transform: rotate(250deg);
  }
  25% {
    transform: rotate(270deg);
  }
  27.5% {
    transform: rotate(340deg);
  }
  50% {
    transform: rotate(360deg);
  }
  52.5% {
    transform: rotate(70deg);
  }
  75% {
    transform: rotate(90deg);
  }
  77.5% {
    transform: rotate(160deg);
  }
  100% {
    transform: rotate(180deg);
  }
}

@keyframes rotation_active_s2_4 {
  0% {
    transform: rotate(270deg);
  }
  2.5% {
    transform: rotate(340deg);
  }
  25% {
    transform: rotate(360deg);
  }
  27.5% {
    transform: rotate(70deg);
  }
  50% {
    transform: rotate(90deg);
  }
  52.5% {
    transform: rotate(160deg);
  }
  75% {
    transform: rotate(180deg);
  }
  77.5% {
    transform: rotate(250deg);
  }
  100% {
    transform: rotate(270deg);
  }
}

.slider .prev {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -18px;
  margin: auto;
  width: 46px;
  height: 46px;
  background-image: url(../img/common/btn_prev.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 46px auto;
  z-index: 1;
}

.slider .next {
  position: absolute;
  top: 0;
  right: -18px;
  bottom: 0;
  margin: auto;
  width: 46px;
  height: 46px;
  background-image: url(../img/common/btn_next.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 46px auto;
  z-index: 1;
}

.slider .prev:hover,
.slider .next:hover {
  transition: all 0.5s ease 0s;
  opacity: 0.7;
  cursor: pointer;
}

.TopMvBl__inner {
  max-width: 1500px;
  margin: 0 auto;
}

.TopMvBl h1 {
  font-size: calc((59.5 / 1500) * 100vw);
  font-weight: bold;
  color: #133769;
  line-height: 1.16;
  position: absolute;
  z-index: 1001;
  top: 15vw;
  left: 6.5%;
  /* opacity: 0; */
  text-shadow: 2px 2px 3px #0b2447;
}

.TopMvBl .fadein_text,
.TopMvBl .fadein_text span {
  font-size: calc((59.5 / 1500) * 100vw);
  font-weight: bold;
  color: #133769;
  line-height: 1.16;
}

.TopMvBl .fadein_text_2,
.TopMvBl .fadein_text_2 span {
  font-size: calc((40 / 1500) * 100vw);
  font-weight: bold;
  color: #133769;
  line-height: 1.16;
  margin-top: 10px;
  text-shadow: 1px 1px 3px #0b2447;
}

.TopMvBl h1.slick-circle-active {
  opacity: 1;
}

.TopMvBl li.slick-active h1 {
}

.TopMvBl h1 img {
}

.TopMvBl li.slick-active h1 img {
}

.TopMvBl .slick-slide .s-fade-txt,
.TopMvBl .slick-slide .s-fade-txt02 {
  opacity: 0;
}

/* Our business .top_ourbusinessBl
---------------------------------------------------*/
.top_ourbusinessBl {
  background-color: #fcfcfc;
  padding: 40px 0 90px;
}

.top_ourbusinessBl .lead {
  padding: 0 30px;
}

.top_ourbusinessBl_ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}

h2 + .top_ourbusinessBl_ul {
  margin-top: 30px;
}

.top_ourbusinessBl_ul li {
  width: 30.5%;
  margin-right: 4.25%;
}

.top_ourbusinessBl_ul li:nth-child(3n + 3) {
  margin-right: 0;
}

.top_ourbusinessBl_ul li:nth-child(n + 4) {
  margin-top: 4.25%;
}

.top_ourbusinessBl_ul li a {
  display: block;
}

.top_ourbusinessBl_ul li a .img {
  position: relative;
  overflow: hidden;
}

.top_ourbusinessBl_ul li a .img::after {
  content: "";
  display: block;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  position: absolute;
  top: 0;
  left: 0;
  border: 8px solid #fff;
  opacity: 0.5;
}

.top_ourbusinessBl_ul li a .img img {
  width: 100%;
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  opacity: 1;
}

.top_ourbusinessBl_ul li a:hover .img img {
  -webkit-transform: scale(1.4, 1.4);
  -moz-transform: scale(1.4, 1.4);
  -ms-transform: scale(1.4, 1.4);
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  opacity: 0.9;
}

.top_ourbusinessBl_ul li a h3 {
  margin-top: 10px;
}

.top_ourbusinessBl_ul li a p {
  font-size: 2rem;
  line-height: 1.5;
}

/* Our pledge to net-zero .top_ourpledgeBl
---------------------------------------------------*/
.top_ourpledgeBl {
  padding: 82px 0 85px;
  background-color: #369bdd;
}

.top_ourpledgeBl h2 {
  color: #fff;
}

h2 + .top_ourpledgeBl_bnr {
  margin-top: 40px;
}
.top_ourpledgeBl_bnr {
  background-color: #369bdd;
  display: block;
  transition: 0.5s all;
  border: 1px solid #fff;
  box-shadow: 2px 3px 10px #266182;
}

.top_ourpledgeBl_bnr:hover {
  opacity: 0.7;
}

.top_ourpledgeBl_bnr img {
  max-width: 632px;
  width: 63.2%;
  box-sizing: border-box;
  display: block;
  margin: 0 auto;
  padding: 4.05% 0;
}

.top_ourpledgeBl_subhead {
  font-size: 2.4rem;
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
  margin-top: 20px;
}

.top_ourpledgeBl_lead {
  font-size: 2.4rem;
  line-height: 1.5;
  margin-top: 30px;
  color: #fff;
}

.top_ourpledgeBl_lead + .top_ourpledgeBl_lead {
  margin-top: 30px;
}

/* -------------------------------------------------- */

@media only screen and (min-width: 1501px) {
  .TopMvBl__inner {
    position: relative;
  }
  .TopMvBl h1,
  .TopMvBl .fadein_text,
  .TopMvBl .fadein_text span {
    font-size: 60px;
  }
  .TopMvBl .fadein_text_2,
  .TopMvBl .fadein_text_2 span {
    font-size: 40.2px;
  }
  .slider_circle_s_1,
  .slider_circle_s_2 {
    /* top: -12vw; */
    /* left: -8vw; */
    max-width: inherit;
  }
}

/*
---------------------------------------------------*/

@media only screen and (max-width: 1300px) {
}

/* 
---------------------------------------------------*/

@media only screen and (max-width: 767px) {
  /* slick */
  .slick-dots {
    bottom: 3px;
  }
  /* ------- .TopMvBl ------- */
  .TopMvBl {
    position: relative;
  }
  .TopMvBl h1 {
    font-size: calc((60 / 750) * 100vw);
    top: auto;
    bottom: 11%;
    left: 6.5%;
    text-shadow: 2px 2px 2px #0b2447;
  }
  .TopMvBl .fadein_text,
  .TopMvBl .fadein_text span {
    font-size: calc((60 / 750) * 100vw);
  }
  .TopMvBl .fadein_text_2,
  .TopMvBl .fadein_text_2 span {
    font-size: calc((40.2 / 750) * 100vw);
    margin-top: calc((10/750)*100vw);
  }
  .TopMvBl .slider03 {
  }
  .TopMvBl h1 img.slide_tit01 {
    width: calc((369 / 750) * 100vw);
  }
  .TopMvBl h1 img.slide_tit02 {
    width: calc((570 / 750) * 100vw);
  }
  .TopMvBl h1 img.slide_tit03 {
    width: calc((710 / 750) * 100vw);
  }
  _:-ms-lang(x)::-ms-backdrop,
  .TopMvBl h1 img {
    width: auto;
  }
  .slider_circle_s_1,
  .slider_circle_s_2 {
    position: absolute;
    z-index: 1000;
    top: 44%;
    left: -14.4%;
    opacity: 0;
    transition: all 0.5s;
    width: 105%;
    max-width: inherit;
  }
  /* ------- .top_ourbusinessBl ------- */
  .top_ourbusinessBl {
    padding: calc((40 / 750) * 100vw) 0 calc((90 / 750) * 100vw);
  }
  .top_ourbusinessBl .lead {
    padding: 0 calc((20 / 750) * 100vw);
  }
  .top_ourbusinessBl_ul {
    display: block;
  }
  h2 + .top_ourbusinessBl_ul {
    margin-top: calc((25 / 750) * 100vw);
  }
  .top_ourbusinessBl_ul li {
    width: auto;
    margin-right: 0;
  }
  .top_ourbusinessBl_ul li + li {
    margin-top: calc((35 / 750) * 100vw);
  }
  .top_ourbusinessBl_ul li a h3 {
    margin-top: calc((5 / 750) * 100vw);
  }
  .top_ourbusinessBl_ul li a p {
    font-size: calc((32 / 750) * 100vw);
  }
  /* ------- .top_ourpledgeBl ------- */
  .top_ourpledgeBl {
    padding: calc((82 / 750) * 100vw) 0 calc((190 / 750) * 100vw);
  }
  h2 + .top_ourpledgeBl_bnr {
    margin-top: calc((40 / 750) * 100vw);
  }
  .top_ourpledgeBl_bnr:hover {
    opacity: 1;
  }
  .top_ourpledgeBl_bnr img {
    max-width: inherit;
    width: calc((596 / 750) * 100vw);
    padding: calc((39 / 750) * 100vw) 0;
  }
  .top_ourpledgeBl_subhead {
    font-size: calc((32 / 750) * 100vw);
    margin-top: calc((20 / 750) * 100vw);
  }
  .top_ourpledgeBl_lead {
    font-size: calc((32 / 750) * 100vw);
    margin-top: calc((30 / 750) * 100vw);
  }
  .top_ourpledgeBl_lead + .top_ourpledgeBl_lead {
    margin-top: calc((30 / 750) * 100vw);
  }
}