@charset 'UTF-8';
/* ----------------------------------------------
　PC設定
------------------------------------------------*/
.p-works
{
    max-width: 1120px;
    margin: 0 auto var(--m90);
}
.p-works__title
{
    font-size: var(--fs22_32);
    font-weight: 600;

    position: relative;

    margin-bottom: var(--m65);
    padding-bottom: .75em;

    text-align: center;

    color: var(--black);
    border-bottom: 1px solid var(--black);
}
.p-works__title::after
{
    position: absolute;
    bottom: 5px;
    left: 0;

    display: inline-block;

    width: 100%;
    height: 3px;

    content: '';

    background-color: var(--black);
}
.p-works__list
{
    display: flex;

    flex-wrap: wrap;
    grid-gap: var(--fs38_90) 7%;
}
.p-works__box
{
    width: 28.66%;
}
.p-works__box-image
{
    overflow: hidden;


    aspect-ratio: 1/1;
}
.p-works__box-image img
{
    height: 100%;

    transition: all .5s;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-works__box-detail
{
    display: flex;
    margin-top: var(--m40);

    justify-content: space-between;
}
.p-works__box-text-area
{
    width: calc(93.75% - 24px);
}
.p-works__box-title
{
    font-size: var(--fs16_22);
    font-weight: 600;

    display: block;

    padding: 0 var(--m30) var(--m10);

    border-bottom: 1px solid var(--black);
}
.p-works__box-text
{
    font-size: var(--fs16_22);
    font-weight: 600;

    display: block;

    padding: var(--m10) var(--m30) 0;
}
.p-works__box-arrow
{
    position: relative;

    width: 24px;

    transition: all .5s;

    background-color: var(--black);
}
.p-works__box-arrow::before
{
    position: absolute;
    top: 50%;
    left: 50%;

    display: inline-block;

    width: 9px;

    content: '';
    transform: translate(-50%, -50%);

    background-color: var(--white);

    aspect-ratio: 1/1;
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
}

.p-works-detail
{
    max-width: 1120px;
    margin: 0 auto var(--m90);
}
.p-works-detail__top
{
    display: flex;

    margin-bottom: var(--m50);
    padding-bottom: var(--m10);

    border-bottom: 1px solid var(--black);

    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    grid-gap: var(--m20);
}
.p-works-detail__title
{
    font-size: var(--fs22_32);
    font-weight: 600;
}
.p-works-detail__date
{
    font-size: var(--fs16_24);
    font-weight: 600;

    margin-left: auto;
}
.p-works-detail__text
{
    font-size: var(--fs14_18);

    margin-bottom: var(--m50);
}
.p-works-detail__list
{
    display: flex;

    flex-wrap: wrap;
    grid-gap: var(--m50) 4.5%;
}
.p-works-detail__list img
{
    height: 100%;

    transition: all .5s;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-works-detail__main-image
{
    width: 100%;
    max-width: 850px;
    margin: 0 auto;

    aspect-ratio: 3/2;
}
.p-works-detail__image
{
    overflow: hidden;

    width: 30.33%;

    aspect-ratio: 1/1;
}

@media all and (min-width: 769px)
{
    .p-works__box-link:hover .p-works__box-image img
    {
        transform: scale(1.1);
    }
    .p-works__box-link:hover .p-works__box-title,
    .p-works__box-link:hover .p-works__box-text
    {
        color: var(--green01);
    }
    .p-works__box-link:hover .p-works__box-arrow
    {
        background-color: var(--green01);
    }
}
@media all and (max-width: 768px)
{
    .p-works__box
    {
        width: 46.5%;
    }
    .p-works-detail__image
    {
        width: 47.75%;
    }
}
/* ----------------------------------------------
　SP調整
------------------------------------------------*/
@media all and (max-width: 620px)
{
    .p-works__box
    {
        width: 100%;
    }
}