@import url(./reset.css);
@import url(./variable-set.css);

/*-------------------------------------------*/

body {
  color: var(--color-basic-text);
  font-size: var(--font-size-md);
  letter-spacing: var(--basic-letter-spacing);
  font-family: "Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,"Yu Gothic"
  "Segoe UI", "Helvetica Neue", Arial,
  "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei,
  "Apple SD Gothic Neo", Gulim, "Malgun Gothic",
  sans-serif;
}

body a {
  color: var(--color-basic-text);
  transition: 0.3s ease-in-out;
}
body a:hover {
  color: var(--color-basic-text);
  text-decoration:none;
  opacity: 0.6;
}

.text-color-primary {
  color: var(--color-primary) !important;
}
.text-color-primary3 {
  color: var(--color-primary3) !important;
}
.bg-color-bg2 {
  background-color: var(--color-bg2) !important;
}
.bg-color-primary {
  background-color: var(--color-primary) !important;
}
.bg-color-primary2 {
  background-color: var(--color-primary2) !important;
}
.bg-color-primary3 {
  background-color: var(--color-primary3) !important;
}
.bg-color-primary4 {
  background-color: var(--color-primary4) !important;
}
.bg-color-primary5 {
  background-color: var(--color-primary5) !important;
}
.bg-color-primary6 {
  background-color: var(--color-primary6) !important;
}

.wrap {
  margin-bottom: var(--section-gap);
}
@media screen and (max-width:960px) {
  .wrap {
    margin-bottom: calc(var(--section-gap) - 3rem);
  }
}

.content-block {
  margin-top: var(--section-gap);
}
@media screen and (max-width:960px) {
  .content-block {
    margin-top: calc(var(--section-gap) - 3rem);
  }
}

.section-title {
  font-size: 2em;
  letter-spacing: .1em;
  line-height: 1;
  font-family: var(--font-family-serif);
  text-align: center;
  margin-bottom: var(--title-gap);
}
.section-title span {
  font-size: var(--font-size-md);
}
@media screen and (max-width:960px) {
  .section-title {
    font-size: 1.5em;
    line-height: 1.2;
    margin-bottom: calc(var(--title-gap)/2);
  }
}
.block-title {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-30%);
  z-index: 1;
  color: var(--color-white-text);
  font-size: 3.5em;
  letter-spacing: .1em;
  line-height: 1;
  font-family: var(--font-family-serif);
  text-align: center;
}
@media screen and (max-width:960px) {
  .block-title {
    font-size: 2.5em;
    line-height: 1.2;
    padding: 0 20px;
  }
}
.block-subtitle {
  margin-bottom: 10px;
  font-size: var(--font-size-lg);
  line-height: var(--basic-line-height);
  font-family: var(--font-family-serif);
}
.subtitle {
  color: var(--color-primary3);
  font-weight: bold;
  line-height: var(--basic-line-height);
  margin-bottom: 10px;
}
.content-text {
  line-height: var(--basic-line-height);
}
.content-text a {
  text-decoration: underline;
}

.content-catch {
  font-family: var(--font-family-serif);
  font-size: var(--font-size-lg);
  line-height: var(--basic-line-height);
}

.block-mainimg-wrap {
  position: relative;
  margin-bottom: 5rem;
}
.block-mainimg-wrap::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,.2);
  z-index: 1;
}
@media screen and (max-width:960px) {
  .block-mainimg-wrap {
    margin-bottom: 3rem;
  }
}

@media only screen and (min-width: 959px) {
  .view_sp {
    display: none !important;
  }
}

@media only screen and (max-width: 960px) {
  .view_pc {
    display: none !important;
  }
}


/* ボタン設定 */
.uk-button {
  color: var(--color-basic-text);
  border: solid 1px var(--color-border);
  background-color: var(--color-bg);
  transition: 0.3s ease-in-out;
  line-height: var(--basic-line-height);
  padding: 15px 30px;
  text-decoration: none;
}
.uk-button:hover {
  color: var(--color-basic-text);
}
.uk-button-default:hover {
  border-color: var(--color-border);
  background-color: #fff;
}
@media (max-width:640px) {
  .uk-button {
    width: 100%;
  }
}


.button-main a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: calc(var(--basic-gap)*2) 0;
  font-family:var(--font-family-serif);
  letter-spacing: 0.1em;
  color: var(--color-white-text);
  z-index: 2;
}
.button-main a:hover {
  color: var(--color-primary);
  opacity: 1;
}
.button-main a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  background: var(--color-primary);
  transform: skewX(-30deg);
  transition: 0.3s ease-in-out;
}
.button-main a:hover::before {
  background-color: #e5e5e5;
  cursor:pointer
}
@media screen and (max-width:960px) {
  .button-main {
    width: 95%;
    margin: 0 auto;
  }
}



