﻿.main-area {
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-weight: 400;
  overflow: hidden;
  box-sizing: border-box;
  letter-spacing: 0.075em;
}

.main-area img {
  width: 100%;
  height: auto;
}

.sp_only {
  display: block;
}

.pc_only {
  display: none;
}


/************** js **************/
.js-fade.active {
  opacity: 1;
    transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
}

.js-fade {
  opacity: 0;
  will-change: opacity, transform;
  transition: ease-in, opacity 2500ms, transform 1000ms;
    transform: translate3d(0, 0, 0) scale(1);
}

.slide_box div {
  opacity: 0;
  transform: translate(100%, 0);
  transition: opacity 1.6s ease 0s, transform 1.6s ease 0s;
}

.slide_box div.is-show {
  opacity: 1;
  transform: none;
}


/************** common **************/
.sec {
  margin: 0 auto;
}

/*** flex_box ***/
.flex_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto;
}

/*** sec_ttl ***/
.sec .sec_ttl {
  margin-bottom: calc(7* (100vw /375));
  font-size: calc(20* (100vw /375));
  letter-spacing: 0.075em;
  text-align: center;
  line-height: 1.4;
  font-weight: 600;
}

.sec01 .ttl_img {
  margin: 0 auto calc(23* (100vw /375));
  width: calc(276* (100vw /375));
}

/*** sec_text ***/
.sec_text {
  font-size: calc(14* (100vw /375));
  letter-spacing: 0.12em;
  line-height: 2;
  font-weight: 400;
}

.sec_text span {
  margin-top: calc(15* (100vw /375));
  font-size: calc(24* (100vw /375));
  display: inline-block;
  letter-spacing: 0.1em;
}

/*** sec_box ***/
.sec_box {
  margin-bottom: calc(42 * (100vw / 375));
}

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

/*** sec_tax ***/
.sec_tax {
  margin: calc(27* (100vw /375)) calc(9* (100vw /375)) 0 0;
  display: flex;
  flex-direction: column;
  gap: calc(8* (100vw /375)) 0;
  white-space: normal;
  align-items: flex-end;
}

.sec_tax li {
  font-size: calc(12* (100vw /375));
  letter-spacing: 0.075em;
  text-align: left;
  line-height: 1.5;
  text-decoration: underline;
  text-align: right;
  font-weight: 500;
}

/*** text_box ***/
.text_box {
  padding: calc(33* (100vw /375)) 0;
  background-color: #F0F0ED;
}

.text_box p {
  margin: 0 auto;
  width: max-content;
  font-size: calc(15* (100vw /375));
  letter-spacing: 0.075em;
  line-height: 2;
  text-align: center;
  font-weight: 500;
}


/************** mv **************/
.sec_mv {
  margin: 0 auto calc(53* (100vw /375));
}


/************** sec01 **************/
.sec01 {
  margin: 0 auto calc(74* (100vw /375));
  position: relative;
  text-align: center;
}

.sec01 h3 {
  margin-bottom: calc(20* (100vw /375));
}

.sec01 .sub_ttl {
  margin: 0 auto calc(30* (100vw /375));
  font-size: calc(16* (100vw /375));
  font-weight: 600;
  letter-spacing: 0.075em;
}

.img01 {
  margin: 0 auto;
  position: relative;
  width: calc(355* (100vw /375));
}

.sec01 .sec_text {
  margin: 0 auto calc(34* (100vw /375));
  letter-spacing: 0.075em;
}


/************** sec02 **************/
.sec02 {
  padding-bottom: calc(72* (100vw /375));
  position: relative;
}

.sec02 h3 {
  margin-bottom: calc(23 * (100vw / 375));
}

.sec02 .sec_box01 {
  margin: 0 auto calc(40* (100vw /375));
  width: calc(315* (100vw /375));
}

.sec02 .sec_box01 .sub_box {
  margin: 0 auto calc(40* (100vw /375));
  display: flex;
  flex-direction: column;
  gap: calc(10* (100vw /375)) 0;
}

.sec02 .sec_box02 {
  margin: 0 auto;
}

.sec02 .sec_box02 .sub_box {
  margin: 0 auto calc(10* (100vw /375));
  width: calc(315* (100vw /375));
  display: flex;
  flex-direction: column;
  gap: calc(10* (100vw /375)) 0;
  overflow: hidden;
}

.sec02 .img06 {
  margin: 0 auto calc(30* (100vw /375));
  width: calc(355* (100vw /375));
}

.sec02 .sec_box02 .text_box {
  padding: calc(23* (100vw /375)) 0;
}

