@font-face {
  font-family: NotoSansJP;
  src: url(fonts/NotoSansJP-min.woff) format("woff");
}
@font-face {
  font-family: Akira Expand;
  src: url(fonts/Akira\ Expanded\ Demo.otf);
}
@font-face {
  font-family: HK Grotesk;
  src: url(fonts/HKGrotesk-Black.otf);
}

body {
  font-family: "NotoSansJP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
    "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 1.317vw;
  background-position: 50% 50%;
  background-size: cover;
  -webkit-appearance: none;
  -webkit-text-size-adjust: 100%;
  padding: 0;
  margin: 0;
  background: #313131;
}

#wrapper {
  width: 100%;
  overflow-x: hidden !important;
}

html {
  overflow-x: hidden;
  resize: horizontal;
  background-color: #ececec;
  width: 100vw;
}

a {
  cursor: pointer;
}

p {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  letter-spacing: 0.1vw;
}

h1 {
  padding: 0;
  margin: 0;
  letter-spacing: 0.5vw;
  box-sizing: border-box;
}

h2 {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

h3 {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  letter-spacing: 0.5vw;
}

header {
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 1000;
  font-family: a-otf-ryumin-pr6n, serif;
}

header p {
  font-size: 0.56vw;
  width: 2.304vw;
  text-align: left;
  box-sizing: border-box;
  /*ヘッダー文字サイズ*/
}

.top {
  width: 100vw;
  overflow-x: hidden;
  height: 100vh;
  top: 0;
  position: relative;
  background-color: #ffffff;
  border-radius: 0px 0px 0px 5vw;
  background-size: cover;
  color: white;
  /*TOPの背景*/
}

.toplogo {
  position: relative;
  width: 60vw;
  height: 10%;
  margin-left: 5vw;
  margin-top: -2.5vh;
  margin-bottom: 10vh;
  /*競技紹介*/
}

.seigetu {
  width: 60vw;
  position: absolute;
  top: 42vh;
  margin-left: 4.1vw;
  letter-spacing: 0.2vw;
  font-size: 3.292vw;
  text-align: left;
  color: white;
  /*pc版のtopロゴ*/
}

.sumaho {
  display: none;
  /*スマホ版のtopロゴ*/
}

.seigetu path {
  fill: transparent;
  stroke: #ececec;
  stroke-width: 1;
  stroke-dasharray: 1500;
  stroke-dashoffset: 0;
  animation: path 3s ease-in forwards;
  /*PC版のTOPロゴ、アニメーション用設定*/
}

@keyframes path {
  0% {
    fill: transparent;
    stroke-dashoffset: 1500;
  }
  70% {
    fill: transparent;
    stroke-width: 1;
  }
  100% {
    fill: #ececec;
    stroke-width: 0;
    stroke-dashoffset: 0;
  }
  /*PC版のTOPロゴ、アニメーション*/
}

.hello {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 15vw;
  position: absolute;
  font-size: 3vw;
  text-align: left;
  color: white;
  /*不明*/
}

.top h3 {
  position: absolute;
  margin-top: 37vh;
  left: 4.4vw;
  letter-spacing: 2.633vw;
  font-size: 1.317vw;
  color: white;
  box-sizing: border-box;
}

.sc {
  font-family: a-otf-ryumin-pr6n, serif;
  writing-mode: vertical-rl;
  margin-left: 4.55vw;
  letter-spacing: 0.263vw;
  top: 79%;
  box-sizing: border-box;
  position: absolute;
  color: black;
  font-size: 0.79vw;
}

.tate::after {
  content: "";
  /*描画位置*/
  position: absolute;
  margin-left: 5vw;
  top: 90vh;
  height: 15vh;
  width: 0.039vw;
  background: black;
  position: absolute;
  /*線の形状*/
  width: 0.066vw;
  height: 6.583vw;
  background: black;
  /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity: 0;
  z-index: 100;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove {
  0% {
    height: 0;
    top: 42vw;
    opacity: 0;
  }
  30% {
    height: 6.583vw;
    opacity: 1;
  }
  100% {
    height: 0;
    top: 60vw;
    opacity: 0;
  }
}

.okuru {
  width: 100vw;
  padding-bottom: 10vh;
  background: #313131;
  position: relative;
  color: white;
  font-size: 1.448vw;
  overflow-y: hidden;
  overflow-x: hidden;
}
.genga {
  width: 50vw;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 1;
}
.mozisei-div {
  margin-right: 1vw;
  margin-bottom: 1vh;
}
.mozisei {
  width: 30vw;
  /* position: fixed; */
  border-radius: 45px;
  /* padding-top: 20vw;
  padding-left: 50vw; */
  z-index: 20;
}

.sukasi {
  width: 17vw;
  height: 120vw;
  font-size: 17vw;
  letter-spacing: -1vw;
  position: absolute;
  left: 0;
  top: -10%;
  color: white;
  opacity: 0.1;
  font-family: a-otf-ryumin-pr6n, serif;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}

.relative {
  position: relative;
}

.mukaeru {
  text-align: left;
  margin-left: 10vw;
  line-height: 2.962vw;
  margin-right: 20vw;
  padding-top: 15vh;
  margin-bottom: 25vh;
  font-family: "NotoSansJP";
  letter-spacing: 0.197vw;
}
.mukaeru h3 {
  font-family: HK grotesk;
  font-size: 2.962vw;
  letter-spacing: 0.2vw;
  line-height: 4.5vw;
  padding-bottom: 3.292vw;
}
.mukaeru h1 {
  font-size: 3.292vw;
  letter-spacing: 0.2vw;
  line-height: 2vw;
  padding-top: 1.317vw;
}

.okuru h2 {
  background: white;
  width: 0.016vw;
  height: 20vh;
  left: 5%;
  top: 0;
  position: absolute;
  margin: 0;
  padding: 0;
}

.okuru h4 {
  margin-top: 2.633vw;
  margin-bottom: 2.633vw;
  font-size: 1.975vw;
}

.video {
  margin-left: 15vw;
  margin-right: 15vw;
  height: 45vw;
  width: 70vw;
  margin-bottom: 10vh;
  background-image: url("top-photos/top_02.jpg");
  background-size: cover;
  position: relative;
}
.video p {
  width: 16.458vw;
  height: 1.975vw;
  text-align: center;
  font-family: NotoSansJp;
  letter-spacing: 0.395vw;
  color: white;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  position: absolute;
}
.video::before {
  /* 透過した黒を上から重ねるイメージ */
  background-color: rgba(0, 0, 0, 0.6);
  /* 自由に位置指定 */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: " ";
}

.inform {
  padding-left: 9vw;
  width: 91vw;
  overflow-x: hidden;
  padding-top: 15vh;
  padding-bottom: 20vh;
  padding-bottom: 10vw;
  background: #ececec;
}

.News {
  display: inline-block;
  margin-right: 1.317vw;
  font-family: Hk grotesk;
}
.all-news {
  display: inline-block;
  border: solid 0.5px black;
  border-radius: 1.317vw;
  padding-left: 0.527vw;
  padding-right: 0.527vw;
  cursor: pointer;
  text-align: center;
  margin-top: -0.79vw;
  padding-top: 0.329vw;
  padding-bottom: 0.329vw;
  padding-left: 0.658vw;
  font-size: 1.119vw;
}
.all-news a {
  text-decoration: none;
  color: black;
  padding-top: 0.987vw;
  padding-left: 0.329vw;
  padding-bottom: 0.987vw;
}

.inform-flex {
  display: flex;
  gap: 2vw;
}

.inform1,
.inform2,
.inform3,
.inform4 {
  width: 19vw;
  text-align: center;
}

.inform1 {
  margin-top: 6.583vw;
}

.inform2 img {
  padding-left: 1vw;
  padding-right: 1vw;
  padding-top: 1.975vw;
  padding-bottom: 1.975vw;
  width: 12vw;
}

.inform4 img {
  padding-left: 1vw;
  padding-right: 1vw;
  padding-top: vw;
  padding-bottom: 0.658vw;
  width: 17vw;
  display: none;
}

.inform4 {
  margin-top: 6.583vw;
}

.date-pc {
  display: flex;
  align-items: center; /* 垂直中心 */
  justify-content: center;
  font-family: HK grotesk;
}
.date-pc:before,
.date-pc:after {
  border-top: 1px solid;
  content: "";
  width: 3em; /* 線の長さ */
}
.date-pc:before {
  margin-right: 1em; /* 文字の右隣 */
}
.date-pc:after {
  margin-left: 1em; /* 文字の左隣 */
}

.date-sp {
  display: none;
}

.information {
  margin-top: 1.975vw;
  margin-bottom: 3.95vw;
  margin-right: 1.317vw;
  margin-left: 1.317vw;
  font-family: Yu gothic;
}

.more {
  border: solid 1px black;
  border-radius: 1.317vw;
  cursor: pointer;
  margin-left: 1vw;
  width: 8.558vw;
  padding-top: -1.317vw;
  padding-bottom: 0.329vw;
}

.more a {
  text-decoration: none;
  color: black;
  font-size: 0.922vw;
  margin-top: -0.197vw;
  letter-spacing: 0.066vw;
}

.slider img {
  width: 45vw; /*スライダー内の画像を横幅100%に*/
  height: 30vw;
  border-radius: 1.975vw;
}
.slider .slick-slide {
  margin: 0 8vw; /*スライド左右の余白調整*/
}

.slider {
  padding-bottom: 15vh;
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  background: #ececec;
  border: 0;
  padding-bottom: 10vw;
  width: 100vw;
  overflow-x: hidden;
}
.slick-track:before {
  display: none;
}

.more-kaisei {
  width: 100vw;
  overflow-x: hidden;
}
.more-kaisei h1 {
  width: 100vw;
  padding-top: 12vh;
  height: 25vh;
  padding-bottom: 20vh;
  font-size: 3.95vw;
  letter-spacing: 0.461vw;
  text-align: center;
  background: #313131;
  color: white;
  border-bottom: 1px solid white;
  font-family: HK grotesk;
}

.kaisei-flex {
  display: flex;
  flex-wrap: wrap;
}
.kaisei-flex-sp {
  display: none;
}

.img1 {
  background-image: url("top-photos/top_06.jpg");
  background-size: cover;
  width: 25vw;
  height: 25vw;
}
.img2 {
  background-image: url("top-photos/top_07.jpg");
  background-size: cover;
  width: 25vw;
  height: 25vw;
}
.img3 {
  background-image: url("top-photos/top_08.jpg");
  background-size: cover;
  width: 25vw;
  height: 25vw;
}
.img4 {
  background-image: url("top-photos/top_05.jpg");
  background-size: cover;
  width: 25vw;
  height: 25vw;
}

.kaisei-black {
  width: 25vw;
  height: 25vw;
  text-align: center;
  color: white;
  background: #313131;
  font-size: 1.975vw;
}

.kaisei-black p {
  margin-top: 7vw;
  margin-bottom: 2vw;
}

.more-white {
  border: solid 0.2px white;
  border-radius: 1.646vw;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.317vw;
  width: 10vw;
  text-align: center;
  padding-top: 0.527vw;
  padding-bottom: 0.658vw;
}

.more-white a {
  text-decoration: none;
  color: white;
}
.map {
  border-top: 1px solid white;
  color: white;
  background: #313131;
  padding-top: 12vh;
  padding-bottom: 18vh;
  padding-left: 10vw;
}
.map div h1 {
  display: inline-block;
  margin-right: 5.067vw;
  margin-bottom: 6vw;
  font-family: HK grotesk;
}
.map div div {
  display: inline-block;
  margin-bottom: 5vw;
}
.map div iframe {
  display: inline-flex;
  margin: 0;
  margin-right: 3vw;
  width: 30vw;
  height: 30vw;
  filter: grayscale(100%) invert(92%) contrast(83%);
}
.map div iframe:hover {
  filter: none;
}
.map div p {
  letter-spacing: 0.6vw;
  font-size: 1.4vw;
  line-height: 2.5vw;
  margin-left: 4vw;
  display: inline-flex;
  margin-top: 5vw;
  vertical-align: top;
}

.more-google {
  border: solid 1px white;
  border-radius: 1.624vw;
  padding-top: 0.329vw;
  padding-bottom: 0.329vw;
  font-family: notosansjp;
}
.more-google a {
  text-decoration: none;
  color: white;
  padding-left: 1.317vw;
  padding-right: 1.317vw;
  padding-top: 0.658vw;
  padding-bottom: 0.658vw;
  font-size: 0.79vw;
  text-align: center;
}

.footer-sp {
  display: none;
}

footer {
  color: black;
  background-color: white;
  width: 100vw;
  bottom: 0; /*下に固定*/
  font-family: a-otf-ryumin-pr6n, serif;
  overflow: hidden;
  padding-top: 12vh;
  padding-bottom: 4vh;
}

.icons {
  display: flex;
  gap: 2.633vw;
  flex-wrap: nowrap;
  height: 5.267vw;
  margin-bottom: 3.95vw;
  padding-left: 10vw;
}
.icons img {
  width: 2.633vw;
}
.icons a:last-child {
  padding-top: 0.461vw;
}
.icons a:first-child {
  padding-top: 0.132vw;
}

.mokuzi {
  display: flex;
  gap: 5.267vw;
  margin-bottom: 1.975vw;
  padding-left: 10vw;
}
.mokuzi-hello {
  margin-bottom: 25vh;
  display: flex;
  gap: 1.975vw;
}
.mokuzi-hello a {
  text-decoration: none;
  color: black;
  font-size: 1.975vw;
  cursor: pointer;
}
.mokuzi-sp {
  display: none;
}
.mokuzi a {
  text-decoration: none;
  color: black;
  letter-spacing: 0.263vw;
  font-size: 1.975vw;
  width: auto;
  cursor: pointer;
}
.mokuzi a:hover {
  color: #cacaca;
}
.mokuzi-hello a:hover {
  color: #cacaca;
}

.top_bottom {
  width: 70vw;
  list-style: none;
  margin-bottom: 25vh;
  padding-left: 10vw;
}
.top_bottom li a {
  text-decoration: none;
  color: black;
  font-size: 20px;
  margin-bottom: 0.987vw;
}

.footer-p small {
  color: black;
  font-size: 0.658vw;
  margin-top: -4.5vw;
  position: absolute;
}

.footer-line {
  width: 80vw;
  height: 0.066vw;
  margin: 0;
  margin-left: 10vw;
  margin-bottom: 10px;
}

.footer-p {
  display: inline-block;
  margin-right: 0vw;
  padding-left: 10vw;
  width: 50vw;
}

.footer-p p a {
  text-decoration: none;
  color: black;
  margin-top: -10vw;
  margin-left: -10vw;
  padding-left: 10vw;
  font-size: 5px;
}

.footer-p p {
  font-size: 5px;
}

.top_massage,
.top_massage-hello {
  display: flex;
  padding-left: 3vw;
  padding-top: 5vh;
}
.top_svg {
  width: 20vw;
  margin-top: 3.621vw;
  margin-left: 0vw;
}

.penken {
  width: 7vw;
}

.top_massage p {
  font-size: 2.5vw;
  letter-spacing: 0.461vw;
  margin-top: 1vw;
  font-family: a-otf-ryumin-pr6n, serif;
  font-weight: 700;
  font-style: normal;
}
.top_massage-hello {
  font-size: 2.5vw;
  letter-spacing: 0.461vw;
  margin-top: 1vw;
  font-family: a-otf-ryumin-pr6n, serif;
  font-weight: 700;
  font-style: normal;
  color: black;
}

.hrLine {
  margin-left: 15vw;
  margin-right: 15vw;
}

.button {
  position: relative;
  margin-top: 20vh;
  margin-left: 3.292vw;
  display: block;
}

.icon {
  /* アイコン全体のスタイル */
  top: 50%;
  width: 1.975vw;
  height: 1.975vw;
  border: 2px solid #333;
  border-radius: 50%;
  display: block;
}

.icon::before,
.icon::after {
  /* 「×」印のスタイル */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.132vw;
  width: 0.856vw; /* くの字を山なりに見た時、左側の長さ */
  height: 0.856vw; /* くの字を山なりに見た時、右側の長さ */
  border-top: 3px solid #000; /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 3px solid #000; /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
}

.pc-menu {
  display: flex;
  gap: 3vw;
  margin-top: 4.279vw;
  margin-left: 60vw;
  color: #ececec;
}
.pc-menu a {
  text-decoration: none;
  color: black;
}
.pc-menu-hello {
  display: flex;
  gap: 3vw;
  margin-top: 4.279vw;
  margin-left: 60vw;
}
.pc-menu-hello a {
  text-decoration: none;
  color: black;
}

.h-menu {
  margin-top: 3vh;
  position: relative;
  margin-left: 95vw;
  display: none;
}

/*inputのcheckboxは非表示に*/
.h-menuCheckbox {
  display: none;
}

/*ハンバーガーメニュー*/
header p {
  font-weight: bold;
}

.h-menu {
  border-radius: 50%;
  width: 3.292vw;
  height: 3.292vw;
  text-align: center;
}

.h-menu_icon {
  display: inline-block;
  width: 10vw;
  height: 10vw;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  background-color: white;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.hamburger-icon p {
  margin-top: 1.646vw;
}

/*3本線*/
.hamburger-icon,
.hamburger-icon::before,
.hamburger-icon::after {
  content: "";
  display: inline-block;
  position: absolute;
  z-index: 100;
  top: 2.7vw;
  width: 6vw;
  height: 0.6vw;
  padding-left: 2vw;
  background: black;
  cursor: pointer;
  text-align: center;
  left: 2vw;
}
.hamburger-icon:before {
  top: 1.8vw;
  left: 0;
}
.hamburger-icon:after {
  top: 3.8vw;
  left: 0;
}

/*メニュー以外を暗くする*/
#h-menu_black {
  display: none;
  position: fixed;
  z-index: 98;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: 0.7s ease-in-out;
}

/*中身*/
#h-menu_content {
  position: fixed;
  top: 0;
  left: 0;
  background: white;
  color: black;
  z-index: 99;
  /*width: 100%;
    max-width: 21.066vw;*/
  width: 100vw;
  height: 100vh;
  padding: 1.053vw 1.053vw 1.053vw;
  overflow: auto;
  transition: 0.3s ease-in-out;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
}

.first {
  margin-top: 10vh;
  margin-left: -2vw;
  text-align: left;
}

.first li {
  font-size: 6vw;
  letter-spacing: 1vw;
  margin-top: 3.4vw;
  margin-bottom: 0.987vw;
  list-style: none;
  cursor: pointer;
}

.first a {
  text-decoration: none;
  color: black;
}

.second {
  margin-top: 15vh;
  margin-left: -2vw;
  text-align: left;
}

.second li {
  font-size: 4vw;
  margin-top: 0.987vw;
  margin-bottom: 0.987vw;
  list-style: none;
  cursor: pointer;
}

.second a {
  text-decoration: none;
  color: black;
}

.kaisei p {
  padding-top: 0.329vw;
  font-size: 1.975vw;
  height: 3.292vw;
  width: 26.333vw;
}

/*チェックボックスにチェックが入ったら表示*/
input:checked ~ .h-menu_icon .hamburger-icon {
  background: transparent;
  height: 1.975vw;
}
input:checked ~ .h-menu_icon .hamburger-icon::before {
  -webkit-transform: rotate(-45deg);

  transform: rotate(-45deg);
  top: 0.658vw;
  z-index: 999;
}
input:checked ~ .h-menu_icon .hamburger-icon::after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 0.658vw;
  z-index: 999;
}
input:checked ~ #h-menu_black {
  display: block;
  opacity: 0.8;
}
#h-menu_checkbox:checked ~ #h-menu_content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0, 0, 0, 0.15);
}
.h-menu_icon .hamburger-icon,
.h-menu_icon .hamburger-icon::before,
.h-menu_icon .hamburger-icon::after,
#h-menu_black,
#h-menu_content {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

