@charset "UTF-8";
/* ----------
layout
---------- */
/* 節 */
.l_section--primary{}
.l_section--primary > .l_section__item + .l_section__item{
  margin-top: 48px;
}

/* グリッド */
.l_grid--subFunc{
  margin: -8px;
}
.l_grid--subFunc > .l_grid__item{
  padding: 8px;
}
.l_grid--apply{
  margin: -10px;
}
.l_grid--apply > .l_grid__item{
  padding: 10px;
}
.l_grid--others{
  margin: -20px;
}
.l_grid--others > .l_grid__item{
  padding: 20px;
}
/* ----------
module
---------- */
/* 複数ボタン */
.m_btns{
  display: flex;
  align-items: stretch;
  justify-content: center;
  margin: 0 -12px;
}
.m_btns__item{
  display: block;
  width: 50%;
  padding: 0 12px;
}
@media screen and (max-width: 768px){
  .m_btns{
    display: block;
  }
  .m_btns__item{
    width: 100%;
  }
  .m_btns__item + .m_btns__item{
    margin-top: 24px;
  }
}
/* ボタン */
.m_btn--contMain::before{
  content: "";
  width: 0;
  height: 3em;
  display: block;
}
.m_btn--contMain .m_btn__target{
  width: 100%;
  border: 2px solid #189157;
  border-radius: 8px;
  background: #189157;
  font-weight: bold;
  color: #fff;
  transition: .3s background, .3s color;
}
.m_btn--contMain .m_btn__target:hover{
  color: #189157;
  background: #fff;
  text-decoration: none;
}
.m_btn--contMain .m_btn__inner{
  position: relative;
  display: block;
  padding-right: 40px;
}
.m_btn--contMain .m_btn__inner::before{
  content: url("../img/leaf/option_pack/bottom/ico_btn_on.svg");
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  display: block;
  margin: auto 0;
  width: 20px;
  height: 20px;
}
.m_btn--contMain .m_btn__target:hover .m_btn__inner::before{
  content: url("../img/leaf/option_pack/bottom/ico_btn_off.svg");
}
.m_btn--contSub::before{
  content: "";
  width: 0;
  height: 3em;
  display: block;
}
.m_btn--contSub .m_btn__target{
  width: 100%;
  border: 2px solid #189157;
  border-radius: 8px;
  background: #fff;
  font-weight: bold;
  color: #189157;
  transition: .3s opacity;
}
.m_btn--contSub .m_btn__target:hover{
  opacity: .7;
  text-decoration: none;
}
.m_btn--contSub .m_btn__target{
  width: 100%;
  border: 2px solid #189157;
  border-radius: 8px;
  background: #fff;
  font-weight: bold;
  color: #189157;
}
.m_btn--contSub .m_btn__inner{
  position: relative;
  display: block;
  padding-right: 40px;
}
.m_btn--contSub .m_btn__inner::before{
  content: url("../img/leaf/option_pack/bottom/ico_btn_off.svg");
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  display: block;
  margin: auto 0;
  width: 20px;
  height: 20px;
}
@media screen and (max-width: 768px){
  .m_btn--contMain .m_btn__inner{
    padding-right: 28px;
    font-size: 14px;
  }
  .m_btn--contSub .m_btn__inner{
    padding-right: 28px;
    font-size: 14px;
  }
}
/* アイコン */
.m_hasIco--resolve{
  display: flex;
  align-items: center;
  min-height: 72px;
  padding-left: 90px;
}
.m_hasIco--resolve::before{
  content: url("../img/leaf/option_pack/bottom/img_ttl_ico.png");
  top: 0;
  bottom: 0;
  height: 72px;
  margin: auto 0;
}
/* 見出し */
.m_heading__subTtl{
  font-weight: bold;
  line-height: 1.3;
}
.m_heading--primary{}
.m_heading--primary .m_heading__subTtl{
  font-size: 24px;
}
.m_heading--primary .m_heading__subTtl + .m_heading__ttl{
  margin-top: 8px;
}
.m_heading--primary .m_heading__ttl{
  line-height: 1.3;
  font-size: 36px;
}
.m_heading--secondary{
  margin-bottom: 24px;
}
.m_heading--secondary .m_heading__ttl{
  display: flex;
  justify-content: center;
  font-weight: bold;
  line-height: 1.3;
  font-size: 20px;
}
@media screen and (max-width: 768px){
  .m_heading--primary .m_heading__subTtl{
    font-size: 16px;
  }
  .m_heading--primary .m_heading__ttl{
    font-size: 22px;
  }
}
@media screen and (max-width: 599px){
  .m_heading--primary .m_heading__subTtl{
    font-size: 12px;
  }
  .m_heading--primary .m_heading__subTtl + .m_heading__ttl{
    margin-top: 4px;
  }
  .m_heading--primary .m_heading__ttl{
    font-size: 16px;
  }
}
/* ヒーローズエリア */
.m_herosArea{
  margin-bottom: 24px;
}
.m_herosArea__body{}
.m_herosArea__heading{
  position: relative;
  padding: 30px 200px 16px 130px;
  border-top: 4px solid #189157; 
}
.m_herosArea__heading::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 89px;
  height: 90px;
  background: url("../img/leaf/option_pack/bottom/ico_package.png") no-repeat center top / contain;
}
.m_herosArea__imgWrap{
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 190px;
  height: 100%;
}
.m_herosArea__img{
  line-height: 0;
  text-align: center;
}
.m_herosArea__img img{
  max-width: 100%;
  height: auto;
}
.m_herosArea__body + .m_herosArea__lead{
  margin-top: 40px;
}
.m_herosArea__lead{
  padding: 12px 32px;
  border: 2px solid  #E5F5ED;
}

