@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap");

* {
    box-sizing: border-box;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    width: 100%;
}

.width_100per{
    width:100%;
}

.double-font{
    font-size:150%;
}

.wrap_original {
    overflow: hidden;
}

header {
    height: 70px;
    width: 100%;
    padding: 0px 10px;
    background-color: #FFFFFF;
    position: fixed;
    top: 0;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-logo {
    width: 10%;
}

.header-logo__img {
    width: 70%;
    height: auto;
}

.pc-menu {
    width: 75%;
}

.pc-menu__list {
    display: flex;
    list-style: none;
}

.pc-menu__item {
    font-size: 15px;
    color: #333333;
    font-weight: bold;
    text-decoration: none;
    display: block;
    min-width: 30px;
    line-height: 60px;
    padding: 0 10px;
}

.snsbtniti{
    margin-top:20px;
/* display:flex;
flex-flow:row wrap;
*/
}

.sp-menu {
    display: none;
}

.header-button {
    width: 150px;
    border: 3px solid #FFFFFF;
    border-radius: 51px;
    text-align: center;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: bold;
    padding: 10px 0;
    line-height: 1.4em;
}

.youtube-section{
    margin-top: 50px;
}

.youtube-player{
    width:560px;
    height:315px;
}

.only_sp{
    display:none;
}

@media (max-width: 1100px) {
    .pc-menu__item {
        font-size: 14px;
        color: #333333;
        font-weight: bold;
        text-decoration: none;
        display: block;
        min-width: 30px;
        line-height: 60px;
        padding: 0 8px;
    }

    header {
        height: 50px;
    }

    .pc-menu {
        display: none;
    }

    .snsbtniti{
        width:140px;
        margin-left: auto;
        margin-right: auto;
    }

    #hamburger {
        background-color: transparent;
        position: relative;
        cursor: pointer;
        margin: 0 0 0 auto;
        height: 60px;
        width: 60px;
    }

    #sp-hamburger {
        background-color: transparent;
        position: relative;
        cursor: pointer;
        margin: 0 0 0 auto;
        height: 20px;
        width: 30px;
    }

    .icon span {
        position: absolute;
        left: 15px;
        width: 30px;
        height: 4px;
        background-color: #333333;
        border-radius: 8px;
        transition: ease 0.75s;
    }

    .icon span:nth-of-type(1) {
        top: 16px;
    }

    .icon span:nth-of-type(2) {
        top: 28px;
    }

    .icon span:nth-of-type(3) {
        bottom: 16px;
    }

    .close span:nth-of-type(1) {
        transform: rotate(45deg);
        top: 28px;
    }

    .close span:nth-of-type(2) {
        opacity: 0;
    }

    .close span:nth-of-type(3) {
        transform: rotate(-45deg);
        top: 28px;
    }

    .sp-menu {
        top: 0px;
        left: 0px;
        position: absolute;
        z-index: 11;
        width: 100%;
        padding: 30px 50px;
        background-color: #FFFFFF;
    }

    .header-button {
        font-size: 9px;
        width: 160px;
        margin-left: 60%;
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-weight: bold;
        padding: 10px 0;
        line-height: 1.4em;
    }

    .header-logo {
        width: 150px;
    }

    .header-logo__img {
        width: 80%;
        height: auto;
    }

    .sp-header-logo {
        text-align: center;
        padding: 0 0 30px;
    }

    .sp-header-logo__img {
        width: 40%;
        max-width: 200px;
        height: 100%;
    }

    .sp-header-button {
        font-size: 9px;
        width: 160px;
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-weight: bold;
        padding: 10px 0;
        line-height: 1.4em;
        margin: 30px 0;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 570px) {
    .header-button {
        font-size: 9px;
        width: 160px;
        margin-left: 30%;
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-weight: bold;
        padding: 10px 0;
        line-height: 1.4em;
    }

    .youtube-player{
        width:100%;
    }

    .comparison__feature-sp-img {
        width: 600px;
    }
}

ul {
    list-style-type: none;
}

main {
    background-color: #F8F8F8;
}

