/* Font Family */

@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=LINE+Seed+JP:wght@400;700&family=M+PLUS+1p&display=swap');

:root{
	/* 游明朝 */
	--yu-min:"游明朝", "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif;
	/* LINE Seed JP */
	--line:"LINE Seed JP", sans-serif;
	/* M Plus 1P */
	--m-plus:"M PLUS 1p", sans-serif;
	/* Jost */
	--jost:"Jost", sans-serif;
}


/* Font Size */

:root{
	--fz12:max(min(0.9vw,12px),10px);
	--fz13:max(min(0.95vw,13px),12px);
	--fz14:max(min(1.0vw,14px),11px);
	--fz16:max(min(1.2vw,16px),12px);
	--fz18:max(min(1.33vw,18px),13px);
	--fz20:max(min(1.5vw,20px),14px);
	--fz24:max(min(1.8vw,24px),16px);
	--fz28:max(min(2.1vw,28px),20px);
	--fz32:max(min(2.4vw,32px),22px);
	--fz36:max(min(2.7vw,36px),25px);
	--fz40:max(min(3vw,40px),28px);
	--fz44:max(min(3.3vw,44px),31px);
	--fz48:max(min(3.6vw,48px),34px);
	--fz52:max(min(3.9vw,52px),36px);
	--fz56:max(min(4.1vw,56px),39px);
	--fz60:max(min(4.4vw,60px),42px);
}


/* Distance */

:root{
	/* 5の倍数 */
	--d5:max(min(0.37vw,5px),4px);
	--d10:max(min(0.74vw,10px),8px);
	--d15:max(min(1.11vw,15px),12px);
	--d20:max(min(1.33vw,20px),16px);
	--d25:max(min(1.85vw,25px),20px);
	--d30:max(min(2.22vw,30px),24px);
	--d35:max(min(2.59vw,35px),28px);
	--d40:max(min(2.96vw,40px),32px);
	--d45:max(min(3.33vw,45px),36px);
	--d50:max(min(3.7vw,50px),40px);
	--d55:max(min(4.07vw,55px),44px);
	--d60:max(min(4.44vw,60px),48px);
	--d65:max(min(4.81vw,65px),52px);
	--d70:max(min(5.18vw,70px),56px);
	--d75:max(min(5.55vw,75px),60px);
	--d80:max(min(5.92vw,80px),64px);
	--d85:max(min(6.3vw,85px),68px);
	--d90:max(min(6.67vw,90px),72px);
	--d95:max(min(7.04vw,95px),76px);
	--d100:max(min(7.41vw,100px),80px);
	--d150:max(min(11.11vw,150px),120px);
	/* 8の倍数（優先） */
	--d8:max(min(0.6vw, 10px), 6px);
	--d16:max(min(1.2vw, 20px), 12px);
	--d24:max(min(1.8vw, 30px), 20px);
	--d32:max(min(2.4vw, 40px), 26px);
	--d40:max(min(3.0vw, 50px), 32px);
	--d48:max(min(3.6vw, 60px), 40px);
	--d56:max(min(4.2vw, 70px), 46px);
	--d64:max(min(4.8vw, 80px), 52px);
	--d72:max(min(5.4vw, 90px), 58px);
	--d80:max(min(6.0vw, 100px), 64px);
	--d88:max(min(6.6vw, 110px), 72px);
	--d96:max(min(7.2vw, 120px), 80px);
	--d128:max(min(9.6vw, 160px), 104px);
	--d160:max(min(12.0vw, 200px), 128px);
}

.anchor{
	padding-top:150px;
	margin-top:-150px !important;
}

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

@media(max-width:830px){
	.anchor{
		padding-top:80px;
		margin-top:-80px !important;
	}
}

/* ################################ */


header{
	padding-bottom:100px;
}

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

@media(max-width:960px){
	header{
		padding-bottom:68px;
	}
}
@media(max-width:600px){
	header{
		padding-bottom:44px;
	}
}

/* ################################ */


/*----------------------------------------------------------------------------*/
/* パンくずおよびSNSボタンの設定(#breadSns)
/*----------------------------------------------------------------------------*/