@media screen and (max-width: 768px){
  .m_herosArea__heading{
    padding: 16px 0 16px 82px;
  }
  .m_herosArea__heading::before{
    width: 64px;
    height: 58px;
  }
  .m_herosArea__imgWrap{
    display: none;
  }
  .m_herosArea__body + .m_herosArea__lead{
    margin-top: 24px;
  }
}
@media screen and (max-width: 599px){
  .m_herosArea__heading{
    padding: 8px 0 8px 50px;
  }
  .m_herosArea__heading::before{
    width: 40px;
    height: 36px;
  }
  .m_herosArea__body + .m_herosArea__lead{
    margin-top: 16px;
  }
}
/* お悩み解決のラッパー */
.m_resolveWrap{}
.m_resolveWrap__body{}
.m_resolveWrap__summary{}
.m_resolveWrap__summary + .m_resolveWrap__detail{
  margin-top: 30px;
}

.m_resolveWrap__list{
  display: flex;
  align-items: stretch;
}
.m_resolveWrap__item{
  width: 33.333%;
}
@media screen and (max-width: 768px){
  .m_resolveWrap__list{
    display: block;
  }
  .m_resolveWrap__item{
    width: 100%;
  }
  .m_resolveWrap__item + .m_resolveWrap__item{
    margin-top: 16px;
  }
}
/* お悩み解決 */
.m_resolve{}
.m_resolve__problem{
  padding: 0 8px;
}
.m_resolve__benefit{}
.m_resolve__problem + .m_resolve__benefit{
  position: relative;
  margin-top: 22px;
  padding-top: 22px;
}
.m_resolve__problem + .m_resolve__benefit::before{
  content: url("../img/leaf/option_pack/bottom/arrow.png");
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  margin: 0 auto;
  width: 25px;
  transform: translateY(-50%);
}
/* 問題 */
.m_problem{
  padding: 20px 16px;
  border-top: 6px solid #B9B9B9;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}
.m_problem__ttl{
  font-weight: bold;
  text-align: center;
  font-size: 18px;
  margin-bottom: 16px;
}
@media screen and (max-width: 768px){
  .m_problem__ttl{
    font-size: 16px;
    margin-bottom: 12px;
  }
}
/* ベネフィット */
.m_benefit{
  padding: 16px;
  background: #E5F5ED;
}
.m_benefit__inner{
  padding: 24px 20px;
  background: url("../img/leaf/option_pack/bottom/ico_update.png") no-repeat center center / 50%, #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}
.m_benefit__ttl{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(2em * 1.4);
  margin-bottom: 16px;
  line-height: 1.4;
  text-align: center;
  font-weight: bold;
  font-size: 18px;
}
@media screen and (max-width: 768px){
  .m_benefit__inner{
    background-size: contain;
  }
  .m_benefit__ttl{
    font-size: 16px;
  }
}
/* プラン詳細 */
.m_detail{
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}
.m_detail__ttl{
  padding: 12px 0; 
  background: #189157;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
}
.m_detail__body{
  padding: 24px;
}
.m_detail__item + .m_detail__item{
  margin-top: 20px
}
@media screen and (max-width: 768px){
  .m_detail__ttl{
    font-size: 16px;
  }
  .m_detail__item + .m_detail__item{
    margin-top: 40px
  }
  .m_detail__body{
    padding: 16px;
  }
}

/* プランの主機能 */
.m_mainFunc{
  display: flex;
  align-items: stretch;
}
.m_mainFunc__leaf{
  flex: 0 0 380px;
  padding: 0 40px;
}
.m_mainFunc__option{
  flex: 1 1 auto;
  padding: 0 40px;
}
.m_mainFunc__leaf + .m_mainFunc__option{
  position: relative;
}
.m_mainFunc__leaf + .m_mainFunc__option::before{
  content: "＋";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  font-size: 56px;
  display: block;
  width: 1em;
  height: 1em;
  margin: auto;
  line-height: 1;
  transform: translateX(-50%);
}
@media screen and (max-width: 768px){
  .m_mainFunc{
    display: block;
  }
  .m_mainFunc__leaf{
    padding: 0;
  }
  .m_mainFunc__option{
    padding: 0;
  }
  .m_mainFunc__leaf + .m_mainFunc__option{
    margin-top: 36px;
    padding-top: 36px;
  }
  .m_mainFunc__leaf + .m_mainFunc__option::before{
    top: 0;
    bottom: auto;
    left: 0;
    right: 0;
    transform: translateY(-50%);
  }
}
/* leafの基本機能 */
.m_leaf{}
.m_leaf__ttl{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(2em * 1.4);
  margin-bottom: 20px;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  font-size: 20px;
}
.m_leaf__body{}
.m_leaf__img{
  text-align: center;
  line-height: 0;
}
.m_leaf__img img{
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 768px){
  .m_leaf__ttl{
    font-size: 16px;
    min-height: 0;
  }
}
/* オプション機能のラッパー */
.m_optionWrap{}
.m_optionWrap__ttl{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(2em * 1.4);
  margin-bottom: 20px;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  font-size: 20px;
}
.m_optionWrap__list{}
.m_optionWrap__item + .m_optionWrap__item{
  margin-top: 20px;
}
.m_optionWrap__inner{}
@media screen and (max-width: 768px){
  .m_optionWrap__ttl{
    min-height: 0;
    font-size: 16px;
  }
}

/* オプション機能 */
.m_option{
  position: relative;
  display: block;
  border: 1px solid #707070;
  color: inherit;
  overflow: hidden;
}
.m_option::before{
  content: "機能を詳しくみる →";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 18px;
  opacity: 0;
  background: rgba(0, 0, 0, 0.8);
  transition: .3s opacity;
}
.m_option::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 16px;
  background: #189157;
  transform: translateX(-100%);
  transition: .5s transform;
}
.m_option:hover{
  color: inherit;
  text-decoration: none;
}
.m_option:hover::before{
  opacity: 1;
}
.m_option:hover::after{
  transform: translateX(0%);
}
.m_option__heading{
  position: relative;
  
  padding: 0 12px 0 62px;
}
.m_option__heading::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
  height: 50px;
  background: #189157;
}
.m_option__heading::after{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
  height: 50px;
  background: url("../img/leaf/option_pack/bottom/ico_function.png") no-repeat center center;
}
.m_option__ttl{
  min-height: 50px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-bottom : 1px solid #707070;
  font-weight: bold;
  line-height: 1.4;
  font-size: 16px;
}
.m_option__body{
  padding: 16px;
}
.m_option__msg{}
.m_option--noLink::before,
.m_option--noLink::after{
  content: none;
}
@media screen and (max-width: 768px){
  .m_option__ttl{
    font-size: 14px;
  }
}
/* 付随機能 */
.m_subFunc{}
.m_subFunc__ttl{
  margin-bottom: 36px;
  font-weight: bold;
  text-align: center;
  font-size: 18px;
}
.m_subFunc__body{}
@media screen and (max-width: 768px){
  .m_subFunc__ttl{
    margin-bottom: 16px;
    font-size: 16px;
  }
}

