@charset 'UTF-8';

/* =========================================================
	main
========================================================== */
#main {
	position:relative;
	background:url(../img/main_bg.jpg) top center no-repeat;
	overflow:hidden;
}
#main #wappen {
	max-width:758px;
	margin:0 auto;
}
#main #good {
	position:absolute;
	z-index:10;
}
#main #bird01 {
	position:absolute;
	bottom:10%;
	left:50%;
	margin-left:-480px;
	z-index:10;
}
#main #bird02 {
	position:absolute;
	top:14%;
	right:50%;
	margin-right:-500px;
	z-index:10;
}
@media screen and (max-width:1240px) {
	#main {
	}
	#main #wappen {
		max-width:initial;
		width:60%;
	}
	#main #good {
	}
	#main #bird01 {
		bottom:10%;
		left:0%;
		margin-left:0;
	}
	#main #bird02 {
		top:14%;
		right:0%;
		margin-right:0;
	}
}
@media screen and (max-width:900px) {
	#main #good {
		width:20vw;
	}
	#main #wappen {
		padding:5% 0;
	}
}
@media screen and (max-width:640px) {
	#main {
		box-sizing:border-box;
	}
	#main #bird01,
	#main #bird02 {
		width:20%;
	}
}
@media screen and (max-width:468px) {
}


/* =========================================================
	scene01
========================================================== */
#scene01 {
	padding-top:78px;
	background:url(../img/scene01_bg.jpg) 50% 460px #F6F5EC no-repeat;
	overflow:hidden;
}
#scene01 .en {
	padding-bottom:30px;
}
#scene01 .title {
	padding-bottom:23px;
}
#scene01 .copy {
	padding-bottom:47px;
}
#scene01 .txt {
	font-size:1.5rem;
	line-height:2.4em;
}

#scene01 .right {
	text-align:right;
}
#scene01 ul.lead {
	overflow:hidden;
}
#scene01 ul.lead li {
	float:left;
}

#scene01 #category01_img {
	position:absolute;
	width:648px;
	left:50%;
	margin-left:-780px;
}

#scene01 #concept {
	padding-top:400px;
}
#scene01 #category02 {
	max-width:840px;
	margin-top:44px;
	overflow:hidden;
}
#scene01 #category02 li {
	float:left;
	width:30%;
	margin-right:5%;
}
#scene01 #category02 li:last-of-type {
	margin-right:0;
}
#scene01 #category02 li div {
	margin-bottom:23px;
}
#scene01 #category02 li p {
	text-align:center;
	color:#221814;
	line-height:1.7em;
}

#scene01 #manual {
	position:relative;
	padding-top:290px;
	padding-bottom:50px;
}
#scene01 #manual div.txt {
	position:relative;
	padding-bottom:50px;
}
#scene01 #manual .bird {
	position:absolute;
	bottom:13%;
	left:16%;
	z-index:5;
}

#scene01 #partner {
	position:relative;
	padding-top:450px;
	padding-bottom:113px;
}
#scene01 #partner div.txt {
	position:relative;
}
#scene01 #partner .bird01 {
	position:absolute;
	top:180px;
	left:-80px;
	z-index:5;
}
#scene01 #partner .bird02 {
	position:absolute;
	top:20px;
	right:15%;
	z-index:5;
	transition-delay:0.8s;
}
#scene01 #category04 {
	max-width:1000px;
	margin-top:44px;
	overflow:hidden;
}
#scene01 #category04 li {
	float:left;
	width:30%;
	margin-right:5%;
}
#scene01 #category04 li:last-of-type {
	margin-right:0;
}
#scene01 #category04 li div {
	margin-bottom:23px;
}
#scene01 #category04 li p {
	color:#221814;
	font-size:1.4rem;
	line-height:1.7em;
	letter-spacing:0;
}
#scene01 #category04 li p.midashi {
	color:#00215A;
	font-size:1.55rem;
	font-weight:bold;
	margin-bottom:7px;
}
@media screen and (max-width:1240px) {
	#scene01 {
		padding-left:5%;
		padding-right:5%;
	}
	#scene01 #category01_img {
		width:50%;
		left:0%;
		margin-left:-5%;
	}
	
	#scene01 #concept {
		padding-top:450px;
	}
	#scene01 #manual .bird {
		bottom:33%;
		left:-7%;
	}
	
	#scene01 #partner .bird01 {
		left:-40px;
	}
	#scene01 #partner .bird02 {
		top:20px;
		right:-3%;
	}
}
@media screen and (max-width:900px) {
	#scene01 {
		padding-top:78px;
		background:none;
		background-color:#F6F5EC;
	}
	#scene01 .txt {
		line-height:2em;
	}
	#scene01 .right p {
		text-align:left;
	}

	#scene01 #concept {
		padding-top:100px;
	}
	
	#scene01 #manual {
		padding-top:100px;
	}
	#scene01 #manual .bird {
		bottom:13%;
		left:78%;
	}
	
	#scene01 #partner {
		padding-top:100px;
	}
	#scene01 #partner .bird01 {
		top:-140px;
		width:20%;
	}
	#scene01 #partner .bird02 {
		top:-200px;
		width:30%;
		right:0%;
	}
}
@media screen and (max-width:640px) {
	#scene01 .en {
		padding-bottom:30px;
	}
	#scene01 .title {
		padding-bottom:10px;
	}
	#scene01 .copy {
		padding-bottom:40px;
	}
	#scene01 .txt {
		font-size:2.34vw;
		line-height:1.6em;
	}
	#scene01 #category01_img {
		left:5%;
		bottom:0;
	}
	
	#scene01 #category02 li,
	#scene01 #category02 li:last-of-type {
		float:none;
		width:80%;
		margin-right:0;
		margin:0 auto 30px;
		text-align:center;
	}
	#scene01 #category02 li div {
		margin-bottom:23px;
	}
	#scene01 #category02 li p {
		font-size:2.18vw;
		text-align:left;
	}
	
	#scene01 #partner {
	}
	#scene01 #partner .bird01 {
		top:-70px;
		width:20%;
	}
	#scene01 #partner .bird02 {
		top:-100px;
		width:30%;
		right:0%;
	}
	#scene01 #category04 {
	}
	#scene01 #category04 li,
	#scene01 #category04 li:last-of-type {
		float:none;
		width:80%;
		margin:0 auto 40px;
	}
	#scene01 #category04 li div {
		margin-bottom:12px;
	}
	#scene01 #category04 li p {
		font-size:2.18vw;
	}
	#scene01 #category04 li p.midashi {
		font-size:3.12vw;
	}
}
@media screen and (max-width:468px) {
	#scene01 .txt,
	#scene01 #category02 li p,
	#scene01 #category04 li p {
		font-size:3.2vw;
		line-height:1.5em;
	}
	#scene01 #category02 li,
	#scene01 #category02 li:last-of-type,
	#scene01 #category04 li,
	#scene01 #category04 li:last-of-type {
		width:90%;
	}
	#scene01 #category04 li p.midashi {
		font-size:4vw;
	}
}


