@charset "utf-8";
/* style css */

/*new*/
.newnav{
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
.newnav li{
  width: 190px;
}
@media screen and (max-width: 768px) {
  .newnav{
    flex-wrap: wrap;
  }
  .newnav li{
    width: 30%;
  }
}

.brandSiteHeader{
  box-sizing: content-box;
}
.brandSiteHeader .ph-logo{
  margin: 0!important;
  font-size: inherit!important;
  font-weight: normal!important;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translate(0,-50%);
}
.brandSiteHeader .ph-logo a{
  display: block;
}
@media screen and (max-width: 640px){
  .brandSiteHeader .ph-logo{
    right: 0;
  }
}

/* manga_main_ttl */
#manga_main_ttl{
    background:  url(../../imgs/common/manga_main.png);
    background-repeat: no-repeat;
    background-position: center top;
}

@media screen and (max-width: 768px) {
    #manga_main_ttl{
        background-size: 100% auto;
    }
}

.manga_inner{
    width: 1024px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
.manga_inner{
    width: 95%;
    margin: 0 auto;
}
}

#manga_main_ttl h1{
    width: 952px;
    margin: 0 auto;
    padding-top: 415px;
}

@media screen and (max-width: 768px) {
#manga_main_ttl h1{
    width: 95%;
    margin: 0 auto;
    padding-top:35%;
}
}

#manga_main_ttl .special_thanks{
    width: 260px;
    margin: 20px 40px 30px auto;
}

@media screen and (max-width: 768px) {
  #manga_main_ttl .special_thanks{
    width: 180px;
     margin: 10px 0px 30px auto;
  }
}
#manga_main_ttl nav{
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  #manga_main_ttl nav{
    flex-wrap: wrap;
  }
  #manga_main_ttl nav p{
    width: 30%;
  }
}

.manga_lead{
    background: url(../../imgs/common/manga_back.png) no-repeat top center;
    height: 380px;
    text-align: center;
}

@media screen and (max-width: 768px) {
.manga_lead{
    height:auto;
    padding-bottom: 10%;
}
}

.manga_lead .episode{
    font-family:"メイリオ", Meiryo, "sans-serif";
    font-weight: bold;
    font-size: 19px;
    color: #ed1e79;
    position: relative;
    padding-bottom: 20px;
    padding-top: 55px;
    margin-bottom: 60px;
}

@media screen and (max-width: 768px) {
.manga_lead .episode{
    font-size: 19px;
    padding-bottom: 5%;
    padding-top: 10%;
    margin-bottom: 10%;
}
}

.manga_lead .episode:after{
    position: absolute;
    content: "";
    width: 82px;
    left: 50%;
    margin-left: -41px;
    height: 3px;
    bottom: 0;
    background: #000;
}

[data-ruby] {
    position: relative;
}

[data-ruby]::before {
    content: attr(data-ruby);
    position: absolute;
    top: -0.7em;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 0.32em;
}

.manga_lead h3{
    font-family: "Noto Serif Japanese Bold";
    font-size: 54px;
    letter-spacing: 1px;
}

@media screen and (max-width: 768px) {
.manga_lead h3{
    font-size: 9vw;
}
    
#story_05 .manga_lead h3{
    font-size: 9vw;
    line-height: 1.2;
}
}

.manga_cont{
    margin-bottom: 70px;
}

.effect{
    position: absolute;
}


.brubru{
   display: inline-block;
   animation: hurueru .1s  infinite; 
}

@keyframes hurueru {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(2px, 2px) rotateZ(1deg)}
    50% {transform: translate(0px, 2px) rotateZ(0deg)}
    75% {transform: translate(2px, 0px) rotateZ(-1deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}

.btn_next{
    text-align: center;
    margin-bottom: 80px;
}

@media screen and (max-width: 768px) {
.btn_next{
    width: 88%;
    margin: 0 auto;
    margin-bottom: 80px;
}
}

.btn_next p{
    width: 435px;
    background: #000;
    margin: 0 auto;
    font-family:"メイリオ", Meiryo, "sans-serif";
    font-weight: bold;
    font-size: 19px;
}

@media screen and (max-width: 768px) {
.btn_next p{
    width: 100%;
    margin: 0 auto;
}
}

.btn_next p a{
    display: block;
    padding: 25px;
    text-decoration: none;
    color: #fff;
    position:relative;
}

.btn_next p a:after{
    content: "";
    position: absolute;
    right: 25px;
    top: 50%;
    margin-top: -7.5px;
    width: 0;
height: 0;
border-style: solid;
border-width: 7.5px 0 7.5px 13.0px;
border-color: transparent transparent transparent #fff;
}

/*01*/

.base_koma{
    text-align: center;
    position: relative;
}

#story_01 .koma_01{
    width: 660px;
    margin: 0 auto;
    margin-top: -110px;
    margin-bottom: 65px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_01{
    width: 100%;
    margin-top: -3%;
    margin-bottom: 5%;
}
}