/* 付随機能のリンクカード */
.m_subFuncCard{
  display: block;
  padding: 20px 16px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
  color: inherit;
}
.m_subFuncCard__ttl{
  margin-bottom: 14px;
  font-weight: bold;
  font-size: 16px;
}
.m_subFuncCard__body{}
.m_subFuncCard__msg{}
.m_subFuncCard__footer{
  display: flex;
  align-items: center;
  margin-top: 16px;
}
.m_subFuncCard__footerTtl{
  position: relative;
  display: inline-block;
  margin-right: 20px;
  padding: 4px 4px 4px 8px;
  border: 1px solid;
  border-right: none;
  line-height: 1;
  color: #189157;
  font-weight: bold;
  font-size: 12px;
  white-space: nowrap;
  word-break: keep-all;
}
.m_subFuncCard__footerTtl::before{
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
  display: block;
  width: calc(20px / 1.414);
  height: calc(20px / 1.414);
  margin: auto 0;
  border-top: 1px solid;
  border-right: 1px solid;
  background: #fff;
  transform: translateX(50%) rotate(45deg);
}
.m_subFuncCard__footerMsg{
  line-height: 1;
  font-size: 14px;
}
.m_subFuncCard--link{
  transition: .3s opacity;
}
.m_subFuncCard--link:hover{
  color: inherit;
  text-decoration: none;
  opacity: .7;
}
.m_subFuncCard--link .m_subFuncCard__footer::after{
  content: url("../img/leaf/option_pack/bottom/ico_cardLink.png");
  display: block;
  margin-left: 12px;
  line-height: 0;
}

