/*
  Top
*/
/*------------------------
  Hero
------------------------*/
#home-hero {
    position: relative;
    height: 28.54166667vw;
    background-color: #0071bc;
    color: #fff;
    padding: 0 5vw;
}

#home-hero .fv_img {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

#home-hero .fv_img img {
    height: 100%;
    width: auto;
    object-fit: cover;
}

#home-hero .fv_img_sp {
    margin: 0 -5.333vw;
}

#home-hero .icon_800 {
    top: 3.47vw;
    right: 3.47vw;
    position: absolute;
    background: #FFE946;
    width: 15vw;
    height: 15vw;
    border-radius: 50%;
    z-index: 10;
    font-weight: 700;
    text-align: center;
    filter: drop-shadow(0.49375 0 2.70833vw rgba(5, 77, 124, 0.16));
}

#home-hero .icon_800 .icon_800_block {
    padding: 2.99vw 0 0;
    margin: 0 auto;
}

#home-hero .icon_800 .icon_800_block .txt {
    color: #0071BC;
    font-size: 1.11vw;
    line-height: 1;

}

#home-hero .icon_800 .icon_800_block .txt .num {
    font-size: 5.76vw;
    line-height: 0.9;
}

#home-hero .icon_800 .icon_800_block .txt .kinds {
    font-size: 2.22vw;
    line-height: 1.5;
}

#home-hero .home-hero-contents {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
}

#home-hero .home-hero-contents .introduction_txt {
    position: relative;
    font-size: 5.54vw;
    font-weight: 700;
    letter-spacing: 0;
}

#home-hero .home-hero-contents .introduction_txt::before {
    position: absolute;
    bottom: 2.56vw;
    left: 0;
    content: "";
    width: 62%;
    height: 2px;
    background: #fff;
}

#home-hero .home-hero-contents .introduction_txt::after {
    position: absolute;
    bottom: 2.56vw;
    right: 0;
    content: "";
    width: 35%;
    height: 2px;
    background: #fff;
}

#home-hero .home-hero-contents .introduction_txt span {
    color: #FFE946;
    margin: 0 0 0 0.5vw;
}

#home-hero .home-hero-contents .introduction_txt .num {
    font-size: 12.05vw;
    letter-spacing: -0.04em;
    position: relative;
    top: 0.8vw;
    left: -0.4vw;
}

#home-hero .home-hero-contents .introduction_txt .num::before {
    position: absolute;
    bottom: 0;
    right: 5.7vw;
    content: "";
    width: 20%;
    height: 2px;
    background: #fff;
    transform: rotate(-45deg);
}

#home-hero .home-hero-contents .column-2:nth-child(1) {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
}

#home-hero .home-hero-contents .column-2:nth-child(2) {
    height: 100%;
}

#home-hero .home-hero-contents .column-2 img {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    width: auto;
    height: calc(100% + 10px);
    height: calc(100% + 0.833vw);
}

#home-hero .home-hero-contents h1,
#home-hero .home-hero-contents h2,
#home-hero .home-hero-contents p {
    letter-spacing: 0.05em;
}

#home-hero .home-hero-contents .home-hero-slogan {
    padding: 0.8rem 1.2rem;
    background: rgba(255, 255, 255, 0.18);
    font-size: 1.55vw;
    margin: 1.2vw 0 0;
    text-align: center;
    display: inline-block;
    letter-spacing: 0.04em;
}

#home-hero .home-hero-contents .home-hero-slogan span {
    color: #ffe946;
    font-size: 1.85972vw;
}


#home-hero .home-hero-contents .home-hero-txt {
    color: #ffe946;
    font-size: 5.55vw;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.01em;
    margin: 2.4vw 0 0;
}

#home-hero .home-hero-contents .home-hero-txt span {
    color: #fff;
    line-height: calc(119/79);
    font-size: 2.5vw;
    letter-spacing: -0.01em;
    display: block;
    margin: 0 0 -6.5vw;
}

#home-hero .home-hero-contents .home-hero-txt strong {
    font-size: 6.66vw;
    position: relative;
    top: 0.3vw;
}

#home-hero .home-hero-contents .home-hero-subtxt {
    font-size: 20px;
    font-size: 1.6680567139vw;
    font-weight: 700;
}

#home-hero .home-hero-contents .home-hero-subtxt em {
    font-size: 30px;
    font-size: 2.5020850709vw;
}

#home-hero .home-hero-contents .home-hero-form {
    margin-top: 1.8vw;
}

#home-hero .home-hero-contents .home-hero-form .form-block {
    width: 27.43055556vw;
    max-width: 395px;
    height: 2.82777778vw;
    padding: 0 0.20833333vw 0 0;
}
#home-hero .home-hero-contents .home-hero-form .form-block input {
    font-size: 0.972vw;
    margin: 0 0 0 1.25vw;
}

#home-hero .home-hero-contents .home-hero-form .form-block input[type=email] {
    width: 50%;
}

#home-hero .home-hero-contents .home-hero-form .form-block input[type=submit] {
    color: #444;
    height: 2.43055556vw;
    font-size: 0.833vw;
    padding: 0 0 0 0.27777778vw;
    line-height: 1;
}

#home-hero .home-hero-contents .home-hero-form p {
    color: #ffe946;
    font-size: 24px;
    font-size: 2.0016680567vw;
    font-weight: 700;
    margin-bottom: 5px;
    margin-bottom: 0.417vw;
}

#home-hero .home-hero-contents .home-hero-form .form-block+p {
    text-align: center;
    font-size: 1.01805556vw;
    font-weight: 400;
    line-height: calc(26/14);
    letter-spacing: 0.05em;
    color: #fff;
}

#home-hero .home-hero-contents .home-hero-form p {
    position: relative;
    font-size: 1.57vw;
    line-height: calc(40/22);
    font-weight: 700;
    color: #fff;
    margin-bottom: 5px;
}

#home-hero .home-hero-contents .home-hero-form .f-txt {
    display: table;
    margin: 0 auto 0.25vw;
    line-height: calc(40/22);
    position: relative;
    max-width: 1240px;
    font-size: 1.66666667vw;
}

#home-hero .home-hero-contents .home-hero-form .f-txt::before {
    position: absolute;
    top: 55%;
    left: -1.38888889vw;
    content: "";
    width: 1.38888889vw;
    height: 0.16666667vw;
    background: #fff;
    transform: translateY(-50%) rotate(75deg);
}

#home-hero .home-hero-contents .home-hero-form .f-txt::after {
    position: absolute;
    top: 55%;
    right: -1.38888889vw;
    content: "";
    width: 1.38888889vw;
    height: 0.16666667vw;
    background: #fff;
    transform: translateY(-50%) rotate(-75deg);
}

@media screen and (max-width: 1360px) {
    #home-hero {
        height: 28.54166667vw;
    }

    #home-hero .home-hero-contents .home-hero-txt {
        margin: 2.4vw 0 0;
    }
}

@media screen and (max-width: 1000px) {
    #home-hero .home-hero-contents .home-hero-txt {
        margin: 1.8rem 0 0;
    }
}

@media screen and (max-width: 767px) {
    #home-hero .fv_img img {

        height: auto;
        width: 100%;
        object-fit: cover;
    }
}
@media screen and (max-width: 767px) {
    #home-hero .home-hero-contents .home-hero-txt strong {
        font-size: 21vw;
        position: relative;
        top: 0.3vw;
    }
}
@media screen and (max-width: 767px) {
    #home-hero .home-hero-contents .home-hero-form .form-block{
    width: 89.2vw;
    max-width: 100%;
    height: 12.82051282vw;
    padding: 0 1.28vw 0 0;
    border-radius: 6.41025641vw;
}
}
@media screen and (max-width: 767px) {
    #home-hero .home-hero-contents .home-hero-form .form-block input[type=submit] {
    height: 10.256vw;
    font-size: 3.84vw;
    padding: 0 3vw;
    border-radius: 5.12vw;
}
}
@media screen and (max-width: 767px) {
    #home-hero .home-hero-contents .home-hero-form .form-block input {
    font-size: 3.84615385vw;
    margin: 0 0 0 5vw;
}
}

/*------------------------
  Feature_20231115
------------------------*/
#feature {
    padding: 0 3.47222222vw;
    max-width: 1240px;
    margin: 0 auto;
}

.feature-row {
    position: relative;
}

.feature_flex {
    display: flex;
    justify-content: space-evenly;
    z-index: 1;
    align-items: center;
}

.blue_bg {
    position: absolute;
    background-color: #0071BC;
    max-width: 1240px;
    width: 100%;
    height: 85%;
    bottom: 0;
}

