@font-face {
  font-family: "Noto Sans JP";
  src: url("../assets/fonts/NotoSansJP-VariableFont_wght.woff2") format("woff2 supports variations"), url("../assets/fonts/NotoSansJP-VariableFont_wght.woff2") format("woff2-variations");
  font-weight: 100 900;
}
@font-face {
  font-family: "Shippori";
  src: url("../assets/fonts/Shipporiantique-regular.woff") format("woff"), url("../assets/fonts/Shipporiantique-regular.woff") format("woff");
}
.eng {
  font-family: "p22-nudgewink-pro", "Shippori", "Noto Sans JP", Noto Sans JP, "Shippori", YuGothic, "Yu Gothic", "Yu Gothic Medium", Meiryo, sans-serif;
  letter-spacing: 0.04em;
  font-weight: 500;
}

footer {
  margin-top: -1px;
}

.tab-only {
  display: none !important;
}
@media screen and (min-width: 650px) and (max-width: 1001px) {
  .tab-only {
    display: unset !important;
  }
}

.no-tab {
  display: none !important;
}
@media screen and (min-width: 1001px) {
  .no-tab {
    display: unset !important;
  }
}

.grid-1 {
  display: grid;
  grid-template-columns: 1fr 28.5% clamp(20px, 28.5%, 111px);
  grid-template-rows: repeat(4, auto);
}
.grid-1 .what-container {
  grid-row: 2/4;
  grid-column: 1/3;
}
.grid-1 .what-container .dot-bg {
  z-index: 0;
}
.grid-1 .tr-img {
  grid-row: 1/3;
  grid-column: 2/4;
}
.grid-1 .w-no {
  grid-row: 4/5;
  grid-column: 1/4;
}
@media screen and (min-width: 651px) {
  .grid-1 {
    grid-template-columns: 52.8% 8% 39.2%;
    grid-template-rows: auto 90px auto;
  }
  .grid-1 .what-container {
    grid-row: 2/4;
    grid-column: 1/3;
  }
  .grid-1 .tr-img {
    grid-row: 1/3;
    grid-column: 2/4;
  }
  .grid-1 .w-no {
    grid-row: 3/4;
    grid-column: 3/4;
  }
}

.grid-2 {
  display: grid;
  grid-template-columns: 1fr 28.5% 28.5%;
  grid-template-rows: repeat(3, auto);
}
.grid-2 .what-container {
  grid-row: 2/4;
  grid-column: 1/3;
}
.grid-2 .what-container .dot-bg {
  z-index: 0;
}
.grid-2 .tr-img {
  max-width: calc(28.5% + 111px);
  grid-row: 1/3;
  grid-column: 2/4;
}
.grid-2 .w-no {
  grid-row: 3/4;
  grid-column: 3/4;
}
@media screen and (min-width: 651px) {
  .grid-2 {
    grid-template-columns: 35.2% 18.3% 18.2% 28.3%;
    grid-template-rows: auto 120px auto;
  }
  .grid-2 .what-container {
    grid-row: 2/4;
    grid-column: 1/3;
  }
  .grid-2 .tr-img {
    max-width: unset;
    grid-row: 1/3;
    grid-column: 2/4;
  }
  .grid-2 .w-no {
    grid-row: 2/4;
    grid-column: 4/5;
    margin: auto;
  }
}

.grid-3 {
  display: grid;
  grid-template-columns: 24% 76%;
  grid-template-rows: repeat(2, auto);
}
.grid-3 .what-container {
  grid-row: 2/3;
  grid-column: 2/3;
}
.grid-3 .what-container .dot-bg {
  z-index: 0;
}
.grid-3 .tr-img {
  grid-row: 1/2;
  grid-column: 2/3;
}
.grid-3 .w-no {
  grid-row: 1/2;
  grid-column: 1/2;
}
@media screen and (min-width: 651px) {
  .grid-3 {
    grid-template-columns: 33% 3.6% 13.8% 17.8% 31.8%;
    grid-template-rows: auto 76px 75px auto;
  }
  .grid-3 .what-container {
    grid-row: 2/5;
    grid-column: 4/6;
  }
  .grid-3 .tr-img {
    grid-row: 1/3;
    grid-column: 5/7;
  }
  .grid-3 .bl-img {
    grid-row: 1/5;
    grid-column: 1/3;
  }
  .grid-3 .w-no {
    grid-row: 2/4;
    grid-column: 2/4;
  }
}