#breadSns{
  background-color:#F3F3F3;
  padding:10px;
  position:relative;
}
#breadSns #snsBox{
  position:absolute;
  right:10px;
  top:10px;
}
#breadSns #snsBox li{
	display:inline-block;
	margin-left:10px;
	vertical-align:top;
}

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

@media(max-width:500px){
	#breadSns{
		min-height:40px;
	}
}

/* ################################ */


/*----------------------------------------------------------------------------*/
/* メインビジュアル（#mv）
/*----------------------------------------------------------------------------*/

#mv{
	aspect-ratio:1350/950;
	background:url(../img/bg_mv_pc.jpg) no-repeat;
	background-position:left top;
	background-size:cover;
	overflow:hidden;
	padding:15vw 0 0 16vw;
	position:relative;
	width:100%;
}
#mv h1{
	aspect-ratio:323/202;
	width:24vw;
}
#mv h1 img{
	width:100%;
}
#mv p{
	bottom:4vw;
	color:#333;
	font-family:var(--line);
	font-size:var(--fz24);
	font-weight:400;
	line-height:1.6;
	position:absolute;
	right:4vw;
	text-shadow:2px 2px 1px #FFF,-2px -2px 1px #FFF,2px 0 1px #FFF,0 2px 1px #FFF,-2px 0 1px #FFF,0 -2px 1px #FFF,-2px 2px 1px #FFF,2px -2px 1px #FFF;
	width:45vw;
	z-index:10;
}

/* アンバサダープロ */

#mv ul{
	aspect-ratio:1350/950;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}
#mv ul li{
	position:absolute;
}
#mv ul li>img{
	width:100%;
}
/* 菊地 彩香プロ */
#mv ul.pro li.kikuchi{
	aspect-ratio:436/369;
	bottom:14.5vw;
	right:9vw;
	width:32.4vw;
}
/* 逢澤 奈央プロ */
#mv ul.pro li.aizawa{
	aspect-ratio:300/213;
	bottom:9.3vw;
	left:19.7vw;
	width:23vw;
}
/* 末永 美穂プロ */
#mv ul.pro li.suenaga{
	aspect-ratio:300/213;
	right:21.5vw;
	top:7vw;
	width:22vw;
}
/* 西山 奏プロ */
#mv ul.pro li.nishiyama{
	aspect-ratio:170/193;
	right:0vw;
	top:6vw;
	translate:5% 0;
	width:12.6vw;
}
/* 名守 亮プロ */
#mv ul.pro li.namori{
	aspect-ratio:1;
	bottom:11.5vw;
	left:0;
	translate:-5% 0;
	width:13.3vw;
}

/* イラストモチーフ */

/* ハート */
#mv ul.deco li.heart{
	animation:heartbeat 1.2s infinite;
	aspect-ratio:1;
	filter:drop-shadow(5px 5px 5px rgba(0,0,0,.3));
	top:4.6vw;
	left:4.5vw;
	rotate:-10deg;
	width:7.5vw;
}
@keyframes heartbeat {
	0% {
		transform: scale(1);
	}
	14% {
		transform: scale(1.15);
	}
	28% {
		transform: scale(1);
	}
	42% {
		transform: scale(1.15);
	}
	70% {
		transform: scale(1);
	}
	100% {
		transform: scale(1);
	}
}
/* ゴルフ場 */
#mv ul.deco li.green{
	aspect-ratio:1;
	filter:drop-shadow(5px 5px 5px rgba(0,0,0,.3));
	left:35.3vw;
	top:4.2vw;
	width:7.0vw;
}
/* ゴルフクラブ */
#mv ul.deco li.club{
	animation:swing 1.8s ease-in-out infinite;
	aspect-ratio:1;
	filter:drop-shadow(5px 5px 5px rgba(0,0,0,.3));
	top:14.2vw;
	transform-origin:90% 0%;
	right:14.2vw;
	width:7.0vw;
}
@keyframes swing {
	0% {
		transform: rotate(-12deg);
	}
	50% {
		transform: rotate(12deg);
	}
	100% {
		transform: rotate(-12deg);
	}
}
/* ゴルフボール */
#mv ul.deco li.ball{
	animation: bounce 1.8s ease-out forwards;
	aspect-ratio:1;
	bottom:30vw;
	filter:drop-shadow(5px 5px 5px rgba(0,0,0,.3));
	left:50vw;
	width:3.0vw;
}

