html, body { height: 100%; width:100%}
body { 
position:relative;
 margin: 0; 
 padding: 0;
 line-height: 500px;
 font-size: 18px;
 font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
 }
 
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

h2 { margin: 10px 0 30px; font-size: 25px; font-family: 'Open Sans', sans-serif; letter-spacing: 5px; }
a, a:visited { color: #fff; text-decoration: none; }
a:hover { text-decoration: underline; }
.cover { position: relative; width: 100%; margin: 0; padding: 0; color: #fff; }

.centerBoxFix { 
position: fixed; top: 0; bottom: 0; left: 0; right: 0; 
margin: auto; 
width: 100%; 
height: 20px;
line-height: 160%; 
text-align: center; 
}

.centerBoxLast { z-index: -1; }

.centerBox { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 80%; height: 200px; line-height: 160%; text-align: center;}
.centerBox i { height: 120px; padding: 20px; font-size: 100px; transition: .8s; transition-delay: 0; } 
.centerBox div { margin: auto; transition: .8s; transition-delay: .8s; }

.section1 { 
position: relative; top: -50px; left:0px;
margin: 0 auto;
text-align: center;
display: inline-block;
vertical-align: middle;
height: 100%; 
background: url(../img/top_bg.jpg) no-repeat; 
background-size: cover; 
background-color: #000000; 
}


.section2 { position: relative; top: -50px; left:0px;
height: 100%; background-color: #F1293b;}

.sec2txt {
 	line-height: 200%;
	position: relative; top: -150px; left:0px;
}

.section3 { position: relative; top: -50px; left:0px;
height: 100%; background: url(../img/about.jpg) bottom center no-repeat; background-size: cover; }

.sec3txt {
 	line-height: 200%;
	position: relative; top: -150px; left:0px;
}
.section4 { position: relative; top: -50px; left:0px;
height: 100%; background: #009688;

  background: -webkit-linear-gradient(90deg, #2BC0E4 10%, #EAECC6 90%); /* Chrome 10+, Saf5.1+ */
  background:    -moz-linear-gradient(90deg, #2BC0E4 10%, #EAECC6 90%); /* FF3.6+ */
  background:     -ms-linear-gradient(90deg, #2BC0E4 10%, #EAECC6 90%); /* IE10 */
  background:      -o-linear-gradient(90deg, #2BC0E4 10%, #EAECC6 90%); /* Opera 11.10+ */
  background:         linear-gradient(90deg, #2BC0E4 10%, #EAECC6 90%); /* W3C */

 }

#menu-wrap { position: fixed; z-index: 9999; top: 0; left: 0; width: 100%; background: rgba(0,0,0,.5); font-family: 'Open Sans', sans-serif; transition: .3s }
#menu { list-style-type: none; max-width: 960px; margin: 0px auto 0px; padding: 0; }
#menu li { width: 20%; float: left; margin: 0; padding: 0; text-align: center; }
#menu li a { display: block; width : 100%; padding: 20px 0; color: #fff; font-size: 14px; line-height: 1; text-decoration: none; transition: .3s; }
#menu li a:hover { background: rgba(0,0,0,.3); }

a.btn{ display: inline-block; width: 150px; margin: 10px 0; padding: 16px 10px; border: 1px solid #fff; background: transparent; color: #fff; text-align: center; text-decoration: none; line-height: 1; transition: .3s; }
a.sample16 { position:relative; z-index:2; overflow:hidden }
a.sample16::after { display:block; content:""; position:absolute; z-index:-1; top:50%; left:50%; width:160px; height:160px; margin:-80px 0 0 -80px; border:65px solid rgba(255,255,255,0);  border-radius:50%; transition:.5s }
a.sample16:hover { color:#555 }
a.sample16:hover::after { border-width: 0; border-color:rgba(255,255,255,1); background:#fff }
#page-top i { position: relative; padding-top: 2px; transition: .2s; }
#page-top:hover i { animation: page-top-animation .1s ease 0s infinite alternate; }
@keyframes page-top-animation {
0% {padding-top: 0px; }
100% {padding-top: 3px; }
}
@media only screen and (min-width: 1023px) {
.section1, .section3, .section5 { background-attachment: fixed; }
}