/*--------------------*/
/* base
/*--------------------*/

li {
    list-style-type: none;
}

img {
    width: 100%;
}

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

html,
body {
    margin: 0;
    padding: 0;
    font-family: "Noto Sans JP", "メイリオ", "Meiryo", "ＭＳ ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN",
        sans-serif;
    background: url(../img/recruit/recruit_bg.png) 0% 0% / contain;
    background-repeat: no-repeat;
}

@media screen and (max-width: 768px) {
    html,
    body {
        background: none;
    }
}

@font-face {
    /* ① ここにfont-familyで指定したい名前を書く*/
    font-family: "HarenosoraMincho";
    /* フォントが置かれているパスを書く */
    src: url("/assets/font/Harenosora.otf") format("truetype");
}

@font-face {
    /* ① ここにfont-familyで指定したい名前を書く*/
    font-family: "athelas";
    /* フォントが置かれているパスを書く */
    src: url("/assets/font/Athelas-Bold.ttf") format("truetype");
}

@font-face {
    /* ① ここにfont-familyで指定したい名前を書く*/
    font-family: "Minion";
    /* フォントが置かれているパスを書く */
    src: url("/assets/font/Minion\ Pro\ Cond.otf") format("truetype");
}

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

html {
    font-size: 62.5%;
}

.btn {
    max-width: 17vw;
    width: 100%;
    background-color: #a18b55;
    padding: 2.5rem 3.5vw 2.5rem 2.2vw;
    font-size: 1.4vw;
    font-family: "Noto Serif JP", serif;
    font-weight: bold;
    border-radius: 50px;
    position: relative;
}

.btn a {
    color: #fff;
}

.btn::after {
    content: "";
    display: inline-block;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: 50%;
    right: 1.5vw;
    transform: translateY(-50%);
    border-style: solid;
    border-width: 10px 8px 0 8px;
    display: inline-block;
    width: 0;
    height: 0;
}

.util__title {
    font-size: 1.8vw;
    font-family: "Noto Serif JP", serif;
}

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

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

.mobail {
    display: none;
}

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

    .about {
        display: none;
    }

    .p__text {
        line-height: 1.5;
    }

    .similarity__main--img {
        margin-top: -13rem;
    }
}

@media screen and (max-width: 428px) {
    .similarity__main--img {
        margin-top: -5rem;
    }
}

@media screen and (max-width: 428px) {
    .similarity__sub--text {
        padding-bottom: 4rem;
    }
}


@media screen and (max-width: 768px) {
    .common__sp {
        display: block;
        margin-right: 0;
    }
}


@media screen and (max-width: 428px) {
    .common__sp {
        margin-left: -0.5rem;
    }
}

/* performance
/*--------------------*/

.performance__text {
    max-width: 51vw;
    width: 100%;
    top: 45%;
}

@media screen and (max-width: 768px) {
    .common {
        padding: 0 6vw;
    }

    .performance__text {
        max-width: 85vw;
        width: 100%;
        top: 50%;
        line-height: 2.7;
        left: 53%;
    }
}

.performance__text span {
    color: #ff0000;
}

/* support
/*--------------------*/

.support {
    margin: 9rem 0 0;
    padding-bottom: 7rem;
    text-align: center;
}

@media screen and (max-width: 1440px) {
    .support {
        margin: 5.5rem 0 0;
        padding-bottom: 7rem;
    }

    .suppport__sp {
        letter-spacing: -0.05em;
    }
}

@media screen and (max-width: 768px) {
    .support {
        margin: 0;
        padding-bottom: 0;
    }

    .support__box {
        padding: 6.2rem 5vw 0;
        margin-top: 0;
        background-color: inherit;
    }

    .suppport__sp {
        display: none;
    }
}

@media screen and (max-width: 428px) {
    .support {
        margin: 0;
    }

    .support__box {
        padding: 3em 1.5rem 0;
        margin-top: 0;
    }
}

