@charset "utf-8";
@font-face {
    font-family: 'icomoon';
    src:    url('../font/icomoon.eot?9hwgdm');
    src:    url('../font/icomoon.eot?9hwgdm#iefix') format('embedded-opentype'),
        url('../font/icomoon.ttf?9hwgdm') format('truetype'),
        url('../font/icomoon.woff?9hwgdm') format('woff'),
        url('../font/icomoon.svg?9hwgdm#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

*:not(input){ margin: 0; padding: 0; text-align:center; background:none; }
html,body{
	width: 100%; height: 100%; background:#000;
}

body {
	font-size: 12px;
	color: #333333;
	overflow:scroll;
	overflow-x:auto;
	margin:0px;
	padding:0px;
	text-align:center;
	font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
}
#Index{
	overflow:visible;
}
#bg3d{
	position:fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 120%;
	/*z-index: 0;*/
	overflow: hidden;
	z-index:1;
}

a{
	color:#4D4DFF;
	text-decoration:underline;
}
a:hover{
	text-decoration:none;
}
img {
	border: 0px;
	vertical-align:top;
}
li{
	list-style:none;
}
.pcBr{
	display:block;
}
.smpBr{
	display:none;
}

header{
	min-width:980px;
	width:100%;
	position:fixed;
	left:0px;
	background:url(../img/head_bg.png) repeat-x left top;
	z-index:100;
	height:80px;
	top:0%;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/*
	transition:bottom 300ms ease;
	*/
	z-index:10000;
}
#Index header{
	top:auto;
	bottom:-80px;
	bottom:0px;
}
header.on{
	bottom:-40px;
	bottom:0px;
}
header.set{
	bottom:0px;
}
header div,
header h1{
	float:left;
	padding:5px 20px 0px;
	font-size:1px;
	height:35px;
}
header div img,
header h1 img{
	height:30px;
}
header nav{
	width:26px;
	height:26px;
	cursor:pointer;
	position:absolute;
	top:7px;
	left:50%;
	margin:0px 0px 0px -13px;
	display:none;
}
header nav::after,
header nav::before{
	width:26px;
	content:"";
	display:block;
	position:absolute;
	left:0px;
	transition:all 300ms ease;
}
header nav::after{
	border-top:2px solid #000;
	border-bottom:2px solid #000;
	height:12px;
	top:5px;
}
header nav::before{
	height:2px;
	background:#000;
	bottom:12px;
}
header.set nav::after{
	transform:rotate(-90deg);
	border-color:transparent;
}
header.set nav::before{
	transform:rotate(90deg);
}
header .navi{
	font-size:0px;
	text-align:center;
	margin:0px 0px 0px 0px;
	padding:0px 0px;
}
header .navi li{
	font-size:13px;
	display:inline-block;
	position:relative;
	line-height:40px;
	color:#fff;
	width:160px;
}
header .navi li a{
	font-weight:bold;
	line-height:40px;
	position:relative;
	width:160px;
	color:#fff;
	text-decoration:none;
	transition:all 200ms ease;
	display:inline-block;
	background:url(../img/head_bg.png) repeat-x 0px -40px;
}
#Revolution header .navi li:nth-of-type(1) a,
#Truth header .navi li:nth-of-type(2) a,
#Philosophy header .navi li:nth-of-type(3) a,
#Human header .navi li:nth-of-type(4) a,
#Universe header .navi li:nth-of-type(5) a,
#Recruiting header .navi li:nth-of-type(6) a,
header .navi li a:hover{
	background-position:0px 0px;
}
header .navi li::after{
	content:"|";
	position:absolute;
	right:-3px;
	top:0px;
	line-height:40px;
}
header .navi li:last-child::after{
	content:none;
}

header .entry{
	font-size:0px;
	text-align:right;
	margin:0px 110px 0px 0px;
	padding:10px 0px;
	height:20px;
}
header .entry li{
	font-size:13px;
	display:inline-block;
	line-height:20px;
}
header .entry li a{
	font-weight:bold;
	color:#000;
	text-decoration:none;
	transition:all 300ms ease;
	padding:0px 1em;
	display:inline-block;
}
header .entry li a:hover{
	color:#fff;
}
header .entry li::after{
	content:"｜";
}
header .sns{
	text-align:center;
	font-size:0px;
	position:absolute;
	right:20px;
	top:10px;
	height:20px;
}
header .sns li{
	display:inline-block;
	margin:0px 0px 0px 10px;
	position:relative;
}
header .sns li::after{
	content:none;
}
header .sns li a{
	border:none;
	width:20px;
	height:20px;
	overflow:hidden;
	display:inline-block;
	text-indent:-1000px;
	text-decoration:none;
}

