html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

template{
    display: none;
}
 
body {
    line-height:1;
}
 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
 
nav ul,li {
    list-style:none;
}
 
blockquote, q {
    quotes:none;
}
 
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
 
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
 
/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
 
/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}
 
del {
    text-decoration: line-through;
}
 
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
 
table {
    border-collapse:collapse;
    border-spacing:0;
}
 
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
 
input, select {
    vertical-align:middle;
}

/* 
 * common.css
 * コンポーネント以外で使用する共通スタイル
 */
body,
html {
  /* 基準フォントサイズ */
  --root-font-size: 16;
  /* remスケーリング */
  --scale-rem: calc(1rem / var(--root-font-size));
  scroll-behavior: smooth;
}
body {
  display: flex;
  min-height: 100vh;
  color: #333;
  font-family: 'Noto Serif JP', serif, 'Hiragino Kaku Gothic Pro', 'Meiryo';
  position: relative;
}
body._isReady {
  display: flex;
  flex-direction: column;
}

a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  opacity: 0.7;
}

img {
  width: 100%;
}

button {
  display: block;
  padding: 0;
  border: none;
  cursor: pointer;
  background: transparent;
}

.s ._pc {
  display: none !important;
}
._sp {
  display: none !important;
}
.s ._sp {
  display: block !important;
}

/**************************************
 * ヘッダー
**************************************/
header {
  width: 100%;
  height: min(10.139vw, 146px);
  background-image: url('../img/raimon.png'), url('../img/header_bg.png');
  background-size: min(100%, 1392.5px), min(100%, 1440px);
  background-repeat: repeat-x, repeat;
  background-position:
    center min(0.56vw, 8px),
    center 0;
  filter: drop-shadow(12px 12px 50px rgb(0 0 0 / 0.08));
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}
.s header {
  height: 24vw;
  background-image: url('../img/header_bg_sp.png');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center 0;
}

header .site-logo {
  width: min(18.5%, 266px);
  position: absolute;
  left: 50%;
  bottom: 42%;
  translate: -50% 50%;
  z-index: 200;
}
.s header .site-logo {
  width: 45%;
  z-index: 0;
  transition: opacity 0.3s;
}
.s header:has(nav._open) .site-logo {
  opacity: 0;
}