#h-menu_content li a:hover {
  background: #cacaca;
}

.kotyo_title,
.unzyun_title,
.kumiseki_title,
.tokuten_title,
.syokai_title,
.archi_title,
.ale_title {
  margin-top: 1.975vw;
  margin-left: 15vw;
  margin-right: 15vw;
  margin-bottom: 0.132vw;
  padding-left: 0.658vw;
  border-left: 7px black solid;
}

.tokuten_content {
  display: flex;
}

.scroll {
  width: 50vw;
  height: 20vh;
  background-image: url("top-photos/top_06.jpg");
  position: absolute;
  color: white;
  bottom: 0%;
  text-align: center;
  letter-spacing: 0.132vw;
  left: 25%;
  border-top-right-radius: 1.975vw;
  border-top-left-radius: 1.975vw;
}

.scroll p {
  position: absolute;
  bottom: 0;
  width: 50vw;
  text-align: center;
}

.waki1 {
  width: 15vw;
  background-image: url("hello photos/hello_01.jpg");
  position: absolute;
  bottom: 0;
  height: 40vh;
  margin-right: 15vw;
  left: 0;
  border-top-right-radius: 1.975vw;
}

.waki2 {
  width: 15vw;
  height: 40vh;
  background-image: url("hello photos/hello_03.jpg");
  position: absolute;
  bottom: 0;
  right: 0;
  border-top-left-radius: 1.975vw;
}

