  
.index-online {
    background: #fff9f8;
    margin: 80px 100px;
    padding: 80px 100px
  }
  
  @media screen and (max-width: 768px) {
    .index-online {
      margin: 50px 60px;
      padding: 30px 40px
    }
  }
  
  .index-online .c-hd {
    color: #dd6673; 
  }
  
  .index-online .c-hd::before {
    background-color: #dd6673
  }
  
  @media screen and (max-width: 768px) {
    .index-online .c-hd {
      color: #dd6673; 
      font-size: 20px;
    }
  }
  
  .index-online_in {
    display: flex;
    justify-content: center;
    align-items: flex-start
  }
  
  @media screen and (max-width: 768px) {
    .index-online_in {
      display: block 
    }
  }
  
  .index-online_cont {
    flex: 0 0 38.8888888889%;
    max-width: 38.8888888889%;
    position: relative
  }
  
  @media screen and (max-width: 768px) {
    .index-online_cont {
      max-width: auto;
    }
  }
  
  .index-online_cont_ttl {
  
    color: #a55b9a;
      font-size: 16px;
      line-height: 1.4;
    /* font-size: 30px;
    line-height: 1.5;
    margin: 40px 0 0;
    position: relative */
  }
  
  @media screen and (max-width: 768px) {
    .index-online_cont_ttl {
      color: #a55b9a;
      font-size: 16px;
      margin: 25px 0 0;
    }
  }
  
  .index-online_cont_p {
    margin: 20px 100px 0;
    position: relative;
  }
  
  @media screen and (max-width: 768px) {
    .index-online_cont_p {
      margin: auto;
    }
  }
  
  .index-online_cont_txt {
    line-height: 1.9;
    margin: 15px 20px 0;
  
    /* line-height: 2 */
  }
  
  @media screen and (max-width: 768px) {
    .index-online_cont_txt {
      line-height: 1;
      margin: 10px 0 0;
    
      /* line-height: 2 */
    }
  }
  
  .index-online_cont_en {
    color: #f8e1e1;
    font-size: 135px;
    white-space: nowrap;
    position: absolute;
    bottom: -80px;
    left: 70px;
    z-index: 0;
    transform: rotate(-12deg);
  }
  
  @media screen and (max-width: 768px) {
    .index-online_cont_en {
      font-size: 50px;
      right: 0;
      left: auto;
      bottom: 0px;
    }
  }
  
  .index-online_fig {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
  }
  
  @media screen and (max-width: 768px) {
    .index-online_fig {
      max-width: inherit;
      margin: 40px 0 0;
    }
  }
  
  .index-online_fig_01 {
    text-align: right;
  }
  
  .index-online_fig_01_img {
    width: 348px;
    box-shadow: 0 0 3rem rgba(27, 23, 23, 0.12);
  }
  
    /* ----------------------------------------------*/
  @media screen and (max-width: 768px) {
    .index-online_fig_01_img {
      max-width: 40%;
    }
  }
  
  .index-online_fig_02 {
    margin: -100px 0 0;
  }
  
    /* ----------------------------------------------*/
  @media screen and (max-width: 768px) {
    .index-online_fig_02 {
      margin: 10px 0 0;
    }
  }
  
  .index-online_fig_02_img {
    width: 283.5px;
    box-shadow: 0 0 3rem rgba(0, 0, 0, .12);
  }
  
    /* ----------------------------------------------*/
  @media screen and (max-width: 768px) {
    .index-online_fig_02_img {
      max-width: 60%;
    }
  }
  
  .index-online_hd {
    margin: 0 -250px 0 ;
  }
  
    /* ----------------------------------------------*/
  @media (min-width: 768px) {
    .index-online_hd {
      margin: 0 -500px 0 ;
    }
}
    /* ----------------------------------------------*/
  @media (min-width: 751px) {
    a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    }
    }
  
    .l-online {
      max-width: 1080px;
      margin: 50px 70px 50px 100px;
    }
  
    /* ----------------------------------------------*/
    @media screen and (max-width: 768px){
      .l-online{
        max-width: inherit; 
        margin: 10px 20px 10px 20px
      }
    }