:root {
  --headerHeight: 90px;
  --footerHeight: 86px;
  --adHeight: 100px;
  --gray: #484848;
  --lightGray: #808080;
  --lilPaleGray: #aaaaaa;
  --paleGray: #cccccc;
  --iconGray: #6b6b6b;
}

html {
  color: var(white);
  background-color: #ffffff;
  height: 100%;
  font-size: 13px;
  font-weight: 400;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif;
  font-feature-settings: "palt" 1;
}

a{
  color: #60b6ed;
  text-decoration: none;
}

@media screen and (max-width: 300px) {
  html {
    font-size: 12px;
  }
}
@media screen and (max-width: 270px) {
  html {
    font-size: 11px;
  }
}

img {
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

body {
  width: 100%;
  height: 100%;
  background-color: #e7e7e7;
  overflow: hidden;
  color: var(--gray);
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;/*スマホ横にしたときに勝手にズームされるのを防ぐ*/
}

.subPage{
  overflow:scroll;
}

.firstLoad{
  position: fixed;
  z-index: 100000;
  text-align: center;
  background-color: #FFFFFF;  border-radius: 15px;
  width: fit-content;
  height: fit-content;
  transition: all 0.3s ease-in-out;
  opacity: 100%;
  /* border: solid 4px #717171; */
  max-width: 500px;
  top: 40%;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 100%;
  display: flex;
  align-items: center;
  padding: 10px;
}

.firstLoad.hidden{
  opacity: 0%;
}

.firstLoadTxt{
  text-align: center;
  font-size: min(5vmin,13px);
  font-weight: bold;
  background-color: #FFFFFF;
  color: #717171;
  border-radius: 15px;
}

.firstLoad img{
  width: 25px;
  height: 25px;
  margin-left: 5px;
  opacity: 50%;
}

.headerFilter {
  width: 100%;
  height: var(--headerHeight);
  position: fixed;

}

.mapFilter {
  position: absolute;
  top: calc(var(--headerHeight));
  height: calc(100% - var(--headerHeight) - var(--footerHeight) + 5px);
  /* height: calc(100% - var(--headerHeight) - var(--footerHeight)); */
  width: 100%;
}

.footerFilter {
  width: 100%;
  height: var(--footerHeight);
  position: fixed;
  bottom:0;
}

.helpTxt {
  position: fixed;
  z-index: 100000;
  text-align: center;
  background-color: #ea5539;
  /* filter: drop-shadow(0px 0px 12px #ff5917); */
  border-radius: 15px;
  width: fit-content;
  /* border: solid 1px var(--gray); */
  height: fit-content;
  transition: all 0.3s ease-in-out;
  opacity:100%;
  border:solid 4px  #ea5539;
  margin: 0 20px;
  max-width: 500px;
  /* filter:drop-shadow(0px 0px 12px #1a1a1a); */
}

.helpTxt.hidden{
  opacity:0%;
}

.helpTxt:nth-of-type(1) {
  bottom: 80px;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
  padding: 0 20px;
  color: #FFFFFF;
  background-color: #ea5539;
}

.helpTxt:nth-of-type(1)>.helpTitle{
  text-align: center;
  font-size:min(8vmin,26px);
  font-weight: bold;
  background-color: #ea5539;
  color: #FFFFFF;
  border-radius:15px 15px 0 0;
  padding: 5px 10px 0px 10px;
}

.helpTxt:nth-of-type(1)>.helpDetail{
  padding: 0px 10px 8px 10px;
  font-size: min(5vmin,16px);
  background-color:  #ea5539;
}

.helpTxt:nth-of-type(2) {
  top: 80px;
  right: 10px;
  margin: auto;
  color: #FFFFFF;
  background-color: #ea5539;
  max-width: 250px;
}

.helpTxt:nth-of-type(2):after{
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 15px;
  top: -38px;
  margin: auto;
  border: solid;
  border-color: transparent transparent #ea5539 transparent;
  z-index: 999;
  border-width: 10px 15px 25px 15px;
}

.helpTxtAdd{
  position: fixed;
  z-index: 100000;
  /* filter: drop-shadow(0px 0px 12px #ff5917); */
  border-radius: 15px;
  width: fit-content;
  /* border: solid 1px var(--gray); */
  height: fit-content;
  transition: all 0.3s ease-in-out;
  opacity:100%;
  margin: 0 20px;
  max-width: 500px;
  /* filter:drop-shadow(0px 0px 12px #1a1a1a); */
  top: 230px;
  right: 10px;
  margin: auto;
  color: #FFFFFF;
  max-width: 250px;
  user-select:none;
}

.helpTxtAdd.hidden{
  opacity: 0;
}

.helpTxt:nth-of-type(3){
  top: calc(50% - -30px);
  left: 0;
  right: 0;
  margin: 0 auto;
  border-radius: 15px;
}

.helpTxt:nth-of-type(3) img{
  position: absolute;
  width: 100px;
  margin: auto;
  left: 0;
  top: -130px;
  right: 0;
}

.helpTxt:nth-of-type(3):after{
  /* content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 0;
  left: 0;
  margin: auto;
  bottom: -30px;
  border: solid;
  border-color: #FFFFFF transparent transparent transparent;
  z-index: 999;
  border-width: 20px 15px 10px 15px; */
}

.helpTxt:nth-of-type(3):before{
  /* content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 0;
  left: 0;
  margin: auto;
  bottom: -35px;
  border: solid;
  border-color: #717171 transparent transparent transparent;
  z-index: 999;
  border-width: 22px 18px 10px 18px; */
}

.helpTxt:nth-of-type(4){
  bottom: 230px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.helpTxt:nth-of-type(4):after{
  /* content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 0;
  left: 0;
  margin: auto;
  bottom: -30px;
  border: solid;
  border-color: #FFFFFF transparent transparent transparent;
  z-index: 999;
  border-width: 20px 15px 10px 15px; */
}

.helpTxt:nth-of-type(4):before{
  /* content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 0;
  left: 0;
  margin: auto;
  bottom: -35px;
  border: solid;
  border-color: #717171 transparent transparent transparent;
  z-index: 999;
  border-width: 22px 18px 10px 18px; */
}

.helpTxt:nth-of-type(4) img{
  position: absolute;
  width: 80px;
  margin: auto;
  left: 0;
  bottom: -95px;
  right: 0;
}

.helpTxt:nth-of-type(5){
  top: 80px;
  right: 30px;
  margin: 0 auto;
}

.helpTxt:nth-of-type(5):after{
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  right: 35px;
  top: -38px;
  margin: auto;
  border: solid;
  border-color: transparent transparent #ea5539 transparent;
  z-index: 999;
  border-width: 10px 15px 25px 15px;
}

@media screen and (max-width: 650px) {

  .helpTxt{
    max-width: 90%;
  }

  .helpTxt:nth-of-type(4){
    /* right: 17px; */
  }

  .helpTxt:nth-of-type(4):after{
    right: 50px;
  }
}


.helpTitle{
  text-align: center;
  /* font-size: 22px; */
  font-size:min(4.8vmin,26px);
  font-weight: bold;
  color: #FFFFFF;
  padding: 5px;
}

.helpDetail{
  text-align: center;
  background-color:  #ea5539;
  color: #FFFFFF;
  padding: 8px;
  border-radius: 10px;
  font-size: 16px;
}

.helpTxt span{
  font-weight: bold;
  font-size: min(5vmin,16px);
}

.termsPopup{
  position: absolute;
  z-index: 99999;
  /*height: calc(100svh - var(--headerHeight) - var(--footerHeight) - 20px);*/
  border-radius: 20px;
  max-width: 800px;
  width: 80%;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%) translateX(0);
	-webkit-transform: translateY(-50%) translateX(0);
  /*top: 94px;
  bottom: 0px;*/
  right: 0px;
  left: 0px;
  background-color: #FFFFFF;
  transition:0.3s;
}

#termsPopup,#termsBackground{
  display: none;
}
.termsPopupTit{
  background-color: #ea5539;
  text-align: center;
  padding: 10px 15px;
  font-size: 1.3rem;
  font-weight: bold;
  color: #fff;
  position: relative;
  border-radius: 20px 20px 0 0;
}
.termsPopupTit img{
  position: absolute;
  left: 16px;
  bottom: calc(100% - 10px);
  width: 34px;
}
.termsPopupTxt{  
  overflow-y:scroll;
  overflow-x:hidden;
  max-height: 78vh;
  padding: 20px;
  font-size: 1.1rem;
  line-height: 1.6;
}
.termsPopupTxt.enquete{  
  overflow-y:auto;
}
.termsPopupBtn{
  padding: 0px 15px 20px;
  text-align: center;
}
.termsPopupBtn span{
  background-color: #d75136;
  border-radius: 5px;
  color: #FFF;
  font-size: 1.3rem;
  cursor:pointer;
  padding: 15px 15px;
  display: inline-block;
  line-height: 1.2;
	font-weight: 700;
	border-bottom: 3px #ac3b25 solid;
	transition: .2s;
}
.termsPopupBtn span.off{
	background-color: #c8cbce;
	position: relative;
	pointer-events: none;
}
.termsPopupBtn span.off::before{
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateY(0%) translateX(-50%);
	-webkit-transform: translateY(0%) translateX(-50%);
	min-width: 13em;
	content: 'マップを読み込んでいます…';
	background: url(../img/loading.gif) no-repeat right top -2px / auto 16px;
	padding-right: 1.3em;
	color: #7b2b2b;
  font-size: 12px;
}
.termsPopupBtn span:hover{
  /*opacity: .7;*/
	transform: translateY(2px) translateX(0);
	-webkit-transform: translateY(2px) translateX(0);
	border-bottom: none;
}

@media screen and (min-width: 700px) {
  .termsPopup::-webkit-scrollbar{
    width: 5px;
    background-color: #aaaaaa00;
    border-radius:5px;
  }

  .termsPopup::-webkit-scrollbar-thumb {
    background-color: gray;
    border-radius:5px;
    width:5px;
  }
}

.termsPopup.hidden{
  opacity:0;
  pointer-events:none;
}

.termsPopup .siteInfo{
  background-color: #FFFFFF;
  width: 100%;
}

.termsPopup .siteTxt{
  padding:0px;
  width: 100%;
}

.termsPopupClose {
  height: 60px;
  width: 150px;
  position: absolute;
  z-index: 10004;
  background-color: #ea5539;
  bottom: 25px;
  left: 0;
  right: 0;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  font-size: 15px;
  margin: 0 auto;
  cursor:pointer;
  transition:0.3s;
}

.termsPopupClose.hidden {
  opacity:0;
  pointer-events:none;
}

.termsBackground{
  height: 100%;
  width: 100%;
  background-color: #000000;
  opacity: 50%;
  position: absolute;
  z-index: 10001;
  transition:0.3s;
}

.termsBackground.hidden{
  opacity:0;
  pointer-events:none;
}

.termsPopup .siteTxt{
  margin:0;
}


.termsPopup.enquetePopup{
  width: calc(100% - 30px);
}
#enqueteBackground{
  display: none;
	opacity: 1;
	background-color: rgba(0,0,0,.5);
}
#q0{ display: block;}

#enquetePopup_last,.enquet_q{
  display: none;
}
.enquet_q{
  width: 100%;
}
.enquet_q.enqslide{
	transition: .2s;
  transform: translateX(20px);
	opacity: 0;
}
.enquetePopupWrap{
	min-height: 50vh;
	width: 100%;
  display:-webkit-box;
	display:flex;
	align-items: center;
}
#enquetePopup_last{
  font-size: 1.2rem;
  width: 25em;
  max-width: calc(100% - 20px);
}

.termsPopupTxt.enquete p{
  margin-bottom: 10px;
  text-align: center;
	font-size: 1.2rem;
}
.termsPopupTxt.enquete p:last-of-type{
  margin-bottom: 0px;
}
.termsPopupTxt.enquete p span{
  display: inline-block;
}
.termsPopupTxt.enquete p.fs{
	font-size: 1rem;
	margin-bottom: 25px;
}

#infoPopup{
	display: none;
}
.infoPopupTxt{
	padding: 20px;
}
.infoPopupTxt dl{
	display:-webkit-box;
	display:flex;
	flex-wrap: wrap;
	gap:20px;
	align-items: center;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px #ccc solid;
}
.infoPopupTxt dl:last-child{
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: none;
}
.infoPopupTxt dt{
	width: 60px;
	text-align: center;
}
.infoPopupTxt dt span{
	font-size: 12px;
	display: inline-block;
	padding-top: 4px;
	letter-spacing: -1px;
  font-size: 11px;
}
.infoPopupTxt dt img{
	max-width: 40px;
}
.infoPopupTxt dd{
	width: calc(100% - 80px);
	font-size: 14.5px;
	line-height: 1.5;
}


