@charset "UTF-8";
/* gaiheki
---------------------------------------------------- */
.gaiheki_kv img {
  width: 100%;
  height: auto;
}

.gaiheki_lead {
  background: url(../images/common/bg1.webp) no-repeat center top;
  background-size: cover;
  padding: 53px 20px 49px;
}
.gaiheki_lead_container {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.gaiheki_lead_container:has(:not(.gaiheki_lead)) {
  justify-content: center;
}
.gaiheki_lead_img {
  width: min(37.14vw, 520px);
}
.gaiheki_lead_txt {
  width: min(62.85vw, 880px);
  margin: 0 10px;
}
.gaiheki_lead_txt p {
  font-size: 16px;
  line-height: 2;
}

@media screen and (max-width: 750px) {
  .gaiheki_lead {
    padding: 8vw 5.33vw;
  }
  .gaiheki_lead_container {
    display: block;
  }
  .gaiheki_lead_container:has(:not(.gaiheki_lead_txt)) div:has(img) {
    text-align: center;
    margin: 20px 0;
  }
  .gaiheki_lead_img {
    width: auto;
    text-align: center;
  }
  .gaiheki_lead_img img {
    width: 85vw;
    height: auto;
  }
  .gaiheki_lead_txt {
    width: auto;
  }
  .gaiheki_lead_txt p {
    font-size: 3.73vw;
    line-height: 1.9;
    margin-top: 7vw;
  }
}
/* timing
---------------------------------------------------- */
.timing {
  background: url(../images/common/bg2.webp) no-repeat center bottom;
  background-size: cover;
  padding: 45px 20px 70px;
}
.timing_container {
  max-width: 1400px;
  margin: 0 auto;
}
.timing_container ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  gap: min(3.5vw, 49px);
  padding: 47px min(0.71vw, 10px) 0;
}
.timing_container ul li {
  display: block;
  box-sizing: border-box;
  width: min(30.5vw, 427px);
  height: min(29.35vw, 411px);
  background: url(../images/gaiheki/timing_item_bg.webp) no-repeat left top;
  background-size: cover;
  padding: min(2.35vw, 33px) min(2.35vw, 33px) 0;
}
.timing_container ul li:nth-child(1) {
  box-shadow: 11px 11px 0px 0px rgb(255, 183, 52);
}
.timing_container ul li:nth-child(1) h3 {
  color: #fa7c00;
}
.timing_container ul li:nth-child(2) {
  box-shadow: 11px 11px 0px 0px rgb(231, 93, 161);
}
.timing_container ul li:nth-child(2) h3 {
  color: #da267f;
}
.timing_container ul li:nth-child(3) {
  box-shadow: 11px 11px 0px 0px rgb(0, 154, 208);
}
.timing_container ul li:nth-child(3) h3 {
  color: #0089b9;
}
.timing_container ul li:nth-child(4) {
  box-shadow: 11px 11px 0px 0px rgb(255, 154, 152);
}
.timing_container ul li:nth-child(4) h3 {
  color: #e24845;
}
.timing_container ul li:nth-child(5) {
  box-shadow: 11px 11px 0px 0px rgb(57, 164, 72);
}
.timing_container ul li:nth-child(5) h3 {
  color: #1c862b;
}
.timing_container ul li:nth-child(6) {
  box-shadow: 11px 11px 0px 0px rgb(164, 117, 71);
}
.timing_container ul li:nth-child(6) h3 {
  color: #975718;
}
.timing_container ul li h3 {
  text-align: center;
  font-weight: 700;
  line-height: 1;
  font-size: min(1.85vw, 26px);
  margin-bottom: min(1.21vw, 17px);
}
.timing_container ul li .p1 {
  font-weight: 600;
  text-align: center;
  font-size: min(1.57vw, 22px);
  margin: min(1.07vw, 15px) 0;
  line-height: 1;
}
.timing_container ul li .p1 img {
  vertical-align: middle;
  margin: max(-0.42vw, -6px) 0 0 min(0.21vw, 3px);
}
.timing_container ul li .p2 {
  font-size: min(1.07vw, 15px);
  line-height: 1.7;
}
.timing_title {
  display: flex;
  align-items: center;
}
.timing_title h2 {
  width: min(37.14vw, 520px);
  text-align: center;
}
.timing_title div {
  width: min(62.85vw, 880px);
  font-size: 16px;
  line-height: 2.2;
  margin-top: 3px;
  color: #fff;
}