.nav-btn {
  display: none;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 45%;
  right: 5.3%;
  z-index: 200;
}
.s .nav-btn {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.nav-btn span {
  width: 100%;
  height: 2.5px;
  background-color: #333;
  position: absolute;
  top: 50%;
  left: 0;
  translate: 0 -50%;
  transition: 0.3s;
}
.nav-btn span:nth-child(1) {
  top: calc(50% - 8px);
}
.nav-btn span:nth-child(2) {
  width: 80%;
}
.nav-btn span:nth-child(3) {
  width: 60%;
  top: calc(50% + 8px);
}
.nav-btn._open span:nth-child(1) {
  top: 50%;
  rotate: 45deg;
}
.nav-btn._open span:nth-child(2) {
  opacity: 0;
}
.nav-btn._open span:nth-child(3) {
  width: 100%;
  top: 50%;
  rotate: -45deg;
}

header nav {
  width: min(100%, 1440px);
  height: 100%;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
.s header nav {
  flex-direction: column;
  height: 100vh;
  padding: 20px;
  background-color: #fff;
  background-image: url('../img/raimon_sp.png'), url('../img/raimon_sp.png');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position:
    center top 5px,
    center bottom 5px;
  position: static;
  translate: 0 0;
  transform: translateX(100%);
  transition: 0.3s;
}
.s header nav._open {
  transform: translateX(0);
}

.nav-logo {
  display: none;
}
.s .nav-logo {
  display: block;
  width: 45%;
  margin: 30px auto;
}

.nav-list {
  width: 100%;
  font-weight: bold;
}
.s .nav-list {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  gap: 50px;
  padding: 50px 30px 0;
  border-top: 1px solid #333;
}
.nav-item {
  flex-shrink: 0;
  color: #333;
  font-size: min(calc(16 / 1140 * 100vw), calc(18 * var(--scale-rem)));
  position: absolute;
  bottom: 42%;
  translate: 0 50%;
}
.nav-item:nth-child(1) {
  left: 5%;
}
.nav-item:nth-child(2) {
  left: 14.8%;
}
.nav-item:nth-child(3) {
  left: 30%;
}
.nav-item:nth-child(4) {
  right: 29.1%;
}
.nav-item:nth-child(5) {
  right: 17.3%;
}
.nav-item:nth-child(6) {
  right: 7.3%;
}
.s .nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  height: calc(24 * var(--scale-rem));
  font-size: calc(24 * var(--scale-rem));
  position: static;
  translate: 0 0;
}
.s .nav-item::before {
  content: '';
  display: inline-block;
  width: 15px;
  height: 1.5px;
  background-color: #333;
}
.nav-item a {
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
  height: inherit;
}
.nav-item._set a {
  display: inline-flex;
  align-items: center;
  gap: min(calc(3 / 1140 * 100vw), 8px);
}
.s .nav-item._set a {
  gap: 8px;
  height: inherit;
}
.nav-item._set img {
  width: min(calc(28 / 1140 * 100vw), 33px);
}
.s .nav-item._set img {
  width: 33px;
}

/**************************************
 * パンくずリスト
**************************************/
.breadcrumb {
  max-width: 1040px;
  margin: 0 auto;
  margin-top: 50px;
  padding: 0 20px;
}
.s .breadcrumb {
  margin-top: 30px;
  padding: 0 20px;
}
.breadcrumb-list {
  display: flex;
  align-items: center;
  gap: 30px;
  margin: 0 auto;
  padding-right: 5%;
  overflow-x: scroll;
  scrollbar-width: none;
  -webkit-mask-image: linear-gradient(to right, white 90%, transparent 100%);
  mask-image: linear-gradient(to right, white 95%, transparent 100%);
  font-size: calc(18 * var(--scale-rem));
}
.breadcrumb-list::-webkit-scrollbar {
  display: none;
}
.s .breadcrumb-list {
  gap: 13px;
  font-size: calc(13 * var(--scale-rem));
}
.breadcrumb-item {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 30px;
  overflow: hidden;
  font-weight: bold;
}
.s .breadcrumb-item {
  gap: 13px;
}
.breadcrumb-item img {
  width: 12px;
}
.s .breadcrumb-item img {
  width: 8px;
}
.breadcrumb-link {
  color: #c50202;
}
.breadcrumb-current {
  color: #888;
}

/**************************************
 * こだわり
**************************************/
#commitment {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 50px;
  scroll-margin-top: min(10.139vw, 146px);
  padding: 80px 40px 100px;
  background-image: url('../img/raimon.png'), url('../img/raimon.png');
  background-size: min(96.7%, 1440px);
  background-repeat: repeat-x;
  background-position:
    center top min(0.56vw, 8px),
    center bottom min(0.56vw, 8px);
}
.s #commitment {
  gap: 30px;
  scroll-margin-top: 24vw;
  padding: 50px 15px 60px;
  background-image: url('../img/raimon_sp.png'), url('../img/raimon_sp.png');
  background-size: min(98.4%, 738px);
  background-repeat: repeat-x;
  background-position:
    center top 8px,
    center bottom 8px;
}

.section-title._commitment {
  width: min(39.4vw, 568px);
}
.s .section-title._commitment {
  width: min(85%, 400px);
}

.commitment-list {
  gap: 20px;
  width: min(100%, 1140px);
}
.s .commitment-list {
  grid-template-columns: repeat(1, minmax(0, 1fr));
  max-width: 450px;
}

.commitment-item {
  display: flex;
  align-items: start;
  gap: 0;
}
.s .commitment-item {
  flex-direction: row !important;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
}
.s .commitment-item:nth-child(even) {
  flex-direction: row-reverse !important;
}

.s .commitment-img img {
  height: 100%;
  object-fit: cover;
}