header .sns li a::after{
	font-family: 'icomoon' !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-indent:0px;
	font-size:23px;
	color:#000;
	position:absolute;
	top:0px;
	line-height:20px;
	width:20px;
	left:0px;
	display:block;
	transition:all 200ms ease;
}
header .sns li a:hover::after{
	color:#fff;
}
header .sns li.fb a::after{
	content: "\e906";
}
header .sns li.tw a::after{
	content: "\e904";
}
header .sns li.gp a::after{
	content: "\e905";
}

#contents {
	position:relative;
	z-index:100;
	min-width:980px;
	display:block;
	z-index:10;
}
#ttl{
	text-align:center;
	height:600px;
	box-sizing:border-box;
	color:#FF0000;
	padding:0px 0px 0px;
	font-size:42px;
	line-height:1.4em;
	letter-spacing:18px;
	margin:0px;
	z-index:11;
	font-weight:normal;
	position:relative;
	font-family: 'Audiowide', cursive;
}

.effect span{
	opacity:0;
	-webkit-transition:all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	transition:all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	-webkit-transform:scale(1.6,1.6);
	transform:scale(1.6,1.6);
	display:inline-block;
}
.effect span.on{
	-webkit-transform:scale(1,1);
	transform:scale(1,1);
	opacity:1;
}




/*-- #system --*/
/*-- ------------------------------------------------- --*/
#system{
	height:700px;
	display:block;
	overflow:hidden;
	z-index:20;
	position:relative;
}

#system small{
	position:absolute;
	bottom:20px;
	text-align:center;
	width:100%;
	z-index:10;
	font-size:13px;
	color:white;
	display:block;
	line-height:1.2em;
	font-family:Helvetica, Arial, sans-serif;
}

#system h2{
	position:absolute;
	top:50%;
	width:100%;
	left:0px;
	z-index:100;
	font-size:30px;
	line-height:36px;
	color:white;
	text-align:center;
	margin:-220px 0px 0px 0px;
	font-weight:normal;
	padding:10px 0px;
	overflow:hidden;
	height:36px;
	display:none;
	font-family: 'Audiowide', cursive;
}
#system > p{
	position:absolute;
	top:50%;
	width:100%;
	left:0px;
	z-index:100;
	font-size:15px;
	height:20px;
	padding:10px 0px;
	overflow:hidden;
	line-height:20px;
	color:white;
	text-align:center;
	margin:-180px 0px 0px 0px;
	font-weight:normal;
	display:none;
}
#system.on > p,
#system.on h2{
}
#system .top{
	position:absolute;
	bottom:100%;
	left:50%;
	-webkit-transition:all 750ms 200ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	transition:all 750ms 200ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	margin:0px 0px 100px -600px;
	z-index:20;
	width:1200px;
}
#system .left{
	position:absolute;
	bottom:42%;
	left:0%;
	z-index:30;
	-webkit-transition:all 750ms 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	transition:all 750ms 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	margin:0px 0px 0px -1000px;
}
#system .right{
	position:absolute;
	z-index:30;
	bottom:42%;
	right:0%;
	-webkit-transition:all 750ms 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	transition:all 750ms 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
	margin:0px -1000px 0px 0px;
}
#system .bg{
	background:url(../../images/system_bottom.png) repeat-x left top;
	position:absolute;
	width:100%;
	height:300px;
	bottom:-300px;
	-webkit-transition:bottom 1000ms  cubic-bezier(0.165, 0.840, 0.440, 1.000);
	transition:bottom 1000ms  cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