.principal {
  display: flex;
  padding-left: 5vw;
  padding-right: 5vw;
  padding-top: 10vh;
  padding-bottom: 10vh;
  background: rgb(230, 230, 230);
}

.kotyo {
  width: 45vw;
}

.kotyo h2 {
  margin-top: 5vh;
  margin-bottom: 5vh;
}

.ima {
  margin-right: 5vw;
  width: 40vw;
}

.ima h1 {
  font-size: 3vw;
  text-align: center;
  margin-bottom: 5vh;
}
.ima h1 img {
  width: 25vw;
}

.two-kikan {
  text-align: center;
  height: 100vh;
  padding-bottom: 9.875vw;
  background: rgb(230, 230, 230);
}

.two-top {
  width: 60vw;
  margin: auto;
  margin-bottom: 3.292vw;
}

.unzyun {
  display: inline-block;
  width: 35vw;
  height: 35vw;
  border: solid 1px black;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  left: 17%;
}

.unzyun div {
  margin: auto;
  width: 25vw;
  height: 15vw;
  margin-top: 10vw;
}

.judge {
  display: inline-block;
  width: 35vw;
  border: solid 1px black;
  border-radius: 50%;
  height: 35vw;
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  right: 17%;
}

.judge div {
  margin: auto;
  width: 25vw;
  height: 15vw;
  margin-top: 10vw;
}

