@media screen and (max-width:480px){
    html{
      position:relative;
      
    }
    
    body{
      margin:0;
      padding:0;
      margin-bottom:100px;
      width:100%;
    }
    
    header {
      width : 100%;
      height : 125px;
      position : absolute;
      z-index: 10;
      top : 0;
      background-color: rgb(83, 162, 199);
    }
    .clear{
      clear:left;
    }
    
    .container {
      /*max-width: 1100px;*/
      width: 100%;
      /*padding: 0 15px;*/
      margin: 0 auto;
      font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    }
    
    .header-left a {
      font-size:10vw;
      line-height: 25px;
      font-family: "Yu Gothic";
      font-weight: bold;
      color:#fff;
      display:inline-block;
      text-decoration:none;
      margin-top:20px;
    }
    .header-left{
      float:left;
      margin-left:20px;
    }
    
    .header-right{
      display:none;
    }
    .apple{
      float:left;
      font-size:4.6vw;
      margin-right:3px;
      margin-top:10px;
      color:#fff;
    }
    
    .main-wrapper{
      margin:0 auto;
      /*max-width: 1100px;
      min-width:770px;*/
    }
    .top-wrapper {
      margin:0 auto;
      padding-top:138px;
    width:100%;
      
    }
    
  
    }
    
    @media screen and (max-width:480px){
    .b {
      position:relative;
    
    }
    
    .ga a{
      display:none;
    }
    .ga{
      position:absolute;
      z-index: 8;
      display:none;
    
    }
    
    .d:hover + .ga{
      display:block;
    
    }
    .ga:hover{
      display:block;
    
    }
    .ga a:hover{
      background-color: rgb(161, 158, 158);
      text-decoration: underline;
    }
    
    .clear{
      clear: left;
    }
    .ga2{
      border-bottom: 1px solid #000;
      font-weight: bold;
      font-size: 32px;
      text-align: left;
      
      padding: 0 10px;
    }
    
    .nano-img {
      width:20px;
      height:210px;
      display:none;
    }
    
    
    
    .nano-cont{
        font-size:4.6vw;
        /*max-height:140px;*/
        padding:10px;
        border-left: double 5px #000;
        background-color:#f7f0f0;
        text-align:justify;
        font-weight: bold;
       /* min-width:300px;*/
    flex:auto;
    }
      
    .bio-cont{
      font-size:4.7vw;
        padding:10px;
        border-left: double 5px #000;
        background-color:#f0f7f0;
        text-align:justify;
        font-weight: bold;
    flex:auto;
    }
      
    .emb-cont{
        font-size:4.6vw;
        padding:10px;
        border-left: double 5px #000;
        background-color:#e9f0f2;
        text-align:justify;
        font-weight: bold;
    flex:auto;
    }
      
    .nanoteck{
      display:flex;
      
      margin:0 auto;
      font-family: "Yu Gothic";
        border-bottom:3px solid #f00;
        border-top:3px solid #f00;
    }
    
    .group1{
      height:68vw;
        margin-left:10px;
        margin-right:10px;
        margin-top:10px;
    }
    
    .ga3{
      font-weight: bold;
      border-bottom: 3px solid #d10034;
      font-size: 25px;;
      text-decoration:none;
        color:#d10034;
        line-height:1.5;
    }
    
    .ga3:hover {
      color:rgb(139, 105, 105);
    
    }
    
    .Biophys{
      display:flex;
      
      margin:0 auto;
      /*background-color: rgb(180, 252, 177);*/
      margin-top:40px;
        font-family: "Yu Gothic";
        border-bottom:3px solid #09ff00;
        border-top:3px solid #09ff00;
    }
      
    .ga4{
      font-weight: bold;
      border-bottom: 3px solid #71c700;
      font-size: 25px;;
      text-decoration:none;
        color:#71c700;
        line-height:1.5;
    }
    
    .ga4:hover {
      color:rgb(139, 105, 105);
    
    }
    .Embryogenesis{
      display:flex;
      
      margin:0 auto;
      /*background-color: rgb(149, 216, 243);*/
      margin-top:40px;
      font-family: "Yu Gothic";
        border-bottom:3px solid #00b7ff;
        border-top:3px solid #00b7ff;
    }
      
    .ga5{
      font-weight: bold;
      border-bottom: 3px solid #008ae0;
      font-size: 25px;;
      text-decoration:none;
        color:#008ae0;
        line-height:1.5;
    }
    
    .ga5:hover {
      color:rgb(139, 105, 105);
    }
      
    footer {
      background-color: rgb(73, 71, 71);
      font-size:3.5vw;
      width:100%;
      height:100px;
      position: absolute;
      bottom:0px;
      text-align: center;
      color:rgb(255, 255, 255);
    }
    
    .main2{
      
      margin:0 auto;
    }
    
    .main2-contents {
      background-color: rgb(255, 255, 255);
      padding:30px 0;
    }
    
    .main-0{
      
        position: relative;
        padding-bottom: 120px;
        box-sizing: border-box;
    }
    
    .main10{
      
      margin:0 auto;
    }
  
  }
  
  
  /*以下ハンバーガーアイコンのcss*/
  @media screen and (max-width:480px){
  .menu-btn {
      position: absolute;
      top: 60px;
      right: 10px;
      display: flex;
      height: 50px;
      width: 50px;
      justify-content: center;
      align-items: center;
      z-index: 90;
      background-color: #3584bb;
  }
  .menu-btn span,
  .menu-btn span:before,
  .menu-btn span:after {
      content: '';
      display: block;
      height: 3px;
      width: 25px;
      border-radius: 3px;
      background-color: #ffffff;
      position: absolute;
  }
  .menu-btn span:before {
      bottom: 8px;
  }
  .menu-btn span:after {
      top: 8px;
  }
  
  .menu-content {
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 80;
      background-color: #3584bb;
  }
  .menu-content ul {
      padding: 70px 10px 0;
  }
  .menu-content ul li {
      border-bottom: solid 1px #ffffff;
      list-style: none;
  }
  .menu-content ul li a {
      display: block;
      width: 100%;
      font-size: 15px;
      box-sizing: border-box;
      color:#ffffff;
      text-decoration: none;
      padding: 9px 15px 10px 0;
      position: relative;
  }
  .menu-content ul li a::before {
      content: "";
      width: 7px;
      height: 7px;
      border-top: solid 2px #ffffff;
      border-right: solid 2px #ffffff;
      transform: rotate(45deg);
      position: absolute;
      right: 11px;
      top: 16px;
  }
  
  .menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;/*leftの値を変更してメニューを画面外へ*/
    z-index: 80;
    background-color: #3584bb;
    transition: all 0.5s;/*アニメーション設定*/
  }
  }
  
  
  
  #menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
  }
  #menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
  }
  #menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
  }
  
  #menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
  }
  #menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
  }
  #menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
  }
  #menu-btn-check {
    display: none;
  }
  #menu-btn-check:checked ~ .menu-content {
  left: 0;/*メニューを画面内へ*/
  }
  
  @media screen and (min-width:480px) {
  
  
    .menu-content{
    display:none;
    }
    .apple{
    display:none
    }
    }

    @media screen and (max-width:480px){
        .title-zebra {
            font-size:8vw;
            font-weight:bold;
            text-decoration: underline;
        text-align: center;
        }
        
        .zebra1{
            width:100%;
            margin:0 auto;
            padding-top:100px;
            padding-bottom:20px;
        }
        
        .content1{
            text-align:left;
            border-bottom:solid 5px rgb(2, 130, 235);
            padding-bottom:50px;
            font-size:4.4vw;
            margin:0 20px;
            font-weight: bold;
        }
        
        .zebra-contents{
         text-align: center;
         margin:0 15px;
         
        }
        .content-li{
            text-align: left;
            padding:10px 0;
            font-weight:bold;
            list-style:none;
        }
        
        .content-p{
            text-align: left;
        }
        
        .image{
            height:80px;
            width:33%;
            display:block;
            padding:0 10px;
        }
        
        .img-file{
            display:flex;
            margin-bottom:20px;
        }
        }