/* splash **************************************************/
.splash .splashContent {
  position: relative;
  display: block;
  height: 100vh;
  background-color: #009E96;
}

h1 {
  padding-top: 123px;
  padding-bottom: 61px;
}

h1 img {
  display: block;
  margin: 0 auto;
}

h1 img.logo {
  width: 80px;
  padding-bottom: 20px;
}

.loadingWrap {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto;
}

.loadingWrap img {
  width: 60px;
}

.logoCompany {
  position: absolute;
  bottom: 40px;
  left: calc(50% - 25px);
  display: block;
}

/* 横向き対応 */
@media screen and (orientation: landscape) {
  /* スプラッシュ画面の横向き対応 */
  .splash .splashContent {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    padding: 0 5%;
    height: 100vh;
  }
  
  .splash h1 {
    padding-top: 0;
    padding-bottom: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  
  .splash .loadingWrap {
    flex: 1;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .splash .logoCompany {
    position: absolute;
    bottom: 20px;
    left: calc(50% - 25px);
  }
  
  /* 共通の横向き対応スタイル */
  header {
    height: var(--landscape-header-height);
  }
  
  .headerWrap {
    display: flex;
    align-items: center;
    height: 100%;
  }
  
  /* メニューとコンテンツエリアの横並び */
  .map .wrapper {
    display: flex;
    flex-direction: row;
  }
  
  /* マップエリアの横向き対応 */
  .map .mapContentWrap {
    height: var(--landscape-content-height);
    min-height: 300px; /* 最小高さを設定 */
    width: 100%;
  }
  
  /* 地図コンテナの横向き対応 */
  .map-landscape {
    width: 100% !important;
    height: 100% !important;
    min-height: 300px !important;
  }
  
  /* ナビゲーションバーの位置調整 */
  .map .mapNav {
    max-width: 500px;
    margin: 0 auto;
  }
  
  /* モーダルウィンドウの調整 */
  .mapModal {
    max-width: 80%;
    max-height: 80%;
    margin: auto;
  }
  
}

/* terms **************************************************/
/* .terms .wrapper {
  padding-top: 66px;
} */
.terms .wrapper iframe {
  width: 100%;
}

/* .terms .termsContent {
  padding: 0 45px;
}
.terms .termsContent .termsDescriptionWrap .termsDescriptionTitle {
	padding-bottom: 13px;
	font-size: 16px;
	font-weight: 700;
}
.terms .termsContent .termsDescriptionWrap .termsDescriptionText {
	padding-bottom: 33px;
}
.terms .termsContent dl.termsTextWrap {
	padding-bottom: 13px;
}
.terms .termsContent dl.termsTextWrap:last-child {
	padding-bottom: 20px;
}
.terms .termsContent dl.termsTextWrap dt {
	font-weight: 700;
}
.terms .termsContent .termsBottomDate {
	padding-bottom: 20px;
	text-align: right;
} */
.terms .agreeBtnWrap {
  display: none;
}

/* terms agree**************************************************/
.terms.agree .wrapper {
  padding-bottom: 102px;
}

.terms.agree .agreeBtnWrap {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 82px;
  text-align: center;
  background-color: #ffffff;
  box-shadow: 0px -1px 4px #00000029;
  z-index: 10;
}

.terms.agree .agreeBtnWrap:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.terms.agree .agreeBtnWrap .btn.agreeBtn {
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  background-color: #009E96;
}


/* login**************************************************/
.login .loginContentWrap {
  padding: var(--sat) 45px;
}

.login .loginContentWrap h1 {
  padding: 44px 0 40px;
  text-align: center;
}

.login .loginContentWrap h1 img {
  display: inline-block;
  width: 175px;
}

.login .loginContentWrap .loginContent {
  padding-bottom: 30px;
  border-bottom: solid 1px #B1B1B1;
}

.login .loginContentWrap .loginContent .loginInputWrap {
  padding-bottom: 30px;
}

.login .loginContentWrap .loginContent .loginInputWrap dl {
  padding-bottom: 11px;
}

.login .loginContentWrap .loginContent .loginInputWrap dl:last-of-type {
  padding-bottom: 0;
}

.login .loginContentWrap .loginContent .loginInputWrap dl dt {
  padding-bottom: 5px;
  font-size: 13px;
}

.login .loginContentWrap .loginContent .loginInputWrap dl dd input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 10px;
  font-size: 15px;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.login .loginContentWrap .loginContent .loginInputWrap .error {
  padding-top: 5px;
}

.login .loginContentWrap .loginContent .loginBtnWrap {
  padding-bottom: 15px;
  text-align: center;
}

.login .loginContentWrap .loginContent .loginBtnWrap .btn.loginBtn {
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  background-color: #009E96;
}

.login .loginContentWrap .loginContent .loginCheckWrap {
  padding-bottom: 20px;
  text-align: center;
}

.login .loginContentWrap .loginContent .loginCheckWrap label {
  text-align: center;
}

.login .loginContentWrap .loginContent .loginCheckWrap label input {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px 0 0;
  appearance: none;
  vertical-align: middle;
  background-image: url("../img/icn_checkbox.svg");
  background-repeat: no-repeat;
  background-position: center;
  -webkit-appearance: none;
  border-width: 0;
}

.login .loginContentWrap .loginContent .loginCheckWrap label input:checked {
  background-image: url("../img/icn_checkbox_on.svg");
}

.login .loginContentWrap .loginContent .textLinkWrap {
  display: flex;
  justify-content: center;
}

.login .loginContentWrap .loginContent .textLinkWrap span {
  padding: 0 5px;
  color: #009E96;
}

.login .loginContentWrap .loginContent .textLinkWrap .textLink {
  color: #009E96;
}

.login .loginContentWrap .signUpContent {
  padding: 20px 0 70px;
}

.login .loginContentWrap .signUpContent p {
  padding-bottom: 20px;
}

.login .loginContentWrap .signUpContent .signUpBtnWrap {
  text-align: center;
}

.login .loginContentWrap .signUpContent .signUpBtnWrap .signUpBtn {
  font-size: 15px;
  font-weight: 500;
  color: #009E96;
  border: solid 1px #009E96;
}

/* modal */
/* vehicleIdModal */
.login .modal.vehicleIdModal .modalContent.modalMessage .modalBtnWrap {
  padding-bottom: 10px;
}

.login .modal.vehicleIdModal .modalContent.modalMessage p .emphasisText {
  color: #E80000;
}

/* paidContractModal */
.modal.paidContractModal .modalContent.modalMessage h3 {
  padding-bottom: 5px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
}

.modal.paidContractModal .modalContent.modalMessage p {
  text-align: left;
}

.modal.paidContractModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

/* map **************************************************/
#compass {
  position: absolute;
  top: calc(60px + var(--sat));    left: 20px;
  width: 30px;    height: 30px;
  z-index: 20;
}

#compass-img {
  pointer-events: none;
  position: absolute;
  top: 0px;    left: 0px;
  width: 100%;
  height: 100%;
  transform-origin: center; /* 回転の中心を中央に設定 */
  transform: rotate(0deg); /* 初期状態の角度 */
  z-index: 10;
}

.map .mapContentWrap .searchContentWrap {
  position: fixed;
  top: calc(10px + var(--sat));
  left: 10px;
  right: 10px;
  height: 40px;
  box-sizing: border-box;
  z-index: 16777282;
}

/* 丸角の下側に被せるオーバーレイ（検索ボックス側） */
/* 検索ボックス側オーバーレイは使用しない（モーダル側キャップで対応） */

/* 横向き時は右寄せ・幅3/5（右サイドバー考慮） */
@media screen and (orientation: landscape) {
  .map .mapContentWrap .searchContentWrap {
    left: 10px;
    right: auto;
    width: 60%; /* 3/5 */
    /* 検索ボックスの角の上に白が見えないように前面へ出す */
    z-index: 16777283;
  }
}

.map .mapContentWrap .searchContentWrap .searchWrap {
  position: relative;
  display: block;
}

