#content .l-content__body {
    margin: 0 auto;
}

/* 各ページテンプレート用 */

.main-container {
    font-family: 游ゴシック, "Yu Gothic", "ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
    font-size: 0.8rem;
    margin: 0
}

.main-container h1 {
    margin: 2rem 0 0;
    text-align: center
}

.main-container h2 {
    font-size: 1.1rem;
    margin: 2rem 0;
    position: relative;
    z-index: 2
}

.main-container h3 {
    color: #22718a
}

.main-container h4 {
    font-size: 0.9rem;
    margin: 2rem 0 0.5rem
}

.main-container ul {
    list-style: none;
    padding: 0
}

.main-container .btn-box {
    text-align: center;
    padding: 1rem
}

.main-container .btn-box .main-btn-text {
    font-size: 0.7rem
}

.main-container .btn-box .btn {
    background: linear-gradient(90deg, rgb(57, 112, 135), rgb(103, 172, 210));
    color: #fff;
    display: block;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.15rem;
    margin: 1rem;
    padding: 1rem;
    text-decoration: none;
    animation: shadowBlue-data-v-19fb3459 2s infinite;
    border-radius: 50px;
}

.main-container .btn-box .btn:hover {
    opacity: 0.6
}

.main-container .logo {
    padding: 0 0.5rem;
    width: 6rem
}

.main-container .main-img-sp {
    width: 100%
}

.main-container .main-img-pc {
    display: none
}

.main-container .main-text {
    width: 70%
}

.main-container .content-flame {
    background-color: #efefef;
    padding: 1.3rem
}

.main-container .content-flame .content {
    position: relative
}

.main-container .content-flame .content .deco {
    height: 2.5rem;
    left: -1.2rem;
    position: absolute;
    top: -1.4rem;
    z-index: 1
}

.main-container .content-flame .content .copy {
    margin: 1rem 0;
    text-align: center
}

.main-container .content-flame .content .sub-copy {
    margin-bottom: 1.5rem
}

.main-container .content-flame .content .topics {
    background-color: #fff;
    margin-bottom: 1rem;
    padding: 1.3rem
}

.main-container .content-flame .content .topics .topics-img {
    text-align: center
}

.main-container .content-flame .content .topics .topics-img img {
    height: 7.5rem;
    width: auto
}

.main-container .content-flame .content .topics .topics-ttl {
    text-align: center
}

.main-container .content-flame .content .topics .topics-ttl .line {
    border-bottom: 1.5px solid #22718a
}

.main-container .content-flame .content .topics .exam {
    color: #5e5e5e;
    font-size: 0.6em
}

.main-container .content-flame .content .flow {
    background-color: #fff;
    display: flex;
    margin-bottom: 2rem;
    padding: 1rem;
    position: relative
}

.main-container .content-flame .content .flow .number {
    height: 2rem;
    position: absolute;
    right: 1rem;
    top: 0
}

.main-container .content-flame .content .flow .icon {
    padding: 0 1rem 0 0;
    width: 18%
}

.main-container .content-flame .content .flow .detail {
    flex: 1
}

.main-container .content-flame .content .flow .detail h3 {
    margin: 0 0 0.5rem
}

.main-container .content-flame .content .flow .detail p {
    margin: 0
}

.main-container .content-flame .content .next-line::after {
    content: "";
    display: block;
    width: 1.5px;
    height: 1.3rem;
    bottom: -1.65rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #22718a;
    position: absolute
}

.main-container .content-flame .content .job-box {
    display: flex;
    flex-wrap: wrap
}

.main-container .content-flame .content .job-box li:nth-child(2n) {
    margin-right: 0
}

.main-container .content-flame .content .job-box .job {
    background-color: #fff;
    margin: 0 1rem 1rem 0;
    width: calc(calc(100% - 1rem) / 2)
}

.main-container .content-flame .content .job-box .job .job-ttl {
    background-color: #22718a;
    color: #fff;
    padding: 0.4rem 0.6rem
}

.main-container .content-flame .content .job-box .job .job-inner {
    padding: 0.6rem
}

.main-container .content-flame .content .job-box .job .job-inner .detail {
    display: flex
}

