@charset "UTF-8";
/* ================================================
  Layout
================================================ */
/* Body
---------------------------------------*/
body{
	width:100% ;
	-webkit-text-size-adjust: 100%;
	font-size:18px;
	line-height:1.8;
	font-family: 'Shippori Mincho','Saira',"Noto Sans JP", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

/* Base
---------------------------------------*/
.wrap{
	width: 100%;
	max-width: 1060px ;
	margin: 0 auto ;}
.wrap02 {
  width: 100%;
	max-width: 960px ;
	margin: 0 auto ;
}
.wrapT {
  width: 100%;
	max-width: 750px ;
	margin: 0 auto ;
}


/* Header
---------------------------------------*/
.sp,.sp1 {display: none;}

.hover {
	display: none;
	position: absolute;}

.flex {display: flex;}
.flexNW {display: flex;}
.flex.Jsb {justify-content: space-between;}
.flexNW.Jsb {justify-content: space-between;}
.flex.Jcn {justify-content: center;}
.flex.Jsa {justify-content: space-around;;}
.flex.Jfe {justify-content: flex-end;}
.flex.alC {align-items:center;}
.flex.alFe {align-items:flex-end;;}
.alignL {text-align: left;}
.alignC {text-align: center;}
.mt10,.umt10 > *{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}
.mt80{margin-top: 80px;}
.mt90{margin-top: 90px;}
.mt100{margin-top: 100px;}
.mt110{margin-top: 110px;}
.mt120{margin-top: 120px;}
.mt150{margin-top: 150px;}
.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}
.mb80{margin-bottom: 80px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}
.mb110{margin-bottom: 110px;}
.mb120{margin-bottom: 120px;}
.mb150{margin-bottom: 150px;}
.mr1p,.umr1p > * {margin-right: 1%;}
.mr10,.umr10 > * {margin-right: 10px;}
.mr20,.umr20 > * {margin-right: 20px;}
.mr30,.umr30 > * {margin-right: 30px;}
.mr40,.umr40 > * {margin-right: 40px;}
.mr50,.umr50 > * {margin-right: 50px;}
.pt50{padding-top: 50px;}
.pt100{padding-top: 100px;}
.pt150{padding-top: 150px;}
.pb150{padding-bottom: 150px;}
.mw200 {
  max-width: 200px;
}
.flex.fwrap { flex-wrap: wrap;}
.Jsb.uw33.fwrap::after {
	content: "";
	display: block;
	width: 33%;
}
.Jsb.uw25.fwrap::before {
	content: "";
	width: 23%;
	order: 1;
}
.Jsb.uw25.fwrap::after {
	content: "";
	width: 23%;
}
.w30, .uw30 > * {width: 29%;}
.w33, .uw33 > * {width: 32%;}
.w45, .uw45 > * {width: 42%;}
.w47, .uw47 > * {width: 48%;}
.w50, .uw50 > * {width: 49%;}
.w60, .uw60 > * {width: 55%;}
.w65, .uw65 > * {width: 64%;}
.w20, .uw20 > * {width: 19%;}
.w25, .uw25 > * {width: 26%;}
.w70, .uw70 > * {width: 69%;}
.w75, .uw75 > * {width: 75%;}
.lead {font-size: 1.1em;}
.red {color: #DC4F4F;}

iframe {
  width: 100%;
  height: 422px;
}

main {text-align: center;}

img {
	max-width: 100%;
	height: auto;
	}
img.imgWaH100,
.imgWaH100 img {
	max-width: auto;
	width: auto;
	height: 100%;
}
figcaption{
  font-size: 0.85em;
  text-align: right;
}


small {
	font-size: 0.9rem;
}


.btn01 {
  display: block;
  background: #cdb495;
  /* background: #cdb495 url(../img/ico01.svg) no-repeat right 20px center;*/
  color: #FFF;
  background-size: 8px;
  text-align: center;
  box-sizing: border-box;
  padding: 10px 30px;
  width: 250px;
  margin: auto 0 0;
}
.btn02 {
  display: block;
  background: #1d1c1a ;
  /*background: #1d1c1a url(../img/ico01.svg) no-repeat right 20px center;*/
  color: #FFF;
  background-size: 8px;
  text-align: center;
  box-sizing: border-box;
  padding: 10px 30px;
  width: 250px;
  margin: auto 0 0;
}

.hover {
	display: none;
	position: absolute;
}


.slide01 {
  width: 100%;
	margin: auto;
  z-index: 1;
  position: relative;
}
  .slide01 li {
    margin: 0 20px;
  }
  .slide01 .slick-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin: 10px auto;
    z-index: 10;
    line-height: normal;
  }
  .slide01 .slick-dots li {
    list-style: none;
    margin: 0 10px;
  }
    .slide01 .slick-dots li button {
      text-indent: -999px;
      overflow: hidden;
      border: 0;
      padding: 0;
      width: 5px;
      height: 5px;
      border-radius: 10px;
      background: #dfdedd;
      display: inline-block;
    }
    .slide01 .slick-dots .slick-active button {
      background: #666;
      width: 6px;
      height: 6px;
    }

