@charset "utf-8";

html{-webkit-text-size-adjust:100%;scroll-behavior: smooth;}
body{color: #2b2b2b; font-size:20px;font-family:yu-mincho-pr6n, "游明朝体", "Yu Mincho", YuMincho,"serif", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝","Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;line-height:1.8;font-weight: 400;}
.Hv {-moz-transition-property:all;-moz-transition-duration: 0.5s;-moz-transition-timing-function: ease;-moz-transition-delay: 0.1s;-webkit-transition-property:all;-webkit-transition-duration: 0.5s;-webkit-transition-timing-function: ease;-webkit-transition-delay: 0.1s;-o-transition-property:all;-o-transition-duration: 0.5s;-o-transition-timing-function: ease;-o-transition-delay: 0.1s;opacity:1;}
.Hv:hover {-moz-transition-property:all;-moz-transition-duration: 0.5s;-moz-transition-timing-function: ease;-moz-transition-delay: 0.1s;-webkit-transition-property:all;-webkit-transition-duration: 0.5s;-webkit-transition-timing-function: ease;-webkit-transition-delay: 0.1s;-o-transition-property:all;-o-transition-duration: 0.5s;-o-transition-timing-function: ease;-o-transition-delay: 0.1s; opacity:0.7;}
.spView {display:none;}
.fc-red, .red, .caution {color:#E34043;}
.fc-green, .green {color: #56752A;}
.fc-gold, .gold {color: #D18D07;}
.ta-c {text-align:center;}
a { text-decoration:none; color:#09689C}
a:hover { text-decoration:none;}
.u-l {text-decoration: underline;}
.spView { display: none;}
.imgFull img {width: 100%;height: auto;}
.fs-ss {font-size: 75%}
.fs-s {font-size: 87.5%}
.fs-m {font-size: 100%}
.fs-l {font-size: 150%}
.fs-xl {font-size: 200%}
.fs-xxl {font-size: 250%}
.effect-fade {opacity : 0;transform : translate(0, 60px);transition : all 1000ms;}
.effect-fade.effect-scroll {opacity : 1;transform : translate(0, 0);}
.effect-zoom {opacity : 0.1;transform : scale(1.3,1.3);;transition : all 1000ms;}
.effect-zoom.effect-scroll {opacity : 1;transform : scale(1,1);}
.bold {font-weight: 500}
.pcView {}
.spView {display: none;}

#wrapper {width: 100%;}
section {padding: 80px 0;}
img {width: 100%;height: auto; line-height: 0;}

/** common **/
.container {max-width: 1100px;}
.container.c-s {max-width: 1000px;}
.container.c-w {max-width: 1240px;}

/** cv **/
#cv {
  display: block;
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 100;
}

/** mv **/
#mv {
  padding-top: 40px;
  background: url(../img/bg-mv.png) center top no-repeat;
  background-size: cover;
}
#mv h1 {
  text-align: center;
}
#mv h1 img {
  max-width: 620px;
}
#mv h2 {
  font-size: 40px;
  line-height: 1.8;
}
#mv h2 span.fs-s {
  font-size: 32px;
}
#mv .sub {
  font-size: 32px;
}
#mv .benefit {
  margin-top: 4rem;
}

/** cta1 **/
#cta1 {
  background: #56752A;
}
#cta1 .bg-white {
  border-radius: 10px;
}
#cta1 .sub {
  font-size: 50px;
}

/** voice **/
#voice {
  background: #4A4035;
}
#voice .title {
  text-align: center;
  color: #B5A254;
  font-size: 48px;
}
#voice .line {
  display: inline-block;
  position: relative;
}
#voice .line::after {
  display: block;
  position: absolute;
  content: '';
  width: 100%;
  height: 9px;
  border-bottom: 9px solid #D18D07;
  bottom: 18px;
  opacity: 0.7;
}
#voice .voice {
  margin-top: 3rem;
}
#voice .voice .block {
  background: #fff;
  padding: 2rem;
  margin-top: 3rem;
  border-radius: 10px;
}
#voice .voice .row {
  align-items: center;
}
#voice .voice .row .name {
  font-size: 24px;
  margin-bottom: 0.5rem;
}
#voice .voice .row .name span {
  font-size: 18px;
  margin-right: 20px;
}
#voice .voice .row .comment {
  font-size: 28px;
  letter-spacing: -1.5px;
  line-height: 1.4;
}
#voice .voice .row .desc {
  font-size: 16px;
  letter-spacing: .5px;
}

