@charset 'UTF-8';





/*

    Base
*/
html { font-size: 10px; }



/*

    Header

*/

/*  h1  */
header h1 {
	padding: 15px 0;
	background: linear-gradient(to right, #b8751e 0%, #ffce08 25%, #fefeb2 50%, #ffce08 75%, #b8751e 100%);
	text-align: center;
	line-height: 1;
	box-sizing: border-box;
}
header h1 img {
	width: auto;
	height: 25px;
}





/*

    Footer

*/

footer {
	background: linear-gradient(to right, #b8751e 0%, #ffce08 25%, #fefeb2 50%, #ffce08 75%, #b8751e 100%);
}
footer small {
	display: block;
	padding: 1em 0;
	text-align: center;
	font-size: 1.3rem;
}





/*

    Common

*/
/*  headings  */
body {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: 600;
	color: #000000;
}
section h2 {
	margin: 1em 0;
	font-family: 'Noto Serif JP', serif;
	font-size: 2.0em;
	font-weight: 900;
	text-align: center;
}
section h2>span {
	display: block;
	margin: 0 0 0.25em 0;
	font-size: 0.65em;
	text-align: center;
	box-sizing: border-box;
}
section h3 {
	margin: 1em 0;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.25em;
	font-weight: 900;
	color: #e73828;
}
em {
	font-style: normal;
}
@media screen and (min-width: 800px) {
	body {
		font-size: 15px;
		font-size: 1.5rem;
	}
	section h2 {
		font-size: 2.5em;
	}
}

/*  container  */
.container {
	width: 100%;
	padding: 1em 10px;
	box-sizing: border-box;
}
@media screen and (min-width: 800px) {
	.container {
		max-width: 1020px;
		margin: 0 auto;
		padding: 2em 0;
	}
}

/*  section  */
section#judge,
section#note {
	/*background: repeating-linear-gradient( 90deg, #C8DFE7, #C8DFE7 2px, #ffffff 2px, #ffffff 4px );*/
	background-image: url('./images/bg_c.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
section#overview,
section.post {
	background: linear-gradient(to right, #b8751e 0%, #ffce08 25%, #fefeb2 50%, #ffce08 75%, #b8751e 100%);
}
section#present,
section#outline,
section#contact {
	background-image: url('./images/bg_b.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

/*  images  */
img {
	max-width: 100%;
}

/*  button  */
.link_btn {
	margin: 1em 0;
	text-align: center;
}
.link_btn a {
	display: inline-block;
	padding: 0.5em 1em;
	border-radius: 9999px;
	background-color: #D94814;
	color: #ffffff;
	box-sizing: border-box;
	
}

/*  supple  */
.supple {
	font-size: 13px;
	font-size: 1.3rem;
}

/*  small  */
small {
	font-size: 10px;
	font-size: 1.0rem;
}

/*  link  */
a.link {
	font-weight: 900;
	color: #e73828;
}

/*  out-link  */
a.out-link {
	display: block;
	margin: 2em auto;
}
a.out-link img {
	width: 100%;
	height: auto;
}

/*  sns  */
a.twitter {
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 5px;
	background-image: url('./images/twitter.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
a.instagram {
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 5px;
	background-image: url('./images/instagram.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
a.youtube {
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 5px;
	background-image: url('./images/youtube.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/*  .comment-box  */
.comment-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 1em 0;
}
.comment-box .img {
	display: block;
	width: 30%;
}
.comment-box .img span {
	display: block;
}
.comment-box .comment {
	display: flex;
	align-items: center;
	width: 70%;
}
.comment-box .comment:before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: 1em solid transparent;
	border-right: 1em solid #ffffff;
	box-sizing: border-box;
}
.comment-box .comment span {
	padding: 1em;
	border-radius: 10px;
	background-color: #ffffff;
	text-align: left;
	box-sizing: border-box;
}





/*

	#mv

*/

/*  common  */
#mv {
	background-image: url('./images/bg_a.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/*  copy  */
#mv .container p.copy {
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-weight: 800;
	text-align: center;
}
#mv .container p.copy img.mv {
	display: block;
	margin: 0 auto 2em;
	width: 100%;
	height: auto;
}
#mv .container p.copy span.description {
	font-size: 1.25em;
}
#mv .container p.copy .term {
	display: block;
	margin: 1em 0;
	font-family: 'Noto Sans JP', sans-serif;
}
#mv .container p.copy .term .label {
	display: inline-block;
	margin: 0 0.5em 0 0;
	padding: 0.25em 1em;
	border-radius: 9999px;
	background-color: #D94814;
	font-weight: 600;
	color: #FFFFFF;
	text-align: center;
	box-sizing: border-box;
}
@media screen and (min-width: 800px) {
	#mv .container p.copy img.mv {
		max-width: 800px;
	}
	#mv .container p.copy span.description {
		font-size: 2em;
	}
	#mv .container p.copy span.term {
		font-size: 1.5em;
	}
}





/*

    #overview

*/

/*  text_box  */
#overview .container .text_box {
	width: 100%;
	text-align: center;
}
#overview .container .text_box p.catch {
	margin: 0;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.75em;
	font-weight: 800;
}
#overview .container .text_box p.catch span {
	display: block;
}
#overview .container .text_box p.description {
	margin: 2em 0;
}
/*  img_box  */
#overview .container .img_box {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
#overview .container .img_box img {
	width: 75%;
	height: auto;
}
@media screen and (min-width: 800px) {
	#overview .container {
		max-width: 800px;
		padding: 2em 0;
		overflow: hidden;
	}
	#overview .container .text_box {
		position: relative;
		float: left;
		width: 60%;
		text-align: left;
	}
	#overview .container .text_box p.catch {
		font-size: 2.25em;
	}
	#overview .container .text_box p.description {
		font-size: 1.25em;
	}
	#overview .container .text_box p.link_btn {
		width: 45%;
	}
	#overview .container .text_box p.link_btn a {
		width: 100%;
	}
	#overview .container .text_box p.supple {
		position: absolute;
		right: 0;
		bottom: 1em;
		margin: 0;
		width: 50%;
		font-size: 1em;
		text-align: left;
	}
	#overview .container .img_box {
		float: right;
		margin: 0;
		width: 40%;
		height: auto;
	}
	#overview .container .img_box img {
		width: 100%;
		height: auto;
	}
}





