body{
	color:#fff;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
h1,h2{
	font-weight:normal;
}


#header-wrapper{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:105px;
	background:#fff;
	z-index:10;
}

#header{
	max-width:1240px;
	margin:0 auto;
	padding:31px 20px 0;
}

h1{
	float:left;
}

h1 a{
	display:block;
}

h1 a img{
	display:inline-block;
}

#nav {
	float:right;
	padding:8px 0 0;
}

#nav li{
	display:inline-block;
	padding-left:10px;
}

#nav li a{
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
	display:block;
	height:30px;
	border:1px solid #3dbfb8;
	border-radius:16px;
	background:#3dbfb8;
	padding:0 19px;
	-webkit-transition: all 0.2s ease;
	   -moz-transition: all 0.2s ease;
	    -ms-transition: all 0.2s ease;
	     -o-transition: all 0.2s ease;
	        transition: all 0.5s ease;
}

#nav li a:hover{
	color:#3dbfb8;
	background:#fff;
}

#section-wrapper{
	padding-top:105px;
	height:100%;
}

.sec{
	position:relative;
	width:100%;
}

/*--top--*/
#top{
	height:100%;
	background:#3dbfb8;
}

#top > *{
	position:absolute;
	left:50%;
	top:50%;
}

#top > .desc{
	margin:-262px 0 0 -420px;
	font-size:29px;
	line-height:2.0;
}

#top > .desc{
	-webkit-transition: all 1s ease 1s;
	   -moz-transition: all 1s ease 1s;
	    -ms-transition: all 1s ease 1s;
	     -o-transition: all 1s ease 1s;
	        transition: all 1s ease 2s;
}

#top.st > .desc{
	opacity:0;
	-webkit-transform: translate3D(-40px,0,0);
	   -moz-transform: translate3D(-40px,0,0);
	    -ms-transform: translate3D(-40px,0,0);
	     -o-transform: translate3D(-40px,0,0);
	        transform: translate3D(-40px,0,0);
}

#top > .mrk{
	margin:24px 0 0 -426px;
	display:-webkit-box;
	display:box;
	width:160px;
	height:160px;
}

#top > .mrk{
	-webkit-transition: all 1s ease 1s;
	   -moz-transition: all 1s ease 1s;
	    -ms-transition: all 1s ease 1s;
	     -o-transition: all 1s ease 1s;
	        transition: all 0.5s ease 3.5s;
}

#top.st > .mrk{
	opacity:0;
	-webkit-transform: scale3d(0.5, 0.5, 0);
	   -moz-transform: scale3d(0.5, 0.5, 0);
	    -ms-transform: scale3d(0.5, 0.5, 0);
	     -o-transform: scale3d(0.5, 0.5, 0);
	        transform: scale3d(0.5, 0.5, 0);
}

#top > .btns{
	margin:42px 0 0 -198px;
}

#top > .btns li{
	padding-bottom:18px;
	-webkit-transition: all 1s ease 3s;
	   -moz-transition: all 1s ease 3s;
	    -ms-transition: all 1s ease 3s;
	     -o-transition: all 1s ease 3s;
	        transition: all 1s ease 3.8s;
}

#top > .btns li:last-child{
	-webkit-transition: all 0.5s ease 3.2s;
	   -moz-transition: all 0.5s ease 3.2s;
	    -ms-transition: all 0.5s ease 3.2s;
	     -o-transition: all 0.5s ease 3.2s;
	        transition: all 1s ease 4.1s;
}

#top.st > .btns li{
	opacity:0;
	-webkit-transform: translate3D(-10px,0,0);
	   -moz-transform: translate3D(-10px,0,0);
	    -ms-transform: translate3D(-10px,0,0);
	     -o-transform: translate3D(-10px,0,0);
	        transform: translate3D(-10px,0,0);
}


#top > .btns li a{
	display:block;
	line-height:0;
}

#top > .iphone{
	margin:-320px 0 0 80px;
	width:309px;
	height:638px;
	padding:72px 14px 77px 18px;
	line-height:0;
	background:url(../img/iphone.png) center center no-repeat;
	background-size:100% auto;
}

#top > .iphone{
	-webkit-transition: all 1s ease 0s;
	   -moz-transition: all 1s ease 0s;
	    -ms-transition: all 1s ease 0s;
	     -o-transition: all 1s ease 0s;
	        transition: all 1s ease 0s;
}

#top.st > .iphone{
	margin-top:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,100%,0);
}