.blue_bg::before {
    content: '';
    display: inline-block;
    position: absolute;
    width: 25%;
    height: 66%;
    background-image: url(../images/home/feature_icon.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: -40%;
    left: 6vw;
    z-index: -1;
}

.feature_flex>p {
    color: #FFF;
    font-size: clamp(1.5rem, 1vw + 0.5rem, 1.8rem);
    width: 37%;
    margin-top: 3.5vw;
}

.feature_img {
    width: 42%;
}

.feature_img>img {
    vertical-align: bottom;
}

.text_yellow {
    color: #FFE946;
}

.image_text {
    position: absolute;
    font-size: 1.2rem;
    right: 7%;
    bottom: -25px;
}

@media screen and (min-width: 1200px) {
    #home-hero .home-hero-contents .column-2:nth-child(1) {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
    }

    #home-hero .home-hero-contents .column-2:nth-child(2) img {
        left: 50px;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }

    #home-hero .home-hero-contents .home-hero-subtxt {
        font-size: 2rem;
    }

    #home-hero .home-hero-contents .home-hero-subtxt em {
        font-size: 3rem;
    }

     #home-hero .home-hero-contents .home-hero-form {
        margin: 1.8vw auto 0;
    }

    #home-hero .home-hero-contents .home-hero-form .form-block+p {
        font-size: 0.83333333vw;
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
   #home-hero {
        height: auto;
        padding: 0 5.333vw;
    }

    #home-hero .home-hero-contents .column-2 {
        width: 100%;
        text-align: center;
    }

    #home-hero .home-hero-contents .column-2:nth-child(1) {
        display: block;
    }

    #home-hero .home-hero-contents .column-2:nth-child(2) {
        margin-top: -35px;
    }

    #home-hero .home-hero-contents .column-2 img {
        position: relative;
        top: auto;
        left: auto;
        bottom: -10px;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        width: 100%;
        height: auto;
    }

    #home-hero .home-hero-contents .home-hero-slogan {
        padding: 2.05vw 1.28vw;
        background: rgba(255, 255, 255, 0.18);
        font-size: 5.13vw;
         margin: 6vw 0 2vw;
        letter-spacing: 0.04em;
    }

    #home-hero .home-hero-contents .home-hero-slogan span {
        font-size: 6.15vw;
    }

    #home-hero .home-hero-contents .home-hero-txt {
        font-size: 20vw;
        letter-spacing: -0.05em;
        line-height: 0.9;
        margin: -1rem 0 0;

    }

    #home-hero .home-hero-contents .home-hero-txt span {
        font-size: 13.08vw;
        letter-spacing: -0.01em;
        line-height: 1.5;
         margin: 1vw 0 -18vw;
    }

    #home-hero .home-hero-contents .home-hero-subtxt {
        font-size: 1.3rem;
        line-height: 1.3;
    }

    #home-hero .home-hero-contents .home-hero-subtxt em {
        font-size: 1.8rem;
    }

    #home-hero .home-hero-contents .home-hero-form {
        margin-top: 6.5vw;
    }

    #home-hero .home-hero-contents .home-hero-form .f-txt {
         font-size: 5vw;
        margin: 0 auto 1.25vw;
    }

    #home-hero .home-hero-contents .home-hero-form .f-txt::before {
        top: 48%;
        height: 0.54358974vw;
        width: 5.64102564vw;
        left: -5.64102564vw;
    }

    #home-hero .home-hero-contents .home-hero-form .f-txt::after {
        top: 48%;
        height: 0.54358974vw;
        width: 5.64102564vw;
        right: -5.64102564vw;
    }

    #home-hero .home-hero-contents .home-hero-form p {
        font-size: 1.8rem;
        margin-bottom: 8px;
    }

    #home-hero .home-hero-contents .home-hero-form .form-block+p {
        font-size: 2.82vw;
        margin: 2vw 0 12vw 0;
        letter-spacing: 0.1em;
    }
}

@media screen and (max-width: 374px) {
    #home-hero .home-hero-contents .home-hero-slogan {
        font-size: 1.4rem;
    }

    #home-hero .home-hero-contents .home-hero-txt {
        font-size: 2.6rem;
    }

    #home-hero .home-hero-contents .home-hero-subtxt {
        font-size: 1.3rem;
    }

    #home-hero .home-hero-contents .home-hero-subtxt em {
        font-size: 1.7rem;
    }
}


/*------------------------
    Company logo
  ------------------------*/
#company-logo {
    padding: 64px 0 0;
}

#company-logo .company-logo-ttl {
    color: #010C10;
    font-size: 2.4186822352vw;
    font-weight: 700;
    margin-bottom: 30px;
    text-align: center;
}

#company-logo .company-logo-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 30px auto 50px;
}

#company-logo .company-logo-row img {
    max-height: 82px;
    margin: 0 15px;
}

@media screen and (max-width: 767px) {
    #company-logo .company-logo-ttl {
        font-size: 2.2rem;
        margin-bottom: 20px;
    }

    #company-logo .company-logo-row {
        margin: 24px auto 32px;
    }

    #company-logo .company-logo-row img {
        max-height: 53px;
        margin: 0 10px;
    }
}

/*------------------------
  About
------------------------*/
#about .container {
    background: #fff;
}

#about .about-box {
    background-color: #0071bc;
    color: #fff;
}

#about .about-box .about-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

#about .about-box .detail {
    padding: 2.5vw 0 3.333vw;
}

#about .about-box p,
#about .about-box ul {
    font-size: 17px;
    font-size: 1.4178482068vw;
}

#about .about-box ul {
    list-style: disc;
    margin: 2vw;
}

#about .about-box ul li {
    color: #ffe946;
    padding: 0.417vw 0;
}

#about .about-box ul li .border {
    box-shadow: 0 1px 0 currentColor;
    display: inline-block;
}

#about .about-box img {
    width: 25vw;
}

@media screen and (min-width: 1200px) {
    #about .about-box .detail {
        padding: 30px 0 40px;
    }

    #about .about-box p,
    #about .about-box ul {
        font-size: 1.8rem;
    }

    #about .about-box ul {
        margin: 24px;
    }

    #about .about-box ul li {
        padding: 5px 0;
    }

    #about .about-box img {
        width: 360px;
    }
}

@media screen and (max-width: 767px) {
    #about {
        padding-top: 60px;
        margin-top: -60px;
    }

    #about .about-box .about-row {
        -webkit-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    #about .about-box .detail {
        padding: 30px 5.333vw 20px;
    }

    #about .about-box p,
    #about .about-box ul {
        font-size: 1.5rem;
    }

    #about .about-box ul {
        list-style: none;
        margin: 20px 0;
    }

    #about .about-box ul li {
        padding: 5px 0;
    }

    #about .about-box ul li .border {
        box-shadow: none;
        text-decoration: underline;
    }

    #about .about-box img {
        width: 200px;
        display: block;
        margin: 0 auto;
    }
}

/*------------------------
  Problems
------------------------*/
#problems {
    padding: 0 5vw;
    background: #EAF4FA;
}

#problems .container {
    padding: 81px 0 100px;
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    #problems .container {
        padding: 60px 0 80px;
    }
}

#problems .container .heading-large {
    margin: 0 auto 81px;
    line-height: 1.2;
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    #problems .container .heading-large {
        margin: 0 0 60px;
    }
}


#problems .problem-row .column-block {
    position: relative;
    background: #fff;
    width: 32%;
}

#problems .problem-row .column-block .box {
    position: relative;
}

#problems .problem-row .column-block .box .problem-icon {
    position: absolute;
    width: 23.2%;
    bottom: -1.3rem;
    left: 2.4rem;
}

#problems .problem-row .column-block .box .problem-txt {
    color: #0071BC;
    padding: 2.3rem 1.9rem 1rem 0;
    font-size: 1.8rem;
    line-height: 1.6;
    font-weight: 700;
    width: 62.972%;
    margin: 0 0 1rem auto;
}

#problems .problem-row .column-block .box .problem-txt .cap {
    display: inline-block;
    font-size: 1.6rem;
    line-height: 1.5;
    padding: 0.2rem 0.7rem;
    border: solid 1px #0071BC;
    margin: 0 0 0.8rem 0;
}

#problems .problem-row .column-block .box .problem-txt .inner-txt {
    font-size: 18px;
    letter-spacing: 0;
    line-height: 1.6;
}

#problems .problem-row .column-block .solution-box {
    position: relative;
    background: #0071BC;
    overflow: hidden;
}

#problems .problem-row .column-block .solution-box::after {
    position: absolute;
    content: "";
    top: 0;
    left: 50%;
    width: 0;
    height: 0;
    border-left: 1.6rem solid transparent;
    border-right: 1.6rem solid transparent;
    border-top: 1.5rem solid #fff;
    transform: translateX(-50%);
}

#problems .problem-row .column-block .solution-box .solution-txt {
    color: #fff;
    padding: 5.7rem 2.8rem 0;
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.7;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

#problems .problem-row .column-block .solution-box .solution-icon {
    width: 40.05%;
    margin: 0 auto;
    position: relative;
    bottom: -1rem;
    z-index: 1;
}

#problems .problem-row .column-block .solution-box .solution-icon::after {
    position: absolute;
    content: "";
    top: -18vw;
    left: 50%;
    transform: translate(-50%, 50%);
    background: rgba(255, 255, 255, 0.5);
    width: 39.24vw;
    height: 39.24vw;
    z-index: -1;
    border-radius: 50%;

}

#problems .problem-row .column-3 .problem-icon img {
    width: 100%;
}

#problems .problem-row .column-3 .problem-txt p {
    font-size: 18px;
    font-size: 1.5012510425vw;
}

#problems .problem-row .column-3 p {
    font-weight: 700;
    color: #0071bc;
}

#problems .phrase {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    margin-top: 3.333vw;
    padding: 7.5vw 0 0;
    background: url(../images/home/icon-arrow.svg) no-repeat center top/5vw auto;
}

#problems .phrase p {
    font-size: 32px;
    font-size: 2.6688907423vw;
    font-weight: 700;
    text-align: center;
    padding-left: 5.833vw;
    background: url(../images/home/icon-check.svg) no-repeat left center/5vw auto;
}

#problems .phrase .underline {
    background: linear-gradient(transparent 55%, #ffe946 45%);
}

#problems .problem-row .column-3 {
    padding: 20px;
}

#problems .problem-row .column-block .box .problem-txt p {
    font-size: 1.8rem;
}

#problems .problem-row .column-3 .problem-icon .cap {
    font-size: 1.3rem;
}

#problems .problem-row .column-3 .problem-txt {
    width: calc(100% - 80px);
    padding: 15px 0 15px 15px;
}

#problems .problem-row .column-3 .problem-txt p {
    font-size: 2rem;
}

#problems .phrase {
    margin-top: 40px;
    padding: 90px 0 0;
    background: url(../images/home/icon-arrow.svg) no-repeat center top/50px auto;
}