.main-container .content-flame .content .job-box .job .job-inner .detail img {
    padding: 0.25rem 0.4rem 0 0;
    height: 1rem;
    width: 1rem
}

.main-container .content-flame .content .job-box .job .job-inner .detail p {
    flex: 1;
    margin: 0.2rem 0
}

.main-container .content-flame .content .faq {
    display: flex;
    margin-bottom: 1rem
}

.main-container .content-flame .content .faq .question {
    margin-right: 0.6rem;
    width: 1.7rem
}

.main-container .content-flame .content .faq .detail {
    flex: 1
}

.main-container .content-flame .content .faq h3 {
    margin: 0
}

.main-container .content-flame .content .faq .answer {
    background-color: #fff;
    padding: 1rem
}

.main-container .foot {
    background-color: #474747;
    color: #fff;
    font-size: 0.8rem;
    padding: 1.3rem
}

.main-container .foot ul {
    display: flex;
    flex-wrap: wrap
}

.main-container .foot ul li {
    margin-bottom: 1rem;
    width: 50%
}

.main-container .foot ul li a {
    color: #fff;
    text-decoration: none
}

.main-container .foot ul li a img {
    fill: #fff;
    height: 0.6rem
}

.main-container .foot ul li a:hover {
    opacity: 0.6
}

.main-container .foot .company-box {
    border-top: 1px solid #fff;
    margin: 2rem 0;
    padding-top: 1rem
}

@media (min-width:768px) {
    .main-container {
        font-size: 0.9rem
    }

    .main-container h1 {
        margin-bottom: 0
    }

    .main-container h2 {
        font-size: 1.6rem
    }

    .main-container h4 {
        font-size: 1rem
    }

    .main-container .logo {
        padding: 1rem;
        width: 25%
    }

    .main-container .btn-box .btn {
        font-size: 1.1rem;
        margin: 1rem auto;
        width: 50%
    }

    .main-container .btn-box .main-btn {
        font-size: 1rem;
        margin-bottom: 0;
        padding: 0.7rem 1.8rem
    }

    .main-container .firstview {
        display: flex
    }

    .main-container .firstview .text-area {
        position: relative;
        width: 50%
    }

    .main-container .firstview .text-area .main-img-sp {
        display: none
    }

    .main-container .firstview .text-area .main-text-box {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        -webkit-transform: translateY(-50%) translateX(-50%);
        width: 100%
    }

    .main-container .firstview .main-img-pc {
        display: block;
        height: auto;
        width: 50%
    }

    .main-container .content-flame {
        padding: 2rem
    }

    .main-container .content-flame .content .deco {
        height: 3.5rem;
        left: -1.2rem;
        position: absolute;
        top: -2rem;
        z-index: 1
    }

    .main-container .content-flame .content .topics-box {
        display: flex;
        flex-wrap: wrap
    }

    .main-container .content-flame .content .topics-box li:nth-child(2n) {
        margin-right: 0
    }

    .main-container .content-flame .content .topics-box .topics {
        margin: 0 2rem 2rem 0;
        width: calc(calc(100% - 7.2rem) / 2)
    }

    .main-container .content-flame .content .flow-box {
        margin: 0 auto;
        width: 90%
    }

    .main-container .content-flame .content .flow-box .flow .number {
        height: 2.5rem
    }

    .main-container .content-flame .content .flow-box .flow .icon {
        width: 10%
    }

    .main-container .content-flame .content .job-box li:nth-child(2n) {
        margin-right: 1rem
    }

    .main-container .content-flame .content .job-box li:nth-child(4n) {
        margin-right: 0 !important
    }

    .main-container .content-flame .content .job-box .job {
        width: calc(calc(100% - 3rem) / 4)
    }

    .main-container .content-flame .content .faq .question {
        width: 2.3rem
    }

    .main-container .foot {
        font-size: 0.9rem
    }

    .main-container .foot ul li {
        width: 33%
    }

    .main-container .foot ul li a img {
        height: 0.7rem
    }
}