/* 個別ボタン設定 */
.footer-contact-button a {
  color: var(--color-primary);
}
.footer-contact-button a::before {
  background: #fff;
  border: solid 1px var(--color-primary);
}
.footer-contact-button a:hover::before {
  border: solid 1px #e5e5e5;
}

.course-button a {
  color: var(--color-white-text);
}
.course-button a::before {
  background: rgba(0,0,0,0.4);
  border: solid 1px #fff;
}
.course-button a:hover::before {
  border: solid 1px #e5e5e5;
}

.news-button {
  width: 160px;
  margin-left: 10px;
  font-size: var(--font-size-sm);
}
.news-button a {
  color: var(--color-primary);
  padding: 5px 10px 5px 30px;
  justify-content: space-between;
}
.news-button a::before {
  background: #fff;
  border: none;
}
.news-button a:hover::before {
  border: none;
}
@media screen and (max-width:960px) {
  .news-button {
    width: 95%;
    font-size: var(--font-size-md);
  }
  .news-button a {
    color: var(--color-primary);
    padding: 10px 0px;
    justify-content: center;
  }
  .news-button a span {
    margin-left: 20px;
  }
}




/* 基本テーブル設定 */
.uk-table {
  line-height: var(--basic-line-height);
}
.uk-table th {
  background-color: var(--color-bg2);
  font-weight: bold;
  vertical-align: middle;
}
.uk-table th.bg-color-primary {
  color: #fff;
}
.uk-table th.bg-color-primary2 {
  color: #fff;
}
.uk-table th.bg-color-primary5 {
  color: #fff;
}
.uk-table th.bg-color-primary6 {
  color: #fff;
}
.uk-table td {
  vertical-align: middle;
}
.uk-table .border-left-solid {
  border-left: solid 3px var(--color-border);
}
.uk-table .border-left-dotted {
  border-left: dotted 2px var(--color-border);
}



/* 基本アコーディオン設定 */
.uk-accordion-title {
  font-size: var(--font-size-md);
}
.uk-accordion-content a:hover {
  color: var(--color-basic-text);
}



/* ページ内ローカルナビ */
.local-nav {
  text-align: center;
  background-color: var(--color-bg2);
}
.local-nav .uk-button {
  min-width: 210px;
}
@media screen and (max-width:640px) {
  .local-nav .uk-button {
    width: 100%;
  }
}


/* ヘッダー */
header {
  position: relative;
  z-index: 10;
  transition: 0.3s ease-in-out;
}
@media screen and (max-width:960px) {
  header {
    position: fixed;
    width: 100%;
  }
}

.header-logo {
  margin-top: 20px;
}
.header-logo img {
  filter: brightness(0%) invert(100%);
  display: block;
  height: 70px;
}
@media screen and (max-width:960px) {
  .header-logo {
    margin-top: 10px;
    margin-left: 10px;
  }
  .header-logo img {
    height: 50px;
    transition: 0.3s ease-in-out;
  }
}

@media screen and (max-width:960px) {
  .header-pc-nav-wrap {
    display: none;
  }
}
.header-pc-nav-wrap > div {
  display: flex;
  justify-content: space-between;
  position: relative;
}

.header-pc-nav {
  display: flex;
  align-self: flex-start;
  align-items: center;
  gap: 10px;
}

.header-language a {
  color: var(--color-white-text);
  padding: 5px;
  transition: all 0.3s ease-in-out;
}

.header-subnav {
  display: flex;
  gap: 5px;
  text-align: center;
}
@media screen and (max-width:960px) {
  .header-subnav {
    display: none;
  }
}
.header-subnav div a {
  display: block;
  color: #fff;
  line-height: 40px;
  min-width: 100px;
  padding: 5px calc(var(--basic-gap)*2);
}
.header-member a {
  background-color: var(--color-primary);
}
.header-weather a {
  background-color: var(--color-primary4);
}
.header-reserve a {
  background-color: var(--color-primary3);
}
.header-entry a {
  background-color: var(--color-dark-bg);
}

