@charset "utf-8";
/* CSS Document */

/* UA対策 */
html {
	overflow-x: hidden;
}

body {
	font-family: 'Roboto', 'Noto Sans CJK', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	color: #000000;
	margin: 0;
	background-color: #ffffff;
	overflow-x: hidden;
}

p {
	margin: 0;
}

address {
	font-style: normal;	
}

ol {
	margin-top: 1.5%;
	margin-bottom: 1.5%;
}

a {
	text-decoration: none;
}

/* コンテンツフレーム */
.container {
	width: 100%;
	margin: 0 auto;
	background-image: url("../img/bg.jpg");
	background-size: cover;
	background-repeat: repeat-y;	
}
@media (min-width: 768px) {
	.container {
		width: 100%;
		max-width: 1500px;
		background-image: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)), url("../img/bg.jpg");
		background-size: initial;
		background-repeat: repeat-y;
	}
}


/* KV */
.kv{
	width: 100%;
	margin: 0 auto 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.kv {
		width: 100%;
		margin: 0 auto 100px;
		padding: 0;
		display: block;	
	}
}

.kv .kvArea{
	background-image: url("../img/kv.jpg");
	background-size: cover;
	background-position: 50% center;
	height: 300px;
	border-radius: 0 0 30px 30px;
}
@media (min-width: 768px) {
	.kv .kvArea {
		background-image: url("../img/kv.jpg");
		background-size: cover;		
		background-position: 260px center;
		border-radius: 30px;		
		height: 300px;
	}
}
	
.kvArea p {
	color: #ffffff;
	font-weight: 500;
	text-shadow: 0 0 12px rgba(0,0,0,1);
	padding: 18.333333vw 0 0 3.99999999vw;
}
@media (min-width: 768px) {
	.kvArea p {
		color: #ffffff;
		font-weight: 500;
		padding: 76px 0 0 75px;
		text-shadow: 0 0 12px rgba(0,0,0,1);
	}
}

.kvArea p .ttl {
	font-size: 6.22222222vw;
	font-weight: 500;
}
@media (min-width: 768px) {
	.kvArea p .ttl {
		font-size: 48px;
	}
}

.kvArea p .sttl {
	font-size: 4.33333333vw;
	line-height: 1.5;
}
@media (min-width: 768px) {
	.kvArea p .sttl {
		font-size: 24px;
		line-height: 2.0;
	}
}

.whiteArea {
	width: 90%;
	margin: 0 auto;
	background-color: #ffffff;
	
}
@media (min-width: 768px) {
	.whiteArea {
		width: 980px;
		margin: 0 auto;
		background-color: #ffffff;
	}
}


/* リード */
.lead{
	width: 85%;
	margin: 0 auto 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.lead {
		width: 980px;
		margin: 0 auto 100px;
		padding: 0;
		display: block;	
	}
}

.lead .imgArea{
	width: 100%;
	margin-bottom: 6.4444444vw;
}	
@media (min-width: 768px) {
	.lead .imgArea{
		width: 90%;
		margin: 0 auto 60px;
	}
}

.lead img{
	width: 100%;
}	
@media (min-width: 768px) {
	.lead img{
		width: 100%;
	}
}

.lead .layout{
	width: 100%;
	margin-bottom: 8.77777777vw;
}	
@media (min-width: 768px) {
	.lead .layout{
		width: 90%;
		margin: 0 auto 60px;	
        box-sizing: border-box;
	}
}


/* オーディオ再生ボタン */
.audioArea{
	text-align: center;
	
}	
@media (min-width: 768px) {
	.audioArea{
		text-align: center;
	}
}

.audio{
	width: 100%;
	margin: 0 auto;
	border-radius: 100vh;
    padding: 0.666666vw 0.666666vw 0.22222vw 0.222222vw;
	color: #000000;
	align-items: center;
	background-color: #fabe00;
	display: inline-flex;
	justify-content: center;	
	
}	
@media (min-width: 768px) {
	.audio{
		width: 46%;
		border-radius: 100vh;
        padding: 6px 6px 6px 6px;
		color: #000000;
	    align-items: center;
		background-color: #fabe00;
		display: inline-flex;
		gap: 1em;
		justify-content: center;
	}
}