#top > .iphone div{
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
}
#top > .iphone div ul{
	position:absolute;
	left:0;
	top:0;
	display:-webkit-box;
	-webkit-box-pack:center;
	-webkit-box-align:center;
	-webkit-transition: all 0.8s ease;
	   -moz-transition: all 0.8s ease;
	    -ms-transition: all 0.8s ease;
	     -o-transition: all 0.8s ease;
	        transition: all 0.8s ease;
}

#top > .iphone div li{
	width:277px;
	height:491px;
	display:-webkit-box;
	-webkit-box-pack:center;
	-webkit-box-align:center;
}

#top > .iphone img{
	display:block;
	width:100%;
	-webkit-transition: all 0.4s ease 1s;
	   -moz-transition: all 0.4s ease 1s;
	    -ms-transition: all 0.4s ease 1s;
	     -o-transition: all 0.4s ease 1s;
	        transition: all 0.4s ease 1s;
}


#top.st > .iphone img{
	width:30%;
	opacity:0;
}


#top > .presentedby{
	margin:336px 0 0 141px;
}
#top > .presentedby{
	-webkit-transition: all 0.5s ease 1.2s;
	   -moz-transition: all 0.5s ease 1.2s;
	    -ms-transition: all 0.5s ease 1.2s;
	     -o-transition: all 0.5s ease 1.2s;
	        transition: all 0.5s ease 1.5s;
}

#top.st > .presentedby{
	opacity:0;
	-webkit-transform: translate3D(0,-20px,0);
	   -moz-transform: translate3D(0,-20px,0);
	    -ms-transform: translate3D(0,-20px,0);
	     -o-transform: translate3D(0,-20px,0);
	        transform: translate3D(0,8-20px,0);
}

/*menu*/
#menu{
	line-height:0;
	text-align:center;
	background:#9ee3df;
	padding:106px 0 97px;
}

#menu li{
	display:inline-block;
	padding:0 76px;
}

#menu li a{
	line-height:0;
	display:block;
	width:180px;
	height:180px;
	border-radius:90px;
	background:#fff;
	-webkit-transition: all 0.2s ease;
	   -moz-transition: all 0.2s ease;
	    -ms-transition: all 0.2s ease;
	     -o-transition: all 0.2s ease;
	        transition: all 0.2s ease-out;
}

#menu li a:hover{
	background:#3dbfb8;
}
#menu li{
	transition: all 0.4s ease-out;
}
#menu li:nth-child(2){
	transition: all 0.4s ease-out 0.1s;
}
#menu li:nth-child(3){
	transition: all 0.4s ease-out 0.2s;
}

#menu.st  li{
	opacity:0;
	transform: scale3d(0, 0, 0);
}
/**/

#howto{
	height:100%;
	min-height:976px;
	background:url(../img/bg-about.jpg) center 0 no-repeat;
	background-size:cover;
}

#howto > *{
	position:absolute;
	top:50%;
}

#howto h2{
	text-align:center;
	font-size:45px;
	left:0;
	width:100%;
	margin-top:-412px;
	text-shadow:0 10px 15px rgba(0,0,0,0.2);
}

#howto h2{
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	    -ms-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
	        transition: all 1s ease;
}

#howto.st h2{
	opacity:0;
	-webkit-transform: translate3D(0,20px,0);
	   -moz-transform: translate3D(0,20px,0);
	    -ms-transform: translate3D(0,20px,0);
	     -o-transform: translate3D(0,20px,0);
	        transform: translate3D(0,20px,0);
}

#howto .title-wrapper{
	left:50%;
	margin:-330px 0 0 -212px;
	width:424px;
	height:62px;
	overflow:hidden;
}


#howto .title-wrapper{
	-webkit-transition: all 1s ease 0s;
	   -moz-transition: all 1s ease 0s;
	    -ms-transition: all 1s ease 0s;
	     -o-transition: all 1s ease 0s;
	        transition: all .5s ease 1.5s;
}

#howto.st .title-wrapper{
	opacity:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,-10px,0);
}

#howto .titles{
	position:absolute;
	left:0;
	top:0;
	width:300%;
	-webkit-transition: all .4s ease;
	   -moz-transition: all .4s ease;
	    -ms-transition: all .4s ease;
	     -o-transition: all .4s ease;
	        transition: all .4s ease;
}

#howto .titles li{
	text-align:center;
	color:#43bbac;
	font-size:24px;
	line-height:62px;
	float:left;
	width:424px;
	height:62px;
	background:#fff;
	border-radius:31px;
}


#howto .img-wrapper{
	left:50%;
	margin:-228px 0 0 -124px;
	width:248px;
	height:510px;
	overflow:hidden;
	padding:61px 15px 62px;
	background:url(../img/howto.png) center center no-repeat;
	background-size:100% auto;
}