.sec02 .sec_box02 .text_box p {
  font-size: calc(13* (100vw /375));
}


/************** sec03 **************/
.sec03 {
  padding-bottom: calc(80* (100vw /375));
  position: relative;
}

.sec03 h3 {
  margin-bottom: calc(23 * (100vw / 375));
}

.sec03 .sec_box01 {
  margin: 0 auto calc(40* (100vw /375));
  width: calc(315* (100vw /375));
}

.sec03 .sec_box01 .sub_box {
  margin: 0 auto calc(40* (100vw /375));
  display: flex;
  flex-direction: column;
  gap: calc(10* (100vw /375)) 0;
}

.sec03 .sec_box02 {
  margin: 0 auto;
}

.sec03 .sec_box02 .sub_box {
  margin: 0 auto calc(30* (100vw /375));
  width: calc(315* (100vw /375));
  display: flex;
  flex-direction: column;
  gap: calc(10* (100vw /375)) 0;
}

.sec03 .img06 {
  margin: 0 auto calc(30* (100vw /375));
}

.sec03 .sec_box02 .text_box {
  padding: calc(23* (100vw /375)) 0;
}

.sec03 .sec_box02 .text_box p {
  font-size: calc(13* (100vw /375));
}

/************** sec04 **************/
.sec04 {
  margin: 0 auto calc(59* (100vw /375));
  padding: calc(58* (100vw /375)) 0 calc(54* (100vw /375));
  background-color: #F0F0ED;
}

.sec04 .sec_box {
  margin: 0 auto calc(53* (100vw /375));
  width: calc(315* (100vw /375));
}

.sec04 .sec_box:last-child {
  margin: 0 auto;
}

.sec04 h4 {
  margin-bottom: calc(17* (100vw /375));
  font-size: calc(20* (100vw /375));
  letter-spacing: 0.1em;
  position: relative;
}

.sec04 h4 p {
  padding-right: calc(14* (100vw /375));
  width: max-content;
  background-color: #F0F0ED;
  position: relative;
  z-index: 5;
}

.sec04 h4::before {
  content: '';
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 3;
  background-color: #CBCBC9;
  width: 100%;
  height: 1px;
  top: 50%;
  transform: translate(0, -50%);
}

.sec04 dl dt {
  margin-bottom: calc(8* (100vw /375));
  font-size: calc(14* (100vw /375));
  letter-spacing: 0.075em;
  font-weight: 600;
}

.sec04 dl dt:nth-child(2) {
  margin: calc(13* (100vw /375)) 0 calc(7* (100vw /375));
  display: flex;
  gap: 0 calc(5* (100vw /375));
  align-items: center;
}

.sec04 dl dt span {
  display: inline-block;
  letter-spacing: 0.04em;
}

.sec04 dl dd {
  font-size: calc(12* (100vw /375));
  letter-spacing: 0.075em;
  line-height: 2;
}


/************** btn **************/
.black_btn {
  margin: 0 auto calc(100* (100vw /375));
  width: calc(315* (100vw /375));
  height: calc(50* (100vw /375));
  font-size: calc(14* (100vw /375));
  max-width: 100%;
  max-height: 100%;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1;
  position: relative;
  z-index: 15;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}




