@charset "utf-8";
/* CSS Document */

/***************リセット***************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
	vertical-align: baseline;
}
h1, h2, h3, h4, h5, h6{
	font-size:100%;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea{
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse; 
    border-spacing:0;
}

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}
/***************／リセット***************/
.fs-l-pageMain ul li::before{
	content: none;
}
.tourtee *, .tourtee *::before, .tourtee *::after{
	box-sizing: border-box;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', Roboto, Arial, sans-serif;
	font-weight: 500;
	color: #444444;
}
.tourtee .oSP{
	display: block;
}
.tourtee .oPC{
	display: none;
}
.tourtee img{
	display: block;
	width: 100%;
	height: auto;
}
.tourtee img.oSP{
	display: block;
}
.tourtee img.oPC{
	display: none;
}

.fs-l-pageMain{
	padding-bottom: 7.5rem;
}
@media screen and (min-width:768px) {
	.tourtee .oSP{
		display: none;
	}
	.tourtee .oPC{
		display: block;
	}
	.tourtee img.oSP{
		display: none;
	}
	.tourtee img.oPC{
		display: block;
	}
	.fs-l-main{
	}
}


/***************KV***************/
.kv{
	background: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/kv_sp.jpg") no-repeat 50% 0 / 100% auto;
	height: 119vw;
}
.kv h1{
	width: 100%;
	margin: 0 auto;
	padding-top: 15vw;
}
@media screen and (min-width:768px) {
	.kv{
		background-image: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/kv.jpg");
		height: 42.7vw;
		height: calc( 820 / 1920 * 100vw );
	}
	.kv h1{
		width: 66.66666vw;
		width: calc( 1920 / 2880 * 100vw);
		padding-top: 8vw;
		padding-top: calc( 150 / 2880 * 100vw);
	}
}