@media (min-width:1050px) {
    .main-container .logo {
        padding: 2.5rem
    }

    .main-container .main-text {
        width: 70%
    }

    .main-container .sub-copy {
        text-align: center
    }

    .main-container .btn-box .main-btn-text {
        font-size: 1rem
    }

    .main-container .btn-box .btn {
        width: 30%;
        border-radius: 50px;
    }

    .main-container .btn-box .btn {
        box-shadow: 0 4px 0 #397087
    }

    .main-container.btn-box .btn:hover {
        transform: translateY(4px);
        box-shadow: none;
    }

    .main-container .btn-box .main-btn {
        font-size: 1.2rem;
        padding: 1rem 1.5rem;
        width: 40%
    }

    .main-container .content-flame {
        padding: 4rem 2rem
    }

    .main-container .content-flame .content {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 1000px
    }

    .main-container .content-flame .content .flow-box {
        margin: 0 auto;
        width: 80%
    }

    .main-container .foot .foot-content {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 1000px
    }

    .main-container .foot .foot-content a {
        border-bottom: 1px solid #fff
    }

    li {
        list-style: none
    }
}


/* 以下調整用 */

/* 固定ページ12　タレント 全幅 */
body.page-id-12 .l-wrapper .l-container {
    max-width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

body.page-id-12 .l-header__body.l-container {
    width: 90%;
}

/* 固定ページ57 カワレル 全幅 */
body.page-id-57 .l-wrapper .l-container {
    max-width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

body.page-id-1073 .l-wrapper .l-container {
    max-width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

body.page-id-57 .l-header__body.l-container {
    width: 90%;
}

div#top_title_area {
    display: none;
}

div#breadcrumb {
    display: none;
}

.career {
    background-color: #efefef;
    padding: 4rem 2rem;
}

.main-container .content-flame .content .career-box {
    display: flex;
}

@media (max-width:768px) {
    .main-container .content-flame .content .career-box {
        display: block;
    }

    .career {
        padding: 2rem 0;
        text-align: center;
    }

    .career img {
        max-width: 250px;
        width: 100%;
    }

    .career-text {
        font-size: 24px;
        text-align: center;
    }
}


/* カワレル */
/*--------------------*/
/* base
/*--------------------*/

li {
    list-style-type: none;
}

a {
    text-decoration: none;
    color: #000;
}

html,
body {
    margin: 0;
    padding: 0;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-family: "Roboto", sans-serif;
}



/* 基本設定
/*--------------------*/

html {
    font-size: 62.5%;
}

.util__title {
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-size: 2.2rem;
    font-weight: bold;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .util__title {
        font-size: 1.8rem;
    }
}

.util__link {
    text-align: center;
}

.btn {
    background-image: linear-gradient(281deg, rgba(255, 228, 115, 1), rgba(255, 133, 20, 1));
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    padding: 1.5rem 8rem 1.5rem 8rem;
    border-radius: 50px;
    box-shadow: 0 4px 4px 0 #bb600c;
    animation: vertical 2s linear infinite;
}

@media screen and (max-width: 768px) {
    .btn {
        font-size: 1rem;
        padding: 1rem 1rem 1rem 1rem;
    }
}

@keyframes vertical {
    0% {
        transform: translate(0px, 2px);
        box-shadow: 0;
    }

    5% {
        transform: translate(0px, -2px);
    }

    10% {
        transform: translate(0px, 2px);
    }

    15% {
        transform: translate(0px, -2px);
    }

    20% {
        transform: translate(0px, 2px);
    }

    25% {
        transform: translate(0px, -2px);
    }

    30% {
        transform: translate(0px, 0px);
    }
}

.dli-caret-right {
    position: relative;
}

.mobail {
    display: none;
}

@media screen and (max-width: 768px) {
    .mobail {
        display: block;
    }
}

.pc {
    display: block;
}

@media screen and (max-width: 768px) {
    .pc {
        display: none;
    }
}

/* mv
/*--------------------*/

.mv {
    background-image: linear-gradient(281deg, rgba(167, 222, 251, 1), rgba(96, 194, 244, 1));
    padding: 4.8rem 14rem 4.8rem;
}

@media screen and (max-width: 768px) {
    .mv {
        padding: 4rem 3rem;
    }
}

.mv__wrapper {
    background-color: #fff;
    margin: 0 auto;
    max-width: 116rem;
    width: 100%;
    border-radius: 30px;
}

@media screen and (max-width: 768px) {
    .mv__wrapper {
        position: relative;
    }
}

.mv__title {
    font-size: 3.1vw;
    font-weight: bold;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    padding: 5rem 0 0 5rem;
    line-height: 1.2;
}

@media screen and (max-width: 768px) {
    .mv__title {
        font-size: 2.4em;
        padding: 1rem 0 0 1.5rem;
    }
}

.mv__content {
    display: flex;
    margin-top: 2rem;
}

@media screen and (max-width: 768px) {
    .mv__content {
        margin-top: 1rem;
        display: flex;
        flex-direction: column-reverse;
    }
}

.mv__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 1rem;
    margin: 3rem 0 3.2rem 4.5rem;
}

