.vol1 img{width:35%;
  margin-top: 80px;
  margin-bottom: 0px;}

.vol2 img{width:35%;
  margin-top: 20px;
  margin-bottom: 0px;}

.logod img{width:40%;
  margin-bottom: 0px;}



.wrapper{width:800px;
text-align: center;
margin-left: auto;
margin-right: auto;
background-color: ;
overflow:hidden;
margin-bottom:200px;
margin-top:100px;}

.headerx img{width:80%;
margin-bottom:100px ;}

.html{font-family: "Suisse"}


.ugoki{width:100%;
    position: relative;

}

.sen2{margin-top:40px;
  margin-bottom:15px;
width: 80%;
margin-left: auto;
margin-right: auto;}

.shoes img{width:80%;
margin-top:0px;
opacity : 0;
transform: translateY(30px);
transition: all 0.5s;}

.shoes{width:100%;
height:auto;

position: relative;
margin-top: -25px;}


.shoes2 img{width:80%;
  margin-top:0px;
  opacity : 0;
  transform: translateY(30px);
  transition: all 0.5s;}
  
  .shoes2{width:75%;
  height:90px;
  background-color:;
  position: relative;
  margin-top: 70px;
margin-bottom: 70px;
margin-left: auto;
margin-right:auto;}


    
    
.shumoji{width: 50%;
height: auto;
margin-left: 0px;
margin-top: 50px;
}


.shumoji img{margin-top: 15px;
  
  height     :15px;
width: auto;
opacity : 0;
float: left;
transform: translateY(30px);
transition: all 0.5s;
}



.middle img{position: relative;
z-index: 0;}

    
.middle{
  height     :1193px;
  overflow: hidden;
background-color;
position: relative;
z-index: 0;
margin-bottom: 25px;
}


.storex{text-align: right;
margin-right: 0px;}
.storex img{height     :40px;
width:auto;
margin-top: 0px;}

.storexz img{height:20px;
  width:auto;
  margin-left: px;}


.middle2 img{width:630px;
    margin-top:260px;
margin-left: -40px;}
    