/* common part */
.four-gradation-bg {
    background: -moz-linear-gradient(left, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: -webkit-linear-gradient(left, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: linear-gradient(to right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
}

.four-gradation-bg:hover {
    background: -moz-linear-gradient(right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: -webkit-linear-gradient(right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: linear-gradient(to left, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
}

.line-bg {
    background-color: #06C755;
}


.line-bg:hover{
    opacity:70%;
}

.two-gradation-bg {
    background: -moz-linear-gradient(left, #D9147E, #15C3D9);
    background: -webkit-linear-gradient(left, #D9147E, #15C3D9);
    background: linear-gradient(to right, #D9147E, #15C3D9);
}

.two-gradation-bg:hover {
    background: -moz-linear-gradient(right, #D9147E, #15C3D9);
    background: -webkit-linear-gradient(right, #D9147E, #15C3D9);
    background: linear-gradient(to left, #D9147E, #15C3D9);
}

.box-below-shadow {
    box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.3);
}

.circle-button-shadow {
    box-shadow: 0 0.4em 0 #00000029;
    transition: .4s;
}

.circle-button-shadow:active {
    box-shadow: 0 0 0 #00000029;
}

.sp {
    display: none;
}

@media screen and (max-width: 960px) {
    .sp {
        margin-left: -6%;
        margin-right: -6%;
        display: block;
        margin-bottom: 30px;
    }
    .only_pc{
        display:none;
    }
    .only_sp{
        display:unset;
    }
}

/* section all */
.section_container {
    padding: 120px 0px 0px;
    text-align: center;
    width: 90%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

.section__heading-theme {
    font-size: 12px;
    color: #333333;
}

.section__heading-ttl {
    line-height: 1.5em;
    margin: 20px 0 30px;
    font-size: 32px;
    font-weight: bold;
    color: #333333;
}

.section__heading-txt {
    line-height: 2.0em;
    font-size: 18px;
    margin-bottom: 60px;
    color: #333333;
}

.br-sp {
    display: none;
}

@media screen and (max-width: 960px) {
    .section_container {
        padding: 60px 0px 0px;
        text-align: center;
        margin-left: 5%;
        margin-right: 5%;
    }

    .section__heading-theme {
        font-size: 8px;
        color: #333333;
    }

    .section__heading-ttl {
        line-height: 1.5em;
        margin-top: 10px;
        margin-bottom: 30px;
        margin-left: 0;
        margin-right: 0;
        font-size: 26px;
        font-weight: bold;
        color: #333333;
    }

    .section__heading-txt {
        line-height: 1.5em;
        font-size: 16px;
        margin-bottom: 30px;
        color: #333333;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .sp-section_heading {
        font-size: 18px;
    }

    .br-sp {
        display: inline;
    }

    .br-pc {
        display: none;
    }
}

/* mv_area */
.mv_area_container {
    width: 100%;
    margin-top: 70px;
    color: #333333;
}

.mv_bg {
    width: 100%;
    height: 660px;
    background-image: url(/img/first_picture.webp);
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
}

.mv_sub {
    width: 500px;
    position: absolute;
    top: 10%;
    left: 5%;
}

.mv_sub-pc-img {
    width: 100%;
    height: 100%;
}

.mv-cv-button {
    width: 40%;
    min-width: 500px;
    position: absolute;
    top: 100%;
    left: 30%;
    right: 30%;
    transform: translateY(-50%);
    border: 3px solid #FFFFFF;
    border-radius: 51px;
    text-align: center;
    color: #FFFFFF;
    font-size: 22px;
    font-weight: bold;
    padding-top: 5px;
    padding-bottom: 15px;
    line-height: 1.4em;
}

.mv-cv-button__caption {
    font-size: 14px;
}

.mv_sub-sp-img {
    display: none;
}

@media screen and (max-width: 960px) {
    .mv_area_container {
        width: 100%;
        height: 600px;
        margin-top: 50px;
    }

    .mv_bg {
        width: 100%;
        height: 400px;
        background-image: url(/img/first_sp-picture.webp);
        position: relative;
        background-repeat: no-repeat;
    }

    .mv_sub {
        width: 400px;
        height: auto;
        position: absolute;
        top: 350px;
        left: 0;
        right: 0;
        margin: auto;
        transform: translateY(-50%);
    }

    .mv_sub-pc-img {
        display: none;
    }

    .mv_sub-sp-img {
        display: block;
        width: 100%;
        margin-left: 0%;
        margin-right: 0%;
    }
    .mv-cv-button__caption{
        margin-bottom:5px;
    }
    .mv-cv-button {
        position: absolute;
        min-width: 300px;
        width: 70%;
        top: 550px;
        left: 15%;
        right: 15%;
        transform: translateY(-50%);
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-size: 16px;
        font-weight: bold;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 1em;
    }

    .mv-cv-button__caption {
        font-size: 9px;
    }
}

@media (max-width: 440px) {
    .mv_area_container {
        height: 420px;
        width: 100%;
        margin-top: 50px;
    }

    .mv_bg {
        width: 100%;
        height: 330px;
        background-image: url(/img/first_sp-picture.webp);
        position: relative;
        background-repeat: no-repeat;
    }

    .mv_sub {
        width: 90%;
        position: absolute;
        top: 90%;
        left: 5%;
        right: 5%;
        transform: translateY(-50%);
    }

    .mv_sub-pc-img {
        display: none;
    }

    .mv_sub-sp-img {
        display: block;
        width: 100%;
        margin-left: 0%;
        margin-right: 0%;
    }

    .mv-cv-button {
        width: 90%;
        height: auto;
        position: absolute;
        min-width: 300px;
        top: 140%;
        left: 5%;
        right: 5%;
        transform: translateY(-50%);
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-size: 18px;
        font-weight: bold;
        padding-top: 5px;
        padding-bottom: 15px;
        line-height: 1em;
    }

    .mv-cv-button__caption {
        font-size: 9px;
    }
}

/* about */
.about_container {
    margin-top: 5em;
    text-align: center;
    margin-left: 10%;
    margin-right: 10%;
}

.about__heading {
    width: 100%;
}

.about__heading-ttl {
    padding: 100px 0px 50px 0px;
    font-size: 26px;
    font-weight: bold;
}

.about__heading-lg {
    width: 10%;
}

.about-description__txt {
    font-size: 26px;
    font-weight: bold;
    line-height: 2.0em;
    letter-spacing: 0.03em;
}

.about-description__list {
    width:100%;
    max-width: 1280px;
    display: inline-block;
}

.about-description__item {
    display: inline-block;
    width: 30%;
}

.about_char01 {
    color: #D1469E;
    font-size: 30px;
}

.about_char02 {
    color: #4294AC;
    font-size: 30px;
}

.about-description__list-caption {
    font-size: 25px;
    font-weight: bold;
    margin-top: 4%;
    margin-bottom: 3%;
    text-decoration: underline;
    text-decoration-color: #333333;
    text-underline-offset: 0.3em;
    text-decoration-thickness: 2px;
}

.about_container-description__img {
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 960px) {
    .about_container {
        margin-top: 5em;
        text-align: center;
        margin-left: 5%;
        margin-right: 5%;
    }

    .about__heading {
        width: 100%;
    }

    .about__heading-ttl {
        padding: 50px 0px 25px 0px;
        font-size: 16px;
        font-weight: bold;
    }

    .about__heading-lg {
        width: 20%;
    }

    .about-description__txt {
        margin-left: 0;
        margin-right: 0;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5em;
        letter-spacing: 0.03em;
        margin-bottom: 3em;
    }

    .about_char01 {
        color: #D1469E;
        font-size: 18px;
    }

    .about_char02 {
        color: #4294AC;
        font-size: 18px;
    }

    .about-description__list-caption {
        font-size: 15px;
        font-weight: bold;
        margin-top: 4%;
        margin-bottom: 3%;
        text-decoration: underline;
        text-decoration-color: #333333;
        text-underline-offset: 0.3em;
        text-decoration-thickness: 2px;
    }

    .about-description__list {
        margin-top: 1em;
        width: 100%;
        display: flex;
    }

    .about-description__item {
        display: block;
        width: 100%;
    }
}

/* sp-contents */
.sp-contents {
    display: none
}

@media screen and (max-width: 960px) {
    .sp-contents {
        display: block;
        margin-left: 20%;
        margin-right: 20%;
    }

    .contents-table__list {
        text-align: left;
    }

    .contents-table__item {
        height: 32px;
        font-size: 12px;
        font-weight: bold;
        padding: 15px 0;
        border-bottom: #4294AC solid 1px;
        color: #333333;
        position: relative;
    }

    .contents-table__item-name {
        position: absolute;
        top: 10px;
        left: 5%;
    }

    .contents-table__item-icon {
        position: absolute;
        top: 10px;
        right: 5%;
    }

    .contents-table__top-item {
        border-top: #4294AC solid 1px;
    }

    .fa-chevron-down {
        color: #4294AC;
    }
}


/* comparison */

.comparison__feature {
    margin-top: 100px;
}

.comparison__feature-img {
    width: 100%;
    height: auto;
    max-width: 1280px;
}

.comparison__feature-sp-img {
    display: none;
}

.comparison_char01 {
    color: #D1469E;
}

@media screen and (max-width: 960px) {
    .comparison__feature {
        margin-top: 50px;
        margin-left: 0px;/* calc(50% - 50vw); */
        margin-right: 0px;/* calc(50% - 50vw); */
        overflow: scroll;
    }

    .comparison__feature-img {
        display: none;
    }

    .comparison__feature-sp-img {
        display: block;
        width: 98vw;
        height: 100%;
    }
}

/* case */

.case-slider {
    margin-top: 100px;
}

.slick-slide img {
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
    height: auto;
}


@media screen and (max-width: 960px) {
    .case-slider {
        margin-top: 50px;
        margin-left: 8%;
        margin-right: 8%;
    }

    .slick-slide img {
        padding-left: 10px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        height: 100%;
    }
}


/* guindance */
.guidance-content {
    width: 100%;
    background-image: url(/img/cv_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 112px;
    margin-top: 100px;
    color: #333333;
}

.guidance-final-content {
    margin-bottom: 100px;
}

.guidance-content-container {
    background-color: rgba(255, 255, 255, 0.91);
    border-radius: 14px;
    text-align: center;
    padding: 30px;
}

.guidance-content-container__heading {
    margin-bottom: 30px;
}

.guidance-content-container__heading-sup {
    background-color: #6C9EB1;
    font-size: 9px;
    color: #FFFFFF;
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    border-radius: 13px;
    padding: 5px 8px;
}

.guidance-content-container__heading-ttl {
    font-size: 34px;
    font-weight: bold;
    text-decoration: underline;
    text-decoration-color: rgb(0, 0, 0, 0.9);
    text-underline-offset: 0.2em;
    text-decoration-thickness: 1px;
}

.guidance-content-container__txt {
    font-size: 18px;
    font-weight: bold;
    line-height: 2.0em;
}

.guidance-content-container__img {
    margin-top: 30px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 200px;
    height: 100%;
}

.guidance_char01 {
    color: #D1469E;
}

.guidance-button {
    border: 3px solid #FFFFFF;
    border-radius: 51px;
    text-align: center;
    color: #FFFFFF;
    font-size: 22px;
    font-weight: bold;
    padding-top: 29px;
    padding-bottom: 31px;
    width: 450px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

@media screen and (max-width: 960px) {
    .guidance-content {
        width: 100%;
        background-image: url(/img/cv_bg.webp);
        background-repeat: no-repeat;
        background-size: cover;
        padding: 15px 20px 50px;
        margin: 40px 0 0;
    }

    .guidance-content-container {
        position: relative;
        background-color: rgba(255, 255, 255, 0.91);
        border-radius: 14px;
    }

    .guidance-content-container__heading-sup {
        margin-left: auto;
        margin-right: auto;
        background-color: #6C9EB1;
        font-size: 9px;
        color: #FFFFFF;
        border-radius: 13px;
        padding: 5px 8px;
        margin-bottom: 10px;
    }

    .guidance-content-container__heading-ttl {
        font-size: 20px;
        font-weight: bold;
        text-decoration: underline;
        text-decoration-color: rgb(0, 0, 0, 0.9);
        text-underline-offset: 0.4em;
        text-decoration-thickness: 1px;
    }

    .guidance-content-container__txt {
        margin-bottom: 10px;
        margin-left: 10%;
        margin-right: 10%;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.2em;
    }

    .guidance-content-container__img {
        width: 50%;
    }

    .guidance-button {
        /* width: 40%; */
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-size: 16px;
        font-weight: bold;
        padding: 1em;
        /*
        margin-left: 0;
        margin-right: 0;
        position: absolute;
        left: 30%;
        right: 30%;
        */
        transform: translateY(-50%);
    }

    .guidance-final-content {
        margin-bottom: 100px;
    }
}

@media screen and (max-width: 767px) {
    .guidance-button {
        width:  290px;
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        text-align: center;
        color: #FFFFFF;
        font-size: 16px;
        font-weight: bold;
        padding: 10px 0px;
/*        margin-left: 0;
        margin-right: 0;
        position: absolute;
        left: 0;
        right: 0;
        */
        margin: auto;
        margin-top: 20px;
        transform: translateY(-50%);
    }
}

/* reason */
.reason_char01 {
    font-size: 56px;
    color: hsl(327, 58%, 55%);
}

.reason__feature-list {
    display: inline-block;
    width: 100%;
}

.reason__feature-item {
    display: inline-block;
    width: 30%;
}

.reason__feature-img {
    width: 100%;
    height: auto;
}

@media screen and (max-width: 960px) {
    .reason_char01 {
        font-size: 33px;
        color: hsl(327, 58%, 55%);
    }

    .reason__feature-list {
        width: 100%;
    }

    .reason__feature-item {
        width: 100%;
        padding-top: 15px;
    }

    .reason__feature-img {
        width: 100%;
        height: auto;
    }
}

/* method */
.method-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 8em;
}

.method__left {
    width: 100%;
}

.method__lead {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    background-color: #4294AC;
    border-radius: 14px;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    padding: 25px 0px;
}

.method__left-feature {
    margin-top: 2em;
}

.method__left-feature-img {
    width: 90%;
    height: auto;
}

.method-cross {
    width: 1%;
    font-size: 60px;
    font-weight: bold;
    color: #4294AC;
    margin-top: 25%;
    padding-right: 25px;
}

.method__right {
    width: 44%;
}

.method__right-feature {
    margin-top: 2em;
}

.method__right-top-feature-img {
    width: 50%;
    height: auto;
}

.method__right-bottom-feature-img {
    margin-top: 1.5em;
    width: 50%;
    height: auto;
}

@media screen and (max-width: 960px) {
    .method-wrapper {
        margin-left: 0%;
        margin-right: 0%;
        margin-top: 3em;
        display: flex;
        flex-flow: column;
        justify-content: center;
    }

    .method__left {
        width: 100%;
    }

    .method__lead {
        width: 300px;
        margin-left: auto;
        margin-right: auto;
        background-color: #4294AC;
        border-radius: 14px;
        color: #FFFFFF;
        font-size: 18px;
        font-weight: bold;
        padding: 25px 0px;
    }

    .method__left-feature {
        margin-top: 1em;
    }

    .method__left-feature-img {
        width: 100%;
        height: auto;
    }

    .method-cross {
        width: 100%;
        font-size: 60px;
        font-weight: bold;
        color: #4294AC;
        margin: 0 0 10px;
        padding: 0;
    }

    .method__right {
        width: 100%;
    }

    .method__right-feature {
        display: flex;
        margin-top: 2em;
    }

    .method__right-top-feature-img {
        width: 48%;
        height: 100%;
        margin-right: 2%;
    }

    .method__right-bottom-feature-img {
        margin-top: 0;
        margin-left: 2%;
        width: 48%;
        height: 100%;
    }

}

/* advantage */
.advantage_char01 {
    font-size: 49px;
    color: #4294AC;
}

.advantage_char02 {
    font-size: 16px;
}

.advantage_char03 {
    font-size: 18px;
    font-weight: bold;
}

.advantage_char04 {
    font-size: 26px;
}

.advantage_char05 {
    font-size: 24px;
}

.advantage__list {
    margin-top: 100px;
}

.advantage__row {
    display: flex;
    margin-bottom: 20px;
    min-height: 450px;
}

.advantage__second-row {
    min-height: 500px;
}

.advantage__row-img {
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    height: 100%;
}

.advantage__pc-img {
    width: 100%;
    max-width: 450px;
    height: 100%;
}

.advantage__pc-second-img {
    padding-top: 40px;
}

.advantage__sp-img {
    display: none;
}

.advantage__item {
    width: 50%;
    padding: 0;
}

.advantage__second-item {
    margin-left: 5%;
    width: 45%;
}

.advantage__item-index {
    position: relative;
    width: 50px;
    height: 50px;
}

.advantage__item-num {
    font-size: 38px;
    color: #4294AC;
    position: absolute;
    top: 60%;
    left: 50%;
    z-index: 1;
}

.advantage__item-circle {
    width: 98px;
    height: 98px;
    border-radius: 50%;
    background: #D6E6EB;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.advantage__item-txt-box {
    width: 40%;
    max-width: 530px;
    position: absolute;
    margin-top: 25px;
    margin-left: 30px;
    text-align: left;
    z-index: 1;
    color: #333333;
}

.advantage__item-lead {
    font-size: 20px;
    font-weight: bold;
    line-height: 2.0em;
    z-index: 2;
}

.advantage__item-txt {
    font-size: 16px;
    line-height: 1.8em;
    margin-top: 20px;
    z-index: 2;
}

.sp-advantage__img {
    display: none;
}

.advantage__p-sp {
    display: none;
}

.advantage__item-bold-txt{
    font-size: 16px;
    line-height: 1.8em;
    margin-top: 20px;
    z-index: 2;
}


@media screen and (max-width: 960px) {
    .advantage_char01 {
        font-size: 31px;
        color: #4294AC;
    }

    .advantage_char02 {
        font-size: 16px;
        font-family: normal;
    }

    .advantage_char03 {
        font-size: 18px;
        font-weight: bold;
    }

    .advantage_char04 {
        font-size: 23px;
    }

    .advantage_char05 {
        font-size: 24px;
    }

    .advantage__list {
        margin-top: 50px;
    }

    .advantage__row {
        margin-left: 5%;
        margin-right: 5%;
        margin-bottom: 0px;
        display: flex;
        flex-flow: column;
        min-height: 1100px;
    }

    .advantage__second-row {
        min-height: 1000px;
    }

    .advantage__pc-img {
        display: none;
    }

    .advantage__sp-img {
        display: block;
        width: 80%;
        height: auto;
        margin: 40px 0;
    }

    .advantage__item {
        width: 100%;
        padding: 0;
    }

    .advantage__second-item {
        margin-left: 0;
        width: 100%;
    }

    .advantage__item-index {
        position: relative;
        width: 50px;
        height: 50px;
    }

    .advantage__item-num {
        font-size: 38px;
        color: #4294AC;
        position: absolute;
        top: 60%;
        left: 30%;
        z-index: 1;
    }

    .advantage__item-circle {
        width: 98px;
        height: 98px;
        border-radius: 50%;
        background: #D6E6EB;
        position: absolute;
        top: 0;
        left: -10%;
        z-index: 0;
    }

    .advantage__item-txt-box {
        width: 90%;
        max-width: 800px;
        position: none;
        margin-top: 25px;
        margin-left: 0;
        text-align: left;
        z-index: 1;
        color: #333333;
    }

    .advantage__item-lead {
        font-size: 18px;
        font-weight: bold;
        line-height: 2.0em;
        z-index: 2;
    }

    .advantage__item-txt {
        width: 90%;
        font-size: 16px;
        line-height: 2.0em;
        margin-top: 20px;
        z-index: 2;
    }

    .advantage__item-bold-txt{
        font-size: 16px;
        line-height: 1.8em;
        margin-top: 15px;
        z-index: 2;
    }
}

@media screen and (max-width: 590px) {
    .advantage__row {
        margin-left: 5%;
        margin-right: 5%;
        margin-bottom: 0px;
        margin-top: 10px;
        display: flex;
        flex-flow: column;
        min-height: 850px;
    }

    .advantage__second-row {
        min-height: 900px;
    }

    .comparison__feature-sp-img {
        width: 750px;
    }
}XServerがDNSの1つを別データセンターに移動させる事発表
https://xserver.ne.jp/news_detail.php?view_id=9055

自分が↑で書いてた問題(複数のDNSあっても1つのDCにあるので1つのDCの障害で壊滅)の対応をしてくれたという事に

因みにこのDNSどこ置くのだろうとIP確認したらAWSだった😲

潔い&ユーザファーストの観点で偉い判断

/* support */
.support-info {
    width: 100%;
}

.support-info__row {
    margin-top: 100px;
    margin-bottom: 100px;
    display: flex;
    color: #333333;
}

.support-info-pc__img {
    width: 50%;
    margin-left: auto;
    margin-left: right;
    max-width: 550px;
    padding: 0px 15px;
    height: 100%;
}

.support-second__img {
    max-width: 500px;
    margin-right: 5%;
}

.support-info__right-txt-area {
    padding-left: 30px;
}

.support-info__txt-area {
    width: 50%;
    margin-left: auto;
    margin-left: right;
    max-width: 540px;
    padding: 0px 20px;
    height: auto;
    text-align: left;
}

.support-info__lead {
    font-size: 24px;
    font-weight: bold;
    line-height: 1.5em;
    text-decoration: underline;
    text-decoration-color: rgb(206, 73, 147, 0.9);
    text-underline-offset: 0em;
    text-decoration-thickness: 5px;
    margin-bottom: 30px;
}

.support-info__caption {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.8em;
    margin-bottom: 20px;
}

.support-info__caption-bold {
    line-height: 2em;
}

.support-info__caption-lead {
    text-align: center;
    font-size: 14px;
    color: #FFFFFF;
    font-weight: bold;
    background-color: #CE4993;
    border-radius: 15px;
    padding: 15px 0px;
    width: 250px;
    margin-bottom: 20px;
}

.support-info__txt {
    font-size: 16px;
    line-height: 2.0em;
    margin-bottom: 2em;
    width: 100%;
}

.support-info__point-area {
    width: 100%;
    min-width: 400px;
    height: 150px;
    position: relative;
}

.support-info__point-logo {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #F8DCEC;
    border-radius: 51px;
}

.support-info__point-logo-txt {
    position: absolute;
    top: 25%;
    left: 25%;
    color: #CE4993;
    font-size: 14px;
    font-weight: bold;
    transform: matrix(0.89, -0.45, 0.45, 0.89, 0, 0);
}

.support-info__point-lead {
    font-size: 18px;
    font-weight: bold;
    position: absolute;
    top: 10%;
    left: 20%;
}

.support-info__point-txt {
    position: absolute;
    top: 20%;
    left: 10%;
    color: #333333;
    line-height: 2.0em;
    font-size: 16px;
}

.support-info__point-lead-txt {
    position: absolute;
    top: 40%;
    left: 10%;
    color: #333333;
    line-height: 2.0em;
    font-size: 16px;
    width: 100%;
}

.support-info__pc-list-img {
    width: 100%;
    max-width: 960px;
    height: 100%;
}

.support-info__sp-list-img {
    display: none;
}

.support-info-sp__img {
    display: none;
}

.support-char01 {
    font-size: 16px;
    font-weight: normal;
}

.sp-guidance {
    display: none;
}

@media screen and (max-width: 960px) {
    .support-char01 {
        font-size: 14px;
        font-weight: normal;
        line-height: 1em;
    }

    .support-info__row {
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 5%;
        margin-right: 5%;
        display: flex;
        flex-flow: column;
        margin-bottom: 2em;
    }

    .support-info-pc__img {
        display: none;
    }

    .support-info-sp__img {
        display: block;
        width: 100%;
        height: auto;
        margin: 40px 0;
    }

    .support-info__txt-area {
        width: 100%;
        height: auto;
        text-align: left;
        padding: 0px 0px;
        max-width: 800px;
    }

    .support-info__right-txt-area {
        padding-left: 0;
    }

    .support-info__lead {
        font-size: 18px;
        margin-top: 30px;
    }

    .support-info__caption {
        font-size: 16px;
        /* width: 88%; */
        line-height: 1.5em;
    }

    .support-info__txt {
        font-size: 16px;
        color: #333333;
        line-height: 1.5em;
        margin-bottom: 1em;
        width: 100%;
    }

    .support-info__point-area {
        height: 100px;
        min-width: 100px;
        position: relative;
        width: 100%;
        margin-bottom: 25px;
    }

    .support-info__point-logo {
        width: 40px;
        height: 40px;
    }

    .support-info__point-logo-txt {
        position: absolute;
        top: 25%;
        left: 25%;
        color: #CE4993;
        font-size: 10px;
        font-weight: bold;
        transform: matrix(0.89, -0.45, 0.45, 0.89, 0, 0);
    }

    .support-info__point-txt {
        position: absolute;
        top: 20%;
        left: 15%;
        color: #333333;
        line-height: 1.5em;
        font-size: 14px;
    }

    .support-info__pc-list-img {
        display: none;
    }

    .support-info__sp-list-img {
        display: block;
        width: 90%;
        height: auto;
        margin-left: 5%;
        margin-right: 5%;
        margin-bottom: 50px;
    }

    .support-second__img {
        width: 100%;
        margin-right: 0%;
    }

    .support-info__three-row {
        min-height: 720px;
    }

    .support-info__point-lead-txt {
        position: absolute;
        top: 40%;
        left: 5%;
        color: #333333;
        line-height: 1.5em;
        font-size: 14px;
    }

    .support-info__caption-lead {
        width: 230px;
        padding: 10px 0px;
        border-radius: 10px;
        margin-bottom: 10px;
    }

    .support-info__point-lead {
        font-size: 16px;
    }

    .sp-guidance {
        display: block;
    }
}

/* step */
.step-triangle {
    width: 30%;
    height: auto;
}

.step_char01 {
    font-size: 43px;
    color: #4294AC;
}

.step__boxes {
    margin-top: 100px;
    margin-left: auto;
    margin-right: auto;
    width: 600px;
}

.step__box {
    border-radius: 15px;
    background-color: #D6E6EB;
    z-index: 0;
    padding: 20px 0;
    margin-top: 0;
    margin-bottom: 0;
}

.step__box-heading {
    padding: 10px 0;
    width: 100%;
    z-index: 1;
    display: flex;
    justify-content: center;
    /*左右中央揃え*/
    align-items: center;
}

.step__box-index {
    padding: 7px;
    background-color: #4294AC;
    border-radius: 7px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
}

.step__box-ttl {
    color: #28748B;
    font-size: 20px;
    font-weight: bold;
}

.step__box-txt {
    margin: 10px 0;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8em;
}

.step_container {
    text-align: center;
}

@media screen and (max-width: 960px) {
    .step-triangle {
        width: 50%;
        height: auto;
    }

    .step_char01 {
        font-size: 26px;
        color: #4294AC;
    }

    .step__boxes {
        margin-top: 50px;
        margin-left: 10%;
        margin-right: 10%;
        width: 80%;
    }

    .step__box {
        border-radius: 15px;
        background-color: #D6E6EB;
        z-index: 0;
        padding: 10px 0;
    }

    .step__box-heading {
        padding: 5px 0;
        width: 100%;
        z-index: 1;
        display: flex;
        justify-content: center;
        /*左右中央揃え*/
        align-items: center;
    }

    .step__box-index {
        padding: 7px;
        background-color: #4294AC;
        border-radius: 7px;
        color: #FFFFFF;
        font-size: 12px;
        font-weight: bold;
    }

    .step__box-ttl {
        color: #28748B;
        font-size: 17px;
        font-weight: bold;
    }

    .step__box-txt {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 5%;
        margin-right: 5%;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5em;
    }
}


/* price */
.price-container {
    padding: 100px 0px 100px;
    background-color: #FFFFFF;
    margin-left:8%;
    margin-right:8%;
    margin-top: 150px;
    margin-bottom: 50px;
    border-radius: 62px;
    text-align: center;
}

.price__list {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin: 5px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.price__left-item {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.price__left-box {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    border: solid 1px #4294AC;
    border-radius: 18px;
    padding: 30px 0;
    position: relative;
}

.price__left-box-caption {
    font-size: 19px;
    font-weight: bold;
    color: #FFFFFF;
    border-radius: 51px;
    padding: 15px 30px;
    position: absolute;
    width: 130px;
    top: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    transform: translateY(-50%);
}

.price__left-box-txt {
    font-size: 30px;
    font-weight: bold;
    color: #D1469E;
    padding: 35px 0;
    text-align: center;
}

.price-cross {
    width: 10%;
    min-width: 60px;
    max-width: 80px;
    margin-left: auto;
    margin-right: auto;
    font-size: 60px;
    background: -moz-linear-gradient(left, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: -webkit-linear-gradient(left, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    background: linear-gradient(to right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.price__right-item {
    width: 50%;
}

.price__right-box {
    border: solid 1px #4294AC;
    border-radius: 18px;
    padding: 30px 20px;
    position: relative;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    min-width: 400px;
}

.price__right-box-caption {
    font-size: 19px;
    font-weight: bold;
    color: #FFFFFF;
    border-radius: 51px;
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    padding: 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transform: translateY(-50%);
}

.price__right-txt-box {
    font-size: 28px;
    font-weight: bold;
    color: #D1469E;
    margin-top: 2em;
    margin-bottom: 1.5em;
    text-decoration: underline;
    text-decoration-color: rgb(66, 148, 172, 1);
    text-underline-offset: 1em;
    text-decoration-thickness: 1px;
}

.price-note {
    margin-top: 3em;
    margin-bottom: 3em;
    min-width: 450px;
    width: 60%;
    margin-left: auto;
    margin-right:auto;
    position: relative;
}

.price-note__txt {
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    line-height: 2.0em;
    text-align: center;
    padding-left: 150px;
    padding-top: 15px;
}

.price-catch {
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    line-height: 2.0em;
}

.price-note__point-logo {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 30%;
    right: 30%;
    background-color: #F8DCEC;
    border-radius: 51px;
}

.price-note__point-logo-txt {
    position: absolute;
    top: 30%;
    left: 30%;
    right: 30%;
    color: #CE4993;
    font-size: 14px;
    font-weight: bold;
    transform: matrix(0.89, -0.45, 0.45, 0.89, 0, 0);
}

.course-name {
    font-size: 15px;
    color: #333333;
}

.tax-char {
    font-size: 14px;
}

@media screen and (max-width: 960px) {
    .price-container {
        padding: 30px 0px 50px;
        text-align: center;
        background-color: #FFFFFF;
        margin: 70px 20px 10px;
        border-radius: 62px;
    }

    .price-content {
        margin: 70px 0 0;
    }

    .price__list {
        width: 100%;
        margin: 5% 0;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }

    .price__left-item {
        width: 80%;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }

    .price__left-box {
        width: 100%;
        border: solid 1px #4294AC;
        border-radius: 18px;
        padding: 15px 0;
        position: relative;
    }

    .price__left-box-caption {
        width: 40%;
        font-size: 15px;
        font-weight: bold;
        color: #FFFFFF;
        border-radius: 51px;
        padding: 15px 25px;
        position: absolute;
        top: 0;
        left: 30%;
        right: 30%;
        transform: translateY(-50%);
    }

    .price__left-box-txt {
        font-size: 28px;
        font-weight: bold;
        color: #D1469E;
        padding: 25px 0;
    }

    .price-cross {
        width: 100%;
        font-size: 80px;
    }

    .price__right-item {
        margin-top: 20px;
        width: 90%;
    }

    .price__right-box {
        width: 100%;
        border: solid 1px #4294AC;
        border-radius: 18px;
        padding: 20px 0 50px;
        position: relative;
        min-width: 90%;
    }

    .price__right-box-caption {
        width: 40%;
        font-size: 15px;
        padding: 15px;
        margin: 0;
        position: absolute;
        top: 0;
        left: 30%;
        right: 30%;
        transform: translateY(-50%);
    }

    .price__right-txt-box {
        font-size: 20px;
        font-weight: bold;
        color: #D1469E;
        margin-top: 40px;
        margin-bottom: 30px;
        padding: 0;
        text-decoration: underline;
        text-decoration-color: rgb(66, 148, 172, 1);
        text-underline-offset: 1em;
        text-decoration-thickness: 1px;
    }

    .price-note {
        height: 100px;
        width: 90%;
        min-width: 150px;
        margin-top: 3em;
        margin-bottom: 1em;
        margin-left: 5%;
        margin-right: 5%;
        position: relative;
    }

    .price-note__txt {
        width: 100%;
        font-size: 14px;
        font-weight: bold;
        color: #333333;
        line-height: 1.5em;
        position: absolute;
        top: 20%;
        left: 5%;
        text-align: center;
        padding-left: 0;
    }

    .price-note__point-logo {
        width: 50px;
        height: 50px;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #F8DCEC;
        border-radius: 51px;
    }

    .price-note__point-logo-txt {
        font-size: 16px;
        line-height: 1.5em;
        position: absolute;
        top: 25%;
        left: 25%;
        color: #CE4993;
        font-size: 14px;
        font-weight: bold;
        transform: matrix(0.89, -0.45, 0.45, 0.89, 0, 0);
    }

    .price-catch {
        margin-left: 10%;
        margin-right: 10%;
        font-size: 16px;
        line-height: 1.5em;
        text-align: left;
    }

    .course-name {
        font-size: 13px;
        color: #333333;
    }

    .tax-char {
        font-size: 12px;
    }
}

/* course */

.course__feature {
    margin-top: 5.0em;
}

.course__feature-img {
    width: 100%;
    max-width: 1280px;
    height: auto;
}

.course__feature-sp-img {
    display: none;
}

@media screen and (max-width: 960px) {
    .course__feature {
        margin-top: 50px;
        margin-left: 0%;
        margin-right: 0%;
        overflow: scroll;
        margin-top: 50px;
        /*
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        */
    }

    .course__feature-img {
        display: none;
    }

    .course__feature-sp-img {
        display: block;
        width: 120vw;
        height: 100%;
    }
}

/* FAQ */
.faq__char {
    font-size: 30px;
    color: #CE3B99;
}

.q__char {
    font-size: 26px;
    color: #CE3B99;
    font-weight: bold;
}

.faq-cards {
    margin-left: 10%;
    margin-right: 10%;
    text-align: left;
}

.faq-card {
    width: 100%;
    background-color: #F2E6ED;
    border-radius: 16px;
    padding: 30px 40px;
    z-index: 0;
    margin-bottom: 20px;
}

.faq-card__q {
    padding-left: 20px;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}

.faq-card__a {
    min-height: 200px;
    font-size: 16px;
    background-color: #FFFFFF;
    border-radius: 17px;
    z-index: 1;
    padding: 20px 50px;
    line-height: 2.0em;
    color: #333333;
}

@media screen and (max-width: 960px) {
    .faq__char {
        font-size: 26px;
        color: #CE3B99;
    }

    .q__char {
        font-size: 25px;
        color: #CE3B99;
        font-weight: bold;
    }

    .faq-cards {
        margin-left: 0%;
        margin-right: 0%;
        text-align: left;
    }

    .faq-card {
        width: 100%;
        height: auto;
        background-color: #F2E6ED;
        border-radius: 16px;
        padding: 1em 1em;
        z-index: 0;
        margin-bottom: 20px;
    }

    .faq-card__q {
        padding-left: 0px;
        font-size: 15px;
        font-weight: bold;
        line-height: 2.0em;
        margin-bottom: 1em;
    }

    .faq-card__a {
        height: auto;
        font-size: 14px;
        background-color: #FFFFFF;
        border-radius: 14px;
        z-index: 1;
        padding: 1em;
        line-height: 1.5em;
        color: #333333;
    }
}

/* footer */
footer {
    width: 100%;
    background-color: #4294AC;
}

.footer-info {
    display: flex;
    color: #FFFFFF;
    background-color: #4294AC;
    margin-left: 10%;
    margin-right: 10%;
    padding: 60px 0;
}

.footer-info-logo {
    width: 300px;
    text-align: right;
    border-right: 2px solid #FFFFFF;
    padding: 0 40px;
}

.footer-info-logo__img {
    width: 150px;
}

.footer-info-nav {
    width: 350px;
    padding: 0 40px;
}

.footer-info-nav__item {
    font-size: 15px;
    padding: 10px;
}

.footer-info-button {
    width: 200px;
    height: 45px;
    border: 3px solid #FFFFFF;
    border-radius: 51px;
    font-size: 12px;
    text-align: center;
    font-weight: bold;
    padding: 10px 0;
    line-height: 1.4em;
    margin-top: 30px;
}

.global-footer-nav__wrapper {
    display: flex;
    justify-content: center;
    color: #FFFFFF;
    font-size: 12px;
    padding: 0 0 15px;
}

@media screen and (max-width: 960px) {
    .footer-info {
        display: flex;
        flex-direction: column;
        color: #FFFFFF;
        background-color: #4294AC;
        margin-left: 5%;
        margin-right: 5%;
        padding: 30px 0;
    }

    .footer-info-logo {
        width: 50%;
        border-right: 0px solid #FFFFFF;
        padding: 0;
        margin-bottom: 20px;
        text-align: left;
    }

    .footer-info-nav {
        width: 100%;
        padding: 0;
    }

    .footer-info-nav__item {
        font-size: 15px;
        padding: 8px 0;
    }

    .footer-info-button {
        width: 200px;
        height: 40px;
        border: 3px solid #FFFFFF;
        border-radius: 51px;
        font-size: 12px;
        text-align: center;
        font-weight: bold;
        padding: 10px 0;
        line-height: 1.4em;
        margin-top: 20px;
        margin-left: auto;
        margin-right: auto;
    }

    .global-footer-nav__wrapper {
        display: flex;
        justify-content: center;
        color: #FFFFFF;
        font-size: 9px;
        padding: 0 0 15px;
    }
}



/* contact.html */
/* hero */
.hero-content {
    width: 100%;
    background-image: url(/img/hero_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 112px;
    margin-top: 70px;

}

.hero-content-container {
    color: #333333;
    margin-left: 30%;
    margin-right: 30%;
    min-width: 400px;
    background-color: rgba(255, 255, 255, 1.0);
    text-align: center;
    padding: 30px;
    outline: 1px solid #4294AC;
    outline-offset: -4px;
}

.hero-content-container__top-catch {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.5em;
    text-decoration: underline;
    text-decoration-color: rgb(206, 73, 147, 0.5);
    text-underline-offset: -0.2em;
    text-decoration-thickness: 4px;
}

.hero-content-container__bottom-catch {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 0.8em;
    line-height: 1.5em;
}


.hero-content-container-ttl {
    font-size: 40px;
    letter-spacing: 0.1em;
    font-weight: bold;
    padding: 5px 30PX;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20PX;
    border-bottom: 10px solid #D9147E;
    border-image: linear-gradient(to right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
    border-image-slice: 1;
}

.hero-content-container__txt {
    font-size: 18px;
    font-weight: bold;
    line-height: 2.0em;
}

.hero-content-container__img {
    margin-top: 30px;
    margin-bottom: 10px;
    margin-left: 45px;
    margin-right: 45px;
    width: 12%;
}

@media screen and (max-width: 960px) {
    .hero-content {
        width: 100%;
        background-image: url(/img/hero_bg_sp.webp);
        background-repeat: no-repeat;
        background-size: cover;
        padding: 30px 5px;
        margin-top: 50px;
    }

    .hero-content-container {
        margin-left: auto;
        margin-right: auto;
        width: 300px;
        min-width: 150px;
        background-color: rgba(255, 255, 255, 1.0);
        text-align: center;
        padding: 20px 30px;
        outline: 1px solid #4294AC;
        outline-offset: -4px;
    }

    .hero-content-container__catch {
        font-size: 14px;
        color: #333333;
        margin-bottom: 10px;
        line-height: 1.5em;
    }

    .hero-content-container-ttl {
        font-size: 30px;
        letter-spacing: 0.1em;
        font-weight: bold;
        margin-left: 10%;
        margin-right: 10%;
        padding: 0px 20PX;
        margin-bottom: 10px;
        border-bottom: 6px solid #D9147E;
        border-image: linear-gradient(to right, #D9147E, #853B91 25%, #286AAC 50%, #15C3D9);
        border-image-slice: 1;
    }

    .hero-content-container__txt {
        font-size: 18px;
        font-weight: bold;
        line-height: 2.0em;
    }

    .hero-content-container__img {
        margin-top: 30px;
        margin-bottom: 10px;
        margin-left: 45px;
        margin-right: 45px;
        width: 12%;
    }
}

/* contact-step */
.three-step-content {
    margin-left: 10%;
    margin-right: 10%;
    padding-bottom: 200px;
    text-align: center;
    color: #333333;
}

.three-step-content__haeding {
    margin: 50px 0;
    font-size: 24px;
    font-weight: bold;
}

.three-step-char01 {
    font-size: 45px;
    color: #4294AC;
}

.three-step-content__list {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0 0 50px;
}

.three-step-content__card {
    width: 30%;
    height: auto;
}

.three-step-jump-button {
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
    height: auto;
    padding: 20px 0;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: bold;
    background-color: #4294AC;
    box-shadow: 0px 5px 6px #00000029;
    border-radius: 12px;
}

.sp-button {
    display: none;
}

@media screen and (max-width: 960px) {
    .three-step-content {
        margin-left: 10%;
        margin-right: 10%;
        padding-bottom: 200px;
        text-align: center;
        color: #333333;
    }

    .three-step-content__haeding {
        margin: 30px 0;
        font-size: 20px;
        font-weight: bold;
    }

    .three-step-char01 {
        font-size: 35px;
        color: #4294AC;
    }

    .three-step-content__list {
        width: 100%;
        display: flex;
        flex-flow: column;
        justify-content: center;
        margin: 0 0 50px;
    }

    .three-step-content__card {
        width: 100%;
        height: auto;
    }

    .three-step-jump-button {
        margin-left: auto;
        margin-right: auto;
        width: 300px;
        height: auto;
        padding: 20px 0;
        color: #FFFFFF;
        font-size: 20px;
        font-weight: bold;
        background-color: #4294AC;
        box-shadow: 0px 5px 6px #00000029;
        border-radius: 12px;
    }
    .sp-button {
        margin-top: 30px;
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 300px;
        height: auto;
        padding: 20px 30px;
        color: #FFFFFF;
        font-size: 20px;
        font-weight: bold;
        background-color: #4294AC;
        box-shadow: 0px 5px 6px #00000029;
        border-radius: 12px;
    }
}

/* bonus */
.bonus {
    background-color: #FFFFFF;
    width: 100%;
    height: 400px;
}


.bonus-content {
    margin-left: 10%;
    margin-right: 10%;
    position: relative;
}

.bonus-content__catch {
    position: absolute;
    top: 0;
    width: 280px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    transform: translateY(-50%);
}

.bonus-content__catch-img {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: auto;
}

.bonus-content__list {
    padding: 150px;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bonus-content__item {
    width: 50%;
    padding: 0 30px;
    min-width: 500px;
    height: auto;
    justify-content: center;
    align-items: center;
}

.bonus-content__sp-item {
    display: none;
}

@media screen and (max-width: 960px) {
    .bonus {
        background-color: #FFFFFF;
        width: 100%;
        height: auto;
    }

    .bonus-content {
        margin-left: 10%;
        margin-right: 10%;
        position: relative;
    }

    .bonus-content__catch {
        position: absolute;
        top: 0;
        width: 280px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
        transform: translateY(-50%);
    }

    .bonus-content__catch-img {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        height: auto;
    }

    .bonus-content__list {
        padding: 130px 0 0;
        width: 100%;
        height: auto;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }

    .bonus-content__item {
        display: none;
    }

    .bonus-content__sp-item {
        width: 100%;
        min-width: 200px;
        height: auto;
        justify-content: center;
        align-items: center;
        margin: 15px 0;
        display: block;
    }
}
@media screen and (max-width: 600px) {
    .bonus-content__catch {
        position: absolute;
        top: -10%;
        width: 60%;
        left: 20%;
        right: 20%;
        transform: translateY(-50%);
    }
    .bonus {
        background-color: #FFFFFF;
        width: 100%;
        height: auto;
    }
    .bonus-content__list {
        padding: 50px 0;
        margin-top: 100px;
    }
}

@media screen and (max-width: 477px) {
    .bonus {
        background-color: #FFFFFF;
        width: 100%;
        height: auto;
    }
    .bonus-content__catch {
        position: absolute;
        top: -10%;
        width: 60%;
        left: 20%;
        right: 20%;
        transform: translateY(-50%);
    }
    .bonus-content__list {
        margin-top: 0;
    }
}

/* flow */
.flow-content {
    text-align: center;
    padding: 100px 0;
}

.flow-content__headding {
    margin-top: 50px;
    margin-bottom: 50px;
    color: #333333;
    font-size: 29px;
    font-weight: bold;
}

.flow-content__img {
    width: 60%;
    margin-left: 20%;
    margin-right: 10%;
    padding-bottom: 50px;
}

.flow-sp-content__img {
    display: none;
}

.flow-jump-button {
    margin-left: auto;
    margin-right: auto;
    width: 300px;
    height: auto;
    padding: 20px 0;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: bold;
    background-color: #4294AC;
    box-shadow: 0px 5px 6px #00000029;
    border-radius: 12px;
}

@media screen and (max-width: 960px) {
    .flow-content {
        text-align: center;
        padding: 50px 0;
    }

    .flow-content__headding {
        margin-top: 0;
        margin-bottom: 50px;
        color: #333333;
        font-size: 22px;
        font-weight: bold;
    }

    .flow-content__img {
        display: none;
    }

    .flow-sp-content__img {
        display: block;
        width: 100%;
        margin-bottom: 50px;
    }
}

/* question */
.question {
    background-color: #FFFFFF;
}

.question-content {
    margin-left: 10%;
    margin-right: 10%;
}

.question-content__heading {
    padding: 50px 0;
    font-size: 29px;
    font-weight: bold;
    color: #333333;
    text-align: center;
}

.question-content__row {
    display: flex;
    padding: 10px 0;
}

.question-content__card {
    margin: 0 10px;
    width: 50%;
    background: #d6e6eb;
    border-radius: 15px;
    padding: 15px;
}

.question-content__card-txt-area {
    background: #FFFFFF;
    font-weight: bold;
    color: #333333;
    border-radius: 15px;
    padding: 20px 40px;
    height: 100%;
}

.question-content__card-lead {
    font-size: 20px;
    padding: 10px 0 20px;
}

.question-content__card-txt {
    font-size: 15px;
    line-height: 2.0em;
}

.question-content__sup {
    text-align: center;
    font-size: 20px;
    color: #333333;
    font-weight: bold;
    padding: 50px 0;
}

@media screen and (max-width: 960px) {
    .question-content {
        margin-left: 2%;
        margin-right: 2%;
    }

    .question-content__heading {
        padding: 50px 0 30px;
        font-size: 22px;
    }

    .question-content__row {
        margin-left: 0;
        margin-right: 0;
        display: flex;
        flex-flow: column;
        padding: 0px 0;
    }

    .question-content__card {
        margin: 10px 0;
        width: 100%;
        background: #d6e6eb;
        border-radius: 15px;
        padding: 15px;
    }

    .question-content__card-txt-area {
        background: #FFFFFF;
        font-weight: bold;
        color: #333333;
        border-radius: 15px;
        padding: 10px 20px;
        height: 100%;
        min-height: 200px;
    }

    .question-content__card-lead {
        font-size: 16px;
        padding-bottom: 20px;
    }

    .question-content__card-txt {
        font-size: 13px;
        line-height: 1.5em;
    }

    .question-content__sup {
        text-align: center;
        font-size: 20px;
        color: #333333;
        font-weight: bold;
        padding: 50px 0;
    }
}

/* schedule */

.schedule-content {
    color: #333333;
    font-weight: bold;
    text-align: center;
    padding: 50px 0;
}

.schedule-content__haeding {
    padding: 50px 0;
    font-size: 29px;
}

.schedule-content__caption {
    padding: 10px 0 50px;
    font-size: 16px;
}

@media screen and (max-width: 960px) {
    .schedule-content {
        color: #333333;
        font-weight: bold;
        text-align: center;
        padding: 50px 0;
    }

    .schedule-content__haeding {
        padding: 0 0 50px;
        font-size: 22px;
    }

    .schedule-content__caption {
        padding: 10px 0 50px;
        font-size: 16px;
    }
}

/* notion */
.notion {
    background-color: #FFFFFF;
    text-align: center;
}

.notion-content {
    margin-top: 70px;
    margin-bottom: 100px;
    margin-left: 10%;
    margin-right: 10%;
    width: 80%;
}

.notion-content__heading {
    margin-top: 120px;
    margin-bottom: 50px;
    font-size: 50px;
}

.notion-content__table {
    font-size:20px;
    text-align:left;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #333333;
}

.notion-content__th {
    background-color: #e9e9e9;
    padding: 15px;
    border: 1px solid #333333;
    font-size: 20px;
}

.notion-content__td {
    padding: 15px;
    border: 1px solid #333333;
    font-size: 20px;
}

@media screen and (max-width: 960px) {
    .notion-content__heading {
        margin-top: 100px;
        margin-bottom: 50px;
        font-size:23px;
    }

    .notion-content {
        margin-top: 70px;
        margin-bottom: 100px;
        margin-left: 5%;
        margin-right: 5%;
        width: 90%;
    }

    .notion-content__th {
        background-color: #e9e9e9;
        padding: 10px;
        border: 1px solid #333333;
        font-size: 16px;
    }

    .notion-content__td {
        padding: 10px;
        border: 1px solid #333333;
        font-size: 16px;
    }
}


/* ボタン全体 */
.flowbtn7{
border-radius:50%;
position:relative;
display:inline-block;
width:50px;
height:50px;
font-size:30px;
color:#fff!important;
text-decoration:none;
transition:.5s;			
}
/* アイコンをど真ん中に*/
.flowbtn7 i{
position:absolute;
top:50%;
left:50%;
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
}

ul.snsbtniti{
padding:0!important;
list-style: none;
}
/* ボタン同士の余白 */
.snsbtniti li{
float:left;
text-align:center !important;
margin-left:15px;
}
/* ボタンにマウスを乗せた時 */
.flowbtn7:hover{
-webkit-transform:translateY(-5px);
-ms-transform:translateY(-5px);
transform:translateY(-5px);
}
/* Twitter */
.fl_tw7{
background:linear-gradient(135deg, #13f1fc 0%,#0470dc 100%);
}
/* Instagramアイコン位置 */
.insta_btn7 .fa-instagram{
font-size:35px;	
}
/* Instagram紫グラデ背景 */
.insta_btn7{
background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
overflow:hidden;	
}
/* Instagramオレンジグラデ背景 */
.insta_btn7:before{
content: '';
position:absolute;
top:27px;
left:-12px;
width:59px;
height:40px;
background:-webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
background:radial-gradient(#ffdb2c 5%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
}
/* Facebook */
.fl_fb7{
background: linear-gradient(135deg, #6699ff 0%,#3b5998 100%);
}
/* Feedly */
.fl_fd7{
background:linear-gradient(135deg, #b1ea4d 0%,#459522 100%);
font-size:28px;
}
/* Pocket */
.fl_pk7{
background:linear-gradient(135deg, #f36265 0%,#dd4f68 100%);
}
/* はてブ */
.fl_hb7{
background: linear-gradient(to bottom, #1fbccd 0%, #1c91d4 84%);
font-size:25px;
}
/* YouTube */
.fl_yu7{
background:linear-gradient(135deg, #f5515f 0%,#c9293c 100%);
font-size:26px;
}
/* LINE */
.fl_li7{
background: linear-gradient(135deg, #3a9278 0%,#00c300 100%);
}
/* メールボタン */
.fl_ma7{
background:linear-gradient(135deg, #fad961 0%,#f76b1c 100%);
font-size:26px;	
}