@charset "utf-8";

/*-- pc --*/
@media (min-width:769px) {
    body.page-top .hacobune-gallery.visumo-recommend {
        max-height: none;
        max-width: none;
        border: none;
        container-type: inline-size;
        container-name: visumo-recommend;
        padding-left: var(--br-spacing-3);
        /*min-height: 723px;*/
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-main .hacobune-layout-base-bottom-html,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-main .hacobune-layout-base-top-html {
        display: none;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-container {
        padding: 0 !important;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list {
        display: flex;
        gap: 0 var(--br-spacing-1);
        justify-content: start;
        align-items: center;
        margin: 0 0 20px 0;
        padding: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list>* {
        margin: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .more-1 {
        margin-top: 40px;
        position: absolute;
        bottom: calc(-84px + var(--br-spacing-2));
        right: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-input[type=radio]:checked+span.hacobune-tag-item-label,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-current .hacobune-tag-item-label {
        border-radius: 30px !important;
        background-color: var(--br-color-6) !important;
        border: 1px solid var(--br-color-6) !important;
        color: #fff !important;
        height: 40px;
        font-size: var(--br-fs-4);
        font-weight: var(--br-fw-semi-bold);
        font-family: var(--br-ff-alpha);
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-label {
        border-radius: 30px !important;
        background-color: #fff !important;
        border: 1px solid var(--br-color-9) !important;
        color: var(--br-color-1) !important;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-label:hover {
        opacity: var(--br-opacity-hover);
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item {
        margin: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item .hacobune-discovery-player {
        height: 100%;
        padding: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item :is(video, img) {
        padding: 0;
        aspect-ratio: 1/1;
        display: block;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-card,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-group-item.hacobune-discovery-group-item-wide>*,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>* {
        padding: 0 !important;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-card-inner {
        position: static;
        width: auto;
        height: auto;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group {
        display: grid;
        grid-template-areas: "a b c" "a d e";
        grid-template-columns: 50cqw 25cqw 25cqw;
        grid-template-rows: repeat(2, 25cqw);
        gap: 0 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(1) {
        grid-area: a;

    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(2) {
        grid-area: b;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(3) {
        grid-area: c;

    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(4) {
        grid-area: d;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(5) {
        grid-area: e;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(1) :is(video, img) {
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(3) :is(video, img) {
        border-top-right-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(5) :is(video, img) {
        border-bottom-right-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-search .hacobune-discovery-keyword {
        display: none;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-logo {
        padding: 0;
        margin-top: var(--br-spacing-2);
    }
}

/*-- tb --*/
@media (width >=769px) and (width < 992px) {
    body.page-top .hacobune-gallery.visumo-recommend {
        /*min-height: calc(470 / 780 * 100vw);*/
    }
}

@media (width >=769px) and (width < 1440px) {
    body.page-top .hacobune-gallery.visumo-recommend {
        margin-right: var(--br-spacing-2);
    }

    body.page-top .hacobune-gallery.visumo-recommend .more-1 {
        margin-top: 0;
        position: static;
    }
}

/*-- sp --*/
@media (max-width:768px) {
    body.page-top .hacobune-gallery.visumo-recommend {
        max-height: none;
        max-width: none;
        border: none;
        /*min-height: calc(833 / 375 * 100vw);*/
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-main .hacobune-layout-base-bottom-html,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-main .hacobune-layout-base-top-html {
        display: none;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-app-container {
        padding: 0 var(--br-spacing-2) !important;
        container-type: inline-size;
        container-name: app-container;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list {
        display: flex;
        gap: 0 var(--br-spacing-1);
        justify-content: start;
        align-items: center;
        margin: 0 0 20px 0;
        padding: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list>* {
        margin: 0;
        padding: 0;
        width: fit-content !important;
        min-width: 66px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .more-1 {}

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-input[type=radio]:checked+span.hacobune-tag-item-label,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-current .hacobune-tag-item-label {
        border-radius: 30px !important;
        background-color: var(--br-color-6) !important;
        border: 1px solid var(--br-color-6) !important;
        color: #fff !important;
        height: 30px;
        font-size: var(--br-fs-4);
        font-weight: var(--br-fw-semi-bold);
        font-family: var(--br-ff-alpha);
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-label {
        border-radius: 30px !important;
        background-color: #fff !important;
        border: 1px solid var(--br-color-9) !important;
        color: var(--br-color-1) !important;
        line-height: 1 !important;
        height: 30px !important;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 66px;
        width: fit-content;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-tag-list.hacobune-discovery-tag-list .hacobune-tag-item-label:hover {
        opacity: var(--br-opacity-hover);
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item {
        margin: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item .hacobune-discovery-player {
        height: 100%;
        padding: 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-list-item :is(video, img) {
        padding: 0;
        aspect-ratio: 1/1;
        display: block;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-card,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-group-item.hacobune-discovery-group-item-wide>*,
    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>* {
        padding: 0 !important;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-card-inner {
        position: static;
        width: auto;
        height: auto;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group {
        display: grid;
        grid-template-areas: "a a" "b c" "d e";
        grid-template-columns: 50cqw 50cqw;
        grid-template-rows: 100cqw 50cqw 50cqw;
        gap: 0 0;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(1) {
        grid-area: a;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(2) {
        grid-area: b;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(3) {
        grid-area: c;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(4) {
        grid-area: d;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(5) {
        grid-area: e;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(1) :is(video, img) {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(4) :is(video, img) {
        border-bottom-left-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-list .hacobune-discovery-group>*:nth-child(5) :is(video, img) {
        border-bottom-right-radius: 20px;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-discovery-search .hacobune-discovery-keyword {
        display: none;
    }

    body.page-top .hacobune-gallery.visumo-recommend .hacobune-logo {
        padding: 0;
        margin-top: var(--br-spacing-2);
    }
}