.unzyun-hello {
  width: 93vw;
  padding-left: 7vw;
  padding-bottom: 9.875vw;
  background: rgb(230, 230, 230);
}

.unzyun-hello h1 img,
.judge-hello h1 img {
  width: 25vw;
}

.judge-hello {
  background: rgb(230, 230, 230);
  padding-right: 7vw;
  padding-bottom: 9.875vw;
}
.unzyun-hello h1,
.judge-hello h1 {
  padding-bottom: 4.608vw;
}
.judge-hello h1 {
  margin-left: 40vw;
}
.judge-hello div img {
  margin-left: 5vw;
}
.unzyun-hello div,
.judge-hello div {
  display: flex;
  flex-wrap: nowrap;
  gap: 7vw;
}
.unzyun-hello div p,
.judge-hello div p {
  width: 55vw;
}
.unzyun-hello div img,
.judge-hello div img {
  width: 25vw;
  border-radius: 3.292vw;
}

.hoka-kikan {
  text-align: center;
  background: rgb(230, 230, 230);
  color: black;
  height: 300vh;
  padding-top: 15vh;
  padding-bottom: 80vh;
  padding-left: 10vw;
  padding-right: 8vw;
}

.hoka-kikan p {
  margin-bottom: 6.583vw;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  height: 300vh;
  color: black;
}

