@charset "UTF-8";
/*
 * reset.css
 *
 *  version --- 1.0
 *  updated --- 2023/01/3
 */




/* -----------------------------------------------------
     wrap
-------------------------------------------------------- */
.nowrap {
     white-space: nowrap;
     
}


/* ------------------------------------------------------
     margin
--------------------------------------------------------- */
.m00 {margin: 0px;}
.m10 {margin: 10px;}
.m20 {margin: 20px;}
.m30 {margin: 30px;}
.m40 {margin: 40px;}
.m50 {margin: 50px;}



.mt00 {margin-top: 0px;}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mt50 {margin-top: 50px;}

.mb00 {margin-bottom: 0px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}

.mr00 {margin-right: 0px;}
.mr10 {margin-right: 10px;}
.mr20 {margin-right: 20px;}
.mr30 {margin-right: 30px;}
.mr40 {margin-right: 40px;}
.mr50 {margin-right: 50px;}


.ml00 {margin-left: 0px;}
.ml10 {margin-left: 10px;}
.ml20 {margin-left: 20px;}
.ml30 {margin-left: 30px;}
.ml40 {margin-left: 40px;}
.ml50 {margin-left: 50px;}




/* -----------------------------------------------------
     padding
-------------------------------------------------------- */
.p00 {padding: 0px;}
.p10 {padding: 10px;}
.p20 {padding: 20px;}
.p30 {padding: 30px;}
.p40 {padding: 40px;}
.p50 {padding: 50px;}


.pt00 {padding-top: 0px;}
.pt10 {padding-top: 10px;}
.pt20 {padding-top: 20px;}
.pt30 {padding-top: 30px;}
.pt40 {padding-top: 40px;}
.pt50 {padding-top: 50px;}

.pb00 {padding-bottom: 0px;}
.pb10 {padding-bottom: 10px;}
.pb20 {padding-bottom: 20px;}
.pb30 {padding-bottom: 30px;}
.pb40 {padding-bottom: 40px;}
.pb50 {padding-bottom: 50px;}

.pr00 {padding-right: 0px;}
.pr10 {padding-right: 10px;}
.pr20 {padding-right: 20px;}
.pr30 {padding-right: 30px;}
.pr40 {padding-right: 40px;}
.pr50 {padding-right: 50px;}


.pl00 {padding-left: 0px;}
.pl10 {padding-left: 10px;}
.pl20 {padding-left: 20px;}
.pl30 {padding-left: 30px;}
.pl40 {padding-left: 40px;}
.pl50 {padding-left: 50px;}


/* ---------------------------------------------------
     border-radius
------------------------------------------------------ */
.br10 {border-radius: 10px;}
.br20 {border-radius: 20px;}
.br30 {border-radius: 30px;}
.br40 {border-radius: 40px;}
.br50 {border-radius: 50px;}


/* -----------------------------------------------------
     width
--------------------------------------------------------*/
.w10 {width: 10%;}
.w20 {width: 20%;}
.w30 {width: 30%;}
.w40 {width: 40%;}
.w50 {width: 50%;}
.w60 {width: 60%;}
.w70 {width: 70%;}
.w80 {width: 80%;}
.w90 {width: 90%;}
.w100 {width: 100%;}



/* ------------------------------------------
     height
--------------------------------------------- */
.h10 {height: 10%;}
.h20 {height: 20%;}
.h30 {height: 30%;}
.h40 {height: 40%;}
.h50 {height: 50%;}
.h60 {height: 60%;}
.h70 {height: 70%;}
.h80 {height: 80%;}
.h90 {height: 90%;}
.h100 {height: 100%;}

/* --------------------------------------------------------
     text-align
-------------------------------------------------------- */
.tac {text-align:center;}
.tar {text-align:right;}
.tal {text-align:left;}


/* --------------------------------------------------------
     border-radius
-------------------------------------------------------- */
.br10 {border-radius: 10px;}
.br20 {border-radius: 20px;}
.br30 {border-radius: 30px;}
.br40 {border-radius: 40px;}
.br50 {border-radius: 50px;}
.br80 {border-radius: 80px;}


/* --------------------------------------------------------
     sp-only pc-only
-------------------------------------------------------- */
/*@media (min-width: 1024px) {
  .tabletOnly {
    display: none; 
  }
  .sp-Only {
  display: none;
  }
}*/

/* ----------------------------------------------
     756px以下の画面で適用
-------------------------------------------------*/
@media screen and (max-width: 768px){
     /*.pc-Only {
       display: none;
     }*/
     .mobile-scroll {
       white-space: nowrap; /* 折り返されないように */
       overflow-x: auto; /* 横スクロール */
       -webkit-overflow-scrolling: touch; /* スマホでスムーズにスクロールできるように */
     }
   }

   .flex {
     display: flex;
   }
   

   .credit {
     background-color:#ebebeb78;
     height: 80px;
     align-items: center;
   }


  .card-img-p {
     position: absolute; top:50%;
     left:50%;
     transform: translate(-50%,-50%);
     padding:0;
     margin:0;
     font-size:30px;
     color: blue;
  }





  /* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
     .xs-br {
          display:initial;
     }

     .s-br {
          display:none;
     }

     .m-br {
          display:none;
     }

     .l-br {
          display:none;
     }

     .xl-br {
          display:none;
     }

     
 }

  /* X-Small devices (portrait phones, less than 576px) 
 Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 
     .xs-br {
          display:none;
     }
     
 }

 /* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { 
     .xs-br {
          display:none;
     }
 }

 /* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) { 
     .xs-br {
          display:none;
     }
 }

 /* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) { 
     .xs-br {
          display:none;
     }

     
 }

 /* XX-Large devices (larger desktops)
 No media query since the xxl breakpoint has no upper bound on its width */


/* ----------------------------------------------
     Font Awesome 5 Free
-------------------------------------------------*/
.check {
     font-family:"Font Awesome 5 Free";
     font-weight: 900;
     content:"\f560";
}

.house-chimney {
     font-family:"Font Awesome 5 Free";font-weight: 900;content:"\e3af";
}

.graduation-cap {
     font-family:"Font Awesome 5 Free";font-weight: 900;content:"\f19d";
}



/* ---------------------------------------------------
     heading
------------------------------------------------------ */
.h1 {

}

.h2 {
     padding: 0.5em;/*文字周りの余白*/
     color: #494949;/*文字色*/
     background: #F7F7F7;/*背景色*/
     border-left: solid 7px  blue;/*左線（実線 太さ 色）*/ 

}

.h3 {
     padding: 0.5em;/*文字周りの余白*/
     color: #494949;/*文字色*/
     background: #F7F7F7;/*背景色*/
     border-left: solid 6px  blue;/*左線（実線 太さ 色）*/
   }

 .h4 {
     padding: 0.4em;/*文字周りの余白*/
     color: #494949;/*文字色*/
     border-left: solid 5px blue;/*左線（実線 太さ 色）*/
 } 
 
 .h5 {
     /*padding: 0.4em;文字周りの余白*/
     color: #494949;/*文字色*/
     /*border-left: solid 4px blue;左線（実線 太さ 色）*/
 }

 .h6 {
     padding: 0.4em;/*文字周りの余白*/
     color: #494949;/*文字色*/
     border-left: solid 3px blue;/*左線（実線 太さ 色）*/
 }


 /* ---------------------------------------------------
     font-weight
------------------------------------------------------ */