.map .mapContentWrap .searchContentWrap .searchWrap:before {
  content: "";
  position: absolute;
  top: 12px;
  left: 20px;
  width: 16px;
  height: 16px;
  background-image: url("../img/icn_search.svg");
  background-size: 16px;
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .searchContentWrap .searchWrap input {
  width: 100%;
  height: 40px;
  padding: 9px 11px 11px 51px;
  border-radius: 40px;
  box-sizing: border-box;
  border: solid 1px #ffffff;
  box-shadow: 1px 1px 2px #00000033;
}

/* 入力フォーカス時も枠色は変更しない（元仕様維持） */
.map .mapContentWrap .searchContentWrap .searchWrap input:focus {
  outline: none;
  border-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
}

.map .mapContentWrap .searchContentWrap .searchWrap .searchCloseBtn {
  position: absolute;
  top: 0;
  right: 9px;
  padding: 10px;
}
.map .routeDetails .routeDetailsWrap .searchCloseBtn {
  position: absolute;
  top: 0;
  right: 0px;
  padding: 12px;
}

.map .mapContentWrap .searchContentWrap .searchWrap .reSearchBtn {
  position: absolute;
  bottom: -40px;
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 32px;
  font-size: 12px;
  line-height: 32px;
  color: #000000;
  border: solid 1px #009E96;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 40px;
  transform: translate(-50%, 0);
  box-sizing: border-box;
}

.map .mapContentWrap .searchContentWrap .searchWrap .reSearchBtn:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .searchContentWrap .searchWrap .reSearchBtn:after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 10px;
  padding-left: 5px;
  background-repeat: no-repeat;
  background-size: 12px 10px;
  background-position: right center;
  background-image: url("../img/icn_reload.svg");
}

.map .mapContentWrap .searchContentWrap .searchWrap .reSearchBtn:active:after {
  background-image: url("../img/icn_reload_w.svg");
} 

.map .mapContentWrap .searchContentWrap .searchWrap .searchResultListBackBtn {
  position: absolute;
  bottom: -40px;
  right: 0;
  display: block;
  height: 32px;
  padding: 0 10px;
  font-size: 12px;
  text-align: center;
  line-height: 32px;
  color: #000000;
  border: solid 1px #009E96;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .searchContentWrap .searchWrap .searchResultListBackBtn:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .mapBtn {
  position: fixed;
  width: 40px;
  height: 40px;
  text-align: center;
  border-radius: 50%;
  background-color: #ffffff;
  overflow: hidden;
  box-shadow: 0px 1px 1px #00000080;
  z-index: 16777280;
}

.map .mapContentWrap .mapBtn:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.map .mapContentWrap .mapBtn.bookmarkBtn {
  top: 62px;
  right: 10px;
}