@media screen and (max-width: 750px) {
  .timing {
    padding: 8vw 5.33vw 12vw;
  }
  .timing_container ul {
    display: block;
    padding: 0;
  }
  .timing_container ul li {
    width: auto;
    height: auto;
    background: url(../images/common/bg1.webp) no-repeat left top;
    background-size: cover;
    padding: 5.33vw;
    margin-top: 8vw;
  }
  .timing_container ul li:nth-child(1) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(255, 183, 52);
  }
  .timing_container ul li:nth-child(2) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(231, 93, 161);
  }
  .timing_container ul li:nth-child(3) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(0, 154, 208);
  }
  .timing_container ul li:nth-child(4) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(255, 154, 152);
  }
  .timing_container ul li:nth-child(5) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(57, 164, 72);
  }
  .timing_container ul li:nth-child(6) {
    box-shadow: 2.13vw 2.13vw 0px 0px rgb(164, 117, 71);
  }
  .timing_container ul li > img {
    width: 100%;
    height: auto;
  }
  .timing_container ul li h3 {
    font-size: 5.33vw;
    margin-bottom: 4vw;
  }
  .timing_container ul li .p1 {
    font-size: 4.8vw;
    margin: 2.66vw 0;
  }
  .timing_container ul li .p1 img {
    width: 5.33vw;
    height: auto;
    margin: -1vw 0 0 1vw;
  }
  .timing_container ul li .p2 {
    font-size: 3.73vw;
    line-height: 1.8;
  }
  .timing_title {
    display: block;
  }
  .timing_title h2 {
    width: auto;
  }
  .timing_title h2 img {
    width: 80vw;
    height: auto;
  }
  .timing_title div {
    width: auto;
    font-size: 3.73vw;
    line-height: 1.9;
    margin-top: 5.33vw;
  }
}
/* flow
---------------------------------------------------- */
.flow {
  background: url(../images/common/bg1.webp) no-repeat center top;
  background-size: cover;
  padding: 50px 0 70px;
}
.flow_container {
  max-width: 1400px;
  margin: 0 auto;
}
.flow_container h2 {
  font-weight: 600;
  text-align: center;
  font-size: 43px;
  line-height: 1;
  background: url(../images/gaiheki/flow_title_line.webp) no-repeat center bottom;
  padding: 0 0 13px;
}
.flow_container > p {
  text-align: center;
  line-height: 1.8;
  margin: 25px 0 35px;
}
.flow_container ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.flow_container ol li {
  display: block;
  width: min(22.28vw, 312px);
  position: relative;
}
.flow_container ol li::before {
  display: block;
  content: "";
  width: min(1.42vw, 20px);
  height: min(1.42vw, 20px);
  background: url(../images/gaiheki/flow_ar.webp) no-repeat left top;
  background-size: contain;
  position: absolute;
  left: max(-2.5vw, -35px);
  top: min(8.92vw, 125px);
}
.flow_container ol li:nth-child(5), .flow_container ol li:nth-child(6), .flow_container ol li:nth-child(7), .flow_container ol li:nth-child(8), .flow_container ol li:nth-child(9) {
  width: min(17.57vw, 246px);
  margin-top: 40px;
}
.flow_container ol li:nth-child(5)::before, .flow_container ol li:nth-child(6)::before, .flow_container ol li:nth-child(7)::before, .flow_container ol li:nth-child(8)::before, .flow_container ol li:nth-child(9)::before {
  left: max(-2.28vw, -32px);
  top: min(7.14vw, 100px);
}
.flow_container ol li:nth-child(1)::before, .flow_container ol li:nth-child(5)::before {
  display: none;
  content: none;
}
.flow_container ol li .flow_number {
  position: absolute;
  left: -13px;
  top: -11px;
}
.flow_container ol li .flow_image {
  width: 100%;
  height: auto;
}
.flow_container ol li div {
  text-align: center;
  font-size: 19px;
  font-weight: 600;
  margin: 7px 0 0;
  line-height: 1.4;
}
.flow .paint_container {
  max-width: 1200px;
  margin: 60px auto 0;
  padding: 0 20px;
}
.flow .paint_container h2 {
  font-weight: 600;
  text-align: center;
  font-size: 43px;
  line-height: 1;
  background: url(../images/gaiheki/paint_title_line.webp) no-repeat center bottom;
  padding: 0 0 13px;
}
.flow .paint_container > p {
  text-align: center;
  line-height: 1.8;
  margin: 25px 0 35px;
}
.flow .paint_container .paint_btn a {
  display: block;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
  border-radius: 50px;
  width: 404px;
  height: 54px;
  box-sizing: border-box;
  border: 3px solid #c8ad4e;
  line-height: 46px;
  font-size: 18px;
  font-weight: 600;
  color: #b99945;
}
.flow .paint_container .paint_btn a::before {
  display: inline-block;
  content: "";
  background: url(../images/common/ar3.webp) no-repeat left top;
  background-size: contain;
  width: 12px;
  height: 14px;
  vertical-align: middle;
  margin: -6px 8px 0 0;
}

