html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}
body {
    line-height: 1
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}
nav ul {
    list-style: none
}
blockquote, q {
    quotes: none
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none
}
a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}
ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none
}
mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold
}
del {
    text-decoration: line-through
}
abbr[title], dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0
}
input, select {
    vertical-align: middle
}
*, *::before, *::after {
    box-sizing: border-box
}
a, area, button, [role="button"], input:not([type="range"]), label, select, summary, textarea {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}
html {
    font-size: 1.8vw
}
@media screen and (min-width: 1000px) {
    html {
        font-size: 18px
    }
}
@media screen and (max-width: 768px) {
    html {
        font-size: 3.86vw
    }
}
body {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    font-style: normal
}
body a {
    color: inherit;
    text-decoration: none
}
body img {
    width: 100%;
    height: auto;
    vertical-align: bottom
}
body em {
    font-style: normal
}
body li {
    list-style: none
}
body h1, body h2, body h3, body h4, body h5, body h6 {
    font-weight: inherit
}
.wrap {
    background: #fff;
    width: 100%;
    color: #000
}
.wrap {
    overflow: hidden
}
.wrap img {
    width: 100%;
    height: auto
}
.wrap .number {
    font-family: Oswald, sans-serif;
    font-weight: 500
}
.wrap .pc {
    display: block
}
.wrap .sp {
    display: none
}
@media screen and (max-width: 768px) {
    .wrap .sp {
        display: block
    }
    .wrap .pc {
        display: none
    }
}
.header {
    background: #fff;
    width: 100%;
    color: #000;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000
}
.header__inner {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between
}
.header__heading {
    width: 10%
}
.header__button {
    max-width: calc(18rem + 14rem * 2);
    display: grid;
    grid-template-columns: 1.29fr 1fr 1fr;
    width: 100%
}
.header__button-item a {
    width: 100%;
    height: 100%;
    color: white;
    display: block;
    position: relative;
    text-align: center;
    font-weight: 700
}
.header__button-item a::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 1rem;
    background-size: 100%;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat
}
.header__button-item01 a {
    font-size: .8rem;
    font-weight: 500;
    padding: .5rem 0 .5rem 1rem;
    background: #ff5c4b
}
.header__button-item01 a .number {
    font-size: 2rem
}
.header__button-item01 a::before {
    background-image: url("../images/icon_call.svg")
}
.header__button-item02 a, .header__button-item03 a {
    padding: 1.3rem 0 1.3rem .8rem;
    font-size: 1.2rem
}
.header__button-item02 a {
    background: #006bc6
}
.header__button-item02 a::before {
    background-image: url("../images/icon_mail.svg")
}
.header__button-item03 a {
    background: #06c755
}
.header__button-item03 a::before {
    background-image: url("../images/icon_line.svg")
}
@media screen and (max-width: 768px) {
    .header__heading {
        width: 42%;
        margin: 0 auto
    }
    .header__button {
        display: none
    }
}
.visual {
    background-color: #007fde;
    background-image: url("../images/visual-pc.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
    overflow: hidden
}
.visual__inner {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto;
    max-width: 1080px;
    padding: 1.5rem 0 2.5rem;
    position: relative
}
.visual .imgflame {
    display: block;
    width: 100%;
    height: 100%
}
.visual .imgflame img {
    object-fit: cover;
    height: 100%;
    width: 100%
}
.visual__main {
    width: 100%;
    max-width: 983px;
    position: relative
}
.visual__person {
    width: 59.074vw;
    max-width: 638px;
    position: absolute;
    top: 1rem;
    right: -270px;
    bottom: 0;
    z-index: 0
}
.visual__person .imgflame img {
    object-fit: contain
}
@media screen and (max-width: 1200px) {
    .visual__main {
        width: 81.917vw
    }
}
@media screen and (max-width: 1200px) and (min-width: 769px) {
    .visual__person {
        width: 53.167vw;
        max-width: initial;
        right: -23.083vw
    }
}
@media screen and (max-width: 768px) {
    .visual {
        background-image: url("../images/visual.webp");
        background-position: center
    }
    .visual__inner {
        padding: 1rem 0;
        margin: 3rem auto 0
    }
    .visual__main {
        width: 100%
    }
    .visual__main .imgflame {
        width: 105%
    }
    .visual__person {
        width: 71vw;
        max-width: 748.8px;
        top: initial;
        right: -31.65vw;
        bottom: 0;
        z-index: 1
    }
}
.contents {
    background: transparent;
    color: #000
}
.contents .video, .contents .map {
    width: 100%;
    max-width: 1000px;
    height: 0;
    margin: 0 auto;
    padding-top: 56.25%;
    position: relative;
    overflow: hidden
}
.contents .video iframe, .contents .map iframe {
    width: 100% !important;
    height: 100% !important;
    position: absolute;
    top: 0;
    left: 0
}
.cv {
    background-color: #0045c5;
    background-image: linear-gradient(70deg, #0045c5, #2873d6, #0045c5);
    padding: 4rem 0;
    color: white;
    text-align: center
}
.cv.first {
    padding: 2rem 0 4rem
}
.cv__inner {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto
}
.cv__text {
    font-weight: 900;
    line-height: 2em;
    font-size: 1.8rem
}
.cv__text .white {
    padding: .4em 1rem .6em;
    line-height: 1em;
    letter-spacing: .1em;
    border: 2px solid white;
    display: inline-block
}
.cv__text .medium {
    vertical-align: sub;
    font-size: 2.7rem
}
.cv__text .zero {
    vertical-align: sub;
    font-size: 3.3rem
}
.cv__text .yellow {
    color: #ffff23
}
.cv__text .date {
    font-size: 2.2rem
}
.cv__note {
    margin: 1rem 0 .5rem
}
.cv__button {
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.4))
}
@media screen and (max-width: 768px) {
    .cv__button {
        filter: drop-shadow(0 4px 5px rgba(0, 0, 0, 0.4))
    }
}
.cv__button01 {
    margin: 0 auto;
    width: 40%
}
.cv__button01 a {
    background: #ff5c4b;
    padding: 1.3rem 0 1.3rem 1rem;
    border-radius: 50px;
    font-size: 1.2rem;
    font-weight: 700;
    display: block;
    position: relative
}
.cv__button01 a .number {
    font-size: 2rem
}
.cv__button01 a::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 3rem;
    background-size: 100%;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-image: url("../images/icon_call.svg")
}
.cv__button02 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66%;
    margin: 0 auto
}
.cv__button02-item {
    width: 50%;
    margin: 1rem .5rem
}
.cv__button02-item01 a, .cv__button02-item02 a {
    font-weight: 700;
    display: block;
    padding: 1.3rem 0 1.3rem 1rem;
    font-size: 1.2rem;
    border-radius: 50px;
    position: relative
}
.cv__button02-item01 a::before, .cv__button02-item02 a::before {
    background-repeat: no-repeat;
    background-size: 100%;
    width: 2rem;
    height: 2rem;
    content: '';
    position: absolute;
    left: 3rem;
    top: 0;
    bottom: 0;
    margin: auto
}
.cv__button02-item01 a {
    background: white;
    color: #006bc6
}
.cv__button02-item01 a::before {
    background-image: url("../images/icon_mail_b.svg")
}
.cv__button02-item02 a {
    background: #06c755
}
.cv__button02-item02 a::before {
    background-image: url("../images/icon_line.svg")
}
.cv__image {
    width: 80%;
    margin: 0 auto
}
.cv__image .tel {
    width: 100%;
    height: 100%;
    display: block;
    transition: all .5s
}
.cv__image .tel:hover {
    transform: translateY(-5px);
    transition: all .5s;
    filter: brightness(0.95)
}
@media screen and (max-width: 1100px) {
    .cv__button01 a::before {
        left: 2rem
    }
    .cv__button02-item01 a::before {
        left: 2.5rem
    }
}
@media screen and (max-width: 768px) {
    .cv {
        padding: 2rem 0
    }
    .cv.first {
        padding: .7rem 0 2rem
    }
    .cv__text {
        font-size: 6vw;
        line-height: 1.5em
    }
    .cv__text .white {
        margin: 0 auto .5em;
        padding: .5em 1rem
    }
    .cv__text .medium {
        font-size: 8vw
    }
    .cv__text .zero {
        font-size: 9vw
    }
    .cv__text .date {
        font-size: 8vw
    }
    .cv__button01 {
        margin: 0 auto;
        width: 100%
    }
    .cv__button01 a .number {
        font-size: 8vw
    }
    .cv__button01 a::before {
        left: 3rem;
        width: 8vw;
        height: 8vw
    }
    .cv__button02 {
        width: 100%;
        justify-content: space-between
    }
    .cv__button02-item {
        width: 48%;
        margin: 1rem auto
    }
    .cv__button02-item01 a, .cv__button02-item02 a {
        font-size: 4.2vw
    }
    .cv__button02-item01 a::before, .cv__button02-item02 a::before {
        width: 6vw;
        height: 6vw;
        left: 1rem
    }
    .cv__image {
        width: 100%
    }
}
.promise, .reason, .area, .voice, .faq, .flow, .contact {
    padding: 4rem 0
}
@media screen and (max-width: 768px) {
    .promise, .reason, .area, .voice, .faq, .flow, .contact {
        padding: 8vw 0
    }
}
.promise__inner, .reason__inner, .area__inner, .voice__inner, .faq__inner, .flow__inner, .contact__inner {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto
}
.promise__heading, .reason__heading, .area__heading, .voice__heading, .faq__heading, .flow__heading, .contact__heading {
    text-align: center;
    font-size: 2.8rem;
    font-weight: 900;
    letter-spacing: .06em
}
.promise__heading .blue, .reason__heading .blue, .area__heading .blue, .voice__heading .blue, .faq__heading .blue, .flow__heading .blue, .contact__heading .blue {
    color: #007fde
}
.promise__heading .number, .reason__heading .number, .area__heading .number, .voice__heading .number, .faq__heading .number, .flow__heading .number, .contact__heading .number {
    font-size: 3.2rem
}
.promise__heading-sub, .reason__heading-sub, .area__heading-sub, .voice__heading-sub, .faq__heading-sub, .flow__heading-sub, .contact__heading-sub {
    display: flex;
    justify-content: center;
    position: relative;
    max-width: 38%;
    margin: 0 auto;
    align-items: center;
    margin-bottom: 1rem;
    padding: .8rem;
    border-radius: 50px;
    background-color: #007fde;
    color: white;
    font-size: 1.5rem;
    font-weight: 700;
    vertical-align: baseline
}
.promise__heading-sub .number, .reason__heading-sub .number, .area__heading-sub .number, .voice__heading-sub .number, .faq__heading-sub .number, .flow__heading-sub .number, .contact__heading-sub .number {
    font-size: 1.8rem
}
.promise__heading-sub::before, .reason__heading-sub::before, .area__heading-sub::before, .voice__heading-sub::before, .faq__heading-sub::before, .flow__heading-sub::before, .contact__heading-sub::before {
    position: absolute;
    bottom: -13px;
    width: 30px;
    height: 15px;
    background-color: #007fde;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: ''
}
.promise__text, .reason__text, .area__text, .voice__text, .faq__text, .flow__text, .contact__text {
    line-height: 1.8em;
    text-align: justify
}
.promise__image, .reason__image, .area__image, .voice__image, .faq__image, .flow__image, .contact__image {
    text-align: center
}
@media screen and (max-width: 768px) {
    .promise__heading, .reason__heading, .area__heading, .voice__heading, .faq__heading, .flow__heading, .contact__heading {
        font-size: 6.5vw
    }
    .promise__heading .number, .reason__heading .number, .area__heading .number, .voice__heading .number, .faq__heading .number, .flow__heading .number, .contact__heading .number {
        font-size: 8vw
    }
    .promise__heading-sub, .reason__heading-sub, .area__heading-sub, .voice__heading-sub, .faq__heading-sub, .flow__heading-sub, .contact__heading-sub {
        max-width: 80%;
        padding: .5rem;
        font-size: 4.2vw
    }
    .promise__heading-sub .number, .reason__heading-sub .number, .area__heading-sub .number, .voice__heading-sub .number, .faq__heading-sub .number, .flow__heading-sub .number, .contact__heading-sub .number {
        font-size: 5.5vw
    }
    .promise__heading-sub::before, .reason__heading-sub::before, .area__heading-sub::before, .voice__heading-sub::before, .faq__heading-sub::before, .flow__heading-sub::before, .contact__heading-sub::before {
        bottom: -8px;
        width: 20px;
        height: 12px
    }
}
.promise {
    background: #e5f2fc;
    background-image: url("../images/promise_top-pc.webp"), url("../images/promise_bottom-pc.webp");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top, bottom
}
.promise__heading {
    width: 76%;
    margin: 0 auto
}
.promise__top {
    display: flex;
    align-items: center;
    justify-content: space-between
}
.promise__top .image {
    width: 20%
}
.promise__top .text {
    width: 78%;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.5em;
    letter-spacing: .02em
}
.promise__top .text .number {
    font-size: 2rem;
    letter-spacing: .1em
}
.promise__top .text .marker {
    background: linear-gradient(transparent 80%, #ffff23 80%)
}
.promise__logo {
    background: white;
	border-radius: 20px;
	border: 2px solid black;
    padding: 1.45rem 0
}
.promise__logo .text {
    text-align: center;
    font-weight: 700;
    font-size: 1.6rem
}
.promise__logo .orange {
    font-size: 2rem;
    color: #ff5c4b
}
.promise__logo .list {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 70%;
    margin: 0 auto;
	flex-flow: wrap;
    padding: 1rem
}
.promise__logo .list-item {
    width: calc((100% - 4rem) /3)
}
.promise__logo .list-item04 {
   width: 94%;
    margin: .5rem auto 0;
}
.promise__text {
    text-align: center;
    font-weight: 500;
    font-size: 1.6rem;
    padding: 2rem 0 1rem
}
.promise__bottom {
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.8em;
    padding: 2rem 0 0
}
.promise__bottom img {
    width: 30%
}
.promise__image {
    width: 60%;
    margin: 0 auto
}
.promise .slide {
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.4));
    margin: 0 0 4rem
}
@media screen and (max-width: 768px) {
    .promise .slide {
        filter: drop-shadow(0 4px 5px rgba(0, 0, 0, 0.4))
    }
}
.promise .slide .box {
    background: white;
    max-width: 900px;
    margin: 0 auto 1rem;
    padding: 2rem 3rem 2.5rem;
    border-radius: 20px;
    position: relative
}
.promise .slide .box .recommend {
    background-color: #ff5c4b;
    padding: .5em 4em;
    line-height: 1.4em;
    color: white;
    font-size: .88rem;
    font-weight: 700;
    text-align: center;
    position: absolute;
    top: 1em;
    left: -3.1em;
    clip-path: polygon(3.8em 0, calc(100% - 3.8em) 0, 100% 100%, 0 100%);
    transform: rotate(-45deg)
}
.promise .slide .box .logo {
    width: 20%;
    margin: 0 auto
}
.promise .slide .box .list {
    margin: .5rem 0 0;
    font-size: 1.2rem;
    color: white;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-flow: wrap
}
.promise .slide .box .list::after {
    content: '';
    display: block;
    width: calc((100% - 2rem) / 4)
}
.promise .slide .box .list-item {
    background: #007fde;
    border-radius: 10px;
    width: calc((100% - 2rem) /4);
    padding: 1rem 0;
    margin: 0 0 10px
}
.promise .slide .box .list-item .small {
    font-size: .8rem
}
.promise .slide .box .image {
    margin: 0 auto;
    width: 90%
}
.promise .slide .swiper-slide {
    height: auto;
    margin: 0 0 2rem
}
.promise .slide .swiper-button-next, .promise .slide .swiper-button-prev {
    top: -10%;
    bottom: 0;
    margin: auto;
    opacity: .6;
    transition: all .2s ease-in-out;
    cursor: pointer
}
.promise .slide .swiper-button-next {
    right: 1.75rem
}
.promise .slide .swiper-button-prev {
    left: 1.75rem
}
.promise .slide .swiper-pagination {
    margin: 0 auto;
    right: 0;
    left: 0
}
.promise .ctabtns {
    margin-top: 1rem
}
.promise .cv__button {
    color: white;
    text-align: center
}
.promise .cv__button01 {
    width: 100%;
    max-width: 400px
}
.promise .cv__button02 {
    width: 90%
}
.promise .cv__button02-item {
    width: 100%;
    max-width: 312px
}
.promise .cv__button02-item a {
    width: 100%
}