.grid-4 {
  display: grid;
  grid-template-columns: 13% 24% 34.8% 1fr;
  grid-template-rows: repeat(3, auto);
}
.grid-4 .what-container {
  grid-row: 2/3;
  grid-column: 2/4;
}
.grid-4 .what-container .dot-bg {
  z-index: 0;
}
.grid-4 .tl-img {
  grid-row: 1/2;
  grid-column: 1/3;
}
.grid-4 .bl-img {
  grid-row: 3/4;
  grid-column: 2/4;
}
.grid-4 .br-img {
  grid-row: 2/4;
  grid-column: 3/5;
}
.grid-4 .w-no {
  grid-row: 1/2;
  grid-column: 3/4;
}
@media screen and (min-width: 651px) {
  .grid-4 {
    grid-template-columns: 3.1% 28.2% 2.3% 19.8% 13.7% 32.9%;
    grid-template-rows: auto 60px 36px 60px auto 92px;
  }
  .grid-4 .what-container {
    grid-row: 1/5;
    grid-column: 2/5;
  }
  .grid-4 .bl-img {
    grid-row: 4/6;
    grid-column: 1/4;
  }
  .grid-4 .br-img {
    grid-row: 3/7;
    grid-column: 3/6;
  }
  .grid-4 .w-no {
    grid-row: 2/4;
    grid-column: 6/7;
  }
}

.grid-5 {
  display: grid;
  grid-template-columns: 1fr 10.6vw 5vw 33.3vw 20.7vw 1fr;
  grid-template-rows: auto 80px repeat(2, auto);
}
.grid-5 .what-container {
  grid-row: 2/4;
  grid-column: 2/5;
}
.grid-5 .what-container .dot-bg {
  z-index: 0;
}
.grid-5 .tl-img {
  grid-row: 1/3;
  grid-column: 3/5;
}
.grid-5 .bl-img {
  grid-row: 4/5;
  grid-column: 1/5;
}
.grid-5 .br-img {
  grid-row: 4/5;
  grid-column: 4/7;
}
.grid-5 .w-no {
  grid-row: 1/2;
  grid-column: 5/6;
}
@media screen and (min-width: 651px) {
  .grid-5 {
    grid-template-columns: 6.9% 36% 12.3% 16% 3.7% 6% 19.1%;
    grid-template-rows: 126px auto 120px 210px auto;
  }
  .grid-5 .what-container {
    grid-row: 2/5;
    grid-column: 2/5;
  }
  .grid-5 .tl-img {
    grid-row: 1/3;
    grid-column: 6/8;
  }
  .grid-5 .bl-img {
    grid-row: 4/6;
    grid-column: 1/4;
  }
  .grid-5 .br-img {
    grid-row: 3/5;
    grid-column: 3/7;
  }
  .grid-5 .w-no {
    grid-row: 2/4;
    grid-column: 6/8;
  }
}
@media screen and (min-width: 1001px) {
  .grid-5 .what-container {
    grid-column: 2/4;
  }
}