@media screen and (max-width: 768px) {
    .mv__list {
        margin: 0 auto -5rem;
        gap: 0 0.5rem;
    }
}

.mv__item {
    max-width: 16rem;
    padding: 0 0.2em 0.8em;
    width: 100%;
    background-color: #155a85;
    color: #fff;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .mv__item {
        max-width: 10.5rem;
        width: 100%;
        padding: 0.5rem 0.2rem;
    }
}

.mv__content-img {
    margin-left: auto;
    padding-right: 6rem;
}

@media screen and (max-width: 768px) {
    .mv__content-img {
        margin: 1rem auto 0;
        padding-right: 2rem;
        max-width: 25rem;
        width: 100%;
    }
}

.mv__content-img img {
    max-width: 43rem;
    width: 100%;
}

.mv__item-logo {
    font-size: 3rem;
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
}

@media screen and (max-width: 768px) {
    .mv__item-logo {
        font-size: 2.1rem;
        padding-top: 0;
    }
}

.mv__item-logo span {
    font-size: 2.5rem;
}

@media screen and (max-width: 768px) {
    .mv__item-logo span {
        font-size: 1.2rem;
    }
}

.mv__item-text {
    font-size: 1rem;
    text-align: center;
    line-height: 1.5;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
}

@media screen and (max-width: 768px) {
    .mv__item-text {
        font-size: 0.8em;
        margin-top: 1rem;
    }
}

.text2 {
    font-size: 0.6em;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
    text-align: center;
    line-height: 1.2;
}

.mv__text {
    font-size: 1.4rem;
    margin-top: 2.2rem;
    line-height: 1.65;
    text-align: center;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
    color: #2b2b2b;
}

@media screen and (max-width: 768px) {
    .mv__text {
        font-size: 1.2rem;
        margin-top: 7rem;
    }
}

.mv .util__link {
    margin-top: 2rem;
}

@media screen and (max-width: 768px) {
    .mv .util__link {
        margin-top: 3rem;
    }
}

/* coching
/*--------------------*/

.coching {
    background-color: #f8f8f8;
}

.coching__inner {
    padding: 4.2rem 8rem;
    max-width: 100rem;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .coching__inner {
        padding: 3rem;
    }
}

.coching__list {
    margin-top: 4.2rem;
    display: flex;
}

@media screen and (max-width: 768px) {
    .coching__list {
        margin-top: 3rem;
        display: block;
    }
}

.coching__item {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
    max-width: 29rem;
    width: 100%;
    background-color: #fff;
    padding: 0.8rem 0;
    border-radius: 10px;
}

@media screen and (max-width: 768px) {
    .coching__item {
        margin: 0 auto;
        padding: 1rem 1.4rem;
        max-width: 33rem;
        width: 100%;
    }
}

.coching__item:not(:first-child) {
    margin-left: 1.7rem;
}

@media screen and (max-width: 768px) {
    .coching__item:not(:first-child) {
        margin: 1rem auto 0;
    }
}

.coching__item-title {
    font-size: 1.4rem;
    color: #60c2f4;
    font-weight: bold;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .coching__item-title {
        font-size: 1.6rem;
    }
}

.coching__item-text {
    font-size: 1rem;
    text-align: center;
    margin-top: 1.4rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.2;
    color: #2b2b2b;
}

@media screen and (max-width: 768px) {
    .coching__item-text {
        font-size: 1.6rem;
        margin-top: 1.6rem;
    }
}