/** message **/
#message {
  background: #F9F8F4;
}
#message .frame {
  display: block;
  position: relative;
  padding: 4rem 6rem 6rem;
  background: #fff;
  border: solid 1px #000;
}
#message .frame::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 16px;
  left: 16px;
  border: solid 1px #000;
}
#message .frame .title {
  text-align: center;
  font-size: 40px;
  line-height: 1.6;
  letter-spacing: 0;
  margin-bottom: 4rem;
}
#message .frame p {
  margin-bottom: 2rem;
  letter-spacing: 1.5px;
}

/** list **/
#list .title {
  text-align: center;
  font-size: 48px;
}
#list .title-lq {
  text-align: center;
  font-size: 40px;
  color: #56752A;
  margin: 2rem auto;
}
#list .title-lq::before {
  display: inline-block;
  content: "１";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #56752A;
  margin-right: 30px;
  border: 1px solid #56752A;
  border-radius: 100%;
  line-height: 2.2;
}
#list .title-bq {
  text-align: center;
  font-size: 40px;
  color: #0C2D58;
  margin: 8rem auto 2rem;
}
#list .title-bq::before {
  display: inline-block;
  content: "２";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #0C2D58;
  margin-right: 30px;
  border: 1px solid #0C2D58;
  border-radius: 100%;
  line-height: 2.2;
}
#list .title-mq {
  text-align: center;
  font-size: 40px;
  color: #A99443;
  margin: 8rem auto 2rem;
}
#list .title-mq::before {
  display: inline-block;
  content: "３";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #A99443;
  margin-right: 30px;
  border: 1px solid #A99443;
  border-radius: 100%;
  line-height: 2.2;
}
#list .row {
  margin-top: 2rem;
  align-items: center;
}
#list .row p {
  line-height: 2;
  letter-spacing: -1px;
  margin-bottom: 1.5rem;
}
#list .special {
  margin: 8rem auto 0;
  max-width: 622px;
}
#list .title-sub {
  color: #865608;
  font-size: 16px;
}
#list .title-special {
  font-size: 32px;
}

/** lq **/
#lq {
  background: #F2F4EE;
}
#lq .title {
  text-align: center;
  font-size: 48px;
}
#lq .title-lq {
  text-align: center;
  font-size: 40px;
  color: #56752A;
}
#lq .title-lq::before {
  display: inline-block;
  content: "１";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #56752A;
  margin-right: 30px;
  border: 1px solid #56752A;
  border-radius: 100%;
  line-height: 2.2;
}
#lq .row {
  margin-top: 6rem;
  align-items: center;
}
#lq .row p {
  line-height: 2;
  letter-spacing: -1px;
  margin-bottom: 1.5rem;
}
#lq .row img {
  width: initial;
  max-width: 100%;
}
#lq .row .sub {
  margin-top: 1.5rem;
  color: #56752A;
  font-size: 24px;
}
#lq .title-present {
  margin: 6rem auto 0;
  font-size: 24px;
  text-align: center;
}
#lq .title-present img {
  display: block;
  text-align: center;
  margin: 0 auto;
  width: 100%;
  max-width: 106px;
  height: auto;
}

/** bq **/
#bq {
  background: #EBEEF2;
}
#bq .title-bq {
  text-align: center;
  font-size: 40px;
  color: #0C2D58;
  margin-top: 4rem;
}
#bq .title-bq::before {
  display: inline-block;
  content: "２";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #0C2D58;
  margin-right: 30px;
  border: 1px solid #0C2D58;
  border-radius: 100%;
  line-height: 2.2;
}
#bq .row {
  margin-top: 6rem;
  align-items: center;
}
#bq .row p {
  line-height: 2;
  letter-spacing: -1px;
  margin-bottom: 1.5rem;
}
#bq .row img {
  width: initial;
  max-width: 100%;
}
#bq .row .sub {
  margin-top: 1.5rem;
  color: #0C2D58;
  font-size: 24px;
}
#bq .title-present {
  margin: 6rem auto 0;
  font-size: 24px;
  text-align: center;
}
#bq .title-present img {
  display: block;
  text-align: center;
  margin: 0 auto;
  width: 100%;
  max-width: 106px;
  height: auto;
}