.gityo,
.gityo2 {
  height: 150vh;
  width: 32vw;
}
.gityo {
  padding-right: 8vw;
}

.gityo h2,
.gityo2 h2 {
  background: rgb(20, 20, 20);
  color: white;
  width: 30vw;
  height: 12vw;
  border-radius: 4.937vw;
  text-align: left;
  padding-left: 2vw;
  padding-top: 20vw;
  margin-bottom: 4.937vw;
}

.red,
.blue,
.white,
.yellow,
.black,
.purple,
.orange,
.green {
  width: 16vw;
  height: 45vh;
}
.red,
.white,
.black,
.purple,
.orange,
.green {
  margin-right: 8vw;
}

.red h2,
.blue h2,
.white h2,
.yellow h2,
.black h2,
.purple h2,
.orange h2,
.green h2 {
  width: 14vw;
  height: 6vw;
  font-size: 1.317vw;
  text-align: left;
  padding-left: 2vw;
  padding-top: 10vw;
  background: rgb(20, 20, 20);
  color: white;
  border-radius: 2.304vw;
  margin-bottom: 4.937vw;
}

.flex2 {
  display: flex;
  flex-wrap: wrap;
  height: 150vh;
  width: 40vw;
}
.flex3 {
  display: flex;
  flex-wrap: wrap;
  height: 150vh;
  width: 48vw;
}

.hrline {
  width: 80vw;
  height: 0.066vw;
  margin: 0;
  background-color: black;
}

small {
  color: black;
}

.toha {
  padding-left: 15vw;
  padding-right: 0vw;
}

.footer-kaisei {
  left: 80%;
  position: absolute;
  display: flex;
}

.flex3 {
  display: flex;
}

.flex3 a {
  color: black;
  text-decoration: none;
  margin-right: 3vw;
}

.flex3 p {
  margin-right: 1.317vw;
}

.flex4 {
  display: flex;
  margin-top: 10vh;
  margin-left: 50vw;
}

.kiwami {
  width: 40vw;
  height: 70vh;
}

.kiwami h2 {
  margin-bottom: 5vh;
  font-size: 1.975vw;
}

.kiwami p {
  margin-bottom: 5vh;
}

.kiwami a {
  color: black;
  background-color: white;
  border-radius: 0.987vw;
  text-decoration: none;
  width: 17.775vw;
  cursor: pointer;
  padding-left: 0.658vw;
}

.scroll2 {
  text-align: center;
  color: white;
  position: absolute;
  left: 0;
  bottom: 5%;
  width: 10vw;
}

.tateLine {
  position: absolute;
  width: 0.132vw;
  height: 20vh;
  background-color: white;
  left: 10%;
  bottom: 0;
}

.foo {
  display: inline-block;
  width: 30vw;
  text-align: right;
}
.footer-p {
  display: inline-block;
}

.kaisei-header {
  width: 55vw;
  height: 8vh;
  margin-top: 8vw;
  margin-left: 6vw;
}
.kaisei-header svg {
  width: 55vw;
}
.kaisei-header svg image {
  width: 55vw;
}

/*ここから、競技紹介用アニメーション*/