#problems .phrase p {
    font-size: 3.2rem;
    padding-left: 70px;
    background: url(../images/home/icon-check.svg) no-repeat left center/60px auto;
}

@media screen and (max-width: 1024px) {
    #problems .problem-row .column-block .solution-box .solution-txt {
        font-size: 160%;
    }
}

@media screen and (max-width: 767px) {
    #problems {
        padding: 0 5.333vw;
    }

    #problems .container {
        padding: 81px 0 0;
    }

    #problems .container .heading-large {
        margin: 0 0 12vw 0;
    }

    #problems .problem-row {
        margin: -5px 0;
        gap: 20vw;
    }

    #problems .problem-row .column-block {
        max-width: 100%;
        width: 100%;
    }

    #problems .problem-row .column-3 {
        width: 100%;
        border-radius: 15px;
        padding: 10px;
        margin: 5px 0;
    }

    #problems .problem-row .column-block .box .problem-icon {
        width: 15%;
    }

    #problems .problem-row .column-block .box .problem-txt {
        width: 70%;
    }

    #problems .problem-row .column-3 .problem-icon img {
        width: 50px;
        display: block;
        margin: 0 auto;
    }

    #problems .problem-row .column-3 .problem-icon .cap {
        font-size: 1.1em;
    }

    #problems .problem-row .column-3 .problem-txt {
        width: calc(100% - 80px);
        padding: 0 15px 0 0;
    }

    #problems .problem-row .column-3 .problem-txt p {
        font-size: 1.5rem;
    }

    #problems .phrase {
        margin-top: 20px;
        padding: 45px 0 0;
        background: url(../images/home/icon-arrow.svg) no-repeat center top/30px auto;
    }

    #problems .phrase p {
        font-size: 1.7rem;
        padding-left: 20px;
        background: url(../images/home/icon-check.svg) no-repeat left center/15px auto;
    }

    #problems .problem-row .column-block .solution-box .solution-icon::after {
        top: -60vw;
        left: 50%;
        transform: translate(-50%, 50%);
        background: rgba(255, 255, 255, 0.5);
        width: 130vw;
        height: 130vw;
    }
}

@media screen and (max-width: 575px) {
    #problems .problem-row {
        gap: 12vw;
    }

    #problems .problem-row .column-block .box .problem-icon {
        width: 18%;
    }
}

@media screen and (max-width: 480px) {
    #problems .container {
        padding: 45px 0 0;
    }
}

/*------------------------
  feature
------------------------*/
#feature .container {
    padding: 10rem 0 15rem;
}

#feature .container .feature_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2.4rem 0;
}

#feature .container .feature_box .column-3 {
    width: 31.929%;
    padding: 3.2rem;
    border: solid 1px #0071BC;
}

#feature .container .feature_box .column-3 .feature_txt {
    font-size: 1.6rem;
    letter-spacing: 0.07em;
    line-height: 1.8;
}

#feature .container .feature_box .column-3 .block {
    display: flex;
    justify-content: space-between;
    margin: 0 0 1.6rem 0;
    align-items: center;
}

#feature .container .feature_box .column-3 .block .feature-ttl {
    font-size: 2.4rem;
    font-weight: 700;
    color: #0071BC;
    line-height: 1.4;
}

#feature .container .feature_box .column-3 .block .feature_img {
    width: 100%;
    max-width: 6.4rem;
    margin: 0 0 0 3.2rem;
}

@media screen and (max-width: 1024px) {
    #feature .container {
        padding: 5.38rem 0;
    }

    #feature .container .feature_box .column-3 {
        padding: 1.6667vw;
        border: solid 1px #0071BC;
    }

    #feature .container .feature_box .column-3 .block .feature-ttl {
        font-size: 2.0016680567vw;
    }

    #feature .container .feature_box .column-3 .feature_txt {
        font-size: 1.1676396997vw;
    }
}

@media screen and (max-width: 767px) {
    #feature .container {
        padding: 7rem 0;
    }

    #feature .container .feature_box {
        gap: 1.4rem 0;
    }

    #feature .container .feature_box .column-3 .block {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    #feature .container .feature_box .column-3 .feature_txt {
        text-align: center;
        font-size: 1.4rem;
    }

    #feature .container .feature_box .column-3 .block .feature-ttl {
        font-size: 1.8rem;
        text-align: center;
        order: 2;
    }

    #feature .container .feature_box .column-3 .block .feature_img {
        width: 100%;
        max-width: 6rem;
        margin: 0 auto;
        order: 1;
    }
}

@media screen and (max-width: 480px) {
    #feature .container .feature_box .column-3 {
        width: 100%;
        padding: 1.6rem;
    }
}


/*------------------------
  offer
------------------------*/
#offer {
    background: #0071BC;
}

#offer .container {
    padding: 3.6rem 0 2.8rem;
}

#offer .offer_ttl {
    text-align: center;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: calc(43/24);
    color: #fff;
}

#offer .offer_ttl span {
    color: #ffe946;
}



@media screen and (max-width: 767px) {
    #offer .container {
        padding: 3.6rem 5.333vw 6.2rem;
    }

    #offer .form-block {
        border-radius: 25px;
        width: 100%;
        max-width: 385px;
        height: 50px;
        padding: 5px 5px 5px 20px;
        margin: 1rem auto 0;
    }

    #offer .form-block p {
        font-size: 1rem;
    }
}

/*------------------------
  Flow
------------------------*/
#flow {
    padding: 0 5vw;
}

#flow .flow-row .column-4 {
    width: calc(25% - 2vw);
    background-color: #99c6e4;
    padding: 1.667vw 1.667vw 0;
    color: #fff;
    position: relative;
}

#flow .flow-row .column-4::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    padding: 0 1.667vw;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 60px;
    font-size: 5.0041701418vw;
    font-weight: 400;
    text-align: right;
    color: #fff;
    opacity: 0.43;
    right: 0;
    bottom: 0.833vw;
}

#flow .flow-row .column-4:nth-child(1)::before {
    content: "1";
}

#flow .flow-row .column-4:nth-child(2)::before {
    content: "2";
}

#flow .flow-row .column-4:nth-child(3)::before {
    content: "3";
}

#flow .flow-row .column-4:nth-child(4)::before {
    content: "4";
}

#flow .flow-row .column-4 p {
    font-size: 1.667vw;
    font-weight: 700;
    text-align: center;
    width: 100%;
    min-height: 9.25vw;
}

#flow .flow-row .column-4 img {
    width: auto;
    height: 12.5vw;
    vertical-align: bottom;
}

@media screen and (min-width: 1200px) {
    #flow {
        padding: 0 5vw;
    }

    #flow .flow-row .column-4 {
        width: calc(25% - 24px);
        padding: 20px 15px 0;
    }

    #flow .flow-row .column-4::before {
        padding: 0 20px;
        font-family: "Source Sans Pro", sans-serif;
        font-size: 8rem;
        bottom: 15px;
    }

    #flow .flow-row .column-4 p {
        font-size: 2.2rem;
        min-height: 130px;
    }

    #flow .flow-row .column-4 img {
        height: 170px;
    }
}

@media screen and (max-width: 767px) {
    #flow {
        padding: 0 5.333vw;
    }

    #flow .flow-row .column-4 {
        margin-bottom: -10px;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: calc(50% - 5px);
        padding: 20px 15px;
        margin-bottom: 10px;
    }

    #flow .flow-row .column-4::before {
        padding: 0 15px;
        font-size: 3rem;
        bottom: 0;
    }

    #flow .flow-row .column-4 p {
        font-size: 1.7rem;
        font-weight: 700;
        text-align: left;
        width: calc(100% - 100px);
        min-height: auto;
        padding-right: 15px;
    }

    #flow .flow-row .column-4 p br {
        display: none;
    }

    #flow .flow-row .column-4 img {
        width: 100px;
        height: auto;
    }
}

@media screen and (max-width: 575px) {
    #flow .flow-row .column-4 {
        width: 100%;
        padding: 30px 15px 20px;
        margin-bottom: 10px;
    }

    #flow .flow-row .column-4::before {
        top: 5px;
        bottom: auto;
    }

    #flow .flow-row .column-4 p {
        font-size: 1.7rem;
        font-weight: 700;
        text-align: left;
        width: calc(100% - 90px);
        min-height: auto;
        padding-right: 15px;
    }

    #flow .flow-row .column-4 p br {
        display: none;
    }

    #flow .flow-row .column-4 img {
        width: 90px;
        height: auto;
    }
}

/*------------------------
  Feature_20231115
------------------------*/
@media screen and (max-width: 957px) {
    .feature_flex>p {
        width: 40%;
    }
}

@media screen and (min-width:768px) and (max-width:950px) {
    .feature_flex>p {
        font-size: 1.3rem;
    }
}

@media screen and (max-width: 767px) {
    .feature-row.feature-row-margin {
        margin-bottom: 20px;
    }

    .feature_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    .blue_bg {
        height: 102%;
    }

    .blue_bg::before {
        width: 30%;
        height: 40%;
        left: 50%;
        top: -14.8vw;
        transform: translateX(-50%);
    }

    .feature_flex>p {
        width: 90%;
        margin-top: 3.5vw;
    }

    .feature_img {
        width: 90%;
    }

    .feature_img>img {
        vertical-align: bottom;
    }

    .sp_inline {
        display: block;
    }

    .heading-large.sp_feature_margin {
        margin-bottom: 23%;
    }

    .blue_bg::after {
        right: 5%;
    }

    .image_text {
        right: 5%;
    }
}

/*------------------------
  New Release
------------------------*/
#newrelease {
    padding: 0 5vw;
}

#newrelease .wb-box {
    background-color: #EAF4FA;
    padding: 5.417vw 5.833vw;
}

#newrelease .heading-large small {
    font-family: "Noto Sans JP", sans-serif;
}

