/*
Theme Name : kgc_1
*/
@charset "UTF-8";

/*-------------------------------------------------------------------------------------------------------------------
common
---------------------------------------------------------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;700&display=swap');

:root {
	--base: #080907;
  --text: #C7CBC4;
  --link: #fff;
  --ac: #586D48;
  --ac2: #8fa47e;
  --blue:#94ADFF;
  --red: #f47165;
  --yellow:#EED197;
  --scrollbar: calc(100vw - 100%)
  }
html {
  font-family:  'Noto Serif JP', serif;
  letter-spacing: 0.05em;
  line-height: 2;
  font-weight: 400;
  font-size: 20px;
  text-align: justify;
  background: var(--base);
  color: var(--text);
  box-sizing: border-box;
}
body{
  max-width: 1920px;
  margin: 0 auto;
}
main{
  padding-bottom: 80px;
}
footer{
  padding: 80px 6vw 24px;
  background: var(--base);
}
h1 {
  padding: 6em 0 2em;
}
h2,h3,h4,h5,h6{
  padding: 3em 0 1em;
}
p,ul,ol {
  margin-bottom: 2em;
}
ol{
  list-style: decimal-leading-zero;
}
ol li{
  margin-left: 2em;
}
h1{
  font-size: 2em;
  margin-left: 6vw;
  position: relative;
}
h1::after{
  font-family: 'Cormorant Garamond', serif;
}
h2{
  font-size: 1.6em;
  position: relative;
}
p{
  text-align: justify;
  text-shadow: 2px 2px 2px rgba(0 0 0 / 0.7);
}
a{
  color: var(--link);
  position: relative;
}
/* body main figure{
  margin: 0;
} */

.logo-box > a{
  line-height: 0;
}
.link-btn{
  display: inline-block;
  position: relative;
  padding: 16px 120px 16px 24px;
  box-sizing: border-box;
  border: 1px solid var(--link);
  transition: border 0.4s;
  cursor: pointer;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.link-btn:hover{
  border: 1px solid transparent;
}
.link-btn:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.4s;
}
.link-btn:hover:after{
  right: 16px;
}
.link-btn span{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  top: 0;
  left: 0;
}
.link-btn > span:before{
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 0;
  background: var(--link);
  transition: 0.4s;
}
.link-btn:hover > span::before{
  width: 100%;
}
.link-btn > span:after{
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  right: 0;
  top: 0;
  background: var(--link);
  transition: 0.4s;
}
.link-btn:hover > span::after{
  width: 100%;
}
.link-btn > span > span:before{
  content: "";
  width: 1px;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  background: var(--link);
  transition: 0.4s;
}
.link-btn:hover > span > span::before{
  height: 100%;
}
.link-btn > span > span:after{
  content: "";
  width: 1px;
  height: 0;
  position: absolute;
  right: 0;
  bottom: 0;
  background: var(--link);
  transition: 0.4s;
}
.link-btn:hover > span > span::after{
  height: 100%;
}
section{
  margin-bottom: 160px;
}
.img-area{
  position: relative;
}
.img-area figure{
  overflow-x: hidden;
  margin: 0;
}
.img-area::after{
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(8,9,7,0.2) 35%, rgba(8,9,7,1) 100%);
}
.text-area{
  position: relative;
  z-index: 99;
  max-width: 38vw;
  margin-left: 6vw;
  margin-right: 6vw;
  box-sizing: border-box;
}
/*-------------------------------------------------------------------------------------------------------------------
header
---------------------------------------------------------------------------------------------------------------------*/
header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  height: 80px;
  top: 0;
  left: 0;
  width: 100%;
  padding: 24px 1em 8px;
  box-sizing: border-box;
  /* backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px); */
  z-index: 999;
}
header > div{
  display: flex;
  gap: 1em;
  align-items: center;
}
header > div:first-of-type p{
margin-bottom: 0;
}
.header-logo{
  width: 40px;
  height: 40px;
}
.menu-btn{
  position: relative;
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.menu-btn p{
  text-transform: uppercase;
  font-size: 14px;
  margin-top: 24px;
  margin-bottom: 0;
  color: var(--link);
  text-shadow: none;
}
.menu-btn span{
  width: 40px;
  height: 2px;
  background: var(--link);
  position: absolute;
}
/* .menu-btn span:first-of-type{
  top: 6px;
}
.menu-btn span:last-of-type{
  top: 18px;
} */
.menu-btn span:first-of-type{
  top: 4px;
}
.menu-btn span:last-of-type{
  top: 16px;
}
.menu-close{
  position: relative;
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: fixed;
  top: 24px;
  right: 1em;
  transition: opacity 0.3s;
  display: none;
  opacity: 0;
  z-index: 99999;
}
.menu-close span{
  width: 40px;
  height: 2px;
  background: var(--link);
  position: absolute;
}
.menu-close span:first-of-type{
  top: 24px;
  left: 4px;
  transform: rotate(35deg);
}
.menu-close span:last-of-type{
  top: 24px;
  left: 4px;
  transform: rotate(-35deg);
}
.nav{
  display: none;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  padding: 96px 6vw;
  box-sizing: border-box;
  background: rgba(0 0 0 / 0.85);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  z-index: 9999;
  overflow-y: scroll;
  opacity: 0;
  transition: opacity 0.3s, filter 0.3s;
  filter: blur(10px);
}
.nav > div{
  display: flex;
  flex-wrap: wrap;
  gap: 0 40px;
}
.nav > div > div{
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 40px;
  align-items: center;
}
.nav > div > ul{
  width: calc(25% - 30px);
  min-width: 300px;
}
.nav > div > ul > li:first-of-type{
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 700;
  color: var(--ac);
}
.nav > div > ul > li{
  margin-bottom: 16px;
  position: relative;
}
.nav > div > ul > li:not(:first-of-type):before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.nav > div > ul > li:hover:before{
  width: 100%;
}
.nav > div > ul > li:not(:first-of-type):after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 12px;
  transition: 0.4s;
}
.nav > div > ul > li:hover:after{
  right: 16px;
}
.nav > div > ul > li span {
  margin-left: 16px;
}
.nav > div > ul > li a {
  width: calc(100% - 24px);
  display: inline-block;
  padding-bottom: 8px;
}
.nav > div > div > p {
  font-size: 32px;
  margin-bottom: 0;
}
/* .nav .link-btn{
  width: calc(25% - 30px);
  min-width: 320px;
} */
.btn-r span{
  background: rgba(0 0 0 / 0.1);
}
.member-btn {
  padding: 8px 48px 8px 16px;
}
.member-btn:after {
  right: 16px;
}
.member-btn:hover::after {
  right: 12px;
}
/* .member-btn::after{
  top: 17px;
} */
.fixed-icon{
  z-index: 99999;
}
/*-------------------------------------------------------------------------------------------------------------------
footer
---------------------------------------------------------------------------------------------------------------------*/
.footernav{
  margin-bottom: 80px;
}
.footernav > div{
  display: flex;
  flex-wrap: wrap;
  gap: 0 40px;
}
.footernav > div > ul{
  width: calc(25% - 30px);
  min-width: 300px;
}
.footernav > div > ul > li:first-of-type{
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 700;
  color: var(--ac);
}
.address > ul > li:last-of-type,
.footernav > div > ul > li{
  margin-bottom: 16px;
  position: relative;
}
.address > ul > li:last-of-type:before,
.footernav > div > ul > li:not(:first-of-type):before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.address > ul > li:last-of-type:hover:before,
.footernav > div > ul > li:hover:before{
  width: 100%;
}
.address > ul > li:last-of-type:after,
.footernav > div > ul > li:not(:first-of-type):after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 8px;
  transition: 0.4s;
}
.address > ul > li:last-of-type:hover:after,
.footernav > div > ul > li:hover:after{
  right: 16px;
}
.footernav > div > ul > li span {
  margin-left: 16px;
}
.footernav > div > ul > li a {
  width: calc(100% - 24px);
  display: inline-block;
  padding-bottom: 8px;
}
.footernav > div > div > p {
  font-size: 32px;
  margin-bottom: 0;
}
.address{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.address ul li:first-of-type{
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 8px;
}
.address ul li:nth-of-type(2){
  margin-bottom: 80px;
}
.address ul li:nth-of-type(3) span{
  font-size: 32px;
}
.address > ul > li:last-of-type{
  padding-bottom: 4px;
}
.address > ul > li:last-of-type a{
  padding-right: 80px;
}
/*-------------------------------------------------------------------------------------------------------------------
top
---------------------------------------------------------------------------------------------------------------------*/
.icon-btn{
  font-size: 14px;
  display: block;
  text-align: center;
  padding-top: 24px;
}
.icon_1 {
  background: url(img/weather-icon.svg);
  background-repeat: no-repeat;
  background-size: 26px;
  background-position: center top;
}
.icon_2{
  background: url(img/member-icon.svg);
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: center top 1px;
}
.icon_3{
  background: url(img/vr-logo.svg);
  background-repeat: no-repeat;
  background-size: 44px;
  background-position: center top -9px;
}
.scroll-icon {
  position: absolute;
  width: 24px;
  height: 32px;
  top: 85vh;
  left: 50%;
  transform: translateX(-50%) rotate(90deg);
  background: url(img/arrow-w.svg);
  background-size: contain;
  background-repeat: no-repeat;
  transition: opacity 1s;

  animation-name: anime;
  animation-fill-mode:backwards;
  animation-duration:3s;
  animation-iteration-count:infinite;
  animation-timing-function:ease;
  animation-delay: 0.5s;
  animation-direction:normal;
}
@keyframes anime{
  0% {
    top: 85svh;
  }
  50% {
    top: 88svh;
  }
  100% {
    top: 85svh;
  }
}


.firstview{
  width: 100%;
  height: 130vh;
  overflow: hidden;
  position: relative;
}

.firstview video{
  height: 140vh;
}
  
.video-box {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 130vh;
}
.video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 110%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.firstview::after{
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(8,9,7,0.2) 65%, rgba(8,9,7,1) 100%);
}
/* overlay */

