body {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	color: #333;
	font-size:62.5%; /*1em=10px*/
	line-height: 210%;
	width: 100%;
	padding: 0;
	margin: 0;
	position: relative;
	background-image: url(images/bg-base.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-attachment: fixed;
}
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 67px;
	z-index: 9999;
	background-image: url(images/bg-base.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-attachment: fixed;
	box-shadow: 0 0 5px rgba(0,0,0,0.4);
}
main {
	margin: 0% auto;
	padding: 0;
	position: relative;
	white-space: nowrap;
}
h1 { font-size: 4em; font-weight: normal; line-height: 150%; margin:0;} 
h2 { font-size: 3em; font-weight: normal; line-height: 150%; margin:0;}
h3 { font-size: 2em; font-weight: normal; line-height: 150%; margin:0;}
h4 { font-size: 2em; font-weight: normal; line-height: 150%; margin:0;}
h5 { font-size: 1.8em; font-weight: normal; line-height: 150%; margin:0;}
h6 { font-size: 1.4em; font-weight: normal; line-height: 150%; margin:0;}

p, th, td {
	font-size: 1.4em;
	margin: 0;
	padding: 0;
}
a {
	text-decoration: none;
	color: #cc0010;
}
a:hover {
	opacity: 0.7;
	text-decoration: none;
}
.clear {
	clear: both;
}
.min {
	font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
}

/* 年代ナビゲーション */
#year-nav {
	position: fixed;
	bottom: 0;
	height: 40px;
	width: 100%;
	z-index: 998;
	background-color: #fff;
}
#year-nav ul {
	list-style: none;
	display: table;
	margin: 0 auto;
	padding: 0 ;
	text-align: center;
	height: 40px;
	width: 100%;
	font-size: 1.8em;
	font-weight: 0;
	border-collapse: separate;
	border-spacing: 1px 0;
}
#year-nav ul li {
	text-align: center;
	display: table-cell;
	width: 14%;
	height: 100%;
}
#year-nav ul li a {
	color: #fff;
	background-color: #cc0010;
	display: block;
	height: 100%;
    line-height: 40px;
}