.enquetePopupBtns{
  max-width: 680px;
  width: 100%;
  display:-webkit-box;
	display:flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  text-align: center;
  padding: 0 20px 0px;  
  box-sizing: border-box;
	font-weight: 700;
}
.enquetePopupBtn{
  margin-bottom: 20px;
  padding: 10px 10px;
  min-height: 50px;
  width: calc(50% - 10px);
  background-color: #d75136;
  color: #FFFFFF;
  box-sizing: border-box;
  text-align: center;
  display:-webkit-box;
	display:flex;
  align-items: center;
  justify-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 1.2rem;
  transition: .4s;
  cursor: pointer;
}
@media screen and (max-width: 400px) {
	.enquetePopupBtn{
		font-size: 1.2rem;
		width: calc(50% - 8px);
		margin-bottom: 17px;
	}
}
@media screen and (max-width: 360px) {
	.enquetePopupBtn{
		font-size: 1.1rem;
	}
}
.enquetePopupBtn div{
	text-align: center;
}
.enquetePopupBtn span{
	display: inline-block;
}
@media screen and (max-width: 700px) {
	.enquetePopupBtns.one{
		display: block;
	}
	.enquetePopupBtns.one .enquetePopupBtn{
		width: 100%;
  	margin-bottom: 15px;
	}
}
.enquetePopupBtn:hover{
  opacity: .7;
}
.enquetePopupBtn.subC{
	border: 2px #d75136 solid;
  background: #fff;
  color: #d75136;
}
.enquetePopupBtn.monoC{
	border: 2px #999 solid;
  background: #fff;
  color: #666;
}
.enquetePopupBtn.color1{ background-color: #278ab3;}
.enquetePopupBtn.color2{ background-color: #83b82a;}
.enquetePopupBtn.color3{ background-color: #e98631;}
.enquetePopupBtn.color4{ background-color: #d86785;}
.enquetePopupBtn.color5{ background-color: #63418d;}
.enquetePopupBtn.color6{ background-color: #c88c46;}
.enquetePopupBtn.color7{ background-color: #bb324c;}
.enquetePopupBtn.color8{ background-color: #3d4897;}
.enquetePopupBtn.color9{ background-color: #269874;}

.enquetePopupBtn.sonota{
  width: calc(100%);
  min-height: 40px;
  background-color: #959595;
}
.enquetePopupStep{
  margin: 0px 0 25px;
  display: block;
  position: relative;
}
.bunki1{}
.bunki2{
	display: none;
}
.switchDE .bunki1{
	display: none;
}
.switchDE .bunki2{
	display: block;
}

.progress-borders{
	text-align: center;
	display:-webkit-box;
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}
.progress-borders::before{
	content: '';
	height: 2px;
	width: calc(15px * 4 + 10px * 4);/*ステップ数 -1*/
	background: #ccc;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}
.progress-borders .step{
	background: #fff;
  border-radius: 100px;
  height: 13px;
  width: 13px;
	border: 2px #ccc solid;
	/*box-sizing: border-box;*/
	z-index: 1;
	position: relative;
}
.progress-borders .step.active{
	/*border-color: #ea5539;
  background: #ea5539;
	transition: 1.4s;*/
}
.progress-borders .step.active::after{
	background: #ea5539;
	border: 2px #ea5539 solid;
  border-radius: 100px;
  height: 15px;
  width: 15px;
	position: absolute;
	top: 50%;
	left: 50%;
	content: '';
	opacity:0;
	transform: translateY(-50%) translateX(-50%) scale(.2);
	-webkit-transform: translateY(-50%) translateX(-50%) scale(.2);	
	animation: bounce 1s .4s forwards;
}
.progress-borders .step.active:first-child::after,
.progress-borders .step.alway.active:first-child::after
{
	animation: none;
	opacity:1;
	transform: translateY(-50%) translateX(-50%) scale(1);
	-webkit-transform: translateY(-50%) translateX(-50%) scale(1);	
}
/*.progress-borders .step.active:first-child{
	animation: none;
  opacity:1;
  transform: scale(1);
}*/
@keyframes bounce{
  0% {
    opacity:0;
		transform: translateY(-50%) translateX(-50%) scale(.2);
		-webkit-transform: translateY(-50%) translateX(-50%) scale(.2);
  }
  50% {
    opacity:1;
		transform: translateY(-50%) translateX(-50%) scale(1.2);
		-webkit-transform: translateY(-50%) translateX(-50%) scale(1.2);
  }
  100% {
		opacity: 1;
		transform: translateY(-50%) translateX(-50%) scale(1);
		-webkit-transform: translateY(-50%) translateX(-50%) scale(1);
  }
}
.progress-borders .step.alway{
	border-color: #ea5539;
	cursor: pointer;
}
.progress-borders .step.alway:hover{
	opacity: .7;
}
.progress-borders .step::before{
	position: absolute;
	top: 50%;
	left: 100%;
	content: '';
	height: 2px;
	width: 0;
	background: #ea5539;
	transform: translateY(-50%) translateX(0);
	-webkit-transform: translateY(-50%) translateX(0);
	transition: .4s;
}
.progress-borders .step.alway::before{
	width: 12px;
}
.progress-borders .step.alway:last-child::before{
	display: none;
}
.progress-prev{
	position: absolute;
  top: 7px;
  left: 20px;
	display: none;
	cursor: pointer;
}
.progress-prev:hover{
	opacity: .5;
	transition: .4s;
}
.dli-arrow-left {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  position: relative;
width: 18px;
  height: 3px;
  background: currentColor;
}
.dli-arrow-left::before {
  content: '';
  width:13px;
  height:13px;
  border: 3px solid currentColor;
  border-right: 0;
  border-bottom: 0;
  transform: rotate(-45deg);
  transform-origin: top left;
  position: absolute;
  top: 50%;
  left: -0.05em;
  box-sizing: border-box;
}
.wakaba{
	position: absolute;
  bottom: -16px;
  right: 12px;
}
.wakaba img{
	width: 52px;
}
@media screen and (max-width: 350px) {
.wakaba img{
	width: 42px;
}
}


#header {
  width: 100%;
  height: var(--headerHeight);
  border-radius: 0 0 10px 10px;
  font-size: 16px;
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

#menuHeader{
  width: 100%;
  height: 48px;
  user-select: none;
  background-color: #FFFFFF;
  border-bottom: solid 1px var(--paleGray);
  display:flex;
  align-items:center;
}

.headerWrap {
  background-color: #ffffff;
  height: 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  pointer-events: all;
  padding: 0 10px 0 10px;
}

#title {
  width: fit-content;
  white-space: nowrap;
  display: flex;
  align-items: center;
  width: 65%;
	margin-right: 5px;
}

#menuTitle{
  margin-left: 10px;
}

.titleLink{
  display: block;
  max-width: 190px;
}
.titleLink span{
	vertical-align: bottom;
	color: #ea5539;
}

h1 {
  font-size: 18px;
  font-weight: 700;
  text-align: left;
  display: block;
  width: 100%;
  height: 100%;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

h1>span{
  font-size: 16px;
  margin-left: 5px;
}

h1>img{
  max-height:60px
}

#hdFunc {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.headerButton {
  height: 40px;
  min-width: 42px;
  font-size: 10px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor:pointer;
}
.ls-1{
	letter-spacing: -1px;
}

.headerButton.hamburgerWrap,
.headerButton.returnrap {
  margin-right: 0;
}

.headerButton > p {
  text-align: center;
	white-space: nowrap;
}

.headerButton img {
  height: 20px;
  width: 20px;
  margin-top: auto;
}

.headerButton p {
}
@media screen and (max-width: 374px) {
  .headerButton{
    min-width: 32px;
  }
}
@media screen and (max-width: 360px) {
  .headerButton p span{
    display: none;
  }
}
.headerButton.non-active {
	pointer-events: none;
	position: relative;
}
.headerButton.non-active img{
	opacity: .2;	
}
.headerButton.non-active p{
	opacity: .5;	
}
.headerButton.non-active::before{
	/*content: 'Coming\ASoon';*/
	content: '';
	white-space:pre;
	font-size: 10px;
	line-height: 1;
	width: 100%;
	text-align: center;
	position: absolute;
	top: 43%;
	left: 0;
	transform: translateY(-50%) translateX(0);
	-webkit-transform: translateY(-50%) translateX(0);
	text-shadow: 1px 1px 1px rgb(255, 255, 255);
	color: #666;
}
.newArrival-on{	
	position: relative;
}
.newArrival-on::before{
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #ea5539;
	position: absolute;
	right: 5px;
  top: 1px;
}
#sideMenuList .newArrival-on::before{
	top: -2px;
  right: -10px;
}

.searchWrap,.ekiSeikenOn {
  margin-right: 6px;
}
.searchWrap:hover{
	opacity: .8;
}
.hamburgerWrap.hidden {
  display: none;
}

.hamburger {
  /*ボタン内側の基点となるためrelativeを指定。
追従するナビゲーションの場合はfixed＋top、rightといった位置をセットで指定*/
  position: relative;

  /* background:#FFFFFF; */
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  transition: all 0.3s ease-in-out;

  transform: scale(90%) translateY(-7px);
}

.hamburger.hidden {
  display: none;
}

/*ボタン内側*/
.hamburger span {
  display: inline-block;
  transition: all 0.4s; /*アニメーションの設定*/
  position: absolute;
  left: 22%;
  height: 3px;
  border-radius: 2px;
  background: #5f5f5f;
  width: 60%;
  z-index: 9999;
}

.hamburger span:nth-of-type(1) {
  top: 12px;
}

.hamburger span:nth-of-type(2) {
  top: 19px;
}

.hamburger span:nth-of-type(3) {
  top: 26px;
}

/*activeクラスが付与されると線が回転して×に*/

.hamburger.active span:nth-of-type(1) {
  top: 14px;
  left: 12px;
  transform: translateY(6px) rotate(-45deg);
  width: 50%;
}

.hamburger.active span:nth-of-type(2) {
  opacity: 0; /*真ん中の線は透過*/
}

.hamburger.active span:nth-of-type(3) {
  top: 26px;
  left: 12px;
  transform: translateY(-6px) rotate(45deg);
  width: 50%;
}

.return {
  position: relative;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 5px;

  transform: scale(90%) translateY(-7px);
}

.returnWrap.hidden {
  display: none;
}

/*ボタン内側*/
.return span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 22%;
  height: 3px;
  border-radius: 2px;
  background: #5f5f5f;
  width: 60%;
  z-index: 9999;
}

.return span:nth-of-type(1) {
  top: 14px;
  left: 12px;
  transform: translateY(6px) rotate(-45deg);
  width: 50%;
}

.return span:nth-of-type(2) {
  opacity: 0; /*真ん中の線は透過*/
}

.return span:nth-of-type(3) {
  top: 26px;
  left: 12px;
  transform: translateY(-6px) rotate(45deg);
  width: 50%;
}

.topMenu {
  height: 42px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
	gap: 10px;
  font-size: 13px;
  background-color: #ffffff;
  box-shadow: 0px 2px 5px #0000004f;
  border-top: solid 1px var(--paleGray);
  /* border-bottom:solid 3px #ffffff; */
	/*padding: 0 15px;*/
  position: fixed;
  top: 48px;
  z-index: 9998;	
	box-sizing: border-box;
}

.userTypeWrap {
  height: 75%;
  /*width: 50%;*/
	
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: red;
  position: relative;
  background-color: var(--paleGray);
  border-radius: 20px;
  margin-left: 6px;
  border: solid 2px var(--paleGray);
  cursor:pointer;
}

.userType {
  font-size: 10px;
  height: 100%;
  /*width: 50%;*/
	width: calc(50% - 20px);
  min-width: 80px;

  /* padding:5px; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.userType.family{
  font-size: 11px;
}

@media screen and (max-width: 360px) {
  .userType {
    font-size: 10px;
  }
}

.userType.active {
  z-index: 9999999;
}

.userTypeTxtWrap {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 2px;
}

.userTypeOverlay {
  height: 100%;
  width: 50%;
  border-radius: 20px;
  background-color: #ffffff;
  position: absolute;
  z-index: 11323;
  transition: all 0.3s ease-in-out;
}

.userTypeOverlay.single {
  left: calc(0%);
}

.userTypeOverlay.family {
  left: calc(50%);
}
.radioUserType .userType {
	font-size: 12px;
	display: inline-block;
  width: auto;
}

.shortLine {
  height: 2px;
  width: 60%;
  border-radius: 5px;
}

.shortLine.active {
  background-color: #848484;
}

.topMenuIcon {
  height: 45%;
  margin-right: 3px;
}

@media screen and (max-width: 300px) {
  .topMenuIcon {
    height: 35%;
    margin-right: 1px;
  }
}
.ekiseikenWrap{
	width: 42px;
  font-size: 10px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}
.ekiseikenWrap .btn{
	text-align: center;
}
.ekiseikenWrap p{
	text-align: center;
  white-space: nowrap;
	position: relative;	
	z-index: 1;
	font-size: 10px;
}
.ekiseikenWrap img{
	width: 26px;
	position: relative;	
	z-index: 1;
}
body.ekiSeiken-on .ekiseikenWrap .btn{
	position: relative;
}
body.ekiSeiken-on .ekiseikenWrap .btn::before{
	z-index: 0;
	background: #F4D475;
	border-radius: 100px;
	width: calc(100% + 10px);
	height: 90%;
	position: absolute;
	content: '';
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);	
	max-width: 46px;
}

#guide {
  font-size: 12px;
  /* width: 50%; */
	width: calc(50% - 40px);
  min-width: 20px;
  height: 100%;
  background-color: #ffffff;
  /* border-radius: 0 10px 10px 0;
    box-shadow: 0px 1px 5px #0000004f; */
  padding: 0 10px 0 10px;

  white-space: nowrap;

  display: flex;
  align-items: center;
  /* box-shadow: 0px 2px 5px #0000004f; */

  /* position:absolute;
    z-index: 9998;
    top:30px;
    left:0;
    transition: all 0.3s ease-in-out; */
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

.guideWrap {
  font-size: 11px;
  height: 100%;
  width: 100%;
  transition: all 0.3s ease-in-out;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transform: translateY(2px);
}

.guideType {
  text-align: center;
}

.guideImgWrap {
  display: flex;
  position: relative;
  align-items: center;
  flex-direction: column;
  width: 100%;
}

.guideImgWrap.hidden {
  display: none;
}

.guideColorWrap {
  height: 8px;
  width: 100%;
  display: flex;
  border-bottom: solid 1px var(--paleGray);
}

.color.rentGuide {
  height: 100%;
  width: calc(100% / 8);
}

.color.rentGuide:nth-child(1) {
  background-color: #287bbaa9;
}

.color.rentGuide:nth-child(2) {
  background-color: #87bbd8a9;
}

.color.rentGuide:nth-child(3) {
  background-color: #c9e9dda9;
}

.color.rentGuide:nth-child(4) {
  background-color: #c2f8b4a9;
}

.color.rentGuide:nth-child(5) {
  background-color: #fffeb4a9;
}

.color.rentGuide:nth-child(6) {
  background-color: #fccb7ea9;
}

.color.rentGuide:nth-child(7) {
  background-color: #f67931a9;
}

.color.rentGuide:nth-child(8) {
  background-color: #c42316a9;
}

.color.rentGuide:nth-child(9) {
  background-color: #9d125ca9;
}

.color.earthquakeGuide {
  height: 100%;
  width: calc(100% / 5);
}

.color.earthquakeGuide:nth-child(1) {
  background-color: #62f4147f;
}

.color.earthquakeGuide:nth-child(2) {
  background-color: #c4f4147f;
}

.color.earthquakeGuide:nth-child(3) {
  background-color: #f4ba147f;
}

.color.earthquakeGuide:nth-child(4) {
  background-color: #e5420a7f;
}

.color.earthquakeGuide:nth-child(5) {
  background-color: #b506067f;
}

.color.earthquakeGuide:nth-child(6) {
  background-color: #7000237f;
}

.guideTxtWrap {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  text-shadow: 0 0 0.2em #ffffff, 0 0 0.2em #ffffff, 0 0 0.2em #ffffff,
    0 0 0.2em #ffffff, 0 0 0.2em #ffffff;
}

.guideTxt.earthquakeGuide {
  width: calc(100% / 6);
  text-align: center;
  line-height: 1.5rem;
}

@media screen and (min-width: 300px) {
  .guideTxt.rentGuide:nth-child(1){
    font-size: 10px;
  }
  .guideTxt.rentGuide:nth-child(2){
    font-size: 11px;
  }
  .guideTxt.rentGuide:nth-child(3){
    font-size: 12px;
  }
}

.guideButton {
  width: 20px;
  /* background-color: #969696;
    height: 100%;
    width:4px;
    border-radius:2px 2px 2px 2px; */
}
.guideButton.hidden {
  transform: scale(-1, 1);
  /* opacity:0;
    width:0; */
}

.guideTriangleWrap {
  height: 5px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 2px;
}

.triangle {
  height: 5px;
  width: 5px;
}

#mapOverlay {
  position: absolute;
  top: calc(var(--headerHeight));
  height: calc(100% - var(--headerHeight) - var(--footerHeight) + 5px);
  /* height: calc(100% - var(--headerHeight) - var(--footerHeight)); */
  width: 100%;
}

#mapOverlay.hidden {
  display: none;
}

#map {
  position: absolute;
  top: calc(var(--headerHeight));
  height: calc(100% - var(--headerHeight) - var(--footerHeight) + 5px);
  /* height: calc(100% - var(--headerHeight) - var(--footerHeight)); */
  width: 100%;
}

#map.expanded {
  height: calc(100% - var(--headerHeight) - 100px);
}

#dispRent {
  transition: opacity 0.2s ease-in-out, bottom 0.2s ease-in-out;
  transition-delay: 0s, 0s;
  font-weight: bold;
  text-align: center;
  padding: 5px 10px;
  width: fit-content;
  min-width: 50px;
  height: fit-content;
  background-color: #ffffff;
  /* box-shadow: 0px 3px 5px #0000004f; */
  filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, 0.3));
  border-radius: 10px 10px 10px 10px;

  display: flex;
  justify-content: center;
  align-items: center;

  position: absolute;
  z-index: 999;
  /* left: 0;
    right: 0;
    bottom: 53%; */
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