.overlay::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  /* background-image: url(img/overlay.png); */
  background-color: rgba(0,0,0,.3);
  background-size: 2px 2px;
}
.firstview > .text-firstview{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100vh;
  transform: translate(-50%,-22%);
  z-index: 10;
  font-size: 40px;
  color: #fff;
}
.text-firstview h1{
  font-size: 1em;
  font-weight: 700;
  margin-bottom: 8px;
  padding: 0;
  margin: 0 0 0px;
  text-align: center;
}
.text-firstview h1::after{
  content: "Koga Golf Club";
  position: absolute;
  font-size: 0.8em;
  top: -1.9em;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 700;
  white-space: nowrap;
}
.text-firstview p{
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.8em;
  font-weight: 700;
  margin-top: -10px;
  text-align: center;
  text-shadow: none;
}
.top{
  overflow: hidden;
}
.top h2,
.top h3{
  padding-bottom: 2em;
  position: relative;
}
.top h2::after,
.top h3:after{
  font-family: 'Cormorant Garamond', serif;
  color: var(--ac);
  position: absolute;
  font-size: 1.2em;
  top: 24px;
  left: 0;
  font-weight: 700;
}
.top .section_2 h2::after{
  content: "News";

}
.top .section_2 .img-area{
  width: 50vw;
  margin: -960px 0 0 auto;
}
.top .section_2 .img-area figure img{
  width: 100%;
  height: 1080px;
  object-fit:cover;
  object-position: bottom;
}
.top .section_2 .link-btn {
  margin-bottom: 24px;
}
.top .section_2 ul{
  max-width: 640px;
}
.top .section_2 ul > li{
  margin-bottom: 2em;
  position: relative;
}
.top .section_2 ul > li:before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.top .section_2 ul > li:hover:before{
  width: 100%;
}
.top .section_2 ul > li:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.4s;
}
.top .section_2 ul > li:hover:after{
  right: 16px;
}
.top .section_2 ul > li span,
.top .section_2 ul > li time,
.news-list > li span,
.news-list > li time {
  display: inline-block;
}
.top .section_2 ul > li a,
.news-list > li a {
  width: calc(100% - 64px);
  display: flex;
  padding-bottom: 8px;
  flex-direction: column;
}
.top .section_2 ul > li .label {
  display: none;
}
.top .section_2 ul time,
.news-list > li time{
  margin-right: 16px;
  font-size: 0.8em;
}
.top .section_2 .top-illust img {
  position: absolute;
  right: 0;
  margin-top: -200px;
  width: auto;
  height: 480px;
}
.top .section_2{
  margin-bottom: 720px;
}
.top h4{
  font-size: 1.2em;
  padding-top: 2em;
  padding-bottom: 1em;
}
.top .section_5 .text-area .vr-btn {
  padding-right: 80px;
  margin-right: 8px;
 }

.top .section_5 .text-area .vr-btn:nth-last-of-type(2) {
  width: 172px;
 }
 .top .section_5 .text-area .vr-btn:last-of-type {
  width: 120px;
 }
.top .section_3{
  margin-top: 120px;
}
.top .section_3 h2::after{
  content: "About";
}
.top .section_3 .text-area {
    transform: translateY(180px);
}
.top .section_3 .img-area{
  width: 44vw;
  margin: -680px 0 0 auto;
}
.top .section_3 .img-area{
  width: 75vw;
  margin: -720px 0 0 auto;
  /* filter: blur(4px); */
}
.top .section_3 .img-area:after{
  background: linear-gradient(180deg, rgba(8,9,7,0.2) 35%, rgba(8,9,7,1) 100%),rgba(0,0,0,.65);
}
.top .section_3 .img-area figure img{
  width: 100%;
  height: 1280px;
  object-fit:cover;
}
.top h3{
  font-size: 1.6em;
}
.top .section_4 .text-area{
  margin: -240px 6vw 0 auto;
}
.top .section_4 .img-area{
  width: 88%;
  margin-top: -80px;
}
.top .section_4 .img-area img{
  width: 100%;
  height: 880px;
  object-fit:cover;
}
.top .section_4 h3::after{
  content: "Club House";
}
.top .section_5 h3::after{
  content: "Course";
}
.top .section_5{
  margin-top: 200px;
}
.top .section_5 > div > .img-area:nth-child(1){
  margin-top: -320px;
  width: 100%;
}
.top .section_5 > div > .img-area:nth-child(1) img{
  width: 100%;
  height: 1360px;
  object-fit:cover;
}
.top .section_5 > div > .img-area:nth-child(2){
  width: 44vw;
  margin: 120px 6vw 0 auto;
}
.top .section_5 > div > .img-area:nth-child(2) img{
  width: 100%;
  height: 1000px;
  object-fit:cover;
  object-position: right bottom;
}
.top .section_5 .text-area{
  margin-top: -1000px;
}
.top .section_5 .text-area .link-btn{
  margin-bottom: 24px;
  width: 300px;
}
.top .section_6{
  margin-top: 240px;
  margin-bottom: 400px;
}
.top .section_6 h2::after{
  content: "History";
}
.top .section_6 > div > .img-area:first-of-type{
  width: 46vw;
  filter: blur(4px);
}
.top .section_6 > div > .img-area:first-of-type:after{
  background: linear-gradient(180deg, rgba(8,9,7,0.2) 35%, rgba(8,9,7,1) 100%),rgba(0,0,0,.5);
}
.top .section_6 > div > .img-area:first-of-type img{
  width: 100%;
  height: 500px;
  object-fit:cover;
}
.top .section_6 .text-area{
  margin: -780px 6vw 0 auto;

}

.top .section_6 > div > .img-area:nth-of-type(2) {
  width: 44vw;
  margin-left: 6vw;
}
.top .section_6 > div > .img-area:nth-of-type(2) img {
  width: 100%;
  height: 560px;
  object-fit:cover;
}

.top-flex > div{
  display: flex;
  gap: 40px;
}
.top-flex > div{
  display: flex;
  gap: 40px;
}
.top-flex > div > div{
  max-width: 100%;
}
.top-flex .img-area{
  width: 16em;
}
.top-flex .img-area{
  width: 100%;
  object-fit:cover;
}


#loading {
  width: 100vw;
  height: 100vh;
  height: 100svh;
  transition: all 1s;
  background-color: var(--base);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
.spinner {
  width: 64px;
  height: 64px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url(img/kogagc-logo.svg);
  /* background-color: #fff;
  border-radius: 100%; */
  /* animation: sk-scaleout 1.0s infinite ease-in-out; */
}
/* ローディングアニメーション */
/* @keyframes sk-scaleout {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1.0);
    opacity: 0;
  }
} */
.loaded {
  opacity: 0;
  visibility: hidden;
}

/*-------------------------------------------------------------------------------------------------------------------
subpage
---------------------------------------------------------------------------------------------------------------------*/
.inpage-link {
  margin-left: 6vw;
}
.inpage-link li,
.inpage-link-sp li{
  max-width: 320px;
  margin-bottom: 16px;
  /* padding-bottom: 8px; */
  color: var(--link);
  position: relative;
  cursor: pointer;
}
.inpage-link > li:before,
.inpage-link-sp > li:before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.inpage-link > li:hover:before,
.inpage-link-sp > li:hover::before{
  width: 100%;
}
.inpage-link > li:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 8px;
  top: 8px;
  transform: rotate(90deg);
  transition: 0.4s;
}
.inpage-link > li:hover:after{
  top: 12px;
}
.news h1::after,
.page h1::after{
  font-family: 'Cormorant Garamond', serif;
  color: var(--ac);
  position: absolute;
  font-size: 0.8em;
  top: 168px;
  left: 0;
  font-weight: 700;
}
.yard-btn_2{
  display: none;
}