#system .dish{
	position:absolute;
	top:700px;
	left:0;
	right:0px;
	width:800px;
	cursor:pointer;
	margin:0px auto 0px ;
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	-webkit-transition:all 500ms 0ms cubic-bezier(0.215, 0.610, 0.355, 1.000),margin 500ms 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000),opacity 500ms 0ms cubic-bezier(0.550, 0.055, 0.675, 0.190);
	transition:all 500ms 0ms cubic-bezier(0.215, 0.610, 0.355, 1.000),margin 500ms 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000),opacity 500ms 0ms cubic-bezier(0.550, 0.055, 0.675, 0.190);
	z-index:10;
}
#system.on .dish{
	margin-top:-180px;
}
#system.on .dish.on{
	width:300px;
	margin-top:-180px;
	-webkit-transform:translateY(-200px);
	transform:translateY(-200px);
	opacity:0;
}

/*
#system .dish.off{
	transform:scale(0.7,0.7);
	top:80%;
	z-index:1;
}
*/
#system.on .top{
	bottom:42%;
}
#system.on .left{
	left:50%;
}
#system.on .right{
	right:50%;
}
#system.on .bg{
	bottom:0px;
}


#system .click{
	position:absolute;
	width:140px;
	top:50%;
	left:50%;
	margin:80px 0px 0px -70px;
	height:60px;
	z-index:10;
	opacity:0;
	-webkit-transition:all 500ms 1000ms ease;
	transition:all 500ms 1000ms ease;
	background:url(../../images/system_click.png) no-repeat left top;
	background-size:100% auto;
}
#system.on .click {
	opacity:1;
	margin:90px 0px 0px -60px;
	-webkit-animation: click 2500ms linear 0s infinite normal;
	animation: click 1300ms linear 0s infinite normal;
}
@-webkit-keyframes click {
	0% {margin-top:90px; -webkit-animation-timing-function: ease-in;}
	20% {margin-top:100px; -webkit-animation-timing-function: ease-out;}
	40% {margin-top:90px; -webkit-animation-timing-function: ease-in;}
}
@keyframes click {
	0% {margin-top:90px; animation-timing-function: ease-in;}
	20% {margin-top:100px; animation-timing-function: ease-out;}
	40% {margin-top:90px; animation-timing-function: ease-in;}
}

#system.on .dish.on + .click{
}
#system.on .click.off{
	-webkit-transition:all 300ms 0ms ease;
	transition:all 300ms 0ms ease;
	opacity:0;
}


#system .overflow,
#system .count{
	display:none;
	background:rgba(0,0,0,0.6);
	position:absolute;
	left:0px;
	top:0px;
	color:white;
	font-size:600px;
	text-align:center;
	line-height:100%;
	width:100%;
	font-family: 'Audiowide', cursive;
	height:100%;
	z-index:2000;
}
#system .count{
	background:none;
}

#system .pon{
	position:absolute;
	width:312px;
	height:313px;
	margin:-156px 0px 0px -156px;
	top:-50%;
	/*
	transition:top 500ms 0ms cubic-bezier(0.175, 0.885, 0.180, 1.230);
	*/
	left:50%;
	z-index:2010;
}
/*
#system .pon.on{
	top:50%;
}
*/
#system .pon img{
	position:absolute;
	left:0px;
	width:312px;
	/*
	transition:top 500ms 0ms cubic-bezier(0.175, 0.885, 0.180, 1.230);
	*/
}
#system .pon img.pontop{
	bottom:140px;
	transition:bottom 400ms 0ms cubic-bezier(0.600, -0.500, 0.735, 0.045),left 400ms 0ms linear,transform 400ms 0ms linear;
}
#system .pon img.ponbottom{
	transition:bottom 200ms 0ms cubic-bezier(0.550, 0.055, 0.675, 0.190),left 200ms 0ms linear,transform 200ms 0ms linear;
	bottom:0px;
}