.header-sp-nav-wrap {
  display: flex;
  justify-content: space-between;
  position: relative;
}
@media screen and (min-width:959px) {
  .header-sp-nav-wrap {
    display: none;
  }
}
.header-sp-nav {
  display: flex;
  align-items: center;
}
.header-sp-nav-menu .uk-nav-default {
  font-size: 1.2rem;
}
.header-sp-nav-menu .uk-nav-default li a {
  color: var(--color-white-text);
}
@media screen and (min-width:959px) {
  .header-sp-nav-menu {
    display: none;
  }
}

/* スマホ用ドロワーメニュー */
.menu-button{
  color: #fff;
  border: none;
  background-color: transparent;
  transition: 0.3s ease-in-out;
}
.menu-button span{
  font-size: 60px;
}
.menu-button:hover{
  cursor: pointer;
}

.uk-nav .uk-padding-small {
  display: flex;
  align-items: center;
}
.uk-offcanvas-bar {
  left:-100%;
  width:100%;
}
@media (min-width:639px) {
  .uk-offcanvas-bar {
    left:-80%;
    width:80%;
  }
}

.uk-offcanvas-flip .uk-offcanvas-bar {
  right:-100%;
}
@media (min-width:639px) {
  .uk-offcanvas-flip .uk-offcanvas-bar {
    right:-80%;
  }
}





/* 追従ナビ・グローバルナビ */
.fix-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  transition: 0.3s ease-in-out;
  opacity: 0;
  visibility: hidden;
}
.fix-nav.active {
  opacity: 1;
  visibility: visible;
}
.fix-nav-logo {
  width: 30px;
}
.global-nav-logo {
  width: 100px;
}

.global-nav .uk-navbar-nav a,
.fix-nav .uk-navbar-nav a {
  transition: 0.3s ease-in-out;
}
.global-nav .header-language > a,
.fix-nav .header-language > a {
  display: block;
  color: var(--color-basic-text);
  border-bottom: 1px solid var(--color-basic-text);
}
.global-nav .header-subnav,
.fix-nav .header-subnav {
  display: flex;
  gap: 5px;
  text-align: center;
}
.global-nav .header-subnav div a,
.fix-nav .header-subnav div a {
  display: block;
  min-width: 80px;
  padding: 10px var(--basic-gap);
  color: #fff;
  font-size: 14px;
  line-height: inherit;
}
@media screen and (max-width:1400px) {
  .global-nav .uk-navbar,
  .fix-nav .uk-navbar {
    padding: 20px 0;
  }
  .global-nav .uk-navbar-center,
  .fix-nav .uk-navbar-center {
    justify-content: center;
    gap: 10px;
  }
  .global-nav .uk-navbar-nav,
  .fix-nav .uk-navbar-nav {
    align-items: center;
  }
  .global-nav .uk-navbar-nav li a,
  .fix-nav .uk-navbar-nav li a {
    min-height: 0;
  }
  .global-nav .header-language,
  .fix-nav .header-language {
    margin-left: 20px;
  }
}
@media screen and (max-width:960px) {
  .global-nav,
  .fix-nav {
    display: none;
  }
}

.fixed {
  background-color: var(--color-bg2);
}
.fixed .header-language a {
  color: #555;
}
.fixed .menu-button {
  color: #555;
}
.fixed .header-logo img {
  filter: none;
}





/* TOP画像上メインナビ */
.mainnav {
  font-family:var(--font-family-serif);
  font-size: 26px;
  letter-spacing: .15em;
  position: absolute;
  bottom: 12%;
  z-index: 2;
}
.mainnav ul {
  display: grid;
  gap: 30px;
}
.mainnav ul li a {
  color: var(--color-white-text);
  background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: 0 1px;
  transition: background-size 0.5s;
  opacity: 1;
}
.mainnav ul li a:hover {
  background-position: bottom left;
  background-size: 100% 1px;
}
@media screen and (max-width:960px) {
  .mainnav{
    display: none;
  }
}






/* フッター */
.footer-wrap{
  padding-top: calc(var(--section-gap)/2);
  background-color: var(--color-bg);
  border-top: solid 1px var(--color-border);
}

.footer-logo img{
  max-width: 500px;
  width: 85%;
}
.footer-address .content-text a {
  text-decoration: none;
}
.footer-address ul span {
  font-size: calc(var(--font-size-sm)*2);
}
.footer-address strong{
  font-weight: bold;
  font-size: var(--font-size-md);
}

.footer-recruit {
  background-color: var(--color-bg2);
  padding: 20px 0;
}
.footer-recruit h3 {
  color: var(--color-primary3);
}
.footer-recruit h3 span {
  letter-spacing: calc(var(--basic-letter-spacing)*4);
}
.footer-recruit div a:hover {
  color: var(--color-basic-text);
}

