@charset "UTF-8";
/*common*/
html body main {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
  background: #fff;
}

a{
	text-decoration:none!important;
}
.wrap {
  max-width: 72vw;
  padding: 0 5vw;
  margin: 0 auto;
}
.page_nav_head{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
@media screen and (max-width: 1000px) {
  .wrap {
    max-width: none;
  }
}
@media screen and (max-width: 700px) {
  .wrap {
    width: 100%;
  }
}
.page_kv {
  position: relative;
  overflow: hidden;
}
.page_kv .page_kv_in {
  margin: 0 auto;
}
.page_kv .page_kv_in h1 {
  position: absolute;
  color: #fff;
  display: inline-block;
  right: 0;
  left: 0;
  top: 5vw;
  margin: 0 auto;
  letter-spacing: 0.6rem;
  text-align: center;
}
.page_kv .page_kv_in .date {
  position: absolute;
  top: 6vw;
  right: 27vw;
  width: 7%;
}
@media screen and (max-width: 1000px) {
  .page_kv .page_kv_in h1 {
    font-size: 2.4vw;
  }
}

@media screen and (max-width: 700px) {
  .page_kv .page_kv_in h1 {
    top: 10vw;
    font-size: 6vw;
  margin: 0 auto;
	  display:inline-block;
  }
  .page_kv .page_kv_in .date {
    position: absolute;
    top: 26vw;
    right: 5vw;
    width: 18%;
  }
}
.section {
  margin-top: 6vw;
}
.concept {
  color: #00a793;
}
.flex {
  display: flex;
}
.concept .flex {
  gap: 3vw;
}
.concept .flex .textarea {
  position: relative;
  flex: 0 1 100%;
}
.concept .flex .imgarea {
  flex: 0 1 80%;
}
.sb {
  color: #ededf1;
  font-size: 7.2vw;
  font-weight: 300;
  height: auto;
  letter-spacing: 0.08em;
  line-height: 1.35;
  margin: -100px 0px 0px -35px;
  padding: 100px 0px 0px 0px;
  position: relative;
  rotate: 0deg;
  text-align: center;
  width: auto;
  writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  z-index: -1;
  max-width: calc(100% - -35px);
  justify-content: center;
}
.concept .flex .textarea .catch {
  position: absolute;
  top: 45%;
}
.concept .flex .textarea .catch h2 {
  font-size: 3.2vw;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 700px) {
  .section {
    margin-top: 10vw;
  }
  .flex {
    display: block;
  }
  .concept .flex {
    gap: 0;
  }
  .concept .flex .textarea .catch {
	top:50%;
	left:5%;}
  .concept .flex .textarea .catch h2 {
    font-size: 8vw;
    letter-spacing: 0.1em;
  }
  .sb {
    font-size: 10.2vw;
    line-height: 1.35;
    margin: -32px 0px 0px -10px;
    padding: 100px 0px 16px 0px;
  }
}
.read_text {
  margin: 6rem auto;
  text-align: center;
}
.read_text p {
  font-size: 1.6vw;
  letter-spacing: 0.2em;
  line-height: 2.2;
  position: relative;
  margin-bottom: 7vw;
}
.read_text p::after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 6vw;
  height: auto;
  border: 0.5px solid #00a793;
  bottom: -30%;
  right: 50%;
  left: 45%;
}
@media screen and (max-width: 700px) {
  .read_text p {
    font-size: 4vw;
    letter-spacing: 0.1em;
  }
}
.clublist .flex {
  justify-content: center;
  gap: 2em;
  width: 90%;
  margin: 4rem auto;
}
.clublist .flex .bnr_btn {
  box-shadow: 0 0 6px rgba(0, 167, 147, 0.2);
  transition: all 0.6s ease;
}
.clublist .flex .bnr_btn:hover {
  box-shadow: 0 0 18px rgba(0, 167, 147, 0.4);
  transition: all 0.6s ease;
}
@media screen and (max-width: 700px) {
  .clublist .flex {
    width: 100%;
  }
  .clublist .flex .bnr_btn {
    margin-bottom: 4rem;
  }
  .read_text p::after {
    display: none;
  }
}
.line hr {
  border: 0.5px solid #00a793;
}
.attlist .flex {
  margin: 0 auto;
  justify-content: space-around;
  align-items: flex-start;
  gap: 4vw;
}
.attlist .flex .att {
  text-align: center;
  width: 30%;
}
.attlist .flex .att h3 {
  font-size: 2.8vw;
  letter-spacing: 0.01em;
  color: #00a793;
  margin-bottom: 2rem;
}
.attlist .flex .att > div {
  margin-bottom: 2rem;
  object-fit: cover;
  width: 100%;
  height: auto;
}
.attlist .flex .att p {
  font-size: 1vw;
  font-feature-settings: "palt";
}
@media screen and (max-width: 700px) {
  .attlist .flex .att {
    width: 100%;
    margin-bottom: 8rem;
  }
  .attlist .flex .att h3 {
    font-size: 7.2vw;
    margin-bottom: 0;
  }
  .attlist .flex .att > div {
    margin-bottom: 0;
    margin-top: -8rem;
  }
  .attlist .flex .att p {
    font-size: 5vw;
    margin-top: -6rem;
  }
  .attlist .flex .att:nth-of-type(3) p {
    margin-top: 0;
  }
  .attlist .flex .att:nth-of-type(3) > div {
    margin-top: 0;
  }
}
.styling .flex .imgarea {
  gap: 3vw;
}
.styling .flex .imgarea h4 {
  color: #00a793;
  font-size: 2vw;
}
.styling .flex .imgarea p {
  font-size: 1.2vw;
}
.styling .flex .imgarea .btn_area {
  margin: 0 auto;
  text-align: center;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  margin-top: 4rem;
}
.styling .flex .imgarea .btn_area a {
  color: #fff;
  background-color: #00a793;
  padding: 1.2rem 2.4rem;
  border-radius: 36px;
  transition: all 0.6s ease;
}
.styling .flex .imgarea .btn_area a:hover {
  color: #00a793;
  background-color: #fff;
  border: 2px solid #00a793;
  transition: all 0.6s ease;
}
@media screen and (max-width: 1000px) {
.styling .flex .imgarea .btn_area a {
  font-size:2rem;
}
}

