@charset "utf-8";
/* ========================================== 
 * Reset
 * Common
 * js
 * header
 * kv
 * concept
 * overview
 * exhibition
 * campaign
 * holding_overview
 * footer
========================================== */

/* ---------------------------------------
   Reset / Normalize
   --------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  /* 16px × 62.5% = 10px → 1rem = 10px */
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%; /* iOS ズーム防止 */
  scroll-behavior: smooth; /* スムーススクロール */
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue",
               "Segoe UI", Roboto, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN",
               "Noto Sans JP", "メイリオ", Meiryo, sans-serif;
  font-size: clamp(14px, 1.25vw, 18px);
  line-height: 1.5;   /* 読みやすい行間 */
  color: #333;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 画像・メディア要素 */
img,
svg,
video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* リンク */
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/* 見出し */
h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
  line-height: 1.7;
}

/* リスト */
ul, ol {
  list-style: none;
}

/* フォーム要素の整え */
button,
input,
textarea,
select {
  font: inherit;
  color: inherit;
  border: none;
  background: none;
  outline: none;
}

/* ボタン用に pointer を付ける */
button {
  cursor: pointer;
}

/* テーブル */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

sup, sub { font-size: .6em}
sup {
  position: relative;
  top: .1em;
}

/* Common
------------------------------------------------------------------- */
:root{
  --font-jp: "Hiragino UD Sans", "Noto Sans JP", "Yu Gothic", "Meiryo", sans-serif;
  --font-latin: "Proxima Nova", "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --color-blk: #000;
  --color-accent: #f6e500;
}

/* 全体（本文） */
html { font-size: 62.5%; /* 1rem = 10px */ }
body {
  font-family: var(--font-jp);
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: .05em;
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #fff;
  background-color: var(--color-blk);
}
/* フォント */
h1, .style-h1 { font-size: clamp(42px, 4.72vw, 68px); }
h2, .style-h2 { font-size: clamp(40px, 4.51vw, 65px); }
h3, .style-h3 { font-size: clamp(20px, 2.08vw, 30px); }
h3, .style-h4 { font-size: clamp(20px, 1.81vw, 26px); }