/*-------------------------------------------------------------------------------------------------------------------
news
---------------------------------------------------------------------------------------------------------------------*/
.news:after {
  content: "";
  top: 0px;
  position: fixed;
  width: 100%;
  height: 400px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/bg_3.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: center;
}
.news h1{
    padding-bottom: 0;
    margin-right: 6vw;
}
.news h1 br{
  display: none;
}
.single h1{
  padding-bottom: 2em;
}
.news h1::after{
  content: "News";
}
.latestnews h2 time{
  display: block;
  font-size: 20px;
  margin-bottom: 8px;
}
/* .latestnews .wp-block-image img{
  width: 40em;
  max-width: 100%;
} */
/* .news-list time{
  margin-right: 16px;
  padding-left: 8px;
} */
.news > div{
  padding-left: 6vw;
  padding-right: 6vw;
}
.news p{
  max-width: 40em;
}
.news-list{
  margin-top: 80px;
}
.news-list li{
  max-width: 40em;
  min-width: 320px;
  margin-bottom: 2em;
  color: var(--link);
  position: relative;
  cursor: pointer;
}
.news-list > li:before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.news-list > li:hover:before{
  width: 100%;
}
.news-list > li:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.4s;
}
.news-list > li:hover:after{
  right: 16px;
}
/* .news-list > li a{
  width: 100%;
  display: inline-block;
} */
.nav-links ul{
  display: flex;
  justify-content: center;
}
.page-numbers li{
  min-width: 40px;
  text-align: center;
}
.nav-links ul a{
  display: inline-block;
  width: 100%;
}
.next,
.prev{
  min-width: 80px;
}
.current{
  color: #777;
}
.single p,
.single figure{
  padding-left: 6vw;
  padding-right: 6vw;
}
.single time{
  font-size: 24px;
  margin-right: 16px;
}
.single h1 time{
  font-size: 20px;
  display: block;
  margin-bottom: 8px;
}
.single p{
  max-width: 40em;
}
.single-menu{
  display: flex;
  justify-content: center;
  margin-top: 120px;
}
.single-menu a{
  width: 80px;
  text-align: center;
}
.single h1::after{
  content: none;
}
.single::after{
  content: none;
}
.single ul{
  margin-left: 6vw;
}
.nextcontents-btn {
  transform: translateX(-50%);
  left: 50%;
  margin-top: 80px;
  min-width: 30%;
}
/*-------------------------------------------------------------------------------------------------------------------
facility
---------------------------------------------------------------------------------------------------------------------*/
.facility section:not(.section_6) {
  margin-bottom: 240px;
}

