
.tbody{
  background-color: black;
  //margin:auto; 
  //height: auto;
  //position: relative; 
  /*================================================================================--*/
    overflow-x: hidden;  
    
    //padding: top 20px;
  /* 画像ファイルの指定 */
background-image: url(../bonimges/tsuji_p7a.jpg);
   
/* 画像を常に天地左右の中央に配置 */
background-position: center center;
 
/* 画像をタイル状に繰り返し表示しない */
background-repeat: no-repeat;
 
/* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
background-attachment: fixed;
 
/* 表示するコンテナの大きさに基づいて、背景画像を調整 */
background-size: cover;
 
/* 背景画像が読み込まれる前に表示される背景のカラー */
//background-color: #464646;


  }
  .tbody2{
    right: 0;
    left: 0;
    background-size: auto
    //width: 1500px;
    height: auto;
    margin: 0 auto;
    //background-image: url(../imges/tsuji11boka.png);
    //background-size:100%;
    z-index: 10;
    //background-repeat: no-repeat;
  }
  .toparea{
    //background-color: bisque;
    position: relative;
    right: 0;
    left: 0;
    width: 1000px;
    height: auto;
    margin: 0 auto;
  }
  
  .topname{     
    //background-color: black;    
    width: 1000px;
    text-align: center;
    font-size: 40px;
    /* webフォント */
    font-family: "Calistoga", serif;
    font-weight: 400;
    font-style: normal;
    /* webフォント */
    font-weight: bolder;
    //text-shadow: 5px 5px 5px #dddef7;
    color: #ffffff;
    padding-top: 10px;
    z-index: 2;
    margin: auto;
  }
  //ハンバーガーメニュー
  //ハンバーガーメニュー
  //ハンバーガーメニュー
  
  .header-area{        
    position: absolute;
    right: 0;
    left: 0;    
    
        width: 50px;
    margin: 0 auto;
    transform: translate(300px, -56px);
    justify-content: space-between;
    height: 65px;
    padding: 200px;
    align-items: center;
    z-index: 3;
  }
  .hamburger{
    position: absolute;
    top: 2%;
    right: 0;
    //left: 0;
    //transform: translate(450px,20px);
    width: 50px;
    height: 30px;
    margin: 0 auto;
    
    z-index: 30;
  }
  .hamburger span{
    position: absolute;
    width: 80%;
    height: 5px;
    background-color: white;
    transition: .5s;/* 追記 */
  }
  .hamburger span:first-of-type{/* ハンバーガーメニューの1番目の線 */
    top: 0;
  }
  .hamburger span:nth-of-type(2){/* ハンバーガーメニューの2番目の線 */
    top: 50%;
  }
  .hamburger span:last-of-type{/* ハンバーガーメニューの3番目の線 */
    top: 100%;
  }
  .slide-menu{    
    /*background-color: papayawhip;*/
    position: absolute;
    top: 80px;
    width: 100%;
    left: 50%; /*メニューの位置調整　*/
    padding-left:150px; /*メニューの位置調整　*/
    transform: translateX(300%);
    transition: 1.00s;/* 追記 */
    z-index: 50;
  }
  .slide-menu_b{
    width: 600px;
    height: 580px;
    border-radius:30px;
    background-color: #fcfcfc;
    transform: translateX(-50%);
    list-style: none;
    padding-top: 40px;
    z-index: 50;
  }
  .slide-menu li{    
    font-size: 30px;
    font-weight: bolder;
    color: black;
    width: 600px;
    line-height: 60px;//200%;
    /*text-align: center;*/
    text-align: left;
    transform: translateX(-5%);
    padding-left: 80px;
   }
   .slide-menu li.hom0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.hom0::after{
    content: '\A \00a0 \00a0\00a0ホーム\A  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
   .slide-menu li.sta0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.sta0::after{
    content: '\A \00a0 \00a0\00a0 スタッフ\A  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
  
   .slide-menu li.les0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.les0::after{
    content: '\A \00a0 \00a0\00a0 レッスン\A  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
   .slide-menu li.she0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.she0::after{
    content: '\A \00a0 \00a0\00a0 日程&申込み\A  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
   
  .slide-menu li.spo0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.spo0::after{
    content: '\A\00a0 \00a0\00a0スポンサー\a  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
  .slide-menu li.pro0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.pro0::after{
    content: '\A\00a0 \00a0\00a0プロジェクト\a  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
  .slide-menu li.onl0{
    line-height: 30px;//200%;
    margin-bottom: -0.5em;
   }
  .slide-menu li.onl0::after{
    content: '\A\00a0 \00a0\00a0オンラインショッピング\a  ';
    white-space: pre;
    font-size: 18px;
    line-height: 18px;
    margin-top: -5.5em;
  }
  
  .hamburger.active span:first-of-type{/* ハンバーガーメニューの1番目の線 */
    top: 50%;
    transform: rotate(405deg);
  }
  .hamburger.active span:nth-of-type(2){/* ハンバーガーメニューの2番目の線 */
    opacity: 0;/* 透明にする */
  }
  .hamburger.active span:last-of-type{/* ハンバーガーメニューの3番目の線 */
    top: 50%;
    transform: rotate(-405deg);
  }
  .slide-menu.active{
    transform: translateX(0%);
    z-index: 10;
  }
  //ハンバーガーメニュー 
  //ハンバーガーメニュー
  //ハンバーガーメニュー 
/*================================================================================--*/
.tcontainer00{
 width: 1000px; 
}
.test0{
width: 1000px;  
}

.conte_00{
  //background-color: fuchsia;  
  color: white;
  font-size: 30px;
  font-weight: bolder;
  width: 1000px;
  height: 100px;
  text-align: center;
  margin: 0 auto;
}
.sponsor0{
  //background-color: rgb(255, 213, 0);
  
  color: white;
  font-size: 20px;
  font-weight: bolder;
  width: 1000px;
  height: 300px;
  text-align: left;
  margin: 0 auto;
  text-shadow: 2px 2px 4px black; /* 影の位置と色を指定 */ 
}  
.tcontainer01 {
    //background-color: red; 
    position: relative;  
    width: 1000px;
    height: auto;
    right: 0;
    left: 0;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 250px 250px 250px 250px 1fr;   
    grid-template-rows:  200px;
    row-gap: 0; 
    text-shadow: 2px 2px 4px black; /* 影の位置と色を指定 */ 
  }  
  .conte_01{
    //background-color: blue;
    grid-row: 1 / 2;
    grid-column: 2 / 3; 
    width: 250px;
    text-align: center;
    //padding: 30px;
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 3; /* 4行分のスペースを占めるように調整 */
    gap: 10px; /* カード間の隙間も親要素を継承しているので上書き */
    color: white;
  } 
  .conte_02{
    grid-row: 1 / 2;
    grid-column: 3 / 4; 
    width: 250px;
    text-align: center;
    
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 3; /* 4行分のスペースを占めるように調整 */
    gap: 10px; /* カード間の隙間も親要素を継承しているので上書き */
    color: white;
  }
  .conte_03{
    grid-row: 1 / 2;
    grid-column: 4 / 5; 
    width: 250px;
    text-align: center;
    
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 3; /* 4行分のスペースを占めるように調整 */
    gap: 10px; /* カード間の隙間も親要素を継承しているので上書き */
    color: white;
  }
  .conte_04{
    grid-row: 1 / 2;
    grid-column: 5 / 6;
    width: 250px; 
    text-align: center;
    
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 3; /* 4行分のスペースを占めるように調整 */
    gap: 10px; /* カード間の隙間も親要素を継承しているので上書き */
    color: white;
  }
  .sponsor1{ 
    color: white;
    font-size: 20px;
    font-weight: bolder;
    width: 1000px;
    height: 800px;
    text-align: left;
    margin: 0 auto;
     
  }
  .sponsor1_1{
    text-shadow: 2px 2px 4px black; /* 影の位置と色を指定 */     
  }
  .sponsor2{ 
    color: white;
    font-size: 20px;
    font-weight: bolder;
    width: 1000px;
    height: 100px;
    text-align: left;
    margin: 0 auto;
  }
  .tcontainer02 {
    background-color: whitesmoke; 
    position: relative;  
    width: 1000px;
    height: 700px;
    right: 0;
    left: 0;
    font-size: medium;
    margin: auto auto;
    display: grid;
    grid-template-columns: 1fr 150px 150px 150px 150px 150px 150px 1fr;   
    grid-template-rows: auto auto;
    padding-top: 20px;
    padding-bottom: 20px;
    gap:10px;
    row-gap: 20px; 
    border-radius: 5px;
  }  
  .conte_01_2{
    background-color: white;
    grid-row: 1 / 2;
    grid-column: 2 / 4; 
    width: 300px;
    height: 40px;
    //枠線修飾
    border-radius: 7px;
    background-color:white;/*背景色*/
    border:1px solid black;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    //枠線修飾
    text-align: left;
    padding: 10px;
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 6; /* 4行分のスペースを占めるように調整 */
    gap: 5px; /* カード間の隙間も親要素を継承しているので上書き */
    color: black;
  } 
  
  .conte_02_2{
    background-color: white;
    grid-row: 1 / 2;
    grid-column: 4 / 6; 
    width: 300px;
    height: 40px;
    //枠線修飾
    border-radius: 7px;
    background-color:white;/*背景色*/
    border:1px solid black;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    //枠線修飾
    text-align: left; 
    padding: 10px;   
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 6; /* 4行分のスペースを占めるように調整 */
    gap: 5px; /* カード間の隙間も親要素を継承しているので上書き */
    color: black;
  }
  
  .conte_03_2{
    background-color: white;
    grid-row: 1 / 2;
    grid-column: 6 / 8; 
    width: 300px;
    height: 40px;
    //枠線修飾
    border-radius: 7px;
    background-color:white;/*背景色*/
    border:1px solid black;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    //枠線修飾
    text-align: left; 
    padding: 10px;   
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 6; /* 4行分のスペースを占めるように調整 */
    gap: 5px; /* カード間の隙間も親要素を継承しているので上書き */
    color: black;
  }
  
  .conte_04_2{
    background-color: white;
    grid-row: 2 / 3;
    grid-column: 3 / 5;
    width: 300px; 
    height: 40px;
    //枠線修飾
    border-radius: 7px;
    background-color:white;/*背景色*/
    border:1px solid black;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    //枠線修飾
    text-align: left;
    padding: 10px;    
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 6; /* 4行分のスペースを占めるように調整 */
    gap: 5px; /* カード間の隙間も親要素を継承しているので上書き */
    color: black;
    
  }
  .conte_05_2{
    background-color: white;
    grid-row: 2 / 3;
    grid-column: 5 / 7;
    width: 300px; 
    height: 40px;
    //枠線修飾
    border-radius: 7px;
    background-color:white;/*背景色*/
    border:1px solid black;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    //枠線修飾
    text-align: left; 
    padding: 10px;   
    display: grid;
    grid-template-rows: subgrid; /* ここでSubgridを使用 */
    grid-row: span 6; /* 4行分のスペースを占めるように調整 */
    gap: 5px; /* カード間の隙間も親要素を継承しているので上書き */
    color: black;
    /*
    position: absolute;
    right:0;
    transform: translate(155px, 358px);  
    height: 326px;*/
  }
    
  .wdpancs{
    color: black;
    background-color: #808080;
    text-align: center;
  }
/*------- ナビゲーション------*/
/*------- ナビゲーション------*/
/*------- ナビゲーション------*/

/*------- ナビゲーション------*/
/*------- ナビゲーション------*/
/*------- ナビゲーション------*/

/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
/* --- スマホ対応                          ----------------- */
/* --- スマホ対応                          ----------------- */  
@media screen and (max-width:600px) {
/* --- ↓ index ------------------------------------------- */
/*gggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggg*/

/*gggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggg*/
