@charset "utf-8";

/* overwrite
--------------------------------- */

.Column-detail .sec .flexbox {
  align-items: flex-start;
}
.Column-detail .lead {
  font-size: 1.8rem;
}

.comment {
  margin: 35px 0;
}
.comment .speaker {
  margin-bottom: 8px;
  font-weight: 600;
}
.comment .speaker.hc {
  color: #EA9C4A;
}
.comment .speaker .icon {
  display: inline-block;
  transform: translate(5px,-2px);
}
.comment .speaker.isuzu {
  color: #EC1C24;
}

/* intro
--------------------------------- */
.Column-detail .sec.intro .flexbox {
  flex-flow: row;
}
.intro h3 {
  font-size: 2.4rem;
  line-height: 1.5;
  text-align: center;
}
.intro .txtwrap {
  width: 48%;
}
.intro .txtwrap h4 {
  line-height: 2.0;
}
.intro .txtwrap h4 + p {
  margin-top: 20px;
}
.intro .photowrap {
  display: flex;
  justify-content: space-between;
}

/* sec01
--------------------------------- */
.sec01 .flex {
  display: flex;
  justify-content: space-between;
}
.sec01 .txtwrap h4 {
  margin-top: 35px;
  font-size: 1.8rem;
  line-height: 1.8;
}
.sec01 .photowrap {
  width: 49.5%;
}
.sec01 .photowrap .photo {
  width: 100%;
}
.sec01 .photowrap .photo + .txt {
  margin-top: 35px;
}

/* sec02
--------------------------------- */
.sec02 .item-wrap {
  display: flex;
  margin-top: 60px;
  padding: 40px 30px;
  background: #F6F6F6;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sec02 .item-wrap .ttl-wrap {
  width: 100%;
  text-align: center;
}
.sec02 .item-wrap .ttl-wrap + .flexbox {
  margin-top: 0;
  align-items: stretch;
}
.sec02 .item-wrap .ttl-wrap .en {
  font-size: 1.6rem;
  opacity: 0.7;
}
.sec02 .item-wrap .ttl-wrap h4 {
  font-size: 2.8rem;
}
.sec02 .item-box {
  margin-top: 30px;
  padding: 32px;
  background: #ffffff;
  filter: drop-shadow(0 10px 10px rgba(0,0,0,0.05));
}
.sec02 .item-box.flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
.sec02 .item-box.reserve {
  flex-flow: row-reverse;
}
.sec02 .item-box .txtwrap,
.sec02 .item-box .photowrap .photo {
  width: 100%;
}
.sec02 .item-box .txtwrap {
  margin-top: 20px;
}
.sec02 .item-box.flex .txtwrap {
  margin-top: 0;
}
.sec02 .item-box .txtwrap .en {
  margin-bottom: 8px;
  color: #EA9C4A;
  font-size: 2.4rem;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.05rem;
}
.sec02 .item-box .txtwrap .txt {
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: .08rem;
}

.sec02 .item-box.item01 .photowrap {
  width: 36.20%;
}
.sec02 .item-box.item01 .photowrap .photo {
  width: 100%;
}
.sec02 .item-box.item01 .txtwrap {
  width: 60.34%;
}
.sec02 .item-box.item02,
.sec02 .item-box.item03,
.sec02 .item-box.item04,
.sec02 .item-box.item05,
.sec02 .item-box.item06,
.sec02 .item-box.item07 {
  display: block;
  width: 48.5%;
}

/* sec03
--------------------------------- */
.sec03 {
  padding: 120px 0;
  background: #F6F6F6;
}
.sec03 .flexbox .txtwrap {
  width: 43.75%;
}
.sec03 .flexbox .photowrap {
  width: 53.125%;
}
.sec03 .flexbox .photowrap .photo {
  width: 100%;
}
.sec03 .item-wrap {
  margin-top: 60px;
}
.sec03 .item-wrap .item-box {
  display: flex;
  padding: 30px;
  background: #ffffff;
  justify-content: space-between;
  align-items: center;
  filter: drop-shadow(0 10px 10px rgba(0,0,0,0.05));
}
.sec03 .item-wrap .item-box.reserve {
  flex-flow: row-reverse;
}
.sec03 .item-wrap .item-box:nth-child(n+2) {
  margin-top: 40px;
}
.sec03 .item-wrap .item-box .photowrap {
  width: 43.44%;
}
.sec03 .item-wrap .item-box .txtwrap {
  width: 52.45%;
}
.sec03 .item-wrap .item-box .txtwrap .en {
  font-size: 1.8rem;
  font-weight: 300;
  line-height: 1;
  letter-spacing: .05rem;
  opacity: .7;
}
.sec03 .item-wrap .item-box .txtwrap h5 {
  font-size: 3.8rem;
  font-weight: 600;
  line-height: 1.4;
}
.sec03 .item-wrap .item-box .txtwrap .txt {
  margin-top: 8px;
  font-size: 1.4rem;
  line-height: 1.6;
}


