@charset "utf-8";

/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
 *
 *
	Component（c-list） CSS
 *
 *
 * ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
.c-list__box {
    padding: var(--space-xl--pc) 0 var(--space-xl--pc);
    background-color: var(--color-off-white-trans089);
    border: 1px solid var(--color-sky-blue);
    border-radius: var(--border-radius--50);
    box-shadow: 5px 5px 14px -8px var(--color-box-shadow);
}

.c-list__box h2 {
    padding: 0 0 var(--space-xxl--pc);
}

.c-list {
    list-style: none outside;
    height: 190px;
    margin: var(--space-l--pc) 3.5rem;
    /* overflow-y: scroll; */
}

.c-list .c-list__item {
    display: flex;
    flex-wrap: wrap;
    flex-wrap: nowrap;
    position: relative;
    text-decoration: none;
    color: var(--color-black);
    border-bottom: 1px solid var(--color-sky-blue);
    padding: 28px 20px;
    transition: 0.3s;
}

.c-list .c-list__item a {
    display: flex;
    flex-wrap: wrap;
    flex-wrap: nowrap;
}

/* ----- arrow ----- */
.c-list .c-list__item a::before {
    content: "";
    display: block;
    position: absolute;
    top: 40%;
    right: 35px;
    height: 23px;
    width: 23px;
    background-image: url(/img/common/icon__arrow.svg);
    background-repeat: no-repeat;
    will-change: transform;
    transition: 0.3s;
}

.c-list .c-list__item.c-list__item--no-link:hover {
    border-bottom: 1px solid var(--color-sky-blue);
}

.c-list .c-list__item:hover {
    border-bottom: 1px solid var(--color-blue);
    transition: 0.3s;
}

.c-list .c-list__item:hover {
    border-bottom: 1px solid var(--color-sky-blue);
}

.c-list .c-list__item:first-child {
    border-top: 1px solid var(--color-sky-blue);
}

.c-list .c-list__item .c-list__date {
    min-width: 150px;
    margin: 0 var(--space-l--pc) 0 var(--space-m--pc);
}

.c-list .c-list__item .c-list__title {
    margin: 0;
    width: 100%;
}

.c-list .c-list__item a:hover .c-list__title,
.c-list .c-list__item a:hover .c-list__date {
    color: var(--color-blue);
}

@media screen and (max-width: 768px) {
    .c-list {
        height: 190px;
        margin: var(--space-l--sp) 0.85rem;
    }

    .c-list__box {
        border-radius: var(--border-radius--20);
        padding: var(--space-l--sp) 0 var(--space-l--sp);
        box-shadow: 4px 4px 11px -8px var(--color-box-shadow);
    }

    .c-list__box h2 {
        padding: 0 0 var(--space-xl--pc);
    }

    .c-list .c-list__item {
        flex-direction: column;
        padding: 18px 20px;
    }

    .c-list .c-list__item a {
        flex-wrap: wrap;
    }

    .c-list .c-list__item .c-list__date {
        min-width: 100px;
        margin: 0 var(--space-l--pc) 0 0;
    }

    .c-list .c-list__item .c-list__title {
        margin-top: 3px;
    }

    .c-list .c-list__item a::before {
        display: none;
    }
}

/* decoration */

* {
    box-sizing: border-box;
}

a {
    text-decoration: none;
}