.middle2{height:1300px;
background-color:#dfdbdd ;}

.en{z-index: 100;
  width:200px;
  height     :200px;
background-color:white;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom:-85px;
border-radius: 50%;
transform: translateY(120px);
transition: all 0.5s;
}

.en2{z-index: 100;
  width:30% ;
  height     :calc(100vw * 0.3);
background-color:white;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom:-60px;
margin-top: 100px;
border-radius: 50%;
transform: translateY(50px);
transition: all 1s;
}

.en3{z-index: 100;
  width:30% ;
  height     :calc(100vw * 0.3);
background-color:white;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom:-60px;
margin-top: 100px;
border-radius: 50%;
transform: translateY(50px);
transition: all 1s;
}

.en4{z-index: 100;
  width:30% ;
  height     :calc(100vw * 0.3);
background-color:white;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom:-60px;
margin-top: 50px;
border-radius: 50%;
transform: translateY(50px);
transition: all 1s;
}

.en4 img{width:100%;
  margin-bottom:0px;
  
  transform: translateY(5px);
  transition: all 1s;
  z-index: 100;}


.en img{width:100%;
margin-bottom:50px;

transform: translateY(5px);
transition: all 1s;
z-index: 100;}

.en2 img{width:100%;
  margin-bottom:0px;
  
  transform: translateY(10px);
  transition: all 1s;
  z-index: 100;}

  .en3 img{width:100%;
    margin-bottom:0px;
    
    transform: translateY(5px);
    transition: all 1s;
    z-index: 100;}

.moji1 img{width:130px;
margin-bottom: 5px;
opacity : 0;
transform: translateY(-30px);
transition: all 0.5s;}

.moji2 img{width:130px;
    opacity : 0;
    transform: translateY(30px);
    transition: all 0.5s;}


    .enB img{width:250px;
        margin-bottom:-131px;
        opacity : 0;
        transform: translateY(30px);
        transition: all 0.5s;}
        
        .moji1B img{width:130px;
        margin-bottom: 5px;
        opacity : 0;
        transform: translateY(-30px);
        transition: all 0.5s;}
        
        .moji2B img{width:130px;
            opacity : 0;
            transform: translateY(30px);
            transition: all 0.5s;}


.title2{margin-top: 300px;}


.ugoki2{background-color:rgb(190, 189, 189);}

.ugoki3{background-color:rgb(124, 123, 123);}

.ugoki{background-color:;
  z-index: 100;
width:100% ;
height: ;
position: relative;}

.sen{margin-top:160px;
  margin-bottom:160px;
width: 80%;}

.slide {z-index: 100;
    position   : relative;
    overflow   : hidden;
                      /* 画像のサイズに合わせて変更ください */
    width      : 100%;
    height     :calc(100vw * 0.591);
    margin     : auto;      /* サンプルは中央寄せの背景：白 */
    background :;
    margin-left: auto;
margin-right: auto;
text-align: center;
  }   
   /*=== 画像の設定 ======================================= */
  .slide img {
    display    : block;
    position   : absolute;
                        /* 画像のサイズを表示エリアに合せる */
    width      : inherit;
    height     : inherit;
    opacity    : 0;
    animation  : slideAnime5 10s ease infinite;
  }

   
   /*=== スライドのアニメーションを段差で開始する ========= */
   .slide img:nth-of-type(1) { animation-delay: 0s }
   .slide img:nth-of-type(2) { animation-delay: 2s }
   .slide img:nth-of-type(3) { animation-delay: 4s }
   .slide img:nth-of-type(4) { animation-delay: 6s }
   .slide img:nth-of-type(5) { animation-delay: 8s }
   
   /*=== スライドのアニメーション ========================= */
  @keyframes slideAnime5{
    0% { opacity: 0 }
    10% { opacity: 1 }
   20% { opacity: 1 }
   30% { opacity: 0 }
  100% { opacity: 0 }
  }

 /*=== 画像の表示エリア ================================= */
 .slide3 {
  position   : absolute;
    
                      /* 画像のサイズに合わせて変更ください */
                      width:100%;
    height     :1193px;
    margin     : auto;      /* サンプルは中央寄せの背景：白 */
    background-color :rgb(120, 117, 117);
   
    padding-top:0px;
  left:0px;
  z-index: 1;
  }
   
   /*=== 画像の設定 ======================================= */
  .slide3 img {
      
    display    : block;
    position   : absolute;
                        /* 画像のサイズを表示エリアに合せる */
    width      : 100%;
    height     : inherit;
    opacity    : 0;
    animation  : slideAnimeww 6s ease infinite;
    z-index: 1;
  }
   
   /*=== スライドのアニメーションを段差で開始する ========= */
  .slide3 img:nth-of-type(1) { animation-delay: 0s }
  .slide3 img:nth-of-type(2) { animation-delay: 3s }
   
   /*=== スライドのアニメーション ========================= */
  @keyframes slideAnimeww{
    0% { opacity: 0 }
    25% { opacity: 1 }
   50% { opacity: 1 }
   75% { opacity: 0 }
  100% { opacity: 0 }
  }

   /*=== 画像の表示エリア ================================= */
 .slide4 {
    position   : relative;
    
                      /* 画像のサイズに合わせて変更ください */
                      width:595px;
    height     : 897px;
    margin     : auto;      /* サンプルは中央寄せの背景：白 */
    background : ;
    padding-top:50px;

  }
   
   /*=== 画像の設定 ======================================= */
  .slide4 img {
      
    display    : block;
    position   : absolute;
                        /* 画像のサイズを表示エリアに合せる */
    width      : inherit;
    height     : inherit;
    opacity    : 0;
    animation  : slideAnime 10s ease infinite;
  }
   
   /*=== スライドのアニメーションを段差で開始する ========= */
  .slide4 img:nth-of-type(1) { animation-delay: 0s }
  .slide4 img:nth-of-type(2) { animation-delay: 3s }
   
   /*=== スライドのアニメーション ========================= */
  @keyframes slideAnime{
     0% { opacity: 1 }
     2% { opacity: 1 }
    50% { opacity: 1 }
    52% { opacity: 0 }
   100% { opacity: 0 }
  }


  .moji1s{display:none;}
  .moji2s{display:none;}
  .moji1Bs{display:none;}
  .moji2Bs{display:none;}
  .ens{display:none;}
  .enBs{display:none;}
  .shoess{display:none;}
  .shoes2s{display:none;}
  .shumojis{display:none;}
  .shumoji2s{display:none;}
  .moji1pad{display:none;}
  .moji2pad{display:none;}
  .enpad{display:none;}


  .mid2 img{float:left;
  width: 50%;
  position : relative;
  z-index: 101;
　　　　　　　　　　　}

.mid2x img{float:left;
  width: 50%;
  position : relative;
  z-index: 101;
　　　　　　　　　　　}


.mid3 img{float:left; 
  width: 50%;
  position : relative;
  z-index: 101;
  
}
}

