@charset "UTF-8";
body {position:relative;
  line-height: 1.7; color:black;
  font-family: serif;background-color:#DAC9A6;
overflow-x:hidden;}
  .logo{
    max-width: 40%;
    padding-left: 55%;
    padding-bottom: 5%;
  }
  a:hover{color:#0F2540;}
  .sub-menu a:hover{color:#0F2540;}
  .main-nav li a:hover{color:#0C4842;}
img{
  max-width: 100%;
}
a{text-decoration:none;}
.page-title{text-align:center;}
.sub-title{text-align: center;}



.header{
  justify-content: space-between;
  padding: 10px;
  background: #fff;
}
   /*header --------------*/
.drawer_hidden{
  display: none;
}
.drawer_open{
  display: flex;
  height: 40px;
  width: 80px;
  align-items: flex-end;
  z-index: 100;
  cursor: pointer;
}

.drawer_open span,
.drawer_open span:before,
.drawer_open span:after{
  content: '';
  height: 5px;
  width: 30px;
  border-radius:10px;
  background: #333;
  transition:0.5s;
  position: absolute;
}

.drawer_open span:before{
  bottom: 8px;
}

.drawer_open span:after{
  top:8px;
}

#drawer_input:checked~.drawer_open span{
  background: rgba(255,255,255,0);
}

#drawer_input:checked ~ .drawer_open span::before{
  bottom:0;
  transform: rotate(45deg);
}

#drawer_input:checked ~ .drawer_open span::after{
  top:0;
  transform: rotate(-45deg);
}
.nav_content{
  margin-top: 10%;
  position: fixed;
  left: 1800px;
  z-index: 99;
  transition: .5s;
  background: #F0E68C;
}

.nav_list{
  margin: 20px;
  list-style: none;
  -webkit-writing-mode:vertical-rl;
  -ms-writing-mode:tb-rl;
  writing-mode:vertical-rl;
}

#drawer_input:checked ~ .nav_content{
  left:0;
}
.flex_test-box{
  display:flex;
  justify-content:space-around;
  margin-bottom:20px;
}
.flex_test-article{
  background-color:#D7B98E;
  width:75%; padding:20px; margin: 10px;
}
.flex_test-aside{
  padding:5px;margin:5px;
}
.flex_test-article p {margin:10px;font-size:1rem;}
.flex_test-aside .sub-menu{margin-bottom:60px;
list-style:none;color:black;
}

.sub-menu li{border-bottom: 1px;text-align:left;color:black;}
.sub-menu a{color:black; padding:10px;}
}
.home{
  display: block;
  align-items: center;
}
#history{
  background-color: #DAC9A6;
  height:270px;
  margin-bottom:40px;
}
.flex_test-article img{margin:18px;}
.post-info{
  padding-top:4px;
  position:relative;
  margin-bottom:40px;
}
.post-title{

  font-family:serif;
  font-size:0.5rem;
  font-weight:normal;
  margin-left:120px;
}
.sub-title{
  font-size:1.375rem;
  padding:0 8px 8px;
  border-bottom:2px #211E55 solid;
  font-weight:normal;
}
.third-title{color:black;font-size:1.5rem;font-style:bold;
  padding:0 8px;
  border-bottom:2px #0a123a solid;
  font-weight:normal;
}
.flex_test-box{color:black;font-size:0.75rem;font-style:bold; align:left;}


/*フォトギャラリー*/
#photogallery
.photogallery-content{
  max-width: 650px;
  margin-top:6px;
  }

.photogallery-content p{
  font-size: 1.125rem;
  margin:5px 0 0;text-align: center;
}
.grid{
  display:grid;
  gap:5px;
  grid-template-columns:1fr 1fr 1fr;
  margin-top:5px;
  margin-bottom:5px;
}



Resources
/*お問い合わせ*/

/*classroom*/
.classroom-content .page-title{
  text-align:center;
  font-size:2rem;
}
#classroom .container{
  display:flex;
  gap:25px;
  align-content:space-between;
  align-items:stretch;
  height:80vh;
  }

.item{margin:10px;
padding:8px;

}


  /*iframe*/
  iframe{width:60%;height:300px;align-items:center;}
/*フッター*/
footer{
  background:#432;
  text-align:center;
  padding:26px 0;
}
footer p {
  color:#fff;
  font-size:0.875rem;
}}
.page-title{text-align:center;}
.big-bg{
min-height:80vh;background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/* スマホ */
 @media screen and (max-width: 428px) {

   h1{color:black;font-size:2.75rem;}
   h2{color:black;font-size:2.5rem;}
   h3{color:black;font-size:2.2rem;}
   h4{color:black;font-size:2rem;}
   h5{color:black;font-size:2rem;}
   p{font-size:1px;color:black;}
   table{font-size:20px; color:navy;line-height:2.5;}


   /*home------------*/


/* タブレット */
 @media only screen and (min-width: 600px) and (max-width: 1024px){

   h1{color:black;font-size:3rem;}
   h2{color:black;font-size:2.75rem;}
   h3{color:black;font-size:2.5rem;}
   h4{color:black;font-size:2.25rem;}
   h5{color:black;font-size:2rem;}
   p{font-size:20px;color:black;}
   table{font-size:20px; color:navy;line-height:2.5;}

   .big-bg{
   height:1000px; width:auto;  background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
   }
   /*home------------*/

   /*宏道流とは-----*/

/* パソコン */
 @media screen and (min-width: 1024px) {
 /*ここにPC用のCSSを記述する*/

h1{color:black;font-size:3rem;}
h2{color:black;font-size:2rem;}
h3{color:black;font-size:1.5rem;}
h4{color:black;font-size:0.5rem;}
h5{color:black;font-size:0.8rem;}
p{font-size:0.5px;color:black;}
table{font-size:20px; color:navy;line-height:2.5;}
/*header --------------*/

/*home------------*/

}