body {
  margin: 8px 12px 2rem;
  font-family: Arial, sans-serif;
  color: #181818;
  overflow-wrap: anywhere;
}

table {
  max-width: 100%;
}

.ja-masthead, .ja-topline, .ja-cards, .ja-map {
  width: min(100%, 1100px);
  margin-inline: auto;
}

.ja-footmenu, .ja-content, .ja-main {
  max-width: min(100%, 1100px);
  margin-inline: auto;
}

.ja-masthead, .ja-masthead-block {
  background-color: #f2f0f0;
  font-size: 15px;
}

.ja-masthead a.header, .ja-brand {
  white-space: nowrap;
  color: #000;
  font-family: "Arial Black", Arial, sans-serif;
  font-weight: 900;
}

.ja-masthead a.topmenu, .ja-footmenu a.topmenu {
  color: #595959;
}

.ja-topline-block { padding: .4rem 0; }
.ja-masthead-block {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem 1rem;
  flex-wrap: wrap;
  padding: .55rem .7rem;
}
.ja-brand span {
  display: inline-block;
  background: #f00;
  border-radius: 20px;
  width: 1.3em;
  height: 1.3em;
  vertical-align: middle;
}
.ja-main { width: min(100%, 875px); padding-block: 1.2rem; }

h1, h2, h3, h4 { line-height: 1.15; overflow-wrap: anywhere; }
h2, h2.lupa { font-size: clamp(1.65rem, 4vw, 3.125rem); }
h4, h4.lupa { line-height: 1.15; font-size: clamp(1.35rem, 2.8vw, 1.875rem); }
.ja-heading { font-size: clamp(1.65rem, 4vw, 3.125rem); }
p.author { line-height: 1.35; }

img { height: auto; max-width: 100%; }
.ja-content { min-width: 0; }
.ja-content p { line-height: 1.45; }
.ja-content p a, .ja-main p a, .ja-map-list a { color: #3e3e3e; text-decoration: underline; }
.ja-content td:not([background]) a:not(.topmenu, .header, .new, .marquee) { color: #505050; }
.ja-content td:not([background]) a:hover, .ja-map-list a:hover { color: #000; }
.ja-card {
  position: relative;
  background-size: cover;
  background-position: center;
}
.ja-card-empty {
  padding: 12px;
  background: #f2f0f0;
}
.ja-card a {
  background: rgba(0, 0, 0, .73);
  border-radius: 2px;
  color: white;
  opacity: 1;
  padding: .12em .25em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.ja-card a:hover, .ja-card a:focus-visible { color: #fff; text-decoration: underline; opacity: 1; }
.ja-card a.black { background: rgba(255, 255, 255, .86); color: black; }
.ja-card-empty a { color: #333; text-decoration: underline; }
.ja-external { display: inline-block; padding: .35em 0; color: #343434; text-decoration: underline; }
.ja-map img { display: block; margin-inline: auto; }
.ja-map-list { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin: .7rem auto; padding: 0; list-style: none; }
.ja-map-list li { display: inline; }

.ja-ticker {
  background: #000;
  box-sizing: border-box;
  width: min(1100px, calc(100vw - 28px));
  white-space: nowrap;
  overflow: auto;
  padding: .25rem .5rem;
}
.ja-ticker a.marquee { color: #ff6464; }
.ja-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.ja-search {
  display: flex;
  align-items: center;
  gap: .4rem;
  max-width: 100%;
  padding: .3rem 0;
}
.ja-search label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.ja-search input {
  box-sizing: border-box;
  max-width: 240px;
  min-width: 0;
  width: 100%;
  min-height: 32px;
  padding: .35em .5em;
  border: 1px solid #767676;
  font: inherit;
}
.ja-search button {
  min-height: 32px;
  padding: .3em .6em;
  border: 1px solid #767676;
  background: #f2f0f0;
  color: #222;
  font: inherit;
  cursor: pointer;
}
#ja-results { padding-inline-start: 1.5rem; }
#ja-results li { padding-block: .65rem; }
#ja-results li a { color: #343434; font-weight: bold; text-decoration: underline; }
#ja-results p { margin: .25rem 0 0; }

@media (max-width: 860px) {
  body { margin-inline: 10px; }
  .ja-masthead td[width="725"] { width: auto; }
  .ja-masthead td[width="170"] { width: auto; }
  .ja-topline td.marquee { font-size: 1rem; }
  .ja-cards td[width] { width: auto; }
  .ja-content td[width] { max-width: 100%; }
}

@media (max-width: 650px) {
  .ja-masthead:not(.ja-masthead-block), .ja-masthead tbody, .ja-masthead tr,
  .ja-cards, .ja-cards tbody, .ja-cards tr, .ja-topline:not(.ja-topline-block),
  .ja-topline tbody, .ja-topline tr { display: block; }
  .ja-masthead { height: auto; min-height: 25px; }
  .ja-masthead tr { display: flex; align-items: center; flex-wrap: wrap; }
  .ja-masthead td:first-child { flex: 0 0 100%; box-sizing: border-box; }
  .ja-masthead td.header { padding: .55em; width: auto; background: red; }
  .ja-masthead a.topmenu, .ja-footmenu a.topmenu, .ja-masthead-block nav a { line-height: 2.1; }
  .ja-topline td, .ja-cards td, .ja-content td[rowspan] {
    box-sizing: border-box;
    display: block;
    width: auto;
    max-width: 100%;
  }
  .ja-topline td.marquee { text-align: left; }
  .ja-cards td { margin-block: 8px; }
  .ja-cards td.ja-card { min-height: 10rem; height: auto; }
  .ja-cards tr { height: auto; }
  .ja-place-list tr:has(> td:nth-child(2)) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem;
  }
  .ja-place-list td { min-width: 0; margin-block: .12rem; font-size: 1rem; text-align: left; }
  .ja-place-list td:not(:has(h1, h2)) { padding: .7rem .6rem; }
  .ja-place-list td.ja-card { min-height: 5.5rem; }
  .ja-place-list td:not([background]) a { color: #353535; }
  .ja-place-list td:not([background]):not(:has(h1, h2)) { background: #f2f0f0; }
  h4 font[size="60"] { font-size: 2rem; }
  .ja-cards font[size="50"] { font-size: 1.85rem; }
  .ja-cards h4 br + br { display: none; }
  table.ja-content, .ja-content > tbody, .ja-content > tbody > tr,
  .ja-content > tbody > tr > td { box-sizing: border-box; display: block; width: 100%; }
  .ja-content > tbody > tr > td:empty { display: none; }
  .ja-content > tbody > tr > td { max-width: 100%; }
  .ja-content > tbody > tr > td img[title="смотреть фотографии"] { width: min(10rem, 100%); }
  .ja-content:has(iframe) { table-layout: fixed; }
  td[class].tokyo, td[class].kyoto, td[class].hokkaido, td[class].placelink { font-size: clamp(1.4rem, 8vw, 3rem); }
  .ja-search input, .ja-search button { font-size: 16px; }
}