#story_01 .koma_02{
    width: 810px;
    margin: 0 auto;
     margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_02{
    width: 90%;
    margin-top: -3%;
    margin-bottom: 2%;
}
}

#story_01 .koma_04{
    display: flex;
    justify-content: center;
    padding-top: 10px;
    margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_04{
    margin-bottom: 2%;
}
}

#story_01 .koma_04 div:last-child{
    margin-left: -60px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_04 div:last-child{
    margin-left: -30px;
}
}

#story_01 .koma_05{
     width: 760px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_01 .koma_05{
    width: 90%;
    margin-bottom: 2%;
}
}

#story_01 .koma_06{
    margin-top: -30px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_06{
   margin-top: -5%;
}
}


#story_01 .koma_07{
     width: 902px;
    margin: 0 auto;
    margin-top: -25px;
    margin-bottom: 95px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_07{
    width: 100%;
    margin-top: -2%;
    margin-bottom: 2%;
}
}

#story_01 .koma_08{
    width: 810px;
    margin: 0 auto;
    margin-bottom: 35px;
}

@media screen and (max-width: 768px) {
#story_01 .koma_08{
    width: 90%;
    margin-bottom: 2%;
}
}

#story_01 .koma_09{
    width: 810px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_01 .koma_09{
    width: 90%;
    margin-bottom: 2%;
}
}


.kouka01_01{
    right: 20px;
    top: 172px;
}

@media screen and (max-width: 768px) {
.kouka01_01{
   width: 8%;
   right: 2.5%;
   top:0;
   padding-top: 26%;
}
}

.kouka01_02{
    left: -100px;
    top: -60px;
}

.kouka01_03{
    left: -00px;
    top: -00px;
}

@media screen and (max-width: 768px) {
.kouka01_02{
   width: 30%;
   left:22%;
   top:0;
   padding-top: 0%;
}
.kouka01_03{
   width: 5%;
   left:35%;
   top:0;
   padding-top: 7%;
}
}

.kouka01_04{
    right: -70px;
    bottom: -40px;
}

.kouka01_05{
    right: -35px;
    bottom: -10px;
}

@media screen and (max-width: 768px) {
.kouka01_04{
   width: 45%;
   right:2%;
   bottom: 0px;
   padding-top: 0%;
}
.kouka01_05{
   width:25%;
    right:8%;
   bottom: 8%;
   padding-top: 0;
}
}

.kouka01_06{
    right: -60px;
    bottom:35px;
}

@media screen and (max-width: 768px) {
.kouka01_06{
   width: 20%;
   right:2%;
   bottom: 8%;
   padding-top: 0%;
}
}

.kouka01_07{
    left: -80px;
    bottom: 40px;
}

.kouka01_08{
    left: -10px;
    bottom:90px;
}

@media screen and (max-width: 768px) {
.kouka01_07{
   width: 30%;
   left:0%;
    bottom: 3%;
   padding-top: 0%;
}
.kouka01_08{
    width: 18%;
   left:8%;
    bottom: 10%;
   padding-top: 0%;
}
}

.kouka01_09{
    right: -100px;
    bottom: -15px;
}

.kouka01_10{
    right: -30px;
    bottom:50px;
}

@media screen and (max-width: 768px) {
.kouka01_09{
   width: 50%;
   right:-5%;
   bottom: -10%;
   padding-top: 0%;
}
    
.kouka01_10{
   width: 30%;
   right:2%;
   bottom: 8%;
   padding-top: 0%;
}
}

.kouka01_11{
    right: 25px;
    top:30px;
}


.kouka01_12{
    left: 25px;
    bottom:30px;
}

@media screen and (max-width: 768px) {
.kouka01_11{
   width: 7%;
   right:4%;
   top: 5%;
   padding-top: 0%;
}
    
.kouka01_12{
   width: 16%;
   right:2%;
   bottom:5%;
   padding-top: 0%;
}
}

/*2*/

#story_02 .koma_01{
    width: 660px;
    margin: 0 auto;
    margin-top: -110px;
    margin-bottom: 65px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_01{
    width: 95%;
    margin-top: -3%;
    margin-bottom: 5%;
}
}

