.section-main {
	background: url('../img/history/bg_top.jpg') no-repeat;
	background-size: cover;
	display: flex;
	color: #fffff0;
	align-items: center;
	padding: 6% 0;
}
.section-main .logo {
	margin-left: 8%;
	width: 9%;
}
.section-main .title {
	width: 29%;
	margin-left: 2.5%;
}
.section-main .subtitle {
	width: 46%;
	margin-left: 4%;
}
.section-main .subtitle .middle {
	width: 50%;
}
.section-main .subtitle .text {
	font-size: 1.1vw;
	margin-top: 2%;
	font-weight: normal;
}
.subtitle_image {
	width: 46% !important;
	padding-left: 4%;
	border-left: 5px solid #000;
	margin-left: 12%;
	margin-top: 7%;
}
.box {
	display: flex;
}
.left_box {
	width: 32.5%;
	background: #b49123;
}
.left_box .sticky {
	position: sticky;
	top: 0;
}
.left_box .year_wrapper {
	background: #b49123;
	padding-bottom: 2%;
}
.left_box .year {
	width: 76%;
	margin-left: 12%;
	margin-top: 9%;
}
.scene1 .subtitle_image.subtitle_image {
    width: 25% !important;
}
.scene2 .subtitle_image.subtitle_image {
	width: 25% !important;
}
.scene2 .subtitle_image.subtitle_image03 {
	width: 44% !important;
	margin-top: 79%;
}
.scene3 .subtitle_image {
	width: 43% !important;
}
.scene4 .subtitle_image.subtitle_image01 {
	width: 78% !important;
	margin-top: 59%;
}
.scene4 .subtitle_image.subtitle_image02 {
	width: 48% !important;
	margin-top: 45%;
}
.scene5 .subtitle_image.subtitle_image01 {
	width: 40% !important;
}
.scene5 .subtitle_image.subtitle_image02 {
	width: 58% !important;
	margin-top: 127%;
}
.scene5 .subtitle_image.subtitle_image03 {
	width: 58% !important;
	margin-top: 116%;
}
.scene6 .subtitle_image.subtitle_image01 {
	width: 54% !important;
}
.scene7 .subtitle_image.subtitle_image01 {
    width: 34% !important;
}
.scene3 .game_box {
	padding-bottom: 16%;
}
.scene7 .game_box {
	padding-bottom: 17%;
}
.scene8 .game_box {
	padding-bottom: 24%;
}
.left_box .text {
	font-size: 1.1vw;
	color: #000;
	margin-left: 17%;
	margin-top: 3%;
}
.right_box {
	width: 67.5%;
	position: relative;
	z-index: 10;
}
.right_box .game {
	width: 90%;
	display: flex;
}
.first_box {
	border-top: none !important;
}
.game_box {
	border-top: 3px #fff solid;
	padding-top: 5%;
	padding-bottom: 5%;
}
.scene2 .right_box, .scene3 .right_box, .scene4 .right_box, .scene5 .right_box, .scene6 .right_box, .scene7 .right_box, .scene8 .right_box {
	border-top: 3px #fff solid;
}
.odd {
	background: #d3bb73 !important;
}
.even {
	background: #c8aa50 !important;
}
.right_box .date {
	width: 22%;
	z-index: 1;
}
.right_box .date img {
	width: 80%;
}
.right_box .date.flex {
	align-items: flex-start;
}
.right_box .date .cercle {
	width: 1vw;
	height: 1vw;
	border-radius: 100%;
	background: #000;
	float: left;
}
.right_box .date .day {
	margin-left: -4.5%;
	position: relative;
	z-index: 100000;
	transform: translate3d(0, 0, 0);
}
.right_box .image {
	width: 64%;
}
.right_box .image .name {
	width: 50%;
}
.right_box .image_small {
	width: 24%;
	margin-left: 3%;
	position: relative;
}
.right_box .image_small:nth-last-of-type(1) {
	cursor: pointer;
	transition: .3s;
}
.right_box .image_small:nth-last-of-type(1):hover img {
	opacity: 0.8;
	transition: .3s;
}
.right_box .flex {
	display: flex;
}
.right_box .game .flex {
	align-items: flex-end;
	width: 60%;
}
.right_box .game .modal_btn {
	transition: .3s;
}
.right_box .game .modal_btn:hover {
	opacity: .8;
}
.right_box .game .zoom {
	position: absolute;
	width: 26%;
	top: -17%;
	right: -12%;
}
.right_box .game_image {
	margin-top: 5%;
}
.right_box .game01 .name {
	width: calc(411 / 1224 * 100%);
}
.right_box .game02 .name {
	width: calc(642 / 1224 * 100%);
}
.right_box .game03 .name {
	width: calc(489 / 1224 * 100%);
}
.right_box .game04 .name {
	width: calc(564 / 1224 * 100%);
}
.right_box .game05 .name {
	width: calc(489 / 1224 * 100%);
}
.right_box .game06 .name {
	width: calc(642 / 1224 * 100%);
}
.right_box .game07 .name {
	width: calc(564 / 1224 * 100%);
}
.right_box .game08 .name {
	width: calc(411 / 1224 * 100%);
}
.right_box .game09 .name {
	width: calc(720 / 1224 * 100%);
}
.right_box .game09 .image_small {
	width: 22%;
}
.right_box .game09 .zoom {
	width: 30%;
}
.right_box .game10 .name {
	width: calc(795 / 1224 * 100%);
}
.right_box .game10 .game_image {
	width: 86%;
}
.right_box .game10 .image_small {
	margin-left: -6%;
	width: 26%;
}
.right_box .game10 .zoom {
	width: 24%;
}
.right_box .game11 .name {
	width: calc(1332 / 1224 * 100%);
}
.right_box .game11 .zoom {
	top: -11%;
	width: 28%;
}
.right_box .game11 .image_small {
	width: 22%;
}
.right_box .game12 .name {
	width: calc(1050 / 1224 * 100%);
}
.right_box .game12 .zoom {
	top: -11%;
	width: 28%;
}
.right_box .game12 .image_small {
	width: 22%;
}
.right_box .game13 .name {
	width: calc(1182 / 1224 * 100%);
}
.right_box .game13 .game_image {
	width: 46%;
}
.right_box .game13 .image_small {
	margin-left: -31%;
	width: 18%;
}
.right_box .game13 .zoom {
	top: -11%;
	width: 36%;
}
.right_box .game14 .name {
	width: calc(642 / 1224 * 100%);
}
.right_box .game14 .game_image {
	width: 46%;
}
.right_box .game14 .image_small {
	margin-left: -31%;
	width: 18%;
}
.right_box .game14 .zoom {
	top: -11%;
	width: 36%;
}
.right_box .game15 .name {
	width: calc(564 / 1224 * 100%);
}
.right_box .game15 .image_small {
	width: 28%;
}
.right_box .game15 .zoom {
	width: 24%;
}
.right_box .game16 .name {
	width: calc(801 / 1224 * 100%);
}
.right_box .game16 .image_small {
	width: 28%;
}
.right_box .game16 .zoom {
	width: 24%;
}
.right_box .game17 .name {
	width: calc(561 / 1224 * 100%);
}
.right_box .game17 .zoom {
	width: 28%;
	top: -28%;
}
.right_box .game18 .name {
	width: calc(795 / 1224 * 100%);
}
.right_box .game19 .name {
	width: calc(1104 / 1224 * 100%);
}
.right_box .game20 .name {
    width: calc(950 / 1224 * 100%);
}
.history {
	position: relative;
}
#nav.fixed {
	position: fixed;
	top: 0;
	right: 0;
}
#nav {
	z-index: 1000 !important;
	position: absolute;
	width: 13%;
	z-index: 10;
	float: right;
	right: 0;
	padding-top: 3%;
}
#nav li {
	list-style-type: none;
	text-align: center;
	overflow: hidden;
	margin-bottom: 2%;
}
#nav li img {
    width: 45%;
    padding: 0.2em;
    display: inline-block;
    line-height: 1.3;
    vertical-align: middle;
    margin-top: -4%;
    padding-right: 19%;
    margin-right: -18%;
}
#nav li:after {
	content: '●';
	color: #fff;
	margin-left: 8px;
	font-size: 25px;
	pointer-events: none;
}
.pagetop {
	width: 6%;
	position: absolute;
	bottom: 4%;
	right: 4%;
	transition: .3s;
}
.pagetop:hover {
	opacity: .7;
}
#nav li:hover:after {
	content: '●';
	color: #000;
	margin-left: 8px;
	font-size: 25px;
}
#nav li.is-current:after {
	content: '●';
	color: #000;
	margin-left: 8px;
	font-size: 25px;
}
.modals {
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
	background-color: #d3bb73;
	overflow: auto;
}
.modal_block {
	margin-bottom: 0%;
}
.modal_bg {
	background-color: #d3bb73;
	height: 100%;
	width: 100%;
}
.modal_inner {
	background-color: #d3bb73;
	left: 15%;
	position: absolute;
	top: 10%;
	width: 70%;
}
.modal_close {
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: -6%;
	font-size: 6vw;
	font-weight: normal;
	transition: .3s;
}
.modal_close:hover{
	opacity: .7;
}
.modal_btn {
	cursor: pointer;
}
footer {
	background: #000;
}
footer .inner {
	width: 90%;
	margin-left: 5%;
	padding: 1%;
}
footer .inner p {
	color: #fff;
	position: relative;
	font-size: 14px;
	font-weight: bold;
	padding-left: 22px;
	display: inline-block;
	margin-left: 3%;
	transition: .3s;
}
footer .inner p:hover {
	opacity: .8;
}
footer .inner p:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 0;
	height: 0;
	margin-top: -8px;
	border-top: 8px solid transparent;
	border-left: 9px solid transparent;
	border-bottom: 8px solid transparent;
	border-right: 9px solid #fff;
}
.pc {
	display: block;
}
.sp {
	display: none;
}
.year_sp{
	display: none;
}
@media screen and (max-width:759px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.left_box {
		display: none;
	}
	.right_box {
		width: 100%;
	}
	#nav {
		display: none;
	}
	.right_box .flex {
		display: block;
	}
	.game_box {
		border-top: none;
		padding-top: 0%;
	}
	.year_sp{
		display: block;
		position: sticky;
		padding-top: 2%;
		padding-bottom: 2%;
		top:0;
		background: #b49123;
		z-index: 1000;
	}
	.scene1 .first_box,
	.scene2 .first_box,{
		padding-top: 8%;
	}
	
	.scene2 .right_box, .scene3 .right_box, .scene4 .right_box, .scene5 .right_box, .scene6 .right_box, .scene7 .right_box, .scene8 .right_box {
		border-top: 0px #fff solid;
	}
	.scene2 .subtitle_image.subtitle_image03 {
		margin-top: 0%;
	}
	.scene4 .subtitle_image.subtitle_image02 {
		margin-top: 5%;
		width: 54% !important;
	}
	.scene4 .subtitle_image.subtitle_image01 {
		margin-top: 0%;
	}
	.scene5 .subtitle_image.subtitle_image02 {
		margin-top: 5%;
	}
	.section-main {
		background: url(../img/history/bg_top_sp.jpg) no-repeat;
		background-size: cover;
	}
	.section-main, .section-main .title {
		display: inline-block;
	}
	.section-main .logo {
		float: left;
		width: 20%;
		margin-left: 12%;
		margin-top: 4%;
	}
	.section-main .title {
		width: 52%;
		margin-left: 4.5%;
		margin-top: 7%;
	}
	.section-main .subtitle {
		width: 80%;
		margin-left: 10%;
		margin-top: 11%;
		margin-top: 8%;
	}
	.section-main .subtitle .middle {
		width: 70%;
		margin-left: 15%;
	}
	.section-main .subtitle .text {
		margin-top: 2%;
		font-weight: bold;
		text-align: center;
		font-size: 3.5vw;
		line-height: 1.6em;
		margin-top: 5%;
		margin-bottom: 5%;
	}
	.year {
		width: 54%;
		margin-left: 23%;
		margin-top: 2%;
		margin-bottom: 2%;
	}
	.subtitle_image {
		width: 50% !important;
		padding-left: 4%;
		border-left: 5px solid #000;
		margin-left: 5%;
		margin-top: 3%;
	}
	.right_box .text {
		color: #000000;
		width: 80%;
		margin-left: 10%;
	}
	.right_box .text {
		color: #000000;
		width: 80%;
		margin-left: 10%;
		margin-top: 4%;
		margin-bottom: 5%;
	}
	.right_box .game {
		width: 100%;
		display: inline-block;
	}
	.right_box .date {
		width: 100%;
		position: relative;
		z-index: 0;
	}
	.right_box .date .day {
		margin-left: 0%;
	}
	.right_box .game .name {
		width: auto;
	}
	.right_box .date img {
		width: 16%;
		float: left;
		margin-left: 5%;
	}

	.right_box .game .zoom {
		position: absolute;
		width: 20%;
		top: -13%;
		right: -10%;
	}
	.right_box .game09 .zoom {
		position: absolute;
		width: 24%;
		top: -13%;
		right: -10%;
	}
	.right_box .game11 .zoom {
		position: absolute;
		width: 24%;
		top: -13%;
		right: -10%;
	}
	.right_box .game12 .zoom {
		position: absolute;
		width: 24%;
		top: -9%;
		right: -10%;
	}
	.right_box .game13 .zoom {
		position: absolute;
		width: 32%;
		top: -9%;
		right: -16%;
	}
	.right_box .game14 .zoom {
		position: absolute;
		width: 32%;
		top: -9%;
		right: -16%;
	}
	.right_box .game11 .zoom {
		position: absolute;
		width: 24%;
		top: -13%;
		right: -10%;
	}
	.right_box .game .flex {
		align-items: flex-end;
		width: 100%;
	}
	.right_box .game .name img {
		width: 20%;
	}
	.right_box .game01 .name img {
		width: 23%;
		margin-top: -1%;
	}
	.right_box .image {
		width: 80%;
		margin-left: 10%;
		margin-top: 11%;
	}
	.right_box .image_small {
		margin-top: 6%;
		width: 36%;
		margin-left: 32%;
		margin-bottom: 6%;
	}
	.right_box .game_image {
		margin-top: 15%;
	}
	.right_box .game {
		padding-top: 10%;
	}
	.right_box .game02 .date img {
		width: 12%;
	}
	.right_box .game02 .name img {
		width: 34%;
		margin-top: -1%;
	}
	.right_box .game03 .name img {
		width: 28%;
		margin-top: -1%;
	}
	.scene2 .year {
	}
	.scene2 .subtitle_image.subtitle_image {
		width: 27% !important;
	}
	.right_box .game04 .date img {
		width: 14%;
	}
	.right_box .game04 .name img {
		width: 32%;
		margin-top: -1%;
	}
	.right_box .game05 .name img {
		width: 28%;
		margin-top: -1%;
	}
	.scene2 .subtitle_image.subtitle_image03 {
		margin-top: 6%;
		width: 46% !important;
	}
	.right_box .game06 .name img {
		width: 33%;
		margin-top: -1%;
	}
	.right_box .game07 .name img {
		width: 29%;
		margin-top: -1%;
	}
	.right_box .game08 .name img {
		width: 23%;
		margin-top: -1%;
	}
	.right_box .game08 .date08{
		width: 29%;
	}
	.scene3 .subtitle_image {
		width: 46% !important;
	}
	.right_box .game09 .date img {
		width: 14%;
	}
	.right_box .game09 .name img {
		width: 41%;
		margin-top: -1%;
	}
	.right_box .game09 .image_small {
		width: 30%;
		margin-left: 35%;
		margin-bottom: 0%;
	}
	.right_box .game09{
	padding-bottom: 10%;
	}
	.modal_btn9{
		margin-bottom: 10%;
	}
	.scene3 .game_box{
		padding-bottom: 0%;
	}
	.right_box .game10 .name img {
		width: 42%;
		margin-top: -1%;
	}
	.right_box .game10 .game_image {
		width: 86%;
		margin-left: 7%;
	}
	.right_box .game10 .image_small {
		width: 36%;
		margin-left: 32%;
	}
	.scene4 .subtitle_image.subtitle_image01 {
		margin-top: 5%;
	}
	.right_box .game11 .name img {
		width: 68%;
		margin-top: -1%;
	}
	.right_box .game11 .image_small {
		width: 30%;
		margin-left: 35%;
	}
	.right_box .game12 .date img {
		width: 29%;
	}
	.right_box .game12 .name img {
		width: 51%;
		margin-top: -1%;
	}
	.right_box .game12 .image_small {
		width: 30%;
		margin-left: 35%;
	}
	.right_box .game13 .date img {
		width: 13%;
	}
	.right_box .game13 .name img {
		width: 66%;
		margin-top: -1%;
	}
	.right_box .game13 .game_image {
		width: 50%;
		margin-left: 25%;
	}
	.right_box .game13 .image_small {
		width: 24%;
		margin-left: 38%;
	}
	.right_box .game14 .name img {
		width: 35%;
		margin-top: -1%;
	}
	.right_box .game14 .game_image {
		width: 50%;
		margin-left: 25%;
	}
	.right_box .game14 .image_small {
		width: 24%;
		margin-left: 38%;
	}
	.right_box .game15 .name img {
		width: 33%;
		margin-top: -1%;
	}
	.right_box .game15 .image_small {
		width: 40%;
		margin-left: 30%;
	}
	.right_box .game16 .date img {
		width: 18%;
	}
	.right_box .game16 .name img {
		width: 45%;
		margin-top: -1%;
	}
	.right_box .game16 .image_small {
		width: 40%;
		margin-left: 30%;
	}
	.scene6 .year {
		margin-top: 5%;
		margin-bottom: 3%;
	}
	.right_box .game17 .date img {
		width: 29%;
	}
	.right_box .game17 .name img {
		width: 31%;
		margin-top: -1%;
	}
	.right_box .game18 .date img {
		width: 29%;
	}
	.right_box .game18 .name img {
		width: 45%;
		margin-top: -1%;
	}
	.right_box .game20 .date img {
		width: 29%;
	}
	.scene7 .subtitle_image.subtitle_image01 {
		width: 40% !important;
	}
	.right_box .game19 .date img {
		width: 29%;
	}
	.right_box .game19 .name img {
		width: 56%;
		margin-top: -1%;
	}
	.scene7 .game_box {
		padding-bottom: 4%;
	}
	.right_box .game20 .name img {
		width: 50%;
		margin-top: -1%;
	}
	.scene8 .game_box {
		padding-bottom: 0;
	}
	.pagetop {
		width: 10%;
	}
	footer .inner p {
		color: #fff;
		position: relative;
		font-size: 3.2vw;
		font-weight: bold;
		padding-left: 15px;
		display: inline-block;
		margin-left: -4%;
		transition: .3s;
	}
	footer .inner p:before {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 0;
		height: 0;
		margin-top: -4px;
		border-top: 4px solid transparent;
		border-left: 4.5px solid transparent;
		border-bottom: 4px solid transparent;
		border-right: 4.5px solid #fff;
	}
	.modal_inner {
		background-color: #d3bb73;
		position: absolute;
		top: 0%;
		width: 100%;
		left: 0%;
	}
	.modal_close {
		cursor: pointer;
		position: absolute;
		right: 5%;
		top: 0%;
		font-size: 13vw;
		font-weight: normal;
	}
	.sp_pt7{
		padding-top: 7% !important;
	}
}