
.header_container{

    display: grid;
    grid-template-areas:
    "header_button_menu header_rogo header_button_cart"
    ;
    grid-template-columns:  1fr 8fr 1fr;
    align-items: center;

    position: fixed;
    width: 100%;
    max-width: var(--container-width);
    height: 64px;
    margin: 0 auto;
     padding: 0 var(--container-pad);

     box-shadow: 0px 5px 10px -3px rgba(10,10,10,0.1), -10px -10px 10px 0px rgba(10,10,10,0.02);
     
 }
 .header_rogo{

    justify-self:center;
 
 }
 .header_button_menu{

    justify-self:start;
 
 }

 .drawer-close{
   display: none;

   width: 100%;
   height: 100%;
   position: fixed;
   background: rgba(94, 94, 94, 0.5);
  backdrop-filter: blur(4px);
  z-index: 3;

 }
 .drawer-close.is-fixed{
   

 }



.footer_container {
    display: grid;
    grid-template-areas:
    "footer_list_other"
    "footer_list_sns"
    "footer_rogo"
    "footer_copywrite"
  ;
  grid-template-columns: 100% ;
   justify-content: space-between;
     justify-content: center;

     width: 100%;
     max-width: var(--container-width);

     margin: 0 auto;
     padding: 0 var(--container-pad);
 }


.footer_list_other > ul{
    display: flex;
    flex-flow: column wrap;
    justify-content: flex-start;
    padding: 2rem 0 0 0;
 
 }
 .footer_list_other > ul > li{
    height: 34px;
 
 
 }
 .footer_list_other li + li {
    border-left: inherit;
 }
 .footer_list_sns > ul{
    display: flex;
     flex-flow: row nowrap;
     justify-content: center;
 
     & li{
 
 
     }
 
 }
 .footer_rogo{

    position: relative;
    width: 100vw;
left: 50%;
transform: translateX(-50%);
    background: #fff;
    padding:3.8rem 0 1rem 0;
    text-align: center;
    & img{
        width: 150px;
    }
 }
 .footer_copywrite{
    position: relative;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    padding: 0 0 1rem 0;
    justify-content: center;
}