.grid-6 {
  display: grid;
  grid-template-columns: 21% 43.7% 25.3%;
  grid-template-rows: repeat(5, auto);
}
.grid-6 .what-container {
  grid-row: 2/4;
  grid-column: 2/4;
}
.grid-6 .what-container .dot-bg {
  z-index: 0;
}
.grid-6 .tr-img {
  grid-row: 1/3;
  grid-column: 3/4;
}
.grid-6 .b1-img {
  grid-row: 4/5;
  grid-column: 1/4;
}
.grid-6 .b2-img {
  grid-row: 5/6;
  grid-column: 1/4;
}
.grid-6 .w-no {
  grid-row: 1/2;
  grid-column: 1/2;
}
@media screen and (min-width: 651px) {
  .grid-6 {
    grid-template-columns: 9.2% 37.6% 3.9% 8.5% 27% 13.8%;
    grid-template-rows: 64px auto 40px 80px auto;
  }
  .grid-6 .what-container {
    grid-row: 1/4;
    grid-column: 1/3;
  }
  .grid-6 .tr-img {
    grid-row: 4/6;
    grid-column: 6/7;
  }
  .grid-6 .b1-img {
    grid-row: 3/6;
    grid-column: 1/4;
  }
  .grid-6 .b2-img {
    grid-column: 5/7;
    grid-row: 2/5;
  }
  .grid-6 .w-no {
    grid-row: 1/3;
    grid-column: 4/6;
  }
}
@media screen and (min-width: 1001px) {
  .grid-6 .what-container {
    grid-row: 1/4;
    grid-column: 2/3;
  }
}

.grid-7 {
  display: grid;
  grid-template-columns: 66.8% 1fr;
  grid-template-rows: 25px repeat(4, auto);
}
.grid-7 .what-container {
  grid-row: 2/4;
  grid-column: 1/3;
}
.grid-7 .what-container .dot-bg {
  z-index: 0;
}
.grid-7 .b1-img {
  grid-row: 4/5;
  grid-column: 1/4;
}
.grid-7 .b2-img {
  grid-row: 5/6;
  grid-column: 1/4;
}
.grid-7 .w-no {
  grid-row: 1/3;
  grid-column: 2/3;
}
@media screen and (min-width: 651px) {
  .grid-7 {
    grid-template-rows: 94px auto 164px auto;
    grid-template-columns: 21.7% 19.6% 8.9% 34.6% 15.2%;
  }
  .grid-7 .what-container {
    grid-row: 1/3;
    grid-column: 3/6;
  }
  .grid-7 .b1-img {
    grid-row: 4/5;
    grid-column: 4/5;
  }
  .grid-7 .b2-img {
    grid-row: 3/5;
    grid-column: 1/4;
  }
  .grid-7 .w-no {
    grid-row: 2/3;
    grid-column: 2/3;
  }
}

.grid-8 {
  display: grid;
  grid-template-columns: 1fr 16.7vw 11.8vw 56.1vw 1fr;
  grid-template-rows: repeat(2, auto);
}
.grid-8 .what-container {
  grid-row: 1/2;
  grid-column: 3/5;
}
.grid-8 .what-container .dot-bg {
  z-index: 0;
}
.grid-8 .bl-img {
  grid-row: 2/3;
  grid-column: 2/4;
}
.grid-8 .br-img {
  grid-row: 2/3;
  grid-column: 4/6;
}
.grid-8 .w-no {
  grid-row: 1/2;
  grid-column: 2/3;
}
@media screen and (min-width: 651px) {
  .grid-8 {
    grid-template-rows: 44px auto 130px auto;
    grid-template-columns: 25.6% 19.3% 55.1%;
  }
  .grid-8 .what-container {
    grid-row: 1/3;
    grid-column: 2/4;
  }
  .grid-8 .bl-img {
    grid-row: 2/4;
    grid-column: 1/2;
  }
  .grid-8 .br-img {
    grid-row: 3/5;
    grid-column: 3/4;
  }
  .grid-8 .w-no {
    grid-row: 2/3;
    grid-column: 2/3;
  }
}
@media screen and (min-width: 1001px) {
  .grid-8 .what-container {
    grid-column: 3/4;
  }
}

.bg-layer {
  position: relative;
  padding-top: 50px;
}
@media screen and (min-width: 651px) {
  .bg-layer {
    padding-top: 110px;
  }
}

.dot-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.dot-bg.cover-dot {
  object-fit: cover;
}