#dispRent.zm10 {
  bottom: 75px;
}
#dispRent.zm11 {
  bottom: 80px;
}
#dispRent.zm12 {
  bottom: 100px;
}
#dispRent.zm13 {
  bottom: 130px;
}
#dispRent.zm14 {
  bottom: 80px;
}
#dispRent.zm15 {
  bottom: 90px;
}
#dispRent.zm16 {
  bottom: 120px;
}
#dispRent.zm17 {
  bottom: 170px;
}
#dispRent.zm18 {
  bottom: 280px;
}
#dispRent.zm19 {
  bottom: 480px;
}
#dispRent.zm20 {
  bottom: 895px;
}

#dispRent.else {
  display: none;
}

#dispRent:before {
  content: "";
  /* borderで三角形を作る */
  border: 10px solid transparent;
  border-top: 10px solid #ffffff;
  /* 配置する */
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}

#dispRent.transparent {
  opacity: 0%;
}

#dispRent.hidden {
  display: none;
}

.searching {
  background-color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  border-radius: 100%;
  display: block;
  border: 0px;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: fixed;
  cursor: pointer;
  user-select: none;
  width: 45px;
  height: 45px;
  bottom: 395px;
  right: 5px;
  z-index: 1000;
  background-image: url(../img/search.png);
  background-size: 52%;
  background-repeat: no-repeat;
  background-position: 11px 6px;
}

.searching.hidden {
  display: none;
}



.searchingClose {
  background-color: #ffffff;
  position: relative;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  z-index: 2000;
  height: 20px;
  width: 20px;
  border-radius: 100%;
  left: 30px;
  top: -6px;
  background-image: url(../img/close.png);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
}

.searchingCnt {
  background-color: #ffffff;
  position: relative;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  z-index: 2000;
  height: 20px;
  width: 20px;
  border-radius: 100%;
  left: 30px;
  top: -6px;
  background-image: url(../img/close.png);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
}
.ekisearching {
  background-color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  border-radius: 100%;
  display: block;
  border: 0px;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: fixed;
  cursor: pointer;
  user-select: none;
  width: 45px;
  height: 45px;
  bottom: 450px;
  right: 5px;
  z-index: 1000;
  background-image: url(../img/ekisearch.png);
  background-size: 66%;
  background-repeat: no-repeat;
  background-position: 11px 6px;
}

.ekisearching.hidden {
  display: none;
}
.searchingTxt {
  font-size: 10px;
  position: relative;
  width: 100%;
  text-align: center;
  top: 5px;
  border-radius: 100%;
  transform: scale(0.9);
}
.ekisearchingTxt {
  font-size: 10px;
  position: relative;
  width: 100%;
  text-align: center;
  top: 5px;
  border-radius: 100%;
  transform: scale(0.9);
}

.ekisearchingClose {
  background-color: #ffffff;
  position: relative;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  z-index: 2000;
  height: 20px;
  width: 20px;
  border-radius: 100%;
  left: 30px;
  top: -6px;
  background-image: url(../img/close.png);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
}

.shareButton{
  background-color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  display: block;
  border-radius: 100%;
  border: 0px;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: fixed;
  cursor: pointer;
  user-select: none;
  width: 45px;
  height: 45px;
  /*bottom: 213px;*/
	bottom: 115px;
  left: 5px;
  z-index: 1000;
  overflow: hidden;
  background-image: url(../img/share2.png);
  background-size: 67%;
  background-repeat: no-repeat;
  background-position: center;
}

.shareBG{
  width: 100vw;
  height: 100%;
  background-color: #00000061;
  z-index: 999998;
  opacity: 100%;
  position: fixed;
  transition: opacity 0.3s ease-in-out;
}

.shareBG.hidden{
  opacity: 0%;
  pointer-events: none;
}

.sharePopup{
  min-width: 250px;
  min-height: 136px;
  max-width: 250px;
  max-height: 136px;
  background-color: #FFFFFF;
  z-index: 999999;
  opacity: 100%;
  position: absolute;
  border-radius: 20px;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: 50px;
  width: 95%;
  height: 40%;
  transition: all 0.3s ease-in-out;
}

.sharePopup.hidden{
  opacity: 0%;
  pointer-events: none;
}

.sharePopupTitle{
  display: flex;
  font-size: 16px;
  height: 50%;
  text-align: center;
  margin-bottom: 0;
  align-items: center;
  justify-content: center;
}

.share.returnWrap{
  width: 0px;
  height: 0px;
  position: absolute;
  right: 43px;
  top: 0px;
}

.share.return {
  position: fixed;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  transform: none;
  z-index: 9999;
  /* top: -65px; */
  /* right: -285px; */
  margin: 0px;
  transition: all 0.3s ease-in-out;
}

.share.return span {
  background-color: #aaaaaa;
}

.sharePopupWrap{
  display: flex;
  justify-content: space-around;
  width: 80%;
  margin: 0 auto;
}

.shareItem{
  margin:0 5px;
  height:40px;
  width: 40px;
  min-height: 40px;
  min-width: 40px;
}

.shareLine,.shareLine>img{
  height: 40px;
  width: 40px;
}

.shareInsta,.shareInsta>img{
  height: 40px;
  width: 40px;
}

.shareX{
  height: 40px;
  width: 40px;
  background-color: #000000;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.shareX>img{
  height: 70%;
  width: 70%;
}

.shareFB{
  height: 40px;
  width: 40px;
}

.familyBG{
  width: 100vw;
  height: 100%;
  background-color: #00000061;
  z-index: 999998;
  opacity: 100%;
  position: fixed;
  transition: opacity 0.3s ease-in-out;
}

.familyBG.hidden{
  opacity: 0%;
  pointer-events: none;
}

.familyPopup{
  min-width: 250px;
  min-height: 136px;
  max-width: 250px;
  max-height: 136px;
  background-color: #FFFFFF;
  z-index: 999999;
  opacity: 100%;
  position: absolute;
  border-radius: 20px;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: 50px;
  width: 95%;
  height: 40%;
  transition: all 0.3s ease-in-out;
}

.familyPopup.hidden{
  opacity: 0%;
  pointer-events: none;
}

.familyPopupTitle{
  display: flex;
  font-size: 16px;
  height: 30%;
  text-align: center;
  margin-bottom: 0;
  align-items: center;
  justify-content: center;
}

.familyPopupTxt{
  padding: 10px;
  padding-top: 4px;
  font-size: 13px;
  text-align: center;
}

.family.returnWrap{
  width: 0px;
  height: 0px;
  position: absolute;
  right: 43px;
  top: 0px;
}

.family.return {
  position: fixed;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  transform: none;
  z-index: 9999;
  /* top: -65px; */
  /* right: -285px; */
  margin: 0px;
  transition: all 0.3s ease-in-out;
}

.family.return span {
  background-color: #aaaaaa;
}

.familyPopupWrap{
  display: flex;
  justify-content: space-around;
  width: 80%;
  margin: 0 auto;
}

.familyPopupClose{
  color: #FFFFFF;
  display: flex;
  margin: 0 auto;
  background-color: #ea5539;
  width: 80px;
  height: 30px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  cursor: pointer;
}

.favButton,.enqueteButton {
  background-color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  border-radius: 100%;
  display: block;
  border: 0px;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: fixed;
  cursor: pointer;
  user-select: none;
  width: 45px;
  height: 45px;
	/*bottom: 348px;*/
	bottom: 254px;
  right: 5px;
  z-index: 1000;
  overflow: hidden;
}

.favButton::after,.enqueteButton::after{
  border: 3px solid #ffcad3;
  content: "";
  border-radius: 100%;
  display: block;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: absolute;
  user-select: none;
  pointer-events: none;
  top: 0px;
  right: 0px;
  left: 0px;
  bottom: 0px;
  width: 10px;
  height: 10px;
  z-index: 1001;
  margin: auto;
  opacity: 0%;
}

.favButton::before,.enqueteButton::before {
  background-image: url(../img/favo_disable.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  content: "";
  border-radius: 100%;
  display: block;
  margin: 0px;
  padding: 0px;
  text-transform: none;
  appearance: none;
  position: absolute;
  user-select: none;
  pointer-events: none;
  top: 0px;
  right: 0px;
  left: 0px;
  bottom: 0px;
  width: 45px;
  height: 45px;
  z-index: 1002;
  margin: auto;
}

.favButton.pink::before {
  background-image: url(../img/favo.png);
}
.favButton.hidden {
  display: none;
}

.enqueteButton{
	bottom: 328px;
}
.enqueteButton::before {
  background-image: url(../img/enquete_disable.png);
}
.enqueteButton::after{
	border-color:#8dc724;
}
.enqueteButton.green::before {
  background-image: url(../img/enquete.png);	
}
.favButton.active::before,
.enqueteButton.active::before {
  animation: favorite 0.4s 1 ease-in-out;
}
.favButton.active::after,
.enqueteButton.active::after {
  animation: ripple 0.35s 1 ease-out;
  animation-delay: 0.15s;
  animation-fill-mode: forwards;
}

@keyframes favorite {
  0% {
    background-size: 20%;
  }

  80% {
    background-size: 120%;
    transform: translateY(-1px);
  }
  100% {
    background-size: 100%;
    transform: translateY(0px);
  }
}

@keyframes ripple {
  0% {
    opacity: 0%;
    transform: scale(0);
  }
  5% {
    opacity: 100%;
  }

  30% {
    opacity: 100%;
  }

  100% {
    transform: scale(4.5);
    opacity: 100%;
  }
}

.message,.messageUp {
  font-weight: bold;
  text-align: center;
  padding: 5px 10px;
  width: fit-content;
  min-width: 50px;
  height: fit-content;
  background-color: #ffffff;
  box-shadow: 0px 3px 5px #0000004f;
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.2));
  border-radius: 10px 10px 10px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  z-index: 999;
  /*top: calc(50% + 20px);*/
	top: calc(50% - 120px);
  left: 0;
  right: 0;
  /* bottom: 0px; */
  margin: auto;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
