@charset "utf-8";

/* ##### index.php ##### */

/* ???z?u?̕????ɑ΂??āA?}?[?J?[?i?w?i?F?j?t???驛X?^?C?? */

.unsettled{
	background-color:rgba(255,255,10,0.5);
}


/* ## movie ## */
#index_slidewrapper #index_movwrapper {
	width:100%;
	height:100%;
	position:relative;
	overflow:hidden;
}
#index_slidewrapper #index_movwrapper .video {
	position:relative;
	min-width:100%;
	min-height:100%;
	top:50%;
	left:50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* ## slide ## */

#index_slidewrapper {
	width:100%;
	position:relative;
}
#index_slidewrapper * {
	transition:initial;
}
h1#index_ttl {
	width:670px;
	height:200px;
	position:absolute;
	font-size:70px;
	z-index:10004;
	top:0;
	left:0;
	bottom:0;
	right:0;
	margin:auto;
	background:url(/grand/oakhills/assets/img/common/com_copybg_white.png);
	border:1px solid #ffffff;
}
h1#index_ttl div#index_ttl_inner {
	width:670px;
	height:200px;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	line-height:60px;
}
h1#index_ttl span {
	font-size:40px;
	display:block;
	letter-spacing:1px;
}
h1#index_ttl small {
	font-size:30px;
	display:block;
	padding-top:10px;
}
#index_slidewrapper .bxslider li {
	width:100%;
	height:100%;
	background-position:center;
	background-size:cover;
}
#index_slidewrapper .bxslider li#index_slide1 { background-image:url(/grand/oakhills/assets/img/index/index_slide1.jpg?211008); }
#index_slidewrapper .bxslider li#index_slide2 { background-image:url(/grand/oakhills/assets/img/index/index_slide2.jpg); }
#index_slidewrapper .bxslider li#index_slide3 { background-image:url(/grand/oakhills/assets/img/index/index_slide3.jpg?211008); }
#index_slidewrapper .bxslider li#index_slide4 { background-image:url(/grand/oakhills/assets/img/index/index_slide4.jpg); }

#index_slide_down {
	display:block;
	width:60px;
	height:60px;
	background:rgba(0,0,0,0.8);
	position:absolute;
	margin:auto;
	bottom:-20px;
	left:0;
	right:0;
	z-index:10005;
}
#index_slide_down:before {
	top:14px;
	left: 20px;
	width: 19px;
	height: 19px;
	border-top: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	-ms-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
	
	vertical-align:middle;
	position:absolute;
	content:"";
}
#index_slide_down:hover:before {
	top:10px;
}


/* bx override */
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	bottom:56px;
}


/* ## 特殊News（#index_news） ## */

#index_news ul{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	justify-content:center;
	margin:0 auto 10px;
	padding:0;
	width:100%;
}
#index_news li{
	max-width:500px;
	width:50%;
}
#index_news li img{
	width:100%;
}

/* ##### responsive ##### */

@media (min-width: 821px) {
	#index_news {
		bottom:0;
		left: 0;
		margin:0 auto;
		padding: 0;
		position: absolute;
		right: 0;
		top: 0;
		width: 100%;
	}
	#index_news h1 {
		position: absolute;
		top: -60px;
		left: 0;
		right: 0;
		margin: 0;
		color: #ffffff;
	}
	#index_news > .contentbox{
		position: absolute;
		bottom: 20px;
		right:0;
		left: 0;
		margin:0 auto;
		padding: 15px;
		background: rgba(255,255,255,0.6);
	}
	#index_news > .contentbox > h1 {
		margin: 0 0 10px 0;
	}
	#index_news_itmes {
		width:100%;
	}
}
@media (max-width:820px){
	#index_news .contentbox{
		padding:20px 0 0;
	}
	#index_news ul{
		margin: 0 auto;
	}
	#index_news li{
		width:96%;
	}
}


