@charset "utf-8";
/* 260228 yokohama sr open */

:root {
  --ff-mincho: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  --ff-yugothic: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  /*--bg-gohead: 
    linear-gradient(
    180deg,
    rgb(0 0 0 / 10%) 0% ,
    rgb(0 0 0 / 0%) 50%,
    rgb(0 0 0 / 10%) 100%
    ),
    repeating-linear-gradient(
      135deg,
      hsl(38deg 93% 28%), 
      hsl(38deg 93% 28%) calc(var(--rs) * 0.5), 
      hsl(38deg 88% 27%) calc(var(--rs) * 0.8)
    )
    ;*/
  --bg-gohead: rgb(63 21 3 / 60%);
  /*bs*/
  --bs-epcmn: 0px 2px 5px 1px rgb(0 0 0 / 40%);
  /*color*/
  --c-main-01: #a00;
  --c-main-02: #c92323;
  --c-main-03: #af2930;
  --c-main-04: #d01b1b;
  --c-main-05: #c74e4e;
  --c-main-06: #fffaf8;
  /*color _ event*/
  --ep-c-gry: #98908a;
  --ep-c-gry-dark: #5a5450;
  --ep-c-hobby: #3e5ec0;
  --ep-c-dolpo: #ba1e31;
  /*font*/
  --fs: min(2.114vw,1rem);
  --rs: clamp(0.5rem, 1.042vw, 1rem);
  /*width*/
  --w-cont: min(96%, 108rem);  
}
/*-------------------------------
 css overwrite
---------------------------------*/
main {
  padding-bottom: 0;
}
.news {
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0 auto;
  font-size: calc(var(--fs) * 1.5);
}
.news-tit,
.news-date {
  width: var(--w-cont);
  margin: calc(var(--fs) * 1) auto 1em;
  display: none;
}
/*#yokohamaOPfair a {
  color: var(--color-link-nml);
}
#yokohamaOPfair a:hover {
  color: var(--color-link-nml-hover);
}*/
#yokohamaOPfair a[id]:not([href]) {
    height: calc(var(--rs) * 4);
    margin-top: calc(var(--rs) * -4);
    display: block;
}
#yokohamaOPfair .link-text__deco--more::after {
  border-color: var(--color-link-nml);
  top: -0.02em;
}
#yokohamaOPfair .link-text__deco--more:hover::after {
  border-color: var(--color-link-nml-hover);
}
#yokohamaOPfair a.link-btn-blog {
  width: min(90%, 64rem);
  padding: 1em 2.5em 1em 1em;
  margin: 0.5em auto;
  background: var(--color-link-nml);
  border-radius: 5px;
  color: #fff;
  font-size: calc(var(--fs) * 1.6);
  font-weight: normal;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  display: block;
  position: relative;
}
a.link-btn-blog > i {
  position: absolute;
  right: 0.25em;
  top: calc(50% - 0.5em);
}
a.link-btn-blog:hover {
  filter: brightness(0.9);
}
p:has(a.link-btn-blog) {
  margin-top: 1em;
}
.pagination {
  display: none;
}
/*-------------------------------
 grand open information
---------------------------------*/
.notlink { pointer-events: none; color: #fff;}
/*-------------------------------
 grand open
---------------------------------*/
#yokohamaOPfair {
  width: 100%;
  max-width: 100%;
  padding-bottom: calc(var(--rs) * 12)  ;
  margin: 0 auto;
  background: 
    url( "/assets/image/news/event/260228_yokohama_open/bg_yokohama-open.jpg") 50% 0 / calc(var(--rs) * 192) no-repeat,
    url("/assets/image/news/event/260228_yokohama_open/bg-ptn_yokohama-open.jpg") 50% 0 / 1px calc(var(--rs) * 200) repeat-x,
    #dff2ff
  ;
  color: #202020;
  font-family: var(--ff-yugothic);
  position: relative;
  overflow: hidden;
}
#yokohamaOPfair::after {
  content: "";
  width: 100%;
  height: calc(var(--rs) * 10);
  background: url("/assets/image/news/event/260228_yokohama_open/deco_yokohama-open.png") 50% 0 / calc(var(--rs) * 192) auto repeat-x;
  filter: drop-shadow(1px 4px 5px rgb(0 0 0 / 50%));
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}
#yokohamaOPfairTitle {
  width: min(100%,88rem);
  margin: calc(var(--rs) * 6.5) auto 0;
  text-align: center;
} 
/*-------------------------------
 grand open _ schedule
---------------------------------*/
.yokohamaOP-openSchedule {
  width: fit-content;
  max-width: 96%;
  margin: 0 auto;
  font-size: calc(var(--fs) * 2);
  text-align: left;
}
/*-------------------------------
 grand open text
---------------------------------*/
.yokohamaOPfair-catch {
  width: 100%;
  padding: calc(var(--fs) * 1) 2%;
  margin: 0 auto /*calc(var(--rs) * 4)*/;
  background: rgb(255 255 255 / 80%);
  color: #a92334;
  font-size: calc(var(--rs) * 2.8);
  text-align: center;
  position: relative;
}
/*opening fair _ lead*/
#yokohamaOPfairLead {
  width: min(100%, 108rem);
  padding: calc(var(--fs) * 1) 2%;
  margin: 0 auto;
  background: 
    linear-gradient(90deg, transparent 0%, rgb(25 65 155 / 60%) 0%, rgb(25 65 155 / 60%) 100%, transparent 100%)
  ;
  text-shadow: 0 2px 3px rgb(0 0 0 / 50%);
  filter: drop-shadow(0 0 5px rgb(0 0 0 / 50%));
}
/* text */
.yokohamaOPfair-text {
  width: 96%;
  padding: 0 0.5em;
  margin: 0.5em auto;
  color: #fff;
  font-size: calc(var(--fs) * 1.6 + var(--rs) * 0.6);
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
}
.yokohamaOPfair-text > b {
  margin: 1em auto -0.5em;
  font-size: 112.5%;
  letter-spacing: 0.05em;
  text-align: center;
  display: block;
}
.yokohamaOPfair-text--width {
  width: min(90%, 90rem);
}
/*lead inner*/
.yokohamaOPfairLead-inner {
  width: 100%;
  padding: calc(var(--fs) * 0.5) 2% calc(var(--fs) * 1);
}
/*lead inner _ schedule*/
#yokohamaOPschedule {
  width: 94%;
  padding: 0.25em 1em;
  margin: calc(var(--fs) * 1) auto 0;
  background: var(--c-main-01);
  box-shadow: 0 2px 5px -1px rgb(0 0 0 / 50%);
  color: #fff;
  font-size: calc(var(--fs) * 2);
  text-align: center;
}
#yokohamaOPschedule li {
  padding: 0.75em 1em;
}
#yokohamaOPschedule li:not(:last-child) {
  border-bottom: 1px solid rgb(110 0 0 / 100%);
}
#yokohamaOPschedule li + li {
  border-top: 1px solid rgb(228 113 113 / 50%);
}
#yokohamaOPschedule li b {
  display: inline-block;  
}
/*lead inner _ notice*/
#yokohamaOPfairLead .ep-notice {
  width: 100%;
  margin: 1em auto 0;
  color: #fff;
  font-size: calc(var(--fs) * 1.3);
  text-align: center;
}
#yokohamaOPfairLead .ep-notice li {
  display: inline-block;
  text-align: left;
}
a.notice-link {
  padding: 0.25em;
  padding-left: 0.75em;
  margin-top: 0.25em;
  margin-left: -1em;
  background: rgb(255 255 255 / 90%);
  border-radius: 1em;
  box-shadow: 0 2px 3px 0 rgb(0 0 0 / 50%);
  font-size: calc(var(--fs) * 1.2);
  filter: none;
  text-shadow: none;
  text-indent: 0;
  display: inline-block
}
/*-------------------------------
 open information
---------------------------------*/
.open-info {
  width: var(--w-cont);
  padding: calc(var(--rs) * 1);
  margin: calc(var(--rs) * 1) auto;
  background: #fff;
  box-shadow: var(--bs-cmn);
}
/* open info box */
.open-infobox {
  width: calc(96% - 6px);
  padding: calc(var(--fs) * 2) calc(var(--rs) * 1);
  margin: calc(var(--rs) * 2) auto 0;
  background: var(--c-main-06);
  border: 3px double var(--c-main-03);
  color: var(--c-main-01);
  font-family: var(--ff-yugothic);
  outline: 3px solid var(--c-main-03);
}
/* open info title */
.open-info-title {
  padding-bottom: 0.5em;
  /*margin-bottom: calc(var(--rs) * 1);*/
  border-bottom: 1px solid;
  font-size: calc(var(--rs) * 1.6 + var(--fs) * 0.8);
  line-height: 1.3;
  text-align: center;
}
.open-info-title span {
  font-size: 87.5%;
  display: block;
}
/* open info period */
.open-info-period {
  padding-top: 0.5em;
  border-top: 1px solid #fff;
  font-size: calc(var(--rs) * 1.6 + var(--fs) * 1.6);
  font-weight: bold;
  text-align: center;
}
.open-info-period small {
  font-size: 75%;
  font-weight: bold;
}
/* open info time */
.open-info-time {
  margin-top: 0.5em;
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  text-align: center;
}
/* open info text */
.open-info-text {
  width: min(94%, 76rem);
  margin: 1em auto;
  font-size: calc(var(--fs) * 1.7);
}
.open-info-text small {
  margin-top: 1em;
  font-size: calc(var(--fs) * 1.4);
  display: inline-block;
}
/*-------------------------------
 event program
---------------------------------*/
#goEP {
  width: var(--w-cont);
  padding: calc(var(--rs) * 1);
  margin: calc(var(--fs) * 4) auto calc(var(--fs) * 2);
  background: rgb(255 255 255 / 90%);
  box-shadow: var(--bs-cmn);
}
.goEP-title {
  padding: calc(var(--fs) * 1.5) calc(var(--fs) * 1);
  /*background: #865605;*/
  background: var(--c-main-01);
  color: #fff;
  font-size: calc(var(--fs) * 2.4);
  line-height: 1;
  text-align: center;
}
.goEP-list {
  width: min(100%, 108rem);
  padding: 1em;
  margin: 0 auto;
  display: flex;
  flex-flow: row wrap;
  counter-reset: number 0;
}
.goEP-list > div {
  width: min(100%, 32rem);
  flex: 1 1 auto;
}
.goEP-list li {
  min-height: 2.6em;
  margin: 0.4em 1em calc(var(--rs) * 1);
  margin-left: 2em;
  font-size: calc(var(--fs) * 1.6);
  font-weight: bold;
  line-height: 1.2;
}
.goEP-list li::before {
  counter-increment: number 1;
  content: counter(number,decimal/*-leading-zero*/) "";
  width: 2em;
  height: 2em;
  margin-left: -2.5em;
  margin-right: 0.5em;
  background: var(--c-main-01);
  border-radius: 50%;
  box-shadow: 2px 2px 1px 0px var(--c-main-04);
  color: #fff;
  font-weight: bold;
  line-height: 2.2em;
  text-align: center;
  display: inline-block;
}

