@charset "UTF-8";

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: var(--white-color);
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  cursor: default;
  font-family: "kaisei-opti";
  font-weight: 400;
  font-size: calc((100 / var(--view-size)) * 16 * 1vw);
  background-color: #EBEBEB;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
  object-fit: cover;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
   scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* m-plus-rounded-1c-regular - japanese */
@font-face {
  font-family: 'kaisei-opti';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/kaisei-opti-v8-japanese-regular.woff2') format('woff2'),
       url("../fonts/kaisei-opti-v8-japanese-regular.woff") format("woff"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* m-plus-rounded-1c-500 - japanese */
@font-face {
  font-family: 'kaisei-opti';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/kaisei-opti-v8-japanese-500.woff2') format('woff2'),
       url("../fonts/kaisei-opti-v8-japanese-500.woff") format("woff"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@font-face {
	font-family: "kaisei-opti";
	font-style: normal;
	font-weight: 700;
	src: url("../fonts/kaisei-opti-v8-japanese-700.woff2") format("woff2"),
	     url("../fonts/kaisei-opti-v8-japanese-700.woff") format("woff");
}

/* :rootのCSS変数の宣言 */
:root {
  /* vies size PC */
  --view-size: 1440;
  --inner-size: 660;
  --inner-pad: 10;
  --common-inner-size: calc(var(--inner-size) / var(--view-size) * 100vw);
  --common-inner-pad: calc(var(--inner-pad) / var(--view-size) * 100vw);
}

@media (max-width: 670px) {
  :root {
    --view-size: 375;
    --inner-pad: 20;
  }
}

.map {
  height: calc((100 / var(--view-size)) * 330 * 1vw);
  width: calc(100% - ((100 / var(--view-size)) * 288 * 1vw));
  cursor: pointer;
  border-bottom: solid 2px #656565;
}
#popup {
    position: relative;
    display: inline-block;
    margin: calc((100 / var(--view-size)) * 24 * 1vw) 0;
    padding: calc((100 / var(--view-size)) * 7 * 1vw) calc((100 / var(--view-size)) * 10 * 1vw);
    min-width: calc((100 / var(--view-size)) * 120 * 1vw);
    max-width: 100%;
    color: #555;
    background: #FFF;
    border: solid calc((100 / var(--view-size)) * 3 * 1vw) #555;
    box-sizing: border-box;
}
#popup:before {
    content: "";
    position: absolute;
    bottom: calc((100 / var(--view-size)) * -24 * 1vw);
    left: 50%;
    margin-left: calc((100 / var(--view-size)) * -15 * 1vw);
    border: calc((100 / var(--view-size)) * 12 * 1vw) solid transparent;
    border-top: calc((100 / var(--view-size)) * 12 * 1vw) solid #FFF;
    z-index: 2;
}
#popup:after {
    content: "";
    position: absolute;
    bottom: calc((100 / var(--view-size)) * -30 * 1vw);
    left: 50%;
    margin-left: calc((100 / var(--view-size)) * -17 * 1vw);
    border: calc((100 / var(--view-size)) * 14 * 1vw) solid transparent;
    border-top: calc((100 / var(--view-size)) * 14 * 1vw) solid #555;
    z-index: 1;
}
.map-ff {
  width: calc((100 / var(--view-size)) * 300 * 1vw);
}
.map-ff .map_title {
  margin-top: calc((100 / var(--view-size)) * 12 * 1vw);
  font-weight: 700;
  color: #000;
}
.map-ff .map_text {
  margin-top: calc((100 / var(--view-size)) * 12 * 1vw);
  font-size: calc((100 / var(--view-size)) * 14 * 1vw);
  color: #000;
}
.map-ff .map_address {
  margin-top: calc((100 / var(--view-size)) * 14 * 1vw);
  font-size: calc((100 / var(--view-size)) * 12 * 1vw);
  color: #000;
}
#popup .wash img, #popup .wash .map_link {
  display: none;
}
#popup .spot .map_text, #popup .spot .map_address {
  display: none;
}
.map-ff .map_link {
  margin: calc((100 / var(--view-size)) * 8 * 1vw) 0;
  display: block;
  text-align: center;
}
.map-ff a {
  display: inline-block;
  border-radius: calc((100 / var(--view-size)) * 12 * 1vw);
  padding: calc((100 / var(--view-size)) * 4 * 1vw) calc((100 / var(--view-size)) * 8 * 1vw);
  border: solid 1px #000;
  font-weight: 700;
}
.map-ff a:hover {
  background-color: #000;
  color: #fff;
}
@media (max-width: 670px) {
  .map {
    width: 100%;
  }
  .map-ff {
    width: calc((100 / var(--view-size)) * 200 * 1vw);
  }
}