/* ## topics ## */
#index_topic_morebtn {
	padding:12.5px 20px 0 20px;
	text-align:right;
	width:100%;
	max-width: 1000px;
	margin:0 auto;
}
#index_topic_btnbox {
	padding:25px 0 0 0;
	text-align:center;
}
#index_topic_btnbox .com_btn {
	line-height:40px;
	width:300px;
	margin:0 10px;
}
#index_topic_btnbox .com_btn:before {
	top:16px;
	left:80px;
}
#index_topic .txtInfo_w725 {
	display: block;
	max-width: 725px;
	margin: 0 auto;
}

/* ????? */
#index_topic .info_emergency{
	max-width: 960px;
	margin: 10px auto;
}
#index_topic .info_emergency a{
	text-decoration: underline;
}

/* ## feat ## */
#index_feat {
	font-size:0;
}
#index_feat a {
	display:inline-block;
	height:300px;
	position:relative;
	background-size:cover;
	background-position:center;
}
#index_feat .com_copywithbg {
	width:210px;
	height:140px;
}
#index_feat .com_copywithbg .com_copywithbg_inner {
	width:208px;
	height:138px;
}
#index_feat a.index_feat_small {
	width : 33.33333% ;
	width : -webkit-calc(100% / 3) ;
	width : calc((100% / 3)-0.1) ;
}
#index_feat a.index_feat_learge {
	width: 50%;
}
#index_feat1 { background-image:url(/grand/oakhills/assets/img/index/index_feat01.jpg?200318); }
#index_feat2 { background-image:url(/grand/oakhills/assets/img/index/index_feat02.jpg); }
#index_feat3 { background-image:url(/grand/oakhills/assets/img/index/index_feat03.jpg); }
#index_feat4 { background-image:url(/grand/oakhills/assets/img/index/index_feat04.jpg); }
#index_feat5 { background-image:url(/grand/oakhills/assets/img/index/index_feat05.jpg); }

/* ## concept ## */
#index_concept { background: url(/grand/oakhills/assets/img/common/bg_pattern_light.png); }
.index_concept_withtxt .index_concept_withtxt_photo {
	width:50%;
	height:300px;
	background-position:center;
	background-size:cover;
	float:left;
}
.index_concept_withtxt .index_concept_withtxt_text {
	width:50%;
	float:right;
}
.index_concept_withtxt .index_concept_withtxt_text h2 {
	font-size:22px;
	padding-bottom:1em;
	line-height:1.5;
	margin-bottom: 0;
}
.index_concept_withtxt .index_concept_withtxt_text_inner {
	display:table-cell;
	font-size:14px;
	line-height:20px;
	padding:0 30px;
	height:300px;
	vertical-align:middle;
}

#index_concept1 .index_concept_withtxt_photo { background-image:url(/grand/oakhills/assets/img/index/index_concept1.jpg?200916); }
#index_concept2 .index_concept_withtxt_photo { background-image:url(/grand/oakhills/assets/img/index/index_concept2.jpg); float:right; }
#index_concept2 .index_concept_withtxt_text { float:left; }

#index_concept_designerautograph {
	display: block;
	float: right;
	width: 40%;
	max-width: 320px;
	min-width: 180px;
	position: relative;
	top: -5px;
}
#index_concept_designerbox {
	padding: 3em 15px 1em 15px;
	max-width: 9900px;
	margin: 0 auto;
}
#index_concept_designerbox h2 {
	font-size:25px;
	line-height:1.5;
	margin: 0;
	text-align: center;
}
#index_concept_designerbox h2 small {
	font-size: 75%;
}
#index_concept_designer_profile {
	padding-top: 1em;
	padding-bottom: 3em;
}
#index_concept_designer_profile h3 {
	font-weight: bold;
	margin: 0;
}
#index_concept_designer_profile h3 small {
	display: inline-block;
	padding-left: 1em;
	font-size: 80%;
}
#index_concept_designer_photo {
	float: left;
	width: 110px;
}
#index_concept_designer_profile_txt {
	float: right;
	width: 100%;
	margin-left: -130px;
	padding-left: 130px;
	font-size: 80%;
}