.mid2{ overflow: hidden;
  position   :relative;
  width: 100%;
  height     :;
  margin-bottom: 0px;
float: left;
background-color: brown;}

.mid2x{ overflow: hidden;
  position   : absolute;
  width: 50%;
  height: auto;
  margin-bottom: 0px;
float: left;}

.kari{color: white;}



 .shumojix1 img{margin-top: 0px;}

.mid3{ position : relative;
  margin-bottom: 50px;
  
  z-index: 100;
  overflow: hidden;
  width: 100%;
  height: auto;
background-color;
}

.mid3x{ position : relative;

  
  display: flex;
  z-index: 100;
  overflow: hidden;
  width: 100%;
  height: 610px;
background-color:;
margin-bottom: 50px;
margin-top: 0px;
}





.typo2{
overflow: hidden;
width:50% ;
height: 100%;
background-color: ;}


.typo2 img{height: auto;
  margin-right: 0px;
width: 100%;
margin-top: 0px;
  z-index: 100;
  margin-left: 0px;
  
}



  

.typo3{
  overflow: hidden;
  width:50% ;
 height: auto;
  background-color: ;
  position: relative;
  
}
  
  
  .typo3 img{height: auto;
    margin-right: 0px;
  width: 100%;
  margin-top: -10px;
    z-index: 100;
    
    
  }




  .typo4{
    overflow: hidden;
    width:35% ;
    height: 100%;
    background-color: ;
    
  }
    
    
    .typo4 img{height: auto;
      margin-right: 0px;
    width: 100%;
    margin-top: 0px;
      z-index: 100;
      margin-left: ;
      
    }
  

.typo1{margin-left: 0px;
overflow: hidden;
width:50% ;
height: 100%;
background-color: ;}


  

  