.facility:after {
  content: "";
  top: 0px;
  position: absolute;
  width: 100%;
  height: 560px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/bg_11.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.facility h1::after{
  content: "Club House";
}

.facility .section_2 .img-area figure img{
  width: 100%;
  height: 560px;
  object-fit:cover;
}
.facility .section_2 .text-area{
  margin: -320px 6vw 0 auto;
}
.facility-flex {
  width: 100%;
  margin: 0 0 0 auto;
}
.facility-flex > div{
  display: flex;
  gap:40px;
}
.facility .section_3 .img-area:first-of-type{
  width: calc(94vw + 20px);
  filter: blur(8px);
  margin-left: -20px;
}
.facility .section_3 .img-area:first-of-type figure img{
  width: 100%;
  height: 840px;
  object-fit:cover;
}
.facility .section_3{
  margin-bottom: 400px;
}
.facility .section_3 .img-area:nth-of-type(2){
  width: 50vw;
  margin: -400px 0 0 auto;
}
.facility .section_3 .img-area:nth-of-type(2) figure img{
  width: 100%;
  height: 1080px;
  object-fit:cover;
}
.facility .section_3 .img-area:nth-of-type(2)::after {
  background: linear-gradient(180deg, rgba(8,9,7,0) 50%, rgba(8,9,7,1) 100%);
}
.facility .section_3 .text-area{
  margin-top: -800px;
}
.facility .section_4{
  margin-top: 560px;
}
.facility .section_4 .img-area{
  width: 100%;
  margin-top: 320px;
}
.facility .section_4 .img-area figure img{
  width: 100%;
  height: 880px;
  object-fit:cover;
}
.facility .section_4 .img-area:nth-of-type(2) figure img {
  width: 100%;
  height: 880px;
  object-fit: cover;
  object-position: right bottom;
}
.facility .section_4 > div > .img-area:nth-of-type(2) {
  width: 44vw;
  margin-left: 6vw;
  margin-top: -320px;
}
.facility .section_4 .text-area {
  margin: -480px 6vw 0 auto;
}
.facility .section_5{
    display: none;
}
.facility .section_6{
  margin-top: 320px;
}
.facility .section_6 .img-area{
  width: 75vw;
  margin: 0 0 0 auto;
}
.facility .section_6 .img-area figure img{
  width: 100%;
  height: 640px;
  object-fit:cover;
}
.facility-flex > div {
  flex-direction: column;
}
.facility .section_2 .img-area {
  margin: 0;
}
.facility .section_2 .img-area figure img {
  height: 880px;
}
.facility .section_2 .img-area:last-of-type figure img {
  height: 560px;
}
.facility .section_2 .img-area:first-of-type {
  width: 94vw;
  margin: 0 0 80px auto;
}
.facility .section_2 .img-area:last-of-type {
  width: 80vw;
  margin-top: -240px;
  margin-bottom: 80px;
}

/*-------------------------------------------------------------------------------------------------------------------
restaurant
---------------------------------------------------------------------------------------------------------------------*/
.restaurant:after {
  content: "";
  top: 0px;
  position: absolute;
  width: 100%;
  height: 560px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/restaurant-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}

.restaurant h1{
  margin-top: 80px;
}
.restaurant h1::after{
  content: "Restaurant";
}
.restaurant .inpage-link{
  display: none;
}
.restaurant section{
  margin-bottom: 40px;
}
.restaurant .section_1 p{
 margin-bottom: 80px; 
}
.restaurant .section_2,
.restaurant .section_3{
  padding-left: 6vw;
  padding-right: 6vw;
}
.restaurant .section_4{
  margin-top: 120px;
}
.restaurant .section_4 .text-area{
  margin: 0 0 0 auto;
}
.restaurant-menu > div{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.restaurant-menu > div > div{
  width: 32.4%;
  min-width: 280px;
}
.restaurant-menu figure{
  width: 100%;
  height: 300px;
  overflow: hidden;
  margin-bottom: 16px;
}
.restaurant-menu figure img{
  width: 100%;
  height: 300px;
  object-fit:cover; 
}
.restaurant-menu span:last-of-type{
  margin-left: 40px;
}
.restaurant footer{
  margin-top: -400px;
}
/*-------------------------------------------------------------------------------------------------------------------
course
---------------------------------------------------------------------------------------------------------------------*/
.course section:not(.section_5){
  margin-bottom: 400px;
}
.course:after {
  content: "";
  top: 0px;
  position: absolute;
  width: 100%;
  height: 560px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/course-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}

.course h1::after{
  content: "Course";

}
.course .section_2 .img-area:last-of-type {
  width: 80vw;
  margin: -560px 0 0 auto;
  z-index: -1;
}
.course .section_2 .img-area:last-of-type figure img{
  width: 100%;
  height: 880px;
  object-fit:cover;
}
.course .section_3{
  margin-top: 640px;
}
.course .section_3 .text-area {
  margin: 0 6vw 0 auto;
  transform: translateY(380px);
}
.course .section_3 .img-area:nth-last-of-type(2) {
  width: 64vw;
  margin: -720px 12vw 0 auto;
}
.course .section_3 .img-area:nth-last-of-type(2) img{
  width: 100%;
  height: 640px;
  object-position: bottom;
  object-fit: cover;
  filter: blur(4px);
}
.course .section_3 .img-area:last-of-type {
  width: 50vw;
  margin-top: -64px;
}
.course .section_3 .img-area:last-of-type img{
  width: 100%;
  height: 960px;
  object-fit: cover;
  object-position: right;
}
.course .section_4 .img-area {
  width: 80vw;
  margin: -860px 0 0 auto;
}
.course .section_4 .img-area img{
  width: 100%;
  height: 640px;
  object-fit: cover;
  object-position: bottom;
}
.course .section_4 .text-area {
  transform: translateY(-120px);
}
.course .section_4{
  margin-bottom: 560px;
}
.course .section_5{
  margin-top: 440px;
}
.course .section_5 .img-area {
  width: 100%;
  margin: -480px 0 0 auto;
}
.course .section_5 .img-area:nth-of-type(2) img{
  width: 100%;
  height: 880px;
  object-fit: cover;
  filter: blur(6px);
}
.course .section_5 > div > div:last-of-type {
  width: 30vw;
  margin: -280px 0 0 6vw;
  object-position: top;
}
.course .section_5 > div > div:last-of-type img{
  width: 100%;
  height: 800px;
  object-fit: cover;
}
.course .section_5 .text-area {
  transform: translateY(680px);
  margin: 0 6vw 0 auto;
}
.course .wp-block-image figcaption {
  margin-top: 0.3em;
  margin-bottom: 1em;
}
.course-flex > div {
  display: flex;
  transform: translateY(400px);
}
.mr-ueda{
  position: relative;
  width: 160px;
  height: 240px;
  z-index: 10;
  margin-top: 200px;
}
.mr-ueda img{
  width: 100%;
  height: 240px;
  object-fit:cover;
}
.course-flex .text-area p{
  margin-bottom: 0;
}
.course .section_5 > div > div:last-of-type {
  width: 38vw;
}
.course .section_5 .link-btn {
  margin-bottom: 24px;
}
/*-------------------------------------------------------------------------------------------------------------------
each hole
---------------------------------------------------------------------------------------------------------------------*/

.eachhole section{
  margin-bottom: 400px;
}
.eachhole h1{
  padding-bottom: 32px;
}
.eachhole h1::after{
  content: "Each Hole";
   /* top: 106px; */
}
.eachhole .section_1 {
  position: sticky;
  top: 0;
  left: 0;
  width: 360px;
  height: 100vh;
  margin-bottom: 0;
}
.eachhole .section_2 {
  margin-left: calc(380px + 6vw);
  padding-top: 200px;
  margin-top: -100vh;
}
.eachhole .section_2 > div > div{
  margin-bottom: 320px;
}
.eachhole .inpage-link{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 240px;
    padding-right: 0;
    text-align: center;
}
.eachhole .inpage-link li{
  width: 30%;
  margin-bottom: 0;
}
.eachhole .inpage-link li:after{
  display: none;
}
.eachhole .inpage-link li span{
  font-size: 14px;
  padding-left: 4px;
}
/* .eachhole .inpage-link .holescroll_7,
.eachhole .inpage-link .holescroll_8,
.eachhole .inpage-link .holescroll_9{
  margin-bottom: 24px;
} */
.inpage-link-sp{
  display: none;
}
.img-hole{
  position: relative;
  width: calc(100% - 210px);
  margin: 0 0 0 auto;
}
.img-hole figure{
  overflow-x: hidden;
  margin: 0;
}
.img-hole::after{
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(8,9,7,0.2) 35%, rgba(8,9,7,1) 100%);
}
.img-hole figure img {
  width: 100%;
  height: 560px;
  object-fit: cover;
}
.hole-data {
  width: 28em;
  max-width: calc(100% - 6vw);
  position: relative;
  margin-top: -160px;
}

.hole-data li:not(:last-of-type){
  font-size: 24px;
  font-family: 'Cormorant Garamond', serif;
  display: inline-block;
}
.hole-data li:nth-of-type(1),
.hole-data li:nth-of-type(2){
  margin-right: 24px;
}
.hole-data li:first-of-type{
  position: relative;
  font-size: 40px;
}
.hole-data li:first-of-type span{
  font-size: 80px;
}
.hole-data span{
  font-size: 48px;
  margin-left: 8px;
}
.eachhole .section_1 > p{
  text-transform: uppercase;
  margin-left: 6vw;
}
.yard{
  display: none;
  position: fixed;
  padding: 48px 4%;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0 0 0 / 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  opacity: 0;
  transition: opacity 0.3s;
  z-index: 999;
  overflow-y: scroll;
}
.yard > div{
  display: flex;
  gap: 24px;
}
.yard figure {
  overflow-x: hidden;
}
.yard figure tbody tr:nth-child(even){
  background: rgba(30 30 30 / 0.8);
}
.yard figure tbody tr:nth-of-type(1) td:nth-of-type(1){
  opacity: 0;
}
.yard figure tbody tr:nth-of-type(2){
  font-size: 16px;
}
.yard figure tbody tr td:nth-of-type(5){
  color: #aaa;
}
.yard figure tbody tr:nth-of-type(1) {
  font-size: 20px;
}
.yard figure tbody tr td:nth-of-type(6){
  color: var(--blue);
}
.yard figure tbody tr td:nth-of-type(7){
  color: var(--link);
}
.yard figure tbody tr td:nth-of-type(8){
  color: var(--yellow);
}
.yard figure tbody tr td:nth-of-type(9){
  color: var(--red);
}
.yard figure table{
  margin-top: 24px;
}
.yard-bent {
  width: 60vw;
}
.yard-bamyuda {
  width: 32vw;
}
.yard figure table {
  width: 56vw;
}
.yard figure:last-of-type > table{
  margin-left: -25vw;
}
.yard tbody tr th{
  border: none;
  padding: 0;
}
.yard tbody tr td{
  display: inline-block;
  width:calc(100% / 9);
  text-align: center;
  white-space: nowrap;
  text-transform: capitalize;
  border: none;
  padding: 0;
}

@media screen and (min-width: 1600px){
  .yard-bent {
    width: 890px;
  }
  .yard-bamyuda {
    width: 500px;
  }
  .yard figure:last-of-type > table {
    margin-left: -360px;
  }
  .yard tbody tr td {
    width: 96px;
  }
  .yard figure tbody tr:nth-of-type(1) {
    font-size: 28px;
}
}
@media screen and (max-width: 1100px){
  .yard figure tbody tr:nth-of-type(2){
    font-size: 14px;
  }
  .yard figure tbody tr{
    font-size: 16px;
  }
}
.yard-close{
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: fixed;
  top: 24px;
  right: 1em;
}
.yard-close span{
  width: 40px;
  height: 2px;
  background: var(--link);
  position: absolute;
}
.yard-close span:first-of-type{
  top: 24px;
  left: 4px;
  transform: rotate(35deg);
}
.yard-close span:last-of-type{
  top: 24px;
  left: 4px;
  transform: rotate(-35deg);
}
.hole_1 ul > li:first-of-type:after {
  content: url(img/hole_1.svg);
  position: absolute;
  width: 120px;
  bottom: -280px;
  right: -620px;
}
.hole_2 ul > li:first-of-type:after {
  content: url(img/hole_2.svg);
  position: absolute;
  width: 150px;
  bottom: -220px;
  right: -650px;
}
.hole_3 ul > li:first-of-type:after {
  content: url(img/hole_3.svg);
  position: absolute;
  width: 130px;
  bottom: -280px;
  right: -640px;
}
.hole_4 ul > li:first-of-type:after {
  content: url(img/hole_4.svg);
  position: absolute;
  width: 100px;
  bottom: -200px;
  right: -620px;
}
.hole_5 ul > li:first-of-type:after {
  content: url(img/hole_5.svg);
  position: absolute;
  width: 140px;
  bottom: -280px;
  right: -660px;
}
.hole_6 ul > li:first-of-type:after {
  content: url(img/hole_6.svg);
  position: absolute;
  width: 100px;
  bottom: -280px;
  right: -600px;
}
.hole_7 ul > li:first-of-type:after {
  content: url(img/hole_7.svg);
  position: absolute;
  width: 110px;
  bottom: -280px;
  right: -620px;
}
.hole_8 ul > li:first-of-type:after {
  content: url(img/hole_8.svg);
  position: absolute;
  width: 110px;
  bottom: -160px;
  right: -620px;
}
.hole_9 ul > li:first-of-type:after {
  content: url(img/hole_9.svg);
  position: absolute;
  width: 110px;
  bottom: -280px;
  right: -620px;
}
.hole_10 ul > li:first-of-type:after {
  content: url(img/hole_10.svg);
  position: absolute;
  width: 130px;
  bottom: -280px;
  right: -580px;
}
.hole_11 ul > li:first-of-type:after {
  content: url(img/hole_11.svg);
  position: absolute;
  width: 130px;
  bottom: -240px;
  right: -620px;
}
.hole_12 ul > li:first-of-type:after {
  content: url(img/hole_12.svg);
  position: absolute;
  width: 130px;
  bottom: -280px;
  right: -620px;
}
.hole_13 ul > li:first-of-type:after {
  content: url(img/hole_13.svg);
  position: absolute;
  width: 130px;
  bottom: -280px;
  right: -620px;
}
.hole_14 ul > li:first-of-type:after {
  content: url(img/hole_14.svg);
  position: absolute;
  width: 180px;
  bottom: -280px;
  right: -620px;
}
.hole_15 ul > li:first-of-type:after {
  content: url(img/hole_15.svg);
  position: absolute;
  width: 130px;
  bottom: -280px;
  right: -620px;
}
.hole_16 ul > li:first-of-type:after {
  content: url(img/hole_16.svg);
  position: absolute;
  width: 110px;
  bottom: -280px;
  right: -620px;
}
.hole_17 ul > li:first-of-type:after {
  content: url(img/hole_17.svg);
  position: absolute;
  width: 120px;
  bottom: -280px;
  right: -620px;
}
.hole_18 ul > li:first-of-type:after {
  content: url(img/hole_18.svg);
  position: absolute;
  width: 140px;
  bottom: -280px;
  right: -620px;
}

.eachhole .section_1 p{
  margin-bottom: 1em;
  margin-left: 6vw;
}
.eachhole .section_1 > div {
  height: 880px;
}
.eachhole .section_1::-webkit-scrollbar{
display: none;
}
.eachhole .section_1::-webkit-scrollbar-track{
  background-color:  #000;
}
.eachhole .section_1::-webkit-scrollbar-thumb{
  background-color: var(--ac);
}
.inpage-link-sp::-webkit-scrollbar{
  display: none;
  }
  .inpage-link-sp::-webkit-scrollbar-track{
    background-color:  #000;
  }
  .inpage-link-sp::-webkit-scrollbar-thumb{
    background-color: var(--ac);
  }
.yard-btn{
  width: 240px;
  color: var(--link);
}
.yard-btn_2{
  display: none;
}
/*-------------------------------------------------------------------------------------------------------------------
fee
---------------------------------------------------------------------------------------------------------------------*/
.fee:after {
  content: "";
  top: 0px;
  position: fixed;
  width: 100%;
  height: 400px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/fee-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}
.fee h1:after{
  content: "Play guide・Fee";
}
.fee section {
  margin-bottom: 0px;
}
.fee .section_1 {
  margin-bottom: 0;
  position: sticky;
  top: 0;
  left: 0;
  width: calc(360px + 6vw);
  height: 100vh;
}
.fee .section_1 > div {
  padding-left: 6vw;
}
.fee .section_2{
  margin-top: -100vh;
}
.fee .section_2,
.fee .section_3,
.fee .section_4,
.fee .section_5,
.fee .section_6{
  margin-left: 560px;
  padding-right: 6vw;
  width: calc(100% - 560px);
}
.fee .section_2 > div,
.fee .section_3 > div,
.fee .section_4 > div,
.fee .section_5 > div,
.fee .section_6 > div{
  max-width: 40em;
  margin: 0 auto;
}
.fee .section_2{
  margin-top: -100vh;
  padding-top: 160px;
}
.fee table{
  max-width: 600px;
  margin-bottom: 40px;
}
.fee tr td{
  border: none;
  text-align: center;
  padding: 4px;
}
.fee .section_3 tr:first-of-type td:last-of-type{
  color: var(--red);
}
.fee figure tbody tr:nth-child(odd) {
  background: rgba(30 30 30 / 0.8);
}
.fee .section_4 h3,
.fee .section_5 h3{
  font-size: 1.4em;
}
.fee .section_4 p:first-of-type > span{
  color: var(--red);
}
.fee .section_3 ul li,
.fee .section_4 ul li{
  margin-left: 1.8em;
  position: relative;
}

.fee .section_3 ul li::before,
.fee .section_4 ul li::before{
  content: "";
  width: 0.5em;
  height: 0.5em;
  background: url(img/list-style.svg);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0.8em;
  left: -1.2em;
}
.large{
  margin-bottom: 16px;
}
.large span{
  font-size: 2em;
  margin-right: 8px;
  font-weight: 700;
  color: var(--red);
}
/*-------------------------------------------------------------------------------------------------------------------
history
---------------------------------------------------------------------------------------------------------------------*/
.history section{
  margin-bottom: 80px;
}
.history:after {
  content: "";
  top: 0px;
  position: fixed;
  width: 100%;
  height: 320px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/history-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom right;
}
.history .section_1 {
  margin-bottom: 0;
  position: sticky;
  top: 0;
  left: 0;
  width: 480px;
  height: 100vh;
}
.history h1::after{
  content: "History";
}
.history .inpage-link li {
  margin-bottom: 8px;
  padding-bottom: 4px;
}
.history section:not(.section_1) {
  margin-left: 480px;
}
.history section:not(.section_1) > div {
  padding-right: 6vw;
  max-width: 40em;
  margin: 0 auto;
}

.history .inpage-link li {
  font-size: 18px;
}
.history-flex > div{
  display: flex;
  justify-content: space-between;
}
.history-flex > div > figure{
  width: 48%;
  height: 320px;
}
.history-flex > div > figure img{
  width: 100%;
}
.history figcaption{
  font-size: 0.8em;
}
.history .section_2{
  margin-top: -92vh;
  padding-top: 78px;
}
.history .section_2 .history-flex figure img{
  width: 100%;
  object-fit:cover;
}
.sund > div{
  display: flex;
  justify-content: space-between;
  align-items: end;
}
.sund p{
  width: calc(100% - 200px);
}
.sund figure{
  width: 120px;
}
.sund figure img{
  width: 100%;
}
/*-------------------------------------------------------------------------------------------------------------------
schedule
---------------------------------------------------------------------------------------------------------------------*/
.schedule:after {
  content: "";
  top: 0px;
  position: fixed;
  width: 100%;
  height: 70vh;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/schedule-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}

.schedule .section_1 {
  margin-bottom: 0;
  position: sticky;
  top: 0;
  left: 0;
  width: calc(400px + 6vw);
  height: 100vh;
}
.schedule h1{
  margin-right: 0;
}
.schedule h1::after{
  content: "Schedule";
}
.schedule h2{
  margin-right: 6vw;
}
.schedule .section_1 > p,
.schedule .section_1 > div{
  margin-left: 6vw;
}
.schedule .section_2{
  margin-left: calc(480px + 6vw);
  margin-top: -92vh;
  padding-top: 72px;
}
#wpsc-block-calendar .wpsc-category-listings .wpsc-category-listing-color {
  width: 16px !important;
}
#wpsc-block-calendar .wpsc-category-listings {
  flex-direction: column !important;
}
.wpsc-category-listings{
  padding-right: 6vw !important;
}
.wpsc-calendars-twelve-months{
  padding-right: 6vw !important;
}
#wpsc-block-calendar .wpsc-category-listings .wpsc-category-listing {
  width: 100% !important;
}
.wpsc-calendar-heading{
  font-size: 24px !important;
}
.schedule .section_1 p > a{
  text-decoration: underline;
}
/*-------------------------------------------------------------------------------------------------------------------
access
---------------------------------------------------------------------------------------------------------------------*/
.access:after{
  content: "";
  top: 0px;
  position: fixed;
  width: 100%;
  height: 480px;
  z-index: -1;
  background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/bg_4.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}