.commitment-description {
  flex-grow: 1;
  width: 100%;
  padding: 12.5% 9.72%;
  background-color: #fff;
  background-image: url('../img/commitment_deco.png'), url('../img/commitment_deco.png');
  background-size: 89%;
  background-repeat: no-repeat;
  background-position:
    center top 5.56%,
    center bottom 5.56%;
}
.s .commitment-description {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  aspect-ratio: 4 / 3;
  width: 50%;
  padding: 5%;
  background-image: none;
}
.commitment-description > div {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.s .commitment-description > div {
  justify-content: center;
  gap: 10px;
}

.commitment-title._01 {
  width: 35.3%;
}
.s .commitment-title._01 {
  width: 52%;
}
.commitment-title._02 {
  width: 50%;
}
.s .commitment-title._02 {
  width: 78%;
}
.commitment-title._03 {
  width: 64.4%;
}
.s .commitment-title._03 {
  width: 95%;
}

.commitment-text {
  flex: 1;
  font-size: min(1.32vw, calc(19 * var(--scale-rem)));
  font-feature-settings: 'palt';
  line-height: 1.5;
}
.s .commitment-text {
  font-size: min(calc(12 * var(--scale-rem)));
  /* line-height: 1.25; */
}

/**************************************
 * おしながき
**************************************/
#menu {
  display: flex;
  align-items: center;
  scroll-margin-top: min(10.139vw, 146px);
  padding: 80px 40px 100px;
  background-image: url('../img/menu_bg_deco01.png'), url('../img/menu_bg_deco02.png');
  background-size: min(36.25%, 522px), min(28.4%, 409px);
  background-repeat: no-repeat, no-repeat;
  background-position:
    right top 5px,
    left bottom min(-18.4vw, -195px);
}
.s #menu {
  scroll-margin-top: 24vw;
  padding: 50px 15px 60px;
  background-size: min(62.25%, 459px), min(40.4%, 357px);
  background-position:
    right -70px top,
    left bottom -78px;
}

.section-title._menu {
  width: min(35.4vw, 510px);
  margin: 0 auto;
}
.s .section-title._menu {
  width: min(68%, 360px);
}

.menu-list {
  gap: 70px 30px;
  width: min(100%, 1140px);
  margin-top: 60px !important;
}
.s .menu-list {
  gap: 25px 12px;
  margin-top: 20px !important;
}

.menu-item {
  justify-content: space-evenly;
}

.menu-info {
  gap: 0px;
  margin-top: -0.2em !important;
  font-size: min(6.17vw, calc(60 * var(--scale-rem)));
  text-shadow:
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 30px #fff;
  letter-spacing: -0.02em;
}
.s .menu-info {
  margin-top: -0.3em !important;
}
.menu-info._speciality {
  gap: 30px;
  margin-top: 0 !important;
  font-size: min(6.94vw, calc(100 * var(--scale-rem)));
}
.menu-info._tenshin {
  margin-top: -0.3em !important;
}
.s .menu-info._tenshin {
  margin-top: -0.5em !important;
}

.menu-btn-area {
  margin-top: 80px !important;
  gap: 40px;
}
.m .menu-btn-area {
  flex-direction: column;
}
.s .menu-btn-area {
  gap: 20px;
  margin-top: 30px !important;
}

.menu-btn img {
  margin-right: -20px;
}
.s .menu-btn img {
  margin-right: -12px;
}

/**************************************
 * セットメニュー
**************************************/
#set {
  scroll-margin-top: min(10.139vw, 146px);
  padding: 38px;
  border: 4px solid #d0111b;
  background-image: url('../img/raimon_side.png'), url('../img/raimon_side.png');
  background-size: 19px auto;
  background-repeat: repeat-y, repeat-y;
  background-position:
    left 7px center,
    right 7px center;
  position: relative;
}
.s #set {
  scroll-margin-top: 24vw;
  padding: 15px;
  border-width: 2px;
  background-size: 8px auto;
  background-position:
    left 2px center,
    right 2px center;
}
#set::before,
#set::after {
  content: '';
  display: block;
  width: calc(100% - 8px);
  height: 34px;
  background-color: #fff;
  background-image: url('../img/raimon.png');
  background-size: auto 19px;
  background-repeat: repeat-x;
  background-position: center top 7px;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