h1, h2, h3, h4 {
  font-weight: 600;
}
.section__ttl {
  font-family: var(--font-latin);
  text-align: center;
  font-weight: 700;
}
.section__subttl {
  position: relative;
  font-size: clamp(15px, 1.39vw, 20px); 
  color: var(--color-accent);
  font-weight: 600;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section__subttl::before, .section__subttl::after {
  content: "";
  position: relative;
  width: 4em;
  border-top: 1px solid var(--color-accent);
}
.section__subttl::before { margin-right: 1.5em;}
.section__subttl::after { margin-left: 1.5em;}
.section__subhead {
  margin-top: 1.65em;
  font-size: clamp(20px, 2.08vw, 30px);
  text-align: center;
  font-weight: 500;
  line-height: 1.4
}
.section__subhead small {
  font-size: .7em;
  font-weight: 400;
}
.notes { font-size: 0.86em; }
.small { font-size: 0.79em; }

.en-only {
  font-family: var(--font-latin);
  font-weight: 400;
}
/* レイアウト */
main {
  display: block;
  overflow: hidden;
}
.inner {
  padding: 0 6.67vw;
}
.indent_10 {
  padding-left: 1em;
  text-indent: -1em;
}
.btn-wrap {
  padding: 13.33vw 0;
}
.btn {
  display: flex;
  align-items: center;
  padding: .7em 11.2vw;
  border: 1px solid #fff;
  border-radius: 100vh;
  position: relative;
  font-size: 3.47vw;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  -webkit-transition: all .2s;
  transition: all .2s;
  color: #fff;
}
.btn::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 5.33vw;
  width: 5.33vw;
  aspect-ratio: 1/1;
  background: url("/images/event/jms2025/icon-arrow.png") no-repeat center/contain;
  line-height: 1;
  transition: all .2s
}
.btn:hover::after {
  right: .8em;
  -webkit-text-stroke: .5px var(--col_blk);
  text-stroke: .5px var(--col_blk)
}
.item__wrap  {
  padding-bottom: 8.53vw;
}
.item__wrap + .item__wrap {
  border-top: 1px solid #fff;
}
.item__image-wrap {}
.item__image {
  position: relative;
  aspect-ratio: 163/79;
  margin-top: 7.2vw;
}
.item__image + .item__image {
  margin-block-start: 10.13vw;
}
.item__image::after {
  content: "";
  position: absolute;
  left: 2.93vw;
  top: 2.93vw;
  width: 100%;
  height: 100%;
  border: 1px solid var(--color-accent);
  z-index: -1;
  pointer-events: none;
}
.item__lead {
  margin-top: 2.4em;
  font-size: min(32.92px, 4.4vw);
  color: var(--color-accent);
  font-weight: 500;
  text-align: center;
  line-height: 2;
}
.item__lead span {
  border-bottom: 1px solid var(--color-accent);
  padding-bottom: .2em;
}
.item__copy {
  margin-top: 1.5em;
}
@media only screen and (max-width:752px) {
  .is-pc { display: none }
}
@media only screen and (min-width:751px) {
  body { font-size: min(20px, 1.39vw); line-height: 2;}
  .notes { font-size: min(14px, 0.97vw); }
  .small { font-size: min(12px, 0.83vw); }
  .is-sp { display: none }
  .section__subttl::before, .section__subttl::after {
    width: 6.0em
  }
  .inner {
    max-width: 1440px;
    margin: auto;
    padding: 0 min(5.56vw, 80px);
  }
  .btn-wrap {
    padding: min(80px, 5.56vw) 0;
  }
  .btn {
    width: min(500px, 34.72vw);
    margin: auto;
    padding: .5em 3em;
    font-size: min(20px, 1.39vw);
  }
  .btn:hover {
    color: var(--color-blk);
    background-color: rgba(255,255,255,.7);
    text-decoration: none;
  }
  .btn::after {
    width: min(30px, 2.1vw);
    right: min(30px, 2.1vw);
  }
  .btn._window::after {
    width: .47em;
    height: 1em
  }
  .item__image-wrap {
    display: flex;
    justify-content: center;
    margin-top: min(40px, 2.78vw)
  }
  .item__image {
    width: 41.7vw;
    max-width: 600px;
    margin-top: 0;
  }
  .item__image::after {
    top: min(20px, 1.39vw);
    left: min(20px, 1.39vw);
  }
  .item__lead { 
    margin-top: 2.28em;
    font-size: min(22px, 1.53vw);
  }
  .item__copy { margin-top: 2em;}
  .item__wrap { padding-bottom: min(30px, 2.08vw)}
}
/* js */
.js-pagetop {
  display: none;
  position: fixed;
  right: 10px;
  bottom: 10px;
  width: 9.33vw;
  max-width: 50px;
  aspect-ratio: 1/1;
  background: url("/images/event/jms2025/arrow.svg") no-repeat center/47% auto;
  border: 1px solid #fff;
  border-radius: 100%;
  color: #fff;
  text-decoration: none;
  text-indent: 300%;
  overflow: hidden;
  white-space: nowrap;
  opacity: .7;
  z-index: 1000;
}
.js-pagetop:hover {
  opacity: 1;
}
.js-pagetop.is-stop {
  position: absolute;
  bottom: calc(100% + 20px);
}
@media only screen and (min-width:751px) {
}

/* header
------------------------------------------------------------------- */
.header {
  display: flex;
  align-items: center;
  height: min(50px, 13.33vw);
  padding-left: 6.67vw;
  border-bottom: 1px solid var(--color-accent);
}
.logo__image { 
  width: min(120px, 32vw);
}
@media only screen and (min-width:751px) {
  .header {
    height: min(80px, 5.56vw);
    padding-left: 50px;
  }
  .logo__image { 
    width: min(180px, 12.5vw);
  }
}