.line-layer {
  position: relative;
  z-index: 1;
  background: url(../img/what/what-bg-clipped-sp.svg) top center no-repeat;
  background-size: 100%;
}
.line-layer .line-group {
  position: absolute;
  height: unset;
  max-width: unset;
  z-index: 1;
}
@media screen and (min-width: 651px) {
  .line-layer {
    background: url(../img/what/what-bg-clipped-tab.svg) top center no-repeat;
    background-size: 100%;
  }
}
@media screen and (min-width: 1001px) {
  .line-layer {
    background: url(../img/what/what-bg-clipped-spc.svg) top center no-repeat;
    background-size: 100%;
  }
}
@media screen and (min-width: 1201px) {
  .line-layer {
    background: url(../img/what/what-bg-clipped.svg) top center no-repeat;
    background-size: 100%;
  }
}

main.what-main {
  position: relative;
  z-index: 2;
}

.what-container {
  position: relative;
}
.what-container .title-group {
  transform: rotate(-7deg);
  margin: 0 0 16px 15px;
}
.what-container .title-group.tg-rev {
  transform: rotate(3deg);
}
.what-container h3.title {
  font-family: "p22-nudgewink-pro", "Shippori", "Noto Sans JP", Noto Sans JP, "Shippori", YuGothic, "Yu Gothic", "Yu Gothic Medium", Meiryo, sans-serif;
  letter-spacing: 0.04em;
  font-weight: 500;
  color: #E57E26;
  font-size: clamp(35px, 3.9vw, 56px);
  line-height: 110%;
  text-transform: uppercase;
  transform-origin: bottom left;
  margin-bottom: 0.1em;
}
.what-container h4.subtitle {
  font-size: clamp(1.5rem, 2vw, 2.2rem);
}
.what-container p.text-body {
  margin-left: 15px;
}
@media screen and (min-width: 651px) {
  .what-container .title-group {
    margin-bottom: 36px;
  }
}

.w-no {
  font-family: "p22-nudgewink-pro", "Shippori", "Noto Sans JP", Noto Sans JP, "Shippori", YuGothic, "Yu Gothic", "Yu Gothic Medium", Meiryo, sans-serif;
  letter-spacing: 0.04em;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background-color: #F4E62D;
  box-sizing: border-box;
  border: 3px solid #000000;
  border-radius: 50%;
  font-size: 32px;
  line-height: 100%;
  text-align: center;
}
.w-no.wno-orange {
  background-color: #E57E26;
  color: #ffffff;
}
@media screen and (min-width: 651px) {
  .w-no {
    font-size: clamp(32px, 4vw, 56px);
    width: clamp(48px, 7vw, 98px);
    height: clamp(48px, 7vw, 98px);
    border: clamp(3px, 0.8vw, 8px) solid #000000;
  }
}

section.landing {
  width: 55.4%;
  padding-top: 90px;
  margin-bottom: 30px;
}
@media screen and (min-width: 651px) {
  section.landing {
    max-width: 400px;
    padding-top: 120px;
    margin-left: 19.7%;
  }
  section.landing h1 {
    line-height: 100%;
    height: fit-content;
  }
  section.landing h1 img {
    width: 99%;
  }
  section.landing h3 {
    margin: 1em 0 0.8em 0;
  }
}

section.departure {
  margin-top: 100px;
}
section.departure .grid-1 {
  width: 84%;
  margin-left: auto;
}
section.departure .grid-1 .what-container {
  max-width: 250px;
  margin: 0 auto;
  padding-bottom: 5px;
}
section.departure .grid-1 .what-container .dot-bg {
  object-position: bottom;
}
section.departure .grid-1 .w-no {
  margin: 30px 60% 0 auto;
}
@media screen and (min-width: 651px) {
  section.departure {
    margin-top: 0;
  }
  section.departure .grid-1 {
    width: 51.4%;
    margin: 0 auto 0 13.4%;
  }
  section.departure .grid-1 .what-container {
    max-width: unset;
    padding: 10px 0 30px 13%;
  }
  section.departure .grid-1 .what-container .title-group {
    margin-left: 0;
  }
  section.departure .grid-1 .what-container p.text-body {
    margin-left: 0;
  }
  section.departure .grid-1 .what-container .dot-bg {
    top: 10%;
    object-position: center;
  }
  section.departure .grid-1 .w-no {
    margin: 0 auto auto auto;
    transform: unset;
  }
}