#newrelease .heading-large .date {
    padding: 0 10.833vw;
    display: inline-block;
    position: relative;
}

#newrelease .heading-large .ye-ellipse {
    width: 9.167vw;
    height: 9.167vw;
    border-radius: 50%;
    background-color: #ffe946;
    padding: 0.833vw 0 1.25vw;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5835vw);
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -webkit-flex-direction: column;
    flex-direction: column;
    letter-spacing: normal;
    text-align: center;
    line-height: 1;
}

#newrelease .heading-large .year,
#newrelease .heading-large .md {
    font-family: "Source Sans Pro", sans-serif;
}

#newrelease .heading-large .year {
    font-size: 14px;
    font-size: 1.1676396997vw;
}

#newrelease .heading-large .md {
    font-size: 24px;
    font-size: 2.0016680567vw;
}

#newrelease .heading-large .jp {
    font-size: 18px;
    font-size: 1.5012510425vw;
}

#newrelease .lead {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 4.583vw;
    position: relative;
}

#newrelease .lead .lead-txt {
    width: 50%;
}

#newrelease .lead .lead-txt p {
    font-size: 18px;
    font-size: 1.5012510425vw;
    letter-spacing: 0.03em;
    font-weight: 700;
    line-height: 2.2;
}

#newrelease .lead .lead-txt p small {
    font-weight: 400;
    display: inline-block;
    padding-top: 1.25vw;
}

#newrelease .lead figure {
    width: 50%;
    padding: 0 0 0 3.333vw;
}

#newrelease .feature-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 6.667vw;
}

#newrelease .feature-row .feature-box {
    width: calc(33.333% - 2vw);
    background-color: #0071bc;
    color: #fff;
    padding: 3.75vw 2.5vw;
    position: relative;
}

#newrelease .feature-row .icon {
    position: absolute;
    top: -2.917vw;
    left: 0;
    width: 100%;
}

#newrelease .feature-row .icon img {
    display: block;
    margin: 0 auto;
    width: auto;
    height: 5.833vw;
}

#newrelease .feature-row h3 {
    font-size: 30px;
    font-size: 2.5020850709vw;
    text-align: center;
    letter-spacing: 0.05em;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -webkit-flex-direction: column;
    flex-direction: column;
    margin-bottom: 2.5vw;
}

#newrelease .feature-row h3 small {
    font-size: 16px;
    font-size: 1.3344453711vw;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

#newrelease .feature-row h3 small::before,
#newrelease .feature-row h3 small::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

#newrelease .feature-row h3 small::before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 5px 0 5px;
    border-color: #fff transparent transparent transparent;
    bottom: -10px;
    left: calc(50% - 5px);
}

#newrelease .feature-row h3 small::after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 4px 0 4px;
    border-color: #0071bc transparent transparent transparent;
    bottom: -7px;
    left: calc(50% - 4px);
    z-index: 10;
}

#newrelease .feature-row h3 .border {
    position: relative;
    display: inline-block;
    position: relative;
}

#newrelease .feature-row h3 .border::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    max-width: 180px;
    width: 100%;
    height: 1px;
    background-color: #fff;
    left: 50%;
    top: -10px;
    transform: translate(-50%, 0);
}

#newrelease .feature-row p {
    line-height: 2;
}

#newrelease .feature-row .cta-btn a {
    font-size: 30px;
    font-size: 2.5020850709vw;
    line-height: 60px;
}

#newrelease .collabo-box {
    margin-top: 4vw;
    background: #fff;
    padding: 4.167vw 3.333vw;
}

#newrelease .collabo-box .main-txt {
    font-weight: 700;
    color: #0071bc;
    letter-spacing: 0.03em;
    line-height: 2.2;
}

#newrelease .collabo-box .collabo-title {
    border: solid #0071bc;
    border-width: 1px 0;
    margin-top: 3.333vw;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
}

#newrelease .collabo-box .prof {
    position: relative;
    padding: 2.5vw 0 2.5vw 9.167vw;
    background: url(../images/home/img-prof.jpg) no-repeat left bottom/auto 88%;
    color: #0071bc;
}

#newrelease .collabo-box .prof .prof-name {
    font-size: 14px;
    font-size: 1.1676396997vw;
}

#newrelease .collabo-box .prof .large {
    font-size: 30px;
    font-size: 2.5020850709vw;
}

#newrelease .collabo-box .prof .j-title {
    font-size: 18px;
    font-size: 1.5012510425vw;
}

#newrelease .collabo-box .m-sign {
    position: relative;
    width: 6.667vw;
}

#newrelease .collabo-box .m-sign::before,
#newrelease .collabo-box .m-sign::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
    width: 20px;
    height: 2px;
    background-color: #0071bc;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin-left: -10px;
}

#newrelease .collabo-box .m-sign::before {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

#newrelease .collabo-box .m-sign::after {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

#newrelease .collabo-box .site-service img {
    width: 13.333vw;
}

#newrelease .profile-box {
    margin: 2.5vw 0 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#newrelease .profile-box .p-right-box {
    width: 60%;
}

#newrelease .profile-box .p-left-box {
    width: 40%;
}

#newrelease .profile-box h3 {
    font-size: 18px;
    font-size: 1.5012510425vw;
    font-weight: 400;
    margin-bottom: 1.25vw;
}

#newrelease .profile-box p {
    font-size: 14px;
    font-size: 1.1676396997vw;
}

#newrelease .profile-box .history {
    border-left: 6px solid #EAF4FA;
    line-height: 1.6;
    padding: 0.417vw 0;
    margin-bottom: 1.25vw;
}

#newrelease .profile-box .history li {
    font-size: 14px;
    font-size: 1.1676396997vw;
    padding: 0.417vw 0 0.417vw 1.25vw;
}

#newrelease .profile-box .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 14px;
    font-size: 1.1676396997vw;
}

#newrelease .profile-box .info dt {
    width: 10.833vw;
    background-color: #EAF4FA;
    text-align: center;
}

#newrelease .profile-box .info dd {
    width: calc(100% - 10.833vw);
    padding-left: 0.833vw;
    font-family: "Source Sans Pro", sans-serif;
}

#newrelease .profile-box .info dd a:hover {
    color: #1375f4;
    text-decoration: underline;
}

@media screen and (min-width: 1200px) {
    #newrelease .wb-box {
        padding: 65px 70px;
    }

    #newrelease .heading-large .date {
        padding: 0 130px;
    }

    #newrelease .heading-large .ye-ellipse {
        width: 110px;
        height: 110px;
        padding: 10px 0 15px;
        top: calc(50% - 55px);
    }

    #newrelease .heading-large .year {
        font-size: 1.4rem;
    }

    #newrelease .heading-large .md {
        font-size: 2.4rem;
    }

    #newrelease .heading-large .jp {
        font-size: 1.8rem;
    }

    #newrelease .lead {
        margin-top: 55px;
    }

    #newrelease .lead .lead-txt p {
        font-size: 1.8rem;
    }

    #newrelease .lead .lead-txt p small {
        font-weight: 400;
        padding-top: 15px;
    }

    #newrelease .lead figure {
        padding: 0 0 0 40px;
    }

    #newrelease .feature-row {
        margin-top: 80px;
    }

    #newrelease .feature-row .feature-box {
        width: calc(33.333% - 24px);
        padding: 45px 30px;
    }

    #newrelease .feature-row .icon {
        top: -35px;
    }

    #newrelease .feature-row .icon img {
        height: 70px;
    }

    #newrelease .feature-row h3 {
        font-size: 3rem;
        margin-bottom: 30px;
    }

    #newrelease .feature-row h3 small {
        font-size: 1.6rem;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    #newrelease .feature-row h3 .border {
        position: relative;
        display: inline-block;
        position: relative;
    }

    #newrelease .feature-row .cta-btn a {
        font-size: 3rem;
    }

    #newrelease .collabo-box {
        margin-top: 48px;
        padding: 50px 40px;
    }

    #newrelease .collabo-box .collabo-title {
        margin-top: 30px;
    }

    #newrelease .collabo-box .prof {
        padding: 30px 0 30px 110px;
    }

    #newrelease .collabo-box .prof .prof-name {
        font-size: 1.4rem;
    }

    #newrelease .collabo-box .prof .large {
        font-size: 3rem;
    }

    #newrelease .collabo-box .prof .j-title {
        font-size: 1.8rem;
    }

    #newrelease .collabo-box .m-sign {
        width: 80px;
    }

    #newrelease .collabo-box .site-service img {
        width: 160px;
    }

    #newrelease .profile-box {
        margin: 30px 0 0;
        justify-content: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
    }

    #newrelease .profile-box .p-left-box,
    #newrelease .profile-box .p-right-box {
        width: auto;
    }

    #newrelease .profile-box .p-left-box {
        padding-right: 30px;
    }

    #newrelease .profile-box h3 {
        font-size: 1.8rem;
        margin-bottom: 15px;
    }

    #newrelease .profile-box p {
        font-size: 1.4rem;
    }

    #newrelease .profile-box .history {
        padding: 5px 0;
        margin-bottom: 25px;
    }

    #newrelease .profile-box .history li {
        font-size: 1.4rem;
        padding: 5px 0 5px 15px;
    }

    #newrelease .profile-box .info {
        font-size: 1.4rem;
    }

    #newrelease .profile-box .info dt {
        width: 130px;
    }

    #newrelease .profile-box .info dd {
        width: calc(100% - 130px);
        padding-left: 10px;
    }
}