.support::after {
    display: none;
}

.support::before {
    display: none;
}

.support__text {
    margin-top: 6rem;
    font-size: 0.9vw;
    font-family: "ヒラギノ丸ゴシック Pro";
    line-height: 3.2;
    letter-spacing: -0.07em;
}

@media screen and (max-width: 1440px) {
    .support__text {
        margin-top: 4.5rem;
    }
}

@media screen and (max-width: 768px) {
    .support__text {
        margin-top: 2.7rem;
        font-size: 2.75vw;
        line-height: 2.8;
        text-align: left;
        border-top: 1px solid #b4b4b4;
        padding-top: 1rem;
    }

    .s__text2 {
        display: none;
    }
}

@media screen and (max-width: 428px) {
    .support__text {
        margin-top: 1rem;
        font-size: 3.2vw;
    }
}

.support__btn {
    max-width: 43vw;
    width: 100%;
    margin: 11rem auto 0;
    padding: 0 5.8vw;
}

@media screen and (max-width: 768px) {
    .support__btn {
        max-width: 100%;
        width: 100%;
        margin: 4rem auto 0;
        padding: 0 3.2vw;
    }
}

@media screen and (max-width: 428px) {
    .support__btn {
        margin: 2rem auto 0;
    }
}

.support__sp2 {
    display: none;
}

@media screen and (max-width: 768px) {
    .support__sp2 {
        display: block;
        font-size: 4.4vw;
        position: relative;
    }

    .support__sp2::after {
        content: "";
        background: url(../img/about/about-icon.png) no-repeat;
        background-size: contain;
        display: inline-block;
        max-width: 12vw;
        width: 100%;
        height: 4rem;
        position: absolute;
        top: 50%;
        left: 5%;
        transform: translateY(-50%);
    }
}

@media screen and (max-width: 428px) {
    .support__sp2::after {
        max-width: 9vw;
        height: 2.5rem;
    }
}

@media screen and (max-width: 375px) {
    .support__sp2::after {
        max-width: 7vw;
        height: 2rem;
    }
}

.sp__text {
    display: none;
}

@media screen and (max-width: 768px) {
    .sp__text {
        display: block;
        border-top: none;
    }
}

/* solution
/*--------------------*/

.solution {
    max-width: 86.36vw;
    width: 100%;
    margin-top: 11.5rem;
    position: relative;
}

@media screen and (max-width: 1440px) {
    .solution {
        margin-top: 4rem;
    }
}

@media screen and (max-width: 768px) {
    .solution {
        margin-top: 9.2rem;
        max-width: 92vw;
        width: 100%;
    }
}

@media screen and (max-width: 428px) {
    .solution {
        margin-top: 6rem;
    }
}

.solution::after {
    content: "";
    background-image: url(../img/about/solution-object.png);
    display: inline-block;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 25vw;
    width: 100%;
    height: 67rem;
    top: -30%;
    right: -14%;
    z-index: -2;
    overflow: hidden;
}

@media screen and (max-width: 1024px) {
    .solution::after {
        right: -13%;
    }
}

@media screen and (max-width: 768px) {
    .solution::after {
        content: "";
        background:  url(../img/about/usp-objectsp.png) no-repeat;
        max-width: 28vw;
        width: 100%;
        height: 50rem;
        display: inline-block;
        position: absolute;
        top: -20%;
        right: -8%;
        z-index: -2;
        overflow: auto;
    }
}

@media screen and (max-width: 428px) {
    .solution::after {
        top: -20%;
        right: -8%;
        max-width: 30vw;
        width: 100%;
        height: 30rem;
        background-size: contain;
    }
}

.solution .util__title {
    text-align: center;
    position: relative;
    margin-left: 13vw;
}

@media screen and (max-width: 1440px) {
    .solution .util__title {
        margin-top: 0;
        margin-left: 15vw;
    }
}

