@media screen and (max-width: 478px) { /*smartphone*/

.top-logo{
width:150px;
margin-top:50px;
margin-left:20px;
}

.menu-list{
display:none;    
}



p{
font-size:15px;    
}

.purr{
padding:24px;
}

.frappe{
width:350px;
height:350px;
clip-path: polygon(51% 8%, 61% 35%, 90% 35%, 68% 57%, 75% 84%, 50% 70%, 24% 84%, 32% 57%, 10% 35%, 39% 35%);
margin-left:8px;

}

.directionbtn{
margin-bottom:50px
}

  .accordion__container {
    width: 300px;
    height:auto;
    margin-bottom:300px;
  }
  
  
  .accordion__title {
    border: 1px dotted #25b7c0;
    color: grey;
    font-size: 25px;
    padding: .620em .620em .620em 2em;
    position: relative;
    cursor: pointer;
    user-select: none;
    text-align:left;
    border-radius:30px;
    margin-bottom:30px;
    font-size:15px;
  }


.back-to-top {
  color:white;
  position: fixed;
  right: 20px;
  bottom: 20px;
  height: 50px;
  font-size:15px;
  text-decoration: none;
  font-weight: bold;
  font-size: 100%;
  line-height: 1.5rem;
  width:60px;
  height:60px;
  border-radius:100px;
  border:cadetblue dotted 1px;
  padding-top:1.3em;
  padding-left:1em;
}
  
.back-to-top::before {
  content: "";
  display: block;
  position: absolute;
  top: -1px;
  left: 0px;
  width: 100px;
  height:100px;
  color:white;
  transform-origin: left top;
  }

.pagetopcontainer{
 margin-top:-192px;  
}

header p{
color:black;  
font-size:10px;
animation:none;
}
.topboba{
margin-top:-300px;
width:200px;
margin-right:30px;
height:200px;
}

 .movingbg h1{
font-size:80px;
margin-left:500px;
}

.orderbtn{
margin-top:-1200px;   
width:150px;
padding-bottom:2em;
display:none;
}

.tapi{
margin-top:-1300px;
margin-left:200px;
}

.topboba{
margin-left:200px;    
}

.topmilk{
margin-left:150px;
width:250px;
margin-top:200px;
}

.topneko{
margin-top:-1300px;
margin-bottom:300px;
width:250px;
}

.buyone{
font-size:25px;
margin-left:130px;
margin-top:-370px;
}

.topneko{
margin-bottom:100px;    
}

table{
font-size:13px;
}

header p{
animation:none;
}

footer{
font-size:10px;    
}}

@media (min-width: 768px) and (max-width: 1023px) {

.menu-list{
display:none;    
}

header{
margin-bottom:7px;    
}

 .movingbg h1{
font-size:120px;
margin-left:200px;
}

.orderbtn{
margin-top:-1200px;   
width:150px;
padding-bottom:2em;
display:none;
}

.tapi{
margin-top:-1300px;
margin-left:300px;
}

.topboba{
width:400px;
margin-left:320px;
}

.topmilk{
margin-left:300px;
width:450px;
margin-top:200px;
}

.topneko{
margin-top:-400px;
width:400px;
}

.buyone{
font-size:50px;
margin-left:400px;
margin-top:-500px;
}
.top-logo{
margin-top:15px;    
}

.frappe{
margin-left:30px; 
}}

@media screen and (max-width: 1024px) and (orientation: landscape) { /*smartphone 横*/

.top-logo{
margin-top:15px;    
}

.frappe{
margin-left:8px;
}

  .accordion__container {
    width: 500px;
    height:auto;
    margin-bottom:300px;
  }
  
.purr{
font-size:16px;    
}

.menu-list{
display:none;
}


.topneko{
width:200px;
bottom:-300px;
margin-bottom:100px;
margin-left:400px;
}

.topboba{
margin-left:100px;   
width:400px;
} 
.topmilk{
margin-left:700px;    
margin-top:-1300px;
width:400px;
}
.orderbtn{
display:none;    
}

.tapi{
margin-top:-1600px;
margin-left:300px;
}

 .movingbg h1{
font-size:50px;
margin-left:950px;
margin-top:200px;
}

.title{
text-align:center;    
}

.buyone{
margin-left:450px;
font-size:55px;
margin-top:-400px;
}

header{
font-size:10px;  
margin-bottom:7px;
}

.topmilk{
margin-left:150px;
width:250px;
margin-top:200px;
}

.topneko{
margin-top:-1300px;
margin-bottom:300px;
width:250px;
}

.buyone{
font-size:25px;
margin-left:240px;
}}


@media (min-width: 1024px) and (max-width: 1366px) {
.hamburger span{
display:none;
}  



.topneko{
width:500px;
margin-top:-300px;
margin-bottom:0px;
}

.topboba{
margin-left:700px;   
width:500px;
margin-top:-300px;
} 

.topmilk{
margin-left:700px;
width:400px;
}
.orderbtn{
display:none;    
}

.tapi{
margin-top:-1300px;
margin-left:680px;
}

 .movingbg h1{
font-size:180px;
margin-left:300px;
}

.title{
text-align:center;    
}

.buyone{
margin-top:-300px;
font-size:40px;
right:-300px;
}

footer{
font-size:10px;    
}


.buyone{
font-size:40px;
margin-left:400px;
}}

@media screen and (min-width:1367px){
.hamburger span{
display:none;
}}