#story_02 .koma_02{
    width: 810px;
    margin: 0 auto;
    margin-bottom: 20px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_02{
    width: 95%;
    margin-top: -3%;
    margin-bottom: 2%;
}
    
#story_02 .koma_03{
    width: 95%;
}
}

#story_02 .koma_04{
    width: 810px;
    margin: 0 auto;
    margin-top: -40px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_04{
    width:95%;
    margin-top:-3%;
    margin-bottom: 2%;
}
}


#story_02 .koma_05{
     width: 760px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_02 .koma_05{
    width: 95%;
    margin-bottom: 2%;
}
}

#story_02 .koma_06{
    margin-top: -50px;
    margin-bottom: -100px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_06{
    width: 95%;
   margin-top: -2%;
   margin-bottom: 0px;
}
}


#story_02 .koma_07{
     width: 902px;
    margin: 0 auto;
    margin-top: -25px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_07{
    width: 95%;
    margin-top: -12%;
    margin-bottom: 3%;
}
}

#story_02 .koma_08{
    width: 810px;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 35px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_08{
    width: 86%;
    margin-bottom: 0%;
}
}

#story_02 .koma_09{
    width: 891px;
    margin: 0 auto;
    margin-top: 70px;
}

@media screen and (max-width: 768px) {
#story_02 .koma_09{
    width: 90%;
    margin-top: 4%;
    margin-bottom:0%;
}
    
#story_02 .koma_10{
    width: 95%;
}
}

.kouka02_01{
    right: -120px;
    top:-30px;
}

@media screen and (max-width: 768px) {
.kouka02_01{
   width: 22%;
   right: 0%;
   top:-3%;
}
}

.kouka02_02{
    left: -100px;
    top:-20px;
}

@media screen and (max-width: 768px) {
.kouka02_02{
   width: 28%;
   left: -8%;
   top:-4%;
   padding-top: 0%;
}
}

.kouka02_03{
    left: -50px;
    top:20px;
}

@media screen and (max-width: 768px) {
.kouka02_03{
   width: 20%;
   left: -2.5%;
   top:0;
}
}

.kouka02_04{
    right: -80px;
    top:-15px;
}

@media screen and (max-width: 768px) {
.kouka02_04{
   width: 69%;
   right: -8%;
    bottom:0;
   padding-top: 3%;
    
}
}

.kouka02_05{
    right: 30px;
    top:150px;
}

@media screen and (max-width: 768px) {
.kouka02_05{
   width: 15%;
   right: 4.5%;
   top:0px;
   padding-top: 19%;
}
}

.kouka02_06{
    right: 160px;
    top:170px;
}

@media screen and (max-width: 768px) {
.kouka02_06{
   width: 22%;
   right: 19%;
   top:0px;
   padding-top: 19%;
}
}

/*3*/
#story_03 .koma_01{
    width: 660px;
    margin: 0 auto;
    margin-top: -110px;
    margin-bottom: 65px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_01{
    width:95%;
    margin-top: -3%;
    margin-bottom: 5%;
}
}

#story_03 .koma_02{
    display: flex;
    width: 880px;
    align-items: center;
    margin: 0 auto;
}

#story_03 .koma_02 div:first-child{
    margin-top: 105px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_02{
    display: block;
    width: 95%;
    margin-top: -3%;
    margin-bottom: 2%;
}

#story_03 .koma_02 div:first-child{
    margin-top: 3%;
    margin-bottom: 2%;
}
}

#story_03 .koma_03{
    width: 790px;
    align-items: center;
    margin: 0 auto;
    margin-top: -30px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_03{
    width: 95%;
    margin-top: -3%;
    margin-bottom: 2%;
}
}

#story_03 .koma_04{
    width: 880px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
    margin: 0 auto;
    margin-top: 45px;
}

#story_03 .koma_04 div:first-child{
    margin-right: 20%;
}

#story_03 .koma_04 div:last-child{
    margin-left: 20%;
    margin-top: -25px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_04{
    width: 95%;
    margin-top: -2%;
    margin-bottom: 2%;
}
    
#story_03 .koma_04 div:first-child{
    margin-right: 10%;
}
    
#story_03 .koma_04 div:last-child{
    margin-left: 10%;
   margin-top: -2%;
}
}

#story_03 .koma_05{
     width: 851px;
    margin: 0 auto;
     margin-top: -55px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_05{
    width: 95%;
    margin-top: -8%;
}
}

#story_03 .koma_06{
    width: 853px;
    margin: 0 auto;
     margin-top: -20px;
}

@media screen and (max-width: 768px) {
#story_03 .koma_06{
width: 95%;
   margin-top: -2%;
}
}