@media screen and (max-width: 700px) {
  .styling_sb {
    text-align: left;
    margin: 0;
    padding: 0;
    writing-mode: horizontal-tb;
    -webkit-writing-mode: horizontal-tb;
  }
  .styling .imgarea > div {
    margin-bottom: 6rem;
  }
  .styling .flex .imgarea h4 {
    font-size: 6vw;
  }
  .styling .flex .imgarea p {
    font-size: 4.2vw;
  }
  .styling .flex .imgarea .btn_area a {
    font-size: 5vw;
  }
}
.link {
  margin-top: 12vw;
}
.link .linksb {
  color: #fff;
  background-color: #00a793;
  gap: 2vw;
  padding-bottom: 3vw;
  margin-bottom: 10vw;
}
.link .flex .link_area {
  flex: 0 1 100%;
}
.link .flex .link_area .link_area_text {
  position: relative;
  width: 50%;
  padding: 3em 0 0;
  text-align: center;
}
.link .flex .link_area .link_area_text .link_area_read {
  margin-bottom: 4rem;
}
.link .flex .link_area .link_area_text a {
  color: #fff;
  background-color: #00a793;
  border: 1px solid #fff;
  border-radius: 34px;
  padding: 1rem 2.6rem;
  margin-top: 2rem;
  box-shadow: 0 0 8px rgb(5, 125, 111, 0.6);
  transition: all 0.6s ease;
}
.link .flex .link_area .link_area_text a:hover {
  color: #00a793;
  background-color: #fff;
  transition: all 0.6s ease;
}
.link .flex .link_area .link_area_img {
  position: relative;
  width: 50%;
  margin-top: -4rem;
}
.notes {
  position: relative;
}
.link_notes {
  font-size: 70%;
  position: relative;
  bottom: -1vw;
}
@media screen and (max-width: 1000px) {
.link .flex .link_area .link_area_text {
  padding: 1.6em 0 0;
}
  .link .flex .link_area .link_area_text .link_area_read, .link .flex .link_area .link_area_text a {
    font-size: 2vw;
  }
.link .flex .link_area .link_area_text .link_area_read {
  margin-bottom: 2rem;
}
  .link_notes {
    font-size: 40%;
  }
.link .flex .link_area .link_area_img {
  margin-top: -2rem;
}
	
}

