html,body{
/*font: italic 1.2em "Fira Sans", serif;*/
font-family: 'Noto Sans JP', sans-serif;
font-weight:400;
/*background : url('./img/back.png');*/
/*background-color: rgba(255, 255, 255, 1.0); */
/*background-blend-mode:lighten; */
/*background-size: contain;*/
/*background-size: cover;*/
/*background-repeat: no-repeat;*/
/*background-position: center center;*/
/*background-attachment: fixed;*/
/*color: rgba(0, 0, 0);*/
user-select: none;
overflow-x: hidden;
overflow-y: auto;
padding:0;
margin:0;
width:100%;
height:100%;
-webkit-text-size-adjust: 100%;
box-sizing : border-box;
}

/*画面*/
.outer{
	background : url('../img/back_phone1.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	color: rgba(0, 0, 0);
	position:relative;
/*	width:390px;*/
/*	width:380px;*/
	width:99vw;

/*	height:844px;*/
/*	height:400px;*/
/*	border: 1px solid #000;*/
/*
	height:0;
	opacity: 0;
*/
	display:none;
	transition: 0.5s;
	overflow:hidden;
	padding:0;
	margin:0;
}
.outer.show{
	display:block;
	animation: show 1s linear 0s;
	height:760px;
/*	height:98vh; */
}

@keyframes show {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/*吹き出し枠*/
.titlebox{
	position:absolute;
	vertical-align: top;
	top:4px;
	left:10px;
	font-size:10pt;
	text-align:left;
	margin:1px;
	padding:4px;
	width:260px;
	height:74px;
	background:url('../img/popup.png');
	background-repeat: no-repeat;
	background-position: center center;

}
/*吹き出し文書*/
.titlemes{
	position:absolute;
	vertical-align: top;
	top:4px;
	left:2px;
	font-size:10pt;
	text-align:left;
	margin:1px;
	padding:8px;
	width:240px;
	height:74px;
	color:white;

}

/*キャラクタ画像*/
.char1img{
	position:absolute;
/*	width:100px;*/
	right:0px;
	z-index:99;
}

.mes1{
}

/*次へ・Backボタンエリア*/
#btnarea {
	position:absolute;
/*	top:10px;*/
	bottom:10px;
	left:0px;
	right:0px;
/*	height:800px;*/
	text-align:center;
}

/*言語選択ボタン*/
.menubtn{
font-size:15pt;
font-weight:700;
color:#053F08;
background-color:#ffffff;
border: 2px solid #f0f0f0;
border-radius: 20px;
width:150px;
height:70px;
padding:2px 10px;
margin:2px 10px;
}
.menubtn:hover{
font-size:15pt;
font-weight:700;
color:#ffffff;
background-color:#053F08;
border: 2px solid #f0f0f0;
border-radius: 20px;
width:164px;
height:70px;
padding:7px;
margin:7px 10px;
}

/*Textarea*/
textarea{
	margin:1px;
	padding:8px;
	width:340px;
	height:26px;
	border: 2px solid #f0f0f0;
	border-radius: 10px;
	font-size:16pt;
}

/*select*/
select{
	left:0;
	font-size:12pt;
	font-weight:600;
	color:#053F08;
	margin:0px;
	padding:0px;
	width:100px;
	height:40px;
	border: 2px solid #f0f0f0;
	border-radius: 10px;

}

/*radioボタン*/
input[type=radio] {
display: none; /* ラジオボタンを非表示にする */
}
input[type="radio"]:checked + label {
background: #053F08;/* マウス選択時の背景色を指定する */
color: #ffffff; /* マウス選択時のフォント色を指定する */
}
label{
	display:block;
	position:relative;
	padding-left:1em;
}
label input{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	margin:auto;
}
.label:hover {
	background-color: #E2EDF9; /* マウスオーバー時の背景色を指定する */
}

/*radioフルサイズ*/
.menubtn_f{
	display:inline-block;
	font-size:12pt;
	font-weight:600;
	color:#053F08;
	background-color:#ffffff;
	border: 2px solid #f0f0f0;
	border-radius: 10px;
	width:170px;
	height:60px;
	padding:0px;
	margin:0px;
	text-align: center; /* テキストのセンタリングを指定する */
	line-height: 4.0em;
	cursor: pointer; /* マウスカーソルの形（リンクカーソル）を指定する */
}
.menubtn_f:hover{
	display:inline-block;
	font-size:12pt;
	font-weight:600;
	color:#ffffff;
	background-color:#053F08;
	border: 2px solid #f0f0f0;
	border-radius: 10px;
	width:170px;
	height:60px;
	padding:0px;
	margin:0px;
	text-align: center; /* テキストのセンタリングを指定する */
	line-height: 4.0em;
	cursor: pointer; /* マウスカーソルの形（リンクカーソル）を指定する */
}

.row-buttons {
	display: flex;
	justify-content: center;

	> *:nth-child(n+2) {
		margin:5px;
		padding:0 0 0 0;
	}

}

/*radioハーフサイズ*/
.menubtn_h{
	display:flex;
    justify-content: center;
	align-items: center;
/*    display:inline-block;*/
	font-size:12pt;
	font-weight:600;
	color:#053F08;
	background-color:#ffffff;
	border: 2px solid #f0f0f0;
	border-radius: 10px;
	width:110px;
	height:60px;
/*	padding:0px;*/
/*	padding:auto; */
/*	margin:0; */
	text-align: center; /* テキストのセンタリングを指定する */
	vertical-align: middle;
/*	line-height: 4.5em; */
	cursor: pointer; /* マウスカーソルの形（リンクカーソル）を指定する */
}
.menubtn_h:hover{
	display:flex;
    justify-content: center;
	align-items: center;
/*    display:inline-block;*/
	font-size:12pt;
	font-weight:600;
	color:#ffffff;
	background-color:#053F08;
	border: 2px solid #f0f0f0;
	border-radius: 10px;
	width:110px;
	height:60px;
/*	padding:0px;*/
/*	padding:auto; */
/*	margin:0; */
	text-align: center; /* テキストのセンタリングを指定する */
	vertical-align: middle;
/*	line-height: 4.5em; */
	cursor: pointer; /* マウスカーソルの形（リンクカーソル）を指定する */
}

/*質問*/
.qmes{
	text-align:left;
	margin:0px 0px 0px 10px;
	padding:14px 16px 0px 8px;
	color:#053F08;
	font-size:12pt;
}

/*次へボタン*/
.nextbtn{
	user-select: none;
	text-align:center;
	vertical-align: middle;
	border-radius: 40px;
	color:#EDB900;
	background-color:#00422A;
	border: 2px solid #ffffff;
	text-decoration: none;
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	padding:10px;
	width:200px;
	height:28px;
	font-size : 16pt;
	font-weight:800;
	top:0px;
}
.nextbtn:hover{
	user-select: none;
	text-align:center;
	vertical-align: middle;
	border-radius: 40px;
	color: #00422A;
	background-color:#f7f7f7;
	border: 2px solid #ffffff;
	text-decoration: none;
	margin:auto;
	padding:10px;
	width:200px;
	height:28px;
	font-size : 16pt;
	font-weight:400;
	top:0px;
}
.btnmes{
	color:white;
	font-size:10pt;
	padding:2px;
}
/*backボタン*/
.backbtn{
	user-select: none;
	text-align:center;
	vertical-align: middle;
	border-radius: 40px;
	color: white;
	border: 2px solid #f7f7f7;
	background-color:#327200;
	text-decoration: none;
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	padding:12px;
	width:200px;
	height:14px;
	font-size : 10pt;
	font-weight:400;
}
.backbtn:hover{
	user-select: none;
	text-align:center;
	vertical-align: middle;
	border-radius: 40px;
	color: #327200;
	border: 2px solid #f7f7f7;
	background-color:#ffffff;
	text-decoration: none;
	margin:auto;
	padding:12px;
	width:200px;
	height:14px;
	font-size : 10pt;
	font-weight:400;
}


#question{
	font-size:20pt;
	/*font-weight:bold;*/
	font-weight:600;
}

