@charset "UTF-8";
/* CSS Document */
@font-face {
  font-family: "はれのそら";
  src: url("../fonts/Harenosora_web.eot?") format('eot'),
       url("../fonts/Harenosora_web.woff") format('woff');
}
html {
	height: 100%;
}
body {
	background-color: transparent;
}
@media screen and (max-width: 740px) {
	body {
		font-size: 92%;
	}
}
.container {
	position:relative;
	padding: 0;
	display: block;
	background-image: url(../img/wall.png);
	background-size: 50%;
	width: 100%;
}
.container.first {
	height: 95%;
}
.container.second {
	background: none;
}
section,
footer {
	max-width: 1080px;
	width: 100%;	
	margin: 0 auto;
	padding: 0 1.5rem;
}

section#concept {
	background: #fff;
	position: relative;
	display: block;
	padding: 1em 0 11em;
	z-index: 500;
	height: 100%;
}
#desc {
	position: absolute;
	right: 2em;
}
section#concept h1 {
	text-align: center;
	margin-top: 2em;
}
section#concept h1 img {
	max-width: 480px;
}
section#concept p {
	text-align: center;
	font-family: "はれのそら";
	letter-spacing :.25em;
	line-height: 1.85em;
	font-size: 1.25em;
	margin-top: 5em;
}
@media screen and (max-width: 740px) {
	section#concept h1 img {
		max-width: 320px;
	}
}

@media screen and (max-width: 480px) {
	section#concept h1 {
		margin-top: 1em;
	}
	section#concept h1 img {
		max-width: 280px;
	}
	section#concept p {
		margin-top: 3em;
	}
	section#concept {
		padding-bottom: 9em;
	}
}
@media screen and (max-width: 570px) {
	.tb {
		display: inline-block;
	}
}
@media all and (max-height: 600px) and (orientation:landscape) {
	section#concept h1,
	section#concept p {
		margin: .5em;
	}
}
@media all and (max-height: 350px) and (orientation:landscape) {
	section#concept h1 img {
		max-width: 280px;
	}
	section#concept h1 {
		margin: 0;
	}
	section#concept p {
		margin: 0;
	}
}
@media only screen and (max-height: 1280px) and (orientation: portrait) {
	section#concept h1 {
		margin-top: 5em;
	}
	section#concept p {
		margin-top: 7em;
	}
}
@media only screen and (max-height: 768px) and (orientation: portrait) {
	section#concept h1 {
		margin-top: 3em;
	}
	section#concept p {
		margin-top: 5em;
	}
}
@media only screen and (max-height: 568px) and (orientation: portrait) {
	section#concept h1 {
		margin-top: 2em;
	}
	section#concept p {
		margin-top: 3em;
	}
}
#sankaku {
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top: 20px solid #fff;
	position: absolute;
	bottom: -40px;
	left: 50%;
	left : calc(50% - 25px) ;
}
section#slide h1 {
	text-align: left;
	margin-top: 3rem;
}
section#slide h1 img {
	max-width: 190px;
	opacity: .98;
}
section#slide h2 {
	font-size: 1.5em	;
	margin: -2.25em 0 0 200px	;
	color: white;
	border-bottom: white 1px solid;
	padding: 0 0 .75em 25px;
	font-family: "はれのそら";
}
@media screen and (max-width: 740px) {
	section#slide h1 {
		text-align: center;
	}	
	section#slide h2 {
		margin: 2em 0 ;
	}
}
section#slide {
    display: block;
    width: 100%;
	height: 100%;
	padding-top: 3em;
	padding-bottom: 12em;
}
section#slide dl {
	position: relative;
	margin: 8rem auto 0;
	background: rgba(255,255,255, .93);
	padding: 2em;
	max-width: 680px;
	font-family: "はれのそら";
}
section#slide dt {
	width: 4em;
	float: left;
}
section#slide dd {
	margin-left: 5em;
}
section#slide dt ,
section#slide dd {
	margin-bottom: 1em;
}
.container.footer {
	z-index: 2000;
}
footer {
	font-size: .9em;
	padding: 2em 0 2.5em;
    text-align: center;
	background: white;
	letter-spacing :.15em;
}