/* event */

/* campaign */
.campaign-header {
	padding: 4px 10px;
	background-color: #f5f5f5;
	img {
		max-width: 160px;
		height: auto;
	}
}
@media (min-width: 600px) {
	.campaign-header {
		img {
			max-width: 180px;
			height: auto;
		}
	}
}

/* line */
.line-banner .sns-banner {
	max-width: 400px;
}
.line-tomodachi {
	position: relative;
	.tomodachi-inner {
		position: absolute;
		max-width: 302px;
		top: 0;
		left: 50px;
		width: 75%;
		height: 100%;
		font-size: 14px;
		line-height:1.5em;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
@media (max-width: 767px) {
	.line-tomodachi br {
		display: none;
	}
}
@media (min-width: 440px) and (max-width: 599px)  {
	.tomodachi-inner {
		margin-left: 80px;
	}
}
@media (min-width: 600px) and (max-width: 699px)  {
	.tomodachi-inner {
		margin-left: 120px;
	}
}
@media (min-width: 700px) {
	.top-line {
		margin-bottom: 40px;
	}
	.top-line .section-inner.thin {
		max-width: 840px;
	}
	.line-banner {
		width: 40%;
		padding-top: 40px;
	}
	.line-tomodachi {
		width: 60%;
	}
}

@media (min-width: 768px) {
	.line-friends {
		p {
			margin-bottom: 30px;
		}
		h2 {
			font-size: 30px;
		}
	}
}
.line-howto {
	border: 2px solid #fff000;
	border-radius: 20px;
	padding: 12px 5px;
	font-size: 15px;
	line-height: 1.5em;
	font-weight: 600;
	color: #fff000;
	margin-bottom: 20px;
}
.tomodatchi-tuika-s {
	width: 400px;
	height: auto;
	margin-bottom: 10px;
}
.tomodatchi-tuika {
	width: 500px;
	height: auto;
}
@media (min-width: 768px) {
	.line-howto {
		border-width: 3px;
		padding: 16px;
		font-size: 20px;
	}
	.tomodatchi-tuika-s {
		width: 300px;
		margin-bottom: 20px;
	}
}

/* contest */
.contest .panel-title {
	text-align: center;
	h2 {
		font-size: 26px;
		position: relative;
		padding-top: 60px;
		padding-bottom: 10px;
		color: #ff3300;
		letter-spacing: 0;
	}
	h2:before {
		content: "";
		width: 80px;
		height: 56px;
		top: 0;
		left:calc(50% - 40px);
		position: absolute;
		background-image: url(images/icon_oukan.png);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
	}
	h2:after {
		content: "";
		width: 200px;
		height: 2px;
		position: absolute;
		bottom: 0;
		left: calc(50% - 100px);
		background-color: #ff3300;
	}
}

.contest-aisastu {
	font-size: 15px;
	text-align: center;
	h1 {
		font-size: 20px;
		color: #ff3300;
		text-align: center;
		margin-bottom: 4px;
	}
	span {
		color: #ff6600;
	}
	p {
		font-weight: 600;
	}
	h1 + h3 {
		margin-bottom: 10px;
	}
}
@media (min-width: 768px) {
	.contest-aisastu {
		font-size: 20px;
		text-align: center;
		margin-bottom: 30px;
		h1 {
			font-size: 34px;
		}
		h3 {
			font-size: 24px;
		}
		h1 + h3 {
			margin-bottom: 20px;
		}
	}
}

.howto-apply {
	background-color: #f9c358; /* ffdab3 */
	padding: 30px 10px;
	.grid.step1-2 {
		grid-template-columns: repeat(1, 1fr);
	}
	.step {
		padding: 24px 10px 10px;
		border: 3px solid #ffb566;
		border-radius: 15px;
		background-color: #fff;
		position: relative;
		margin-bottom: 25px;
		text-align: center;
		line-height: 1.4em;
		p {
			margin-bottom: 0;
		}
	}
	.step:before {
		content: "";
		position: absolute;
		width: 120px;
		height:37px;
		top: -18px;
		left: 20px;
		background-image: url(images/step1.png);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
	}
	.step2:before {
		background-image: url(images/step2.png);
	}
	.step3:before {
		background-image: url(images/step3.png);
	}
	.step4:before {
		background-image: url(images/step4.png);
	}
	.step3 .grid {
		text-align: center;
		grid-template-columns: repeat(1, 1fr);
		b {
			font-size: 16px;
			line-height: 1.25em;
		}
		img {
			margin-bottom: 8px;
		}
	}
	h3 {
		font-size: 18px;
		color: #ff4200;
		text-align: center;
	}
	.step4 img {
		margin-bottom: 8px;
	}
/*
	.step4 {
		background-color: #fff3e6;
	}
*/
	.large {
		font-size: 20px;
		font-weight: 600;
		color:#ff4200;
	}
	span.line {
		background: linear-gradient(transparent 60%, yellow 30%);
		display: inline-block;
	}
	span.small {
		font-size: 13px;
		line-height: 16px;
	}
}
@media (min-width: 600px) {
	.howto-apply {
		.step,
		.step-up {
			padding: 20px 20px 10px;
			text-align: center;
		}
		.step2,
		.step3 {
			text-align: center;
		}
		h3 {
			font-size: 24px;
		}
		.grid.step1-2 {
			grid-template-columns: repeat(2, 1fr);
			column-gap: 16px;
		}
		.step3 .grid {
			grid-template-columns: repeat(3, 1fr);
		}
	}
}

.award {
	background-color: #fff2e1;
	padding: 30px 10px;
	.judges {
		max-width: 700px;
		margin: 0 auto 10px;
		padding: 20px 10px 0;
		background-color: #fff;
		border-radius: 10px;
		font-size: 16px;
		border: 1px solid #ffdab3;
	}
	.step-up {
		font-size: 16px;
		max-width: 700px;
		font-weight: 600;
		text-align: center;
		margin: 0 auto 10px;
		color: #2baa2b;
		padding: 20px 10px 10px;
		background-color: #ebfaeb;
		border-radius: 10px;
		border: 1px solid #c2f0c2;
		h3 {
			font-size: 24px;
			text-align: center;
		}
	}
}
.shinsain {
	margin-bottom: 20px;
	h3 {
		font-size: 20ox;
		padding-bottom: 4px;
		border-bottom: 1px solid #000;
	}
}
@media (min-width: 600px) {
	.award {
		.judges {
			max-width: 700px;
			margin: 0 auto 20px;
			padding: 20px 40px 0;
		}
		.step-up {
			padding: 20px 40px;
			font-size: 18px;
		}
	}
	.shinsain {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		.shinsain-info {
			width: calc( 100% - 260px );
		}
		h3 {
			font-size: 28ox;
		}
		.k-photo {
			width: 252px;
		}
	}
}
.oubokiyaku {
	background-color: #fff2e1;
	.section-inner {
		max-width: 900px;
		margin: 0 auto;
	}
	h2 {
		font-size: 20px;
		margin: 10px 0 20px;
	}
	ul {
		padding-left: 26px;
		margin-bottom: 20px;
		font-size: 14px;
	}
}
@media (min-width: 600px) {
	.oubokiyaku {
		h2 {
			font-size: 24px;
		}
	}
}