/* メインコンテンツ */
h1 a {
	width: 230px;
	height: 50px;
	display: block;
	text-indent: -9999px;
	background-image: url(images/50th-logo.png);
	background-size: auto 100%;
	background-repeat: no-repeat;
	margin: 10px;
	padding: 0;
	float: left;
}
.countDown {
	font-size: 1.2em;
	display: block;
	float: right;
	margin: 15px 20px 0 0;
	text-align: center;
	line-height: 160%;
}
span.countDownText {
	color: #cc0010;
	font-size: 1.5em;
}
#start {
	width: 100%;
	height: 90vh;
	overflow: hidden;
	position: relative;
}
#start img {
	width: 150%;
	height: auto;
	position: absolute;
	left: 63%;
	transform: translate(-50%, 0);
}
#age-wrap {
	z-index: 3;
	margin: 0 auto;
	position: relative;
}
.age {
	width: 90%;
	margin: 0 auto;
	padding: 0;
	position: relative;
	clear: both;
}
/*
#age1970s {width:2380px;}
#age1980s {width:7470px;}
#age1990s {width:10570px;}
#age2000s {width:8530px;}
#age2010s {width:7860px;}
#age2020s {width:1320px;}
*/
.age-intro {/*保留*/
	float: left;
	height: 100%;
	width: 250px;
	margin: 0 80px 0 0;
	background: linear-gradient(#cc0010 70%, #fff 100%);
	text-align: center;
}
.year {
	width: 100%;
	position: relative;
	padding: 0;
}
.year-nam {
	position: absolute;
	top: -10px;
	left: 25px;
	margin: 0 0;
	font-size: 7em;
	color: #999;
	opacity: 0.5;
	z-index: 888;
}
.age-point{
	position: absolute;
	top:0;
	left: 0;
	height: 30px;
	width: 30px;
	background-color: #cc0010;
	border-radius: 15px;
	transform: translate(-50%, -50%);
	box-shadow: 0 0 0 1px #fff, 0 0 0 4px #cc0010;
}
.year-point{
	position: absolute;
	top:0;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #cc0010;
	border-radius: 10px;
	transform: translate(-50%, -50%);
}
.article-wrap-w, .article-wrap-n {
	position: relative;
	height: auto;
	width: 95%;
	border-left: 1px solid #cc0010;
/* 	border-top: 1px dotted #cc0010; */
	padding: 50px 0 50px 5%;
}
.article-top-wrap {
	position: relative;
	clear: both;
}
.article-top-wrap:empty {
	display: none;
}
.article-bottom-wrap {
	position: relative;
	margin: 0 auto;
}
.article-top {
	display: block;
	clear: both;
	margin: 20px auto 50px;
	padding: 20px;
	border: 1px solid #ccc;
}
.article-bottom {
	position: relative;
}
.article-bottom p {
	display: block;
	white-space: normal;
	margin: 0 auto 10px;
}
.article-pamph {
	height: 120px;
	width: auto;
	margin: 10px 15px 10px 0;
}
.article-pamph img {
	height: 100%;
	width: auto;
	border: 1px solid #ccc;
}
.article-course {
}
.article-year {
	font-weight: bold;
	color: #cc0010;
}
/*
.article-bottom .article-year {
	font-weight: bold;
	color: #cc0010;
}
.article-top .article-year {
	font-weight: bold;
	background-color: #cc0010;
	color: #fff;
}
*/
.article-title {
	font-size: 2em;
	margin-top: 5px !important;
	margin-bottom: 10px !important;
	line-height: 120%;
}
.article-content-addimg {
}
a.more {
	color: #fff;
	background-color: #cc0010;
	box-shadow: 0 0 0 0 #cc0010, 0 0 0 1px #fff, 0 0 0 4px #cc0010;
	display: block;
	height: 50px;
	width: 50px;
	border-radius: 27px;
	margin: 15px 0 20px 0;
	text-align: center;
	line-height: 50px;
	font-size: 1.2em;
}
a.more-nyukai {
	color: #cc0010;
	background-color: #fff;
	border: 1px solid #cc0010;
	padding: 5px 20px;
	text-align: center;
	font-size: 1.2em;
	vertical-align: 10px;
	display: block;
	margin: 10px auto 0;
}
a.more-nyukai:hover {
	color: #fff;
	background-color: #cc0010;
}
a.link {
	color: #cc0010;
	background-color: #f2f2f2;
	box-shadow: 0 0 0 0 #f2f2f2, 0 0 0 1px #cc0010, 0 0 0 4px #f2f2f2;
	display: block;
	height: 50px;
	width: 50px;
	border-radius: 27px;
	margin: 15px 0 20px 0;
	text-align: center;
	line-height: 50px;
	font-size: 1.2em;
}

/* fadeinアニメーション */
.fadeinadd-l, .fadeinadd-r, .fadeinadd-b, .fadeinadd-b-2, .fadeinadd-t, .fadeinadd-t-2, .fadeinadd, .before-fadein {
	opacity: 0;
}
@keyframes fadeIn-l {
0% {opacity:0;transform:translateX(-10%);}
100% {opacity:1;transform:translateX(0%);}
}
@keyframes fadeIn-r {
0% {opacity:0;transform:translateX(10%);}
100% {opacity:1;transform:translateX(0%);}
}
@keyframes fadeIn-b {
0% {opacity:0;transform:translateY(20%);}
100% {opacity:1;transform:translateY(0%);}
}
@keyframes fadeIn-b-2 {
0% {opacity:0;transform:translateY(20%);}
100% {opacity:0.1;transform:translateY(0%);}
}
@keyframes fadeIn-t {
0% {opacity:0;transform:translateY(-20%);}
100% {opacity:1;transform:translateY(0%);}
}
@keyframes fadeIn-t-2 {
0% {opacity:0;transform:translateY(-20%);}
100% {opacity:0.1;transform:translateY(0%);}
}
@keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}
@keyframes fadeIn-2 {
0% {opacity:0;}
100% {opacity:0.1;}
}
@keyframes fadeIn-3 {
0% {opacity:0;}
50% {opacity:0;}
100% {opacity:1;}
}