.pikk2x img{opacity : 0;
  transform: translateX(30px);
  transition: all 0.5s;
  margin-top: -20px;
}

  .pikk3x img{opacity : 0;
    transform: translateX(30px);
    transition: all 0.5s;}

    .pikk4x img{opacity : 0;
      transform: translateX(30px);
      transition: all 0.5s;}
      .pikk5x img{opacity : 0;
        transform: translateX(30px);
        transition: all 0.5s;}


        .pikk2xz img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
        margin-top: 0px;}
        
          .pikk3xz img{opacity : 0;
            transform: translateX(30px);
            transition: all 0.5s;}
        
            .pikk4xz img{opacity : 0;
              transform: translateX(30px);
              transition: all 0.5s;}
              .pikk5xz img{opacity : 0;
                transform: translateX(30px);
                transition: all 0.5s;}
    
      .pik2x img{position: relative;}

    .pikk1 img{opacity : 0;
      transform: translatex(30px);
      transition: all 0.5s;
      width: 50%;
      }

      .pikk1xx img{opacity : 0;
        transform: translateX(30px);
        transition: all 0.5s;
        width: 65%;
        }

      

      .dada{width: 50%;
        height: 300px;
      background-color: lawngreen;
   
    }
      .pikky img{
        
        width: 100%;
        height: auto;
        padding-bottom: 0px;
       }

       .pikk3x{margin-left: ;}

       .pikk4x{margin-left: }

       .pikk5x{margin-left: }
      

       .pikk3xz{margin-left: px;}

       .pikk4xz{margin-left: ;}

       .pikk5xz{margin-left:;}

       .pikky{width:50%;
        height: 280px;
      background-color: ;
     margin-bottom: 0px;}
  

      .pikk3 img{
        opacity : 0;
        transform: translateX(30px);
        transition: all 0.5s;
      
     }

      .pikk4 img{
        opacity : 0;
        transform: translateX(30px);
        transition: all 0.5s;}
      .pikk5 img{
        opacity : 0;
        transform: translateX(30px);
        transition: all 0.5s;
       }

        .pikk2 img{
          opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;}

          .middy2 img{width:100%;
          margin-bottom: 0px;}

          .middy3 img{width:100%;
            margin-bottom: 0px;}

            .middy3{height     :800px;}

            .middy4 img{width:75%;
              margin-top: 150px;}

          .middy img{width:100%;
            margin-bottom: 25px;}

          .mid2 img{margin-bottom: 25px;}


          .pikk2x{margin-top: -20px;}

          .pik1x {
            position   : relative;
            overflow   : hidden;
                              /* 画像のサイズに合わせて変更ください */
            width      : 50%;
            height     : 300px;
            margin     : auto;      /* サンプルは中央寄せの背景：白 */
            background : ;
            float: left;
            margin-bottom: 50px;
          }
           
           /*=== 画像の設定 ======================================= */
          .pik1x img {
            display    : block;
            position   : absolute;
                                /* 画像のサイズを表示エリアに合せる */
            width      : 100%;
            height     : inherit;
            opacity    : 0;
            animation  : slideAnime3 7s ease infinite;
          }
           
           /*=== スライドのアニメーションを段差で開始する ========= */
          .pik1x img:nth-of-type(1) { animation-delay: 0s }
          .pik1x img:nth-of-type(2) { animation-delay: 3.5s }
           
           /*=== スライドのアニメーション ========================= */
          @keyframes slideAnime3{
             0% { opacity: 1 }
             25% { opacity: 1 }
            50% { opacity: 1 }
            75% { opacity: 0 }
           100% { opacity: 0 }
          }

          .pik2x {
            position   : relative;
            overflow   : hidden;
                              /* 画像のサイズに合わせて変更ください */
            width      : 50%;
            height     : 300px;
            margin     : auto;      /* サンプルは中央寄せの背景：白 */
            background : #fff;
            float: left;
            margin-bottom: 50px;
          }
           
           /*=== 画像の設定 ======================================= */
          .pik2x img {
            display    : block;
            position   : absolute;
                                /* 画像のサイズを表示エリアに合せる */
            width      : 100%;
            height     : inherit;
            opacity    : 0;
            animation  : slideAnime3 12s ease infinite;
          }
           
           /*=== スライドのアニメーションを段差で開始する ========= */
          .pik2x img:nth-of-type(1) { animation-delay: 0s }
          .pik2x img:nth-of-type(2) { animation-delay: 6s }
           
           /*=== スライドのアニメーション ========================= */
          @keyframes slideAnime3{
             0% { opacity: 1 }
             25% { opacity: 1 }
            50% { opacity: 1 }
            75% { opacity: 0 }
           100% { opacity: 0 }
          }
      
      

          .typo{margin-top: -300px;}


          .slidea {
            position   : relative;
            overflow   : hidden;
                              /* 画像のサイズに合わせて変更ください */
            width      : 100%;
            height     :800px;
            margin     : auto;      /* サンプルは中央寄せの背景：白 */
            background : #fff;
            margin-bottom: 25px;
          }
           
           /*=== 画像の設定 ======================================= */
          .slidea img {
            display    : block;
            position   : absolute;
                                /* 画像のサイズを表示エリアに合せる */
            width      : inherit;
            height     : inherit;
            opacity    : 0;
            animation  : slideAnimex 4s ease infinite;
          }
           
           /*=== スライドのアニメーションを段差で開始する ========= */
          .slidea img:nth-of-type(1) { animation-delay: 0s }
          .slidea img:nth-of-type(2) { animation-delay: 2s }
           
           /*=== スライドのアニメーション ========================= */
          @keyframes slideAnimex{
            0% { opacity: 0 }
            25% { opacity: 1 }
           50% { opacity: 1 }
           75% { opacity: 0 }
          100% { opacity: 0 }
          }

          

        /*=== 画像の表示エリア ================================= */
 .slide3x {
  position   : reative;
    
                      /* 画像のサイズに合わせて変更ください */
                      width:100%;
                      height     :calc(100vw * 1.496);
    margin     : auto;      /* サンプルは中央寄せの背景：白 */
    background : rgb(172, 170, 170);
   
    padding-top:0px;
  left:0px;
  z-index: 1;
  }
   
   /*=== 画像の設定 ======================================= */
  .slide3x img {
      
    display    : block;
    position   : absolute;
                        /* 画像のサイズを表示エリアに合せる */
    width      : inherit;
    height     : inherit;
    opacity    : 0;
    animation  : slideAnime3x 9s ease infinite;
    z-index: ;
  }
   
   /*=== スライドのアニメーションを段差で開始する ========= */
   .slide3x img:nth-of-type(1) { animation-delay: 0s }
   .slide3x img:nth-of-type(2) { animation-delay: 3s }
   .slide3x img:nth-of-type(3) { animation-delay: 6s }
   
   /*=== スライドのアニメーション ========================= */
  @keyframes slideAnime3x{
    0% { opacity: 0 }
   16% { opacity: 1 }
  33% { opacity: 1 }
  49% { opacity: 0 }
 100% { opacity: 0 }
  }