.messageUp{
	top: calc(50% - 120px);
	/*top: auto;
  bottom: 30px;*/
}
/*.messageUp::before {
  content: "";
  border: 10px solid transparent;
  border-top: 10px solid #ffffff;       
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}*/

.message.hidden,
.messageUp.hidden{
  opacity: 0%;
}

.message > p,
.messageUp > p{
  text-align: center;
  font-size: 10px;
}
.message.styleS,
.messageUp.styleS,
.message.styleSup,
.messageUp.styleSup{
	background: #ea5539;
  color: #fff;
  border: 1px rgba(255,255,255,.6) solid;
}
.message.styleS strong,.messageUp.styleS strong,
.message.styleSup strong,.messageUp.styleSup strong{
	font-size: 1.1rem;
}
.message.styleSup,
.messageUp.styleSup{
	top: 60px;
}
.message.styleSup .messageTxt,
.messageUp.styleSup .messageTxt{
	font-size: 1.05rem;
}
.rankPop{
  border: 1px rgba(255,255,255,.6) solid;
	/*top: 60px;*/
	bottom: 60px;
  font-weight: bold;
  text-align: center;
  padding: 5px 10px;
  width: fit-content;
  min-width: 50px;
  height: fit-content;
  background-color: #ffffff;
	color: #515151;
  box-shadow: 0px 3px 5px #0000004f;
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.2));
  border-radius: 10px 10px 10px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  z-index: 999;
  left: 0;
  right: 0;
  /* bottom: 0px; */
  margin: auto;
}
.rankPop.hidden{
  opacity: 0%;
}
.rankPop strong{
	font-size: 1.1rem;
}
.rankPop .messageTxtRank{
	font-size: 1.05rem;
}
.rankPop .btnRankClose{	
	position: absolute;
	right: -10px;
	top: -10px;
	width: 24px;
	height: 24px;
	box-sizing: border-box;
	padding: 4px;
	border-radius: 50%;
	border: 1px #ccc solid;
	background: #fff;
	cursor: pointer;
}
.rankPop .btnRankClose img{
	display: block;
}
/*.rankPop::after{
	content: '';
	position: absolute;
	right: -10px;
	top: -10px;
	width: 24px;
	height: 24px;
	box-sizing: border-box;
	padding: 4px;
	border-radius: 50%;
	border: 1px #ccc solid;
	background: #fff url(../img/close.png) no-repeat center / 50%;
	
}*/

.dispRentButton.disable {
  background-image: url(../img/popup_disable.png);
}

.rent {
  font-size: 16px;
  line-height: 0.9em;
  text-align: center;
}

.rent.hidden{
  display:none
}

.rentMessage{
  font-size:10px;
}

.rentMessage.hidden{
  display:none;
}

.avgRent {
  font-size: 10px;
  letter-spacing: normal;
}

.unit {
  font-size: 10px;
  letter-spacing: normal;
}

input,
select {
  -webkit-appearance: none;
  appearance: none;
}

.mapAddress {
  display: flex;
  padding: 2px 10px 2px 2px;
  width: calc(100% - 165px);
  max-width: 470px;
  min-height: 28px;
  height: fit-content;
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  border-radius: 20px;
  position: fixed;
  z-index: 9996;
  top: calc(var(--headerHeight) + 8px);
  right: 7px;
  opacity: 100%;
  font-size: 12px;
  align-items: center;
  cursor: pointer;
}

.mapAddress:has(.mapAddressTxt.expanded ){
  align-items: start;
  
}

.mapAddressIconWrap {
  width: 23px;
  background-image: url(../img/detail_address.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 28px;
}

.mapAddressTxt {
  width: calc(100% - 28px);
  height: fit-content;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  font-size: min(3.5vmin,17px);
}

.mapAddressTxt.expanded {
  -webkit-line-clamp: 5;
}

@keyframes slideIn {
  0% {
    right: 0;
  }

  100% {
    right: -100%;
  }
}
.ib{
	display: inline-block;
}
.marB5{
	margin-bottom: 5px;
}
.fw-n{
	font-weight: normal;
  font-size: 84%;	
}
#searchBox,#rankingBox,#compBox {
  padding: 20px 0px 0;
  width: calc(100%);
  /* max-width: 400px; */
  height: calc(100% - var(--headerHeight) - 80px);
  background-color: #ffffff;
  box-shadow: 0px 3px 5px #0000004f;
  border-radius: 10px 10px 0px 0px;
  position: fixed;
	/*position: absolute;*/
  /*z-index: 9999;*/
	z-index: 10001;
  top: calc(var(--headerHeight) + 50px);
  right: 0;
  opacity: 100%;
  transition: all 0.3s ease-in-out;
  max-width: 500px;
  overflow-y: scroll;
  display: flex;
  flex-flow: column;
  align-items: center;
}
@media screen and (max-width: 500px) {
	#searchBox{
		height: calc(100vh - var(--headerHeight) - 180px);
		max-height: calc(50vh - 50px);
		/*max-height: 388px;*/
		padding-top: 0;
		padding-bottom: 0;
		bottom: 0;
		top: auto;
	}
	/*.ekilistOn #searchBox{
		max-height: none;
    height: calc(100vh - var(--headerHeight) - 80px);
	}*/
	#searchBox .searchBoxHeader.fixed{
		position: sticky;
    top: 0;
    padding: 8px 20px;
    border-bottom: none;
    width: 100%;
    box-sizing: border-box;
		height: auto;
		box-shadow: 0 0 3px 3px rgba(0,0,0,.2);
	}
	#searchBox .search.return{
		position: absolute;
		top: 0;
		right: 0;
	}
	#searchBox .searchTabBox{
		min-height: auto;
		top: 32px;
		margin-top: 0px;
	}
	#searchBox .searchTab{
		align-items: flex-end;
		height: auto;
		padding-top: 4px;
	}
}
.nonAnime{
	transition: none !important;
}
#rankingBox {
	width: calc(50%);
	min-width: 200px;
}
#rankingBox .tabContents{
	padding: 15px 10px;
}
#rankingBox .searchBoxHeader.fixed {
	width: calc(50%);
	min-width: 200px;
	box-sizing: border-box;
}
#rankingBox .sideBtn{
	margin: 0 10px;
}
@media screen and (max-width: 375px) {
#rankingBox,#rankingBox .searchBoxHeader.fixed {
	min-width: 180px;
}
}

@media screen and (min-width: 950px) {
  #searchBox,#rankingBox,#compBox {
    height: calc(100% - var(--headerHeight) - 172px);
    border-radius: 10px 10px 10px 10px;
  }
}

#searchBox.hidden,#rankingBox.hidden,#compBox.hidden {
  right: -100%;
}

.search.return {
  position: fixed;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  transform: none;
  z-index: 9999;
  top: 140px;
  right: 10px;
  margin: 0px;
  transition: all 0.3s ease-in-out;
}

.search.return span {
  background-color: #aaaaaa;
}

#searchBox.hidden .search.return,
#rankingBox.hidden .search.return,
#compBox.hidden .search.return {
  background-color: red;
  right: -100%;
}

.searchList.placeSearch {
  margin-top: 10px;
  margin-bottom: 10px;
}

.searchBoxHeader {
  width: 100%;
  display: flex;
  justify-content: left;
  margin-bottom: 5px;
  background-color: #ffffff;
  /*align-items: center;*/
	align-items: baseline;
}
.searchBoxHeader.fixed {
  border-radius: 10px 10px 0px 0px;
  padding: 0px 20px;
  position: fixed;
  background-color: #ffffff;
  top: 140px;
  border-bottom: 1px solid #efefef;
  width: calc(100% - 40px);
  max-width: 460px;
  transition: right 0.3s ease-in-out;
  right: 0px;
  height: 40px;
  display: flex;
  align-items: center;
  font-size: 12px;
	z-index: 3;
}

.searchBoxHeader.landName {
  /* margin-top: 35px; */
}

.dot{
  height: 10px;
  width: 10px;
  border-radius: 100%;
  margin-right: 5px;
}

.dot.green{
  background-color: #f29989;
}

.dot.blue{
  background-color: #ea5539;
}

.searchTitle {
  font-weight: bold;
  font-size: 14px;
  color: var(--gray);
	width: calc(100% - 10px);
}

.searchExplain{
  font-size: 10px;
  margin-bottom: 15px;
  color:#717171;
}

#searchBox.hidden > .searchBoxHeader.fixed,
#rankingBox.hidden > .searchBoxHeader.fixed,
#compBox.hidden > .searchBoxHeader.fixed {
  right: -100%;
}

.compBoxIn{
	padding: 30px 10px 10px;
  width: 100%;
  box-sizing: border-box;
}
.compBoxIn input.form,
.ekiDist input.form{
	box-sizing: border-box;
	width: 100%;
  border-radius: 5px;
  font-size: 12px;
}
.compBoxIn .table{
	
}
.compBoxIn .table th,
.compBoxIn .table td{
	border-bottom: 1px #bbb solid;
  padding: 0 inherit;
  padding: 10px 5px;
	white-space: normal;
}
.compBoxIn .table th{
	background: #fff5e8;
}
/*.compBoxIn .table td{
	border-right: 1px #bbb solid;
}*/
.compBoxIn .table td,
.compBoxIn .table td a{
	text-align: center;
}
.compBoxIn .table th:nth-of-type(1){  
	border-right: 1px #ddd solid;
}
.compBoxIn .table tr td:nth-of-type(2),
.compBoxIn .table tr th:nth-of-type(3){
	border-left: 2px #ccc dotted;
}

.compBoxIn .table td strong{
	font-size: 16px;
	font-weight: bold;
}
.compBoxIn .bordB_dot th,
.compBoxIn .bordB_dot td{
	border-bottom: 2px #ccc dotted;
}
.compBoxIn .table tr:last-child th,
.compBoxIn .table tr:last-child td{
	border-bottom: none;
}
.compBoxIn .table tr.tableEki-first th{
	border-bottom: none;
  padding-bottom: 0;
}
.compBoxIn .table tr.tableEki-blank td{
	text-align: left;
  padding-bottom: 5px;
  padding-left: 0;
  font-weight: bold;
}
.compBoxIn .table .tableEki-selecteki:nth-of-type(3) td{
	padding-top: 1.8em;
}



.ekiListWrap,.ekiListWrapTd{
	position: relative;
}
.tableEki-thead .ekiListWrap{
	padding-top: 5px;
}
.ekiListWrap .btnTextOff,
.ekiListWrapTd .btnTextOff{
	border: none;
	background: #fff;
	width: 22px;
  height: 22px;
	cursor: pointer;
	position: absolute;
  right: 6px;
	bottom: 14px;
  /*top: 50%;
  margin-top: -11px;*/
	display: none;
}
.ekiListWrap .btnTextOff:hover,
.ekiListWrapTd .btnTextOff:hover{
	opacity: .7;
}
.ekiListWrap .fromStationName,
.ekiListWrapTd .fromStationName{
	padding-right: 1.4em;
  box-sizing: border-box;
}
.ekiDist .ekiListWrapTd .btnTextOff{
	bottom: 5px;
}
#searchBox .ekiListWrap.ekiNotFound::after,#searchBox .ekiListWrapTd.ekiNotFound::after{
	position: absolute;
	/*content: '駅が見つかりません';*/
	content: '';
	left: 0px;
	bottom: calc(100% + 0px);
	font-size: 10px;
	white-space: nowrap;
	color: #e21f1f;
	background: rgba(255, 255, 255, .8);
}
#searchBox .ekiListWrap.ekiNotFound::before,#searchBox .ekiListWrapTd.ekiNotFound::before{
  /*content: "";*/
  position: absolute;
  bottom: calc(100% - 10px);
  left: 10px;
  border: 5px solid transparent;
  border-top: 5px solid #e21f1f;
}
#compBox .ekiListWrap.ekiNotFound::after,#compBox .ekiListWrapTd.ekiNotFound::after{
	bottom: calc(42px + 0px);
}
#compBox .ekiListWrap.ekiNotFound::before,#compBox .ekiListWrapTd.ekiNotFound::before{
  bottom: calc(42px - 10px);
}

.ekiListWrap.ekiNotFound .fromStationName,.ekiListWrapTd.ekiNotFound .fromStationName{
	background: #fff0ee;
  border-color: #e21f1f;
}

.ekiList{
	display: none;
	position: absolute;
  top: calc(100% - 10px);
  left: 0;
  background: #fff;
  border-radius: 5px;
  width: 100%;
  border: 1px #666 solid;
  box-shadow: 2px 2px 3px 0 rgba(0,0,0,.2);
	z-index: 1;
}
.ekiListWrapTd .ekiList{
	min-width: 160px;
}
.ekiList ul{
	max-height: calc(100vh - var(--headerHeight) - 172px - 70px);
  overflow-y: scroll;
}
.ekiList li{
	padding: 8px 10px;
	white-space: wrap;
	cursor: pointer;
}
.ekiList li:hover{
	opacity: 0.7;
	text-decoration: underline;
}
.ekiList .btnClose{
	cursor: pointer;
}
.ekiList .btnClose:hover{
	opacity: .8;
}
.ekiList .btnCloseOut{
	position: absolute;
	right: -6px;
  top: -12px;
	width: 25px;
  height: 25px;
	padding: 4px;
	border: 1px #d9d9d9 solid;
	box-shadow: 2px 2px 3px 0 rgba(0,0,0,.2);
	border-radius: 50%;
	background: #fff;
}
.ekiList .btnCloseOut img{
	vertical-align: middle;
}
.ekiList .noMes{
	display: none;
	/*padding: 20px 10px 15px;*/
  width: 100%;
  white-space: wrap;
  box-sizing: border-box;
  text-align: center;
  padding: 5px 10px 5px 20px;
  font-size: 0.75rem;
  background: url("../img/ico_attention01.svg") no-repeat left 4px center/auto 14px;
}
.ekiList .noMes p{
  color: #e21f1f;
}
.ekiList .btnCloseIn{
	background: #fff;
	border: 1px #ccc solid;
	border-radius: 4px;
	display: inline-block;
  margin-top: 5px;
	vertical-align: middle;
	color: #333;
}
.ekiList .btnCloseIn img{
	width: 13px;
	display: inline-block;
	padding-right: 4px;
	vertical-align: middle;
}
.ekiList .btnArea{
	text-align: center;
	padding: 5px;
}

