@charset "utf-8";
/*************************************************************
 *
 * Copyright (c) 2025 ysrock Co., Ltd.	<info@ysrock.co.jp>
 * Copyright (c) 2025 Yasuo Sugano	<sugano@ysrock.co.jp>
 *
 * Version	: 1.0.2
 * Update	  : 2025.06.17
 *
 *************************************************************/


/**
 * カルーセル
 */
#photos {
  position: sticky;
  z-index: 0;
}
#photos > div.ratio {
  width: 100%;
  overflow: hidden;
}
#photos > div.ratio > div.ratioWrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #fff;
}

#photos > div.ratio > div.ratioWrap > div.left,
#photos > div.ratio > div.ratioWrap > div.right {
  display: inline-block;
  background-color: rgba(51, 51, 51, .75);
  position: absolute;
  top: 50%;
  z-index: 1;
  transform: translateY(-50%);
  cursor: pointer;
}
#photos > div.ratio > div.ratioWrap > div.left::before,
#photos > div.ratio > div.ratioWrap > div.right::before {
  position: absolute;
  top: 50%;
  font-family: 'ysrock';
  font-weight: bold;
  color: #fff;
}
#photos > div.ratio > div.ratioWrap > div.left::before {
  left: 40%;
  transform: translate(-40%, -50%);
}
#photos > div.ratio > div.ratioWrap > div.right::before {
  left: 60%;
  transform: translate(-60%, -50%);
}

#photos > div.ratio > div.ratioWrap > ul {
  display: flex;
  height: 100%;
  transition: transform .5s;
}
#photos > div.ratio > div.ratioWrap > ul > li {
  min-width: 100%;
}
#photos > div.ratio > div.ratioWrap > ul > li > img {
  width: 100%;
}

@media print, screen and (min-width: 1025px) {
  /* px */

  #photos {
    top: 58px;
  }
  #photos > div.ratio {
    padding-top: 66.6666%;
  }

  #photos > div.ratio > div.ratioWrap > div.left,
  #photos > div.ratio > div.ratioWrap > div.right {
    width: 27px;
    height: 44px;
  }
  #photos > div.ratio > div.ratioWrap > div.left {
    left: 10px;
  }
  #photos > div.ratio > div.ratioWrap > div.right {
    right: 10px;
  }

  #photos > div.ratio > div.ratioWrap > ul {
    padding: 0 25%;
    transform: translateX(-100%);
  }
}
@media screen and (min-width: 641px) and (max-width: 1024px){
	/* px/8.5 */

  #photos {
    top: 6.7915vw;
  }
  #photos > div.ratio {
    padding-top: 66.6666%;
  }

  #photos > div.ratio > div.ratioWrap > div.left,
  #photos > div.ratio > div.ratioWrap > div.right {
    width: 3.1615vw;
    height: 5.1522vw;
  }
  #photos > div.ratio > div.ratioWrap > div.left {
    left: 1.1709vw;
  }
  #photos > div.ratio > div.ratioWrap > div.right {
    right: 1.1709vw;
  }

  #photos > div.ratio > div.ratioWrap > ul {
    padding: 0 25%;
    transform: translateX(-100%);
  }

}
@media screen and (max-width: 640px){
	/* px/4 */

  #photos {
    user-select: none;
    touch-action: pan-y;
  }
  #photos > div.ratio {
    padding-top: 111.1111%;
  }

  #photos > div.ratio > div.ratioWrap > div.left,
  #photos > div.ratio > div.ratioWrap > div.right {
    width: 6vw;
    height: 11vw;
  }
  #photos > div.ratio > div.ratioWrap > div.left {
    left: 2vw;
  }
  #photos > div.ratio > div.ratioWrap > div.right {
    right: 2vw;
  }

  #photos > div.ratio > div.ratioWrap > ul {
    padding: 0 8.3333%;
    transform: translateX(-166.6666%);
  }
  #photos > div.ratio > div.ratioWrap > ul > li > img {
    width: 83.3333vw;
  }
}


/**
 * プロフィール
 */
#main {
  position: relative;
  z-index: 2;
  transform: translateZ(1px);
  background-color: #000;
  text-align: center;
}
#main > *:not(#schedule) * {
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", 'Noto Serif JP', serif;
}
#main > div > pre {
  line-height: 1.5em;
}

#profile > table {
  margin: 0 auto;
  background-color: #000;
}
#profile > table > tbody > tr > * {
  background-color: #f0f0f0;
  color: #666666;
  line-height: 1em;
}

#type > ul::after {
  content: "";
  display: block;
  height: 0;
  visibility: hidden;
  clear: both;
}
#type > ul > li {
  float: left;
  background-color: #f0f0f0;
  border-style: solid;
  border-color: #cccccc;
  color: #666666;
}

#schedule > h3 {
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", 'Noto Serif JP', serif;
}
#schedule > table {
  width: 100%;
  background-color: #ffffff;
}
#schedule > table > tbody > tr > th {
  background-color: #f0f0f0;
  color: #666666;
}
#schedule > table > tbody > tr > td {
  background-color: #000;
  color: #fff;
}