section.parking {
  margin-top: 90px;
}
section.parking .grid-2 {
  width: 82%;
  margin-left: 12.6%;
}
section.parking .grid-2 .what-container {
  padding: 5px 0;
  max-width: 260px;
  margin: 0 auto;
}
section.parking .grid-2 .what-container .title-group {
  margin-left: 28px;
}
section.parking .grid-2 .what-container p.text-body {
  margin-left: 28px;
}
section.parking .grid-2 .what-container .dot-bg {
  object-position: bottom;
}
section.parking .grid-2 .w-no {
  margin: 0 auto 0 0;
}
@media screen and (min-width: 651px) {
  section.parking {
    margin-top: 50px;
  }
  section.parking .grid-2 {
    width: 70%;
    margin-left: 19.9%;
  }
  section.parking .grid-2 .what-container {
    max-width: unset;
    padding: 0 13% 55px 0;
  }
  section.parking .grid-2 .what-container .title-group,
section.parking .grid-2 .what-container p.text-body {
    margin-left: 0;
  }
  section.parking .grid-2 .what-container .title-group {
    margin-bottom: 18px;
  }
  section.parking .grid-2 .what-container .dot-bg {
    top: 5%;
    height: 95%;
    object-position: top;
  }
  section.parking .grid-2 .tr-img {
    width: 100%;
  }
}
@media screen and (min-width: 801px) {
  section.parking .grid-2 .w-no {
    margin: 0 auto 0 auto;
  }
}
@media screen and (min-width: 1001px) {
  section.parking .grid-2 {
    width: 58%;
    margin-left: 19.9%;
  }
  section.parking .grid-2 .w-no {
    margin: 0 0 0 auto;
  }
  section.parking .grid-2 .what-container .dot-bg {
    top: 25%;
  }
}
@media screen and (min-width: 1201px) {
  section.parking .grid-2 .what-container .dot-bg {
    top: 15%;
    object-position: left;
  }
}

section.admission {
  margin: clamp(56px, 14vw, 112px) auto 0;
  width: 84.6%;
}
section.admission .tr-img {
  width: 73.6%;
  margin: 0 0 5px auto;
}
section.admission .w-no {
  margin: auto;
}
section.admission .what-container {
  width: 86.4%;
  margin: 0 auto 0 20px;
}
section.admission .what-container .title-group {
  margin-left: 10px;
}
section.admission .what-container p.text-body {
  margin-left: 10px;
}
section.admission .what-container .dot-bg {
  top: 5%;
  width: 95%;
  height: 90%;
  object-position: bottom;
}
@media screen and (min-width: 451px) {
  section.admission .what-container {
    width: 82%;
  }
  section.admission .what-container p.text-body {
    margin-left: 0;
  }
  section.admission .what-container .dot-bg {
    top: unset;
    bottom: 0;
    object-position: bottom;
  }
}
@media screen and (min-width: 651px) {
  section.admission {
    margin: 0 auto 0 9.2%;
    width: 79.2%;
  }
  section.admission .tr-img {
    width: 100%;
    margin: 0 0 10px;
  }
  section.admission .what-container {
    width: 80%;
    margin: 10px 0 0 0;
    padding: 0 0 36px 0;
  }
  section.admission .what-container .title-group {
    margin-left: 0;
    margin-bottom: 16px;
  }
  section.admission .what-container .dot-bg {
    object-position: center;
  }
  section.admission .w-no {
    margin: auto auto 0 0;
  }
  section.admission .bl-img {
    margin: auto 0 12% 0;
  }
}
@media screen and (min-width: 1001px) {
  section.admission .what-container .dot-bg {
    object-position: bottom;
    bottom: 5%;
  }
}
@media screen and (min-width: 1401px) {
  section.admission .what-container .dot-bg {
    object-position: bottom;
    bottom: 0;
  }
}