.view_more a {
  display: inline-block;
  transition: 0.3s;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.view_more a:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.gaiyou_img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.gaiyou_img:hover {
  -webkit-transform: scale(1.04);
  transform: scale(1.04);
}

@media screen and (min-width: 480px) {
  .br-pc {
    display: block;
  }
  .br-sp {
    display: none;
  }
}

@media screen and (max-width: 1200px) {
  .pc-menu {
    margin-left: 50vw;
  }
  .more-white {
    width: 12vw;
  }
  .top_svg {
    width: 20vw;
  }
  .date-pc {
    display: none;
  }
  .date-sp {
    display: block;
    text-align: center;
  }

  @media screen and (max-width: 850px) {
    .br-pc {
      display: none;
    }
    .br-sp {
      display: block;
    }

    header {
      position: fixed;
    }

    .top {
      background-image: url(top-photos/top_sp.jpg);
    }

    .sc {
      margin-left: 5vw;
      font-size: 1vw !important;
      margin-top: 13vh !important;
      letter-spacing: 1vw !important;
    }

    .tate::after {
      content: "";
      /*描画位置*/
      position: absolute;
      margin-left: 14vw;
      margin-top: 6vh;
      top: 150vh;
      height: 30vh;
      width: 0.039vw;
      background: black !important;
      position: absolute;
      /*線の形状*/
      width: 0.1vw !important;
      height: 10vw;
      background: black !important;
      /*線の動き1.4秒かけて動く。永遠にループ*/
      animation: pathmove 1.4s ease-in-out infinite;
      opacity: 0;
      z-index: 100;
    }

    /*高さ・位置・透過が変化して線が上から下に動く*/
    @keyframes pathmove {
      0% {
        height: 0;
        top: 91vh;
        opacity: 0;
      }
      30% {
        height: 10vh;
        opacity: 1;
      }
      100% {
        height: 0;
        top: 110vh;
        opacity: 0;
      }
    }

    .more-google a {
      font-size: 3vw;
    }

    .map div p {
      line-height: normal;
    }
    .more {
      width: 28vw;
      margin-left: auto;
      margin-right: auto;
      padding-top: 5px;
      padding-bottom: 5px;
    }
    .more-google {
      border-radius: 25px;
      display: inline-block;
    }
    .map div h1 {
      font-size: 7vw;
      display: inline-block;
    }

    footer {
      padding-left: 10vw;
      width: 90vw;
    }
    .footer-line {
      margin-left: 0;
    }
    .top_bottom {
      padding-left: 0;
    }

    .icons {
      padding-left: 0;
    }
    .icons img {
      width: 10vw;
    }

    .footer-p {
      padding-left: 0;
    }
    .kaisei svg {
      width: 30vw;
    }
    .kaisei svg image {
      width: 30vw;
    }

    .seigetu {
      display: none;
    }

    .sumaho {
      display: flex;
      width: 30vw;
      margin-left: 6vw;
      margin-top: 30vh;
    }

    .sumaho path {
      fill: transparent;
      stroke: #ececec;
      stroke-width: 1;
      stroke-dasharray: 1500;
      stroke-dashoffset: 0;
      animation: path 3s ease-in forwards;
      /*PC版のTOPロゴ、アニメーション用設定*/
    }

    @keyframes path {
      0% {
        fill: transparent;
        stroke-dashoffset: 1500;
      }
      70% {
        fill: transparent;
        stroke-width: 1;
      }
      100% {
        fill: #ececec;
        stroke-width: 0;
        stroke-dashoffset: 0;
      }
      /*PC版のTOPロゴ、アニメーション*/
    }

    html {
      overflow-x: hidden;
      width: 100vw;
    }

    /* h2{
      font-size: 6.667vw;
    } */
    /* p{
      font-size: 4vw;
    } */

    .h-menu {
      margin-left: 85vw;
      display: block;
    }
    .pc-menu {
      display: none;
    }

    .top_svg {
      width: 55vw;
      margin-top: 8vw;
      margin-left: 6vw;
    }
    .top_massage p,
    .top_massage-hello p {
      font-size: 5.333vw;
    }
    .penken {
      width: 16vw;
    }

    .top h1 {
      left: 5%;
      top: 40%;
      width: 90vw;
      font-size: 8vw;
      text-align: center;
      height: 30vh;
    }
    .top h3 {
      letter-spacing: 4vw;
      font-size: 3vw;
      margin-left: 1.8vw;
      top: 40vh;
    }

    .sc {
      margin-left: 5vw;
      font-size: 2vw;
      margin-top: 3vh;
      letter-spacing: 2vw;
    }

    .tate::after {
      content: "";
      /*描画位置*/
      position: absolute;
      margin-left: 5.7vw;
      top: 150vh;
      height: 30vh;
      width: 0.039vw;
      background: white;
      position: absolute;
      /*線の形状*/
      width: 0.1vw;
      height: 10vw;
      background: #eee;
      /*線の動き1.4秒かけて動く。永遠にループ*/
      animation: pathmove 1.4s ease-in-out infinite;
      opacity: 0;
      z-index: 100;
    }

    /*高さ・位置・透過が変化して線が上から下に動く*/
    @keyframes pathmove {
      0% {
        height: 0;
        top: 91vh;
        opacity: 0;
      }
      30% {
        height: 10vh;
        opacity: 1;
      }
      100% {
        height: 0;
        top: 100vh;
        opacity: 0;
      }
    }

    .okuru img {
      margin-top: 8vh;
      opacity: 0.2;
      margin-right: -20vw;
      width: 60vw;
    }

    .mukaeru {
      margin-right: 5vw;
      margin-left: 6.5vw;
      margin-top: -8vh;
      margin-bottom: 20vh;
    }

    .mukaeru h3 {
      font-size: 6.5vw;
      letter-spacing: 0.5vw;
      line-height: 3vh;
      margin-bottom: 3vh;
    }

    .mukaeru p {
      font-size: 3vw;
      line-height: 3vh;
      letter-spacing: 0.7vw;
    }

    .sukasi {
      font-size: 40vw;
      margin-top: 14vh;
      height: 200vh;
      margin-left: 4vw;
    }

    .mukaeru h1 {
      margin-left: -0.5vw;
      margin-top: 1vh;
      font-size: 6vw;
    }
    .video {
      margin-left: 5vw;
      margin-top: -5vh;
      margin-right: 5vw;
      width: 90vw;
      height: 60vw;
    }

    .video p {
      width: 30vw;
      height: 1.975vw;
      text-align: center;
      font-family: NotoSansJp;
      letter-spacing: 1vw;
      font-size: 2vw;
      color: white;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      position: absolute;
    }
    .video::before {
      /* 透過した黒を上から重ねるイメージ */
      background-color: rgba(0, 0, 0, 0.6);
      /* 自由に位置指定 */
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      content: " ";
    }

    .inform {
      padding-left: 9vw;
      padding-top: 15vh;
      padding-bottom: 20vh;
      padding-bottom: 15vh;
      background: #ececec;
    }

    .inform {
      padding-left: 2vw;
      padding-top: 5vh;
      width: 98vw;
    }

    .inform h1 {
      font-size: 7vw;
      margin-left: 4vw;
      margin-right: 5vw;
    }
    .all-news {
      width: auto;
      margin-bottom: 14vw;
      margin-top: -30vh;
      font-size: 2vw;
      letter-spacing: 0.3vw;
      display: inline-flex;
      border: solid 0.1px black;
      border-radius: 4vw;
      padding-left: 3vw;
      padding-right: 0.527vw;
      cursor: pointer;
      text-align: center;
      padding-bottom: 0.329vw;
      padding-left: 0.658vw;
      left: 3vw;
      top: -5vh;
      border-top: -10vw;
    }

    .inform-flex {
      flex-wrap: wrap;
    }
    .inform1,
    .inform2,
    .inform3,
    .inform4 {
      width: 46vw;
      margin-top: 0;
    }
    .inform1,
    .inform2 {
      margin-bottom: 13.333vw;
    }
    .inform2 img,
    .inform4 img {
      display: none;
    }

    .inform2 .information {
      margin-bottom: 8vh;
    }

    .information {
      text-align: center;
      margin-right: 5.333vw;
      margin-bottom: 5vh;
    }

    .date-pc {
      display: none;
    }
    .date-sp {
      display: flex;
      font-size: 4vw;
      align-items: center; /* 垂直中心 */
      justify-content: center;
      font-family: HK grotesk;
    }
    .date-sp:before,
    .date-sp:after {
      border-top: 1px solid;
      content: "";
      width: 2em; /* 線の長さ */
    }
    .date-sp:before {
      margin-right: 0.5em; /* 文字の右隣 */
    }
    .date-sp:after {
      margin-left: 0.5em; /* 文字の左隣 */
    }

    .more {
      border: solid 0.1px black;
      width: 25vw;
      border-radius: 3vw;
      padding-top: 5px;
      padding-bottom: 5px;
      font-family: notosansjp;
      text-align: left;
    }

    .more a {
      font-size: 2vw;
    }

    .slider img {
      width: 60vw;
      height: 40vw;
    }

    .slider .slick-slide {
      margin: 0 20vw; /*スライド左右の余白調整*/
    }

    .slider {
      padding-top: 0;
      padding-left: 0;
      padding-right: 0;
      padding-bottom: 20vh;
    }

    .slick-track:before {
      display: none;
    }

    .more-kaisei h1 {
      font-size: 8vw;
    }

    .kaisei-black,
    .img1,
    .img2,
    .img3,
    .img4 {
      width: 50vw;
      height: 50vw;
    }
    .kaisei-flex {
      display: none;
      top: -4vh;
    }
    .kaisei-flex-sp {
      display: flex;
      flex-wrap: wrap;
    }

    .more-white {
      width: 18vw;
      margin-left: auto;
      margin-right: auto;
      height: auto;
      font-size: 5.333vw;
      border: solid 0.1px white;
      border-radius: 3vw;
      cursor: pointer;
      margin-left: auto;
      margin-right: auto;
      font-size: 3vw;
      text-align: center;
      padding-top: 0.527vw;
      padding-bottom: 0.658vw;
    }

    .kaisei-black p {
      margin-top: 15vw;
    }

    .map {
      padding-top: 6vh;
      padding-bottom: 14vh;
    }
    .map div h1 {
      margin: 0;
    }
    .map div div {
      display: inline-block;
      margin-bottom: 13.333vw;
      font-size: 2vw;
      width: 60vw;
      padding-top: 10px;
      padding-bottom: 10px;
      margin-left: 30px;
      text-align: center;
    }
    .map div div a {
      padding-left: 2.133vw;
      padding-right: 2.133vw;
    }

    .map {
      padding-left: 5vw;
    }
    .map div iframe {
      width: 90vw;
      height: 90vw;
    }
    .map div p {
      margin: 0;
      padding-top: 10.667vw;
      padding-right: 5vw;
      padding-bottom: 10.667vw;
      font-size: 4vw;
      display: block;
    }

    .icons {
      height: 26.667vw;
    }

    .mokuzi {
      display: none;
    }
    .mokuzi-sp {
      display: block;
      list-style-type: none;
      padding-left: 0;
      letter-spacing: 1vw;
    }
    .mokuzi-sp li {
      margin-bottom: 2.667vw;
    }
    .mokuzi-sp li a {
      text-decoration: none;
      color: black;
      font-size: 6.667vw;
    }

    .two-kikan {
      height: 100vh;
    }
    .judge {
      top: 115vw;
    }

    .button {
      font-size: 4vw;
    }
    .kiwami a {
      width: 56vw;
    }
  }
}

@media screen and (max-width: 480px) {
  .map div iframe {
    margin-right: 0;
  }
  .top_bottom li a {
    font-size: 15px;
  }
  .top h3 {
    top: 33vh;
  }
}

/* new styles */

/* @media screen and (max-width: 1200px) {
  @media screen and (max-width: 850px) {
    .competition-top {
      padding-top: 6vh;
      padding-left: 5vw;
      padding-bottom: 14vh;
    }
  }
} */

.competition-top #first {
  /* display: inline-flex;
  flex-wrap: wrap; */
  /* margin: 0;
  margin-right: 3vw;
  width: 30vw;
  height: 30vw; */
  /* filter: grayscale(100%) invert(92%) contrast(83%); */
}
.competition-top #second {
  /* letter-spacing: 0.6vw; */
  /* font-size: 1.4vw;
  line-height: 2.5vw;
  margin-left: 4vw; */
  float: left;
  width: 50%;
  /* display: inline-flex;
  flex-wrap: wrap; */
  /* margin-top: 5vw; */
  /* vertical-align: top; */
}

