#fv {
   background: url("../img/index/fv-bg.jpg") no-repeat center top/cover;
   /* position: relative; */
}

#fv:before {
   content: '';
   width: 100%;
   height: 50px;
   background-color: #fff;
   position: absolute;
   bottom: 0;
   left: 0;
}


@media screen and (min-width: 1024px) {
   #fv {
      background-position: center;
   }
}

@media screen and (max-width: 767px) {
   #fv {
      background: transparent;
   }

   #fv:before {
      display: none;
   }
}

/* -- -- */
#lead {
   padding: 40px 0 80px;
}

#lead .slider .slick-list {
   margin: 0 -9px;
}

#lead .slider figure {
   margin: 0 9px;
}

#lead .button-cta {
   padding-top: 20px;
}

#lead .log-grid {
   display: grid;
   column-gap: 10px;
   grid-template-columns: repeat(5, 1fr);
}

@media screen and (max-width: 767px) {
   #lead {
      padding: 30px 0 60px;
   }

   #lead .slider .slick-list {
      margin: 0 -5px;
   }

   #lead .slider figure {
      margin: 0 5px;
   }

   #lead .button-cta {
      padding-top: 30px;
   }
}

/* -- -- */
#sec0 {
   background-color: #fff;
   padding: 20px 0 80px;
}

@media screen and (max-width: 991px) {
   #sec0{
      padding-bottom: 60px;
   }
}

/* -- -- */
#sec1 {
   background-color: #f6f7fb;
   padding: 80px 0;
}

#sec1 .box {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 10px;
   padding-top: 40px;
}

#sec1 .box .col {
   background-color: #fff;
   border: 2px solid #e3e4e8;
   border-radius: 20px;
   padding: 20px 20px;
}

#sec1 .box h3 {
   font-weight: 700;
   font-size: 18px;
   letter-spacing: 0.05em;
   line-height: 30px;
}

#sec1 .box figure {
   padding-top: 15px;
}

#sec1 .box .txt {
   font-size: 13px;
   padding-top: 15px;
}

#sec1 .button-cta {
   padding-top: 40px;
}

@media screen and (max-width: 991px) {
   #sec1 .box .col {
      padding: 20px 10px;
   }

   #sec1 .box .txt {
      font-size: 11px;
   }
}

@media screen and (max-width: 767px) {
   #sec1 {
      padding: 60px 0;
   }

   #sec1 .box {
      grid-template-columns: 1fr;
      gap: 20px;
      padding-top: 30px;
   }

   #sec1 .box .col {
      padding: 30px;
   }

   #sec1 .box .txt {
      font-size: 12px;
   }

   #sec1 .button-cta {
      padding-top: 40px;
   }
}

/* -- -- */
#sec2 {
   padding: 80px 0;
}

#sec2 figure {
   padding-top: 40px;
}

#sec2 .txt {
   max-width: 690px;
   margin: 0 auto;
   padding-top: 40px;
}

#sec2 .note {
   padding-right: 1rem;
   text-align: right;
   margin: 0 auto;
   max-width: 500px;
}

#sec2 .note p {
   display: inline-block;
   font-size: 0.8rem;
}

@media screen and (max-width: 767px) {
   #sec2 {
      padding: 60px 0;
   }

   #sec2 figure {
      padding-top: 30px;
   }

   #sec2 .txt {
      padding-top: 20px;
   }

   #sec2 .note p {
      font-size: 0.6rem;
   }
}

/* -- -- */
#sec3 {
   background: url("../img/index/sec3-bg.jpg") no-repeat center/cover;
   padding: 80px 0 0;
}

#sec3 .txt {
   font-size: 16px;
   max-width: 630px;
   margin: 0 auto;
   padding-top: 30px;
}

#sec3 figure {
   padding-top: 15px;
}

@media screen and (max-width: 767px) {
   #sec3 {
      padding: 60px 0 0;
   }

   #sec3 .txt {
      font-size: 12px;
      padding-top: 20px;
   }
}

/* -- -- */
#sec4 {
   padding: 80px 0;
}

#sec4 .box {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 60px;
   padding-top: 40px;
}

#sec4 .box .col dl {
   display: grid;
   grid-template-columns: 70px auto;
   gap: 10px;
   font-weight: 600;
}

#sec4 .box .col dl+dl {
   padding-top: 6px;
}

#sec4 .box .col dl dt {
   background-color: #f39800;
   color: #fff;
   text-align: center;
}

#sec4 .box .col dl dd {
   font-size: 16px;
}

#sec4 .photo {
   padding-top: 40px;
}

#sec4 .check {
   display: flex;
   justify-content: center;
   max-width: 600px;
   background-color: #fff9ee;
   margin: 40px auto 0;
   padding: 30px 0;
}

#sec4 .check ul {
   font-size: 18px;
   line-height: 38px;
}

#sec4 .check ul li {
   background: url("../img/index/icon-check.png") no-repeat center left/30px auto;
   padding-left: 40px;
}