@media screen and (max-width: 768px){
  .m_subFuncCard--link .m_subFuncCard__ttl{
    position: relative;
    padding-left: 26px;
  }
  .m_subFuncCard--link .m_subFuncCard__ttl::before{
    content: url("../img/leaf/option_pack/bottom/ico_cardLink.png");
    position: absolute;
    top: 1px;
    left: 0;
    display: block;
    line-height: 0;
  }
  .m_subFuncCard--link .m_subFuncCard__footer::after{
    content: none;
  }
}


@media screen and (max-width: 599px){
  .m_subFuncCard__footer{
    display: block;
  }
  .m_subFuncCard__footerTtl{
    margin-bottom: 8px;
  }
  .m_subFuncCard__footerMsg{
    line-height: 1.4;
  }
}

/* 導入後のさらなる効果のラッパー */
.m_plusBenefitWrap{}
.m_plusBenefitWrap__body{
  padding: 16px;
  background: #E5F5ED;
}
.m_plusBenefitWrap__item + .m_plusBenefitWrap__item{
  margin-top: 16px;
}

/* 導入後のさらなる効果 */
.m_plusBenefit{
  padding: 20px 32px;
  background: #fff;
}
.m_plusBenefit__ttl{
  margin-bottom: 12px;
  padding-left: 12px;
  border-left: 6px solid #189157;
  font-weight: bold;
  font-size: 16px;
}
@media screen and (max-width: 768px){
  .m_plusBenefit{
    padding: 16px;
  }
  .m_plusBenefit__ttl{
    line-height: 1.4;
  }
}

