@charset "utf-8";
/* CSS Document */
:root{
	--red:#a12628;
}
.date{
	color: var(--black);
	font-size: 1.3em;
	line-height: 1.3em;
	padding:0.5em;
	text-align: center;
	margin-top: 1em;
}
/*.date dt{
	width: 5em;
	float: left;
	color: var(--bg);
}
.date dd{
	margin-left: 5em;
}
*/.date .small{
	font-size:max(0.6em,12px);
	line-height: 1em;
}
p.error{
    margin:0;
    color:var(--red);
    font-weight:bold;
    margin-bottom:1em;
}
.formBox{
	padding: 1.5em 0;
	min-height: 68vh;
	background-color: #fff;
	border: var(--gold) 2px solid;
	border-radius: 15px;
	text-align: center;
	max-width: 1000px;
	margin: 1em auto 0;
	display: grid;
	align-content: center;
}
.formBox dl{
	width: 100%;
}
.labelBox{
	width: 100%;
	display: grid;
	grid-template-columns:repeat(5, 1fr) ;
	column-gap: 10px;
	row-gap: 1em;
}
.label img{
	border-radius: 10px;
}
.label{
	text-align: center;
	cursor: pointer;
	border: 2px solid var(--gold);
	padding: 0.3em;
	display: block;
	background-color: #fff;
	border-radius: 10px;
}
.label.selected{
	background-color: var(--gold);
}
.formBox input,.formBox textarea{background-color: #fff; text-align: left;}
.formBox textarea{padding: 0.5em; width: calc(100% - 1em); max-width: none;}

.qTxt{
	padding-left: 1.6em;
	text-align: left;
	margin-top: 1em;
	background-color: var(--gold);
	padding: 0.5em;
	
}
.qTxt span{
	display: block;
	/*text-indent: -1.6em;*/
}
.submitBt{
		font-family: 'Noto Serif JP',"游明朝", YuMincho, "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
	padding: 1em;
	display:inline-block;
	vertical-align: top;
	text-align: center;
	color: var(--black);
	border-radius: 50px;
	margin: 1.5em 0.5%;
	width: 10em;
	font-size: 1em;
	cursor: pointer;
	background-color: var(--gold);
	/*border: var(--choco) 1px solid;*/
	border: 0;
}
.submitBt.lock{
	pointer-events: none;
	opacity: 0.7;

}
a.backBt:hover,a.submitBt:hover{
	border: 0;
}


/*チエックページ*/
.formArea dl{
	text-align: center;
	margin: 0 auto 1em;
	padding: 2em;
}
.formArea dt{
width: 100%;
background-color: var(--gold);
padding: 0.5em;
color: var(--black);
}
.formArea dd{
background-color: #fff;
padding: 0.5em;

}

/*完了ページ*/
a.backBt{
	padding: 1em;
	display: block;
	width: 10em;
	text-align: center;
	background-color: var(--gold);
	color: var(--black);

	border-radius: 50px;
	margin: 1.5em auto;
}

.formTextarea{
	width: 100%;
	max-width: 700px;
	display: block;
	margin: 0 auto;
}

/*投票済み*/
.voted{
	max-width: 18em;
	padding: 1em;
	margin: 1em auto 0;
	background-color: var(--red);
	color: #fff;
	border-radius: 6px;
	text-align: center;
}


@media (max-width: 786px) {

.labelBox{

	grid-template-columns:repeat(4, 1fr) ;
}
}
@media (max-width: 480px) {

.labelBox{

	grid-template-columns:repeat(3, 1fr) ;
}
}