section.open {
  width: 97.4%;
  margin: -20px auto 0 0;
}
section.open .tl-img {
  margin: auto auto 15px 0;
}
section.open .what-container {
  margin-left: 1vw;
  padding: 10px 0 5px;
}
section.open .what-container .title-group {
  margin-bottom: 20px;
}
section.open .what-container p.text-body {
  width: 87.4%;
}
section.open .what-container .dot-bg {
  object-position: bottom;
  width: 90%;
}
section.open .bl-img {
  width: 41vw;
  margin: 20px 0 0 6vw;
}
section.open .br-img {
  width: 41.3vw;
  margin: auto 0 46px auto;
}
section.open .w-no {
  position: relative;
  margin: auto 10% -40px auto;
  z-index: 1;
}
@media screen and (min-width: 651px) {
  section.open {
    width: 67.5%;
    margin: 0 auto 0 6%;
  }
  section.open .what-container {
    margin: 0;
    padding: 0 0 106px 17%;
  }
  section.open .what-container .title-group {
    margin-bottom: 40px;
  }
  section.open .what-container p.text-body {
    width: auto;
  }
  section.open .what-container .dot-bg {
    top: 25%;
    height: 75%;
    width: 100%;
    object-position: top;
  }
  section.open .bl-img {
    position: relative;
    width: 100%;
    margin: 0;
    z-index: 2;
  }
  section.open .br-img {
    position: relative;
    width: 100%;
    margin: 0;
    z-index: 1;
  }
  section.open .w-no {
    margin: 0 0 auto auto;
    z-index: 1;
  }
}
@media screen and (min-width: 1001px) {
  section.open .what-container .dot-bg {
    height: 60%;
  }
}

section.antique1 {
  margin-top: 80px;
}
section.antique1 .what-container {
  margin: 10px 0 0 0px;
  padding-bottom: 20px;
}
section.antique1 .what-container .title-group {
  margin-left: 0;
}
section.antique1 .what-container p.text-body {
  margin-left: 0px;
  width: 90%;
}
section.antique1 .what-container .dot-bg {
  width: 95%;
  object-position: center;
}
section.antique1 .tl-img {
  margin: 0 auto 0 0;
  max-width: 29.7vw;
}
section.antique1 .bl-img {
  margin: 5px 0 auto 2.6vw;
  max-width: 54.8vw;
}
section.antique1 .br-img {
  margin: -21px 2.6vw auto auto;
  max-width: 32.8vw;
}
section.antique1 .w-no {
  margin: auto auto 0 0;
  transform: translate(-40%, 40%);
}
@media screen and (min-width: 651px) {
  section.antique1 {
    width: 70.8%;
    margin-left: 14.2%;
  }
  section.antique1 .what-container {
    margin: 0;
    padding-bottom: 80px;
  }
  section.antique1 .what-container p.text-body {
    width: 100%;
  }
  section.antique1 .what-container .dot-bg {
    top: 25%;
    height: 92%;
    left: 9%;
    width: 91%;
    object-fit: contain;
    object-position: top;
  }
  section.antique1 .tl-img {
    margin: 0 auto 0 0;
    width: 100%;
    max-width: unset;
  }
  section.antique1 .bl-img {
    margin: 150px auto auto 0;
    max-width: 38vw;
  }
  section.antique1 .br-img {
    margin: 250px auto auto 0;
    max-width: 29vw;
  }
  section.antique1 .w-no {
    margin: 0 auto auto 0;
    transform: translate(-40%, 40%);
  }
}
@media screen and (min-width: 801px) {
  section.antique1 .what-container .dot-bg {
    top: 15%;
  }
}
@media screen and (min-width: 1001px) {
  section.antique1 .what-container .dot-bg {
    top: 15%;
    left: 0;
    width: 100%;
  }
}
@media screen and (min-width: 1601px) {
  section.antique1 .what-container .dot-bg {
    top: 10%;
    left: 0;
    height: 50%;
  }
}