.fadein-l {
	animation-name: fadeIn-l;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein-r {
	animation-name: fadeIn-r;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein-b {
	animation-name: fadeIn-b;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein-b-2 {
	animation-name: fadeIn-b-2;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein-t {
	animation-name: fadeIn-t;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein-t-2 {
	animation-name: fadeIn-t-2;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
}
.fadein {
	animation-name: fadeIn;
	animation-duration: 4s;
	animation-timing-function: ease-in-out;
}
.fadein-2 {
	animation-name: fadeIn-2;
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
}
#rlscroll, #year-nav {
	animation-name: fadeIn-3;
	animation-duration: 4s;
	animation-timing-function: ease-in-out;
}

/* 背景画像 */
#bg-image {
	position: relative;
	z-index: -1;
}
#bg-image img {
	position: absolute;
	z-index: 0;
	width: auto;
}
.gray {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}
#bg-image img#bg-img-1971 {
	top: 0;
	left: 850px;
	height: 100%;
	opacity: 0.1;
}
#bg-image img#bg-img-1977-1 {
	bottom: 5%;
	height: 40%;
	left: 1950px;
}
#bg-image img#bg-img-1977-2 {
	bottom: 51%;
	height: 250px;
	left: 2350px;
}
#bg-image img#bg-img-1980-1 {
	top: 0;
	left: 3400px;
	height: 100%;
	opacity: 0.1;
}
#bg-image img#bg-img-1980-2 {
	top: 18%;
	left: 3250px;
	height: 25%;
	transform: rotate(-5deg);
	border: 10px solid #fff;
	box-shadow: 2px 2px 4px -2px gray;
}
#bg-image img#bg-img-1980-3 {
	top: 30%;
	left: 4200px;
	height: 15%;
	transform: rotate(5deg);
	border: 7px solid #fff;
	box-shadow: 2px 2px 4px -2px gray;
}
#bg-image img#bg-img-1981-2 {
	top: 27%;
	left: 5400px;
	height: 18%;
}
#bg-image img#bg-img-1985-2 {
	top: 0;
	left: 8850px;
	height: 75%;
}



/* 挿絵画像 */
.addimage, .addimage2 {
	width: 50%;
}
/*
img#bg-img-01 {
	position: absolute;
	top: 50px;
	right: 0;
	height: 50%;
	width: auto;
}
*/
/*
img#bg-img-1971 {
	position: absolute;
	top: 28%;
	right: 50px;
	height: 25%;
	width: auto;
}
*/
/*
img#bg-img-1977 {
	position: absolute;
	bottom: 30%;
	right: 50px;
	height: 30%;
	width: auto;
}
*/


/* 詳細ページ（iframe）*/
.article-detail-logo-area {
	width: 100%;
	height: 50px;
	text-align: center;
	padding: 10px 0 15px;
	margin: 0 auto;
	background-image: url(images/line.png);
	background-repeat: repeat-x;
	background-position: center bottom;
	background-color: #fff;
	position: fixed;
	z-index: 998;
}
.article-detail-logo-area img {
	height: 100%;
	width: auto;
}
.year-nam-detail {
	position: fixed;
	right: 0;
	bottom: 30px;
	margin: 0 auto;
	font-size: 10em;
	color: #bcbcbc;
	opacity: 0.5;
	z-index: 999;
}
.article-detail {
	width: 80%;
	height: auto;
	margin: 0 auto;
	padding: 100px 10% 0;
}
.article-pamph-detail {
	height: auto;
	width: 100%;
	margin: 0 0 10px 0;
	text-align: center;
}
.article-pamph-detail img{
	width: 28%;
	height: auto;
	border: 1px solid #ccc;
	margin: 0 2% 0 0;
}
.article-content {
	text-align: justify;
	margin: 0 auto 30px;
}
.article-detail-movie {
	width: 80%;
	height: 75%;
	margin: 0 auto;
	padding: 100px 10% 0;
}
.article-detail-scrollnone {
	overflow: hidden;
}
.article-detail-slide {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 75px 0 0;
}
.flex-next, .flex-prev {
	line-height: 40px;
}
.slides p {
	text-align: center;
	padding: 10px 20px 0;
}
