@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

* {
	padding: 0;
	margin: 0;
	font-family: 'Noto Sans JP', sans-serif;
	box-sizing: border-box;
	font-size: 100%;
	color: #083a6b;
}

section#load {
	position: fixed;
	top: 0;
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	z-index: 30;
}

body {
	background-color: #fcfcfc;
}

.contents {
	background-color: #f4f4f4;
}

/* ボタン */

.btn {
	text-align: center;
	color: white;
	border-radius: 1vw;
	width: 60vw;
	margin: auto;
	padding: 3vw;
	font-size: 4vw;
	margin-bottom: 5vw;
	box-shadow: 0 5px 5px #ccc;
}

.btn_forward {
	background-color: #1B61A3;
}

.btn_error {
	background-color: #DADADA;
}

.btn_close {
	background-color: #a9a9a9;
	color: #000;
}

/* エラーポップ */
.error {
	color: #fe1e1e !important;
}

.error::before {
	content: url(../img/error.png);
	transform: scale(0.7);
}

#popMaster {
	border: solid 1px #bebebe;
	border-radius: 5vw;
	display: block;
	width: 90%;
	text-align: center;
	position: absolute;
	z-index: 9999;
	top: 25%;
	left: 0;
	background-color: #f5f5f5;
	margin: 5%;
}

#popTitle {
	color: #333;
	padding: 1em 0;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	font-size: 1.1em;
}

#popMaster>hr {
	margin: 0 5vw;
	border-color: #c9c9c9;
	border-width: 1vw 0 0 0;
	border-style: solid;
}

#popBody {
	color: #000;
	margin: 0 1em;
	text-align: left;
	font-size: 1em;
}

#popButton {
	color: #000;
	border-radius: 50vw;
	margin: 5vw;
	background-color: #a9a9a9;
	height: 13vw;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	font-size: 5vw;
}

#popMaster.default #popButton {
	color: white;
	background-color: #1B61A3;
}

*::-webkit-scrollbar {
	display: none;
}


/* スマホ以外は横幅固定 */
@media screen and (min-width:700px) {

	* {
		font-size: 15px;
	}

	body {
		width: 700px;
		margin: 0 auto;
	}

	.btn {
		margin-bottom: 25px;
		font-size: 15px;
		padding: 15px;
		width: 60%;
	}

	#popMaster {
		width: 50%;
		max-width: 400px;
		left: calc((100% - 400px)/2);
		margin: 0;
	}

	#popMaster>hr {
		margin: 0 5% 2%;
		border-width: 0.5vh 0 0 0;
	}

	#popBody {
		margin: 0 5%;
	}

	#popButton {
		margin: 20px auto;
		width: 60%;
		font-size: 20px;
		height: unset;
		padding: 10px;
	}
}