.access h1::after{
  content: "Access";
}
.access-flex{
  margin-left: 6vw;
  margin-right: 6vw;
}
.access-flex > div{
  display: flex;
  justify-content: space-between;
}
.access-flex iframe{
  border: 0;
  width: calc(100% - 360px);
}
.access-flex ul{
  margin-bottom: 256px;
}
.access-root{
  margin-left: 6vw;
  margin-right: 6vw;
}
.access-root > div{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 40px;
}
.access-root > div > div{
  width: 40%;
  min-width: 320px;
}
.access-root > div > div img{
  width: 100%;
}
/*-------------------------------------------------------------------------------------------------------------------
link
---------------------------------------------------------------------------------------------------------------------*/
.link:after {
  content: "";
  top: 0px;
  right: 0;
  position: fixed;
  width: 75%;
  height: 100vh;
  z-index: -1;
  background-image: linear-gradient(270deg, rgba(8,9,7,0) 50%, rgba(8,9,7,1) 99%),url(img/link-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left,center;
}
.link h1::after{
  content: "Link";
}
.link h2,
.link .section_1 > div,
.link .section_2 > div > div{
  margin-left: 6vw;
  max-width: 32em;
}
.link .section_1 > div,
.link .section_2 > div > div{
margin-bottom: 80px;
}
.friend-link{
  margin-bottom: 16px;
  position: relative;
  cursor: pointer;
  display: inline-block;
  padding-left: 4px;
  padding-bottom: 6px;
  padding-right: 64px;
}
.friend-link:before{
  content: "";
  width: 0px;
  height: 1px;
  background: var(--link);
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
}
.friend-link:hover:before{
  width: 100%;
}
.friend-link:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.4s;
}
.friend-link:hover:after{
  right: 16px;
}
.friend-link a{
  display: inline-block;
  width: 100%;
}
.link .wp-block-group__inner-container > p{
  font-size: 1.2em;
  margin-bottom: 16px;
}
.friend-li{
  margin-top: 24px;
}
/*-------------------------------------------------------------------------------------------------------------------
calendar
---------------------------------------------------------------------------------------------------------------------*/
.wpsc-calendar-heading-month{
  color: var(--text);
}
.wpsc-calendar-heading-year{
  display: none;
}
.wpsc-important-date-listings{
  display: none;
}
.wpsc-container {
  display: flex;
  flex-direction: column-reverse;
}
body main #wpsc-block-calendar .wpsc-calendar-weekday {
  background: none;
 }
 body main #wpsc-block-calendar .wpsc-calendar table {
   border-spacing: 2px;
   background: none;
 }
 body main #wpsc-block-calendar .wpsc-calendar-prevnext-date {
   text-align: center;
   background: none;
   color: transparent;
   opacity: 0.95;
 }
 #wpsc-block-calendar .wpsc-calendar td {
  background: none !important;
}
#wpsc-block-calendar .wpsc-calendar tbody {
  background: none !important;
}
 body main #wpsc-block-calendar .wpsc-calendar-weekday,
 body main #wpsc-block-calendar .wpsc-calendar-prevnext-date,
 body main #wpsc-block-calendar .wpsc-calendar-general-date {
   padding: 4px 0;
   font-size: 16px;
   line-height: 1.5;
 }
 body main #wpsc-block-calendar .wpsc-calendar-general-date:not(.wpsc-important-date-tooltip) {
   background: #1B1D1A;
   color: var(--text);
 }
 body main #wpsc-block-calendar .wpsc-calendar-weekend:not(.wpsc-calendar-weekday):not(.wpsc-calendar-important-date):not(.wpsc-calendar-prevnext-date) {
   background: #1B1D1A;
   color: var(--text);
 }
 body main .wpsc-calendar-inner tbody tr:first-of-type td:first-of-type div{
  color: var(--red) !important;
 }
 body main .wpsc-calendar-inner tbody tr:first-of-type td:last-of-type div{
  color: var(--blue) !important;
 }