.audio dt {	
}	
@media (min-width: 768px) {
	.audio dt {
		padding-left: 6px;
	}
}

.audio dd {
	margin-inline-start: 0;
}	
@media (min-width: 768px) {
	.audio dd {
	}
}

.audio dd audio {
	padding-left: 1.3333333333vw;	
}	
@media (min-width: 768px) {
	.audio dd audio {
		padding-left: 6px;
	}
}


/* 開催情報 */
.info{
	width: 100%;
	margin: 0 auto 8.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.info {
		width: 980px;
		margin: 0 auto 60px;
		padding: 0;
		display: block;
	}
}

.info ul{
	list-style: none;
}	
@media (min-width: 768px) {
	.info ul{
		list-style: none;
	}
}

.info li{
	width: 90%;
	padding: 1.1111111vw;
}	
@media (min-width: 768px) {
	.info li{
		width: 90%;
		padding: 10px;
		display: flex;
		align-items: stretch;
	}
}

.info .infoList{
	color: #000000;
	font-size: 2.7777777vw;	
	background: #b3da94;
	margin-bottom: 0.55555555vw;
	padding: 6px 0 6px;
	min-width: 88px;
  	text-align: center;
}	
@media (min-width: 768px) {
	.info .infoList{
		color: #000000;
		font-size: 16px;
		background: #b3da94;
		padding: 6px 0 6px;
		min-width: 200px;
        display: flex;
        align-items: center;
		justify-content: center;
	}
}

.info .infoItem{
	color: #000000;
	font-size: 3.1111111vw;
	padding: 6px 0 6px;
}	
@media (min-width: 768px) {
	.info .infoItem{
		font-size: 18px;
		color: #000000;
		padding: 6px 20px 6px;
	}
}


/* 楽しみ方 */
.howtofun {
	width: 90%;
	margin: 0 auto 6.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.howtofun {
		width: 980px;
		margin: 40px auto 40px;
		padding: 0;
	}
}

.howtofun .howtofunList {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3.3333333333vw;
	margin: 0 auto;	
}	
@media (min-width: 768px) {
	.howtofun .howtofunList {
		width: 90%;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 40px 10px;
		margin: 0 auto;
	}
}

.howtofun .howtofunItem {
	width: 100%;
	margin: 0 auto 2.8888888vw;
}	
@media (min-width: 768px) {
	.howtofun .howtofunItem {
		margin-bottom: 20px;
	}
}

.howtofun .howtofunItem p {
	padding: 2.11111111vw;
}	
@media (min-width: 768px) {
	.howtofun .howtofunItem p {
		padding: 5px;
        text-align: left;
	}
}

.howtofun .howtofunItem img {
	width: 70%;
	margin: 0 auto 2.4444444444vw;
	display: block;
}	
@media (min-width: 768px) {
	.howtofun .howtofunItem img {
		width: 90%;
		margin-bottom: 24px;
		padding: 0;
	}
}

.howtofun .howtofunItem .steps {
	font-size: 8.3333333vw;
	font-weight: 500;
	padding-left: 3.4444444vw;
}	
@media (min-width: 768px) {
	.howtofun .howtofunItem .steps {
		font-size: 40px;
		font-weight: 500;
		padding: 0 0 16px 21px;
	}
}

.howtofun .howtofunItem .desc {
	font-size: 3.11111111vw;
	line-height: 1.4;
	padding-left: 3.4444444vw

}	
@media (min-width: 768px) {
	.howtofun .howtofunItem .desc {
		font-size: 17px;
		padding: 0 22px;
	}
}

.howtofun .howtofunItem .desc a {
	font-weight: 500;
	color: #d63c24;
	text-decoration: underline;
}	
@media (min-width: 768px) {
	.howtofun .howtofunItem .desc a {
		font-weight: 500;
		color: #d63c24;
		text-decoration: underline;
	}
}


/* 特典 */
.benefits {
	width: 90%;
	margin: 0 auto 12.11111111vw;
	padding: 0 8.888888888vw;
	display: block;
}	
@media (min-width: 768px) {
	.benefits {
		width: 980px;
		margin: 0 auto 100px;
		padding: 0;
		display: block;	
	}
}

