@charset "UTF-8";

html,body {
	height:100%;
}

#Wrapper {
	width: 100%;
	position: relative;
	height:auto !important;
	height: 100%;
	min-height: 100%;
}

#StageWrap {
	padding-bottom: 80px;
}


/* Page_History（製品ヒストリー：タイムライン） --------------------------------------------------- */

#Timeline {
	margin-top: -53px;
	padding-top: 53px;
	background: url(../img/history/history1/Texture_Arrow1.png) no-repeat 50% 0;
}

[id^="Period"] {
	position: relative;
	height: 360px;
}

[id^="Period"] h2 {
	position: absolute;
	left: 26px;
	bottom: 23px;
}

[id^="Period"] .RightLine h2 {
	left: 829px;
}

#Timeline #Period1,
#Timeline #Period3,
#Timeline #Period5,
#Timeline #Period7,
#Timeline #Period9,
#Timeline #Period11,
#Timeline #Period13,
#Timeline #Period15,
#Timeline #Period17,
#Timeline #Period19,
#Timeline #Period21,
#Timeline #Period23,
#Timeline #Period25,
#Timeline #Period27,
#Timeline #Period29,
#Timeline #Period31 {
background: #ffffff url(../img/history/history1/Texture_Timeline1.png) repeat-y 50% 0;
}

#Timeline #Period2,
#Timeline #Period4,
#Timeline #Period6,
#Timeline #Period8,
#Timeline #Period10,
#Timeline #Period12,
#Timeline #Period14,
#Timeline #Period16,
#Timeline #Period18,
#Timeline #Period20,
#Timeline #Period22,
#Timeline #Period24,
#Timeline #Period26 {
	background:#ebecee url(../img/history/history1/Texture_Timeline2.png) repeat-y 50% 0;
}

/* 高速度カメラ 空白期間 */
#Timeline.HighSpeedCamera #Period8 {
	background:#ebecee url(../img/history/history1/Texture_Timeline3.png) repeat-y 50% 0;
}


#Timeline li,
.HighSpeedCamera #Period8 p {
position: absolute;
overflow: hidden;
}

#Timeline li {
	width: 0;
}

/* READ MOREボタン */
.More {
margin: 15px 0 0 98px;
}


/*
■ ビデオスイッチャー 各エピソード
■ プロセッサ 各エピソード
■ 高速度カメラ 各エピソード
■ マルチビューワ 各エピソード
■ CG・バーチャル 各エピソード
*/


/* ■ ビデオスイッチャー 各エピソード */
.VideoSwitcher #Period24 .Episode2 {
top: 40px;
left: 477px;
}

.VideoSwitcher #Period24 .Episode2 .More {
margin: 15px 0 0 98px;
}

.VideoSwitcher #Period24 .Episode1 {
top: 20px;
right: 477px;
}

.VideoSwitcher #Period24 .Episode1 .More {
position: absolute;
top: 215px;
right: -190px;
}

.VideoSwitcher #Period23 .Episode1 {
top: 43px;
left: 477px;
}

.VideoSwitcher #Period23 .More {
margin: 15px 0 0 98px;
}

.VideoSwitcher #Period22 .Episode1 {
	top: 40px;
	left: 477px;
}

.VideoSwitcher #Period22 .More {
	margin: 15px 0 0 98px;
}

.VideoSwitcher #Period1 .Episode1 {
	top: 48px;
	left: 477px;
}

.VideoSwitcher #Period1 .More {
	margin: 10px 0 0 98px;
}

.VideoSwitcher #Period2 .Episode1 {
	top: 67px;
	left: 477px;
}

.VideoSwitcher #Period2 .More {
	margin: 10px 0 0 98px;
}

.VideoSwitcher #Period3 .Episode1 {
	top: 36px;
	left: 477px;
}

.VideoSwitcher #Period4 .Episode1 {
	top: 78px;
	left: 477px;
}

.VideoSwitcher #Period5 .Episode1 {
	top: 50px;
	left: 477px;
}

.VideoSwitcher #Period5 .Episode2 {
	top: 35px;
	right: 477px;
}

.VideoSwitcher #Period5 .More {
	margin: 10px 0 0 98px;
}