/*TOPメッセージ*/
.startmes{
	color:#053F08;
	font-size:10pt;
	font-weight:100;
	padding:10px;
	margin:8px;
	text-align:left;
	background-color:white;
	border-radius: 10px;
}


/*エリア名ロゴ*/
.randmarklogo{
/*	float:left;*/
	position:absolute;
	user-select: none;
	text-align:center;
	vertical-align: middle;
	border-radius: 40px;
	color: #EDB900;
	border: 2px solid #f7f7f7;
	background-color:#327200;
	text-decoration: none;
/*	line-height:0.2em;*/
	margin:6px 0px 2px 14px;
	padding:3px 3px 3px 3px;
	width:148px;
	height:20px;
	font-size : 10pt;
	font-weight:800;
}
.br{
/*	line-height:1.0em;*/
/*	height:80px;*/
/*	padding 30px; */
}

/*エリア名*/
.areaname{
/*	float:right; */
	text-align:right;
	text-wrap: nowrap;
	word-break: normal;
	white-space: nowrap;
	margin:16px 4px 0px 8px;
	padding:1px 0 1px 0;
	font-size : 16pt;
	font-weight:800;
	width:94%;;
	height:24px;
	color:#327200;
	line-height:0.8em;

}


/*施設名*/
.randmarkname{
/*	position:absolute;*/
	text-align:left;
	margin:2px 4px 4px 8px;
	padding:4px 4px 4px 8px;
	width:340px;
	height:24px;
	border: 3px solid #6CAB1D;
	background-color:#ffffff;
	border-radius: 10px;
	font-size:12pt;
	font-weight:800;
	line-height:1.0em;
}

/*施設画像*/
.randmarkimage{
/*	position:relative;*/
	width:94%;
/*	padding-top:60px; */
	margin:2px 2px 2px 4px;
}

#toast {
	font-size:10pt;
	position:relative;
	border-radius: 20px;
	visibility: hidden;
	z-index: 999;
	background-color: rgba(0,0,0,0.8);
	color: white;
	padding:12px;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	text-align: center;
	vertical-align: middle;
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin:auto;
	width: 300px;
	height: 30px;
}