  @charset "utf-8";
/********************************************************* 
 fss-exhibition in OOSAKA 2026 WINTER
 last-update - 2025.12.09
 *********************************************************/
:root {
  /* font-size */
  --fs: min(2.114vw,1rem);
  /* responsive-size */
  --rs: clamp(0.5rem, 1.042vw, 1rem);
  /* box-shadow */
  --bs-cmn: 0 2px 3px 1px rgb(50 50 50 / 10%);
  /* color - link */
  --c-link: #27abdc;
  --c-link-hover: #00f;
  --c-main: #e9521b;
  --c-dark: #cd1e23;
  /* color -text */
  --c-txt-base: #222;
  --c-base: #e72836;
  /* width */
  --w-site: min(100%, 128rem);
  --w-cont: min(100%, 96rem);
  --w-box: min(90%, 80rem);
}
@media screen and (max-width: 520px) {
  :root {
    /* font-size */
    --fs: 0.8rem;
  }
}
@font-face {
  font-family: "YuGothic-M";
  font-weight: normal;
  src: local("YuGothic-Medium"),local("Yu Gothic Medium"),local("YuGothic-Regular");
}
@font-face {
  font-family: "YuGothic-M";
  font-weight: bold;
  src: local("YoGothic-Bold"),local("Yu Gothic");
}
/*-------------------------------
 over write
---------------------------------*/
html {
  font-size: 62.5%;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}