@media screen and (max-width: 767px) {
    #newrelease {
        padding: 0 5.333vw;
    }

    #newrelease .wb-box {
        padding: 40px 20px;
    }

    #newrelease .heading-large .date {
        padding: 0 0 0 85px;
    }

    #newrelease .heading-large .ye-ellipse {
        width: 70px;
        height: 70px;
        border-radius: 50%;
        padding: 8px 0 10px;
        top: calc(50% - 35px);
    }

    #newrelease .heading-large .year {
        font-size: 1.2rem;
    }

    #newrelease .heading-large .md {
        font-size: 1.6rem;
    }

    #newrelease .heading-large .jp {
        font-size: 1.2rem;
    }

    #newrelease .lead {
        margin-top: 30px;
    }

    #newrelease .lead .lead-txt {
        width: 100%;
    }

    #newrelease .lead .lead-txt p {
        font-size: 1.6rem;
        line-height: 2;
    }

    #newrelease .lead .lead-txt p small {
        padding-top: 10px;
    }

    #newrelease .lead figure {
        width: 100%;
        padding: 20px 0 0;
    }

    #newrelease .lead figure img {
        max-width: 500px;
        width: 90%;
        margin: 0 auto;
        display: block;
    }

    #newrelease .feature-row {
        margin-top: 30px;
    }

    #newrelease .feature-row .feature-box {
        width: 100%;
        margin: 20px 0;
        padding: 40px 15px 30px;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
    }

    #newrelease .feature-row .feature-box:nth-last-child(2) {
        margin-bottom: 0;
    }

    #newrelease .feature-row .icon {
        position: absolute;
        top: -25px;
        left: 0;
        width: 100%;
    }

    #newrelease .feature-row .icon img {
        display: block;
        margin: 0 auto;
        width: auto;
        height: 50px;
    }

    #newrelease .feature-row h3 {
        font-size: 2rem;
        margin-bottom: 15px;
        width: 100%;
    }

    #newrelease .feature-row h3 small {
        font-size: 16px;
        font-size: 1.3344453711vw;
        position: relative;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    #newrelease .feature-row p {
        font-size: 1.4rem;
    }

    #newrelease .feature-row .cta-btn {
        max-width: 300px;
        width: 100%;
        margin: 30px auto 0;
    }

    #newrelease .feature-row .cta-btn a {
        font-size: 2.2rem;
        line-height: 60px;
        border-radius: 35px;
    }

    #newrelease .collabo-box {
        margin-top: 35px;
        padding: 30px 20px 40px;
    }

    #newrelease .collabo-box .main-txt {
        line-height: 2;
    }

    #newrelease .collabo-box .collabo-title {
        margin-top: 25px;
    }

    #newrelease .collabo-box .prof {
        position: relative;
        padding: 20px 0 20px 75px;
        background: url(../images/home/img-prof.jpg) no-repeat left bottom/auto 80px;
        color: #0071bc;
    }

    #newrelease .collabo-box .prof .prof-name {
        font-size: 1.3rem;
    }

    #newrelease .collabo-box .prof .large {
        font-size: 2.2rem;
    }

    #newrelease .collabo-box .prof .j-title {
        font-size: 1.5rem;
    }

    #newrelease .collabo-box .m-sign {
        position: relative;
        width: 40px;
    }

    #newrelease .collabo-box .m-sign::before,
    #newrelease .collabo-box .m-sign::after {
        width: 16px;
        margin-left: -8px;
    }

    #newrelease .collabo-box .site-service img {
        width: 90px;
    }

    #newrelease .profile-box {
        margin: 20px 5.33vw 0;
    }

    #newrelease .profile-box .p-right-box {
        width: auto;
    }

    #newrelease .profile-box .p-left-box {
        width: 100%;
        margin-bottom: 15px;
    }

    #newrelease .profile-box h3 {
        font-size: 1.6rem;
        margin-bottom: 10px;
    }

    #newrelease .profile-box p {
        font-size: 1.4rem;
    }

    #newrelease .profile-box .history {
        border-left: 4px solid #EAF4FA;
        padding: 5px 0;
        margin-bottom: 10px;
    }

    #newrelease .profile-box .history li {
        font-size: 1.3rem;
        padding: 3px 0 3px 10px;
    }

    #newrelease .profile-box .info {
        font-size: 1.3rem;
    }

    #newrelease .profile-box .info dt {
        width: 120px;
    }

    #newrelease .profile-box .info dd {
        width: calc(100% - 120px);
        padding-left: 8px;
    }
}

@media screen and (max-width: 575px) {
    #newrelease .heading-large .date {
        padding: 0;
    }

    #newrelease .heading-large .ye-ellipse {
        position: absolute;
        top: -55px;
    }

    #newrelease .collabo-box .wrapper.narrow {
        padding: 0;
    }

    #newrelease .collabo-box .collabo-title {
        -webkit-flex-direction: column-reverse;
        flex-direction: column-reverse;
        justify-content: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
    }

    #newrelease .collabo-box .prof {
        width: auto;
        padding: 20px 0 20px 70px;
        background: url(../images/home/img-prof.jpg) no-repeat left bottom/auto 80px;
    }

    #newrelease .collabo-box .prof .prof-name {
        font-size: 1.4rem;
    }

    #newrelease .collabo-box .prof .large {
        font-size: 2.4rem;
    }

    #newrelease .collabo-box .prof .j-title {
        font-size: 1.56rem;
    }

    #newrelease .collabo-box .m-sign::before,
    #newrelease .collabo-box .m-sign::after {
        width: 20px;
        height: 1px;
        margin-left: -10px;
    }

    #newrelease .collabo-box .site-service {
        padding: 20px 0 20px;
    }

    #newrelease .collabo-box .site-service img {
        width: 100px;
    }

    #newrelease .profile-box {
        margin: 20px 0 0;
    }

    #newrelease .profile-box .history {
        margin-bottom: 15px;
    }

    #newrelease .profile-box .info dt,
    #newrelease .profile-box .info dd {
        width: 100%;
    }

    #newrelease .profile-box .info dd {
        text-align: center;
        margin-top: 5px;
    }
}

@media screen and (max-width: 374px) {
    #newrelease .heading-large {
        font-size: 2.1rem;
    }
}

/*------------------------
  Type
------------------------*/
#type .type-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -1.25vw;
}

#type .type-row .column-3 {
    width: 33.333%;
    padding: 1.25vw;
}

#type .type-row .column-3 a {
    display: block;
    padding-bottom: 40px;
    padding-bottom: 3.3361134279vw;
    position: relative;
    height: 100%;
}

#type .type-row .column-3 a:hover p {
    opacity: 0.5;
}

#type .type-row .column-3 a:hover .detail-btn {
    background-color: #0071bc;
    color: #fff;
}

#type .type-row .icon-type {
    background-color: #0071bc;
    width: 7.083vw;
    height: 7.083vw;
    border-radius: 50%;
    margin: 0 auto 0.833vw;
    position: relative;
}

#type .type-row .icon-type img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#type .type-row h3 {
    text-align: center;
    font-size: 24px;
    font-size: 2.0016680567vw;
    margin-bottom: 1.667vw;
}

#type .type-row p {
    font-size: 14px;
    font-size: 1.1676396997vw;
    line-height: 2;
    letter-spacing: 0.05em;
    transition: all 0.6s;
    -webkit-transition: all 0.3s;
}

#type .type-row .detail-btn {
    text-align: center;
    font-size: 14px;
    font-size: 1.1676396997vw;
    color: #0071bc;
    margin-top: 15px;
    margin-top: 1.2510425354vw;
    background-color: #fff;
    border: 1px solid #0071bc;
    max-width: 180px;
    max-width: 15.0125104254vw;
    width: 100%;
    line-height: 30px;
    line-height: 2.5020850709vw;
    border-radius: 15px;
    border-radius: 1.2510425354vw;
    transition: all 0.6s;
    -webkit-transition: all 0.3s;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

@media screen and (min-width: 1200px) {
    #type .type-row {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: -35px -15px;
    }

    #type .type-row .column-3 {
        padding: 35px 15px;
    }

    #type .type-row .icon-type {
        width: 90px;
        height: 90px;
        margin: 0 auto 15px;
        position: relative;
    }

    #type .type-row h3 {
        font-size: 2.4rem;
        margin-bottom: 20px;
    }

    #type .type-row p {
        font-size: 1.4rem;
    }

    #type .type-row .detail-btn {
        font-size: 1.4rem;
        margin-top: 10px;
        max-width: 150px;
        line-height: 30px;
        border-radius: 15px;
    }
}

@media screen and (max-width: 767px) {
    #type .type-row {
        margin: -25px -10px;
    }

    #type .type-row .column-3 {
        width: 50%;
        padding: 25px 10px;
    }

    #type .type-row .column-3 a {
        padding-bottom: 45px;
    }

    #type .type-row .icon-type {
        width: 50px;
        height: 50px;
        margin: 0 auto 10px;
    }

    #type .type-row h3 {
        text-align: center;
        font-size: 1.8rem;
        margin-bottom: 15px;
    }

    #type .type-row p {
        font-size: 1.4rem;
    }

    #type .type-row .detail-btn {
        font-size: 1.4rem;
        margin-top: 15px;
        max-width: 180px;
        line-height: 30px;
        border-radius: 15px;
    }
}

@media screen and (max-width: 575px) {
    #type .type-row {
        margin: -10px 0 -20px;
    }

    #type .type-row .column-3 {
        width: 100%;
        padding: 20px 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
    }

    #type .type-row .icon-type {
        width: 35px;
        height: 35px;
        margin: 0;
    }

    #type .type-row h3 {
        font-size: 1.8rem;
        line-height: 35px;
        margin: 0;
        padding-left: 10px;
    }

    #type .type-row p {
        font-size: 1.4rem;
        width: 100%;
        margin-top: 15px;
    }
}

/*------------------------
  Price
------------------------*/
#price {
    padding-top: 100px;
    margin-top: -100px;
    overflow: hidden;
}

#price-plan .heading-large+p {
    text-align: center;
    color: #7A7A7A;
}

