﻿.f-cel20 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
.container_top_benefits{
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
}
.benefit_top_product,
.benefit_top_detail{
    position: relative;
    color: #ffffff;
    background-color: #F3F3F3;
}
.row__container{
    padding: 80px 0;
    position: relative;
}
.background_mobile{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.background_mobile .bg__wrapper{
    position: relative;
    width: 100%;
    height: 100%;
    clip-path: inset(0);
}
.background_mobile .bgImg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.benefit_top_detail .bgImg{
  background-position: center top;
}
.benefit_top_product .container_top,
.benefit_top_detail .container_top{
  position: relative;
}
.benefit_top_product .wrapper_main_benefit{
    display: flex;
    align-items: center;
}
.benefit_top_product .wrapper_main_benefit,
.benefit_top_detail .wrapper_main_benefit{
  position: relative;
  z-index: 1;
}
.benefit_top_product .title__top{
    font-size: 22px;
    line-height: 1.4;
    max-width: 330px;
    flex: 0 0 330px;
    color:#000000;
}
.benefit_top_detail .title__top{
  font-size: 38px;
  line-height: 1.4;
  margin-bottom: 25px;
  color:#000000;
}
.benefit_top_detail .title__top_h3{
  font-size: 28px;
  margin-bottom: 45px;
  color:#000000;
}
.wrapper_main_benefit.mb-20{
    margin-bottom: 20px;
}
.main__benefit_top{
    margin-left: -10px;
    margin-right: -10px;
}
.main__benefit_top .f-cel20,
.main__benefit_top .f-cel4{
    padding-left: 10px;
    padding-right: 10px;
}
.item__benefit{
  position: relative;
  max-width: 350px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  width: 100%;
  display: block;
  
}
.item__benefit:hover{
    opacity: 0.8;
}
.main__benefit_top .item__benefit{
    color: #333;
}
.item__benefit .txt_top{
  position: absolute;
  top: 10px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 26px;
  line-height: 1.3;
}
.item__benefit .txt_bottom{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 20px;
  height: 75px;
  align-content: center;
}
.benefit_top_product .item__benefit .txt_bottom{
    font-size: 11px;
    height: 43px;
}
@media (max-width: 1400px) {
    .main__benefit_top{
        justify-content: center;
    }
    
}
@media (max-width: 1199px) {
    .container_top_benefits{
        max-width: 960px;
    }
    .f-cel20 {
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }
    @media (min-width: 768px) {
        .benefit_top_product .item__benefit .txt_bottom {
            font-size: 15px;
            height: 56px;
        }
    }
}
@media (max-width: 991px) {
    @media (min-width: 620px) {
        .container_top_benefits {
            max-width: 575px;
        }
        .benefit_top_product .item__benefit .txt_bottom{
            font-size: 13px;
            height: 51px;
        }
    }
    .benefit_top_product .wrapper_main_benefit{
        flex-wrap: wrap;
        padding: 0 20px;
    }
    .benefit_top_detail .title__top{
        font-size: 32px;
    }
    .benefit_top_product .title__top{
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 35px;
    }
    
  
}
@media (max-width: 767px) {
    .benefit_top_product{
        margin-top: 30px;
    }
    .benefit_top_product .background_mobile{
        left: -15px;
        width: calc(100% + 30px);
    }
  .benefit_top_product .title__top,
  .benefit_top_detail .title__top{
    font-size: 4.3vw;
  }
  .benefit_top_product .f-cel6,
  .benefit_top_detail .f-cel6{
    flex: 0 0 100%;
    max-width: 100%;
  }
  .background_mobile .bgImg{
    position: fixed;
  }
}
@media (max-width: 575px) {
    .m-pc575{
        display: none;
    }
  .row__container{
    padding: 30px 0;
  }
  .benefit_top_product .title__top,
  .benefit_top_detail .title__top{
    margin-bottom: 18px;
  }
  .benefit_top_product .title__top{
      font-size: 4vw;
  }
  .item__benefit{
    max-width: 285px;
  }
  .item__benefit .txt_top{
    font-size: 4vw;
  }
  .item__benefit .txt_bottom{
    bottom: 5px;
    font-size: 3.9vw;
  }
  .benefit_top_product .item__benefit .txt_bottom{
      bottom: 0;
      height: 8vw;
  } 
    .main__benefit_top {
        margin-left: -5px;
        margin-right: -5px;
    }
    .main__benefit_top .f-cel20,
    .main__benefit_top .f-cel4{
        padding-left: 5px;
        padding-right: 5px;
    }
}
@media (max-width: 440px) {
  .item__benefit{
    max-width: 65%;
  }
    .benefit_top_product .item__benefit{
        max-width: 100%;
      }
  .item__benefit .txt_bottom{
    height: 15vw;
  }
}



.container_benefit_breadcrumb .m-breadcrumb{
    margin-top: 2.3rem;
    margin-bottom: 2.3rem;
}
.wrap__benefit_detail{
    padding: 0 0;
}
.item__benefit_detail{
  position: relative;
  background-color: rgb(255 255 255 / 80%);
  border-radius: 30px;
  padding: 0;
  max-width: calc(100% - 60px);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  color: #000000;
  line-height: 1.3;
  min-height: 360px;
  -webkit-box-shadow: 0px 10px 6px 0px rgba(0, 0, 0, 0.16);
  -moz-box-shadow: 0px 10px 6px 0px rgba(0, 0, 0, 0.16);
  box-shadow: 0px 10px 6px 0px rgba(0, 0, 0, 0.16);
}
.item__benefit_detail:not(:last-child){
  margin-bottom: 35px;
}
.benefit_detail1{
  border: 2px solid #FF5757;
}
.benefit_detail2{
  border: 2px solid #FFAE00;
}
.benefit_detail3{
  border: 2px solid #CB6CE6;
}
.benefit_detail4{
  border: 2px solid #00A3E0;
}
.benefit_detail5{
  border: 2px solid #00BF63;
}
.item__benefit_detail .title__top_dl{
    font-size: 27px;
    line-height: 1.3;
    position: relative;
    padding: 6px 10px;
    min-height: 85px;
    align-content: center;
}
.benefit_detail1 .title__top_dl{
    border-bottom: 2px solid #FF5757;
    color: #FF5757;
}
.benefit_detail2 .title__top_dl{
    border-bottom: 2px solid #FFAE00;
    color: #FFAE00;
}
.benefit_detail3 .title__top_dl{
    border-bottom: 2px solid #CB6CE6;
    color: #CB6CE6;
}
.benefit_detail4 .title__top_dl{
    border-bottom: 2px solid #00A3E0;
    color: #00A3E0;
}
.benefit_detail5 .title__top_dl{
    border-bottom: 2px solid #00BF63;
    color: #00BF63;
}
/*.item__benefit_detail .title__top_dl::after{*/
/*  position: absolute;*/
/*  content: "";*/
/*  left: 50%;*/
/*  transform: translateX(-50%);*/
/*  width: 80%;*/
/*  max-width: 520px;*/
/*  height: 1px;*/
/*  bottom: 0;*/
/*}*/
/*.benefit_detail1 .title__top_dl::after{*/
/*  background-color: #FF6300;*/
/*}*/
/*.benefit_detail2 .title__top_dl::after{*/
/*  background-color: #00B900;*/
/*}*/
/*.benefit_detail3 .title__top_dl::after{*/
/*  background-color: #1F4571;*/
/*}*/
/*.benefit_detail4 .title__top_dl::after{*/
/*  background-color: #FFAE00;*/
/*}*/
.main_benefit_detail{
  position: relative;
  padding: 20px 30px;
}
.main_benefit_detail .block__img{
  flex: 0 0 225px;
  max-width: 225px;
}
.main_benefit_detail .block__img .img_benefit{
  position: relative;
  color: #ffffff;
}
.main_benefit_detail .block__img .txt_top{
  position: absolute;
  top: 5px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 15px;
  line-height: 1.3;
}
.main_benefit_detail .block__img .txt_bottom{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 17px;
  height: 65px;
  align-content: center;
  color: #000;
}
.main_benefit_detail .block__txt_content{
  flex: 0 0 calc(100% - 225px);
  max-width: calc(100% - 225px);
  padding: 0 20px 0 40px;
  font-size: 18px;
  line-height: 1.35;
}
.block__txt_content .note_txt{
  margin-top: 15px;
}
.btn__pmore{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  margin:  40px auto 0;
  width: 100%;
  max-width: 190px;
}
/*.item__benefit_detail .vwmore{*/
/*  display: none;*/
/*}*/
.item__benefit_detail .btn__vwmore{
  background-color: #1F4571;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  margin:  0 auto 0;
  width: 100%;
  max-width: 190px;
  font-size: 16px;
  border-radius: 16px;
  -webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  -moz-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
      padding-top: 2px;
}
.item__benefit_detail .btn_numerical_management_sheet{
    background-color:#00A3E0
}
.item__benefit_detail .btn_line_program{
    background-color:#00BF63
}
.item__benefit_detail .btn__vwmore:not(:last-child){
  margin-bottom: 20px;
}
.item__benefit_detail .btn__vwmore:hover,
.btn__pmore:hover{
  opacity: 0.8;
}
.block__txt_content ul li{
  padding-left: 16px;
  text-indent: -16px;
}
.table_member_stage{
    max-width: 500px;
    width: 100%;
}
.table_member_stage th,
.table_member_stage td{
    padding: 8px 10px;
    border: 2px solid #fff;
}
.table_member_stage th{
    background-color:#F3C9FF;
}
.table_member_stage td{
    background-color: rgb(243 201 255 / 20%);
}
@media (max-width: 1024px) {
  .item__benefit_detail .title__top_dl{
    margin-bottom: 15px;
    font-size: 30px;
  }
  .main_benefit_detail .block__txt_content{
    padding: 0px 0px 0 20px;
    font-size: 16px;
  }
}
@media (max-width: 991px) {
    .benefit_top_detail .wrapper_main_benefit{
        padding: 0 15px;
    }
    .benefit_top_detail .title__top_h3 {
        font-size: 20px;
    }
}
@media (max-width: 767px) {
  .item__benefit_detail .title__top_dl{
    font-size: 24px;
  }
}

@media (max-width: 620px) {
  .m-620pc{
    display: none;
  }
  .main_benefit_detail{
    justify-content: center;
  }
  .item__benefit_detail .title__top_dl{
      min-height:auto;
  }
  /*.item__benefit_detail{*/
  /*  padding-right: 10px;*/
  /*}*/
  .item__benefit_detail .title__top_dl::after{
    width: calc(100% + 20px);
    left: -10px;
    transform: none;
    max-width: inherit;
  }
  .main_benefit_detail .block__txt_content{
    flex: 0 0 100%;
    max-width: 100%;
    padding: 20px 10px 10px;
  }

  .item__benefit_detail .vwmore{
    display: block;
    margin-top: 15px;
  }
  .btn__pmore{
    margin: 20px auto 10px ;
  }
}
@media (max-width: 575px) {
    .item__benefit_detail{
        max-width: 100%;
        border-radius: 16px;
    }
    .item__benefit_detail .title__top_dl{
        font-size: 15px;
        padding: 12px 3px;
    }
    .main_benefit_detail{
        padding: 0;
    }
    .table_member_stage th, .table_member_stage td{
        font-size: 14px;
    }
    .benefit_top_detail .title__top_h3{
        font-size: 3vw;
        position: relative;
        width: calc(100% + 20px);
        left: -10px;
    }
    .benefit_top_product .item__benefit .txt_bottom{
        font-size: 2.2vw;
        height: 8.2vw;
    }
}




