/* kokokara */

.box1 {
    text-align: left;
    margin-top: 36px;
    margin-left: 50px;
    margin-right: 25px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box1 h4 {
    margin-left: 15px;
    padding: 0;
  }

@media screen and (max-width:768px) {
  .box1 {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 20px;
  }
}
@media screen and (max-width:768px) {
  .box1 > h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-right: 15px;
  }
}

@media screen and (max-width:768px) {
  .box1 > h4 > img {
    margin-left: 50px;
  }
}

  .box2 {
    text-align: left;
    margin-top: 36px;
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: 18px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box2 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box2 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }
  @media screen and (max-width:768px) {
    .box2 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box2 > h4 > img {
      margin-left: 60px;
    }
  }
  
  .box3 {
    text-align: left;
    margin-top: 36px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box3 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box3 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box3 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }

  @media screen and (max-width:768px) {
    .box3 > h4 > img {
      margin-left: 50px;
    }
  }

  .box4 {
    text-align: left;
    /* padding: 35px; */
    margin-top: 9px;
    margin-left: 50px;
    margin-right: 25px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box4 h4 {
    margin-left: 15px;
    padding: 0;
  }
  
  @media screen and (max-width:768px) {
    .box4 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box4 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box4 > h4 > img {
      margin-left: 50px;
    }
  }

  .box5 {
    text-align: left;
    margin-top: 32px;
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box5 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box5 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box5 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box5 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box6 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box6 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box6 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box6 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box6 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box7 {
    text-align: left;
    margin-top: 9px;
    margin-left: 50px;
    margin-right: 25px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box7 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box7 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box7 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box7 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box8 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box8 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box8 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box8 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box8 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box9 {
    text-align: left;
    margin-top: 9px;
    margin-left: 50px;
    margin-right: 25px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box9 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box9 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box9 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box9 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box10 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box10 h4 {
    margin-left: 15px;
    padding: 0;
  }
  
  @media screen and (max-width:768px) {
    .box10 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box10 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box10 > h4 > img {
      margin-left: 50px;
    }
  }

  .box11 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box11 h4 {
    margin-left: 15px;
    padding: 0;
  }
  
  @media screen and (max-width:768px) {
    .box11 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box11 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box11 > h4 > img {
      margin-left: 50px;
    }
  }

  .box12 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box12 h4 {
    margin-left: 15px;
    padding: 0;
  }

  .box12 > h4 > img {
    margin-left: -12px;
  }

  @media screen and (max-width:768px) {
    .box12 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box12 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box12 > h4 > img {
      margin-left: 39px;
    }
  }
  
  .box13 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box13 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box13 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box13 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box13 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box14 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box14 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box14 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box14 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box14 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box15 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box15 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box15 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box15 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box15 > h4 > img {
      margin-left: 50px;
    }
  }
  
  .box16 {
    text-align: left;
    margin-top: 9px;
    margin-left: 25px;
    margin-right: 50px;
    margin-bottom: 9px;
    height: 40px;
    width: 260px;
    color: #235faf;
    background: #e6f0f8;
  }
  
  .box16 h4 {
    margin-left: 15px;
    padding: 0;
  }

  @media screen and (max-width:768px) {
    .box16 {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
    }
  }

  @media screen and (max-width:768px) {
    .box16 > h4 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-right: 15px;
    }
  }
  
  @media screen and (max-width:768px) {
    .box16 > h4 > img {
      margin-left: 50px;
    }
  }
  
  /* main */
  
  .left_box{
    float: left;
    border-color: #e6f0f8;
    width: 335px;
  }
  
  .center_box {
    float: left;
    border-color: #e6f0f8;
    width: 310px; 
  }
  
  .right_box {
    float: right;
    border-color: #e6f0f8;
    width: 335px;  
  }
  
  .left_box > h4 {
    color: #235faf;
    text-align: left;
  }
  
  .left_box {
    text-align: left;
  }
  
  .lmoji_box {
    margin-left: 100px;
  }
  
  .center_box > h4 {
    color: #235faf;
    text-align: left;
  }
  
  .right_box {
    text-align: left;
  }
  
  .right_ul > li {
    margin-left: 60px;
  }
  
  .left_box > h4 > a {
    margin-left: 60px; 
    text-decoration: none;
    color: #235faf;
  }
  
  .center_box > h4 > a {
    margin-left: 40px; 
    text-decoration: none;
    color: #235faf;
  }
  
  .lmoji_box > .left_ul > li > a {
    text-decoration: none;
    color: #000000;
  }
  
  .rmoji_box > .right_ul > li > a {
    text-decoration: none;
    color: #000000;
  }

@media screen and (max-width:768px) {
    .left_box {
        float: none;
        margin: 0 auto;
        width: 90%;
    }
}

@media screen and (max-width:768px) {
    .right_box {
        float: none;
        height: 100%; 
        margin: 0 auto;
        width: 90%;
    }
}

@media screen and (max-width:768px) {
    .center_box {
        float: none;
        height: 100%;   
        margin: 0 auto;
        width: 90%;
    }
}



.bunkakai__body {
  width: 980px;
  margin: 0 auto;
  background-color: #ffffff;
  height: 900px;
  }    

@media screen and (max-width: 768px) {
  .bunkakai__body {
      width: 768px;
      margin: 0 auto;
      background-color: #ffffff;
      height: 1778px;
  }
}