@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.img-fluid {
  max-width: 100%;
  height: auto;
}
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.48vw;
  line-height: 1.6;
  color: #000;
}
@media only screen and (max-width: 767px) {
  body {
    font-size: 3.2vw;
  }
}

@media only screen and (max-width: 767px) {
  .pc_only {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .sp_only {
    display: none;
  }
}

.heading_prim {
  font-size: 2.3vw;
  font-weight: 700;
  text-align: center;
  background: #BB1019;
  color: #fff;
  padding: 0.28vw 0;
  margin: 0 2.59vw;
}

@media (max-width: 767px) {
  .heading_prim {
    font-size: 4.8vw;
    padding: 1.07vw 0;
  }
}

.heading_prim.-grey {
  background: #CCCCCC;
  color: #000;
}

.top {
  max-width: 100%;
  margin: 0 auto;
}

.top_kv-img {
  position: relative;
}
.top_kv-img img {
  width: 100%;
}

.top_kv-desc {
  position: absolute;
  bottom: 5%;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  text-align: center;
  font-size: 2.96vw;
  font-weight: 700;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .top_kv-desc {
    font-size: 5.33vw;
  }
}

.top_kv-desc .-sm {
  font-size: 1.85vw;
  font-weight: 500;
  margin-left: 0.93vw;
}

@media screen and (max-width: 767px) {
  .top_kv-desc .-sm {
    font-size: 4.27vw;
    margin-left: 1.33vw;
  }

}

.top_meal {
  margin-top: 2.96vw;
}

@media screen and (max-width: 767px) {
  .top_meal {
    margin-top: 4.27vw;
    padding: 0 4.27vw;
  }

}

.top_meal-sub-heading {
  font-size: 3.52vw;
  font-weight: 700;
  color: #000;
  text-align: center;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .top_meal-sub-heading {
    font-size: 5.33vw;
  }
}

.top_meal-title {
  text-align: center;
  font-size: 5.74vw;
  font-weight: 700;
  color: #BB1019;
  line-height: 1.2;
  margin-bottom: 2.78vw;
}

@media screen and (max-width: 767px) {
  .top_meal-title {
    font-size: 7.47vw;
    margin-bottom: 4vw;
  }
}

.top_meal-subtitle {
  text-align: center;
  font-size: 1.85vw;
  font-weight: 600;
  color: #000;
  margin-bottom: 2.78vw;
  padding: 0 2.59vw;
}

@media screen and (max-width: 767px) {
  .top_meal-subtitle {
    font-size: 4.27vw;
    text-align: left;
    margin-bottom: 4vw;
    padding: 0;
  }
}

.button {
  display: block;
  background-color: #000;
  color: #fff;
  text-decoration: none;
  font-size: 2.59vw;
  font-weight: 700;
  transition: background-color 0.3s ease-in-out;
  text-align: center;
  margin: 0 auto;
  line-height: 1.2;
  padding: 2.31vw 0;
  max-width: 44.44vw;
  width: 100%;
  /* margin-bottom: 6.02vw; */
  border-radius: 3.7vw;
}

@media screen and (max-width: 767px) {
  .button {
    font-size: 4.8vw;
    padding: 5.33vw 0;
    max-width: 70.67vw;
    /* margin-bottom: 17.33vw; */
    border-radius: 10.67vw;
  }
}

.button:hover {
  background-color: #a00;
}

.food_slider {
  margin: 3.7vw 0;
}

@media screen and (max-width: 767px) {
  .food_slider {
    margin: 5.33vw 0;
  }
}
.food_slider img {
  width: 24.91vw;
}
@media screen and (max-width: 767px) {
  .food_slider img {
    width: 50vw;
  }
}

.swiper-backface-hidden .swiper-slide {
  cursor: pointer;
}

.swiper {
  text-align: center;
}



.benefits {
  padding: 0 2.59vw;
}
.benefits .heading_prim {
  margin: 0;
}
@media screen and (max-width: 767px) {
  .benefits {
    padding: 0;
  }
}

.benefits .benefits_wrap {
  padding: 3.7vw 4.63vw 5.56vw;
}

@media screen and (max-width: 767px) {
  .benefits .benefits_wrap {
    padding: 8vw 4.8vw 12.8vw;
  }
}

.benefits .benefits_items {
  display: flex;
  gap: 2.13vw;
  font-weight: 700;
  margin-bottom: 2.04vw;
}

@media screen and (max-width: 767px) {
  .benefits .benefits_items {
    display: flex;
    gap: 3.13vw;
    font-weight: 700;
    margin-bottom: 5.87vw;
  }
}

.benefits .benefits_items:last-child {
  margin-bottom: 0;
}

.benefits .benefits_items .benefits_number {
  color: #a00;
  font-size: 2.78vw;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .benefits .benefits_items .benefits_number {
    align-items: flex-start;
    font-size: 8vw;
  }
}

.benefits .benefits_items .benefits_content h3 {
  font-size: 1.85vw;
  color: #a00;
}

@media screen and (max-width: 767px) {
  .benefits .benefits_items .benefits_content h3 {
    font-size: 5.33vw;
  }
}

.benefits .benefits_items .benefits_content p {
  font-size: 1.2vw;
  margin-top: 0.74vw;
}

@media screen and (max-width: 767px) {
  .benefits .benefits_items .benefits_content p {
    font-size: 3.47vw;
    margin-top: 2.13vw;
  }
}

.flow .flow_wrap {
  display: flex;
  gap: 0.93vw;
  justify-content: flex-end;
  text-align: center;
  margin: 1.67vw 2.59vw 3.52vw 2.59vw;
  /* display: flex;
  justify-content: space-between;
  text-align: center;
  margin: 1.67vw 2.59vw 3.52vw 2.59vw; */
}

@media screen and (max-width: 767px) {
  .flow .flow_wrap {
    flex-direction: column;
    margin: 4.8vw 4.8vw 10.13vw;
    gap: 17.33vw;
  }
}

.flow h2 {
  margin: 0 2.59vw;
}
.flow {
  margin-bottom: 6.02vw;
}

@media screen and (max-width: 767px) {
  .flow h2 {
    margin: 0;
  }
  .flow {
    margin-bottom: 9.33vw;
  }
}

.flow .flow_wrap .flow_items {
  font-size: 1.2vw;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .flow .flow_wrap .flow_items {
    font-size: 3.47vw;
  }
}

.flow .flow_wrap .flow_items img {
  min-width: 31.3vw;
}

@media screen and (max-width: 767px) {
  .flow .flow_wrap .flow_items img {
    min-width: 90.13vw;
  }
}

.flow .flow_wrap .flow_items .numb {
  padding-top: 0.37vw;
  font-size: 1.67vw;
}

@media screen and (max-width: 767px) {
  .flow .flow_wrap .flow_items .numb {
    padding-top: 1.07vw;
    font-size: 4.8vw;
  }
}

.flow .flow_wrap .flow_items .sm {
  font-size: 0.93vw;
}

@media screen and (max-width: 767px) {
  .flow .flow_wrap .flow_items .sm {
    font-size: 2.67vw;
  }
}

.flow .button {
  padding: 2.31vw 0;
  max-width: 44.44vw;
  width: 100%;
  /* margin-bottom: 6.02vw; */
  border-radius: 3.7vw;
}

@media screen and (max-width: 767px) {
  .flow .button {
    padding: 5.33vw 0;
    max-width: 70.67vw;
    /* margin-bottom: 17.33vw; */
    border-radius: 10.67vw;
  }
}

.arrow {
  position: relative;
}

.arrow::before {
  content: '';
  position: absolute;
  background-image: url('https://static.e-shop.urawa-reds.co.jp/img/special/urawareds-deli/flow/arrow.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 5.48vw;
  height: 0.85vw;
  right: -10.2%;
  bottom: -1.06vw;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .arrow::before {
    width: 13.33vw;
    height: 2.67vw;
    right: 42%;
    bottom: -15vw;
    transform: rotate(90deg);
  }
}

.container {
  display: block;
  max-width: 100%;
  padding: 0 1.39vw;
  margin: 0 auto;
}
@media only screen and (max-width: 767px) {
  .container {
    padding: 0 4vw;
  }
}

.pc-only {
  display: block;
}
@media only screen and (max-width: 767px) {
  .pc-only {
    display: none;
  }
}

.lineup .yellow {
  background-color: #fdd000;
}
.lineup .l-yellow {
  background-color: #fffae5;
}
.lineup .blue {
  background-color: #57bff0;
}
.lineup .l-blue {
  background-color: #f2fafe;
}
.lineup .green {
  background-color: #2dc750;
}
.lineup .l-green {
  background-color: #eaf9ed;
}
.lineup_container {
  width: 100%;
  padding: 0 2.593vw;
  margin-top: 5vw;
  margin-bottom: 5vw;
}
.lineup_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 1.296vw;
  margin-top: 1.944vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2.133vw;
    margin-top: 5.333vw;
  }
}
.lineup_item-heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24vw;
  /* height: 24.444vw; */
  border-top-left-radius: 1.852vw;
  border-bottom-left-radius: 1.852vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-heading {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    width: 100%;
    height: 12.744vw;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    /* border-radius: 2.952vw; */
    border-top-left-radius: 2.952vw;
    border-top-right-radius: 2.952vw;
    border-bottom-left-radius: unset;
  }
}
.lineup_item-heading .count {
  font-size: 2.778vw;
  font-weight: 700;
  padding: 3.611vw 0 3.333vw 0;
  height: 50%;
}
@media only screen and (max-width: 767px) {
  .lineup_item-heading .count {
    font-size: 4.878vw;
    padding: 3.611vw 4.9px 3.333vw 0;
    height: initial;
  }
}
.lineup_item-heading .ttl {
  font-size: 3.154vw;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.38vw;
  line-height: 1;
  height: 50%;
}
.lineup_item-heading .ttl .-sm {
  font-size: 2.59vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-heading .ttl {
    font-size: 4.878vw;
    height: initial;
  }
  .lineup_item-heading .ttl .-sm {
    font-size: 3.73vw;
  }
}
.lineup_item-desc {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  border-top-right-radius: 1.852vw;
  border-bottom-right-radius: 1.852vw;
  padding: 0 2.952vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-desc {
    /* border-radius: 2.952vw; */
    border-top-right-radius: unset;
    border-top-left-radius: unset;
    border-bottom-right-radius: 2.952vw;
    border-bottom-left-radius: 2.952vw;
    width: 100%;
    padding: 0 4.8vw;
  }
}
.lineup_item-desc .info {
  font-size: 2.078vw;
  font-weight: 700;
  text-align: center;
  margin-top: 1.574vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-desc .info {
    font-size: 4vw;
    text-align: left;
    margin-top: 3.574vw;
    padding: 0 2.8vw;
  }
}
.lineup_item-desc .images {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 0.37vw;
  margin: 0 auto;
  padding-block: 2.13vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-desc .images {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2.574vw;
    padding-block: 4.8vw;
  }
}
.lineup_item-desc .images img {
  width: 20.648vw;
}
@media only screen and (max-width: 767px) {
  .lineup_item-desc .images img {
    width: 80.648vw;
  }
}