@media screen and (max-width: 768px) {
    .solution .util__title {
        margin-left: 0;
    }
}

.solution .util__title::after {
    content: "SOLUTION";
    display: inline-block;
    position: absolute;
    top: -7.5rem;
    right: 4.4vw;
    color: #e6e1d3;
    font-size: 11.5vw;
    font-family: "cochin" , serif;
    font-weight: 500;
    z-index: -1;
}

@media screen and (max-width: 1440px) {
    .solution .util__title::after {
        top: -6rem;
    }
}

@media screen and (max-width: 768px) {
    .solution .util__title::after {
        content: "SOLUTION";
        display: inline-block;
        top: -4.5rem;
        left: 6.5vw;
        font-size: 17vw;
    }
}

@media screen and (max-width: 428px) {
    .solution .util__title::after {
        top: -2rem;
    }
}

.solution__list {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem 0.75vw;
    background: url(../img/about/solution-bg.png) no-repeat center center / cover;
    padding: 5.5rem 1.5vw 5.5rem 13.6vw;
    background-position: 10% 50%;
}

@media screen and (max-width: 1440px) {
    .solution__list {
        margin-top: 2rem;
        padding: 4rem 1.5vw 4rem 13.6vw;
        gap: 1rem 0.75vw;
        background-size: cover;
    }
}

@media screen and (max-width: 1248px) {
    .solution__list {
        background-size: contain;
    }
}

@media screen and (max-width: 768px) {
    .solution__list {
        margin-top: 1rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 3rem 0;
        background: url(../img/about/solution-sp.png) no-repeat;
        padding: 3rem 5.3vw;

    }
}

@media screen and (max-width: 428px) {
    .solution__list {
        gap: 1.5rem 0;
        padding: 1.5rem 5.3vw;
    }
}

.solution__item {
    max-width: 23.23vw;
    width: 100%;
    display: flex;
    align-items: center;
    background-color: #fff;
    padding: 4.2rem 0 3.6rem 1.5vw;
    border: 3px solid #bdc4c6;
}

@media screen and (max-width: 1600px) {
    .solution__item {
        padding: 2rem 0 2rem 1.5vw;
    }
}

@media screen and (max-width: 1440px) {
    .solution__item {
        padding: 2rem 0 2rem 1.5vw;
    }

    .solution__img {
        max-width: 1.4vw;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .solution__item {
        max-width: 81.3vw;
        padding: 3rem 0 3rem 4.4vw;
        border: 2px solid #bdc4c6;
    }

    .solution__img {
        max-width: 3vw;
        width: 100%;
    }
}

@media screen and (max-width: 428px) {
    .solution__item {
        padding: 1.5rem 0 1.5rem 4.4vw;
    }
}

.solution__text {
    font-size: 0.9vw;
    margin-left: 1.5vw;
    font-family: "ヒラギノ丸ゴ Pro";
}

@media screen and (max-width: 768px) {
    .solution__text {
        font-size: 2.9vw;
        margin-left: 4.1vw;
    }
}

/* hotel
/*--------------------*/

.hotel {
    margin-top: 13rem;
}

@media screen and (max-width: 1440px) {
    .hotel {
        margin-top: 9rem;
    }
}

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

@media screen and (max-width: 428px) {
    .hotel {
        margin-top: 5rem;
    }
}

.hotel__text {
    max-width: 51vw;
    width: 100%;
    top: 28%;
    left: 55%;
}


@media screen and (max-width: 1440px) {
    .hotel__text {
        top: 30%;
        left: 56%;
    }
}

@media screen and (max-width: 768px) {
    .common {
        padding: 0 6vw;
    }

    .hotel__text {
        max-width: 81vw;
        width: 100%;
        top: 50%;
        line-height: 2.7;
        left: 53%;
    }
}

@media screen and (max-width: 428px) {
    .hotel__text {
        line-height: 2.2;
        max-width: 80vw;
        left: 51%;
    }
}

.hotel .common__title {
    letter-spacing: -0.05em;
    font-size: 1.8vw;
}

@media screen and (max-width: 1700px) {
    .hotel .common__title {
        font-size: 1.4vw;
    }
}

@media screen and (max-width: 1440px) {
    .hotel .common__title {
        font-size: 1.3vw;
    }
}

@media screen and (max-width: 768px) {
    .hotel .common__title {
        font-size: 4.5vw;
    }
}

.hotel__text span {
    color: #ff0000;
}

.hotel__btn {
    position: absolute;
    top: 50%;
    left: 53%;
    transform: translate(-50%);
    max-width: 32vw;
    width: 100%;
    background-image: url(../img/about/hotel-btn.png);
    font-size: 1.6vw;
    padding: 6rem 0 5.2rem;
    text-align: center;
    font-family: "Noto Serif JP", serif;
    background-size: cover;
    background-position: 40% 50%;
}

.hotel__btn a {
    color: #fff;
}

.hotel__btn:hover { 
	opacity:0.8;
	transition:0.3s;
}


.hotel__btn a:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    pointer-events: auto;
    content: "";
    background-color: transparent;
}