.index_concept {
	height:350px;
	position:relative;
	background-position:center;
	background-size:cover;
}
.index_concept a {
	display:block;
	width:100%;
	height:350px;
	position:relative;
}
.index_concept .com_copywithbg {
	width:310px;
	height:100px;
	top:0;
	bottom:0;
	left:120px;
	right:auto;
}
.index_concept .com_copywithbg_inner {
	width:308px;
	height:98px;
	font-size:24px;
	line-height:30px;
}

#index_concept3 { background-image:url(/grand/oakhills/assets/img/index/index_concept3.jpg); }
#index_concept4 { background-image:url(/grand/oakhills/assets/img/index/index_concept4.jpg); }
#index_concept5 { background-image:url(/grand/oakhills/assets/img/index/index_concept5.jpg); }

#index_concept4 .com_copywithbg {
	right:120px;
	left:auto;
}

/* ## index_access ## */
#index_access_textbox {
	position:relative;
	padding:0;
	text-align: center;
}
#index_access_logobox {
	position:absolute;
	top:0;
	left:26%;
	width: 222px;
	height: 60px;
}
#index_access_logo {
	position:absolute;
	top:0;
	display:block;
	width:222px;
	margin-right:10px;
	vertical-align:middle;
}
#index_access_logo img {
	vertical-align:middle;
}
#index_access_gmap {
	width:100%;
	height:420px;
}

#index_access_textbox a.map:hover{
	text-decoration:underline;
}
#index_access_textbox a.map:after{
	background:url(/grand/common/images/icon_map.svg) no-repeat;
	background-size:contain;
	content:'';
	display:inline-block;
	height:1.5em;
	margin-left:10px;
	position:relative;
	top:0.1em;
	width:1.5em;
}



/* ##### responsive ##### */

@media (min-width: 700px) {
	.com_btn{
		white-space: nowrap;
	}
}

@media (max-width: 1099px) {
	/* ## concept ## */
	.index_concept a {
		height:300px;
	}
	.index_concept .com_copywithbg, #index_concept4 .com_copywithbg {
		left:0;
		right:0;
	}
	.com_btn{
		white-space: nowrap;
	}
	/* ????? */
	#index_topic .info_emergency{
		max-width: 900px;
	}
}
@media (max-width:899px) {
	/* ## slide ## */
	h1#index_ttl {
		width:70vw;
		height:25vw;
		font-size:7vw;
	}
	h1#index_ttl div#index_ttl_inner {
		width:70vw;
		height:25vw;
		line-height:6vw;
	}
	h1#index_ttl span {
		font-size:4vw;
	}
	h1#index_ttl small {
		font-size:4vw;
		padding-top:1.2vw;
	}
	.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
		bottom:12px;
	}
	#index_slide_down {
		display:none;
	}

	
	/* ## topics ## */	#index_topic_btnbox .com_btn {
		display:block;
		margin:0 auto;
	}
	#index_topic_btnbox .com_btn:last-child {
		margin-top:10px;
	}
	#index_topic_morebtn .com_txtlink {
		font-size:14px;
	}

	/* ## concept ## */
	.index_concept_withtxt .index_concept_withtxt_text h2 {
		font-size:18px;
		padding-bottom:0.5em;
	}
	.index_concept_withtxt .index_concept_withtxt_text_inner {
		font-size:14px;
		line-height:18px;
	}
	#index_concept_designerbox h2 {
		font-size: 18px;
	}
	.com_btn{
		white-space: nowrap;
	}
	/* ????? */
	#index_topic .info_emergency{
		max-width: 100%;
		padding: 0 20px;
	}
}
@media (max-width:799px) {
	/* ## feat ## */
	#index_feat a, #index_feat a.index_feat_small, #index_feat a.index_feat_learge {
		display:block;
		width:100vw;
		height:42vw;
		max-height:280px;
	}
	#index_feat .com_copywithbg {
		width:180px;
		height:100px;
	}
	#index_feat .com_copywithbg .com_copywithbg_inner {
		width:178px;
		height:98px;
		font-size:24px;
	}
	/* ## concept ## */
	.index_concept_withtxt .index_concept_withtxt_photo, .index_concept, .index_concept a {
		width:100%;
		height:42vw;
		max-height:280px;
		float:none;
	}
	.index_concept_withtxt .index_concept_withtxt_text {
		width:100%;
		float:none;
		height:auto;
	}
	.index_concept_withtxt .index_concept_withtxt_text_inner {
		height:auto;
		padding-bottom:35px;
	}
	.index_concept_withtxt .index_concept_withtxt_text_inner .com_btn {
		display:block;
		margin:0 auto;
		width:200px;
		text-align:center;
	}
	.index_concept .com_copywithbg, .index_concept .com_copywithbg_inner {
		width:62.5vw;
		height:20vw;
		font-size:3.7vw;
	}
	/* ## index_access ## */
	#index_access_textbox {
		padding:0;
		margin:0 auto;
		text-align:center;
		font-size:12.5px;
	}
	#index_access_textbox h2, #index_access_textbox h3 {
		font-size:12.5px;
		text-align:center;
		margin:0;
	}
	#index_access_textbox h3 {
		margin-bottom:10px;
	}
	#index_access_logobox {
		left:0;
		width:145px;
		height: 45px;
	}
	#index_access_logo {
		width:130px;
		margin-right:5px;
	}
	#index_access_logo_gothic {
		width:108px;
	}
	.com_btn{
		white-space: nowrap;
	}
}
@media (max-width:699px) {
	/* ## movie ## */
	#index_slidewrapper #index_movwrapper {
		background:url(../img/index/index_slide1.jpg) center;
		background-size:cover;
	}
	#index_slidewrapper #index_movwrapper .video {
		display:none;
	}
	#index_concept_designer_photo {
		width: 15vw;
	}
	#index_concept_designer_profile_txt {
		margin-left: -18vw;
		padding-left: 18vw;
	}
	#index_topic .txtInfo {
		padding: 0 15px;
		margin-bottom: 40px;
		display: block !important;
		background-color: white;
	}
	#index_topic .txtInfo a {
		display: block;
		color: #0000ee;
		text-decoration: underline;
		text-align: right;
	}
}
@media (max-width:374px) {
	.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
		bottom:8px;
	}
}