.VideoSwitcher #Period6 .Episode1 {
	top: 82px;
	left: 477px;
}

.VideoSwitcher #Period7 .Episode1 {
	top: 57px;
	left: 477px;
}

.VideoSwitcher #Period8 .Episode1 {
	top: -60px;
	left: 477px;
}

.VideoSwitcher #Period8 .Episode2 {
	top: -6px;
	right: 477px;
}

.VideoSwitcher #Period8 .Episode3 {
	top: 146px;
	left: 484px;
}

.VideoSwitcher #Period9 .Episode1 {
	top: 26px;
	left: 477px;
}

.VideoSwitcher #Period10 .Episode1 {
	top: 34px;
	left: 477px;
}

.VideoSwitcher #Period10 .More {
	margin: 10px 0 0 98px;
}

.VideoSwitcher #Period11 .Episode1 {
	top: 41px;
	left: 477px;
}

.VideoSwitcher #Period12 .Episode1 {
	top: 44px;
	left: 477px;
}

.VideoSwitcher #Period13 .Episode1 {
	top: 52px;
	left: 477px;
}

.VideoSwitcher #Period14 .Episode1 {
	top: 92px;
	left: 477px;
}

.VideoSwitcher #Period15 .Episode1 {
	top: 71px;
	left: 477px;
}

.VideoSwitcher #Period15 .Episode2 {
	top: 20px;
	right: 477px;
}

.VideoSwitcher #Period16 .Episode1 {
	top: 33px;
	left: 477px;
}

.VideoSwitcher #Period17 .Episode1 {
	top: 50px;
	left: 477px;
}

.VideoSwitcher #Period18 .Episode1 {
	top: 50px;
	left: 477px;
}

.VideoSwitcher #Period19 .Episode1 {
	top: 16px;
	left: 477px;
}

.VideoSwitcher #Period20 .Episode1 {
	top: 71px;
	left: 477px;
}

.VideoSwitcher #Period21 .Episode1 {
	top: 68px;
	left: 477px;
}

.VideoSwitcher #Period21 .More {
	margin: 15px 0 0 98px;
}


/* ■ プロセッサ 各エピソード */
.Processor #Period27 .Episode1 {
top: 120px;
left: 475px;
}

.Processor #Period27 .Episode1 .More {
margin: 15px 0 0 98px;
}

.Processor #Period26 .Episode1 {
top: 41px;
left: 477px;
}

.Processor #Period1 .Episode1 {
top: 135px;
right: 477px;
}

.Processor #Period1 .Episode2 {
top: 142px;
left: 477px;
}

.Processor #Period1 .Episode2 .More {
margin-top: -32px;
}

.Processor #Period2 .Episode1 {
	top: 71px;
	left: 477px;
}

.Processor #Period3 .Episode1 {
top: 147px;
left: 477px;
}

.Processor #Period4 .Episode1 {
top: 101px;
left: 477px;
}

.Processor #Period5 .Episode1 {
top: 130px;
left: 477px;
}

.Processor #Period6 .Episode1 {
top: 89px;
left: 477px;
}

.Processor #Period7 .Episode1 {
top: 137px;
right: 477px;
}

.Processor #Period7 .Episode2 {
top: 146px;
left: 477px;
}

.Processor #Period7 .Episode2 .More {
margin-top: -25px;
}

.Processor #Period8 .Episode1 {
top: 97px;
left: 477px;
}

.Processor #Period9 .Episode1 {
top: 96px;
left: 477px;
}

.Processor #Period10 .Episode1 {
top: 100px;
left: 477px;
}

.Processor #Period10 .Episode1 .More {
margin-top: -55px;
}

.Processor #Period11 .Episode1 {
top: 101px;
left: 477px;
}

.Processor #Period12 .Episode1 {
top: 55px;
left: 477px;
}

.Processor #Period13 .Episode1 {
top: 95px;
right: 477px;
}

.Processor #Period13 .Episode2 {
top: 106px;
left: 477px;
}

.Processor #Period14 .Episode1 {
top: 123px;
left: 477px;
}

.Processor #Period15 .Episode1 {
top: 96px;
left: 477px;
}