.footer-sub {
  background: var(--color-primary);
}
.footer-subnav ul li:not(:last-child) {
  border-right: solid 1px var(--color-border);
}
.footer-subnav .uk-nav>li>a {
  padding:0 20px;
  color: var(--color-white-text);
}
@media screen and (max-width:960px) {
  .footer-sub {
    padding: 20px 0;
  }
}

.footer-sns {
  border-bottom: solid 1px var(--color-primary2);
  margin-top: 20px;
  padding: 20px 0;
  text-align: center;
}
.footer-sns a {
  color: var(--color-primary);
  padding: 6px;
  border: solid 1px #fff;
  border-radius: 10px;
  background-color: #fff;
}
@media screen and (max-width:960px) {
  .footer-sns {
    margin-top: 0;
    padding: 0 0 20px;
  }
}

.footer-sns-icon {
  display: inline-block;
  width: 30px;
}
.footer-sns-icon img {
  vertical-align: middle;
}

.footer-group {
  margin-top: 40px;
}
.footer-group h3 {
  color: var(--color-white-text);
}
.footer-group ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 5px;
}
@media screen and (max-width:960px) {
  .footer-group {
    margin-bottom: 20px;
  }
  .footer-group h3 {
    color: var(--color-white-text);
  }
  .footer-group ul {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  }
}

.footer-copy{
  font-size: var(--font-size-sm);
  text-align: center;
  background-color: var(--color-bg);
}





/* TOPメインイメージ */
.mainimg-wrap {
  position: relative;
  width: 100%;
  height: calc((var(--vh, 1vh) * 100) - 90px);
}
@media screen and (max-width:960px) {
  .mainimg-wrap {
    height: calc(var(--vh, 1vh) * 100);
  }
}
.mainimg-inner {
  width: 100%;
  height: 100%;
  clip: rect(auto, auto, auto, auto);
}
.mainimg-img {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  background-size: cover;
  background-position: center;
  background-image: url(../images/mainimg/screen1.jpg);
}
.mainimg-movie {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  overflow: hidden;
}
.mainimg-movie video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* メイン画像上バナー */
.mainimg-banner {
  position: absolute;
  right: 15px;
  bottom: 15px;
  z-index: 3;
  width: 400px;
}
@media screen and (max-width:640px) {
  .mainimg-banner {
    width: 60%;
  }
}

/* メイン画像上テキストボックス */
.mainimg-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 30px;
  z-index: 3;
}
.mainimg-text p {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.8);
}
@media screen and (max-width:640px) {
  .mainimg-text {
    width: 90%;
  }
}





/* トップ用設定 */
.content-block-top {
  padding-top: var(--section-gap);
}
@media screen and (max-width:960px) {
  .content-block-top {
  padding-top: calc(var(--section-gap)/2);
  }
}
.section-title-top {
  font-size: 3em;
  letter-spacing: .1em;
  line-height: 1;
  font-family: var(--font-family-serif);
  margin-bottom: var(--title-gap);
}
.section-title-top span {
  font-size: 1.3em;
}
@media screen and (max-width:960px) {
  .section-title-top {
    font-size: 2em;
    line-height: 1.2;
    margin-bottom: calc(var(--title-gap)/2);
  }
}





/* 新着情報 */
.topnews-wrap {
  background-color:rgba(41,67,96,.9);
  padding: 20px 0;
}
.topnews-wrap .uk-container {
  display: grid;
  align-items: center;
  grid-template-columns: 250px 1fr;
}
.topnews-wrap h2 {
  color: var(--color-white-text);
  margin-bottom: 10px;
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}
.topnews-wrap .uk-container .news-button {
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}
.topnews-wrap dl {
  position: relative;
  grid-column: 2 / 3;
  grid-row: 1 / 3;
  padding-left: 60px;
  display: flex;
  gap: 5px;
  flex-direction: column;
  color: var(--color-white-text);
}
.topnews-wrap .uk-container dl::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background-color: #fff;
}
.topnews-wrap dl div {
  display: flex;
  gap: 10px;
}
.topnews-wrap dl dt {
  min-width: 100px;
}
.topnews-wrap dl dd {
  flex-grow: 1;
}
.topnews-wrap dl dd a {
  color: var(--color-white-text);
}
@media (max-width:960px) {
  .topnews-wrap .uk-container {
    grid-template-columns: auto;
  }
  .topnews-wrap h2 {
    grid-column: auto;
    grid-row: auto;
    text-align: center;
  }
  .topnews-wrap .uk-container .news-button {
    grid-column: auto;
    grid-row: auto;
    order: 3;
    margin: 20px auto 0;
  }
  .topnews-wrap dl {
    grid-column: auto;
    grid-row: auto;
    padding-left: 0;
    justify-self: center;
  }
  .topnews-wrap .uk-container dl::before {
    content: none;
  }
}