@media screen and (max-width: 750px) {
  .flow {
    padding: 8vw 5.33vw 12vw;
  }
  .flow_container h2 {
    font-size: 5.86vw;
    background-size: 44vw auto;
    padding: 0 0 1.8vw;
  }
  .flow_container > p {
    text-align: left;
    line-height: 1.9;
    font-size: 3.73vw;
    margin: 5.33vw 0 3vw;
  }
  .flow_container ol li {
    width: 47%;
    margin-top: 5vw;
  }
  .flow_container ol li::before {
    display: none;
    content: none;
  }
  .flow_container ol li:nth-child(5), .flow_container ol li:nth-child(6), .flow_container ol li:nth-child(7), .flow_container ol li:nth-child(8), .flow_container ol li:nth-child(9) {
    width: 47%;
    margin-top: 5vw;
  }
  .flow_container ol li .flow_number {
    left: -1.2vw;
    top: -1.5vw;
    width: 12vw;
    height: auto;
  }
  .flow_container ol li div {
    font-size: 3.73vw;
    margin: 1.33vw 0 0;
  }
  .flow .paint_container {
    max-width: 1200px;
    margin: 60px auto 0;
  }
  .flow .paint_container h2 {
    font-size: 5.86vw;
    background-size: 70vw auto;
    padding: 0 0 1.8vw;
  }
  .flow .paint_container > p {
    text-align: left;
    line-height: 1.9;
    font-size: 3.73vw;
    margin: 5.33vw 0;
  }
  .flow .paint_container .paint_btn a {
    border: 0.8vw solid #c8ad4e;
    border-radius: 13.33vw;
    width: auto;
    height: auto;
    line-height: 1;
    font-size: 4.1vw;
    padding: 2.8vw 0 3vw;
  }
  .flow .paint_container .paint_btn a::before {
    width: 2.6vw;
    height: 3vw;
    margin: -1.3vw 1.8vw 0 0;
  }
}
/* kinds
---------------------------------------------------- */
.kinds_head {
  background-image: linear-gradient(90deg, rgb(180, 132, 62) 0%, rgb(205, 171, 81) 12%, rgb(230, 209, 99) 23%, rgb(180, 132, 62) 61%, rgb(230, 209, 99) 100%);
  padding-top: 6px;
}
.kinds_head_contents {
  padding: 46px 20px 39px;
  background-color: #000;
  text-align: center;
}
.kinds_head_contents ul {
  display: flex;
  justify-content: center;
  gap: min(2.75vw, 33px);
  margin-top: 40px;
}
.kinds_head_contents ul li {
  width: min(30vw, 360px);
}
.kinds_head_contents ul li a {
  display: block;
  height: min(4.5vw, 54px);
  box-sizing: border-box;
  border: min(0.25vw, 3px) solid #666;
  text-align: center;
  background: #000;
  border-radius: min(4.16vw, 50px);
  color: #fff;
  font-weight: 600;
  font-size: min(1.5vw, 18px);
  line-height: min(3.83vw, 46px);
}
.kinds_head_contents ul li a::before {
  display: inline-block;
  content: "";
  background: url(../images/common/ar4.webp) no-repeat left top;
  background-size: 100% auto;
  width: min(1.16vw, 14px);
  height: min(1vw, 12px);
  vertical-align: middle;
  margin: max(-0.33vw, -4px) min(0.83vw, 10px) 0 0;
}
.kinds_st {
  min-height: 256px;
}
.kinds_1 .kinds_st {
  background: url(../images/gaiheki/kinds_st1_back.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#bathroom .kinds_st {
  background: url(../images/gaiheki/naisou_bathroom.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#restroom .kinds_st {
  background: url(../images/gaiheki/naisou_restroom.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#kitchen .kinds_st {
  background: url(../images/gaiheki/naisou_kitchen.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#wallpaper .kinds_st {
  background: url(../images/gaiheki/naisou_wallpaper.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#aircon .kinds_st {
  background: url(../images/gaiheki/naisou_aircon.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#door .kinds_st {
  background: url(../images/gaiheki/naisou_door.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#key .kinds_st {
  background: url(../images/gaiheki/naisou_key.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#exterior .kinds_st {
  background: url(../images/gaiheki/naisou_exterior.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#raingutter .kinds_st {
  background: url(../images/gaiheki/naisou_raingutter.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#screendoor .kinds_st {
  background: url(../images/gaiheki/naisou_screendoor.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#carpenter .kinds_st {
  background: url(../images/gaiheki/naisou_carpenter.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#electricity .kinds_st {
  background: url(../images/gaiheki/naisou_electricity.webp) no-repeat center top;
  background-size: cover;
}
.kinds_1#floortiles .kinds_st {
  background: url(../images/gaiheki/naisou_floortiles.webp) no-repeat center top;
  background-size: cover;
}
.kinds_2 .kinds_st {
  background: url(../images/gaiheki/kinds_st2_back.webp) no-repeat center top;
  background-size: cover;
}
.kinds_2#restroom .kinds_st {
  background: url(../images/gaiheki/naisou_restroom.webp) no-repeat center top;
  background-size: cover;
}
.kinds_3 .kinds_st {
  background: url(../images/gaiheki/kinds_st3_back.webp) no-repeat center top;
  background-size: cover;
}
.kinds_st_inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 43px 20px 0;
}
.kinds_st_inner h3 {
  font-size: 36px;
  color: #fff;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  line-height: 1;
}
.kinds_st_inner p {
  line-height: 1.9;
  color: #fff;
  margin: 35px 0 0;
}
.kinds_flow {
  background: url(../images/common/bg1.webp) no-repeat center top;
  background-size: cover;
}
.kinds_flow .flow_container ol {
  justify-content: space-evenly;
}
.kinds_flow .flow_container ol li::before {
  width: min(1.9vw, 30px);
  height: min(1.9vw, 30px);
  left: max(-6.5vw, -85px);
  top: min(10.92vw, 125px);
}
.kinds_flow_inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px 20px 90px;
}
.kinds_flow_inner > h4 {
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
}
.kinds_flow_inner ol {
  margin: 50px 0 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 35px 0;
  align-items: baseline;
}
.kinds_flow_inner ol li {
  display: block;
  width: min(30.25vw, 363px);
}
.kinds_flow_inner ol li img {
  display: block;
}
.kinds_flow_inner ol li dl dt {
  text-align: center;
  font-weight: 600;
  line-height: 1;
  font-size: 30px;
  letter-spacing: 1px;
}
.kinds_flow_inner ol li dl dt span {
  display: block;
  font-size: 18px;
  color: #b09453;
  margin: 12px 0;
  font-weight: 700;
}
.kinds_flow_inner ol li dl dd {
  margin: 20px 0 0;
  line-height: 1.6;
}
.kinds_photos {
  background-color: #fff;
  border: min(0.08vw, 1px) solid #d7ceb9;
  padding: 34px min(2.58vw, 31px) 24px;
  margin: 40px 0 0;
}
.kinds_photos ul {
  display: flex;
  justify-content: space-between;
}
.kinds_photos ul li {
  width: min(25vw, 300px);
  text-align: center;
}
.kinds_photos ul li:nth-child(1) {
  width: min(37.91vw, 455px);
}
.kinds_photos ul li p {
  font-weight: 500;
  line-height: 1;
  margin-top: 13px;
}
.kinds_photos2 {
  background-color: #fff;
  border: min(0.08vw, 1px) solid #d7ceb9;
  padding: 34px min(2.83vw, 34px) 24px;
  margin: 40px 0 0;
}
.kinds_photos2 ul {
  display: flex;
  justify-content: space-between;
}
.kinds_photos2 ul li {
  width: min(29.66vw, 356px);
  text-align: center;
}
.kinds_photos2 ul li p {
  font-weight: 500;
  line-height: 1;
  margin-top: 13px;
}
.kinds_paint {
  background-color: #fff;
  border: min(0.08vw, 1px) solid #d7ceb9;
  padding: min(2.83vw, 34px);
  margin: 50px 0 0;
  display: flex;
  justify-content: space-between;
}
.parent-pageid-33 .kinds_paint {
  margin-top: 0;
}
.parent-pageid-33 .kinds_paint p:has(img) {
  text-align: center;
}
.kinds_paint:has(ul) {
  justify-content: space-evenly;
}
.kinds_paint .youtube_container {
  width: min(46.66vw, 560px);
}
.kinds_paint .youtube_container iframe {
  width: 100%;
}
.kinds_paint_txt {
  width: min(43.33vw, 520px);
}
.kinds_paint_txt h4 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.4;
  color: #a2843d;
  display: inline-block;
  border-bottom: 4px solid #a2843d;
  padding: 0 0 4px;
}
.kinds_paint_txt h5 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
  background: url(../images/common/title_style3.svg) no-repeat left top 7px;
  background-size: 16px 16px;
  padding: 0 0 0 25px;
  margin: 25px 0 10px;
}
.kinds_paint_txt p {
  line-height: 1.8;
}
.kinds_paint_txt .btn {
  margin-top: 20px;
}
.kinds_paint_txt .btn a {
  display: inline-block;
  border-radius: 50px;
  background-color: #000;
  padding: 10px 33px 13px 30px;
  color: #fff;
  line-height: 1;
  font-weight: 600;
}
.kinds_paint_txt .btn a::before {
  display: inline-block;
  content: "";
  background: url(../images/common/ar1.webp) no-repeat left top;
  background-size: contain;
  width: 11px;
  height: 13px;
  vertical-align: middle;
  margin: -4px 10px 0 0;
}
.kinds_paint_txt ul {
  margin: 10px 0;
}
.kinds_paint_txt ul li {
  list-style: disc;
  list-style-position: inside;
  margin: 5px 0;
}

@media screen and (max-width: 750px) {
  .kinds_head {
    padding-top: 4px;
  }
  .kinds_head_contents {
    padding: 6vw 5.33vw 6.5vw;
  }
  .kinds_head_contents h2 img {
    width: 55vw;
    height: auto;
  }
  .kinds_head_contents ul {
    display: block;
    margin-top: 5.33vw;
  }
  .kinds_head_contents ul li {
    width: auto;
    margin-top: 3vw;
  }
  .kinds_head_contents ul li a {
    display: block;
    height: auto;
    border: 0.8vw solid #666;
    border-radius: 13.33vw;
    font-size: 4.26vw;
    line-height: 1;
    padding: 2.8vw 0;
  }
  .kinds_head_contents ul li a::before {
    width: 3vw;
    height: 3vw;
    margin: -0.6vw 1.8vw 0 0;
  }
  .kinds_st {
    min-height: auto;
    min-height: initial;
  }
  .kinds_st_inner {
    padding: 6vw 5.33vw;
  }
  .kinds_st_inner h3 {
    font-size: 5.33vw;
    line-height: 1.5;
  }
  .kinds_st_inner p {
    font-size: 3.73vw;
    margin: 4vw 0 0;
  }
  .kinds_flow_inner {
    padding: 8vw 5.33vw;
  }
  .kinds_flow_inner > h4 {
    font-size: 5.33vw;
    line-height: 1.5;
  }
  .kinds_flow_inner ol {
    margin: 5.33vw 0 0;
    display: block;
  }
  .kinds_flow_inner ol li {
    width: auto;
    margin-top: 5.33vw;
  }
  .kinds_flow_inner ol li img {
    width: 100%;
    height: auto;
  }
  .kinds_flow_inner ol li dl dt {
    line-height: 1.5;
    font-size: 5.33vw;
  }
  .kinds_flow_inner ol li dl dt span {
    font-size: 4vw;
    margin: 2.66vw 0 0.3vw;
  }
  .kinds_flow_inner ol li dl dd {
    font-size: 3.73vw;
    margin: 2.66vw 0 0;
    line-height: 1.9;
  }
  .kinds_photos {
    border: 1px solid #d7ceb9;
    padding: 5.33vw;
    margin: 8vw 0 0;
  }
  .kinds_photos ul {
    display: block;
  }
  .kinds_photos ul li {
    width: auto;
  }
  .kinds_photos ul li + li {
    margin-top: 5vw;
  }
  .kinds_photos ul li img {
    width: 100%;
    height: auto;
  }
  .kinds_photos ul li:nth-child(1) {
    width: auto;
  }
  .kinds_photos ul li p {
    margin-top: 1.33vw;
    font-size: 3.73vw;
  }
  .kinds_photos2 {
    border: 1px solid #d7ceb9;
    padding: 5.33vw;
    margin: 8vw 0 0;
  }
  .kinds_photos2 ul {
    display: block;
  }
  .kinds_photos2 ul li {
    width: auto;
  }
  .kinds_photos2 ul li + li {
    margin-top: 5vw;
  }
  .kinds_photos2 ul li img {
    width: 100%;
    height: auto;
  }
  .kinds_photos2 ul li p {
    margin-top: 1.33vw;
    font-size: 3.73vw;
  }
  .kinds_paint {
    border: 1px solid #d7ceb9;
    padding: 5.33vw;
    margin: 8vw 0 0;
    display: block;
  }
  .kinds_paint .youtube_container {
    width: 100%;
    aspect-ratio: 16/9;
    margin-top: 5.33vw;
  }
  .kinds_paint .youtube_container iframe {
    width: 100%;
    height: 100%;
  }
  .kinds_paint_txt {
    width: auto;
  }
  .kinds_paint_txt h4 {
    font-size: 5.33vw;
    border-bottom: 0.8vw solid #a2843d;
    padding: 0 0 0.8vw;
  }
  .kinds_paint_txt h5 {
    font-size: 4.26vw;
    background: url(../images/common/title_style3.svg) no-repeat left top 1.3vw;
    background-size: 3.46vw 3.46vw;
    padding: 0 0 0 5vw;
    margin: 2.66vw 0 1.33vw;
  }
  .kinds_paint_txt p {
    line-height: 1.9;
    font-size: 3.73vw;
  }
  .kinds_paint_txt .btn {
    margin-top: 4.8vw;
  }
  .kinds_paint_txt .btn a {
    display: block;
    border-radius: 13.33vw;
    font-size: 4.26vw;
    padding: 3.6vw 0;
    text-align: center;
  }
  .kinds_paint_txt .btn a::before {
    width: 3vw;
    height: 3vw;
    margin: -1vw 1.8vw 0 0;
  }
}
/* ceramic
---------------------------------------------------- */
.ceramic {
  background: url(../images/gaiheki/ceramic_back.webp) no-repeat center top;
  background-size: cover;
  padding: 0 20px
}
.ceramic_container {
  max-width: 1091px;
  margin: 0 auto;
  padding: 90px 0 80px;
}
.ceramic_container h2 {
  text-align: center;
  position: relative;
  padding-left: min(7.33vw, 80px);
  margin-bottom: 55px;
}
.ceramic_container h2::before {
  content: "";
  display: block;
  width: min(13.29vw, 145px);
  height: min(13.38vw, 146px);
  background: url(../images/gaiheki/ceramic_img1.webp) no-repeat left top;
  background-size: contain;
  position: absolute;
  left: min(5.04vw, 55px);
  top: max(-5.04vw, -55px);
}
.ceramic_container h2 img {
  width: min(62.32vw, 680px);
  height: auto;
}
.ceramic_box1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 35px;
}
.ceramic_box1 > img {
  width: min(36.2vw, 395px);
  height: auto;
}
.ceramic_box1_txt {
  width: min(63.06vw, 688px);
  height: min(23.28vw, 254px);
  background: url(../images/gaiheki/ceramic_box.webp) no-repeat left top;
  background-size: contain;
  display: flex;
  align-items: center;
}
.ceramic_box1_txt div {
  padding: 0 min(4.85vw, 53px) 0 min(7.79vw, 85px);
}
.ceramic_box1_txt div h3 {
  color: #fff;
  font-weight: 600;
  text-align: left;
  font-size: min(1.83vw, 20px);
  margin-bottom: min(0.73vw, 8px);
}
.ceramic_box1_txt div p {
  color: #fff;
  line-height: 1.9;
  font-size: min(1.46vw, 16px);
}
.ceramic_box2 {
  width: min(79.28vw, 865px);
  margin: 50px auto 0;
  position: relative;
}
.ceramic_box2 p {
  font-size: min(1.46vw, 16px);
  color: #fff;
  line-height: 1.9;
  padding: 0 min(16.49vw, 180px) 0 0;
}
.ceramic_box2 p + p {
  margin-top: 20px;
}
.ceramic_box2 img {
  position: absolute;
  right: max(-5.49vw, -60px);
  top: min(2.29vw, 25px);
  width: min(19.7vw, 215px);
  height: auto;
}

@media screen and (max-width: 750px) {
  .ceramic_container {
    padding: 8vw 5.33vw;
  }
  .ceramic_container h2 {
    padding-left: 0;
    margin-bottom: 0;
  }
  .ceramic_container h2::before {
    content: none;
    display: none;
  }
  .ceramic_container h2 img {
    width: 88vw;
    height: auto;
  }
  .ceramic_box1 {
    display: block;
    margin-top: 8vw;
  }
  .ceramic_box1 > img {
    width: 100%;
    height: auto;
  }
  .ceramic_box1_txt {
    width: auto;
    height: auto;
    background: none;
    display: block;
  }
  .ceramic_box1_txt div {
    padding: 3.5vw 0 0;
  }
  .ceramic_box1_txt div h3 {
    font-size: 4.2vw;
    margin-bottom: 2.66vw;
  }
  .ceramic_box1_txt div p {
    font-size: 3.73vw;
  }
  .ceramic_box2 {
    width: auto;
    margin: 8vw 0 0;
  }
  .ceramic_box2 p {
    font-size: 3.73vw;
    padding: 0;
  }
  .ceramic_box2 p + p {
    margin-top: 8vw;
  }
  .ceramic_box2 img {
    display: none;
  }
}
/* loan
---------------------------------------------------- */
.loan {
  background: url(../images/common/bg2.webp) no-repeat center bottom;
  background-size: cover;
  padding: 70px 20px;
}
.loan_container {
  max-width: 1200px;
  margin: 0 auto;
}
.loan_container .loan_title {
  color: #bba87b;
  font-weight: 700;
  text-align: center;
  line-height: 1;
  font-size: 24px;
  margin-bottom: 20px;
}
.loan_container h2 {
  color: #fff;
  font-size: 38px;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 25px;
  text-align: center;
}
.loan_container .loan_catch {
  color: #fff;
  text-align: center;
  line-height: 1.9;
}
.loan_contents {
  background-color: #fff;
  padding: 58px 0;
  margin-top: 30px;
}
.loan_contents_inner {
  max-width: 866px;
  margin: 0 auto;
  padding: 0 20px;
}
.loan_contents_inner .loan_img1 {
  width: 100%;
  height: auto;
}
.loan_contents_inner .loan_catch2 {
  background-color: #94cbe6;
  padding: 14px 37px 21px;
}
.loan_contents_inner .loan_catch2 p {
  background-color: #fff;
  text-align: center;
  font-size: 24px;
  line-height: 1.4;
  font-weight: 600;
  padding: 12px 0;
  border-radius: 10px;
  border: 3px solid #181818;
}
.loan_contents_inner h3 {
  font-size: 26px;
  font-weight: 600;
  line-height: 1.4;
  color: #a2843d;
  display: inline-block;
  border-bottom: 4px solid #a2843d;
  padding: 0 0 4px;
}
.loan_contents_inner .loan_features {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 50px;
}
.loan_contents_inner .loan_features > img {
  width: min(42.6vw, 369px);
  height: auto;
}
.loan_contents_inner .loan_features ul {
  margin-top: 25px;
}
.loan_contents_inner .loan_features ul li {
  font-size: min(2.07vw, 18px);
  font-weight: 500;
}
.loan_contents_inner .loan_features ul li span {
  display: inline-block;
  background-color: #b09453;
  color: #fff;
  font-weight: 600;
  line-height: 29px;
  width: min(11.43vw, 99px);
  height: 29px;
  text-align: center;
  margin-right: min(1.38vw, 12px);
  font-size: min(1.84vw, 16px);
}
.loan_contents_inner .loan_features ul li + li {
  margin-top: 12px;
}
.loan_contents_inner .loan_flow {
  margin-top: 50px;
}
.loan_contents_inner .loan_flow p {
  line-height: 1.9;
  margin: 15px 0 0;
}
.loan_contents_inner .loan_flow ol {
  display: flex;
  justify-content: space-between;
  margin: 15px 0 0;
}
.loan_contents_inner .loan_flow ol li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(22.28vw, 193px);
  height: min(7.04vw, 61px);
  border: min(0.34vw, 3px) solid #b09453;
  box-sizing: border-box;
  border-radius: min(0.92vw, 8px);
  background-color: #fcf1d6;
  color: #a2843d;
  font-size: min(1.96vw, 17px);
  font-weight: 600;
}
.loan_contents_inner .loan_flow ol li + li {
  position: relative;
}
.loan_contents_inner .loan_flow ol li + li::before {
  content: "";
  display: block;
  background: url(../images/common/ar5.webp) no-repeat left top;
  background-size: contain;
  width: min(1.5vw, 13px);
  height: min(1.73vw, 15px);
  position: absolute;
  left: max(-2.88vw, -25px);
  top: 50%;
  transform: translate(0, -50%);
}
.loan_contents_inner .loan_faq {
  margin: 50px 0 40px;
}
.loan_contents_inner .loan_faq h3 {
  margin-bottom: 10px;
}
.loan_contents_inner .loan_faq dl {
  border-bottom: 1px solid #d3d3d3;
  padding: 15px 0;
}
.loan_contents_inner .loan_faq dl dt {
  font-size: 20px;
  font-weight: 600;
}
.loan_contents_inner .loan_faq dl dt span {
  display: inline-block;
  width: 35px;
  height: 35px;
  background-color: #000;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  line-height: 32px;
  margin: 0 11px 0 0;
}
.loan_contents_inner .loan_faq dl dd {
  padding: 0 0 0 47px;
  line-height: 1.9;
  margin-top: 5px;
}
.loan_contents_inner .loan_btn a {
  display: block;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
  border-radius: 50px;
  width: 404px;
  height: 54px;
  box-sizing: border-box;
  border: 3px solid #c8ad4e;
  line-height: 46px;
  font-size: 18px;
  font-weight: 600;
  color: #b99945;
}
.loan_contents_inner .loan_btn a::before {
  display: inline-block;
  content: "";
  background: url(../images/common/ar3.webp) no-repeat left top;
  background-size: contain;
  width: 12px;
  height: 14px;
  vertical-align: middle;
  margin: -6px 8px 0 0;
}

@media screen and (max-width: 750px) {
  .loan {
    padding: 8vw 5.33vw;
  }
  .loan_container .loan_title {
    font-size: 4.26vw;
    margin-bottom: 2.6vw;
  }
  .loan_container h2 {
    font-size: 6.3vw;
    line-height: 1.4;
    margin-bottom: 4vw;
  }
  .loan_container .loan_catch {
    font-size: 3.73vw;
    text-align: left;
  }
  .loan_contents {
    padding: 5.33vw 5.33vw 8vw;
    margin-top: 5.33vw;
  }
  .loan_contents_inner .loan_img1 {
    max-width: 396px;
    width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }
  .loan_contents_inner .loan_catch2 {
    padding: 3vw;
    margin-top: 2vw;
  }
  .loan_contents_inner .loan_catch2 p {
    font-size: 4.2vw;
    line-height: 1.6;
    padding: 3.46vw;
    border-radius: 2.66vw;
    border: 0.8vw solid #181818;
  }
  .loan_contents_inner h3 {
    font-size: 5vw;
    border-bottom: 0.8vw solid #a2843d;
    padding: 0 0 0.8vw;
  }
  .loan_contents_inner .loan_features {
    display: block;
    margin-top: 5.33vw;
  }
  .loan_contents_inner .loan_features > img {
    width: 100%;
    height: auto;
  }
  .loan_contents_inner .loan_features ul {
    margin: 3.3vw 0 4vw;
  }
  .loan_contents_inner .loan_features ul li {
    font-size: 4vw;
  }
  .loan_contents_inner .loan_features ul li span {
    display: block;
    line-height: 1;
    width: 24vw;
    height: auto;
    margin-right: 0;
    margin-bottom: 0.8vw;
    font-size: 3.73vw;
    padding: 1.3vw 0 1.6vw;
    letter-spacing: 1px;
  }
  .loan_contents_inner .loan_features ul li + li {
    margin-top: 3vw;
  }
  .loan_contents_inner .loan_flow {
    margin-top: 5.33vw;
  }
  .loan_contents_inner .loan_flow p {
    font-size: 3.73vw;
    margin: 2.66vw 0 0;
  }
  .loan_contents_inner .loan_flow ol {
    display: block;
    margin: 2.66vw 0 0;
  }
  .loan_contents_inner .loan_flow ol li {
    display: block;
    width: 60vw;
    height: auto;
    border: 0.8vw solid #b09453;
    border-radius: 2.13vw;
    font-size: 4vw;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding: 2.66vw 0;
  }
  .loan_contents_inner .loan_flow ol li + li {
    margin-top: 6.5vw;
  }
  .loan_contents_inner .loan_flow ol li + li::before {
    background: url(../images/common/ar7.webp) no-repeat left top;
    background-size: contain;
    width: 4vw;
    height: 3.46vw;
    position: absolute;
    left: 50%;
    top: -5.9vw;
    transform: translate(-50%, 0);
  }
  .loan_contents_inner .loan_flow ol + p {
    padding-left: 1em;
    text-indent: -1em;
  }
  .loan_contents_inner .loan_faq {
    margin: 8vw 0;
  }
  .loan_contents_inner .loan_faq h3 {
    margin-bottom: 2.66vw;
  }
  .loan_contents_inner .loan_faq dl {
    padding: 4w 0 2.66vw;
  }
  .loan_contents_inner .loan_faq dl dt {
    font-size: 4.2vw;
  }
  .loan_contents_inner .loan_faq dl dt span {
    width: 8vw;
    height: 8vw;
    line-height: 7.6vw;
    vertical-align: middle;
    margin: -0.7vw 1.8vw 0 0;
  }
  .loan_contents_inner .loan_faq dl dd {
    font-size: 3.73vw;
    padding: 0;
    margin-top: 1.33vw;
  }
  .loan_contents_inner .loan_btn a {
    display: block;
    width: auto;
    height: auto;
    border: 0.8vw solid #c8ad4e;
    border-radius: 13.33vw;
    font-size: 3.6vw;
    line-height: 1;
    padding: 3vw 0 3.4vw;
  }
  .loan_contents_inner .loan_btn a::before {
    width: 3vw;
    height: 3vw;
    margin: -1vw 1.2vw 0 0;
  }
}/*# sourceMappingURL=gaiheki.css.map */