.Processor #Period16 .Episode1 {
top: 71px;
left: 477px;
}

.Processor #Period17 .Episode1 {
top: 102px;
left: 477px;
}

.Processor #Period17 .Episode2 {
top: 150px;
right: 477px;
}

.Processor #Period18 .Episode1 {
top: 41px;
left: 477px;
}

.Processor #Period19 .Episode1 {
top: 125px;
left: 477px;
}

.Processor #Period19 .Episode1 .More {
margin-top: -55px;
}

.Processor #Period20 .Episode1 {
top: 127px;
left: 477px;
}

.Processor #Period21 .Episode1 {
top: 87px;
left: 477px;
}

.Processor #Period21 .Episode2 {
top: 41px;
right: 477px;
}

.Processor #Period22 .Episode1 {
top: 11px;
left: 477px;
}

.Processor #Period22 .Episode2 {
top: 62px;
right: 477px;
}

.Processor #Period22 .Episode3 {
top: 230px;
left: 477px;
}

.Processor #Period23 .Episode1 {
top: 117px;
left: 477px;
}

.Processor #Period24 .Episode1 {
top: 153px;
right: 477px;
}

.Processor #Period24 .Episode2 {
top: 101px;
left: 477px;
}

.Processor #Period25 .Episode1 {
top: 71px;
left: 477px;
}


/* ■ 高速度カメラ 各エピソード */
.HighSpeedCamera #Period11 .Episode1 {
top: 28px;
left: 477px;
}

.HighSpeedCamera #Period11 .More {
margin: 10px 0 0 98px;
}

.HighSpeedCamera #Period10 .Episode1 {
top: 37px;
left: 477px;
}

.HighSpeedCamera #Period1 .Episode1 {
top: 38px;
left: 477px;
}

.HighSpeedCamera #Period1 .Episode2 {
top: 126px;
right: 477px;
}

.HighSpeedCamera #Period1 .Episode3 {
top: 193px;
left: 477px;
}

.HighSpeedCamera #Period2 .Episode1 {
top: 38px;
right: 477px;
height: 70px;
}

.HighSpeedCamera #Period2 .Episode2 {
top: 188px;
right: 477px;
}

.HighSpeedCamera #Period2 .Episode3 {
top: 51px;
left: 484px;
}

.HighSpeedCamera #Period2 .Episode3 .More {
margin-left: 94px;
}

.HighSpeedCamera #Period3 .Episode1 {
top: 58px;
left: 477px;
height: 350px;
}

.HighSpeedCamera #Period3 .More {
margin-top: -85px;
}

.HighSpeedCamera #Period4 .Episode1 {
top: 51px;
left: 477px;
}

.HighSpeedCamera #Period5 .Episode1 {
top: 106px;
left: 477px;
}

.HighSpeedCamera #Period6 .Episode1 {
top: 71px;
left: 477px;
}

.HighSpeedCamera #Period7 .Episode1 {
top: 72px;
left: 477px;
}

.HighSpeedCamera #Period8 {
width: 100%;
}

.HighSpeedCamera #Period8 p {
width: 516px !important;
bottom: 153px;
left: 215px;
}

.HighSpeedCamera #Period9 .Episode1 {
top: 78px;
left: 477px;
}


/* ■ マルチビューワ 各エピソード */
.Multiviewer #Period22 .Episode1 {
top: 68px;
left: 477px;
}

.Multiviewer #Period22 .Episode1 .More {
margin: 5px 0 0 98px;
}

.Multiviewer #Period21 .Episode1 {
	top: 97px;
	left: 477px;
}

.Multiviewer #Period20 .Episode1 {
	top: 76px;
	left: 477px;
}

.Multiviewer #Period20 .Episode1 .More {
	margin: -35px 0 0 98px;
}

.Multiviewer #Period1 .Episode1 {
	top: 41px;
	left: 477px;
}

.Multiviewer #Period1 .Episode2 {
	top: 78px;
	right: 477px;
}

.Multiviewer #Period2 .Episode1 {
	top: 132px;
	left: 477px;
}

.Multiviewer #Period3 .Episode1 {
	top: 101px;
	left: 477px;
}