.benefits .layout{
	width: 90%;
	margin-bottom: 4.88888888vw;
}	
@media (min-width: 768px) {
	.benefits .layout{
		width: 90%;
		padding: 0 46px 0;
	}
}

.benefits .layoutImg {
	width: 90%;
}	
@media (min-width: 768px) {
	.benefits .layoutImg {
		width: 90%;
		padding: 0 46px 0;
		text-align: center;
	}
}

.benefits .layoutImg img{
	width: 100%;
}	
@media (min-width: 768px) {
	.benefits .layoutImg img{
		width: 60%;
	}
}	


/* 注意事項 */
.attention{
	width: 85%;
	margin: 8.77777777vw auto 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.attention {
		width: 980px;
		margin: 0 auto 100px;
		padding: 0;
	}
}

.attention .attentionList{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6.3333333333vw;
	margin: 0 auto;
	font-size: 2.88888888vw;
	line-height: 1.4;
	
}	
@media (min-width: 768px) {
	.attention .attentionList{
		width: 90%;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 10px;
		margin: 0 auto;
		font-size: 16px;
		line-height: 1.3;
	}
}

.attention .attentionItem01 {
	width: 100%;
	margin: 0 auto;
}	
@media (min-width: 768px) {
	.attention .attentionItem01{
		text-align: center;

	}
}

.attention .attentionItem01 p {
	padding: 2.11111111vw;
}	
@media (min-width: 768px) {
	.attention .attentionItem01 p {
		padding: 5px;
        text-align: left;
	}
}

.attention .attentionItem01 img {
	width: 50%;
	margin: 0 auto 2.4444444444vw;
	display: block;
}	
@media (min-width: 768px) {
	.attention .attentionItem01 img {
		width: 60%;
		margin-bottom: 20px;
		padding: 0;
	}
}

.attention .attentionItem02 {
	width: 100%;	
	margin: 0 auto;
}	
@media (min-width: 768px) {
	.attention .attentionItem02{
		text-align: center;

	}
}

.attention .attentionItem02 p {
	padding: 2.11111111vw;
}	
@media (min-width: 768px) {
	.attention .attentionItem02 p {
		padding: 5px;
        text-align: left;
	}
}

.attention .attentionItem02 img {
	width: 42%;
	margin: 0 auto 1.33333333333vw;
	display: block;
}	
@media (min-width: 768px) {
	.attention .attentionItem02 img {
		width: 50%;
		margin-bottom: 20px;
		padding: 0;
	}
}

.attention .attentionItem03 {
	width: 100%;	
	margin: 0 auto;
}	
@media (min-width: 768px) {
	.attention .attentionItem03{
		text-align: center;

	}
}

.attention .attentionItem03 p {
	padding: 2.11111111vw;	
}	
@media (min-width: 768px) {
	.attention .attentionItem03 p {
		padding: 5px;
        text-align: left;
	}
}

.attention .attentionItem03 img {
	width: 40%;
	margin: 0 auto 1.33333333333vw;
	display: block;
}	
@media (min-width: 768px) {
	.attention .attentionItem03 img {
		width: 41%;
		margin-bottom: 20px;
		padding: 0;
	}
}

.attention .attentionItem04 {
	width: 100%;	
	margin: 0 auto;
}	
@media (min-width: 768px) {
	.attention .attentionItem04 {
		text-align: center;

	}
}

.attention .attentionItem04 p {
	padding: 2.11111111vw;
}	
@media (min-width: 768px) {
	.attention .attentionItem04 p {
		padding: 5px;
        text-align: left;
	}
}

.attention .attentionItem04 img {
	width: 31%;
	margin: 0 auto 1.777777777777vw;
	display: block;
}	
@media (min-width: 768px) {
	.attention .attentionItem04 img {
		width: 32%;
		margin-bottom: 20px;
		padding: 0;
	}
}


/* スタート地点 */
.startpoint {
	width: 85%;
	margin: 0 auto 9.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.startpoint {
		width: 980px;
		margin: 0 auto 70px;
		padding: 0;
		display: block;	
	}
}

