@media only screen and (min-width: 768px) {
  .location-introduction {
    padding: 160px 0;
  }
}
@media only screen and (max-width: 767px) {
  .location-introduction {
    padding: calc(80 / 375 * 100vw) 0 calc(120 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .location-akiba {
    padding: 160px 0;
  }
}
@media only screen and (max-width: 767px) {
  .location-akiba {
    padding: calc(120 / 375 * 100vw) 0 calc(80 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .location-asakusabashi {
    padding: 160px 0;
  }
}
@media only screen and (max-width: 767px) {
  .location-asakusabashi {
    padding: calc(120 / 375 * 100vw) 0 calc(80 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .location-shop {
    padding: 160px 0;
  }
}
@media only screen and (max-width: 767px) {
  .location-shop {
    padding: calc(120 / 375 * 100vw) 0 calc(80 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .location-lifeInfo {
    padding: 120px 0;
  }
}
@media only screen and (max-width: 767px) {
  .location-lifeInfo {
    padding: calc(80 / 375 * 100vw) 0;
  }
}

@media only screen and (min-width: 768px) {
  .introSect__head {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__head {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
.introSect__cont {
  display: grid;
}
@media only screen and (min-width: 768px) {
  .introSect__cont {
    gap: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__cont {
    gap: calc(64 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .introSect__head + .introSect__cont {
    margin-top: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__head + .introSect__cont {
    margin-top: calc(64 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .introSect__stations {
    display: contents;
  }
}
@media only screen and (min-width: 768px) {
  .introSect__map {
    grid-row: 2;
    padding-bottom: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__map {
    margin-left: calc(-16 / 375 * 100vw);
    margin-right: calc(-16 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .introSect__map .photo {
    width: 750px;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) {
  .introSect__area {
    display: flex;
    gap: 32px;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__area {
    display: contents;
  }
}
@media only screen and (min-width: 768px) {
  .introSect__area--head {
    grid-row: 1;
  }
}
@media only screen and (min-width: 768px) {
  .introSect__area--foot {
    grid-row: 3;
  }
}
@media only screen and (min-width: 768px) {
  .introSect__item {
    width: calc((100% - 64px) / 3);
  }
}
@media only screen and (max-width: 767px) {
  .introSect__item {
    width: calc((100% - 3px) / 2);
  }
}

.areaBlock {
  background-color: #EAF6FA;
  --ttl-color: #3DA7BA;
}
@media only screen and (min-width: 768px) {
  .areaBlock {
    width: 100%;
    padding: 40px 17px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock {
    margin: 0 calc(-16 / 375 * 100vw);
    padding: calc(40 / 375 * 100vw);
  }
}
.areaBlock__list {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .areaBlock__list {
    gap: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__list {
    margin: 0 auto;
    flex-direction: column;
    gap: calc(8 / 375 * 100vw);
    width: calc(255 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__item {
    width: calc((100% - 32px) / 3);
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__desc {
    display: flex;
    gap: 64px;
    justify-content: center;
    align-items: center;
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__list + .areaBlock__desc {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__list + .areaBlock__desc {
    margin-top: calc(40 / 375 * 100vw);
  }
}
.areaBlock__ttl {
  width: -moz-fit-content;
  width: fit-content;
  color: var(--ttl-color);
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .areaBlock__ttl {
    margin: 0 auto;
  }
}
.areaBlock__ttl .en {
  letter-spacing: 0.1em;
  line-height: 1.5;
  display: block;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .areaBlock__ttl .en {
    font-size: 12px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__ttl .en {
    font-size: calc(12 / 375 * 100vw);
  }
}
.areaBlock__ttl .jp {
  display: block;
  line-height: 1.6;
  text-box: trim-both text;
  letter-spacing: 0.05em;
}
@media only screen and (min-width: 768px) {
  .areaBlock__ttl .jp {
    font-size: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__ttl .jp {
    font-size: calc(50 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__ttl .jp + .en {
    margin-top: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__ttl .jp + .en {
    margin-top: calc(16 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__txtArea {
    width: 680px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__ttl + .areaBlock__txtArea {
    margin-top: calc(32 / 375 * 100vw);
  }
}
.areaBlock__heading {
  color: #000000;
  letter-spacing: 0.1em;
  line-height: 1.8;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .areaBlock__heading {
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__heading {
    font-size: calc(16 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .areaBlock__heading + .txt {
    margin-top: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .areaBlock__heading + .txt {
    margin-top: calc(24 / 375 * 100vw);
  }
}
.areaBlock--asakusabashi {
  --ttl-color: #A6347B;
  background-color: #EEEAF5;
}

.stationCard__ttl {
  text-align: center;
  color: #2A4FBA;
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .stationCard__ttl {
    font-size: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .stationCard__ttl {
    font-size: calc(24 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .photo + .stationCard__ttl {
    margin-top: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .photo + .stationCard__ttl {
    margin-top: calc(16 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .akibaSect__head {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__head {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__cont .usableList__inner {
    gap: 32px;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__cont .usableList__inner {
    flex-direction: column;
    gap: calc(32 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__cont .usableList__item {
    width: calc((100% - 64px) / 3);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__head + .akibaSect__cont {
    margin-top: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__head + .akibaSect__cont {
    margin-top: calc(64 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__bottom {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__bottom {
    margin-top: calc(120 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__bottom .usableList__inner {
    gap: 64px;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__bottom .usableList__inner {
    flex-direction: column;
    gap: calc(40 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .akibaSect__bottom .usableList__item {
    width: calc(50% - 32px);
  }
}
.akibaSect__bottom .usableList__item .spotCard__label {
  position: absolute;
}
@media only screen and (min-width: 768px) {
  .akibaSect__bottom .usableList__item .spotCard__label {
    top: -10px;
    right: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .akibaSect__bottom .usableList__item .spotCard__label {
    right: calc(10 / 375 * 100vw);
    top: calc(-10 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .historySect__head {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__head {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .historySect__cont .headingUnit {
    max-width: 766px;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__cont .headingUnit + .relatedBox {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__cont .headingUnit + .relatedBox {
    margin-top: calc(40 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .historySect__head + .historySect__cont {
    margin-top: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__head + .historySect__cont {
    margin-top: calc(64 / 375 * 100vw);
  }
}
.historySect__kagai {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .historySect__kagai {
    margin-top: 80px;
    align-items: center;
    gap: 64px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__kagai {
    flex-direction: column;
    gap: calc(40 / 375 * 100vw);
    margin-top: calc(120 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .historySect__kagai .headingUnit {
    width: 576px;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__painting {
    width: 322px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__painting {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
.historySect__painting .photo {
  margin: 0 auto;
}
@media only screen and (min-width: 768px) {
  .historySect__painting .photo {
    width: 204px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__painting .photo {
    width: calc(204 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .historySect__painting .photo + .cap {
    text-align: right;
    margin-top: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__painting .photo + .cap {
    margin-top: calc(40 / 375 * 100vw);
  }
}
.historySect__temple {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .historySect__temple {
    gap: 62px;
    margin-top: 80px;
    align-items: flex-start;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__temple {
    gap: calc(40 / 375 * 100vw);
    margin-top: calc(120 / 375 * 100vw);
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__temple .headingUnit {
    width: 298px;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__temple .usableList {
    flex: 1;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__temple .usableList__inner {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__temple .usableList__inner + .cap {
    text-align: left;
    width: calc(295 / 375 * 100vw);
    margin: calc(40 / 375 * 100vw) auto 0;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__temple .usableList__item:nth-child(1) {
    width: 380px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__temple .usableList__item:nth-child(1) {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .historySect__temple .usableList__item:nth-child(2) {
    width: 298px;
    margin-left: -78px;
    margin-top: 119px;
  }
}
@media only screen and (max-width: 767px) {
  .historySect__temple .usableList__item:nth-child(2) {
    width: calc(295 / 375 * 100vw);
    margin: calc(40 / 375 * 100vw) auto 0;
  }
}

.historicalChange {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .historicalChange {
    gap: 64px;
    justify-content: center;
  }
}
@media only screen and (max-width: 767px) {
  .historicalChange {
    align-items: center;
    flex-direction: column;
    gap: calc(40 / 375 * 100vw);
  }
}
.historicalChange__arrow {
  background: #D9D9D9;
}
@media only screen and (min-width: 768px) {
  .historicalChange__arrow {
    width: 34px;
    height: 94px;
    margin-top: 52px;
    clip-path: polygon(0 0, 0 100%, 100% 50%);
  }
}
@media only screen and (max-width: 767px) {
  .historicalChange__arrow {
    width: calc(80 / 375 * 100vw);
    height: calc(32 / 375 * 100vw);
    clip-path: polygon(0 0, 100% 0%, 50% 100%);
  }
}
@media only screen and (min-width: 768px) {
  .historicalChange__item {
    width: 298px;
  }
}
.historicalChange__item .primaryCard__head .photo .cap {
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-family: "Shippori Mincho", serif;
}
@media only screen and (min-width: 768px) {
  .historicalChange__item .primaryCard__head .photo .cap {
    font-size: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .historicalChange__item .primaryCard__head .photo .cap {
    font-size: calc(24 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .shopSect__head {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__head {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
.shopSect__cont .zoomFigure {
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 768px) {
  .shopSect__cont .zoomFigure {
    width: 704px;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__cont .zoomFigure {
    width: calc(306 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .shopSect__cont .enTtl + .zoomFigure {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__cont .enTtl + .zoomFigure {
    margin-top: calc(64 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .shopSect__cont .usableList {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__cont .usableList {
    margin-top: calc(64 / 375 * 100vw);
  }
}
.shopSect__cont .usableList__inner {
  display: block;
}
@media only screen and (min-width: 768px) {
  .shopSect__cont .usableList__item:not(:first-child) {
    margin-top: 64px;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__cont .usableList__item:not(:first-child) {
    margin-top: calc(64 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .shopSect__head + .shopSect__cont {
    margin-top: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .shopSect__head + .shopSect__cont {
    margin-top: calc(120 / 375 * 100vw);
  }
}

.gourmetCard {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .gourmetCard {
    align-items: center;
    gap: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard {
    flex-direction: column;
    gap: calc(40 / 375 * 100vw);
  }
}
.gourmetCard__head {
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__head {
    width: 448px;
  }
}
.gourmetCard__sub {
  position: absolute;
}
.gourmetCard__label {
  position: absolute;
  z-index: 2;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__label {
    right: 10px;
    top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__label {
    right: calc(10 / 375 * 100vw);
    top: calc(10 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .gourmetCard__desc {
    width: 448px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__desc {
    padding: 0 calc(24 / 375 * 100vw);
  }
}
.gourmetCard__ttl {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.gourmetCard__ttl .num {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #7A6A44;
  color: #fff;
  aspect-ratio: 1/1;
  letter-spacing: 0;
  line-height: 1;
  font-family: "Cinzel", serif;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__ttl .num {
    font-size: 15px;
    width: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__ttl .num {
    font-size: calc(12 / 375 * 100vw);
    width: calc(20 / 375 * 100vw);
  }
}
.gourmetCard__ttl .name {
  flex: 1;
  color: #333333;
  display: block;
  letter-spacing: 0.1em;
  line-height: 1.8;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__ttl .name {
    font-size: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__ttl .name {
    font-size: calc(15 / 375 * 100vw);
  }
}
.gourmetCard__txt {
  color: #333333;
  line-height: 1.8;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__txt {
    font-size: 12px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__txt {
    font-size: calc(12 / 375 * 100vw);
  }
}
.gourmetCard__txt + .gourmetCard__txt {
  border-top: 1px solid #D9D9D9;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__txt + .gourmetCard__txt {
    margin-top: 16px;
    padding-top: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__txt + .gourmetCard__txt {
    margin-top: calc(16 / 375 * 100vw);
    padding-top: calc(16 / 375 * 100vw);
  }
}
.gourmetCard__txt .large {
  display: block;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
@media only screen and (min-width: 768px) {
  .gourmetCard__txt .large {
    font-size: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__txt .large {
    font-size: calc(16 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .gourmetCard__ttl + .gourmetCard__txt {
    margin-top: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard__ttl + .gourmetCard__txt {
    margin-top: calc(24 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .gourmetCard--rev {
    flex-direction: row-reverse;
    justify-content: flex-end;
  }
}
@media only screen and (min-width: 768px) {
  .gourmetCard--03 .gourmetCard__sub {
    left: 20px;
    top: -51px;
    width: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .gourmetCard--03 .gourmetCard__sub {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .lifeInfoSect__head .zoomFigure {
    width: calc(306 / 375 * 100vw);
    margin-left: auto;
    margin-right: auto;
  }
}
@media only screen and (min-width: 768px) {
  .lifeInfoSect__head .enTtl + .zoomFigure {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .lifeInfoSect__head .enTtl + .zoomFigure {
    margin-top: calc(40 / 375 * 100vw);
  }
}
@media only screen and (min-width: 768px) {
  .lifeInfoSect__cont .layoutCol {
    -moz-column-count: 2;
         column-count: 2;
    display: block;
    -moz-column-width: 464px;
         column-width: 464px;
  }
}
@media only screen and (min-width: 768px) {
  .lifeInfoSect__head + .lifeInfoSect__cont {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .lifeInfoSect__head + .lifeInfoSect__cont {
    margin-top: calc(40 / 375 * 100vw);
  }
}

@media only screen and (min-width: 768px) {
  .lifeInfoBlock {
    -moz-column-break-inside: avoid;
         break-inside: avoid;
  }
}
.lifeInfoBlock__ttl {
  color: #7A6A44;
  letter-spacing: 0.05em;
  line-height: 1.8;
  text-box: trim-both text;
  border-bottom: 1px solid rgba(149, 119, 40, 0.8);
}
@media only screen and (min-width: 768px) {
  .lifeInfoBlock__ttl {
    font-size: 16px;
    padding: 20px 10px;
  }
}
@media only screen and (max-width: 767px) {
  .lifeInfoBlock__ttl {
    font-size: calc(16 / 375 * 100vw);
    padding: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
  }
}
.lifeInfoBlock__item {
  display: flex;
  position: relative;
  z-index: 1;
  align-items: center;
  color: #000000;
  justify-content: space-between;
  border-bottom: 1px solid rgba(34, 34, 34, 0.15);
}
@media only screen and (min-width: 768px) {
  .lifeInfoBlock__item {
    padding: 20px 10px;
    gap: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .lifeInfoBlock__item {
    padding: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
    gap: calc(16 / 375 * 100vw);
  }
}
.lifeInfoBlock__item .place,
.lifeInfoBlock__item .dist {
  display: inline-block;
  letter-spacing: 0.05em;
  line-height: 1.8;
  text-box: trim-both text;
}
@media only screen and (min-width: 768px) {
  .lifeInfoBlock__item .place,
  .lifeInfoBlock__item .dist {
    font-size: 14px;
  }
}
@media only screen and (max-width: 767px) {
  .lifeInfoBlock__item .place,
  .lifeInfoBlock__item .dist {
    font-size: calc(14 / 375 * 100vw);
  }
}
.lifeInfoBlock__item .place {
  flex: 1;
}
.lifeInfoBlock__item .dist {
  white-space: nowrap;
}