@charset "utf-8";
/* ｃｓｓリセット */
html,body,h1,h2,h3,p,ul,ol,li,dl,dt,dd,table,tr,th,td {
    margin:0;
    padding:0;
    font-family:"Hiragino Kaku Gothic ProN",Meiryo, sans-serif;
    line-height:1.0;
    }
    ul,ol{ 
    list-style:none;
    }
    a{
    text-decoration:none;
    color:inherit; 
    }
    img{
    border:none;
    max-width: 100%;
    height: auto;
    display: block;
    }
    table{
    border-collapse: collapse;
    }

    h1,h2,h3,p,ul,ol,li,dl,dt,dd,table,tr,th,td{
        font-family: 'Shippori Mincho B1', serif; 
    }

/* ヘッダー */

h1{
    padding: 30px 0 40px 150px;
    font-size: 2.3em; 
       background: url(../img/shop/logo.png) no-repeat;
       background-position: 85px 24px;
}

 


#history .head,#wagasi .head,#shop .head{
      border-bottom: 1px solid #000;
     
}



 /* ナビ */
 .spnav,.btn{
    display: none;
 }
 .pcnav ul{
     display: flex;
     position: absolute;
     top:60px;
     right: 10%;
     font-size: 1.3em;
    
 }
 .pcnav li{
    font-weight: bold;
    
 }

 .navbar{
     margin: 0 10px;
 }
 .head{
     display: flex;
 }
 .pcnav p{
     font-weight: bold;
 }
 .pcnav a{
     display: block;
     padding: 0 0 5px;
     border-bottom: 1px solid transparent;
     transition: 300ms;
 }
 .pcnav a:hover{
     border-bottom: 1px solid #000;
 }


 /* HOME */

 /* キービジュアル */
 #home .keyVis img{
     width: 100%;
    /* height: 80vh; */
     margin-bottom: 80px;
 }

/* main */

#home main section{
    display: flex;
    justify-content: center;
        
}
#home main{
    background: url(../img/900_700.jpg) no-repeat center/cover;
    padding: 80px 40px; 
    
}
#home main section{
    margin-bottom: 50px;
}


#home  main section:last-child{
    margin-bottom: 0;
}
#home main .txt1{
    text-align: center;
    margin-left: 40px;
    background: url(../img/600_350_test2.png) no-repeat center/cover;
    /* max-width: 600px; */
    width: 50%;
   /* height: auto; */
}

#home main .txt1 h2{
    padding:30px 0 20px;
    font-size: 1.8em;
}
#home main .txt{
   padding: 0 40px;
   padding-bottom: 3em;
   font-size: 1.2em;
   line-height: 1.5;
   text-align: left;
}
#home main .more{
    padding-bottom: 50px;
}

#home main .more a{
    /* display: inline; */
    padding: 15px 35px;
     border: 1px solid #000;
     font-size: 1.4em;   
     transition: 400ms;
     
}
#home main .red a:hover{
    background: url(../img/aka2.png);
    color: rgb(182, 178, 178);
    border: none;
}
#home main .blue a:hover{
    background: url(../img/ao.png);
    color: rgb(194, 187, 187);
    border: none;
}
#home main .murasaki a:hover{
    background: url(../img/murasaki.png);
    color: rgb(202, 197, 197);
    border: none;
}







/* 下の和菓子 */
/* #home  aside h2{
    font-size: 2em;
    padding: 50px 0 20px 80px;
} */

#home h3{
    padding: 15px 0 10px;
    font-size: 1.5em;
    
}

#home .wagasi{
    display: flex;
    justify-content: center;
    margin: 0 50px 80px;
}

#home .wagasi section{
    text-align: center;
}
#home .wagasi section+section{
    margin-left: 90px;
}

#home .wagasi .wagasi_txt{
    line-height: 1.4;
    font-size: 1em;
    /* text-align: left; */
}


/* 歴史 */