/* カルーセル */
.banner-wrap {
  padding-top: 40px;
  padding-bottom: 20px;
  background-color: var(--color-bg);
}
.banner-wrap .uk-panel p {
  background-color: rgba(255,255,255,.8);
  padding: 0 10px;
  color: var(--color-basic-text);
  line-height: 1.5;
}
.banner-wrap .uk-grid {
  margin-left:-10px
}
.banner-wrap .uk-grid>* {
  padding-left:10px
}
@media (min-width:1200px) {
  .banner-wrap .uk-grid {
    margin-left:-20px
  }
  .banner-wrap .uk-grid>* {
    padding-left:20px
  }
}
.banner-wrap .uk-dotnav>*>* {
  border:1px solid rgba(41,67,96,.4);
}
.banner-wrap .uk-dotnav>*>:hover {
  background-color:rgba(41,67,96,.6);
  border-color:transparent
}
.banner-wrap .uk-dotnav>*>:active {
  background-color:rgba(41,67,96,.2);
  border-color:transparent
}
.banner-wrap .uk-dotnav>.uk-active>* {
  background-color:rgba(41,67,96,.6);
  border-color:transparent
}


/* コースデザイナー */
.designer-wrap {
  position: relative;
  padding-bottom: var(--section-gap);
}
.designer-wrap::before {
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:-1;
  background:url(../images/designer_background.jpg) top center no-repeat;
  background-size:cover;
  background-position: center center;
}
.designer-wrap::after {
  content: "";
  position: absolute;
  top: 15px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
}
@media screen and (max-width:960px) {
  .designer-wrap {
  padding-bottom: calc(var(--section-gap)/2);
  }
}

.designer-wrap h2 {
  color: var(--color-white-text);
}
.designer-holder {
  display: flex;
  gap: 40px;
}
.designer-wrap dl {
  display: flex;
  gap: 10px;
}
.designer-wrap dd {
  font-family: var(--font-family-serif);
  color: var(--color-white-text);
}
.designer-wrap img {
  max-width: 160px;
}
.designer-wrap p {
  color: var(--color-white-text);
}
@media screen and (max-width:960px) {
  .designer-holder {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}

/* コースイントロ */
.course-intro-wrap {

}
@media screen and (max-width:960px) {
  .course-intro-wrap {
  padding-bottom: calc(var(--section-gap)/2);
  }
}
.course-intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.course-intro h2 {
  color: var(--color-white-text);
  text-shadow: 0 5px 15px rgba(0,0,0,.8);
}
.course-intro p {
  color: var(--color-white-text);
  line-height: var(--basic-line-height);
  font-family: var(--font-family-serif);
  text-shadow: 0 5px 15px rgba(0,0,0,.8);
}
.course-catch {
  font-size: var(--font-size-lg);
  padding: 0 20px;
  background-color: var(--color-dark-bg);
}
.course-catch {
  font-size: var(--font-size-lg);
}

/* トーナメント */
.tournament-wrap {
}
.tournament-wrap h2 {
  color: var(--color-white-text);
}
.tournament-holder {
  background-color: var(--color-dark-bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--title-gap) 40px;
}
.tournament-holder div {
  display: flex;
  gap: 20px;
  border-bottom: solid 1px var(--color-border);
  padding: 5px 0;
}
.tournament-holder dl {
  color: var(--color-white-text);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tournament-holder dt {
  min-width: 120px;
}
@media screen and (max-width:960px) {
  .tournament-holder div {
    display: block;
  }
}

/* SNS */
.sns-bar {
  position: relative;
  padding: 40px 0 45px;
  background-color: rgba(41,67,96,.9);
  text-align: center;
}
.sns-bar::after {
  content: "";
  position: absolute;
  bottom: 15px;
  left: 0;
  width: 100%;
  height: 5px;
  background-color: var(--color-primary3);
}
.sns-bar .uk-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding-bottom: 10px;
}
.sns-bar a {
  color: var(--color-primary);
  padding: 6px;
  border-radius: 10px;
  background-color: var(--color-bg);
  width: 50px;
  height: 50px;
}
.sns-icon {
  display: flex;
  align-items: center
}
@media screen and (max-width:960px) {
  .sns-bar .uk-container {
    gap: 10px;
  }
  .sns-bar a {
    width: 40px;
    height: auto;
  }
}






/* COURSEメインイメージ */
.course-mainimg-wrap {
  position: relative;
  width: 100%;
}

.course-mainimg-inner {
  width: 100%;
  height: 100%;
  clip: rect(auto, auto, auto, auto);
}
.course-mainimg-img {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-image: url(../course/images/screen.jpg);
}
.course-mainimg-img::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,.2);
}