/*

	.post

*/
.post .container img {
	display: none;
}
.post .container ul {
	list-style: none;
	margin: 0;
	overflow: hidden;
}
.post .container ul li {
	width: 50%;
	margin: 0;
	padding: 0.5em;
	text-align: center;
	box-sizing: border-box;
}
.post .container ul li:nth-of-type(1) {
	float: left;
}
.post .container ul li:nth-of-type(2) {
	float: right;
}
.post .container ul li span {
	display: block;
}
@media screen and (min-width: 800px) {
	.post .container {
		position: relative;
	}
	.post .container img {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		display: block;
		margin: auto;
		width: auto;
		height: 12em;
	}
	.post .container ul li span {
		display: inline;
	}
}



/*

	#present

*/
/*  common  */
#present .container {
	position: relative;
	margin: 0 auto;
}
@media screen and (min-width: 800px) {
	#present .container {
		max-width: 800px;
	}
}
#present .container p.link_btn {
	margin: 2em 0;
}
#present .container p.link_btn a {
	background-color: #745f4f;
	font-size: 1.0rem;
}
@media screen and (min-width: 800px) {
	#present .container p.link_btn a {
		font-size: 1.3rem;
	}
}


/*  img  */
#present .container img.shikaken {
	display: none;
}
@media screen and (min-width: 800px) {
	#present .container img.shikaken {
		position: absolute;
		top: 5em;
		left: 0;
		display: block;
		width: 35%;
		height: auto;
		z-index: 1;
	}
}

/*  itembox  */
#present .container ul.presents {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0 auto;
	box-sizing: border-box;
}
#present .container ul.presents li {
	margin: 0 auto;
	padding: 1em;
	width: 100%;
	box-sizing: border-box;
}
#present .container ul.presents li:nth-of-type(2),
#present .container ul.presents li:nth-of-type(3) {
	width: 50%;
}
#present .container ul.presents li .itembox {
	width: 100%;
	height: 100%;
	text-align: center;
}
#present .container ul.presents li:nth-of-type(1) .itembox, 
#present .container ul.presents li:nth-of-type(2) .itembox,
#present .container ul.presents li:nth-of-type(3) .itembox {
	padding: 1em;
	border-radius: 10px;
	border: 5px solid #e73828;
	background-color: #ffffff;
	box-sizing: border-box;
}
@media screen and (min-width: 800px) {
	#present .container ul.presents li {
		width: 60%;
	}
}

/*  itembox-item  */
#present .container ul.presents li .itembox span.prize {
	display: block;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.5em;
	font-weight: 900;
}
#present .container ul.presents li .itembox span.prize:before {
	content: "";
	display: block;
	width: 1.5em;
	height: 1.5em;
	margin: 0 auto;
	background-image: url('./images/prize.png');
	background-repeat: no-repeat;
	background-size: contain;
	backgroun-position: center;
	vertical-align: top;
}
#present .container ul.presents li .itembox img {
	display: block;
	margin: 1em auto;
}
#present .container ul.presents li .itembox span.item {
	display: block;
	margin: 0.5em 0;
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
}
#present .container ul.presents li .itembox span.item em {
	font-size: 2em;
	color: #e73828;
}
#present .container ul.presents li .itembox .supple {
	display: block;
	margin: 1em 0;
	text-align: center;
}
#present .container ul.presents li .itembox .supple img {
	display: block;
	width: 30%;
	margin: 1em auto 0;
}
@media screen and (min-width: 800px) {
	#present .container ul.presents li .itembox span.prize {
		font-size: 2em;
	}
}