.promise .box {
	display: grid;
	grid-template-columns: repeat(3,1fr);
	grid-gap: 2rem;
}
.promise .box .box-item {
	background: white;
	border-radius: 10px;
}
.promise .box .box-item .head {
	background: #006bc6;
	color: white;
	font-size: 1.2em;
    border-radius: 10px 10px 0 0;
    text-align: center;
    padding: .75em 0;
    font-weight: 700;
}
.promise .box .box-item .list {
	font-size: .9em;
	display: grid;
	grid-gap: 1em;
	width: fit-content;
    margin: 0 auto;
    padding: 1rem 0;
}
.promise .box .box-item .list .list-item {
	position: relative;
	padding-left: 1.25em;
    font-weight: 500;
}
.promise .box .box-item .list .list-item::before {
	content: '';
    position: absolute;
    left: 0;
    background-size: 100%;
    width: 1em;
    aspect-ratio: 1/ 1;
    background-repeat: no-repeat;
	background-image: url("../images/icon_trouble.svg")
}
@media screen and (max-width: 768px) {
    .promise {
        background-image: url("../images/promise_top.webp"), url("../images/promise_bottom.webp");
    }
    .promise__heading {
        width: 100%
    }
    .promise__top {
        margin: 2rem 0 0
    }
    .promise__top .image {
        width: 28%
    }
    .promise__top .text {
        width: 70%;
        font-size: 4vw;
        line-height: 1.8em
    }
    .promise__top .text .number {
        font-size: 4.5vw
    }
    .promise__logo {
        padding: 1rem 0 .5rem
    }
    .promise__logo .text {
        font-size: 4vw
    }
    .promise__logo .orange {
        font-size: 4.5vw
    }
    .promise__logo .list {
        width: 90%;
    }
    .promise__logo .list-item {
        width: calc((100% - 2rem) /3)
    }
	.promise__logo .list-item04 {
    width: 96%;
	margin: 2vw auto 0
}
    .promise__text {
        font-size: 4vw;
        padding: .5rem 0 1rem
    }
    .promise__bottom {
        font-size: 4.5vw;
        padding: 2rem 0 0
    }
    .promise__bottom img {
        width: 50%
    }
    .promise__image {
        width: 80%
    }
    .promise .slide {
        margin: 0 0 2rem
    }
    .promise .slide .box {
        padding: 1rem;
        margin: 0 1rem 1rem
    }
    .promise .slide .box .recommend {
        font-size: .5rem
    }
    .promise .slide .box .logo {
        width: 36%
    }
    .promise .slide .box .list {
        font-size: 3vw
    }
    .promise .slide .box .list::after {
        display: none
    }
    .promise .slide .box .list-item {
        width: calc((100% - 1rem) /3);
        padding: .5rem 0;
        margin: 0 0 5px;
        border-radius: 6px
    }
    .promise .slide .box .list-item .small {
        font-size: 3vw
    }
    .promise .slide .box .list-item07 {
        width: 100%
    }
    .promise .slide .swiper-slide {
        margin: 0 0 1rem
    }
    .promise .slide .swiper-button-prev, .promise .slide .swiper-button-next {
        width: 1.5rem;
        height: 1.5rem
    }
    .promise .slide .swiper-button-next {
        right: 0
    }
    .promise .slide .swiper-button-prev {
        left: 0
    }
    .promise .slide .swiper-pagination-bullet {
        width: 12px;
        height: 12px
    }
    .promise .cv__button01 {
        max-width: 100%
    }
    .promise .cv__button01 a {
        padding: 1rem 0 1rem 1rem
    }
    .promise .cv__button02 {
        width: 100%
    }
    .promise .cv__button02-item {
        max-width: 100%;
        width: 48%
    }
    .promise .cv__button02-item a {
        font-size: 4vw;
        padding: 1rem 0 1rem 1.25rem
    }
    .promise .cv__button02-item a::before {
        width: 5vw;
        height: 5vw;
        left: .75rem
    }
	.promise .box {
		grid-template-columns: repeat(2,1fr);
		grid-gap: 1rem;
	}
	.promise .box .box-item .list {
		line-height: 1.3;
		grid-gap: .75em;
		padding: 1rem .75rem
	}
	.promise .box .box-item .list .list-item::before {
		top: .25em
	}
}
.reason {
    position: relative;
    padding: 5rem 0 4rem
}
.reason::before {
    position: absolute;
    content: 'REASON';
    color: #d9ecfa;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: .5rem;
    left: 50%;
    transform: translateX(-50%)
}
.reason__box {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    flex-flow: wrap;
    padding: 2rem 0 0
}
.reason__box-item {
    width: calc((100% - 1rem)/2);
    border: 3px solid #006bc6;
    margin: 0 0 1rem;
    position: relative;
    padding: .25rem
}
.reason__box-item .number {
    width: 20%
}
.reason__box-item .head {
    text-align: center;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.3em;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 2rem;
    width: 100%
}
.reason__box-item04 .head {
    top: 3rem
}
.reason__box-item .marker {
    background: linear-gradient(transparent 80%, #ffff23 80%);
    color: #007fde
}
.reason__box-item .image {
    padding: 4rem 3rem 1.5rem
}
.reason__box-item .text {
    padding: 0 3rem 2rem;
    text-align: justify;
    line-height: 1.5em
}
@media screen and (max-width: 768px) {
    .reason {
        padding: 5rem 0 4rem
    }
    .reason::before {
        font-size: 12vw;
        top: 2rem
    }
    .reason__box {
        display: block;
        padding: 2rem 0 0
    }
    .reason__box-item {
        width: 100%
    }
    .reason__box-item .number {
        width: 26%
    }
    .reason__box-item .head {
        font-size: 5vw;
        top: 3rem
    }
    .reason__box-item04 .head {
        top: 4rem
    }
    .reason__box-item .image {
        padding: 3.5rem 2rem 1.5rem
    }
    .reason__box-item .text {
        padding: 0 2rem 2rem
    }
}
.area {
    position: relative;
    padding: 5rem 0 4rem;
    background-image: url("../images/area_map.svg");
    background-repeat: no-repeat;
    background-size: 46%;
    background-position: 50% calc(100% - 2rem)
}
.area::before {
    position: absolute;
    content: 'AREA';
    color: #d9ecfa;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: 1.5rem;
    left: 50%;
    transform: translateX(-50%)
}
.area__heading {
    position: relative;
    z-index: 2
}
.area__text {
    font-size: 1.2rem;
    font-weight: 700;
    padding: 5rem 0 25rem 2rem
}
.area__text .marker {
    font-weight: 900;
    font-size: 1.5rem;
    background: linear-gradient(transparent 80%, #ffff23 80%);
    color: #007fde
}
@media screen and (max-width: 768px) {
    .area {
        padding: 5rem 0 2rem;
        background-size: 90% auto
    }
    .area::before {
        font-size: 12vw;
        top: 2.5rem
    }
    .area__text {
        font-size: 4vw;
        text-align: center;
        padding: 1rem 0 16rem
    }
    .area__text .marker {
        font-size: 4.5vw
    }
}
.voice {
    background: #007fde;
    position: relative;
    padding: 7rem 0 4rem
}
.voice::before {
    position: absolute;
    content: 'VOICE';
    color: #2692e3;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: 3.5rem;
    left: 50%;
    transform: translateX(-50%)
}
.voice__heading {
    position: relative;
    z-index: 2;
    color: white
}
.voice__box {
    padding: 2rem 0 0
}
.voice__box-item {
    background: white;
    border-radius: 20px;
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.4));
    padding: 3rem 4rem;
    margin: 0 0 2rem
}
@media screen and (max-width: 768px) {
    .voice__box-item {
        filter: drop-shadow(0 4px 5px rgba(0, 0, 0, 0.4))
    }
}
.voice__box-item .prof {
    display: flex;
    align-items: center;
    justify-content: flex-start
}
.voice__box-item .prof img {
    border-radius: 50%
}
.voice__box-item .prof .image {
    width: 14%
}
.voice__box-item .prof .body {
    width: 86%;
    padding: 0 0 0 1rem;
    line-height: 2em
}
.voice__box-item .prof .body .detail {
    background: #007fde;
    border-radius: 4px;
    color: white;
    padding: 0 2rem;
    display: inline
}
.voice__box-item .head {
    font-size: 1.5rem;
    color: #007fde;
    font-weight: 900;
    padding: 1.5rem 0
}
.voice__box-item .text {
    text-align: justify;
    line-height: 1.5em
}
@media screen and (max-width: 768px) {
    .voice {
        padding: 5rem 0 4rem
    }
    .voice::before {
        font-size: 12vw;
        top: 2.5rem
    }
    .voice__box {
        padding: 2rem 0 0
    }
    .voice__box-item {
        padding: 2rem 1rem;
        margin: 0 0 1rem
    }
    .voice__box-item .prof {
        font-size: 3.4vw
    }
    .voice__box-item .prof .image {
        width: 32%
    }
    .voice__box-item .prof .body {
        width: 68%;
        padding: 0 0 0 .5rem
    }
    .voice__box-item .prof .body .detail {
        padding: 0 0.5rem
    }
    .voice__box-item .head {
        font-size: 5vw;
        line-height: 1.5em;
        padding: 1rem 0
    }
    .voice__box-item .text {
        text-align: justify;
        line-height: 1.5em
    }
}
.faq {
    background: #d9ecfa;
    position: relative;
    padding: 7rem 0 4rem
}
.faq::before {
    position: absolute;
    content: 'Q&A';
    color: #c3e1f7;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: 3.5rem;
    left: 50%;
    transform: translateX(-50%)
}
.faq__heading {
    position: relative;
    z-index: 2;
    margin: 0 0 2rem
}
.faq .accordion {
    max-width: 800px;
    margin: .5rem auto
}
.faq .accordion .icon-q, .faq .accordion .icon-a {
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 2rem
}
.faq .accordion .icon-q {
    position: relative
}
.faq .accordion .icon-q::before {
    position: absolute;
    content: '';
    background: white;
    width: 1px;
    height: 4rem;
    right: -1rem;
    bottom: -1rem
}
.faq .accordion .head, .faq .accordion .text {
    padding: 0 0 0 2rem
}
.faq .accordion .icon-a {
    color: #007fde
}
.faq .accordion .text {
    line-height: 1.5em;
    text-align: justify
}
.faq .accordion:not([open]) {
    margin-bottom: .5rem
}
.faq .accordion summary {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    padding: 1rem;
    background: #007fde;
    color: white;
    font-weight: 700;
    cursor: pointer
}
.faq .accordion summary::-webkit-details-marker {
    display: none
}
.faq .accordion summary::before, .faq .accordion summary::after {
    width: 3px;
    height: .9em;
    border-radius: 5px;
    background-color: white;
    content: ''
}
.faq .accordion summary::before {
    position: absolute;
    right: 2rem;
    rotate: 90deg
}
.faq .accordion summary::after {
    transition: rotate .3s;
    position: absolute;
    right: 2rem
}
.faq .accordion[open] summary::after {
    rotate: 90deg
}
.faq .accordion div {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 1rem;
    transition: transform .5s, opacity .5s
}
.faq .accordion[open] div {
    transform: none;
    opacity: 1
}
.faq .answer {
    display: flex;
    justify-content: flex-start
}
.faq .answer .icon {
    font-weight: 700;
    color: #006bc6;
    margin: 0 .3rem 0 0
}
@media screen and (max-width: 768px) {
    .faq {
        padding: 5rem 0 4rem
    }
    .faq::before {
        font-size: 12vw;
        top: 2.5rem
    }
    .faq .accordion .icon-q, .faq .accordion .icon-a {
        font-size: 7vw
    }
    .faq .accordion .icon-q::before {
        height: 4.56rem;
        bottom: -1.6rem
    }
    .faq .accordion summary {
        padding: 1rem 3rem 1rem 1rem;
        line-height: 1.3em
    }
}
.flow {
    position: relative;
    padding: 7rem 0 4rem
}
.flow::before {
    position: absolute;
    content: 'STEP';
    color: #d9ecfa;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: 2.5rem;
    left: 50%;
    transform: translateX(-50%)
}
.flow__heading {
    position: relative;
    z-index: 2;
    margin: 0 0 2rem
}
.flow__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 0
}
.flow__box01 .number, .flow__box02 .number {
    color: #3eaeef
}
.flow__box03 .number, .flow__box04 .number {
    color: #006bc6
}
.flow__box-item .head {
    font-size: 1.6rem;
    font-weight: 700;
    padding: 0 0 1rem;
    border-bottom: 2px solid #3eaeef
}
.flow__box-item .head .free {
    background: #ff5c4b;
    color: white;
    border-radius: 50px;
    font-size: 1rem;
    padding: 0 1rem;
    font-weight: 600;
    line-height: 0;
    vertical-align: middle;
    margin: .5rem
}
.flow__box-item .text {
    font-weight: 600;
    padding: 1rem 0 0;
    line-height: 1.5em
}
.flow__box-item .text02 {
	text-align: center;
    font-size: 1.2rem
}
.flow__box-item .credit {
    width: 60%;
    margin: 2rem auto 0
}
.flow__box-item .marker {
    background: linear-gradient(transparent 80%, #ffff23 80%)
}
.flow__box-item01 {
    width: 10%;
    text-align: center
}
.flow__box-item01 .image {
    margin: 0 0 .25rem
}
.flow__box-item02 {
    width: 86%
}
.flow__note {
    display: flex;
    justify-content: center;
    position: relative;
    max-width: 100%;
    margin: 1rem auto;
    align-items: center;
    margin-bottom: 1rem;
    padding: .8rem;
    border-radius: 10px;
    background-color: #ff5c4b;
    color: white;
    font-size: 1.2rem;
    font-weight: 700;
    vertical-align: baseline
}
.flow__note::before {
    position: absolute;
    bottom: -20px;
    width: 30px;
    height: 15px;
    background-color: #ff5c4b;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: ''
}
@media screen and (max-width: 768px) {
    .flow {
        padding: 5rem 0 4rem
    }
    .flow::before {
        font-size: 12vw;
        top: 2.5rem
    }
    .flow__heading {
        margin: 0
    }
    .flow__box {
        display: block;
        padding: 2rem 2rem 0
    }
    .flow__box-item .head {
        font-size: 5vw;
        text-align: center;
        padding: .5rem 0 1rem
    }
    .flow__box-item .head .free {
        font-size: 3.5vw
    }
    .flow__box-item .text02 {
        font-size: 4vw
    }
    .flow__box-item .credit {
        width: 100%
    }
    .flow__box-item01 {
        width: 30%;
        text-align: center;
        margin: 0 auto
    }
    .flow__box-item01 .image {
        margin: 0 0 .5rem
    }
    .flow__box-item02 {
        width: 100%
    }
    .flow__note {
        text-align: center;
        font-size: 4vw;
        line-height: 1.3em;
        width: 84%;
        margin: 2rem auto
    }
}
.contact {
    background: #d9ecfa;
    position: relative;
    padding: 7rem 0 4rem
}
.contact::before {
    position: absolute;
    content: 'CONTACT';
    color: #c3e1f7;
    font-family: Oswald, sans-serif;
    font-weight: 500;
    font-size: 5rem;
    letter-spacing: .1em;
    top: 2.5rem;
    left: 50%;
    transform: translateX(-50%)
}
.contact__inner {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto
}
.contact__heading {
    position: relative;
    z-index: 2
}
.contact__heading-sub {
    max-width: 46%
}
.contact__text {
    line-height: 1.8em;
    text-align: justify
}
@media screen and (max-width: 768px) {
    .contact {
        padding: 5rem 0 4rem
    }
    .contact::before {
        font-size: 12vw;
        top: 2rem
    }
    .contact__heading-sub {
        max-width: 86%
    }
}
.footer {
    background: #fff;
    color: #000
}
.footer__inner {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto
}
.footer__company {
    margin: 0 auto 2rem
}
.footer__company .head {
    width: 30%;
    margin: 2rem auto 1rem
}
.footer__company .text {
    text-align: center;
    font-weight: 700
}
.footer__company .list {
    margin: 2rem auto 0;
    max-width: 700px
}
.footer__company .list-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: .5rem 0;
    margin: .5rem 0
}
.footer__company .list-item::before {
    position: absolute;
    content: '';
    background: #007fde;
    left: 0;
    width: 2px;
    height: 100%
}
.footer__company .list .head {
    margin: 0;
    padding: 0 0 0 1rem;
    color: #007fde;
    font-weight: 700;
    width: 8rem
}
.footer__company .list .body {
    line-height: 1.5em;
    font-weight: 600
}
@media screen and (max-width: 768px) {
    .footer__company .head {
        width: 60%
    }
    .footer__company .list .head {
        width: 32%
    }
    .footer__company .list .body {
        font-size: 3.5vw
    }
}
.copyright {
    background: black;
    color: white;
    padding: 1rem 0
}
.copyright__text {
    width: 90vw;
    max-width: 1000px;
    margin: 0 auto;
    line-height: 1.8em;
    text-align: center
}
@media screen and (max-width: 768px) {
    .copyright {
        font-size: 3vw;
        padding: 1rem 0 7rem
    }
}
.floating {
    display: none;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000
}
.floating__button {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 2fr
}
.floating__button-item a {
    width: 100%;
    height: 100%;
    color: white;
    display: block;
    position: relative;
    text-align: center;
    font-weight: 700
}
.floating__button-item a::before {
    content: '';
    position: absolute;
    top: -1rem;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-size: 100%;
    width: 10vw;
    height: 10vw;
    background-repeat: no-repeat
}
.floating__button-item01 a {
    background: #ff5c4b;
    font-size: 3vw;
    padding: 1.7rem 0 1rem
}
.floating__button-item01 a .number {
    font-size: 6vw
}
.floating__button-item01 a .tel {
    line-height: 1.4em;
    font-size: 3.8vw
}
.floating__button-item01 a::before {
    background-image: url("../images/float_icon01.svg")
}
.floating__button-item02 a, .floating__button-item03 a {
    padding: 2.03rem 0 1.83rem;
    font-size: 3.8vw
}
.floating__button-item02 a {
    background: #006bc6
}
.floating__button-item02 a::before {
    background-image: url("../images/float_icon02.svg")
}
.floating__button-item03 a {
    background: #06c755
}
.floating__button-item03 a::before {
    background-image: url("../images/float_icon03.svg")
}
@media screen and (max-width: 768px) {
    .floating {
        display: block
    }
}