/*-------------------------------
 co-located events
---------------------------------*/
.colocatedEvent {
  width: min(98%, 108rem);
  padding-top: calc(var(--rs) * 4);
  margin: calc(var(--rs) * 1) auto 0;
  border-top: 1px solid var(--c-main-04);
  container-type: inline-size;
}
.colocatedEvent-title {
  color: var(--c-main-01);
  font-size: calc(var(--fs) * 1.2 + var(--rs) * 1.6);
  text-align: center;
  position: relative;
}
/*同時開催イベント*/
.colocatedEvent-list {
  width: 100%;
  margin: calc(var(--rs) * 2) auto calc(var(--rs) * 1);
  display: flex;
  flex-flow: row wrap;
  align-self: center;
}
.colocatedEvent-list li {
  width: 48%;
  margin: calc(var(--fs) * 1) 1%;
  background: #fff;
  box-shadow: var(--bs-cmn);
  text-align: center;
  flex: 1 1 auto;
}
.colocatedEvent-list figcaption {
  padding: 0.5em;
}
/*-------------------------------
 event program
---------------------------------*/
small {
  font-weight: inherit;
}
section.epWrap {
  width: min(100%, 108rem);
  max-width: 100%;
  padding: 1em 0;
  margin: 0 auto;
  background: rgb(255 255 255 / 95%);
  box-shadow: var(--bs-epcmn);
  position: relative;
}