.coching__text {
    margin-top: 3.6rem;
    font-size: 1.6rem;
    text-align: center;
    line-height: 1.5;
    color: #2b2b2b;
}

@media screen and (max-width: 768px) {
    .coching__text {
        margin-top: 2.5rem;
        font-size: 1.2rem;
    }
}

/* feature
/*--------------------*/

.feature {
    background-image: linear-gradient(281deg, rgba(167, 222, 251, 1), rgba(96, 194, 244, 1));
}

.feature__inner {
    max-width: 122rem;
    width: 100%;
    margin: 0 auto;
    padding: 4rem 8rem 5rem;
}

@media screen and (max-width: 768px) {
    .feature__inner {
        padding: 3rem;
    }
}

.feature__list {
    margin-top: 4rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem 4rem;
}

@media screen and (max-width: 768px) {
    .feature__list {
        margin-top: 3rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 2rem 4rem;
    }
}

.feature__item {
    background-color: #fff;
    border-radius: 10px;
    padding: 1.5rem 1rem 1.5rem 2rem;
}

@media screen and (max-width: 768px) {
    .feature__item {
        padding: 1.5rem 1.2rem 1.5rem 2rem;
        max-width: 33rem;
        width: 100%;
        margin: 0 auto;
    }
}

.feature__content {
    display: flex;
}

.feature__logo img {
    border-radius: 10px;
    box-shadow: 1px 4px 3px rgba(0, 0, 0, 0.23);
}

.feature__area {
    margin-left: 2.2rem;
}

.feature__area-text span {
    font-size: 1.4rem;
    color: #fff;
    background-color: #155a85;
    border-radius: 10px;
    padding: 0.3rem 1.5rem;
    font-family: "Roboto", sans-serif;
}

@media screen and (max-width: 768px) {
    .feature__area-text {
        margin-top: 1rem;
    }
}

.feature__sub-text {
    font-size: 1.2rem;
    color: #60c2f4;
    font-family: "Roboto", sans-serif;
    font-weight: bold;
    margin-top: 1.6rem;
    line-height: 1.2;
    color: #2b2b2b;
}

@media screen and (max-width: 768px) {
    .feature__sub-text {
        font-size: 1.4rem;
    }
}

.feature__text {
    margin-top: 1.6rem;
    font-size: 1rem;
    font-family: "Roboto", sans-serif;
    line-height: 1.2;
    color: #2b2b2b;
}

@media screen and (max-width: 768px) {
    .feature__text {
        text-align: center;
        font-size: 1.2rem;
    }
}

.feature .util__link {
    margin-top: 6rem;
}

@media screen and (max-width: 768px) {
    .feature .util__link {
        margin-top: 3rem;
    }
}

/* price
/*--------------------*/

.price {
    background-color: #f8f8f8;
}

.price__inner {
    padding: 5rem 8rem 4rem;
    margin: 0 auto;
    max-width: 114.5rem;
    width: 100%;
}

@media screen and (max-width: 768px) {
    .price__inner {
        padding: 3rem;
    }
}

.price__list {
    margin-top: 4rem;
    display: flex;
}

@media screen and (max-width: 768px) {
    .price__list {
        margin-top: 3rem;
        display: block;
    }
}

.price__item {
    max-width: 33rem;
    width: 100%;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.25);
    text-align: center;
    padding: 1.6rem 0 2.4rem;
    background-color: #fff;
    border-radius: 10px;
}

@media screen and (max-width: 768px) {
    .price__item {
        margin: 0 auto;
    }
}

.price__item:not(:first-child) {
    margin-left: 4rem;
}

@media screen and (max-width: 768px) {
    .price__item:not(:first-child) {
        margin: 1rem auto 0;
    }
}

.price__title {
    font-size: 2.2rem;
    color: #00a7ff;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
}

.price__text {
    font-size: 0.8rem;
    color: #00a7ff;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 2.2;
    position: relative;
}

.price__text::before {
    position: absolute;
    top: 2rem;
    left: 50%;
    transform: translate(-50%);
    border-bottom: 1px solid #00A7FF;
    display: inline-block;
    content: "";
    width: 16rem;
}

.price__box {
    margin-top: 3rem;
}

.price__box-title {
    margin-top: 2rem;
    font-size: 1.2rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
}

