/* DOCUMENTS (TOP) */

.top-documents{
    padding-bottom:8em;
}
.top-documents__list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:2.5em;
    margin-top:2em;
}
.top-documents__item{
    padding:1.25em;
    background:#FFF;
    filter:drop-shadow(3px 3px 3px #EEE);
}
.top-documents__item a{
    position:relative;
    display:block;
    height:100%;
    text-decoration:none;
    color:var(--color-base);
}
.top-documents__thumbnail{
    display:flex;
    justify-content:center;
    align-items:center;
    aspect-ratio:4/3;
    padding:1.5em;
    line-height:1;
    overflow:hidden;
    background:#F4F4F4;
}
.top-documents__thumbnail img{
    width:auto;
    height:100%;
    aspect-ratio:1/1.414;
    object-fit:cover;
    box-shadow:3px 3px 10px rgb(0 0 0 / 0.15);
    transition:var(--transition);
}
.top-documents__item a:hover .top-documents__thumbnail img{
    transform:scale(1.05);
}
.top-documents__content{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1em;
    padding-top:1.25em;
}
.top-documents__title{
    font-size:20px;
}
.top-documents__link span{
    display:flex;
    color:#FFF;
    border:1px solid var(--color-base);
    background:var(--color-base);
    border-radius:100vh;
    padding:0.5em 1.2em;
    font-size:14px;
    line-height:1;
    white-space:nowrap;
    transition:var(--transition);
}
.top-documents__item a:hover .top-documents__link span{
    color:var(--color-base);
    background:#FFF;
}

@media only screen and (max-width:767px){
    .top-documents{
        padding-bottom:3.75em;
    }
    .top-documents__list{
        grid-template-columns:1fr;
        gap:1.25em;
    }
    .top-documents__content{
        flex-direction:column;
        gap:0.75em;
    }
    .top-documents__title{
        font-size:16px;
        text-align:center;
    }
    .top-documents__link span{
        font-size:12px;
    }
}


/* DOCUMENTS (FORM PAGE) */

.documents-lead{
    margin-bottom:2.5em;
}
.documents-lead p{
    font-size:18px;
}
.documents-lead .documents-lead__note{
    font-size:14px;
    margin-top:1em;
}

@media only screen and (max-width:767px){
    .documents-lead p{
        font-size:14px;
    }
    .documents-lead .documents-lead__note{
        font-size:12px;
    }
}


/* LINE追従バナー */

.fixed-linebanner{
    position:fixed;
    z-index:97;
    right:1.25em;
    bottom:1.25em;
    width:280px;
    transition:opacity .5s ease, transform .5s cubic-bezier(.4,0,.2,1), visibility 0s linear 0s;
}
.fixed-linebanner.is-closed{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(1.5em) scale(.95);
    transition:opacity .5s ease, transform .5s cubic-bezier(.4,0,.2,1), visibility 0s linear .5s;
}
.fixed-linebanner__close{
    position:absolute;
    z-index:1;
    top:-0.75em;
    right:-0.5em;
    width:28px;
    height:28px;
    padding:0;
    border:2px solid #FFF;
    border-radius:50%;
    background:var(--color-base);
    cursor:pointer;
    transition:var(--transition);
}
.fixed-linebanner__close::before,
.fixed-linebanner__close::after{
    content:"";
    position:absolute;
    top:50%;
    left:50%;
    width:12px;
    height:2px;
    background:#FFF;
}
.fixed-linebanner__close::before{
    transform:translate(-50%,-50%) rotate(45deg);
}
.fixed-linebanner__close::after{
    transform:translate(-50%,-50%) rotate(-45deg);
}
.fixed-linebanner__close:hover{
    transform:rotate(90deg);
}
.fixed-linebanner a{
    display:block;
    line-height:1;
    filter:drop-shadow(2px 2px 6px rgb(0 0 0 / 0.2));
    transition:var(--transition);
}
.fixed-linebanner a:hover{
    opacity:0.8;
}
.fixed-linebanner img{
    width:100%;
    height:auto;
}

@media only screen and (max-width:767px){
    .fixed-linebanner{
        right:0.625em;
        bottom:0.625em;
        width:180px;
    }
}


@media only screen and (max-width:480px){

    /* HEADER */
    .main-drawer__menu__jp{
        font-size:13px;
    }
    .main-drawer__menu__en{
        font-size:20px;
    }
    .main-drawer__menu a{
        padding:10px;
    }
}