dl dd {
  font-size: 0.75em;
}

header {
  /* display: flex;
  flex-direction: column; */
  overflow: hidden;
  width: 100%;
}
header .bgB {
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  display: block;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
header video {
  position: absolute;
  top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 177.77777778vh;
   height: 56.25vw;
   min-height: 100%;
   min-width: 100%;
  z-index: 0;
}
#top header {
  background: url(../img/hotel/slide03.png) no-repeat center center;
  height: 100vh;
  background-size: cover;
  padding: 20px 0 0 0;
  position: relative;
  box-sizing: border-box;
}
#hotel header {
  background: url(../img/hotel/imgMain01.png) no-repeat center center;
  height: 100vh;
  background-size: cover;
  padding: 20px 0 0 0;
  position: relative;
  box-sizing: border-box;
}
#golf header {
  background: url(../img/golf/imgMain.png) no-repeat center center;
  height: 100vh;
  background-size: cover;
  padding: 20px 0 0 0;
  position: relative;
  box-sizing: border-box;
}
	header .flex {
		align-items: center;
    position: relative;
    z-index: 2;
	}
  header .hTitle {
    text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    /* margin: auto; */
    height: 80%;
    color: #FFF;
    position: relative;
    z-index: 2;
    font-size: 45px;
  }
  header h1 {
    /* margin-top: -200px; */
  }
    header h1 img {
      max-width: 560px;
      margin-top: 20px;
      margin-bottom: auto;
    }
  #golf header .wrap {
    max-width: 905px;
  }



	.hNav {
		margin-left: auto;
		margin-right: 0;
		padding: 20px 0;
		background: rgba(0,0,0,0.8);
		width: 100%;
    position: absolute;
    z-index: 100;
    bottom: 0;
	}
	.hNav.fix {
		position: fixed;
		z-index: 10;
		top:0;
    bottom: auto;
	}
		.hNav .wrap {
			max-width: 990px;
		}
    .hNav .logo {
      width: 180px;
      margin: 0;
    }
    .hNav .flex{
      align-items: center;
    }
		.hNav ul{
			align-items: center;
		}
			.hNav ul > li {
				position: relative;
        border-left: solid 1px #FFF;
        display: flex;
        justify-content: center;
			}
      #top .hNav ul > li {
        flex:1;
      }
      #top .hNav ul > li:first-child {
        border-left: none;
			}
  			.hNav ul li a {
  				color: #FFF;
  				font-size: 0.7em;
  				font-weight: 400;
  				text-align: center;
  				width: 100%;
          margin: auto;
          padding: 0 20px;
          display: block;
  			}
        .hNav ul li a span {
          display: block;
          font-size: 0.7em;
          text-align: center;
          width: 100%;
        }



h2 {
	text-align: center;
	margin-bottom: 35px;
	width: 100%;
	font-size: 2.1em;
  color: #c3996d;
	font-weight: 500;
}
.h202 {
  text-align: left;
  border-bottom: solid 2px #c3996d;

  padding: 10px 0;
  font-size: 1.7em;
}
h3 {
	font-size: 1.9em;
}
.h302 {
	font-size: 1.5em;
	color: #80000D;
	font-weight: bold;
	position: relative;
	padding-bottom: 20px;

}
	.h302::after {
		content: "";
		display: block;
		width: 55px;
		border: solid 2px #80000D;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		bottom: 0px;
	}
.tbg01 {
	background: #434343;
	color: #FFF;
	text-align: left;
	padding: 10px;
	font-size: 1.1em;
}
.tbg02 {
	background: #96000F;
	color: #FFF;
	text-align: left;
	padding: 10px;
	font-size: 1.1em;
}