@keyframes bounce {
	0% {
		transform: translateY(0);
	}
	25% {
		transform: translateY(-120px);
	}
	40% {
		transform: translateY(0);
	}
	52% {
		transform: translateY(-70px);
	}
	62% {
		transform: translateY(0);
	}
	70% {
		transform: translateY(-35px);
	}
	77% {
		transform: translateY(0);
	}
	83% {
		transform: translateY(-15px);
	}
	88% {
		transform: translateY(0);
	}
	93% {
		transform: translateY(-5px);
	}
	100% {
		transform: translateY(0);
	}
}
/* カメラ */
#mv ul.deco li.camera{
	aspect-ratio:1;
	bottom:24.3vw;
	filter:drop-shadow(5px 5px 5px rgba(0,0,0,.3));
	left:8.4vw;
	rotate:-10deg;
	width:7.0vw;
}

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

@media(max-width:830px){
	#mv{
		aspect-ratio:768/1050;
		background:url(../img/bg_mv_tab.jpg) no-repeat;
		background-position:center top;
		background-size:cover;
		padding:0;
	}
	#mv h1{
		left:50%;
		position:absolute;
		top:50%;
		translate:-50% -80%;
		width:40vw;
	}
	#mv ul{
		aspect-ratio:768/1050;
	}
	
	/* アンバサダープロ */
	
	/* 菊地 彩香プロ */
	#mv ul.pro li.kikuchi{
		bottom:inherit;
		left:0;
		right:inherit;
		top:0;
		translate:-5% -5%;
		width:43vw;
	}
	/* 逢澤 奈央プロ */
	#mv ul.pro li.aizawa{
		bottom:18vw;
		left:35.5vw;
		width:32vw;
	}
	/* 末永 美穂プロ */
	#mv ul.pro li.suenaga{
		right:0;
		top:4.4vw;
		width:27vw;
	}
	/* 西山 奏プロ */
	#mv ul.pro li.nishiyama{
		right:1vw;
		top:80vw;
		translate:inherit;
		width:20vw;
	}
	/* 名守 亮プロ */
	#mv ul.pro li.namori{
		bottom:46vw;
		left:0;
		translate:-5% 0;
		width:18vw;
	}
	
	/* イラストモチーフ */

	/* ハート */
	#mv ul.deco li.heart{
		top:39vw;
		left:4.5vw;
		width:11.2vw;
	}
	/* ゴルフ場 */
	#mv ul.deco li.green{
		left:52vw;
		top:1.3vw;
		width:9.1vw;
	}
	/* ゴルフクラブ */
	#mv ul.deco li.club{
		top:30vw;
		right:5vw;
		width:8.0vw;
	}
	/* ゴルフボール */
	#mv ul.deco li.ball{
		bottom:65vw;
		left:unset;
		right:3vw;
		width:4.5vw;
	}
	/* カメラ */
	#mv ul.deco li.camera{
		bottom:32vw;
		left:15vw;
		width:13vw;
	}

	#mv p.lead{
		right:50%;
		translate:50% 0;
		width:min(100%,90vw);
	}
	#mv p.lead br{
		display:none;
	}
}

