:root {
  --vw: 1vw;
}

/* 220907 add  */
#page-service #other h3.ttl-1l {
  min-height: 68px;
  padding-top: 15px;
}
@media screen and (max-width: 768px) {
  #page-service #other h3.ttl-1l {
    min-height: auto;
    padding-top: calc(13 / 375 * 100 * var(--vw));
  }
}

/* CSS Document */
#page-service #beverages, #page-service #refreshment {
  position: relative;
  text-align: center;
  background: url(../img/common/wave.svg) no-repeat top 429px center;
  background-size: 4500px 100px;
  padding-top: 238px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages, #page-service #refreshment {
    background: url(../img/common/wave_sp.svg) no-repeat top calc(92 * var(--vw)) center;
    background-size: calc(106.9333333333 * var(--vw)) auto;
    padding-top: calc(27.4666666667 * var(--vw));
  }
}

#page-service #beverages::before, #page-service #refreshment::before {
  content: "";
  position: absolute;
  top: 149px;
  left: 0;
  width: 100%;
  height: 280px;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f2f3ec));
  background: linear-gradient(#fff 0%, #f2f3ec 100%);
  z-index: -1;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  #page-service #beverages::before, #page-service #refreshment::before {
    top: calc(21.3333333333 * var(--vw));
    height: calc(72 * var(--vw));
  }
}

#page-service #beverages .txt-en, #page-service #refreshment .txt-en {
  font-family: "Sacramento", cursive;
  position: absolute;
  top: 106px;
  left: 50%;
  font-size: 20rem;
  color: #D9CFA3;
  text-align: center;
  opacity: 0.18;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-left: -18px;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .txt-en, #page-service #refreshment .txt-en {
    top: calc(13.8666666667 * var(--vw));
    left: calc(7.4666666667 * var(--vw));
    font-size: 7.2rem;
    -webkit-transform: none;
            transform: none;
    margin: 0;
  }
}

#page-service #other h2, #page-service #beverages h2, #page-service #refreshment h2 {
  font-family: "Noto Serif JP", serif;
  font-size: 4rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #page-service #other h2, #page-service #beverages h2, #page-service #refreshment h2 {
    font-size: 2.4rem;
    line-height: 1.6666666667;
  }
}

#page-service #other .txt-black, #page-service #beverages .txt-black, #page-service #refreshment .txt-black {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #fff;
  background-color: #000;
  font-size: 1.2rem;
  line-height: 1.6666666667;
  letter-spacing: 0.08em;
  padding: 2px 23px;
  border-radius: 3px;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #other .txt-black, #page-service #beverages .txt-black, #page-service #refreshment .txt-black {
    font-size: 1.2rem;
    padding: calc(0.5333333333 * var(--vw)) calc(2.6666666667 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
    margin-top: calc(5.3333333333 * var(--vw));
  }
}

#page-service #other .lead, #page-service #beverages .lead, #page-service #refreshment .lead {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 34px;
}
@media screen and (max-width: 768px) {
  #page-service #other .lead, #page-service #beverages .lead, #page-service #refreshment .lead {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    letter-spacing: 0.1em;
    text-align: left;
    padding: 0 calc(3.2 * var(--vw));
    margin-top: calc(7.2 * var(--vw));
  }
}

#page-service #beverages .ttl-border-left, #page-service #refreshment .ttl-border-left {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .ttl-border-left, #page-service #refreshment .ttl-border-left {
    font-size: 1.6rem;
    letter-spacing: 0.1em;
  }
}
#page-service #beverages .ttl-border-left::before, #page-service #refreshment .ttl-border-left::before {
  content: "";
  display: block;
  width: 3px;
  height: 20px;
  background-color: #B79100;
  border-radius: 2px;
  margin-right: 10px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .ttl-border-left::before, #page-service #refreshment .ttl-border-left::before {
    width: calc(0.8 * var(--vw));
    height: calc(6.4 * var(--vw));
    margin-right: calc(2.6666666667 * var(--vw));
    border-radius: calc(0.5333333333 * var(--vw));
    margin-top: calc(-1.0666666667 * var(--vw));
  }
}

.btn-acc {
  display: none;
}
@media screen and (max-width: 768px) {
  .btn-acc {
    position: relative;
    display: block;
    margin-top: calc(-4.5333333333 * var(--vw));
  }
}
@media screen and (max-width: 768px) {
  .btn-acc a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: calc(26.4 * var(--vw));
    height: calc(9.0666666667 * var(--vw));
    font-size: 1.4rem;
    letter-spacing: 0.08em;
    color: #B79100;
    background-color: #fff;
    border: 1px solid #B79100;
    border-radius: calc(4.5333333333 * var(--vw));
    margin: 0 auto;
  }
}

@media screen and (max-width: 768px) {
  .acc {
    overflow: hidden;
  }
}

/* ---------------------------------------------------------
#page-service
----------------------------------------------------------*/
#page-service {
  /* ---------------------------------------------------------
  .page-nav
  ----------------------------------------------------------*/
  /* ---------------------------------------------------------
  #refreshment
  ----------------------------------------------------------*/
  /* ---------------------------------------------------------
  #beverages
  ----------------------------------------------------------*/
  /* ---------------------------------------------------------
  #other
  ----------------------------------------------------------*/
}
#page-service .page-nav {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: center;
  width: 100%;
  padding-bottom: 16px;
  margin: 62px auto 0;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service .page-nav {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -ms-flex-line-pack: start;
        align-content: flex-start;
    width: 100%;
    background: url(../img/service/bg_nav_sp.svg) no-repeat center bottom calc(1.6 * var(--vw));
    background-size: calc(266.6666666667 * var(--vw)) auto;
    padding: 0 calc(3.2 * var(--vw)) calc(0 * var(--vw));
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service .page-nav::before {
  content: '';
  position: absolute;
  display: block;
  bottom: 0;
  left: 50%;
  width: 2000px;
  height: 160px;
  background: url(../img/service/bg_nav.svg) no-repeat center bottom;
  background-size: 2000px auto;
  transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  #page-service .page-nav::before {
    content: none;
  }
}

#page-service .page-nav li {
  width: 604px;
}
@media screen and (max-width: 768px) {
  #page-service .page-nav li {
    width: calc(43.4666666667 * var(--vw));
  }
}


#page-service .page-nav li:first-child {
  margin-right: 32px;
}


#page-service .page-nav li a {
  position: relative;
  display: block;
}
#page-service .page-nav li a::after {
  content: "";
  display: block;
  width: 16px;
  height: 6px;
  background: url(../img/common/icon_arrow_small_black.svg) no-repeat;
  background-size: contain;
  margin: 20px auto;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
@media screen and (max-width: 768px) {
  #page-service .page-nav li a::after {
    width: calc(4.2666666667 * var(--vw));
    height: calc(1.6 * var(--vw));
    margin-top: calc(1.0666666667 * var(--vw));
  }
}
#page-service .page-nav li .pic {
  border-radius: 4px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service .page-nav li .pic {
    border-radius: calc(1.0666666667 * var(--vw));
  }
}
#page-service .page-nav li p {
  font-family: "Noto Serif JP", serif;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-align: center;
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #page-service .page-nav li p {
    font-size: 1.2rem;
    line-height: 1.3;