.pictogram {
}

.all-news a:hover {
  color: inherit;
}

@media screen and (max-width: 480px) {
  .top_img {
    height: 10vh;
    margin-left: 0;
  }
}

@media screen and (max-width: 850px) {
  p {
    font-size: 1rem;
  }
}

.gaiyou_img {
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 50px;
}

.gaiyou_img1 {
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 50px;
}

.col-xl-6 {
  margin-bottom: 50px;
}
.col-xl-6 h3,
p {
  text-align: left;
}
.view_more {
  display: flex;
  align-items: center; /* 垂直中心 */
  /* justify-content: center; /* 水平中心 */
  margin-top: 2.5vh;
  margin-bottom: 2.5vh;
}
.view_more a {
  color: inherit;
  text-decoration: none;
}
.view_more a:hover {
  color: inherit;
}
.view_more:before {
  border-top: 1px solid;
  content: "";
  width: 15em; /* 線の長さ */
}
.view_more:before {
  margin-right: 2em; /* 文字の右隣 */
}
.view_more:after {
  margin-left: 2em; /* 文字の左隣 */
}
* {
  font-family: a-otf-ryumin-pr6n, serif;
}

.sukasi-gray {
  color: gray;
  opacity: 0.2;
}
.sukasi-white {
  color: white;
  opacity: 0.1;
}