#system .ponText{
	position:absolute;
	width:100%;
	height:600px;
	margin:0px 0px 0px 0px;
	top:0%;
	transition:transform 300ms 100ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
	left:0%;
	opacity:0;
	z-index:2015;
	-webkit-transform:scale(0.01,0.01);
	transform:scale(0.01,0.01);
}
/*
#system .ponText img{
	position:absolute;
	left:0px;
	top:0px;
	z-index:1;
	width:320px;
	-webkit-animation: ponText 2500ms linear 0s infinite normal;
	animation: ponText 2500ms linear 0s infinite normal;
}
@-webkit-keyframes ponText {
	0% {-webkit-transform:rotate(0deg);}
	100% {-webkit-transform:rotate(45deg);}
}
@keyframes ponText {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(45deg);}
}
#system .ponText p{
	position:relative;
	z-index:10;
	display:table-cell;
	vertical-align:middle;
	text-align:left;
	height:320px;
	width:320px;
	color:white;
	padding:0px 0px;
	font-size:18px;
	line-height:1.4em;
	font-weight:bold;
}
#system .ponText p span,
#system .ponText p a{
	display:block;
	color:white;
	text-decoration:none;
	background:url(../../images/pon_arrow.png) no-repeat 50% 100%;
	background-size:20px 40px;
	-webkit-transition:background 300ms ease;
	transition:background 300ms ease;
	padding:20px 40px 65px;
}
#system .ponText p span{
	background:none;
}
#system .ponText p a:hover{
	background-position:53% 100%;
}
*/
#system .ponText.on{
	opacity:1;
	-webkit-transform:scale(1,1);
	transform:scale(1,1);
}

#system .ponText #pon01{
	width:800px;
	background:url(../img/pon01_bg.png) no-repeat center top;
	background-size:100% auto;
	padding:200px 0px 0px;
	margin:0px auto;
}
#system .ponText #pon01 a{
	display:block;
	text-align:center;
	width:280px;
	margin:0px auto;
	position:relative;
	-webkit-transition:all 300ms ease;
	transition:all 300ms ease;
}
#system .ponText #pon01 a img{
	width:100%;
}

#system .ponText #pon01 a:hover{
	-webkit-transform:scale(1.05,1.05);
	transform:scale(1.05,1.05);
}
#system .ponText #pon01 a:first-of-type::before{
	position:absolute;
	left:-90px;
	top:-100px;
	content:"";
	width:200px;
	height:200px;
	background:url(../img/pon01_03.png) no-repeat left top;
	background-size:100% auto;
}

#system .ponText #pon01 a:first-of-type{
	width:400px;
	margin:0px auto 60px;
}

#system .ponText #pon01 p{
	font-size:21px;
	text-align:center;
	line-height:1.5em;
	text-shadow:0px 0px 4px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 4px rgba(0,0,0,1);
	color:white;
	margin:40px 0px 0px;
}

#system .ponText #pon02{
	width:1000px;
	position:absolute;
	left:50%;
	top:20px;
	height:530px;
	margin:0px 0px 0px -500px;
	background:url(../img/pon02_bg.png) no-repeat center top;
	background-size:100% auto;
	padding:120px 0px 0px;
}
#system .ponText #pon02 dl{
	width:370px;
	margin:0px auto;
	background:url(../img/pon02_01.jpg) no-repeat left top;
	background-size:auto 100%;
	height:345px;
	padding:15px 0px 0px 280px;
	color:white;
}
#system .ponText #pon02 dl dt{
	font-weight:normal;
	font-size:21px;
	text-align:left;
	line-height:1.5em;
	text-shadow:0px 0px 4px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 4px rgba(0,0,0,1);
	margin:0px 0px 0.8em;
}
#system .ponText #pon02 dl dd{
	text-align:left;
	font-size:15px;
	text-shadow:0px 0px 4px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 4px rgba(0,0,0,1);
	line-height:1.5em;
}

