@charset "utf-8";

@media only screen and (max-width:428px)
{


/* ================================================================
	MAIN
================================================================ */


#main {
	width: 100%;
	height: 900rem;
	height: 0;
	padding-bottom: 210%;
	background: linear-gradient(-45deg, #007747 0%, #007747 40%, #005FAE 100%);
}
#main div.sample {
	background-image: url(../image/main_image_sp.jpg);
	display: block;
	display: none;
}

#main div {
	width: 100%;
	height: 900rem;
	height: 210vw;
	overflow: hidden;
	position: relative;
}

#main div * {
	position: absolute;
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
}
#main div h1 {
	width: 100%;
	height: auto;
	top: 2.2%;
	left: 0;
	right: 0;
	margin: 0 auto;
	animation: animeFadeIn 1.0s ease-in forwards 1.6s 1 normal;
}
#main div i {
	width: 47%;
	height: auto;
	bottom: 23%;
	left: -6%;
}
#main div p {
	width: 71%;
	height: auto;
	left: 0;
	right: 0;
	top: 37.2%;
	margin: 0 auto;
	animation: animeFadeIn 0.8s ease-in forwards 0.8s 1 normal;
}
#main div span {
	width: 140%;
	height: 60%;
	bottom: 0;
	left: -28%;
}
#main div span img {
	width: 100%;
	height: 100%;
}

#main div > img {
	width:100%;
}
#main div > img.img1 {
	width: 95%;
	left: 29%;
	bottom: 0.5%;
}
#main div > img.img2 {
	width: 44%;
	left: 33%;
	bottom: 4%;
}
#main div > img.img3 {
	width: 56%;
	left: 27%;
	bottom: 6.2%;
}
#main div > img.img4 {
	width: 48%;
	left: 65%;
	bottom: 16%;
}
#main div > img.img5 {
	width: 31.5%;
	left: 22%;
	bottom: 13%;
}
#main div > img.img6 {
	width: 84%;
	left: 2%;
	bottom: 22%;
}
#main div > img.img7 {
	width: 38%;
	left: 13%;
	bottom: 27%;
}
#main div > img.img8 {
	width: 45.3%;
	left: -2%;
	bottom: 31.4%;
}

#main div img.no-pc {
	width: 100%;
	display: block;
	display: none;
}


/* ================================================================
	ANCHOR
================================================================ */

#anchor {
	display: none;
}


/* ================================================================
	EVENT
================================================================ */

#event {
	width: 86%;
}
#event > p {
	width: 86%;
	margin: 0 auto;
	font-size: 1.07em;
}
#event ul {
}
#event ul li {
	width: 47.5%;
	text-align: justify;
	text-justify: inter-ideograph;
}
#event ul li h4 {
	font-size: 1.29em;
}
#event ul li h4 span {
	font-size: 0.93em;
}
#event ul li > div img {
	margin-top: -1.4em;
	margin-bottom: 1.4em;
}
#event ul li > div p {
	white-space: normal;
	font-size: 0.93em;
	line-height: 1.2em;
	padding: 0.25em;
}
#event ul li a {
	letter-spacing: -0.1em;
	text-indent: -1em;
}
#event ul li a::after {
	right: 0.75em;
}


/* ================================================================
	SUMMARY
================================================================ */

#summary {
	width: 86%;
}
#summary p {
	text-align: justify;
	text-justify: inter-ideograph;
}
#summary div {
	width: 100%;
	white-space: nowrap;
}
#summary div i {
	display: block;
	width: 100%;
	text-align: right;
	position: relative;
	bottom: 1.35em;
}

#summary dl {
	border-top: solid 1px var(--color-gray);
}
#summary dl dt {
	float: none;
	width: 100%;
	text-align: center;
	padding: 1.6em 0 0.2em 0;
}
#summary dl dd {
	width: 100%;
	text-align: center;
	padding: 0.2em 0 1.6em 0;
	white-space: nowrap;
}


/* ================================================================
	RESULT
================================================================ */

#result ul li {
	width: 47.5%;
	margin-top: 15rem;
}
#result ul li:last-child {
	margin: 0 auto;
	margin-top: 15rem;
}

#result2 h2 span {
	font-size: 12rem;
}
#result2 > div {
	overflow-x: scroll;
	position: relative;
}
#result2 table {
	white-space: nowrap;
	border-spacing: 5rem;
}
#result2 table tr th,
#result2 table tr td {
	min-width: 2.5em;
	white-space: nowrap;
}
#result2 table tr td:first-child {
	min-width: 12.5em;
}
#result2 table tr td:first-child i {
	width: 3em;
}
#result2 {
	position: relative;
}
#result2::after {
	content:' ';
	display: block;
	width: 5rem;
	height: 100%;
	background: linear-gradient(90deg,transparent,var(--color-green-l));
	position:absolute;
	top: 0;
	right: 0;
	z-index: 9;
}


/* ================================================================
	HISTORY
================================================================ */

#history {
	width: 86%;
}
#history ul {
	flex-direction: column;
}
#history ul li {
	width: 100%;
	margin-bottom: 90rem;
	margin-bottom: 50rem;
	margin-top: 0;
}
#history ul li:last-child {
	margin-bottom: var(--pixel-height-margin-sp);
}
#history ul li a {
}
#history ul li i {
	font-size: 2.86em;
	top: 53.7vw;
}
#history ul li div {
	font-size: 1.07em;
}


/* ================================================================
	SPONSOR
================================================================ */

#sponsor {
	width: 86%;
}
#sponsor ul {
	margin-top: 4%;
}
#sponsor ul.large {
	margin-top: var(--pixel-height-margin-sp);
}
#sponsor ul li {
	margin-bottom: 4%;
}
#sponsor ul.large li,
#sponsor ul.large::after,
#sponsor ul.large::before {
	width: 66.6%;
	margin-left: auto;
	margin-right: auto;
}
#sponsor ul.middle li,
#sponsor ul.middle::after,
#sponsor ul.middle::before {
	width: 48%;
}
#sponsor ul.small li,
#sponsor ul.small::after,
#sponsor ul.small::before {
	width: 31%;
}
#sponsor ul.x-small li,
#sponsor ul.x-small::after,
#sponsor ul.x-small::before {
	width: 31%;
}
#sponsor ul li a.no-img p {
	font-size: 0.8em;
}
#sponsor ul.x-small li a.no-img p {
	font-size: 0.6em;
}


/* ================================================================
	GALLERY
================================================================ */

#gallery {
	margin: var(--pixel-height-margin-sp) auto;
	padding: var(--pixel-height-margin-sp) 0;
	padding-top: 10%;
}

#gallery #gallery-swiper {
	margin: 0;
	left: 27.7%;
	left: 18.2%;
}


/* ================================================================
	BANNER
================================================================ */

#banner {
	width: 86%;
}
#banner li {
	width: 100%;
	margin: 0 0 50rem 0;
}


}