.serviceMenu {
  display: flex;
  align-items: center;
  gap: 8px;
}

.serviceMenuItem i {
  color: var(--bg);
}

.serviceMenuItem a {
  color: #000000;
  font-weight: bold;
}

.serviceChild__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 16px;
  margin-top: 24px;
  font-weight: bold;
  color: var(--white);
  background-color: var(--bg);
  border-radius: 40px;
  border: 2px solid var(--bg);
  transition: background-color 0.3s, color 0.3s;
}

.anemos__contentText a:hover .serviceChild__btn {
  background-color: #fff;
  color: var(--bg);
}

.anemos__accessText a:hover .serviceChild__btn {
  background-color: #fff;
  color: var(--bg);
}

.serviceChild__imgWithTextArea a:hover .serviceChild__btn {
  background-color: #fff;
  color: var(--bg);
}

.cleaning__flowContentContainer a:hover .serviceChild__btn {
  background-color: #fff;
  color: var(--bg);
}

.serviceChild__btn i {
  margin-left: 24px;
}

.serviceChild__header {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 120px auto 80px;
  font-size: 32px;
  font-weight: bold;
}

.serviceChild__imgWithText {
  display: flex;
  gap: 40px;
  margin-top: 40px;
  padding-bottom: 40px;
  border-bottom: 4px solid #f5f5f5;
}

.serviceChild__imgWithTextImg {
  flex: 1;
}

.serviceChild__imgWithTextImg img {
  border-radius: 8px;
  aspect-ratio: 3/2;
  object-fit: cover;
}

.serviceChild__imgWithTextText {
  flex: 1;
  line-height: 2em;
  font-weight: bold;
}

.serviceChild__imgWithTextArea {
  flex: 1;
}

.serviceChild__imgWithTextTilte {
  font-size: 24px;
  font-weight: bold;
}

/* anemos */

.anemos__contentContainer {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 80px;
  margin-top: 80px;
  padding-bottom: 40px;
  border-bottom: 4px solid #f5f5f5;
}