#system .ponText #pon03{
	width:960px;
	position:absolute;
	left:50%;
	top:20px;
	height:490px;
	margin:0px 0px 0px -480px;
	background:url(../img/pon03_bg.png) no-repeat center top;
	background-size:100% auto;
	padding:40px 0px 0px;
}
#system .ponText #pon03 dl{
	width:640px;
	margin:0px auto;
	color:white;
}
#system .ponText #pon03 dl dt{
	font-weight:bold;
	font-size:30px;
	text-align:center;
	line-height:1.5em;
	text-shadow:3px 3px 4px rgba(0,0,0,6);
	margin:0px 0px 10px;
}
#system .ponText #pon03 dl dd iframe{
	width:100%;
}
#system .ponText #pon03 dl dd p{
	text-align:center;
	font-size:21px;
	margin:25px 0px 0px;
	text-shadow:0px 0px 4px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 8px rgba(0,0,0,1),0px 0px 4px rgba(0,0,0,1);
	line-height:1.5em;
}
@media screen and (max-width: 750px){
	body{
		min-width:320px;
	}
	
	#bg3d{
		background:url(../../images/smp_bg.jpg) no-repeat left top;
		background-size:cover;
	}
	.pcBr{
		display:none;
	}
	.smpBr{
		display:block;
	}
	
	header{
		bottom:auto !important;
		top:0px;
		background:rgba(255,255,255,0.4);
		transition:top 300ms ease;
		height:60px;
		min-width:320px;
		transition:bottom 300ms ease;
	}
	header.on{
		top:0px;
		bottom:auto;
	}
	header.set{
		bottom:auto;
	}
		
		
		
	header div,
	header h1{
		float:none;
		padding:7px 0px 1px;
		height:20px;
		text-align:center;
	}
	header div img,
	header h1 img{
		height:20px;
	}
	header nav{
		width:20px;
		height:20px;
		font-size:0px;
		line-height:1px;
		top:7px;
		left:10px;
		margin:0px 0px 0px 0px;
		z-index:1000;
		display:block;
	}
	header nav::after,
	header nav::before{
		width:20px;
		line-height:1px;
		font-size:0px;
		left:0px;
	}
	header nav::after{
		border-top:2px solid #000;
		border-bottom:2px solid #000;
		height:12px;
		top:2px;
		background:transparent;
	}
	header nav::before{
		height:2px;
		background:#000;
		bottom:9px;
	}
	header.set nav::after{
		transform:rotate(-45deg);
		border-top:2px solid #000;
		border-bottom:2px solid transparent;
		top:7px;
		left:5px;
	}
	header.set nav::before{
		bottom:9px;
		transform:rotate(45deg);
	}
	
	
	header .navi{
		font-size:0px;
		text-align:center;
		margin:0px 0px 0px 0px;
		padding:50px 0px 20px;
		background:white;
		width:100%;
		position:absolute;
		z-index:10;
		top:0px;
		top:-290px;
		transition:top 300ms ease;
	}
	header.set .navi{
		top:0px;
	}
	header .navi li{
		font-size:14px;
		display:block;
		text-align:left;
		position:relative;
		line-height:30px;
		color:#000;
		width:auto;
		margin:0px 10px 5px 10px;
	}
	header .navi li a{
		line-height:30px;
		width:auto;
		color:#000;
		transition:all 200ms ease;
		display:block;
		background:none;
	}
	header .navi li a:hover{
		background-position:0px 0px;
	}
	header .navi li::after{
		content:none;
	}
	
	
	
	header .entry{
		text-align:center;
		margin:0px 0px 0px 0px;
		padding:5px 0px ;
		height:20px;
	}
	header .entry li{
		font-size:12px;
	}
	header .entry li a{
	}
	header .entry li a:hover{
		color:#000;
	}
	header .entry li::after{
		content:"｜";
	}
	header .entry li:last-child::after{
		content:none;
	}
	header .sns{
		right:10px;
		top:10px;
		height:20px;
	}
	header .sns li{
		margin:0px 0px 0px 7px;
	}
	header .sns li a{
		width:15px;
		height:15px;
	}
	
	header .sns li a::after{
		font-size:18px;
		line-height:15px;
		width:15px;
	}
	header .sns li a:hover::after{
		color:#000;
	}
		
		
		
		
	#contents {
		min-width:320px;
	}
	#ttl{
		padding:0px 0px 0px;
		font-size:24px;
		letter-spacing:8px;
	}
	/*
	.effect span{
		opacity:0;
		-webkit-transition:all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
		transition:all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
		-webkit-transform:scale(1.6,1.6);
		transform:scale(1.6,1.6);
		display:inline-block;
	}
	.effect span.on{
		-webkit-transform:scale(1,1);
		transform:scale(1,1);
		opacity:1;
	}
	*/
	
	
	
	
	/*-- #system --*/
	/*-- ------------------------------------------------- --*/
	#system{
		height:350px;
	}
	
	#system small{
		bottom:10px;
		font-size:7px;
		line-height:1.2em;
	}
	#system h2{
		font-size:14px;
		line-height:18px;
		margin:-110px 0px 0px 0px;
		padding:5px 0px;
		height:18px;
	}
	#system > p{
		font-size:11px;
		padding:5px 0px;
		margin:-90px 0px 0px 0px;
	}
	#system.on > p,
	#system.on h2{
	}
	#system .top{
		margin:0px 0px 50px -300px;
		width:600px;
	}
	#system .left{
		width:400px;
		margin:0px 0px 0px -500px;
	}
	#system .right{
		width:400px;
		margin:0px -500px 0px 0px;
	}
	#system .bg{
		background-size:100% 100%;
		height:150px;
		bottom:-150px;
	}
	

	#system .dish{
		top:380px;
		width:300px;
	}
	#system.on .dish{
		margin-top:-90px;
	}
	#system.on .dish.on{
		width:100px;
		margin-top:-90px;
		-webkit-transform:translateY(-130px);
		transform:translateY(-130px);
	}
	
	#system.on .top{
		bottom:42%;
	}
	#system.on .left{
		left:50%;
	}
	#system.on .right{
		right:50%;
	}
	#system.on .bg{
		bottom:0px;
	}
	
	