/** mq **/
#mq {
  background: #F8F7F0;
}
#mq .title-mq {
  text-align: center;
  font-size: 40px;
  color: #A99443;
  margin-top: 4rem;
}
#mq .title-mq::before {
  display: inline-block;
  content: "３";
  font-size: 32px;
  width: 72px;
  height: 72px;
  color: #A99443;
  margin-right: 30px;
  border: 1px solid #A99443;
  border-radius: 100%;
  line-height: 2.2;
}
#mq .row {
  margin-top: 6rem;
  align-items: center;
}
#mq .row p {
  line-height: 2;
  letter-spacing: -1px;
  margin-bottom: 1.5rem;
}
#mq .row img {
  width: initial;
  max-width: 100%;
}
#mq .row .sub {
  margin-top: 1.5rem;
  color: #A99443;
  font-size: 24px;
}
#mq .title-present {
  margin: 6rem auto 0;
  font-size: 24px;
  text-align: center;
}
#mq .title-present img {
  display: block;
  text-align: center;
  margin: 0 auto;
  width: 100%;
  max-width: 106px;
  height: auto;
}

/** normal **/
#normal .title {
  text-align: center;
  font-size: 48px;
}
#normal .row {
  margin-top: 4rem;
  align-items: center;
}
#normal .row p {
  line-height: 2;
  letter-spacing: -1px;
  margin-bottom: 1.5rem;
}
#normal .row img {
  width: initial;
  max-width: 100%;
}

/** offer **/
#offer {
  background: #F9F8F4;
}
#offer .frame {
  display: block;
  position: relative;
  padding: 4rem 6rem 6rem;
  background: #fff;
  border: solid 1px #000;
}
#offer .frame::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 16px;
  left: 16px;
  border: solid 1px #000;
}
#offer .frame .title {
  text-align: center;
  font-size: 40px;
  line-height: 1.6;
  letter-spacing: 0;
  margin-bottom: 4rem;
}
#offer .frame p {
  margin-bottom: 2rem;
  letter-spacing: 1.5px;
}
#offer .frame .line {
  display: inline-block;
  position: relative;
  font-size: 28px;
  background:linear-gradient(transparent 60%, #F6E8CD 60%);
}

/** cta2 **/
/*#cta2 {
  background: url(../img/bg-cta.png) center top no-repeat;
  background-size: contain;
}
#cta2 .frame {
  background: url(../img/bg-btn.png) center top no-repeat;
  width: 100%;
}*/

/** cta2 **/
#cta2 {
  background: #56752A;
}
#cta2 .bg-white {
  border-radius: 10px;
}
#cta2 .sub {
  font-size: 50px;
}

/** footer **/
footer {background:#fff; color: #5B5B5B; font-size:14px;text-align:center;line-height:1.6;padding: 15px 0}
footer a {color:#5B5B5B;border-right: 1px solid #dedede;padding: 0 10px;}
footer a:last-child {border: none;}

/*****
≧1200px（lg）
*****/
@media (max-width: 1199.98px) {
  /** common **/
  .container {max-width: 1100px;}
  .container.c-s {max-width: 1000px;}
  .container.c-w {max-width: 1240px;}
}

/*****
≧992px（md）
*****/
@media (max-width: 991.98px) {
  #message .frame {
    padding: 4rem 3rem 6rem;
  }
  #offer .frame {
    padding: 4rem 3rem 6rem;
  }
}