.Multiviewer #Period4 .Episode1 {
	top: 41px;
	left: 477px;
}

.Multiviewer #Period4 .Episode1 .More {
	margin: 13px 0 0 98px;
}

.Multiviewer #Period4 .Episode2 {
	top: 164px;
	right: 477px;
}

.Multiviewer #Period5 .Episode1 {
	top: 101px;
	right: 477px;
}

.Multiviewer #Period5 .Episode2 {
	top: 151px;
	left: 477px;
}

.Multiviewer #Period6 .Episode1 {
	top: 71px;
	left: 477px;
}

.Multiviewer #Period6 .Episode2 {
	top: 118px;
	right: 477px;
}

.Multiviewer #Period7 .Episode1 {
	top: 87px;
	right: 477px;
}

.Multiviewer #Period7 .Episode2 {
	top: 47px;
	left: 477px;
}

.Multiviewer #Period7 .Episode3 {
	top: 240px;
	left: 477px;
}

.Multiviewer #Period8 .Episode1 {
	top: 71px;
	left: 477px;
}

.Multiviewer #Period9 .Episode1 {
	top: 71px;
	left: 477px;
}

.Multiviewer #Period9 .Episode2 {
	top: 115px;
	right: 477px;
}

.Multiviewer #Period10 .Episode1 {
	top: 41px;
	left: 477px;
}

.Multiviewer #Period10 .Episode1 .More {
	margin: 13px 0 0 98px;
}

.Multiviewer #Period11 .Episode1 {
	top: 167px;
	right: 477px;
}

.Multiviewer #Period11 .Episode2 {
	top: 134px;
	left: 477px;
	height: 215px;
}

.Multiviewer #Period11 .Episode2 .More {
	margin: -89px 0 0 98px;
}

.Multiviewer #Period12 .Episode1 {
	top: 131px;
	left: 477px;
}

.Multiviewer #Period13 .Episode1 {
	top: 155px;
	left: 477px;
}

.Multiviewer #Period14 .Episode1 {
	top: 131px;
	left: 477px;
}

.Multiviewer #Period14 .Episode2 {
	top: 62px;
	right: 477px;
}

.Multiviewer #Period15 .Episode1 {
	top: 11px;
	left: 477px;
}

.Multiviewer #Period15 .Episode1 .More {
	margin: 13px 0 0 98px;
}

.Multiviewer #Period15 .Episode2 {
	top: 73px;
	right: 477px;
}

.Multiviewer #Period16 .Episode1 {
	top: 71px;
	left: 477px;
}

.Multiviewer #Period17 .Episode1 {
	top: 153px;
	left: 477px;
	height: 195px;
}

.Multiviewer #Period17 .Episode1 .More {
	margin: -78px 0 0 98px;
}

.Multiviewer #Period18 .Episode1 {
	top: 148px;
	left: 477px;
}

.Multiviewer #Period19 .Episode1 {
	top: 41px;
	left: 477px;
}


/* ■ CG・バーチャル 各エピソード */
.CharacterGenerators #Period22 .Episode2 {
top: 25px;
left: 475px;
}

.CharacterGenerators #Period22 .Episode2 .More {
margin: -15px 0 0 68px;
}

.CharacterGenerators #Period22 .Episode1 {
top: 170px;
left: 477px;
}

.CharacterGenerators #Period22 .Episode1 .More {
margin: -25px 0 0 68px;
}

.CharacterGenerators #Period21 .Episode1 {
top: 25px;
left: 477px;
}

.CharacterGenerators #Period21 .Episode1 .More {
margin: 12px 0 0 68px;
}

.CharacterGenerators #Period20 .Episode1 {
top: 55px;
left: 93px;
}

.CharacterGenerators #Period20 .Episode1 .More {
margin: 15px 0 0 195px;
}

.CharacterGenerators #Period19 .Episode2 {
top: 20px;
left: 477px;
}

.CharacterGenerators #Period19 .Episode2 .More {
margin: 15px 0 0 68px;
}

.CharacterGenerators #Period19 .Episode1 {
top: 158px;
left: 477px;
}

.CharacterGenerators #Period19 .Episode1 .More {
margin: -20px 0 0 68px;
}