@media print, screen and (min-width: 1025px) {
  /* px */

  #main > div {
    width: 800px;
    margin: 0 auto;
  }
  #main > div > h3 {
    padding-top: 50px;
    font-size: 36px;
  }
  #main > div > pre {
    padding-top: 20px;
    font-size: 18px;
  }
  #main > div > iframe {
    height: 437px;
    margin-top: 20px;
  }

  #profile > table {
    margin-top: 20px;
    border-spacing: 1px;
  }
  #profile > table > tbody > tr > th {
    width: 250px;
    padding: 20px;
    font-size: 18px;
  }
  #profile > table > tbody > tr > td {
    width: 549px;
    padding: 20px;
    font-size: 18px;
  }
  #profile > table > tbody > tr > td > strong {
    font-size: 28px;
  }

  #type > ul {
    margin-top: 20px;
  }
  #type > ul > li {
    width: 250px;
    height: 45px;
    border-width: 2px;
    margin: 8px;
    padding: 7px 0;
    font-size: 18px;
  }
  
  #schedule > table {
    margin-top: 20px;
    border-spacing: 1px;
  }
  #schedule > table > tbody > tr > th {
    width: 250px;
    font-size: 18px;
    line-height: 50px;
  }
  #schedule > table > tbody > tr > td {
    width: 300px;
    font-size: 18px;
    line-height: 50px;
  }
}
@media screen and (min-width: 641px) and (max-width: 1024px){
	/* px/8.5 */

  #main > div {
    width: 95vw;
    margin: 0 auto;
  }
  #main > div > h3 {
    padding-top: 5.8548vw;
    font-size: 4.2154vw;
  }
  #main > div > pre {
    padding-top: 2.3419vw;
    font-size: 2.1077vw;
  }
  #main > div > iframe {
    height: 51.1709vw;
    margin-top: 2.3419vw;
  }

  #profile > table {
    margin-top: 2.3419vw;
    border-spacing: 0.117vw;
  }
  #profile > table > tbody > tr > th {
    width: 29.274vw;
    padding: 2.3419vw;
    font-size: 2.1077vw;
  }
  #profile > table > tbody > tr > td {
    width: 64.2857vw;
    padding: 2.3419vw;
    font-size: 2.1077vw;
  }
  #profile > table > tbody > tr > td > strong {
    font-size: 3.2786vw;
  }

  #type > ul {
    margin-top: 2.3419vw;
  }
  #type > ul > li {
    width: 29.274vw;
    height: 5.2693vw;
    border-width: 0.2341vw;
    margin: 0.9367vw;
    padding: 0.8196vw 0;
    font-size: 2.1077vw;
  }

  #schedule > table {
    margin-top: 2.3419vw;
    border-spacing: 0.117vw;
  }
  #schedule > table > tbody > tr > th {
    width: 29.274vw;
    font-size: 2.1077vw;
    line-height: 5.8548vw;
  }
  #schedule > table > tbody > tr > td {
    width: 35.1288vw;
    font-size: 2.1077vw;
    line-height: 5.8548vw;
  }
}
@media screen and (max-width: 640px){
	/* px/4 */

  #main > div {
    width: 95vw;
    margin: 0 auto;
  }
  #main > div > h3 {
    padding-top: 12.5vw;
    font-size: 9vw;
  }
  #main > div > pre {
    padding-top: 5vw;
    font-size: 4.5vw;
  }
  #main > div > iframe {
    height: 109.25vw;
    margin-top: 5vw;
  }

  #profile > table {
    width: 100%;
    margin-top: 5vw;
    border-spacing: .25vw;
  }
  #profile > table > tbody > tr > th {
    display: block;
    background-color: #e0e0e0;
    padding: 3vw;
    font-size: 4.5vw;
  }
  #profile > table > tbody > tr > td {
    display: block;
    padding: 5vw;
    font-size: 4.5vw;
  }
  #profile > table > tbody > tr.size > td {
    font-size: 3.5vw;
  }
  #profile > table > tbody > tr > td > strong {
    font-size: 7vw;
  }

  #type > ul {
    width: 95vw;
    margin: 1vw auto 0;
  }
  #type > ul > li {
    width: 100%;
    height: 11.25vw;
    border-width: 0.5vw;
    margin: 4vw 0 0;
    padding: 1.75vw 0;
    font-size: 4.5vw;
  }

  #schedule > table {
    margin-top: 5vw;
    border-spacing: 0.25vw;
  }
  #schedule > table > tbody > tr {
    display: block;
  }
  #schedule > table > tbody > tr > th {
    display: block;
    font-size: 4.5vw;
    line-height: 12.5vw;
  }
  #schedule > table > tbody > tr > td {
    display: block;
    font-size: 4.5vw;
    line-height: 12.5vw;
  }
  #schedule > table > tbody > tr > td.hidden {
    display: none;
  }
}