/* kv
------------------------------------------------------------------- */
#kv {
  position: relative;
}
.kv-back {
  width: 100%;
  height: 128vw;
  background: url("/images/event/jms2025/kv_SP.jpg") no-repeat center/cover;
}
.kv__body {
  position: absolute;
  inset: 0;
  max-width: 1440px;
  margin: auto;
  padding: 0 6.67vw;
}
.kv__ttl {
  position: absolute;
  top: 9.87vw;
  height: 29.07vw;
  background: url("/images/event/jms2025/kv-ttl.png") no-repeat left top/contain;
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden;
}
.kv__copy {
  position: absolute;
  bottom: 9.87vw;
  height: 15.07vw;
  background: url("/images/event/jms2025/kv-copy.png") no-repeat left top/contain;
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden;
}

@media only screen and (min-width:751px) {
  .kv-back {
    height: 50vw;
    max-height: 720px;
    background-image: url("/images/event/jms2025/kv_PC.jpg") ;
  }
  .kv__body {
    padding: 0 min(5.56vw, 80px);
  }
  .kv__ttl {
    top: min(15vw, 216px);
    height: min(12.99vw, 187px);
  }
  .kv__copy {
    bottom: min(5.83vw, 54px);
    height: min(6.53vw, 94px);
  }
}

/* concept
------------------------------------------------------------------- */
#concept {
  position: relative;
  padding-top: 18.13vw;
  padding-bottom: 29.33vw;
}
.concept__ttl {
  height: 24vw;
  background: url("/images/event/jms2025/concept-ttl.png") no-repeat center/contain;
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden;
}
.concept__subttl {
  margin-top: 1.94em;
  font-size: 4.8vw;
  font-weight: 500;
  text-align: center;
  letter-spacing: .08em;
}
.concept__copy {
  margin-top: 2.14em;
  text-align: center;
}
.concept__copy + .concept__copy {
  margin-top: 2em;
}
.concept__copy.small {
  margin-top: 1em;
}

#concept .img-wrap {
  width: 105.5vw;
  margin-top: 15.33vw;
  overflow: hidden;
}

@media only screen and (min-width:751px) {
  #concept {
    padding-top: min(172px, 11.94vw);
    padding-bottom: min(320px, 22.22vw);
  }
  #concept .inner {
    display: flex;
    justify-content: space-between;
    max-width: 1440px;
    margin: auto;
  }
  #concept .txt-wrap {
    flex-shrink: 0;
  }
  .concept__ttl {
    height: 9.72vw;
    max-height: 140px;
    background-position: left center;
  }
  .concept__subttl {
    font-size: min(30px, 2.08vw );
    text-align: left;
  }
  .concept__copy {
    text-align: left;
  }
  #concept .img-wrap {
    width: min(889px, 61.74vw);
    margin-top: min(62px, 4.31vw);
    margin-right: max(-328px, -22.78vw);
    overflow: visible;
  }
}

/* overview
------------------------------------------------------------------- */
#overview {
  position: relative;
  padding-top: 13.33vw;
  padding-bottom: 112vw;
}
#overview::before {
  content: "";
  position: absolute;
  inset: 0;
  top: -59.33vw;
  background: url("/images/event/jms2025/overview_bgSP.png") no-repeat top center/100% auto;
  z-index: -1;
  pointer-events: none;
}
#overview::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #1a1a1a;
  z-index: -2
}
#overview .inner {
  position: relative;
  z-index: 2
}
#overview .img-overview {
  position: absolute;
  bottom: -30vw;
  width: 100%;
  aspect-ratio: 375/652;
  background: url("/images/event/jms2025/overview_01SP.jpg") no-repeat top center/100% auto;
  pointer-events: none;
}
@media only screen and (min-width:751px) {
  #overview {
    padding-top: 0;
    padding-bottom: min(780px, 54.17vw);
  }
  #overview::before {
    top: -53.13vw;
    background-image: url("/images/event/jms2025/overview_bgPC.png");
  }
  #overview::after { background: none;}
  #overview .concept__copy {
    text-align: center;
  }
  #overview .img-overview {
    aspect-ratio: 144/109;
    background: url("/images/event/jms2025/overview_01PC.png") no-repeat center /100% auto;
    bottom: auto;
    top: 10.21vw;
  }
}
@media only screen and (min-width:1441px) {
  #overview::before {
    top: min(-735px, -42vw);
  }
  #overview .img-overview {
    top: calc(147px + (100vw - 1440px) * -0.283);
  }
}

