@charset "UTF-8";

body {
    font-family:'Noto Sans JP',sans-serif;
    padding-top: 60px;
    height: 100%;
    background-color: #fad9f4;
    background-image: -webkit-gradient(linear, 0 100%, 100% 0,
    color-stop(.25, #ffe7f0), color-stop(.25, transparent),
    color-stop(.5, transparent), color-stop(.5, #ffe7f0),
    color-stop(.75, #ffe7f0), color-stop(.75, transparent),
    to(transparent));
    background-image: -webkit-linear-gradient(45deg, #ffe7f0 25%, transparent 25%,
    transparent 50%, #ffe7f0 50%, #ffe7f0 75%,
    transparent 75%, transparent);
    background-image: -moz-linear-gradient(45deg, #ffe7f0 25%, transp
    arent 25%,
    transparent 50%, #ffe7f0 50%, #ffe7f0 75%,
    transparent 75%, transparent);
    background-image: -ms-linear-gradient(45deg, #ffe7f0 25%, transparent 25%,
    transparent 50%, #ffe7f0 50%, #ffe7f0 75%,
    transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, #ffe7f0 25%, transparent 25%,
    transparent 50%, #ffe7f0 50%, #ffe7f0 75%,
    transparent 75%, transparent);
    background-image: linear-gradient(45deg, #ffe7f0 25%, transparent 25%,
    transparent 50%, #ffe7f0 50%, #ffe7f0 75%,
    transparent 75%, transparent);
    -webkit-background-size: 40px 40px;
    -moz-background-size: 40px 40px;
    background-size: 40px 40px;

    

 }
 

 /*header*/

 header{
  background-color: rgba(252, 198, 231,1);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;

 }

 ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  width: 100%;
  height: 60px;
  margin: 0;
  padding: 0;
  
}

li{
  font-size: 24px;
  margin-right: 3%;
  font-family: 'M PLUS Rounded 1c', sans-serif;

}

.hed{
  text-decoration: none;
  color:#707070;
}

.hed:hover{
  opacity: 0.7;
}

ul li:before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url("../images/ame.png");
  background-size: cover;
  margin-right: 20px;
  margin-left: 100px;
   margin-top: 18px; /* 調整 */
  background-repeat: no-repeat;
}
 /*スライダー002*/
.css-slider .title {
    font-size: 3rem;
    color: #fff;
    text-align: center;
    margin-bottom: 0.8em;
    margin-bottom: -50px;
}

.css-slider .lead {
   font-size: 1.2rem;
   color: #fff;
   text-align: center;
   margin-bottom: 2.8em;
}

.css-slider {
  padding: 0% 0 0%;
  position: relative;
  top: 0px;
  z-index:1;
  height: calc(100vh - 100px);
  max-width: 100%;
  width: auto;
  overflow: hidden;

}
.css-slider:before,
.css-slider:after {
   content: "";
   z-index: -1;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
}
.css-slider:before {
  width: 500%; /* (n+1)*100% */
  background: url(../images/suraide1.png) no-repeat, url(../images/suraide2.png) no-repeat, url(../images/innner.jpg) no-repeat, url(../images/suraide2.png) no-repeat, url(../images/suraide1.png) no-repeat;
  background-position: 75% top, 50% top, 25% top, 100% top, 0% top; /* (n-1)/n*100%, (n-2)/n*100% ... 0% */
  background-size:  20% auto; /* 100/(n+1)% */
  animation: slide 20s ease-in-out  infinite;
}

@keyframes slide {
  0%, 20% {
    transform: translate3d(0,0,0);
  }
  25%, 45% {
    transform: translate3d(-20%,0,0);
     /* -1/n+1 * 100% */
  }
  50%, 70% {
    transform: translate3d(-40%,0,0);
  }
  75%, 100% {
    transform: translate3d(-60%,0,0);   
  }
  
}

.rogo{
  width: 35%;
  position: absolute;
  margin-top: -450px;
  z-index: 5;
}

h2{
  text-align: center;
  margin-top: 10px; 
  font-size: 64px;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  color: #8d437a;
}

.bana{
  margin-top: 0;
  margin-bottom: 0;
  height: auto;
  width: 70%;
}

.bana:hover{
  box-shadow: none;
 transform: translate(0, 5px);
 opacity: 0.7;
}

.bana_flex{
  display: flex;
  justify-content: center;
  margin-left: 15%;
  margin-top: 10vh;
}
.bana_link{
  width: 50%;
}

#about{
  margin-top: 200px;
}

iframe{
  display: block;
  margin: 0 auto;
  max-width: 100%;
  margin-top: 10vh;
}

.purofi-ru{
  margin-top: 200px;
}

.icon{
  border-radius:50%;
  width: 8%;
  margin-left: 45.5%;
  border: #3f3f3f solid 2px;
  margin-bottom: 70px;
}

.about_p{
  text-align: center;
}

.p_1{
  text-align: center;
  margin-top: 15vh;
  font-size: 48px;
  font-family: 'M PLUS Rounded 1c', sans-serif;
}


#achievements{
  margin-top: 200px;
  text-align: center;
}

.achi{
  margin-top: 15vh;
  padding-bottom: 150px;
  border-bottom: 2px #3f3f3f dashed;
  width: 60%;
  font-size: 20px;
  display: inline-block;

}

.p_3{
  text-align: center;
  color: #8d437a;
  font-size: 48px;
  margin-top: 200px;
}

.pr{
  margin-top: 200px;
  width: 70%;
  height: 80vh;
 
}

.div_2{
  text-align: center;
  margin-left: 0%;
}

.video{
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.youtube{
  width: 70%;
  height: 80vh;
}

.foot{
background-color: rgb(252, 198, 231);
height: 30vh;
width: 100%;

}

.foot_p{
  color: #707070;
  text-align: center;
  padding-top: 15vh;
  font-size: 16px;
  margin-top: 30vh;
}