/* ===============================================
### PC用デザイン###
=============================================== */
@media screen and (min-width:768px) {

  .sp_only {
    display: none;
  }

  .pc_only {
    display: block;
  }

  .main-area {
    margin-bottom: 0;
  }

  /************** js **************/
  /* .slide_box div:nth-of-type(1) {
    transition-delay: .6s;
  } */

  /************** common **************/
  /*** flex_box ***/
  .flex_box {
    display: flex;
    flex-direction: row;
    gap: 5.5rem 0;
    justify-content: space-between;
    width: 108rem;
    margin: 0 auto;
    flex-wrap: wrap;
  }

  .sec {
    padding: 0;
    width: 98rem;
  }

  .img_box {
    width: 33rem;
  }

  /*** sec_ttl ***/
  .sec .sec_ttl {
    margin-bottom: 1.8rem;
    font-size: 3rem;
  }

  .sec01 .ttl_img {
    margin: 0 auto 3.2rem;
    width: 38.8rem;
  }

  /*** sec_text ***/
  .sec_text {
    font-size: 1.4rem;
  }

  /*** sec_box ***/
  .sec_box {
    margin-bottom: 8.1rem;
  }

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

  /*** sec_tax ***/
  .sec_tax {
    margin: 3rem 0 0 0;
    display: flex;
    flex-direction: column;
    gap: .6rem 0;
  }

  .sec_tax li {
    font-size: 1.2rem;
  }

  /*** text_box ***/
  .text_box {
    padding: 3.2rem 0;
  }

  .text_box p {
    font-size: 1.6rem;
  }

/************** mv **************/
  .sec_mv {
    margin: 0 auto 8.4rem;
    width: 120rem;
  }


/************** sec01 **************/
  .sec01 {
    margin: 0 auto 15.2rem;
  }

  .sec01 h3 {
    margin-bottom: 2.0rem;
  }

  .sec01 .sub_ttl {
    margin: 0 auto 5.2rem;
    font-size: 2.2rem;
    font-weight: 600;
    letter-spacing: 0.075em;
  }

  .img01 {
    width: 60rem;
  }

  .sec01 .sec_text {
    margin: 0 auto 5.4rem;
    letter-spacing: 0.075em;
  }


/************** sec02 **************/
  .sec02 {
    padding-bottom: 15.2rem;
    position: relative;
  }

  .sec02 h3 {
    margin-bottom: 2.3rem;
  }

  .sec02 .sec_box01 {
    margin: 0 auto 6rem;
    width: 48rem;
  }

  .sec02 .sec_box01 .sub_box {
    margin: 0 auto 6rem;
    display: flex;
    flex-direction: column;
    gap: 2rem 0;
  }

  .sec02 .sec_box02 {
    margin: 0 auto;
  }

  .sec02 .sec_box02 .sub_box {
    margin: 0 auto 2rem;
    width: 98rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 0;
    overflow: hidden;
  }

  .sec02 .sec_box02 .sub_box div {
    width: 48rem;
  }

  .sec02 .img06 {
    margin: 0 auto 3.0rem;
    width: 60rem;
  }

  .sec02 .sec_box02 .text_box {
    padding: 2.2rem 0;
  }

  .sec02 .sec_box02 .text_box p {
    font-size: 1.4rem;
  }


/************** sec03 **************/
  .sec03 {
    padding-bottom: 15.9rem;
    position: relative;
  }

  .sec03 h3 {
    margin-bottom: 2.3rem;
  }

  .sec03 .sec_box01 {
    margin: 0 auto 5.9rem;
    width: 48rem;
  }

  .sec03 .sec_box01 .sub_box {
    margin: 0 auto 6em;
    display: flex;
    flex-direction: column;
    gap: 2rem 0;
  }

  .sec03 .sec_box02 {
    margin: 0 auto;
  }

  .sec03 .sec_box02 .sec_text {
    margin: 3.2rem 0 0 0;
  }

  .sec03 .sec_box02 .sub_box {
    margin: 0 auto 3rem;
    width: 98rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 0;
    overflow: hidden;
  }

  .sec03 .sec_box02 .sub_box div {
    width: 48rem;
  }

  .sec03 .img06 {
    margin: 0 auto 3.0rem;
  }

  .sec03 .sec_box02 .text_box {
    padding: 2.3rem 0;
  }

  .sec03 .sec_box02 .text_box p {
    font-size: 1.4rem;
  }

  .sec03 .sec_tax {
    margin-top: 2.8rem;
  }


/************** sec04 **************/
  .sec04 {
    margin: 0 auto 7.9rem;
    padding: 5.8rem 0 5.4rem;
    width: 100vw;
  }

  .sec04 .sec_box {
    margin: 0 auto 5.3rem;
    width: 60rem;
  }

  .sec04 .sec_box:last-child {
    margin: 0 auto;
  }

  .sec04 h4 {
    margin-bottom: 1.7rem;
    font-size: 2.0rem;
    letter-spacing: 0.1em;
  }

  .sec04 h4 p {
    padding-right: 1.2rem;
  }

  .sec04 dl dt {
    margin-bottom: .8rem;
    font-size: 1.4rem;
    letter-spacing: 0.075em;
  }

  .sec04 dl dt:nth-child(2) {
    margin: 1.3rem 0 .7rem;
    display: flex;
    gap: 0 .5rem;
    align-items: center;
  }

  .sec04 dl dt span {
    display: inline-block;
  }

  .sec04 dl dd {
    font-size: 1.2rem;
    letter-spacing: 0.075em;
    line-height: 2;
  }


  /************** btn **************/
  .black_btn {
    margin: 0 auto 8.5rem;
    width: 30rem;
    height: 5rem;
    font-size: 1.4rem;
    max-width: 100%;
    max-height: 100%;
    font-weight: 600;
    letter-spacing: 0.1em;
    line-height: 1;
  }

}


/* パンくず 追加スタイル PC */
@media only screen and (min-width: 768px) {
  .breadcrumb__list {
    padding-bottom: 1.6rem;
  }
}