@media only screen and (max-device-width: 769px){ 
        
body 
    {margin:0px;
	 font-family: "Nico Moji", sans-serif;} 

    .all{
     display:flex;
    }


.back{
    position: fixed;
    background: #585858;
    width:100%;
    height:100%;
    z-index:-2;
    }

.backimg{
    width:100%;
    height:-30%;
    z-index:-1;
    bottom:-7px;
    position: fixed;
    }

    
    .back_border{
        
        }

    
        .border1{
        animation: border 4.3s linear infinite forwards;
        width:30px;
        height:30px;
        left:100%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border2{
        animation: border 3.0s linear infinite forwards;
        width:240px;
        height:240px;
        left:10%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border3{
        animation: border 3.2s linear infinite forwards;
        width:50px;
        height:50px;
        left:30%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border4{
        animation: border 2.7s linear infinite forwards;
        width:65px;
        height:65px;
        left:95%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border5{
        animation: border 5.2s linear infinite forwards;
        width:25px;
        height:25px;
        left:75%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border6{
        animation: border 4.3s linear infinite forwards;
        width:30px;
        height:30px;
        left:900px;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border7{
        animation: border 2.0s linear infinite forwards;
        width:120px;
        height:120px;
        left:500px;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border8{
        animation: border 3.2s linear infinite forwards;
        width:50px;
        height:50px;
        left:400px;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border9{
        animation: border 1.9s linear infinite forwards;
        width:165px;
        height:165px;
        left:34%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border10{
        animation: border 5.2s linear infinite forwards;
        width:25px;
        height:25px;
        left:800px;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border11{
        animation: border 4.3s linear infinite forwards;
        width:30px;
        height:30px;
        left:100%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border12{
        animation: border 5.7s linear infinite forwards;
        width:34px;
        height:34px;
        left:75%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border13{
        animation: border 3.2s linear infinite forwards;
        width:50px;
        height:50px;
        left:30%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border14{
        animation: border 2.7s linear infinite forwards;
        width:65px;
        height:65px;
        left:95%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border15{
        animation: border 5.2s linear infinite forwards;
        width:25px;
        height:25px;
        left:75%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border16{
        animation: border 4.3s linear infinite forwards;
        width:30px;
        height:30px;
        left:1%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border17{
        animation: border 3.8s linear infinite forwards;
        width:100px;
        height:100px;
        left:60%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}

        .border18{
        animation: border 3.2s linear infinite forwards;
        width:50px;
        height:50px;
        left:5%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border19{
        animation: border 2.7s linear infinite forwards;
        width:65px;
        height:65px;
        left:15%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        .border20{
        animation: border 5.2s linear infinite forwards;
        width:25px;
        height:25px;
        left:20%;
        background: #FFF;
        position: absolute; 
        border-radius:100%;}
    
        @keyframes border {
        0% { margin-top:120%;}
       90% { opacity: 0.8;
            }
      100% { opacity:0;
             margin-top:0%;}
           }









.all_part{
    width:85%;
    margin-left:12%;
    padding-top:9%;
    }    
    


.novel_toll_rink{
text-decoration: none;
color:#444242;
}


   .novel_intro{
   background:#FFFFFF; 
   border-radius:20px;
   width:70%; height:100px; 
   margin-left:8%; 
   margin-bottom:50px;
   padding: 20px 30px 20px 30px;
   border:solid 5px #3F706A;
   transition: 0.4s;
   }

    .novel_intro:hover{
     transform: rotateX( 360deg );
     filter: hue-rotate(180deg);
     }


        .novel_intro .title{
        border-bottom:solid 1px rgba(0,0,0,0.4);  
        }

        .novel_intro .syoukai{
        font-size:0.8rem;
        margin-left:10%;
        border-bottom:solid 1px #f2f2f2;
        width:80%;
        margin-top:5px;
        }

       .novel_intro .kounyu{
        text-align: center;
        color:#EF2449;
        font-size:1.2rem;
        margin-top:1%;
        }
    
.part
    {display:block;
     }
 
.column 
    {width: 95%;
     justify-content: center;
     box-shadow: 0px 9px 12px -3px rgba(0,0,0,0.4);
     margin-left:2.5%;    
        }  
    
.area {background: rgba(255,255,255,0.95);
       border-radius:10px;
       margin:10px 10px 20px 10px;
       }
  
      
      
.list_1
    {
     text-align: center;
     color:#FFFFFF;
     background:#34BC78;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     font-size: 2.5rem;
     font-weight:700;
     padding:10px 0px 10px 0px;
    }      

.list_2
    {
     text-align: center;
     color:#FFFFFF;
     background:#34BC78;
     font-size: 2rem;
     padding:10px 0px 10px 0px;
     font-weight:700;
    }      
    

          
ul#syousetsulist, ol
    { padding: 0;
      position: relative;}
    


ul#syousetsulist li, ol li {
  
  margin:3px 10px 3px 10px ;
  color: #585858;
  border-left: solid 7px #34BC78;
  background: #FFFFFF;
  width:85%;
  margin: 5px 20px 5px 20px;
  line-height: 1.5;
  border-radius: 0 15px 15px 0;
  padding: .6em;
  list-style-type: none!important;
  font-size:1.7rem;
  transition: 0.4s;
    }

      
 ul#syousetsulist  a  
    {text-decoration: none;}
    
    ul#syousetsulist  a  :hover
    {width:85%;
     color:#FFFFFF; 
     background-color: #34BC78;
     border-left-color:#34BC78; 
     border-radius: 10px;
    }   
        
}