@charset "utf-8";

header{
	text-align: center;
	border-bottom: solid 1em #c9a063;
}
header > img{
	margin: 1em 0 0.5em;
	width: 50%;
}
header h1{
	background-color: #000000;
	color: #FFFFFF;
	padding: 0.5em 0;
	font-size: 1.2em;
	font-weight: bold;
}
.spOnly{display:block;}
.pcOnly{display:none;}

main{}
main p
,main ul{
	margin: 1em 0.5em;
}
main form p{margin: 0 0.5em 1em 0.5em;}
main hr{
	margin: 0.5em 0;
}
footer{
	text-align: center;
	margin-top: 1em;
	padding: 1em 0;
	background-color: #000000;
	color: #FFFFFF;
}

.qList{
	width: calc(100% - 1em);
	margin: 0 0.5em;
}

.qList th
,.qList td{
	display: block;
	padding: 0.25em;
	
}
.qList th{
	text-align: left;
}
.qList td{}

.qList textarea{
	width: calc(100% - 0.5em);
	height: 5em;
}
.qList input[type=text]{
	width: calc(100% - 0.5em);
}
.qList input[type=radio] {
	margin: 1em;
}

.recRow th::after{
	content: "※";
	color: #FF0000;
	font-weight:bold;
}

.qList .categoryTitle th{
	background-color: #000000;
	color: #FFFFFF;
	font-weight: bold;
	padding: 0.5em;
}

.dateCell label{
	display: inline-block;
	width: 30%;
}
.dateCell label select{width: calc(90% - 1em);}


.itemList .itemTitle th{
	background-color: #777777;
	color: #FFFFFF;
}

#Complete .ThanksMsg{
	background-color: #FFFFFF;
	color: #000000;
	text-align: left;
}
.rule span{margin: 0 0.1em; text-decoration: underline; font-weight:bold;}

.ruleList{
	margin: 0.5em;
	list-style: disc;
}
.ruleList li{list-style: disc;margin-left: 1.5em;}
.ruleArea{
	overflow: scroll;
	height: 10em;
	border: solid 1px #CCCCCC;
	font-size: 0.9em;
}
.ruleArea dl dt
,.ruleArea dl dd{padding: 0 0.5em;}
.ruleArea dl dt{font-weight: bold;}
.ruleArea dl dd{margin-bottom: 0.5em;}

.memo{display: block; margin: 0.25em 0; font-size: 0.9em;}
.attention{display: block; margin: 0.25em 0; font-size: 0.9em; font-weight: bold; color: #F00;}
.none{display: none;}
.Sponsorship{}
.Sponsorship p{text-align:center; font-size: 1.2em; font-weight: bold; border-bottom: solid #555 2px;}
.Sponsorship ul{text-align:center;}
.Sponsorship ul li{display: inline-block; margin: 0.25em;}
.Sponsorship img{width: 300px;}

@media screen and (min-width:768px){
	.spOnly{display:none;}
	.pcOnly{display:block;}
	header > img{
		width: 40%;
	}
	main p{
		max-width: 760px;
		margin: 1em auto;
	}
	.qList{
		max-width: 760px;
		margin: 0 auto;
	}
	.qList th
	,.qList td{
		display: table-cell;
		padding: 0.5em 0.25em;
	}
	.qList th{
		vertical-align: text-bottom;
		width: 12em;
	}

	.qList input[type=radio] {
		margin: 0 1em;
	}
}