/*-------------------------------------------------------------------------------------------------------------------
download
---------------------------------------------------------------------------------------------------------------------*/
body main .w3eden .card-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1.25rem 48px 1.25rem 0.8rem;
}
body main .w3eden .card {
  background: none;
  border: 1px solid var(--link);
  border-radius: 0;
  width: 40em;
  max-width: 100%;
}
body main .w3eden a {
  color: var(--link);
}
body main .w3eden .text-muted {
  color: var(--text) !important;
  display: none;
}
body main .w3eden  .ml-3{
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 1.25rem;
  box-sizing: border-box;
  top: 0;
  left: 0;
  margin-left: 0 !important;
}
body main .w3eden a.btn {
  background: none;
  border: none;
  text-decoration: none !important;
  width: 100%;
  height: 100%;
  padding: 1.25rem;
  padding-left: calc(0.8rem + 60px);
  font-family:  'Noto Serif JP', serif;
  font-size: 19px;
  text-align: left;
  line-height: 3.8;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
body main .w3eden .btn-primary:hover {
  color: none;
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
}
body main .w3eden a.btn:after {
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%) rotate(90deg);
  transition: 0.4s;
}
body main .w3eden a.btn:hover:after {
  top: 54%;
}
body main .w3eden .btn-primary:focus {
  box-shadow: none;
}

/*-------------------------------------------------------------------------------------------------------------------
menber
---------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 970px){
  .memberpage-menu > div:first-of-type,
  .memberpage-menu > ul {
    width: 100%;
  }
  .inner_padding {
    display: flex;
    align-items: baseline;
    margin-left: 5%;
    flex-direction: column;
  }
  #hnavi a {
      margin-left: 0;
  }
  .background{
    width: 100%;
  }
  .background_2{
    width: 50%;
  }
  #area_side_menu{
    background-image: linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    margin-bottom: 0;
    padding: 32px 0;
    min-height: 240px;
  }
  .menu_1 {
    background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
   }
   .menu_2 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_3.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
    .menu_3 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_4.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
    .menu_4 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_5.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
    .menu_5 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_6.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
    .menu_6 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_7.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
    .menu_7 {
     background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0) 100%),url(img/menu-bg_8.jpg);
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
    }
}


@media screen and (max-width: 500px){
  /* h1 {
    font-size: 28px;
    padding-top: 4em;;
  } */
  .nav > div:last-of-type > p {
    font-size: 28px;
  }
  #area_side_menu h3 {
    padding-left: 24px;
  }
  .main_table {
    padding-left: 40px;
    padding-right: 16px;
  }
  #area_side_menu{
    background-image: linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    margin-bottom: 0;
    padding: 32px 0;
    min-height: 240px;
  }
  .menu_1 {
    background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
  }
 .menu_2 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_3.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
  .menu_3 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_4.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
  .menu_4 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_5.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
  .menu_5 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_6.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
  .menu_6 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_7.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
  .menu_7 {
   background-image:  linear-gradient(90deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.85) 40%,  rgba(0,0,0,0.4) 100%),url(img/menu-bg_8.jpg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
}
.googlemaps{
  margin-top: 16px;
}
.googlemaps iframe{
  width: 44vw;
}
.googlemaps iframe,
.googlemaps object,
.googlemaps embed {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  -webkit-transition: filter 0.7s ease;
  -moz-transition: filter 0.7s ease;
  -o-transition: filter 0.7s ease;
  transition: filter 0.7s ease;
}

.googlemaps iframe:hover,
.googlemaps object:hover,
.googlemaps embed:hover {
  -webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  filter: grayscale(0%);
}
/*-------------------------------------------------------------------------------------------------------------------
privacy-policy
---------------------------------------------------------------------------------------------------------------------*/
.privacy-policy h2,
.privacy-policy h3,
.privacy-policy p{
  max-width: 40em;
  margin-left: 6vw;
}

/*-------------------------------------------------------------------------------------------------------------------
menber
---------------------------------------------------------------------------------------------------------------------*/

.inner_padding{
  display: flex;
  align-items: flex-end;
  margin-left: 5%;
}
#hnavi ul{
  margin-bottom: 2.48em;
}
#hnavi a{
  position: relative;
  margin-left: 80px;
  box-sizing: border-box;
}
#hnavi a:after{
  content: "";
  background: url(img/arrow-w.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 10px;
  height: 18px;
  position: absolute;
  right: -40px;
  top: 6px;
  transition: 0.4s;
}
#hnavi a:hover:after{
  right: -46px;
}
.memberpage-menu > div:first-of-type{
  width: calc(50% - 4px);
}
#area_side_menu{
  background-image: linear-gradient(90deg, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.9) 20%,  rgba(0,0,0,0) 50%),url(img/menu-bg_1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  margin-bottom: 0;
  padding: 32px 0;
  min-height: 240px;
}
#area_side_menu h3{
  font-size: 32px;
  margin-top: 0;
  margin-bottom: 16px;
  padding-left: 40px;
  color: var(--text);
}
.main_table{
  padding-left: 64px;
}
#raijyo {
  width: 100%;
  max-width: 320px;
  margin-bottom: 16px;
}
#raijyo th{
  width: 66.7%;
}
#raijyo th span{
  margin-left: 16px;
}
#raijyo td{
  width: 33.3%;
}
.red{
  font-size: 12px;
}
.memberpage-menu{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 90%;
  margin: 0 auto;
}
.memberpage-menu > ul{
  /* background: rgba(0 0 0  / 0.2);
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px); */
  margin-bottom: 0;
  width: calc(50% - 4px);
  padding: 32px 0;
  min-height: 240px;
}
.memberpage-menu > ul > li{
  margin-bottom: 8px;
  min-width: fit-content;
  padding-left: 40px;
}
.memberpage-menu > ul > li:first-of-type{
  font-size: 32px;
  margin-bottom: 16px;
  color: var(--text);
}
.memberpage-menu > ul > li span{
  margin-left: 16px;
}
.menu_1 {
 background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 50%,rgba(0,0,0,0.9) 60%, rgba(0,0,0,0) 100%),url(img/menu-bg_2.jpg);
 background-repeat: no-repeat;
 background-size: cover;
 background-position: center;
 background-attachment: fixed;
}
.menu_2 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.9) 20%,  rgba(0,0,0,0) 50%),url(img/menu-bg_3.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
 .menu_3 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 50%,rgba(0,0,0,0.9) 60%, rgba(0,0,0,0) 100%),url(img/menu-bg_4.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
 .menu_4 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.9) 20%,  rgba(0,0,0,0) 50%),url(img/menu-bg_5.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
 .menu_5 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 50%,rgba(0,0,0,0.9) 60%, rgba(0,0,0,0) 100%),url(img/menu-bg_6.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
 .menu_6 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.9) 20%,  rgba(0,0,0,0) 50%),url(img/menu-bg_7.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
 .menu_7 {
  background-image:  linear-gradient(90deg, rgba(0,0,0,0.9) 50%,rgba(0,0,0,0.9) 60%, rgba(0,0,0,0) 100%),url(img/menu-bg_8.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }
.menu_8 {
  text-align: center;
  padding: 40px;
  margin-left: -40px;
}
#copyright{
  font-size: 12px;
  text-align: center;
  margin-bottom: 16px;
}
@media screen and (min-width: 1600px) {
  .text-area {
    margin-left: 12vw;
    margin-right: 12vw;
    max-width: 32vw;
  }
  .top .section_4 .text-area {
    margin: -240px 12vw 0 auto;
  }

  h1 {
    margin-left: 12vw;
  }
  .news > div {
    padding-left: 12vw;
    padding-right: 12vw;
  }
  .top .section_4 .img-area {
    width: 94vw;
    margin: -80px 0 0 auto;
  }
  .single p, .single figure {
    margin-left: 12vw;
    margin-right: 12vw;
    padding-left: 0;
  }
  .inpage-link {
    margin-left: 12vw;
  }
  .history .inpage-link {
    margin-left: 6vw;
  }
  .single ul {
    margin-left: 12vw;
  }
  .facility .section_2 .text-area {
    margin: -320px 12vw 0 auto;
}
  .facility .section_4 .text-area {
    margin: -460px 12vw 0 auto;
  }
  .course .section_3 .text-area {
    margin: 0 12vw 0 auto;
  }
  .course .section_2 .img-area:last-of-type {
    max-width: calc(46em + 12vw);
  }
  .course .section_3 .img-area:nth-last-of-type(2) {
    max-width: 72vw;
    margin: -720px 6vw 0 auto;
  }
  .course .section_3 .img-area:last-of-type {
    width: calc(100% - 44em);
  }
  .eachhole h1,
  .schedule h1,
  .fee h1,
  .history h1{
    margin-left: 6vw;
  }
  .eachhole .inpage-link {
    margin-left: 6vw;
  }
  .eachhole .section_1 {
    width: calc(6vw + 360px);
  }
  /* .eachhole .inpage-link,
  .history .inpage-link {
    width: calc(6vw + 260px);
    padding-left: 6vw;
  } */
  .eachhole .section_1 p {
    margin-left: 6vw;
  }
  .yard-btn{
      width: 268px;
  }
  .eachhole .section_2 {
    margin-left: calc(480px + 6vw);
  }
  .fee .inpage-link,
  .history .inpage-link {
    width: calc(6vw + 320px); 
  }
  .fee .section_1 {
    width: calc(360px + 6vw);
  }
  .fee .inpage-link {
    padding-left: 0;
    margin-left: 6vw;
  }
  .access-flex,
  .access-root {
    margin-left: 12vw;
    margin-right: 12vw;
  }
  .link h2, .link .section_1 > div, .link .section_2 > div > div {
      margin-left: 12vw;
  }
}
@media screen and (max-width: 1300px) {
  .img-hole {
    width: calc(100% - 80px);
}
.eachhole .section_2 ul > li:first-of-type:after {
  bottom: 120px;
  left: 16px;
  right: auto;
}
#wpsc-block-calendar .wpsc-calendars {
  gap: 24px;
}
#wpsc-block-calendar .wpsc-calendars-three-columns .wpsc-calendar {
  width: calc(50% - 12px) !important;
}
}
@media screen and (max-width: 1240px) {
  .text-area {
    max-width: 56vw;
}
  .top .section_2 .img-area {
    margin: -40px 0 0 auto;
    width: 94vw;
  }
  .top .section_2 .img-area figure img {
    height: 670px;
    object-position: bottom;
  }
  .top .section_5 .text-area {
    margin-top: -1020px;
    width: 38vw;
  }
  .top .section_2 .top-illust img {
    margin-top: 0;
    height: 320px;
}
  .top .section_5 > div > .img-area:nth-child(2) {
    width: 50vw;
    margin: 400px 0 0 auto;
  }
  .top .section_6 .text-area {
    width: 38vw;
  }
  .top-flex .img-area {
    width: 64vw;
    position: absolute;
    top: -200px;
    right: 0;
    z-index: -1;
  }
  .top-flex {
    padding-right: 6vw;
  }
  .top-flex .img-area img{
    width: 100%;
  }
  .address {
    flex-direction: column;
  }
  .googlemaps,
  .googlemaps iframe{
    width: 100%;
  }

  .facility .section_3 .img-area:nth-of-type(2) figure img {
    height: 880px;
}
  .facility .section_3 .text-area {
    margin-top: -440px;
  }
  .facility .section_4 > div > .img-area:nth-of-type(2) {
    width: 30vw;
    margin-left: 0;
  }
  .facility .section_4 .img-area:nth-of-type(2) figure img {
    height: 640px;
  }
  .facility .section_4 .text-area {
    margin: -360px 6vw 0 auto;
  }
  .course .section_3 .img-area:nth-last-of-type(2) {
    width: 94vw;
    margin: -720px 0 0 auto;
  }
  .course .section_3 .img-area:last-of-type {
    width: 86vw;
    margin-top: 120px;
   }
   .course .section_3 .img-area:last-of-type img {
    width: 100%;
    height: 640px;
    object-fit: cover;
    object-position: right bottom;
  }
  .course .section_3 .text-area {
     transform: translateY(760px);
  }
  .course .section_4 {
    margin-top: 880px;
  }
  .course .section_4 .img-area {
    width: 94%;
    margin: -880px 0 0 0;
  }
  .course .section_5 > div > div:last-of-type {
    margin: -200px 0 0 0;
  }
  .course .section_5 > div > div:last-of-type {
    width: 50vw;
  }
  .course .section_5 .img-area:nth-of-type(2) img {
    height: 720px;
  }
  .course .section_5 .text-area {
    transform: translateY(580px);
    margin: 0px 6vw 0 auto;
    width: 38vw;
}
.course .section_5 .img-area {
  width: 94%;
  margin: -480px 0 0 auto;
}
}