@media(max-width:500px){
	#mv{
		aspect-ratio:414/816;
		background:url(../img/bg_mv_sp.jpg) no-repeat;
		background-position:center top;
		background-size:cover;
		width:100%;
	}
	#mv h1{
		translate:-50% -73%;
		width:58vw;
	}
	#mv ul{
		aspect-ratio:414/816;
	}
	
	/* アンバサダープロ */
	
	/* 菊地 彩香プロ */
	#mv ul.pro li.kikuchi{
		top:3vw;
		translate:-5% 0;
		width:55vw;
	}
	/* 逢澤 奈央プロ */
	#mv ul.pro li.aizawa{
		bottom:26vw;
		left:30vw;
		width:40vw;
	}
	/* 末永 美穂プロ */
	#mv ul.pro li.suenaga{
		right:0;
		top:16vw;
		translate:5% 0;
		width:35vw;
	}
	/* 西山 奏プロ */
	#mv ul.pro li.nishiyama{
		right:15vw;
		top:110vw;
		width:20vw;
	}
	/* 名守 亮プロ */
	#mv ul.pro li.namori{
		bottom:65vw;
		left:0;
		translate:-5% 0;
		width:20vw;
	}
	
	/* イラストモチーフ */
	
	/* ハート */
	#mv ul.deco li.heart{
		top:55vw;
		left:1vw;
		width:12vw;
	}
	/* ゴルフ場 */
	#mv ul.deco li.green{
		left:60vw;
		top:2vw;
		width:12vw;
	}
	/* ゴルフクラブ */
	#mv ul.deco li.club{
		top:48vw;
		right:8vw;
		width:10vw;
	}
	/* ゴルフボール */
	#mv ul.deco li.ball{
		bottom:37vw;
		left:unset;
		right:7vw;
		width:8vw;
	}
	/* カメラ */
	#mv ul.deco li.camera{
		bottom:41vw;
		left:10vw;
		width:13vw;
	}

}

/* ################################ */


/*----------------------------------------------------------------------------*/
/* Instagramバナー（#insta）
/*----------------------------------------------------------------------------*/

#insta{
	margin:0 auto var(--d50);
	padding:var(--d30) var(--d20) var(--d50);
	position:relative;
	width:min(96%,900px);
}
#insta a{
	filter:drop-shadow(0 5px 5px rgba(0,0,0,.25));
}
#insta a:hover{
	filter:drop-shadow(0 2px 2px rgba(0,0,0,.5));
	opacity:.8;
	transition:.5s ease;
}
#insta img{
	width:100%;
}


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

@media(max-width:1000px){

}

/* ################################ */


/*----------------------------------------------------------------------------*/
/* withGolfアンバサダーリスト（#ambassador）
/*----------------------------------------------------------------------------*/

#ambassador{
	font-family:var(--line);
	font-size:var(--fz16);
	margin:0 auto var(--d100);
	text-align:center;
	width:min(96%,1300px);
}

#ambassador h2{
	align-items:center;
	color:#f07880;
	display:flex;
	font-family:var(--m-plus);
	font-size:var(--fz36);
	font-weight:normal;
	margin:0 auto var(--d70);
	width:min(96%,1200px);
}
#ambassador h2:before,
#ambassador h2:after{
	background:url(../img/bg_list_title.svg) no-repeat;
	background-position:center;
	background-size:contain;
	content:'';
	flex-grow:1;
	height:0.8em;
	margin-right:20px;
}
#ambassador h2:after{
	margin-left:20px;
	margin-right:inherit;
}
#ambassador ul.ambList{
	display:flex;
	flex-wrap:wrap;
	gap:var(--d50);
}

/* アンバサダー共通 */

#ambassador ul.ambList>li{
	background:#FFFDF2;
	border:2px solid #F2C3C7;
	border-radius:10px;
	display:flex;
	flex-direction:column;
	padding:var(--d25) var(--d25) var(--d40);
	width:calc((100% - (var(--d50) * 2)) / 3);
}
#ambassador figure{
	margin:0 auto var(--d20);
}
#ambassador figure a:hover{
	opacity:.75;
}
#ambassador figure .wrap{
	aspect-ratio:1;
	border:1px solid #F2C3C7;
	border-radius:var(--d10);
	overflow:hidden;
	width:100%;
}
#ambassador figure .wrap img{
	height:100%;
	object-fit:cover;
	object-position:center top;
	width:100%;
}
#ambassador figcaption{
	color:#333;
	font-size:var(--fz24);
	margin-top:0.5em;
}
#ambassador dl.course{
	margin:0 auto var(--d25);
}
#ambassador dl.course>dd{
	margin-bottom:var(--d5);
	text-align:left;
}
#ambassador dl.course>dd>a{
	color:#333;
	display:inline-block;
	padding-left:4.5em;
	position:relative;
}
#ambassador dl.course>dd>a:hover{
	opacity:.75;
}
#ambassador dl.course>dd>a:before{
	align-items:center;
	background:#F09197;
	border-radius:var(--d5);
	color:#FFF;
	content:attr(itemprop);
	display:flex;
	font-size:75%;
	justify-content:center;
	left:0;
	margin-right:0.5em;
	padding:0.25em 0.5em;
	position:absolute;
	text-align:center;
	top:0;
	min-width:4em;
}