@media screen and (max-width: 1440px) {
    .hotel__btn {
        padding: 4rem;
        left: 55%;
    }
}

@media screen and (max-width: 1248px) {
    .hotel__btn {
        padding: 3.5rem 0 4rem;
        left: 55%;
        background-position: 50% 50%;
    }
}


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

.hotel__btn2 {
    display: none;
}

@media screen and (max-width: 768px) {
    .hotel__btn2 {
        display: block;
        max-width: 78.6vw;
        width: 100%;
        margin: 6rem auto 0;
    }
}

@media screen and (max-width: 428px) {
    .hotel__btn2 {
        margin: 2rem auto 0;
    }
}

/* answer
/*--------------------*/

.answer {
    margin-top: 17.7rem;
    position: relative;
}

@media screen and (max-width: 1440px) {
    .answer {
        margin-top: 13rem;
    }
}

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

@media screen and (max-width: 428px) {
    .answer {
        margin-top: 7rem;
    }
}

.answer::after {
    content: url(../img/about/usp-object.png);
    display: inline-block;
    position: absolute;
    background-size: cover;
    top: -8%;
    left: 0;
    z-index: -1;
}

@media screen and (max-width: 1440px) {
    .answer::after {
        left: -6%;
    }
}


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

.answer .util__title {
    margin-left: 0;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .answer .util__title {
        margin-left: 0;
        text-align: center;
        z-index: 1;
        position: relative;
        font-size: 4.8vw;
    }
}

.e__title {
    position: relative;
    z-index: 5;
}

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

.answer .util__title::after {
    content: "USP";
    display: inline-block;
    position: absolute;
    top: -7.5rem;
    left: 50%;
    transform: translate(-50%);
    color: #e6e1d3;
    font-size: 11.5vw;
    font-family: "cochin" , serif;
    font-weight: 500;
    z-index: -1;
    letter-spacing: 0.1em;
}

@media screen and (max-width: 1440px) {
    .answer .util__title::after {
        top: -5.8rem;
    font-size: 11.5vw;
    letter-spacing: 0;
    }
}

@media screen and (max-width: 768px) {
    .answer .util__title::after {
        content: "USP";
        top: -4.5rem;
        left: 50%;
        transform: translate(-50%);
        font-size: 18vw;
    }
}

@media screen and (max-width: 428px) {
    .answer .util__title::after {
        content: "USP";
        top: -2rem;
        left: 50%;
        transform: translate(-50%);
        font-size: 15vw;
    }
}


@media screen and (max-width: 375px) {
    .answer .util__title::after {
        content: "USP";
        top: -1.5rem;
        left: 50%;
        transform: translate(-50%);
        font-size: 15vw;
    }
}

