@charset "utf-8";
/* CSS Document */
@font-face {
font-family: "Yu Gothic";src: local("Yu Gothic Medium");
font-weight: 100;
}
@font-face {
font-family: "Yu Gothic";src: local("Yu Gothic Medium");
font-weight: 200;
}
@font-face {
font-family: "Yu Gothic";src: local("Yu Gothic Medium");
font-weight: 300;
}
@font-face {
font-family: "Yu Gothic";src: local("Yu Gothic Medium");
font-weight: 400;
}
@font-face {
font-family: "Yu Gothic";src: local("Yu Gothic Bold");
font-weight: bold;
}
.pink{color:#f44779;}
.blue{color:#54c6ff;}
.orange{color:#ff6f00;}
.purple{color:#b86ad7;}
.green{color:#88c200;}
.blue_green{color:#56b29a;}
a{border-bottom:1px dotted #ff6f00;}
a:hover{color:#ff6f00;}
body{
position:relative;
font-family:"游ゴシック", YuGothic,  'Open Sans',"メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serifsans-serif, Verdana, Roboto, "Droid Sans";font-weight:bold;
font-weight:bold;
color:#555;
background:url(../img/k1.jpg) repeat;
}
header{
position:relative;
z-index:999;
}
#main-visual{
background: #81d5ff;
background: -webkit-linear-gradient(#81d5ff, #e9f7ff);
background:    -moz-linear-gradient(#81d5ff, #e9f7ff);
background:     -ms-linear-gradient(#81d5ff, #e9f7ff);
background:      -o-linear-gradient(#81d5ff, #e9f7ff);
background:         linear-gradient(#81d5ff, #e9f7ff);
width:100%;
overflow:hidden;
position:relative;
}
#main-visual span{
display:block;
text-align:center;
font-size:110%;
position:relative;
z-index:50;
}
#main-visual span+img{
width:1980px;
display:inline-block;
height:auto;
position: relative;
left: 50%;
margin-left: -990px; 
z-index:50;
}
#sp_logo2{display:none;}
#cloud1{
position:absolute;
z-index:1;
top:60px;
left:80px;
animation:translate 50s; 
animation-iteration-count:infinite; 
-webkit-animation:translate 50s; /* Safari & Chrome */
-webkit-animation-iteration-count:infinite; 
}
#about #cloud1 img,
#about2 #cloud1 img,
#about3 #cloud1 img,
#access #cloud1 img,
#care #cloud1 img,
#info #cloud1 img,
#contact #cloud1 img
{
width:90px;
height:auto;
}
#about #cloud2 img,
#about2 #cloud2 img,
#about3 #cloud2 img,
#access #cloud2 img,
#care #cloud2 img,
#info #cloud2 img,
#contact #cloud2 img
{
width:85px;
height:auto;
}
@keyframes translate { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(80px, 0px);}
30% { transform:  translate(100px, 15px);}
45% { transform:  translate(50px, 25px);} 
60% { transform:  translate(-50px, 15px);}
75% { transform:  translate(-10px, 8px);} 
85% { transform:  translate(-50px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(80px, 0px);}
30% { transform:  translate(100px, 15px);}
45% { transform:  translate(50px, 25px);} 
60% { transform:  translate(-50px, 15px);}
75% { transform:  translate(-10px, 8px);} 
85% { transform:  translate(-50px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 

#cloud2{
position:absolute;
z-index:1;
top:120px;
right:50px;
animation:translate2 60s; 
animation-iteration-count:infinite; 
-webkit-animation:translate2 60s; /* Safari & Chrome */
-webkit-animation-iteration-count:infinite; 
}
@keyframes translate2 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(-50px, 0px);}
30% { transform:  translate(50px, 25px);}
45% { transform:  translate(-100px, 5px);} 
60% { transform:  translate(-50px, 8px);} 
75% { transform:  translate(-100px, 20px);} 
85% { transform:  translate(-50px, 30px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate2 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(-50px, 0px);}
30% { transform:  translate(50px, 25px);}
45% { transform:  translate(-100px, 5px);} 
60% { transform:  translate(-50px, 8px);} 
75% { transform:  translate(-100px, 20px);} 
85% { transform:  translate(-50px, 30px);} 
100%{ transform:  translate(0px, 15px);}  
}

.slider{
width:100%;
margin-top:1.5em;
}
.slider ul,
.slider li{
marign:0 15px;
padding:0 15px;
}
.slider img{
width:810px;
height:auto;
border-radius:20px;
}
.slider li h2{
text-align:center;
margin:0 auto;
}
.slider i{color:#f44779;}
.slider2{display:none;}

@media screen and (max-width: 640px) {

#main-visual span{
position:relative;
z-index:10;
display:block;
margin-top:80px;
text-align:center;
font-size:100%;
}
#main-visual span{margin-top:80px;}
#main-visual span img:nth-of-type(1){display:none;}
#cl oud1{
position:absolute;
z-index:1;
top:150px;
left:20px;
animation:none; 
}
#cloud1 img{
width:100px;
height:auto;
}

#about #cloud1 img,
#about2 #cloud1 img,
#about3 #cloud1 img,
#access #cloud1 img,
#care #cloud1 img,
#info #cloud1 img,
#contact #cloud1 img
{
width:80px;
height:auto;
}

@keyframes translate { 
0%  { transform:  translate(0px, 10px); } 
15% { transform:  translate(40px, 0px);}
30% { transform:  translate(80px, 15px);}
45% { transform:  translate(40px, 25px);} 
60% { transform:  translate(-40px, 15px);}
75% { transform:  translate(-10px, 8px);} 
85% { transform:  translate(-40px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate { 

} 

.slider2{display:block;}
.slider ul,.slider li{
marign:0;
padding:0 5px;
}
.slider img{
width:350px;
height:auto;
border-radius:0;
}
.slider li h2{
text-align:center;
margin:-0.5em auto 0;
font-size:80%;
line-height:1.7;
}
.slider{
width:100%;
margin-top:0;
}
.slider1{display:none;}
}

/* contents */

#contents_box{margin:130px auto 0;}
#contents{
max-width:1020px;
margin:0 auto;
padding:0 30px;
}

@media screen and (max-width: 640px) {
#contents{
width:90%;
margin:1em auto 0;
padding:0;
}
#top #contents_box{margin:1em auto 0;}
#about #contents_box,
#about2 #contents_box,
#about3 #contents_box,
#care #contents_box,
#info #contents_box,
#contact #contents_box
{margin:0 auto 0;}
#contents_box nav#pager{
display:none;
}
}

/* footer */
#footer_logo{
text-align:center;
padding:5em 0;
}
@media screen and (max-width: 640px) {#footer_logo{padding:2em 0;}}
@media screen and (max-width: 400px) {
#footer_logo img{
width:210px;
height:auto;
}
}
#q_info{
background:#56b29a;
text-align:center;
margin:0 auto;
padding:0 30px 0 30px;
}
#q_info dl{padding:2em 0 1em;}
#q_info dt{
color:#56b29a;
background:#ffffc3;
display:inline-block;
font-size:120%;
padding:0.5em 1em;
border-radius:10px;
}
#q_info dt br{display:none;}
#q_info dd{
color:#fff;
padding-top:1em;
}
#q_info dd span:nth-last-of-type(1){
font-size:80%;
font-weight:normal;
}
#q_info dd span a{
color:#ffffc3;
font-size:120%;
line-height:2;
}
#q_info dd span:nth-of-type(1) {font-size:120%;:}
#q_info dd span a:hover{color:#ff6f00;}
#wave{text-align:center;}
#co_info{
max-width:1020px;
margin:0 auto;
padding:10px 30px 10px 30px;
border-bottom:3px solid #fff;
}
#co_info dl{
font-size:90%;
padding-top:15px;
display:inline-block;
}
#co_info dt span{font-size:160%;}
#co_info div{
display:inline-block;
vertical-align:top;
margin:0 auto;
padding:15px 0 0 40px;
}
#co_info div p{font-size:75%;}
#co_info div li{display:inline-block;}
#co_info div li a{
display:block;
background:#fff;
padding:0.5em 0.8em;
border:none;
margin:8px 15px 0 0;
border-radius:8px;
}
#co_info div li a:nth-of-type(3){margin:8px 0 0 0;}
#co_info div li a:hover{
background:#ff6f00;
color:#fff;
}
footer section:nth-of-type(2) p{
width:100%;
overflow:hidden;
}
footer section:nth-of-type(2) p img{
width:1190px;
height:auto;
position: relative;
left: 50%;
margin-top:10px;
margin-left: -595px; 
}
footer section:nth-of-type(2){
background: #81d5ff;
background: -webkit-linear-gradient(#81d5ff, #e9f7ff);
background:    -moz-linear-gradient(#81d5ff, #e9f7ff);
background:     -ms-linear-gradient(#81d5ff, #e9f7ff);
background:      -o-linear-gradient(#81d5ff, #e9f7ff);
background:         linear-gradient(#81d5ff, #e9f7ff);
}
#res{
background:#564a42;
color:#fff;
text-align:center;
padding:1em 0;
font-size:70%;
font-weight:normal;
}
#co_info dd br:nth-of-type(1),#co_info dd br:nth-of-type(3){display:none;
}footer nav{
position:relative;
max-width:1020px;
margin:15px auto 0;
padding:0 20px 10px 30px;
z-index:10;
}
footer nav ul li{
display:inline-block;
vertical-align:top;
margin:0 35px 10px 0;
line-height:2;
}
footer nav ul li a i,
footer nav ul li i{
color:#ff6f00;
padding-right:0.2em;
}
footer nav ul li ul li{
display:block;
margin:0;
}
footer nav ul li ul li a{font-size:80%;}
footer nav ul li:nth-of-type(1) a{border:none;}
#co_info p br{display:none;}
#go_top{
position:fixed;
right:50px;
bottom:50px;
z-index:9999;
}
#go_top a{border:none;}
#go_top img{
width:72px;
height:auto;
}
#co_info_box{position:relative;}
#cloud3 {
position:absolute;
z-index:1;
bottom:130px;
left:80px;
animation:translate 50s; 
animation-iteration-count:infinite; 
-webkit-animation:translate 50s; /* Safari & Chrome */
-webkit-animation-iteration-count:infinite; 
}
footer nav li:nth-of-type(3) li:nth-of-type(4){padding-top:1em;}
@keyframes translate { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(80px, 0px);}
30% { transform:  translate(100px, 15px);}
45% { transform:  translate(50px, 25px);} 
60% { transform:  translate(-50px, 15px);}
75% { transform:  translate(-10px, 8px);} 
85% { transform:  translate(-50px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(80px, 0px);}
30% { transform:  translate(100px, 15px);}
45% { transform:  translate(50px, 25px);} 
60% { transform:  translate(-50px, 15px);}
75% { transform:  translate(-10px, 8px);} 
85% { transform:  translate(-50px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
#cloud3 img{
width:90px;
height:auto;
}
#cloud4{
position:absolute;
z-index:1;
bottom:180px;
right:50px;
animation:translate2 60s; 
animation-iteration-count:infinite; 
-webkit-animation:translate2 60s; /* Safari & Chrome */
-webkit-animation-iteration-count:infinite; 
}
@keyframes translate2 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(-50px, 0px);}
30% { transform:  translate(50px, 25px);}
45% { transform:  translate(-50px, 5px);} 
60% { transform:  translate(-40px, 8px);} 
75% { transform:  translate(-40px, 20px);} 
85% { transform:  translate(-20px, 30px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate2 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(-50px, 0px);}
30% { transform:  translate(50px, 25px);}
45% { transform:  translate(-50px, 5px);} 
60% { transform:  translate(-40px, 8px);} 
75% { transform:  translate(-40px, 20px);} 
85% { transform:  translate(-20px, 30px);} 
100%{ transform:  translate(0px, 15px);}  
}
#cloud4 img{
width:85px;
height:auto;
}
@media screen and (max-width: 840px) {
#co_info div{padding:15px 0 0 3px;}
#co_info dd br:nth-of-type(1){display:inline;}
#co_info div li{font-size:90%;}
#co_info div li a{
margin:8px 10px 0 0;
padding:0.5em 0.9em;
}
footer nav ul li ul li a{font-size:73%;}
#co_info div p{font-size:68%;}
footer nav ul li{margin-right:20px;}
}
@media screen and (max-width: 740px) {
footer nav ul li ul li a{font-size:75%;}
footer nav ul{font-size:95%;}
footer nav ul li{margin-right:12px;}
}
@media screen and (max-width: 640px) {
#cloud3 {
bottom:200px;
left:80px;
animation:translate5 50s; 
animation-iteration-count:infinite; 
-webkit-animation:translate5 50s; /* Safari & Chrome */
-webkit-animation-iteration-count:infinite; 
}
@keyframes translate5 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(20px, 0px);}
30% { transform:  translate(30px, 15px);}
45% { transform:  translate(30px, 35px);} 
60% { transform:  translate(0px, 15px);}
75% { transform:  translate(-40px, 8px);} 
85% { transform:  translate(-20px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
@-webkit-keyframes translate5 { 
0%  { transform:  translate(0px, 15px); } 
15% { transform:  translate(20px, 0px);}
30% { transform:  translate(30px, 15px);}
45% { transform:  translate(30px, 35px);} 
60% { transform:  translate(0px, 15px);}
75% { transform:  translate(-40px, 8px);} 
85% { transform:  translate(-20px, 0px);} 
100%{ transform:  translate(0px, 15px);} 
} 
#cloud4{
bottom:400px;
right:50px;
}
#q_info dd{
width:90%;
margin:0 auto;
font-size:90%;
display:inline-block;
text-align:justify;
}
#q_info dd span:nth-last-of-type(1){padding-top:1em;}
#q_info{padding:0.5% 0.5% 0;}
#q_info dt{
font-size:95%;
padding:0.5em 0;
width:90%;
}
#q_info dt br{display:inline;}
#co_info{padding:0.5% 0.5% 15px;}
#co_info dl{
display:block;
font-size:80%;
text-align:center;
}
#co_info div{
display:block;
text-align:center;
}
footer nav ul {text-align:center;}
footer nav ul li ul li a{font-size:85%;}
footer nav ul li{display:block;}
#go_top a{display:none;}
}
@media screen and (max-width: 350px) {
#co_info dd br:nth-of-type(1),
#co_info dd br:nth-of-type(3){
display:inline;
}
#co_info p br{display:inline;}
#co_info div li{
display:block;
width:90%;
margin:0 auto;
}
footer section:nth-of-type(2) p img{
width:1190px;
height:auto;
position: relative;
left: 50%;
margin-top:10px;
margin-left: -675px; 
}
}