/* 活用シーンカード */
.m_applyCard{
  position: relative;
  display: block;
  padding: 36px 18px;
  color: inherit;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
  /* transition: .3s opacity; */
}
.m_applyCard::before{
  content: ""; 
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  border-left: 52px solid #189157;
  border-bottom: 52px solid rgba(255, 255, 255, 0);
}
/* .m_applyCard:hover{
  color: inherit;
  text-decoration: none;
  opacity: .7;
} */
.m_applyCard__ttl{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(2em * 1.4);
  margin-bottom: 20px;
  text-align: center;
  list-height: 1.4;
  font-weight: bold;
  font-size: 18px;
}
@media screen and (max-width: 768px){
  .m_applyCard__ttl{
    min-height: 0;
    font-size: 16px;
  }
}
/* プランの主機能 */
.m_priceWrap{}
.m_priceWrap__wrap{
  padding: 46px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}
.m_priceWrap__ttl{
  margin-bottom: 24px;
  font-weight: bold;
  text-align: center;
  font-size: 16px;
}
.m_priceWrap__body{
  display: flex;
  align-items: stretch;
}
.m_priceWrap__datail{

}
.m_priceWrap__base{
  width: 50%;
  padding-right: 40px;
}
.m_priceWrap__option{
  width: 50%;
  padding-left: 40px;
}
.m_priceWrap__base + .m_priceWrap__option{
  position: relative;
}
.m_priceWrap__base + .m_priceWrap__option::before{
  content: "＋";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  font-size: 56px;
  display: block;
  width: 1em;
  height: 1em;
  margin: auto;
  line-height: 1;
  transform: translateX(-50%);
}
.m_priceWrap__footer{
  margin-top: 30px
}
@media screen and (max-width: 768px){
  .m_priceWrap__wrap{
    padding: 20px 16px;
  }
  .m_priceWrap__body{
    display: block;
  }
  .m_priceWrap__base{
    width: 100%;
    padding-right: 0px;
  }
  .m_priceWrap__option{
    width: 100%;
    padding-left: 0px;
  }
  .m_priceWrap__base + .m_priceWrap__option{
    margin-top: 36px;
    padding-top: 36px;
  }
  .m_priceWrap__base + .m_priceWrap__option::before{
    top: 0;
    bottom: auto;
    left: 0;
    right: 0;
    transform: translateY(-50%);
  }
}
@media screen and (max-width: 768px){
  .m_priceWrap__wrap{
    padding: 16px 8px;
  }
}
/* 価格のラッパー */
.m_priceWrap__list{}
.m_priceWrap__listItem{}
.m_priceWrap__listItem:nth-child(odd){
  background: #f2f2f2;
}
.m_priceWrap__list + .m_priceWrap__detail{
  margin-top: 24px;
}
/* 価格 */
.m_price{
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 12px 0;
}
.m_price__ttl{
  width: 50%;
  padding: 0 16px 0 32px;
  text-align: right;
}
.m_price__body{
  width: 50%;
  padding: 0 32px 0 16px;
  text-align: right;
}
.m_price__body--single{
  width: 100%;
  text-align: center;
}
.m_price__num{
  display: inline-block;
  font-size: 20px;
  line-height: 100%;
}
@media screen and (max-width: 768px){
  .m_price__ttl{
    width: 45%;
    padding: 0 16px 0 16px;
  }
  .m_price__body{
    width: 55%;
    padding: 0 16px 0 16px;
  }
}
@media screen and (max-width: 599px){
  .m_price__ttl{
    padding: 0 8px 0 8px;
  }
  .m_price__body{
    padding: 0 8px 0 8px;
  }
}

/* 価格に含まれるもの */
.m_priceDetail{
  padding: 16px;
  border: 4px solid #f2f2f2;
}
.m_priceDetail__ttl{
  margin-bottom: 8px;
  font-weight: bold;
}
.m_priceDetail__body{}

/* 脚注リスト */
.m_footnotes{}
.m_footnotes__item + .m_footnotes__item{
  margin-top: 6px;
}

