/* stylelint-disable selector-id-pattern */
/* stylelint-disable selector-class-pattern */

/* ---------------------------------------------------------------
  style
 ---------------------------------------------------------------- */
html {
  scroll-behavior: smooth;
}

body {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "YuGothic M", "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.4;
  color: #333;
  letter-spacing: 0.01em;
  background: none;
}

/* -- iOS対応 -- */
body::before {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100vh;
  content: "";
  background: url("../images/top_body_bg01.jpg") center bottom/cover no-repeat;
}

a {
  color: #c9955a;
}

a:hover,
a:focus,
a:active,
a.active {
  color: #333;
  text-decoration: none;
  outline: none;
  opacity: 0.7;
  transition: 0.3s ease-in;
}

/* ---------------------------------------------------------------
  style 共通
 ---------------------------------------------------------------- */
.size_minimum {
  font-size: 12px;
}

.size_small {
  font-size: 14px;
}

.size_normal {
  font-size: 16px;
}

.size_large {
  font-size: 18px;
}

.size_big {
  font-size: 20px;
}

.size_maximum {
  font-size: 24px;
}

.size_huge {
  font-size: 28px;
}

.mt0 {
  margin-top: 0 !important;
}

.mt5 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt45 {
  margin-top: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.mt70 {
  margin-top: 70px !important;
}

.mt80 {
  margin-top: 80px !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mb70 {
  margin-bottom: 70px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.mr0 {
  margin-right: 0 !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.pt45 {
  padding-top: 45px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.pt60 {
  padding-top: 60px !important;
}

.pt70 {
  padding-top: 70px !important;
}

.pt80 {
  padding-top: 80px !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.pb45 {
  padding-bottom: 45px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.pb60 {
  padding-bottom: 60px !important;
}

.pb70 {
  padding-bottom: 70px !important;
}

.pb80 {
  padding-bottom: 80px !important;
}

.bold {
  font-weight: bold;
}

.underline {
  text-decoration: underline;
}

.none {
  display: none;
}

.sp-br {
  display: none;
}

.disp-pc {
  display: block;
}

.disp-sp {
  display: none;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

.img-50per {
  max-width: 50% !important;
}

.img-49per {
  max-width: 49% !important;
}

.color-normal {
  color: #333 !important;
}

.color-red {
  color: #f00 !important;
}

.color-osn {
  color: #e61c24 !important;
}

::selection {
  color: #fff;
  text-shadow: none;
  background: #666a86;
}

i.fa-caret-right {
  width: 18px;
  height: 18px;
  padding-left: 2px;
  margin-right: 5px;
  font-size: 18px;
  line-height: 18px;
  color: #333;
  background: #fff;
  border-radius: 50%;
}

.onsen-red {
  color: #e60012;
}

/* ---------------------------------------------------------------
  共通
  --------------------------------------------------------------- */
.slide {
  background: #333;
}

.slide img {
  margin: 0 auto;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 0 !important;
}

.fixed-y {
  position: fixed;
  bottom: -400px;
  z-index: 1000;
  width: 100%;
  height: 100px;
}

/* .loop-y {
 } */

.loop-y li {
  position: absolute;
  z-index: 1000;
}

.loop-y li img {
  filter: opacity(0.2);
}

/* ---------------------------------------------------------------
  header
  --------------------------------------------------------------- */
header#header {
  position: fixed;
  top: 0;
  z-index: 1000;
  width: 100%;
  text-align: center;
}

#header #gNav {
  transition: 0.5s ease-in-out;
}

#header #gNav.nav-transparent {
  background: transparent;
}

#header ul {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  padding: 60px 0 0;
  margin: 0;
  font-size: 0;
  transition: 0.2s ease-in;
}

#header #ulNav {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 10% minmax(0, 1fr);
}

#header #ulNav > .nav-group {
  min-width: 0;
  border: none;
}

#header #ulNav .nav-group > ul {
  padding: 0;
}

#header .nav-group li {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
}

#header #ulNav > .top-logo {
  justify-self: center;
  width: 100%;
}

#header li {
  /* width: 10%; */

  /* display: inline-block; */
  flex-basis: 10%;
  font-size: 16px;
  white-space: nowrap;
  border-left: 1px solid #fff;
}

#header li a {
  position: relative;
  display: block;
  color: #fff;
  opacity: 0.8;
}

#header li.active a {
  pointer-events: none;
}

#header li.active a,
#header li a:hover,
#header li a.active {
  letter-spacing: 0.1em;
  opacity: 1;
}

#header li.active a::before,
#header li a:hover::before,
#header li a.active::before {
  position: absolute;
  right: 0;
  left: 0;
  display: block;
  width: 95%;
  height: 100%;
  margin: 0 auto;
  content: "";
  background: rgb(255 255 255 / 30%);
  filter: blur(8px);
  border-radius: 10px;
}

#header li.border-r {
  border-right: 1px solid #fff;
}

#header .top-logo {
  /* width: 290px; */

  /* padding: 0 30px; */
  padding: 24px 8px;
  margin-top: 0;
  vertical-align: top;
  border-left: none;
  transition: 0.3s ease-in-out 0.2s;
}

#header .top-logo a {
  opacity: 1;
}

#header .top-logo a:hover::before {
  content: none;
}

#header .top-logo img {
  max-width: 100%;
  max-height: 3.5em;
  object-fit: contain;
}

#header a.sp-logo {
  display: none;
}

/* -- scroll down -- */
#header nav.scrolldown {
  padding-bottom: 13px;

  /*
	background: rgba(227,0,19,0.7);
*/
  background: rgb(0 0 0 / 70%);
}

#header nav.scrolldown ul {
  padding: 5px 0 0;
}

/* #header nav.scrolldown li {} */

#header nav.scrolldown li.top-logo {
  max-width: 150px;
}

#header .gnav-words {
  position: absolute;
  top: 3px;
  right: 3px;
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: #fff;
  text-align: right;
}

/* ---------------------------------------------------------------
  top
  --------------------------------------------------------------- */

/* -- section top-mv -- */
section#top-mv {
  /*
	background: url(../images/top_mv_01.jpg) center bottom/cover no-repeat;
	min-height: 800px;
	overflow: hidden;
*/
  position: relative;
  margin-top: -7%;

  /*
	min-height: 80vh;
	overflow: hidden;
*/
}

#top-mv .slide .swiper-slide img {
  animation: move 10s linear 0s infinite alternate;
}

@keyframes move {
  0% {
    transform: scale(1, 1);
  }

  100% {
    transform: scale(1.1, 1.1);
  }
}

section#top-mv h2 {
  position: absolute;
  right: 0;
  bottom: 115px;
  left: 0;
  z-index: 20;
  font-family: "GJ Kyoukasho ICA Regular";
  font-size: 50px;
  color: #fff;
  text-align: center;
}

/*
#top-mv::after{
	content: "";
	display: block;
	background: rgba(0,0,0,0.3);
	width: 100%;
	height: calc(100% - 96px);
	position: absolute;
	top: 0;
	z-index: 10;
}
*/

.video-pv {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
}

.video-pv video {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
}

.video-pv.overlay::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
}

section#top-mv .news-box {
  color: #fff;
  background: rgb(0 0 0 / 50%);

  /*
	position: absolute;
	bottom: 0;
	z-index: 10;
	width: 100%;
*/
}

section#top-mv .news-box .inner {
  max-width: 1200px;
  padding: 10px 0 5px;
  margin: 0 auto;
}

section#top-mv .news-box dl {
  margin: 0;
}

section#top-mv .news-box dt {
  display: inline-block;
  padding: 3px 10px;
  margin-right: 20px;
  font-size: 18px;
  letter-spacing: 0.2em;
  background: #56b4ea;
}

section#top-mv .news-box dd {
  display: inline-block;
  vertical-align: top;
}

section#top-mv .news-box dd ul {
  margin: 0;
}

section#top-mv .news-box dd li {
  margin-bottom: 5px;
  letter-spacing: 0.1em;
}

section#top-mv .news-box dd li a {
  color: #fff;
  border-bottom: 1px solid transparent;
}

section#top-mv .news-box dd li a:hover {
  border-bottom: 1px dotted #fff;
  opacity: 0.9;
}

section#top-mv .news-box dd li span {
  margin-right: 10px;
}

section#top-mv .news-box .first a {
  display: block;
  padding: 4px 15px 2px 5px;
  margin-bottom: 5px;
  margin-left: -9px;
  font-size: 20px;
  font-weight: bold;
  color: #e61c24 !important;
  background: #fff;
}

/* -- section top-info01 -- */
section#top-info01 {
  padding: 30px 0 0;
  line-height: 2;
  text-align: center;
}

section#top-info01 h3 {
  margin-bottom: 30px;
  font-size: 26px;
  letter-spacing: 0.2em;
}

section#top-info01 p {
  margin-bottom: 50px;
}

section#top-info01 .slide {
  position: relative;
  max-height: 550px;
  overflow: hidden;
}

/*
section#top-info01 img.gaikan{
	width: 100%;
}
*/

/* -- section top-notes -- */
section#top-notes {
  padding: 0;
  line-height: 2;
  text-align: center;
  background: #fff;
}

section#top-notes h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1.7;
}

section#top-notes .white-box {
  max-width: 1000px;
  padding: 15px 30px;
  margin: 30px auto;
  font-size: 18px;
  text-align: left;
  border: 1px solid #888;
}

section#top-notes .white-box .title {
  display: block;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

section#top-notes .white-box table {
  margin: 15px auto 0;
}

section#top-notes .white-box td {
  min-width: 250px;
  padding: 5px 0 0;
  border: 1px solid #ccc;
}

.measures-notes {
  width: calc(100% + 30px);
  margin-bottom: 0;
  margin-left: -15px;
  background: #666;
}

.measures-notes a {
  display: block;
  padding: 10px 0;
  font-size: 18px;
  color: #fff;
  text-decoration: underline;
}

/* -- section top-news -- */
section#top-news {
  margin-top: 30px;
  color: #333;
  text-align: center;
  background: rgb(255 255 255 / 90%);
  border-top: 3px solid #888;
  border-bottom: 3px solid #888;
}

section#top-news h3 {
  margin-bottom: 35px !important;
  font-size: 22px;
  line-height: 2;
}

section#top-news p {
  margin: 30px 0 0;
  font-size: 26px;
  font-weight: bold;
  color: #e61c24;
}

section#top-news p span {
  margin: 0 2px;
  color: #e61c24;
}

/* top-news 20200101 */
section#top-news.gantan {
  padding: 0;
  margin-top: 0;
  background: url("/shared/images/top_news_ban1.jpg");
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

section#top-news.gantan .text1 {
  font-size: 24px;
}

section#top-news.gantan .text2 {
  font-size: 18px;
  color: #333;
}

/* section#top-news.gantan .text3 {} */

/* section#top-news.gantan .text4 {} */

section#top-news.gantan .border-b {
  padding-bottom: 30px;
  border-bottom: 1px solid #ccc;
}

section#top-news.tax {
  margin-top: 0;
  border: none;
}

section#top-news.tax h3 {
  position: relative;
  margin-bottom: 25px !important;
  font-size: 26px;
}

section#top-news.tax h3::after {
  /*
	content: "";
	display: block;
	border-bottom: 3px solid #888;
	width: 260px;
	margin: -5px auto 0 auto;
*/
}

section#top-news.tax .text1 {
  font-size: 20px;
}

section#top-news.tax .text2 {
  font-size: 16px;
  color: #333;
}

section#top-news.tax table {
  margin: 0 auto;
}

section#top-news.tax td {
  width: 20%;
  padding: 10px;
  border: 1px solid #333;
}

/* -- section camp2020 -- */
section#top-camp2020-1 {
  max-width: 800px;
  padding: 40px 0 20px;
  margin: 0 auto 30px;
}

section#top-camp2020-1 .title {
  display: block;
  width: 100%;
  max-width: 750px;
  margin: 0 auto 20px;
}

section#top-camp2020-1 .camp-title {
  max-width: 750px;
  margin: 0 auto 7px;
  margin-bottom: 5px;
  font-size: 24px;
  font-weight: 700;
  color: #b40019;
  border-bottom: 1px solid #b40019;
}

section#top-camp2020-1 .camp-title span {
  display: inline-block;
  width: 38px;
  height: 48px;
  padding-top: 15px;
  margin-right: 10px;
  color: #fff;
  text-align: center;
  background: url("/shared/images/top/camp202012_02.png") bottom center no-repeat;
}

section#top-camp2020-1 .camp-text {
  padding-left: 55px;
  margin-bottom: 30px;
  font-size: 20px;
  font-weight: 700;
}

section#top-camp2020-1 .camp-text span {
  padding: 3px 5px 2px 13px;
  margin-right: 15px;
  font-size: 16px;
  color: #fff;
  vertical-align: 1px;
  background: #c9bb4f;
  border-radius: 15px;
}

section#top-camp2020-2 {
  width: 100%;
  padding: 30px;
  text-align: center;
  background: #fff;
}

section#top-camp2020-2 .container-fluid {
  max-width: 750px;
  padding: 0;
}

section#top-camp2020-2 .title {
  width: 100%;
  max-width: 750px;
  margin-bottom: 20px;
}

section#top-camp2020-2 .text01 {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
}

section#top-camp2020-2 table {
  width: 95%;
  margin: 0 auto 20px;
  font-size: 22px;
  text-align: center;
}