/*.compBoxIn .table .eki1{
	text-decoration: underline;
}*/
.eki1.disable{
	color: #999;
	text-decoration: none;
	pointer-events: none;
	background:#aaa;
  border-bottom-color: #aaa;
}
.compBoxIn .table thead{
	position: sticky;
  top: 8px;
	z-index: 1;
}
.compBoxIn .table .tableEki-thead th{
	padding-top: 1px;
}
/*.compBoxIn .comp_ex{
	color: #888;
	padding-left: 1.6em;
}
.compBoxIn .div_comp_ex{
	position: absolute;
  bottom: 18px;
  left: 8px;
  font-size: 12px;
  font-weight: normal;
  z-index: 1;
  background:#fff;
	color: #777;
	display: none;
}
.compBoxIn .comp_ex + .div_comp_ex{
	display: block;
}*/
.defView{
	color: #999;
}

.searchBoxTitle {
  font-weight: bold;
  height: 25px;
  margin: none;
  display: flex;
  align-items:center;
}
.withIcon{
	width: 1.8em;
  height: auto;
  display: inline-block;
  margin: 0 7px 0 -10px;	
}
.searchItem {
  margin-bottom: 16px;
  line-height: 1;
  width: 100%;
}

.searchItemErr{
  font-size: 12px;
  color: #e21f1f;
  margin: 5px 0;
  font-weight: bold;
}

.titleWrap {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.searchItemTitle {
  min-width: 40px;
  margin: auto 0;
  font-size: 12px;
  font-weight: bold;
  color: #565656;
}

.searchItemAdd {
  color: #717171;
  margin-left: 10px;
  font-size: 10px;
}

.formWrap {
  width: 100%;
  display: flex;
}

.formWrap.place {
  width: 100%;
}
.formWrap.eki{
	align-items: center;
}
.searchItem input.form{
	width: calc(100% - 2em - 10px);
  min-width: 70px;
  box-sizing: border-box;
	margin-right: 5px;
}

.rentFormWrap {
  display: flex;
  justify-content: space-between;
}

.pulldown,.pulldown_v2 {
  width: 46%;
  min-width: 70px;
  background-color: #ffffff;
  border: solid 1px var(--lilPaleGray);
  border-radius: 5px;
  height: 35px;
  padding: 2px 30px 2px 8px;
  background-image: url(../img/pulldown_arrow.png);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: right 2px top 10px;
  color: var(--gray);
  margin: 0;
  font-size: 12px;
}
.pulldown_v2.toStation{
	min-width: 82px;
}
.pulldown_v2 option:disabled{
	color: #ccc;
}
.pulldown:disabled{
	opacity: 0.3;
}

.form {
  width: 65%;
  min-width: 52px;
  background-color: #ffffff;
  border: solid 1px var(--lilPaleGray);
  border-radius: 5px;
  height: 30px;
  padding: 2px 8px;
  color: var(--gray);
  margin: 0;
  font-size: 13px;
}

.optionHide{
  display:none;
}

.rentFormWrap > p {
  width: 20%;
  margin: auto 0 auto auto;
  align-items: center;
}

.searchTabBox{
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 40px;
  background-color: #FFF4f0;
  align-items: flex-end;
  top: 10px;
  min-height: 64px;
	gap: 5px;
	position: sticky;
	top: 3px;
	z-index: 2;
	margin-top: 8px;
	border-bottom: 3px #fff solid;
	padding:0 5px;
  box-sizing: border-box;
}

.searchTab{
  height: 38px;
  width: 49%;
  top: 50px;
  /*color:#484848 ;
  background-color: #FFFFFF;*/
  border-radius:5px;
  /*box-shadow: 0px -2px 2px 0px #00000011;*/
  display: flex;
  align-items: center;
  justify-content: center;
	padding-bottom: 4px;
	/*border: 1px #ccc solid;
	border-bottom: none;*/	
	background: #ea5539;
	color: #fff;
	border: 1px #ea5539 solid;
	border-bottom-width: 2px;
  transition:.2s;
	background: linear-gradient(to bottom,  #cc3d33 0%,#ea5539 20%,#ea5539 100%);

}
.searchTab.disable{
	background: #e8eaed;
	color: #4c4c4c;
	border-color:#dfdfdf;
	border-bottom-color:#ccc ;
  /*background-color:#F08875 ;
	background: linear-gradient(to bottom, #f08875 1%,#f08875 90%,#d36b67 100%);
  color: #FFFFFF;
	border-color: #d97f6e;*/
}
.searchTab.disable:hover{
	transform: translateY(1px) translateX(0);
  -webkit-transform:translateY(1px) translateX(0);
  border-bottom:none;
}
.searchTab div{
	text-align: center;
}
.searchTab strong{
	font-size: 106%;
}

.searchByConditionsTab{
}

.searchByPlaceTab{
}

.tabBottom{
  min-height: 5px;
  width: 100%;
  background-color: #FFFFFF;
  border-bottom: solid 1px var(--paleGray);
}

.nyoro {
  margin: auto 5px;
}

.form.searchByPlace {
  width: 100%;
  border-radius: 5px;
  font-size: 12px;
}

.dispAddressSearch {
}

.dispAddressSearch.results {
  margin-bottom: 20px;
  margin-top: 20px;
}

.dispAddressSearch.hidden {
  display: none;
}

.errTxt {
  margin: 7px 0;
  font-size: 12px;
  color: #e21f1f;
  font-weight: bold;
}
.okTxt {
  margin: 7px 0;
}
.okTxt strong{
	display: inline-block;
  margin-right: 3px;
	font-weight: bold;
}

.addressList {
  max-height: 100px;
  overflow-y: scroll;
}

.addressItem {
  padding: 4px 0;
  border-top: solid 1px var(--lilPaleGray);
}
.addressItem::after {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  content: "";
  background-image: url(../img/arrow2.png);
  background-size: contain;
  vertical-align: middle;
  position: relative;
  right: -5px;
  top: 0px;
}
.addressItem:last-child {
  border-bottom: solid 1px var(--lilPaleGray);
}

.searchByPlaceBox{
    /* width: 100%; */
    width: calc(100% - 40px);
    background-color: white;
    padding: 20px;
    /* border-radius: 10px; */
    /* display: flex; */
    /* margin-top: 10px;*/
    height: 100%;
	position: relative;
	min-height: 260px;
}

.searchByPlaceBox.disable{
  display: none;
}

.searchByEkiBox,.searchByConditionsBox,.searchByPlaceBox{
    /* width: 100%; */
    width: calc(100% - 40px);
    background-color: white;
    padding: 20px 20px 0;
    /* border-radius: 10px; */
    /* display: flex; */
    /* margin-top: 10px;*/
	position: relative;
}

.searchByEkiBox.disable,.searchByConditionsBox.disable,.searchByPlaceBox.disable{
  display: none;
}
.searchByEkiBox{
	padding-top: 10px;
}


.searchButtonWrap {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  /* margin-bottom: 30px; */
}

.searchButtonWrap.bottom {
  margin-bottom: 5px;
  max-width: 500px;
  /* background-image: linear-gradient(0deg, #FFFFFF, #FFFFFF 60%, #FFFFFF00); */
  display: flex;
  align-items: center;
  /*border-top: solid 1px var(--paleGray);*/
  background-color: #FFFFFF;
}
.posSticky{
  position: sticky;
  bottom: 0px;
  /*height: 70px;*/
  background: #fff;
  padding-top: 5px;
	padding-bottom: 20px;
	border-top: solid 1px var(--paleGray);
}
@media screen and (max-width: 500px) {
.posSticky{
	padding-bottom: 0;
}
}

.clearButton {
  height: 35px;
  width: 28%;
  background-color: #e8eaed;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  color: #4c4c4c;
  font-size: 14px;
}

.searchButton {
  height: 35px;
  width: 70%;
  background-color: #60b6ed;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

.searchButton.green {
  background-color:#f29989;
}

.searchButton.blue {
  background-color: #ea5539;
	border-bottom: 3px #ac3b25 solid;
	transition: .2s;
}
.searchButton.blue:hover{
	transform: translateY(1px) translateX(0);
  -webkit-transform: translateY(1px) translateX(0);
	border-bottom-width: 2px;
	background-color: #d94e34;
}
.searchButton.dis {
	opacity: .6;
}

.searchByAdd{
	position: absolute;
  bottom: 2px;
  left: 0;
  width: 100%;
  text-align: center;
}
#searchBox .searchByAdd::before{
	top: -1.6em;
  max-width: 300px;
	text-shadow: 0;
	background: #fff;
}

@media screen and (max-width: 300px) {
  .form,
  .pulldown,
  .pulldown_v2,
  span {
    font-size: 12px;
  }
}

#sideMenu {
  /* padding: 20px; */
  width: 60%;
  max-width: 265px;
  height: fit-content;
  background-color: #fff;
  box-shadow: 0px 0px 5px #0000004f;
  border-radius: 10px 10px 10px 10px;

  position: fixed;
  z-index: 9999;
  top: calc(var(--headerHeight) + 8px);

  right: 0;
  opacity: 100%;
  transition: all 0.3s ease-in-out;
}

#sideMenuList li {
  /* margin: 10px 0; */
  cursor:pointer;
  padding: 5px 20px;
  cursor: pointer;
  transition: all 0.1s ease-in-out;
}

#sideMenuList li a{
  display: block;
  width: 100%;
  height: 100%;
  color: #484848;
}

#sideMenuList li:first-child {
  padding-top:15px;
  border-radius: 10px 10px 0px 0px;
}

/*#sideMenuList li:last-child {
  padding-bottom:15px;
  border-radius: 0px 0px 10px 10px;
}*/

#sideMenuList li:hover {
  background-color: #e9e9e9;
}
#sideMenuList li.noHover:hover {
  background-color: transparent;
}
/*btn*/
.btn1 {
	position: relative;
	z-index: 1;
	display: block;
	color: #fff !important;
	text-decoration: none;
	background-color: #ea5539;
	border: 1px solid #ea5539;
	border-radius: 5px;
	padding: 6px;
	cursor: pointer;
	margin: 0 auto;
	font-weight: 700;
	/*box-shadow: 3px 3px 0 0 rgba(0, 0, 0, .2);*/
	width: 100%;
	max-width: 300px;
	box-sizing: border-box;
	text-align: center;
	border-bottom:3px #ac3b25 solid;
  transition:.2s;
}
.btn1:hover {
	color: #FFF;
	background-color: #d94e34;
	border-color: #d94e34;
	transform: translateY(1px) translateX(0);
  -webkit-transform:translateY(1px) translateX(0);
	/*border-bottom-width: 1px;
  border-bottom:none;*/
}
.btn1:hover span.arrow::after {
	border-color: #b0402b;
}
.btn1 span.arrow {
	position: absolute;
	top: 50%;
	left: 6px;
	border-radius: 75pt;
	width: 13px;
	height: 13px;
	aspect-ratio: 1;
	background-color: #fff;
	transform: translateY(-50%) translateX(0);
  -webkit-transform: translateY(-50%) translateX(0);
	margin: -1px 0 0 0px;
	display: none;
}
.btn1 span.arrow::after {
	content: '';
	width: 4px;
	height: 4px;
	border-right: 2px solid #ea5539;
	border-top: 2px solid #ea5539;
	display: inline-block;
	rotate: 45deg;
	position: absolute;
	top: 50%;
	left: 0px;
	transform: translateY(-50%) translateX(0);
  -webkit-transform: translateY(-50%) translateX(0);
}
.btn1 span.ib{
	display: inline-block;
}
.goHowto.btn1 span.ib{
	font-size: 0.79rem;
}
@media screen and (min-width: 360px) {
	.btn1 span.ib{
		font-size: 1.1rem;
	}
	.goHowto.btn1 span.ib{
		font-size: 0.9rem;
	}
}
@media screen and (min-width: 374px) {
	.goHowto.btn1 span.ib{
		font-size: 0.95rem;
		font-size: min( 1.15rem , 3.3vw);
	}
}
.compBoxIn .btn1{
	width: 6.5em;
  padding: 2px;
  font-size: 0.8rem;
  box-shadow: none;
  border: none;
  background-color: #ea5539;
  border-bottom: 2px #ac3b25 solid;
}
.compBoxIn .btn1.disable {
	background: #e8eaed;
  color: #4c4c4c !important;
  border-color: #dfdfdf;
  border-bottom-color: rgb(223, 223, 223);
  border-bottom-color: #ccc;
}