/* exhibition
------------------------------------------------------------------- */
#exhibition {
  position: relative;
  z-index: 1;
}
#exhibition .style-h4  {
  margin-top: 6vw;
  text-align: center;
}
.spec { margin-top: 5vw;}
.spec .item__image { margin-top: 0;}
/*.spec__title {
  margin-top: 5.33vw;
  color: var(--color-accent);
  font-size: 2.93vw;
  font-weight: 500;
}*/
.spec__title {
  margin-top: 5.33vw;
  font-size: 4vw;
  font-weight: 500;
  text-align: center;
}
.spec__text {
  font-size: 4vw;
  font-weight: 500;
}
.tire-list {margin-top: 1em;}
@media only screen and (max-width:750px) {
  .spec__item+ .spec__item { margin-top: 7vw}
}
@media only screen and (min-width:751px) {
  #exhibition {
    margin-top: -13.89vw;
    padding-bottom: min(60px, 4.17vw)
  }
  #exhibition .inner {
    width: min(1260px, 87.5vw);
  }
  #exhibition .section__subttl::before, #exhibition .section__subttl::after { width: 3.5em}
  #exhibition .style-h4 { margin-top: 2em;}
  #exhibition .item__image {
    flex-shrink: 0;
  }
  #exhibition .column-2 .item__image {
    width: min(500px, 34.73vw);
    margin-top: 0;
  }
  #exhibition .item__image+ .item__image {
    margin-left: min(100px, 6.94vw);
  }
  .spec {
    display: flex;
    justify-content: space-between;
    flex-flow: wrap;
    margin-top: min(40px, 2.78vw)
  }
  .spec__item {
    width: min(500px, 34.73vw);
    margin-top: 0;
  }
  .spec__item:nth-of-type(n + 3) { margin-top: min(50px, 3.48vw);}
  .spec .item__image { width: 100%;}
  /*.spec__title {
    margin-top: 3em;
    font-size: min(14px, 0.97vw);
  }*/
  .spec__title {
    margin-top: 1.8em;
    font-size: min(20px, 1.39vw);
  }
  .spec__text {font-size: min(22px, 1.53vw);}
  .tire-list {
    text-align: center;
  }
  /*.tire-list {
    display: grid;
    grid-template-columns: auto auto; 
    justify-content: center; 
    gap: 0.5em 5em;  
  }*/
}
@media only screen and (min-width:1441px) {
  #exhibition {
    margin-top: calc(-200px + (100vw - 1440px) * 0.134);
  }
}

/* campaign
------------------------------------------------------------------- */
#campaign {
  padding-top: 16.27vw;
  padding-bottom: 20vw;
  background-color: #ebebeb;
  color: #000;
}
#campaign .section__ttl {
  width: calc(100% + 1em);
  margin-left: -.5em;
}
#campaign .section__subttl {
  color: #000;
}
#campaign .section__subttl::before, #campaign .section__subttl::after {
  border-color: #000;
  width: 2.5em;
}
#campaign .section__subhead {
  margin-bottom: .5em;
  font-weight: 600;
}
.campaign__copy {
  font-weight: 400;
  text-align: center;
}
.campaign__copy + .campaign__copy {
  margin-top: 2em;
}
#campaign .img-wrap {
  margin-top: 8vw;
}
@media only screen and (min-width:751px) {
  #campaign { 
    padding-top: min(100px, 6.94vw);
    padding-bottom: min(180px, 12.5vw);
  }
  #campaign .section__subttl::before, #campaign .section__subttl::after {
    width: 4.8em;
  }
  .campaign__body {
    display: flex;
    justify-content: space-between;
    margin-top: min(50px, 3.47vw);
  }
  .campaign__copy-wrap {
    order: 2;
    padding-left: min(100px, 6.94vw);
  }
  #campaign .section__subhead {
    font-size: min(26px, 1.81vw);
    text-align: left;
  }
  .campaign__copy { 
    font-size: min(16px, 1.11vw);
    text-align: left;
  }
  #campaign .img-wrap {
    width: min(560px, 38.89vw);
    margin-top: 0;
    flex-shrink: 0;
  }
}