#price-plan p.phrase {
    color: #0071bc;
    font-weight: 700;
    text-align: center;
    height: 4em;
    font-size: 15px;
    font-size: 1.2510425354vw;
}

#price-plan .plan-row .column-3 {
    width: calc(33.333% - 2vw);
}

#price-plan .plan-row .column-4 {
    width: calc(25% - 1vw);
}

#price-plan .plan-row .column-5 {
    width: calc(20% - 0.2vw);
}

#price-plan .plan-row .inner {
    height: calc(100% - 2.5em);
}

#price-plan .plan-row .plan-header {
    background-color: #0071bc;
    padding: 40px 0px 50px;
    padding: 3.333vw 0.0vw 4.167vw;
    color: #fff;
    position: relative;
    height: 12rem;
}

#price-plan .plan-row .plan-header .note {
    position: absolute;
    left: 0.833vw;
    top: 0.833vw;
    background-color: #fff;
    border-radius: 3px;
    color: #0071bc;
    font-size: 13px;
    font-size: 1.0842368641vw;
    font-weight: 700;
    padding: 0 0.3em;
}

#price-plan .plan-row h3.plan-name {
    font-size: 16px;
    font-size: 1.3344453711vw;
    color: #fff;
    text-align: center;
}

#price-plan .plan-row .price-row {
    text-align: center;
    margin-top: 0.833vw;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
}

#price-plan .plan-row .price-row span {
    line-height: 1;
    font-weight: 700;
    display: block;
}

#price-plan .plan-row .price-row .large {
    font-size: 50px;
    font-size: 4.1701417848vw;
    font-family: "Source Sans Pro", sans-serif;
}

#price-plan .plan-row .price-row .yen {
    font-size: 20px;
    font-size: 1.6680567139vw;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
}

#price-plan .plan-row .price-row .contact {
    font-size: 20px;
    font-size: 1.6680567139vw;
    margin-right: 0.2em;
    margin-top: 5px;
}

#price-plan .plan-row .price-row .month {
    font-size: 13px;
    font-size: 1.0842368641vw;
    font-weight: 400;
    margin-bottom: 0.8em;
}

#price-plan .plan-row .plan-detail dl {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 15px;
    padding-top: 1.25vw;
    position: relative;
    background-color: #EAF4FA;
    color: #0071bc;
}

#price-plan .plan-row .plan-detail dl::before,
#price-plan .plan-row .plan-detail dl::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

#price-plan .plan-row .plan-detail dl::before {
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background-color: #DEEBF4;
}

#price-plan .plan-row .plan-detail dl::after {
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 13px 10px 0 10px;
    border-color: #0071bc transparent transparent transparent;
}

#price-plan .plan-row .plan-detail dl dt,
#price-plan .plan-row .plan-detail dl dd {
    width: 50%;
    padding: 30px 15px;
    padding: 2.5vw 1.25vw;
    border-bottom: 1px solid #DEEBF4;
    font-size: 15px;
    font-size: 1.05vw;
    font-weight: 700;
}

#price-plan .plan-row .plan-detail dl dt {
    text-align: right;
}

#price-plan .plan-row .plan-detail dl dd {
    text-align: left;
}

#price-plan .plan-row .plan-detail .plan-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 1.1vw 1.25vw;
    position: relative;
    background-color: #EAF4FA;
    color: #0071bc;
    font-size: 1.5rem;
    font-weight: 700;
}

#price-plan .plan-row .plan-detail.option dl {
    line-height: 1.4;
    padding-top: 0;
    border: 10px solid #EAF4FA;
    background-color: #fff;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 15px 0;
    padding: 1.25vw 0;
}

#price-plan .plan-row .plan-detail.option dl::before,
#price-plan .plan-row .plan-detail.option dl::after {
    content: none;
}

#price-plan .plan-row .plan-detail.option dl dt,
#price-plan .plan-row .plan-detail.option dl dd {
    border: none;
}

#price-plan .plan-row .plan-detail.option dl dt {
    text-align: left;
    width: calc(100% - 10vw);
    width: calc(100% - 7vw);
    color: #7A7A7A;
    font-size: 13px;
    font-size: 1.0842368641vw;
    padding: 15px 0 15px 10px;
    padding: 1.25vw 0.5vw 1.25vw 0.883vw;
}

#price-plan .plan-row .plan-detail.option dl dd {
    padding: 15px 10px 15px 0;
    padding: 1.25vw 0.883vw 1.25vw 0;
    width: 110px;
    width: 7vw;
    font-size: 15px;
    font-size: 1.2510425354vw;
    color: #444;
}

#price-plan .plan-row .plan-detail.option dl .checked {
    width: 20px;
    width: 1.6680567139vw;
    height: 10px;
    height: 0.834028357vw;
    border-left: 3px solid #0071bc;
    border-bottom: 3px solid #0071bc;
    transform: rotate(-45deg);
}

#price-plan .plan-row .plan-detail ul {
    padding: 2.5vw;
    margin: -1em 0;
    font-size: 13px;
    font-size: 1.0842368641vw;
    color: #7A7A7A;
}

#price-plan .plan-row .plan-detail ul li {
    padding-left: 1.2em;
    margin: 1em 0;
    position: relative;
    line-height: 1.5;
}

#price-plan .plan-row .plan-detail ul li::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    left: 0;
    top: 0.5em;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px 0 3px 8px;
    border-color: transparent transparent transparent #99c6e4;
}

.cta-btn {
    max-width: 37.5vw;
    width: 100%;
    margin: 5vw auto 0;
}

.cta-btn a {
    display: block;
    background-color: #EAF4FA;
    border: 4px solid #0071bc;
    color: #0071bc;
    text-align: center;
    font-size: 36px;
    font-size: 3.0025020851vw;
    font-weight: 700;
    line-height: 70px;
    border-radius: 40px;
}

.cta-btn a:hover {
    color: #fff;
    background-color: #0071bc;
}

@media screen and (min-width: 1200px) {
    #price-plan p.phrase {
        font-size: 15px;
    }

    #price-plan .plan-row .column-3 {
        width: calc(33.333% - 24px);
    }

    #price-plan .plan-row .column-4 {
        width: calc(25% - 12px);
    }

    #price-plan .plan-row .column-5 {
        width: calc(20% - 12px);
    }

    #price-plan .plan-row .plan-header {
        padding: 40px 0px 50px;
        height: 14rem;
    }

    #price-plan .plan-row .plan-header .note {
        left: 10px;
        top: 10px;
        font-size: 1.3rem;
    }

    #price-plan .plan-row h3.plan-name {
        font-size: 1.6rem;
    }

    #price-plan .plan-row .price-row {
        text-align: center;
        margin-top: 10px;
    }

    #price-plan .plan-row .price-row .large {
        font-size: 5rem;
    }

    #price-plan .plan-row .price-row .yen {
        font-size: 2rem;
    }

    #price-plan .plan-row .price-row .contact {
        font-size: 2rem;
    }

    #price-plan .plan-row .price-row .month {
        font-size: 1.3rem;
    }

    #price-plan .plan-row .plan-detail dl {
        padding-top: 10px;
    }

    #price-plan .plan-row .plan-detail dl dt,
    #price-plan .plan-row .plan-detail dl dd {
        width: 50%;
        padding: 30px 5px;
        font-size: 1.5rem;
    }

    #price-plan .plan-row .plan-detail dl dt {
        text-align: right;
    }

    #price-plan .plan-row .plan-detail dl dd {
        text-align: left;
    }

    #price-plan .plan-row .plan-detail.option dl {
        padding: 15px 0;
    }

    #price-plan .plan-row .plan-detail.option dl dt {
        width: calc(100% - 80px);
        color: #7A7A7A;
        font-size: 1.3rem;
        padding: 15px 5px 15px 15px;
    }

    #price-plan .plan-row .plan-detail.option dl dd {
        padding: 15px 15px 15px 0;
        width: 80px;
        font-size: 1.5rem;
    }

    #price-plan .plan-row .plan-detail.option dl .checked {
        width: 20px;
        height: 10px;
    }

    #price-plan .plan-row .plan-detail ul {
        padding: 30px;
        font-size: 1.3rem;
    }

    .cta-btn {
        max-width: 450px;
        margin: 60px auto 0;
    }

    .cta-btn a {
        font-size: 3.6rem;
    }
}

@media screen and (max-width: 767px) {
    #price {
        padding-top: 60px;
        margin-top: -60px;
    }

    #price-plan .heading-large+p small {
        font-size: 1.2rem;
    }

    #price-plan p.phrase {
        /*height: 4em;*/
        font-size: 1.5rem;
    }

    #price-plan .plan-row {
        margin-top: -45px;
    }

    #price-plan .plan-row .inner {
        height: calc(100% - 2em);
    }

    #price-plan .plan-row .column-3,
    #price-plan .plan-row .column-4,
    #price-plan .plan-row .column-5 {
        width: 100%;
        margin-top: 40px;
    }

    #price-plan .plan-row .plan-header {
        padding: 30px 15px;
        height: 12rem;
    }

    #price-plan .plan-row .plan-header .note {
        left: 10px;
        top: 10px;
        font-size: 1.2rem;
    }

    #price-plan .plan-row h3.plan-name {
        font-size: 1.6rem;
    }

    #price-plan .plan-row .price-row {
        margin-top: 10px;
    }

    #price-plan .plan-row .price-row .large {
        font-size: 3.5rem;
    }

    #price-plan .plan-row .price-row .yen {
        font-size: 1.6rem;
        margin-bottom: 0.3em;
    }

    #price-plan .plan-row .price-row .contact {
        font-size: 1.6rem;
    }

    #price-plan .plan-row .price-row .month {
        font-size: 1.3rem;
        margin-bottom: 0.5em;
    }

    #price-plan .plan-row .plan-detail dl {
        padding-top: 10px;
    }

    #price-plan .plan-row .plan-detail dl dt,
    #price-plan .plan-row .plan-detail dl dd {
        width: 50%;
        padding: 10px 15px;
        font-size: 1.5rem;
    }

    #price-plan .plan-row .plan-detail.option dl {
        border: 10px solid #EAF4FA;
        padding: 15px 0;
    }

    #price-plan .plan-row .plan-detail.option dl dt {
        text-align: left;
        width: 50%;
        font-size: 1.3rem;
        padding: 10px 0 10px 20px;
    }

    #price-plan .plan-row .plan-detail.option dl dd {
        padding: 10px 20px 10px 10px;
        width: 50%;
        font-size: 1.5rem;
    }

    #price-plan .plan-row .plan-detail.option dl .checked {
        width: 20px;
        height: 10px;
    }

    #price-plan .plan-row .plan-detail ul {
        padding: 30px 20px 20px;
        font-size: 1.3rem;
    }

    .cta-btn {
        max-width: 450px;
        margin: 40px auto 0;
    }

    .cta-btn a {
        font-size: 2.2rem;
        line-height: 60px;
        border-radius: 35px;
    }

    .cta-btn a:hover {
        color: #fff;
        background-color: #0071bc;
    }
}

