/*　///// overwrite  /////　*/



.bread__inner.inner {
  width: 95% !important;
  max-width: 1390px !important;
  /* border: #f00 thin solid; */
}



/*　///// grand-header  /////　*/

#grand-header {
  height: 40px;
  margin-bottom: 0;
  background-color: #3c3c41;
  display: flex;
  justify-content: center;
  align-items: center;
}

#grand-header a {
  width: 92px;
}

#grand-header a img {
  width: 100%;
}

.header.miyajiHeader {
  display: none;
}

@media print, screen and (min-width: 1000px) {

  #grand-header {
    height: 60px;
  }

  #grand-header a {
    width: 132px;
  }

}


/*　///// overwrite /////　*/

.bread__inner.inner {
  max-width: 1280px;
}


/*　///// add module /////　*/

.w-98per {
  width: 98%;
}

.w-95per {
  width: 95%;
}


.mw-1280 {
  max-width: 1280px;
}





/*　///// font /////　*/
.noto-serif-jp {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.noto-serif-jp.fw200 {
  font-weight: 200;
  /* border: #f00 thin solid; */
}

.noto-serif-jp.fw300 {
  font-weight: 300;
}

.noto-serif-jp.fw400 {
  font-weight: 400;
}

.noto-serif-jp.fw500 {
  font-weight: 500;
}

.noto-serif-jp.fw600 {
  font-weight: 600;
}

.noto-serif-jp.fw700 {
  font-weight: 700;
}

.noto-serif-jp.fw800 {
  font-weight: 800;
}

.dulcinia {
  font-family: "dulcinea", sans-serif;
  font-weight: 400;
  font-style: normal;
}

@media screen and (min-width: 640px) {

  .nakaguro::after {
    /*・　なかぐろ*/
    content: '\30FB';
    margin-inline: 5px;
  }

}


/*　///// colors /////　*/


/* opacity */

.op03 {
  opacity: 0.3;
}

.op05 {
  opacity: 0.5;
}

.op07 {
  opacity: 0.7;
}

.op08 {
  opacity: 0.8;
}

.op09 {
  opacity: 0.9;
}

.op095 {
  opacity: 0.95;
}


/* font */

.gold {
  color: #c9a961;
}

.gold2 {
  color: #fdeecc;
}

.gold3 {
  color: #806f47;
}

.text-333 {
  color: #333;
}

.text-555 {
  color: #555;
}

.text-666 {
  color: #666;
}

.text-999 {
  color: #999;
}



/* bg */

.beige-1 {
  background-color: #e7e1d4;
}

.beige-2 {
  background-color: #e2d7c5;
}

.beige-3 {
  background-color: #dfd7c4;
}

.bg-gold {
  background-color: #c9a961;
}

.bg-gold3 {
  background-color: #a8820e;
}

.bg-navy {
  background-color: #1a2642;
}

.bg-blue {
  background-color: #002c8a;
}



.bg-eee {
  background-color: #eee;
}


.bg-ddd {
  background-color: #ddd;
}

.bg-aaa {
  background-color: #aaa;
}

.bg-666 {
  background-color: #666;
}

.bg-333 {
  background-color: #333;
}

/* border */


.b-fff-1 {
  border: #fff thin solid;
}

.border-gold-1 {
  border: #806f47 thin solid;
}

.bb-gold-1 {
  border-bottom: #806f47 thin solid;
}

.bb-gold-2 {
  border-bottom: #c9a961 thin solid;
}


.bb-333-1px {
  border-bottom: #333 thin solid;
}


.bb-555-1px {
  border-bottom: #555 thin solid;
}


.bb-666-1px {
  border-bottom: #666 thin solid;
}





/* shadow */


.shadow {
  box-shadow: 0 27px 10px rgb(0 0 0 / 17%);
}










/*　///// title /////　*/


#title {

  & .bg-pc {
    display: none;
  }

}


#title .inside {

  & .pc {
    display: none;
  }

  & .mv-pc {
    display: none;
  }

  & .subtitle {
    width: 90%;
    max-width: 800px;
    margin-inline: auto;
    position: absolute;
    top: 4%;
    left: 6.8%;
    z-index: 2;
    /* border: #f00 thin solid; */
  }

  & h1 {
    width: 85%;
    /* max-width: 724px; */
    max-width: 760px;
    position: absolute;
    top: 9.5%;
    left: 7%;
    z-index: 2;
  }


  & .date {
    width: 32%;
    max-width: 280px;
    aspect-ratio: 1 / 1;
    position: absolute;
    /* top: 35%; */
    top: 30%;
    right: 2.2%;
    z-index: 2;
  }


  & .en {
    width: 83%;
    max-width: 744px;
    position: absolute;
    /* bottom: 5%; */
    top: 60%;
    right: 2%;
    z-index: 2;
  }

}

@media screen and (min-width: 900px) and (max-width: 1920px) {
  #title {
    aspect-ratio: 1920 / 780;
  }
}

