@charset "UTF-8";

/*-- common ----------------------------------------------------------------*/
/*font*/
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');

/*側*/
body { font-family: "Noto Sans", sans-serif; line-height: 1.8; color: #333; }

.contentsInner { width: 1100px; margin: 60px auto 0; }
.contentsInner p + p { margin-top: 30px; }

.sec { padding: 100px 0 120px; }

.inner { margin-top: 80px; }

/*見出し*/
.sec h2 { text-align: center; }
.sec h2 span.en { font-size: 480%; font-family: "Jost", sans-serif; font-weight: 400; line-height: 1.3; }
.sec h2 span.jp { font-size: 90%; font-weight: normal; position: relative; display: flex; align-items: center; justify-content: center; }
.sec h2 span.jp::before { content: ""; width: 10px; height: 1px; background-color: #000; margin-right: 20px; }
.sec h2 span.jp::after { content: ""; width: 10px; height: 1px; background-color: #000; margin-left: 20px; }

.head2 { margin: 65px 0 30px; }
.head2 span.en { font-size: 340%; font-family: "Jost", sans-serif; font-weight: 200; line-height: 1.2; }
.head2 span.jp { font-size: 90%; font-weight: normal; }

.head3 { font-size: 140%; margin-bottom: 40px; font-weight: 500; }

.head4 { font-size: 125%; margin-bottom: 25px; font-weight: 500; }

/*背景色*/
.bgGray { background: #f5f5f5; }

/*リンク*/
a { text-decoration: none; color: #000; transition: color .2s; }
.iconWin { position: relative; }
.iconWin::after { position: absolute; right: -20px; top: 50%; transform: translateY(-50%); content: ""; display: block; width: 16px; height: 16px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 4H20V13H8V4Z' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M5 9V17H14' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0 top 0; background-size: 16px 16px; }

@media (hover: hover) {
  a:hover { color: #003dad; }
}

/*注釈*/
.atComment { font-size: 90%; padding-left: 1em; text-indent: -1em; }

/*PC時*/
@media (min-width: 768px) {

  /*テーブル幅*/
  .w200 { width: 200px; }
  .w250 { width: 250px; }
  .w300 { width: 300px; }
  .w350 { width: 350px; }
  .w400 { width: 400px; }
  .w450 { width: 450px; }
  .w500 { width: 500px; }

  .spBr { display: none; }

}

/*PC時 1200px以下*/
@media (max-width: 1200px) {
  
  /*側*/
  .contentsInner { width: 90%; margin: 60px auto 0; }
  
}

/*SP時*/
@media (max-width: 767px) {

  img { max-width: 100%; }
  .contentsInner { width: 85%; margin: 0 auto; }
  .contentsInner p { font-size: 87%; }
  .contentsInner p + p { margin-top: 20px; }

  .sec { padding: 35px 0 55px; }
  .sec h2 span.en { font-size: 250%; }
  .sec h2 span.jp { font-size: 56%; }
  .sec h2 span.jp::before { width: 6px; margin-right: 10px; }
  .sec h2 span.jp::after { width: 6px; margin-left: 10px; }

  .inner { margin-top: 35px; }

  .head2 { margin: 30px 0 20px; }
  .head2 span.en { font-size: 163%; }
  .head2 span.jp { font-size: 56%; }

  .head3 { font-size: 100%; margin-bottom: 10px; }

  .head4 { font-size: 100%; margin-bottom: 10px; }
  
  .iconWin::after { width: 10px; height: 10px; background-size: 12px 12px; right: -23px; }
  
  .contentsInner p.atComment { font-size: 75%; }

}

/*-- 動き --------------------------------------------------------------------*/
.fadeUp { opacity: 0; }

.fadeUp.onInview { animation: fadeUp 1s 1 cubic-bezier(0.55, 0.1, 0.56, 1.12) forwards; }

@keyframes fadeUp {
  0% { opacity: 0; transform: translateY(30px); }
  100%, to { opacity: 1; transform: translateY(0); }
}

/*-- MV --------------------------------------------------------------------*/
#mvSec #mvArea { position: relative; overflow: hidden; }
#mvSec #mvArea::after { position: absolute; left: 0; top: 0; display: block; content: ""; width: 100%; height: 100%; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 36%); background-size: cover; background-position: center; }

/*Ticketボタン*/
#mvSec #mvArea .ticketBox { position: absolute; top: 16px; right: 0; z-index: 10; animation: slideInRight 0.8s ease-out forwards; visibility: hidden; }
#mvSec #mvArea .ticketBox p { border-right: 3.8px dotted #b2b2b2; padding: 8px 14px 8px 0; position: relative; transition: border .3s; }
#mvSec #mvArea .ticketBox p::after { content: ""; position: absolute; right: -30px; top: 47%; width: 8px; height: 8px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: translateY(-50%) rotate(45deg); transition: border .3s; }
#mvSec #mvArea .ticketBox a { color: #fff; text-decoration: none; font-size: 82%; background: rgba(0,0,0,0.8); display: block; padding: 0 40px 0 20px; border: 1px solid #fff; border-right: none; transition: all .3s; }
#mvSec #mvArea .ticketBox a span { font-size: 160%; margin-right: 5px; display: inline-block; font-family: "Jost", sans-serif; font-weight: 300; }

@keyframes slideInRight {
  0% { visibility: visible; transform: translateX(150%); }
  100% { visibility: visible; transform: translateX(0); }
}

@media (hover: hover) {
  #mvSec #mvArea .ticketBox a:hover { color: #000; background: rgba(255,255,255,0.9); border-color: #777; }
  #mvSec #mvArea .ticketBox a:hover p { border-color: #777; }
  #mvSec #mvArea .ticketBox a:hover p::after { border-color: #000; }
}

/*タイトル*/
#mvSec #mvArea .txtInner { color: #fff; position: absolute; bottom: 20px; left: 35px; z-index: 11; }
#mvSec #mvArea .txtInner .f1 { font-size: 120%; font-weight: 500; }
#mvSec #mvArea .txtInner .f2 { font-size: 90%; }
#mvSec #mvArea .txtInner h1 { font-size: 380%; line-height: 1.2; font-weight: 500; font-family: "Noto Serif", serif; margin-top: 5px; }

/*画像*/
#mvSec #mvArea .imgInner { width: 100%; }
#mvSec #mvArea .imgInner img { width: 100%; }


/*PC時 1400px以下*/
@media (max-width: 1400px) {
  
  /*画像*/
  #mvSec #mvArea .imgInner { overflow: hidden; }
  #mvSec #mvArea .imgInner img { width: max(100%, 1400px); max-width: none; display: block; position: relative; left: 50%; transform: translateX(-50%);  }
  
}

/*SP時*/
@media (max-width: 767px) {

  /*Ticketボタン*/
  #mvSec #mvArea .ticketBox p { text-align: center; padding: 3px 4px 5px 0; }
  #mvSec #mvArea .ticketBox p::after { right: -20px; width: 6px; height: 6px; }
  #mvSec #mvArea .ticketBox a { font-size: 56%; line-height: 1.2; border-color: #e5e5e5; padding: 0 25px 0 10px; }
  #mvSec #mvArea .ticketBox a span { display: block; margin-right: 0; }

  /*タイトル*/
  #mvSec #mvArea .txtInner { bottom: 10px; left: 20px; right: 20px; }
  #mvSec #mvArea .txtInner .f1 { font-size: 88%; }
  #mvSec #mvArea .txtInner .f2 { font-size: 82%; line-height: 1.6; }
  #mvSec #mvArea .txtInner h1 { font-size: 175%; margin-top: 12px; }
  
  /*画像*/
  #mvSec #mvArea .imgInner img { width: calc(100% + 2px); }
}

/*-- anchor ------------------------------------------------------------------*/
#linkSec { text-align: center; margin-top: 40px; position: absolute; left: 0; right: 0; }

/*ロゴ*/
#linkSec .logoBox { width: 240px; display: inline-block; }
#linkSec .logoBox img { width: 100%; }

/*ハンバーガーメニュー*/
#linkSec .spMenuBtn,
.spMenuBg { display: none; }

/*リンク*/
#linkSec .linkList { display: flex; justify-content: center; align-items: center; margin-top: 20px; }
#linkSec .linkList li { border-left: 1px solid #333; line-height: 1; }
#linkSec .linkList li:nth-child(1) { border: none; }
#linkSec .linkList a { text-decoration: none; color: #000; font-size: 90%; padding: 0 15px 2px; display: inline-block; transition: color .2s; }

@media (hover: hover) {
  /*リンク*/
  #linkSec .linkList a:hover { color: #999; }
}

/*固定時*/
#mvSec.linkTop #mvArea .txtInner h1 { position: fixed; color: #000; top: 24px; left: 240px; margin: 0; font-size: 175%; opacity: 0; animation: fadeIn 0.5s 1 cubic-bezier(0.55, 0.1, 0.56, 1.12) forwards; }

#linkSec.linkTop { opacity: 0; animation: fadeIn 0.5s 1 cubic-bezier(0.55, 0.1, 0.56, 1.12) forwards; height: 33px; position: fixed; top: 0; margin: 0 auto; background-color: #fff; padding: 22px 0 22px 20px; display: flex; justify-content: space-between; z-index: 10; }
#linkSec.linkTop .logoBox { width: 195px; position: absolute; left: 20px; }
#linkSec.linkTop .linkList { margin-top: 0; z-index: 1; }
#linkSec.linkTop .linkList a { padding: 0 20px; }

#linkSec::before { content: ""; background-color: #fff; opacity: 0; height: 77px; width: 100%; display: block; transition: opacity 1s; position: fixed; top: 0; left: 0; pointer-events: none; }
#linkSec.linkTop::before { opacity: 1; pointer-events: initial; }

@keyframes fadeIn {
  0% { opacity: 0; }
  100%, to { opacity: 1; }
}

@media (max-width: 951px) {

  #mvSec.linkTop #mvArea .txtInner h1 { font-size: 2.8vw; top: 24px; left: 24vw; }
  #linkSec.linkTop .logoBox { width: 20.5vw; }
  #linkSec.linkTop .linkList a { padding: 0 1.5vw; }

}

/*SP時*/
@media (max-width: 767px) {

  #linkSec { margin-top: 25px; }

  /*ロゴ*/
  #linkSec .logoBox { width: 215px; }

  /*リンク*/
  #linkSec .linkList { margin-top: 25px; }
  #linkSec .linkList a { padding: 0 9px 2px; }
  #linkSec.linkTop { background: none; }
  #linkSec::before { width: 42px; height: 42px; right: 2.5%; top: 10px; left: auto; background-color: #000; }
  
  /*ハンバーガーメニュー*/
  #linkSec.linkTop #spMenuBtn { display: block; position: absolute; width: 42px; height: 42px; right: 2.5%; top: 10px; cursor: pointer; background-color: #000; border: solid 1px #fff; }
  #linkSec.linkTop #spMenuBtn span,
  #linkSec.linkTop #spMenuBtn::before,
  #linkSec.linkTop #spMenuBtn::after { display: block; width: 22px; height: 1px; background-color: #fff; position: absolute; left: 10px; right: 10px; transition: all .4s; }
  #linkSec.linkTop #spMenuBtn span { top: 50%; }
  #linkSec.linkTop #spMenuBtn::before,
  #linkSec.linkTop #spMenuBtn::after { content: ""; }
  #linkSec.linkTop #spMenuBtn::before { top: 10px; }
  #linkSec.linkTop #spMenuBtn::after { bottom: 10px; }
  #mvSec.linkTop #mvArea .txtInner h1,
  #linkSec.linkTop .logoBox,
  #linkSec.linkTop .linkList { display: none; }

  #spMenuBg { display: none; position: fixed; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; background-color: #050504; opacity: 0.7; z-index: 5; }

  /*ナビ*/
  .naviOn #linkSec.linkTop #spMenuBtn span { opacity: 0; }
  .naviOn #linkSec.linkTop #spMenuBtn::before { top: 15px; transform: translateY(6px) rotate(-45deg); }
  .naviOn #linkSec.linkTop #spMenuBtn::after { bottom: 15px; transform: translateY(-6px) rotate(45deg); }
  .naviOn #spMenuBg { display: block; }
  .naviOn #linkSec.linkTop { padding: 80px 0 0; }
  .naviOn #linkSec.linkTop .linkList { display: block; width: 80%; margin: 0 auto; }
  .naviOn #linkSec.linkTop .linkList li { border: none; }
  .naviOn #linkSec.linkTop .linkList a { color: #fff; font-size: 100%; padding: 22px 20px; border-bottom: solid 1px #999; display: block; }

}

/*-- Introduction ----------------------------------------------------------*/

#introSec.sec { padding-top: 40px; margin-top: 120px; }
#introSec h2 + p { margin-top: 50px; }

/*SP時*/
@media (max-width: 767px) {
  #introSec h2 + p { margin-top: 20px; }
}


/*-- Overview --------------------------------------------------------------*/

#overviewSec .contentsInner { margin-top: 20px; }
#overviewSec p + p { margin-top: 0; }

@media (max-width: 767px) {
  #overviewSec .contentsInner { margin-top: 12px; }
  #overviewSec h3 { line-height: 0.7; }
}

/*story*/
#overviewSec #storyArea h3 { margin-top: 0; }

/*Schedule*/
#overviewSec #scheduleArea .whiteBg { background: #fff; padding: 35px 60px; }

#overviewSec #scheduleArea .timeBox { margin-top: 25px; }
#overviewSec #scheduleArea .timeBox.whiteBg { padding-top: 10px; padding-bottom: 10px; }

#overviewSec #scheduleArea dl { display: grid; grid-template-columns: 6em 1fr; padding: 25px 0; }
#overviewSec #scheduleArea dl + dl { border-top: 1px solid #d9d9d9; }

#overviewSec #scheduleArea dl dt { background: #f5f5f5; color: #555; text-align: center; padding: 10px 0; display: flex; justify-content: center; align-items: center; }
#overviewSec #scheduleArea dl dd { margin-top: 30px 0; display: flex; align-items: center;}
#overviewSec #scheduleArea dl dd > * { margin-left: 30px; }

#overviewSec #scheduleArea dl dd ul { width: 100%; }
#overviewSec #scheduleArea dl dd ul li { padding: 20px 0; border-top: 1px dashed #cccccc; width: 100%; }
#overviewSec #scheduleArea dl dd ul li:first-child { border: none; padding-top: 0; }
#overviewSec #scheduleArea dl dd ul li:last-child { padding-bottom: 0; }
#overviewSec #scheduleArea dl dd ul li .dayInfo { font-weight: 600; font-size: 110%; }

#overviewSec #scheduleArea dl.place dd a { text-decoration: none; font-size: 180%; line-height: 1.2; }

@media (max-width: 767px) {
  #overviewSec #scheduleArea .whiteBg { padding: 0 15px; }
  #overviewSec #scheduleArea dl { display: block; padding: 20px 0 10px; }
  #overviewSec #scheduleArea dl + dl { border-top: none; padding-top: 0; }
  #overviewSec #scheduleArea dl dt { font-size: 88%; padding: 4px 0; }
  #overviewSec #scheduleArea dl dd > * { margin: 10px 5px 0; }
  #overviewSec #scheduleArea dl.place dd a { font-size: 129%; }
  #overviewSec #scheduleArea dl dd ul li { padding: 10px 0; }
  #overviewSec #scheduleArea dl dd ul li .dayInfo { font-size: 93%; }
  #overviewSec #scheduleArea .timeBox { margin-top: 15px; }
  #overviewSec #scheduleArea .timeBox dl { padding: 5px 0; }
}

/*Flyer*/
#overviewSec #flyerArea .flyerList { display: grid; grid-template-columns: repeat(4, 1fr); gap: 45px; }
#overviewSec #flyerArea .flyerList img { width: 100%; transition: opacity .5s; }
#overviewSec #flyerArea .pdfLink { margin-top: 30px; }

@media (hover: hover) {
  #overviewSec #flyerArea .flyerList a:hover img { opacity: 0.7; }
}

@media (max-width: 767px) {
  #overviewSec #flyerArea .flyerList { grid-template-columns: repeat(2, 1fr); gap: 25px; }
  #overviewSec #flyerArea .pdfLink { margin-top: 15px; }
}

/*Ticket*/
#overviewSec #ticketArea .ticketInner { padding-bottom: 40px; }

#overviewSec #ticketArea #priceInner .day { font-size: 112.5%; }
#overviewSec #ticketArea #priceInner table { width: 100%; border-left: 1px solid #ccc; border-top: 1px solid #ccc; margin: 10px 0; width: 100%; table-layout: fixed; border-collapse: collapse; }
#overviewSec #ticketArea #priceInner table th,
#overviewSec #ticketArea #priceInner table td { border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; text-align: center; padding: 20px 5px; overflow: hidden; }
#overviewSec #ticketArea #priceInner table th { background: #f5f5f5; font-weight: normal; }
#overviewSec #ticketArea #priceInner table th:nth-child(1) { background: #ececec; }
#overviewSec #ticketArea #priceInner table th:last-child,
#overviewSec #ticketArea #priceInner table td:last-child { width: 240px; }

#overviewSec #ticketArea #salesInner .salesList { display: grid; grid-template-columns: repeat(2, 1fr); gap: 45px; }
#overviewSec #ticketArea #salesInner .salesList li { border: 1px solid #ccc; position: relative; box-shadow: 3px 3px 1px 1px rgba(0, 0, 0, .06); font-weight: normal; }
#overviewSec #ticketArea #salesInner .salesList li h5 { font-weight: normal; font-size: 112.5%; }
#overviewSec #ticketArea #salesInner .salesList li:not(.noLink) a,
#overviewSec #ticketArea #salesInner .salesList li.noLink > div { background: #fff; text-align: left;  display: flex; align-items: center; justify-content: flex-start; padding: 20px 30px; min-height: 7em; transition: all .3s; height: 100%; box-sizing: border-box; }
#overviewSec #ticketArea #salesInner .salesList li:not(.noLink) a .txtBox { width: 76%; }
#overviewSec #ticketArea #salesInner .salesList li:not(.noLink)::before { position: absolute; content: ""; right: 110px; top: 0; height: 100%; display: block; border-right: 3px dotted #d3d3d3; pointer-events: none; }
#overviewSec #ticketArea #salesInner .salesList li:not(.noLink)::after { content: "購入は\Aこちら"; line-height: 1.4; white-space: pre; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 80px; height: auto; pointer-events: none; }
#overviewSec #ticketArea #salesInner .salesList li:not(.noLink)::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 4H20V13H8V4Z' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M5 9V17H14' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px top 97%; background-size: 16px 16px; }

#overviewSec #ticketArea #contactInner .telBox { padding: 20px 0; border-top: 1px dashed #cccccc; border-bottom: 1px dashed #cccccc; }
#overviewSec #ticketArea #contactInner .telBox span { font-size: 125%; font-weight: 500; display: inline-block; margin: 0 10px; }

@media (hover: hover) {
  #overviewSec #ticketArea #salesInner .salesList li:not(.noLink) a:hover { background: #eef4fb;}
}

@media (max-width: 767px) {
  #overviewSec #ticketArea .ticketInner { padding-bottom: 20px; }
  #overviewSec #ticketArea .ticketInner .head4 { line-height: 0.7; }

  #overviewSec #ticketArea #priceInner .day { font-size: 88%; }
  #overviewSec #ticketArea #priceInner table tbody { display: flex; }
  #overviewSec #ticketArea #priceInner table tr { width: 60%; display: flex; flex-direction: column; }
  #overviewSec #ticketArea #priceInner table tr + tr { width: 40%; }
  #overviewSec #ticketArea #priceInner table th,
  #overviewSec #ticketArea #priceInner table td { display: block; font-size: 88%; padding: 5px 0; }
  #overviewSec #ticketArea #priceInner table th:last-child,
  #overviewSec #ticketArea #priceInner table td:last-child { width: auto; flex: 1; display: flex; align-items: center; justify-content: center; }

  #overviewSec #ticketArea #salesInner { margin-top: 15px; }
  #overviewSec #ticketArea #salesInner .salesList { display: block; }

  #overviewSec #ticketArea #salesInner .salesList li:nth-child(n+2) { margin-top: 10px; }
  #overviewSec #ticketArea #salesInner .salesList li h5 { font-size: 94%; }
  #overviewSec #ticketArea #salesInner .salesList li:not(.noLink) a,
  #overviewSec #ticketArea #salesInner .salesList li.noLink > div { padding: 10px 15px; min-height: 5em; }
  #overviewSec #ticketArea #salesInner .salesList li:not(.noLink)::before { right: 90px; }
  #overviewSec #ticketArea #salesInner .salesList li:not(.noLink)::after { font-size: 75%; width: 65px; background-size: 12px 13px; }

  #overviewSec #ticketArea #contactInner { margin-top: 15px; }
  #overviewSec #ticketArea #contactInner .telBox { padding: 10px 0; line-height: 1.6; }
  #overviewSec #ticketArea #contactInner .telBox span { font-size: 115%; margin: 0; }
}

/*Cast*/
#overviewSec #castArea .castList { padding: 60px 0; border-top: 1px dashed #cccccc; }
#overviewSec #castArea .castList:nth-of-type(1) { padding-top: 20px; border: none; }

#overviewSec #castArea .castList ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 35px 45px; }
#overviewSec #castArea .castList ul li img { width: 100%; margin-bottom: 10px; }
#overviewSec #castArea .castList ul li .shoulderBox { font-size: 90%; }
#overviewSec #castArea .castList ul li .nameBox { font-size: 120%; line-height: 1.4; }

#overviewSec #castArea .castList.noImg ul { grid-template-columns: repeat(2, 1fr); gap: 45px; }
#overviewSec #castArea .castList.noImg ul li { background: #fff; text-align: center; display: flex; align-items: center; justify-content: center; padding: 20px; min-height: 4em; font-size: 112.5%; }

#overviewSec #castArea .infoBox { padding: 60px 0; border-top: 1px dashed #cccccc; }
#overviewSec #castArea .infoBox .infoImg { margin-bottom: 20px; }
#overviewSec #castArea .infoBox .infoImg img { width: 100%; }
#overviewSec #castArea .infoBox .head4 { margin-bottom: 15px; }
#overviewSec #castArea .infoBox p + .head4 { margin-top: 50px; }

/*PC時 950px以下*/
@media (max-width: 950px) {
  #overviewSec #castArea .castList ul { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  #overviewSec #castArea .castList { padding: 30px 0; }
  #overviewSec #castArea .castList:nth-of-type(1) { padding-top: 0; }
  #overviewSec #castArea .castList ul { grid-template-columns: repeat(2, 1fr); gap: 12px 30px; }
  #overviewSec #castArea .castList ul li .shoulderBox { font-size: 63%; }
  #overviewSec #castArea .castList ul li .nameBox { font-size: 94%; }
  #overviewSec #castArea .castList.noImg ul { display: block; }
  #overviewSec #castArea .castList.noImg ul li { font-size: 88%; padding: 10px; min-height: 3.2em; }
  #overviewSec #castArea .castList.noImg ul li:nth-child(n+2) { margin-top: 10px; }

  #overviewSec #castArea .infoBox { padding: 30px 0; }
  #overviewSec #castArea .infoBox .infoImg { margin-bottom: 15px; }
  #overviewSec #castArea .infoBox .head4 { margin-bottom: 10px; }
  #overviewSec #castArea .infoBox p + .head4 { margin-top: 30px; }
}

/*Organizer*/
#overviewSec #organizerArea .organizerList { border-top: 1px dashed #cccccc; }
#overviewSec #organizerArea .organizerList li { padding: 35px 0; border-bottom: 1px dashed #cccccc; }
#overviewSec #organizerArea .organizerList li .shoulderBox { color: #666; }
#overviewSec #organizerArea .organizerList li .nameBox { font-size: 112.5%; }
#overviewSec #organizerArea .organizerList li .nameBox span { font-size: 90%; color: #666; margin-right: 15px; display: inline-block; }
#overviewSec #organizerArea .organizerList li .infoBox { margin-top: 10px; }

#overviewSec #organizerArea .organizerList li.organizerItem { display: flex; }
#overviewSec #organizerArea .organizerList li.organizerItem .imgInner { width: 36%; }
#overviewSec #organizerArea .organizerList li.organizerItem .imgInner > div { margin-bottom: 10px; }
#overviewSec #organizerArea .organizerList li.organizerItem .imgInner img { background-color: #fff; width: 100%; padding: 32px 30px; box-sizing: border-box; }
#overviewSec #organizerArea .organizerList li.organizerItem .textInner { flex: 1; margin-left: 38px; }
#overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList { margin-top: 25px; display: flex; }
#overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList li { padding: 0; border-bottom: none; }
#overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList li:nth-child(n+2) { margin-left: 25px; }

@media (max-width: 767px) {
  #overviewSec #organizerArea .organizerList li { padding: 25px 0; }
  #overviewSec #organizerArea .organizerList li .shoulderBox { font-size: 82%; }
  #overviewSec #organizerArea .organizerList li .nameBox { font-size: 94%; }
  #overviewSec #organizerArea .organizerList li .nameBox span { font-size: 86%; }
  #overviewSec #organizerArea .organizerList li.organizerItem { display: block; }
  #overviewSec #organizerArea .organizerList li.organizerItem .imgInner { width: 100%; }
  #overviewSec #organizerArea .organizerList li.organizerItem .imgInner img { padding: 15px; }
  #overviewSec #organizerArea .organizerList li.organizerItem .textInner { margin: 10px 0 0; }

  #overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList { margin-top: 15px; }
  #overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList li { width: 40px; }
  #overviewSec #organizerArea .organizerList li.organizerItem .textInner .snsList li:nth-child(n+2) { margin-left: 20px; }
}

/*SNS*/
#overviewSec #snsArea ul { display: flex; margin-top: 20px; }
#overviewSec #snsArea ul li { width: 54px; }
#overviewSec #snsArea ul li:nth-child(n+2) { margin-left: 20px; }
#overviewSec #snsArea ul li img { width: 100%; }
#overviewSec #snsArea ul li a { transition: all .3s; }

@media (hover: hover) {
  #overviewSec #snsArea ul li a:hover { opacity: 0.5; }
}

@media (max-width: 767px) {
  #overviewSec #snsArea ul { margin-top: 12px; }
  #overviewSec #snsArea ul li { width: 40px; }
}

/*-- EOS -------------------------------------------------------------------*/

#eocSec #eocCreditArea,
#eocSec #inqueryArea { text-align: center; }

#eocSec .inner { border-top: 1px dashed #cccccc; padding-top: 60px; margin-top: 60px; }
#eocSec p + p { margin-top: 0; }

/*クレジット*/
#eocSec #eocCreditArea dl dd + dt { margin-top: 20px; }
#eocSec #eocCreditArea dl dd p { font-size: 112.5%; font-weight: 500; }
#eocSec #eocCreditArea dl dd ul { font-size: 90%; }

/*お問い合わせ先*/
#eocSec #inqueryArea .nameBox { margin-top: 5px; }
#eocSec #inqueryArea .telBox { font-size: 140%; font-weight: 500; }
#eocSec #inqueryArea .timeBox { font-size: 90%; }

/*注意事項*/
#eocSec #attentionArea h3 { font-size: 125%; }
#eocSec #attentionArea ul { width: 100%; margin-top: 15px; }
#eocSec #attentionArea ul li { padding-left: 20px; position: relative; font-size: 90%; margin: 10px 0; }
#eocSec #attentionArea ul li::before { position: absolute; left: 0; top: 2em; content: "●"; font-size: 34%}

/*SP時*/
@media (max-width: 767px) {

  #eocSec { padding-top: 50px; }

  /*クレジット*/
  #eocSec #eocCreditArea dl { font-size: 88%; }
  #eocSec #eocCreditArea dl dd + dt { margin-top: 10px; }
  #eocSec .inner { margin-top: 25px; padding-top: 25px; }

  /*お問い合わせ先*/
  #eocSec #inqueryArea h3 { font-size: 88%; }
  #eocSec #inqueryArea .nameBox { margin-top: 0; font-size: 81%; }
  #eocSec #inqueryArea .telBox { font-size: 131%; }
  #eocSec #inqueryArea .timeBox { font-size: 75%; }

  /*注意事項*/
  #eocSec #attentionArea h3 { font-size: 100%; }
  #eocSec #attentionArea { padding-top: 20px; }
  #eocSec #attentionArea ul { margin-top: 12px; }
  #eocSec #attentionArea ul li { font-size: 69%; padding-left: 15px; }

}

/*-- footer ----------------------------------------------------------------*/

#footerSec { background: #000; display: flex; align-items: center; justify-content: space-between; padding: 20px; color: #fff; font-weight: 300; margin-top: 150px; position: relative; }

/*ページトップボタン*/
#footerSec #pageTopBtn { position: fixed; right: 20px; bottom: 20px; width: 55px; opacity: 0; visibility: hidden; transition: opacity 0.3s ease; }
#footerSec #pageTopBtn.active { opacity: 1; visibility: visible; }
#footerSec #pageTopBtn.footerSet { position: absolute; bottom: 130px; }
#footerSec #pageTopBtn img { width: 100%; }

/*法人情報*/
#footerSec #companyArea a { display: flex; font-weight: 400; align-items: center; color: #fff; transition: all .3s; }
#footerSec #companyArea .logoBox { width: 40px; }
#footerSec #companyArea .logoBox img { width: 100%; }
#footerSec #companyArea .txtBox { margin-left: 20px; }
#footerSec #companyArea .txtBox h2 { font-weight: 400; }
#footerSec #companyArea .txtBox p { font-size: 70%; }

/*コピーライト*/
#footerSec small { font-size: 80%; }

@media (hover: hover) {
  #footerSec #companyArea a:hover { color: #888; }
}

/*PC時 1000px以下*/
@media (max-width: 1000px) {
  
  #footerSec { justify-content: center; flex-wrap: wrap; }
  
  /*コピーライト*/
  #footerSec small { margin-top: 20px; display: block; text-align: center; width: 100%; }
  
}

/*SP時*/
@media (max-width: 767px) {

  #footerSec { margin-top: 80px; padding: 15px 20px; }

  /*法人情報*/
  #footerSec #companyArea { width: 100%; }
  #footerSec #companyArea .logoBox { width: 30px; }
  #footerSec #companyArea .txtBox { margin-left: 15px; flex: 1; }
  #footerSec #companyArea .txtBox h2 { font-size: 81%; line-height: 1.2; }
  #footerSec #companyArea .txtBox p { font-size: 63%; }

  /*コピーライト*/
  #footerSec small { font-size: 50%; margin-top: 10px; }

  /*ページトップボタン*/
  #footerSec #pageTopBtn { width: 40px; right: 14px; bottom: 14px; }
  #footerSec #pageTopBtn.footerSet { bottom: 115px; }
}