#howto .img-wrapper{
	-webkit-transition: all 1s ease 0s;
	   -moz-transition: all 1s ease 0s;
	    -ms-transition: all 1s ease 0s;
	     -o-transition: all 1s ease 0s;
	        transition: all .5s ease 1s;
}

#howto.st .img-wrapper{
	margin-top:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,100%,0);
}
#howto .img-wrapper .inner{
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
}


#howto .imgs{
	position:absolute;
	left:0;
	top:0;
	width:200%;
	-webkit-transition: all .5s ease;
	   -moz-transition: all .5s ease;
	    -ms-transition: all .5s ease;
	     -o-transition: all .5s ease;
	        transition: all .5s ease;
}

#howto .imgs li{
	position:relative;
	float:left;
	width:50%;
}
#howto .imgs li .y{
	line-height:0;
	position:absolute;
	left: 100%;
	top:100%;
}
#howto .imgs li.cur .y{
	-webkit-animation: y01 5s ease infinite; /* Safari & Chrome */
	-webkit-transform-origin:left top;
}

#howto .imgs li:nth-child(2).cur .y{
	-webkit-animation: y02 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(3).cur .y{
	-webkit-animation: y03 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(4).cur .y{
	-webkit-animation: y03 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(5).cur .y{
	-webkit-animation: y05 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(6).cur .y{
	-webkit-animation: y02 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(7).cur .y{
	-webkit-animation: y07 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(8).cur .y{
	-webkit-animation: y03 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(9).cur .y{
	-webkit-animation: y09 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(10).cur .y{
	-webkit-animation: y10 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(11).cur .y{
	-webkit-animation: y09 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(12).cur .y{
	-webkit-animation: y09 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(13).cur .y{
	-webkit-animation: y13 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(14).cur .y{
	-webkit-animation: y09 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(15).cur .y{
	-webkit-animation: y09 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(16).cur .y{
	-webkit-animation: y16 5s ease infinite; /* Safari & Chrome */
}
#howto .imgs li:nth-child(17).cur .y{
	-webkit-animation: y17 5s ease infinite; /* Safari & Chrome */
}



@keyframes y01 {
  0% { left: 100%; top:100% }
  10% { left: 100%; top:100% }
  20% { left: 50%; top:50% }
  80% { left: 50%; top:50% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y01{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 50%; top:50% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 50%; top:50% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y02{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 15%; top:20% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 15%; top:20% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y03{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 50%; top:15% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 50%; top:15% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y05{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 50%; top:25% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 50%; top:25% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y07{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 45%; top:88% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 45%; top:88% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}

@-webkit-keyframes y09{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 80%; top:5% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 80%; top:5% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}

@-webkit-keyframes y10{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 30%; top:40% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 30%; top:40% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}

@-webkit-keyframes y13{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 60%; top:90% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 60%; top:90% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}

@-webkit-keyframes y16{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 7%; top:90% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); }
  55% { -webkit-transform: scale(1.0, 1.0); }
  70% { left: 7%; top:90% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}
@-webkit-keyframes y17{
  0% { left: 100%; top:100%; }
  20% { left: 100%; top:100%; }
  30% { left: 75%; top:55% }
  45% { -webkit-transform: scale(1.0, 1.0); }
  50% { -webkit-transform: scale(0.95, 0.95); left: 75%; top:55% }
  55% { -webkit-transform: scale(0.95, 0.95); left: 83%; top:55% }
  70% {  -webkit-transform: scale(1.0, 1.0); left: 83%; top:55% }
  80% { left: 100%; top:100% }
  100% { left: 100%; top:100% }
}


#howto .arr{
	left:50%;
	margin-top:-37px;
	cursor:pointer;
}

#howto .arr{
	-webkit-transition: all 1s ease 0s;
	   -moz-transition: all 1s ease 0s;
	    -ms-transition: all 1s ease 0s;
	     -o-transition: all 1s ease 0s;
	        transition: all .5s ease 2.0s;
}
#howto.st .arr{
	opacity:0;
}


.ar-l{
	margin-left:-288px;
}
.ar-r{
	margin-left:213px;
}


#howto > .ctl{
	display:-webkit-box;
	-webkit-box-align:center;
	-webkit-box-pack:center;
	left:0;
	width:100%;
	margin-top:320px;
}

#howto > .ctl li{
	cursor:pointer;
	display:-webkit-box;
	-webkit-box-align:center;
	-webkit-box-pack:center;
	width:128px;
	height:128px;
	background:#7abbb7;
	border-radius:64px;
	margin:0 38px;
	font-size:24px;
}
#howto > .ctl li.rem{
	font-size:20px;
}

#howto > .ctl li:hover,
#howto > .ctl li.cur{
	color:#7abbb7;
	background:#fff;
}



/*about*/

#about{
	height:747px;
	background:#9ee3df;
	overflow:hidden;
}


.anim01{
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	    -ms-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
	        transition: all 1s ease;
	
}

.anim02{
	-webkit-transition: all 0.5s ease 0.5s;
	   -moz-transition: all 0.5s ease 0.5s;
	    -ms-transition: all 0.5s ease 0.5s;
	     -o-transition: all 0.5s ease 0.5s;
	        transition: all 1s ease;
	
}

.anim03{
	-webkit-transition: all 1s ease 0.5s;
	   -moz-transition: all 1s ease 0.5s;
	    -ms-transition: all 1s ease 0.5s;
	     -o-transition: all 1s ease 0.5s;
	        transition: all 1s ease;
	
}

#about > *{
	position:absolute;
	top:50%;
	left:50%;
}

#about > .ctl{
	text-align:center;
	top:auto;
	left:0;
	bottom:20px;
	width:100%;
}

#about > .ctl li{
	font-size:27px;
	font-family:Arial, Helvetica, sans-serif;
	cursor:pointer;
	display:inline-block;
	width:47px;
	height:47px;
	line-height:45px;
	background:#65c0bb;
	border-radius:24px;
	border:2px solid #fff;
	margin:0 10px;	
}
#about > .ctl li:hover,
#about > .ctl li.cur{
	color:#65c0bb;
	background:#fff;
}



#about > h2{
	font-size:41px;
	left:0;
	text-align:center;
	width:100%;
	margin-top:-290px;
	opacity:0;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}

#about.a0 > h2{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}

#about > .txt{
	font-weight:normal;
	font-size:34px;
	left:0;
	text-align:center;
	width:100%;
	opacity:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,0,0);
}
#about > .txt1{
	margin-top:-196px;
}

#about > .txt2,
#about > .txt3,
#about > .txt4{
	margin-top:-285px;
}