.startpoint .layout {
	width: 100%;
	padding: 4.3333333vw 5.777778vw 3.777778vw 5.777778vw;
	border: solid #666666 1px;
	margin: 0 auto;	
    box-sizing: border-box;	
}	
@media (min-width: 768px) {
	.startpoint .layout{
		width: 90%;
		padding: 26px 40px 20px 40px;
		border: solid #666666 1px;
		margin: 0 auto;	
        box-sizing: border-box;
	}
}

.startpoint .mapArea {
	width: 100%;
	margin: 0 auto 5.5555556vw;	
}	
@media (min-width: 768px) {
	.startpoint .mapArea{
		width: 90%;
		margin: 0 auto 60px;
	}
}

.startpoint img{
	width: 100%;
}	
@media (min-width: 768px) {
	.startpoint img{
		width: 100%;
	}
}


/* Q&A */
.qa{
	width: 85%;
	margin: 8.77777777vw auto 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.qa {
		width: 980px;
		margin: 0 auto 100px;
		display: block;	
	}
}

.qa .layout{
	width: 100%;
}	
@media (min-width: 768px) {
	.qa .layout{
		width: 90%;
		margin: 0 auto;
		padding: 0;
	}
}

.qa .qaList{
	font-size: 3.333333333vw;
	line-height: 1.5;
	margin-bottom: 3.333333333vw;
}	
@media (min-width: 768px) {
	.qa .qaList{
		font-size: 18px;
		margin-bottom: 20px;
	}
}

.qa .qaItem_q{
	margin-bottom: 2.44444444vw;

}	
@media (min-width: 768px) {
	.qa .qaItem_q{
		margin-bottom: 12px;
	}
}

.qa .qaItem_q::before{
  	content: "Q";
	font-size: 5.33333333vw;
	font-weight: 500;
	color: #338800;
  	display: inline-flex;
  	align-items: baseline;
  	justify-content: center;
  	width: 3.66666666vw;
  	height: 3.66666666vw;
  	margin-right: 1.22222222vw;	
}	
@media (min-width: 768px) {
	.qa .qaItem_q::before{
  		content: "Q";
		font-size: 26px;
		font-weight: 500;
		color: #338800;
  		display: inline-flex;
  		align-items: baseline;
  		justify-content: center;
  		width: 24px;
  		height: 24px;
  		margin-right: 8px;
	}
}

.qa .qaItem_a{
	display: flex;
    align-items: flex-start;
}	
@media (min-width: 768px) {
	.qa .qaItem_a{
		width: 100%;
		display: flex;
		align-items: flex-start;
	}
}


.qa .qaItem_a_body{

}	
@media (min-width: 768px) {
	.qa .qaItem_a_body{
		flex: 1;
	}
}

.qa .qaItem_a::before{
	content: "A";
	font-size: 3.77777777vw;
	font-weight: 500;
  	display: inline-flex;
  	align-items: baseline;
  	justify-content: center;
  	width: 3.66666666vw;
  	height: 3.66666666vw;
  	margin-right: 2.99999999vw;	
}	
@media (min-width: 768px) {
	.qa .qaItem_a::before{
  		content: "A";	
		font-size: 19px;
		font-weight: 500;		
  		display: inline-flex;
  		align-items: baseline;
  		justify-content: center;
  		width: 24px;
  		height: 24px;
  		margin-right: 14px;
		flex-shrink: 0;
	}
}


/* Locatoneについて */
.about {
	width: 85%;
	margin: 0 auto;
	padding-bottom: 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.about {
		width: 980px;
		margin: 0 auto;
		padding-bottom: 100px;
		display: block;	
	}
}

.about .layout {
	width: 100%;
	padding: 4.3333333vw 5.777778vw 3.777778vw 5.777778vw;
	border: solid #666666 1px;
	margin: 0 auto;	
    box-sizing: border-box;	
}	
@media (min-width: 768px) {
	.about .layout{
		width: 90%;
		padding: 26px 40px 20px 40px;
		border: solid #666666 1px;
		margin: 0 auto;	
        box-sizing: border-box;
	}
}

.about .logoArea_locatone {
	width: 50%;
	margin: 0 auto 20px;
}	
@media (min-width: 768px) {
	.about .logoArea_locatone {
		width: 30%;
		margin: 0 auto 20px;
	}
}