.answer__box {
    background: url(../img/performance/evidence-bg.png);
    margin-top: 3rem;
    position: relative;
    z-index: 10;
    padding: 10rem 0 15rem;
    background-size: contain
}

@media screen and (max-width: 1440px) {
    .answer__box {
        margin-top: 2rem;
        padding: 9rem 0 10rem;
    }
}

@media screen and (max-width: 768px) {
    .answer__box {
        padding: 6rem 5.3vw 7rem;
        margin-top: 1rem;
    }
}

@media screen and (max-width: 428px) {
    .answer__box {
        padding: 4rem 5.3vw 5rem;
        margin-top: 0.5rem;
    }
}

.answer__item {
    background-color: #fff;
    max-width: 72.72vw;
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding-top: 8rem;
}

@media screen and (max-width: 1600px) {
    .answer__item {
        padding-top: 5rem;
    }
}

@media screen and (max-width: 1440px) {
    .answer__item {
        padding-top: 5rem;
    }
}

@media screen and (max-width: 768px) {
    .answer__item {
        max-width: 86.6vw;
        position: relative;
        padding-top: 6rem;
    }
}

@media screen and (max-width: 428px) {
    .answer__item {
        padding-top: 2rem;
    }
}

.answer__item::after {
    display: none;
}

.answer__item:not(:first-child) {
    margin-top: 10rem;
}

@media screen and (max-width: 1440px) {
    .answer__item:not(:first-child) {
        margin-top: 8.5rem;
    }
}

@media screen and (max-width: 768px) {
    .answer__item:not(:first-child) {
        margin-top: 6rem;
    }
}

@media screen and (max-width: 428px) {
    .answer__item:not(:first-child) {
        margin-top: 4rem;
    }
}

.answer__logo {
    font-size: 5.5vw;
    font-family: "STIX Two Text", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: italic;
    margin-left: 1.6vw;
    position: absolute;
    top: -3rem;
    color: #111;
}

@media screen and (max-width: 1440px) {
    .answer__logo {
        top: -1.8rem;
    }
}

@media screen and (max-width: 768px) {
    .answer__logo {
        font-size: 10.6vw;
        margin-left: 1.4rem;
        top: -2rem;
    }
}

@media screen and (max-width: 428px) {
    .answer__logo {
        top: -1rem;
    }
}

.answer__logo span {
    color: #dd355c;
}

.answer__title {
    font-size: 1.8vw;
    background-color: #3a3a3a;
    color: #fff;
    padding: 2.8rem 0 2.8rem 4vw;
    margin: 0 4rem 0 -2vw;
    font-family: "Noto Serif JP", serif;
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 1440px) {
    .answer__title {
        padding: 1.8rem 0 1.8rem 4vw;
        margin: 1rem 4rem 0 -2vw;
    }
}

@media screen and (max-width: 1248px) {
    .answer__title {
        margin: 0 4rem 0 -2vw;
    }
}

@media screen and (max-width: 768px) {
    .answer__title {
        font-size: 3.7vw;
        padding: 1.9rem 0 1.5rem 2vw;
        margin: 1.5rem 2rem 0 -2.6vw;
    }
}

@media screen and (max-width: 428px) {
    .answer__title {
        padding: 1rem 0 1rem 2vw;
    }
}

.a__sp {
    display: none;
}

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

    .a__pc {
        display: none;
    }

    .none {
        display: none;
    }
}


.answer__area {
    display: flex;
    margin-top: 5.7rem;
    padding: 0 0 7rem;
}

@media screen and (max-width: 1440px) {
    .answer__area {
        margin-top: 2.6rem;
        padding: 0 0 4.5rem;
    }
}

@media screen and (max-width: 768px) {
    .answer__area {
        margin-top: 4.7rem;
        padding-bottom: 0;
    }
}

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

.answer__area2 {
    display: flex;
    margin-top: 5.7rem;
}

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

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

