
body {
   margin:0px;
   font-family: sans-serif;
   display: grid;
   grid-template:
       "header" 80px
       "cont" 1fr
       "footer" 80px;

}
.sub-header{
   background-color: #f4af38;
   color: black;
   font-weight: bold;
   margin: 45px 0px 0px -10px;
   padding: 8px 0 0 10px ;
   display: flex;
   justify-content: space-around;
   font-size: 75%;
   height: 1.5rem;
   display: none;
}







.new_sub-header{
   display: grid;
   grid-template-columns:repeat(4,1fr);
   grid-template-rows: auto;
   grid-gap: 1px;
   font-size:medium;
   font-size: clamp(13px,1.5vw,16px);
   text-align: center;
   }

/*div.new_sub-header div:nth-child(1){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
   div.new_sub-header div:nth-child(2){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
   div.new_sub-header div:nth-child(3){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
   div.new_sub-header div:nth-child(4){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
   div.new_sub-header div:nth-child(5){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
   div.new_sub-header div:nth-child(6){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
    div.new_sub-header div:nth-child(7){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }
    div.new_sub-header div:nth-child(8){
      background-color: #f4af38;
      color: #000;
      padding: 6px 0px 5px 0px;
      }*/

/*計測用20240214奥島追加  */
.navigation-wrapper{
  background:#bc8a45;
}
.navigation{
  background-color: #f4af38;
  color: #000;
  padding: 0;
}
.navigation a{
  display: block;
  padding: 6px 0;
  text-decoration: none;
  transition : all 0.5s ease 0s;
}
/* ここまで */



/* topメニューリンク */
/* div.navigation a:hover{color:#000000;} 
div.navigation a:visited{color:#000000;} 
div.navigation a:link{color:#000000;} 
div.navigation a:active{color:#00ccff;}  */


