@keyframes fuwaMenu {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
.custom-section5 {
  --font-family: "Noto Serif JP", serif;
}

@media screen and (min-width: 768px) {
  .js-fadeIn {
    opacity: 0;
    transform: translateY(50px);
    transition: ease-in, opacity 1s, transform 1s;
  }
  .js-fadeIn--active {
    opacity: 1;
    transform: translateY(0);
  }
  .js-reveal {
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 2s ease, transform 2s ease;
  }
  .js-reveal.delay {
    transition-delay: 0.3s;
  }
  .js-reveal--active {
    opacity: 1;
    transform: translateY(0);
  }
  .custom-section5 {
    font-family: var(--font-family);
  }
  .custom-section5 .s-view {
    display: none;
  }
  .custom-section5 .l-view {
    display: block;
  }
  .custom-section5__headline {
    text-align: center;
    margin: 0;
    font-size: max(3.6rem, min(36 * 100vw / 1440, 3.6rem));
    margin-bottom: calc(100 * 100vw / 1440);
    font-family: var(--font-family);
  }
  .custom-section5__header {
    background: url(/html/template/sakecabinet/assets/img/common/pages/sake-makers-message_header.png) no-repeat;
    background-size: auto 100%;
    color: #fff;
    padding: 10rem 0;
    background-color: #00052a;
  }
  .custom-section5__header__list {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 100rem;
    width: calc(1000 * 100vw / 1440);
    aspect-ratio: 1000/372;
    margin: 0 auto;
  }
  .custom-section5__header__list__item {
    background-image: url(/html/template/sakecabinet/assets/img/common/pages/bg.png);
    background-size: 100%;
    max-width: 30rem;
    width: calc(300 * 100vw / 1440);
    aspect-ratio: 300/372;
    position: relative;
  }
  .custom-section5__header__list__item a {
    padding-top: calc(25 * 100vw / 1440);
    display: block;
    position: relative;
    height: 100%;
  }
  .custom-section5__header__list__item a::after {
    content: "";
    transition: all 0.3s;
  }
  .custom-section5__header__list__item a:hover {
    text-decoration: unset !important;
  }
  .custom-section5__header__list__item a:hover::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: rgba(24, 59, 115, 0.2);
  }
  .custom-section5__header__list__item .css-position {
    text-align: right;
    margin-top: calc(10 * 100vw / 1440);
  }
  .custom-section5__header__list__item .css-position .css-more_link {
    font-size: max(1.4rem, min(14 * 100vw / 1440, 1.4rem));
  }
  .custom-section5__header__list__item .css-label_block {
    margin-bottom: calc(20 * 100vw / 1440);
  }
  .custom-section5__header__list__item .css-label_block .css-label {
    position: relative;
    left: calc(-10 * 100vw / 1440);
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 23.2rem;
    width: calc(232 * 100vw / 1440);
    aspect-ratio: 232/57;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    background-image: url(/html/template/sakecabinet/assets/img/common/pages/sake-makers-message_label.png);
    color: #fff;
    font-size: max(1.4rem, min(14 * 100vw / 1440, 1.4rem));
  }
  .custom-section5__header__list__item .css-label_block .css-text1 {
    color: #000;
    font-size: max(1.4rem, min(14 * 100vw / 1440, 1.4rem));
    margin-top: calc(10 * 100vw / 1440);
    padding-left: calc(25 * 100vw / 1440);
  }
  .custom-section5__header__list__item .css-text_block {
    padding: calc(0 * 100vw / 1440) calc(25 * 100vw / 1440);
  }
  .custom-section5__header__list__item .css-text_block__wrapper {
    max-width: 24.3rem;
    width: calc(243 * 100vw / 1440);
    aspect-ratio: 243/168;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2 {
    text-align: center;
    color: #000;
    line-height: 1.2;
    font-size: max(2.2rem, min(22 * 100vw / 1440, 2.2rem));
    position: relative;
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2--text {
    font-weight: bold;
    font-size: max(2.2rem, min(22 * 100vw / 1440, 2.2rem));
    position: relative;
    z-index: 1;
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2--obi {
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 0;
    width: 100%;
    height: calc(13 * 100vw / 1440);
    display: inline-block;
    background-color: #f6ff00;
  }
}
@media screen and (max-width: 767px) {
  .js-fadeIn {
    opacity: 0;
    transform: translateY(50px);
    transition: ease-in, opacity 1s, transform 1s;
  }
  .js-fadeIn--active {
    opacity: 1;
    transform: translateY(0);
  }
  .js-reveal {
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 2s ease, transform 2s ease;
  }
  .js-reveal.delay {
    transition-delay: 0.3s;
  }
  .js-reveal--active {
    opacity: 1;
    transform: translateY(0);
  }
  .custom-section5 {
    font-family: var(--font-family);
  }
  .custom-section5 .s-view {
    display: block;
  }
  .custom-section5 .l-view {
    display: none;
  }
  .custom-section5__headline {
    text-align: center;
    margin: 0;
    font-size: calc(64 * 100vw / 750);
    margin-bottom: calc(150 * 100vw / 750);
    font-family: var(--font-family);
  }
  .custom-section5__header {
    background: url(/html/template/sakecabinet/assets/img/common/pages/sake-makers-message_header.png) no-repeat;
    background-size: auto 100%;
    color: #fff;
    padding: 10rem 0;
    background-color: #00052a;
  }
  .custom-section5__header__list {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    width: calc(680 * 100vw / 750);
    margin: 0 auto;
    row-gap: calc(60 * 100vw / 750);
  }
  .custom-section5__header__list__item {
    background-image: url(/html/template/sakecabinet/assets/img/common/pages/bg.png);
    background-size: 100%;
    width: 100%;
    position: relative;
    padding: calc(25 * 100vw / 750) 0;
  }
  .custom-section5__header__list__item a:hover {
    text-decoration: unset !important;
  }
  .custom-section5__header__list__item .css-position {
    text-align: right;
    margin-top: calc(30 * 100vw / 750);
  }
  .custom-section5__header__list__item .css-position .css-more_link {
    font-size: calc(32 * 100vw / 750);
  }
  .custom-section5__header__list__item .css-label_block {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    margin-bottom: calc(30 * 100vw / 750);
  }
  .custom-section5__header__list__item .css-label {
    position: relative;
    left: calc(-10 * 100vw / 750);
    padding-left: calc(20 * 100vw / 750);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: calc(450 * 100vw / 750);
    aspect-ratio: 450/111;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    background-image: url(/html/template/sakecabinet/assets/img/common/pages/sake-makers-message_label_sp.png);
    color: #fff;
    font-size: max(1.4rem, min(14 * 100vw / 750, 1.4rem));
  }
  .custom-section5__header__list__item .css-text1 {
    color: #000;
    font-size: max(1.4rem, min(14 * 100vw / 750, 1.4rem));
  }
  .custom-section5__header__list__item .css-text_block {
    padding: calc(0 * 100vw / 750) calc(10 * 100vw / 750);
  }
  .custom-section5__header__list__item .css-text_block__wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    padding: calc(30 * 100vw / 750) 0;
    margin-bottom: calc(20 * 100vw / 750);
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2 {
    text-align: center;
    color: #000;
    line-height: 1.2;
    font-size: calc(32 * 100vw / 750);
    position: relative;
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2--text {
    font-weight: bold;
    font-size: calc(32 * 100vw / 750);
    position: relative;
    z-index: 1;
  }
  .custom-section5__header__list__item .css-text_block__wrapper .css-text2--obi {
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 0;
    width: 100%;
    height: calc(13 * 100vw / 750);
    display: inline-block;
    background-color: #f6ff00;
  }
}