/*****
≧768px（sm）
*****/
@media (max-width: 767.98px) {
  .pcView {display: none;}
  .spView {display: inherit;}
  body{font-size:16px;}
  section {padding: 40px 0;}

  /** cv **/
  #cv {
    right: 6px;
    bottom: 10px;
  }

  /** mv **/
  #mv h2 {
    font-size: 20px;
  }
  #mv h2 span.fs-s {
  font-size: 16px;
}
  #mv .sub {
    font-size: 16px;
  }

  /** cta1 **/
  #cta1 .bg-white .title {
    font-size: 20px;
  }
  #cta1 .bg-white .sub {
    font-size: 28px;
  }
  #cta1 .bg-white .btn-img {
    padding: 0;
  }

  /** voice **/
  #voice .title {
    font-size: 24px;
  }
  #voice .line::after {
    bottom: 6px;
  }
  #voice .voice {
    margin-top: 2rem;
  }
  #voice .voice .block {
    margin-top: 2rem;
  }
  #voice .voice .row .name {
    text-align: center;
    margin-top: 1rem;
  }
  #voice .voice .row .name span {
    display: block;
    margin: 0 auto;
  }
  #voice .voice .row .comment {
    margin-top: 1rem;
    text-align: center;
    font-size: 20px;
    letter-spacing: -.5px;
    line-height: 1.6;
  }

  /** message **/
  #message .frame .title {
    font-size: 24px;
    margin-bottom: 3rem;
  }
  #message .frame {
    padding: 4rem 1rem 2rem 2rem;
    margin-right: 15px;
  }
  #message .frame p {
    letter-spacing: 0;
  }

  /** list **/
  #list .row {
    margin-top: 1rem;
  }
  #list .title {
    font-size: 24px;
  }
  #list .title-lq {
    font-size: 20px;
    margin: 1rem auto;
  }
  #list .title-lq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #list .title-bq {
    font-size: 20px;
    margin: 2rem auto 1rem;
  }
  #list .title-bq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #list .title-mq {
    font-size: 20px;
    margin: 2rem auto 1rem;
  }
  #list .title-mq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #list .special {
    margin: 2rem auto 0;
  }
  #list .title-special {
    font-size: 18px;
  }

  /** lq **/
  #lq .title {
    font-size: 24px;
  }
  #lq .title-lq {
    font-size: 20px;
    margin: 1rem auto;
  }
  #lq .title-lq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #lq .row {
    margin-top: 1rem;
  }
  #lq .row .sub {
    font-size: 18px;
    margin-bottom: 0;
  }
  #lq .title-present {
    margin-top: 2rem;
    font-size: 20px;
  }

  /** bq **/
  #bq .title-bq {
    font-size: 20px;
    margin: 2rem auto 1rem;
  }
  #bq .title-bq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #bq .row {
    margin-top: 1rem;
  }
  #bq .row .sub {
    font-size: 18px;
    margin-bottom: 0;
  }
  #bq .title-present {
    margin-top: 2rem;
    font-size: 20px;
  }

  /** mq **/
  #mq .title-mq {
    font-size: 20px;
    margin: 2rem auto 1rem;
  }
  #mq .title-mq::before {
    font-size: 18px;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    line-height: 1.6;
  }
  #mq .row {
    margin-top: 1rem;
  }
  #mq .row .sub {
    font-size: 18px;
    margin-bottom: 0;
  }
  #mq .title-present {
    margin-top: 2rem;
    font-size: 20px;
  }

  /** normal **/
  #normal .title {
    font-size: 24px;
  }
  #normal .row {
    margin-top: 1rem;
  }

  /** offer **/
  #offer .frame {
    padding: 4rem 1rem 2rem 2rem;
  }
  #offer .frame .title {
    font-size: 24px;
    margin-bottom: 3rem;
  }
  #offer .frame {
    margin-right: 15px;
  }
  #offer .frame p {
    letter-spacing: 0;
  }
  #offer .frame p.fs-l, #offer .frame p .fs-l {
    font-size: 18px;
    font-weight: bold;
  }
  #offer .frame .line {
    font-size: 20px;
  }

  /** cta2 **/
  #cta2 .bg-white .title {
    font-size: 20px;
  }
  #cta2 .bg-white .sub {
    font-size: 28px;
  }
  #cta2 .bg-white .btn-img {
    padding: 0;
  }

  .f-nav {
    font-size: 12px;
  }
}

/*****
≧576px（xs）
*****/
@media (max-width: 575.98px) {

}