#set::after {
  background-position: center bottom 7px;
  top: auto;
  bottom: 0;
}
.s #set::before,
.s #set::after {
  width: calc(100% - 2px);
  height: 12px;
  background-size: auto 8px;
  background-position: center top 2px;
}

.set-inner {
  gap: 0;
  padding: 40px 50px 60px;
  border: 4px solid #fff;
  outline: 6px solid #d0111b;
}
.s .set-inner {
  padding: 17.5px 20px 40px;
  border-width: 2px;
  outline-width: 3px;
}

.section-title._set {
  width: min(60.6%, 872px);
}
.s .section-title._set {
  width: min(61.2%, 459px);
}

.set-list._first {
  gap: 20px;
  width: min(100%, 900px);
  margin-top: 20px;
}
.s .set-list._first {
  gap: 25px;
  margin-top: 25px;
}
.set-list._second {
  gap: 15px;
}
.s .set-list._second {
  flex-direction: column;
  gap: 25px;
}
.set-list._third > div {
  gap: 15px;
}
.s .set-list._third > div {
  flex-direction: row !important;
  gap: 10px;
}

.set-item {
  align-content: end;
  width: 100%;
}
.set-info {
  gap: 10px;
  color: #fff;
  font-size: min(4.44vw, calc(30 * var(--scale-rem)));
  text-shadow:
    rgb(208, 17, 27) 4px 0px 0px,
    rgb(208, 17, 27) 3.87565px 0.989616px 0px,
    rgb(208, 17, 27) 3.51033px 1.9177px 0px,
    rgb(208, 17, 27) 2.92676px 2.72656px 0px,
    rgb(208, 17, 27) 2.16121px 3.36588px 0px,
    rgb(208, 17, 27) 1.26129px 3.79594px 0px,
    rgb(208, 17, 27) 0.282949px 3.98998px 0px,
    rgb(208, 17, 27) -0.712984px 3.93594px 0px,
    rgb(208, 17, 27) -1.66459px 3.63719px 0px,
    rgb(208, 17, 27) -2.51269px 3.11229px 0px,
    rgb(208, 17, 27) -3.20457px 2.39389px 0px,
    rgb(208, 17, 27) -3.69721px 1.52664px 0px,
    rgb(208, 17, 27) -3.95997px 0.56448px 0px,
    rgb(208, 17, 27) -3.97652px -0.432781px 0px,
    rgb(208, 17, 27) -3.74583px -1.40313px 0px,
    rgb(208, 17, 27) -3.28224px -2.28625px 0px,
    rgb(208, 17, 27) -2.61457px -3.02721px 0px,
    rgb(208, 17, 27) -1.78435px -3.57996px 0px,
    rgb(208, 17, 27) -0.843183px -3.91012px 0px,
    rgb(208, 17, 27) 0.150409px -3.99717px 0px,
    rgb(208, 17, 27) 1.13465px -3.8357px 0px,
    rgb(208, 17, 27) 2.04834px -3.43574px 0px,
    rgb(208, 17, 27) 2.83468px -2.82216px 0px,
    rgb(208, 17, 27) 3.44477px -2.03312px 0px,
    rgb(208, 17, 27) 3.84068px -1.11766px 0px,
    rgb(208, 17, 27) 3.9978px -0.132717px 0px;
}
.m .set-info {
  font-size: min(2.14vw, calc(22 * var(--scale-rem)));
}
.s .set-info {
  font-size: min(4.55vw, calc(32 * var(--scale-rem)));
  text-shadow:
    rgb(208, 17, 27) 2px 0px 0px,
    rgb(208, 17, 27) 1.75517px 0.958851px 0px,
    rgb(208, 17, 27) 1.0806px 1.68294px 0px,
    rgb(208, 17, 27) 0.141474px 1.99499px 0px,
    rgb(208, 17, 27) -0.832294px 1.81859px 0px,
    rgb(208, 17, 27) -1.60229px 1.19694px 0px,
    rgb(208, 17, 27) -1.97998px 0.28224px 0px,
    rgb(208, 17, 27) -1.87291px -0.701566px 0px,
    rgb(208, 17, 27) -1.30729px -1.5136px 0px,
    rgb(208, 17, 27) -0.421592px -1.95506px 0px,
    rgb(208, 17, 27) 0.567324px -1.91785px 0px,
    rgb(208, 17, 27) 1.41734px -1.41108px 0px,
    rgb(208, 17, 27) 1.92034px -0.558831px 0px;
}