@media screen and (min-width: 900px) {


  #title {
    width: 100%;
    /* max-width: 1920px; */
    margin-inline: auto;
    max-height: 780px;

    background: url(../img/pc/bg_title_pc.jpg) no-repeat top center;
    background-size: cover;
  }

  #title .inside {
    width: 74%;
    max-width: 1390px;
    height: 100%;
    margin-inline: auto;
    background: none;
    /* border: #f00 thin solid; */
  }

  #title .inside {

    & .pc {
      display: block;
    }

    & .mv-pc {
      width: 50%;
      max-width: 694px;
      height: 100%;
      aspect-ratio: 694 / 780;
      /* object-fit: cover; */
      display: block;
    }

    & .mob {
      display: none;
    }

    & .mv-mob {
      display: none;
    }

    & .subtitle {
      width: 48%;
      max-width: 640px;
      margin-inline: 0;
      position: absolute;
      top: 10%;
      left: 41.7%;
      z-index: 2;
    }

    & h1 {
      width: 60%;
      max-width: 818px;
      position: absolute;
      top: 21%;
      left: auto;
      right: 0;
      z-index: 2;
    }


    & .date {
      width: 52.5%;
      max-width: 723px;
      position: absolute;
      left: 33%;
      top: 55%;
      right: auto;
      z-index: 2;
    }


    & .en {
      width: 16.54%;
      max-width: 230px;
      aspect-ratio: 1 / 1;
      position: absolute;
      top: auto;
      bottom: 2%;
      right: 0;
      z-index: 2;
    }

  }

}


@media screen and (min-width: 1500px) {


  #title .inside {

    & .date {
      width: 52.5%;
      max-width: 723px;
      position: absolute;
      left: 33%;
      top: 52%;
      right: auto;
      z-index: 2;
    }

  }


}


/*　///// contents /////　*/


.contents {

  & .ttl-line {
    font-family: "dulcinea", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: clamp(34px, 34px + 1vw, 50px);
    letter-spacing: 2px;
    position: relative;
  }

  & .ttl-line.jp {
    font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-weight: 400;
    /* font-size: 34px; */
    font-size: clamp(18px, 22px + 0.5vw, 50px);
    letter-spacing: 2px;
  }



  & .ttl-line::before,
  & .ttl-line::after {
    position: absolute;
    top: 50%;
    width: 15%;
    height: 1px;
    background-color: #fff;
    content: '';
  }


  @media screen and (max-width:899px) {

    & .ttl-line.jp::before,
    & .ttl-line.jp::after {
      position: absolute;
      top: 50%;
      width: 15%;
      height: 1px;
      background-color: #fff;
      content: '';
    }

  }



  & .ttl-line::before {
    left: 0;
  }

  & .ttl-line::after {
    right: 0;
  }



  /* info */
  & #info,
  & #inquiry {

    & .ttl-line {
      color: #c9a961;
    }

    & .ttl-line::before,
    & .ttl-line::after {
      background-color: #c9a961;
    }

  }

  /* end info */



  /* program */
  & #program,
  & #profile {

    & .ttl-line {
      color: #bbab86;
    }

    & .ttl-line::before,
    & .ttl-line::after {
      background-color: #806f47;
    }

    & .composer {
      width: 50%;
      max-width: 300px;
      margin-inline: auto;
      margin-bottom: 15px;
      padding: 2px 0 3px;
      /* color: #e9ca84; */
      color: #bbab86;
      border-bottom: #806f47 thin solid;
      border-top: #806f47 thin solid;
      display: inline-block;
    }

  }

  /* end program */
}



@media screen and (min-width: 900px) {

  .contents {

    & .ttl-line::before,
    & .ttl-line::after {
      position: absolute;
      top: 50%;
      width: 12%;
      height: 1px;
      content: '';
    }


    & #program {

      & .composer {
        font-size: 18px;
      }

    }


  }

}

@media screen and (min-width: 1024px) {

  .contents {

    & .ttl-line::before,
    & .ttl-line::after {
      position: absolute;
      top: 50%;
      width: 30%;
      height: 1px;
      content: '';
    }
  }

}



/*　///// program /////　*/

#program {
  position: relative;
}



/*　///// info /////　*/

/* info */


/* #info-outer {
  background: linear-gradient(to bottom, #eee 0, #fff 2%, #fff 100%);
} */

#info {
  font-size: 14px;
  font-weight: 500;
  text-align: center;

}

#info .bg-yellow-ttl {
  width: 230px;
  line-height: 1.5;
  color: #fff;
  background-color: #a8820e;
  font-size: 18px;
  letter-spacing: 0;
  display: inline-block;
}



@media screen and (min-width: 900px) {
  /* #info-outer {
    background: linear-gradient(to bottom, #ddd 0, #fff 2%, #fff 100%);
  } */

}

/*=============================
	access
===============================*/


#access h2 {
  font-size: clamp(18px, 22px + 0.5vw, 50px);
}


#access h3 {
  font-size: clamp(20px, 20px + 0.5vw, 50px);
}

.mapbox iframe {
  width: 100%;
  /* height: 360px; */
  aspect-ratio: 3 / 4;
}

@media screen and (min-width: 1000px) {


  .mapbox iframe {
    width: 100%;
    /* height: 600px; */
    aspect-ratio: 16 / 9;
  }



}




/*=============================
	sns_iconbox
===============================*/


.sns_iconbox {
  /* width: min(1280px, 100% - 2rem); */
  width: min(1280px, 100% - 2.5%);
  margin-inline: auto;
}

.sns_iconbox {

  & h4 {
    padding: 1em;
    border-top: #555 thin solid;
    border-bottom: #555 thin solid;

  }

}

.sns_iconbox ul {
  display: flex;
  justify-content: center;
  align-items: center;
}

.sns_iconbox li {
  width: 40px;
  margin: 0 10px;
}




/*=============================
	advance_notice
===============================*/

.advance_notice {
  font-size: 1.4rem;
  text-align: center;
  background: #fff;
  padding: 10em 0 5em;
}

.advance_notice p {
  margin-bottom: 1em;
}