#history h2,#wagasi h2,#shop h2,#home h2{
    font-size: 1.8em;
    padding: 20px 0 20px 80px;
}
#history section{
    display: flex;
    justify-content: center;
}
/* #history img{
    max-width: 600px;
} */
#history main .txt p{
    line-height: 1.5;
    font-size: 1.2em;
    
}
#history .txt h3{
    font-size: 1.5em;
    padding: 10px 0 20px;
}
#history main .txt{
    max-width: 50%;
    /* max-height: 400px; */
    margin-left: 50px;
    background: rgba(255, 255, 255, 0.7);
    padding: 30px 30px 50px ;
   
}
#history section+section{
    margin-bottom: 60px;
}
#history section:first-of-type{
    margin-bottom: 60px;
}
#history .container{
    padding: 40px 50px;
    background: url(../img/5152666_l.jpg) center/cover;
}

/* 和菓子 */

#wagasi .photo_img1,#wagasi .photo_img2,#wagasi .photo_img3{
    max-width: 500px;
    /* width: 100%; */
    margin: 30px 0 60px;
}

#wagasi .photo_img1 .photo1,#wagasi .photo_img2 .photo2,#wagasi .photo_img3 .photo3{
    margin-bottom: 30px;
}

#wagasi .photo_img1 ul,#wagasi .photo_img2 ul,#wagasi .photo_img3 ul{
    display: flex;
    justify-content: space-between;
    max-width: 445px;
    margin: 0 auto;
}

#wagasi .photo_img1 li,#wagasi .photo_img2 li,#wagasi .photo_img3 li{
    width:calc(100% / 3 - 15px);
}

#wagasi section{
    display: flex;
    justify-content: center;
    background: url(../img/5152666_l.jpg) center/cover;
    padding: 10px 30px ;
    margin-bottom: 60px;
  
   
}
#wagasi section .txt{
    background:rgba(255, 255, 255, 0.7);
    /* max-height: 353px; */
    max-width: 50%;
    margin: 30px 40px 60px 30px;
   
}
#wagasi section h3{
    padding: 30px 40px 20px;
    font-size: 3em;
    /* font-family: 'New Tegomin', serif; */
}
#wagasi section p{
    font-size: 1.6em;
    line-height: 1.5;
    padding:0 30px 50px;
}
/* wagasi */
#wagasi .wagasi{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
    background: url(../img/small.jpg) no-repeat right center;
}
#wagasi .wagasi .pt img{
   margin: 40px;
   /* max-width: 500px; */
}
#wagasi .wagasi .tx p{
    padding:40px;
    font-size: 1.4em;
    line-height: 1.5;
    color: rgb(26, 25, 25); 
    
   
}
#wagasi .wagasi .tx{
    background: url(../img/600_350_test2.png) center/cover; margin-right: 40px; 
}




/* 店舗案内 */

#shop .container{
    display: flex;
    justify-content: center;
    padding:40px 60px;  
    
    background: url(../img/900_700.jpg) left top/cover;
    margin-bottom: 60px;
}
#shop table{
    text-align: center;
    margin-right: 40px;  
}
#shop table th,#shop table td{
    padding: 20px 40px;
    font-size: 1.3em;
    line-height: 1.5;
   background: url(../img/600_350_test2.png);
}

#shop table span{
    font-size: 0.9em;
}

#shop iframe{
    width: 50vh;
    height: 50vh;
}
#shop .slider img{
    width: 100%;
}

    






/* フッター */
footer{
    background: rgb(68, 62, 62);
    color: #fff;
   
}
.ft{
    display: flex;
    justify-content: space-between;
}
.copy{
    text-align: center;
    padding: 5px;
    font-family: none;
}
footer .txt{
    padding: 20px;
    margin-left: 100px;
    
}
.f_nav{
    margin: 30px 180px 0 20px;
}
.f_nav li+li{
    margin-bottom: 12px;
}
.f_nav li:first-child{
    margin-bottom: 12px;
}
footer .ft .title{
    font-size: 1.5em;
    padding: 20px 0;  
   
}
.f_nav p{
    padding: 0 20px;
    
}

.f_nav li{
    padding: 0 0 5px 0;
    border-bottom: 1px solid transparent; 
    transition: 300ms; 
    
}
.f_nav li:hover{
    border-bottom: 1px solid #fff;  
}