#scene02 {
	background:url(../img/scene02_bg.jpg) top center fixed;
	overflow:hidden;
}
#scene02 #results {
	position:relative;
	background:url(../img/scene02_bg_tl.png) 0% top no-repeat,
	url(../img/scene02_bg_bl.png) left bottom no-repeat,
	url(../img/scene02_bg_br.png) right bottom no-repeat;
	padding-bottom:150px;
}
#scene02 #resultWrap {
	max-width:1060px;
	margin:54px auto;
}
#scene02 #title {
	padding-top:120px;
	text-align:center;
}
#scene02 .midashi {
	background:#00215A;
	padding:16px 4%;
	margin-bottom:25px;
	text-align:center;
	font-size:2.3rem;
	font-weight:bold;
	color:#FFF;
}
#scene02 .syunko {
	color:#221814;
	font-size:1.4rem;
	padding-bottom:15px;
}
#scene02 .name {
	color:#00215A;
	padding-bottom:20px;
	font-size:2.2rem;
	font-weight:bold;
}
#scene02 .dtl {
	color:#221814;
	font-size:1.5rem;
	line-height:1.7em;
	letter-spacing:0;
}
#scene02 .finish {
	position:relative;
	color:#00215A;
	text-align:center;
	font-size:4.4rem;
	line-height:1.5em;
	font-weight:bold;
	padding-top:88px;
}
#scene02 .finish div.bird {
	top:-5%;
	right:-5%;
}
#scene02 .finish div.bird,
#scene02 .bird01,
#scene02 .bird02,
#scene02 .donguri {
	position:absolute;
	z-index:5;
}
#scene02 .bird01 {
	top:110px;
	right:50%;
	margin-right:-550px;
	transition:2.7s;
}
#scene02 .bird02 {
	top:38%;
	left:50%;
	margin-left:-740px;
	transition:2.5s;
}
#scene02 .donguri {
	top:47%;
	right:50%;
	margin-right:-740px;
}

#scene02 .col2Wrap {
	width:100%;
	overflow:hidden;
}
#scene02 .col2Wrap li {
	float:left;
	width:47.5%;
	margin-bottom:50px;
}
#scene02 .col2Wrap li:last-of-type {
	float:right;
}
#scene02 .col2Wrap li div {
	margin-bottom:15px;
}
@media screen and (max-width:1240px) {
	#scene02 {
	}
	#scene02 #results {
		background-size:44%, 27%, 27%;
	}
	#scene02 #resultWrap {
		padding:0 5%;
		box-sizing:border-box;
	}
	#scene02 .finish {
		font-size:3.3rem;
	}
	#scene02 .finish div.bird {
		top:-5%;
		right:-5%;
	}
	#scene02 .bird01 {
		top:110px;
		margin-right:0;
		right:5%;
	}
	#scene02 .bird02 {
		display:none;
	}
	#scene02 .donguri {
		display:none;
	}
}
@media screen and (max-width:900px) {
	#scene02 .bird01 {
		top:40px;
		right:0%;
	}
	#scene02 .finish {
		font-size:2.8rem;
	}
	#scene02 .finish div.bird {
		width:20%;
		top:-10%;
		right:0;
	}
}
@media screen and (max-width:640px) {
	#scene02 .syunko {
		font-size:2.1vw;
	}
	#scene02 .name {
		font-size:3.21vw;
	}
	#scene02 .dtl {
		font-size:2.23vw;
	}
	#scene02 .col2Wrap {
	}
	#scene02 .col2Wrap li {
		float:none;
		width:100%;
	}
	#scene02 .col2Wrap li:last-of-type {
		float:none;
	}
	#scene02 .finish {
		font-size:3.8vw;
	}
}
@media screen and (max-width:468px) {
	#scene02 .name {
		font-size:4.7vw;
	}
	#scene02 .syunko,
	#scene02 .dtl {
		font-size:3.2vw;
		line-height:1.5em;
	}
	#scene02 .finish {
		font-size:4.1vw;
	}
}