#story_03 .koma_07{
     width: 950px;
    margin: 0 auto;
    margin-top: 85px;
}

.imgs_auto_01{
    width: 823px;
    text-align: left;
}

@media screen and (max-width: 768px) {
#story_03 .koma_07{
    width: 95%;
    margin-top: 2%;
    margin-bottom: 2%;
}
.imgs_auto_01{
    width: 94%;
}
}

#story_03 .koma_08{
    width: 950px;
    margin: 0 auto;
    margin-top: -50px;
    display: flex;
    justify-content: flex-end;
}

@media screen and (max-width: 768px) {
#story_03 .koma_08{
    width: 95%;
    margin-top: -7%;
    margin-bottom: 0%;
}
}

#story_03 .koma_09{
    width: 810px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_03 .koma_09{
    width: 95%;
    margin-top: -2%;
    margin-bottom: 2%;
}
}

.kouka03_01{
    right: 10px;
    top:-30px;
}

@media screen and (max-width: 768px) {
.kouka03_01{
   width: 30%;
   right: 2.5%;
   top:-3%;
}
}

.kouka03_02{
    right: 70px;
    top:20px;
}

@media screen and (max-width: 768px) {
.kouka03_02{
   width:10%;
   right: 12%;
   top:7%;
}
}

.kouka03_03{
    right: -50px;
    top:-50px;
}

@media screen and (max-width: 768px) {
.kouka03_03{
   width: 30%;
   right: 0%;
   top:-15%;
}
}

.kouka03_04{
    right: 20px;
    top:30px;
}

@media screen and (max-width: 768px) {
.kouka03_04{
   width:8%;
   right: 10%;
   top:10%;
}
}

.kouka03_05{
    right: 70px;
    top:-65px;
}

@media screen and (max-width: 768px) {
.kouka03_05{
   width: 52%;
   right: -2%;
   top:-10%;
}
}

.kouka03_06{
    right: 150px;
    top:90px;
}

@media screen and (max-width: 768px) {
.kouka03_06{
    width: 25%;
   right: 8%;
   top:13%;
}
}

.kouka03_07{
    left: -20px;
    top:60px;
}

@media screen and (max-width: 768px) {
.kouka03_07{
   width:30%;
   left: 2.5%;
   top:25%;
}
}

/*4*/
#story_04 .koma_01{
    width: 585px;
    margin: 0 auto;
    margin-top: -110px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_01{
    width: 95%;
    margin-top: -3%;
}
}

#story_04 .koma_02{
    width: 740px;
    margin: 0 auto;
    
}

@media screen and (max-width: 768px) {
#story_04 .koma_02{
    width: 95%;
    margin-top: -3%;
}
}

#story_04 .koma_03{
    width: 660px;
    align-items: center;
    margin: 0 auto;
    margin-top: 20px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_03{
    width: 95%;
    margin-top: 2%;
}
}

#story_04 .koma_04{
    width: 620px;
    margin: 0 auto;
    margin-top: -55px;
}


@media screen and (max-width: 768px) {
#story_04 .koma_04{
    width: 95%;
    margin-top: -8%;
}
}

#story_04 .koma_05{
     width: 670px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_04 .koma_05{
    width: 95%;
    margin-top: -3%;
    margin-bottom: 2%;
}
}

#story_04 .koma_06{
    width: 635px;
    margin: 0 auto;
    margin-top: 5px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_06{
     width: 95%;
   margin-top: -1%;
}
}

#story_04 .koma_07{
     width: 640px;
    margin: 0 auto;
    margin-top:-35px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_07{
    width: 95%;
    margin-top: -3%;
}
}

#story_04 .koma_08{
    width: 920px;
    margin: 0 auto;
    margin-top: 30px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_08{
    width: 100%;
    margin-top: -2%;
}
}

#story_04 .koma_09{
    width: 890px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    margin-top:-50px;
}

@media screen and (max-width: 768px) {
#story_04 .koma_09{
    width: 95%;
    margin-top: -3%;
}
    
#story_04 .koma_10{
    width: 95%;
    margin: 0 auto;
    }
}

.kouka04_01{
    right: 100px;
    top:10px;
}

@media screen and (max-width: 768px) {
.kouka04_01{
   width:22%;
   right: 15%;
   top:0;
   padding-top: 0%;
}
}

.kouka04_02{
     right: 120px;
    top:25px;
}

@media screen and (max-width: 768px) {
.kouka04_02{
   width:15%;
   right: 18%;
   top:0;
   padding-top: 2%;
}
}

.kouka04_03{
     right: -25px;
    top:25px;
}

@media screen and (max-width: 768px) {
.kouka04_03{
   width:40%;
   right: -1%;
   top:10%;
}
}