section#top-camp2020-2 table th {
  width: 25%;
  padding: 10px 0;
  font-weight: 700;
  text-align: center;
  background: #cec89a;
  border: 1px solid #888;
}

section#top-camp2020-2 table th span {
  font-size: 16px;
  vertical-align: 2px;
}

section#top-camp2020-2 table td {
  padding: 15px 0;
  border: 1px solid #888;
}

/* section#top-camp2020-2 .text02 {} */

section#top-camp2020-3 {
  position: relative;
  padding: 34px 0;
  text-align: center;
  background: #fff url("/shared/images/top/camp202012_05.png") center center repeat-x;
}

section#top-camp2020-3::before {
  position: absolute;
  top: -10px;
  right: 0;
  left: 0;
  display: block;
  max-width: 760px;
  height: 150px;
  margin: auto;
  content: "";
  background: url("/shared/images/top/camp202012_04.png") center center no-repeat;
}

section#top-camp2020-3 .text01 {
  font-size: 28px;
  color: #b40019;
}

section#top-camp2020-3 .text01 span {
  margin: 0 2px;
  font-size: 42px;
  font-weight: 700;
}

section#top-camp2020-3 .text02 {
  font-size: 18px;
  font-weight: 700;
}

/* -- section top-beerterrace -- */
section#top-beerterrace {
  padding: 0 0 30px;
  margin-top: -40px;
  background: #000;
}

section#top-beerterrace a {
  position: relative;
  z-index: 10;
  display: block;
  overflow: hidden;
}

section#top-beerterrace a::before {
  display: none;
  content: "";

  /*
	background: #ff0000;
	width: 100%;
	display: block;
	position: absolute;
	height: 211px;
	bottom: 0;
*/
}

section#top-beerterrace a img {
  position: relative;
  margin: 0 auto;
  transition: 0.3s ease-in-out;
}

section#top-beerterrace a:hover {
  opacity: 1;
}

section#top-beerterrace a:hover::before {
  content: "";
}

section#top-beerterrace a:hover img {
  transform: scale(1.01);
}

/* -- section top-links -- */
section#top-links {
  padding: 70px 5% 15px;
  background: #000;
}

section#top-links .links-box {
  width: 47%;
  padding: 100px 20px 50px;
  margin: 0 1.5% 60px;
  text-align: center;
}

section#top-links .box1 {
  background: url("../images/top_links01.jpg") center top/cover no-repeat;
}

section#top-links .box2 {
  background: url("../images/top_links02.jpg") center top/cover no-repeat;
}

section#top-links .box3 {
  background: url("../images/top_links03.jpg") center top/cover no-repeat;
}

section#top-links .box5 {
  background: url("../images/top_links05.jpg") center top/cover no-repeat;
}

/*
section#top-links .box4{ background: url(../images/top_links04.jpg) center top/cover no-repeat; }
section#top-links .box6{ background: url(../images/top_links08.jpg) center top/cover no-repeat; }
*/

section#top-links .bg {
  width: 90%;
  padding: 30px 5%;
  margin: 0 auto;
  color: #fff;
  background: rgb(0 0 0 / 60%);
}

section#top-links h4 {
  padding-bottom: 7px;
  margin-top: 0;
  margin-bottom: 25px;
  font-size: 28px;
  letter-spacing: 0.2em;
  border-bottom: 2px solid #fff;
}

/* section#top-links .btn-border {} */

section#top-links .btn-border a {
  display: inline-block;
  min-width: 150px;
  padding: 11px 15px 10px;
  color: #fff;
  border: 2px solid #fff;
}

section#top-links .btn-border a:hover {
  background: rgb(255 255 255 / 20%);
}

section#top-links .btn-border a i {
  /*
	font-size: 40px;
*/
}

section#top-links .btn-border a span {
  display: inline-block;
  margin: 5px 0;
  vertical-align: 8px;
}

section#top-links .box1 table {
  width: 95%;
  margin: 0 auto;
}

section#top-links .box1 td {
  width: 20%;
  padding: 5px 0;
  border: 1px solid #fff;
}

section#top-links .box2 ul {
  width: 80%;
  max-width: 500px;
  margin: 0 auto 25px;
}

section#top-links .box2 li {
  display: inline-block;
  width: 30%;
  padding: 3px 0;
  margin: 0 1% 10px;
  font-size: 18px;
  font-weight: bold;
  color: #333;
  background: #fff;
}

section#top-links .box3 h4 {
  margin-bottom: 35px;
}

section#top-links .box3 p {
  width: 90%;
  margin: 0 auto 30px;
  text-align: left;
}

section#top-links .box4 .stay-img {
  max-width: 375px;
  margin-bottom: 20px;
}

section#top-links .box4 p {
  width: 90%;
  margin: 0 auto 20px;
}

/*
section#top-links .box5{
	padding: 0;
}

section#top-links .box5 .img-sp{
	display:none;
}
*/

section#top-links .box6 {
  padding: 50px 20px;
  margin-bottom: 0;
}

section#top-links .box6 p {
  margin-bottom: 20px;
}

section#top-links .box6 i {
  font-size: 40px;
}

/* section#top-links .box6 ul.btn-inline {} */

section#top-links .box6 ul.btn-inline li {
  display: inline-block;
}

section#top-links .box6 ul.btn-inline li:nth-child(1) {
  margin-right: 15px;
  vertical-align: 3px;
}

section#top-links .box6 ul.btn-inline li:nth-child(2) a {
  padding: 10px 15px 7px;
}

section#top-links .box6 ul.btn-inline li:nth-child(2) a i {
  vertical-align: 0;
}

section#top-links .box6 i.detail {
  font-size: 18px;
}

section#top-links .box7 {
  padding: 0;
}

/* section#top-links .box7 img {} */

section#top-links .box7 .img-sp {
  display: none;
}

#point-start {
  padding-top: 50px;
  background: #000;
}

#point-start a {
  display: block;
  width: 100%;
  padding: 15px 0;
  font-size: 38px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  background: linear-gradient(to bottom, #e50012 0%, #b00012 100%);
}

#point-start a span {
  display: block;
  font-size: 22px;
}

/* -- section event-yu -- */
#top-event-yu {
  padding: 60px 5%;
  background: #464545;
}

#top-event-yu ul {
  display: grid;
  grid-template-columns: repeat(7, 14.285%);
}

#top-event-yu li {
  padding: 8px;
}

#top-event-yu li img {
  width: 100%;

  /*
  filter: brightness(90%);
*/
}

#top-event-yu li.ttl {
  grid-column: 1 / 4;
  padding: 0;
}

#top-event-yu li.ttl img {
  display: block;
  max-width: calc(100% - 16px);
  margin: 0 auto;
  filter: brightness(100%);
}

#top-event-yu li:last-child {
  grid-row: 2 / 4;
  grid-column: 6 / 8;
}

#top-event-yu li:last-child img {
  filter: brightness(100%);
}

/* -- section sauna -- */
#top-sauna {
  background: url("/shared/images/top/sauna_bg.jpg") center center/cover no-repeat;
}

#top-sauna dl {
  display: flex;
  align-items: center;
  justify-content: center;
}

#top-sauna dt {
  flex-basis: 45%;
}

#top-sauna dt img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
}

#top-sauna dd {
  flex-basis: 55%;
  padding: 50px 100px 30px 20px;
}

#top-sauna dd img {
  max-width: 100%;
}

/* -- section access -- */
section#top-access {
  padding: 60px 0;
  text-align: center;
}

section#top-access h4 {
  margin-bottom: 50px;
  font-size: 30px;
  line-height: 1.7;
  letter-spacing: 0.4em;
}

/* section#top-access a.taxi-ban {} */

section#top-access a.taxi-ban img {
  max-width: 420px;
  margin: 0 auto 45px;
}

/* section#top-access .btn-border {} */

section#top-access .btn-border a {
  display: inline-block;
  padding: 7px 25px;
  margin-bottom: 50px;
  font-size: 18px;
  color: #fff;
  background: #e61c24;
}

section#top-access .btn-border a:hover {
  opacity: 0.7;
}

section#top-access .btn-border a i {
  color: #e61c24;
}

/* ---------------------------------------------------------------
  footer
  --------------------------------------------------------------- */
footer#footer {
  padding: 40px 0;
  color: #fff;
  text-align: center;
  background: #e61c24;
}

#footer .inquiry {
  margin-bottom: 20px;
  font-size: 28px;
  font-weight: bold;
}

#footer .logo-box {
  padding-bottom: 20px;
}

#footer .logo-box .img-minato {
  max-width: 230px;
}

#footer .logo-box .img-csa {
  max-width: 160px;
}

#footer .logo-box .img-travel {
  max-width: 160px;
}

#footer .logo-box span {
  margin-right: 5px;
  margin-left: 30px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: -2px;
}

#footer .insta-box {
  margin: 10px 0 30px;
}

#footer .csach img {
  width: 100%;
  max-width: 200px;
  margin: 5px 0 30px;
}

#footer .insta-box a img {
  max-width: 390px;
}

#footer .copy {
  padding-top: 15px;
  margin: 0;
  font-size: 14px;
  border-top: 1px solid #fff;
}

/* -- page top -- */
#go_pagetop {
  position: fixed;
  right: 20px;
  bottom: 20px;
}

#go_pagetop a {
  display: block;
  width: 70px;
  padding: 20px 0;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background: #111;
  border-radius: 2px;
  opacity: 0.8;
}

#go_pagetop a:hover {
  text-decoration: none;
  background: #333;
}

/* -- excite box -- */
.footer-excite-box {
  padding: 45px 0;
  font-size: 28px;

  /*
	margin: 0 -15px;
*/
  color: #fff;
  text-align: center;
  background: url("/shared/images/footer_excite_bg.jpg") center bottom/cover no-repeat;
}

.footer-excite-box span i {
  width: auto;
  height: auto;
  padding-left: 5px;
  margin-right: 25px;
  font-size: 34px;
  color: #fff;
  vertical-align: -2px;
  background: none;
  border-radius: inherit;
}

.footer-excite-box a {
  color: #fff;
}

.footer-excite-box a img {
  max-width: 160px;
}

.footer-excite-box a.url-text {
  margin-left: 25px;
}

/* -- campaign -- */
.camp-box1 {
  position: fixed;
  right: 0;
  bottom: 110px;
  z-index: 100;
  width: 302px;
  height: 302px;
  padding: 0;
  color: #fff;
  background: #e61c24;
  border: 1px solid #fff;
  transition: all 0.2s ease-in;
}

.camp-box1 .close {
  position: absolute;
  top: -32px;
  right: 0;
  padding: 5px;
  color: #fff;
  background: rgb(0 0 0 / 70%);
  opacity: 1;
}

.camp-box1 .close:hover {
  opacity: 0.7;
}

.camp-box1 img.pc-disp {
  display: block;
}

.camp-box1 img.sp-disp {
  display: none;
}

.camp-box1 .arrow.arrow-right i.fa-angle-double-left {
  display: none;
}

.camp-box1 .arrow.arrow-left i.fa-angle-double-right {
  display: none;
}

.camp-box1 .arrow {
  position: absolute;
  top: 0;
  right: auto;
  left: -31px;
  display: block;
  padding: 5px 7px;
  font-size: 28px;
  cursor: pointer;
  background: #000;
  transition: all 0.2s ease-in;
}

/* ---------------
  追従バナー
  --------------- */

#top-fixed-banner-series > * {
  /* .top-fixed-ban { */
  position: fixed;
  right: 0;
  z-index: 100;
  margin-top: -150px;
}

#top-fixed-banner-series > *:nth-last-child(1) {
  /* .top-fixed-ban.work { */
  top: calc(74% + 200px);
}

#top-fixed-banner-series > *:nth-last-child(2) {
  top: calc(74% + 100px);
}

#top-fixed-banner-series > *:nth-last-child(3) {
  top: 74%;
}

#top-fixed-banner-series > *:nth-last-child(4) {
  /* .top-fixed-ban.fourth-banner { */
  top: calc(74% - 100px);
}

/* .top-fixed-ban a {} */

#top-fixed-banner-series > * a:hover {
  opacity: 1;
}

#top-fixed-banner-series > * a img {
  width: 90%;
  height: auto;
  transition: 0.3s ease-in-out;
}

#top-fixed-banner-series > * a img:hover {
  transform: rotate(10deg);
}

/* .top-fixed-ban:hover {} */

.modaal-wrapper .modaal-container .modaal-content-container {
  padding: 0;
}

.modaal-wrapper .modaal-container .modaal-content-container object {
  width: 100%;
  min-height: 640px;
}

.modaal-wrapper .modaal-close {
  top: 40px;
}

/* bootstrap modal */
.top-modal-event .modal-dialog {
  width: auto;
  max-width: 1200px;
  height: 800px;
}

.top-modal-event .modal-content {
  height: 100%;
}

.top-modal-event .modal-body {
  height: 730px;
  overflow-y: scroll;
}

.top-modal-event .modal-body img {
  width: 100%;
}

.top-modal-event .modal-body object {
  width: 100%;
  height: 100%;
}

/* ---------------------------------------------------------------
  sub-page 共通
  --------------------------------------------------------------- */
