@charset "utf-8";

body {
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
}

section {
	padding: 0;
	margin: 0;
	position: relative;
}

.header {
	width: 100%;
	position: relative;
	z-index: 350;
	padding: 0;
}

.header_inner {
	background: url(../img/about/ribon.webp) 50% 6px repeat-x, url(../img/about/three_line.webp) 0 6px repeat-x;
	padding: 90px 0 0 0;
}

.header_top {
	margin: 0 0 0 0;
	height: 0;
	opacity: 0;
}

@-webkit-keyframes growIn {
	0% {
		-webkit-transform: scale(0.2);
		opacity: 0;
	}

	50% {
		-webkit-transform: scale(1.2);

	}

	100% {
		-webkit-transform: scale(1);
		opacity: 1;
	}
}

@keyframes growIn {
	0% {
		transform: scale(0.2);
		opacity: 0;
	}

	50% {
		transform: scale(1.2);

	}

	100% {
		transform: scale(1);
		opacity: 1;
	}
}

.growIn {
	-webkit-transform: scale(0.2);
	transform: scale(0.2);
	opacity: 0;
}

.growIn.go {
	-webkit-animation-name: growIn;
	animation-name: growIn;
	opacity: 1;
}

#wrap {
	margin: 0;
}

.wrap {
	width: 100%;
	margin: 0 auto !important;
	padding: 0 0 0 0;
	position: relative;
	/* z-index: 100; */
}

#top_content {
	width: 100%;
	padding: 0 0 70px 0;
}

.main_img_top {
	text-align: center;
}

p.top_txt01 {
	font-size: 15px;
	color: #666666;
	text-align: center;
	padding: 15px 0 15px 0;
	line-height: 1.8em;
	font-weight: bold;
}

#scroll {
	text-align: center;
	position: absolute;
	/*z-index: 255;*/
	left: 50%;
	bottom: -25px;
	margin: 0 0 0 -192px;
}

.hand {
	text-align: center;
	position: relative;
	z-index: 300;
}


.hand_area {
	max-width: 1160px;
	width: 100%;
	margin: 0 auto;
	position: relative;

}


.fukidashi01 {
	position: absolute;
	top: 105px;
	left: 0px;
	z-index: 301;
}

.fukidashi02 {
	position: absolute;
	top: 445px;
	left: 0px;
	z-index: 301;
}

.fukidashi03 {
	position: absolute;
	top: 300px;
	right: 0px;
	z-index: 301;
}


figure#start_img {
	position: fixed;
	top: 50px;
	left: 50%;
	margin-left: -275px;
	z-index: 201;
}


#toxin {
	width: 200px;
	height: 46px;
	background: url(/web/20160613043011/http://www.dangersoffracking.com/Fracking/toxin.png);
	position: absolute;
	top: 7500px;
	z-index: 202;
	left: 50%;
	margin-left: -18px;
}


/* 1. top_box01 */

section#top_box {
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	width: 100%;
	padding: 0 0 0 0;
	position: relative;
	z-index: 300;
	padding: 0 0 130px 0;
}

section#top_box01 {
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	height: 1600px;
	width: 100%;
	padding: 0 0 0 0;
	position: relative;
	/* z-index: 200; */
}

/* 2. top_box02 */

section#top_box02 {
	position: relative;
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	height: 1500px;
	width: 100%;
	padding-top: 80px;
}

/*#ink_img {
position: absolute;
top:0;
left: 50%;
margin: -30px 0 0 -483px;
z-index:201;
}*/

.ink_img {
	text-align: center;
	position: relative;
	z-index: 201;
}


#main_cara {
	position: fixed;
	top: 50px;
	z-index: 101;
	width: 540px;
	height: 750px;
	left: 50%;
	margin-left: -270px;
}



/* 3. Fracking Site */

section#top_box03 {
	position: relative;
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	width: 100%;
}


.print_time {
	position: absolute;
	top: 248px;
	right: 60px;
	z-index: 200;
}

.print_tyu {
	position: absolute;
	top: 280px;
	right: -190px;
	z-index: 200;
	width: 180px;
}


.cut_tyu {
	position: absolute;
	top: 170px;
	right: -20px;
	z-index: 200;
	width: 180px;
}


#site {
	position: absolute;
	top: 0px;
	z-index: 200;
	left: 50%;
	margin-left: -470px;
	padding-top: 20px;
}


#print {
	position: absolute;
	top: 200px;
	z-index: 200;
	left: 50%;
	margin-left: -500px;
	padding-top: 20px;
}

#print01 {
	position: absolute;
	top: 720px;
	z-index: 101;
	left: 50%;
	margin-left: -500px;
	padding-top: 20px;
}

#after_print {
	position: fixed;
	top: 50px;
	z-index: 151;
	width: 524px;
	height: 750px;
	left: 50%;
	margin-left: -271px;
}

#before_print {
	position: fixed;
	top: 50px;
	z-index: 151;
	width: 540px;
	height: 750px;
	left: 50%;
	margin-left: -270px;
}



section#top_box04 {
	position: relative;
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	height: 1850px;
	width: 100%;
}

section#cutting {
	position: relative;
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	height: 1110px;
	width: 100%;
}

#cutting_img {
	position: fixed;
	top: 50px;
	z-index: 101;
	width: 540px;
	height: 750px;
	left: 50%;
	margin-left: -270px;
}

#cutting_01 {
	position: absolute;
	top: 200px;
	z-index: 101;
	left: 50%;
	margin-left: -350px;
	padding-top: 20px;
}