#about.a4 > .txt1,
#about.a6 > .txt2,
#about.a7 > .txt3,
#about.a8 > .txt4{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}

#about .ip{
	opacity:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,0,0);
}

#about .ip1{
	margin:-171px 0 0 -111px;
}

#about .ip2,
#about .ip3,
#about .ip4{
	margin:-181px 0 0 -231px;
}


#about.a0 .ip1,
#about.a6 .ip2,
#about.a7 .ip3,
#about.a8 .ip4{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}

#about > .mam{
	top:auto;
	bottom:0;
	display:block;
	opacity:0;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}

#about > .m1{
	margin-left:195px;
}

#about > .m2{
	margin-left:237px;
}

#about > .m3{
	margin-left:-147px;
}

#about > .m4{
	margin-left:24px;
}

#about > .m5{
	margin-left:49px;
}

#about > .m6{
	margin-left:116px;
}

#about > .qmrk{
	top:auto;
	bottom:273px;
	margin-left:112px;
	display:block;
	opacity:0;
	-webkit-transform: translate3D(0,100%,0);
	   -moz-transform: translate3D(0,100%,0);
	    -ms-transform: translate3D(0,100%,0);
	     -o-transform: translate3D(0,100%,0);
	        transform: translate3D(0,100%,0);
	-webkit-transition: all 2s ease 0.5s;
	   -moz-transition: all 2s ease 0.5s;
	    -ms-transition: all 2s ease 0.5s;
	     -o-transition: all 2s ease 0.5s;
	        transition: all 2s ease 0;

}

#about.a3 > .qmrk,
#about.a5 > .qmrk{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}


#about > .hmrk{
	display:block;
	opacity:0;
	-webkit-transform: translate3D(0,20px,0);
	   -moz-transform: translate3D(0,20px,0);
	    -ms-transform: translate3D(0,20px,0);
	     -o-transform: translate3D(0,20px,0);
	        transform: translate3D(0,20px,0);
}


#about > .hmrk1{
	margin:110px 0 0 -182px;
}
#about > .hmrk2{
	margin:123px 0 0 9px;
}
#about > .hmrk3{
	margin:125px 0 0 328px;
}



#about.a4 > .hmrk1,
#about.a7 > .hmrk2,
#about.a7 > .hmrk3,
#about.a8 > .hmrk2,
#about.a8 > .hmrk3{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}