/*event program _ local navi*/
.epLocalNavi {
  width: min(96%, 108rem);
  margin: 0 auto;
  background: #fff;
  font-size: calc(var(--fs) * 0.8 + var(--rs) * 1.2);
  text-align: center;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
}
.epLocalNavi li {
  width: 50%;
}
.epLocalNavi li.epLocalNavi-select {
  background: #fff;
  font-weight: bold;
}
.epLocalNavi li:not(.epLocalNavi-select) {
  background: #f4f4f4;
  border-left: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}
.epLocalNavi li > a {
  padding: 1em;
  display: block;
}
.epLocalNavi li:not(.epLocalNavi-select)  > a {
  box-shadow: 1px 2px 5px #e5e5e5 inset;
  color: #c30000;
}
.epLocalNavi li > a:hover {
  background: #fff;
  text-decoration: none;
}
.epLocalNavi li > a::after {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: 0.25em;
  margin-right: -0.25em;
}
.epLocalNavi li:not(.epLocalNavi-select)  > a::after {
  content: "\f138";

}
.epLocalNavi li.epLocalNavi-select > a::after {
  content: "\f13a";
}
.epLocalNavi:nth-of-type(2) li.epLocalNavi-select > a::after {
  content: "\f139";
}
.epLocalNavi:nth-of-type(2) {
  margin-bottom: calc(var(--fs) * 8);
}
#epWrapSR .epLocalNavi li.epLocalNavi-select > a {
  color: #0052c3;
}
#epWrapDP .epLocalNavi li.epLocalNavi-select > a {
  color: #c30000;
}
#epWrapDP .epLocalNavi li:not(.epLocalNavi-select)  > a {
  box-shadow: -1px 2px 5px #e5e5e5 inset;
}
/*event program _ header*/
.eventProgram-header {
  width: 100%;
  padding: 1em 0;  
  margin: 0 auto;
  text-align: center;
}
.epHeader-text {
  width: 94%;
  margin: 0 auto;
  font-size: calc(var(--fs) * 0.6 + var(--rs) * 1.6);
  font-weight: bold;
  line-height: 1.8;
  text-align: left;
}
.eventProgram-header .rerated-link {
  margin: calc(var(--rs) * 3) auto 0;
}
/*event program content box*/
.eventProgram {
  width: 96%;
  padding: 0;
  margin: 2% auto;
  display: flex;
  flex-flow: row wrap;
  counter-reset: number;
}
/*.event program _ heading*/
.eventPGheading {
  width: 100%;
  padding: calc(var(--rs) * 1.5);
  margin: 0 auto 1%;
  background: var(--c-main01);
  color: #fff;
  font-size: calc(var(--fs) * 0.8 + var(--rs) * 1.4);
  text-align: center;
}
#yokohamaOPfairSR .eventPGheading {
  background: var(--c-main-01);
}
#yokohamaOPfairDP .eventPGheading {
  background: #c30000;
}
/*.event program _ contents,*/
.ep-cont {
  width: min(100%, 36rem);
  padding: calc(var(--rs) * 3) calc(var(--rs) * 2 + 1%);
  margin: 0 1px;
  border-bottom: 4px dotted #222;
  font-size: calc(var(--fs) * 1.6);
  flex: 1 1 auto;
}
@media screen and (min-width:768px) {
  .ep-cont:not(.ep-cont-full) + .ep-cont:not(.ep-cont-full) {
    border-left:  4px dotted #222;  
  }  
}
.ep-cont-full {
  width: 100%;
}
.ep-cont.ep-cont-blank {
  padding: 0;
  margin: 0 1%;
  visibility: hidden;
}
.ep-title {
  width: 100%;
  min-height: 2.6em;
  padding: 0.25em 0;
  padding-left: 2em;
  font-size: calc(var(--fs) * 2);
  font-weight: bold;
  line-height: 1.3;
  display: flex;
  align-items: flex-start;
  position: relative;
}
.eventProgram div.ep-cont .ep-title::before {
  counter-increment: number 1;
  content: counter(number, decimal /*-leading-zero*/) "";
  width: 2em;
  height: 2em;
  margin-top: -0.25em;
  margin-left: -2.5em;
  margin-right: 0.5em;
  background: var(--c-main-01);
  border-radius: 50%;
  color: #fff;
  font-weight: bold;
  line-height: 2em;
  text-align: center;
  text-shadow: 1px 1px 0 rgb(0 0 0 / 50%);
  display: inline-block;
  flex-shrink: 0;
}
.ep-cont-pic {
  width: min(100%, 460px);
  padding: 0;
  margin: 0 auto;
  flex: 1 1 auto;
}
.ep-cont-detail {
  width: 100%;
  padding: 0;
  margin: 1em auto;
}
/*ep cont _ full column*/
.ep-cont-full {
  width: 100%;
}
.ep-flxcont {
  display: flex;
  flex-flow: row wrap;
  gap: 2%;
}
.ep-flxcont > * {
  width: min(100%, 32rem);
  margin: 0 auto 1em;
  flex: 1 1 auto;
}
/*event program _ information*/
.ep-cont-info {
  width: 100%;
  background: var(--c-main-06);
  border: 1px solid var(--c-main-04);
  border-collapse: separate;
  border-spacing: 2px;
  margin-bottom: 0.75em;
}
.ep-info-tab,
.ep-info-text {
  padding: 0.5em;
  font-size: calc(var(--fs) * 1.5);
  line-height: 1.5;
}
.ep-info-tab {
  width: 5em;
  background: var(--c-main-01);
  color: #fff;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
}
.ep-info-text {
  vertical-align: middle;
}
tr.ep-cont-date + tr.ep-cont-point :is(th,td) {
  border-top: 1px dashed   var(--c-main-01);
}
tr.ep-cont-point .ep-info-tab {
  background: var(--c-main-01);
  color: #fff;
}
tr.ep-cont-point + tr.ep-cont-point :is(th,td) {
  border-top: 1px solid var(--c-main-01);
}
/*event program _ text*/
.ep-cont-text {
  margin-top: 1em;
  font-size: calc(var(--fs) * 1.6);
  font-weight: bold;
}
.ep-cont-text b {
  color: var(--c-main-01);
  font-size: 112.5%;
  font-weight: bold;
  display: inline-block;
}
.ep-notice {
  margin-top: 1em;
  font-size: calc(var(--fs) * 1.2);
  line-height: 1.3;
}
.ep-notice > * {
  padding-left: 1em;
  margin-bottom: 0.25em;
  text-indent: -1em;
}
/*item list*/
.ep-itemlist {
  width: 100%;
  padding: 0.25em;
  margin: 1em 0 1em;
  background: rgb(255 255 255 / 80%);
  border: 1px solid #999;
  font-size: calc(var(--fs) * 1.4);
}
.ep-itemlist > dt {
  padding: 0.5em;
  font-weight: bold;
}
.ep-itemlist > dd + dt {
  margin-top: 0.5em;
  border-top: 1px dashed #ccc;
}
.ep-itemlist > :is(li,dd) {
  padding: 0.5em;
  line-height: 1.3;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
.ep-itemlist > :is(li,dd)::before {
  content: "・";
}
.ep-itemlist > :is(li,dd) span:last-child {
  margin-left: auto;
}
.ep-itemlist > :is(li,dd):nth-of-type(2n + 1) {
  background: rgb(0 0 0 / 5%);
}
/*content commentary*/
.ep-cont-comment {
  padding: 0.75em 1em;
  margin: 1em auto 2%;
  background: #f8cace;
  border: 5px double #fff;
  font-size: calc(var(--fs) * 1.4);
}
.ep-cont-comment b {
  width: 100%;
  margin-bottom: 0.5em;
  border-bottom: 1px solid;
  font-size: 112.5%;
  font-weight: bold;
  display: inline-block;
}
/*event table*/
.ep-eventTable {
  width: 100%;
  border-bottom: 1px solid #999;
  font-size: calc(var(--fs) * 1.4);
}
.ep-eventTable th,
.ep-eventTable td {
  vertical-align: middle;
}
.ep-eventTable th {
  padding: 0.25em;
  background: var(--c-main-02);
  font-weight: normal;
}
.ep-eventTable th + th {
  border-left: 1px solid #fff;
}
.ep-eventTable td {
  padding: 0.5em;
}
.ep-eventTable tr:nth-child(2n+0) td {
  border-top: 1px solid #999;
}
.ep-eventTable tr td:first-child {
  font-weight: bold;
}
/*-------------------------------
  共通パーツ：関連リンク
---------------------------------*/
.rerated-link {
  width: min(90%, 64rem);
  padding: 0;
  margin: calc(var(--rs) * 4) auto;
  background: var(--color-white);
  box-shadow: 0 1px 6px  0 rgb(0 0 0 / 40%);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.rerated-link > img {
  object-fit: contain;
}
.rerated-link__banner {
  max-width: 40%;
}
.rerated-link__text {
  margin: 0 auto;
  padding: 0 1em;
}
/*-------------------------------
  footer sumika info
---------------------------------*/
#sumikaInfo {
  width: min(94%, 108rem);
  padding: 0.5em 1em;
  margin: 2em auto 0;
  background: #654c45;
  box-shadow: var(--bs-epcmn);
  color: #fff;
  font-family: var(--ff-mincho);
  font-size: calc(var(--rs) * 1.2 + var(--fs) * 1.2);
  font-weight: bold;
  text-align: center;
}