#ambassador .btn{
	display:flex;
	gap:var(--d15);
	justify-content:space-between;
	margin-top:auto;
	width:100%;
}
#ambassador .btn p.insta{
	flex-grow:1;
}
#ambassador .btn p.insta a{
	aspect-ratio:1;
	background:url(../img/btn_insta.svg) no-repeat;
	background-size:contain;
	display:inline-block;
	height:100%;
	position:relative;
}
#ambassador .btn p.insta a:after{
	aspect-ratio:70/21;
	background:url(../img/follow_me.svg) no-repeat;
	background-size:contain;
	bottom:0;
	content:'';
	left:0;
	position:absolute;
	translate:0 105%;
	width:var(--d70);
}
#ambassador .btn p.withGolf{
	flex-grow:2;
}
#ambassador .btn p.withGolf a{
	background:#FF3392;
	border-radius:10px;
	color:#FFF;
	display:inline-block;
	font-size:var(--fz16);
	line-height:1;
	padding:var(--d15) var(--d20);
	width:100%;
}
#ambassador .btn p.withGolf a:hover{
	opacity:.8;
}

/* 男性アンバサダーのスタイル */

#ambassador ul.ambList>li.mens{
	border:2px solid #BBD659;
}
#ambassador li.mens figure .wrap{
	border:1px solid #BBD659;
}
#ambassador li.mens dl.course>dd>a:before{
	background:#91A629;
}
#ambassador li.mens .btn p.withGolf a{
	background:#91A629;
}

/* アバイディングクラブ ゴルフソサエティ特別対応（.abiding） */

a.abiding{
	letter-spacing:-0.05em;
}

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

@media(max-width:830px){
	#ambassador ul.ambList>li{
		width:calc((100% - var(--d50)) / 2);
	}
	#ambassador dl.course>dd>a{
		font-size:var(--fz20);
	}
	#ambassador figcaption{
		font-size:var(--fz36);
	}
	#ambassador .btn p.withGolf a{
		font-size:var(--fz28);
		padding:var(--d15) 0;
	}
}
@media(min-width:601px){
	#ambassador dl.course>dd>a:hover:after{
		border-radius:5px;
		color:#FFF;
		content:attr(data-tooltip);
		display:inline-block;
		font-size:75%;
		opacity:1 !important;
		padding:0.5em 1em;
		position:absolute;
		right:0;
		top:50%;
		translate:110% -50%;
	}
	#ambassador dl.course>dd.pgm>a:hover:after{
		background:#0086CD;
	}
	#ambassador dl.course>dd.ag>a:hover:after{
		background:#009C42;
	}
}
@media(max-width:600px){
	#ambassador h2{
		display:block;
		font-size:var(--fz40);
		margin:0 auto var(--d70);
		position:relative;
		width:min(96%,1200px);
	}
	#ambassador h2:before,
	#ambassador h2:after{
		background-position:center;
		display:block;
		left:50%;
		margin:inherit;
		position:absolute;
		top:0;
		translate:-50% -130%;
		width:100%;
	}
	#ambassador h2:after{
		bottom:0;
		margin:inherit;
		translate:-50% 210%;
	}
	#ambassador ul.ambList>li{
		margin:0 auto;
		width:96%;
	}
	#ambassador dl.course>dd.pgm>a:before{
		background:#0086CD !important;
	}
	#ambassador dl.course>dd.ag>a:before{
		background:#009C42 !important;
	}
	#ambassador dl.course>dd>a{
		font-size:var(--fz24);
	}
}

/* ################################ */