/* holding_overview
------------------------------------------------------------------- */
#holding_overview {
  padding-top: 18.67vw;
  padding-bottom: 25.33vw;
}
#holding_overview .style-h3 {
  margin-bottom: 1.6em;
  color: var(--color-accent);
  text-align: center;
}
.detail-wrap {
  padding-top: 7.2vw;
  padding-bottom: 6.67vw;
  border-top: 1px solid #575757;
}
.detail-wrap:last-of-type {
  border-bottom: 1px solid #575757;
}
.detail__title {
  margin-bottom: .6em;
  font-size: 4.27vw;
  font-weight: 600;
}
.detail__head {
  font-weight: 500;
}
.detail__copy {
  display: flex;
  justify-content: space-between;
  flex-flow: wrap;
}
.detail__copy .date {
}
.detail__copy .time {
  flex-grow: 1;
}
#holding_overview .small {
  margin-top: 2.3em;
}
#holding_overview .small+ .small {
  margin-top: 2em;
}
.footer-logo__imgage {
  width: 58.13vw;
  margin: auto;
}
@media only screen and (max-width:750px) {
  .detail__copy .time { text-align: right}
}
@media only screen and (min-width:751px) {
  #holding_overview {
    padding-top: min(115px, 7.99vw);
    padding-bottom: min(90px, 6.25vw);
  }
  #holding_overview .inner {
    width: min(1010px, 70.14vw);
  }
  #holding_overview .style-h3 { 
    margin-bottom: 2.2em;
    font-size: min(26px, 1.81vw); 
  }
  .detail-wrap {
    display: grid;
    grid-template-columns: min(190px, 13.2vw) auto;
    grid-template-areas: "a b";
    padding: min(25px, 1.74vw) 0;
  }
  .detail-wrap:first-of-type {
    grid-template-areas:
      "a b"
      "a c";
  }
  .detail__title { grid-area: a; }
  .detail__item { grid-area: b; }
  .detail__notes { grid-area: c; }
  .detail__title {
    font-size: min(20px, 1.39vw);
  }
  .detail__copy .date {
    width: 20em;
  }
  .detail__copy .time {
    flex-grow: 1
  }
}

/* footer
------------------------------------------------------------------- */
#footer {
  position: relative;
  background-color: #414141;
  padding-top: 10.13vw;
  padding-bottom: 7.2vw;
}
.footer-nav__list {
  display: flex;
  justify-content: space-between;
  width: 70%;
  margin: auto;
  font-size: 2.93vw;
  font-weight: 600;
}
.copyright {
  width: calc(100% + 2em);
  margin-left: -1em;
  margin-top: 11.2vw;
  font-family: var(--font-latin);
  font-size: 2.67vw;
  text-align: center;
}
@media only screen and (min-width:751px) {
  #footer {
    padding-top: min(38px, 2.64vw);
    padding-bottom: min(62px, 4.31vw);
  }
  .footer-logo__imgage { width: min(300px, 20.83vw)}
  .footer-nav__list { 
    justify-content: center;
    font-size: min(16px, 1.11vw)
  }
  .footer-nav__item+ .footer-nav__item {margin-left: 6em}
  .copyright { 
    margin-top: 1.5em;
    font-size: min(12px, 0.83vw)
  }
}

/* 251111追記 */
@media only screen and (min-width:751px) {
  #concept::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 100%;
    height: 50px;
    width: 100vw;
    background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1))
  }
  .item__image-square {
    width: 34.72vw;
  }
}