#sec4 .check ul li+li {
   margin-top: 5px;
}

#sec4 .check ul li span {
   font-size: 20px;
}

#sec4 .note {
   text-align: center;
}

@media screen and (max-width: 767px) {
   #sec4 {
      padding: 60px 0;
   }

   #sec4 .box {
      gap: 36px;
      padding-top: 30px;
   }

   #sec4 .box figure {
      width: 50px;
   }

   #sec4 .box .col dl {
      grid-template-columns: 45px 1fr;
      gap: 10px;
      line-height: 18px;
   }

   #sec4 .box .col dl dt {
      font-size: 9px;
   }

   #sec4 .box .col dl dd {
      font-size: 12px;
   }

   #sec4 .photo {
      padding-top: 20px;
   }

   #sec4 .check {
      margin-top: 20px;
      padding: 15px 0px;
   }

   #sec4 .check ul {
      font-size: 13px;
      line-height: 27px;
   }

   #sec4 .check ul li {
      background-size: 19px auto;
      padding-left: 24px;
   }

   #sec4 .check ul li span {
      font-size: 16px;
   }

   #sec4 .note {
      text-align: left;
   }
}

/* -- -- */
#sec5 {
   background-color: #f6f7fb;
   padding: 80px 0;
}

#sec5 .wrap {
   max-width: 1000px;
   overflow: hidden;
}

#sec5 .slider {
   width: 331px;
   margin: 0 auto;
   padding-top: 60px;
}

#sec5 .slider .slick-list {
   overflow: visible;
}

#sec5 .slider .slide-item {
   background-color: #fff;
   box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.2);
   border-radius: 10px;
   overflow: hidden;
   transform: scale(0.8);
   transition: all 0.5s;
}

#sec5 .slider .slide-item figure {
   background-color: #000;
}

#sec5 .slider .slide-item figure img {
   width: 100%;
   max-width: inherit;
   opacity: 0.5;
   transition: all 0.3s;
}

#sec5 .slider .slide-item .price {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 20px;
   padding: 10px 0;
   line-height: 24px;
}

#sec5 .slider .slide-item .price dl {
   display: grid;
   grid-template-columns: 50px auto;
   gap: 5px;
}

#sec5 .slider .slide-item .price dl dt {
   background-color: #f39800;
   color: #fff;
   text-align: center;
}

#sec5 .slider .slide-item .price dl dd {
   font-weight: 700;
}

#sec5 .slider .slide-item .price dl dd span {
   font-size: 22px;
}

#sec5 .slider .slide-item.slick-active {
   transform: scale(1);
}

#sec5 .slider .slide-item.slick-active figure img {
   opacity: 1;
}

#sec5 .slider .slick-dots {
   padding-top: 45px;
}

@media screen and (max-width: 767px) {
   #sec5 {
      padding: 60px 0;
   }

   #sec5 .slider {
      width: 225px;
      padding-top: 30px;
   }

   #sec5 .slider .slide-item .price {
      gap: 10px;
      font-size: 10px;
      line-height: 16px;
   }

   #sec5 .slider .slide-item .price dl {
      grid-template-columns: 35px 1fr;
   }

   #sec5 .slider .slide-item .price dl dd span {
      font-size: 15px;
   }

   #sec5 .slider .slick-dots {
      padding-top: 20px;
   }
}

/* -- -- */
#sec6 {
   padding: 80px 0;
}

#sec6 .box {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 20px;
   padding-top: 40px;
   grid-template-areas: "info-1 info-2" "note-1 note-2";
}

#sec6 .box .col {
   background-color: #fff;
   box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
   padding: 40px 30px;
}

#sec6 .box .info {
   display: grid;
   grid-template-columns: 143px 1fr;
   gap: 20px;
}

#sec6 .box .info-1 {
   grid-area: info-1
}

#sec6 .box .info-2 {
   grid-area: info-2
}

#sec6 .box .note-1 {
   grid-area: note-1
}

#sec6 .box .note-2 {
   grid-area: note-2
}

#sec6 .box .info .prof {
   line-height: 24px;
}

#sec6 .box .info .prof dl {
   display: grid;
   grid-template-columns: 64px 1fr;
   gap: 10px;
}

#sec6 .box .info .prof dl+dl {
   padding-top: 6px;
}

#sec6 .box .info .prof dl dt {
   background-color: #f39800;
   color: #fff;
   font-weight: 600;
   font-size: 13px;
   text-align: center;
}

#sec6 .box .info .prof dl dd {
   font-size: 18px;
}

#sec6 .box .info .prof dl:last-child {
   padding-top: 14px;
}

#sec6 .box .info .prof dl:last-child dt {
   background-color: #ea5413;
}

#sec6 .box .info .prof dl:last-child dd {
   font-weight: 600;
}

#sec6 .box .txt {
   font-size: 16px;
   padding-top: 30px;
}

#sec6 .note {
   line-height: 1.2;
}