.subpage-mv {
  position: relative;
  min-height: 550px;
  margin-bottom: 30px;
  text-align: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.subpage-mv h1 {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0 auto 25px;
  font-size: 36px;
  color: #fff;
  letter-spacing: 0.5em;
}

.sub-page .sentence h2 {
  padding: 10px 0;
  margin: 0 -15px 40px;
  font-size: 28px;
  font-weight: normal;
  color: #fff;
  letter-spacing: 0.2em;
  background: #333;
}

.sub-page .sentence h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1.7;
  letter-spacing: 0.2em;
}

.sub-page .sentence section .inner {
  max-width: 1200px;
  margin: 0 auto;
}

.sub-page #sub-visit,
.sub-page #sub-about,
.sub-page #sub-facilities,
.sub-page #sub-stay,
.sub-page #sub-access,
.sub-page #sub-news,
.sub-page #sub-food {
  margin-bottom: 100px;
  overflow-x: hidden;
  text-align: center;
}

.sub-page #sub-access {
  margin-bottom: 0;
}

#visit-mv {
  background-image: url("../images/visit/mv.jpg");
  background-position: center bottom;
}

#about-mv {
  background-image: url("../images/about/mv.jpg");
  background-position: center bottom;
}

#faci-mv {
  background-image: url("../images/facilities/mv.jpg");
  background-position: center bottom;
}

#stay-mv {
  background-image: url("../images/stay/mv.jpg");
  background-position: center bottom;
}

#access-mv {
  background-image: url("../images/access/mv.jpg");
  background-position: center bottom;
}

#news-mv {
  background-image: url("../images/news/mv.jpg");
  background-position: center bottom;
}

#food-mv {
  background-image: url("../images/food/mv.jpg");
  background-position: center bottom;
}

/* ---------------------------------------------------------------
  sub-page visit
  --------------------------------------------------------------- */
#visit-price .price-main-box {
  width: 100%;
  margin: 0 0 20px;
  font-size: 24px;
  background: #fff;
}

#visit-price .price-main-box td {
  width: 20%;
  padding: 10px;
  border: 1px solid #333;
}

#visit-price .price-set-box {
  width: 100%;
  font-size: 20px;
  background: #fff;
}

#visit-price .price-set-box span.space-br {
  padding: 0 2px;
}

#visit-price .price-set-box td {
  width: 25%;
  padding: 10px;
  border: 1px solid #333;
}

#visit-price .price-set-box td span {
  font-size: 16px;
}

#visit-price .price-option {
  display: grid;
  padding: 15px 10px 15px 20px;
  font-size: 18px;
  text-align: left;
  background: #fff;
  border: 1px solid #333;
}

/* #visit-price .price-option p {} */

#visit-price .gray-box {
  padding: 15px 0;
  margin-bottom: 20px;
  font-size: 22px;
  color: #fff;
  background: #808080;
}

#visit-member .img-box {
  text-align: right;
}

#visit-member img {
  width: 100%;
  max-width: 250px;
}

#visit-member .text-box {
  line-height: 2;
  text-align: left;
}

#visit-pointcard {
  padding-top: 100px;
  margin-top: -100px;
}

#visit-pointcard .start {
  width: 300px;
  padding: 2px 0;
  margin: 0 auto 10px;
  font-size: 26px;
  font-weight: bold;
  color: #d71518;
  border-top: 2px solid #d71518;
  border-bottom: 2px solid #d71518;
}

/* #visit-pointcard .img-box {} */

#visit-pointcard .img-box .card-box {
  display: inline-block;
  width: 43%;
  padding-bottom: 15px;
  margin: 0 3%;
}

#visit-pointcard .img-box .card-box img {
  display: block;
  width: 100%;
  max-width: 250px;
  margin: 0 auto 5px;
}

#visit-pointcard .text-box {
  padding: 15px;
  font-size: 20px;
  text-align: left;
  border: 2px solid #333;
}

#visit-pointcard .text-box .title1 {
  margin-bottom: 20px;
  font-size: 26px;
}

/* #visit-pointcard .text-box .text1 {} */

#visit-pointcard .text-box .day-mon {
  margin-bottom: 0;
  font-size: 26px;
  color: #1b2a75;
}

#visit-pointcard .text-box .day-wed {
  margin-bottom: 0;
  font-size: 26px;
  color: #d71518;
}

#visit-pointcard .text-box .day-fri {
  margin-bottom: 10px;
  font-size: 26px;
  color: #2da338;
}

#visit-pointcard .text-box .day-sat {
  margin-bottom: 0;
  font-size: 26px;
  color: #e99214;
}

/* #visit-pointcard .text-box .text2 {} */

#visit-pointcard .text-box hr {
  border-top: 1px solid #888;
}

#visit-pointcard ul {
  max-width: 1000px;
  margin: 15px auto 35px;
  line-height: 1.7;
  text-align: left;
}

/* #visit-pointcard li {} */

#visit-notes ul {
  max-width: 90%;
  margin: 0 auto;
  text-align: left;
}

#visit-notes li {
  display: inline-block;
}

#visit-notes .notes2 {
  max-width: 90%;
  margin: 0 auto;
  text-align: left;
}

#visit-notes .notes2 ul {
  max-width: 100%;
}

#visit-notes .notes2 ul li {
  margin-bottom: 10px;
}

/* ---------------------------------------------------------------
  sub-page about
  --------------------------------------------------------------- */
#about-seibun p {
  margin-bottom: 50px;
  line-height: 2;
}

#about-seibun dl {
  padding: 20px 30px;
  margin-bottom: 70px;
  font-size: 18px;
  line-height: 1.8;
  text-align: left;
  background: #fff;
  border: 1px solid #333;
}

#about-seibun dt,
#about-seibun dd {
  display: inline-block;
}

#about-seibun dt {
  width: 80px;
}

#about-seibun dd {
  width: calc(100% - 80px);
}

#about-yokuso p.info-text {
  margin-bottom: 40px;
  line-height: 2;
}

#about-yokuso .slide {
  position: relative;
}

#about-yokuso .text-box {
  padding: 10px 0 15px;
  margin-bottom: 40px;
  color: #fff;
  background: #333;
}

#about-yokuso .text-box h4 {
  margin-bottom: 15px;
  font-size: 26px;
}

#about-yokuso .text-box p {
  padding: 0 15px;
  margin: 0 auto 5px;
  line-height: 2;
}

/* #about-yokuso .sub-slide .text-box p {} */

#about-yokuso ul {
  max-width: 90%;
  margin: 0 auto 100px;
  text-align: left;
}

#about-yokuso li {
  display: inline-block;
}

#about-syodoku .inner {
  padding-bottom: 30px;
  line-height: 2;
  color: #fff;
  background: #333;
}

#about-syodoku .syodoku-img {
  width: 100%;
  max-width: 1200px;
  margin-bottom: 30px;
}

#about-syodoku ul {
  padding: 20px 30px;
  margin: 0 15px 40px;
  margin-bottom: 40px;
  font-size: 18px;
  line-height: 1.8;
  color: #333;
  text-align: left;
  background: #fff;
  border: 1px solid #333;
}

#about-syodoku li {
  position: relative;
  padding-left: 15px;
}

#about-syodoku li::before {
  position: absolute;
  top: 12px;
  left: 0;
  display: inline-block;
  width: 5px;
  height: 5px;
  content: "";
  background: #333;
  border-radius: 50%;
}

#about-syodoku li.info-title {
  padding-left: 0;
  margin-bottom: 10px;
  font-weight: bold;
}

#about-syodoku li.info-title::before {
  content: none;
}

#about-syodoku a:hover {
  color: #c9955a;
  text-decoration: underline;
  opacity: 1;
}

/* -- youtube -- */
.mv-sec {
  margin-bottom: 60px;
}

#sub-about .mv-sec h2 {
  margin: 0;
  margin-bottom: 3px;
  font-size: 25px;
  line-height: 1.4;
}

/* .mv-sec .inner {} */

.mv-sec .inner .if-wrap {
  position: relative;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.mv-sec .inner .if-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ---------------------------------------------------------------
  sub-page facilities
  --------------------------------------------------------------- */
#faci-map p {
  margin-bottom: 60px;
  line-height: 2;
}

#faci-map img {
  width: 100%;
  max-width: 900px;
  margin: 0 auto 100px;
}

#faci-aosagi h3,
#faci-shop h3,
#faci-kannai h3,
#faci-beer .inner h3,
#faci-others h3 {
  font-weight: bold;
}

#faci-terrace h2,
#faci-aosagi h2,
#faci-shop h2,
#faci-beer h2 {
  margin-bottom: 0;
}

#faci-terrace .slide img,
#faci-aosagi .slide img,
#faci-shop .slide img {
  /* aspect-ratio: 5/2;
  object-fit: cover; */
  max-width: 100%;
}

#faci-terrace .slide,
#faci-aosagi .slide,
#faci-shop .slide {
  position: relative;
  margin: 0 -15px 40px;
}

#faci-terrace p {
  margin-bottom: 30px;
  line-height: 2;
  word-wrap: break-word;
}

#faci-terrace a {
  display: block;
  margin-bottom: 100px;
  transition: 0.3s ease-in-out;
}

#faci-terrace a:hover {
  opacity: 1;
  transform: scale(0.98);
}

#faci-aosagi .inner,
#faci-shop .inner,
#faci-kannai .inner,
#faci-beer .inner,
#faci-others .inner {
  max-width: 85%;
  margin-bottom: 70px;
}

#faci-aosagi .img-box img,
#faci-shop .img-box img,
#faci-beer .img-box img,
#faci-others .img-box img {
  display: block;
  width: 100%;
  max-width: 510px;
  height: auto;
  margin-left: auto;
}

#faci-aosagi .text-box,
#faci-shop .text-box,
#faci-beer .text-box,
#faci-others .text-box {
  padding-left: 40px;
  text-align: left;
}

#faci-aosagi .text-box .info-text,
#faci-kannai .info-text,
#faci-shop .text-box .info-text,
#faci-beer .text-box .info-text,
#faci-others .text-box .info-text {
  margin-bottom: 20px;
  line-height: 1.7;
}

#faci-aosagi .text-box .hour-text,
#faci-shop .text-box .hour-text,
#faci-beer .text-box .hour-text {
  max-width: 460px;
  padding: 3px 0;
  font-size: 20px;
  text-align: center;
  border: 1px solid #333;
}

#faci-aosagi .text-box .hour-text {
  max-width: 280px;
  padding: 7px 10px;
  text-align: left;
}

#faci-others .text-box .faci-text {
  max-width: 485px;
  padding: 10px;
  font-size: 18px;
  line-height: 1.7;
  text-align: left;
  border: 1px solid #333;
}

#faci-others .text-box .faci-text span {
  display: block;
  font-weight: bold;
}

#faci-aosagi .text-box .use-text,
#faci-shop .text-box .use-text {
  margin-top: 15px;
  font-size: 18px;
  font-weight: bold;
  color: #e60012;
}

#faci-aosagi .food-box {
  position: relative;
  padding: 0;
}

#faci-aosagi .food-box img {
  width: 100%;
  max-width: 1600px;
}

#faci-aosagi .food-box span {
  position: absolute;
  right: 10px;
  bottom: 5px;
  padding: 4px 5px 4px 10px;
  font-size: 14px;
  color: #fff;
  background: #333;
}

#faci-aosagi .food-box span span {
  position: static;
  color: #e60012;
}

#faci-aosagi .renew {
  display: block;
  margin: 20px 0 30px;
  font-weight: 700;
}

#faci-aosagi .btnLink {
  display: inline-block;
  width: 300px;
  padding: 0.9em 1em 0.7em;
  margin-top: 1em;
  font-size: 110%;
  color: #fff;
  text-align: center;
  background: #333;
}

#faci-aosagi .renew img {
  width: 100px;
  vertical-align: -35px;
}

#faci-shop .info-text {
  margin-bottom: 70px;
  line-height: 2;
}

#faci-kannai h2 {
  margin-bottom: 70px;
}

#faci-kannai .inner {
  margin-bottom: 70px;
}

#faci-kannai .row {
  text-align: left;
}

#faci-kannai img {
  width: 100%;
  margin-bottom: 20px;
}

/* #faci-kannai h3 {} */

/* #faci-kannai .info-text {} */

#faci-beer {
  /*
	margin: 0 -15px 0 -15px;
*/
}

#faci-beer h2 {
  margin-bottom: 0;
}

#faci-beer .soon-box {
  position: relative;
  padding: 70px 0;
  margin: 0 -15px 50px;
  margin-bottom: 50px;
  color: #fff;
  background: url("../images/facilities/beer_bg.jpg") center top/cover no-repeat;
}

#faci-beer .soon-box img.logo {
  display: block;
  width: 100%;
  max-width: 400px;
  margin: 0 auto 60px;
}

#faci-beer .soon-box img.text {
  display: block;
  width: 100%;
  max-width: 400px;
  margin: 80px auto 60px;
}

#faci-beer .soon-box .soon {
  font-size: 65px;
}

#faci-beer .soon-box h3 {
  font-size: 55px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

#faci-beer .beer-mv-box {
  padding: 40px 0;
  background-position: center -30px;
}

#faci-beer .beer-mv-box img.logo {
  margin: 0 auto;
}

#faci-beer .beer-mv-box img.text {
  margin: 50px auto 30px;
}

#faci-beer .info-text {
  line-height: 2;
}

#faci-others .inner {
  margin-bottom: 0;
}

/* ---------------------------------------------------------------
  sub-page stay
  --------------------------------------------------------------- */
#stay-info p {
  margin-bottom: 40px;
  line-height: 2;
}