section.lunch {
  margin: 86px 7.7vw 0 auto;
  width: 81%;
}
section.lunch .what-container {
  width: 95%;
  max-width: clamp(240px, 50vw, 320px);
  margin: 0 0 0 0;
}
section.lunch .what-container .title-group {
  margin-left: 0;
}
section.lunch .what-container p.text-body {
  width: 95%;
  margin-left: 0;
}
section.lunch .what-container .dot-bg {
  object-position: bottom;
}
section.lunch .tr-img {
  position: relative;
  margin: auto 0 32% auto;
  z-index: 2;
}
section.lunch .b1-img {
  width: 90%;
  margin-top: 16px;
}
section.lunch .b2-img {
  width: 77.5%;
  margin: 0 3.5% 0 auto;
}
section.lunch .w-no {
  margin: auto 0 0 auto;
  transform: translateX(33%);
}
@media screen and (min-width: 501px) {
  section.lunch .what-container .dot-bg {
    top: 10%;
  }
}
@media screen and (min-width: 651px) {
  section.lunch {
    width: 83.3%;
    margin: 40px auto 0 11.1%;
  }
  section.lunch .what-container {
    width: 90%;
    max-width: unset;
    margin: 0 0 0 0;
    padding: 0 5% 76px 5%;
  }
  section.lunch .what-container .dot-bg {
    top: 5%;
    height: 95%;
    width: 95%;
    object-position: center;
  }
  section.lunch .tr-img {
    position: relative;
    margin: auto 0 32% auto;
    z-index: 2;
  }
  section.lunch .b1-img {
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0 0 auto 0;
  }
  section.lunch .b2-img {
    width: 100%;
    margin: auto 0 0 auto;
  }
  section.lunch .w-no {
    margin: 10px auto auto 0;
    transform: unset;
  }
}
@media screen and (min-width: 1401px) {
  section.lunch {
    margin: 40px auto 0 11.1%;
  }
  section.lunch .what-container .dot-bg {
    top: 30%;
    height: 60%;
    object-position: bottom;
  }
}
@media screen and (min-width: 1901px) {
  section.lunch {
    margin: 40px auto 0 11.1%;
  }
  section.lunch .what-container .dot-bg {
    top: 10%;
  }
}

section.old-clothes {
  margin: 52px 0 0 7.7%;
  width: 67.9%;
}
section.old-clothes .w-no {
  position: relative;
  z-index: 2;
  margin: 0 0 0 -40px;
}
section.old-clothes .what-container {
  width: 80%;
  margin: 20px 0 0 3vw;
}
section.old-clothes .what-container p {
  max-width: 80%;
  margin: 0 0 0 15px;
}
section.old-clothes .what-container .dot-bg {
  width: 85%;
  object-position: bottom;
}
@media screen and (min-width: 480px) and (max-width: 650px) {
  section.old-clothes .what-container {
    margin-left: 10vw;
    width: 70%;
  }
}
section.old-clothes .b1-img {
  width: 87.2%;
  margin: -14px 0 0 auto;
}
section.old-clothes .b2-img {
  width: 80.8%;
  margin: 15px auto 0 0;
}
@media screen and (min-width: 651px) {
  section.old-clothes {
    width: 59%;
    margin: 50px 11.9% 0 auto;
  }
  section.old-clothes .what-container {
    width: 100%;
  }
  section.old-clothes .b1-img {
    width: 87.2%;
    margin: -14px 0 0 auto;
  }
  section.old-clothes .b2-img {
    width: 80.8%;
    margin: 15px auto 0 0;
  }
}
@media screen and (min-width: 1201px) {
  section.old-clothes .what-container .dot-bg {
    top: 20%;
    object-position: bottom;
  }
}