.fadeIn01 {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeIn;
 animation-name: fadeIn;
 visibility: visible !important;
}
.fadeIn02 {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:2s;
 -ms-animation-duration:2s;
 animation-duration:2s;
 -webkit-animation-name: fadeIn;
 animation-name: fadeIn;
 visibility: visible !important;
}
.fadeIn03 {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:2.5s;
 -ms-animation-duration:2.5s;
 animation-duration:2.5s;
 -webkit-animation-name: fadeIn;
 animation-name: fadeIn;
 visibility: visible !important;
}
@-webkit-keyframes fadeIn {
 0% { opacity: 0;}
 30% { opacity: 0;}
 100% { opacity: 1;}
}
@keyframes fadeIn {
 0% { opacity: 0; }
 40% { opacity: 0;}
 100% { opacity: 1;}
}

footer {
  font-family: "Noto Sans JP", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  background: #000;
  color: #FFF;
  text-align: center;
  padding: 100px 0;
  position: relative;
}
  footer img {
    width: 200px;
  }


.pageTop {
	/* display: none; */
	height: 50px;
	width: 50px;
	background: url(../img/pageTop.svg) no-repeat center center;
	margin-top: 30px;
	cursor: pointer;
	position: fixed;
	z-index: 9;
	right: 20px;
	bottom: 30px;
}

.plan {
	/* display: none; */
	width: 45px;
	height: 200px;
	background: url(../img/hotel/plan.svg) no-repeat center center;
	cursor: pointer;
  display: block;
	position: fixed;
	z-index: 100;
	left: 0px;
	top: 260px;
}