/***************／KV***************/
/***************共通***************/
.tourtee .w900{
	max-width: 960px;
	padding: 0 2vw;
	margin: 0 auto;
}
.tourtee h3{
	position: relative;
	padding-bottom: 3.5vw;
	margin-bottom: 8vw;
	text-align: center;
	font-size: 4.8vw;
	font-weight: 700;
}
.tourtee h3::before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	width: 12.4vw;
	height: 1.6vw;
	background-image: linear-gradient( 90deg, #3fa87b 0%, #d1c84d 100%);
	clip-path: polygon(16% 0, 84% 0, 100% 50%, 84% 100%, 16% 100%, 0 50%);
}
@media screen and (min-width:768px) {
	.tourtee .w900{
		padding: 0 20px;
	}
	.tourtee h3{
		padding-bottom: 22px;
		margin-bottom: 50px;
		font-size: 24px;
	}
	.tourtee h3::before{
		width: 70px;
		height: 8px;
	}
}
/***************／共通***************/
/***************コンテンツ1***************/
/**リード**/
.teeCont01{
	margin-top: -7vw;
	padding-top: 8.8vw;
	background: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/bg_sp.png") no-repeat 50% 0 / 100% auto;
}
.teeCont01 h2 > img{
	width: 30.8vw;
	margin: 0 auto 2.2vw;
}
.teeCont01 h2 > figure{
	width: 71.4vw;
	margin: 0 auto;
}
.teeCont01 h2 > figure figcaption{
	margin-top: 1.6vw;
	text-align: center;
	font-size: 4.2vw;
	font-weight: 700;
	color: #587e5c;
}
.lead01{
	margin: 3vw auto 11vw;
	text-align: center;
	font-size: 4vw;
	font-weight: 700;
	line-height: 1.45;
}
@media screen and (min-width:768px) {
	.teeCont01{
		margin-top: -0.156vw;
		margin-top: calc( 30 / 1920 * -100vw);
		padding-top: 2.08vw;
		padding-top: calc( 40 / 1920 * 100vw);
		background-image: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/bg.png");
	}
	.teeCont01 h2 > img{
		width: 172px;
		margin: 0 auto 12px;
	}
	.teeCont01 h2 > figure{
		width: 400px;
	}
	.teeCont01 h2 > figure figcaption{
		margin-top: 10px;
		font-size: 20px;
	}
	.lead01{
		margin: 30px auto 60px;
		font-size: 20px;
		line-height: 1.5;
	}
}
/**／リード**/
.teeOrder > article{
	position: relative;
	padding-bottom: 16vw;
}
@media screen and (min-width:768px) {
	.teeOrder > article{
		display: flex;
		padding-bottom: 80px;
	}
}
/**タイトル**/
.teeOrder h4{
	position: relative;
	width: 24.8vw;
	margin: 0 auto 7vw;
	padding: 3vw 0 0 9.2vw;
}
.teeOrder h4::before, 
.teeOrder h4::after{
	content: '';
	position: absolute;
	display: block;
	width: 14vw;
	height: 12vw;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.teeOrder h4::before{
	top: 4vw;
	left: 1.2vw;
  background-image: linear-gradient( 0deg, #d1c84d 0%, #3fa87b 52%);
}
.teeOrder h4::after{
	top: 0;
	left: 3.1vw;
	background-color: #587e5c;
}
.teeOrder h4 img{
	position: relative;
	z-index: 1;
}
@media screen and (min-width:768px) {
	.teeOrder h4{
		flex-shrink: 0;
		width: 120px;
		margin: 0;
		padding: 14px 0 0 40px;
	}
	.teeOrder h4::before, 
	.teeOrder h4::after{
		width: 70px;
		height: 60px;
	}
	.teeOrder h4::before{
		top: 20px;
		left: 0;
	}
	.teeOrder h4::after{
		top: 0;
		left: 10px;
	}
}
/**／タイトル**/
/**テキスト**/
.teeOrder h5{
	margin-bottom: 4vw;
	text-align: center;
	font-size: 4.6vw;
	font-weight: 700;
	color: #587e5c;
}
.teeOrder .lead02{
	text-align: center;
	font-size: 3.8vw;
	font-weight: 700;
	line-height: 1.26;
	letter-spacing: -0.05em;
}
.teeOrder .note01{
	padding: 3vw 6.4vw 0;
}
.teeOrder	.teeO01 .note01{
	padding: 3vw 3vw 0;
}
.teeOrder .note01 li{
	position: relative;
	padding: 0 0 0 1em;
	font-size: 3.4vw;
	line-height: 1.23;
	letter-spacing: -0.04em;
}
.teeOrder .note01 li::before{
	content: '※';
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (min-width:768px) {
	.teeCont01OR{
		padding-left: 12px;
	}
	.teeOrder h5{
		margin: 6px 0 26px 38px;
		text-align: left;
		font-size: 24px;
	}
	.teeOrder .lead02{
		padding-left: 38px;
		text-align: left;
		font-size: 18px;
		letter-spacing: 0;
	}
	.teeOrder .note01{
		padding: 18px 0 0 38px;
	}
	.teeOrder .note01 li{
		padding-bottom: 16px;
		font-size: 14px;
		letter-spacing: 0.03em;
	}
}
/**／テキスト**/
/**画像**/
.teeOrder .teeIll.oSP{
	margin-top: 4vw;
}
/**
.teeO01 .teeIll.oSP{
	width: 64vw;
	margin-left:auto;
	margin-right:auto;
}
**/
@media screen and (min-width:768px) {
	.teeOrder .teeIll.oPC{
		margin: 24px 0 0 38px;
	}
/**
	.teeO01 .teeIll.oPC{
		flex-shrink: 0;
		width: 270px;
		margin: 0;
	}
**/
}
/**／画像**/
/**ボタン**/
.teeBtnWrap{
	display: flex;
	justify-content: flex-end;
	column-gap: 1vw;
	margin: 4vw 2vw 0 0;
}
.teeBtn{
	position: relative;
	width: 45.6vw;
	height: 11vw;
	padding: 0 5vw 2vw 0;
	cursor: pointer;
	transition: 0.8s;
}
.teeBtn::before, 
.teeBtn::after{
	content: '';
	position: absolute;
	display: block;
	width: 43.6vw;
	height: 9vw;
	clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
}
.teeBtn::before{
	top: 2vw;
	left: 2vw;
  background-image: linear-gradient( 90deg, #3fa87b 0%, #d1c84d 100%);
}
.teeBtn::after{
	top: 0;
	left: 0;
	background-color: #587e5c;
}
.teeBtn span{
	position: relative;
	z-index: 1;
	display: block;
	text-align: center;
	line-height: 9vw;
	font-size: 3.2vw;
	font-weight: 700;
	color: #ffffff;
}
.teeBtn span::before{
	content: '';
	position: absolute;
	top: 3.5vw;
	right: 2.4vw;
	display: block;
	width: 2.8vw;
	height: 2vw;
	background: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/btn01_sp.png") no-repeat 0 0 / 100% auto;
}
.teeBtn:hover{
	opacity: 0.7;
}
@media screen and (min-width:768px) {
	.teeBtnWrap{
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 15px 30px;
		margin: 10px 0 0;
	}
	.teeBtn{
		width: 204px;
		height: 50px;
		padding: 0 26px 10px 0;
	}
	.teeBtn::before, 
	.teeBtn::after{
		width: 194px;
		height: 40px;
	}
	.teeBtn::before{
		top: 10px;
		left: 10px;
	}
	.teeBtn span{
		line-height: 40px;
		font-size: 14px;
	}
	.teeBtn span::before{
		top: 15px;
		right: 8px;
		width: 16px;
		height: 12px;
		background-image: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/btn01.png");
	}
	.teeBtn:hover{
		opacity: 0.7;
	}
}
/**／ボタン**/
/***************／コンテンツ1***************/
/***************コンテンツ2***************/
.teeCont02{
	padding: 14.6vw 0 20vw;
	background: #587e5c url("https://yamanigolf.itembox.design/item/img/tourtee-custom/bg_sp.png") no-repeat 50% calc( 100% + 1vw ) / 100% auto;
}
.teeCont02 h3{
	color: #ffffff;
}
.teeCont02 .teeFlow li{
	display: flex;
	padding: 0 0 0 0.7vw;
}
@media screen and (min-width:768px) {
	.teeCont02{
		padding: 90px 0 70px;
		background-image: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/bg.png");
		background-position:  50% calc( 100% + 0.57vw );
	}
	.teeCont02 .teeFlow{
		max-width: 770px;
		margin: 0 auto;
	}
	.teeCont02 .teeFlow li{
		display: flex;
		min-height: 140px;
		padding: 0;
	}
}
/**タイトル**/
.teeFlow h4{
	flex-shrink: 0;
	position: relative;
	width: 14.6vw;
	height: 9.6vw;
	padding: 1.8vw 0 0 5vw;
	background: url("https://yamanigolf.itembox.design/item/img/tourtee-custom/triangle02.png") no-repeat 0 0 / auto 100%;
}
@media screen and (min-width:768px) {
	.teeFlow h4{
		width: 120px;
		height: 80px;
		padding: 14px 0 0 40px;
	}
}
/**／タイトル**/
.teeFlow article{
	padding: 0 0 2vw 3vw;
}
.teeFlow h5{
	padding: 2vw 0;
	font-size: 4.6vw;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #c9c650;
}
.teeFlow p{
	font-size: 3.8vw;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #ffffff;
}
@media screen and (min-width:768px) {
	.teeFlow article{
		padding: 0 0 40px 50px;
	}
	.teeFlow h5{
		padding: 6px 0 18px;
		font-size: 24px;
		letter-spacing: 0;
	}
	.teeFlow p{
		font-size: 18px;
		letter-spacing: -0.02em;
		line-height: 1.22;
	}
}
/***************／コンテンツ2***************/
/***************コンテンツ3***************/
.teeCont03{
	padding: 19vw 0 0;
}
.teeCont03 h3{
	color: #587e5c;
}
.teeCont03 .teeForm{
	padding: 0 4vw;
}
.teeCont03 .teeForm article{
	margin-bottom: 5vw;
}
.teeCont03 .teeForm h4{
	padding: 0 0 1vw 2vw;
	font-size: 3.8vw;
	font-weight: 700;
}
.teeCont03 .teeForm h4 span{
	padding-left: 1em;
	font-weight: 700;
	color: #ff0000;
}
@media screen and (min-width:768px) {
	.teeCont03{
		padding: 90px 0 0;
	}
	.teeCont03 .teeForm{
		padding: 0;
	}
	.teeCont03 .teeForm article{
		margin-bottom: 30px;
	}
	.teeCont03 .teeForm h4{
		padding: 0 0 10px 8px;
		font-size: 16px;
	}
}
/**フォーム**/
.inputArea input, 
.inputArea select, 
.inputArea textarea{
	padding: 0.5vw 1vw;
	border: solid 1px #587e5c;
	background-color: #f3f3f3;
	border-radius: 0;
	font-size: 3.6vw;
}
.inputArea p{
	padding: 0.7vw 1vw 0;
	font-size: 3.6vw;
}
.name .inputArea{
	display: flex;
	column-gap: 2vw;
}
.email .note02{
	position: relative;
	padding-left: 1em;
	font-size: 3vw;
	line-height: 1.2;
}
.email .note02::before{
	content: '※';
	position: absolute;
	top: 0.7vw;
	left: 0;
}
.address .inputArea{
	margin-bottom: 0.5vw;
}
.address .inputArea01, 
.phone .inputArea{
	display: flex;
}
.address .inputArea01 p, 
.phone .inputArea p{
	padding: 0.7vw 1vw 0.6vw;
}
.address .inputArea01 input, 
.phone .inputArea input{
	width: 16vw;
}
.address select{
	width: 30vw;
	appearance: auto;
}
.file p{
	font-size: 3vw;
	padding: 0;
}
.file .inputArea > div{
	position: relative;
}
.file input{
	border: none;
	background-color: transparent;
	padding: 0;
}
.file input::file-selector-button{
	position: relative;
	width: 30vw;
	height: 7.2vw;
	z-index: 1;
	opacity: 0;
	cursor: pointer;
}
.file .inputArea > div::before{
	content:'ロゴデータを選択';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 30vw;
	height: 7.2vw;
	border: solid 2px #587e5c;
	border-radius: 0.8vw;
	background: #6a8d6d;
	text-align: center;
	font-size: 3vw;
	line-height: 6.8vw;
	color: #ffffff;
	transition: 0.8s;
}
.file .inputArea > div:hover::before{
	opacity: 0.7;
}
.submit{
	position: relative;
	width: 45.6vw;
	height: 11vw;
	margin: 6vw auto 0;
	padding: 0 5vw 2vw 0;
	cursor: pointer;
	transition: 0.8s;
}
.submit::before, 
.submit::after{
	content: '';
	position: absolute;
	display: block;
	width: 43.6vw;
	height: 9vw;
	clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
}
.submit::before{
	top: 2vw;
	left: 2vw;
  background-image: linear-gradient( 90deg, #3fa87b 0%, #d1c84d 100%);
}
.submit::after{
	top: 0;
	left: 0;
	background-color: #587e5c;
}
.submit input{
	position: relative;
	z-index: 1;
	width: 43.6vw;
	height: 9vw;
	background-color: transparent;
	border: none;
	color: #ffffff;
	font-size: 4vw;
	cursor: pointer;
}
.submit:hover{
	opacity: 0.7;
}
.tourtee .checkbox{
	display: flex;
	justify-content: center;
}
.tourtee .checkbox p{
	font-size: 3.6vw;
}
.tourtee .checkbox p a{
	color: #587e5c;
	text-decoration: underline;
}
@media screen and (min-width:768px) {
	.inputArea input, 
	.inputArea select, 
	.inputArea textarea{
		padding: 8px 10px;
		font-size: 16px;
	}
	.inputArea p{
		padding: 8px 10px 0;
		font-size: 16px;
	}
	.name .inputArea{
		column-gap: 20px;
	}
	.email .note02{
		font-size: 14px;
	}
	.email .note02::before{
		top: 8px;
	}
	.address .inputArea{
		margin-bottom: 6px;
	}
	.address .inputArea01, 
	.phone .inputArea{
		display: flex;
	}
	.address .inputArea01 p, 
	.phone .inputArea p{
		padding: 8px 10px;
	}
	.address .inputArea01 input, 
	.phone .inputArea input{
		width: 100px;
	}
	.address select{
		width: 160px;
	}
	.file p{
		font-size: 14px;
		padding: 0 0 4px;
	}
	.file input{
		padding: 0;
	}
	.file input::file-selector-button{
		width: 264px;
		height: 40px;
	}
	.file .inputArea > div::before{
		width: 264px;
		height: 40px;
		border-radius: 6px;
		font-size: 14px;
		line-height: 36px;
		transition: 0.8s;
	}
	.submit{
		width: 310px;
		height: 70px;
		margin: 50px auto 0;
		padding: 0 10px 10px 0;
	}
	.submit::before, 
	.submit::after{
		width: 300px;
		height: 60px;
	}
	.submit::before{
		top: 10px;
		left: 10px;
	}
	.submit input{
		width: 300px;
		height: 60px;
		font-size: 22px;
	}
	.tourtee .checkbox{
		margin-top: 50px;
	}
	.tourtee .checkbox p{
		font-size: 14px;
	}
}

/**／フォーム**/
/***************／コンテンツ3***************/
/***************モーダル***************/
.modalBg{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.7);
	z-index: 201;
	display: none;
	cursor: pointer;
}
.modal{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 96vw;
	padding: 4.8vw 0;
	background-color: #ffffff;
	z-index: 202;
	display: none;
}
.modal .closeBtn{
	position: absolute;
	top: -8vw;
	right: 0;
	width: 32vw;
	height: 8vw;
	padding-right: 2vw;
	background-color: #999999;
	border-radius: 0.8vw 0.8vw 0 0;
	text-align: center;
	line-height: 8vw;
	font-size: 4vw;
	font-weight: 700;
	color: #ffffff;
	cursor: pointer;
}
.modal .closeBtn::before, 
.modal .closeBtn::after{
	content: '';
	position: absolute;
	top: 4.2vw;
	right: 4vw;
	display: block;
	width: 4vw;
	height: 0.4vw;
	background-color: #ffffff;
}
.modal .closeBtn::before{
	transform: rotate(45deg);
}
.modal .closeBtn::after{
	transform: rotate(-45deg);
}
.modal .closeBtn:hover{
	opacity: 0.7;
}
.modal h4{
	display: flex;
	justify-content: center;
}
.modal h4 figure img{
	width: auto;
	height: 6.1vw;
}
.modal h4 figure figcaption{
	padding-top: 3.4vw;
	text-align: center;
	font-size: 4.2vw;
	font-weight: 700;
	color: #587e5c;
}
.modal p{
	padding: 4.6vw  4vw 0;
	font-size: 3.6vw;
	line-height: 4.6vw;
}
.modal p img{
	display: inline-block;
	margin-left: 0.5em;
	width: 23.4vw;
}
.tourtee .modal ul{
	padding: 4.6vw  4vw 0;
}
.tourtee .modal li{
	position: relative;
	padding-left: 1em;
	font-size: 3.6vw;
	line-height: 4.6vw;
}
.tourtee .modal li::before{
	content: '※';
	position: absolute;
	top: 0;
	left: 0;
}
.modal .modalImg{
	margin-top: 4.6vw;
}
@media screen and (min-width:768px) {
	.modal{
		max-width: 960px;
		padding: 45px 0 0;
	}
	.modal .closeBtn{
		top: -40px;
		width: 160px;
		height: 40px;
		padding-right: 10px;
		border-radius: 8px 8px 0 0;
		line-height: 40px;
		font-size: 20px;
	}
	.modal .closeBtn::before, 
	.modal .closeBtn::after{
		top: 21px;
		right: 20px;
		width: 20px;
		height: 2px;
	}
	.modal h4 figure img{
		height: 30px;
	}
	.modal h4 figure figcaption{
		padding-top: 14px;
		font-size: 20px;
	}
	.modal p{
		padding: 20px  40px 0;
		font-size: 16px;
		line-height: 20px;
	}
	.modal p img{
		margin-left: 0.5em;
		width: 117px;
	}
	.tourtee .modal ul{
		padding: 20px  40px 0;
	}
	.tourtee .modal li{
		font-size: 16px;
		line-height: 20px;
	}
	.modal .modalImg{
		margin-top: 20px;
	}
}
/***************／モーダル***************/



.fadeDownTrigger{
opacity:0;
}
.fadeDown{
animation-name:fadeDownAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
  from {
    opacity: 0;
	transform: translateY(-100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}