.set-item._01 {
  position: relative;
}
.s .set-item._01 {
  flex-direction: column-reverse !important;
  align-items: start;
  gap: 0;
  max-width: 600px;
}
.set-img._01 {
  padding-left: 16.3%;
}
.s .set-img._01 {
  padding-left: 0;
}
.set-info-container {
  gap: 20px;
  position: absolute;
  left: 0;
  bottom: 0;
}
.s .set-info-container {
  margin-top: -20px;
  position: static;
}
.set-batch {
  width: min(9.5vw, 104px);
}
.s .set-batch {
  width: min(13.8vw, 72px);
}
.set-info._01 {
  gap: 5px;
  font-size: min(4.44vw, calc(40 * var(--scale-rem)));
}
.m .set-info._01 {
  font-size: min(2.92vw, calc(30 * var(--scale-rem)));
}
.s .set-info._01 {
  font-size: min(5.5vw, calc(34 * var(--scale-rem)));
}
.set-info._01 p {
  text-align: left !important;
}

.s .set-item._04 {
  display: flex;
  align-items: end;
  gap: 10px;
}
.s .set-info._04 {
  align-items: start;
  flex-shrink: 0;
  width: 40%;
}

.set-btn-area {
  margin-top: 80px !important;
  gap: 40px;
}
.m .set-btn-area {
  flex-direction: column;
}
.s .set-btn-area {
  gap: 20px;
  margin-top: 30px !important;
}

.set-btn img {
  margin-right: -20px;
}
.s .set-btn img {
  margin-right: -12px;
}

/**************************************
 * 店舗情報
**************************************/
#store {
  gap: 100px;
  scroll-margin-top: min(10.139vw, 146px);
  padding: 130px 0;
}
.s #store {
  gap: 40px;
  scroll-margin-top: 24vw;
  padding-top: 0;
  padding-bottom: 50px;
}

.store-inner {
  width: min(100%, 1320px);
  padding: 0 20px;
  position: relative;
}
.s .store-inner {
  flex-direction: column-reverse;
}

.store-info {
  flex-shrink: 0;
  gap: 40px;
  padding-right: 10px;
  background-color: rgb(247 228 203 / 0.6);
  position: relative;
  z-index: 50;
}
.s .store-info {
  align-items: center;
  gap: 24px;
  width: 100%;
  padding-right: 0;
  background: transparent;
}

.store-image {
  width: min(70%, 742px);
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -55%;
}
.s .store-image {
  width: 100%;
  position: static;
  translate: 20px -10px;
}

/**************************************
 * 新着情報
**************************************/
#news {
  display: flex;
  justify-content: center;
  max-width: 100vw;
  scroll-margin-top: min(10.139vw, 146px);
  padding: 80px 80px 160px;
}
.s #news {
  scroll-margin-top: 24vw;
  padding: 50px 20px 100px;
}

.section-title._news {
  width: 59px;
  color: #c50202;
}
.s .section-title._news {
  width: 156px;
}

.news-container {
  display: flex;
  justify-content: space-between;
  gap: 60px;
  width: 100%;
  max-width: 920px;
  position: relative;
}
.s .news-container {
  flex-direction: column;
  gap: 30px;
  max-width: 640px;
}

.news-header {
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}
.news-link {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-bottom: 8px;
  border-bottom: 1px solid #333;
  font-size: calc(18 * var(--scale-rem));
  font-weight: bold;
  letter-spacing: -0.04em;
}
.s .news-link {
  gap: 2.5px;
  font-size: calc(13 * var(--scale-rem));
  position: absolute;
  top: 110%;
  right: 0;
}
.news-link img {
  width: 15%;
  max-width: 16px;
  margin-top: 2px;
}
.s .news-link img {
  width: 14%;
  max-width: 11px;
}