.anemos__content {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.anemos__contentImg img {
  width: 100%;
  aspect-ratio: 3/2;
  border-radius: 8px;
}

.anemos__contentTitle {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 24px;
  font-weight: bold;
}

.anemos__contentTitle i {
  margin-right: 8px;
  color: var(--bg);
}

.anemos__contentText {
  margin-top: 8px;
  line-height: 2em;
  font-weight: bold;
}

.anemos__accessContainer {
  display: flex;
  gap: 40px;
  margin-top: 80px;
  padding-bottom: 40px;
}

.anemos__accessMap {
  flex: 1;
  aspect-ratio: 3/2;
}

.anemos__accessMap iframe {
  border-radius: 8px;
  width: 100%;
  height: 100%;
}

.anemos__accessText {
  flex: 1;
}

.anemos__accessTextTitle {
  font-size: 24px;
  font-weight: bold;
}

.anemos__accessTextTitle i {
  color: var(--bg);
}

.anemos__accessTextList {
  margin-top: 8px;

  font-weight: bold;
}

/* atata-tiryouin */

.atata-tiryouin__timeTableTitle {
  margin-top: 80px;
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}

.atata-tiryouin__timeTableList {
  max-width: 800px;
  margin: 80px auto;
}

.atata-tiryouin__timeTableListContent {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}

.atata-tiryouin__timeTableDate {
  flex: 1;

  width: fit-content;

  padding: 8px;

  background-color: var(--bggradient);
  text-align: center;
}

.atata-tiryouin__timeTableAM {
  flex: 1;

  text-align: center;
}

.atata-tiryouin__timeTablePM {
  flex: 1;

  text-align: center;
}

.atata-tiryouin__timeTableRest {
  flex: 2;

  padding-left: 24px !important;

  text-align: center;
}

.atata-tiryouin__courseHeader {
  margin-top: 120px;
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}

.atata-tiryouin__courseText {
  margin-top: 60px;
  text-align: center;
}

.atata-tiryouin__courseContentContainer {
  display: flex;
  gap: 24px;
  margin-top: 40px;
}

.atata-tiryouin__courseContent {
  flex: 1;
}

.atata-tiryouin__courseContentTime {
  padding: 16px;

  font-size: 24px;
  font-weight: bold;
  text-align: center;

  border-radius: 40px 40px 0px 0px;
  background-color: var(--subHeader);
  color: var(--white);
}

.atata-tiryouin__courseContentPrice {
  padding: 16px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;

  background-color: var(--bggradient);
}

.atata-tiryouin__courseContentPrice span {
  font-size: 16px;
  font-weight: bold;
}

.atata-tiryouin__attention {
  margin-top: 80px;
}

.atata-tiryouin__attentionTitle {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 8px;
}

.atata-tiryouin__attentionList {
  line-height: 2em;
}

.atata-tiryouin__access {
  padding-bottom: 40px;
}

.atata-tiryouin__accessLoacateHeader {
  margin-top: 120px;
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}

.atata-tiryouin__accessLoacate {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 64px;
}

.atata-tiryouin__accessLocateText {
  font-weight: bold;
  line-height: 2rem;
  margin-top: 40px;
  font-size: 20px;
}

.atata-tiryouin__accessLocateImg {
  flex: 1;
}

.atata-tiryouin__accessLocateImg img {
  border-radius: 8px;
}

.atata-tiryouin__accessPublicHeader {
  margin-top: 40px;
  font-size: 24px;
  font-weight: bold;
}

.atata-tiryouin__accessPublicHeader i {
  color: var(--bg);
  margin-right: 8px;
}

.atata-tiryouin__accessCarHeader i {
  color: var(--bg);
  margin-right: 8px;
}

.atata-tiryouin__accessPublicText {
  margin-top: 16px;
  line-height: 2em;
}

.atata-tiryouin__accessCarHeader {
  margin-top: 40px;
  font-size: 24px;
  font-weight: bold;
}

.atata-tiryouin__accessCarContent {
  margin-top: 16px;
  line-height: 2em;
}

.atata-tiryouin__accessCarContentHeader {
  font-weight: bold;
}

.atata-tiryouin__accessCarContentText {
  margin-top: 8px;
}

.atata-tiryouin__accessMap {
  flex: 1;
}

.atata-tiryouin__accessMap iframe {
  border-radius: 8px;
  width: 100%;
  height: 100%;
  aspect-ratio: 3/2;
}

.atata-tiryouin__timeTableBorder1 {
  border-top: 1px solid #d3d3d3;
  border-left: 1px solid #d3d3d3;
  border-right: 1px solid #d3d3d3;
}

.atata-tiryouin__timeTableBorder2,
.atata-tiryouin__timeTableBorder3 {
  padding: 8px;
  border-top: 1px solid #d3d3d3;
  border-right: 1px solid #d3d3d3;
  background-color: #fff;
}

.atata-tiryouin__timeTableBorderBottom {
  border-bottom: 1px solid #d3d3d3;
}

/* ryugujo */

.ryugujo__reason {
  display: flex;
  gap: 40px;
  margin-top: 80px;
  line-height: 2em;
}

.ryugujo__reasonImg {
  flex: 1;
}

.ryugujo__reasonImg img {
  border-radius: 8px;
}

.ryugujo__reasonText {
  flex: 1;
  font-weight: bold;
}

.ryugujo__map {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 40px;
  padding-bottom: 40px;
}

.ryugujo__mapHeaderTextArea {
  flex: 1;
}

.ryugujo__mapIframe {
  flex: 1;
  aspect-ratio: 3/2;
}

.ryugujo__mapIframe iframe {
  width: 100%;
  height: 100%;
}

.ryugujo__mapHeader {
  margin-top: 40px;
  font-size: 24px;
  font-weight: bold;
}

.ryugujo__mapHeader i {
  color: var(--bg);
}

.ryugujo__mapText {
  margin-top: 24px;

  font-weight: 600;
  line-height: 2rem;
}

.ryugujo__map iframe {
  margin-top: 40px;

  border-radius: 8px;
}

/* go-go-hurima */

/* helper */

.helper__btn {
  width: fit-content !important;
}

/* massage */

.massage__effectContentContainer {
  display: flex;
  gap: 24px;

  margin-top: 40px;
}

.massage__effectContentText {
  margin-top: 8px;
  line-height: 2em;
}

.massage__effectContent {
  flex: 1;
}
.massage__effectContentTitle {
  font-size: 20px;
  font-weight: bold;
  color: var(--bg);
}
.massage__timeTableTime {
  flex: 1;
  padding: 8px;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
}

.massage__timeTableList {
  max-width: 600px;

  margin: 40px auto;
}

.massage__timeTableListContent {
  display: flex;

  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.massage__timeTableDate {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;

  padding: 8px;

  background: var(--bggradient);
}

.massage__timeTableBorderLeft {
  border-top: 1px solid #d3d3d3;
  border-left: 1px solid #d3d3d3;
  border-right: 1px solid #d3d3d3;
}

.massage__timeTableBorderRight {
  border-top: 1px solid #d3d3d3;
  border-right: 1px solid #d3d3d3;
  background-color: #fff;
}

.massage__timeTableBorderBottom {
  border-bottom: 1px solid #d3d3d3;
}

.massage__timeTableTimetTitle {
  flex: 1;

  padding: 8px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.massage__timeTableTime {
  flex: 1;
  padding: 8px;
  font-size: 16px;
  font-weight: 400;
}

.massage__flowContentHeader {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.massage__flowContentHeaderNum {
  font-weight: bold;
  color: var(--subHeader);
  font-size: 24px;
}

.massage__flowContentHeaderIcon i {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 100px;
  height: 100px;
  padding: 24px;

  font-size: 40px;
  color: var(--white);
  background: var(--subHeader);
  border-radius: 100vh;
}

.massage__flowContentTextArea {
  flex: auto;
}

.massage__flowContent {
  display: flex;
  gap: 40px;
  margin-top: 40px;
}

.massage__flowContentTitle {
  padding: 8px;

  font-size: 24px;
  font-weight: bold;
}

.massage__flowContentText {
  margin-top: 16px;
  padding: 8px;

  background: var(--bggradient);
  border-radius: 8px;
  font-weight: bold;
}

.massage__priceContentContainer {
  display: flex;
  gap: 24px;

  margin: 40px auto;
}

.massage__priceContent {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  flex: 1;

  padding: 16px;
  background: var(--bggradient);
  border-radius: 40px;
  text-align: center;
}

.massage__priceContentMenu {
  display: flex;
  flex-direction: column;

  flex: 3;

  font-size: 24px;
  font-weight: bold;
  color: var(--btn);
}

.massage__priceContentMenu span {
  margin-top: 24px;
  font-size: 12px;
}

.massage__priceContentPrice {
  margin-top: 40px;
  font-weight: bold;
}

.massage__priceContentPrice span {
  font-size: 40px;
  color: var(--subHeader);
}

.massage__priceContentNum {
  margin-top: 16px;
  font-weight: bold;
}

.massage__priceCar {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-direction: column;
}

.massage__priceCarTitle {
  font-size: 24px;
  font-weight: bold;
}

.massage__priceCarPrice {
  font-weight: bold;
}

.massage__priceAttention {
  margin-top: 24px;
}

.serviceChild__btnContact {
  width: 400px;
  margin: 24px auto;
  margin-top: 80px;
}

/* cleaning */

.cleaning__flowContentHeader {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.cleaning__flowContentHeaderNum {
  font-weight: bold;
  color: var(--subHeader);
  font-size: 24px;
}

.cleaning__flowContentHeaderIcon i {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  padding: 24px;
  font-size: 40px;
  color: var(--white);
  background: var(--subHeader);
  border-radius: 100vh;
}

.cleaning__flowContentTextArea {
  flex: auto;
}

.cleaning__flowContent {
  display: flex;
  gap: 40px;
  margin-top: 40px;
}

.cleaning__flowContentTitle {
  padding: 8px;
  font-size: 24px;
  font-weight: bold;
}

.cleaning__flowContentText {
  margin-top: 16px;
  padding: 8px;

  background: var(--bggradient);
  border-radius: 8px;
  font-weight: bold;
}

@media screen and (max-width: 770px) {
  .serviceChild__header {
    font-size: 20px;
    margin: 60px auto 40px;
  }

  .serviceChild__header.cleanengChild__header {
    margin: 0;
    background-color: #f5f5f5;
    padding: 40px 20px 0;
    border-radius: 10px 10px 0 0;
  }

  .serviceChild__imgWithText {
    flex-direction: column;
    border: none;
  }

  .anemos__content {
    flex-direction: column;
    gap: 16px;
  }

  .anemos__contentContainer {
    grid-template-columns: none;
    background-color: #f5f5f5;
    margin: 0;
    padding: 40px 20px;
    border-radius: 10px;
    border: none;
  }

  .anemos__accessContainer {
    flex-direction: column;
  }
  .serviceChild__imgWithTextText {
    margin-bottom: 40px;
  }
  .serviceChild__btn {
    display: block;
    width: 100% !important;
    text-align: center;
    margin: 10px 0 0;
  }

  .cleaningChild__header {
    font-size: 20px;
    padding: 40px 20px;
    margin: 0;
    background-color: #f5f5f5;
    border-radius: 10px 10px 0 0;
  }

  .cleaning__flowContentContainer {
    padding: 1px 20px 40px;
    background-color: #f5f5f5;
    border-radius: 0 0 10px 10px;
  }
  .cleaning__flowContent {
    gap: 10px;
    margin-top: 20px;
  }
  .cleaning__flowContentHeader {
    justify-content: flex-end;
    flex-direction: column-reverse;
  }
  .cleaning__flowContentHeaderIcon i {
    width: 60px;
    height: 60px;
    font-size: 30px;
  }
  .cleaning__flowContentTitle {
    padding: 0;
    font-size: 20px;
  }
  .cleaning__flowContentText {
    padding: 16px 8px;
    margin-top: 0;
    background-color: #fff0;
    border-top: 2px solid var(--bg);
    border-radius: 0;
  }
  .atata-tiryouin__timeTableList {
    width: 100%;
    margin: 24px auto 0;
    padding-bottom: 24px;
  }
  .atata-tiryouin__timeTableDate {
    flex: 0.4;
  }
  .atata-tiryouin__timeTableBorder2,
  .atata-tiryouin__timeTableBorder3 {
    padding: 8px 2px;
  }
  .atata-tiryouin__timeTableRest {
    padding: 8px 5px !important;
  }
  .atata-tiryouin__attention {
    margin-top: 40px;
  }
  .atata-tiryouin__attentionTitle {
    text-align: center;
  }
  .atata-tiryouin__course {
    background-color: #f5f5f5;
    padding: 1px 20px 40px;
    border-radius: 0 0 10px 10px;
  }
  .atata-tiryouin__courseText {
    margin-top: 24px;
    text-align: left;
  }

  .atata-tiryouin__timeTable {
    background-color: #f5f5f5;
    border-radius: 10px 10px 0 0;
    padding: 0 20px;
  }

  .atata-tiryouin__timeTableTitle {
    font-size: 24px;
    margin: 0;
    padding-top: 40px;
  }

  .atata-tiryouin__courseHeader {
    font-size: 24px;
    margin-top: 80px;
  }

  .atata-tiryouin__accessLoacateHeader {
    font-size: 24px;
    margin-top: 80px;
  }

  .atata-tiryouin__courseContentContainer {
    margin-top: 24px;
    flex-direction: column;
    gap: 8px;
  }

  .atata-tiryouin__accessLoacate {
    flex-direction: column;
    gap: 8px;
    margin-top: 24px;
  }

  .atata-tiryouin__accessPublicHeader {
    font-size: 20px;
  }

  .atata-tiryouin__accessPublicText {
    margin-top: 8px;
  }

  .atata-tiryouin__accessCarHeader {
    font-size: 20px;
  }

  .atata-tiryouin__accessCarContent {
    margin-top: 8px;
  }

  .atata-tiryouin__accessCarContentText {
    margin-top: 0;
  }

  .atata-tiryouin__accessLocateText {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.5em;
  }

  .atata-tiryouin__accessMap {
    width: 100%;
  }

  .ryugujo__reason {
    flex-direction: column-reverse;
    padding: 40px 20px;
    background-color: #f5f5f5;
    border-radius: 10px;
    margin-top: 0;
    gap: 20px;
  }

  .ryugujo__map {
    flex-direction: column;
    margin-top: 80px;
    gap: 40px;
  }

  .ryugujo__mapHeader {
    margin: 0;
  }

  .ryugujo__mapText {
    margin-top: 0;
  }

  .ryugujo__map iframe {
    margin-top: 0px;
  }

  .massage__timeTable {
    padding: 80px 20px 0;
    background-color: #f5f5f5;
  }

  .massage__timeTableList {
    margin: 0;
  }

  .massage__flow {
    padding: 80px 20px 0;
    background-color: #f5f5f5;
  }

  .massage__effect {
    padding: 40px 20px 0;
    background-color: #f5f5f5;
    border-radius: 10px 10px 0 0;
  }

  .massageChild__header {
    margin: 0;
  }

  .massage__effectContentContainer {
    flex-direction: column;
  }
  .massage__effectContentText {
    margin: 0;
  }
  .massage__flowContent {
    gap: 10px;
    margin-top: 20px;
  }
  .massage__flowContentHeader {
    justify-content: flex-end;
    flex-direction: column-reverse;
  }
  .massage__flowContentHeaderIcon i {
    width: 60px;
    height: 60px;
    font-size: 30px;
  }

  .massage__flowContentTitle {
    padding: 0;
    font-size: 20px;
  }

  .massage__priceContentContainer {
    flex-direction: column;
  }

  .massage__flowContentText {
    padding: 16px 8px;
    margin-top: 0;
    background-color: #fff0;
    border-top: 2px solid var(--bg);
    border-radius: 0;
  }

  .massage__price {
    padding: 80px 20px 40px;
    background-color: #f5f5f5;
    border-radius: 0 0 10px 10px;
  }
  .massage__priceContent {
    background-color: #fff;
    border: 2px solid var(--bg);
  }
  .massage__priceContentMenu span {
    margin: 0;
  }
  .massage__priceContentMenu {
    font-size: 20px;
  }
  .massage__priceContentPrice {
    margin-top: 10px;
  }
  .massage__priceContentNum {
    margin-top: 10px;
  }
  .serviceChild__btnContact {
    margin-top: 40px;
  }

  .massage__timeTableListContent,
  .massage__timeTableTimetTitle {
    font-size: 16px;
  }

  .pageTitle__jpnAnemos,
  .pageTitle__jpnUsedCar {
    font-size: 24px !important;
  }
}