@keyframes rotation {
  0% { transform: rotateZ(0);}
  100% { transform: rotateZ(360deg); }
}

header {
  position: fixed;
  top: 0;
  right: 0;
  width: calc((100 / var(--view-size)) * 288 * 1vw);
  height: 100%;
  z-index: 9998;
  border-left: solid 2px #656565;
}
.header_title {
  display: none;
}
.header_logo_wrapper {
  border-bottom: solid 2px #656565;
}
.header_logo_img {
  position: relative;
  display: block;
  padding: calc((100 / var(--view-size)) * 41 * 1vw) calc((100 / var(--view-size)) * 60 * 1vw) calc((100 / var(--view-size)) * 41 * 1vw);
}
.header_logo_img:hover {
  background-color: #fff;
}
.header_logo_img img:nth-child(1) {
  width: 100%;
}
.header_logo_img img:nth-child(2) {
  position: absolute;
  top: calc((100 / var(--view-size)) * 25 * 1vw);
  left: calc((100 / var(--view-size)) * 44 * 1vw);
  animation: 14s linear infinite rotation;
  width: calc((100 / var(--view-size)) * 200 * 1vw);
  height: calc((100 / var(--view-size)) * 200 * 1vw);
}
.header_nav_wrapper li {
  border-bottom: solid 2px #656565;
}
.header_nav_wrapper li a {
  display: block;
  padding: calc((100 / var(--view-size)) * 15 * 1vw);
  font-size: calc((100 / var(--view-size)) * 32 * 1vw);
  font-weight: 700;
  text-align: center;
}
.header_nav_wrapper li a:hover {
  background-color: #fff;
}
.header_search_wrapper {
  margin-top: calc((100 / var(--view-size)) * 20 * 1vw);
  padding: 0 calc((100 / var(--view-size)) * 10 * 1vw);
}
.header_search_wrapper form {
  display: flex;
}
.header_search_wrapper input {
  padding: calc((100 / var(--view-size)) * 10 * 1vw);
  width: calc(100% - ((100 / var(--view-size)) * 60 * 1vw));
  border: solid 1px #fff;
  outline: none;
  border-radius: initial;
}
.header_search_wrapper button {
  width: calc((100 / var(--view-size)) * 60 * 1vw);
  border-radius: initial;
  background-color: #000;
  color: #fff;
  border: 1px solid #000;
}
@media (max-width: 670px) {
  header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: auto;
    border-left: none;
    border-bottom: solid 2px #656565;
    background-color: #EBEBEB;
    position: static;
  }
  .header_title {
    display: block;
    font-size: calc((100 / var(--view-size)) * 20 * 1vw);
    margin-left: calc((100 / var(--view-size)) * 15 * 1vw);
  }
  .header_logo_wrapper {
    border-bottom: none;
  }
  .header_logo_img {
    padding: calc((100 / var(--view-size)) * 10 * 1vw) calc((100 / var(--view-size)) * 6.666666667 * 1vw);
    width: calc((100 / var(--view-size)) * 83.33333 * 1vw);
    margin: 0 calc((100 / var(--view-size)) * 15 * 1vw) 0 auto;
  }
  .header_logo_img img:nth-child(1) {
    width: 100%;
  }
  .header_logo_img img:nth-child(2) {
    position: absolute;
    top: calc((100 / var(--view-size)) * 3 * 1vw);
    left: 0;
    width: calc((100 / var(--view-size)) * 83.33333 * 1vw);
    height: calc((100 / var(--view-size)) * 83.33333 * 1vw);
  }
  .header_nav_wrapper {
    display: none;
  }
  .header_search_wrapper {
    display: none;
  }
}