#cutting_02 {
	position: absolute;
	top: 202px;
	z-index: 251;
	left: 50%;
	margin-left: -350px;
	padding-top: 20px;
}

#cutting_03 {
	position: absolute;
	top: 380px;
	z-index: 101;
	left: 50%;
	margin-left: -380px;
	padding-top: 20px;
}


section#top_box05 {
	position: relative;
	background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);
	height: 1750px;
	width: 100%;
}

#kanagu_img {
	position: fixed;
	top: 50px;
	/* z-index: 101; */
	width: 619px;
	height: 825px;
	left: 50%;
	margin-left: -310px;
}

#kanagu {
	max-width: 1000px;
	width: 100%;
	margin: 0 auto 0;
	position: relative;
	z-index: 151;
}

section#top_box06 {
	position: relative;
	background: url(../img/about/bg.webp);
	width: 100%;
	/* z-index: 201; */
	padding: 0 0 0 0;
}


.after_finished {
	text-align: center;
}


.finished {
	max-width: 720px;
	width: 100%;
	height: 160px;
	margin: 0 auto;
	position: relative;
	z-index: 251;
	padding: 50px 0 0 0;
}


/* btn_area */

.btn_area {
	max-width: 1175px;
	height: 700px;
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 251;
}

.btn_area .btn01 {
	position: absolute;
	top: 105px;
	right: 85px;
}


.btn_area .btn02 {
	position: absolute;
	top: 330px;
	right: 39px;
}

.btn_area .btn03 {
	position: absolute;
	bottom: 25px;
	right: 39px;
}

.btn_area .btn04 {
	position: absolute;
	bottom: 85px;
	left: 0;
}

.btn_area .btn05 {
	position: absolute;
	top: 185px;
	left: 45px;
}

/* Top Footer */

.ichiran_btn {
	text-align: center;
	margin: 25px 0 45px 0;
}


.footer_btns {
	position: relative;
	overflow: hidden;
	margin: auto;
	text-align: center;

}


.footer_btns>div {
	position: relative;
	text-align: center;
	display: inline-block;
	vertical-align: top;
	width: auto;
	margin: auto 15px 2px 0px;
}

/* Profile_area */

.top_profile {
	max-width: 1020px;
	width: 100%;
	margin: 0 auto;
	padding: 2200px 0 0 0;
	position: relative;
	z-index: 300;
}

.top_profile_inner {
	/*background: url(../img/about/foreground.webp) repeat 5% 5%, url(../img/about/bg.webp);*/
	padding: 0 0 50px 0;
}


.top_profile ul.profile_list {
	position: relative;
	overflow: hidden;
	margin: 50px auto;
	text-align: center;
}


.top_profile ul.profile_list li {
	position: relative;
	text-align: center;
	display: inline-block;
	vertical-align: top;
	width: auto;
	margin: auto 5px 10px 0px;
}

.top_profile ul.profile_list li:last-child {
	margin: auto 0 10px 0px;
}


/*charactor_area */

.top_car {
	max-width: 1050px;
	width: 100%;
	margin: 0 auto;
	padding: 960px 0 0 0;
	position: relative;
	z-index: 300;

}

.top_car_inner {
	padding: 0 0 50px 0;
}


.top_car ul.car_list {
	position: relative;
	width: 100%;
	height: 800px;
}


.top_car ul.car_list li.char01 {
	position: absolute;
	right: 0;
	top: -50px;
}

.top_car ul.car_list li.char02 {
	position: absolute;
	right: 0;
	top: 175px;
}

.top_car ul.car_list li.char03 {
	position: absolute;
	left: 89px;
	top: 245px;
}

.top_car ul.car_list li.char04 {
	position: absolute;
	left: 55px;
	top: -20px;
}

.top_car ul.car_list li.char05 {
	position: absolute;
	left: 50%;
	bottom: 200px;
	margin-left: -126px;
}


.top_car ul.car_list li.char05 a:hover img {
	opacity: 0.95;
}


/*finished_char */

.finished_char {
	max-width: 1050px;
	width: 100%;
	margin: 0 auto;
	padding: 120px 0 0 0;
	position: relative;
	z-index: 300;

}

.finished_char_inner {
	padding: 0 0 50px 0;
}


.finished_char ul.finished_char_list {
	position: relative;
	width: 100%;
	height: 800px;
}


.finished_char ul.finished_char_list li.finished_char01 {
	position: absolute;
	right: 0px;
	top: -64px;
}

.finished_char ul.finished_char_list li.finished_char02 {
	position: absolute;
	left: 0;
	top: 410px;
}

.finished_char ul.finished_char_list li.finished_char03 {
	position: absolute;
	right: 0;
	top: 355px;
}

.finished_char ul.finished_char_list li.finished_char04 {
	position: absolute;
	left: 150;
	top: 125px;
}

.finished_char ul.finished_char_list li.finished_char05 {
	position: absolute;
	left: 50%;
	bottom: 50px;
	margin-left: -126px;
}


.finished_char .dekiagari {
	position: absolute;
	left: 0;
	top: 0;
}

.finished_char ul.finished_char_list li.finished_char05 a:hover img {
	opacity: 0.95;
}






/*画面サイズが1000px以下に適用*/
@media screen and (max-width : 1000px) {

	section#top_box {
		padding: 0 0 30px 0;
	}

	#parallox_box,
	#scroll {
		display: none;
	}
}