@media screen and (max-width: 1180px) {
  .schedule .section_1,
  .fee .section_1,
  .history .section_1 {
    position: relative;
    width: 100%;
    height: auto;
  }
  .schedule .section_2,
  .fee section:not(.section_1),
  .history section:not(.section_1) {
    margin-left: 6vw;
    margin-top: 0;
    padding-top: 72px;
    width: calc(100% - 6vw);
    max-width: 40em;
  }
  #wpsc-block-calendar .wpsc-calendars-three-columns .wpsc-calendar {
    width: calc(32% - 8px) !important;
  }
  body main .w3eden .card {
    max-width: calc(100% - 6vw);
  }
  .nav > div,
  .footernav > div {
    justify-content: space-around;
  }
  .history section:not(.section_1) > div {
    padding-right: 6vw;
    max-width: 880px;
    margin-left: 0 !important;
  }
  /* .history .inpage-link{
    max-width: 40em;
    margin: 0 auto;
  }
  .history h1{
    margin-left: 6em;
  } */
  body .history .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
   margin-left: 0 !important;
}
.fee main .w3eden .card{
  max-width: 600px;
  width: calc(100% - 6vw);
}
}

@media screen and (min-width: 1180px) and (500px <= height < 840px) {
 .history h1 {
    padding-top: 16vh;
    padding-bottom: 4vh;
}
.history h1::after {
  top: 9vh;
}
.history .inpage-link li {
  margin-bottom: 0.5vh;
  padding-bottom: 1vh;
}
}
@media screen and (min-width: 1180px) and (500px <= height < 760px) {
  .fee h1{
    padding: 20vh 0 2vh;
  }
  .fee h1:after{
    top: 12vh;
  }
  .fee .inpage-link li {
    line-height: 5vh;
  }
  .fee .inpage-link {
    margin-bottom: 6vh;
  }

}
@media screen and (max-width: 960px) {
  .eachhole:after {
    content: "";
    position: absolute;
    top: 0px;
    width: 100%;
    height: 560px;
    z-index: -1;
    background-image: linear-gradient(180deg, rgba(8,9,7,0.4) 5%, rgba(8,9,7,1) 100%),url(img/fee-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: bottom;
  }
  .eachhole .section_1 {
    position: relative;
    width: 100%;
    height: auto;
}

.eachhole .section_2 {
  width: calc(100% - 6vw);
  margin-top: 200px;
  margin-left: 6vw;
}
.eachhole .section_2 > div > div {
  margin-bottom: 400px;
}
/* .eachhole .inpage-link {
  justify-content: space-around;
  width: calc(100% - 12vw);
  margin-bottom: 8px;
} */
/* .eachhole .inpage-link {
  justify-content: space-around;
  width: 80px;
  position: fixed;
  top: 96px;
  left: 0;
  margin-left: 0;
  margin-bottom: 8px;
  height: 100vh;
  overflow-y: scroll;
  padding-bottom: 112px;
}
.eachhole .inpage-link .holescroll_7,
.eachhole .inpage-link .holescroll_8,
.eachhole .inpage-link .holescroll_9 {
  margin-bottom:0 ;
} */
/* .eachhole .inpage-link li {
  width: 100%;
} */
/* .eachhole h1{
    font-size: 2em;
    margin-left: calc(6vw + 96px);
    position: relative;
} */
/* .eachhole .section_1 p {
  margin-left: calc(6vw + 96px);
}
.eachhole .section_2 {
  margin-left: calc(6vw + 96px);
} */
.holelist-u{
  width: 100%;
  position: fixed;
  bottom: -100vh;
  height: 56px;
  padding: 0 16px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 99;
  transition: 0.4s;
}
.holelist-u > div{
  display: flex;
  align-items: center;
}
.inpage-link-sp{
  display: flex;
  justify-content: space-between;
  width: calc(100% - 56px);
  overflow-x: scroll;
  height: 56px;
  align-items: center;
  margin-bottom: 0;
}
.inpage-link-sp::before{
  content: "Hole No.";
  color: var(--link);
  min-width: fit-content;
}
.inpage-link-sp li{
  margin-bottom: 0;
  width: 40px;
  min-width: 40px;
  text-align: center;
}
.yard-btn_2{
  display: block;
  width: 56px;
  position: fixed;
  line-height: 2.75;
  right: 8px;
  margin-bottom: 0;
  height: 56px;
  text-align: center;
  cursor: pointer;
  text-shadow: none;
}
.fixedCss_1{
  position: fixed;
  top: 96px;
  z-index: 99;
}

.access-flex > div {
  flex-direction: column;
  gap: 40px;
}
.access-flex iframe {
  width: 100%;
}
.access-flex ul {
  margin-bottom: 2em;
}
.access-root > div > div {
  width: 46%;
}
.eachhole .inpage-link {
  justify-content: start;
  width: 80%;
  max-width: 640px;
  gap: 8px;
}
.eachhole .inpage-link li {
  width: 60px;
  margin-bottom: 24px;
}
}

@media screen and (min-width: 960px) and (500px <= height < 760px) {
.eachhole h1{
  padding: 20vh 0 2vh;
}
.eachhole h1:after{
  top: 12vh;
}
.eachhole .inpage-link li {
  line-height: 5vh;
}
.eachhole .inpage-link .holescroll_7, .eachhole .inpage-link .holescroll_8, .eachhole .inpage-link .holescroll_9 {
  margin-bottom: 2.6vh
}
.eachhole .inpage-link {
  margin-bottom: 6vh;
}
}

@media screen and (max-width: 851px){
  .text-area {
    max-width: 80vw;
  }
  .top .section_4 .text-area {
    margin: -240px 0 0 6vw;
}
  .top .section_5 .text-area {
    margin-top: -360px;
    width: 80vw;
}

.top .section_6 .text-area {
  width: 80vw;
  margin: -360px 0 0 6vw;
}
.top .section_6 > div > .img-area:nth-of-type(2) {
  width: 64vw;
  margin: -80px 0 0 auto;
}
.top .section_6 > div > .img-area:first-of-type {
  width: 80vw;
}
.top .section_5 > div > .img-area:nth-child(2) {
  width: 75vw;
}
.top .section_5 > div > .img-area:nth-child(1) img {
  height: 800px;
}
  .facility .section_2 .img-area:first-of-type {
    width: 94vw;
  }
  .facility .section_3 .img-area:nth-of-type(2) {
    width: 86vw;
  }
  .facility .section_3 .text-area {
    margin-top: -380px;
  }
  .facility .section_4 {
    margin-top: 360px;
  }
  .facility .section_4 .img-area figure img {
    height: 560px;
}
.facility .section_4 > div > .img-area:nth-of-type(2) {
  width: 74vw;
  margin-top: -280px;
}
.facility .section_4 .img-area:nth-of-type(2) figure img {
  height: 680px;
}
.facility .section_4 .text-area {
  margin: -120px 6vw 0 auto;
}
.facility .section_6 {
  margin-top: -180px;
}
.facility .scroll_5{
  display: none;
}
.facility .section_6 .img-area {
  width: 100%;
}
.course .section_3 .img-area:nth-last-of-type(2) {
  margin: -480px 0 0 auto;
}
.course .section_3 .img-area:last-of-type {
  margin-top: 160px;
}
.course .section_3 .text-area {
  transform: translateY(1080px);
}
.course .section_4 {
  margin-top: 960px;
}
  .course-flex > div {
   flex-direction: column;
   align-items: unset;
  }
  .mr-ueda {
    left: 6vw;
    margin-top: 40px;
  }
  .course .section_2 .img-area:last-of-type {
    width: 86vw;
    margin: -880px 0 0 auto;
  }
  .course .section_5 .img-area {
    width: 100%;
  }
  .course .section_5 > div > div:last-of-type img {
    height: 880px;
  }
  .course .section_5 .text-area {
    transform: translateY(1080px);
    margin: 0px 6vw 0 auto;
    min-width: 320px;
    width: 50vw;
}
  .course .section_5 {
    margin-top: 560px;
    margin-bottom: 280px;
  }
  .course .section_5 > div > div:last-of-type {
    width: 88vw;
  }
  #wpsc-block-calendar .wpsc-calendars-three-columns .wpsc-calendar {
    width: calc(50% - 12px) !important;
  }
  .access-root > div > div {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
  }

}
@media screen and (max-width: 701px){
  /* h1 {
    font-size: 32px;
  }
  .news h1::after, .page h1::after {
    font-size: 1em;
  } */
  /* .nav{
    padding: 24px 6vw 96px;
  } */
  .nav > div:last-of-type > p {
    margin-top: 80px;
    font-size: 32px;
    text-align: center;
  }
  .nav > div > div {
      flex-direction: column-reverse;
      align-items: baseline;
  }
  .nav .link-btn {
    margin-bottom: 40px;
  }
  
  .link:after {
    width: 75%;
  }
  .yard > div {
    flex-direction: column;
}
.yard-bent,
.yard figure table,
.yard-bamyuda {
  width: 100%;
}
.yard figure:last-of-type > table {
  margin-left: 0;
}
.yard figure tbody tr:nth-of-type(1) td:nth-of-type(1),
.yard figure tbody tr:nth-of-type(1) td:nth-of-type(1) {
  opacity: 1;
}
.yard figure tbody tr:nth-of-type(1) td:nth-of-type(5) {
  opacity: 0;
}
.history-flex > div {
  flex-direction: column;
}
.history-flex > div > figure {
  width: 100%;
  max-width: 400px;
  height: auto;
}
.sund > div {
  flex-direction: column;
  align-items: baseline;
}
.sund p {
  width: 100%;
}
}
@media screen and (max-width: 680px){
  .top .section_5 > div > .img-area:nth-child(2) {
      margin: 480px 0 0 auto;
  }
  .top .section_5 > div > .img-area:nth-child(2) img {
    height: 640px;
  }
}
@media screen and (max-width: 499px){
  html {
    font-size: 16px;
  }
  h1 {
    margin-right: 6vw;
  }
  .text-area {
    max-width: 100%;
  }
  .top .section_5 .text-area {
    max-width: 100%;
    width: calc(100% - 12vw)
  }
  header {
    padding: 24px 0.8em 8px;
}
  .header-logo {
    width: 40px;
    height: 40px;
  }
  .text-firstview h1 {
    font-size: 0.6em;
  }
  .text-firstview p {
    font-size: 0.6em;
}
  /* .text-firstview h1::after {
    top: -48px;
  } */
  .top h2::after {
    top: 16px;
  }
  .top .section_2 .top-illust img {
    margin-top: 80px;
  }
  .top .section_3 .img-area figure img {
    height: 960px;
  }
  .top .section_3 {
    margin-bottom: 320px;
  }
  .top .section_4 .text-area {
    margin: -80px 6vw 0 6vw;
  }
  .top .section_4 .img-area img {
    height: 400px;
  }
  .top .section_5  {
    margin-top: -560px;
  }
  .top .section_5 > div > .img-area:nth-child(1) img {
    height: 640px;
  }
  .top .section_5 > div > .img-area:nth-child(2) {
    width: 80vw;
    margin: 700px 0 0 auto;
  }
  .top .section_5 > div > .img-area:nth-child(2) img {
    height: 480px;
  }
  .top .section_5 .text-area {
    margin-top: -300px;
  }
  .top .section_6 > div > .img-area:first-of-type img {
    height: 280px;
  }
  .top .section_6 > div > .img-area:first-of-type {
    width: 94vw;
}
  .top .section_6 > div > .img-area:first-of-type {
    margin-top: -80px;
  }
  .top .section_6 > div > .img-area:nth-of-type(2) img {
    height: 360px;
  }
  .top .section_6 .text-area {
    width: calc(100% - 12vw);
    margin: -160px 6vw 0 6vw;
  }
  .top .section_6 > div > .img-area:nth-of-type(2) {
    width: 94vw;
    margin: 120px 0 0 auto;
  }
  .top .section_6 {
    margin-bottom: 160px;
  }
  .news h1::after, .page h1::after {
    font-size: 1em;
    top: 128px;
  }
  .news h1 br{
    display: block;
  }
  .facility .section_2 .img-area:first-of-type {
    width: 100%;
}
  .facility .section_2 .img-area figure img {
    height: 360px;
  }
  .facility .section_2 .text-area {
    margin: -200px 6vw 0 6vw;
    width: calc(100% - 12vw);
  }
  .facility .section_2 .img-area:last-of-type {
    width: 88vw;
    margin-top: -100px;
}
  .facility .section_2 .img-area:last-of-type figure img {
    height: 320px;
}
.facility .section_3 {
  margin-top: -40px;
}
.facility .section_3 .img-area:first-of-type figure img {
  height: 440px;
}
.facility .section_3 .img-area:nth-of-type(2) figure img {
  height: 480px;
}

.facility .section_3 .text-area {
  margin-top: -240px;
}
.facility .section_3 .img-area:nth-of-type(2) {
  margin: -80px 0 0 auto;
}
.facility .section_4 .text-area {
  margin: -120px 6vw 0 6vw;
}
.facility .section_4 .img-area figure img {
  height: 360px;
}
.facility .section_4 .img-area:nth-of-type(2) figure img {
  height: 480px;
}
.facility .section_4 > div > .img-area:nth-of-type(2) {
  width: 94vw;
  margin-top: -200px;
  margin-left: 0;
}
.facility .section_6 .img-area figure img {
  width: 100%;
  height: 480px;
  object-fit: cover;
}
.course .section_2 .img-area:last-of-type {
  width: 100%;
}
.course .section_3 .img-area:nth-last-of-type(2) {
  width: 100%;
}
.course .section_3 .text-area {
  margin: 0 6vw 0 6vw;
}
.course .section_4 .img-area {
  width: 100%;
  margin: -880px 0 0 0;
}
.course .section_5 .img-area:nth-of-type(2) img {
  height: 560px;
}
.course .section_5 > div > div:last-of-type img {
  height: 480px;
}
.course .section_5 > div > div:last-of-type {
  margin: -200px 0 0 auto;
}
.course .section_5 .text-area {
  transform: translateY(560px);
  margin: 0px 6vw 0 auto;
  width: calc(100% - 12vw);
}
.hole-data li:nth-of-type(1), .hole-data li:nth-of-type(2) {
  margin-right: 16px;
}
.img-hole {
  width: 88%;
}
.eachhole .section_2 ul > li:first-of-type:after {
  left: 0;
}
.hole-data span {
  margin-left: 0;
}
#wpsc-block-calendar .wpsc-calendars-three-columns .wpsc-calendar {
  width: 100% !important;
}
  .address ul li:first-of-type {
    font-size: 32px;
  }
  .member-btn {
    padding: 8px 48px 8px 16px;
}
header > div {
  gap: 0.8em;
}
.yard-btn_2{
  line-height: 3.5;
}
.eachhole .inpage-link li {
  margin-bottom: 0;
}
.yard figure tbody tr:nth-of-type(2) {
  font-size: 11px;
}
.yard figure tbody tr {
  font-size: 14px;
}
.eachhole .inpage-link {
  width: 80%;
}
.eachhole .inpage-link li {
  width: 72px;
}
.link:after {
  background-image: linear-gradient(270deg, rgba(8,9,7,.5) 50%, rgba(8,9,7,1) 99%),url(img/link-bg.jpg);
}
.icon-btn {
  font-size: 13px;
}
.menu-btn p {
  font-size: 13px;
}
.logo-box > a {
  margin-top: -4px;
}
}