.sec-title {
    margin: 0 auto 60px;
    text-align: center;
}
.sec-title img {
    margin: 0 auto;
    width: auto;
    height: 92px;
}
.sec-headtext {
    font-size: 24px;
    line-height: 2.16;
    text-align: center;
    margin: -14px 0 46px;
}
.strong {
    color: #ff1f7d;
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .sec-title {
        margin-bottom: 32px;
    }
    .sec-title img {
        height: 50px;
    }
    .sec-headtext {
        font-size: 16px;
        line-height: 2.125;
        text-align: center;
        margin: -9px 0 31px;
    }
}
/* top */
.top {
    padding-bottom: 0;
}
.top .container {
    padding-top: 180px;
    padding-bottom: 150px;
    position: relative;
}
.top-box {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.top-box__top-left {
    margin-right: 45px;
}
.top-box__top-left img {
    margin-bottom: 32px;
}
.top-box__top-left .pagelink {
    width: 100%;
    border: solid 2px #ff1f7d;
}
.top-box__top-left .pagelink svg {
    width: 30px;
    margin-right: 10px;
}
.top .container .path {
    width: 1920px;
    height: 360px;
    background-color: #ffbe2c;
    clip-path: polygon(0% 100%, 100% 0%, 100% 100%);
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    z-index: -1;
}
@media screen and (max-width: 767px) {
    .top .container {
        height: 100%;
        padding-top: 115px;
        padding-bottom: 70px;
    }
    .top-box {
        flex-direction: column-reverse;
        align-items: center;
    }
    .top-box__top-left {
        margin-right: 0;
    }
    .top-box__top-left img {
        max-width: 335px;
    }
    .top-box__top-left .pagelink {
        max-width: 335px;
        border: solid 2px #ff1f7d;
    }
    .top-box__top-right img {
        max-width: 335px;
    }
    .top .container .path {
        bottom: -80px;
    }
}

/* why */
.why {
    background-color: #ffbe2c;
}
.why-container {
    background-color: #fff;
}
.why .sec-title img {
    height: 101px;
}
.why-container__why-head {
    display: flex;
    flex-direction: column;
    padding: 80px 0 25px;
}
.why-container__why-head h3 {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    color: #ff1f7d;
    margin-bottom: 16px;
}
.why-container__why-head p {
    text-align: center;
    font-size: 22px;
    font-weight: 600;
}
.why-container__why-body {
    padding: 0 115px 105px;
}
.why-container__why-body .border {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}
.why-container__why-body .border img {
    max-width: 430px;
}
.why-container__why-body__why-box {
    display: flex;
    justify-content: space-between;
}
.why-container__why-body__why-box__why-item {
    max-width: 336px;
}
.why-container__why-body__why-box__why-item:nth-of-type(1) {
    margin-right: 40px;
}
.why-container__why-body__why-box__why-item__why-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 12px 0;
}
.why-container__why-body__why-box__why-item__why-btn--left {
    background-color: #000;
}
.why-container__why-body__why-box__why-item__why-btn--right {
    background-color: #ff1f7d;
}
.why-container__why-body__why-box__why-item__why-btn .illust {
    width: 42px;
    margin-right: 12px;
}
.why-btn-text {
    font-size: 24px;
}
.why-btn-mintext {
    font-size: 14px;
}
.why-btn-text--left {
    color: #fff;
}
.why-container__why-body__why-box__why-item__why-inner .item {
    margin-bottom: 32px;
}
.why-container__why-body__why-box__why-item__why-inner .item:nth-of-type(1) {
    border-bottom: solid 1.5px #000;
    padding-top: 32px;
    padding-bottom: 26px;
}
.why-container__why-body__why-box__why-item__why-inner .item--right-first {
    padding-bottom: 54px !important;
}
.why-container__why-body__why-box__why-item__why-inner .item h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 11px;
}
.why-container__why-body__why-box__why-item__why-inner .item .h4--right {
    color: #ff1f7d;
}
.why-container__why-body__why-box__why-item__why-inner .item p {
    font-size: 18px;
    line-height: 1.6;
}
.why-container__why-body__why-box__why-item__why-inner .bunner {
    position: relative;
    padding: 24px 0;
}
.why-container__why-body__why-box__why-item__why-inner .bunner--left {
    background-color: #000;
    padding-left: 80px;
}
.why-container__why-body__why-box__why-item__why-inner .bunner--right {
    background-color: #ff1f7d;
    padding-left: 100px;
}
.why-container__why-body__why-box__why-item__why-inner .bunner p {
    color: #fff;
    font-size: 24px;
    line-height: 1.5;
}
.why-container__why-body__why-box__why-item__why-inner .bunner img {
    position: absolute;
    bottom: 0;
    width: auto;
    height: 102px;
}
.why-container__why-body__why-box__why-item__why-inner .bunner--left img {
    left: -14px;
}
.why-container__why-body__why-box__why-item__why-inner .bunner--right img {
    left: -18px;
}
@media screen and (max-width: 767px) {
    .why {
        padding-bottom: 54px;
    }
    .why-container__why-head {
        padding: 25px 0;
        background-color: #f4f3f6;
    }
    .why-container__why-head h3 {
        font-size: 20px;
        margin-bottom: 8px;
    }
    .why-container__why-head p {
        font-size: 16px;
    }
    .why-container__why-body {
        padding: 40px 0px;
    }
    .why-container__why-body__why-box {
        flex-direction: column;
        align-items: center;
    }
    .why-container__why-body__why-box__why-item:nth-of-type(1) {
        margin-right: 0;
        margin-bottom: 40px;
    }
    .why-container__why-body__why-box__why-item__why-btn {
        padding: 8px 0;
        cursor: pointer;
        width: calc(100% - 50px);
        margin: 0 auto;
    }
    .why-container__why-body__why-box__why-item__why-btn .illust {
        width: 38px;
    }
    .why-btn-text {
        font-size: 18px;
        margin-right: 22px;
    }
    .why-btn-mintext {
        font-size: 13px;
        display: contents;
    }
    .why-btn-arrow {
        position: relative;
        width: 31px;
        height: 31px;
        border-radius: 50px;
        background-color: #ffbe2c;
        display: flex !important;
        justify-content: center;
        align-items: center;
    }
    .why-btn-arrowpath {
        width: 22px;
        transform-origin: center;
        transition: 0.5s;
    }
    .why-btn-arrowpath.active {
        transform: rotateX(180deg);
    }
    .why-container__why-body__why-box__why-item__why-inner {
        transition: 0.5s;
        overflow-y: hidden;
        height: 0;
    }
    .why-container__why-body__why-box__why-item__why-inner .item {
        width: calc(100% - 50px);
        margin: 0 auto 32px;
    }
    .why-container__why-body__why-box__why-item__why-inner .item:nth-of-type(1) {
        border-bottom: solid 1.5px #000;
        padding-bottom: 25.5px;
    }
    .why-container__why-body__why-box__why-item__why-inner .item--right-first {
        padding-bottom: 25.5px !important;
    }
    .why-container__why-body__why-box__why-item__why-inner .item h4 {
        font-size: 18px;
        margin-bottom: 11px;
    }
    .why-container__why-body__why-box__why-item__why-inner .item p {
        font-size: 16px;
        line-height: 1.81;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner {
        width: calc(100% - 50px);
        margin: 0 auto;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner--left {
        padding-left: 70px;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner--right {
        padding-left: 85px;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner p {
        font-size: 20px;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner img {
        height: 90px;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner--left img {
        left: -11px;
    }
    .why-container__why-body__why-box__why-item__why-inner .bunner--right img {
        left: -18px;
    }
}

/* about */
.about {
    padding-top: 120px;
}
.about .illust {
    padding: 0 11.4%;
    margin-bottom: 100px;
}
.about-box {
    background-color: #f4f3f6;
    padding: 54.75px 56px 42.75px;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin: 0 56px;
}
.about-box h3 {
    font-size: 26px;
    font-weight: 600;
    line-height: 1;
    color: #ff1f7d;
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
}
.about-box h3::before,
.about-box h3::after {
    content: "";
    display: inline-block;
    width: 0;
    height: 28px;
    transform-origin: bottom;
}
.about-box h3::before {
    border-left: solid 2px #000;
    transform: translate(-14px, 0px) rotate(-30deg);
}
.about-box h3::after {
    border-right: solid 2px #000;
    transform: translate(14px, 0px) rotate(30deg);
}
.about-box .list {
    width: 50%;
}
.about-box .list:nth-of-type(2n + 1) {
    margin-right: 40px;
}
.about-box .list .item {
    font-size: 21px;
    line-height: 1.5;
    font-weight: 500;
    display: flex;
    align-items: flex-start;
}
.about-box .list .item:not(:last-of-type) {
    margin-bottom: 29.75px;
}
.about-box .list .item::before {
    content: "";
    display: block;
    width: 21px;
    height: 21px;
    background-image: url(../img/main/about/list-icon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex: none;
    margin-top: 5.25px;
    margin-right: 8px;
}
@media screen and (max-width: 767px) {
    .about {
        padding-top: 54px;
    }
    .about .sec-title img {
        height: 101px;
    }
    .about .illust {
        padding: 0;
        margin-bottom: 50px;
        text-align: center;
    }
    .about .illust img {
        max-width: 450px;
    }
    .about-box {
        padding: 32px 20px;
        flex-direction: column;
        margin: 0 auto;
        max-width: 400px;
    }
    .about-box h3 {
        font-size: 20px;
        top: -13px;
    }
    .about-box h3::before,
    .about-box h3::after {
        height: 21px;
    }
    .about-box h3::before {
        transform: translate(-20px, 0px) rotate(-30deg);
    }
    .about-box h3::after {
        transform: translate(20px, 0px) rotate(30deg);
    }
    .about-box .list {
        width: 100%;
    }
    .about-box .list:nth-of-type(2n + 1) {
        margin-right: 0;
    }
    .about-box .list:not(:last-of-type) {
        margin-bottom: 15px;
    }
    .about-box .list .item {
        font-size: 16px;
    }
    .about-box .list .item::before {
        width: 16px;
        height: 16px;
        margin-top: 4px;
    }
    .about-box .list .item:not(:last-of-type) {
        margin-bottom: 15px;
    }
}

/* works */
.works {
    background-color: #ffbe2c;
    position: relative;
    padding: 120px 0;
}
.works .swiper {
    padding: 0 40px;
    display: flex;
    justify-content: center;
    margin-bottom: 75px;
    max-width: 1080px;
    margin: 0 auto;
}
.works .swiper-wrapper:not(:last-of-type) {
    margin-right: 28px;
}
.works .swiper-slide {
    display: block;
    width: calc(33.33%- (28px * 2 / 3)) !important;
    flex: none;
    padding: 20px;
    background-color: #fff;
    /* transition: 0.3s; */
}
.works .pagelink {
    width: 184px;
    border: solid 2px #ff1f7d;
}
.works .pagelink p {
    font-size: 16px;
}
.works .pagelink svg {
    width: 16px;
    height: 16px;
}
.swiper-slide img {
    margin-bottom: 12px;
}
.swiper-slide p {
    text-align: center;
    font-size: 16px;
    line-height: 1;
    font-weight: 300;
}
/* .fancybox-button--play,
.fancybox-button--thumbs,
.fancybox-button--arrow_left,
.fancybox-button--arrow_right,
.fancybox-infobar {
    display: none !important;
} */
@media screen and (max-width: 767px) {
    .works {
        padding: 54px 0;
    }
    .works .path {
        height: 47px;
        clip-path: polygon(0% 0%, calc(100% + 1px) 0%, 0% 100%);
        top: -1px;
    }
    .works .box {
        display: block;
        margin-bottom: 54px;
        padding-top: 4px;
    }
    .works .left {
        width: 100%;
        position: relative;
        margin-bottom: 40px;
    }
    .works .left p {
        font-size: 12px;
        line-height: 1.5;
        margin-left: 0;
    }
    .works .right {
        margin-top: 8px;
    }
    .works .right .title_1 {
        width: 100%;
        max-width: 87px;
    }
    .works .swiper {
        padding: 0 20px;
        margin-bottom: 40px;
        flex-direction: column;
        align-items: center;
    }
    .works .swiper-wrapper {
        margin-right: 0 !important;
    }
    .works .swiper-wrapper:not(:last-of-type) {
        margin-bottom: 20px;
    }
    .works .swiper-slide {
        width: 234px !important;
        flex: none;
        transition: 0.3s;
    }
    .works .swiper-button-prev {
        width: 60px;
        height: 60px;
        background-image: url(../img/main/works/button_prev.svg);
        background-size: contain;
        left: 48px;
    }
    .works .swiper-button-next {
        width: 60px;
        height: 60px;
        background-image: url(../img/main/works/button_next.svg);
        background-size: contain;
        right: 48px;
    }
    .swiper-button-prev:after,
    .swiper-button-next:after {
        display: none;
    }
    .swiper-slide img {
        margin-bottom: 14px;
    }
    .swiper-slide p {
        font-size: 12px;
        line-height: 1.5;
    }
    /* .works .slider-wrapper {
        display: flex;
        overflow-x: scroll;
        padding: 0 20px;
    }
    .works .slider-wrapper::-webkit-scrollbar {
        display: none;
    }
    .works .slider-slide img {
        width: 234px;
        margin-bottom: 22px;
    }
    .works .slider-slide:not(:nth-last-of-type(1)) {
        margin-right: 20px;
    }
    .works .slider-slide p {
        font-size: 12px;
        line-height: 1.43;
        font-weight: 300;
    } */
}

/* price */
.price {
    background-color: #f4f3f6;
    padding-top: 120px;
}
.price-box {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin-bottom: 27px;
}
.price-box .icon {
    max-width: 175px;
    margin-right: 24px;
}
.price-box .price-text {
    max-width: 413px;
}
.price-icon {
    text-align: center;
    margin-bottom: 27px;
}
.price-icon img {
    width: 50px;
}
.price-option {
    max-width: 810px;
    margin: 0 auto;
}
.price-option__price-head {
    padding: 20px 34px;
    background-color: #ffbe2c;
    display: flex;
    justify-content: center;
}
.price-option__price-head h3 {
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px;
}
.price-option__price-head p {
    font-size: 16px;
    font-weight: 300;
    text-align: center;
}
.price-option__price-body {
    background-color: #fff;
}
.price-option__price-body__inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 28px 26px;
}
.price-option__price-body .list .item {
    display: flex;
    align-items: flex-start;
}
.price-option__price-body .list .item:not(:last-of-type) {
    margin-bottom: 10px;
}
.price-option__price-body .list .item p {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}
@media screen and (max-width: 767px) {
    .price {
        padding-top: 54px;
    }
    .price-box {
        flex-direction: column;
        align-items: center;
        margin-bottom: 27px;
    }
    .price-box .icon {
        max-width: 158px;
        margin-right: 0;
        margin-bottom: 40px;
    }
    .price-box .price-text {
        max-width: 263px;
    }
    .price-icon {
        text-align: center;
        margin-bottom: 27px;
    }
    .price-icon img {
        width: 35px;
    }
    .price-option {
        max-width: 400px;
    }
    .price-option__price-head {
        padding: 16px;
        cursor: pointer;
    }
    .price-option__price-head__item {
        margin-right: 22px;
        transform: translateX(22px);
    }
    .price-btn-arrow {
        position: relative;
        width: 31px;
        height: 31px;
        border: solid 2px #000;
        border-radius: 50px;
        display: flex !important;
        justify-content: center;
        align-items: center;
        transform: translateX(22px);
    }
    .price-btn-arrowpath {
        width: 22px;
        transform-origin: center;
        transition: 0.5s;
    }
    .price-btn-arrowpath.active {
        transform: rotateX(180deg);
    }
    .price-option__price-head h3 {
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 4px;
    }
    .price-option__price-head p {
        font-size: 12px;
    }
    .price-option__price-body {
        height: 0;
        overflow-y: hidden;
        transition: 0.5s;
    }
    .price-option__price-body__inner {
        flex-direction: column;
        padding: 16px;
    }
    .price-option__price-body .list:not(:last-of-type) {
        margin-bottom: 8px;
    }
    .price-option__price-body .list .item:not(:last-of-type) {
        margin-bottom: 8px;
    }
    .price-option__price-body .list .item p {
        font-weight: 300;
    }
}

/* bunner */
.bunner .box {
    position: relative;
    border: solid 4px #ffbe2c;
    border-radius: 11px;
    padding: 0 25px;
}
.bunner .text p {
    font-family: "Futura", sans-serif;
    font-size: 39px;
    font-weight: 700;
}
.bunner .text p:nth-of-type(1) {
    margin-bottom: 5px;
    color: #ffbe2c;
    transition: 0.3s;
}
.bunner .text p:nth-of-type(2) {
    font-size: 36px;
    line-height: 1.27;
}
.bunner .box:hover {
    opacity: 1;
}
.bunner .color {
    position: absolute;
    z-index: -1;
    background-color: #ffbe2c;
    top: 0;
    right: 0;
    transition: 0.3s;
}
.bunner .arrow {
    display: flex;
    align-items: center;
    position: absolute;
}
.bunner .arrow .head {
    background-color: #ffbe2c;
    width: 52px;
    height: 106px;
    clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
}
.bunner .arrow .body {
    background-color: #ffbe2c;
    width: 47px;
    height: 46px;
    margin-left: -1px;
}

.productlink {
    margin-top: 120px;
}
.productlink .box {
    display: block;
    padding: 45px 25px 50px;
}
.productlink .illust {
    width: 194px;
    position: absolute;
    z-index: 3;
    top: -41px;
    right: 2.2%;
    transition: 0.3s;
}
.productlink .color {
    width: 0;
    height: 100%;
}
.productlink .box:hover .color {
    width: 100%;
}
.productlink .arrow {
    transition: 0.3s;
    top: 50%;
    bottom: 50%;
    transform: translateY(-50%);
    left: 67%;
    width: 100%;
}
.productlink .arrow .head,
.productlink .arrow .body {
    transition: 0.3s;
}
.productlink .box:hover .text p:nth-of-type(1) {
    color: #fff;
}
.productlink .box:hover .illust {
    right: 35.2%;
}
.productlink .box:hover .arrow .head {
    background-color: #fff;
}
.productlink .box:hover .arrow .body {
    width: calc(100% - 67% - 52px + 5px);
    background-color: #fff;
}
@media screen and (max-width: 767px) {
    .bunner .box {
        display: block;
        padding: 25px 0 25px 25px;
        margin-bottom: 54px;
    }
    .bunner .text p {
        font-size: 28px;
    }
    .bunner .text p:nth-of-type(1) {
        margin-bottom: 2px;
    }
    .bunner .text p:nth-of-type(2) {
        font-size: 22px;
        margin-bottom: 15px;
    }
    .bunner .arrow .head {
        width: 36px;
        height: 73px;
    }
    .bunner .arrow .body {
        width: 32px;
        height: 32px;
    }

    .productlink {
        margin-top: 54px;
    }
    .productlink .box {
        padding: 25px 0 112px 25px;
        max-width: 400px;
        margin: 0 auto;
    }
    .productlink .illust {
        width: 157px;
        top: 41px;
        right: 15px;
    }
    .productlink .arrow {
        width: auto;
        top: auto;
        bottom: 19px;
        transform: rotate(135deg);
        left: 44px;
    }
    .productlink .box:hover .illust {
        right: 15px;
    }
    .productlink .box:hover .arrow {
        bottom: 39px;
        left: 64px;
    }
    .productlink .box:hover .arrow .body {
        width: 32px;
    }
}

/* faq */
.faq {
    background-color: #f4f3f6;
    padding-top: 120px;
}
.faq-box:not(:last-of-type) {
    margin-bottom: 40px;
}
.faq-box__faq-quest {
    display: flex;
    align-items: flex-start;
    background-color: #fff;
    padding: 20px 26px;
}
.faq-box__faq-quest .icon {
    width: 32px;
    margin-right: 10px;
}
.faq-box__faq-quest h3 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
    margin-top: 2px;
}
.faq-box__faq-answer p {
    font-size: 16px;
    font-weight: 300;
    line-height: 2;
    padding: 16px 0 0 26px;
    margin-bottom: -8px;
}
@media screen and (max-width: 767px) {
    .faq {
        padding-top: 54px;
    }
    .faq-box:not(:last-of-type) {
        margin-bottom: 40px;
    }
    .faq-box__faq-quest {
        padding: 16px 20px;
    }
    .faq-box__faq-quest .icon {
        width: 24px;
        margin-right: 10px;
    }
    .faq-box__faq-quest h3 {
        font-size: 16px;
        margin-top: 0;
    }
    .faq-box__faq-answer p {
        padding: 8px 0 0 16px;
    }
}

/* doing */
.doing {
    padding-top: 120px;
    position: relative;
}
.doing-back {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    width: 1920px;
}
.doing-box {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 220px;
}
.doing-box__doing-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(33.33% - (60px * 2 / 3));
}
.doing-box__doing-item:not(:nth-of-type(3n)) {
    margin-right: 60px;
}
.doing-box__doing-item:nth-of-type(n + 4) {
    margin-top: 80px;
}
.doing-box__doing-item .step {
    width: auto;
    height: 31px;
    margin-bottom: 20px;
}
.doing-box__doing-item .illust {
    width: auto;
    height: 170px;
    margin-bottom: 18px;
}
.doing-box__doing-item h3 {
    color: #ffbe2c;
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 6px;
    border-bottom: solid 2px #ffbe2c;
    margin-bottom: 18px;
}
.doing-box__doing-item p {
    font-size: 16px;
    line-height: 1.7;
    margin: -5.6px 0;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .doing {
        padding-top: 54px;
    }
    .doing-back {
        width: 768px;
    }
    .doing-box {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        margin-top: 110px;
    }
    .doing-box__doing-item {
        width: 100%;
    }
    .doing-box__doing-item:not(:nth-of-type(3n)) {
        margin-right: 0;
    }
    .doing-box__doing-item:not(:nth-of-type(2n)) {
        margin-right: 40;
    }
    .doing-box__doing-item:nth-of-type(n + 2) {
        margin-top: 56px;
    }
    .doing-box__doing-item .step {
        width: auto;
        height: 31px;
        margin-bottom: 16px;
    }
    .doing-box__doing-item .illust {
        width: auto;
        height: 170px;
        margin-bottom: 16px;
    }
    .doing-box__doing-item h3 {
        color: #ffbe2c;
        font-size: 18px;
        font-weight: 700;
        padding-bottom: 6px;
        border-bottom: solid 2px #ffbe2c;
        margin-bottom: 18px;
    }
    .doing-box__doing-item p {
        font-size: 16px;
        line-height: 1.7;
        margin: -5.6px 0;
        text-align: center;
    }
}

/* plans */
.plans {
    padding-top: 120px;
    background-color: #ffbe2c;
}
.plans-box {
    display: flex;
    align-items: flex-start;
    padding: 0 64px;
}
.plans-box .icon {
    max-width: 234px;
    margin-right: 40px;
}
.plans-box__plans-item__h3 {
    margin-bottom: 16px;
}
.plans-box__plans-item__h3 img {
    width: auto;
    height: 33px;
}
.plans-box__plans-item__text {
    font-size: 21px;
    line-height: 1.76;
    margin-bottom: 48px;
}
.pagelink--plans {
    padding: 26px 0;
    position: relative;
}
.pagelink--plans {
    position: relative;
    border: solid 3px #ff1f7d;
}
.pagelink--plans .arrow {
    display: flex;
    align-items: center;
    position: absolute;
    transform: translate(-11px, -38px) rotateZ(-59deg);
    transition: 0.3s;
    top: 0;
    right: 0;
}
.pagelink--plans .arrow-head {
    background-color: #ff1f7d;
    width: 27px;
    height: 56px;
    clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
}
.pagelink--plans .arrow-body {
    background-color: #ff1f7d;
    width: 24px;
    height: 24px;
    margin-left: -1px;
}
.pagelink--plans:hover {
    background-color: #f4f3f6;
}
.pagelink--plans:hover p {
    color: #ff1f7d;
}
.pagelink--plans:hover .arrow {
    transform: translate(-23px, -26px) rotateZ(-59deg);
}
@media screen and (max-width: 767px) {
    .plans {
        padding-top: 54px;
    }
    .plans-box {
        flex-direction: column;
        align-items: center;
        padding: 0;
    }
    .plans-box .icon {
        max-width: 108px;
        margin-bottom: 24px;
        margin-right: 0;
    }
    .plans-box__plans-item__h3 {
        margin-bottom: 10.5px;
        text-align: center;
    }
    .plans-box__plans-item__h3 img {
        height: 20px;
    }
    .plans-box__plans-item__text {
        font-size: 16px;
        text-align: center;
    }
    .pagelink--plans {
        width: 187px;
        padding: 19px 0;
        position: relative;
        margin: 0 auto;
    }
    .pagelink--plans p {
        font-size: 14px;
    }
    .pagelink--plans .arrow {
        display: flex;
        align-items: center;
        position: absolute;
        transform: translate(-1px, -38px) rotateZ(-59deg);
        transition: 0.3s;
        top: 0;
        right: 0;
    }
    .pagelink--plans:hover {
        background-color: #f4f3f6;
    }
    .pagelink--plans:hover p {
        color: #ff1f7d;
    }
    .pagelink--plans:hover .arrow {
        transform: translate(-13px, -26px) rotateZ(-59deg);
    }
}

/* feature */
.feature {
    padding: 120px 0 0;
}
.feature_container {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 40px;
}
.feature .head {
    margin-bottom: 90px;
}
.feature .head p:nth-of-type(1) {
    font-size: 44px;
    font-weight: 700;
    color: #ff1f7d;
    line-height: 1.5;
    margin: -11px 0;
    text-align: center;
    margin-bottom: 26.5px;
}
.feature .head p:nth-of-type(2) {
    font-size: 29px;
    font-weight: 700;
    line-height: 1.65;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-thickness: 1px;
    text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, 0-1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;
}
.feature .branding {
    margin-bottom: 120px;
}
.feature .free {
    background-color: #ffbe2c;
}
.feature .free .container {
    display: flex;
    align-items: flex-start;
    padding: 90px 40px;
}
.feature .free img {
    max-width: 325px;
    margin-right: 60px;
    margin-top: 19px;
}
.feature .free .right .list {
    margin-bottom: 10px;
}
.feature .free .right .list p {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.67;
    padding-left: 26px;
    position: relative;
}
.feature .free .right .list p::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-color: #000;
    border-radius: 24px;
    position: absolute;
    left: 0;
    top: 10px;
}
.feature .free .right .box {
    padding-left: 26px;
}
.feature .free .right .box .text:nth-of-type(1) {
    font-size: 25px;
    line-height: 1.46;
    margin-bottom: 14px;
}
.feature .free .right .box .text:nth-of-type(2) {
    font-size: 22px;
    font-weight: 300;
    line-height: 1.62;
    margin-bottom: 20px;
}
.feature .free .right .box .pagelink {
    width: 292px;
    padding: 20px 0;
    border: solid 3px #ff1f7d;
}
.feature .free .right .box .pagelink p {
    font-size: 25px;
}
.feature .free .right .box .pagelink svg {
    width: 24px;
    height: 24px;
}
@media screen and (max-width: 767px) {
    .feature {
        padding: 54px 0 0;
    }
    .feature_container {
        max-width: none;
        padding: 0;
    }
    .feature .head {
        margin-bottom: 45px;
    }
    .feature .head p:nth-of-type(1) {
        font-size: 32px;
        margin: -8px 0;
        margin-bottom: 27.5px;
    }
    .feature .head p:nth-of-type(2) {
        font-size: 20px;
        font-weight: 500;
    }
    .feature .branding {
        margin-bottom: 47px;
    }
    .feature .body .branding .box {
        background-image: url(../img/main/feature/branding_back.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        padding: 75px 0 120px;
        text-align: center;
    }
    .feature .body .branding .title img {
        max-width: 236px;
        margin-bottom: 35px;
    }
    .feature .body .branding .item {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        max-width: 375px;
        padding: 0 20px;
        margin: 0 auto;
    }
    .feature .body .branding .illust {
        width: 50%;
        max-width: 167.5px;
    }
    .feature .body .branding .illust--1 {
        margin-bottom: 30px;
    }
    .feature .body .branding .item .illust:nth-of-type(n + 3) {
        margin-top: 30px;
    }
    /* .feature .body .branding .item .illust:nth-of-type(1) {
        width: 138px;
    }
    .feature .body .branding .item .illust:nth-of-type(2) {
        width: 153px;
    }
    .feature .body .branding .item .illust:nth-of-type(3) {
        width: 149px;
    }
    .feature .body .branding .item .illust:nth-of-type(4) {
        width: 139px;
    }
    .feature .body .branding .item .illust:nth-of-type(5) {
        width: 150px;
    }
    .feature .body .branding .item .illust:nth-of-type(6) {
        width: 166px;
    } */
    .feature .free .container {
        flex-direction: column;
        align-items: center;
        padding: 54px 20px;
    }
    .feature .free img {
        max-width: 325px;
        margin-right: 0;
        margin-top: 0;
        margin-bottom: 25px;
    }
    .feature .free .right .list {
        margin-bottom: 10px;
    }
    .feature .free .right .list p {
        font-size: 24px;
        padding-left: 22px;
        position: relative;
    }
    .feature .free .right .list p::before {
        width: 20px;
        height: 20px;
        border-radius: 20px;
        top: 9px;
    }
    .feature .free .right .box {
        padding-left: 0;
    }
    .feature .free .right .box .text:nth-of-type(1) {
        font-size: 24px;
        text-align: center;
        margin-bottom: 10px;
    }
    .feature .free .right .box .text:nth-of-type(2) {
        font-size: 16px;
        text-align: center;
        margin-bottom: 20px;
    }
    .feature .free .right .box .pagelink {
        width: 218px;
        margin: 0 auto;
    }
    .feature .free .right .box .pagelink p {
        font-size: 16px;
        margin-right: 5.5px;
    }
    .feature .free .right .box .pagelink svg {
        width: 16px;
        height: 16px;
    }
}

/* contact */
.contact_wrapper {
    padding: 120px 0;
}
.headtext {
    text-align: center;
    line-height: 1.9;
    margin-bottom: 56px;
}
.contact_wrapper .link {
    display: block;
    width: 634px;
    margin: 0 auto 96px;
}
/* contact */
input[type="submit"],
input[type="button"] {
    border-radius: 100px;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
    display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
    outline-offset: -2px;
}
.contact .box {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 25px;
}
.contact .title {
    width: 292px;
    font-weight: 600;
    margin-top: 24px;
    font-size: 18px;
}
.contact .require {
    font-size: 16px;
    padding: 8px 10px;
    border-radius: 7px;
    color: #fff;
    background-color: #ffbe2c;
    margin-left: 10px;
}
.contact .input {
    flex: 1;
}
.wpcf7-form-control,
.wpcf7-text,
.wpcf7-validates-as-required {
    width: 100%;
    font-size: 18px;
    line-height: 2;
    padding: 14px 9px;
    background-color: #f3f4f6;
    border: none;
}
.wpcf7-radio {
    background: none;
    display: grid;
}
.wpcf7-acceptance {
    background-color: unset;
}
.wpcf7-list-item {
    margin: 0 !important;
    font-size: 16px;
}
.wpcf7-list-item input {
    accent-color: #000;
    transform: scale(1.5);
    transform-origin: center;
    margin-right: 5px;
}
.wpcf7-submit {
    width: 298px;
    background-color: #ff1f7d;
    padding: 25px !important;
    color: #fff;
    line-height: 1;
    border-radius: 100px;
    cursor: pointer;
}
.wpcf7 .wpcf7-submit:disabled {
    opacity: 0.5;
}
@media screen and (max-width: 767px) {
    .contact_wrapper {
        padding: 70px 0 140px;
    }
    .contact_wrapper .link {
        width: 100%;
        max-width: 335px;
    }
    .contact .box {
        display: block;
    }
    .contact .title {
        margin-bottom: 10px;
        padding-bottom: 7px;
        font-size: 16px;
    }
    .contact .require {
        font-size: 14px;
        padding: 7px 9px;
    }
    .wpcf7-form-control,
    .wpcf7-text,
    .wpcf7-validates-as-required {
        font-size: 16px;
    }
    .wpcf7-list-item {
        margin: 0 !important;
        font-size: 14px;
    }
}

/* bottom */
.bottom {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 23.4%, #ffbe2c 23.4%, #ffbe2c 100%);
    padding-bottom: 60px;
}
.bottom .box {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
.bottom .left {
    width: 588px;
    margin-right: 40px;
}
.bottom .title {
    margin-bottom: 30px;
}
.bottom .link {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.bottom .link a {
    color: #ff1f7d;
    background-color: #fff;
    padding: 25px 0;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    border-radius: 100px;
    line-height: 1;
    display: block;
    width: 48%;
}
.bottom .mockup {
    width: 100%;
    max-width: 549px;
    transform: translateY(35px);
}
.bottom-pc-d {
    display: inherit;
}
.bottom-sp-d {
    display: none;
}
@media screen and (max-width: 1279px) {
    .bottom {
        background: #ffbe2c;
        padding: 40px 0;
    }
    .bottom .box {
        display: block;
    }
    .bottom-pc-d {
        display: none;
    }
    .bottom-sp-d {
        display: inherit;
    }
    .bottom .left {
        width: 100%;
        max-width: 400px;
        margin: 0 auto;
    }
    .bottom .mockup {
        transform: none;
        width: 77.77%;
        margin: 30px auto 25px;
    }
    .bottom .link {
        display: block;
    }
    .bottom .link a {
        width: 100%;
        font-size: 16px;
        padding: 18px 0;
    }
    .bottom .link a:nth-of-type(1) {
        margin-bottom: 15px;
    }
}