.contract {
  margin-top: 4.63vw;
}
@media only screen and (max-width: 767px) {
  .contract {
    margin-top: 8vw;
  }
}
.contract_container {
  max-width: 82.037vw;
  width: 100%;
  margin: 0 auto;
  padding-top: 3vw;
}
.contract .text_center {
  text-align: center;
  font-size: 1.667vw;
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .contract .text_center {
    font-size: 3.767vw;
  }
}
.contract_benefit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 1.204vw;
}
@media only screen and (max-width: 767px) {
  .contract_benefit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3.467vw;
    margin-top: 4.904vw;
  }
}
.contract_benefit_desc {
  text-align: center;
  font-size: 2vw;
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .contract_benefit_desc {
    font-size: 4.3vw;
  }
}
.contract_benefit_img img {
  width: 100%;
}
.contract_benefit_img {
  width: 34.63vw;
}
@media only screen and (max-width: 767px) {
  .contract_benefit_img {
    width: 66.23vw;
  }
}

.precautions {
  margin-top: 6.26vw;
}
@media only screen and (max-width: 767px) {
  .precautions {
    margin-top: 5.2vw;
  }
}
.precautions_container {
  width: 100%;
  padding: 0 2.593vw;
  margin-top: 2vw;
}
.precautions .attention {
  font-size: 1.667vw;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.037vw;
}
@media only screen and (max-width: 767px) {
  .precautions .attention {
    font-size: 3.767vw;
  }
}

.deli {
  margin-top: 9.26vw;
  margin-bottom: 3vw;
}
@media only screen and (max-width: 767px) {
  .deli {
    margin-top: 15.2vw;
    margin-bottom: 5vw;
  }
}
.deli_container {
  width: 100%;
  padding: 0 2.593vw;
  margin-top: 3vw;
  margin-bottom: 4.5vw;
}
.deli_desc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  gap: 3.5vw;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media only screen and (max-width: 767px) {
  .deli_desc {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4.8vw;
  }
}
.deli_img {
  width: 36.296vw;
  height: 13.704vw;
}
@media only screen and (max-width: 767px) {
  .deli_img {
    width: 74.296vw;
    height: 26.704vw;
  }
}
.deli_img img {
  width: 100%;
}
.deli_info {
  font-size: 1.276vw;
  font-weight: 600;
  line-height: 1.5;
}
@media only screen and (max-width: 767px) {
  .deli_info {
    font-size: 3.2vw;
  }
}