@charset "utf-8";
/* ------------------------------
    pc/sp
------------------------------ */

@media screen and (min-width:768px) {

  /*  LINE   ---------------------------------------------------------------------------*/
    body.line .mv {
      background-image: url(../images/info/renewal/renewal_mv_01.png);
    }

    body.line .mv h1 {
        text-align: right;
    }
    body.line .mv h1 span.txt {
      font-size: 26px;
    }

    body.line #contents .inner {
      margin: 60px auto 40px;
    }

    body.line #topicpath {
      padding-top:177px;
    }

    body.line #contents .secttl h1{
      text-align: center;
    }

    body.line #contents .secttl {
      background-color: #c0fcc0;
    }

    body.line #contents .secttl::after {
      box-sizing: none;
      width: none;
      height: none;
      border: none;
      border-left: none;
    }

    body.line #contents h2{
      text-align: center;
      font-size: 3.8rem;
      margin-bottom: 40px;
    }

    body.line #contents span.line {
      color: #00b900;
    }

    body.line #contents p.talk-01 {
      text-align: center;
      font-size: 2.2rem;
      margin: 30px 0 ;
    }

    body.line #contents p.talk-02 {
      text-align: center;
      font-size: 2.8rem;
      margin: 30px 0 60px;
      line-height: 1.8;
      font-weight: bold;
    }

    body.line #contents h3{
      text-align: center;
      font-size: 4.8rem;
    }

  body.line #contents h3 span{
    background:linear-gradient(transparent 60%, #fff558 0%) ;
    }

    body.line #contents h4 {
      font-size: 3.8rem;
      /* width: 60%; */
      color: #00b900;
      margin: 0 auto;
      text-align: center;
      /* background-color: #00b900;
      border-radius: 20px; */
    }
    body.line #contents h5 {
      font-size: 2.4rem;
      margin: 30px 0 ;
      }

    body.line #contents h5 span{
      color: #00b900;
    }

    body.line #contents .howto-line-box {
      background-color: #e2f6e2;
      margin: 80px auto 40px;
      padding: 5px 0 30px;
    }

   body.line #contents .col-2_width {
     width: 48%;
     margin: 0 4% 0 0;
   }
   body.line #contents .col-2_width:nth-child(2n) {
     width: 48%;
     margin: 0 ;
   }

   body.line #contents .flex-column {
     display: column;
     text-align: center;
     flex-direction: row;
     align-items: center;
    }

    body.line #contents .flex-column .col-2_height {
     width: 100%;
     margin: 0;
     height: 170px;
     /* background-color: #FFF;
     border-radius: 20px 20px 0 0;
     padding: 0 30px; */
     }

     body.line #contents .flex-column .col-2_height:nth-child(2n) {
      width: 100%;
      height: 60px;
      /* background-color: #FFF;

      border-radius:0 0 20px 20px; */
      }

       body.line #contents .flex-column .col-2_height p {
         text-align: center;
       }
       body.line #contents .flex-column .col-2_height p.ttl {
        color: #00b900;
        font-weight: bold;
        font-size: 1.8rem;
        padding-bottom: 10px;
       }

       body.line #contents .white-box {
        background-color: #FFF;
        border-radius: 20px ;
        padding: 30px;
        margin-bottom: 20px;
       }

}

/* ------------------------------
    sp
------------------------------ */
@media screen and (max-width: 767px) {



  body.line #contents .secttl h1{
    text-align: center;
  }


  body.line #contents .secttl h1 img {
    width:300px;
    height:100%;
  }

  body.line #contents .secttl {
    background-color: #c0fcc0;
  }

  body.line #contents .secttl::after {
    box-sizing: none;
    width: none;
    height: none;
    border: none;
    border-left: none;
  }

  body.line #contents .inner {
    margin: 40px auto 30px;
    width: 92%;
  }

  body.line #topicpath {
    padding-top:90px;
  }

      body.line #contents h2{
        text-align: center;
        font-size: 2.8rem;
        margin: 30px 0 40px;
      }

      body.line #contents span.line {
        color: #00b900;
      }

      body.line #contents p.talk-01 {
        text-align: center;
        font-size: 1.8rem;
        margin: 30px 0 ;
      }

      body.line #contents p.talk-02 {
        text-align: center;
        font-size: 2.4rem;
        margin: 30px 0 60px;
        line-height: 1.8;
        font-weight: bold;
      }

      body.line #contents h3{
        text-align: center;
        font-size: 3.8rem;
      }

    body.line #contents h3 span{
      background:linear-gradient(transparent 60%, #fff558 0%) ;
      }

      body.line #contents h4 {
        font-size: 3.8rem;
        /* width: 60%; */
        color: #00b900;
        margin: 0 auto;
        text-align: center;
        /* background-color: #00b900;
        border-radius: 20px; */
      }
      body.line #contents h5 {
        font-size: 2rem;
        margin: 30px 0 ;
        text-align: center;
        }

      body.line #contents h5 span{
        color: #00b900;
      }

      body.line #contents .howto-line-box {
        background-color: #e2f6e2;
        margin: 50px auto 40px;
        padding: 5px 0 30px;
      }

     body.line #contents .col-2_width {
       width: 100%;
       margin: 0 0 4% 0;
     }
     body.line #contents .col-2_width:nth-child(2n) {
       width: 100%;
       margin: 0 ;
     }

     body.line #contents .flex-column {
       display: column;
       text-align: center;
       flex-direction: row;
       align-items: center;
      }

      body.line #contents .flex-column .col-2_height {
       width: 100%;
       margin: 0;
       height: 170px;
       /* background-color: #FFF;
       border-radius: 20px 20px 0 0;
       padding: 0 30px; */
       }

       body.line #contents .flex-column .col-2_height:nth-child(2n) {
        width: 100%;
        height: 60px;
        /* background-color: #FFF;

        border-radius:0 0 20px 20px; */
        }

        body.line #contents .flex-column .col-2_height img.qr {
          width:140px;
          height:auto;
        }

        body.line #contents .flex-column .col-2_height img.friend {
          width:240px;
          height:auto;
        }

         body.line #contents .flex-column .col-2_height p {
           text-align: center;
         }
         body.line #contents .flex-column .col-2_height p.ttl {
          color: #00b900;
          font-weight: bold;
          font-size: 1.8rem;
          padding-bottom: 10px;
         }

         body.line #contents .white-box {
          background-color: #FFF;
          border-radius: 20px ;
          padding: 30px;
          margin-bottom: 20px;
         }




}


@media screen and (max-width: 480px) {
}