@charset "UTF-8";
/* CSS Document */

body {
	background-image:url(/earthsaverplus/img/bg_01.png);
	background-size:100% auto;
	background-attachment:fixed;
	width:100%;
	color:lightgray;
}
#top_content {
	width:100%;
 background-image: url(/earthsaverplus/img/earthsaverplus_pspbg.png) background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	display:inline-block;
}
#top_side1 {
	width:40%;
	display:inline-block;
	margin:43% auto 7%;
}
#top_side1 img {
	display:inline-block;
	margin:0 auto;
}
#top_side2 {
	padding:1em 0 0;
	max-width:1024px;
 margin:0 auto display:inline-block;
}
#top_side2 img {
	display:inline-block;
	margin:2% 9% 5%;
	width:60%;
}
.side_inner {
	width:90%;
	display:inline-block;
}
.side2_text1 {
	color: #fff;
	display: inline-block;
	font-size: 12px;
	text-align: left;
	margin:0 2%;
}
.gaiyou_tb {
	width: 100%;
	margin: 1em 0 2em;
	font-size:0.6em;
	background:rgba(0,0,0,0.80)
}
.gaiyou_th {
	font-weight:bold;
	font-size:0.7em;
	background:rgba(82,0,140,0.60);/* Purple */
	vertical-align: central;
	margin: 0.6em;
	color:white;
	text-align:center;
}
.gaiyou_td {
	text-align: center;
	color:White;
	padding:0.4em 0.1em;
	background: rgba(255,255,255,0.30);
	vertical-align: central;
	margin: 0.7em;
	font-size: 0.8em;
}
a.hide_desktop {
	display:inline-block;
	text-decoration:none;
	margin:0 0 5%;
	color:#fff;
}
small {
	color:#fff;
}
#Movie {
	background:rgba(0,0,0,0.82);
	max-width:1024px;
	margin:0 auto;
}
#sytem_content {
	background-image:url(/earthsaverplus/img/page_bg.png);
	background-size:cover;
	background-repeat:no-repeat;
	padding: 0 0 3%;
	width:100%;
	display: inline-block;
}
#system_side1 {
	background-image:url(/earthsaverplus/img/system.png);
	background-size:contain;
	background-repeat:no-repeat;
	display:inline-block;
	margin: 0;
	padding: 10% 0 15%;
	width:70%;
}
.system_side1_inner {
	display:block;
	margin: 7% 17% 0;
}
.system_side1_inner img {
	margin: 0;
	padding: 3% 0 0;
}
#system_side2 {
	background-image:url(/earthsaverplus/img/sys_base02.png);
	background-size: contain;
	background-repeat:no-repeat;
	display:inline-block;
	padding:2% 0 1%;
	margin:5% 0 0;
	width: 70%;
}
ul.lightGallery {
	margin:0;
	padding: 28% 0 16%;
	float:none;
	clear:none;
}
ul.lightGallery li {
	list-style:none;
}
ul.lightGallery li img {
	width: 80%;
}
#visual_content {
	width:100%;
	background-image:url(/earthsaverplus/img/page_bg.png);
	background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	display:inline-block;
}
#visual_inner {
	width:100%;
	margin:0 auto 4%;
	display:inline-block;
}
.visual_box1 {
	width:100%;
	background-size:cover;
	margin:0% auto 0;
}
.visual_box1 img, .visual_box2 img, .visual_box3 img, .visual_box4 img {
	margin:2% 0;
	background-size:cover;
}
.explanation {
	background-color:rgba(0,0,0,0.3);
	background-size:cover;
	width: 100%;
}
.explanation img {
	width: 100%;
	display:inline-block;
}
.visual_box2 {
	width:100%;
	display:inline-block;
	margin:0% auto 0;
}
.visual_box3 {
	width:100%;
	display:inline-block;
	margin:3% auto 0;
}
.visual_box4 {
	width:100%;
	display:inline-block;
	margin:3% auto 0;
}
#questionnaire_content {
	width:100%;
	background-image:url(/earthsaverplus/img/page_bg.png);
	background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	display:inline-block;
}
#questionnaire_inner {
	width: 100%;
	background-image:url(/earthsaverplus/img/enquete_win.png);
	background-size:contain;
	background-repeat:no-repeat;
	margin: 0 auto 2%;
	display: inline-block;
}
#questionnaire_btn {
	text-align:center;
	margin:5% auto 0;
	padding: 39% 0 4%;
	width:45%;
}
.button {
	width:80%;
	background: rgba(255,255,255,0.26);
	margin:2em auto;
	padding:1em 0;
	font-weight:bold;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.button a {
	padding:0;
	margin:0;
	display:block;
	text-decoration:none;
	color:lightgray;
}
.button a:hover {
	color:white;
}
@media only screen and (min-width: 769px) {
.gaiyou_th {
	font-size:1.5em;
	font-weight:bold;
}
.gaiyou_td {
	font-size:1.7em;
}
.top a {
	background-position:0px 0px;
}
.top a:hover {
	background-position: 0px 34px;
}
.system a {
	background-position:-192px 0px;
}
.system a:hover {
	background-position: -192px 34px;
}
.visual a {
	background-position:-384px 0px;
}
.visual a:hover {
	background-position:-384px 34px;
}
.enquete a {
	margin:0 1px;
	background-position:-578px 0px;
}
.enquete a:hover {
	background-position:-578px 34px;
}
#top_content {
	width:100%;
	background-image:
url(/earthsaverplus/img/earthsaverplus1_1024.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	display:inline-block;
}
#top_side1 {
	width:36%;
	margin:40% 0 2%;
	display:inline-block;
}
#top_side1 img {
	display:inline-block;
}
#top_side2 {
	background-image:url(/earthsaverplus/img/table_bg1.png);
	width:100%;
	display:inline-block;
}
#top_side2 img {
	display:inline-block;
	width:50%;
}
.side2_text1 {
	color: #fff;
	display: inline-block;
	font-size: 12px;
	margin: 0;
	text-align: center;
	width: 100%;
	float:left;
	clear:both;
}
.side_inner {
	width:45%;
	display:inline-block;
}
ul.lightGallery li img {
	float: left;
	margin: 3% 0;
}
#system_side1 {
	background-image:url(/earthsaverplus/img/system.png);
	background-size:contain;
	background-repeat:no-repeat;
	display:inline-block;
	margin: 0 0 0 9%;
	padding: 4% 0 3%;
	width:100%;
	max-width:394px;
}
.system_side1_inner {
	float:left;
	clear:both;
	display:block;
	margin: 2% 14% 3%;
}
.system_side1_inner img {
	clear: both;
	float: left;
	margin: 2% 0 0;
	padding: 4% 0 0;
	width: 83%;
}
#system_side2 {
	background-image:url(/earthsaverplus/img/sys_base02.png);
	background-size: contain;
	background-repeat:no-repeat;
	display:inline-block;
	padding: 2% 0 0;
	;
	margin: 2% 2% 0 11%;
	width:100%;
	max-width:394px;
}
ul.lightGallery {
	clear: both;
	float: left;
	margin: 0;
	padding: 3% 9%;
}
.visual_box1 {
	width:60%;
	background-size:cover;
	display:inline-block;
	margin:0% 2% 0 3%;
}
.visual_box2 {
	width:60%;
	display:inline-block;
	margin:0% 2% 0 3%;
}
.visual_box3 {
	width:60%;
	display:inline-block;
	margin:3% 2% 0 3%;
}
.visual_box4 {
	width:60%;
	display:inline-block;
	margin:3% 2% 0 3%;
}
#questionnaire_inner {
	width: 81%;
	background-image:url(/earthsaverplus/img/enquete_win.png);
	background-size: contain;
	background-repeat:no-repeat;
	margin: 0 auto 2%;
	display: inline-block;
}
#questionnaire_btn {
	text-align:center;
	margin:5% auto 0;
	padding: 39% 0 4%;
}
}