#stay-info img {
  width: 100%;
  max-width: 420px;
  margin: 0 auto 60px;
  margin-bottom: 58px;
}

#stay-nihoniro .slide {
  position: relative;
  margin: 0 -15px 30px;
}

#stay-nihoniro .info-text {
  margin-bottom: 30px;
  line-height: 2;
}

#stay-nihoniro .btn-border a {
  display: inline-block;
  padding: 5px 25px;
  font-size: 18px;
  color: #fff;
  background: #e61c24;
}

#stay-nihoniro .btn-border a:hover {
  opacity: 0.7;
}

#stay-nihoniro .btn-border a i {
  color: #e61c24;
}

/* ---------------------------------------------------------------
  sub-page access
  --------------------------------------------------------------- */
#access-map {
  max-width: 1024px;
  margin: 0 auto 30px;
}

#access-car .access-map-box {
  width: 100%;
  max-width: 570px;
  padding: 25px;
  margin: 0 auto 10px;
  border: 1px solid #333;
}

#access-car .access-map-box.left-box {
  display: inline-block;
  width: 50%;
  margin-top: 10px;
  vertical-align: top;
}

#access-car .access-img-box {
  display: inline-block;
  width: 50%;
  max-width: 785px;
  margin-top: 10px;
  margin-bottom: 15px;
}

#access-car .access-img-box .img-box {
  position: relative;
  display: inline-block;
  width: 49%;
  padding: 0 10px;
}

#access-car .access-img-box .img-box p {
  position: absolute;
  right: 0;
  bottom: 10px;
  left: 0;
  display: block;
  width: calc(100% - 40px);
  padding: 5px 0;
  margin: 0 auto;
  background: rgb(255 255 255 / 80%);
}

/* #access-car .access-img-box .img-box img {} */

#access-car .access-img-box .img-box.img-bottom {
  width: calc(100% - 12px);
  max-height: 313px;
  margin-top: 15px;
  overflow: hidden;
}

#access-car .access-img-box .img-box.img-bottom p {
  max-width: 500px;
}

#access-car img {
  /*
	width: 100%;
	max-width: 570px;
	margin: 0 auto 10px auto;
	border: 1px solid #333;
*/
}

/*
#access-bus h3{
	letter-spacing: 0.05em;
}

#access-bus h3 span{
	margin-top: 15px;
	display: block;
	font-size: 22px;
}
*/

#access-train img {
  width: 100%;
  max-width: 800px;
  margin-bottom: 60px;
}

#access-train .picturebox {
  display: flex;
  justify-content: center;
  max-width: 1170px;
  margin: 15px auto;
}

#access-train .picturebox figure {
  width: 47%;
  margin: 0 1.5%;
  background-color: #ccc;
}

#access-train .picturebox figure img {
  max-width: 100%;
  margin-bottom: 0;
}

#access-train .picturebox figure figcaption {
  margin: 5px 0;
  font-size: 18px;
  text-align: center;
}

#access-train p.link {
  margin-bottom: 60px;
  font-size: 18px;
}

/* #access-train .cycle-stand .img-box {} */

#access-train .cycle-stand .img-box img {
  display: block;
  width: 100%;
  max-width: 510px;
  margin-left: auto;
}

#access-train .cycle-stand .text-box {
  padding-left: 40px;
  text-align: left;
}

#access-train .cycle-stand .text-box h3 {
  font-size: 22px;
  font-weight: bold;
}

#access-train .cycle-stand .text-box .info-text {
  margin-bottom: 20px;
  line-height: 1.7;
}

#access-train .cycle-stand .text-box .faci-text {
  display: block;
  max-width: 485px;
  padding: 10px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.7;
  text-align: left;
  border: 1px solid #333;
}

#access-bus .bus-box {
  max-width: 1200px;
  margin: 0 auto 30px;
}

#access-bus .bus-box .title1 {
  padding-left: 15px;
  margin-bottom: 15px;
  font-size: 26px;
  font-weight: bold;
  text-align: left;
}

#access-bus .bus-box .title1 span {
  padding-left: 15px;
  font-size: 18px;
  font-weight: normal;
  vertical-align: 3px;
}

#access-bus .bus-box .title2 {
  padding: 15px 0 15px 15px;
  font-size: 22px;
  font-weight: bold;
  text-align: left;
  border-top: 1px solid #888;
  border-bottom: 1px solid #888;
}

#access-bus .bus-box .title2 span {
  padding-left: 20px;
}

#access-bus .bus-box dl {
  padding: 10px 0;
  margin: 0;
  font-size: 0;
  text-align: left;
}

#access-bus .bus-box dt,
#access-bus .bus-box dd {
  display: inline-block;
  font-size: 18px;
}

#access-bus .bus-box dt {
  padding-left: 15px;
}

#access-bus .bus-box dd {
  padding-left: 20px;
}

#access-gmap h2 {
  padding: 20px 0;
  margin-bottom: 0;
  line-height: 2;
}

#access-gmap .gmap {
  height: 500px;
  margin: 0 -15px;
}

#access-gmap .excite-box {
  padding: 80px 0;
  margin: 0 -15px;
  font-size: 28px;
  color: #fff;
  text-align: center;
  background: #333;
}

#access-gmap .excite-box span i {
  width: auto;
  height: auto;
  padding-left: 5px;
  margin-right: 25px;
  font-size: 34px;
  color: #fff;
  vertical-align: -2px;
  background: none;
  border-radius: inherit;
}

#access-gmap .excite-box a {
  color: #fff;
}

#access-gmap .excite-box a img {
  max-width: 160px;
}

#access-gmap .excite-box a.url-text {
  margin-left: 25px;
}

/* ---------------------------------------------------------------
  sub-page news
  --------------------------------------------------------------- */

/* #sub-news {} */

#sub-news .info-img {
  max-width: 600px;
  margin: 30px auto 70px;
}

#sub-news .info-img img {
  width: 100%;
}

#sub-news ul {
  max-width: 1200px;
  margin: 0 auto;
}

#sub-news li {
  padding: 15px 0;
  font-size: 0;
  border-bottom: 1px solid #888;
}

#sub-news a {
  color: #333;
}

#sub-news .left-img {
  display: inline-block;
  width: 150px;
  height: 150px;
  vertical-align: top;
  background: #333;
}

#sub-news .left-img img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}

#sub-news .right-box {
  display: inline-block;
  width: calc(100% - 151px);
  padding-left: 15px;
  text-align: left;
}

#sub-news .right-box a:hover {
  opacity: 0.7;
}

#sub-news .right-box h3 {
  margin-top: 10px;
  font-size: 24px;
}

#sub-news .right-box .date {
  display: inline;
  padding: 0 10px;
  font-size: 18px;
  border-right: 2px solid #888;
  border-left: 2px solid #888;
}

#sub-news .page-navi {
  margin: 30px auto 0;
  text-align: left;
}

#sub-news .page-navi li {
  display: inline-block;
  width: 60px;
  height: 60px;
  padding: 0;
  margin-right: 10px;
  margin-bottom: 10px;
  font-size: 36px;
  line-height: 58px;
  color: #333;
  text-align: center;
  border: 2px solid #333;
}

@media (max-width: 991px) {
  #sub-news .page-navi li {
    width: 30px;
    height: 30px;
    margin-right: 5px;
    margin-bottom: 5px;
    font-size: 16px;
    line-height: 27px;
  }
}

#sub-news .page-navi li a {
  display: block;
}

#sub-news .page-navi li.active,
#sub-news .page-navi li a:hover {
  color: #fff;
  background: #333;
}

/* ---------------------------------------------------------------
  sub-page news detail
  --------------------------------------------------------------- */

/* #sub-newsdetail {} */

#sub-newsdetail .inner {
  max-width: 1200px;
  padding: 15px 0 60px;
  margin: 0 auto;
}

#sub-newsdetail article {
  padding: 20px;
  margin-bottom: 20px;
  background: rgb(255 255 255 / 80%);
}

#sub-newsdetail h2 {
  padding: 0;
  margin: 0 0 15px;
  color: #333;
  background: none;
}

#sub-newsdetail .date {
  display: inline-block;
  padding: 0 10px;
  margin-bottom: 30px;
  font-size: 20px;
  border-right: 2px solid #888;
  border-left: 2px solid #888;
}

#sub-newsdetail .text {
  margin-bottom: 30px;
  line-height: 2;
}

#sub-newsdetail img {
  max-width: 100%;
}

/* ---------------------------------------------------------------
  sub-page about
  --------------------------------------------------------------- */
#sub-measures {
  max-width: 1200px;
  padding: 30px 15px;
  margin: 0 auto 100px;
  line-height: 1.7;
  background: rgb(255 255 255 / 70%);
}

#sub-measures p {
  margin-bottom: 20px;
}

#sub-measures h3 {
  margin-bottom: 10px;
  font-size: 22px;
}

#sub-measures ul {
  margin-bottom: 30px;
}

#sub-measures li {
  margin-bottom: 5px;
  list-style: inside;
}

#sub-measures li img {
  display: block;
  width: 50%;
  max-width: 600px;
  margin: 10px 0 25px;
}

/* ---------------------------------------------------------------
  sub-page faq
  --------------------------------------------------------------- */
#faq-info {
  margin-bottom: 20px;
  font-size: 18px;
  line-height: 2;
  text-align: center;
}

/* #faq-info p {} */

#sub-faq {
  margin-bottom: 60px;
}

#sub-faq .qa-inner {
  padding: 20px 20px 15px 30px;
  background: rgb(255 255 255 / 80%);
  border: 1px solid #333;
}

/* #sub-faq .qa-inner .qa-box {} */

#sub-faq .qa-inner .qa-box article {
  margin-bottom: 30px;
}

#sub-faq .qa-inner .qa-box article h4 {
  font-weight: 700;
}

#sub-faq .qa-inner .qa-box article h4 .switchHat {
  padding-bottom: 3px;
  border-bottom: 1px dotted #888;
}

#sub-faq .qa-inner .qa-box article h4 .switchHat:hover {
  border-bottom: 1px solid #888;
}

#sub-faq .qa-inner .qa-box article .answer {
  position: relative;
  padding: 10px 25px 0 10px;
  margin: 20px 15px 0 20px;
  color: #fff;
  background: #666;
  border-radius: 5px;
}

/* #sub-faq .qa-inner .qa-box article .answer .a-box {} */

/* #sub-faq .qa-inner .qa-box article .answer .a-txt {} */

#sub-faq .qa-inner .qa-box article .answer .a-txt .closeBtnHat {
  position: absolute;
  top: 5px;
  right: 10px;
  text-align: right;
}

#sub-faq .qa-inner .qa-box article .answer .a-txt .closeBtnHat span {
  font-size: 22px;
  font-weight: 700;
}

/* ---------------------------------------------------------------
  sub-page food（アオサギ食堂）
  - 色と余白は #sub-food のカスタムプロパティにまとめている
  - 品数が変わっても崩れないよう、行番号や個数を前提にした指定はしない
  --------------------------------------------------------------- */
#sub-food {
  --food-ink: #1c1c1c;
  --food-text: #222;
  --food-sub: #595959;
  --food-line: #dcdcdc;
  --food-leader: #8c8c8c;
  --food-accent: #ffe100;
  --food-red: #d7000f;
  --food-gap: 28px;
  --food-shadow: 0 4px 24px rgb(0 0 0 / 12%);
  --food-num: bahnschrift, "DIN Alternate", "Helvetica Neue", arial, sans-serif;
}

/* 最後の枠の影が切れないよう、下の余白 100px のうち 40px を内側に取る */
.sub-page #sub-food {
  padding-bottom: 40px;
  margin-bottom: 60px;
}

/* 日本語を文節の切れ目で折り返す（対応ブラウザのみ。非対応でも通常の折り返しになるだけ） */
#sub-food h2,
#sub-food h3,
#sub-food h4,
#sub-food p,
#sub-food dd,
#sub-food .name,
#sub-food .small {
  word-break: auto-phrase;
  overflow-wrap: anywhere;
}

/* -- food: mv（写真の上の白い見出しを読みやすくする、下端の影） -- */
#food-mv::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 55%;
  content: "";
  background: linear-gradient(to top, rgb(0 0 0 / 72%), rgb(0 0 0 / 0%));
}

#food-mv h1 {
  z-index: 1;
  text-shadow: 0 2px 12px rgb(0 0 0 / 60%);
}

/* -- food: 導入（ロゴの看板＋案内） -- */
#sub-food #food-intro {
  margin-bottom: 72px;
}

#sub-food #food-intro .inner {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  text-align: left;
  background: #fff;
  box-shadow: var(--food-shadow);
}

/* ロゴ画像の地色（#005f8d）を枠いっぱいに広げて看板のように見せる */
#sub-food #food-intro .img-box {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  background: #005f8d;
}

/* clip-path は、画像の縁に残っている書き出し時の淡い線（約1px）を隠すため */
#sub-food #food-intro .img-box img {
  display: block;
  width: 100%;
  max-width: 420px;
  height: auto;
  clip-path: inset(2px);
}

#sub-food #food-intro .text-box {
  padding: 44px 48px;
}

#sub-food #food-intro h2 {
  padding: 0;
  margin: 0 0 18px;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.5;
  color: var(--food-text);
  letter-spacing: 0.1em;
  background: none;
}

#sub-food #food-intro .info-text {
  margin: 0 0 22px;
  font-size: 15px;
  line-height: 1.9;
}