.about img{
	width: 100%;
}	
@media (min-width: 768px) {
	.about img{
		width: 100%;
	}
}










/* フッター */
footer {
	color: #ffffff;
	background: #000000;
}	
@media (min-width: 768px) {
	footer {
		color: #ffffff;
		background: #000000;	
	}
}

address {
	font-size: 2.88888888vw;
	padding: 4.11111111vw;
	text-align: center;
}	
@media (min-width: 768px) {
	address {
		font-size: 16px;
		padding: 14px;
		text-align: center;
	}
}	


/* 画像エリア */
.imgarea{
	width: 100%;
	margin-bottom: 12.11111111vw;	
}
@media (min-width: 768px) {
	.imgarea {
		width: 90%;
		height: auto;
		margin:0 auto 80px;
	}
}
	
.imgarea img{
	width: 100%;
}
@media (min-width: 768px) {
	.imgarea img {
		width: 100%;
	}
}


/* 参加ボタン */
.buttonArea {
	width: 85%;
	margin: 0 auto 12.11111111vw;
	display: block;
}	
@media (min-width: 768px) {
	.buttonArea {
		width: 980px;
		margin: 0 auto 100px;
		padding: 0;
		display: block;
	}
}

.buttonArea .layout {
	width: 100%;
	padding: 4.3333333vw 5.777778vw 3.777778vw 5.777778vw;
	margin: 0 auto;	
    box-sizing: border-box;
	display: flex;
    justify-content: center;
}	
@media (min-width: 768px) {
	.buttonArea .layout{
		width: 90%;
		padding: 26px 40px 20px 40px;
		margin: 0 auto;	
        box-sizing: border-box;
		display: flex;
		justify-content: center;
	}
}

.button {
	width: 100%;
    padding: 3.11111111vw;
    border-radius: 2rem;
    border: 0;
    font-size: 24px;
	color: #ffffff;	
    text-align: center;
    background: #d63c24;
    display: block;
}
@media (min-width: 768px) {
	.button {
		width: 540px;
		padding: 20px;
		border-radius: 2rem;
		border: 0;
		font-size: 24px;	
		color: #ffffff;		
		text-align: center;
		background: #d63c24;
		display: block;	
	}
}


/* 見出し */
h2{
	width:100%;
	font-size: 5.11111111vw;
	padding: 10px;
	box-sizing: border-box;
	text-align: center;
	background: #33691e;
	margin-bottom: 6.66666667vw
}	
@media (min-width: 768px) {
	h2{
		width: 980px;
		font-size: 26px;
		margin: 0 auto 30px;
		padding: 10px;
		box-sizing: border-box;
		text-align: center;
		background: #33691e;
	}
}

h3{
	font-size: 4.44444444vw;
	text-align: center;
}	
@media (min-width: 768px) {
	h3{
        font-size: 24px;
        margin: 0 0 20px 0;
	}
}


/* フォント */
.fs-8{
	font-size: 2.4444444vw;
	line-height: 2.77777777vw;
}	
@media (min-width: 768px) {
	.fs-8{
		font-size: 14px;
		line-height: 1.2;
	}
}

.fs-10{
	font-size: 2.77777777vw;
	line-height: 4.77777777vw;
}	
@media (min-width: 768px) {
	.fs-10{
		font-size: 16px;
		line-height: 1.5;
	}
}

.fs-12{
	font-size: 3.333333333vw;
	line-height: 5vw;
	margin-bottom: 3.333333333vw;	
}	
@media (min-width: 768px) {
	.fs-12{
		font-size: 20px;
		line-height: 1.75;
		margin-bottom: 24px;
	}
}

.fs-14{
	font-size: 3.888888889vw;
	line-height: 5.555555556vw;
}	
@media (min-width: 768px) {
	.fs-14{
		font-size: 24px;
		line-height: 1.75;
	}
}

.fw-bold { font-weight: 600; }

.fc-white { color: #FFFFFF; }


/* スマートフォン表示時改行 */
.br-sp{
	display: block;
}	
@media (min-width: 768px) {
	.br-sp{
		display: none;
	}
}