/*------------------------
  Tab
------------------------*/
.tab-group {
    width: 390px;
    height: 60px;
    height: 5vw;
    border-radius: 30px;
    border-radius: 2.5vw;
    border: 2px solid #0071bc;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 3.333vw auto 4.583vw;
}

.tab-group .tab {
    width: 50%;
    line-height: 56px;
    line-height: 4.667vw;
    text-align: center;
    font-weight: 700;
    color: #7A7A7A;
    cursor: pointer;
    transition: all 0.6s;
    -webkit-transition: all 0.3s;
    opacity: 0.5;
    background-color: #fff;
}

.tab-group .tab:hover {
    background-color: #EAF4FA;
    color: #0071bc;
    opacity: 1;
}

.tab-group .tab.is-active {
    color: #fff;
    background-color: #0071bc;
    opacity: 1;
}

.panel-group {
    margin-top: 50px;
    margin-top: 4.1666666667vw;
}

.panel-group .panel {
    display: none;
}

.panel-group .panel.is-show {
    display: block;
}

@media screen and (min-width: 1200px) {
    .tab-group {
        height: 60px;
        border-radius: 30px;
        margin: 40px auto 55px;
    }

    .tab-group .tab {
        line-height: 56px;
    }

    .panel-group {
        margin-top: 50px;
    }
}

@media screen and (max-width: 767px) {
    .tab-group {
        width: 250px;
        height: 50px;
        border-radius: 25px;
        margin: 25px auto 30px;
    }

    .tab-group .tab {
        line-height: 46px;
    }

    .panel-group {
        margin-top: 40px;
    }
}

/*------------------------
  Option
------------------------*/
.options .option-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 50px;
    margin-top: 4.1701417848vw;
}

.options .option-row h3 {
    font-size: 24px;
    font-size: 2.0016680567vw;
    /* width: calc(33.333% - 2vw); */
    /* text-align: center; */
}

.options .option-row .option-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* width: calc(66.667% - 1.25vw); */
    width: 100%;
}

.options .option-row .option-box dl {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    width: 100%;
    border: 1px solid #eee;
    border-width: 0 0 1px;
    position: relative;
    padding: 0.3em 0;
}

.options .option-row .option-box dl::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    left: 0;
    top: 0.3em;
    width: 4px;
    height: calc(100% - 0.6em);
    background-color: #0071bc;
    border-radius: 2px;
}

.options .option-row .option-box dl:nth-child(1) {
    border-width: 1px 0;
}

.options .option-row .option-box dl dt,
.options .option-row .option-box dl dd {
    padding: 0.8em 1em;
}

.options .option-row .option-box dl dt {
    padding-left: 1.2em;
}

.options .option-row .option-box dl dd {
    font-weight: 700;
}

@media screen and (min-width: 1200px) {
    .options .option-row {
        margin-top: 50px;
    }

    .options .option-row h3 {
        font-size: 2.4rem;
        /* width: calc(33.333% - 24px); */
    }
}

@media screen and (max-width: 767px) {
    .options .option-row {
        margin-top: 40px;
    }

    .options .option-row h3 {
        font-size: 2rem;
        width: 100%;
        margin-bottom: 2rem;
    }

    .options .option-row .option-box {
        width: 100%;
    }
}

/*------------------------
  FAQ
------------------------*/
#faq .faq-wrap dl {
    margin-bottom: 1px;
}

#faq .faq-wrap dl dt,
#faq .faq-wrap dl dd {
    width: 100%;
}

#faq .faq-wrap dl dt {
    cursor: pointer;
    background-color: #0071bc;
    color: #fff;
    padding: 0 1.667vw;
}

#faq .faq-wrap dl dt .icon {
    padding: 1.667vw 0 1.667vw 3.333vw;
    display: inline-block;
    position: relative;
}

#faq .faq-wrap dl dt .icon::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    left: 0;
    top: 0;
    width: 2.5vw;
    height: 100%;
    background: url(../images/home/icon-q.svg) no-repeat left center/100% auto;
}

#faq .faq-wrap dl dt.on .icon::before {
    width: 2.5vw;
    height: 7px;
    border-radius: 3.5px;
    background: #fff;
    top: calc(50% - 3.5px);
}

#faq .faq-wrap dl dd {
    display: none;
    padding: 1.667vw;
    background-color: #EAF4FA;
    border: solid #eee;
    border-width: 0 1px 1px;
}

#faq .faq-wrap dl:nth-child(1) dd {
    display: block;
}

@media screen and (min-width: 1200px) {
    #faq .faq-wrap dl dt {
        padding: 0 20px;
    }

    #faq .faq-wrap dl dt .icon {
        padding: 20px 0 20px 40px;
    }

    #faq .faq-wrap dl dt .icon::before {
        width: 30px;
    }

    #faq .faq-wrap dl dt.on .icon::before {
        width: 30px;
        height: 7px;
    }

    #faq .faq-wrap dl dd {
        padding: 20px;
    }
}

@media screen and (max-width: 767px) {
    #faq .faq-wrap dl dt {
        padding: 0 15px;
    }

    #faq .faq-wrap dl dt .icon {
        padding: 15px 0 15px 30px;
    }

    #faq .faq-wrap dl dt .icon::before {
        width: 20px;
        background: url(../images/home/icon-q.svg) no-repeat left center/100% auto;
    }

    #faq .faq-wrap dl dt.on .icon::before {
        width: 20px;
        height: 4px;
        border-radius: 2px;
        top: calc(50% - 2px);
    }

    #faq .faq-wrap dl dd {
        font-size: 1.4rem;
        display: none;
        padding: 15px 15px 20px;
    }

    #faq .faq-wrap dl:nth-child(1) dd {
        display: block;
    }
}

/*------------------------
  Form
------------------------*/
#ask {
    padding-top: 100px;
    margin-top: -100px;
}

@media screen and (max-width: 767px) {
    #ask {
        padding-top: 60px;
        margin-top: -60px;
    }
}

/*------------------------
  Column
------------------------*/
.article-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.article-row .column-3 {
    width: calc(33.333% - 2vw);
}

.article-row .column-3 a {
    display: block;
    color: #1375f4;
}

.article-row .column-3 a:hover {
    color: #0071bc;
}

.article-row .column-3 figure {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.article-row .column-3 figure::before {
    content: "";
    padding-bottom: 52.5581395349%;
    display: block;
}

.article-row .column-3 figure img {
    position: absolute;
    top: 0;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}

.article-row .column-3 .date {
    font-size: 12px;
    font-size: 1.0008340284vw;
    color: #7A7A7A;
    margin: 1.25vw 0 0.833vw;
}

.article-row .column-3 h3 {
    font-size: 16px;
    font-size: 1.3344453711vw;
    line-height: 1.6;
}

@media screen and (min-width: 1200px) {
    .article-row .column-3 .date {
        font-size: 1.2rem;
        margin: 15px 0 10px;
    }

    .article-row .column-3 h3 {
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 767px) {
    .article-row {
        margin: -15px 0;
    }

    .article-row .column-3 {
        width: 100%;
        padding: 15px 0;
        min-height: 130px;
    }

    .article-row .column-3 a {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-left: 115px;
        position: relative;
    }

    .article-row .column-3 figure {
        width: 100px;
        position: absolute;
        left: 0;
        top: 0;
    }

    .article-row .column-3 figure::before {
        padding-bottom: 100%;
    }

    .article-row .column-3 .date,
    .article-row .column-3 h3 {
        width: 100%;
    }

    .article-row .column-3 .date {
        font-size: 1.2rem;
        margin: 0 0 10px;
        line-height: 1;
    }

    .article-row .column-3 h3 {
        font-size: 1.5rem;
    }
}

/*------------------------
  Case
------------------------*/
#case {
    background-color: #EAF4FA;
}

#case .container {
    padding: 0 0 60px;
}


#case .container .wb-box {
    padding: 45px 0 0;
}

@media screen and (max-width: 767px) {
    #case .container .wb-box {
        padding: 0 0 0;
    }

    #case {
        padding: 0 5.333vw 60px;
    }
}

#case .wrapper {
    display: flex;
    justify-content: space-between;
    padding: 0;
    max-width: 1240px;
}

#case .row {
    width: 32.25%;
    background: #fff;
}

#case .row .column-2 {
    padding: 3.2rem 1.6rem;
}

#case .row .column-2-img {
    width: 100%;
    position: relative;
}

#case .row .column-2-img::before {
    content: "";
    display: block;
    padding: 52% 0 0;
}

#case .row .column-2-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#case .row .column-2 .case-column-2-inner {
    padding: 0 1.7rem;
}