.common_head {
  width: calc(100% - ((100 / var(--view-size)) * 288 * 1vw));
  padding: calc((100 / var(--view-size)) * 12 * 1vw) calc((100 / var(--view-size)) * 60 * 1vw) calc((100 / var(--view-size)) * 16 * 1vw);
  border-bottom: solid 2px #656565;
}
.common_head_wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.common_head_title {
  font-size: calc((100 / var(--view-size)) * 20 * 1vw);
}
@media (max-width: 670px) {
  .common_head {
    display: none;
  }
}
.common_banner {
  display: none;
}
@media (max-width: 670px) {
  .common_banner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    width: calc((100 / var(--view-size)) * 60 * 1vw);
    height: calc((100 / var(--view-size)) * 60 * 1vw);
    bottom: calc((100 / var(--view-size)) * 90 * 1vw);
    right: calc((100 / var(--view-size)) * 10 * 1vw);
    z-index: 9998;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    border: solid 2px #656565;
  }
  .common_banner:nth-child(2) {
    bottom: calc((100 / var(--view-size)) * 20 * 1vw);
  }
  .common_banner_link {
    font-size: calc((100 / var(--view-size)) * 14 * 1vw);
  }
  .common_banner_link span {
    font-size: calc((100 / var(--view-size)) * 12 * 1vw);
  }
}

@keyframes slice {
  0% { transform:translateX(0); }
  100% { transform:translateX(-100%); }
}
.common_slider_wrap {
  padding-right: calc((100 / var(--view-size)) * 288 * 1vw);
}
.common_slider {
  display: flex;
  background-color: #fff;
  border-bottom: solid 2px #656565;
  align-items: center;
}
.common_slider_left {
  padding: calc((100 / var(--view-size)) * 12 * 1vw) calc((100 / var(--view-size)) * 15 * 1vw);
  border-right: solid 2px #656565;
  font-size: calc((100 / var(--view-size)) * 18 * 1vw);
}
.common_tag_wrap {
  overflow: hidden;
  white-space: nowrap;
  flex: 1;
}
.common_tag {
  white-space: nowrap;
  width: fit-content;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  display: flex;
}
.common_tag_slider {
  display: flex;
  animation: slice 14s linear infinite;
}
.common_tag_slider a {
  margin-left: calc((100 / var(--view-size)) * 14 * 1vw);
  font-size: calc((100 / var(--view-size)) * 18 * 1vw);
}
.common_tag_slider a:hover {
  opacity: .5;
}
@media (max-width: 670px) {
  .common_slider_wrap {
    padding-right: 0;
  }
  .common_slider_left {
    padding: calc((100 / var(--view-size)) * 10 * 1vw) calc((100 / var(--view-size)) * 13 * 1vw);
    font-size: calc((100 / var(--view-size)) * 16 * 1vw);
  }
  .common_tag_slider a {
    font-size: calc((100 / var(--view-size)) * 16 * 1vw);
  }
}

footer {
  padding: calc((100 / var(--view-size)) * 12 * 1vw) calc((100 / var(--view-size)) * 288 * 1vw) calc((100 / var(--view-size)) * 12 * 1vw) 0;
  text-align: center;
}
.footer_content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 calc((100 / var(--view-size))* 60* 1vw);
}
.footer_content_left {
	display: flex;
	align-items: center;
	column-gap: calc((100 / var(--view-size))* 30* 1vw);
}
.footer_content a {
	font-size: calc((100 / var(--view-size))* 14* 1vw);
}
.footer_content a:hover {
	opacity: .5;
}
@media (max-width: 670px) {
  footer {
    padding: calc((100 / var(--view-size)) * 12 * 1vw) 0 calc((100 / var(--view-size)) * 12 * 1vw);
  }
	.footer_content {
	display: block;
	text-align: center;
	padding: 0 calc((100 / var(--view-size))* 40* 1vw);
  }
	.footer_content_left {
	row-gap:  calc((100 / var(--view-size))* 14* 1vw);
		flex-wrap: wrap;
		justify-content: space-between;
}
	.footer_content_left a:first-child {
	width: 100%;
		text-align: center;
}
	.footer_content small {
		margin-top: calc((100 / var(--view-size))* 12* 1vw);
		display: block;
	}
}

.grecaptcha-badge { visibility: hidden; }