/* コースナビ */
.course-nav {
  text-align: center;
  font-family: var(--font-family-serif);
  background-color: var(--color-bg2);
}
.course-nav .uk-button {
  width: 100px;
}
.course-nav h3 {
  display: inline-block;
  color: var(--color-basic-text);
  font-family: var(--font-family-serif);
  font-size: 2em;
  letter-spacing: .1em;
  margin: 0 0 20px;
  border-bottom: solid 1px var(--color-basic-text);
}

.courserate-wrap .uk-button-default.uk-active,
.yard-wrap .uk-button-default.uk-active {
  background-color: var(--color-bg2);
  border-color: #b2b2b2;
}

.course-wrap .content-block,
.yard-wrap .content-block,
.courserate-wrap .content-block {
  padding-top: var(--section-gap);
  margin-top: 0;
}
@media screen and (max-width:960px) {
  .yard-wrap .content-block,
  .courserate-wrap .content-block {
    padding-top: calc(var(--section-gap) - 3rem);
  }
}
.course-wrap .block-title {
  position: relative;
}
.course-wrap .content-catch {
  color: var(--color-white-text);
}
.course-wrap img {
  color: var(--color-white-text);
  filter: drop-shadow(1px 1px 10px rgba(0,0,0,.2));
}
.course-wrap .course-nav {
  padding: var(--section-gap) 0;
  background-color: transparent;
}
@media screen and (max-width:960px) {
  .course-wrap .course-nav {
    padding: calc(var(--section-gap) - 3rem) 0;
  }
}
.course-wrap .course-nav h3 {
  color: var(--color-white-text);
  border-bottom: solid 1px #fff;
}
.course-wrap .course-nav p {
  color: var(--color-white-text);
}
.yard-wrap {
  background-color: var(--color-bg);
}
.yard-wrap .uk-table thead th,
.yard-wrap .uk-table tbody td {
  text-align: center;
}
.yard-wrap h4 span {
  color: var(--color-basic-text);
  font-weight: normal;
  font-size: var(--font-size-sm);
}
.courserate-wrap {
  background-color: var(--color-bg);
  padding-bottom: var(--section-gap);
}
.courserate-wrap .uk-table thead th,
.courserate-wrap .uk-table tbody td {
  text-align: center;
}





/* コース詳細 */
.hole-wrap {
}

.score {
  display: flex;
  align-items: center;
  font-size: var(--font-size-lg);
}
.score span {
  display: inline-block;
  color: var(--color-white-text);
  font-size: var(--font-size-md);
  background-color: var(--color-primary3);
  margin-right: 20px;
  padding: 5px 20px;
}

.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}





/* PLAYERS INFO */

/* ページ内ナビ */
.players-local-nav {
}

/* 営業時間のご案内 */
.hours-wrap {
}
.hours-wrap table thead th {
  width: calc(100% / 3);
  text-align: center;
}
.hours-wrap table tbody td {
  text-align: center;
}

/* ご予約について */
.reservation-info {
}
.reservation-info p span {
  font-weight: bold;
  font-size: 1.5em;
}
.reservation-info p span a {
  text-decoration: none;
}
.reservation-info-title {
  background-color: var(--color-primary);
  padding: 10px;
  color: #fff;
  line-height: 1.5;
}

/* 基本料金について */
.fee-wrap table thead th {
  width: calc(100% / 4);
  text-align: center;
}
.fee-wrap table tbody td {
  text-align: center;
}

/* レンタル用品 */
.rental-wrap {
}

/* ドレスコード */
.dresscode-wrap {

}





/* RESTAURANT */
.restaurant-wrap {
}

/* メニュー一覧 */
.restaurant-menu-button {
  text-align: center;
}

/* 屋外テラス席限定メニュー */
.menu-title {
  font-weight: bold;
  font-size: 1.2em;
}
.menu-title span {
  font-size: var(--font-size-sm);
}