#about.a1 > .m1,
#about.a2 > .m1,
#about.a3 > .m2,
#about.a4 > .m3,
#about.a5 > .m2,
#about.a6 > .m4,
#about.a7 > .m5,
#about.a8 > .m5,
#about.a9 > .m6{
	opacity:1;
	-webkit-transform: translate3D(0,0,0);
	   -moz-transform: translate3D(0,0,0);
	    -ms-transform: translate3D(0,0,0);
	     -o-transform: translate3D(0,0,0);
	        transform: translate3D(0,0,0);
}


#about > .bbl{
	letter-spacing:-0.1em;
	color:#3dbfb8;
	font-size:34px;
	line-height:1.8;
	box-sizing:border-box;
}

#about > .bbl p{
	opacity:0;
}


#about > .bbl1,
#about > .bbl2,
#about > .bbl3,
#about > .bbl4,
#about > .bbl5{
	opacity:0;
	width:640px;
	height:424px;
	background:url(../img/bbl1.png) right bottom no-repeat;
	background-size:cover;
	margin:-257px 0 0 -450px;
	padding:90px 0 0 108px;
}
#about > .bbl3,
#about > .bbl4{
	background:url(../img/bbl2.png) right bottom no-repeat;
	background-size:cover;
	margin:-251px 0 0 -458px;
	width:600px;
	height:402px;
	padding:115px 0 0 84px;
}

#about > .bbl5{
	text-align:center;
	margin:-251px 0 0 -502px;
	padding:90px 0 0 0;
}


#about.a1 > .bbl1,
#about.a2 > .bbl2,
#about.a9 > .bbl5{
	opacity:1;
	margin:-257px 0 0 -450px;
	width:640px;
	height:424px;
	padding:90px 0 0 108px;
}

#about.a3 > .bbl3,
#about.a5 > .bbl4{
	opacity:1;
	margin:-251px 0 0 -458px;
	width:600px;
	height:402px;
	padding:115px 0 0 84px;
}

#about.a9 > .bbl5{
	margin:-251px 0 0 -502px;
	padding:90px 0 0 0;
}



#about.a1 > .bbl1 p{
	opacity:1;
}

#about.a2 > .bbl2 p{
	opacity:1;
}

#about.a3 > .bbl3 p,
#about.a5 > .bbl4 p,
#about.a9 > .bbl5 p{
	opacity:1;
}

#sp_about{
	display:none;
}





#nh{
	text-align:center;
	line-height:0;
	height:480px;
}
#nh ul,#nh .btl{
	position:absolute;
	left:0;
	top:0;
	display:-webkit-box;
	display:box;
	width:100%;
	height:100%;
}
#nh li{
	display:-webkit-box;
	display:box;
	-webkit-box-pack:center;
	-webkit-box-align:center;
	width:50%;
	height:100%;
	overflow:hidden;
}
#nh li img{
	max-width:450px;
	width:85%;
}

#nh li div{
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	-webkit-transition: all 10s ease;
	   -moz-transition: all 10s ease;
	    -ms-transition: all 10s ease;
	     -o-transition: all 10s ease;
	        transition: all 10s ease;
}

#nh li:first-child div{
	background-image:url(../img/nh1.jpg);
}

#nh li:last-child div{
	background-image:url(../img/nh2.jpg);
}


#nh.st li div{
	-webkit-transform: scale3d(1.1, 1.1, 1);
	   -moz-transform: scale3d(1.1, 1.1, 1);
	    -ms-transform: scale3d(1.1, 1.1, 1);
	     -o-transform: scale3d(1.1, 1.1, 1);
	        transform: scale3d(1.1, 1.1, 1);
}

#nh .btl{
	-webkit-box-pack:center;
	-webkit-box-align:center;
}
#nh .btl img{
	display:block;
	position:relative;
	max-width:136px;
	width:8%;
}

#footer{
	font-size:18px;
	text-align:center;
	background:#3dbfb8;
	padding:110px 0 100px;
}

#footer a{
	color:#fff;
}

#footer ul{
	padding-bottom:35px;

}
#footer li{
	display:inline-block;
	padding:0 1em;
}
#footer p{
	font-family:Helvetica,Arial,sans-serif;
	padding-top:40px;
}
.kiyaku{
	color:#888;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	position:relative;
	color:#000;
	line-height: 1.8;
	font-size:12px;
	max-width: 1240px;
	margin: 0 auto;
	padding: 60px 20px;
}

.kiyaku h2{
	font-size:18px;
	padding:0  0 40px;
}


.kiyaku dt{
	color:#3dbfb8;
	font-size:15px;
	padding-bottom:0.1em;
}

.kiyaku dl{
	padding-bottom:2em;
}

.kiyaku dd{
	font-size:12px;
	padding-bottom:1.5em;
}
.kiyaku dd ol,.kiyaku dd li{
	list-style-position:inside;
	list-style-type:decimal;
}