#sec6 .note-pt {
   padding-top: 10px;
}

@media screen and (max-width: 991px) {
   #sec6 .box {
      grid-template-columns: 1fr;
      grid-template-areas: "info-1" "note-1" "info-2" "note-2";
   }
}

@media screen and (max-width: 767px) {
   #sec6 {
      padding: 60px 0;
   }

   #sec6 .box {
      padding-top: 30px;
      gap: 0;
   }

   #sec6 .box .col {
      padding: 30px 20px;
   }
   
   #sec6 .box .sp-mt {
      margin-top: 20px;
   }

   #sec6 .box .info {
      grid-template-columns: 100px 1fr;
      gap: 15px;
   }

   #sec6 .box .info .prof {
      line-height: 17px;
   }

   #sec6 .box .info .prof dl {
      grid-template-columns: 45px 1fr;
   }

   #sec6 .box .info .prof dl+dl {
      padding-top: 5px;
   }

   #sec6 .box .info .prof dl dt {
      font-size: 10px;
   }

   #sec6 .box .info .prof dl dd {
      font-size: 13px;
   }

   #sec6 .box .info .prof dl:last-child {
      padding-top: 10px;
   }

   #sec6 .box .txt {
      font-size: 12px;
      padding-top: 20px;
   }

   #sec6 .note {
      padding-top: 5px;
      line-height: 1.2;
   }
}

/* -- -- */
#sec7 {
   background-color: #f6f7fb;
   padding: 80px 0;
}

#sec7 .box {
   max-width: 560px;
   margin: 0 auto;
   padding-top: 40px;
}

#sec7 .box dl {
   display: grid;
   grid-template-columns: 176px 1fr;
   justify-content: center;
   align-items: center;
   gap: 20px;
   position: relative;
}

#sec7 .box dl+dl {
   padding-top: 35px;
}

#sec7 .box dl+dl:before {
   content: '';
   border-left: 5px solid #ffcf7f;
   position: absolute;
   top: 0px;
   bottom: 10px;
   left: 105px;
}

#sec7 .box dl dd {
   padding-top: 30px;
}

#sec7 .box h3 {
   font-weight: 700;
   font-size: 20px;
   letter-spacing: 0.05em;
}

#sec7 .box .txt {
   padding-top: 10px;
}

@media screen and (max-width: 767px) {
   #sec7 {
      padding: 60px 0;
   }

   #sec7 .box {
      padding-top: 30px;
   }

   #sec7 .box dl {
      grid-template-columns: 90px 1fr;
      gap: 15px;
   }

   #sec7 .box dl+dl:before {
      border-left-width: 2px;
      left: 54px;
      bottom: 0;
   }

   #sec7 .box dl:last-child:before {
      bottom: 10px;
   }

   #sec7 .box dl dd {
      padding-top: 0;
   }

   #sec7 .box dl dd h3 {
      font-size: 14px;
   }

   #sec7 .box dl dd .txt {
      padding-top: 0;
   }
}

/* -- -- */
#sec8 {
   padding: 80px 0;
}

#sec8 .box {
   width: 600px;
   margin: 0 auto;
   padding-top: 40px;
}

#sec8 .box dl {
   background-color: #fff9ee;
   padding: 30px 30px;
   font-size: 18px;
}

#sec8 .box dl+dl {
   margin-top: 30px;
}

#sec8 .box dl dt,
#sec8 .box dl dd {
   display: flex;
   align-items: center;
   min-height: 44px;
   position: relative;
   padding-left: 52px;
}

#sec8 .box dl dt:before,
#sec8 .box dl dd:before {
   content: '';
   display: block;
   width: 40px;
   height: 44px;
   position: absolute;
   top: 0;
   left: 0;
}

#sec8 .box dl dt {
   font-weight: 700;
}

#sec8 .box dl dt:before {
   background: url("../img/index/icon-q.png") no-repeat center/cover;
}

#sec8 .box dl dd {
   margin-top: 20px;
}

#sec8 .box dl dd:before {
   background: url("../img/index/icon-a.png") no-repeat center/cover;
}

#sec8 .button-cta {
   padding-top: 40px;
}

@media screen and (max-width: 767px) {
   #sec8 {
      padding: 60px 0;
   }

   #sec8 .box {
      width: 100%;
      padding-top: 30px;
   }

   #sec8 .box dl {
      font-size: 12px;
      line-height: 15px;
      padding: 15px;
   }

   #sec8 .box dl+dl {
      margin-top: 25px;
   }

   #sec8 .box dl dt,
   #sec8 .box dl dd {
      min-height: 31px;
      padding-left: 38px;
   }

   #sec8 .box dl dt:before,
   #sec8 .box dl dd:before {
      width: 28px;
      height: 31px;
   }

   #sec8 .box dl dt {
      font-size: 13px;
   }

   #sec8 .box dl dd {
      margin-top: 10px;
   }

   #sec8 .button-cta {
      padding-top: 40px;
   }
}