/* おすすめメニュー */
.recommend-wrap {

}





/* FACILITY */
.facility-wrap {
}

/* Dレンジ */
.drange-wrap {
}





/* EVENT */
.event-wrap {
}

.even {
  background-color: var(--color-bg2);
}





/* ACCESS */
.access-wrap {
}

/* googleマップ */
.googlemap-wrap iframe {
  width: 100%;
}
.googlemap-botton a {
  padding: 0 10px 10px 10px;
  border-bottom: solid 1px var(--color-basic-text);
}
.googlemap-botton a:hover {
  color: var(--color-basic-text);
}

/* 施設情報 */
.access-address-wrap h3 {
  font-size: var(--font-size-lg);
  font-family: var(--font-family-serif);
}
.access-address-inner {
  border: solid 1px var(--color-border);
}

/* アクセスルート */
.access-route1 {
  position: relative;
  z-index: 1;
  display: flex;
}
.access-route2 {
  display: flex;
  flex-wrap: wrap;
}
.access-route3,
.access-route4,
.access-route5,
.access-route6 {
  display: flex;
  flex-wrap: wrap;
  margin-top: 20px;
}
.access-route-start,
.access-route-goal {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24.8%;
  height: 4.74em;
  text-align: center;
}
.access-route-start {
  border: solid 1px var(--color-border);
}
.access-route-goal {
  background-color: var(--color-primary);
  color: #fff;
}
.access-road {
  display: flex;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  text-align: center;
  width: 50%;
  height: 100%;
}
.access-road p {
  width: 100%;
  padding: 5px;
}
.access-road p:first-child {
  position: relative;
}
.access-road p:first-child::after {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: -.5px;
  left: 0;
  background-color: var(--color-border);
  }
.access-route-goal img {
  max-width: 160px;
  filter: brightness(0%) invert(100%);
}

@media (max-width:960px) {
  .access-route1 {
    flex-direction: column;
  }
  .access-route2 {
    flex-direction: column;
  }
  .access-route3,
  .access-route4,
  .access-route5,
  .access-route6 {
    flex-direction: column;
    margin-top: 40px;
  }
  .access-route-start,
  .access-route-goal {
    width: auto;
  }
  .access-road {
    width: 100%;
    padding: 20px 0;
    position: relative;
  }
  .access-road p {
    background-color: #fff;
    padding: 0px 10px 10px;
  }
  .access-road p:first-child {
    padding: 10px 10px 0;
    position: static;
  }
  .access-road p:first-child::after {
    width: 1px;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 50%;
    z-index: -1;
    }
  .access-route-goal img {
    max-width: 120px;
  }
}

/* お車でお越しの方 */
.car-wrap .access-route-goal {
  min-height: 35.6em;
}
.car-wrap .access-route2 {
  margin-top: -29.4em
}
@media (max-width:960px) {
  .car-wrap .access-route-start {
    height: 3em;
  }
  .car-wrap .access-route-goal {
    min-height: 3em;
  }
  .car-wrap .access-route2 {
  margin-top: 40px;
  }
}

/* タクシーでお越しの方 */
.taxi-wrap .access-route-goal {
  min-height: 11.25em;
}
.taxi-wrap .access-route2 {
  margin-top: -4.85em;
}
@media (max-width:960px) {
  .taxi-wrap .access-route-start {
    height: 3em;
  }
  .taxi-wrap .access-route-goal {
    min-height: 3em;
  }
  .taxi-wrap .access-route2 {
  margin-top: 40px;
  }
}

/* 提携ホテル */
.hotel-wrap {
}
.hotel-title {
  font-weight: bold;
  font-size: 1.2em;
  line-height: var(--basic-line-height);
}
.hotel-access {
  color: #fff;
  text-align: center;
  line-height: var(--basic-line-height);
  background-color: var(--color-primary3);
}





/* MEMBER */
.member-wrap {
}

.member-wrap input:-webkit-autofill {
  background-color: var(--color-bg2) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--color-bg2) inset;
}
.member-login-button {
  width: 300px;
  background-color: var(--color-primary);
  color: var(--color-white-text);
}
.member-login-button:hover {
  color: var(--color-white-text);
}
@media (max-width:640px) {
  .member-login-button {
    width: 100%;
  }
}
.member-logout-button a {
  color: #fff;
  background-color: var(--color-primary);
  padding: 5px 20px;
}
.member-logout-button a:hover {
  color: var(--color-white-text);
}