#sideMenu .sideBtn{	
  /*padding: 10px 14px 15px 20px;*/
	padding: 10px 6px 15px 10px;
}
/*@media screen and (min-width: 560px) {
	.btn1 {
		padding: 10px 10px 10px 24px;
		max-width: 370px;
	}
	.btn1 span {
		width: 12px;
		height: 12px;
	}
	.btn1 span::after {
		width: 7px;
		height: 7px;
	}
}*/

#sideMenu.hidden {
  right: -100%;
}

.siteMenu {
  height: calc(100% - var(--headerHeight) / 2 + 5px);
  width: 100%;
  background-color: #f5f5f5;
  font-size: 16px;
  border-top: solid 1px var(--paleGray);

  position: fixed;
  z-index: 10001;
  top: calc(var(--headerHeight) / 2);
  right: 0;

  opacity: 100%;
  transition: all 0.3s ease-in-out;
  overflow-y: scroll;
}

.siteMenu.hidden {
  opacity: 0%;
  pointer-events: none;
  right: -100%;
}

.menuLoading{
  margin: auto;
  position: absolute;
  top: 40%;
  right: 0px;
  left: 0px;
  bottom: 50%;
  opacity: 50%;
  z-index:99999;
  height: 30px;
  width: 30px;
}

.menuLoading.hidden{
  display:none;
}
.siteInfo {
  background-color: #f5f5f5;
  min-height: calc(100vh - 50px);
  padding: 1px;
  animation: siteInfoDisp 0.3s 1 ease-out;
  animation-delay: 0s;
  animation-fill-mode: forwards;
}

@keyframes siteInfoDisp {
  0% {
    opacity:0%;
  }
  100% {
    opacity:100%;
  }
}


.siteInfo.howTo {
  background-color: #f5f5f5;
}

.siteInfo.hidden {
  display: none;
}

h2 {
  font-size: 32px;
  height: 70px;
  position: relative;
  background-color: #ffffff;
  font-weight: bold;
  color: var(--gray);
  text-align: left;
  /* line-height: 130px; */
  border-bottom: solid 1px #ea5539;
  margin-bottom: 20px;
  font-size: min(8vmin,32px);
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  padding: 30px 0;
}

h2.center{
  margin:  0 auto 20px auto;
  text-align: center;
}

.h2ja{

}

.h2Eng{
  font-size: 16px;
  font-size: min(4vmin,16px);
}

h2>.h2Slash{
  margin: 15px;
}

/* h2::after {
  position: absolute;
  left: 0;
  width: 100%;
  height: 10px;
  background-image: repeating-linear-gradient(60deg, #868585 0 1px, transparent 3px 10px);
  content: '';
} */

h2.mini{
  background-color: #FFFFFF;
  height: 50px;
  color: var(--gray);
  line-height: 50px;
  z-index: 99999;
  font-size: 20px;
  font-weight: bold;
  padding: 0 10px;
  margin-right: 5px;
  margin-left: 5px;
}

.h2Eng{
  margin-left:10px;
}

h3{
  color: #505050;
  font-size: 20px;
  position: relative;
  font-weight: bold;
  margin-bottom: 10px;
}

/* h3.center{
  margin:  0 auto;
} */



.h3Alt{
  padding: 0 0 20px 0;
  font-weight: 600;
  display: flex;
  align-items: center;
}

.h3Alt::before{
  content: "";
    display: inline-block;
    width: 5px;
    height: 20px;
    margin-right: 5px;
    background-color: #ea5539;
    border-radius: 10px;
}

.siteTxt{
  margin: 5px 5px 10px 5px;
  color: #717171;
  padding-bottom: 10px;
  background-color: #FFFFFF;
  padding: 20px 10px;
  border-radius: 10px;
  opacity:100%;
  min-height: calc(100vh - 60px - 10px - 50px);

}

.closeButton{
  width: 136px;
  margin: 5px auto;
  height: 50px;
  background-color: #ea5539;
  color: #FFFFFF;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.listDisc>li {
  position:relative;
}

.listDisc>li::before{
  content:"";
  width: 4px;
  height: 4px;
  border-radius: 100%;
  background-color: #717171;
  display: block;
  position: relative;
  bottom: -15px;
  left: -9px;
}


@media screen and (min-width: 1000px) {
  .siteTxt{
    margin:5px auto;
    padding: 20px 50px;
    max-width: 1000px;
    min-height: 90vh;
  }
}

.siteTxt>ol{
  margin-bottom: 20px;
}
.siteTxt>ol>li{
  margin-bottom: 10px;
  padding-left: 10px;
}

.siteTxt>ol ol{
  margin-top: 10px;
}
.siteTxt>ol ol>li{
  margin-bottom: 10px;
  padding-left:10px
}

.siteTxt>ol ol ol{
  margin-bottom: 10px;
  padding-left:10px
}

.siteTxt>ol ol ul{
  margin-bottom: 10px;
  padding-left:20px
}

.siteTxt>ol ol ul>li{
  white-space:normal ;
  word-break: break-all;
}

.discList{
  list-style:disc;
}

.sitePh{
  margin-bottom: 40px;
}

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

.faqList{
  margin-bottom: 40px;
}

.faqItem{
  padding: 10px;
  display: flex;
}

.faqItem:before{
  height: 10px;
  min-width: 30px;
  position: relative;
  line-height: 26px;
  font-size: 26px;
}

.faqItem.Q{
  background-color: #f08875;
  border-top: solid 1px #f08875;
  border-right: solid 1px #f08875;
  border-left: solid 1px #f08875;
  border-radius: 15px 15px 0 0;
  color: #FFFFFF;
  font-weight: bold;
}
.faqItem.Q:before{
  content:"Q.";
  color: #FFFFFF;
}

.faqItem.A{
  border-bottom: solid 1px #f08875;
  border-right: solid 1px #f08875;
  border-left: solid 1px #f08875;
  border-radius: 0 0 15px 15px;
  margin-bottom: 20px;
}

.faqItem.A:before{
  content:"A.";
  color: #ea5539;
  font-weight: bold;
}

.usage{
  max-width: 600px;
  width: 80%;
  margin: 0 auto;
  /* height: calc(100vh - 100px); */
  height: fit-content;
  color: #FFFFFF;

  /* フッターの上の行の高さとh2の高さを引いている */
}

.usage>div{
  height: 100%;
}
.usage .slick-slide p{
	margin-top: 5px;
  font-size: 1.1rem;
	color: #333;
}
.ti-howho{
	text-align: center;
	line-height: 1.3;
}
.ti-howho span{
	/*text-align: left;
	display: inline-block;*/
}

.slick-slide img{
  margin: auto;
}

.slick-prev{
  width: 35px !important;
  height: 35px !important;
  z-index: 9 !important;
  left: -35px !important;
}

.slick-prev:before{
  color: var(--lilPaleGray) !important;
  font-size:35px !important;
}

.slick-next{
  width: 35px !important;
  height: 35px !important;
  right: -35px !important;
}

.slick-next:before{
  color: var(--lilPaleGray) !important;
  font-size:35px !important;
}

.slickCount{
  text-align: center;
  position: relative;
  z-index: 999999;
  width: 80%;
  margin: 0 auto;
  max-width: 600px;
  top: -5px;
}

.countSlash{
  margin:0 5px;
}


.tableWrap{
  margin-inline: auto;
  margin-bottom: 20px;
  overflow-x: auto;
  white-space: nowrap;
  width: fit-content;
  border: solid 1px #ea5539;
  max-width: 100%;
}

.dataImg{
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
  display: block;
  margin-bottom: 40px;
}

@media screen and (min-width: 1000px) {
  .dataImg{
    max-width: 500px;
  }
}

.dataTable{
  border-collapse:separate;
  border-spacing:0;
}

.dataTable tr>*{
  padding: 5px 10px;
  /* background-color: #FFFFFF; */
  border-right: solid 1px #ea5539;
}

.sticky{
  background-color: #fbdbd5;
  position:sticky;
  left:0;
}

.dataTable th{
  border-bottom: solid 1px #ea5539;
  background-color: #f08875;
  color: #FFFFFF;
}

.dataTable td{
  border-bottom:solid 1px #ea5539;
}

.dataTable tr>*:last-child{
  border-right: none;
}

.row1{

}

.row2{

}

.row3{

}

.row4{

}

.contactLinkWrap{
  padding: 10px 0 40px 0;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  min-height: 120px;
  background-color: #FFFFFF;
  max-width: 600px;
  margin: 0 auto;
}

.contactLinkTitle{
  font-weight: bold;
  text-align: left;
  font-size: 18px;
}

.contactLinkTxt{
  font-size: 15px;
  text-align: left;
  padding-bottom: 20px;
}

@media screen and (min-width: 1000px) {
  .contactLinkTxt{
  }
  .contactLink{
  
  }
}

.contactLink{
  display: block;
  text-decoration: none;
  color: #ea5539;
  border-radius: 50px;
  width: 87%;
  height: 50px;
  background-color: #fbdbd5;
  padding: 5px 20px;
  text-align: center;
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
  font-size: min(5vmin,16px);
  max-width: 600px;
  margin: 0 auto;
  /* border: solid 1px #aaaaaa; */
}

.contactLink>span{
  width: 28px;
  height: 28px;
  background-image: url(../img/link.png);
  display: block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  right: -10px;
  filter: brightness(162%);
}

.rentIcon {
  width: 20px;
  height: 20px;
  padding-right: 5px;
}

#marker {
  width: 40px;
  height: 40px;
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 39px;
  margin: auto;
  display: none;
}

#center {
  transition: all 0.3s ease-in-out;
  width: 30px;
  height: 30px;
  background-image: url("../img/cursor.png");
  background-size: contain;

  position: absolute;
  z-index: 9997;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
  pointer-events: none;
}

#center.loading {
  background-image: url("../img/loading.gif");
}

#center.transparent {
  opacity: 30%;
}

.stationName {
  font-weight: bold;
}

#dev {
  padding: 0 10px;
  width: fit-content;
  min-width: 100px;
  height: 200px;
  background-color: #ffffff;
  box-shadow: 0px 3px 5px #0000004f;
  border-radius: 10px 10px 10px 10px;

  display: flex;
  justify-content: center;
  align-items: center;

  position: absolute;
  z-index: 999;
  bottom: 150px;
  left: 0;

  display: none;
}

#footer {
  /* bottom: 0px;
  transform: translateY(90%); */
  width: 100%;
  height: 80%;
  background-color: white;
  /* box-shadow: 0px -1px 5px #00000066; */
  filter: drop-shadow(0px -2px 2px #0000003d);
  position: fixed;
  z-index: 9998;
  /* overflow: hidden; */
  border-radius: 15px 15px 0 0;
}

#footer.loading{
  display:none;
}

#footer.hidden {
  display: none;
}

#footer.expanded{
  background-color: #fff4f0;
}

#footer.expanded {
  /* height: 80%; */
  /* transform: translateY(150px); */
  /* transition: all 0.3s ease-in-out; */
  /* animation-name:footer;
  animation-duration:0.5s;
  animation-fill-mode:forwards; */
}

#footer.animated {
  transition: all 0.3s ease-in-out;
}

@keyframes footer {
  0% {
  }
  100% {
    transform: translateY(0%);
    background-color: red;
    height: 80%;
  }
}

#footer.hidden {
  display: none;
}


.lineDummy {
  height: 14px;
  width: 50px;
  position: absolute;
  bottom: 95px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 0;
  pointer-events: none;
}

.menu {
  height: calc(100% - 20px);
  max-height: 94px;
  width: calc(100% - 20px);
  display: flex;
  justify-content: space-between;
  padding-right: 10px;
  padding-left: 10px;
  transition: all 0.3s ease-in-out;
  padding-top: 15px;
}
@media screen and (max-width: 400px) {
  .menu {
    width: calc(100% - 10px);
		padding-right: 5px;
    padding-left: 5px;
  }
}
@media screen and (max-width: 360px) {
  .menu {
    width: calc(100% - 6px);
		padding-right: 3px;
    padding-left: 3px;
  }
}


.subMenu {
  /*padding-top: 15px;*/
	padding: 15px 5px 0;
  display: flex;
  justify-content: space-between;
  user-select: none;
  pointer-events: none;
  border-bottom: solid 6px #FFFFFF;
}