.news-body {
  flex-grow: 1;
  max-width: 760px;
  min-width: 0;
}
.news-list {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.news-item {
  border-bottom: 1px solid #333;
}
.news-item a {
  display: block;
  padding: 20px 0 35px;
}
.s .news-item a {
  padding: 15px 0 22.5px;
}
.news-item:first-child a {
  padding-top: 0;
}
.news-meta-top {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 30px;
}
.s .news-meta-top {
  gap: 8px;
  min-height: 20px;
}
.news-date {
  font-size: calc(18 * var(--scale-rem));
}
.s .news-date {
  font-size: calc(13 * var(--scale-rem));
}
.news-taxonomy-list {
  display: flex;
  gap: 6px;
}
.news-taxonomy-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 15px 7px;
  border: 1px solid #d30000;
  border-radius: 9999px;
  color: #d30000;
  font-size: calc(16 * var(--scale-rem));
  font-weight: bold;
  line-height: 1em;
}
.s .news-taxonomy-item {
  padding: 3px 10px 4px;
  font-size: calc(12 * var(--scale-rem));
}
.news-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 15px;
  font-size: calc(20 * var(--scale-rem));
}
.s .news-title {
  margin-top: 10px;
  font-size: calc(14 * var(--scale-rem));
}
.news-title span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.news-title img {
  flex-shrink: 0;
  width: 21px;
  margin-top: -30px;
}
.s .news-title img {
  width: 15px;
  margin-top: 0;
}

.news-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 60px auto 0;
  position: relative;
}
.s .news-pagination {
  margin-top: 40px;
}
.news-pagination-item {
  padding: 0 20px;
  position: relative;
}
.s .news-pagination-item {
  padding: 0 12.5px;
}
.news-pagination-item::before {
  content: '';
  display: block;
  width: 1px;
  height: 30px;
  background-color: #333;
  position: absolute;
  top: 50%;
  left: 0;
  translate: 0 -50%;
}
.s .news-pagination-item::before {
  height: 15px;
}
.news-pagination-item._prev + .news-pagination-item::before,
.news-pagination-item:first-child::before,
.news-pagination-item._next::before {
  display: none;
}
.news-pagination-item._prev {
  position: absolute;
  right: 100%;
}
.news-pagination-item._next {
  position: absolute;
  left: 100%;
}
.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 9999px;
  font-size: calc(18 * var(--scale-rem));
  font-weight: bold;
}
.s .page-numbers {
  width: 30px;
  height: 30px;
  font-size: calc(12 * var(--scale-rem));
}
.page-numbers:visited {
  color: #c50202;
}
.page-numbers.current {
  background-color: #c50202;
  color: #fff;
}
.page-numbers.prev,
.page-numbers.next {
  width: 12px;
}
.s .page-numbers.prev,
.s .page-numbers.next {
  width: 7.5px;
}
.page-numbers.prev {
  transform: rotate(180deg);
}

/**************************************
 * 投稿ページ
**************************************/
.page._single {
}

.single-inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px 80px;
}

.single-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 60px;
  line-height: 1.6;
}
.s .single-content {
  gap: 15px;
  margin-top: 30px;
  font-size: calc(14 * var(--scale-rem));
}

._single .news-title {
  font-size: calc(32 * var(--scale-rem));
}
.s ._single .news-title {
  font-size: calc(22 * var(--scale-rem));
}
._single .news-title span {
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}