#system .click{
	width:70px;
	top:150px;
	height:30px;
	margin:80px 0px 0px -35px;
	background:none;
	background:url(../../images/system_swipe.png) no-repeat left top;
	background-size:100% auto;
}
#system.on .click {
	margin:90px 0px 0px -35px;
}


	
	#system .overflow,
	#system .count{
		font-size:195px;
		line-height:350px;
	}
	


	#system .pon{
		width:156px;
		height:156px;
		margin:-78px 0px 0px -78px;
	}
	#system .pon img{
		width:156px;
	}
	#system .pon img.pontop{
		bottom:70px;
	}
	#system .pon img.ponbottom{
		bottom:0px;
	}
	#system .ponText{
		width:100%;
		height:300px;
		margin:0px 0px 0px 0px;
	}
	/*
	#system .ponText img{
		width:100%;
	}
	@-webkit-keyframes ponText {
		0% {-webkit-transform:rotate(0deg);}
		100% {-webkit-transform:rotate(45deg);}
	}
	@keyframes ponText {
		0% {transform:rotate(0deg);}
		100% {transform:rotate(45deg);}
	}
	#system .ponText p{
		height:150px;
		font-size:12px;
		line-height:1.4em;
	}
	#system .ponText p span,
	#system .ponText p a{
		background-size:15px 20px;
		padding:10px 20px 30px;
	}

	*/
	
	#system .ponText #pon01{
		width:100%;
		background-size:100% auto;
		padding:100px 0px 0px;
	}
	#system .ponText #pon01 a{
		width:140px;
	}
	#system .ponText #pon01 a:hover{
	}
	#system .ponText #pon01 a:first-of-type::before{
		position:absolute;
		left:-45px;
		top:-55px;
		content:"";
		width:100px;
		height:100px;
		background-size:100% auto;
	}
	
	#system .ponText #pon01 a:first-of-type{
		width:200px;
		margin:0px auto 30px;
	}
	
	#system .ponText #pon01 p{
		font-size:12px;
		line-height:1.5em;
		margin:20px 0px 0px;
	}
	

	#system .ponText #pon02{
		width:100%;
		left:0%;
		top:10px;
		height:530px;
		margin:0px 0px 0px 0px;
		padding:30px 0px 0px;
	}
	#system .ponText #pon02 dl{
		width:190px;
		margin:0px auto;
		background-size:80px auto;
		height:345px;
		padding:0px 0px 0px 90px;
		color:white;
	}
	#system .ponText #pon02 dl dt{
		font-size:13px;
		margin:0px 0px 0.8em;
	}
	#system .ponText #pon02 dl dd{
		font-size:11px;
	}


	#system .ponText #pon03{
		width:100%;
		left:0%;
		top:10px;
		height:490px;
		margin:0px 0px 0px 0px;
		padding:20px 0px 0px;
	}
	#system .ponText #pon03 dl{
		width:300px;
	}
	#system .ponText #pon03 dl dt{
		font-size:15px;
		line-height:1.5em;
		text-shadow:3px 3px 4px rgba(0,0,0,6);
		margin:0px 0px 5px;
	}
	#system .ponText #pon03 dl dd iframe{
		width:100% !important;
		height:168px !important;
	}
	#system .ponText #pon03 dl dd p{
		font-size:11px;
		margin:15px 0px 0px;
	}


}