/*.subMenuButton {
  font-size: 16px;
  color: #484848;
  width: 49%;
  height: 30px;
  border: none;
  background-color: white;
  padding: 0;
  margin: 0;
  pointer-events: all;
  border-radius: 10px 10px 0 0;
  cursor: pointer;
  box-shadow: 0px -2px 2px 0px #00000011;
}
.subMenuButton.disable {
  background-color: #f08875;
  color: #FFFFFF;
  border-bottom: none;
}*/
.subMenuButton {
  width: 49%;
  height: 30px;
  padding: 0;
  margin: 0;
  pointer-events: all;
	border-radius: 5px;
	cursor: pointer;
	background: #e8eaed;
  background: linear-gradient(to bottom, #cc3d33 0%,#ea5539 20%,#ea5539 100%);
	border: 1px #ea5539 solid;
	color: #fff;
}
.subMenuButton.disable {
	background: #e8eaed;
  color: #4c4c4c;
  border-color: #dfdfdf;
  border-bottom-color: rgb(223, 223, 223);
  border-bottom-color: #ccc;
}

/* #detailButton{
  border-radius: 10px 0px 0 0;
}
#favInfoButton{
  border-radius: 0px 10px 0 0;
} */

.menu.hidden {
  /* display: none; */
  opacity: 0%;
  height: 0px;
  user-select:none;
  pointer-events:none;
  padding-top: 0;
}

.menu.hidden>.box>.button{
  user-select:none;
  pointer-events:none;
}

.leftMenu {
  height: 100%;
  width: 65%;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.box {
	width: calc(100% / 6 - 7px);
  text-align: center;
  user-select: none;
  pointer-events: none;
}

.box:last-child {
  padding-right: 0;
}

.box .button {
  width: 43px;
  height: 43px;
  border-radius: 5px;
  border: solid 1px var(--lilPaleGray);
  /* filter: brightness(200%);
    filter:  saturate(0%); */

  display: inline-block;

  border-radius: 100%;
  /* border-bottom:solid 3px #aaaaaa; */
  color: #fff;
  cursor: pointer;
  text-decoration: none; /* 文字の下線を消す */
  /* transform:translateY(-1px);*/
  pointer-events: all;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}
.box.marL{
	margin-left: 32px;
}
.box.marR{
	margin-right: 32px;
}

.slide {
  width: 100%;
  height: 0px;
  padding: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.line {
  height: 14px;
  border-radius: 5px 5px 0 0;
  width: 55px;
  background-image: url(../img/arrow_top_alt.png?v);
  background-size: 17px;
  background-repeat: no-repeat;
  background-position: bottom;
  background-color: #ffffff;
  position: relative;
  top: -6px;
  cursor:pointer;
  z-index:1000
}
.line.expanded {
  transform: rotate(180deg);
  background-position: top;
  border-radius: 0px 0px 5px 5px;
  background-color: #fff4f0;
  background-image: url(../img/arrow_top_active.png?v);
}
.eye{
	position: absolute;
	width:  42px;
	text-align: center;
	color: #ea5539;
	letter-spacing: -1px;
	top: 35px;
  left: 50%;
  transform: translateY(0) translateX(-50%);
  -webkit-transform: translateY(0) translateX(-50%);
	height: 47px;
}
.eye img{
	width: 40px;
}
.eye .boxAdd{
	position: absolute;
	bottom: 0;
}
.line.expanded .eye{
	display: none;
}

@media screen and (max-width: 450px) {
  .box .button {
    width: 36px;
    height: 36px;
  }
	.box.marL{
		margin-left: 28px;
	}
	.box.marR{
		margin-right: 28px;
	}
	.eye{
		top: 32px;
		height: 44px;
	}
	.eye img{
		width: 34px;
	}
}
@media screen and (max-width: 300px) {
  .box .button {
    width: 33px;
    height: 33px;
  }
	.eye{
		top: 26px;
		height: 40px;
	}
}

.box.shopping .button img {
}


.box .button.active {
  /* filter: brightness(100%);
    filter:  saturate(100%);
    transform:translateY(0px); */
    box-shadow: 0px 1px 1px 0px #00000022 inset;
}

.button.disable{
  pointer-events:none;
}


.box .menuboxDetailbutton.disable {
  pointer-events: none;
}

.boxDetail {
  height: 12px;
  font-size: 12px;
  white-space: nowrap;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
  line-height: 12px;
  margin-top: 2px;
}

/* .hazard .boxDetail{
  font-size: min(2vmin,12px);
} */

.box.commingSoon .boxDetail{
  font-size: 10px;
}


@media screen and (max-width: 300px) {
  .boxDetail {
    font-size: 10px;
    transform: scale(90%);
  }

}
@media screen and (min-width: 300px) {
  br.sp{
    display: none;
  }
}

.boxAdd {
  margin-top: 2px;
  font-size: 10px;
  white-space: nowrap;
  user-select: none;
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
  transform: scale(90%);
}
br.ssp,br.sssp{
	display: none;
}
@media screen and (max-width: 360px) {
  br.ssp{
    display: inline;
  }
}
@media screen and (max-width: 340px) {
  .boxAdd {
    letter-spacing: -1px;
  }
  br.sssp{
    display: inline;
  }
}
@media screen and (max-width: 300px) {
  .boxAdd {
    transform: scale(78%);
  }
}

.button.menuRent {
  background-image: url("../img/menuRent.png");
  background-size: contain;
}

.button.menuRent.active {
  /* background-image: url("../img/detail_station_white.png"); */
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
}

.button.menuRent.disable {
  background-image: url("../img/menuRent.png");
  border: solid 1px var(--lilPaleGray);
  filter: saturate(0%);
}

.button.station {
  background-image: url("../img/detail_station.png");
  background-size: contain;
}

.button.station.active {
  /* background-image: url("../img/detail_station_white.png"); */
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
}

.button.station.disable {
  background-image: url("../img/detail_station.png");
  background-color: #ffffff;
  border: solid 1px #ffffff00;
  filter: saturate(0%);
  box-shadow: 0px 1px 1px 0px #00000000 inset;
}

.button.shopping {
  background-image: url("../img/button_shopping_mono.png");
  background-size: contain;
}

.button.shopping.active {
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
}

.button.shopping.disable {
  background-color: #ffffff;
  border: solid 1px #ffffff00;
  filter: saturate(0%);
  box-shadow: 0px 1px 1px 0px #00000000 inset;
}

.button.security {
  background-image: url("../img/police.png");
  background-size: contain;
}

.button.security.active {
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
  /* background-image: url("../img/detail_security_white.png");
    background-color:var(--paleGray) ;
    border: solid 1px var(--lilPaleGray); */
}

.button.security.disable {
  background-color: #ffffff;
  border: solid 1px #ffffff00;
  filter: saturate(0%);
  box-shadow: 0px 1px 1px 0px #00000000 inset;
}

.button.hazard {
  background-image: url("../img/detail_hazard2.png");
  background-size: contain;
  background-position: bottom 2px right 0;
}

.button.hazard.active {
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
}

.button.hazard.disable {
  border: solid 1px var(--lightGray);
  filter: saturate(0%);
  box-shadow: 0px 1px 1px 0px #00000000 inset;
}

.button.park {
  background-image: url("../img/children.png");
  background-size: contain;
}
.button.park.active {
  background-color: var(--paleGray);
  border: solid 1px var(--lilPaleGray);
}
.button.park.disable {
  background-color: #ffffff;
  border: solid 1px #ffffff00;
  filter: saturate(0%);
  box-shadow: 0px 1px 1px 0px #00000000 inset;
}

/* 昨日未実装のボタンからはborderをはずす */
.box:nth-child(4) > .button{
  border: 1px solid #37373700;
  pointer-events: none;
}
.box * {
  text-align: center;
}

.leftMenuIcon {
  width: 100%;
}

.rightMenu {
  height: 100%;
  width: 35%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  font-size: 1rem;
}

@media screen and (max-width: 300px) {
  .leftMenu {
    width: 72%;
  }
  .rightMenu {
    width: 28%;
  }
}

.rightMenuWrap {
  height: 50%;
  width: 100%;
  /* border: solid 1px var(--lightGray);
    border-radius:25px; */
  padding: 10px 10px 25px 0;
}

.rightMenuTitle {
}

.rightMenuAmountWrap {
  transform: translateY(-3px);
}

.rightMenuWrap > p {
  text-align: center;
  height: fit-content;
}

.rightMenuRent {
  font-size: 200%;
}

.detail {
  height: calc(100% - 20px - 152px);
  position: relative;
  border-top: 1px solid var(--paleGray);
  border-bottom: 1px solid var(--paleGray);
  font-size: 12px;
  /* transition: all 3s ease-in-out; */
  background-color: #FFFFFF;
}

.detail.hidden {
  height: 0%;
  opacity: 0%;
  padding: 0;
  border: none;
}

.scrollIconTop {
  width: 40px;
  position: absolute;
  top: 0px;
  right: 0;
  left: 0;
  margin: auto;
  transition: all 0.3s ease-in-out;
  opacity: 100%;
}
.scrollIconTop.hidden {
  opacity: 0%;
}
.scrollIconTop.disable {
  display: none;
}

.detailWrap {
  height: 100%;
  overflow-y: scroll;
}

.detailBox {
  padding: 5px 0;
  display: flex;
  justify-content: space-between;
  height: fit-content;
  min-height: 60px;
  height: fit-content;
  align-items: center;
}

.detailType {
  height: 100%;
  width: 19%;
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 300px) {
  .detailType {
    font-size: 10px;
  }
}

.detailMenuIcon {
  width: 75%;
  max-width: 40px;
  max-height: calc(100% - 1.7em);
}
.detailMenuIcon > img {
  max-height: calc(100%);
}

.detailType > p {
  text-align: center;
}

.detailTitle {
  height: 1.5em;
  font-size: 11px;
}

.detailContent {
  width: 79%;
}

.detailContent.hidden{
  display:none;
}

.detailHelp{
  width: 79%;
  color:#8d8d8d
}

.detailHelp.hidden{
  display:none;
}

.longLine {
  height: 1px;
  width: auto;
  background-color: var(--paleGray);
  border-radius: 2px;
}

#mapInfo > p {
  text-align: center;
}

.scrollIconBottom {
  width: 40px;
  position: absolute;
  bottom: 5px;
  right: 0px;
  left: 0px;
  margin: auto;
  transition: all 0.3s ease-in-out;
  opacity: 100%;
}

.scrollIconBottom.hidden {
  opacity: 0%;
}

.scrollIconBottom.disable {
  display: none;
}

.favInfo {
  position: relative;
  /* transition: all 3s ease-in-out; */
  height: calc(100% - 20px - 152px);
  position: relative;
  border-top: 1px solid var(--paleGray);
  border-bottom: 1px solid var(--paleGray);
  background-color: #FFFFFF;
}

.favInfo.hidden {
  height: 0%;
  opacity: 0%;
  padding: 0;
  border: none;
}

.favInfoWrap {
  height: 100%;
  overflow-y: scroll;
}

.favInfoBox {
  /* display: flex;
  justify-content: space-between; */
  height: fit-content;
  min-height: 60px;
  max-height:150px;
  position:relative;
  transition: all 0.3s ease-in-out,opacity 0.1s ease-in-out;
  opacity: 100%;
}

.favInfoBox.hidden{
  opacity: 0%;
  max-height:0px;
  min-height:0px;
}

.highWrap{
  display: flex;
  min-height: 77px;
}

.wrap1 {
  width: 18%;
  align-items: center;
  padding: 5px 0;
  display: flex;
  justify-content: space-between;
}
.wrap2 {
  width: 80%;
  align-items: center;
  padding: 5px 0;
  display: flex;
  justify-content: space-between;
  cursor:pointer;
}

.favInfoIcon {
  height: 100%;
  width: 100%;
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  
}
.favInfoMaru {
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  background-image: url(../img/favo.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  width: 45px;
  height: 45px;
  margin: auto;
  cursor:pointer;
}

.favInfoMaru.disable {
  background-image: url(../img/favo_disable.png);
}

.favInfotxt {
  width: 82%;
}

.favInfotxt .station{
  font-size: 14px;
}

.favInfotxt .address{
  font-size: 12px;
}

.favInfotxt .single_rent{
  font-size: 10px;
}

.favInfotxt .family_rent{
  font-size: 10px;
}

.favInfoNoneWrap{
  display: flex;
  margin-top: 50px;
  align-items:center;
  justify-content: center;
}

.favInfoNoneIcon{
  background-image: url(../img/favo_disable.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  width: 35px;
  height: 35px;
  position: relative;
  top: -2px;

}

.favInfoNoneTxt {
  text-align: center;
}

.favInfoArrow {
  width: 18%;
}
.favInfoArrow img {
  display: block;
  max-width: 25px;
  margin: auto;
}

.favInfoDelete{
  height: 100%;
  width: 100%;
  position: absolute;
  background-color: #ffffffe6;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
}

.favInfoDelete.transparent{
  opacity:0%;
  pointer-events:none;
}

.favInfoDeleteWrap{
  width: 100%
}

.favInfoDeleteTxt{
  text-align: center;
}

.favInfoDeleteButtonWrap{
  display: flex;
  justify-content: center;
}

.favInfoDeleteButton{
  margin: 5px 15px;
  width: 90px;
  height: 36px;
  border-radius: 8px;
  border: none;
  font-size:13px;
  cursor:pointer;
}

.favInfoDeleteButton.yes{
  background-color: #F08875;
  color: #ffffff;
}

.favInfoDeleteButton.cancel{
  background-color: #e8eaed;
  color: #4c4c4c;
}

.fixBtAdd{
  height: var(--adHeight);
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 10000;
	background: #fff;
	display: none;
  justify-content: center;
  align-items: center;
}
.fixBtAdd #ad{
	display: none;
}
#ad {
  height: var(--adHeight);
  width: 100%;
  /* margin: 0px auto 0px auto; */
  cursor: pointer;
  /* transition: all 0.3s ease-in-out; */
  background-color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
	position: relative;
}

#ad.hidden {
  display: none;
}

#ad > p {
  text-align: center;
}
#ad::before,.fixBtAdd::before,.searchByAdd::before{
	content: '<PR>';
	position: absolute;
	left: 50%;
	top: -0.8rem;
	padding: 1px 2px;
	font-size: 12px;
	color: #8d8d8d;
  max-width: 320px;
  width: 100%;
  text-align: left;
  transform: translateX(-50%) translateY(0);
  -webkit-transform: translateX(-50%) translateY(0);
	text-shadow: 3px 3px 2px #fff,-3px 3px 2px #fff,-3px -3px 0 #fff,3px -3px 0 #fff;
}
.fixBtAdd::before{
	text-decoration: none;
	z-index: 1;
}
.fixBtAdd::after{
	content: '';
	position: absolute;
	left: 0;
	top: -0.6rem;
	background: #fff;
	width: 100%;
	height: 1.5em;
	z-index: -1;
}
/*.capAd{
	position: absolute;
	left: 0;
	top:0 ;
	padding: 1px 2px;
	background: #fff;
	font-size: 12px;
}*/

