@charset "utf-8";

/******************* 統一設定 *******************/
*{
	margin:0;
	padding:0;
	text-decoration:none;
	font-family:'univia-pro','Public Sans',sans-serif,'Font Awesome 5 Free';
	table-layout:fixed;
	border-spacing:0;
	box-sizing:border-box;
}

:root{
	--sm-font-size-12px:clamp(6px,2.75vw,12px);
	--sm-font-size-13px:clamp(7px,3vw,13px);
	--sm-font-size-14px:clamp(8px,3.25vw,14px);
	--sm-font-size-15px:clamp(10px,3.5vw,15px);
	--sm-font-size-16px:clamp(12px,3.75vw,16px);
	--sm-font-size-18px:clamp(12px,4vw,18px);
	--sm-font-size-20px:clamp(15px,4.5vw,20px);
	--sm-font-size-22px:clamp(14px,4.75vw,22px);
	--sm-font-size-24px:clamp(16px,5vw,24px);
}

::selection{
	color:#000;
	background:#ffce00;
}

a{
	color:#000;
	text-decoration:none;
}

ul,ol{
	list-style-position:inside;
}

body{
	font-size:15px;
}

body::before{
	width:100%;
	height:100vh;
	background:#fff;
	position:fixed;
	top:0;
	left:0;
	z-index:-2;
	display:block;
	content:"";
}

div.wrapper{
	margin:0 auto;
}

div.button a{
	width:100vw;
	text-align:center;
	vertical-align:middle;
	display:table-cell;
	transition:.3s;
}

a.download::before{
	margin-right:5px;
	font-weight:bold;
	content:"\f019";
}

a.android::before{
	margin-right:3px;
	padding:0 10px;
	background:url("./../img/download/android-brands.svg") no-repeat center/contain;
	content:"";
	position:relative;
	top:2px;
}


/******************* ヘッダー *******************/
header{
	width:100%;
	height:70px;
	background:#fff;
	box-shadow:0 0 15px rgb(0 0 0 / 30%);
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:9999;
}

header nav.smView{
	display:none;
}

header nav.pcView{
	width:82.5%;
	max-width:1120px;
	height:100%;
	margin:0 auto;
	display:flex;
	flex-direction:row;
	align-items:center;
}

header nav.pcView div.logo{
	width:20%;
	height:100%;
	padding:10px 0;
}

header nav.pcView div.logo a{
	width:200px;
	height:100%;
	background:url("./../img/logo.png") no-repeat left/contain;
	text-indent:-9999px;
	display:block;
	transition:.3s;
}

header nav.pcView div.logo a:hover{
	opacity:.7;
}

header nav.pcView div.item{
	width:80%;
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:flex-end;
}

header nav.pcView div.item div.button{
	width:120px;
	height:100%;
}

header nav.pcView div.item div.button:not(:last-child){
	margin-right:10px;
}

header nav.pcView div.item div.button a{
	height:70px;
	font-weight:bold;
	border-bottom:solid 5px transparent;
}

header nav.pcView div.item div.button a.active{
	color:#ffce00;
	border-bottom:solid 5px #ffce00;
}

header nav.pcView div.item div.button a:hover{
	color:#ffce00;
	border-bottom:solid 5px #ffce00;
}


/******************* コンテンツ *******************/
main{
	padding-top:70px;
}


/******************* フッター *******************/
footer{
	width:100%;
	height:95px;
	padding-top:20px;
	background:#333132;
}

footer div.linkitem{
	width:92.5%;
	max-width:1120px;
	margin:0 auto;
	display:flex;
	flex-direction:row;
}

footer div.linkitem a{
	width:100%;
	color:#fff;
	text-align:center;
}

footer p.copyright{
	margin-top:20px;
	padding-left:5px;
	color:#fff;
	text-align:center;
	display:block;
}


@media (max-width:767px){
	/******************* 統一設定 *******************/
	body{
		font-size:var(--sm-font-size-15px);
	}


	/******************* ヘッダー *******************/
	header{
		height:65px;
		box-shadow:none;
		position:unset;
	}

	header nav.pcView{
		display:none;
	}

	header nav.smView{
		height:100%;
		display:block;
	}

	header nav.smView div.logo{
		width:40%;
		height:100%;
		padding:7px 0 7px 15px;
	}
	
	header nav.smView div.logo a{
		width:200px;
		height:100%;
		background:url("./../img/logo.png") no-repeat left/contain;
		text-indent:-9999px;
		display:block;
		transition:.3s;
	}


	/******************* コンテンツ *******************/
	main{
		padding:0;
	}


	/******************* フッター *******************/
	footer{
		height:unset;
		padding:30px 0;
	}

	footer div.linkitem{
		flex-direction:column;
	}

	footer div.linkitem a{
		padding:10.6px 0;
	}
}