@charset "utf-8";

/* ==================================================================

    reason.css

=================================================================== */

.contents main > section .more {
    margin-top: 40px;
    margin-bottom: 0;

    @media only screen and
    (max-width : 767px) {
        margin-top: 6vw;
    }
}

.contents main > section .nStyle.more a {
    width: 358px;
    max-width: 100%;

    @media only screen and
    (max-width : 767px) {
        width: 100%;
    }
}

* + .buttonStyle.single {
    margin-top: 80px;

    @media only screen and
    (max-width : 767px) {
        margin-top: 11vw;
    }
}

/* --------------------------------
reasonBox
-------------------------------- */ 
.reasonBox {
    padding-bottom: 108px;
    border-bottom: 1px solid #989898;

    @media only screen and
    (max-width : 767px) {
        padding-bottom: 0px;
        border-bottom: none;
    }

    .no{
        position: relative;
        font-size: 1.8rem;
        font-weight: 600;
        padding-bottom: 10px;
        border-bottom: 1px solid #110284;
        margin-bottom: 7vw;

        &::before{
            content: "";
            position: absolute;
            bottom: 6px;
            right: -3px;
            width: 20px;
            height: 1px;
            background: #110284;
            rotate: 45deg;
        }
    }

    .image{
        position: relative;

        img{
            border-radius: 20px;
        }

        small{
            display: block;
            font-size: 1.00rem;
            color: #4E4E4E;
        }

        .profile{
            position: absolute;
            bottom: -2em;
            right: -1em;
            padding: 12px;
            background: #F7F6F4;
            border-radius: 12px;
            line-height: 1.4;

            em{
                display: block;
            }

            small{
                margin-left: 3px;
            }
        }

        &.profile{
            @media screen and
            (max-width : 767px) {
                margin-bottom: 60px;
            }
        }
    }

    & + .reasonBox {
        margin-top: 108px;

        @media only screen and
        (max-width : 767px) {
            margin-top: 14vw;
        }
    }

    & + .locationBox  {
        margin-top: 120px;
    }
}