.answer__img {
    max-width: 15.85vw;
    width: 100%;
    margin-left: auto;
    padding: 0 4.3vw 3.5rem 0;
}

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

.answer__img2 {
    max-width: 15.85vw;
    width: 100%;
    margin-left: 0;
    padding: 0 4.3vw 7.1rem 2.3vw;
}

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

.answer__text {
    font-size: 0.9vw;
    margin: 0 2vw;
    line-height: 3;
    color: #111;
    font-family: "ヒラギノ丸ゴシック Pro";
    letter-spacing: -0.07em;
}

@media screen and (max-width: 1440px) {
    .answer__text {
        line-height: 3.2;
    }
}

@media screen and (max-width: 768px) {
    .answer__text {
        font-size: 2.9vw;
        margin: 0 2.6vw 4rem 2.6vw;
        line-height: 2.5;
    }
}

@media screen and (max-width: 428px) {
    .answer__text {
        margin: 0 2.6vw 4rem 2.6vw;
        font-size: 3.2vw;
    }
}

@media screen and (max-width: 428px) {
    .e__text {
        margin-top: 0;
    }
}

.answer__btn {
    margin-left: auto;
}

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

.e__link {
    padding: 5.3rem 1.6vw 4.8rem 3.5vw;
    max-width: 27.77vw;
    width: 100%;
    border: #242424 solid 1px;
    border-radius: 10rem;
    background-color: #fff;
    font-size: 1.6vw;
    font-family: "Noto Serif JP", serif;
    letter-spacing: -0.05em;
    position: relative;
}


.e__link:hover {
    background-color: #242424;
}

.e__link a:hover {
    color: #fff;
}


.e__link a:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    pointer-events: auto;
    content: "";
    background-color: transparent;
}

@media screen and (max-width: 1800px) {
    .e__link {
        padding: 3.6rem 1.6vw 3.6rem 3.5vw;
    }
}