#sub-food #food-intro .renew {
  display: block;
  margin-bottom: 4px;
  font-size: 16px;
  font-weight: bold;
}

#sub-food #food-intro .hour-text {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  align-items: baseline;
  padding: 14px 0;
  margin: 0 0 18px;
  border-top: 1px solid var(--food-ink);
  border-bottom: 1px solid var(--food-ink);
}

#sub-food #food-intro .hour-text dt {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.2em;
}

#sub-food #food-intro .hour-text dd {
  margin: 0;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

#sub-food #food-intro .use-text {
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.7;
  color: var(--food-red);
}

/* -- food: メニューの1ブロック（黒い見出し帯＋本体） -- */

/* 館内設備ページの「メニューはこちら」(#food-menu) から来たとき、先頭が固定ヘッダーに隠れないようにする */
#sub-food #food-menu {
  scroll-margin-top: 140px;
}

#sub-food .foodBlock {
  max-width: 1200px;
  margin: 0 auto;
  box-shadow: var(--food-shadow);
}

#sub-food .foodBlock + .foodBlock {
  margin-top: 72px;
}

#sub-food .menuTtl {
  padding: 22px 20px 20px;
  margin: 0;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  color: #fff;
  text-indent: 0.2em;
  letter-spacing: 0.2em;
  background: var(--food-ink);
}

#sub-food .menuTtl__en {
  display: block;
  margin-bottom: 6px;
  font-family: var(--food-num);
  font-size: 13px;
  line-height: 1.2;
  color: var(--food-accent);
  text-indent: 0.32em;
  letter-spacing: 0.32em;
}

#sub-food .foodWrap {
  background: #fff;
}

/* -- food: イベントメニュー（墨色の地に白い品書きカード） -- */
#sub-food .foodWrap.-event {
  background: var(--food-ink);
}

#sub-food .foodWrap.-event > picture,
#sub-food .foodWrap.-event > picture img {
  display: block;
  width: 100%;
  height: auto;
}

#sub-food .event-menu {
  padding: 0 40px 48px;
}

/* 小見出しは黄色の札にして、バナーの下端に少し重ねる（display: table は、札の幅を文字の長さに合わせるため） */
#sub-food .event-menu > h3 {
  position: relative;
  z-index: 0;
  display: table;
  max-width: calc(100% - 24px);
  padding: 11px 40px;
  margin: -26px auto 40px;
  font-size: 22px;
  font-weight: bold;
  line-height: 1.4;
  color: #111;
  text-align: center;
  letter-spacing: 0.1em;
}

#sub-food .event-menu > h3::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: var(--food-accent);
  border: 3px solid #111;
  transform: skewX(-12deg);
}

/* 1行に3品。行の最後に余った品は横に伸びて行を埋める */
#sub-food .event-menu-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--food-gap);
  padding: 0;
  margin: 0;
  list-style: none;
}

/* カードの中は「写真｜本文」。カードの幅が 560px 以上あるときだけ横並びになり、狭いときは写真が上に来る */
#sub-food .event-menu-item {
  display: grid;
  flex: 1 1 calc((100% - var(--food-gap) * 2) / 3 - 1px);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  align-content: start;
  min-width: 0;
  color: var(--food-text);
  text-align: left;
  background: #fff;
}

#sub-food .event-menu-item .img picture {
  display: block;
  height: 100%;
}

#sub-food .event-menu-item .img img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 33 / 20;
  object-fit: cover;
}

/* align-self は、写真と横並びになったときに本文を写真の高さの中央へ寄せるため */
#sub-food .event-menu-item .body {
  align-self: center;
  min-width: 0;
  padding: 18px 20px 22px;
}

/* 品名と価格は1行に並べ、入りきらないときは価格だけ次の行の右端へ送る */
#sub-food .event-menu-item .txt {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 16px;
  align-items: baseline;
  justify-content: space-between;
}

#sub-food .event-menu-item .txt + .txt {
  margin-top: 10px;
}

#sub-food .event-menu-item .txt .name {
  min-width: 0;
  margin: 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.45;
  letter-spacing: 0.04em;
}

#sub-food .event-menu-item .txt .price {
  flex: none;
  margin: 0 0 0 auto;
  font-family: var(--food-num);
  font-size: 22px;
  font-weight: bold;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
  white-space: nowrap;
}

#sub-food .event-menu-item .priceList {
  padding: 8px 0 0;
  margin: 14px 0 0;
  list-style: none;
  border-top: 1px solid var(--food-line);
}

/* 価格表の1行＝「名称｜点線と価格」。価格の列は必ず確保され、長い名称は名称の列の中で折り返す。
   補足（.small）は次の行に全幅で入る */
#sub-food .priceList__item,
#sub-food .menuList__item {
  display: grid;
  grid-template-columns: minmax(0, max-content) 1fr;
  align-items: baseline;
  line-height: 1.6;
}

#sub-food .priceList__item {
  padding: 5px 0;
  font-size: 15px;
}

#sub-food .priceList__item .price,
#sub-food .menuList__item .price {
  display: flex;
  align-items: baseline;
  font-family: var(--food-num);
  font-size: 17px;
  font-weight: bold;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* 名称と価格を結ぶ点線（飾り。文字は入れない） */
#sub-food .priceList__item .price::before,
#sub-food .menuList__item .price::before {
  flex: 1 1 auto;
  min-width: 12px;
  margin: 0 10px;
  content: "";
  border-bottom: 2px dotted var(--food-leader);
}

#sub-food .priceList__item .small,
#sub-food .menuList__item .small {
  grid-column: 1 / -1;
  font-size: 13px;
  color: var(--food-sub);
}

#sub-food .priceList__item .name .small,
#sub-food .menuList__item .name .small {
  display: block;
}

/* 横長の枠（.-wide）: 1行を占める。左に大きな写真、右に .group（品名＋価格表）を縦に並べる */
#sub-food .event-menu-item.-wide {
  flex-basis: 100%;
  grid-template-columns: minmax(0, 1fr) calc((100% - var(--food-gap) * 2) / 3);
}

#sub-food .event-menu-item.-wide .body {
  display: flex;
  flex-direction: column;
  gap: 20px 32px;
  justify-content: center;
  padding: 24px;
}

#sub-food .event-menu-item.-wide .group {
  min-width: 0;
}

/* -- food: 定番メニュー・テイクアウト（白い品書き） -- */
#sub-food .foodWrap.-regular {
  padding: 8px 56px 16px;
  text-align: left;
}

/* 左に区分名、右に品書き2列 */
#sub-food .regularMenu {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 0 24px;
  align-items: start;
  padding: 36px 0;
}

#sub-food .regularMenu + .regularMenu {
  border-top: 1px solid var(--food-line);
}

#sub-food .regularMenu > h3 {
  padding: 0 0 0 14px;
  margin: 4px 0 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  color: var(--food-text);
  letter-spacing: 0.1em;
  border-left: 5px solid var(--food-ink);
}

#sub-food .regularMenu > .menu {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 56px;
}

#sub-food .regularMenu .menuList {
  min-width: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

/* 品数が少なく ul が1本だけのとき（テイクアウト）は、その1本の中身を2列に流す */
#sub-food .regularMenu .menuList:only-child {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-column: 1 / -1;
  gap: 0 56px;
}

#sub-food .menuList__item {
  padding: 7px 0;
}

/* -- food: 注意書き（最後のブロックの白い面の下に、細い線で区切って置く） -- */
#sub-food .noteWrap {
  padding: 0 56px 26px;
  text-align: left;
  background: #fff;
}

#sub-food .noteWrap .note {
  padding-left: 1em;
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  text-indent: -1em;
}

#sub-food .noteWrap .note:first-child {
  padding-top: 18px;
  border-top: 1px solid var(--food-line);
}

/* -- food: SMALL PC・TABLET（イベントは1行に2品） -- */
@media (max-width: 1199px) {
  #sub-food {
    --food-gap: 24px;
  }

  #sub-food .event-menu {
    padding-right: 32px;
    padding-left: 32px;
  }

  #sub-food .event-menu-item {
    flex-basis: calc((100% - var(--food-gap)) / 2 - 1px);
  }

  /* 横長の枠は写真を上に置き、.group を横に並べる */
  #sub-food .event-menu-item.-wide {
    grid-template-columns: minmax(0, 1fr);
  }

  #sub-food .event-menu-item.-wide .img img {
    aspect-ratio: 5 / 2;
  }

  #sub-food .event-menu-item.-wide .body {
    flex-flow: row wrap;
    justify-content: flex-start;
  }

  #sub-food .event-menu-item.-wide .group {
    flex: 1 1 280px;
  }

  /* .group で囲んでいない要素は横に並べず、1行ずつ使う */
  #sub-food .event-menu-item.-wide .body > :not(.group) {
    flex-basis: 100%;
  }

  #sub-food .foodWrap.-regular {
    padding-right: 40px;
    padding-left: 40px;
  }

  #sub-food .regularMenu > .menu,
  #sub-food .regularMenu .menuList:only-child {
    gap: 0 40px;
  }

  #sub-food .noteWrap {
    padding-right: 40px;
    padding-left: 40px;
  }
}

/* -- food: TABLET（定番の区分名を品書きの上に置く） -- */
@media (max-width: 991px) {
  #sub-food #food-intro .inner {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  }

  #sub-food #food-intro .text-box {
    padding: 36px 32px;
  }

  #sub-food .regularMenu {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px 0;
    padding: 30px 0;
  }

  #sub-food .regularMenu > h3 {
    margin-top: 0;
  }
}

/* -- food: MOBILE -- */
@media (max-width: 768px) {
  #sub-food {
    --food-gap: 20px;
  }

  #sub-food #food-menu {
    scroll-margin-top: 80px;
  }

  #sub-food #food-intro {
    margin-bottom: 48px;
  }

  #sub-food #food-intro .inner {
    grid-template-columns: minmax(0, 1fr);
  }

  #sub-food #food-intro .img-box {
    padding: 20px;
  }

  #sub-food #food-intro .text-box {
    padding: 24px 20px 28px;
  }

  #sub-food #food-intro h2 {
    margin-bottom: 14px;
    font-size: 19px;
    letter-spacing: 0.06em;
  }

  #sub-food #food-intro .hour-text dd {
    font-size: 18px;
  }

  #sub-food .foodBlock + .foodBlock {
    margin-top: 48px;
  }

  #sub-food .menuTtl {
    padding: 16px 12px 14px;
    font-size: 21px;
    text-indent: 0.14em;
    letter-spacing: 0.14em;
  }

  #sub-food .menuTtl__en {
    font-size: 11px;
  }

  #sub-food .event-menu {
    padding: 0 16px 28px;
  }

  #sub-food .event-menu > h3 {
    padding: 9px 18px;
    margin: -20px auto 26px;
    font-size: clamp(15px, 4.6vw, 17px);
    letter-spacing: 0.04em;
  }

  #sub-food .event-menu > h3::before {
    border-width: 2px;
  }

  /* イベントは1行に1品（幅に余裕があれば写真と本文が横に並ぶ） */
  #sub-food .event-menu-item {
    flex-basis: 100%;
  }

  #sub-food .event-menu-item .body {
    padding: 16px 16px 20px;
  }

  #sub-food .event-menu-item .txt .name {
    font-size: 18px;
  }

  #sub-food .event-menu-item .txt .price {
    font-size: 20px;
  }

  #sub-food .event-menu-item.-wide .body {
    padding: 18px 16px 20px;
  }

  /* 狭い画面では点線の前後を詰めて、名称に幅を回す */
  #sub-food .priceList__item .price::before,
  #sub-food .menuList__item .price::before {
    min-width: 8px;
    margin: 0 6px;
  }

  #sub-food .foodWrap.-regular {
    padding: 4px 20px 8px;
  }

  #sub-food .regularMenu {
    padding: 24px 0;
  }

  #sub-food .regularMenu > h3 {
    font-size: 18px;
  }

  #sub-food .regularMenu > .menu,
  #sub-food .regularMenu .menuList:only-child {
    grid-template-columns: minmax(0, 1fr);
  }

  #sub-food .noteWrap {
    padding: 0 20px 20px;
  }

  #sub-food .noteWrap .note:first-child {
    padding-top: 16px;
  }
}

/* -- food: 狭い MOBILE（横長の枠の写真を通常の比率に戻す） -- */
@media (max-width: 599px) {
  #sub-food .event-menu-item.-wide .img img {
    aspect-ratio: 33 / 20;
  }
}

/* -- food: 「視差効果を減らす」設定のときは、フェードを使わず最初から表示する -- */
@media (prefers-reduced-motion: reduce) {
  body.food .animated {
    opacity: 1;
    animation: none;
  }
}

#sub-beauty {
  text-align: center;
}

#sub-beauty > #white-back {
  width: calc(100vw * 7 / 8);

  /* 外幅7/8,内幅5/8なのでpaddingは片方1/8 */
  padding: 0 calc(100vw / 8) 2rem;
  margin: 0 auto;
  background-color: white;
  background-image: url("/shared/images/beauty/trimmed_wave_gradient_8bit.png");
  background-repeat: no-repeat;
  background-position-y: 25%;
  background-size: contain;
}

@media (max-width: 1920px) {
  #sub-beauty > #white-back {
    width: 1680px;

    /* 37 / 40 */
    max-width: calc(100vw * 37 / 40);
  }
}

