@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500&display=swap');






body,td,th {
font-family: 'M PLUS Rounded 1c', sans-serif;
	color: #000;







}


img {
  max-width: 100%;
  height: auto;
}


.for-pc { display:block; }
.for-sp { display:none; }

@media only screen and (max-width : 767px){
  .for-pc { display:none; }
  .for-sp { display:block; }
}


body {



  font-size: 19px; /* テキストのフォントサイズを設定 */

font-family: 'M PLUS Rounded 1c', sans-serif;
	background-color: #FFF;
	/*background-image: url(img/bg.jpg);*/
	background-position:50% 0%;
	background-repeat: repeat-y;
}


a:link {
	color: #fff;
}
a:visited {
	color: #fff;
}
a:hover {
	color: #fff;
}












#logo {
  max-width: 100%;
  display: block;
  margin: 0;
  white-space: nowrap;


}

#logo span {
  font-size: 12px; /* テキストのフォントサイズを設定 */
  text-align: left; /* テキストを左寄せに設定 */
}

nav{
 width: 100%;
 height: 70px;
 position: relative;
 background: #eefefd;  /* 上部ロゴの背景色 */
 box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);  /* 下部に影 */
 margin-bottom: 10px;  /* 下部に余白 */


}



.drawer{
 display: flex;

 flex-direction: row; 


 align-items: center;
 justify-content: space-between;
 position: relative;
 height: 70px;
 padding: 0 0em;
}

/*ナビゲーション部分*/


/* メニューのスタイル... */
.menu ul li a {

display:block;
padding: 1em;
  font-weight:bold;

border-bottom: 1px dotted #CCC; /* 追加 */
  color:#333; 
  text-decoration:none; /* 追加 */
}


.menu ul li a:hover
{background-color:;    /* メニューリンクのホバー背景色【元rgba(0,0,0,0.5)】 */
color:;}    /* メニューリンクのホバー色#000 */


.menu {
  text-align: center;
  background-color: rgba(255, 255, 255, 0.85);
  transition: 0.5s ease;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  position: fixed; /* 追加 */
  top: 0; /* 追加 */
  right: 0; /* 追加 */
  height: 100vh; /* 追加 */
  width: 80%; /* メニューの幅を調整（適宜変更可能） */
  max-width: 100%; /* 最大幅を指定（適宜変更可能） */
  overflow-y: auto; /* メニューがスクロールする場合に指定 */
  /* メニューが展開された時のスタイル */
  overflow-y: auto; /* スクロールバーを表示する */
z-index: 99;


}




/*OPEN時の動き*/
.menu.open {
 -webkit-transform: translateX(0%);
 transform: translateX(0%);/*中身を表示（右へスライド）*/




}



/*トグルボタンのスタイルを指定　ハンバーガー*/
.Toggle {
  position: fixed;
  background: #397aff;/* ボタンの背景色 */
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 5px;
  right: 20px;
z-index: 100;

}

.Toggle span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  right: 14px;
  height: 2px;
  border-radius: 5px;
  background: #fff;
  width: 45%;
}

.Toggle span:nth-of-type(1) {
  top: 13px;
}

.Toggle span:nth-of-type(2) {
  top: 19px;
}

.Toggle span:nth-of-type(3) {
  top: 25px;
  display: block; /* 追加：アクティブ時に非表示にしない */
}

.Toggle span:nth-of-type(3)::after {
  content: "Menu";
  position: absolute;
  top: 5px;
  left: -2px;
  color: #fff;
  font-size: 0.6rem;
  text-transform: uppercase;
}

.Toggle.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}

.Toggle.active span:nth-of-type(2) {
  opacity: 0;
}

.Toggle.active span:nth-of-type(3) {
  top: 26px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}

.Toggle.active span:nth-of-type(3)::after {
  content: "Close";
  transform: translateY(0) rotate(-45deg);
  top: 5px;
  left: 4px;
}

/*----------------------------------ここからPCモニターの記述-----------*/

@media screen and (min-width: 767px) {
  
  header::after{
    
    display:none;
  } 
  
  
nav{
 display: flex;

}
.Toggle{
 display: none;
}
.menu{
    text-align: right; /* メニューを右寄せに */
    background-color: transparent;
    margin-top: 0;
    transform: translateX(0); /* translateX の設定を削除 */
    position: relative; /* 位置指定 */
    height: auto; /* 高さを自動調整 */

    width: auto; /* 幅を自動調整 */
    max-width: none; /* 最大幅を指定解除 */

    overflow-y: visible; /* スクロール解除 */

}
.menu ul{
    height: auto; /* 高さを自動調整 */
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    list-style-type: none; /* マーカーを非表示にする */



}
.menu ul li a{
    padding: 0 1em;
    border-bottom: none;
}
  
  .menu ul li a:hover
{
    background-color: transparent;
 }
  
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/



#t1 {
  max-width: 100%;
  display: block;
  margin: 0;
  white-space: nowrap;
  text-align: center; /* テキストの位置設定 */
  font-size: 14px; /* テキストのフォントサイズを設定 */


}

#t1 span {
  color: #ff0000; /* テキストの色を指定 */
  font-size: 18px; /* テキストのフォントサイズを設定 */
}


#t2 {
  max-width: 100%;
  display: block;
  margin: 0;
  white-space: nowrap;
  text-align: center; /* テキストの位置設定 */
  font-size: 14px; /* テキストのフォントサイズを設定 */


}

#t2 span {
  color: #D54884; /* テキストの色を指定 */
  font-size: 30px; /* フォントサイズを指定 */
}


#t2 a:link {
  color: #D54884;
  text-decoration: none; /* リンクの下線を非表示 */
}



aaaaaaaaaaaaaa
#t3 {
  max-width: 100%;
  display: block;
  margin: 0;
  white-space: nowrap;
  text-align: left; /* テキストの位置設定 */
  font-size: 12px; /* テキストのフォントサイズを設定 */


}

#t3 span {
  color: #D54884; /* テキストの色を指定 */
  font-size: 20px; /* フォントサイズを指定 */
  text-align: left; /* リンクのテキストを左寄せに設定 */


}


#t3 a:link {
  color: #D54884;
  text-decoration: none; /* リンクの下線を非表示 */
  text-align: left; /* リンクのテキストを左寄せに設定 */


}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