.navigation a:visited{color:#000000;} 
.navigation a:link{color:#000000;} 
.navigation a:active{color:#00ccff;} 
/* .navigation a:hover{color:#000000;}  */
.navigation a:hover {
    color: #cf9310f8;
    background: #bbecf5;
  }







.header-kotei{
position: fixed;
width: 100%;
height: 74px;
z-index: 9999;
}

header{
   grid-area: header;
   color:#fff;
   height: auto;
}

aside{
   grid-area: sidebar;
   position: fixed;
   display: none;
}


main{
   background-color: #b971060a;   
grid-area: cont;
margin-top: 27px;
/* ↓こいつが横スクロールの原因？ */
/* padding: 5px; */
}

footer{
   grid-area: footer;
   color:#fff;
   text-align: center;
   font-size: small;


}




iframe{
   width: 100%;
   height: 440px;
   padding-top: 0;
}

.nemu-kotei{
position: fixed;
}

.yokonarabi-tantousha{
   display: flex;
   justify-content: center;
 }
.yokonarabi-top{
   display: flex;
   justify-content: space-between;
}

/* 2023追加 */
.item-container{
   padding: 0 10px;
}

.item-list{
   padding: 10px;
}
.item-list.flex{
display: flex;
flex-wrap: wrap;
gap: 24px;
}
.item-list a{
   display: inline-block;
   text-decoration: none;
}
.item-list a:hover{
   background: #fff;
}
.item-list h3{
   border:none;
   text-align:left;
   width: 98%;
   margin: 0 1%;
   color: #fff;
}
.place span{
display: inline-block;
top: 0;
left: 0;
min-width: 80px;
padding: 0 10px;
background: #f4af38;
border-radius: 15px;
color: #000;
text-align: center;
line-height: 1.8;
}

.item-list.flex .place{
   margin: 10px;
}

span.price{
   font-weight:bold;
   color: #ce1501;
}

.item{
   width: calc((100% - 30px) / 2); /* 2 items */
   background: #673201;
}

.item a:hover{
   background: #76481c;
}
@media not all and (min-width: 980px) {
   .item {
     width: 100%; /* Full width on screens wider than 768px */
   }
 }





 section div:nth-child(1){
   border-style: groove;
   border-color: #dddde8;
   background-image:url(../top/image/orei_mail_collage.png);
   
   }
   section div:nth-child(2){
   border-style: groove;
   border-color: #dddde8;
   background-image:  linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.2)),url(../top/image/kyounokabeana_button_background.jpg);
   }
   section div:nth-child(3){
   border-style: groove;
   border-color: #dddde8;
   background-image: url(../top/image/dokomade_tokusetu_gazou.jpg);
   background-size:cover;
   }
   section div:nth-child(4){
   border-style: groove;
   border-color: #dddde8;
   background-image: url(../top/image/jibunnde_tokusetu_gazou.jpg);
   background-repeat: no-repeat;
   background-size: cover;

   }

   section div a p{
      display: inline-block;
   }   


   .content_menu_button {
   display: grid;
   /* grid-template-columns: repeat(2, 1fr); */
   grid-template-columns: repeat(2, 1fr);

   grid-template-rows: auto;
   grid-gap: 10px;
   margin: 0px 5px 0px 5px;
   font-weight: bold;
   font-size: larger;
   text-align: center;
   }



@media (min-width: 768px){


   .yokonarabi{
     display: flex;
     justify-content: space-around;
   }

 body{
      font-family: sans-serif;
      width: 100%;
      max-width: 1400px;
      margin: auto;

      display: grid;
      grid-template:

       "header header header"80px
       "...... ...... ...... "10px
       "sidebar ...... cont"1fr
       "...... ...... ......"10px
       "...... footer footer"80px
      /220px 10px 1fr;
       /* / 220px 20px 1fr; */
   }
 header{
   width: 1400px;
    grid-area: header;
    color:#fff;
    /* padding: 0 10px; */
 }

 .header-kotei{
   position: fixed;
   max-width: 1400px;
   height: 78px;
   z-index: 9999;
   }



aside{
   grid-area: sidebar;
   margin:115px 0 0 0px;
   display: block;

}

 main{
   background-color: #b971060a;
    grid-area: cont;
    width:auto;
    padding: 10px;
    margin-top: -14px;
}
footer{
    grid-area: footer;
    color:#fff;
    width: 100%;
    height: 60px;
}

/* iframe{
   width: 100%;
   height: 500px;
   padding-top: 0;
} */

/* .sub-header{
   display:inline-block;
   width: 100%;
   background-color: #f4af38;
   color: black;
   margin: 46px 0px 0px 0px;
   padding-left: 0px;
   display: flex;
   justify-content: space-around;
   font-size: 100%;
   display: none;
} */

   .new_sub-header{
      display: grid;
      grid-template-columns:repeat(8,1fr);
      grid-template-rows: auto;
      font-size:medium;
      font-size: clamp(13px, 1.5vw, 16px);
      text-align: center;
      }

     /* div.new_sub-header div:nth-child(1){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;
      }
      div.new_sub-header div:nth-child(2){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
      div.new_sub-header div:nth-child(3){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
      div.new_sub-header div:nth-child(4){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
      div.new_sub-header div:nth-child(5){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
      div.new_sub-header div:nth-child(6){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
       div.new_sub-header div:nth-child(7){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }
       div.new_sub-header div:nth-child(8){
         background-color: #f4af38;
         color: #000;
         padding: 10px 0px 5px 0px;

      }*/
      .navigation a{
        padding: 10px 0;
      }




   /* section div:nth-child(1){
   background: #f58153;
   border-style: outset;
   border-color: aliceblue;
   }
   section div:nth-child(2){
   background: #f4af38;
   border-style: outset;
   border-color: aliceblue;
   } */
   /* section div:nth-child(3){
   background: #f4af38;
   border-style: outset;
   }
   section div:nth-child(4){
   background: #f4af38;
   border-style: outset;
   } */
   /* .content_menu_button {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   grid-template-rows: auto;
   grid-gap: 5px;
   font-weight: bold;
   font-size: larger;
   text-align: center;

   } */






}