.caption-bottom {
  max-width: 1280px;
  margin: 20px auto 0;
  padding: 10px;
  color: #898989;
  font-size: 1.2rem;
}

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

  /* sec04
  --------------------------------- */
  .sec04 .item-box.item05 .txtwrap,
  .sec04 .item-box.item05 .photowrap {
    width: 100%;
  }
  .sec04 .item-box.item05 .photowrap {
    margin-top: 30px;
  }
}

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

  .comment {
    margin: 25px 0;
  }

  /* intro
  --------------------------------- */
  .Column-detail .sec.intro .flexbox {
    display: block;
  }
  .intro h3 {
    font-size: 1.6rem;
    line-height: 1.8;
    letter-spacing: 0.05rem;
    text-align: left;
  }
  .intro .txtwrap {
    width: 100%;
  }
  .intro .txtwrap h4 {
    margin-top: 24px;
    line-height: 1.8;
  }
  .intro .txtwrap h4 + p {
    margin-top: 20px;
  }

  /* sec01
  --------------------------------- */
  .sec01 .flex {
    display: block;
  }
  .sec01 .txtwrap h4 {
    margin-top: 30px;
    font-size: 1.5rem;
  }
  .sec01 .photowrap {
    width: 100%;
  }
  .sec01 .photowrap .photo + .txt {
    margin-top: 0;
    line-height: 1.8;
  }

  /* sec02
  --------------------------------- */
  .sec02 .photo.sp {
    margin-top: 0;
    margin-bottom: 20px;
  }
  .sec02 .item-wrap {
    display: block;
    margin-top: 40px;
    padding: 7% 5%;
  }
  .sec02 .item-wrap .ttl-wrap h4 {
    font-size: 2.0rem;
  }
  .sec02 .item-box {
    margin-top: 25px;
    padding: 5%;
  }
  .sec02 .item-box.flex {
    display: block;
  }
  .sec02 .item-box .txtwrap {
    margin-top: 20px;
  }
  .sec02 .item-box.flex .txtwrap {
    margin-top: 25px;
  }
  .sec02 .item-box .txtwrap .en {
    margin-bottom: 8px;
    font-size: 2.0rem;
    font-weight: 300;
    line-height: 1;
  }
  .sec02 .item-box .txtwrap .txt {
    font-size: 1.4rem;
    letter-spacing: .08rem;
  }
  .sec02 .item-box .photo {
    margin-top: 0;
  }
  .sec02 .item-box.item01 .photowrap,
  .sec02 .item-box.item01 .photowrap .photo,
  .sec02 .item-box.item01 .txtwrap {
    width: 100%;
  }
  .sec02 .item-box.item02,
  .sec02 .item-box.item03,
  .sec02 .item-box.item04,
  .sec02 .item-box.item05,
  .sec02 .item-box.item06,
  .sec02 .item-box.item07 {
    width: 100%;
  }

  /* sec03
  --------------------------------- */
  .sec03 {
    padding: 60px 0;
  }
  .sec03 .flexbox .txtwrap,
  .sec03 .flexbox .photowrap {
    width: 100%;
  }
  .sec03 .item-wrap {
    margin-top: 40px;
  }
  .sec03 .item-wrap .item-box {
    display: block;
    padding: 5%;
  }
  .sec03 .item-wrap .item-box:nth-child(n+2) {
    margin-top: 20px;
  }
  .sec03 .item-wrap .item-box .photowrap,
  .sec03 .item-wrap .item-box .txtwrap {
    width: 100%;
  }
  .sec03 .item-wrap .item-box .txtwrap {
    margin-top: 20px;
  }
  .sec03 .item-wrap .item-box .txtwrap .en {
    font-size: 1.4rem;
  }
  .sec03 .item-wrap .item-box .txtwrap h5 {
    font-size: 2.2rem;
    letter-spacing: 0;
  }
  .sec03 .item-wrap .item-box .txtwrap .txt {
    margin-top: 8px;
    font-size: 1.4rem;
  }

  .caption-bottom {
    padding: 0 5%;
  }

}