/*    letter-spacing: 0.08em;*/
    margin-top: calc(1.3333333333 * var(--vw));
  }
}
#page-service #refreshment .lead + .wrapper {
  margin-top: 130px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .lead + .wrapper {
    margin-top: calc(20.8 * var(--vw));
  }
}
#page-service #refreshment .pic-intro {
  position: relative;
  width: 1240px;
  margin: 129px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .pic-intro {
    width: calc(93.3333333333 * var(--vw));
    margin-top: calc(20.8 * var(--vw));
  }
}
#page-service #refreshment .pic-intro img {
  overflow: hidden;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .pic-intro img {
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #refreshment .pic-intro .txt {
  font-family: "Sacramento", cursive;
  position: absolute;
  right: 32px;
  bottom: 29px;
  font-size: 4rem;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .pic-intro .txt {
    right: calc(2.6666666667 * var(--vw));
    bottom: calc(4.2666666667 * var(--vw));
    font-size: 2.4rem;
  }
}
#page-service #refreshment .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 1240px;
  margin: 41px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper {
    display: block;
    width: calc(93.6 * var(--vw));
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #refreshment .wrapper .col {
  position: relative;
  width: 604px;
  padding: 0 30px 23px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .col {
    width: 100%;
    padding: 0 calc(5.3333333333 * var(--vw)) calc(9.0666666667 * var(--vw));
    margin-top: calc(7.4666666667 * var(--vw));
  }
  #page-service #refreshment .wrapper .col:first-child {
    margin-top: 0;
  }
}
#page-service #refreshment .wrapper .col::before {
  content: "";
  position: absolute;
  top: 33px;
  left: 0;
  width: 100%;
  height: calc(100% - 33px);
  border: 1px solid #B79100;
  border-radius: 3px;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .col::before {
    top: calc(7.7333333333 * var(--vw));
    height: calc(100% - 7.7333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
  }
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .acc {
    overflow: hidden;
    padding-bottom: calc(3.4666666667 * var(--vw));
  }
}
#page-service #refreshment .wrapper h3 {
  font-family: "Noto Serif JP", serif;
  position: relative;
  display: inline-block;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.4166666667;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #fff;
  color: #B79100;
  padding: 0 26px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper h3 {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: normal;
    padding: 0 calc(1.0666666667 * var(--vw));
  }
}
#page-service #refreshment .block-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 44px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper {
    display: block;
    margin-top: calc(8.2666666667 * var(--vw));
  }
  #page-service #refreshment .block-wrapper.sp-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #page-service #refreshment .block-wrapper.sp-flex .block {
    width: calc(39.2 * var(--vw));
  }
  #page-service #refreshment .block-wrapper.sp-flex .block:last-child {
    margin-top: 0;
  }
}
#page-service #refreshment .block-wrapper .block {
  width: 260px;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block {
    width: 100%;
  }
  #page-service #refreshment .block-wrapper .block:last-child {
    margin-top: calc(5.6 * var(--vw));
  }
}
#page-service #refreshment .block-wrapper .block.col2 {
  width: 100%;
}
#page-service #refreshment .block-wrapper .block .pic {
  border-radius: 3px;
  overflow: hidden;
  margin-top: 22px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block .pic {
    border-radius: calc(0.8 * var(--vw));
    margin-top: calc(4 * var(--vw));
  }
}
#page-service #refreshment .block-wrapper .block h5 {
  font-size: 1.8rem;
  line-height: 2.2857142857;
/*  font-weight: bold;*/
  letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block h5 {
    font-size: 1.6rem;
/*    font-size: 1.3rem;*/
  }
}
#page-service #refreshment .block-wrapper .block h5:first-child {
  margin-top: 0;
}
/*2022/11/17追加ここから*/
#page-service #refreshment .block-wrapper .block p {
  font-size: 1.4rem;
  line-height: 2;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block p {
    font-size: 1.3rem;
  }
}
/*2022/11/17追加ここまで*/
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block .ul-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
#page-service #refreshment .block-wrapper .block .ul-block {
  margin-top: 23px;
  margin-bottom: 41px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block .ul-block {
    width: calc(39.2 * var(--vw));
    margin-top: calc(4.8 * var(--vw));
    margin-bottom: 0;
  }
}
#page-service #refreshment .block-wrapper .block .ul-block:last-child {
  margin-bottom: 0;
}
#page-service #refreshment .block-wrapper .block ul {
  margin-top: 9px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block ul {
    margin-top: calc(1.6 * var(--vw));
  }
}
#page-service #refreshment .block-wrapper .block li {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-wrapper .block li {
    font-size: 1.3rem;
    line-height: 1.8461538462;
  }
}
#page-service #refreshment .block-wrapper .block li p {
  text-indent: 0;
  padding-left: 1.2em;
}
#page-service #refreshment .ttl-border-btm {
  font-size: 2rem;
  letter-spacing: 0.1em;
  text-align: left;
  padding-bottom: 16px;
  border-bottom: 2px solid #B79100;
  margin-top: 38px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .ttl-border-btm {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: 0.08em;
    padding-bottom: calc(2.4 * var(--vw));
    border-bottom-width: calc(0.5333333333 * var(--vw));
    margin-top: calc(6.6666666667 * var(--vw));
  }
}
#page-service #refreshment .allergy-list {
  font-size: 1.4rem;
  line-height: 2.1428571429;
  letter-spacing: 0.08em;
  text-align: left;
  margin-top: 24px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .allergy-list {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(4.8 * var(--vw));
    margin-right: 0;
  }
}
#page-service #refreshment .allergy-list li {
  text-indent: -1em;
  padding-left: 1em;
}
#page-service #refreshment .circle-wrapper {
  display: flex;
  justify-content: space-between;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-wrapper {
    display: block;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .circle,
#page-service #refreshment .circle-col1 {
  width: 260px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle,
#page-service #refreshment .circle-col1 {
    width: 100%;
    margin-top: calc(6.1333333333 * var(--vw));
  }
}
#page-service #refreshment .circle ul,
#page-service #refreshment .circle-col1 ul {
  display: flex;
  flex-wrap: wrap;
  margin-top: 21px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle ul,
#page-service #refreshment .circle-col1 ul {
    margin-top: calc(4 * var(--vw));
  }
}
#page-service #refreshment .circle ul li,
#page-service #refreshment .circle-col1 ul li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 59px;
  height: 59px;
  font-size: 1.2rem;
  font-weight: bold;
  color: #7B7B7B;
  background-color: #E8E8E8;
  border-radius: 50%;
  margin-right: 8px;
  margin-bottom: 8px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle ul li,
#page-service #refreshment .circle-col1 ul li {
    width: calc(12.2666666667 * var(--vw));
    height: calc(12.2666666667 * var(--vw));
    font-size: 1rem;
    margin: 0 calc(1.8666666667 * var(--vw)) calc(1.8666666667 * var(--vw)) 0;
  }
  #page-service #refreshment .circle ul li:nth-child(6),