@media (max-width: 543px) {
  #sub-beauty > #white-back {
    padding-right: calc(100vw / 32);
    padding-left: calc(100vw / 32);
  }
}

#sub-beauty img {
  width: 100%;
  height: auto;
}

#sub-beauty > div#white-back > header.subpage-mv {
  width: 100vw;
  margin: 0 calc(50% - 50vw) 30px;
  background-image: url("/shared/images/beauty/美活女子.png");
  background-repeat: no-repeat;
  background-position-y: top;
  background-size: contain;
}

#sub-beauty #header-image > img {
  width: 50vw;

  /* margin: 25em auto 0;
  * 美活女子画像が1920:805 ≒ 100vw:42vw。タイトル画像が788:455≒ 50vw:28.8vw
  * 上から42vw下げた後29vwの1/3持ち上げるので42 - 9.6 = 32.4
  margin: 27.5vw auto 0; */
  margin: calc(100vw * 805 / 1920 - 50vw * 455 / 788 / 3) auto 0;
}

@media (max-width: 600px) {
  #sub-beauty > div#white-back > header.subpage-mv {
    background-image: url("/shared/images/beauty/美活女子_600.png");
  }

  #sub-beauty #header-image > img {
    width: 75vw;
    margin: calc(100vw * 455 / 600 - 75vw * 455 / 788 / 3) auto 0;
  }
}

#sub-beauty #white-back > section {
  min-width: calc(100% * 7 / 8);
}

#sub-beauty #white-back > section > strong {
  display: block;
}

#sub-beauty .flex-container {
  display: flex;
  flex-wrap: wrap;
}

#sub-beauty header.pink-dot {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  font-size: xx-large;
  white-space: nowrap;
}

#sub-beauty #beauty-navbar {
  flex-wrap: wrap;
  justify-content: center;
  padding: 1rem 0;
  font-size: small;
  background-color: #fff5f5;
}

#sub-beauty #beauty-navbar > *:not(:last-child) {
  border-right: 1px solid #a7162a;
}

#sub-beauty #beauty-navbar a {
  padding: 0.5em 2em;

  /* 原稿の色はee717fだが、lighthouseに掛けたところコントラスト不足 */
  color: #a7162a !important;
}

@media (max-width: 991px) {
  /*
  #sub-beauty #beauty-navbar {
    display: grid;
    grid-template: repeat(2, 1fr) / repeat(2, 1fr);
    grid-template-areas:
      "first-nav-link second-nav-link"
      "third-nav-link fourth-nav-link";
    gap: 0 0;
  }

  #sub-beauty #first-nav-link {
    grid-area: first-nav-link;
    border-bottom: 1px solid #a7162a;
  }

  #sub-beauty #second-nav-link {
    grid-area: second-nav-link;
    border-right: none !important;
    border-bottom: 1px solid #a7162a;
  }

  #sub-beauty #third-nav-link {
    grid-area: third-nav-link;
  }

  #sub-beauty #fourth-nav-link {
    grid-area: fourth-nav-link;
  }
*/
  #sub-beauty #beauty-navbar > * {
    justify-content: center;
  }

  #sub-beauty #beauty-navbar a {
    padding: 1em;
  }
}

#sub-beauty #beauty-navbar > * {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

#sub-beauty #white-back > section > header {
  margin: 60px 0;
  font-weight: bold;
}

#sub-beauty #white-back > section > header picture > img {
  width: 115px;
  max-width: 22.5%;
}

#sub-beauty .gradient-background {
  height: 1.4em;
  font-size: large;
  color: white;
  background: repeating-linear-gradient(-45deg, #f8b9b6, #f8b9b6 2px, #fff 0, #fff 9px);
}

#sub-beauty .gradient-background > .beauty-badge {
  display: inline-block;
  padding: 1em;
  margin-top: -1em;
  background-image: url("/shared/images/beauty/badge.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-clip: border-box;
  background-size: contain;
}

#sub-beauty .yellow-shadow {
  display: inline-block;
  max-width: 75%;
  padding: 42px 0;
  font-size: 3em;
  font-size: x-large;
  color: #fff186;
  text-shadow:
    1px 1px 0 #000,
    -1px 1px 0 #000,
    -1px -1px 0 #000,
    1px -1px 0 #000;
}

#sub-beauty strong {
  font-size: x-large;
  line-height: 1.6em;
  color: #e2273a;
  text-shadow:
    1px 1px 0 #fff,
    -1px 1px 0 #fff,
    -1px -1px 0 #fff,
    1px -1px 0 #fff;
}

@media (max-width: 991px) {
  #sub-beauty #men > header > strong,
  #sub-beauty #point > header > strong {
    font-size: large;
  }
}

#sub-beauty header.pink-dot,
#sub-beauty .white-space-no-wrap {
  word-break: keep-all;
  overflow-wrap: break-word;
}

#sub-beauty .pink-circle {
  /*
  ここのpaddingを操作するとなぜかiphone safariで楕円形になる。
  内のspanのmarginを操作する
  padding: 1rem;
  */
  display: inline-flex;
  align-items: center;
  aspect-ratio: 1 / 1;
  padding: 0.5em;
  font-size: x-small;
  color: white;
  text-align: center;
  white-space: nowrap;
  background-image: url("/shared/images/beauty/pink-circle.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-clip: border-box;
  background-size: contain;
}

#sub-beauty #wash-body {
  padding-bottom: 60px;
}

#sub-beauty #wash-body-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  padding: 2em 0;
}

#sub-beauty #wash-body-text {
  flex-basis: 100%;
}

#sub-beauty #wash-body-text > strong,
#sub-beauty #after-care > strong {
  padding: 20px 0;
}

#sub-beauty #wash-body-text > div,
#sub-beauty #after-care > div {
  padding-top: 20px;
  padding-bottom: 54px;
}

#sub-beauty #pink-circle-container {
  flex-basis: 100%;
}

#sub-beauty #pink-circle-container > .pink-circle {
  max-width: 100%;
  margin: auto;
}

@media (max-width: 991px) {
  #sub-beauty #wash-body-grid {
    display: grid;
    grid-template-rows: auto 3fr repeat(2, 1fr) 3fr;
    grid-template-columns: 3fr repeat(2, 1fr) 3fr;
    grid-auto-flow: row;
    gap: 1em 1em;
    padding: 2em 0;
  }

  #sub-beauty #wash-body-text {
    grid-area: 1 / 1 / 2 / 5;
  }

  #sub-beauty #pink-circle-container {
    display: flex;
    grid-area: 3 / 2 / 5 / 4;
    align-items: center;
    justify-content: center;
  }

  #sub-beauty #first-shower-head-container {
    grid-area: 2 / 1 / 4 / 3;
  }

  #sub-beauty #second-shower-head-container {
    grid-area: 2 / 3 / 4 / 5;
  }

  #sub-beauty #third-shower-head-container {
    grid-area: 4 / 1 / 6 / 3;
  }

  #sub-beauty #fourth-shower-head-container {
    grid-area: 4 / 3 / 6 / 5;
  }
}

#sub-beauty .shower-head {
  margin: auto;
}

#sub-beauty .shower-head figcaption {
  color: #e2273a;
  text-shadow:
    1px 1px 0 #fff,
    -1px 1px 0 #fff,
    -1px -1px 0 #fff,
    1px -1px 0 #fff;
}

@media (max-width: 991px) {
  #sub-beauty figure.shower-head {
    position: relative;
  }

  #sub-beauty .shower-head figcaption {
    position: absolute;
    right: 0;
    bottom: 1em;
    left: 0;
    margin: 0 auto;
    font-size: small;
    color: #fff;
    text-shadow:
      1px 1px 0 #e2273a,
      -1px 1px 0 #e2273a,
      -1px -1px 0 #e2273a,
      1px -1px 0 #e2273a;
  }
}

#sub-beauty #sequence {
  justify-content: space-evenly;
}

#sub-beauty #patterns + div > section,
#sub-beauty #hydration-nutrition > .flex-container > section,
#sub-beauty #men > .flex-container > *,
#sub-beauty #sequence > section {
  flex-basis: 50%;
  padding-right: 10px;
  padding-bottom: 2rem;
  padding-left: 10px;
  text-align: left;
}

@media (max-width: 543px) {
  #sub-beauty #sequence > section {
    flex-basis: 100%;
  }
}

#sub-beauty #sequence > section > figure {
  margin-right: -10px;
  margin-left: -10px;
}

#sub-beauty #sequence > section > header {
  font-size: x-large;
  font-weight: bold;
  text-align: center;
}

#sub-beauty #patterns {
  padding: 2rem 0 4rem;
}

#sub-beauty #bathing-patterns .down-arrow {
  display: none;
}

@media (max-width: 991px) {
  #sub-beauty #bathing-patterns {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  #sub-beauty #bathing-patterns > * {
    display: block;
    flex-basis: 48%;
  }

  #sub-beauty #bathing-patterns .right-arrow {
    display: none;
  }

  #sub-beauty #bathing-patterns .down-arrow {
    display: block;
    width: 3em;
    margin: 0.5em auto;
  }
}

#sub-beauty .bathing-pattern {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}

#sub-beauty .bathing-pattern div {
  /* flex-basis: 15% */
  white-space: nowrap;
}

#sub-beauty .bathing-pattern span {
  white-space: nowrap;
}

#sub-beauty .bathing-pattern svg {
  flex-basis: 4%;
  padding: 0 0.5em;
}

#sub-beauty .steam {
  padding: 1.25rem;
  background-image: url("/shared/images/beauty/steam.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

#sub-beauty .side-by-side > * {
  display: flex;
  align-items: center;
  text-align: left;
}

@media (max-width: 991px) {
  #sub-beauty .side-by-side > * {
    display: block;
  }
}

#sub-beauty .side-by-side > section > div > header {
  padding: 0.5rem 0;
}

#sub-beauty .side-by-side > *:nth-child(even) {
  flex-direction: row-reverse;
}

#sub-beauty .side-by-side > * > figure {
  flex-basis: 33%;
}

#sub-beauty .side-by-side > * > div {
  flex-basis: 66%;
}

#sub-beauty .side-by-side figure {
  position: relative;
}

#sub-beauty .side-by-side figcaption {
  position: absolute;
  bottom: 0.5em;
  left: 5%;

  /*
  ここのpaddingを操作するとなぜかiphone safariで楕円形になる。
  内のspanのmarginを操作する
  padding: 1rem;
  */
  display: inline-flex;
  align-items: center;
  aspect-ratio: 1 / 1;
  padding: 1em;
  color: white;
  text-align: center;
  background-image: url("/shared/images/beauty/brown-circle.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-clip: border-box;
  background-size: contain;
}

#sub-beauty #dryers {
  justify-content: space-evenly;
}

#sub-beauty #dryers > figure {
  min-width: 22.5%;
  max-width: 45%;
}

#sub-beauty #dryers figcaption {
  color: #e2273a;
  text-shadow:
    1px 1px 0 #fff,
    -1px 1px 0 #fff,
    -1px -1px 0 #fff,
    1px -1px 0 #fff;
}

#sub-beauty #hydration-nutrition .flex-container {
  /* 下の男性美活と横幅ラインを合わせる */
  justify-content: space-between;
}

#sub-beauty .left {
  text-align: left;
}

#sub-beauty #hydration-nutrition .flex-container header {
  font-size: x-large;
  font-weight: bold;
}

/* スムージーとフォーの画像はどちらも500pxない */
@media (max-width: 543px) {
  #sub-beauty #hydration-nutrition .flex-container > section {
    flex-basis: 100%;
  }
}

#sub-beauty #men > .flex-container {
  flex-wrap: nowrap;
  justify-content: space-between;
}

@media (max-width: 991px) {
  #sub-beauty #men > .flex-container {
    display: block;
  }
}

/* #sub-beauty #men .flex-container > figure {
flex-basis: 33%;
padding: 1rem;
} */

#sub-beauty #men .flex-container > * {
  flex-basis: 48%;
}

#sub-beauty #men .flex-container > * > figure {
  padding-bottom: 2rem;
}

@media (max-width: 991px) {
  #sub-beauty #point > header,
  #sub-beauty #men > header {
    margin: 30px 0 !important;
  }

  #sub-beauty #men .flex-container > * {
    flex-basis: 50% !important;
  }

  #sub-beauty #point > .flex-container {
    display: block;
  }

  #sub-beauty #point > .flex-container > figure {
    width: 50%;
    margin: 0 auto;
  }
}

#sub-beauty #point .flex-container > figure {
  flex-basis: calc(100% / 7);
}

#sub-beauty #point .flex-container > div {
  flex-basis: calc(600% / 7);
}

#sub-beauty header.pink-dot > strong {
  z-index: 3;
  background-color: white;
}

#sub-beauty header.pink-dot::before,
#sub-beauty header.pink-dot::after {
  position: relative;
  z-index: 2;
  display: block;
  width: 50%;
  height: 1em;
  margin-top: 1em;
  font-size: medium;
  content: "";
  background: url("/shared/images/beauty/dot.svg") repeat-x;
  background-size: contain;
}

#sub-beauty #patterns header.pink-dot::before,
#sub-beauty #patterns header.pink-dot::after,
#sub-beauty #point header.pink-dot::before,
#sub-beauty #point header.pink-dot::after {
  margin-top: 3.3em;
}

#sub-beauty div.pink-dot {
  display: block;
  height: 16px;
  background-image: url("/shared/images/beauty/dot.svg");
  background-repeat: repeat-x;
  background-size: contain;
}