.kouka04_04{
    left:-20px;
    top:-70px;
}

@media screen and (max-width: 768px) {
.kouka04_04{
   width:24%;
   left: 2.5%;
   top:-0%;
}
}

.kouka04_05{
    left:30px;
    top:0px;
}

@media screen and (max-width: 768px) {
.kouka04_05{
   width:12%;
   left: 8%;
   top:18%;
}
}

/*5*/
#story_05 .koma_01{
    width: 585px;
    margin: 0 auto;
    margin-top: -110px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_01{
    width: 95%;
    margin-top: -3%;
}
}

#story_05 .koma_02{
    width: 585px;
    margin: 0 auto;
    margin-top: 20px;
    
}

@media screen and (max-width: 768px) {
#story_05 .koma_02{
    width: 90%;
    margin-top: 2%;
}
}

#story_05 .koma_03{
    width: 700px;
    align-items: center;
    margin: 0 auto;
    margin-top: 20px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_03{
   width: 95%;
    margin-top: 2%;
}
}

#story_05 .koma_04{
    width: 860px;
    display: flex;
    justify-content: flex-end;
    margin: 0 auto;
    margin-top: 15px;
}


@media screen and (max-width: 768px) {
#story_05 .koma_04{
    width: 85%;
    display: block;
    margin-top: 2%;
}
}

#story_05 .koma_05{
    width: 860px;
    display: flex;
    justify-content: flex-start;
    margin: 0 auto;
    margin-top: -15px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_05{
    width: 90%;
    display: block;
    margin-top: -4%;
}
}

#story_05 .koma_06{
   width: 865px;
    display: flex;
    justify-content: flex-start;
    margin: 0 auto;
    margin-top: -40px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_06{
   width: 90%;
    display: block;
    margin-top: -4%;
}
}

#story_05 .koma_07{
     width: 810px;
    margin: 0 auto;
    margin-top:-35px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_07{
    width: 95%;
    margin-top: -2%;
}
}

#story_05 .koma_08{
   width: 810px;
    display: flex;
    justify-content: flex-end;
    margin: 0 auto;
    margin-top: -105px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_08{
    width: 95%;
    margin-top: -10%;
}
}

#story_05 .koma_09{
    width: 740px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
#story_05 .koma_09{
     width: 95%;
    margin-top: -9%;
}
}

#story_05 .koma_10{
     width: 890px;
    display: flex;
    justify-content: flex-start;
    margin: 0 auto;
    margin-top: 20px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_10{
    width: 95%;
   margin-top: 2%;
}
}

#story_05 .koma_11{
     width: 925px;
    margin: 0 auto;
    margin-top: -40px;
}

@media screen and (max-width: 768px) {
#story_05 .koma_11{
    width: 95%;
    margin-top: -2%;
}
}

.kouka05_01{
    left:-100px;
    top:-125px;
}

@media screen and (max-width: 768px) {
.kouka05_01{
   width:40%;
   left: -2%;
   top:-4%;
}
}

.kouka05_02{
    left:-0px;
    top:-30px;
}

@media screen and (max-width: 768px) {
.kouka05_02{
  width:24%;
   left: 8%;
   top:9%;
}
}

.kouka05_03{
    right:35px;
    top:40px;
}

@media screen and (max-width: 768px) {
.kouka05_03{
   width: 30%;
   right: 5%;
   top:6%;
}
}

.kouka05_04{
    right:-30px;
    top:-0px;
}

@media screen and (max-width: 768px) {
.kouka05_04{
   width: 35%;
   right: -4%;
   top:6%;
}
}

.kouka05_05{
    right:50px;
    top:60px;
}

@media screen and (max-width: 768px) {
.kouka05_05{
   width: 12%;
   right: 8%;
   top:22%;
}
}

.kouka05_06{
    left:15px;
    top:20px;
}

@media screen and (max-width: 768px) {
.kouka05_06{
   width: 34%;
   left: 2.5%;
   top:5%;
}
}

.kouka05_07{
    left:100px;
    top:140px;
}

@media screen and (max-width: 768px) {
.kouka05_07{
   width: 15%;
   left: 13%;
   top:24%;
}
}

.kouka05_08{
    right:75px;
    bottom:190px;
}

@media screen and (max-width: 768px) {
.kouka05_08{
   width: 8%;
   right: 8%;
   bottom: 10%;
}
}

.kouka05_09{
    left:120px;
   bottom:40px;
}

@media screen and (max-width: 768px) {
.kouka05_09{
   width: 12%;
   left: 13%;
   bottom: 10%;
}
}