.CharacterGenerators #Period15 .Episode1 {
top: 73px;
left: 477px;
}

.CharacterGenerators #Period15 .More {
margin-top: 0;
}

.CharacterGenerators #Period14 .Episode1 {
top: 17px;
left: 477px;
}

.CharacterGenerators #Period14 .More {
margin-top: -35px;
}

.CharacterGenerators #Period13 .Episode1 {
top: 15px;
left: 477px;
}

.CharacterGenerators #Period12 .Episode1 {
top: 74px;
left: 477px;
}

.CharacterGenerators #Period11 .Episode1 {
top: 40px;
left: 477px;
}

.CharacterGenerators #Period10 .Episode1 {
top: 14px;
left: 477px;
}

.CharacterGenerators #Period10 .Episode2 {
top: 14px;
right: 477px;
}

.CharacterGenerators #Period10 .More {
margin-top: 98px;
}

.CharacterGenerators #Period9 .Episode1 {
top: 85px;
left: 477px;
}

.CharacterGenerators #Period9 .More {
margin-top: -108px;
}

.CharacterGenerators #Period8 .Episode1 {
top: 41px;
left: 477px;
}

.CharacterGenerators #Period8 .Episode2 {
top: 75px;
right: 477px;
}

.CharacterGenerators #Period7 .Episode1 {
top: 133px;
left: 477px;
}

.CharacterGenerators #Period6 .Episode1 {
top: 30px;
left: 477px;
}

.CharacterGenerators #Period5 .Episode1 {
top: 11px;
left: 477px;
}

.CharacterGenerators #Period5 .Episode2 {
top: 136px;
right: 477px;
}

.CharacterGenerators #Period4 .Episode1 {
top: 71px;
left: 477px;
}

.CharacterGenerators #Period3 .Episode1 {
top: 7px;
left: 477px;
}

.CharacterGenerators #Period2 .Episode1 {
top: 64px;
left: 477px;
}

.CharacterGenerators #Period1 .Episode1 {
top: 41px;
left: 477px;
}


/* 下から、右からスライドするものはサイズと位置を固定 */
.HighSpeedCamera .leftEp {
	height: 60px;
}

.VideoSwitcher .leftEp {
	height: 264px;
}

.CharacterGenerators .leftEp {
	height: 231px;
}

.Processor .leftEp {
	 height: 307px;
}

.Multiviewer .leftEp {
	height: 200px;
}

.CharacterGenerators .leftEp .More {
	height: 30px;
}

.HighSpeedCamera #Period8 p {
	width: 400px;
}

.leftEp img,
.HighSpeedCamera #Period8 img {
	position: absolute;
}

.leftEp img {
right: 0;
}

.leftEp .More img {
right: 285px;
}

.CharacterGenerators .leftEp .More img {
right: 297px;
}

.HighSpeedCamera #Period8 img {
	bottom: 0;
}

#Timeline .PhScroll {
	text-align: center;
	line-height: 0;
}



/* ポップアップ */
#Overlay {
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #000000;
	opacity: 0;
	z-index: 2;
}

.Popup {
	display: none;
	position: absolute;
	left: 50%;
	width: 780px;
	margin-left: -390px;
	padding-bottom: 50px;
	background-color: #fff;
	z-index: 3;
}

#Popup_Olympic.Popup,
#Popup_Vwsseries.Popup {
	width: 520px;
	margin-left: -260px;
}

.Popup .Txt {
	float: right;
	width: 380px;
	margin: 50px 0 0;
	padding-right: 32px;
}

#Popup_Olympic.Popup .Txt,
#Popup_Vwsseries.Popup .Txt {
	float: none;
	width: 440px;
	margin: 50px 40px 0;
	padding: 0;
}

.Popup h3 {
	margin-bottom: 20px;
}

.Popup .Lead {
margin-bottom: 10px;
line-height: 1.5em;
font-weight: bold;
}

.Popup .Lead + p {
	font-size: 86%;
}

.Popup .Pic {
	float: left;
	width: 324px;
	margin-top: 120px;
	padding-left: 50px;
}

.Popup .Close {
	position: absolute;
	width: 23px;
	height: 23px;
	top: 16px;
	right: 14px;
}