.map .mapContentWrap .mapBtn.bookmarkBtn img {
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.map .mapContentWrap .mapBtn.destinationBtn {
  top: 112px;
  right: 10px;
}

.map .mapContentWrap .mapBtn.destinationBtn img {
  display: inline-block;
  width: 15px;
  height: 20px;
  vertical-align: middle;
}

.map .mapContentWrap .mapBtn.presentLocationBtn {
  bottom: 197px;
  right: 10px;
  padding: 0;
  background-color: #009E96;
  border: none;
}
.map.ios .mapContentWrap .mapBtn.presentLocationBtn {
  bottom: calc(197px + var(--iosb));
}

.map .mapContentWrap .mapBtn.presentLocationBtn:disabled {
  background-color: #CCCCCC;
}

.map .mapContentWrap .mapBtn.presentLocationBtn:disabled:before {
  background-image: url("../img/icn_gps_white.svg");
}

.map .mapContentWrap .mapBtn.presentLocationBtn:before {
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  vertical-align: middle;
  background-image: url("../img/icn_gps_white.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px;
}

.map .mapContentWrap .mapBtn.presentLocationBtn:not(:disabled):active {
  background-color: #ffffff;
}

.map .mapContentWrap .mapBtn.presentLocationBtn:not(:disabled):active:before {
  background-image: url("../img/icn_gps.svg");
}


.map .mapContentWrap .scalingBtnWrap {
  position: fixed;
  bottom: 95px;
  right: 10px;
  width: 40px;
  height: 82px;
  text-align: center;
  border-radius: 20px;
  background-color: #ffffff;
  overflow: hidden;
  box-shadow: 0px 1px 1px #00000080;
  z-index: 16777280;
}
.map.ios .mapContentWrap .scalingBtnWrap {
  bottom: calc(95px + var(--iosb));
}

.map .mapContentWrap .scalingBtnWrap span {
  display: block;
  border: solid 1px #CCCCCC;
}

.map .mapContentWrap .expansionBtn,
.map .mapContentWrap .reductionBtn {
  display: block;
  width: 100%;
  height: 40px;
}

.map .mapContentWrap .expansionBtn:before,
.map .mapContentWrap .reductionBtn:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.map .mapContentWrap .expansionBtn img,
.map .mapContentWrap .reductionBtn img {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
}

.map .mapContentWrap .setHereBtnWrap {
  position: absolute;
  left: 10px;
  bottom: 90px;
}

.map .mapContentWrap .setHereBtnWrap .setHereBtn {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 56px;
  text-align: center;
  color: #000000;
  border: solid 1px #009E96;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 10px;
  box-sizing: border-box;
}

.map .mapContentWrap .setHereBtnWrap .setHereBtn:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .setHereBtnWrap .setHereBtn span {
  display: block;
  padding-top: 6px;
  text-align: center;
}

/* .mapNavWrap */
.map .mapContentWrap .mapNavWrap {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background-color: #ffffff;
  box-shadow: -1px -1px 1px #0000001A;
}
.map.ios .mapContentWrap .mapNavWrap {
  height: calc(60px + var(--iosb));
}

.map .mapContentWrap .mapNavWrap.open {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background-color: #ffffff;
  box-shadow: -1px -1px 1px #0000001A;
}

.map .mapContentWrap .mapNavWrap .mapNav ul {
  display: flex;
  width: 100%;
  height: 60px;
}

.map .mapContentWrap .mapNavWrap .mapNav ul li .navBtn {
  display: block;
  height: 100%;
  padding: 10px 12px;
  color: #424242;
  box-sizing: border-box;
}

.map .mapContentWrap .mapNavWrap .mapNav ul li .navBtn:before {
  content: "";
  display: block;
  width: 24px;
  height: 20px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .mapNavWrap .mapNav ul li .navBtn.myCarNavBtn:before {
  background-image: url("../img/icn_car.svg");
}

.map .mapContentWrap .mapNavWrap .mapNav ul li .navBtn.bookmarkNavBtn:before {
  background-image: url("../img/icn_bookmark.svg");
}

.map .mapContentWrap .mapNavWrap .mapNav ul li .navBtn span {
  display: block;
  font-size: 10px;
}

.map .mapContentWrap .mapNavWrap .mapNav {
  position: relative;
}

.map .mapContentWrap .mapNavWrap .mapNav .navBtn.mapMenuBtn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 12px;
  text-align: right;
  color: #424242;
}

.map .mapContentWrap .mapNavWrap .mapNav .navBtn.mapMenuBtn:before {
  content: "";
  display: block;
  width: 24px;
  height: 20px;
  margin: 0 auto;
  background-image: url("../img/icn_menu.svg");
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .mapNavWrap .mapNav .navBtn.mapMenuBtn span {
  display: block;
  font-size: 10px;
}

/* .mapMenuWrap */
.map .mapContentWrap .mapMenuWrap {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100vh;
  z-index: 16777283;
}

.map .mapContentWrap .mapMenuWrap.open {
  display: block;
}

.map .mapContentWrap .mapMenuWrap .mapMenuLayer {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  height: 100vh;
  width: 100%;
  background-color: transparent;
  z-index: 20;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner {
  position: fixed;
  top: var(--sat);
  right: 0;
  display: block;
  width: 220px;
  height: calc(100vh - var(--sat));
  margin-right: -230px;
  background-color: #ffffff;
  box-shadow: -1px 0px 2px #00000033;
  z-index: 21;
  overflow-y: auto; /* はみ出し時にスクロール */
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner>span {
  display: block;
  padding: 0 10px;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner>span:before {
  content: "";
  display: block;
  height: 1px;
  border-bottom: solid 1px #CCCCCC;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap {
  padding: 20px 0;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap:after {
  content: "";
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li {
  position: relative;
  display: block;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li a,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li a {
  display: block;
  width: 100%;
  height: 40px;
  padding: 10px 17px 10px 47px;
  box-sizing: border-box;
  color: #424242;
}

.menuWrap .menuInner ul.subMenuWrap li.select a,
.menuWrap .menuInner ul.subMenuWrap li a:active,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.select a,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li a:active,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.select a,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li a:active {
  color: #009E96;
  background-color: #009E960D;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li a:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 17px;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 auto;
  background-image: url("https://placehold.jp/40x40.png");
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuAccountInfo a:before {
  background-image: url("../img/icn_user.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuAccountInfo.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuAccountInfo a:active:before {
  background-image: url("../img/icn_user_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice a:before {
  background-image: url("../img/icn_notification.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice a:active:before {
  background-image: url("../img/icn_notification_select.svg");
}
/* display */
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice.display a:before {
  background-image: url("../img/icn_notification_on.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice.display.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuNotice.display a:active:before {
  background-image: url("../img/icn_notification_on_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuDestinationSchedule a:before,
.menuWrap .menuInner ul.subMenuWrap li.menuMapTop a:before {
  background-image: url("../img/icn_pin.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuDestinationSchedule.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.subMenuWrap li.menuDestinationSchedule a:active:before,
.menuWrap .menuInner ul.subMenuWrap li.menuMapTop.select a:before,
.menuWrap .menuInner ul.subMenuWrap li.menuMapTop a:active:before {
  background-image: url("../img/icn_pin_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuTerms a:before {
  background-image: url("../img/icn_kiyaku.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuTerms.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuTerms a:active:before {
  background-image: url("../img/icn_kiyaku_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuPrivacyPolicy a:before {
  background-image: url("../img/icn_privacy_policy.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuPrivacyPolicy.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuPrivacyPolicy a:active:before {
  background-image: url("../img/icn_privacy_policy_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuLicense a:before {
  background-image: url("../img/icn_license.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuLicense.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuLicense a:active:before {
  background-image: url("../img/icn_license_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuSpecifiedTransactionLaw a:before {
  background-image: url("../img/icn_cart.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuSpecifiedTransactionLaw.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuSpecifiedTransactionLaw a:active:before {
  background-image: url("../img/icn_cart_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuAboutApp a:before {
  background-image: url("../img/icn_info.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuAboutApp.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuAboutApp a:active:before {
  background-image: url("../img/icn_info_select.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuHelp a:before,
.menuWrap .menuInner ul.subMenuWrap li.menuHelp a:before {
  background-image: url("../img/icn_question.svg");
}

.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuHelp.select a:before,
.map .mapContentWrap .mapMenuWrap .mapMenuInner ul.mainMenuWrap li.menuHelp a:active:before,
.menuWrap .menuInner ul.subMenuWrap li.menuHelp.select a:before,
.menuWrap .menuInner ul.subMenuWrap li.menuHelp a:active:before {
  background-image: url("../img/icn_question_select.svg");
}

/* .mapDisplay */
.map.mapDisplay .mapBtn,
.map.mapDisplay .scalingBtnWrap,
.map.mapDisplay .mapNavWrap {
  display: none;
}

/* mapSearch */
.map .mapContentWrap .mapSearch {
  position: absolute;
  /* 検索ボックス直下（縦は控えめ） */
  top: calc(10px + var(--sat) + 40px - 18px); /* 縦向きも深く被せる */
  left: 10px;  /* 検索ボックスと同じ左右位置（縦向き） */
  right: 10px;
  z-index: 16777281;
  /* 丸角下の隙間を埋めるためのキャップ */
}

/* キャップは不要（本体の角丸+負マージンで解決） */

/* 横向き: 検索ツールモーダルを検索ボックスと同じ幅・位置に合わせる */
@media screen and (orientation: landscape) {
  .map .mapContentWrap .mapSearch {
    left: 10px;
    right: auto;
    width: 60%; /* 検索ボックス(3/5)と同一 */
    max-height: calc(100vh - 20px); /* 画面下側まで伸ばす */
    overflow: auto;
    /* 検索ボックス直下位置（さらに深く） */
    top: calc(10px + var(--sat) + 40px - 18px);
  }
  /* 横向き時も、モーダル上部の角は下側と同じ4pxに統一 */
  .map .mapContentWrap .mapSearch .mapSearchWrap {
    border-radius: 4px 4px 4px 4px !important;
    margin-top: -40px !important;      /* さらに被せ量を確保 */
    padding-top: calc(8px + 40px) !important;
  }
  /* 横画面では補助キャップを追加して確実に覆う */
  .map .mapContentWrap .mapSearch::before {
    content: "";
    position: absolute;
    top: -64px;   /* さらに厚めに前面で被せる */
    left: 0;
    right: 0;
    height: 64px; /* さらに厚めに前面で被せる */
    background-color: #ffffff;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    z-index: 2;   /* 前面に出して角丸を優先表示 */
    pointer-events: none;
  }
  /* 横向きデフォルトでは制限を入れない。下の高さ別メディアクエリで制御 */
  .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryWrap,
  .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList {
    max-height: none !important;
    overflow: visible !important;
  }
  /* 横画面: 画面高さで3行/4行を明確に出し分ける（iPhone SE 短辺=375px基準） */
  @media screen and (max-height: 379px) {
    .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryWrap { max-height: 96px !important; overflow-y: auto !important; }
    .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList { max-height: 84px !important; overflow-y: auto !important; }
  }
  @media screen and (min-height: 380px) {
    .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryWrap { max-height: 160px !important; overflow-y: auto !important; }
    .map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList { max-height: 140px !important; overflow-y: auto !important; }
  }
}

.map .mapContentWrap .mapSearch .mapSearchWrap {
  position: relative;
  display: block;
  width: 100%;
  /* 検索ボックス直下から始まるよう、上余白を最小限に */
  padding: 8px 0 12px; /* 左右を0にして背景を端まで広げる */
  background-color: #ffffff;
  box-shadow: 0px 1px 2px #00000033;
  /* 上部角丸は下側と同じ 4px に揃える */
  border-radius: 4px 4px 4px 4px;
  /* さらに厚めに重ねて隙間を解消 */
  margin-top: -44px;                 /* さらに深く被せる */
  padding-top: calc(8px + 44px);
  overflow: hidden; /* 角丸外のはみ出しを隠す */
  box-sizing: border-box;
  z-index: 1; /* 本体はキャップの背面 */
}

/* 内側コンテンツに左右パディングを再付与 */
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap,
.map .mapContentWrap .mapSearch .mapSearchWrap .addressSearchWrap,
.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryWrap {
  padding-left: 12px;
  padding-right: 12px;
}

/* 縦向きでも検索ボックスとモーダルの隙間を完全に覆うためのキャップを追加 */
.map .mapContentWrap .mapSearch::before {
  content: "";
  position: absolute;
  top: -48px; /* さらに厚めに被せる */
  left: 0;
  right: 0;
  height: 48px; /* さらに厚めに被せる */
  background-color: #ffffff;
  /* モーダル本体と同じ下側角丸(4px)へ整合 */
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-left-radius: 4px; /* 角が四角く見えないよう下側も丸める */
  border-bottom-right-radius: 4px; /* 角が四角く見えないよう下側も丸める */
  z-index: 2; /* 本体(=z-index:1)より前面に置いて角丸を見せる */
  pointer-events: none;
  /* 角丸の輪郭が視認できるように、モーダル本体と同じ影を付ける */
  box-shadow: 0px 1px 2px #00000033;
}

/* 検索ボックスの角を前面で強調するための小さなキャップ（縦向きのみ） */
@media screen and (orientation: portrait) {
  .map .mapContentWrap .searchContentWrap::after {
    content: "";
    position: fixed;
    top: calc(10px + var(--sat));
    left: 10px;
    right: 10px;
    height: 40px;
    border-radius: 40px; /* 検索ボックスと同じ丸み */
    box-shadow: 0 0 0 1px #ffffff; /* 元の枠色(白)に合わせる */
    z-index: 16777284; /* 検索ボックス(入力)より前、モーダルキャップより前 */
    pointer-events: none;
  }
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap {
  padding-top: 15px;
}

/* ジャンルボタン：横向きは詰めて多列表示（7-8個想定） */
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  padding-bottom: 20px;
}
@media screen and (orientation: landscape) {
  .map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul {
    grid-template-columns: repeat(8, 1fr); /* 列数のみ増やし、ボタンサイズは維持 */
    gap: 6px; /* 詰める */
  }
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li a {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 56px;
  padding-top: 28px;
  color: #000000;
  font-size: 10px;
  font-weight: 500;
  text-align: center;
  border: solid 1px #009E96;
  border-radius: 10px;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  box-sizing: border-box;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.select a,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li a:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li a:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0px;
  display: block;
  width: 100%;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.gourmet a:before {
  background-image: url("../img/icn_genre_dinner.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.gourmet.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.gourmet a:active:before {
  background-image: url("../img/icn_genre_dinner_peressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.convenienceStore a:before {
  background-image: url("../img/icn_genre_store.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.convenienceStore.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.convenienceStore a:active:before {
  background-image: url("../img/icn_genre_store_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.parking a:before {
  background-image: url("../img/icn_genre_parking.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.parking.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.parking a:active:before {
  background-image: url("../img/icn_genre_parking_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.trainStation a:before {
  background-image: url("../img/icn_genre_train.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.trainStation.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.trainStation a:active:before {
  background-image: url("../img/icn_genre_train_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.Refueling a:before {
  background-image: url("../img/icn_genre_gas.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.Refueling.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.Refueling a:active:before {
  background-image: url("../img/icn_genre_gas_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.powerSupply a:before {
  background-image: url("../img/icn_genre_electric_st.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.powerSupply.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.powerSupply a:active:before {
  background-image: url("../img/icn_genre_electric_st_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.shopping a:before {
  background-image: url("../img/icn_genre_shopping.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.shopping.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.shopping a:active:before {
  background-image: url("../img/icn_genre_shopping_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hotel a:before {
  background-image: url("../img/icn_genre_hotel.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hotel.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hotel a:active:before {
  background-image: url("../img/icn_genre_hotel_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hospital a:before {
  background-image: url("../img/icn_genre_hospital.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hospital.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.hospital a:active:before {
  background-image: url("../img/icn_genre_hospital_pressed.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.pharmacy a:before {
  background-image: url("../img/icn_genre_pharmacy.svg");
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.pharmacy.select a:before,
.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.pharmacy a:active:before {
  background-image: url("../img/icn_genre_pharmacy_pressed.svg");
}


.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li a:after {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li a span {
  display: inline-block;
  line-height: 1.2em;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .categorySearchWrap ul li.shopping a span {
  letter-spacing: -2px;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .addressSearchWrap {
  border-top: solid 1px #CCCCCC;
  padding-top: 10px;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .addressSearchWrap a {
  color: #009E96;
  text-decoration: underline;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .addressSearchWrap a:after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 12px;
  padding-right: 21px;
  background-image: url("../img/icn_arrow_right.svg");
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryWrap {
  margin: 10px 0px 0px 0px;
  padding: 4px 0px 4px 0px;
  width: 100%;
  border-radius: 8px 8px 8px 8px;
  box-shadow: 1px 1px 2px #00000033;
  z-index: 10;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList {
  list-style: none;
  padding: 0px 10px 0px 10px;
  margin: 0;
  max-height: 126px;
  overflow: auto;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList::-webkit-scrollbar-thumb {
  /*background-color: #009E96; 地図アプリアクセントカラー*/
  background-color: darkgray;
  border-radius: 10px;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryList::-webkit-scrollbar {
  background: transparent;
  width:5px;
}

/* 履歴リストの行高を詰めて縦スペースを確保 */
.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryItem {
  padding: 6px 5px; /* 10px -> 6px */
  border-bottom: 1px solid #eee;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryItem:last-child {
  border-bottom: none;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryItem a {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: #333;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryIcon {
  width: 14px;
  height: 14px;
  margin-right: 8px;
  opacity: 0.5;
}

.map .mapContentWrap .mapSearch .mapSearchWrap .searchHistoryText {
  font-size: 13px;
}

/* .locationDetails */
.map .mapContentWrap .locationDetails {
  position: absolute;
  top: calc(60px + var(--sat));
  left: 10px;
  right: 10px;
  z-index: 16777280;
}

/* 横向き: 施設概要は検索ボックス直下・検索モーダルと同幅(60%) */
@media screen and (orientation: landscape) {
  .map .mapContentWrap .locationDetails {
    position: absolute;
    top: calc(10px + var(--sat) + 40px + 8px); /* 検索ボックス(40px)の直下に余白 */
    left: 10px;
    right: auto;
    width: 60%;
    max-height: 70vh;
    overflow-y: auto;
    z-index: 16777281;
  }
}

.map .mapContentWrap .locationDetails .locationDetailsWrap {
  display: block;
  padding: 10px 13px 44px;
  color: #000000;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 4px;
  background-color: #ffffff;
}

.map .mapContentWrap .locationDetails .locationUpdateDetailsWrap {
  display: block;
  padding: 10px 13px 10px;
  color: #000000;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 4px;
  background-color: #ffffff;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap h2,
.map .mapContentWrap .locationDetails .locationUpdateDetailsWrap h2 {
  font-size: 16px;
  font-weight: 400;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .categoryLabel {
  padding-bottom: 9px;
  font-size: 12px;
  color: #ACACAC;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .destinationInfoWrap {
  display: none;
}

.map .mapContentWrap .locationDetails .open .locationDetailsWrap .destinationInfoWrap {
  display: block;
  line-height: 1.1;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .destinationInfoWrap dl {
  display: flex;
  padding-bottom: 20px;
  margin: 4px 0;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .destinationInfoWrap dl:last-child {
  padding-bottom: 10px;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .destinationInfoWrap dl dt {
  flex: 0 0 75px;
}

.map .mapContentWrap .locationDetails .locationDetailsWrap .destinationInfoWrap dl dd {
  flex: 1 1 auto;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap {
  position: absolute;
  left: 0;
  bottom: 12px;
  width: 100%;
  padding: 0 13px;
  box-sizing: border-box;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .locationDetailsBtnBox {
  position: absolute;
  right: 8px;
  bottom: 0;
  display: flex;
  gap: 8px;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .locationDetailsBtnBox a {
  min-width: 41px;
  max-width: 120px;
  padding: 12px 6px;
  text-align: center;
  box-sizing: border-box;
  white-space: nowrap;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .locationDetailsBtnBox a.long-text {
  font-size: 0.9em; /* 文字を少し小さく */
  padding: 12px 8px; /* パディングを調整 */
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .edit {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 66px;
  height: 32px;
  font-size: 12px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .edit:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .edit:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 15px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 16px 15px;
  background-image: url("../img/icn_edit_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .edit:active::before {
  background-image: url("../img/icn_edit_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  font-size: 11px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: left center;
  background-image: url("../img/icn_star_plas_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark:active:before {
  background-image: url("../img/icn_star_plas_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark.registered {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark.registered:active {
  color: #009E96;
  background-color: #ffffff;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark.registered:before {
  background-image: url("../img/icn_star_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .bookmark.registered:active:before {
  background-image: url("../img/icn_star_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .destinationSetting {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  font-size: 11px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .destinationSetting:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .destinationSetting:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 16px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-size: 12px 16px;
  background-position: left center;
  background-image: url("../img/icn_pin_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .destinationSetting:active:before {
  background-image: url("../img/icn_pin_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBackBtn {
  position: absolute;
  bottom: -42px;
  left: 50%;
  display: block;
  height: 32px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
  transform: translate(-50%, 0);
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .routestartSetting {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 55px;
  height: 32px;
  font-size: 11px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .locationDetails .locationDetailsBtnWrap .routestartSetting:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 16px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-size: 12px 16px;
  background-position: left center;
  background-image: url("../img/icn_pin_small.svg");
}

.map .mapContentWrap .locationDetails .locationDetailsBackBtn:active {
  color: #ffffff;
  background-color: #009E96;
}

/* .locationDetails.home, building*/
.map .mapContentWrap .locationDetails.home .locationDetailsWrap h2,
.map .mapContentWrap .locationDetails.building .locationDetailsWrap h2 {
  padding-bottom: 5px;
}

.map .mapContentWrap .locationDetails.home .locationDetailsWrap h2 span,
.map .mapContentWrap .locationDetails.transition .locationDetailsWrap h2 span,
.map .mapContentWrap .locationDetails.building .locationDetailsWrap h2 span {
  display: inline-block;
  vertical-align: middle;
}

.map .mapContentWrap .locationDetails.home .locationDetailsWrap h2 img,
.map .mapContentWrap .locationDetails.transition .locationDetailsWrap h2 img,
.map .mapContentWrap .locationDetails.building .locationDetailsWrap h2 img {
  display: inline-block;
  padding-right: 10px;
  vertical-align: middle;
}

/*.locationDetails.transition */
.map .mapContentWrap .locationDetails.transition .locationDetailsWrap h2 {
  padding-bottom: 10px;
}

/* searchResultList */
:root {
  --search-result-height: 55px;
  --search-result-transition: 0.3s ease;
  --menu-height-portrait: 60px;
  --menu-height-landscape: 0px; /* 右サイドバーなので下は0 */
  --search-result-bottom: var(--menu-height-portrait);
}

.map .mapContentWrap .searchResultList {
  height: var(--search-result-height); 
  position: fixed;
  bottom: var(--search-result-bottom);  /* メニューの高さ分空ける */
  left: 0;
  right: 0;
  z-index: 16777281;
  overflow: hidden;
  transition: height var(--search-result-transition);
  background: white;
  border-radius: 16px 16px 0 0;
  box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.1);
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* 横向きは下メニューが無いので bottom:0、右サイドバーに被らないよう左右パディングを確保 */
@media screen and (orientation: landscape) {
  .map .mapContentWrap .searchResultList {
    bottom: var(--menu-height-landscape);
    left: 10px;
    right: calc(10px + var(--landscape-nav-width));
  }
}

.map .mapContentWrap .searchResultList.show {
  display: block;
}

.map .mapContentWrap .searchResultList .searchResultDragHandle {
  width: 100%;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: grab;
}

.map .mapContentWrap .searchResultList .dragHandleIndicator {
  width: 36px;
  height: 5px;
  background-color: #ccc;
  border-radius: 2.5px;
}

.map .mapContentWrap .searchResultList .searchResultWrap {
  position: relative;
  padding: 0 20px 20px;
  background-color: #ffffff;
  height: calc(100% - 20px);
  overflow-y: auto;
  overflow-x: hidden;
}

.map .mapContentWrap .searchResultList .searchResultWrap>ul li a {
  position: relative;
  display: block;
  height: 55px;
  padding: 10px 0 8px 25px;
  border-bottom: solid 1px #CCCCCC;
  box-sizing: border-box;
}

.map .mapContentWrap .searchResultList .searchResultWrap>ul li a:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  width: 25px;
  height: 25px;
  background-size: 20px 25px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .titleWrap {
  position: relative;
  display: flex;
  color: #000000;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .titleWrap:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  height: 21px;
  margin: 0 auto;
  background-image: url(../img/icn_right_arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .titleWrap .titleText {
  width: 100%;
  display: -webkit-box;
  padding-right: 82px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-height: 1.2em;
  overflow: hidden;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .titleWrap .titleText .storeName {
  display: block;
  height: 20px;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .titleWrap .distance {
  position: absolute;
  top: 0;
  right: 30px;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .categoryText {
  width: 100%;
  display: -webkit-box;
  padding-right: 82px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-height: 1.2em;
  overflow: hidden;
}

.map .mapContentWrap .searchResultList .searchResultWrap ul li a .categoryText .category {
  font-size: 11px;
  color: #ACACAC;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging {
  position: relative;
  width: 100%;
  padding: 10px 0;
  margin-bottom: 10px;
  text-align: center;
  font-size: 0;
  border-bottom: 1px solid #eee;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging ul {
  display: flex;
  justify-content: center;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li {
  display: inline-block;
  padding: 0 5px;
  position: relative;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li a {
  display: block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  box-sizing: border-box;
  color: #535353;
  border-radius: 50%;
  font-size: 16px;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li a .map .mapContentWrap .searchResultList .searchResultWrap .paging li:not(.current):not(.disable) a:hover {
  opacity: 0.7;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingFirst a,
.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingPrev a,
.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingNext a,
.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingLast a {
  background-repeat: no-repeat;
  background-position: center;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingFirst a {
  background-image: url("../img/icn_arrow_left_skip.svg");
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingPrev a {
  background-image: url("../img/icn_arrow_left.svg");
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingNext a {
  background-image: url("../img/icn_arrow_right.svg");
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.pagingLast a {
  background-image: url("../img/icn_arrow_right_skip.svg");
}



.map .mapContentWrap .searchResultList .searchResultWrap .paging li.current a {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .searchResultList .searchResultWrap .paging li.current:before,
.map .mapContentWrap .searchResultList .searchResultWrap .paging li.disable:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

/* ここへ行くモーダル - MapSearchResult.vue */
#gohereSelectModal.modal.goHereSelectModal .modalContent.modalSelectContent {
  width: 270px;
  border-radius: 14px;
}

/* destinationSettingModal */
.modal.destinationSettingModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}



/* destinationSettingConfirmationModal */
.modal.destinationSettingConfirmationModal .modalContent.modalMessage,
.modal.destinationDoubleGuardDeleteModal .modalContent.modalMessage
 {
  height: auto;
}

.modal.destinationSettingConfirmationModal .modalContent.modalMessage .modalInner p,
.modal.destinationDoubleGuardDeleteModal .modalContent.modalMessage .modalInner p
 {
  padding-bottom: 10px;
  text-align: left;
}

.modal.destinationSettingConfirmationModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn,
.modal.destinationDoubleGuardDeleteModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn
 {
  color: #009E96;
  background-color: transparent;
}

.modal.destinationSettingConfirmationModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn,
.modal.destinationDoubleGuardDeleteModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn
 {
  color: #009E96;
  background-color: transparent;
}

/* addBookmarkModal */
/* deleteBookmarkModal */
.modal.addBookmarkModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn,
.modal.deleteBookmarkModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

/* destinationSettingDeleteModal */
.modal.destinationSettingDeleteModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}


/* license **************************************************/
.license .wrapper {
  padding-top: calc(74px + var(--sat));
}

.license .licenseTopTextWrap {
  padding: 0 45px;
}

.license .licenseMainTextWrap {
  padding: 0 45px;
}

.license .licenseTopTextWrap p,
.license .licenseMainTextWrap p {
  padding-bottom: 20px;
  word-break: break-all;
}

/* accountInfo **************************************************/
.accountInfo .wrapper {
  padding-top: 44px;
}

.accountInfo .wrapper .accountInfoContent {
  padding-top: calc(31px + var(--sat));
}

.accountInfo .wrapper .accountInfoContent .accountInfo {
  padding-bottom: 142px;
}

.accountInfo .wrapper .accountInfoContent .accountInfo dl {
  padding: 0 20px 0;
}

.accountInfo .wrapper .accountInfoContent .accountInfo dl dt {
  padding-bottom: 5px;
  margin-bottom: 11px;
  font-size: 13px;
  border-bottom: solid 1px #CCCCCC;
}

.accountInfo .wrapper .accountInfoContent .accountInfo dl dd {
  padding-bottom: 20px;
  font-weight: 500;
}

.accountInfo .wrapper .accountInfoContent .btnWrap {
  display: block;
  padding-bottom: 20px;
  text-align: center;
}

.accountInfo .wrapper .accountInfoContent .btnWrap .btn.LogoutBtn {
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  background-color: #009E96;
}

.accountInfo .wrapper .accountInfoContent .textLinkWrap {
  text-align: center;
}

.accountInfo .wrapper .accountInfoContent .textLinkWrap .textLink {
  color: #009E96;
  font-size: 15px;
  font-weight: 500;
  text-decoration: underline;
}

/* modal */
.accountInfo .modal.withdrawalModal .modalContent.modalMessage {
  height: auto;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalInner {
  padding: 19px 17px 72px;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalInner p {
  padding-top: 5px;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalInner dl dt {
  padding-bottom: 5px;
  font-size: 13px;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalInner dl dd {
  padding-bottom: 5px;
  font-size: 13px;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalInner dl dd input {
  display: block;
  width: 100%;
  height: 34px;
  padding: 10px;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.accountInfo .modal.withdrawalConfirmModal .modalContent.modalMessage,
.accountInfo .modal.withdrawalCompletedModal .modalContent.modalMessage {
  height: 180px;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn,
.accountInfo .modal.withdrawalConfirmModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

.accountInfo .modal.withdrawalModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalWithdrawalBtn,
.accountInfo .modal.withdrawalConfirmModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalWithdrawalBtn {
  background-color: #CBCBCB;
}

/* logoutModal */
.accountInfo .modal.logoutModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn,
.accountInfo .modal.withdrawalConfirmModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}



/* aboutApp **************************************************/
.aboutApp .wrapper {
  padding-top: 44px;
}

.aboutApp .wrapper .aboutAppContent {
  padding-top: calc(31px + var(--sat));
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo {
  padding-bottom: 142px;
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo dl {
  padding: 0 20px 0;
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo dl dt {
  padding-bottom: 5px;
  margin-bottom: 11px;
  font-size: 13px;
  border-bottom: solid 1px #CCCCCC;
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo dl dd {
  padding-bottom: 20px;
  font-weight: 500;
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo dl dd a {
  position: relative;
  display: block;
  color: #009E96;
}

.aboutApp .wrapper .aboutAppContent .aboutAppInfo dl dd a:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 100%;
  background-image: url("../img/icn_right_arrow.svg");
  background-size: 10px 20px;
  background-repeat: no-repeat;
  background-position: center;
}


/* bookmarkList **************************************************/

.bookmarkList .wrapper {
  padding-top: calc(74px + var(--sat));
}

/* .selfInfoWrap */
.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap {
  padding: 0 20px 11px;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl>dt {
  position: relative;
  padding-bottom: 5px;
  margin-bottom: 11px;
  border-bottom: solid 1px #CCCCCC;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl>dt a {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  width: 20px;
  height: 20px;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl>dd {
  padding-bottom: 19px;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl>dd a {
  color: #000000;
  font-weight: 500;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl>dd span {
  color: #000000;
  font-weight: 500;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.home dt:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 21px;
  margin-right: 6px;
  background-image: url("../img/icn_home.svg");
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: bottom;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.workplace dt:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 21px;
  margin-right: 6px;
  background-image: url("../img/icn_building.svg");
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: bottom;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dt:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 21px;
  margin-right: 6px;
  background-image: url("../img/icn_file.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  vertical-align: bottom;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd {
  display: flex;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a {
  position: relative;
  flex: 1 1 auto;
  max-width: 50%;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a:nth-of-type(1) {
  margin-right: 10px
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl {
  position: relative;
  display: flex;
  font-size: 12px;
  font-weight: 400;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl.sortResult dt {
  flex: 0 0 50px;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl.categoryResult dt {
  flex: 0 0 60px;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl.sortResult dd,
.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl.categoryResult dd {
  padding-right: 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl dt {
  padding: 0;
  margin: 0;
  border: none;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl dd {
  padding: 0;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl.category>dd a>dl dd:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/icn_sort_triangle.svg");
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

/* .bookmarkListWrap */
.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap {
  padding: 0 20px;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li {
  border-bottom: solid 1px #CCCCCC;
}

/* ブックマーク項目の横並びレイアウト */
.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 8px 0;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow .bookmarkContent {
  position: relative;
  display: block;
  color: #000000;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow .bookmarkContent::before {
  content: "";
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  display: block;
  width: 30px;
  height: 30px;
  background-image: url("../img/icn_pin.svg");
  background-size: 15px 20px;
  background-repeat: no-repeat;
  background-position: center;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl > dd .bookmarkItemRow .bookmarkContent,
.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow .bookmarkContent {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0px;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow .bookmarkContent .bookmarkTextContent span {
  display: block;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow .bookmarkContent .bookmarkTextContent .bookmarkName {
  font-weight: 500;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListNarrowWrap {
  display: flex;
  padding-bottom: 5px;
  border-bottom: solid 1px #CCCCCC;
}

.bookmarkList .wrapper .bookmarkListContent .bookmarkListNarrowWrap dl {
  display: flex;
  padding-right: 19px;
  font-size: 13px;
}

/* sortSelectModal */
.bookmarkList .wrapper .modal.sortSelectModal .modalContent.modalSelectContent {
  width: 270px;
  border-radius: 14px;
}

/* categorySelectModal */
.bookmarkList .wrapper .modal.categorySelectModal .modalContent.modalSelectContent {
  width: 270px;
  height: auto;
  border-radius: 14px;
}

.bookmarkList .wrapper .modal.categorySelectModal .modalContent.modalSelectContent .selectContent {
  max-height: 200px;
  overflow: auto;
}

/* homeSelectModal */
.bookmarkList .wrapper .modal.homeSelectModal .modalContent.modalSelectContent {
  width: 270px;
  border-radius: 14px;
}

/* homeSelectModal */
.bookmarkList .wrapper .modal.homeUnsubscribeModal .modalContent.modalMessage .modalBtnWrap .modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

/* 設定ボタンのレイアウト */
.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl > dt a.setRouteStartBtn,
.bookmarkList .wrapper .bookmarkListContent .bookmarkListWrap .list ul li .bookmarkItemRow a.setRouteStartBtn {
  width: 8% ;
  max-width: 32px;
  min-width: 16px;
  padding: 3px 6px !important;
  background: #009E96;
  color: white !important;
  border: none;
  display: flex !important;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  border-radius: 24px; 
  transition: background-color 0.3s ease;
  font-size: 0.7em;
}

.bookmarkList .wrapper .bookmarkListContent .selfInfoWrap dl > dt a.setRouteStartBtn{
  height: 20px;
  top: -5px !important;
}

/* bookmarkEdit **************************************************/
.bookmarkEdit .wrapper {
  padding-top: 74px;
}

.bookmarkEditContent .bookmarkContent {
  padding: var(--sat) 45px;
}

.bookmarkEditContent .bookmarkContent dl dt {
  display: block;
  padding-bottom: 5px;
  font-size: 13px;
}

.bookmarkEditContent .bookmarkContent dl dt span.required {
  padding-left: 10px;
  font-size: 13px;
  color: #E80000;
}

.bookmarkEditContent .bookmarkContent dl dd {
  padding-bottom: 20px;
}

.bookmarkEditContent .bookmarkContent dl dd input {
  display: block;
  width: 100%;
  height: 35px;
  padding: 7px;
  color: #000000;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.bookmarkEditContent .bookmarkContent dl dd>span {
  font-weight: 500;
}

.bookmarkEditContent .bookmarkContent dl dd p.error {
  padding-top: 5px;
}

.bookmarkEditContent .bookmarkContent dl dd select {
  display: block;
  width: 100%;
  height: 35px;
  padding: 7px;
  color: #000000;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.bookmarkEditContent .bookmarkContent dl dd textarea {
  display: block;
  resize: none;
  width: 100%;
  height: 126px;
  padding: 7px;
  color: #000000;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.bookmarkEditContent .bookmarkUpdateBtnWrap {
  padding: 5px 0 30px;
  text-align: center;
}

.bookmarkEditContent .bookmarkUpdateBtnWrap .btn.bookmarkUpdateBtn {
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  background-color: #009E96;
}

/* categoryEdit **************************************************/
.categoryEdit .wrapper {
  padding-top: calc(43px + var(--sat));
}

.categoryEdit .categoryEditContent .categoryEditWrap {
  padding: 0 20px;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li {
  position: relative;
  padding: 15px 35px 15px 65px;
  border-bottom: solid 1px #CCCCCC;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li:before {
  content: "";
  position: absolute;
  top: 15px;
  left: 28px;
  width: 25px;
  height: 20px;
  background-image: url("../img/icn_file.svg");
  background-size: 25px 20px;
  background-repeat: no-repeat;
  background-position: center;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li label {
  position: absolute;
  top: 15px;
  left: 0;
  width: 20px;
  height: 20px;
  text-align: center;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li label input {
  display: inline-block;
  width: 20px;
  height: 20px;
  appearance: none;
  margin: 0;
  vertical-align: middle;
  background-image: url("../img/icn_checkbox.svg");
  background-repeat: no-repeat;
  background-position: center;
  -webkit-appearance: none;
  border-width: 0;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li input:checked {
  background-image: url("../img/icn_checkbox_on.svg");
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li span.categoryText {
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.categoryEdit .categoryEditContent .categoryEditWrap ul li a.categoryEditBtn {
  position: absolute;
  top: 16px;
  right: 5px;
  display: inline-block;
}

.categoryEdit .categoryEditContent .categoryAddBtnWrap {
  padding-top: 80px;
  text-align: center;
}

.categoryEdit .categoryEditContent .categoryAddBtnWrap .categoryAddBtn {
  display: inline-block;
}

.categoryEdit .categoryDeleteBtnWrap {
  padding-top: 80px;
  text-align: center;
}

.categoryEdit .categoryDeleteBtnWrap .categoryDeleteBtn {
  font-size: 15px;
  font-weight: 500;
  color: #009E96;
  border: none;
  text-decoration: underline;
}

.categoryEdit .categoryDeleteBtnWrap .categoryDeleteBtn:disabled {
  color: #CCCCCC;
}

/* deleteCategoryModal */
.categoryEdit .modal.deleteCategoryModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

/* addCategoryModal */
.categoryEdit .modal.addCategoryModal .modalContent.modalMessage,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage {
  height: auto;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .modalInner,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage .modalInner {
  padding: 19px 17px 72px;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .modalInner .categoryInput,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage .modalInner .categoryInput {
  padding-top: 5px;
  font-size: 13px;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .categoryInput .modalInner p.error,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage .categoryInput .modalInner p.error {
  padding-top: 5px;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .modalInner .categoryInput input,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage .modalInner .categoryInput input {
  display: block;
  width: 100%;
  height: 34px;
  padding: 10px;
  border: solid 1px #707070;
  border-radius: 4px;
  box-sizing: border-box;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .modalInner p.error,
.categoryEdit .modal.editCategoryModal .modalContent.modalMessage .modalInner p.error {
  padding-top: 5px;
}

.categoryEdit .modal.addCategoryModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn .categoryEdit .modal.editCategoryModal .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn {
  color: #009E96;
  background-color: transparent;
}

/* help **************************************************/
.help .wrapper iframe {
  width: 100%;
  height: 100vh;
}

/* helpList **************************************************/
.helpList .wrapper iframe {
  width: 100%;
  height: 100vh;
}

/* noticeList **************************************************/
.noticeList .wrapper {
  padding-top: 73px;
}

.noticeList .wrapper .noticeListContent .categorySelectBtnWrap {
  display: flex;
  padding: var(--sat) 19px 15px;
}

.noticeList .wrapper .noticeListContent .categorySelectBtnWrap button {
  flex: 1 1 100%;
  height: 30px;
  padding: 0;
  margin-right: 6px;
  line-height: 30px;
  font-size: 11px;
  text-align: center;
  color: #009E96;
  border: solid 1px #009E96;
  background-color: #ffffff;
  border-radius: 16px;
}

.noticeList .wrapper .noticeListContent .categorySelectBtnWrap button:last-child {
  margin-right: 0;
}

.noticeList .wrapper .noticeListContent .categorySelectBtnWrap button.selected {
  color: #ffffff;
  background-color: #009E96;
}

.noticeList .wrapper .noticeListContent .noticeListWrap {
  padding: 0 19px;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul {
  border-top: solid 1px #CCCCCC;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li {
  padding: 8px 0;
  border-bottom: solid 1px #CCCCCC;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li .noticeDateWrap {
  position: relative;
  padding: 0 80px 5px 0;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li .noticeDateWrap span.newNoticeLabel {
  padding-left: 10px;
  font-weight: 700;
  color: #FF0000;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li .noticeDateWrap span.categoryLabel {
  position: absolute;
  top: 0;
  right: 0;
  width: 80px;
  height: 20px;
  line-height: 1.5em;
  font-size: 11px;
  text-align: center;
  color: #009E96;
  border: solid 1px #009E96;
  border-radius: 16px;
  box-sizing: border-box;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li .noticeTitleWrap {
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.noticeList .wrapper .noticeListContent .noticeListWrap ul li.newNotice .noticeTitleWrap {
  font-weight: 500;
}


/* noticeDetail **************************************************/
.noticeDetail .wrapper {
  padding-top: 44px;
}

.noticeDetail .wrapper .noticeDetailContent {
  padding: calc(25px + var(--sat)) 28px 30px;
  box-sizing: border-box;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail {
  padding: 8px 0;
  border-bottom: solid 1px #CCCCCC;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail .noticeDateWrap {
  position: relative;
  padding: 0 80px 5px 0;
  color: #000000;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail .noticeDateWrap span.newNoticeLabel {
  display: none;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail.newNotice .noticeDateWrap span.newNoticeLabel {

  display: inline-block;
  padding-left: 10px;
  font-weight: 700;
  color: #FF0000;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail .noticeDateWrap span.categoryLabel {
  position: absolute;
  top: 0;
  right: 0;
  width: 80px;
  height: 20px;
  line-height: 1.5em;
  font-size: 11px;
  text-align: center;
  color: #009E96;
  border: solid 1px #009E96;
  border-radius: 16px;
  box-sizing: border-box;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail .noticeTitleWrap {
  width: 100%;
  color: #000000;
}

.noticeDetail .wrapper .noticeDetailContent .noticeDateDetail.newNotice .noticeTitleWrap {
  font-weight: 500;
}

.noticeDetail .wrapper .noticeDetailContent .topTextWrap {
  padding: 21px 0 20px;
  text-align: center;
  font-size: 15px;
  line-height: 1.5em;
}

.noticeDetail .wrapper .noticeDetailContent .imgWrap {
  display: block;
  text-align: center;
}

.noticeDetail .wrapper .noticeDetailContent .imgWrap img {
  text-align: center;
}

.noticeDetail .wrapper .noticeDetailContent .bottomTextWrap {
  padding-top: 20px;
}

/* addressSearch **************************************************/
.addressSearch .wrapper {
  padding-top: calc(73px + var(--sat));
}

.addressSearch .wrapper .addressSearchContent h2 {
  padding-bottom: 20px;
  font-size: 15px;
  font-weight: 400;
  text-align: center;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li {
  padding: 0 20px;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li>a {
  position: relative;
  display: block;
  height: 52px;
  line-height: 52px;
  font-weight: 500;
  color: #000000;
  border-bottom: solid 1px #CCCCCC;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li:first-child>a {
  border-top: solid 1px #CCCCCC;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li>a:after {
  content: "";
  position: absolute;
  top: 25px;
  right: 0;
  display: inline-block;
  width: 12px;
  height: 6px;
  background-image: url("../img/icn_arrow_down.svg");
  background-size: 12px 6px;
  background-repeat: no-repeat;
  background-position: center;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li.open>a:after {
  background-image: url("../img/icn_arrow_up.svg");
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li .prefecturesWrap {
  display: none;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li.open .prefecturesWrap {
  display: block;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li .prefecturesWrap ul li a {
  position: relative;
  display: block;
  height: 52px;
  padding: 0 10px;
  line-height: 52px;
  color: #000000;
  border-bottom: solid 1px #CCCCCC;
}

.addressSearch .wrapper .addressSearchContent ul.addressSearchAreaWrap>li .prefecturesWrap ul li a:after {
  content: "";
  position: absolute;
  top: 21px;
  right: 10px;
  display: inline-block;
  width: 6px;
  height: 12px;
  background-image: url("../img/icn_right_arrow.svg");
  background-size: 6px 12px;
  background-repeat: no-repeat;
  background-position: center;
}

/* addressSearchDetail **************************************************/
.addressSearchDetail .wrapper {
  padding-top: calc(73px + var(--sat));
}

.addressSearchDetail .wrapper .addressSearchDetailContent .prefecturesWrap {
  position: relative;
  padding: 0 20px 20px;
}

.addressSearchDetail .wrapper .addressSearchDetailContent .prefecturesWrap span {
  display: block;
  padding-bottom: 5px;
  border-bottom: solid 1px #CCCCCC;
}

.addressSearchDetail .wrapper .addressSearchDetailContent .prefecturesWrap a.mapTransitionBtn {
  position: absolute;
  top: 0;
  right: 20px;
  display: inline-block;
  width: 20px;
  height: 20px;
}

.addressSearchDetailList {
  padding: 0 20px 20px;
}

.addressSearchDetailList .syllabaryTitle {
  position: relative;
  display: block;
  padding: 10px;
  color: #009E96;
  font-weight: 500;
  border-bottom: solid 1px #cccccc;
}

.addressSearchDetailList .syllabaryTitle:after {
  content: "";
  position: absolute;
  top: 17px;
  right: 10px;
  display: inline-block;
  width: 12px;
  height: 6px;
  background-image: url("../img/icn_arrow_down.svg");
  background-size: 12px 6px;
  background-repeat: no-repeat;
  background-position: center;
}

.addressSearchDetailList.open .syllabaryTitle:after {
  background-image: url("../img/icn_arrow_up.svg");
}

.addressSearchDetailList>ul {
  display: none;
}

.addressSearchDetailList.open>ul {
  display: block;
}

.addressSearchDetailList>ul li a {
  position: relative;
  display: block;
  padding: 5px 10px;
  color: #424242;
  border-bottom: solid 1px #CCCCCC;
}

.addressSearchDetailList>ul li a:after {
  content: "";
  position: absolute;
  top: 21px;
  right: 10px;
  display: inline-block;
  width: 6px;
  height: 12px;
  background-image: url("../img/icn_right_arrow.svg");
  background-size: 6px 12px;
  background-repeat: no-repeat;
  background-position: center;
}

.addressSearchDetailList>ul li a span {
  display: block;
}

.addressSearchDetailList>ul li a span.subText {
  font-size: 11px;
}

.modal.show {
  display: block;
}



/* .routeDetails */
.map .mapContentWrap .routeDetails {
  position: absolute;
  top: calc(10px + var(--sat));
  left: 10px;
  right: 10px;
  z-index: 16777283;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap {
  display: block;
  padding: 10px;
  color: #000000;
  box-shadow: 1px 1px 2px #00000033;
  border-radius: 4px;
  background-color: #ffffff;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap .categoryLabel {
  padding-bottom: 9px;
  font-size: 12px;
  color: #ACACAC;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap dl {
  display: flex;
  padding-bottom: 10px;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap dl:last-child {
  padding-bottom: 10px;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap dl dt {
  flex: 0 0 30px;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap ul li img,
.map .mapContentWrap .routeDetails .routeDetailsWrap dl dt img{
  display: flex;
  align-items: center;
  width: 25px;
  height: 25px;
}

.map .mapContentWrap .routeDetails .routeDetailsWrap dl dd {
  flex: 1 1 auto;
  align-content: center;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap dl dd .addressWrap {
  overflow: hidden;
  padding-right: 20px;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap dl dd .addressWrap .addressText {
  width: 100%;
  display: -webkit-box;
  padding-right: 82px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-height: 1.2em;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap {
  text-align: center;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap ul {
  padding: 4px;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap li {
  width: calc(100%/3);
  display: flex;
  align-items: center;
  justify-content: center; /*画像含め中央*/
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap li .detail {
  min-width: 100px;
  display: flex;
  justify-content: center; /* 水平方向の中央揃え */
  align-items: center;    /* 垂直方向の中央揃え */
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap li .data{
  padding-left: 5px;
  text-align: center;
  align-items: center;
  justify-content: center;
  /*margin: 0 auto;*/ /*文字だけ中央*/
  font-size: 18px;
}
.map .mapContentWrap .routeDetails .routeDetailsWrap .distanceDetailWrap img{
  width: auto;
  height: 18px;
}
.map .mapContentWrap .routeDetails .routeDetailsBtnWrap {
  position: absolute;
  left: 0;
  bottom: 12px;
  width: 100%;
  padding: 0 13px;
  box-sizing: border-box;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .edit {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 66px;
  height: 32px;
  font-size: 12px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .edit:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .edit:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 15px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 16px 15px;
  background-image: url("../img/icn_edit_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .edit:active::before {
  background-image: url("../img/icn_edit_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .routeDetailsBtnBox {
  position: absolute;
  right: 12px;
  bottom: 0;
  display: flex;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .bookmark {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 110px;
  height: 32px;
  margin-right: 10px;
  font-size: 12px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .bookmark:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .bookmark:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: left center;
  background-image: url("../img/icn_star_plas_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .bookmark:active:before {
  background-image: url("../img/icn_star_plas_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .destinationSetting {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 32px;
  margin-right: 10px;
  font-size: 12px;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .destinationSetting:active {
  color: #ffffff;
  background-color: #009E96;
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .destinationSetting:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 16px;
  padding-right: 5px;
  background-repeat: no-repeat;
  background-size: 12px 16px;
  background-position: left center;
  background-image: url("../img/icn_pin_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBtnWrap .destinationSetting:active:before {
  background-image: url("../img/icn_pin_small.svg");
}

.map .mapContentWrap .routeDetails .routeDetailsBackBtn {
  position: absolute;
  bottom: -42px;
  left: 50%;
  display: block;
  height: 32px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 1px 2px #00000033;
  line-height: 1.5em;
  border: solid 1px #009E96;
  border-radius: 40px;
  box-sizing: border-box;
  transform: translate(-50%, 0);
}

.map .mapContentWrap .routeDetails .routeDetailsBackBtn:active {
  color: #ffffff;
  background-color: #009E96;
}

/* .routeDetails.home, building*/
.map .mapContentWrap .routeDetails.home .routeDetailsWrap h2,
.map .mapContentWrap .routeDetails.building .routeDetailsWrap h2 {
  padding-bottom: 5px;
}

.map .mapContentWrap .routeDetails.home .routeDetailsWrap h2 span,
.map .mapContentWrap .routeDetails.transition .routeDetailsWrap h2 span,
.map .mapContentWrap .routeDetails.building .routeDetailsWrap h2 span {
  display: inline-block;
  vertical-align: middle;
}

.map .mapContentWrap .routeDetails.home .routeDetailsWrap h2 img,
.map .mapContentWrap .routeDetails.transition .routeDetailsWrap h2 img,
.map .mapContentWrap .routeDetails.building .routeDetailsWrap h2 img {
  display: inline-block;
  padding-right: 10px;
  vertical-align: middle;
}

/*.routeDetails.transition */
.map .mapContentWrap .routeDetails.transition .routeDetailsWrap h2 {
  padding-bottom: 10px;
}
.modal.routeFinish .modalContent.modalMessage .modalBtnWrap .modalBtn.modalCancelBtn{
  color: #009E96;
  background-color: transparent;
}