#page-service #refreshment .circle-col1 ul li:nth-child(6) {
    margin-right: calc(-5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .circle ul li:nth-child(4n),
#page-service #refreshment .circle-col1 ul li:nth-child(4n) {
  margin-right: 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle ul li:nth-child(4n),
#page-service #refreshment .circle-col1 ul li:nth-child(4n) {
    margin-right: calc(2.1333333333 * var(--vw));
  }
}
#page-service #refreshment .circle ul li.is-active,
#page-service #refreshment .circle-col1 ul li.is-active {
  color: #000000;
  background-color: #efe8ce;
  border: 2px solid #c49f4e;
}
/*オリジナル*/
/*
#page-service #refreshment .circle ul li.is-active,
#page-service #refreshment .circle-col1 ul li.is-active {
  color: #fff;
  background-color: #B79100;
}
*/
/*9/17アレルギー空白追加*/
#page-service #refreshment .circle ul li.is-none,
#page-service #refreshment .circle-col1 ul li.is-none {
  background-color: #fff;
}
/*9/17アレルギー空白追加-ここまで*/

#page-service #refreshment .circle-col1 {
  width: 544px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 {
    width: 100%;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
#page-service #refreshment .circle-col1 ul {
  margin-top: 24px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul {
    margin-top: 0;
  }
}