#sub-beauty #pink-back {
  padding: 0.5em;
  color: white;

  /* background-color: #f88490; */

  /* lighthouseにかけた所、コントラスト不足 */
  background-color: #b10712;
}

#sub-beauty .pink {
  /* color: #f88490; */

  /* color: #ea5263; */
  color: #e2273a;
  text-shadow:
    1px 1px 0 #fff,
    -1px 1px 0 #fff,
    -1px -1px 0 #fff,
    1px -1px 0 #fff;
}

/* ---------------------------------------------------------------
  responsive
  ---------------------------------------------------------------
   bootstrap
   lg 1200px -
   md 992px - 1199px
   sm 768px -  991px
   xs - 767px
 ---------------------------------------------------------------- */

/* -- middle PC -- */
@media (max-width: 1599px) {
  /* -- section top-links -- */
  section#top-links .links-box {
    padding: 80px 10px 40px;
    margin: 0 1% 60px;
  }

  section#top-links .box5 {
    padding: 80px 10px 40px;

    /* padding: 0; */
    margin: 0 1% 60px;
  }

  section#top-links .box6 ul.btn-inline li {
    margin: 0 auto 15px !important;
  }

  section#top-links .box6 ul.btn-inline li a {
    padding: 14px 10px 10px;
    font-size: 14px;
    letter-spacing: -0.5px;
  }

  section#top-links .box6 ul.btn-inline li a i.fa-calendar {
    font-size: 30px;
  }

  section#top-links .box6 ul.btn-inline li:nth-child(2) a {
    padding: 10px 10px 7px;
  }

  section#top-links h4 {
    font-size: 28px;
    letter-spacing: 0.05em;
  }

  section#top-links .box1 table {
    width: 100%;
  }

  section#top-links .box3 p,
  section#top-links .box4 p {
    width: 95%;
  }

  section#top-links .box7 {
    padding: 0;
  }
}

/* -- SMALL PC -- */
@media (max-width: 1199px) {
  /* -- header -- */
  #header ul {
    padding: 30px 0 0;
  }

  #header .top-logo {
    /* width: 170px; */

    /* padding: 0 15px; */
  }

  #header li {
    /* width: 11%; */

    /* margin-top: 20px; */
    font-size: 15px;
  }

  #header li:nth-child(2) {
    /* width: 16%; */
  }

  #header li:nth-child(5) {
    /* width: 13%; */
  }

  /* header scroll */
  #header nav.scrolldown li.top-logo {
    /* padding: 0 30px; */
  }

  #header nav.scrolldown li {
    /* margin-top: 35px; */
  }

  /* -- section top-beerterrace -- */
  section#top-beerterrace a::before {
    height: 0;
  }

  /* -- section top-links -- */
  section#top-links .links-box {
    width: 100%;
  }

  section#top-links .box5 img {
    margin: 0 auto;
  }

  section#top-links .box6 p {
    text-align: left;
  }

  section#top-links .box6 p br {
    display: none;
  }

  section#top-links .box7 img {
    margin: 0 auto;
  }

  #point-start a {
    font-size: 28px;
  }

  #point-start a span {
    font-size: 22px;
  }

  /* -- footer -- */
  #footer .logo-box .img-minato {
    max-width: 250px;
  }

  #faci-beer .soon-box .soon {
    bottom: 25%;
    font-size: 40px;
  }

  #faci-beer .soon-box h3 {
    font-size: 30px;
  }

  /* top modal */
  .top-modal-event .modal-dialog {
    max-width: 90%;
    height: 90%;
  }

  /* .top-modal-event .modal-content {} */

  .top-modal-event .modal-body {
    height: calc(100% - 70px);
  }

  /* .top-modal-event .modal-body object {} */

  /* -- access -- */
  #access-car .access-map-box.left-box {
    display: block;
    width: 100%;
    margin-bottom: 20px;
  }

  #access-car .access-img-box {
    width: 100%;
  }

  /* #access-car .access-img-box .img-box {} */

  /* #access-car .access-img-box .img-box.img-bottom p {} */
}

/* -- TABLET -- */
@media (max-width: 991px) {
  .modaal-inner-wrapper .modaal-container {
    max-width: 100% !important;
  }

  /* header */
  #header .gnav-words {
    top: 1px;
    right: 0;
    font-size: 11px;
  }

  #footer .logo-box .img-minato {
    display: block;
    margin: 0 auto 20px;
  }

  section#top-info01 h3 {
    line-height: 1.7;
  }

  section#top-info01 h3 br {
    display: block;
  }

  /* -- section top-news -- */
  section#top-news h3 {
    font-size: 20px;
  }

  /* section#top-news p {} */

  /* -- subpage visit -- */
  #visit-price .price-main-box {
    font-size: 20px;
  }

  #visit-price .row.mr0 {
    margin-right: -15px !important;
  }

  #visit-price .price-set-box {
    font-size: 18px;
  }

  #visit-price .price-option {
    display: block;
    width: calc(100% - 30px);
    margin: 0 15px;
  }

  #access-car h3 br.none {
    display: block;
  }

  #access-train h3 br.none {
    display: block;
  }

  #top-fixed-banner-series > * {
    /* .top-fixed-ban { */
    zoom: 0.7;
  }

  #top-fixed-banner-series > *:nth-last-child(1) {
    /* .top-fixed-ban.work { */
    top: calc(75% + 220px);
  }

  #top-fixed-banner-series > *:nth-last-child(2) {
    /* .top-fixed-ban.event { */
    top: calc(75% + 110px);
  }

  #top-fixed-banner-series > *:nth-last-child(3) {
    /* .top-fixed-ban.third-banner { */
    top: 75%;
  }

  #top-fixed-banner-series > *:nth-last-child(4) {
    /* .top-fixed-ban.fourth-banner { */
    top: calc(75% - 110px);
  }
}