/* ---------------------------------------------------------------- */
/* withGolfの予約導線追加（2024/10～）
/* ※バナー表示部分の構造も改修（index_topic_bannerbox）
/* ---------------------------------------------------------------- */

#index_topic_bannerbox{
	display:flex;
	flex-wrap:wrap;
	gap:16px;
	justify-content:center;
	margin:auto;
	padding:50px 0 10px 0;
	text-align:center;
	width:min(100%,960px);
}
#index_topic_bannerbox a{
	display:block;
	width:calc((100% - 16px) / 2);
}
#index_topic_bannerbox a.withGolf{
	font-size:17px;
	height:30px;
	width:100%;
}
#index_topic_bannerbox a.withGolf::before,
#index_topic_bannerbox a.withGolf::after{
	border-bottom:1px dashed #111;
	content:'';
	display:inline-block;
	height:1em;
	margin-right:1em;
	translate:0 -25%;
	width:calc((100% - 27em) / 2);
}
#index_topic_bannerbox a.withGolf::after{
	margin-left:1em;
	margin-right:0;
}
#index_topic_bannerbox a img{
	border:1px solid #777777;
	display:block;
	width:100%;
}

/* ##### responsive ##### */

@media(max-width: 1099px){
	#index_topic_bannerbox{
		width:min(100%,900px);
	}
}
@media(max-width:899px){
	#index_topic_bannerbox{
		padding-left:15px;
		padding-right:15px;
	}
}
@media(max-width:699px){
	#index_topic_bannerbox{
		width:min(100%,450px);
	}
	#index_topic_bannerbox a{
		width:100%;
	}
	#index_topic_bannerbox a.withGolf{
		font-size:16px;
	}
}
@media(max-width:450px){
	#index_topic_bannerbox a.withGolf{
		font-size:max(min(3.56vw,16px),14px);
	}
}
/* ###################### */