#page-service #refreshment .circle-col1 ul li {
  width: 71px;/*オリジナルは58*/
  height: 71px;/*オリジナルは58*/
  margin-right: 23px;
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul li {
    width: calc(12.2666666667 * var(--vw));
    height: calc(12.2666666667 * var(--vw));
    font-size: 1rem;
    margin: 0 calc(1.8666666667 * var(--vw)) calc(1.8666666667 * var(--vw)) 0;
  }
}
#page-service #refreshment .circle-col1 ul li:nth-child(4n) {
  margin-right: 23px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul li:nth-child(4n) {
    margin-right: calc(1.8666666667 * var(--vw));
  }
}
#page-service #refreshment .circle-col1 ul li:last-child {
  margin-right: 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul li:last-child {
    margin-right: calc(-5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision {
  width: 1240px;
  text-align: left;
  margin: 46px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision {
    width: 100%;
    padding: 0 calc(3.2 * var(--vw));
    margin-top: calc(7.4666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision h4 {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.3333333333;
  letter-spacing: 0.1em;
  margin-top: 31px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision h4 {
    font-size: 2rem;
    line-height: 1.6666666667;
    letter-spacing: normal;
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .supervision h4 .txt-store {
  display: block;
  font-size: 1.8rem;
  letter-spacing: 0.08em;
  margin-bottom: 2px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision h4 .txt-store {
    font-size: 1.4rem;
    letter-spacing: 0.08em;
    margin-bottom: 0;
  }
}
#page-service #refreshment .supervision .supervision-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 32px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper {
    display: block;
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-wrapper .left-col {
  width: 286px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .left-col {
    width: 100%;
  }
}
#page-service #refreshment .supervision .supervision-wrapper .left-col .pic {
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .left-col .pic {
    border-radius: calc(1.0666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-wrapper .right-col {
  width: 924px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .right-col {
    width: 100%;
  }
}
#page-service #refreshment .supervision .supervision-wrapper .right-col p {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .right-col p {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(2.6666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-wrapper .right-col p:first-child {
  margin-top: 0;
  margin-top: -6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .right-col p:first-child {
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-wrapper .right-col h5 {
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.1em;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .right-col h5 {
    font-size: 1.5rem;
    line-height: 1.8666666667;
    letter-spacing: normal;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-wrapper .right-col h5:first-child {
  margin-top: 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-wrapper .right-col h5:first-child {
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision .pic-supervision-intro {
  position: relative;
  width: 1240px;
  margin: 129px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .pic-supervision-intro {
    width: calc(93.3333333333 * var(--vw));
    margin-top: calc(20.8 * var(--vw));
  }
}
#page-service #refreshment .supervision .pic-supervision-intro img {
  overflow: hidden;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .pic-supervision-intro img {
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #refreshment .supervision .pic-supervision-intro .txt1,
#page-service #refreshment .supervision .pic-supervision-intro .txt2 {
  font-family: "Sacramento", cursive;
  position: absolute;
  left: 195px;
  bottom: 29px;
  font-size: 4rem;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .pic-supervision-intro .txt1,
#page-service #refreshment .supervision .pic-supervision-intro .txt2 {
    left: calc(6.4 * var(--vw));
    bottom: calc(4.2666666667 * var(--vw));
    font-size: 2.4rem;
  }
}
#page-service #refreshment .supervision .pic-supervision-intro .txt2 {
  left: auto;
  right: 203px;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .pic-supervision-intro .txt2 {
    left: auto;
    right: calc(7.4666666667 * var(--vw));
    font-size: 2.4rem;
  }
}
#page-service #refreshment .supervision .pic-supervision-intro + .supervision-caution {
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .pic-supervision-intro + .supervision-caution {
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #refreshment .supervision .supervision-caution {
  text-align: center;
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  padding: 22px 0;
  border: 2px solid #B79100;
  border-radius: 3px;
  margin-top: 54px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision .supervision-caution {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    text-align: left;
    padding: calc(4.2666666667 * var(--vw)) calc(4.8 * var(--vw));
    border-width: calc(0.5333333333 * var(--vw));
    margin-top: calc(10.1333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #refreshment .pic-col1 {
  border-radius: 3px;
  overflow: hidden;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .pic-col1 {
    margin-top: calc(6.9333333333 * var(--vw));
    border-radius: calc(1.0666666667 * var(--vw));
  }
}
#page-service #refreshment .pic-col1 + .block-wrapper {
  margin-top: 33px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .pic-col1 + .block-wrapper {
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 {
  text-align: left;
  padding-top: 6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 {
    padding: 0;
  }
}
#page-service #refreshment .supervision-col1 h5 {
  min-height: 61px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.3333333333;
  letter-spacing: 0.1em;
  padding-top: 6px;
  margin-top: 27px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h5 {
    min-height: auto;
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: normal;
    padding: 0;
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 h5 .txt-store {
  display: block;
  font-size: 1.8rem;
  letter-spacing: 0.08em;
  margin-top: -3px;
  margin-bottom: 2px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h5 .txt-store {
    font-size: 1.4rem;
    margin-top: 0;
    margin-bottom: 0;
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 33px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper {
    display: block;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .left-col {
  width: 260px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .left-col {
    width: 100%;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .left-col .pic {
  border-radius: 3px;
  overflow: hidden;
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col {
  width: 264px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col {
    width: 100%;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col h6 {
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.08em;
  line-height: 1.875;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col h6 {
    font-size: 1.5rem;
    line-height: 1.8666666667;
    letter-spacing: normal;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col h6:first-child {
  margin-top: -3px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col h6:first-child {
    margin-top: calc(0 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col p {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 11px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col p {
    width: 100%;
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(2.6666666667 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col p:first-child {
  margin-top: -6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .right-col p:first-child {
    margin-top: calc(0 * var(--vw));
  }
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .btn-movie a {
    width: 100%;
    line-height: 1.4285714286;
    padding: calc(1.8666666667 * var(--vw)) 0;
  }
}
#page-service #refreshment .supervision-col1 h6 {
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.08em;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h6 {
    font-size: 1.5rem;
    letter-spacing: normal;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .supervision-col1 .prof-txt {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .prof-txt {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #refreshment .btn-movie {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie {
    margin-top: calc(4 * var(--vw));
  }
}
#page-service #refreshment .btn-movie a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  font-size: 1.4rem;
  line-height: 1.4285714286;
  font-weight: 500;
  letter-spacing: 0.1em;
  padding: 10px 0;
  border: 1px solid #7B7B7B;
  border-radius: 40px;
  -webkit-transition: color 0.3s, background-color 0.3s, border-color 0.3s;
  transition: color 0.3s, background-color 0.3s, border-color 0.3s;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie a {
    width: calc(90.6666666667 * var(--vw));
    font-size: 1.4rem;
    line-height: 1.8571428571;
    letter-spacing: 0.08em;
    padding: calc(1.3333333333 * var(--vw)) 0;
    border-radius: calc(13.3333333333 * var(--vw));
    margin: 0 auto;
  }
}
#page-service #refreshment .btn-movie a::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background: url(../img/common/icon_play_black.svg) no-repeat;
  background-size: contain;
  margin-right: 10px;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie a::before {
    width: calc(3.7333333333 * var(--vw));
    height: calc(3.7333333333 * var(--vw));
    margin-right: calc(2.6666666667 * var(--vw));
  }
}
@media print, screen and (min-width: 769px) {
  #page-service #refreshment .btn-movie a:hover {
    color: #B79100;
    background-color: #F4F5EF;
    border-color: #B79100;
  }
  #page-service #refreshment .btn-movie a:hover::before {
    background-image: url(../img/common/icon_play_gold.svg);
  }
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie a.is-hover {
    color: #B79100;
    background-color: #F4F5EF;
    border-color: #B79100;
  }
  #page-service #refreshment .btn-movie a.is-hover::before {
    background-image: url(../img/common/icon_play_gold.svg);
  }
}
@media screen and (max-width: 768px) {
  #page-service #beverages {
    background-position: top calc(86.6666666667 * var(--vw)) center;
  }
}
@media screen and (max-width: 768px) {
  #page-service #beverages::before {
    top: calc(16 * var(--vw));
  }
}
@media screen and (max-width: 768px) {
  #page-service #beverages .txt-en {
    left: calc(16.2666666667 * var(--vw));
  }
}
#page-service #beverages .lead + .wrapper {
  margin-top: 130px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .lead + .wrapper {
    margin-top: calc(20.8 * var(--vw));
  }
}
#page-service #beverages .pic-intro {
  position: relative;
  width: 1240px;
  margin: 129px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .pic-intro {
    width: calc(93.3333333333 * var(--vw));
    margin-top: calc(20.8 * var(--vw));
  }
}
#page-service #beverages .pic-intro img {
  overflow: hidden;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .pic-intro img {
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #beverages .pic-intro .txt {
  font-family: "Sacramento", cursive;
  position: absolute;
  right: 32px;
  bottom: 29px;
  font-size: 4rem;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .pic-intro .txt {
    right: calc(2.6666666667 * var(--vw));
    bottom: calc(4.2666666667 * var(--vw));
    font-size: 2.4rem;
  }
}
#page-service #beverages .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 1240px;
  margin: 41px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper {
    display: block;
    width: calc(93.6 * var(--vw));
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #beverages .wrapper .col {
  position: relative;
  width: 604px;
  padding: 0 30px 23px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper .col {
    width: 100%;
    padding: 0 calc(5.3333333333 * var(--vw)) calc(9.0666666667 * var(--vw));
    margin-top: calc(7.4666666667 * var(--vw));
  }
  #page-service #beverages .wrapper .col:first-child {
    margin-top: 0;
  }
}
#page-service #beverages .wrapper .col::before {
  content: "";
  position: absolute;
  top: 33px;
  left: 0;
  width: 100%;
  height: calc(100% - 33px);
  border: 1px solid #B79100;
  border-radius: 3px;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper .col::before {
    top: calc(7.7333333333 * var(--vw));
    height: calc(100% - 7.7333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
  }
}
@media screen and (max-width: 768px) {
  #page-service #beverages .acc {
    height: 0;
    overflow: hidden;
    padding-bottom: calc(3.4666666667 * var(--vw));
  }
}
#page-service #beverages .wrapper h3 {
  font-family: "Noto Serif JP", serif;
  position: relative;
  display: inline-block;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.4166666667;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #fff;
  color: #B79100;
  padding: 0 26px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper h3 {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: normal;
    padding: 0 calc(1.0666666667 * var(--vw));
    margin: 0 calc(-5.3333333333 * var(--vw));
  }
}
#page-service #beverages .block-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper {
    display: block;
  }
  #page-service #beverages .block-wrapper.sp-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #page-service #beverages .block-wrapper.sp-flex .block {
    width: calc(39.2 * var(--vw));
  }
  #page-service #beverages .block-wrapper.sp-flex .block:last-child {
    margin-top: 0;
  }
  #page-service #beverages .block-wrapper.sp-flex .block ul {
    margin-top: calc(3.4666666667 * var(--vw));
  }
  #page-service #beverages .block-wrapper.sp-block .block {
    margin-top: calc(3.4666666667 * var(--vw));
  }
  #page-service #beverages .block-wrapper.sp-block .block:last-child {
    margin-top: 0;
  }
}
#page-service #beverages .block-wrapper .block {
  width: 260px;
  padding-bottom: 8px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block {
    width: 100%;
    padding-bottom: 0;
  }
  #page-service #beverages .block-wrapper .block:last-child {
    margin-top: calc(5.6 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .txt-cat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  background-color: #F2F3EC;
  padding: 6px 10px;
  border-radius: 3px;
  margin-top: 22px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .txt-cat {
    font-size: 1.2rem;
    padding: calc(1.0666666667 * var(--vw)) calc(2.6666666667 * var(--vw)) calc(1.3333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block h5 {
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.75;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block h5 {
    font-size: 1.6rem;
    font-weight: 500;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .subttl {
  font-size: 1.2rem;
  line-height: 1.75;
  letter-spacing: 0.08em;
  margin-top: 16px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .subttl {
    font-size: 1.3rem;
    margin-top: calc(3.2 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .pic {
  border-radius: 3px;
  overflow: hidden;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .pic {
    border-radius: calc(1.0666666667 * var(--vw));
    margin-top: calc(3.2 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .block-txt,
#page-service #beverages .block-wrapper .block .txt-caution {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 14px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .block-txt,
#page-service #beverages .block-wrapper .block .txt-caution {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .txt-caution {
  display: inline-block;
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 0;
}
#page-service #beverages .block-wrapper .block ul {
  margin-top: 16px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block ul {
    margin-top: 0;
  }
}
#page-service #beverages .block-wrapper .block ul li {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block ul li {
    font-size: 1.3rem;
    line-height: 1.8461538462;
  }
}
#page-service #beverages .block-wrapper .block .btn-modal {
  margin-top: 14px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .btn-modal {
    margin-top: calc(3.4666666667 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .btn-modal a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 30px;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  border-radius: 15px;
  border: 1px solid #7B7B7B;
  -webkit-transition: color 0.3s, background 0.3s, border 0.3s;
  transition: color 0.3s, background 0.3s, border 0.3s;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .btn-modal a {
    height: calc(13.3333333333 * var(--vw));
    font-size: 1.4rem;
    border-radius: calc(6.6666666667 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .btn-modal a::before, #page-service #beverages .block-wrapper .block .btn-modal a::after {
  content: "";
  position: absolute;
  top: 9px;
  right: 12px;
  width: 9px;
  height: 9px;
  background: url(../img/common/icon_blank_black.svg) no-repeat;
  background-size: contain;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .btn-modal a::before, #page-service #beverages .block-wrapper .block .btn-modal a::after {
    top: calc(4.2666666667 * var(--vw));
    right: calc(5.0666666667 * var(--vw));
    width: calc(4.2666666667 * var(--vw));
    height: calc(4.2666666667 * var(--vw));
  }
}
#page-service #beverages .block-wrapper .block .btn-modal a::after {
  background-image: url(../img/common/icon_blank_gold.svg);
  opacity: 0;
}
@media print, screen and (min-width: 769px) {
  #page-service #beverages .block-wrapper .block .btn-modal a:hover {
    color: #B79100;
    background-color: #F4F5EF;
    border-color: #B79100;
  }
  #page-service #beverages .block-wrapper .block .btn-modal a:hover::before {
    opacity: 0;
  }
  #page-service #beverages .block-wrapper .block .btn-modal a:hover::after {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  #page-service #beverages .block-wrapper .block .btn-modal a.is-hover {
    color: #B79100;
    background-color: #F4F5EF;
    border-color: #B79100;
  }
  #page-service #beverages .block-wrapper .block .btn-modal a.is-hover::before {
    opacity: 0;
  }
  #page-service #beverages .block-wrapper .block .btn-modal a.is-hover::after {
    opacity: 1;
  }
}
#page-service #beverages .wrapper-col4 {
  position: relative;
  width: 1240px;
  padding: 0 30px 23px;
  margin: 60px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 {
    display: block;
    width: calc(93.6 * var(--vw));
    padding: 0 calc(5.0666666667 * var(--vw)) calc(9.0666666667 * var(--vw));
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4::before {
  content: "";
  position: absolute;
  top: 33px;
  left: 0;
  width: 100%;
  height: calc(100% - 33px);
  border: 1px solid #B79100;
  border-radius: 3px;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4::before {
    top: calc(7.7333333333 * var(--vw));
    height: calc(100% - 7.7333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4 h3 {
  font-family: "Noto Serif JP", serif;
  position: relative;
  display: inline-block;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.4166666667;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #fff;
  color: #B79100;
  padding: 0 26px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 h3 {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: normal;
    padding: 0 calc(1.0666666667 * var(--vw));
    margin: 0 calc(-5.3333333333 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4 .block {
  width: 277px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .block {
    width: 100%;
  }
}
#page-service #beverages .wrapper-col4 .list-col4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  text-align: left;
  margin-top: 16px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .list-col4 {
    display: block;
    margin-top: calc(4 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4 .list-col4 li {
  width: 277px;
  font-size: 1.4rem;
  line-height: 2.1428571429;
  letter-spacing: 0.08em;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .list-col4 li {
    width: auto;
    font-size: 1.3rem;
    line-height: 1.8461538462;
  }
}
#page-service #beverages .wrapper-col4 .txt-cat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  background-color: #F2F3EC;
  padding: 6px 10px;
  border-radius: 3px;
  margin-top: 22px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .txt-cat {
    font-size: 1.2rem;
    padding: calc(1.0666666667 * var(--vw)) calc(2.6666666667 * var(--vw)) calc(1.3333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4 .block-col2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  width: 578px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .block-col2 {
    width: calc(38.6666666667 * var(--vw));
  }
}
#page-service #beverages .wrapper-col4 .block-col2 ul {
  width: 277px;
  margin-top: 16px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .block-col2 ul {
    width: 100%;
    margin-top: calc(4 * var(--vw));
  }
  #page-service #beverages .wrapper-col4 .block-col2 ul:last-child {
    margin-top: 0;
  }
}
#page-service #beverages .wrapper-col4 .block-col2 ul li {
  font-size: 1.4rem;
  line-height: 2.1428571429;
  letter-spacing: 0.08em;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .wrapper-col4 .block-col2 ul li {
    font-size: 1.3rem;
    line-height: 1.8461538462;
  }
}
#page-service #beverages .ttl-border-left {
  margin-top: 36px;
}
@media screen and (max-width: 768px) {
  #page-service #beverages .ttl-border-left {
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #other {
  background-color: #F6F6F6;
  text-align: center;
  padding-top: 64px;
  padding-bottom: 60px;
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  #page-service #other {
    padding-top: calc(10.6666666667 * var(--vw));
    padding-bottom: calc(10.6666666667 * var(--vw));
    margin-top: calc(16 * var(--vw));
  }
}
#page-service #other h2 {
  font-size: 3.2rem;
}
@media screen and (max-width: 768px) {
  #page-service #other h2 {
    font-size: 2rem;
  }
}
#page-service #other .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 1240px;
  margin: 52px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #other .wrapper {
    display: block;
    width: calc(93.3333333333 * var(--vw));
    margin-top: calc(10.6666666667 * var(--vw));
  }
}
#page-service #other .col {
  position: relative;
  width: 604px;
  padding: 0 29px 37px;
}
@media screen and (max-width: 768px) {
  #page-service #other .col {
    width: 100%;
    padding: 0 calc(5.0666666667 * var(--vw)) calc(5.3333333333 * var(--vw));
  }
  #page-service #other .col:last-child {
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #other .col::before {
  content: "";
  position: absolute;
  top: 33px;
  left: 0;
  width: 100%;
  height: calc(100% - 33px);
  border: 1px solid #bbb;
  border-radius: 3px;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  #page-service #other .col::before {
    top: calc(7.7333333333 * var(--vw));
    height: calc(100% - 7.7333333333 * var(--vw));
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service #other h3 {
  font-family: "Noto Serif JP", serif;
  position: relative;
  display: inline-block;
  font-size: 2.3rem;
  font-weight: 500;
  line-height: 1.4782608696;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #F6F6F6;
  padding: 0 26px;
}
@media screen and (max-width: 768px) {
  #page-service #other h3 {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: normal;
    padding: 0 calc(1.0666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper {
    display: block;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper .pic {
  width: 260px;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .pic {
    width: 100%;
    border-radius: calc(1.0666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper .block-txt {
  width: 260px;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .block-txt {
    width: 100%;
  }
}
#page-service #other .block-wrapper .block-txt h4 {
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.875;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .block-txt h4 {
    font-size: 1.6rem;
    line-height: 1.875;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper .block-txt h4:first-child {
  margin-top: -5px;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .block-txt h4:first-child {
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper .block-txt p {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  text-align: left;
  letter-spacing: 0.08em;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .block-txt p {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .block-wrapper .block-txt p:first-child {
  margin-top: -5px;
}
@media screen and (max-width: 768px) {
  #page-service #other .block-wrapper .block-txt p:first-child {
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .btn {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #page-service #other .btn {
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #other .btn a {
  width: 100%;
  background-color: #fff;
}
#page-service #other .supervision {
  text-align: left;
  margin-top: 42px;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision {
    position: relative;
    margin-top: calc(8 * var(--vw));
  }
}
#page-service #other .supervision h5 {
  font-size: 1.4rem;
  letter-spacing: 0.1em;
  padding-bottom: 15px;
  border-bottom: 2px solid #bbb;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision h5 {
    font-size: 1.3rem;
    padding-bottom: calc(3.2 * var(--vw));
    border-bottom-width: calc(0.5333333333 * var(--vw));
  }
}
#page-service #other .supervision h6 {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.08em;
  margin-top: 27px;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision h6 {
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: normal;
    margin-top: calc(58.1333333333 * var(--vw));
  }
}
#page-service #other .supervision h6 .txt-store {
  display: block;
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision h6 .txt-store {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    letter-spacing: 0.08em;
  }
}
#page-service #other .supervision .supervision-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 27px;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision .supervision-wrapper {
    display: block;
    margin-top: calc(4.5333333333 * var(--vw));
  }
}
#page-service #other .supervision .supervision-wrapper .pic {
  width: 180px;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision .supervision-wrapper .pic {
    position: absolute;
    top: calc(12.2666666667 * var(--vw));
    left: 50%;
    width: calc(48.2666666667 * var(--vw));
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
#page-service #other .supervision .supervision-wrapper .block-txt {
  width: 340px;
  margin-top: -6px;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision .supervision-wrapper .block-txt {
    width: 100%;
    margin: 0;
  }
}
#page-service #other .supervision .supervision-wrapper .block-txt p {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
  #page-service #other .supervision .supervision-wrapper .block-txt p {
    font-size: 1.3rem;
    line-height: 1.8461538462;
  }
}
#page-service #other .caution-area {
  width: 100%;
  padding: 12px 0 0;
  border: none;
  border-top: 1px solid #ccc;
  margin-top: 14px;
  margin-bottom: -16px;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #page-service #other .caution-area {
    padding-top: calc(4.5333333333 * var(--vw));
    margin-top: calc(4.8 * var(--vw));
    margin-bottom: 0;
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service .caution-area {
  width: 1240px;
  text-align: left;
  padding: 22px 30px 23px;
  margin: 60px auto 0;
  border: 1px solid #ccc;
  border-radius: 3px;
}
@media screen and (max-width: 768px) {
  #page-service .caution-area {
    width: calc(93.3333333333 * var(--vw));
    padding: calc(4.8 * var(--vw)) calc(5.0666666667 * var(--vw));
    margin: calc(10.6666666667 * var(--vw)) auto 0;
    border-radius: calc(0.8 * var(--vw));
  }
}
#page-service .caution-area li {
  font-size: 1.2rem;
  color: #464646;
  letter-spacing: 0.1em;
  line-height: 2.5;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service .caution-area li {
    font-size: 1.2rem;
    line-height: 1.8333333333;
  }
}
#page-service .caution-area a {
  color: #B79100;
  text-decoration: underline;
}
@media print, screen and (min-width: 769px) {
  #page-service .caution-area a:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  #page-service .caution-area a.is-hover {
    text-decoration: none;
  }
}

/* ---------------------------------------------------------
#modal
----------------------------------------------------------*/
#modal {
  display: none;
}

.modal-drink-inner {
  position: relative;
  padding: 100px 0 30px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner {
    padding: calc(16 * var(--vw)) 0 calc(5.3333333333 * var(--vw));
  }
}
.modal-drink-inner::after {
  content: "";
  display: block;
  position: absolute;
  left: 30px;
  bottom: 100px;
  width: 1180px;
  height: 2px;
  background-color: #B79100;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner::after {
    left: calc(2.9333333333 * var(--vw));
    bottom: calc(19.7333333333 * var(--vw));
    width: calc(88 * var(--vw));
    height: calc(0.2666666667 * var(--vw));
  }
}
.modal-drink-inner .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0 30px;
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper {
    display: block;
    padding: 0 calc(2.9333333333 * var(--vw));
    margin-top: calc(7.4666666667 * var(--vw));
  }
}
.modal-drink-inner .wrapper .left-col,
.modal-drink-inner .wrapper .right-col {
  width: 580px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .left-col,
.modal-drink-inner .wrapper .right-col {
    width: 100%;
  }
}
.modal-drink-inner .wrapper .right-col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .right-col {
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
.modal-drink-inner .wrapper h4 {
  font-family: "Noto Serif JP", serif;
  font-size: 2.6rem;
  line-height: 1.5384615385;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper h4 {
    font-size: 1.8rem;
    line-height: 1.7777777778;
    letter-spacing: normal;
  }
}
.modal-drink-inner .wrapper .txt {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 22px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .txt {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    letter-spacing: 0.1em;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
.modal-drink-inner .wrapper .prof-txt {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .prof-txt {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    letter-spacing: 0.1em;
    margin-top: calc(3.7333333333 * var(--vw));
  }
}
.modal-drink-inner .wrapper .pic,
.modal-drink-inner .wrapper .pic-half {
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .pic,
.modal-drink-inner .wrapper .pic-half {
    margin-bottom: calc(5.3333333333 * var(--vw));
  }
}
.modal-drink-inner .wrapper .pic-half {
  width: 280px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .wrapper .pic-half {
    width: calc(41.3333333333 * var(--vw));
  }
}
.modal-drink-inner .supervision {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #B79100;
  padding-top: 30px;
  margin: 20px 30px 0;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision {
    display: block;
    width: calc(88 * var(--vw));
    padding-top: calc(5.3333333333 * var(--vw));
    margin: calc(0 * var(--vw)) auto 0;
  }
}
.modal-drink-inner .supervision .pic {
  width: 280px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision .pic {
    float: left;
    width: calc(41.3333333333 * var(--vw));
    margin-right: calc(5.0666666667 * var(--vw));
    margin-bottom: calc(5.3333333333 * var(--vw));
  }
}
.modal-drink-inner .supervision .right-col {
  width: 880px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision .right-col {
    display: unset;
    width: auto;
  }
}
.modal-drink-inner .supervision .right-col .supervision-prof,
.modal-drink-inner .supervision .right-col .supervision-txt {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 32px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision .right-col .supervision-prof,
.modal-drink-inner .supervision .right-col .supervision-txt {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    letter-spacing: 0.1em;
    margin-top: calc(0 * var(--vw));
  }
}
.modal-drink-inner .supervision .right-col .supervision-prof:first-child,
.modal-drink-inner .supervision .right-col .supervision-txt:first-child {
  margin-top: -5px;
}
.modal-drink-inner .supervision .right-col .supervision-prof {
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision .right-col .supervision-prof {
    float: left;
    width: calc(41.3333333333 * var(--vw));
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .supervision .right-col .supervision-txt {
    clear: left;
    width: 100%;
  }
}
.modal-drink-inner .btn-modal-close {
  margin-top: 62px;
}
@media screen and (max-width: 768px) {
  .modal-drink-inner .btn-modal-close {
    margin-top: calc(10.6666666667 * var(--vw));
  }
}
/*アレルギー情報表示：9/11追加*/
#page-service #refreshment .wrapper .allergy-txt {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 2.2857142857;
  text-align: left;
  letter-spacing: 0.08em;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .allergy-txt {
    font-size: 1.5rem;
    line-height: 1.8461538462;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
/* H3タイトル修正：9/11追加 */
#page-service #refreshment h3.ttl-1l,
#page-service #beverages h3.ttl-1l,
#page-service #other h3.ttl-1l {
  min-height: 68px;
  padding-top: 15px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment h3.ttl-1l,
  #page-service #beverages h3.ttl-1l,
  #page-service #other h3.ttl-1l {
    min-height: auto;
    padding-top: calc(13 / 375 * 100 * var(--vw));
  }
}

/*改修 2023/2/27 追記*/

@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .col {
    padding-bottom: calc(13 / 375 * 100 * var(--vw));
    margin-top: calc(45 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .wrapper h3 {
  /*padding: 0 15px;*/
  padding-right: 15px;
  padding-left: 15px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper h3 {
    /*padding: 0 calc(5 * var(--vw));*/
    padding-right: calc(5 * var(--vw));
    padding-left: calc(5 * var(--vw));
  }
}

@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .btn-acc {
    transform: translateY(29px);
    transform: translateY(calc(29 / 375 * 100 * var(--vw)));
    margin-top: calc(-17 / 375 * 100 * var(--vw));
  }
}

@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper .acc {
    display: block;
    padding-bottom: 0;
  }
}

#page-service #refreshment .sec1,
#page-service #refreshment .sec2 {
  text-align: left;
}

#page-service #refreshment .ttl-meal {
  font-size: 2rem;
  font-weight: bold;
  letter-spacing: .08em;
  margin-top: 45px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .ttl-meal {
    font-size: 1.6rem;
    margin-top: calc(30 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .lead-meal {
  font-size: 1.4rem;
  line-height: 2.14;
  letter-spacing: .08em;
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .lead-meal {
    font-size: 1.4rem;
    line-height: 1.71;
    margin-top: calc(15 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .sec2 .pic-col1 {
  margin-top: 24px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .sec2 .pic-col1 {
    margin-top: calc(17 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .block-detail {
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-detail {
    margin-top: calc(20 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .block-detail .num {
  display: inline-block;
  min-width: 100px;
  height: 24px;
  font-size: 1.2rem;
  color: #fff;
  font-weight: bold;
  letter-spacing: .08em;
  text-align: center;
  background-color: #BE8F00;
  border-radius: 5px;
  padding: 6px 10px 0;
  margin-top: 19px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-detail .num {
    min-width: calc(100 / 375 * 100 * var(--vw));
    height: calc(24 / 375 * 100 * var(--vw));
    border-radius: calc(5 / 375 * 100 * var(--vw));
    padding: calc(6 / 375 * 100 * var(--vw)) calc(10 / 375 * 100 * var(--vw)) 0;
    margin-top: calc(17 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .block-detail .num:first-child {
  margin-top: 0;
}

#page-service #refreshment .block-detail .item-name-disk,
#page-service #refreshment .block-detail .item-name-num,
#page-service #refreshment .block-detail .txt-intro {
  font-size: 1.4rem;
  line-height: 2.28;
  letter-spacing: .08em;
}

#page-service #refreshment .block-detail .item-name-disk,
#page-service #refreshment .block-detail .item-name-num {
  font-weight: bold;
  margin-top: 6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-detail .item-name-disk,
  #page-service #refreshment .block-detail .item-name-num {
    margin-top: calc(7 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .block-detail .item-name-disk {
  text-indent: -1em;
  padding-left: 1em;
}

#page-service #refreshment .block-detail .item-name-num {
  text-indent: -1.75em;
  padding-left: 1.75em;
}

#page-service #refreshment .block-detail .txt-intro {
  line-height: 2.14;
  padding-left: 25px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .block-detail .txt-intro {
    font-size: 1.3rem;
    line-height: 1.84;
    padding-left: calc(25 / 375 * 100 * var(--vw));
    margin-top: calc(3 / 375 * 100 * var(--vw));
  }
}

/*2023/3/14追加*/
#page-service #refreshment .block-detail .txt-intro0 {
  line-height: 2.14;
  padding-left: 0px;
}

#page-service #refreshment .sec3 .ttl-border-btm {
  font-weight: bold;
  margin-top: 32px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .sec3 .ttl-border-btm {
    margin-top: calc(25 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .allergy-list {
  font-size: 1.3rem;
  margin-top: 17px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .allergy-list {
    margin-top: calc(17 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .circle-col1 {
  width: 544px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 {
    width: 100%;
  }
}

#page-service #refreshment .circle-col1 ul {
  margin-top: 15px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul {
    margin-top: calc(17 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .circle-col1 ul li {
  width: 84px;
  height: 84px;
  font-size: 1.3rem;
  color: #000000;
  line-height: 2;
  background-color: #EFE8CE;
  border: 1px solid #B79100;
  padding: 0 5px;
  margin: 0 8px 8px 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul li {
    width: calc(46 / 375 * 100 * var(--vw));
    height: calc(46 / 375 * 100 * var(--vw));
    font-size: 1rem;
    line-height: 1.4;
    padding: 0 calc(3 / 375 * 100 * var(--vw));
    margin: 0 calc(7 / 375 * 100 * var(--vw)) calc(7 / 375 * 100 * var(--vw)) 0;
  }
}

#page-service #refreshment .circle-col1 ul li:nth-child(4n) {
  margin-right: 8px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .circle-col1 ul li:nth-child(4n) {
    margin-right: calc(7 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .circle-col1 ul li:nth-child(6n) {
  margin-right: 0;
}

#page-service #refreshment .wrapper-supervision {
  display: flex;
  justify-content: space-between;
  width: 1240px;
  margin: 36px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .wrapper-supervision {
    display: block;
    width: calc(93.6 * var(--vw));
    margin-top: calc(8 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 {
  position: relative;
  width: 604px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1:nth-child(2) {
    margin-top: calc(26 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 .ttl-border-btm {
  margin-top: 0;
}

#page-service #refreshment .supervision-col1 h5 {
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: .1em;
  margin-top: 23px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h5 {
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: 0;
    margin-top: calc(20 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 h5 .txt-store {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h5 .txt-store {
    font-size: 1.6rem;
  }
}

#page-service #refreshment .supervision-col1 .supervision-col1-wrapper {
  justify-content: flex-start;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper {
    margin-top: calc(20 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 .supervision-col1-wrapper .pic {
  width: 260px;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper .pic {
    width: 100%;
    border-radius: calc(0.8 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 .supervision-col1-wrapper p {
  width: 320px;
  font-size: 1.4rem;
  line-height: 2.14;
  letter-spacing: 0.08em;
  text-align: justify;
  text-justify: distribute;
  margin: -5px 0 0 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .supervision-col1-wrapper p {
    width: 100%;
    line-height: 1.71;
    text-align: left;
    margin: calc(18 / 375 * 100 * var(--vw)) 0 0 0;
  }
}

#page-service #refreshment .btn-movie {
  margin: 30px 0 33px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie {
    margin: calc(17 / 375 * 100 * var(--vw)) 0 calc(25 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .btn-movie a {
  letter-spacing: .05em;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie a {
    width: 100%;
    line-height: 1.42;
    letter-spacing: .08em;
    padding: calc(10 / 375 * 100 * var(--vw)) 0 calc(9 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .btn-movie a::before {
  content: none;
}

#page-service #refreshment .btn-movie a::after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background: url(../img/common/icon_play_black.svg) no-repeat;
  background-size: contain;
  padding: 6px 0;
  margin-left: 10px;
  transition: background 0.3s;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .btn-movie a::after {
    width: calc(3.7333333333 * var(--vw));
    height: calc(3.7333333333 * var(--vw));
    margin-left: calc(2.6666666667 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 h6 {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 h6 {
    font-size: 1.6rem;
    margin-top: calc(22 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .supervision-col1 .prof-txt {
  line-height: 2.14;
  margin-top: 11px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .supervision-col1 .prof-txt {
    line-height: 1.84;
    margin-top: calc(16 / 375 * 100 * var(--vw));
  }
}
/*202309追加*/
.out-web {
  color: #B79100;
  text-decoration: underline;
}
@media print, screen and (min-width: 769px) {
  .out-web:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  .out-web.is-hover {
    text-decoration: none;
  }
}

/*2024/4/1追加「生産者の想い」↓*/
#page-service .farmer-area {
  width: 1300px;
  text-align: left;
  padding: 22px 30px 23px;
  margin: 60px auto 0;
}
@media screen and (max-width: 768px) {
  #page-service .farmer-area {
    width: 100%;
    padding: calc(4.8 * var(--vw)) calc(5.0666666667 * var(--vw));
    margin: calc(10.6666666667 * var(--vw)) auto 0;
  }
}
#page-service .farmer-area li {
  font-size: 1.2rem;
  color: #464646;
  letter-spacing: 0.1em;
  line-height: 2.5;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  #page-service .farmer-area li {
    font-size: 1.2rem;
    line-height: 1.8333333333;
  }
}
#page-service .farmer-area a {
  color: #B79100;
  text-decoration: underline;
}
@media print, screen and (min-width: 769px) {
  #page-service .farmer-area a:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  #page-service .farmer-area a.is-hover {
    text-decoration: none;
  }
}

#page-service #refreshment .farmer {
  text-align: left;
  padding-top: 6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer {
    padding: 0;
  }
}

#page-service #refreshment .farmer .ttl-border-btm {
  font-size: 2rem;
  letter-spacing: 0.1em;
  text-align: left;
  padding-bottom: 16px;
  border-bottom: 2px solid #B79100;
  margin-top: 38px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .ttl-border-btm {
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: 0.08em;
    padding-bottom: calc(2.4 * var(--vw));
    border-bottom-width: calc(0.5333333333 * var(--vw));
    margin-top: calc(6.6666666667 * var(--vw));
  }
}

#page-service #refreshment .farmer h5 {
  min-height: 61px;
  font-size: 2.0rem;
  font-weight: 800;
  line-height: 1.0;
  letter-spacing: 0.1em;
  padding-top: 6px;
  margin-top: 27px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer h5 {
    min-height: auto;
    font-size: 1.8rem;
    line-height: 1.5;
    letter-spacing: normal;
    padding: 0;
    margin-top: calc(4.8 * var(--vw));
  }
}
#page-service #refreshment .farmer h5 .txt-store {
  display: block;
  font-size: 1.8rem;
  letter-spacing: 0.08em;
  margin-top: -3px;
  margin-bottom: 2px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer h5 .txt-store {
    font-size: 1.4rem;
    margin-top: 0;
    margin-bottom: 0;
  }
}
#page-service #refreshment .farmer .farmer-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper {
    display: block;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .left-col {
  width: 260px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .left-col {
    width: 100%;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .left-col .pic {
  border-radius: 3px;
  overflow: hidden;
}
#page-service #refreshment .farmer .farmer-wrapper .right-col {
  width: 264px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .right-col {
    width: 100%;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .right-col h6 {
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.08em;
  line-height: 1.875;
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .right-col h6 {
    font-size: 1.5rem;
    line-height: 1.8666666667;
    letter-spacing: normal;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .right-col h6:first-child {
  margin-top: -3px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .right-col h6:first-child {
    margin-top: calc(0 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .right-col p {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 11px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .right-col p {
    width: 100%;
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(2.6666666667 * var(--vw));
  }
}
#page-service #refreshment .farmer .farmer-wrapper .right-col p:first-child {
  margin-top: -6px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .right-col p:first-child {
    margin-top: calc(0 * var(--vw));
  }
}
#page-service #refreshment .farmer h6 {
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.08em;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer h6 {
    font-size: 1.5rem;
    line-height: 1.8461538462;
    letter-spacing: normal;
    margin-top: calc(5.3333333333 * var(--vw));
  }
}
#page-service #refreshment .farmer .prof-txt {
  font-size: 1.4rem;
  line-height: 2.2857142857;
  letter-spacing: 0.08em;
  margin-top: 18px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .prof-txt {
    font-size: 1.3rem;
    line-height: 1.8461538462;
    margin-top: calc(4.2666666667 * var(--vw));
  }
}
#page-service #refreshment .farmer {
  position: relative;
  width: 100%;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer:nth-child(2) {
    margin-top: calc(26 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .farmer .ttl-border-btm {
  margin-top: 0;
}

#page-service #refreshment .farmer .farmer-wrapper {
  justify-content: flex-start;
  margin-top: 0px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper {
    margin-top: calc(20 / 375 * 100 * var(--vw));
  }
}

#page-service #refreshment .farmer .farmer-wrapper .pic {
  width: 320px;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper .pic {
    width: 100%;
    border-radius: calc(0.8 * var(--vw));
  }
}

#page-service #refreshment .farmer .farmer-wrapper p {
  width: 100%;
  font-size: 1.4rem;
  line-height: 2.14;
  letter-spacing: 0.08em;
  text-align: justify;
  text-justify: distribute;
  margin: -5px 0 0 20px;
}
@media screen and (max-width: 768px) {
  #page-service #refreshment .farmer .farmer-wrapper p {
    width: 100%;
    line-height: 1.71;
    text-align: left;
    margin: calc(18 / 375 * 100 * var(--vw)) 0 0 0;
  }
}
#page-service #refreshment .f-anchor {
  display: block;
  padding-top: 120px;
  margin-top: -120px;
}
@media print, screen and (min-width: 769px) {
  #page-service #refreshment .f-anchor {
    display: block;
    padding-top: 120px;
    margin-top: -120px;
  }
}
/*2024/4/1追加「生産者の想い」↑*/