@charset "utf-8";

.main-image img {
  width: 100%;
}

.home-trouble {
  background: right url(../images/trouble_pc.webp) no-repeat;
}

.home-comparison {
  position: relative;
  padding-top: 1px;
}

.comparison-intro {
  margin-top: -2vw;
}

.comparison-intro img {
  width: 100%;
}

.home-comparison-list > li {
  background-repeat: no-repeat, no-repeat;
  background-position: top, bottom;
  background-image: url(../images/Invisalign_frame_top.png), url(../images/Invisalign_frame_bottom.png);
  background-size: 100% auto, 100% auto;
}

.home-feature-1 {
  position: relative;
  padding-top: 1px;
  background: url(../images/bg_Invisalign.png);
}

.invisalign-title {
  margin-top: -7vw;
  text-align: center;
}

.home-feature-1-list > li {
  margin-bottom: 80px;
}

.home-feature-1-list > li:last-child {
  margin-bottom: 0;
}

.home-feature-1-list > li h4 {
  margin-bottom: 20px;
  padding-top: 24px;
  padding-bottom: 12px;
  padding-left: 80px;
  color: #483100;
  font-size: 44px;
  font-weight: 400;
  font-family: 'Noto Serif JP', serif;
  background: top left no-repeat;
}

.home-feature-1-list > li:nth-child(1) h4 { background-image: url(../images/Invisalign_1.png); }
.home-feature-1-list > li:nth-child(2) h4 { background-image: url(../images/Invisalign_2.png); }
.home-feature-1-list > li:nth-child(3) h4 { background-image: url(../images/Invisalign_3.png); }
.home-feature-1-list > li:nth-child(4) h4 { background-image: url(../images/Invisalign_4.png); }
.home-feature-1-list > li:nth-child(5) h4 { background-image: url(../images/Invisalign_5.png); }

.home-feature-2 {
  background: url(../images/bg_feature.png);
}

.home-feature-2-list > li {
  position: relative;
  margin-bottom: 70px;
  padding: 100px 80px 70px 80px;
  background: #FDF6EA url(../images/feature_frame_body.png) repeat-y;
  background-size: 100% auto;
}

.home-feature-2-list > li:last-child {
  margin-bottom: 0;
}

.home-feature-2-list > li:before {
  content: '';
  position: absolute;
  top: -8px;
  left: 0;
  display: block;
  width: 100%;
  height: 178px;
  background:  no-repeat;
  background-size: 100% auto;
  z-index: 1;
}

.home-feature-2-list > li:nth-child(1):before { background-image: url(../images/feature_frame_top_1.png); }
.home-feature-2-list > li:nth-child(2):before { background-image: url(../images/feature_frame_top_2.png); }
.home-feature-2-list > li:nth-child(3):before { background-image: url(../images/feature_frame_top_3.png); }
.home-feature-2-list > li:nth-child(4):before { background-image: url(../images/feature_frame_top_4.png); }
.home-feature-2-list > li:nth-child(5):before { background-image: url(../images/feature_frame_top_5.png); }

.home-feature-2-list > li:after {
  content: '';
  position: absolute;
  bottom: -20px;
  left: 0;
  display: block;
  width: 100%;
  height: 140px;
  background: bottom url(../images/feature_frame_bottom.png) no-repeat;
  background-size: 100% auto;
  z-index: 1;
}

.home-feature-2-list > li .list-inner {
  position: relative;
  z-index: 2;
}

.home-feature-point-list > li {
  padding-top: 90px;
  width: 320px;
  height: 335px;
  background: no-repeat;
  background-size: 100% 100%;
}

.home-feature-point-list > li:nth-child(1) { background-image: url(../images/feature_point_1.png); }
.home-feature-point-list > li:nth-child(2) { background-image: url(../images/feature_point_2.png); }
.home-feature-point-list > li:nth-child(3) { background-image: url(../images/feature_point_3.png); }

.home-feature-point-list > li .text {
  margin-right: auto;
  margin-left: auto;
  width: 220px;
}

.home-flow-list > li {
  position: relative;
  margin-bottom: 134px;
}

.home-flow-list > li:last-child {
  margin-bottom: 0;
}

.home-flow-list > li:after {
  content: '';
  position: absolute;
  bottom: -90px;
  left: 50%;
  margin-left: -155px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 44px 155px 0 155px;
  border-color: #a19255 transparent transparent transparent;
}

.home-flow-list > li:last-child:after {
  display: none;
}

.home-flow-list > li .box-fill {
  padding-left: 250px;
  min-height: 210px;
  background-repeat: no-repeat;
  background-position: top 25px left 30px;
}

.home-flow-list > li:nth-child(1) .box-fill { background-image: url(../images/flow_step_1.png); }
.home-flow-list > li:nth-child(2) .box-fill { background-image: url(../images/flow_step_2.png); }
.home-flow-list > li:nth-child(3) .box-fill { background-image: url(../images/flow_step_3.png); }
.home-flow-list > li:nth-child(4) .box-fill { background-image: url(../images/flow_step_4.png); }
.home-flow-list > li:nth-child(5) .box-fill { background-image: url(../images/flow_step_5.png); }
.home-flow-list > li:nth-child(6) .box-fill { background-image: url(../images/flow_step_6.png); }

.home-faq-list > li {
  margin-bottom: 50px;
  padding: 40px;
  background: #fff;
}

.home-faq-list > li:last-child {
  margin-bottom: 0;
}

.home-faq-list > li .faq-q {
  margin-bottom: 50px;
  padding-left: 60px;
  min-height: 34px;
  background: top 0 left 0 url(../images/qa_q.png) no-repeat;
}

.home-faq-list > li .faq-a {
  padding-left: 60px;
  min-height: 34px;
  background: top 0 left 0 url(../images/qa_a.png) no-repeat;
}

.home-profile-pic img {
  width: 46%;
  max-width: 350px;
}