@media screen and (max-width: 1440px) {
    .e__link {
        padding: 2.5rem 1.6vw 3.5rem 3.5vw;
        max-width: 27.77vw;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .e__link {
        padding: 4.4rem 6.4vw 4.4rem 15vw;
        font-size: 3.4vw;
        margin-bottom: 8rem;
        max-width: 73.3vw;
        width: 100%;

    }
}

@media screen and (max-width: 428px) {
    .e__link {
        padding: 2.4rem 6.4vw 2.4rem 10.1vw;
        max-width: 73.3vw;
        width: 100%;
        font-size: 3.4vw;
        margin-bottom: 4rem;
        border: #242424 solid 0.5px;
    }
}



.arrow::before {
    transform: rotate(45deg);
}

.arrow::after {
    transform: rotate(-45deg);
}

.e__link a {
    color: #242424;
}

.performance__sub {
    font-size: 0.9vw;
    margin-top: 6.2rem;
    line-height: 3.5;
    font-family: "ヒラギノ丸ゴシック Pro";
    text-align: center;
}

@media screen and (max-width: 768px) {
    .performance__sub {
        font-size: 2.9vw;
        margin-top: 7rem;
        line-height: 3.5;
        padding: 0 10vw;
        text-align: left;
    }
}

@media screen and (max-width: 428px) {
    .performance__sub {
        margin-top: 5rem;
        padding: 0 8vw;
    }
}

.performance__btn {
    text-align: center;
    margin-top: 10rem;
}

@media screen and (max-width: 768px) {
    .performance__btn {
        text-align: center;
        margin-top: 6rem;
    }
}

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

.p__link {
    padding: 5.3rem 1.3vw 4.8rem 4.4vw;
    max-width: 27.77vw;
    width: 100%;
    border: #242424 solid 1px;
    border-radius: 10rem;
    background-color: #fff;
    font-size: 1.6vw;
    font-family: "Noto Serif JP", serif;
    letter-spacing: -0.05em;
    position: relative;
}

@media screen and (max-width: 768px) {
    .p__link {
        padding: 4.5rem 6.4vw 4.5rem 10.1vw;
        max-width: 73vw;
        width: 100%;
        font-size: 3.4vw;
    }
}

@media screen and (max-width: 428px) {
    .p__link {
        padding: 2rem 6.4vw 2rem 10.1vw;
        margin-bottom: 2rem;
    }
}

.p__link2 {
    margin-left: 4.1vw;
}

@media screen and (max-width: 768px) {
    .p__link2 {
        margin: 6rem 0 0;
    }
}

@media screen and (max-width: 428px) {
    .p__link2 {
        margin: 0;
    }
}

.arrow {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 2px;
    margin: 15px 0;
    border-radius: 9999px;
    background-color: #000000;
    margin-left: 2vw;
}

@media screen and (max-width: 1600px) {
    .arrow {
        width: 40px;
        height: 1.5px;
        margin: 1rem 0 0.8rem 2vw;
    }
}

@media screen and (max-width: 1440px) {
    .arrow {
        width: 35px;
        height: 1.5px;
        margin: 1.9rem 0 1rem 2vw;
    }
}

@media screen and (max-width: 768px) {
    .arrow {
        width: 40px;
        height: 2px;
        margin: 0;
        top: -1.2rem;
        margin-left: 8.4vw;
    }
}

@media screen and (max-width: 428px) {
    .arrow {
        width: 20px;
        height: 1px;
        margin: 0;
        top: -0.5rem;
        margin-left: 6vw;
    }
}

.e__link a:hover .arrow {
    right: -1rem;
    background-color: #fff;

}

.e__link a:hover .arrow::before,
.e__link a:hover .arrow::after {
    background-color: #fff;
}

.arrow::before,
.arrow::after {
    content: "";
    position: absolute;
    top: calc(50% - 1px);
    right: 0;
    width: 25px;
    height: 2px;
    border-radius: 9999px;
    background-color: #000000;
    transform-origin: calc(100% - 1px) 50%;
}

@media screen and (max-width: 1600px) {
    .arrow::before,
    .arrow::after {
        content: "";
        position: absolute;
        width: 18px;
        height: 1.5px;
    }
}


@media screen and (max-width: 1440px) {
    .arrow::before,
    .arrow::after {
        content: "";
        position: absolute;
        width: 15px;
        height: 1.5px;
    }
}

@media screen and (max-width: 768px) {
    .arrow::before,
    .arrow::after {
        content: "";
        position: absolute;
        top: calc(50% - 1px);
        right: 0;
        width: 20px;
        height: 2px;
        border-radius: 9999px;
        background-color: #000000;
        transform-origin: calc(100% - 1px) 50%;
    }
}

@media screen and (max-width: 428px) {
    .arrow::before,
    .arrow::after {
        width: 10px;
        height: 1px;
        content: "";
        position: absolute;
        top: calc(50% - 1px);
        right: 0;
        border-radius: 9999px;
        background-color: #000000;
        transform-origin: calc(100% - 1px) 50%;
    }
}

.arrow::before {
    transform: rotate(45deg);
}

.arrow::after {
    transform: rotate(-45deg);
}
.p__flow {
    margin-top: 12.8rem;
    position: relative;
}

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

@media screen and (max-width: 428px) {
    .p__flow {
        margin-top: 8rem;
    }
}

.p__flow::after {
    display: none;
}

@media screen and (max-width: 768px) {
 .red {
        color: #ff0000;
    }
}

.evidence__btn {
    text-align: center;
    padding-bottom: 10rem;
}

@media screen and (max-width: 1440px) {
.evidence__btn {
    padding-bottom: 9rem;
}
   }

@media screen and (max-width: 768px) {
    .evidence__btn {
        padding-bottom: 0;
    }
}


.flow::after {
    content: none;
 
}

@media screen and (max-width: 1440px) {
    .flow {
        margin-top: 10rem;
    }
       }