@charset "UTF-8";
/* CSS Document */
@media all and  (max-width:1900px){
	

}

@media all and  (max-width:1900px){
	
 .top .t-logo{
width:250px;		
}
.header_contact{
  width: 70%; 
}
	
  .greeting{
width: 80%;
} 
 .g-photo{
right:10px;
bottom: 5px; 
}  
  .greeting-box{
 padding: 100px 80px;     
}  
.btn3{
width: 150px;
display: block;
margin: 0 auto;
}  
}
@media all and  (max-width:1280px){
.top_slider{
    width: 100%;
    height: auto;
} 
.top_slider li .catch{
  position: absolute;
  top:50%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
  width: 100%;
  text-align: center; 
}    
    .tb{
        display: block;
    } 
.slider1 p{
font-size: 2.5em;   
}
.g-photo{
right: 25px;  
 bottom: 15px;    
} 
.container {
max-width:98%;
width: 100%;
margin: 0 auto;
text-align: center;	
padding: 0 2%;	
} 
.m1 a{	
font-size:0.9em;	
}
  .contact1 a{
font-size:1em;    
}

.contact1 p{
 font-size:1em;       
} 
.flex2{
width: 90%;
} 
 .btn2{
width: 90%;
}
.contents-box{
width: 100%;
height: auto;
display: flex;    
flex-wrap:wrap;
justify-content:flex-start;
align-items:center; 
}    
 .contents{
width:calc(100% / 3);     
}  
}

@media all and  (max-width:980px){
  .top-text{
  width: 80%;      
}    
     .sp_l{
    text-align: left;    
    }    
.flex2{
width: 100%;
}
     
.contact-t strong{
 font-size: 1.5em;   
}    
.top .top-contact .t-tel a{
font-size: 1.2em; ;   
}  
.top .top-contact .t-tel a{
font-size: 1em; 
}

.top .top-contact .t-mail a{
font-size: 1em;  
}
  .top .t-logo{
width:150px;		
}
 .header_contact{
  width: 75%; 
} 
    
 .m1 ul{
justify-content:space-around;	
}   
 .m1 ul .b1{
padding-left: 0;   
}
.m1 a{
font-size: 0.8em;
letter-spacing: 0px;	
}  
 .m1 .nav_ts{
font-size: 0.7em;    
}  
  .greeting-box{
 padding: 50px 10px;     
}     
 .text1{
font-size: 1em;     
}
.text1 strong{
font-size: 1.3em; 
display: block;
}

.btn .btn_text{    
font-size:0.8em;
padding: 1%;  
}   

 .greeting{
width: 100%;
}
.g-photo{
width: 100%;
position:static;
margin-top: 5%;    
}  

 .timeline {
  list-style: none;
width: 90%;
display: block;
margin: 0 auto;
}    

}


@media all and  (max-width:750px){

  .text1{
font-size: 0.9em;     
}       
    .text3{
    font-size: 1.1em;    
    }
  .top .t-logo{
width:150px;		
}    
    .child_1 {
       order: 1; 
    }
        .child_2 {
       order: 2; 
    }
 .midashi p{  
font-size:1.6em;		  
}
.midashi2 p{  
font-size:1.6em;	     
}

    .kaigyo{
    display: block;    
    }    
.slider {
  position   : relative;
  max-width  : 100%;
  height     : 300px;
  margin     : auto;
  overflow   : hidden;
}
.slider1 p{
font-size: 1.8em;  
top: 50%;    
}
    .slider1{
  width: auto;
    height: 80px!important;
    
}
.fullscreenmenu{
display:block;
}   
 .g-text{
width: 100%;  
display: block;
margin: 0 auto;    
} 
.top .top-contact,.m1{
    display: none;
    }
.flex-box{
width: 100%;     
}
.contents{
width:calc(100% / 2); 
    }
   
.con-box{
width: 90%;   
}
.contact1{ 
width:70%;
margin: 1%;    
} 
.menu-table table{
width: 98%;
} 
.menu-table th{  
font-size: 0.9em;       
}
.menu-table td{  
font-size: 0.9em;       
}    
.timeline > li {
  margin-bottom: 20px;   
}
  .timeline-content h3{
font-size: 1em;
      color:#F2994B;
  }    
  .timeline-content p{
font-size: 0.75em;
  }
.obento_photo{
  width: calc(100% / 2) ;     
}     
.cafe_photo{
  width: calc(100% / 2) ;      
}    
.handmade_photo{
width: calc(100% / 2)    
}
    .contact-box img {
    width: 80%;
    display: block;
    margin: 0 auto;
    }   
 .contact-box .footer-text strong{
font-size: 0.8em;
    line-height: 1.5; 
} 
.contact-t{
    width:100%;
 
}   
.contact-t p{
margin: 2% 0 5%;
}  
.contact-t a{
font-size: 1em; 
transition: all 0.5s;
padding: 2%;  
color: #FFF;    
position:static;
  top: 0;
  left: 0;
  -webkit-transform : translate(-0%,-0%);
  transform : translate(-0%,-0%);
  width:100%;
  text-align: center;/*一応BOX内の文字も中央寄せ*/      
border-radius: 30px;   
background:#F2CF66;    
display: block;    
} 
    .table1 table{
    width: 100%;    
    }
.table1 table th{
width: 100%!important;
display: block!important;   
padding: 2%;    
}

.table1 table td{
width: 100%!important;
display: block!important;       
}   
textarea{
height: 200px
}   
.map iframe{
height: 200px;
}  
.timeline-content img{
width: 90%;
display: block;
margin: 0 auto;
}     
}
@media all and  (max-width:450px){	
  .text2{
font-size:0.7em; 
}

}