.top-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 306px;
  height: 66px;
  margin: 50px auto 0;
  border-radius: 9999px;
  border: 2px solid #fff;
  outline: 5px solid #c50202;
  filter: drop-shadow(12px 12px 20px rgba(53, 29, 0, 0.3));
  background-color: #c50202;
  color: #fff;
  font-size: calc(18 * var(--scale-rem));
  position: relative;
}
.top-btn::before {
  content: '';
  width: 15px;
  height: 11px;
  background-image: url('../img/arrow_white_left.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 50%;
  left: 40px;
  translate: 0 -50%;
}

/**************************************
 * アプリ
**************************************/
#app {
  padding: 0 20px;
  background-color: #d0111b;
  background-image: url('../img/raimon_white.png'), url('../img/raimon_white.png');
  background-size: min(96.7%, 1440px);
  background-repeat: repeat-x;
  background-position:
    center top min(0.56vw, 8px),
    center bottom min(0.56vw, 8px);
  position: relative;
}
.s #app {
  padding-top: 40px;
  background-image: url('../img/raimon_white_sp.png'), url('../img/raimon_white_sp.png');
  background-size: min(98.4%, 738px);
  background-position:
    center top 8px,
    center bottom 8px;
}

.app-inner {
  width: min(100%, 1015px);
  margin: 0 auto;
  padding-top: min(10.8%, 110px);
  padding-bottom: min(25.6%, 260px);
  position: relative;
}
.s .app-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding-top: 0;
  padding-bottom: 40px;
}

.app-info {
  display: flex;
  align-items: center;
  gap: 8px;
}
.s .app-info {
  justify-content: center;
}

.app-logo {
  width: min(9.26%, 94px);
  margin-top: 10px;
}
.s .app-logo {
  width: min(20.8%, 78px);
}

.app-text {
  color: #fff;
  font-size: min(2.8vw, calc(30 * var(--scale-rem)));
  line-height: 1.4;
}
.s .app-text {
  font-size: min(5vw, calc(25 * var(--scale-rem)));
}

.app-img {
  display: block;
  width: min(60.6%, 606px);
  position: absolute;
  top: 0;
  right: 0;
  translate: 0 -18.5%;
}
.s .app-img {
  width: min(100%, 500px);
  margin-top: 0;
  position: static;
  translate: 0 0;
}

.app-btn-area {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  position: absolute;
  bottom: 30%;
}
.s .app-btn-area {
  justify-content: center;
  gap: 15px;
  position: static;
}
.apple-btn {
  display: block;
  width: min(15.5%, 166px);
}
.s .apple-btn {
  width: 145px;
}
.google-btn {
  display: block;
  width: min(18.6%, 187px);
}
.s .google-btn {
  width: 175px;
}

/**************************************
 * フッター
**************************************/
footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 60px 20px 20px;
  background-color: #000;
  color: #fff;
}
.s footer {
  padding: 40px 15px 15px;
}

.footer-nav-list {
  display: flex;
  justify-content: center;
  gap: min(7.35vw, 75px);
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 min(5.88vw, 60px) 25px;
  border-bottom: 1px solid #fff;
  font-size: min(1.72vw, calc(18 * var(--scale-rem)));
}
.s .footer-nav-list {
  flex-wrap: wrap;
  row-gap: 40px;
  -moz-column-gap: 0;
  column-gap: 0;
  padding: 0 0 40px;
  font-size: calc(16 * var(--scale-rem));
}

.s .footer-nav-item {
  width: 50%;
}
.s .footer-nav-item:nth-child(odd) {
  padding-left: 60px;
}
.s .footer-nav-item:nth-child(even) {
  padding-left: 30px;
}

.footer-link-list {
  display: flex;
  justify-content: center;
  margin-top: 25px;
}
.s .footer-link-list {
  flex-direction: column;
  align-items: center;
  gap: 30px;
}
.footer-link-item {
  padding: 0 40px;
  border-right: 1px solid #fff;
  font-size: calc(14 * var(--scale-rem));
}
.s .footer-link-item {
  padding: 0;
  border: none;
}
.footer-link-item:last-child {
  border-right: none;
}
.footer-link-item a[target='_blank']::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 14px;
  background-image: url('../img/icon_external_link.png');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 8px;
}

.footer-insta-link {
  width: 28px;
  margin-top: 30px;
}
.s .footer-insta-link {
  width: 35px;
}

copyright {
  margin-top: 40px;
  font-size: calc(12 * var(--scale-rem));
  letter-spacing: 0.06em;
}
.s copyright {
  font-size: calc(10 * var(--scale-rem));
}
