@charset "UTF-8";

@media screen and (min-width: 896px) {

header {
   
}
    
      .menumoji{
        display: none;
    }
    
    body{
        height: 1000px;
    }
        .sankaku{

      top:28px;
      right: 15px;
        height: 13px;
        width: auto;
    transform: rotateZ(180deg);
  transition: transform  0.3s linear;
            position: absolute;
    }
       


  
.open .sankaku {
  transform: rotateZ(0deg);
  transition: transform 0.45s linear;
}
 

   #mainmenu ul{
margin: 0 auto;
        text-align: center;
      width: 65%; 
        padding: 0;
       
    }
    
#mainmenu ul li {
    font-family: "M PLUS 1p";
    letter-spacing: 2px;
display:inline-block;
  list-style: none;

  padding:0px;
  margin: 0px;
  font-size:20px;
  position: relative;
  height: 70px;
    width: 18%;/*親メニューの幅*/
    min-width: 210px;
  line-height:50px;
  background:#fff;/*親メニューの背景色*/
  /*親メニューの文字色*/
 
  
}

    .takeout{
        font-size:19px;
    }

#mainmenu ul li a {
     text-align: center;
    padding: 10px;
  color: #33517B;
  display: block;
  text-decoration: none;
}

#mainmenu ul li ul {
  position: absolute;
  top: 70px;/*親メニューの高さと同じにする*/
   width: 18%;/*親メニューの幅*/
    min-width: 118px;
  z-index: 100;
     padding:0;
    margin: 0 ;

  
}
 
.open .syoku{
   
        background-color:#FFE6DF;
   
  color:#fff;/*ホバー時の親メニューの文字色*/
    }
    
 
    
    
    

    
    #links01 li{
        height: 0;
        opacity: 0;
        border: 1px ridge #33517B;
        visibility: hidden;
        padding: 0;
    }
    #menu_bar01:checked ~ .menu {
        height: auto;
      
    }
    
  
    
  

#menu_bar01:checked ~ #links01 li{
 height: auto;
    opacity: 1;
     visibility: visible;
    padding : 0px;
    margin: 0px;
    
   
}
 
    
    
header * {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

input {
    display: none;
}



.h1{
	width: 300px;
	margin:0 auto;
    
    padding-top: 9px;
    padding-bottom: 7px;
}

.image{
    width: 600px;
    margin: 0 auto;
    display:flex;

     margin-top: 200px;
     
}

    .homeimg{
  width: 1000px;
        margin: 0 auto;
    }
.kotono{
   margin-left: 960px;
     bottom: 250px;
    z-index: 10;
   transform:translate3d(0,0,10);
    position:absolute;
    transform: rotatey( 0deg ) ;
    opacity: 0;
    
}

.kotono.motion{
    transform:rotatey(360deg);
    transition: 1s;
opacity: 1;


}

.kotono:hover{

    animation: kotono 0.9s linear 0s 1;
    
}

@keyframes kotono{
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  10%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
  40%  { transform: scale(1.2, 0.8) translate(0%, 15%); }
  50%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  60%  { transform: scale(0.9, 1.2) translate(0%, -30%); }
  75%  { transform: scale(0.9, 1.2) translate(0%, -20%); }
  85%  { transform: scale(1.2, 0.8) translate(0%, 15%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}

.hokuseio{
   margin: 0 auto;
    bottom: 270px;
    position:absolute;
    transform: rotatey( 0deg ) ;
        z-index: 10;
   transform:translate3d(0,0,10);

    opacity: 0;}

.hokuseio.motion2{
    transform:rotatey(-360deg);
    transition: 1s;
opacity: 1;

}

.slide{
    width: 600px;
 margin: 0 auto;
   

    margin-top: 200px;
}

#photos {

	list-style-type: none;
	pointer-events: none;
	position: relative;

}

#photos > li{
    margin-top: 100px;
	opacity:0;
	position: absolute;
	transition: opacity 1s;
  
}

#photos > li.current{
	opacity:1;
  
}

	
.hedback {
	text-align: center;
	width: auto;
	background-color:#fff;
}
}