/* タブレット表示 ヘッダー フッター和菓子*/
@media screen and (max-width:1027px){

h1{
    font-size: 2em;
    background-position: 85px 21px;
}
.pcnav ul{
     font-size: 1.2em;
}
footer .txt{
    margin-left: 70px;
}
.f_nav{
    margin: 30px 140px 0 20px;
}

#wagasi section .txt{
    margin: 30px 0 40px 30px;
   
}
#shop iframe{
    width: 40vh;
    height: 40vh;
  
}

}

@media screen and (max-width:938px){
h1{
    font-size: 1.8em;
    background-position: 85px 19px;
}
.pcnav ul{
    font-size: 1em;
}
footer .txt{
    margin-left: 50px;
}
.f_nav{
    margin: 30px 100px 0 20px;
}
#wagasi section p{
    font-size: 1.5em;  
}
#shop iframe{
    width: 30vh;
    height: 30vh;
  
}

}
@media screen and (max-width:829px){
    .pcnav ul{
        margin-top: 10px;
    } 
    #wagasi section p{
        font-size: 1.4em;  
    }

}
/* タブレット表示　HOME */
@media screen and (max-width:960px){
    #home main .txt1{
        width: 60%;
    }
    #home main section img{
        width: 70vh;
    }
    #home .keyVis img{
        margin-bottom: 40px;
    }
}
/* タブレット表示　hisrory */
@media screen and (max-width:960px){
    #history main .txt{
        margin-left: 25px;
    }
    /* タブレット表示 和菓子*/
    #wagasi .photo_img1,#wagasi .photo_img2,#wagasi .photo_img3{
        width: 100%;
           margin: 30px auto 30px;
       }
       
       #wagasi .photo_img1 .photo1,#wagasi .photo_img2 .photo2,#wagasi .photo_img3 .photo3{
           margin-bottom: 0;
       }
       
       #wagasi .photo_img1 ul,#wagasi .photo_img2 ul,#wagasi .photo_img3 ul{
           max-width: 445px;
           margin: 0 auto;
       }
} 
@media screen and (max-width:943px){
        #wagasi .wagasi .tx p{
            font-size: 1.3em;
            padding: 35px;
        }
    }

@media screen and (max-width:915px){
    #wagasi .wagasi .tx p{
        font-size: 1.2em;
        padding: 25px;
    }
   
}


