
.br {
  display: block;
}

.promise #main_ph .bg_fx_promise::after {
  background-image: url(/images/promise/main_bk.jpg);
  background-position: center;
}

/*------------------------------------------------------------
PC
------------------------------------------------------------*/
@media all and (min-width: 769px) {
  .promise .promise_top{
    background: url(/images/promise/promise_bg01.jpg) center /100% no-repeat;
  }
  .promise .promise_top .body .bg_inner {
    background-color: rgba(255, 255, 255, .8);
    padding: clamp(3.125rem, 1.278rem + 5.68vw, 6.25rem) clamp(1rem, -0.182rem + 3.64vw, 3rem);/*50~100px,16~48px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 {
    display: flex;
    align-items: baseline;
    justify-content: center;
    position: relative;
    width: fit-content;
    margin: 0 auto clamp(1.5rem, 0.466rem + 3.18vw, 3.25rem);/*24~52px(521~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3::after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 2px;
    background-color: #6fb92c;
    position: absolute;
    bottom: -1rem;
    left: 50%;
    transform: translateX(-50%);
  }
  .promise .promise_top .body .bg_inner h3 .txt {
    font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong {
    font-size: calc(clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem) * 1.5);
    color: #6fb92c;
    margin: 0 .5em;
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong::after {
    content: url(/images/promise/icon_strong.svg);
    display: inline-block;
    width: 1.5rem;
    transform: translateY(-100%);
  }
  .promise .promise_top .body .bg_inner h3 figure {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(100%,-70%);
    width: clamp(3.125rem, -0.842rem + 12.21vw, 8.313rem);/*50~133px(520~1200px)*/
  }
  .promise .promise_top .body .bg_inner .text .br {
    text-align: center;
  }
  .promise .promise_top .body .bg_inner .text .br.mb {
    margin-bottom: 2em;
  }

  .promise .promise_list{
    background: url(/images/common/border_bg.svg) top left /32px repeat;
  }
  .promise .promise_list .body dl {
    background-color: #fff;
    border-radius: 1rem;
    border: 10px solid #6fb92c;
    padding: clamp(3.125rem, 1.278rem + 5.68vw, 6.25rem) clamp(1rem, -0.182rem + 3.64vw, 3rem);/*50~100px,16~48px(520~1400px)*/
  }
  .promise .promise_list .body dl .row {
    display: flex;
    align-items: center;
    padding: 1rem;
    border-bottom: 5px dashed #6fb92c;
    grid-gap: 1rem;
  }
  .promise .promise_list .body dl .row dt {
    display: flex;
    align-items: baseline;
    justify-content: center;
    grid-gap: .25rem;
    padding-right: .5rem;
    position: relative;
    min-width: 150px;
  }
  .promise .promise_list .body dl .row dt::after {
    content: "";
    display: inline-block;
    width: 85%;
    height: 100%;
    border: #6fb92c 3px solid;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
  }
  .promise .promise_list .body dl .row dt figure {
    width: 3em;
    background-color: #6fb92c;
    border-radius: 100%;
    aspect-ratio: 1/1;
    padding: .25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
  }
  .promise .promise_list .body dl .row dt .txt {
    font-size: 20px;
    font-weight: bold;
    color: #6fb92c;
  }
  .promise .promise_list .body dl .row dt .num {
    font-size: 36px;
    color: #6fb92c;
    font-weight: bold;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  }
  .promise .promise_list .body dl .row dd {
    font-size: clamp(1rem, 0.852rem + 0.45vw, 1.25rem);/*16~20px,16~48px(520~1400px)*/
  }


}
/*------------------------------------------------------------
pad
------------------------------------------------------------*/
@media all and (min-width: 521px) and (max-width: 768px) {
  .promise .promise_top{
    background: url(/images/promise/promise_bg01.jpg) center /auto 100% no-repeat;
  }
  .promise #pageUnder .promise_top .body {
    padding: 50px 0;
  }
  .promise .promise_top .body .bg_inner {
    background-color: rgba(255, 255, 255, .8);
    padding: clamp(3.125rem, 1.278rem + 5.68vw, 6.25rem) clamp(1rem, -0.182rem + 3.64vw, 3rem);/*50~100px,16~48px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 {
    display: flex;
    align-items: baseline;
    justify-content: center;
    position: relative;
    width: fit-content;
    margin: 0 auto clamp(1.5rem, 0.466rem + 3.18vw, 3.25rem);/*24~52px(521~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3::after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 2px;
    background-color: #6fb92c;
    position: absolute;
    bottom: -1rem;
    left: 50%;
    transform: translateX(-50%);
  }
  .promise .promise_top .body .bg_inner h3 .txt {
    font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong {
    font-size: calc(clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem) * 1.5);
    color: #6fb92c;
    margin: 0 .5em;
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong::after {
    content: url(/images/promise/icon_strong.svg);
    display: inline-block;
    width: 1.5rem;
    transform: translateY(-100%);
  }
  .promise .promise_top .body .bg_inner h3 figure {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(100%,-70%);
    width: clamp(3.125rem, -0.842rem + 12.21vw, 8.313rem);/*50~133px(520~1200px)*/
  }
  .promise .promise_top .body .bg_inner .text .br {
    text-align: center;
  }
  .promise .promise_top .body .bg_inner .text .br.mb {
    margin-bottom: 2em;
  }

  .promise .promise_list{
    background: url(/images/common/border_bg.svg) top left /32px repeat;
  }
  .promise .promise_list .body dl {
    background-color: #fff;
    border-radius: 1rem;
    border: 10px solid #6fb92c;
    padding: 2rem 1rem;
  }
  .promise .promise_list .body dl .row {
    display: flex;
    align-items: center;
    padding: .5rem;
    border-bottom: 3px dashed #6fb92c;
    grid-gap: 1.5rem;
  }
  .promise .promise_list .body dl .row dt {
    display: flex;
    align-items: baseline;
    justify-content: center;
    grid-gap: .25rem;
    padding-right: .5rem;
    position: relative;
    min-width: 150px;
  }
  .promise .promise_list .body dl .row dt::after {
    content: "";
    display: inline-block;
    width: 85%;
    height: 100%;
    border: #6fb92c 3px solid;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
  }
  .promise .promise_list .body dl .row dt figure {
    width: 3em;
    background-color: #6fb92c;
    border-radius: 100%;
    aspect-ratio: 1/1;
    padding: .25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
  }
  .promise .promise_list .body dl .row dt .txt {
    font-size: 20px;
    font-weight: bold;
    color: #6fb92c;
  }
  .promise .promise_list .body dl .row dt .num {
    font-size: 36px;
    color: #6fb92c;
    font-weight: bold;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  }
  .promise .promise_list .body dl .row dd {
    font-size: clamp(1rem, 0.852rem + 0.45vw, 1.25rem);/*16~20px,16~48px(520~1400px)*/
  }

}
/*------------------------------------------------------------
SP
------------------------------------------------------------*/
@media all and (max-width: 520px) {
  .promise #main_ph .bg_fx_promise::after {
    background-position: right;
  }
  .promise .promise_top{
    background: url(/images/promise/promise_bg01.jpg) center /auto 100% no-repeat;
  }
  .promise #pageUnder .promise_top .body {
    padding: 2rem 0;
  }
  .promise .promise_top .body .bg_inner {
    background-color: rgba(255, 255, 255, .8);
    padding: clamp(3.125rem, 1.278rem + 5.68vw, 6.25rem) clamp(1rem, -0.182rem + 3.64vw, 3rem);/*50~100px,16~48px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    width: fit-content;
    margin: 0 auto clamp(1.5rem, 0.466rem + 3.18vw, 3.25rem);/*24~52px(521~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3::after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 2px;
    background-color: #6fb92c;
    position: absolute;
    bottom: -1rem;
    left: 50%;
    transform: translateX(-50%);
  }
  .promise .promise_top .body .bg_inner h3 .txt {
    font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong {
    font-size: calc(clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem) * 1.5);
    color: #6fb92c;
    margin: 1.5rem .5em 0;
    position: relative;
  }
  .promise .promise_top .body .bg_inner h3 .txt.strong::after {
    content: url(/images/promise/icon_strong.svg);
    display: inline-block;
    width: 1.5rem;
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(80%,-80%);
  }
  .promise .promise_top .body .bg_inner h3 figure {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(100%,-70%);
    width: 85px;
  }
  .promise .promise_top .body .bg_inner .text .br {
    text-align: left;
    font-size: 14px;
    text-indent: 1rem;
  }
  .promise .promise_top .body .bg_inner .text .br.mb {
    margin-bottom: 2em;
  }

  .promise .promise_list{
    background: url(/images/common/border_bg.svg) top left /32px repeat;
  }
  .promise .promise_list .body dl {
    background-color: #fff;
    border-radius: 1rem;
    border: 10px solid #6fb92c;
    padding: 1rem 1rem;
  }
  .promise .promise_list .body dl .row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 1rem .5rem;
    border-bottom: 3px dashed #6fb92c;
    grid-gap: .5rem;
  }
  .promise .promise_list .body dl .row dt {
    display: flex;
    align-items: baseline;
    justify-content: center;
    grid-gap: .25rem;
    padding-right: .5rem;
    position: relative;
    margin: 0 auto;
  }
  .promise .promise_list .body dl .row dt::after {
    content: "";
    display: inline-block;
    width: 80%;
    height: 100%;
    border: #6fb92c 3px solid;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
  }
  .promise .promise_list .body dl .row dt figure {
    width: 2.5em;
    background-color: #6fb92c;
    border-radius: 100%;
    aspect-ratio: 1/1;
    padding: .25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
  }
  .promise .promise_list .body dl .row dt .txt {
    font-size: 18px;
    font-weight: bold;
    color: #6fb92c;
  }
  .promise .promise_list .body dl .row dt .num {
    font-size: 28px;
    color: #6fb92c;
    font-weight: bold;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  }
  .promise .promise_list .body dl .row dd {
    width: 100%;
    font-size: clamp(1rem, 0.852rem + 0.45vw, 1.25rem);/*16~20px,16~48px(520~1400px)*/
  }
}