.sukasi-right {
  width: 17vw;
  height: 120vw;
  font-size: 17vw;
  letter-spacing: -1vw;
  position: absolute;
  right: 0;
  top: -10%;
  margin-right: -5vw;
  /* margin-right: -50px; */
  font-family: a-otf-ryumin-pr6n, serif;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}

@media screen and (min-width: 1200px) {
  .gaiyou_img {
    width: initial;
  }
  .gaiyou_caption {
    margin: auto;
    width: 556px;
  }
  .view_more {
    margin: auto;
    width: 556px;
  }
}
@media screen and (max-width: 1200px) {
  .gaiyou_img {
    width: inherit;
  }
  .view_more:before {
    width: 10em;
  }
}
@media screen and (max-width: 850px) {
  .sukasi-right {
    font-size: 40vw;
    margin-top: 14vh;
    height: 200vh;
    margin-left: 4vw;
    margin-right: -30vw;
  }
}

@media screen and (max-width: 480px) {
  /*競技紹介用レスポンシブ*/

  .body {
    overflow: hidden !important;
  }

  .toplogo {
    position: relative;
    width: 70vw;
    height: 10%;
    margin-left: 1vw;
    margin-top: 0;
    margin-bottom: 0vh;
    /*競技紹介*/
  }

  .top_img {
    margin: 0 !important;
    overflow: hidden;
  }

  .all-news {
    margin-top: 0 !important;
    font-size: 3vw;
    overflow: hidden;
  }

  .pictogram h1 {
    margin-left: 5vw;
  }

  .pictogram h1.sukasi.sukasi-gray {
    font-size: 50vw !important;
    padding: 40vw !important;
    padding-left: 30vw !important;
    margin-left: 0;
    padding-bottom: 200vh !important;
    -ms-writing-mode: tb-rl !important;
    writing-mode: vertical-rl !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    letter-spacing: 0 !important;
  }

  .gaiyou h1 {
    margin-top: 8vh !important;
  }

  .gaiyou_img {
    width: 80vw !important;
  }

  .gaiyou_img1 {
    width: 80vw !important;
  }

  .view_more a {
    display: inline-block !important;
    transition: 0.3s !important;
    -webkit-transform: scale(1) !important;
    transform: scale(1) !important;
  }
  .view_more a:hover {
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.1) !important;
  }

  .gaiyou_img {
    -webkit-transform: scale(1) !important;
    transform: scale(1) !important;
    -webkit-transition: 0.3s ease-in-out !important;
    transition: 0.3s ease-in-out !important;
  }
  .gaiyou_img:hover {
    -webkit-transform: scale(1.04) !important;
    transform: scale(1.04) !important;
  }

  .col-lg-4 {
    margin-bottom: 10vh !important;
  }
}