html {
    font-size: 62.5%;
   font-family:  "ヒラギノ角ゴ Pro W3";
  }
  body {
  max-width: 800px;
   margin: auto;
   
  }
  
 
.topheader{
    text-align: center;
}

.map{
  text-align: center;
  width :  30%;
}


textblue_25{
    
      font-weight:bold;
      font-size: 1.8rem;
      color: rgb(6, 106, 255);
      
    } 
    
    textpink_25{
    
      font-weight:bold;
      font-size: 2rem;
      color: rgb(243, 10, 138);
      
    } 




.motimono {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 20px;
  list-style: none;/*ドット消す*/
  /* .listCard に flex を指定し、子要素を横並びにする。
  wrapで折り返しできるようにする。gapで子要素間にマージンを設ける。*/
}
.motimono__item {
  width: calc(100% / 3 - 20px);
 /* background: rgb(100, 168, 231);*/
  /* width: calc(最大横幅 / 一行に残したい個数 - gapで横に指定した数値);*/
  text-align: center;
}
.motimono__item a {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px 20px 20px;
  /* .listCard__item に flex を指定し子要素を横並びにしますが、
  column を指定して子要素に横幅を持たせ改行されないようにします。*/
}
.motimono img{
  width :  80%;
}
.motimono p{
  font-size: 1.4em;
}




.card1to2 {
  display: flex;
  flex-wrap: wrap;
 margin: 2%;
  gap: 10px 10px;
  list-style: none;/*ドット消す*/
   /* .listCard に flex を指定し、子要素を横並びにする。
       wrapで折り返しできるようにする。gapで子要素間にマージンを設ける。*/
    }
  .card1to2_item {

    width: calc(100% / 2 - 10px);
    margin: 0px;
    /*background: #FF0000;*/
    /* width: calc(最大横幅 / 一行に残したい個数 - gapで横に指定した数値);*/
  }

    .card1to2 img{
     width :  90%;
    }

    .card1to2 p{
      font-size: 1.2em;
    }
  
  
  
  
  
  
  
  
  
  
  .listCard {
    text-align: center;
    flex-wrap: wrap;
    gap: 20px 20px;
    list-style: none;/*ドット消す*/
    display: flex;
    padding: 1%;
    /* .listCard に flex を指定し、子要素を横並びにする。
    wrapで折り返しできるようにする。gapで子要素間にマージンを設ける。*/

  }
  .listCard .listCard__item {
    width: calc(100% / 3 - 20px);
  
    /* background: #42e9c5;*/
 
    /* width: calc(最大横幅 / 一行に残したい個数 - gapで横に指定した数値);*/
  }
  .listCard .listCard__item a {
    display: flex;
    flex-direction: column;
    height: 100%;
   /* padding: 10px 20px 20px;*/
  
    /* .listCard__item に flex を指定し子要素を横並びにしますが、
    column を指定して子要素に横幅を持たせ改行されないようにします。*/
  }
  .listCard .btn {
    display: block;
    text-align: center;
    margin: auto auto 0;
    padding: 6px 28px;
    color: #fff;
    background: #444;
    box-shadow: 0 3px 5px rgb(0 0 0 / 50%);
    border-radius: 50px;
    /* margin-topに auto を指定することで下揃えになります。*/
  }
 

  .listCard img{
    display: block;
    margin:auto;
    
  }
　
  .box15 p {

    margin: 0; 
   padding: 0;
   font-size:1.8rem;
   font-weight: bold;
   color: rgb(22, 8, 223);
   }




  .box10 {
    
    height: auto;
    padding: 0.5em 1em;
   
    margin: 2em 0;
    color: #d1d1d1;
    background: #FFFFFF;/*背景色*/
    border-top: solid 1px #dadada;
    box-shadow: 0 3px 4px #75757552;/*影*/
}
.box10 p {
    margin: 0; 
    padding: 0;
    color: #000000;
    height: 150;
  }

.box10 h2{
  text-align: center;
  color: #2500f7;
}

.kakomi_box4 {
  margin: 0em auto;
  padding: 1em;
  width: 90%;
  background-color: #f7f7f7; /* 背景色 */
  box-shadow: 0 0 5px 1px #ccc; /* 影 */
 }

 .kakomi_box4 p{
  font-size: 1.5rem;
}

.kakomi_box_head {
  text-align: center;
  margin: 0em auto;
  padding: 1em;
  width: 90%;
 /* background-image: url("kabe.jpeg");*/
  
  background-color: #d9f4fc; /* 背景色 */
  box-shadow: 0 0 5px 1px rgb(16, 90, 228); /* 影 */
 }

 .kakomi_box_head p{
  color: rgb(4, 94, 211);
  font-size: 1.5rem;
  font-weight: bold;
}
policy{
  margin: 1em ;
  font-size: 1.6rem;	
  font-weight: bold;
  color: rgb(250, 16, 8); 
}

setumei p{
  font-size: 1.4rem;	
}





/* -----------------------------------------

スマホ用
-------------------------------------------- */
  @media not all and (min-width: 768px) {
    .listCard .listCard__item  {
      width: calc(100% / 2 - 10px);
      margin: 0px;
    /*  width: 80%;
      margin: 2%;
    text-align: center;*/
    }
    
    
    
    
    .motimono {
      display: flex;
      flex-wrap: wrap;
      margin: 2%;
      gap: 10px 10px;
      list-style: none;/*ドット消す*/
      /* .listCard に flex を指定し、子要素を横並びにする。
      wrapで折り返しできるようにする。gapで子要素間にマージンを設ける。*/
    }
    .motimono__item {
     
      width: calc(100% / 2 - 10px);
      margin: 0px;
      /*background: #FF0000;*/
      /* width: calc(最大横幅 / 一行に残したい個数 - gapで横に指定した数値);*/
    }
    
    .motimono img{
      width :  90%;
    }
  
     .motimono p{
     font-size: 1.2em;
      }

      .card1to2 {
      display: flex;
      flex-wrap: wrap;
     margin: 2%;
      gap: 10px 10px;
      list-style: none;/*ドット消す*/
       /* .listCard に flex を指定し、子要素を横並びにする。
           wrapで折り返しできるようにする。gapで子要素間にマージンを設ける。*/
        }
      .card1to2_item {
 
        width: calc(100% / 1 - 10px);
        margin: 0px;
        /*background: #FF0000;*/
        /* width: calc(最大横幅 / 一行に残したい個数 - gapで横に指定した数値);*/
      }

        .card1to2 img{
         width :  70%;
        }

        .card1to2 p{
          font-size: 1.2em;
        }

  }
 

  

 
 
 