.member-reservation,
.brooksclub-reservation {
  margin: 0 auto;
  border: solid 1px var(--color-border);
}

.newsletter-accordion > div,
.brooksclub-accordion .uk-accordion > div,
.officialcompe-accordion .uk-accordion > div,
.club-accordion .uk-accordion > div {
  background-color: var(--color-bg2);
}
.brooksclub-accordion .uk-accordion>:nth-child(n+2),
.officialcompe-accordion .uk-accordion>:nth-child(n+2),
.club-accordion .uk-accordion>:nth-child(n+2) {
  margin-top:5px
}


.memberfee-wrap .uk-table thead th {
  text-align: center;
}
.memberfee-wrap .uk-table .day th {
  width: calc(100% / 6);
  text-align: center;
}
.memberfee-wrap .uk-table td {
  text-align: center;
}




/* NEWS */
.news-wrap .uk-form-custom .uk-button {
  width: 200px;
  padding: 10px 0;
}
@media screen and (max-width:640px) {
  .news-wrap .uk-form-custom {
    display: block;
  }
  .news-wrap .uk-form-custom .uk-button {
    width: 100%;
  }
}
.news-article {
  padding: 40px 0;
  border-top: solid 1px var(--color-border);
}
.news-title {
  font-weight: bold;
  font-size: 1.2em;
  margin-top: 5px;
}
.news-dairy {
}
.news-wrap .uk-pagination {
  border-top: solid 1px var(--color-border);
  padding-top: 20px;
}
.news-wrap .uk-pagination a {
  color: var(--color-basic-text);
  transition: 0.3s ease-in-out;
}
.news-wrap .uk-pagination a:hover {
  color: var(--color-basic-text);
}


/* CONTACT */
.contact-wrap {
}

.contact-wrap input:-webkit-autofill {
  background-color: var(--color-bg2) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--color-bg2) inset;
}
.contact-submit-button {
  width: 300px;
  background-color: var(--color-primary);
  color: var(--color-white-text);
}
.contact-submit-button:hover {
  color: var(--color-white-text);
}
@media (max-width:640px) {
  .contact-submit-button {
    width: 100%;
  }
}

/* お問い合わせ先 */
.contact-info-wrap {
}
.contact-info {
  margin: 0 auto;
  border: solid 1px var(--color-border);
}
.contact-info p span {
  font-weight: bold;
  font-size: 2em;
}
.contact-info p span a {
  text-decoration: none;
}
.contact-info-title {
  background-color: var(--color-primary);
  padding: 10px;
  color: #fff;
  line-height: 1.5;
}





/* SITEMAP */
.sitemap-wrap {
}

.sitemap-wrap .sitemap-list > .uk-list > li {
  padding: 30px 0;
  border-bottom: solid 1px var(--color-border);
}
.sitemap-wrap .sitemap-list > .uk-list > li > a {
  font-size: var(--font-size-lg);
}
.sitemap-wrap .sitemap-list > .uk-list > li > a > span {
  font-size: var(--font-size-md);
}
.sitemap-wrap .uk-list li a:hover {
  color: var(--color-basic-text);
}





/* PRIVACY POLICY */
.privacy-wrap {
}





/* TRANSACTION */
.transaction-wrap {
}






/* COMPANY */
.company-wrap {
}






/* RECRUIT */
.recruit-wrap {
}

/* 応募・お問い合わせ先 */
.recruit-wrap {
}
.recruit-info {
  margin: 0 auto;
  border: solid 1px var(--color-border);
}
.recruit-info p span {
  font-weight: bold;
  font-size: 2em;
}
.recruit-info p span a {
  text-decoration: none;
}
.recruit-info-title {
  background-color: var(--color-primary);
  padding: 10px;
  color: #fff;
}





/* ENTRY */
.entry-wrap {
}

.entry-title {
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 1.2em;
}
.entry-title::before {
  content : "";
  display: inline-block;
  border-left: dotted 4px;
  margin-right: 10px;
  height: 25px;
}
.entry-wrap .mailform dt {
  min-height: 20px;
}
.entry-team-title {
  background-color: var(--color-primary2);
  color: #fff;
  padding: 5px 10px;
}
.entry-player-title {
  background-color: var(--color-bg2);
  font-weight: bold;
  padding: 5px 10px;
}
.entry-accordion li {
  border-bottom: 1px solid var(--color-basic-text);
}
.entry-accordion li:first-child {
  border-top: 1px solid var(--color-basic-text);
}
.entry-accordion .uk-accordion-title::before {
  margin-right:10px;
  float:left;
}