@media screen and (max-width:1200px) {
	header .flex.Jsb {
		font-size: 0.9em;
	}
	.fNav{
		display: block;
		height: auto;
	}
}
@media screen and (max-width:1000px) {
	.hamburger {
		display : block;
		position: fixed;
		z-index : 110;
		right: 13px;
		top: 25px;
		width: 45px;
		height: 18px;
		cursor: pointer;
		text-align: center;
	}
		.hamburger > span {
			display: block;
			position: absolute;
			width: 26px;
			height: 3px ;
			left: 6px;
			background: #FFF;
			-webkit-transition: 0.3s ease-in-out;
			-moz-transition: 0.3s ease-in-out;
			transition: 0.3s ease-in-out;
		}
		.hamburger > span:nth-child(1) {
			top: 0px;
		}
		.hamburger > span:nth-child(2) {
			top: 7px;
		}
		.hamburger > span:nth-child(3) {
			top: 14px;
		}

		/* ナビ開いてる時のボタン */
		.hamburger.active {
			position: fixed;
			top: 7px;
			z-index: 90;
		}
		.hamburger.active > span:nth-child(1) {
			top : 16px;
			left: 6px;
			-webkit-transform: rotate(-45deg);
			-moz-transform   : rotate(-45deg);
			transform        : rotate(-45deg);
			background: #FFF;
		}

		.hamburger.active > span:nth-child(2),
		.hamburger.active > span:nth-child(3) {
			top: 16px;
			-webkit-transform: rotate(45deg);
			-moz-transform   : rotate(45deg);
			transform        : rotate(45deg);
			background: #FFF;
		}

		/*  nav  */
		#golf header .flex.Jsb,
    #hotel header .flex.Jsb {
		width: calc(100% - 90px);
      /*width: 70%;*/
  		margin: -10px 0 0 10px;
		}
    header .flex.Jsb img {
      max-width: 160px;
    }
    header .flex.Jsb p + p img {
      max-width: 120px;
    }
		#golf .hNav,
    #hotel .hNav{
			width: 100% ;
			position: fixed;
			background: #000;
			height: 100vh;
			top: 0;
			left: 0;
			margin: 0;
			z-index: 50;
			padding: 60px 3vw;
			box-sizing: border-box;
			display: none !important;
			text-align: center;
		}
    #golf header .hNav .flex.Jsb,
    #hotel header .hNav .flex.Jsb {
      width: 100%;
      margin: auto;
    }
    header .hNav .flex.Jsb img {
      max-width: 160px;
    }
		#hotel .hNav.active,
    #golf .hNav.active {
			display: block !important;
		}
		#hotel .hNav ul,
    #golf .hNav ul {
			border: 0;
			display: block;
			margin-bottom: 20px;
			background: 0;
      width: 100%;
		}
			.hNav ul li{
				padding: 0px 0 ;
				font-size: 20px;
        text-align: center;
				display: block ;
        border-left: 0;
				border-bottom: solid 1px #FFF;
				text-align: left;
				color: #FFF;
				width: 100%;
			}
      #top .hNav ul li{
        border-bottom: 0;
      }
			.hNav > ul > li::before {
				display: none;
			}
			.hNav ul li:last-child {
				border-bottom: 0;
			}
			.hNav > ul > li.hoveron::after {
				content: "";
				width: 10px;
				height: 10px;
				display: block;
				border-left: solid 2px #FFF;
				border-top: solid 2px #FFF;
				transform: rotate(-135deg);
				position: absolute;
				right: 20px;
				top: 15px;
			}
			.hNav > ul > li.hoveron.active::after {
				border-left: solid 2px #FFF;
				border-top: solid 2px #FFF;
				transform: rotate(45deg);
				top: 20px;
			}
			.hNav ul li a {
				color: #FFF !important;
				height: auto;font-size: 14px;
				display: block;
				background: 0;
				padding: 15px 0px;
				width: 90%;
			}
			.hNav ul li a br {
				display: none;
			}
			.hover {
				position: static;
			}
			.hNav ul li ul {
				background: #000;
				display: none;
				position: static;
				width: 100%;
				box-shadow: none;
				left: 0;
				z-index: 3;
				padding: 0px;
				border-top: none;
				margin: 0;
			}
				.hNav ul li ul li a{
					width: 100%;
					padding-left: 20px;
					font-size: 0.9rem;
				}
					.hNav ul li ul li:last-child {
						border-bottom: 0;
					}

	header .flex.Jsb {
		/* flex-wrap: wrap; */
	}
	header .flex.Jfe {
		justify-content: space-between;
		width: 100%;
		margin-top: 20px;
	}

}
@media screen and (max-width:768px) {
	.wrap {
		width: 90%;
	}
  header .hTitle {
    width: 75%;
    margin: auto;
    font-size: 4vw;
  }
	.sp {
		display: block;
	}
	.pc {
		display: none !important;
	}
	.flex {
		flex-wrap: wrap;
		justify-content: center;
	}
	body {
		font-size: 14px;
	}
	h2 {
		font-size: 1.4em;
	}
	h3 {
		font-size: 1.4em;
	}
  header {
    padding: 10px;
  }
  header .flex.jsb img {
    width: 66%;
  }
  .fadeIn01,.fadeIn02,.fadeIn03 {
   -webkit-animation-fill-mode:both;
   -ms-animation-fill-mode:both;
   animation-fill-mode:both;
   -webkit-animation-duration:0.5s;
   -ms-animation-duration:0.5s;
   animation-duration:0.5s;
   -webkit-animation-name: fadeIn;
   animation-name: fadeIn;
   visibility: visible !important;
  }

	footer .wrap {
		width: 95%;
	}
	footer .left {
		width: 100%;
		padding: 0;
		border-right: 0;
	}
	footer .right {
		width: 100%;
		margin-top: 50px;
		padding: 0;
	}
	.fNav > li > a {
		font-size: 1.2em;
	}

  figure {text-align: center;
  margin: 10px 0;}
  .w30, .uw30 > * {width: 100%;}
  .w33, .uw33 > * {width: 100%;}
  .w45, .uw45 > * {width: 100%;}
  .w47, .uw47 > * {width: 100%;}
  .w50, .uw50 > * {width: 100%;}
  .w60, .uw60 > * {width: 100%;}
  .w65, .uw65 > * {width: 100%;}
  .w20, .uw20 > * {width: 100%;}
  .w25, .uw25 > * {width: 100%;}
  .w70, .uw70 > * {width: 100%;}
  .w75, .uw75 > * {width: 100%;}
  .suw33 > * {width: 33%;}

	:not(.scrollBox) table th,
	:not(.scrollBox) table td {
		display: block;
		border-top: 0;
		border-right: 0;
		border-left: 0;
		width: 100%;
		box-sizing: border-box;
		padding: 10px;
	}
	.smt10{margin-top: 10px;}
	.smt20{margin-top: 20px;}
	.smt30{margin-top: 30px;}
	.smt40{margin-top: 40px;}
	.smt50{margin-top: 50px;}
	.smt90{margin-top: 90px;}
	.smA{margin-left: auto;margin-right: auto;}
	.scrollBox {
		width: 100%;
		overflow-x: scroll;
	}

	.scrollBox table {
		min-width: 800px;
	}
	.scrollBox table th,
	.scrollBox table td{
		display: table-cell;
		width: auto;
		border: solid 1px #B5BFC5;
	}
	.tablepc {display: none !important;}
	.fw25 > *,
	.fw33 > *{width: 49%;}
	.fw50 > *{width: 100%;}
	.flex.wid475 div{
		width: 100%;
		margin-bottom: 20px;
	}
	.flex.sJcn {
		justify-content: center;
		flex-wrap: wrap;
	}
	.flex.sJcn > * {
		width: 100%;
	}
	.flex.flexNW {
		flex-wrap: nowrap;
	}

}