#top{ background-image: url("https://kioku-gakko.com/nakahara/wp-content/uploads/2020/01/back.jpg");
 background-size: cover;
height: 100%;
}


/*ふわ*/
.anime_fuwa {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:.7s;
 -ms-animation-duration:.7s;
 animation-duration:.7s;
 -webkit-animation-name: scrollAnime;
 -ms-animation-name: scrollAnime;
 animation-name: scrollAnime;
 visibility: visible !important;
}
main .subcatch *,.FeedbackMain *,.accbox *{ 
	visibility: visible !important; 
	-webkit-animation-name:none;
	-ms-animation-name: none;
	animation-name: none;
}

@-webkit-keyframes scrollAnime {
 0% { opacity: 0; -webkit-transform: translateY(2em); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes scrollAnime {
 0% { opacity: 0; -webkit-transform: translateY(2em); -ms-transform: translateY(2em); transform: translateY(2em); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}



/*追加ボタン*/
 @import 'https://fonts.googleapis.com/css?family=Comfortaa:300,400,700&subset=cyrillic,cyrillic-ext,latin-ext';
* {box-sizing:border-box}

button {/*color:#ff0084;*/background:transparent;border-width:2px;border-style: solid;border-color: #ff0084;position:relative;margin:0 1em;display:inline-block;padding:0.5em 2em;transition:all 0.3s ease-in-out;text-align:center;
font-family:comfortaa;font-weight:bold}
button:before, button:after {content:'';display:block;position:absolute;border-color:#ddd;box-sizing:border-box;border-style:solid;width:1em;height:1em;transition:all 0.3s ease-in-out}
button:before {top:-6px;left:-6px;border-width:2px 0 0 2px;z-index:5;}
button:after {bottom:-6px;right:-6px;border-width:0 2px 2px 0;}
button:hover:before, button:hover:after {width:calc(100% + 12px);
  height:calc(100% + 12px);border-color:#fff}
button:hover {color:#353535;background-color:#fff;border-color:#fff}
.panel {max-width:960px;text-align:center;position:relative;margin:auto;}


.pink button {color:#eb1777;border-color:#eb1777}
.pink button:before, .pink button:after  {border-color:#eb1777}
.pink button:hover:before, .pink button:hover:after {border-color:#eb1777;}
.pink button:hover {color:#fff;background-color:#eb1777;border-color:#eb1777;}
.pink .panel {max-width:960px;text-align:center;position:relative;margin:auto;}





/*追加メニュー*/
@import url(https://fonts.googleapis.com/css?family=Raleway:400,500,800);
.nav {
  font-family: 'Raleway', Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 1px;
}
.nav * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.nav li {
  display: inline-block;
  list-style: outside none none;
  margin: 0.5em 1.5em;
  padding: 0;
}
.nav a {
  padding: 0.3em 0;
  color: rgba(235, 23, 23, 1);
  position: relative;
  text-decoration: none;
  display: inline-block;
}
.nav a:before,
.nav a:after {
  height: 3px;
  position: absolute;
  content: '';
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  background-color: #772233 ;
  width: 0;
}
.nav a:before {
  top: 0;
  left: 0;
}
.nav a:after {
  bottom: 0;
  right: 0;
}
.nav a:hover,
.nav .current a {
  color: #ffffff;
}
.nav a:hover:before,
.nav .current a:before,
.nav a:hover:after,
.nav .current a:after {
  width: 100%;
}

.button {
    font-size: 90%;
    width: 30%;}

@media only screen and (max-width: 640px){
.nav {
	text-align: left;}

  .button {
    font-size: 90%;
    width: 30%;
}


}