/* 脚注 */
.m_footnote{
  position: relative;
  padding-left: 1em;
  font-size: 12px;
  color: #474747;
}
.m_footnote::before{
  content: "※";
  position: absolute;
  left: 0;
  display: block;
}

/* その他パッケージプランのカード（一部修正） */
.m_lineup_pack_card {
  position: relative;
  display: flex;
  flex-direction: column;
  /* width: 100%; */
  /* height: 100%; */
  padding: 25px;
  color: #333333;
  background: #fff;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  transition: opacity .3s;
}
.m_lineup_pack_card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-left: 55px solid #69B08E;
  border-bottom: 55px solid transparent;
}
.m_lineup_pack_card:hover {
  color: #333333;
  opacity: .6;
  text-decoration: none;
}

.m_lineup_pack_card_heading {
  text-align: center;
}

.m_lineup_pack_card_heading_ttl {
  font-size: 16px;
  font-weight: bold;
  line-height: 26px;
}

.m_lineup_pack_card_heading_ttl span{
  display: block;
  font-size: 20px;
}

.m_lineup_pack_card_img {
  width: 80%;
  margin: 25px auto 0;
  text-align: center;
  line-height: 0;
}

.m_lineup_pack_card_img img {
  max-width: 100%;
  height: auto;
}

.m_lineup_pack_card_txt {
  margin-top: 20px;
  font-size: 16px;
}

.m_lineup_pack_card_tag_wrap {
  margin-top: auto;
}

.m_lineup_pack_card_tagList {
  display: flex;
  flex-wrap: wrap;
  margin-top: 20px;
}

.m_lineup_pack_card_tagItem {
  border: 1px solid #0A8B4D;
  border-radius: 15px;
  margin: 5px 15px 0 0;
  padding: 5px 15px;
  color: #0A8B4D;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .m_lineup_pack_card {
    max-width: none;
    padding: 20px;
  }
  .m_lineup_pack_card::after {
    border-left: 36px solid #69B08E;
    border-bottom: 36px solid transparent;
  }
  .m_lineup_pack_card_heading_ttl {
    font-size: 14px;
  }
  .m_lineup_pack_card_heading_ttl span {
    font-size: 17px;
  }
  .m_lineup_pack_card_img {
    margin-top: 15px;
  }
  .m_lineup_pack_card_txt {
    margin-top: 15px;
    font-size: 14px;
  }
  .m_lineup_pack_card_tagList {
    margin-top: 15px;
  }
  .m_lineup_pack_card_tagItem {
    font-size: 12px;
  }
}
/* 人事システムラクラクおまかせパック */
.m_priceWrap__baseOnly {
  width: 100%;
  display: flex;
  gap: 40px;
}
.m_priceWrap__initial {
  display: flex;
  width: 100%;
  max-width: 276px;
}
.m_priceWrap__tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 108px;
  height: 91px;
  background-color: #E2E2E3;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
.m_price_initial__free {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #F2F2F2;
  font-size: 36px;
  font-weight: bold;
}
.m_priceWrap_system {
  position: relative;
  display: flex;
  width: 100%;
}
.m_priceWrap_system::before {
  content: "＋";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -20px;
  font-size: 36px;
  display: block;
  width: 1em;
  height: 1em;
  margin: auto;
  line-height: 1;
  transform: translateX(-50%);
}
.m_price_system__lg {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #F2F2F2;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.2;
}
.m_price_system__sm {
  display: inline-block;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .m_priceWrap__baseOnly {
    flex-direction: column;
  }
  .m_priceWrap__initial {
    max-width: 100%;
  }
  .m_price_initial__free {
   font-size: 26px;
  }
  .m_priceWrap_system::before {
   top: -50%;
   bottom: auto;
   left: 50%;
   font-size: 26px;
   transform: translate(-50%, 50%);
  }
  .m_price_system__lg {
    font-size: 24px;
  }
  .m_price_system__sm {
   font-size: 13px;
  }
}