.price__box-text {
    font-size: 1rem;
    margin-top: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.2;
    color: #2b2b2b;
}

.price .util__link {
    margin-top: 6rem;
}

@media screen and (max-width: 768px) {
    .price .util__link {
        margin-top: 3rem;
    }
}

/* coach
/*--------------------*/

.coach {
    background-image: linear-gradient(281deg, rgba(167, 222, 251, 1), rgba(96, 194, 244, 1));
}

.coach__inner {
    padding: 5rem 8rem;
    max-width: 72rem;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .coach__inner {
        padding: 3rem;
    }
}

.coach__list {
    margin-top: 4rem;
}

.coach__item {
    background-color: #fff;
    border-radius: 10px;
    padding: 3rem 4rem;
    box-shadow: 5px 5px 5px 2px rgba(0, 0, 0, 0.1);
}

@media screen and (max-width: 768px) {
    .coach__item {
        padding: 1.6rem 1.2rem 1.6rem 0.8rem;
        max-width: 33rem;
        width: 100%;
        margin: 0 auto;
    }
}

.coach__item:not(:first-child) {
    margin-top: 1rem;
}

.coach__content {
    display: flex;
}

.coach__img {
    max-width: 10rem;
    width: 100%;
}

@media screen and (max-width: 768px) {
    .coach__img {
        max-width: 10rem;
        width: 100%;
    }
}

.coach__box {
    margin: 1rem 0 0 2rem;
}

@media screen and (max-width: 768px) {
    .coach__box {
        margin: 1.5rem 0 0 1rem;
    }
}

.coach__name {
    font-size: 1.2rem;
    color: #00a7ff;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
}

.coach__detail {
    font-size: 1rem;
    color: #2b2b2b;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    margin-top: 1rem;
    line-height: 1.2;
    color: #000;
}

.area1 {
    display: block;
}

@media screen and (max-width: 768px) {
    .area1 {
        display: none;
    }
}

.area2 {
    display: none;
}

@media screen and (max-width: 768px) {
    .area2 {
        display: block;
    }
}

.coach__logo {
    margin-top: 1.5rem;
}

.coach__logo span {
    font-size: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
    color: #fff;
    background-color: #155a85;
    border-radius: 10px;
    padding: 0.6rem 1rem;
}

.coach__sub-text {
    font-size: 1rem;
    margin-top: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.2;
    color: #2b2b2b;
}

.coach__text {
    font-size: 1rem;
    margin-top: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.4;
    max-width: 67rem;
    width: 100%;
    color: #2b2b2b;
}

.coach .util__link {
    margin-top: 5rem;
}

/* flow
/*--------------------*/

.flow {
    background-color: #f8f8f8;
}

.flow__inner {
    max-width: 64rem;
    width: 100%;
    padding: 5rem 4rem;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .flow__inner {
        padding: 3rem;
    }
}

.flow__title {
    margin-top: 1.5rem;
    font-size: 1.8rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    font-weight: bold;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .flow__title {
        margin-top: 2.8rem;
    }
}

.flow__list {
    margin-top: 1.5rem;
}

@media screen and (max-width: 768px) {
    .flow__list {
        margin-top: 2rem;
    }
}

.flow__item {
    background-color: #fff;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    padding: 1.2rem 0;
    text-align: center;
    border-radius: 10px;
    font-size: 1.2rem;
}

@media screen and (max-width: 768px) {
    .flow__item {
        max-width: 33rem;
        width: 100%;
        margin: 0 auto;
    }
}

.flow__item:not(:first-child) {
    margin-top: 5rem;
}

.flow__item:not(:last-child) {
    position: relative;
}

.flow__item:not(:last-child)::after {
    content: url(/wp-content/uploads/2024/07/arrow.png);
    display: inline-block;
    position: absolute;
    bottom: -3.5rem;
    left: 50%;
    transform: translate(-50%);
}

.flow .util__link {
    margin-top: 5rem;
}

@media screen and (max-width: 768px) {
    .flow .util__link {
        margin-top: 3rem;
    }
}

/* form
/*--------------------*/

.form {
    max-width: 62rem;
    width: 100%;
    margin: 20px auto;
}