body {
  font-size: calc(var(--fs) * 1.4);
  font-family: -apple-system, blinkMacSystemFont, YuGothic-M, YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color: var(--c-txt-base);
  letter-spacing:normal;
  -webkit-text-size-adjust: 100%;
  text-spacing-trim: trim-start;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome, body {
    font-feature-settings: "pkna";
  }
}
@media screen and (min-width: 767px) {
  body {
    font-size: calc(var(--fs) * 1.6);
  }
}
header {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
/* Global Navigation */
.navi-global__list {
  font-size: calc(var(--fs) * 1.6);
  flex: 1 1 50%;
  @media screen and (min-width: 767px) {
    font-size: calc(var(--fs) * 1.8);
    flex: 1 1 0;
  }
}
/* note */
.note-text {
  padding-left: 1em;
  text-indent: -1em;
}
.note-list {
  width: var(--w-cont);
  margin: 0 auto;
  position: relative;
  padding: 0 0 2rem;
}
.note-list__text {
  padding: 0.2rem 1em;
  margin: 0.2rem 1rem;
  font-size: calc(var(--fs) * 1.4);
  text-indent: -1em;
}
/*-------------------------------
 common
---------------------------------*/
.container {
  width: var(--w-cont);
  max-width: 100%;
  margin: 0 auto;
}
/* Link-btn */
.link-btn {
  font-weight: bold;
  width: min(94% , 80rem);
  padding: 2.2rem 3.4rem 2rem;
  background: var(--c-link);
  border-radius: 0.5rem;
  color: hsl(0deg 0% 100%);
  text-align: center;
  display: inline-block;
  position: relative;
  &:hover {
    color:   hsl(0deg 0% 100%);
    text-decoration: none;
    background: var(--c-link-hover);
  }
  &::after {
    content:"";
    width: 0;
    height: 0;
    border: 0.8rem solid transparent;
    border-left-color:  hsl(0deg 0% 100%);
    position: absolute;
    top: 50%;
    right: 1rem;
    margin-top: -0.8rem;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}
.link-btn.link-not { /*link cancel*/
  pointer-events: none;
  color: hsla(0,0%,67%,1.00);
  background: hsla(0,0%,93%,1.00);
  &::after {
    content: none;
  }
}
.pagetop {
  display: none;
}
.topMain {
  background: #181818;
  /*
  background: #fff url(/event/fss-exhibition/assets/image/250726/topImage-bg.jpg) 50% 0% no-repeat;
  */
  line-height: 0;
  text-align: center;
  width: 100%;
  max-width: 100%;
  padding: 0 0;
}
.btn-container {
  font-size: calc(var(--fs)* 1.6);
  width: 100%;
  margin: 1em auto 0;
}
/*-------------------------------
 Outline
---------------------------------*/
.outline {
  /* width: var(--w-cont); */
  /* max-width: 100%; */
  background: hsl(0deg 0% 3.92%);
  color: hsl(0deg 0% 20%);
  padding: 0 0 calc(var(--rs) * 6);
  /* margin: 0 auto; */
}
.fss-exb_title {
  font-family: 'Noto Serif JP', serif;
  font-size: calc(var(--fs) * 3.2);
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding: 5rem calc(var(--rs) * 2) 4rem;
  margin: 0 auto 0;
  line-height: 1.3;
  background: rgb(69,69,69);
  background: linear-gradient(180deg, rgba(69,69,69,1) 10%, rgba(10,10,10,1) 90%);
  @media (min-width: 760px) {
    font-size: calc(var(--fs) * 3.6)
  }
}
.outline-cont {
  width: var(--w-cont);
  max-width: 100%;
  padding: 0 calc(var(--rs) * 1) 0;
  margin: 0 auto;
}
.outline-cont + .outline-cont {
  margin: calc(var(--rs) * 6) auto 0;
}
.detail {
  font-size: calc(var(--fs) * 1.8);
  width: 100%;
  max-width: 100%;
  background: #fff; 
}
.detail caption {
  font-size: calc(var(--fs) * 2.6);
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding-bottom: 0.5em;
}
.detail th {
  color: #fff;
  line-height: 1;
  vertical-align: middle;
  background: #636363;
  border-right: 0.1rem solid #000;
  padding: 1rem 1rem; 
}
.detail td {
  padding: calc(var(--rs) * 2);
}
.detail-info {
  padding: 0 0 0;
}
.detail-info li:first-of-type {
  padding: 0 0 0.5rem;
}
.detail-note {
  font-size: calc(var(--fs) * 1.4);
}
@media (max-width: 760px) {
  .detail th , .detail td {
    display: block;
  }
}
@media (min-width: 760px) {
  .detail th , .detail td {
    border-bottom: 0.1rem solid #000;
  }
}
/* 入場方法 */
.fss-outline_title {
  font-size: calc(var(--fs) * 2.6);
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding-bottom: 0.5em;
}
.adm-cont {
  background: #666;
  padding: calc(var(--rs) * 2) calc(var(--rs) * 2) calc(var(--rs) * 4);
}
.fss-adm_txt {
  font-size: calc(var(--fs) * 2.2);
  font-weight: bold;
  color: #fff;
  line-height: 1;
  border-left: 1rem solid #fff;
  padding: 0.6rem 0 0.5rem calc(var(--fs) * 1);
  margin-bottom: 1.5rem;
}
.adm-wrap {
  display: flex;
  gap: calc(var(--rs) * 1);
  justify-content: space-evenly;
  flex-wrap: wrap;
  background: #fff;
  padding: calc(var(--rs) * 1);
}
.link-wrap {
  flex: 1 0 auto;
}
a.adm-link--btn {
  font-size: calc(var(--fs) * 1.8);
  font-weight: bold;
  text-decoration: none;
  color: #fff;
  width: 100%;
  padding: calc(var(--rs) * 1);
  border-radius: 0.5rem;
  background: linear-gradient(360deg, rgb(205 13 13) 0%, rgb(255 129 65) 100%);
  display: flex;
  &
  span {
    flex: 1 0 auto}
  &
  span:first-of-type {
    flex: 0 0 auto}
  &
  span:last-of-type {
    text-align: center;
  padding: 0 1em 0 0}
  &:
  hover {
    filter: brightness(1.2);
  }
}
.outline-wrap {
  background: #666;
  padding: 0 calc(var(--rs) * 2) calc(var(--rs) * 2);
}
.outline-tit {
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  color: #fff;
  text-align: left;
  padding: 1.3rem calc(var(--rs) * 1) 1rem;
  background: linear-gradient(360deg, rgb(205 13 13) 0%, rgb(255 129 65) 100%);
  display: flex;
  align-items: center;
  gap: calc(var(--rs) * 1);
}
.outline-inner {
  padding: 1rem calc(var(--rs) * 2);
  background: #fff;
}
.outline-dscr {
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  word-break: auto-phrase;
  padding: 1.5rem 0 1rem;
}
.ticket--wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  padding: 2rem;
  border: 0.5rem solid #eaeaea;
}
.sp-ticket--wrap {
  margin: 0 auto 2rem;
}
@media screen and (min-width: 767px) { 
  .ticket--wrap {
    grid-template-columns: 25% 1fr;
  }
}
.sp-ticket--img p {
  font-size: calc(var(--fs) * 1.2);
}
.sp-ticket--text dt {
  font-size: calc(var(--fs) * 1.8);
  font-weight: bold;
}
@media screen and (min-width: 767px) { 
  .sp-ticket--text dt {
  }
}
.sp-price {
  text-align: right;
}
.outline-notice {
  font-size: calc(var(--fs) * 1.6);
  border-top: 0.1rem solid #ebebeb;
  margin: 1rem 0 0;
  padding: 1rem 0 0;
}
.outline-notice dt {
  font-weight: bold;
  color: #d91617;
  font-size: calc(var(--fs) * 1.6);
}
.outline-notice dd {
  text-indent: -1em;
  margin-left: 1em;
  padding: 0.5rem 0 0 calc(var(--fs) * 0.8);
  font-size: calc(var(--fs) * 1.4);
  line-height: 1.2;
}
.outline-tbl {
  font-size: calc(var(--fs) * 1.8);
  width: 100%;
  max-width: 100%;
  border-collapse: separate;
  border-spacing: 0 1em;
}
.outline-tbl-l {
  text-align: center;
  white-space: nowrap;
  width: 6em;
  color: #fff;
  display: block;
  margin-bottom: 0.5em;
}
@media screen and (min-width: 767px) { 
  .outline-tbl-l {
    display: inherit;
    margin-bottom: 0;
  }
}
.outline-tbl-l p {
  background: #000;
  padding: 0.2em 1em 0.2em;
}
.outline-tbl-r {
  display: block;
  margin-left: 2em;
  text-indent: -1em;
  position: relative;
}
@media screen and (min-width: 767px) { 
  .outline-tbl-r {
    margin-left: 2em;
  }
}
.outline-tbl-r.tbl-point::before {
  content: "●";
  color: #d91617;
}
.outline-tbl .outline-tbl-r:not(:last-of-type) {
  padding-bottom: 1em;
}
.outline-tbl-place {
  text-indent: 0;
  margin-left: 1em;
}
.ticket-desing {
  display: flex;
  justify-content: space-between;
  padding: calc(var(--rs) * 1.5) 0;
  & li {
    width: calc(100% / 2);
  }
}
.outline-dscr.outline-ticket {
  color: var(--c-red);
  margin-top: calc(var(--rs) * 4);
  text-align: center;
  font-size: calc(var(--rs) * 2.4);
}
/*-------------------------------
 Museum
---------------------------------*/
.event-cont {
  padding: calc(var(--rs) * 6) 0;
}
.event-title {
  width: var(--w-cont);
  text-align: center;
  font-size: calc(var(--fs) * 3);
  line-height: 1.2;
  padding: 1.2rem calc(var(--rs) * 1.5) 1rem;
  margin: 0 auto calc(var(--rs) * 3.5);
  border-bottom: 0.2rem solid;
  color: #da1816;
  background: -webkit-linear-gradient(0deg, rgba(217, 21, 23, 1) 0%, rgba(234, 83, 5, 1)80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media screen and (min-width: 767px) {
  .event-title {
    font-size: calc(var(--fs) * 4);
  }
}
/*-------------------------------
 Item
---------------------------------*/
article#item {
  background: #000;
  /*background: url(/event/fss-exhibition/assets/image/bg_body.jpg) left top repeat-x rgb(0, 0, 0);*/
}
.item-event-title {
  width: 96rem;
  max-width: 100%;
  text-align: center;
  font-size: calc(var(--fs) * 3);
  line-height: 1.2;
  padding: 1.2rem calc(var(--rs) * 1.5) 1.5rem;
  margin: 0 auto;
  border-bottom: 0.1rem solid #fff;
  color: #ffffff;
}
@media screen and (min-width: 767px) {
.item-event-title {
    font-size: calc(var(--fs) * 4);
  }
}
.store-link {
  font-size: calc(var(--fs) * 1.8);
  width: var(--w-cont);
  max-width: 100%;
  margin: 2rem auto calc(var(--rs) * 4);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 1.5rem 1rem 1rem;
  gap: 1rem;
}
.store-link li {
  text-align: left;
  flex: 1 0 100%;
}
@media screen and (min-width: 767px) {
  .store-link li {
    text-align: center;
    width: auto;
    flex: 1 0 auto;
  }
}
.store-link-btn {
  color: #fff;
}
.store-link-btn:hover {
  color: #fff;
  text-decoration: underline;
}
.store-link-btn i {
  color: var(--c-link);
}
.event-wrap {
  color: #fff;
  width: var(--w-cont);
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc(var(--rs) * 1) 0;
}
.event-wrap + .event-wrap {
  margin: calc(var(--rs) * 10) auto 0;
}
.event-wrap h4 {
  font-size: clamp(2rem , 4vw , 2.8rem);
  text-align: center;
  color: #fff;
  line-height: 1.5;
  margin: 0 0 calc(var(--rs) * 3.5) 0;
  padding: 0.7em 1rem 0.5em;
  background: rgb(217, 21, 23);
  background: linear-gradient( 90deg , rgba(217, 21, 23, 1) 0%, rgba(234, 83, 5, 1) 100%);
}
.event-wrap #limited-online h4 {
  margin: 0 0 0 0;
}
.event-wrap h5 {
  font-size: calc(var(--fs) * 2.2);
  color: #fcd026;
}
.item-lead {
  font-size: calc(var(--fs) * 1.8);
}
.item-note {
  font-size: calc(var(--fs) * 1.4);
  margin: 0.3rem 0 0 1em;
  text-indent: -1em;
}
p + .item-note {
  margin: 1rem 0 0 1em;
}
.item-wrap {
  background: #525252;
  width: var(--w-cont);
  max-width: 100%;
  margin: 3rem auto 0;
}
.item-wrap + .event-wrap {
  margin-top: calc(var(--rs) * 10);
}
.item-wrap h6 {
  font-size: calc(var(--fs)* 2);
  font-weight: bold;
  text-align: left;
  color: #000;
  margin: 1rem auto 0rem;
  padding: 0.8rem calc(var(--rs)* 1) 0.5rem;
  background: #ccc;
  border-bottom: 0.5rem double #000;
}
.item-list--group {
  padding: calc(var(--rs) * 1);
}
.item-list--group div:not(:first-of-type):not(:last-of-type) {
  margin-bottom: calc(var(--rs) * 2);
}
.list-title {
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  color: #fff;
  margin: 0 0 calc(var(
  --rs) * 1) 0;
}
.list-title.list-title--none {
  display: none;
}
/* item-col */
.item-col {
  display: grid;
  flex-flow: row wrap;
}
.item-col.col-2 {
  grid-template-columns: repeat(2 , 1fr);
}
.item-col.col-3 {
  grid-template-columns: repeat(2 , 1fr);
}
.item-col.col-4 > * ,
.item-col.col-5 > * {
  display: grid;
  grid-template-columns: calc(var(--rs) * 25) 1fr;
}
@media screen and (min-width: 767px) {
  .item-col.col-3 {
    grid-template-columns: repeat(3 , 1fr);
  }
  .item-col.col-4 > * ,
  .item-col.col-5 > * {
    display: block;
  }
  .item-col.col-4 {
    grid-template-columns: repeat(4 , 1fr);
  }
  .item-col.col-5 {
    grid-template-columns: repeat(5 , 1fr);
  }
}
.item-detail-brand {
  background: #0868cb;
}
.item-detail-name , .item-detail-data {
  color: #333;
}
/* item-text */
.shop-item {
  padding: calc(var(--rs) * 1) 0 calc(var(--rs) * 3);
}
.shop-item-brand {
  padding: 0 0 0.5em 1.5em;
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  text-indent: -1.5em;
}
.shop-item-brand + .shop-item-list {
  border-top: 0.2rem solid #edbfaf;
}
.shop-item-list {
  color: #fff;
  padding: 1rem 0.5em;
  line-height: 1.2;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.shop-item-group > .shop-item-list:nth-of-type(2n + 1) {
  background: #2b2b2b;
}
.shop-item-group + .shop-item-group {
  margin-top: 2em;
}
.shop-item-list > a {
  color: inherit;
}
.shop-item-list > a:hover,
.shop-item-list > a:hover::after{
  color: var(--c-link-hover);
  text-decoration: none;
}
.shop-item-list__price {
  padding-left: 1em;
  font-weight: bold;
  flex: 0 0 auto;
}
.scd-group {
  background: #f2f1ed;
  padding: calc(var(--rs)* 2) calc(var(--rs)* 1);
}
.order-scd {
  border-collapse: separate;
  font-size: calc(var(--fs) * 1.8);
  }
.order-scd th {
  font-size: 90%;
  font-weight: normal;
  color: #fff;
  padding: 0.6rem 2rem 0.5rem;
  vertical-align: middle;
  background: rgb(217, 21, 23);
  background: linear-gradient(90deg, rgba(217, 21, 23, 1) 0%, rgba(234, 83, 5, 1) 100%);
}
.order-scd th span {
  width: 6em;
  white-space: nowrap;
}
.order-scd td {
  font-weight: bold;
  color: #333;
  text-align: left;
  padding-left: 1rem;
  vertical-align: middle;
}
.link-group {
  padding: calc(var(--rs) * 2) 0 calc(var(--rs) * 1) 0;
}
.item-detail-tab {
  display: none;
}
/* new tag */
.item-new::before {
  content: "";
  width: calc(var(--rs) * 4.5);
  height: calc(var(--rs) * 4.5);
  background: linear-gradient( -135deg, rgb(255 0 0 / 80%) 50% , rgb(0 0 0 / 0) 50%);
  display: block;
  position: absolute;
  top: -1px;
  left: inherit;
	right: -1px;
  z-index: 10;
}
.item-new::after {
  content: "NEW";
  width: calc(var(--rs) * 3.5);
  color: #fff;
  font-size: var(--rs);
  text-align: center;
  text-shadow: 0rem 0.2rem 0.1rem rgb(135 0 0), 0rem 0rem 0.1rem rgb(135 0 0);
  transform: rotate(45deg);
  position: absolute;
  top: calc(var(--rs) * 0.6);
	right: calc(var(--rs) * -0.3);
	left: inherit;
  z-index: 11;
}
/*-------------------------------
 lottery
---------------------------------*/
/* 抽選販売について */
.item-lottery--roule {
  padding: 0 calc(var(--rs) * 1) 0;
  /* padding: 3rem calc(var(--rs) * 1) 0; */
  /* width: 97%; */
  /* margin: 0 auto; */
  /* background: #fff; */
}
.item-lottery--roule h7 {
  font-size: calc(var(--fs) * 2.4);
  line-height: 1;
  color: var(--c-dark);
  text-align: center;
  border-bottom: 2px solid var(--c-dark);
  /* border-left: none; */
  /* border-right: none; */
  padding: 1.4rem 0 1.2rem 0;
  display: block;
}
.cntsInner {
  padding: 2rem calc(var(--rs) * 1) 2rem;
}
.fs--text {
  padding: 0 0 1.5rem 0;
}
.fs--text strong {
  font-size: calc(var(--fs) * 1.8);
}
.fs--text a {
  font-size: calc(var(--fs) * 1.4);
}
.infoInner {
  padding: 1.5rem 0 1.5rem calc(var(--fs) * 1.6);
  color: #333;
  background: #fff;
  & h8 {
    font-size: calc(var(--fs) * 1.8);
    font-weight: bold;
    color: var(--c-dark);
    line-height: 1;
    padding: 0.6rem 0 0.6rem 0;
    display: inline-block;
  }
  & dd {
    padding: 0 0 0 0;
  }
  & ul {
    font-size: calc(var(--fs) * 1.4);
    padding: 0.5rem 0 0 0;
  }
  &:nth-of-type(odd) {
    /* color: #333; */
    background: #fbfbf3;
  }
}
.infotbl {
  border-collapse: separate;
  border-spacing: 0 1rem;
  width: 100%;
  max-width: 100%;
}
.infotbl th {
  text-align: left;
  width: 5em;
}
.infotbl td:before {
  content: ":";
  position: absolute;
  left: 0;
}
.infotbl td {
  padding: 0 0 0 1.5em;
  position: relative;
}
.infotbl.infotbl-cls td {
  text-indent: -1em;
}
.infotbl.infotbl-cls th:after {
  content: inherit;
}
.note-inner {
  background: var(--c-dark);
  color: #fff;
}
.note-tit {
  font-size: calc(var(--fs) * 2.4);
  text-align: center;
  margin: 0 0 1rem 0;
}
.note-txt {
  font-weight: bold;
  text-align: center;
  margin: 0 0 1rem 0;  
}
@media screen and (min-width: 767px) {
  .note-txt {
    font-size: calc(var(--fs) * 1.6);
  }
}
.noteInfo {
  font-size: calc(var(--fs) * 1.4);
  color: var(--c-txt-base);
  background: #fff;
  margin: 0 auto;
  padding: 1.5rem calc(var(--fs) * 1) 1.5rem;
}
.noteInfo li {
  text-indent: -1em;
  padding: 0 0 0 1em;
}
.noteInfo li:not(:last-of-type) {
  padding: 0 0 0.3rem 1em;
}
.note-inner {
  padding: 2rem calc(var(--rs) * 1) 1rem;
}
.item-note {
  text-indent: -1em;
  margin: 0 0 0 1em;
}
.item-note li:not(:last-of-type) {
  padding: 0 0 0.3em 0;
}
/*-------------------------------

---------------------------------*/
.nagano-exb {
  background: #010101;
  padding: 4rem calc(var(--rs) * 2);
}

.nagano-exb a {
  width: 900px;
  max-width: 100%;
  margin: 0 auto;
  display: block;
}
/*-------------------------------

---------------------------------*/
.lead-tit {
  font-size: calc(var(--fs) * 2.8);
  color: #cd0d0d;
  padding: 0 0 0.5rem;
}
.lead-text {
  font-size: calc(var(--fs) * 1.6);
  margin: 0 auto 3rem;
}
.pre-h2 {
  font-size: calc(var(--fs) * 3.2);
  text-align: center;
  padding: 4rem 0 2rem 0;
}
