@charset "UTF-8";
body, *, :before, :after {
  font-family: "Noto Sans JP", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro, "ＭＳ Ｐゴシック", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

figure {
  margin: 0;
}

.el_hover_border {
  display: inline-block;
  position: relative;
  padding-bottom: 0.1875rem;
}
.el_hover_border::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease-out;
}
.el_hover_border:hover {
  cursor: pointer;
}
.el_hover_border:hover::after {
  transform: scaleX(1);
}

@media (min-width: 1580px) {
  .bl_guarantee {
    position: relative;
  }
  .bl_guarantee::before {
    content: "";
    display: block;
    position: absolute;
    right: 0 !important;
    width: clamp(520px, 74vw, 900px) !important;
    background: url(../images/new_top/guarantee_img.webp);
    width: clamp(320px, 60vw, 700px);
    height: clamp(500px, 80vw, 900px);
    top: -63px;
    background-size: contain;
    background-repeat: no-repeat;
  }
  .bl_guarantee_top_flexBox {
    width: 1440px !important;
    margin: clamp(70px, 13vw, 150px) auto clamp(100px, 12vw, 180px) !important;
  }
  .bl_guarantee_right_img img {
    display: none;
  }
}
@media (min-width: 831px) {
  .hp_pcNone {
    display: none !important;
  }
  .bl_guarantee_ttl_wrapper {
    /* ===== 背景ベース + ノイズ ===== */
    background-color: #e6e6e6;
    padding-top: 6.25rem;
    background-image: linear-gradient(rgba(230, 230, 230, 0.8117647059), rgba(230, 230, 230, 0.8117647059)), url(../images/new_top/noise.png);
    background-repeat: repeat;
    background-size: 100px auto;
    position: relative;
    /* 格子背景 */
  }
  .bl_guarantee_ttl_wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background-image: linear-gradient(to right, rgba(170, 170, 170, 0.25) 1px, transparent 1px), linear-gradient(to bottom, rgba(170, 170, 170, 0.25) 1px, transparent 1px);
    background-size: 16px 16px;
    opacity: 0.8;
  }
  .bl_guarantee_ttl_wrapper > * {
    position: relative;
    z-index: 2;
  }
  .dmd_guarantee_ttl {
    font-size: clamp(5.625rem, 12vw, 8.875rem);
    font-weight: bold;
    margin: 7.5rem 0 0.625rem 5rem;
    display: inline-block;
    color: #030303;
  }
  .dmd_guarantee_ruby {
    font-size: clamp(16px, 1.5vw, 20px);
    margin-left: clamp(4px, 0.8vw, 10px);
    display: inline-block;
    color: #030303;
    font-weight: 700;
  }
  .bl_guarantee_top_flexBox {
    width: clamp(520px, 97.5vw, 1400px);
    margin: clamp(70px, 13vw, 150px) 0 clamp(100px, 12vw, 180px) auto;
    position: relative;
  }
  .bl_guarantee_left_img {
    width: clamp(280px, 42vw, 590px);
  }
  .bl_guarantee_right_img {
    width: clamp(320px, 54vw, 700px);
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
  }
  .bl_guarantee_top_ttl {
    font-size: clamp(26px, 3.7vw, 45px);
    margin-bottom: clamp(35px, 6vw, 80px);
    width: clamp(280px, 70vw, 820px);
    font-weight: 800;
    color: #030303;
    line-height: 1.3;
  }
  .bl_guarantee_top_ttl span {
    position: relative;
    display: inline-block;
    font-weight: 800;
  }
  .bl_guarantee_top_ttl span::after {
    content: "";
    position: absolute;
    left: -4px;
    right: -4px;
    bottom: -4px;
    height: 45%;
    background: #FFE600;
    z-index: -1;
    border-radius: 3px;
  }
  .bl_guarantee_top_txt {
    line-height: 1.8;
    font-size: clamp(12px, 1.2vw, 18px);
    margin-bottom: clamp(30px, 7.1vw, 80px);
    color: #030303;
  }
  .bl_guarantee_comfortable {
    position: relative;
    padding-top: clamp(25px, 5vw, 60px);
    background-color: #f4f4f4;
    overflow: hidden;
    z-index: 1;
  }
  /* ノイズを 90% の範囲に表示、濃さ調整可 */
  .bl_guarantee_comfortable::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90%;
    background: url(../images/new_top/noise.png) repeat;
    background-size: 100px auto;
    opacity: 0.3;
    z-index: -1;
  }
  .bl_guarantee_comfortable_ttl {
    font-size: clamp(20px, 3vw, 32px);
    font-weight: 800;
    color: #030303;
    text-align: center;
    line-height: 1.8;
    margin-bottom: clamp(30px, 6vw, 80px);
  }
  .bl_guarantee_comfortable_ttl span {
    font-size: clamp(28px, 4vw, 48px);
    color: #0070D4;
    font-weight: 800;
  }
  .bl_guarantee_comfortable_list li {
    width: clamp(520px, 97.5vw, 1400px);
    margin: 0 auto;
    padding: clamp(25px, 4.2vw, 60px);
    background: #fff;
    height: clamp(300px, 34.2vw, 480px);
    margin-bottom: clamp(15px, 2.6vw, 30px);
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_flexReverce {
    flex-direction: row-reverse;
  }
  .bl_guarantee_comfortable_num_contents {
    margin-right: clamp(15px, 4vw, 50px);
  }
  .bl_guarantee_comfortable_num_topTxt {
    position: relative;
    font-size: clamp(12px, 1vw, 16px);
    margin-bottom: clamp(10px, 1vw, 15px);
    text-align: center;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_num_topTxt::before, .bl_guarantee_comfortable_num_topTxt::after {
    content: "";
    position: absolute;
    border: 1px solid #030303;
    width: clamp(20px, 2.6vw, 45px);
    top: clamp(4px, 0.5vw, 7px);
  }
  .bl_guarantee_comfortable_num_topTxt::before {
    right: clamp(-5px, -1vw, -10px);
  }
  .bl_guarantee_comfortable_num_topTxt::after {
    left: clamp(-5px, -1vw, -10px);
  }
  .bl_guarantee_comfortable_img {
    width: clamp(280px, 35vw, 590px);
  }
  .bl_guarantee_comfortable_num {
    font-size: clamp(50px, 9vw, 116px);
    font-weight: bold;
    color: #D9EAF7;
    line-height: 0.7;
  }
  .bl_guarantee_comfortable_list_subttl {
    font-size: clamp(16px, 2vw, 24px);
    margin-bottom: clamp(8px, 1vw, 15px);
    color: #030303;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_list_ttl {
    font-size: clamp(20px, 2.7vw, 32px);
    color: #0070D4;
    line-height: 1.3;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_txt {
    font-size: clamp(12px, 1.2vw, 16px);
    margin-top: clamp(20px, 3vw, 45px);
    line-height: 1.8;
    width: clamp(280px, 50vw, 590px);
  }
  .bl_inspection_support_ttl {
    text-align: center;
    color: #0070D4;
    font-family: sans-serif;
    margin: clamp(35px, 7.3vw, 90px) 0;
    position: relative;
  }
  .bl_support_top {
    position: relative;
    display: inline-block;
    font-weight: 800;
    margin-bottom: clamp(5px, 3vw, 10px);
    color: #030303;
    font-size: clamp(18px, 4vw, 28px);
  }
  .bl_support_top span {
    color: #0070D4;
    font-weight: 800;
    font-size: clamp(24px, 3vw, 35px);
  }
  /* 左右の点線ライン */
  .bl_support_top::before {
    content: "";
    position: absolute;
    left: -40px;
    top: 50%;
    transform: translateY(-50%) rotate(-120deg);
    width: clamp(20px, 8vw, 40px);
    border-top: 3px dotted #0070D4;
  }
  .bl_support_top::after {
    content: "";
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%) rotate(120deg);
    width: clamp(20px, 8vw, 40px);
    border-top: 3px dotted #0070D4;
  }
  /* メイン見出し */
  .bl_support_main {
    font-size: clamp(28px, 7vw, 48px);
    font-weight: 800;
    margin-top: clamp(5px, 3vw, 10px);
    color: #0070D4;
  }
  .bl_guarantee_comfortable_support_box {
    width: clamp(320px, 97.5vw, 1400px);
    margin: 0 auto;
    background: #FFE600;
    padding: clamp(30px, 4.3vw, 65px) clamp(15px, 2.3vw, 65px) clamp(30px, 4.3vw, 60px);
    margin-bottom: 120px;
  }
  .bl_guarantee_comfortable_support_box .bl_guarantee_comfortable_support_ttl {
    font-size: clamp(22px, 2.5vw, 32px);
    color: #030303;
    line-height: 1.4;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_support_box .bl_guarantee_comfortable_support_txt {
    font-size: clamp(12px, 1vw, 16px);
    margin-top: clamp(20px, 4.2vw, 50px);
    line-height: 1.8;
    color: #030303;
  }
  .bl_guarantee_bottom_img {
    width: clamp(260px, 60vw, 540px);
    height: clamp(140px, 30vw, 270px);
  }
  .bl_guarantee_comfortable_support_bottom {
    width: clamp(320px, 97.5vw, 1400px);
    height: clamp(300px, 50vw, 600px);
    margin: 0 auto clamp(60px, 8vw, 120px);
    background: url(../images/new_top/1guarantee.webp);
    background-size: 100% auto;
    padding-top: clamp(25px, 4.2vw, 70px);
    background-repeat: no-repeat;
  }
  .bl_guarantee_comfortable_support_bottom_txtContents {
    width: clamp(320px, 70vw, 750px);
    border: 1px solid #fff;
    margin: 0 auto;
    padding: clamp(10px, 1vw, 15px) 0 clamp(15px, 1.6vw, 25px);
  }
  .bl_guarantee_comfortable_support_bottom_ttl {
    font-size: clamp(20px, 3.4vw, 36px);
    font-weight: 900;
    color: #fff;
    text-align: center;
    letter-spacing: 0.1em;
    border-bottom: 1px solid #fff;
    padding-bottom: clamp(10px, 1.3vw, 20px);
    width: clamp(280px, 60vw, 660px);
    margin: 0 auto clamp(12px, 2vw, 20px);
  }
  .bl_guarantee_comfortable_support_bottom_ttl span {
    letter-spacing: 0.1em;
    font-weight: 900;
    color: #FFE600;
  }
  .bl_guarantee_comfortable_support_bottom_txt {
    font-weight: 600;
    color: #fff;
    text-align: center;
    font-size: clamp(14px, 1.7vw, 20px);
  }
}
@media (max-width: 830px) {
  .hp_spNone {
    display: none !important;
  }
  .hp_sp_flexNone {
    display: block !important;
  }
  .dmd_guarantee_ttl {
    font-size: 12.0481927711vw;
    font-weight: bold;
    margin: 8.4337349398vw 0 1.2048192771vw 4.8192771084vw;
    display: inline-block;
    color: #030303;
  }
  .dmd_guarantee_ruby {
    font-size: 3.8554216867vw;
    display: inline-block;
    margin-left: 1.2048192771vw;
    color: #030303;
    font-weight: 700;
  }
  .bl_guarantee_ttl_wrapper {
    padding-top: 12.0481927711vw;
    /* ===== 背景ベース + ノイズ ===== */
    background-color: #e6e6e6;
    background-image: linear-gradient(rgba(230, 230, 230, 0.8117647059), rgba(230, 230, 230, 0.8117647059)), url(../images/new_top/noise.png);
    background-repeat: repeat;
    background-size: 100px auto;
    position: relative;
    /* 格子背景 */
  }
  .bl_guarantee_ttl_wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background-image: linear-gradient(to right, rgba(170, 170, 170, 0.25) 1px, transparent 1px), linear-gradient(to bottom, rgba(170, 170, 170, 0.25) 1px, transparent 1px);
    background-size: 16px 16px;
    opacity: 0.8;
  }
  .bl_guarantee_ttl_wrapper > * {
    position: relative;
    z-index: 2;
  }
  .bl_guarantee {
    position: relative;
    background: url(../images/new_top/2guarantee_SP.webp);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding: 0 4.8192771084vw;
    margin: 21.686746988vw 0 44.578313253vw;
  }
  .bl_guarantee_top_ttl {
    position: absolute;
    font-size: 6.265060241vw;
    color: #030303;
    top: -13.2530120482vw;
    font-weight: bold;
  }
  .bl_guarantee_top_ttl span {
    position: relative;
    display: inline-block;
    font-weight: 800;
    z-index: 1;
  }
  .bl_guarantee_top_ttl span::after {
    content: "";
    position: absolute;
    left: -4px;
    right: -4px;
    bottom: 0;
    height: 45%;
    background: #FFE600;
    z-index: -1;
    border-radius: 3px;
  }
  .bl_guarantee_top_txt {
    font-size: 3.8554216867vw;
    color: #fff;
    line-height: 1.8;
    padding: 32.5301204819vw 0 91.5662650602vw;
  }
  .bl_guarantee_left_img {
    position: absolute;
    width: 90.3614457831vw;
    margin: 0 auto;
    bottom: -27.7108433735vw;
  }
  .bl_guarantee_comfortable {
    position: relative;
    padding-top: 10.843373494vw;
    background-color: #f4f4f4;
    overflow: hidden;
    z-index: 1;
  }
  /* ノイズを 90% の範囲に表示、濃さ調整可 */
  .bl_guarantee_comfortable::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/new_top/noise.png) repeat;
    background-size: 100px auto;
    opacity: 0.3;
    z-index: -1;
  }
  .bl_guarantee_comfortable_ttl {
    font-size: 4.8192771084vw;
    text-align: center;
    font-weight: 800;
    margin-bottom: 9.6385542169vw;
  }
  .bl_guarantee_comfortable_ttl span {
    font-size: 7.2289156627vw;
    color: #0070D4;
    font-weight: 800;
  }
  .bl_guarantee_comfortable_list {
    width: 90.3614457831vw;
    margin: 0 auto;
  }
  .bl_guarantee_comfortable_list li {
    background: #fff;
    margin-bottom: 3.6144578313vw;
    padding: 6.0240963855vw 4.8192771084vw 9.6385542169vw;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num_topTxt {
    position: relative;
    text-align: center;
    font-size: 3.1325301205vw;
    text-align: center;
    width: 27.7108433735vw;
    margin: 0 auto;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num_topTxt::before, .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num_topTxt::after {
    content: "";
    position: absolute;
    border: 0.5px solid #030303;
    width: 7.2289156627vw;
    top: 2.4096385542vw;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num_topTxt::before {
    right: 2.4096385542vw;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num_topTxt::after {
    left: 2.4096385542vw;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_num {
    font-size: 13.9759036145vw;
    text-align: center;
    color: #D9EAF7;
    font-weight: bold;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_list_subttl {
    text-align: center;
    font-size: 4.578313253vw;
    margin: 1.2048192771vw 0;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_list_ttl {
    font-size: 5.9036144578vw;
    color: #0070D4;
    text-align: center;
    margin-bottom: 3.6144578313vw;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_txt {
    margin-top: 7.2289156627vw;
    font-size: 3.8554216867vw;
    line-height: 1.8;
  }
  .bl_guarantee_comfortable_list li .bl_guarantee_comfortable_support {
    padding-top: 10.843373494vw;
  }
  .bl_guarantee_comfortable_support {
    margin-top: 8.4337349398vw;
    padding-bottom: 18.0722891566vw;
  }
  .bl_inspection_support_ttl {
    text-align: center;
  }
  .bl_inspection_support_ttl .bl_support_top {
    position: relative;
    display: inline-block;
    font-weight: 800;
    color: #030303;
    font-size: 6.7469879518vw;
  }
  .bl_inspection_support_ttl .bl_support_top span {
    color: #0070D4;
    font-weight: 800;
    font-size: 8.6746987952vw;
  }
  .bl_inspection_support_ttl .bl_support_top::before {
    content: "";
    position: absolute;
    left: -40px;
    top: 50%;
    transform: translateY(-50%) rotate(-120deg);
    width: clamp(20px, 8vw, 40px);
    border-top: 3px dotted #0070D4;
  }
  .bl_inspection_support_ttl .bl_support_top::after {
    content: "";
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%) rotate(120deg);
    width: clamp(20px, 8vw, 40px);
    border-top: 3px dotted #0070D4;
  }
  .bl_inspection_support_ttl .bl_support_main {
    font-size: 9.6385542169vw;
    color: #0070D4;
    font-weight: 800;
    line-height: 1.4;
  }
  .bl_guarantee_comfortable_support_box {
    background: #FFE600;
    width: 90.3614457831vw;
    margin: 8.4337349398vw auto 0;
    padding: 7.2289156627vw 4.4578313253vw 10.843373494vw;
  }
  .bl_guarantee_comfortable_support_ttl {
    text-align: center;
    font-size: 4.578313253vw;
    line-height: 1.5;
    font-weight: 700;
  }
  .bl_guarantee_comfortable_support_txt {
    font-size: 3.8554216867vw;
    line-height: 1.5;
    margin-top: 6.0240963855vw;
  }
  .bl_guarantee_bottom_img {
    margin-top: 12.0481927711vw;
  }
  .bl_guarantee_comfortable_support_bottom {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 85%, #fff 85%, #fff 100%), url(../images/new_top/1guarantee.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    padding: 7.2289156627vw 0 40.9638554217vw;
    height: 93.9759036145vw;
  }
  .bl_guarantee_comfortable_support_bottom_txtContents {
    border: 1px solid #fff;
    width: 80.7228915663vw;
    margin: 0 auto;
    padding-bottom: 4.2168674699vw;
  }
  .bl_guarantee_comfortable_support_bottom_ttl {
    font-size: 6.265060241vw;
    font-weight: 900;
    color: #fff;
    text-align: center;
    margin: 0 auto 3.0120481928vw;
    border-bottom: 1px solid #fff;
    padding-bottom: 3.0120481928vw;
    width: 72.2891566265vw;
  }
  .bl_guarantee_comfortable_support_bottom_ttl span {
    font-weight: 900;
    color: #FFE600;
  }
  .bl_guarantee_comfortable_support_bottom_txt {
    color: #fff;
    font-size: 3.8554216867vw;
    font-weight: 600;
    text-align: center;
    line-height: 2;
  }
}