#case .row .column-2 .com {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 400;
}

#case .row .column-2 .name {
    font-size: 15px;
    margin: 4px 0 0;
    line-height: 1.5;
}

#case .row .column-2 .job-tit {
    font-size: 13px;
    font-size: 1.0842368641vw;
}

#case .row .column-2 h3 {
    color: #0071bc;
    font-weight: 700;
    font-size: 24px;
    font-size: 2.0016680567vw;
    margin: 0 0 1.6rem 0;
    line-height: 1.5;
}

#case .row .column-2 .link-btn {
    text-align: center;
}

#case .row .column-2 .link-btn a {
    display: inline-block;
    width: 100%;
    max-width: 200px;
    max-width: 16.6805671393vw;
    font-size: 16px;
    font-size: 1.3344453711vw;
    color: #0071bc;
    font-weight: 700;
    text-align: center;
    line-height: 50px;
    line-height: 4.1701417848vw;
    border-radius: 100px;
    border: 2px solid #0071bc;
    margin: 3.2rem 0 0;
}

.wb-block {
    padding: 0 5vw;
}

.youtube {
    width: 100%;
    aspect-ratio: 4/2.5;
}

.youtube iframe {
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 1200px) {
    #case .container {
        padding: 0 0 60px;
    }

    #case .container .wb-box {
        padding: 45px 0 0;
    }

    #case .row .column-2 .com {
        font-size: 20px;
        line-height: 1.5;
    }

    #case .row .column-2 .name {
        font-size: 1.5rem;
        line-height: 1.5;
        margin: 0.4rem 0 0;

    }

    #case .row .column-2 .job-tit {
        font-size: 13px;
    }

    #case .row .column-2 h3 {
        font-size: 2rem;
    }

    #case .row .column-2 .link-btn a {
        display: inline-block;
        max-width: 24rem;
        font-size: 1.6rem;
        line-height: 5rem;
        border-radius: 2.5rem;
    }

    .wb-block {
        padding: 0 60px;
    }

    .wb-block .wb-box {
        padding: 65px 0;
    }
}

@media screen and (max-width: 767px) {
    #case .container {
        padding: 65px 0 0;
    }

    #case .more-link-sp {
        margin: 4rem 0 0 0;
    }

    #case .wrapper {
        padding: 0;
        flex-direction: column;
        gap: 12vw;

    }

    #case .row {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: -8px 0;
        width: 100%;

    }

    #case .row .column-2 {
        width: 100%;
    }

    #case .row .column-2 .com {
        font-size: 18px;
    }

    #case .row .column-2 .name {
        font-size: 16px;
    }

    #case .row .column-2 .job-tit {
        font-size: 13px;
    }

    #case .row .column-2 h3 {
        font-size: 20px;
    }

    #case .row .column-2 .link-btn a {
        max-width: 200px;
        font-size: 16px;
        line-height: 44px;
        border-radius: 100px;
    }

    .wb-block {
        padding: 0 5.333vw 30px;
    }
}

.youtube {
    width: 100%;
    aspect-ratio: 16/9;
    position: relative;
}

.youtube iframe {
    width: 100%;
    height: 100%;
}

/*------------------------
  Movie
------------------------*/
#movie {
    padding: 2.5vw 0;
}

#movie .heading-large {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    margin-bottom: 20px;
    margin-bottom: 1.6680567139vw;
}

#movie .heading-large small {
    width: 100%;
}

#movie .heading-large .circle {
    display: block;
    background-color: #0071bc;
    color: #fff;
    text-align: center;
    width: 5vw;
    height: 5vw;
    border-radius: 50%;
    line-height: 5vw;
    font-size: 24px;
    font-size: 2.0016680567vw;
    margin-right: 0.2em;
}

#movie .row {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
}

#movie .row .column-2 {
    width: 50%;
}

@media screen and (min-width: 1200px) {
    #movie {
        padding: 30px 0;
    }

    #movie .heading-large {
        margin-bottom: 20px;
    }

    #movie .heading-large .circle {
        width: 60px;
        height: 60px;
        line-height: 60px;
        font-size: 24px;
    }
}

@media screen and (max-width: 767px) {
    #movie {
        padding: 20px 0;
    }

    #movie .row .column-2 {
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
    }

    #movie .heading-large {
        margin-bottom: 20px;
    }

    #movie .heading-large .circle {
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 18px;
    }
}

/* TOPページ HeadタイトルのCSS追加*/
.heading-line {
    text-decoration: underline;
    text-decoration-color: #ffe946;
    text-decoration-thickness: 8px;
}

/* TOPページプライス欄CSS追加 */

/* priceページのCSS追加 　ここから*/
#price .slogan {
    color: #000;
    font-size: 1.3rem;
    font-weight: 700;
    text-align: center;
    height: 2.5em;
    scale: 1.5;
}

@media (max-width: 1200px) {
    #price .slogan {
        font-size: 1.0rem;
    }
}

@media (max-width: 768px) {
    #price .slogan {
        font-size: 1.6rem;
    }
}

#price .money {
    font-size: 1.5rem;
    margin: 5px 0.5rem 5px;
    padding: 5px;
    border: 1px solid #FFF;
}

@media (min-width: 768px) and (max-width: 1200px) {
    #price .money {
        margin: 2px;
        font-size: 1rem;
    }
}

@media (min-width: 768px) and (max-width: 1200px) {
    #price-plan .plan-row .price-row .month {
        margin-bottom: 5px;
    }
}

@media (min-width: 768px) and (max-width: 1200px) {
    #price-plan .plan-row .price-row .yen {
        margin-bottom: 5px;
    }
}

#price-plan .plan-row .price-row .large {
    font-size: 3em;
    margin-bottom: 5px;
}

@media (min-width: 768px) and (max-width: 1200px) {
    #price-plan .plan-row .price-row .large {
        font-size: 2.3rem;
        margin-bottom: 0px;
    }
}

#price-plan .plan-row .plan-detail dl:nth-of-type(1)::after {
    border-color: #0071bc transparent transparent transparent;
}

#price-plan .plan-row .plan-arrow dl::after {
    border-color: #00a960 transparent transparent transparent !important;
}

/* priceページのCSS追加 　ここまで*/

/*------------------------
  Price management private
------------------------*/

#price-management #price-plan p.phrase {
    border: 1px solid #DEEBF4;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #000;
    font-size: 24px;
    line-height: 2.5em;
    height: 2.5em;
    display: flex;
    justify-content: center;
}

#price-management .management-private-option {
    padding: 20px;
}

.price-management-svg-35 {
    width: 35px;
}

.price-management-svg-25 {
    width: 25px;
}

.price-management-svg {
    width: 18px;
}

#price-management #price-plan dl {
    padding: 15px 24px !important;
}

#price-management #price {
    margin-top: -180px;
}

@media (max-width: 768px) {
    #price-management #price {
        margin-top: -110px;
    }
}

#price-management .plan-detail .item-1 {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

#price-management .plan-detail .item-1 p {
    color: #000;
    font-weight: normal !important;
    margin-left: 15px;
}

#price-management .plan-detail dl p:last-child {
    font-weight: bold;
    color: #000;
}

.price-management-two-svg,
.price-management-three-svg {
    width: 25px;
}

.management-private-option {
    background-color: #EAF4FA;
}

#price-management .title-private h3 {
    color: #0071bc;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 10px;
}

/*------------------------
  Price management private END
------------------------*/

/*------------------------
  release
------------------------*/

#release {
    background: #EAF4FA;
    padding: 60px 0;
}

#release .inner {
    background: #fff;
    padding: 5.8rem 3rem;
}

#release .list {
    max-width: 84rem;
    margin: 0 auto;
}

#release .list li {
    border-bottom: 1px solid #E5E5E5;
    padding: 2rem 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

#release .list li:first-child {
    border-top: 1px solid #E5E5E5;
}

#release .list li time {
    font-size: 1.2rem;
    color: #7A7A7A;
    width: 12.3rem;
    margin-top: 0.3rem;
    line-height: 1;
}

#release .list li .cat {
    width: calc(100% - 12.3rem);
}

#release .list li .cat a {
    font-size: 1.2rem;
    color: #fff;
    background: #0071BC;
    display: inline-block;
    line-height: 1;
    padding: 0.4rem 1rem;
    margin-right: 0.2rem;
}

#release .list li .cat a:last-child {
    margin-right: 0;
}

#release .list li .cat a.defect {
    color: #7A7A7A;
    background: #E5E5E5;
}

#release .list li .ttl {
    width: 100%;
    margin-top: 1rem;
}

#release .list li .ttl a {
    font-size: 1.3rem;
    color: #33475B;
    display: block;
    line-height: 1.6;
}

@media (max-width: 768px) {
    #release {
        padding: 50px 0;
    }

    #release .inner {
        padding: 3rem 2rem;
    }

    #release .list li {
        padding: 1.5rem 0;
    }

    #release .list li time {
        width: 34%;
    }

    #release .list li .cat {
        width: 66%;
    }

    #release .list li .cat a {
        padding: 0.4rem 0.8rem;
    }

    #release .list li .ttl {
        margin-top: 1rem;
    }

    #release .list li .ttl a {
        font-size: 1.3rem;
    }
}

/*------------------------
  release END
------------------------*/
@media screen and (max-width: 1299px) {
    .pc1300 {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .c-bnr {
        opacity: 0;
        visibility: hidden;
        transition: 0.4s;
    }
    
    body.fv-scroll .c-bnr {
        opacity: 1;
        visibility: visible;
    }
}

#price-plan .column-5 .phrase, #price-plan .column-5 .slogan {
    background-color: #ffffff;
}
#price-plan .column-5 .inner {
    margin-top: 8px;
}
#price-plan .column-5 {
    background-color: #eaf4fa;
}