/* 折り返し表示調整用
=========================================================================================== */
.br_block {
  display: inline-block;
}

/* チェックマークアイコン */
.check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #004CCA;
    border-radius: 50%;
    color: white;
    font-weight: bold;
    font-size: 16px;
}

.check-icon:before {
    content: "\2713"
}

#mv a.site_download_btn {
    padding: 20px
}

.mv_main_text .title_box {
    display: inline-block;
    font-size: 32px;
    color: #005386;
    border: 1px solid #005386;
    padding: 10px;
    margin: 0 auto 20px;
}

#mv .text_box.herf {
    display: block;
    width: 50vw;
    text-align: center;
}

#mv p.sub_text2 {
    font-size: 18px;
    font-weight: 600;
    position: relative;
    display: inline-block;
    letter-spacing: .25em;
}

#mv p.sub_text3 {
    font-size: 28px;
    font-weight: 600;
    position: relative;
    display: inline-block;
    letter-spacing: 0em;
    color: #005386
}

#mv .Hi-PerBT_box .flex {
    justify-content: space-evenly;
}

#mv p.sub_text4 {
    font-size: 16px;
    position: relative;
    display: inline-block;
    letter-spacing: .1em;
    margin: 25px;
}


/* お悩み PC */
#problem {
    padding: 149px 0px 60px;
    position: relative;
}

#problem .site_cmn_ttl_box {
    text-align: center;
}

.problem_slider_box {
    padding: 0 0 50px;
    margin-top: 15px;
}

.problem_slider_box ul {
    display: block;
    margin: 0 25% 30px;
}

.site_cmn_ttl_box h2.sub_ttl.problem {
    margin-top: 20px;
}

.site_cmn_ttl_box p.sub_ttl.problem {
    font-size: 24px;
    margin-top: 20px;
    letter-spacing: 0.1em;
}


ul.problem_slider li {
    background: #fff;
    padding: 5px;
}

ul.problem_slider li span {
    margin-right: 5px;
}

div.problem_flame {
    display: inline-block;
}

ul.problem_slider .text_box {
    padding-top: 20px;
    font-weight: 600;
    letter-spacing: 0.08em;
}

.problem_slider_box .sub_ttl2 {
  text-align: center;
  font-size: 18px;
  background-color: #E5F5FF;
  margin: 20px 20%;
  padding: 10px;
}

.problem_slider_box .sub_ttl3 {
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  margin: 10px 20%;
  padding: 10px;
}

.problem_slider_box .sub_ttl4 {
  text-align: center;
  font-size: 18px;
  margin: 10px 20%;
  padding: 10px;
}

.problem_flow_box {
    display: inline-block;
    text-align: center;
}

.problem_flow img.top {
  vertical-align: top;
}

.problem_flow img {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
}

/* 実現 PC */
#implement {
    padding: 20px 0px 60px;
    position: relative;
}

.implement_flow_box {
    text-align: center;
    margin: 30px auto;
}
.implement_flow_box .flex-sb {
    justify-content: space-evenly;
}

.problem_flow_box img.conts {
    width: 25%;
}

@media (max-width: 1150px) {
    #mv .text_box.herf {
        width: 50vw;
    }

}


.site_cmn_ttl_box h2.sub_ttl.implement {
    text-align: center;
    margin-top: 20px;
}

.site_cmn_ttl_box p.sub_ttl.implement {
    text-align: center;
    font-size: 24px;
    margin-top: 20px;
    letter-spacing: 0.1em;
}

.site_cmn_ttl_box .sub_ttl2.implement {
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  color: #005386;
  margin: 10px 20%;
  padding: 10px;
}

.site_cmn_ttl_box .sub_ttl3.implement {
  text-align: center;
  font-size: 18px;
  margin: 10px 20%;
  padding: 10px;
}


@media (min-width: 1150px) {
    #mv .text_box.herf {
        width: 575px;
    }

}

@media (max-width: 1120px) {

}

@media screen and (max-width: 767px) {
    .wrap {
        overflow: visible;
    }
    #mv p.sub_text2 {
        margin: 0 10vw;
    }

}

@media (max-width: 750px) {
    #mv .text_box.herf {
        width: 100vw;
        text-align: center;
    }

    #mv p.sub_text2 {
        margin: 0 10vw;
    }

    .problem_slider_box ul {
        display: block;
        margin: 0 10vw 30px;
    }
    .problem_slider_box .sub_ttl2,
    .problem_slider_box .sub_ttl3,
    .problem_slider_box .sub_ttl4 {
        margin: 10px 5vw;
    }

    .problem_flow_box {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
        text-align: center;
    }

    .problem_flow {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .problem_flow_box img.conts {
        width: 75%;
    }

    .problem_flow_box img.allow {
        transform: rotate(90deg);
    }

    .site_cmn_ttl_box .sub_ttl2.implement,
    .site_cmn_ttl_box .sub_ttl3.implement {
        margin: 10px 5vw;
    }

}