@media screen and (max-width: 700px) {
  .link .flex .link_area .link_area_text {
    width: 100%;
    padding: 3em 0 2em 0;
  }
  .link .flex .link_area .link_area_text .link_area_read, .link .flex .link_area .link_area_text a {
    font-size: 4.4vw;
  }
.link .flex .link_area .link_area_text .link_area_read {
  margin-bottom: 4rem;
}
  .link .flex .link_area .link_area_img {
    position: relative;
    width: 100%;
    margin-top: 3rem;
  }
  .link_notes {
    font-size: 80%;
    bottom: -4vw;
  }
  .link .linksb {
    padding-bottom: 0vw;
  }
}
.ecarea {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.ecarea a {
  display: block;
  height: 20vw;
  background-image: url("../img/ec.jpg");
  background-repeat: no-repeat;
  background-size: cover;
background-position:center;
  padding-top: 5vw;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  justify-content: center;
  color: #fff;
  position: relative;
  transition: transform .6s ease;
}
.ecarea a::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  left: 0;
  top: 0;
  position: absolute;
  transition: all ease 0.3s;
}
/*.ecarea a:hover{
  transform: scale(1.1);
transition: transform .6s ease;
}*/
.ecarea a > div {
  position: relative;
  display: inline-block;
  margin: 0 auto;
}
.ecarea a .ecarea_inner {
  justify-content: center;
  align-items: center;
}
.ecarea .ecarea_inner p {
  font-size: 2.2vw;
  margin-bottom: 2rem;
}
.ecarea .ecarea_inner .btn {
  border: 1px solid #fff;
  padding: 0.2em 3em;
  display: block;
  transition: all 0.6s ease;
  box-shadow: 0 0 24px rgb(0, 0, 0, 0.4);
}
.ecarea .ecarea_inner .btn:hover {
  transform: scale(0.9);
  transition: all 0.6s ease;
}
.ecarea .ecarea_inner i {
  color: #fff;
  font-style: normal;
  font-size: 2vw;
  letter-spacing: 0.1em;
}
.ecarea .ecarea_inner svg {
  margin-right: 0.6vw;
  width: 1.8vw;
  height: auto;
}
@media screen and (max-width: 1000px) {
.ecarea a {
  height: 25vw;
}
.ecarea .ecarea_inner p {
  font-size: 3.2vw;
}
.ecarea .ecarea_inner i {
  font-size: 2.4vw;
}
}

@media screen and (max-width: 700px) {
  .ecarea {
    margin-top: 16vw;
  }
  .ecarea a {
    height: 40vw;
    background-position: center;
    padding-top: 6vw;
  }
  .ecarea .ecarea_inner p {
    font-size: 5.6vw;
    margin-bottom: 1rem;
  }
  .ecarea .ecarea_inner i {
    font-size: 4vw;
  }
  .ecarea .ecarea_inner svg {
    width: 4vw;
  }
}


/*MOVIE*/
@media screen and (max-width: 1100px) {
  .top_movie iframe {
    height: calc(70vw * 0.562);
  }
}
@media screen and (max-width: 1000px) {
  .top_movie iframe {
    height: calc(73vw * 0.616);
  }
}
@media screen and (max-width: 700px) {
  .top_movie {
    padding-bottom: 10vw;
  }
}
.xxio_movie_area {
  color: #fff;
}
.xxio_movie_area h2 {
  font-weight: normal;
  font-style: italic;
  text-align: center;
  margin-bottom: 4vw;
}
.xxio_movie_area .xxio_movie_area_in {
  display: flex;
  flex-wrap: wrap;
}
.xxio_movie_area .xxio_movie_area_in > * {
  margin-bottom: 5vw;
  /*      flex: 0 1 50%;　*/
  box-sizing: border-box;
}
.xxio_movie_area .xxio_movie_area_in > * a {
  display: block;
  color: #fff;
  font-size: 85%;
  text-decoration: none;
}
.xxio_movie_area .xxio_movie_area_in > * a > div {
  position: relative;
  margin-bottom: 0.5vw;
}
.xxio_movie_area .xxio_movie_area_in > * a > div > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.xxio_movie_area .xxio_movie_area_in > * a > div > div button {
  color: #fff;
  border: 1px solid #fff;
  border-radius: 1000px;
  padding: 0.2vw 3vw;
  font-size: 90%;
  background-color: transparent;
  display: flex;
  align-items: center;
  transition: all ease 0.3s;
}
.xxio_movie_area .xxio_movie_area_in > * a > div > div button svg {
  margin-right: 0.3vw;
}
.xxio_movie_area .xxio_movie_area_in > * a:hover > div > div button {
  background-color: #e20030;
  border-color: #e20030;
}
.xxio_movie_area .xxio_movie_area_in {
  display: block;
}
.xxio_movie_area .xxio_movie_area_in > * a {
  font-size: 80%;
}
.xxio_movie_area .xxio_movie_area_in > * a > div {
  margin-bottom: 1vw;
}
.cp_area {
  text-align: center;
  margin-bottom: 5vw;
  box-sizing: border-box;
}
.cp_area img {
  width: 45%;
  margin-bottom: 1vw;
}
.cp_area a:hover {
  text-decoration: none;
  opacity: 0.7;
}
@media screen and (max-width: 700px) {
  .cp_area img {
    width: 90%;
    margin-bottom: 2vw;
  }
}
.page_headerLd.page_header .page_nav:before {
  background-image: url(../../img/nav_bg.webp);
}
/*# sourceMappingURL=style.css.map */