﻿@charset "UTF-8";/* ----サブジャンル---- */.page-genre .block-genre-style { margin: 40px auto; display: flex; flex-wrap: wrap; column-gap: 24px;}.page-genre .block-genre-style .block-genre-style--item { width: calc((100% - (24px * 4))/5); height: var(--sub-category-item-height); flex-basis: auto; margin: 0 0 12px;}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name,.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name a {width: 100%;height: var(--sub-category-item-height);padding: 0;margin: 0;border: none;border-radius: 56px;font-size: var(--font-size-large);font-weight: 700;line-height: var(--line-height-low);color: #FFF;display: flex;justify-content: center;align-items: center;background-color: var(--button-bg3);}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name:has(a) { background-color: #FFF;}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name a {padding: var(--sub-category-item-a-padding);border: var(--button-bg1) 2px solid;background-color: var(--button-bg1);position: relative;transition: var(--transition);}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name a::after {content: '';width: 8px;height: 8px;border-right: #FFF 2px solid;border-top: #FFF 2px solid;position: absolute;right: 16px;top: calc(50% - 4px);display: block;transform: rotate(45deg);}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name a:hover { text-decoration: none; color: var(--button-bg1); background-color: #FFF;}.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name a:hover::after { border-color: var(--button-bg1);}@media screen and (max-width: 1340px) {.page-genre .block-genre-style .block-genre-style--item .block-genre-style--item-name { width: calc((100% - (24px * 3))/4);}}