/* -- MOBILE -- */
@media (max-width: 768px) {
  .disp-pc {
    display: none;
  }

  .disp-sp {
    display: block;
  }

  .sp-br {
    display: block;
  }

  .sp-img-100per {
    max-width: 100% !important;
  }

  #header .navbar-toggle {
    display: block;
    padding: 0;
    margin: 5px 0 0;
    color: #fff;
  }

  #header #ulNav {
    display: none;
  }

  /* #header #ulNav li {} */

  #header #ulNav.collapse.in {
    position: fixed;
    display: block;
    width: 100%;
    padding: 0;
    margin: 64px -15px 0;
    background: rgb(0 0 0 / 70%);
  }

  #header #ulNav.collapse.in > .nav-group {
    border: none;
  }

  #header #ulNav .nav-group > ul {
    display: block;
  }

  #header #ulNav.collapse.in li {
    width: 100%;
    margin: 0;
    border: none;
    border-top: 1px solid #ccc;
  }

  #header #ulNav.collapse.in li a {
    padding: 10px 0;
    opacity: 1;
  }

  #header #ulNav.collapse.in li.active {
    background: rgb(0 0 0 / 30%);
  }

  #header li.active a::before,
  #header li a:hover::before,
  #header li a.active::before {
    display: none;
  }

  #header #ulNav.collapse.in .top-logo {
    display: none;
  }

  #header a.sp-logo {
    position: fixed;
    top: 7px;
    display: block;
    width: 60px;
  }

  #header a.sp-logo img {
    width: 100%;
  }

  #header .gnav-words {
    top: 10px;
    right: 0;
    left: 15px;
    max-width: 215px;
    margin: 0 auto;
    text-align: left;
  }

  #top-fixed-banner-series > * {
    top: inherit !important;
    bottom: 5px;
    max-width: 60px;
    height: auto;
    margin: 0;
  }

  #top-fixed-banner-series > *:hover {
    right: 15px;
  }

  #top-fixed-banner-series > * a img {
    width: 100%;
    height: auto;
  }

  #top-fixed-banner-series > *:nth-child(1) {
    left: 10px !important;
  }

  #top-fixed-banner-series > *:nth-child(2) {
    left: 80px !important;
  }

  #top-fixed-banner-series > *:nth-child(3) {
    left: 150px !important;
  }

  #top-fixed-banner-series > *:nth-child(4) {
    left: 220px !important;
  }

  /*
	#top-mv::after{
		height: calc(100% - 196px)!important;
	}

	section#top-mv .news-box{
		position:relative;
	}

*/

  section#top-mv {
    margin-top: 0;
  }

  section#top-mv .swiper-container {
    background: #000;
  }

  section#top-mv .swiper-wrapper {
    padding-top: 35px;
  }

  section#top-mv .news-box .inner {
    max-width: 600px;
    padding: 15px 15px 5px;
  }

  section#top-mv .news-box dt {
    display: block;
    margin-right: 0;
    margin-bottom: 10px;
  }

  section#top-mv .news-box dd {
    display: block;
  }

  section#top-mv .news-box dd li {
    font-size: 14px;
  }

  section#top-mv .news-box dd li span {
    display: block;
  }

  section#top-mv .news-box .first a {
    padding: 4px 3px 2px;
    margin-left: 0;
    font-size: 17px;
    text-align: center;
  }

  /*
	#top-mv .slide .swiper-slide{

	}

	#top-mv .slide .swiper-slide img{
		animation: none;
		max-width:130%;
		width:130%;
	}

	section#top-mv h2{
		font-size: 20px;
		bottom: auto;
		top: 50px;
	}
*/

  .measures-notes {
    margin-bottom: 15px;
    text-align: center;
  }

  .measures-notes a {
    font-size: 16px;
  }

  /* -- section top-events -- */
  section#top-events {
    padding: 40px 0 0;
  }

  section#top-events .img-pc {
    display: none;
  }

  section#top-events .img-sp {
    display: block;
  }

  /* -- section top-info01 -- */
  section#top-info01 {
    padding-top: 15px;
  }

  section#top-info01 h3 {
    font-size: 20px;
    text-align: left;
  }

  section#top-info01 p {
    line-height: 1.7;
    text-align: left;
  }

  section#top-info01 p br {
    display: none;
  }

  section#top-info01 .slide img {
    /*
		width: 200%;
		max-width: 200%;
*/
  }

  /* -- section top-notes -- */
  section#top-notes {
    padding: 0;
    line-height: 1.7;
    text-align: left;
  }

  section#top-notes h3 {
    font-size: 16px;
  }

  section#top-notes .white-box {
    width: 100%;
    padding: 15px 10px;
    margin: 0 0 15px;
    font-size: 16px;
  }

  section#top-notes .white-box .title {
    font-size: 18px;
  }

  section#top-notes .white-box p {
    font-size: 14px;
    text-align: left;
  }

  section#top-notes .white-box td {
    text-align: center;
  }

  /* top-camp01 / 02 / 03 -- */
  section#top-camp2020-1 {
    padding: 40px 0 0;
  }

  section#top-camp2020-1 .camp-title {
    font-size: 18px;
  }

  section#top-camp2020-1 .camp-title span {
    height: 37px;
    padding-top: 13px;
    margin-right: 3px;
    background-size: 26px;
  }

  section#top-camp2020-1 .camp-text {
    padding-left: 15px;
    font-size: 15px;
  }

  section#top-camp2020-1 .camp-text span {
    display: block;
    max-width: fit-content;
    padding: 2px 1px 1px 8px;
    margin-bottom: 3px;
    margin-left: -8px;
    font-size: 13px;
  }

  section#top-camp2020-2 {
    padding: 30px 15px;
  }

  section#top-camp2020-2 .text01 {
    font-size: 16px;
  }

  section#top-camp2020-2 table {
    font-size: 14px;
  }

  section#top-camp2020-2 table th span {
    display: block;
    font-size: 11px;
  }

  section#top-camp2020-2 .text02 {
    font-size: 14px;
  }

  /* section#top-camp2020-3 {} */

  section#top-camp2020-3::before {
    top: 0;
    height: 80px;
    background-size: 330px;
  }

  section#top-camp2020-3 .text01 {
    margin-bottom: 3px;
    font-size: 18px;
  }

  section#top-camp2020-3 .text01 span {
    font-size: 30px;
  }

  section#top-camp2020-3 .text02 {
    font-size: 14px;
  }

  /* top-news */
  section#top-news {
    text-align: left;
  }

  section#top-news p {
    margin: 15px 0;
    font-size: 20px;
    text-align: center;
  }

  section#top-news h3 {
    margin: 0 0 15px !important;
    font-size: 18px;
    line-height: 1.7;
  }

  /* -- top beerterrace -- */
  section#top-beerterrace {
    margin-top: 0;
  }

  /* -- section top-links -- */
  section#top-links .links-box {
    padding: 40px 0;
    margin: 0 0 30px;
  }

  section#top-links .bg {
    width: 95%;
  }

  section#top-links h4 {
    font-size: 18px;
    letter-spacing: 0.05em;
  }

  section#top-links .box1 p {
    font-size: 18px;
  }

  section#top-links .box1 .size_small {
    font-size: 14px !important;
  }

  section#top-links .box1 p br.none {
    display: block;
  }

  section#top-links .box2 p br,
  section#top-links .box4 p br {
    display: none;
  }

  section#top-links .box2 ul {
    width: 100%;
  }

  section#top-links .box2 p,
  section#top-links .box3 p,
  section#top-links .box4 p {
    width: 100%;
    text-align: left;
  }

  section#top-links .box4 .stay-img {
    width: 100%;
  }

  section#top-links .box5 .img-pc {
    display: none;
  }

  section#top-links .box5 .img-sp {
    display: block;
  }

  section#top-links .box7 .img-pc {
    display: none;
  }

  section#top-links .box7 .img-sp {
    display: block;
  }

  section#top-links .box6 ul.btn-inline li a {
    padding: 7px 19px 8px;
  }

  section#top-links .btn-border a span {
    vertical-align: 5px;
  }

  #point-start a {
    font-size: 20px;
  }

  #point-start a br {
    display: block;
  }

  #point-start a span {
    font-size: 16px;
  }

  /* -- section top-access -- */
  section#top-access h4 {
    margin-bottom: 30px;
    font-size: 22px;
    line-height: 1.4;
    letter-spacing: 0.05em;
  }

  section#top-access .size_big {
    font-size: 16px;
  }

  section#top-access .btn-border a {
    font-size: 16px;
  }

  section#top-access .inquiry {
    font-size: 18px;
    font-weight: bold;
  }

  section#top-access a.taxi-ban img {
    max-width: 100%;
  }

  /* -- footer -- */
  footer#footer {
    padding: 20px 0;
  }

  #footer .inquiry {
    font-size: 20px;
  }

  #footer .inquiry a {
    color: #fff;
    border-bottom: 1px solid #fff;
  }

  #footer .logo-box .img-minato {
    display: block;
    margin: 0 auto 30px;
  }

  #footer .logo-box span {
    margin-left: 0;
    font-size: 14px;
    vertical-align: 0;
  }

  #footer .logo-box span.none {
    display: block;
    margin-bottom: 10px;
  }

  /* #footer .insta-box a {} */

  /* #footer .insta-box a i {} */

  #footer .insta-box a img {
    width: 80%;
  }

  /* #go_pagetop {} */

  #go_pagetop a {
    width: 42px;
    padding: 10px 0;
  }

  /* -- campaign -- */
  .camp-box1 {
    bottom: 0;
    width: 100%;
    height: auto;
    border: none;
    border-top: 1px solid #fff;
  }

  .camp-box1 .arrow {
    top: -41px;
    left: 9px;
    transform: rotate(90deg);
  }

  .camp-box1 .close {
    top: -36px;
    right: auto;
    left: 0;
    width: 35px;
    height: 35px;
    padding: 0;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
  }

  .camp-box1 img.pc-disp {
    display: none;
  }

  .camp-box1 img.sp-disp {
    display: block;
    max-width: 375px;
    margin: 0 auto;
  }

  /* -- excite box -- */
  .footer-excite-box {
    padding: 10px 0;
    font-size: 20px;
  }

  .footer-excite-box span {
    display: block;
    margin-bottom: 15px;
  }

  .footer-excite-box span i {
    display: none;
  }

  .footer-excite-box a img {
    display: block;
    max-width: 130px;
    margin: 0 auto 15px;
  }

  .footer-excite-box a.url-text {
    margin: 0;
  }

  /* -- top modal -- */
  .modaal-wrapper .modaal-container .modaal-content-container object {
    /*
		min-height: 100%;
*/
  }

  /* .modaal-wrapper .modaal-close {} */

  /* top modal */
  .top-modal-event .modal-dialog {
    height: 60%;
    margin: 5% auto 0;
  }

  /* .top-modal-event .modal-content {} */

  .top-modal-event .modal-body {
    overflow-y: scroll;
  }

  .top-modal-event .modal-body object {
    height: auto;
  }

  /* -- subpage -- */
  .subpage-mv {
    min-height: 300px;
  }

  .subpage-mv h1 {
    margin: 0 auto 15px;
    font-size: 26px;
  }

  .sub-page .sentence h2 {
    font-size: 20px;
  }

  .sub-page .sentence h3 {
    font-size: 18px;
    font-weight: bold;
    text-align: left;
  }

  .swiper-button-next,
  .swiper-button-prev {
    height: 22px !important;
    margin-top: -11px !important;
    background-size: 27px 22px !important;
  }

  /* -- subpage visit -- */
  #visit-price .hour-text {
    font-size: 16px;
  }

  #visit-price .notes-text {
    font-size: 14px;
    text-align: left;
  }

  #visit-price .price-main-box {
    font-size: 16px;
  }

  #visit-price .price-main-box td,
  #visit-price .price-set-box td {
    padding: 5px;
  }

  #visit-price .price-set-box td {
    font-size: 16px;
  }

  #visit-price .price-set-box td span {
    font-size: 14px;
  }

  #visit-price .price-set-box span.space-br {
    display: block;
    padding: 0;
  }

  #visit-price .price-option {
    padding: 5px 5px 0 10px;
    font-size: 16px;
  }

  #visit-price .price-option p {
    margin-bottom: 5px;
  }

  #visit-price .gray-box {
    padding: 10px;
    font-size: 18px;
    text-align: left;
  }

  #visit-price .option {
    text-align: left;
  }

  #visit-member .img-box {
    text-align: center;
  }

  #visit-member img {
    max-width: 400px;
  }

  #visit-member .text-box {
    max-width: 100%;
    font-size: 16px;
  }

  #visit-pointcard .start {
    width: 100%;
    padding: 5px;
    font-size: 22px;
  }

  #visit-pointcard p {
    text-align: left;
  }

  #visit-pointcard .text-box {
    width: 96%;
    margin: 0 2%;
  }

  #visit-pointcard .text-box .title1 {
    font-size: 20px;
  }

  #visit-pointcard .text-box .text1 {
    font-size: 18px;
  }

  #visit-pointcard .text-box .day-mon,
  #visit-pointcard .text-box .day-wed,
  #visit-pointcard .text-box .day-fri,
  #visit-pointcard .text-box .day-sat {
    font-size: 22px;
  }

  #visit-pointcard .text-box .text2 {
    font-size: 18px;
  }

  #visit-notes ul {
    max-width: 100%;
  }

  #visit-notes li {
    font-size: 16px;
  }

  #visit-notes .notes2 {
    max-width: 100%;
  }

  #about-seibun p {
    text-align: left;
  }

  #about-seibun dl {
    padding: 10px 15px;
  }

  #about-seibun dt,
  #about-seibun dd {
    display: block;
    width: 100%;
  }

  #about-seibun dd {
    margin-bottom: 10px;
  }

  #about-yokuso p.info-text {
    text-align: left;
  }

  #about-yokuso p.info-text br {
    display: none;
  }

  #about-yokuso .text-box h4 {
    margin-bottom: 10px;
    font-size: 20px;
  }

  #about-yokuso .text-box p {
    font-size: 14px;
    text-align: left;
  }

  #about-yokuso .text-box p br {
    display: none;
  }

  #faci-map p {
    text-align: left;
  }

  #faci-terrace .slide {
    overflow: hidden;
  }

  #faci-terrace .slide img {
    width: 150%;
    max-width: 150%;
  }

  #faci-terrace p {
    text-align: left;
  }

  #faci-terrace p br {
    display: none;
  }

  #faci-aosagi .inner,
  #faci-shop .inner,
  #faci-kannai .inner,
  #faci-beer .inner,
  #faci-others .inner {
    max-width: 90%;
  }

  #faci-aosagi .img-box img,
  #faci-shop .img-box img,
  #faci-beer .img-box img,
  #faci-others .img-box img {
    margin-right: auto;
  }

  #faci-aosagi .img-box,
  #faci-shop .img-box,
  #faci-beer .img-box,
  #faci-others .img-box {
    margin-bottom: 30px !important;
  }

  #faci-aosagi .text-box,
  #faci-shop .text-box,
  #faci-beer .text-box,
  #faci-others .text-box {
    padding: 0;
  }

  #faci-aosagi .text-box .info-text br,
  #faci-shop .text-box .info-text br,
  #faci-beer .text-box .info-text br,
  #faci-others .text-box .info-text br {
    display: none;
  }

  #faci-aosagi .text-box .hour-text,
  #faci-shop .text-box .hour-text,
  #faci-beer .text-box .hour-text,
  #faci-others .text-box .faci-text {
    font-size: 16px;
  }

  /*
	#faci-shop .slide{
		overflow:hidden;
	}

    #faci-shop .slide img {
      max-width:150%;
      width:150%;
    }


	#faci-shop .info-text{
		text-align:left;
	}
*/

  #faci-beer {
    margin: 0;
  }

  #faci-beer .soon-box {
    padding: 35px 0;
    margin: 0 -15px 30px;
  }

  #faci-beer .soon-box img.logo {
    max-width: 200px;
    margin: 0 auto 30px;
  }

  #faci-beer .soon-box img.text {
    max-width: 200px;
    margin: 0 auto 30px;
  }

  #faci-beer .soon-box .soon {
    bottom: 20%;
    font-size: 24px;
  }

  #faci-beer .soon-box h3 {
    bottom: 5%;
    font-size: 20px;
    text-align: center;
  }

  #faci-beer .info-text {
    text-align: left;
  }

  #faci-beer .info-text br {
    display: none;
  }

  #faci-aosagi .btnLink {
    width: 200px;
  }

  /* -- stay -- */
  #stay-info p {
    text-align: left;
  }

  #stay-info p br {
    display: none;
  }

  #stay-nihoniro .slide {
    overflow: hidden;
  }

  #stay-nihoniro .slide img {
    width: 150%;
    max-width: 150%;
  }

  #stay-nihoniro .info-text {
    text-align: left;
  }

  #stay-nihoniro .info-text br {
    display: none;
  }

  /* -- access -- */
  #access-car p {
    text-align: left;
  }

  #access-car .access-img-box .img-box {
    display: block;
    width: 100%;
    max-height: 313px;
    margin-bottom: 20px;
    overflow: hidden;
  }

  #access-car .access-img-box .img-box.img-bottom {
    width: 100%;
  }

  #access-car .access-img-box .img-box.img-bottom p {
    max-width: 100%;
  }

  /* #access-car .access-img-box .img-box img {} */

  #access-car .access-img-box p {
    text-align: center;
  }

  #access-train h3 br {
    display: none !important;
  }

  #access-bus h3 span {
    font-size: 16px;
  }

  #access-bus h3 br.none {
    display: block;
  }

  #access-bus .bus-box dt,
  #access-bus .bus-box dd {
    display: block;
    padding-left: 15px;
    font-size: 16px;
  }

  #access-bus .bus-box dt {
    margin-bottom: 5px;
  }

  #access-bus .bus-box .title2 {
    font-size: 18px;
  }

  #access-gmap h2 {
    font-size: 16px;
  }

  #access-gmap h2 span {
    display: none;
  }

  #access-gmap .excite-box {
    padding: 40px 0;
    font-size: 20px;
  }

  #access-gmap .excite-box span {
    display: block;
    margin-bottom: 15px;
  }

  #access-gmap .excite-box span i {
    display: none;
  }

  #access-gmap .excite-box a img {
    display: block;
    margin: 0 auto 15px;
  }

  #access-gmap .excite-box a.url-text {
    margin: 0;
  }

  /* #access-train img {} */

  /* #access-train .picturebox {} */

  /* #access-train .picturebox figure {} */

  /* #access-train .picturebox figure img {} */

  #access-train .picturebox figure figcaption {
    font-size: 14px;
  }

  #access-train p.link {
    font-size: 16px;
  }

  #access-train .cycle-stand .img-box {
    margin-bottom: 30px !important;
  }

  #access-train .cycle-stand .img-box img {
    margin: 0 auto;
  }

  #access-train .cycle-stand .text-box {
    padding: 0;
  }

  #access-train .cycle-stand .text-box h3 {
    margin-bottom: 5px !important;
    font-size: 18px;
  }

  /* #access-train .cycle-stand .text-box .info-text {} */

  #access-train .cycle-stand .text-box .faci-text {
    font-size: 14px;
  }

  /* -- news -- */
  #sub-news .left-img {
    width: 100px;
    height: 100px;
  }

  #sub-news .right-box {
    width: calc(100% - 101px);
  }

  #sub-news .right-box h3 {
    font-size: 18px;
    font-weight: normal;
  }

  #sub-news .right-box .date {
    font-size: 16px;
  }

  #sub-newsdetail .date {
    font-size: 18px;
  }

  #sub-newsdetail .text br.sp-none {
    display: none;
  }

  /* ---------------------------------------------------------------
	  sub-page measures
	  --------------------------------------------------------------- */
  .measures-mv h1 {
    font-size: 22px;
    letter-spacing: 0.05em;
  }

  #sub-measures {
    padding: 15px 0;
  }

  #sub-measures h3 {
    font-size: 18px;
    letter-spacing: 0.1em;
  }

  #sub-measures li img {
    width: 90%;
    margin: 10px auto 25px;
  }

  /* -- section event-yu -- */
  #top-event-yu ul {
    grid-template-columns: repeat(4, 25%);
  }

  #top-event-yu li.ttl {
    grid-column: 1 / 5;
  }

  #top-event-yu li.ttl img {
    max-width: 100%;
  }

  #top-event-yu li:last-child {
    grid-row: 5 / 6;
    grid-column: 3 / 5;
  }

  /* -- section sauna -- */
  #top-sauna dl {
    flex-wrap: wrap;
  }

  #top-sauna dt {
    flex-basis: 100%;
    padding: 50px 0 25px;
  }

  #top-sauna dd {
    flex: 100%;
    padding: 30px 15px;
  }
}

/* -- MOBILE min -- */

/* @media (width <= 543px) {} */