/*


	#judge


*/
/*  .judge  */
#judge .container ul.judge {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style: none;
	margin: 0 auto;
}
#judge .container ul.judge:nth-of-type(1) {
	border-bottom: 1px dotted #745f4f;
}
#judge .container ul.judge li {
	width: 50%;
	margin: 0;
	padding: 2em 1em;
	text-align: center;
	box-sizing: border-box;
}
#judge .container ul.judge li .wrap>img {
	margin: 1em 0;
}
#judge .container ul.judge li .wrap span.name {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.5em;
	font-weight: 900;
}
#judge .container ul.judge li .wrap span.name small {
	width: 100%;
}
#judge .container ul.judge li .wrap span.description {
	display: block;
	margin: 1em 0;
	text-align: left;
}
#judge .container ul.judge li .wrap p.link_btn a {
	width: 100%;
	background-color: #745f4f;
	font-size: 10px;
	font-size: 1.0rem;
	color: #FFFFFF;
}
@media screen and (min-width: 800px) {
	#judge .container ul.judge {
		max-width: 800px;
	}
	#judge .container ul.judge li {
		padding: 2em;
	}
	#judge .container ul.judge li .wrap>img {
		width: 75%;
	}
	#judge .container ul.judge li .wrap span.name small {
		width: auto;
		margin: 0 1em 0 0;
	}
	#judge .container ul.judge li .wrap p.link_btn a {
		font-size: 13px;
		font-size: 1.3rem;
	}
}
/*  .result  */
#judge .container ul.result {
	list-style: none;
	margin: 2em auto;
}
#judge .container ul.result li {
	margin: 0;
	padding: 0.5em;
	box-sizing: border-box;
}
#judge .container ul.result li a {
	display: inline-block;
	width: 100%;
	padding: 0.5em;
	border-radius: 5px;
	background-color: #27828C;
	color: #ffffff;
	text-align: center;
	box-sizing: border-box;
}
@media screen and (min-width: 800px) {
	#judge .container ul.result {
		max-width: 800px;
		overflow: hidden;
	}
	#judge .container ul.result li {
		float: left;
		width: 50%;
	}
}






/*


	#outline


*/

/*  common  */
#outline .container .frame {
	margin: 1em auto;
	padding: 1em;
	background-color: #FFFFFF;
	border-radius: 10px;
	border: 5px solid #e73828;
	box-sizing: border-box;
}
#outline .container .frame h2 {
	margin-top: 0;
}
#outline .container .frame ul {
	list-style: none;
}
#outline .container .frame ul li {
	margin: 0 0 1em 0;
}
#outline .container .frame ul li .title {
	display: block;
	margin: 0 0 1em 0;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.25em;
	font-weight: 900;
	color: #e73828;
}
@media screen and (min-width: 800px) {
	#outline .container .frame {
		max-width: 800px;
		padding: 2em;
	}
	#outline .container .frame ul li {
		position: relative;
		padding: 0 0 0 6em;
		box-sizing: border-box;
	}
	#outline .container .frame ul li .title {
		position: absolute;
		top: 0;
		left: 0;
		width: 5em;
		font-size: 1em;
	}
}

/*  ul.items  */
#outline .container .frame ul li table.items {
	table-layout: fixed;
	width: 100%;
}
#outline .container .frame ul li table.items tr+tr {
	border-top: 1px solid #cccccc;
}
#outline .container .frame ul li table.items tr th,
#outline .container .frame ul li table.items tr td {
	border: none;
}
#outline .container .frame ul li table.items tr td.name {
	width: 8em;
}
#outline .container .frame ul li table.items tr td.limit {
	width: 4em;
}
@media screen and (min-width: 800px) {
	#outline .container .frame ul li table.items tr td.name {
		width: 15em;
	}
}

/*  ul.note  */
#outline .container .frame ul li>ul.note {
	color: #666666;
}
#outline .container .frame ul li>ul.note li {
	margin: 0;
	padding: 0 0 0 1em;
	text-indent: -1em;
	box-sizing: border-box;
}
#outline .container .frame ul li>ul.note li:before{
	content: "※";
}





/*

	#note

*/
@media screen and (min-width: 800px) {
	#note .container {
		max-width: 800px;
	}
}





/*

    #contact

*/

/*  common  */
#contact .container p {
	text-align: center;
}
#contact .container p.link_btn a {
	background-color: #745f4f;
}
@media screen and (min-width: 800px) {
	#contact .container p span {
		display: block;
	}
}