@media screen and (max-width: 768px) {
    .form {
        padding: 3rem;
    }
}

/* qa
/*--------------------*/

.qa {
    background-image: linear-gradient(281deg, rgba(167, 222, 251, 1), rgba(96, 194, 244, 1));
}

.qa__inner {
    padding: 5rem 8rem;
    max-width: 72rem;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .qa__inner {
        padding: 3rem;
    }
}

.qa__list {
    margin-top: 5rem;
}

@media screen and (max-width: 768px) {
    .qa__list {
        margin-top: 3rem;
    }
}

.qa__item {
    background-color: #fff;
    box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.1);
    padding: 1.2rem 1rem 1.2rem 1rem;
    border-radius: 10px;
}

@media screen and (max-width: 768px) {
    .qa__item {
        max-width: 33rem;
        width: 100%;
        margin: 0 auto;
    }
}

.qa__item:not(:first-child) {
    margin-top: 2rem;
}

.q__area {
    display: flex;
}

.q__logo {
    background-color: #565656;
    color: #fff;
    font-size: 1.2rem;
    border-radius: 50px;
    height: 2rem;
    margin-right: 1.5rem;
    max-width: 2rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.q__text {
    font-size: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.2;
    color: #2b2b2b;
}

.a__area {
    display: flex;
    margin-top: 1.5rem;
}

.a__logo {
    background-color: #f4c946;
    color: #fff;
    font-size: 1.2rem;
    border-radius: 50px;
    margin-right: 1.5rem;
    height: 2rem;
    max-width: 2rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.a__text {
    font-size: 1rem;
    font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.4;
    color: #2b2b2b;
}

.qa .util__link {
    margin-top: 5rem;
}

@media screen and (max-width: 768px) {
    .qa .util__link {
        margin-top: 3rem;
    }
}

/* voice
/*--------------------*/

/* .voice {
    background-color: #F8F8F8;
}

.voice__inner {
    padding: 5rem 4rem 5rem;
    max-width: 48rem;
    width: 100%;
    margin: 0 auto;
}

.voice__content {
    margin-top: 5rem;
    display: flex;
}

.voice__img {
    max-width: 10.6rem;
    width: 100%;
}

.voice__name {
    margin: 5rem 0 0 2rem;
    font-size: 1.8rem;
    font-family: "YuGothic";
    font-weight: bold;
}

.voice__text {
    margin-top: 2rem;
    font-size: 1.4rem;
    font-family: "YuGothic";
    line-height: 1.2;
}

.voice .util__link {
    margin-top: 3rem;
} */

/* footer
/*--------------------*/


.footer {
    background-color: #474747;
    color: #fff;
    font-size: 0.8rem;
}

.footer__inner {
    padding: 6rem 4rem 4rem;
    max-width: 108rem;
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .footer__inner {
        padding: 6rem 2rem 2rem;
    }
}

.footer__item {
    margin-top: 1.8rem;
    display: flex;
}

.footer__item a {
    color: #fff;
    font-size: 1.5rem;
    display: flex;
}

@media screen and (max-width: 768px) {
    .footer__item a {
        font-size: 1.2rem;
    }
}

.footer__title {
    font-size: 1.6rem;
    font-weight: bold;
}

@media screen and (max-width: 768px) {
    .footer__title {
        font-size: 1.4rem;
        font-weight: bold;
    }
}

.footer__title:not(:first-child) {
    margin-top: 5rem;
}


.footer__img {
    max-width: 1rem;
    width: 100%;
    height: 1rem;
    margin-left: 0.5rem;
    vertical-align: middle;
}

.footer__item a:hover {
    opacity: 0.6;
}

.footer__box {
    border-top: 1px solid #fff;
    margin: 6rem 0;
    padding-top: 1rem;
}

@media screen and (max-width: 768px) {
    .footer__box {
        margin: 6rem 0 4rem;
        padding-top: 1rem;
    }
}

.footer__box a {
    color: #fff;
    font-size: 1.4rem;
    display: flex;
}

@media screen and (max-width: 768px) {
    .footer__box a {
        font-size: 1.2rem;
    }
}

.footer__box-list {
    margin-top: 2rem;
}

.footer__box-item {
    display: flex;
}