section.antique2 {
  margin-top: 100px;
  padding-bottom: 80px;
}
section.antique2 .what-container {
  box-sizing: border-box;
  padding: 10px 0 5px 0px;
  width: 75%;
}
section.antique2 .what-container .dot-bg {
  object-position: center;
}
section.antique2 .w-no {
  margin: auto auto auto 10px;
}
section.antique2 .bl-img {
  margin: -10px -5px 0 0;
}
section.antique2 .br-img {
  margin: 20px 0 0 3%;
  width: 94%;
}
@media screen and (min-width: 450px) {
  section.antique2 .what-container .dot-bg {
    top: 15%;
  }
}
@media screen and (min-width: 651px) {
  section.antique2 {
    margin-top: 115px;
    padding-bottom: 140px;
  }
  section.antique2 .grid-8 {
    width: 66.7%;
    margin: 0 auto 0 21.5%;
  }
  section.antique2 .what-container {
    box-sizing: border-box;
    padding: 50px 18% 0 20px;
    width: 100%;
    margin-left: 20px;
  }
  section.antique2 .what-container .dot-bg {
    top: 25%;
    left: 9%;
    width: 82%;
  }
  section.antique2 .w-no {
    margin: 0 auto auto -20px;
  }
  section.antique2 .bl-img {
    width: 100%;
    margin: 0 0 auto 0;
  }
  section.antique2 .br-img {
    margin: 24px 0 0 0%;
    width: 100%;
  }
}
@media screen and (min-width: 1001px) {
  section.antique2 .what-container {
    padding-left: 0;
    margin-left: 0;
  }
  section.antique2 .what-container .dot-bg {
    top: 15%;
    left: 0;
  }
}
@media screen and (min-width: 1201px) {
  section.antique2 .what-container {
    padding-left: 0;
    margin-left: 0;
  }
  section.antique2 .w-no {
    margin: 0 auto auto 10px;
  }
}
@media screen and (min-width: 1601px) {
  section.antique2 .what-container .dot-bg {
    top: 25%;
    height: 80%;
  }
}
@media screen and (min-width: 2001px) {
  section.antique2 .what-container .dot-bg {
    top: 15%;
    height: 60%;
  }
}

section.special-contents {
  position: relative;
  z-index: 1;
  background-image: url(../img/what/special-bg-sp.svg);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
section.special-contents .w-no {
  position: absolute;
  left: 37.7%;
  top: -15px;
}
section.special-contents .text-col {
  padding: 65px 0 0 0;
  margin: 0 auto;
  width: 79.5%;
}
section.special-contents .text-col .title-container {
  transform: rotate(-7deg);
}
section.special-contents .text-col .title-container h3 {
  width: 40vw;
  font-size: clamp(50px, 6vw, 76px);
  line-height: 100%;
  margin: 0 0 1em 0;
}
section.special-contents .text-col .text-container {
  margin-bottom: 40px;
}
section.special-contents .text-col .text-container h4 {
  margin-bottom: 1em;
}
section.special-contents .fw-img {
  margin: 0 auto;
  padding-bottom: clamp(180px, 20vw, 256px);
  width: 79.5%;
}
section.special-contents .fw-img.sp-only {
  display: block;
}
@media screen and (min-width: 651px) {
  section.special-contents {
    background-image: url(../img/what/special-bg.svg);
    background-size: cover;
  }
  section.special-contents .w-no {
    position: absolute;
    left: 15%;
    top: 50px;
  }
  section.special-contents .text-col {
    display: flex;
    width: 47.2%;
    margin: 0 14.6% 60px auto;
    padding-top: 100px;
  }
  section.special-contents .text-col .title-container {
    width: 42.6%;
  }
  section.special-contents .text-col .text-container {
    width: 57.4%;
  }
  section.special-contents .text-col .text-container p {
    max-width: 400px;
  }
  section.special-contents .fw-img {
    margin: 0 auto 0 8.2%;
    padding-bottom: 256px;
    width: 85.6%;
  }
  section.special-contents .fw-img.sp-only {
    display: none;
  }
}
@media screen and (min-width: 1201px) {
  section.special-contents .w-no {
    position: absolute;
    left: 27%;
    top: 30px;
  }
}

/*# sourceMappingURL=what.css.map */