.adLink{
  max-width: 320px;
  width: 100%;
  margin: 0 auto;
  display: block;
}

.aspWrap{
  width: 100%;
  max-width: 320px;
  max-height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

/* The popup bubble styling. */
.popup-bubble {
  font-size: 10px;
  text-align: center;
  font-weight: bold;
  /* Position the bubble centred-above its parent. */
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-50%, 10%);
  /* Style the bubble. */
  padding: 5px;
  border-radius: 5px;
  font-family: sans-serif;
  max-height: 60px;
  pointer-events: none;
}

/* カスタムポップアップ 見た目調整 */

.popup-bubble > div:nth-child(1) {
  -webkit-text-stroke: 2px #fff;
  color: #fff;
  position: relative;
  z-index: 9999;
}

.popup-bubble > div:nth-child(2) {
  position: absolute;
  z-index: 10000;
  top: 5px;
}

.station_minutes_map {
  line-height: 0;
  width: 100%;
  white-space: nowrap;
  position: absolute;
  margin: auto;
  text-align: center;
  top: -18px;
  left: 0px;
  font-size: 12px;
  filter: drop-shadow(1px 1px 2px #00000000);
  -webkit-text-stroke: 0px #fff;
  z-index: -200;
}

.text_map.no1 {
  filter: drop-shadow(1px 1px 2px #0000003d);
}

.text_map.hidden {
  display: none;
}

.station_minutes_map:nth-child(2) {
  display: none;
  filter: drop-shadow(none);
}

.station_minutes_map:nth-child(2) {
  display: none;
}

.station_minutes_map > span {
  font-size: 10px;
}
.popup-bubble.station {
  z-index: -999;
}
.popup-bubble.shopping {
  z-index: -1000;
}

.popup-bubble.hidden {
  display: none;
}

.popup-bubble.hidden > div {
  display: none;
}

/* The parent of the bubble. A zero-height div at the top of the tip. */
.popup-bubble-anchor {
  /* Position the div a fixed distance above the tip. */
  position: absolute;
  width: 100%;
  bottom: 8px;
  left: 0;
}

/* This element draws the tip. */
.popup-bubble-anchor::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  /* Center the tip horizontally. */
  transform: translate(-50%, 0);
  /* The tip is a https://css-tricks.com/snippets/css/css-triangle/ */
  width: 0;
  height: 0;
  /* The tip is 8px high, and 12px wide. */
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}

/* JavaScript will position this div at the bottom of the popup tip. */
.popup-container {
  cursor: auto;
  height: 0;
  position: absolute;
  /* The max width of the info window. */
  width: 200px;
}

.labels {
  font-size: 14px;
  width: 200px;
  font-weight: bold;
  pointer-events: none;
  transform:scale(0.9);
}

.labels > p {
  margin: 0 auto;
  width: fit-content;
  margin-bottom: 10px;
  position: relative;
  top: 18px;
  background-color: #FFFFFF;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 100%;
  border: solid 3px #004a9f;
  text-align: center;
}

.labels > p > span {
  font-size: 10px;
}

.labels > div {
  position: relative;
  top: 13px;
}

.labels > div > .text_map.no1 {
  font-size: 12px;
  -webkit-text-stroke: 2px #fff;
  color: #fff;
  position: relative;
  text-align: center;
  z-index: 996;
  filter: drop-shadow(1px 1px 2px #0000003d);
  white-space:nowrap;
}

.labels > div > .text_map.no2 {
  font-size: 12px;
  text-align: center;
  position: relative;
  z-index: 997;
  bottom: 18px;
  white-space:nowrap;
}

.labels > div > .text_map.no2.android {
  bottom: 19px;
}

.labels > div > .text_map.no2.ios {
  bottom: 19px;
}

.popup-bubble > div:nth-child(2) {
  text-align: center;
  position: absolute;
  z-index: 10000;
  top: 5px;
}

.station_minutes_map {
  line-height: 0;
  width: 100%;
  white-space: nowrap;
  position: absolute;
  margin: auto;
  text-align: center;
  top: -18px;
  left: 0px;
  font-size: 12px;
  filter: drop-shadow(1px 1px 2px #00000000);
  -webkit-text-stroke: 0px #fff;
  z-index: -200;
}

/* Googlemap表示部微調整 */

/* .gmnoprint{
    transform: translateY(-6px);
}

.gm-svpc{
    transform: translateY(-6px);
} */

.gm-style-cc {
  transform: translateY(-6px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-address {
  transform: translate(0, 10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-marker-icon {
  transform: translateY(-10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-address-link {
  transform: translateY(-10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-container {
  transform: translateY(10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-fullscreen-control {
  transform: translateY(10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-vertical-separator {
  transform: translateY(-10px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

/* 地図切替ボタン調整 */
.gm-style-mtc:nth-of-type(1) > button {
  border-radius: 20px 0 0 20px !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 16px;
}

.gm-style-mtc:nth-of-type(2) > button {
  border-radius: 0 20px 20px 0 !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 16px;
}

.gm-style-mtc > ul,
.gm-style-mtc > ul > li {
  border-radius: 20px !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

/* ペグマンボタン調整 */
.gm-svpc {
  border-radius: 100% !important;
  left: -9px !important;
  width: 45px !important;
  height: 45px !important;
}

/* ストリートビュー戻るボタン調整 */
.gm-iv-container {
  background-color: #ffffff;
  width: 60px;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-back {
  filter: brightness(50%);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-back::after {
  display: inline-block;
  font-weight: bold;
  width: 50px;
  height: 50px;
  background-image: none;
  text-align: center;
  vertical-align: middle;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-iv-back::before {
  content: "戻る";
  display: block;
  width: 50px;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  transform: translate(10px, -3px);
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gm-style-mtc > button {
  padding: 0 10px !important;
  font-size: 14px !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}
.gm-style-mtc > ul > li {
  font-size: 14px !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}

.gmnoprint > div:has(.gm-control-active) {
  border-radius: 15px !important;
  font-family: Roboto, Noto Sans JP, Arial, sans-serif !important;
}


.rankingTabBox{
	gap: 5px;
}
.rankingTabBox .searchTab{
	height: 40px;
  text-align: center;
}
.tabContents{
	padding: 20px;
	width: 100%;
  box-sizing: border-box;
}
.tabContent.disable{
	display: none;
}
.tabContent .searchTitle{
}
.tabContent .searchBoxCon{
	margin: 0 0 12px 0px;
  position: relative;
}
.tabContents .tabContent:last-child .searchBoxCon{
	
}
.searchBoxCon p{
	margin-top: 10px;
	font-size: 84%;
}
.ranking li{
	display:-webkit-box;
	display:flex;
	justify-content: space-between;
	position: relative;
	margin-bottom: 5px;
}
.ranking li::after{
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	height: 1px;
	border-bottom: 1px #666 dotted;
}
.ranking .grow1,
.ranking .grow2{
	display: inline-block;
	padding: 0 5px;
	background: #fff;
	position: relative;
  z-index: 1;
}
.ranking .grow2{
	font-size: 10px;
  white-space: nowrap;
}
.ranking .grow2 .nm{
	font-size: 12px;
  letter-spacing: -0.5px;
}
.ranking .grow1 a{
	margin-left: 10px;
	color: #EA5539;
	text-decoration: underline;
}
.ranking li:nth-of-type(1) .grow1 a{ color: #881600;}
.ranking li:nth-of-type(2) .grow1 a{ color: #A5250D;}
.ranking li:nth-of-type(3) .grow1 a{ color: #B92C12;}
.ranking li:nth-of-type(4) .grow1 a{ color: #D13D21;}
.ranking li:nth-of-type(5) .grow1 a{ color: #DB3E20;}

.ranking li:nth-of-type(n+10) .grow1 a{
	margin-left: calc(10px - .5em);
}
@media screen and (max-width: 375px) {
	.ranking .grow1 a.eki1{
		max-width: 5.7em;
		display: inline-block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		vertical-align: middle;
	}	
}
@media screen and (max-width: 374px) {
	.ranking .grow1 a.eki1{
		max-width: 4.8em;
	}	
}

.ekiName{
	display:-webkit-box;
	display:flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.ekiName input[type=text]{
	width: calc(100% - 74px);
  border-radius: 5px;
}
.ekiName button{
	width: 52px;
	white-space: nowrap;
}
.ekiDist{
	/*margin:-20px 0 13px;乗換入力欄アリの場合*/
	margin:0px 0 13px;
}
.ekiDist > div{
	display:-webkit-box;
	display:flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 2px
}
.ekiDist .station{
	/*width: 35%;乗換入力欄アリの場合*/
	width: 52%;
}
.ekiDist .kara{
	width: 3em;
	/*margin-bottom: 5px;*/
	text-align: center;
}
.ekiDist .od{
	/*width: 27%;乗換入力欄アリの場合*/
	width: 30%;
}
.trans_num{
	width: calc(38% - (3em + 8px));
	text-align: right;
}
.trans_num .label,
.trans_num .transfer{
	width: 100%;
	max-width: 84px;
}
.trans_num .label{
	float: right;
}


.onMapBtn-area{
	position: absolute;
  top: 5px;
  right: 0;
}
.onMapBtn{
	width: 6.5em;
  box-shadow: none;
  padding: 2px;
  font-size: 0.8rem;
  display: inline-block;	
  border: none;
	background-color: #ea5539;
	border-bottom: 2px #ac3b25 solid;
	transition: .2s;
}
.onMapBtn:hover{
	transform: translateY(1px) translateX(0);
	-webkit-transform: translateY(1px) translateX(0);
	border-bottom: none;
}
.pos-rela{
	position: relative;
}

input[type="radio"] {
  position: relative;
  width: 16px;
  height: 16px;
  border: 1px solid var(--lilPaleGray);
  border-radius: 50%;
  vertical-align: -2px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
	vertical-align: sub;
}

input[type="radio"]:checked:before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ea5539;
  content: '';
}

.usage_index{
	background: #eee;
  padding: 10px;
}
.usage_index p{
	margin-bottom: 5px;
}
.usage_index li{
	margin-bottom: 10px;
	font-size: 1rem;
}
.usage_index li a{
	color: #333;
	text-decoration: underline;
}
.usage_index ul.collapsed li:nth-child(n+4) {
    display: none;
}
.usage_index .btn_index{
	font-size: 1rem;
	text-decoration: underline;
	margin-top: 10px;
}
#usageScroll > div{
	margin-top: 40px;
	text-align: center;
}
#usageScroll > div img{
	max-width: 500px;
}
#usageScroll h3{
	text-align: left;
	padding-left: 10px;
}
#usageScroll h3::before{
content: '';
  left: 0;
  top: 0;
  height: 100%;
  width: 4px;
  border-radius: 8px;
  background: #ea5539;
  display: inline-block;
  position: absolute;
}
#pageTopBtn {
    position: fixed; /* 画面に固定 */
    bottom: 20px;    /* 下から20px */
    right: 20px;     /* 右から20px */
    z-index: 1000;   /* 他の要素より手前に表示 */
    width: 50px;     /* ボタンの幅 */
    height: 50px;    /* ボタンの高さ */
    background-color: rgba(0, 0, 0, 0.6); /* 背景色（半透明の黒） */
    border-radius: 5px; /* 角を丸める */
    display: flex;   /* flexboxを使って中央寄せ */
    justify-content: center; /* 水平方向の中央寄せ */
    align-items: center;     /* 垂直方向の中央寄せ */
    cursor: pointer;         /* カーソルをポインターに */
    transition: background-color 0.3s ease; /* ホバー時のトランジション */
}

/* ホバー時の背景色変更 */
#pageTopBtn:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

/* 三角形のアイコンをCSSで作成 */
#pageTopBtn a {
    display: block; /* リンク全体をブロック要素に */
    width: 0;
    height: 0;
    border-left: 10px solid transparent; /* 左の辺 */
    border-right: 10px solid transparent; /* 右の辺 */
    border-bottom: 15px solid #fff;      /* 下の辺（上向きの三角形を作るために使用） */
    transform: translateY(2px); /* 垂直方向の微調整（中央寄せのため） */
}
/*駅勢圏情報 タイル表示*/
/*.ekiSeiken-on .gm-style-iw-tc,
.ekiSeiken-on .gm-style-iw-chr{
	display: none;
}
.ekiSeiken-on .gm-style .gm-style-iw-c{
	padding: 12px !important;
  box-shadow: none;
  background: #004AA0;
	border-radius: 0;
}
.ekiSeiken-on .gm-style .gm-style-iw-c h3{
	margin-bottom: 0;
	color: #fff;
	font-size: 13px;
}
.ekiSeiken-on .gm-style .gm-style-iw-c h3 span{
	font-size: 13px;
	font-weight: normal;
}*/

.pac-container{
	z-index: 100000;
}
.childEx{
	position: absolute;
	z-index: 998;
	font-size: 10px;
	left: 7px;
	/*top: calc(var(--headerHeight) + 48px);*/
	top: 50px;
	padding: 5px 10px;
  min-width: 50px;
  background-color: #ffffff;
  box-shadow: 0px 3px 5px #0000004f;
  filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, 0.3));
	border-radius: 10px;
	display: none;
}
.childEx ul{
	
}
.childEx li{
	/*margin-bottom: 2px;*/
}
.childEx li img{
	max-width: 22px;
	vertical-align: middle;
	display: inline-block;
}
.childEx li span{
	padding-left: 1em;
	position: relative;
}
.childEx li span::after{
	content: '';
  width: 1em;
  height: 1px;
  background: #ccc;
  position: absolute;
  top: 50%;
  left: 0;
  border-top: 1px #666 dotted;
}