/* タブレット表示　shop */
@media screen and (max-width:903px){
    #shop table th,#shop table td{
        font-size: 1.2em;
    }
}
@media screen and (max-width:878px){
    #shop table th,#shop table td{
        font-size: 1.1em;
    }
}
@media screen and (max-width:864px){
    #shop .container{
        display: block;
        padding:20px;  
        margin-bottom: 40px;
    }
    #shop table{
        text-align: center;
        margin-right:0; 
        margin-bottom: 20px; 
        margin: 0 auto 20px;
    }
    #shop table th,#shop table td{
        padding: 15px 20px;
        font-size: 1.3em;
      
    }
    
    #shop iframe{
        width: 40vh;
        height: 30vh;
      
    }
    #shop .map{
        text-align: center;
    }
}
/* スマホ表示 */
@media screen and (max-width:767px){
   /* ヘッダー */
   h1{
       font-size: 1.5em;
       padding: 20px 0 20px 75px;
       background-position: 13px 8px;
   }
   
   #history h2,#wagasi h2,#shop h2,#home h2{
    font-size: 1.8em;
    padding: 20px;
    text-align: center;
}


   /* ナビ */
   .pcnav{
       display: none;
   }
   .btn{
     display: block;
     position: absolute;
    top: 17px;
    right: 15px;
    font-size: 35px;
    height: 35px;
    width: 35px;
    overflow: hidden;
   }
   .btn_open i:first-child{
      display: none;
   }

 
   .spnav{
       display: block;
       position: fixed;
       width: 100%;
       z-index: 99999;
       top: 64px;
       left: 100%;
       opacity: 0;
       transition: 300ms;
   }
   .spnav li{
       font-size: 1.8em;
       line-height: 70px;
       text-align: center;
       font-weight: bold;
       color: rgb(49, 48, 48);
       border-bottom: 2px solid rgba(49, 48, 48, 0.7);
   }
   .spnav li:last-child{
       border: none;
   }
   .sp_slide{
       left:0;
       opacity: 1;
   }
   .spnav a{
       display: block;
       background: url(../img/5152666_l.jpg) center/
       cover;
       
      
   }

   /* home */
   #home .keyVis img{
       margin-bottom: 0;
       height:auto;
   }
   #home main section{
       display: block;
   }
   #home main{
    background: url(../img/900_700.jpg) no-repeat right/cover;
    padding: 40px 20px;
}
    #home main section{
        margin-bottom: 30px;
    } 
    #home main section img{
        width: 100%;
    }
    #home main .txt1{
        width: 100%;
        margin-left: 0;
    }
    #home main .txt1 h2{
        padding:20px 0 15px;
        font-size: 1.5em;
    }
    #home main .txt{
        padding: 0 20px;
        padding-bottom: 3em;

        font-size: 1.2em;
        line-height: 1.5;
    
     }
     #home main .more a{
         padding: 20px 50px;
     }
     #home .wagasi{
         display: block;
         margin: 0 25px 40px;
     }
     #home .wagasi section+section{
         margin-left: 0;
     }
     #home .wagasi section{
         margin-bottom: 30px;
     }
     #home .wagasi section img{
         width: 100%;
     }

     /* #home main .red a:hover,#home main .blue a:hover,#home main .murasaki a:hover{
        background: none;
        color: #000;
        border: 1px solid #000;
    } */

     /* history */
     #history section{
         display: block;
     }
     #history section img{
         width: 100%;
         margin-bottom: 15px;
     }
     #history main .txt{
        max-width: 100%;
        margin-left: 0;
        padding: 20px 20px 30px ;
     }
     #history .container{
        padding: 30px 25px 10px;
    }
    #history section+section{
        margin-bottom: 40px;
    }
    #history section:first-of-type{
        margin-bottom: 40px;
    }
    /* 和菓子 */
    #wagasi section{
        display: block;
        padding: 10px 0 25px;
        margin-bottom: 40px;
    }
    #wagasi section .txt {
        max-width: 500px;
        margin: 0 auto;  
    }
    #wagasi section h3{
        padding: 20px 0 15px;
        font-size: 2em;
        text-align: center; 
    }
    #wagasi section p{
        font-size: 1.2em;
        padding:0 20px 20px;
    }
    /* wagasi */
#wagasi .wagasi{
    display:block;
    margin-bottom: 40px;
}
#wagasi .wagasi .pt img{
margin: 0 auto 20px;

}
#wagasi .photo_img1 li:first-child,#wagasi .photo_img2 li:first-child,#wagasi .photo_img3 li:first-child{
    margin-left: 20px;
}
#wagasi .photo_img1 li:last-child,#wagasi .photo_img2 li:last-child,#wagasi .photo_img3 li:last-child{
    margin-right: 20px;
}
#wagasi .photo_img1 li,#wagasi .photo_img2 li,#wagasi .photo_img3 li{
    width:100%;
}



#wagasi .wagasi .tx{
  margin-right: 0; 
}
#wagasi .wagasi .tx p{
    padding:30px;
}

#wagasi .photo_img1,#wagasi .photo_img2,#wagasi .photo_img3{
 width: 100%;
    margin: 30px auto 30px;
}

#wagasi .photo_img1 .photo1,#wagasi .photo_img2 .photo2,#wagasi .photo_img3 .photo3{
    margin-bottom: 0;
}

#wagasi .photo_img1 ul,#wagasi .photo_img2 ul,#wagasi .photo_img3 ul{
    max-width: 445px;
    margin: 0 auto;
}
/* 店舗 */

/* フッター */
footer .txt{
    padding: 20px;
    margin-left: 0
    
}
.f_nav{
    margin: 20px 50px 0 20px;
}
.f_nav li+li{
    margin-bottom: 12px;
}
.f_nav li:first-child{
    margin-bottom: 12px;
}
footer .ft .title{
    font-size: 1.3em;
    padding: 20px 0;  
   
}
.f_nav li{
    font-size: 0.8em;
}


}

@media screen and (max-width:359px){
    footer .ft .title{
        font-size: 1em;  
    }
}


@media screen and (max-width:325px){
    .btn{
       top: 17px;
       right: 8px;
      }
}