.slided {z-index: 100;
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 100%;
  height     :473px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background :;
  margin-left: auto;
margin-right: auto;
text-align: center;
}   
 /*=== 画像の設定 ======================================= */
.slided img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnimed 6s ease infinite;
}

 
 /*=== スライドのアニメーションを段差で開始する ========= */
 .slided img:nth-of-type(1) { animation-delay: 0s }
 .slided img:nth-of-type(2) { animation-delay: 2s }
 .slided img:nth-of-type(3) { animation-delay: 4s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnimed{
  0% { opacity: 0 }
  16% { opacity: 1 }
 33% { opacity: 1 }
 49% { opacity: 0 }
100% { opacity: 0 }
}



.num img{width: 13%;
  margin-top: 40px;
margin-bottom: 60px;}

.aw img {width:85%;
  margin-bottom: 10px;}

  .vol img{width:35%;
    margin-top: 80px;
    margin-bottom: 0px;}


    .shumo9{width: 50%;
     
    overflow: hidden;
  background-color:;
  height: calc(100vw * 0.764);
  position: relative;
  }


 
  


    .shumo9 img{height     :calc(100vw * 0.023);
    width:auto;
  margin-top: 0px;
  margin-bottom: 10px;
  margin-left:20px;
  
}

.storex1 img{height:20px;
  bottom: 0;
  padding: 0;
  
   }

  .storex1{bottom: 0; 
    height: auto;
  position:absolute;
background-color: ;
overflow: hidden;
height:20px;}

.mido{width: 100%;
height:286px;
float: left;
display: flex;
margin-bottom: 0px;
background-color: ;}

.pik1c {width: 50%;
overflow:hidden;
height     :488px;}
.pik1c img{
  margin-left:12px;
  width: 80%;
  opacity : 0;
      transform: translateX(30px);
      transition: all 0.5s;
 }

 .pik1c2 {width: 50%;
  overflow:hidden;
  height     :calc(100vw * 0.611);}
  .pik1c2 img{
    margin-left:12px;
    width: 80%;
    opacity : 0;
        transform: translateX(-50px);
        transition: all 0.5s;
   }

   .pik2c2 {width: 50%;
    overflow:hidden;
    height     :488px;}
  
    .pik2c2 img{
      margin-right:12px;
      width: 80%;
      opacity : 0;
        transform: translateX(-30px);
        transition: all 0.5s;
     }


.pik2c {width: 50%;
  overflow:hidden;
  height     :488px;}

  .pik2c img{
    margin-right:12px;
    width: 80%;
    opacity : 0;
      transform: translateX(50px);
      transition: all 0.5s;
   }

    .pikky img{opacity : 0;
      transform: translateX(30px);
      transition: all 0.5s;}


      .slideb {
        position   : relative;
        overflow   : hidden;
                          /* 画像のサイズに合わせて変更ください */
        width      : 100%;
        height     :calc(100vw * 1);
        margin     : auto;      /* サンプルは中央寄せの背景：白 */
        background : rgb(175, 174, 174);
        margin-bottom: 25px;
        margin-top: 25px;
      }
       
       /*=== 画像の設定 ======================================= */
      .slideb img {
        display    : block;
        position   : absolute;
                            /* 画像のサイズを表示エリアに合せる */
        width      : inherit;
        height     : inherit;
        opacity    : 0;
        animation  : slideAnimexx 6s ease infinite;
      }
       
       /*=== スライドのアニメーションを段差で開始する ========= */
       .slideb img:nth-of-type(1) { animation-delay: 0s }
       .slideb img:nth-of-type(2) { animation-delay: 2s }
       .slideb img:nth-of-type(3) { animation-delay: 4s }
       
       /*=== スライドのアニメーション ========================= */
      @keyframes slideAnimexx{
        0% { opacity: 0 }
        16% { opacity: 1 }
       33% { opacity: 1 }
       49% { opacity: 0 }
      100% { opacity: 0 }
      }


      .middy11 img{width: 100%;}
      

      .middy11 {height: 560px;
        overflow: hidden;
        background-color:;
      margin-bottom: 25px; }


      .slideq {z-index: 100;
        position   : relative;
        overflow   : hidden;
                          /* 画像のサイズに合わせて変更ください */
        width      : 100%;
        height     :calc(100vw * 0.591);
        margin     : auto;      /* サンプルは中央寄せの背景：白 */
        background :;
        margin-left: auto;
    margin-right: auto;
    text-align: center;
      }   
       /*=== 画像の設定 ======================================= */
      .slideq img {
        display    : block;
        position   : absolute;
                            /* 画像のサイズを表示エリアに合せる */
        width      : inherit;
        height     : inherit;
        opacity    : 0;
        animation  : slideAnimeq 8s ease infinite;
      }
    
       
       /*=== スライドのアニメーションを段差で開始する ========= */
       .slideq img:nth-of-type(1) { animation-delay: 0s }
       .slideq img:nth-of-type(2) { animation-delay: 2s }
       .slideq img:nth-of-type(3) { animation-delay: 4s }
       .slideq img:nth-of-type(4) { animation-delay: 6s }
       
       /*=== スライドのアニメーション ========================= */
      @keyframes slideAnimeq{
        0% { opacity: 0 }
        12% { opacity: 1 }
       25% { opacity: 1 }
       37% { opacity: 0 }
      100% { opacity: 0 }
      }

     
      
        
        
      
      
      .pik1 img{
        opacity : 0;
      transform: translateX(30px);
      transition: all 0.5s;
        
      width: 100%;}
      
      .pik1{width: 50%;}

      
      
        .pik2 img{opacity : 0;
          transform: translateX(50px);
          transition: all 0.5s;
         }

            
      .pik1b img{
        opacity : 0;
      transform: translateX(-50px);
      transition: all 0.5s;
        
      width: 100%;}
      
      .pik1b{width: 50%;}

      
      
        .pik2b img{opacity : 0;
          transform: translateX(-30px);
          transition: all 0.5s;
         }




      .pikk2x{margin-top: 20px;}
      
     
      
     
        .pikk23x img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
          margin-top:0px ;
      
     }
        
        .pikk24x img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
         
         }
        .pikk25x img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
          
         }
        .pikk26x img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
         
        }
        .pikk27x img{opacity : 0;
          transform: translateX(30px);
          transition: all 0.5s;
         
         }
          
          .typo1 img{height: auto;
  width: 100%;
  

position : relative;
  z-index: 100;
  margin-top: 0px;
  
  
} 

.mido{margin-bottom: 60px;
background-color: ;
height     :488px;}

.mid3x{margin-top: 0px;
overflow: hidden;
height     :610px;
}

.mid3x img{}


.pikky{
  width: 50%;
  height     :610px;}


.middy11{ height     :1193px;
  margin-bottom: 100px;
}

.slidea{background-color: darkgray;}


.shumo9 img{ opacity : 0;
  transform: translateX(50px);
  transition: all 0.5s;}


  .middy12 img{width: 100%;}

  .middy12{ height     :473px;
    margin-bottom: 50px;
  }

  .typo1 img{height: auto;
    margin-right: 0px;
  width: 100%;
  margin-top: -6px;
    z-index: 100;
    
    
  }

  .pikk2 img{width: 100%;
    position : relative;
  margin-top: 0px;}

  .blank{width: 100%;
  height: 60px;
background-color:;}


.nagai img{width: 75%;}
.nagai{width: 100%;}