@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700;900&display=swap');

/* パンくず */
.bootstrap .breadcrumb{
  padding: 0.75rem 0;
  background: transparent;
}
@media (max-width: 768px) {
  .bootstrap .breadcrumb{
    display: none;
  }
}

/* ブロック */
.content-block{
  margin: 80px 0;
}

/* リンク */
.content-inner a{
  color: #333;
  text-decoration: underline;
}
.content-inner a:hover{
  color: #bc2739;
  text-decoration: none!important;
}

.atten-link{
  margin-left: 4px;
}
.atten-link a,
.text-color--blue{
  color: #0081CC!important;
}
.text-underline{
  text-decoration: underline!important;
}

/* テキスト */
.service-detail__block p{
  line-height: 1.5;
}

.font--lato {
  font-family: 'Lato', 'Noto Sans JP', Helvetica, Neue Haas Grotesk, Arial;
}

/* 値段 */
.price{
  font-size: 14px!important;
}
.value-text{
  font-family: 'Lato', 'Noto Sans JP', Helvetica, Neue Haas Grotesk, Arial;
  font-size: 24px;
  font-weight: 900;
}
.unit-text{
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* リスト */
/* 先頭に中黒付きリスト */
.dot-list__item{
  position: relative;
  padding-left: 18px;
}
.dot-list__item::before{
  position: absolute;
  top: 1em;
  left: .5em;
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #272727;
  font-size: 14px;
}
.dot-list__item sup{
  font-size: 14px;
}

/* 注釈 */
.note__item,
.note__item p,
.service-detail__block p.note__item{
  font-size: 14px;
}
.note__item *,
.asterisk-text *{
  text-indent: 0;
}

/* ※テキスト */
.asterisk-text{
  margin-left: 1em!important;
  text-indent: -1em;
}
.asterisk-text::before{
  content: "※";
  display: inline-block;
  text-indent: 0;
}

/* ※+数字テキスト */
.note--numbered .note__item,
.service-detail__block .note--numbered p.note__item{
  margin-left: 3em;
  text-indent: -3em;
  line-height: 1.7;
}
.note--numbered .note__item span{
  margin-right: 18px;
}
.note--numbered .note__item--2digit{
  margin-left: 2.8em;
  text-indent: -2.8em;
}
.note--numbered .note__item--2digit span{
  margin-right: 10px;
}
.note--numbered .note__item + .note__item{
  margin-top: 10px;
}

.note__item + .note__item{
  margin-top: 4px;
}



/* テーブル */
table{
  width: 100%;
}

/* スライダー */
.slick-next,
.slick-prev{
  width: 40px;
  height: 40px;
}
.slick-next{
  right: 4px;
}
.slick-prev{
  left: 4px;
}
.slick-next:before{
  background: url(/sites/default/files/media/service/imot/image/slider_arrow-bk-r.webp) no-repeat center / 100%;
  background-size: contain;
}
.slick-prev:before{
  background: url(/sites/default/files/media/service/imot/image/slider_arrow-bk-l.webp) no-repeat center / 100%;
  background-size: contain;
}
.slick-dots{
  bottom: -30px;
  margin: 0!important;
}
.slick-dots li,
.slick-dots li button{
  width: 10px;
  height: 10px;
}

@media (max-width: 768px) {
  /* ブロック */
  .content-block{
    margin: 50px 0;
  }
  .content-inner--sp-pd0{
    padding: 0;
  }

  .scroll-block{
    padding: 0;
  }
}



/* MVエリア */
.service-detail__main-visual .main-visual--inr .main-heading{
  margin: 0;
  padding-left: 20px;
  border-left: 5px solid #BC2739;
  font-size: 44px;
  font-weight: bold;
  line-height: 1.3;
}

.main-visual--inr picture{
  display: inline-block;
  margin: 30px auto 0;
}

/* 注釈 */
.service-detail__cart-wrap .note__item{
  margin-top: 8px;
  font-size: 12px;
}

/* 右側ブロック */
.service-detail__cart{
  padding: 20px 20px 24px;
}
.service-detail__cart .cart-inr{
  padding: 24px 16px;
}
.price-detail p{
  margin-bottom: 0!important;
}
.price-category{
  font-size: 18px;
  font-weight: 700;
}
.price-box + .price-category{
  margin-top: 20px;
}
.service-detail__cart .cart-inr .price-box{
  align-items: center;
}
.service-detail__cart .cart-inr .price-box:nth-child(n+2){
  margin-top: 5px;
}
.price-text{
  font-size: 14px;
}
.service-detail__cart .cart-inr .price{
  font-size: 14px;
}
.service-detail__cart .cart-inr .price span.text{
  color: #000;
  font-size: 14px;
  font-weight: 400;
}
.service-detail__links{
  display: flex;
  align-items: center;
  flex-direction: column;
  margin: 20px 0 0;
}
.service-detail__links .oval-link--red{
  width: 289px;
}
.service-detail__links .text-underline{
  color: #272727 !important;
  font-size: 14px;
  font-weight: 700;
}
.service-detail__links .text-underline:hover{
  color: #85B7FE!important;
}

.service-detail__links .oval-link + .oval-link{
  margin-top: 10px;
}
.service-detail__links .oval-link + .text-underline{
  margin-top: 20px;
}

@media only screen and (max-width: 768px) {
  .service-detail__main-visual{
    margin: 60px auto 0;
  }
  .tag-group__item img{
    height: 32px;
  }
  .service-detail__main-visual .main-visual--inr .heading{
    padding: 0 20px;
  }
  .service-detail__main-visual .main-visual--inr .main-heading{
    padding: 0 0 0 20px;
    font-size: 44px;
  }
   .service-detail__main-visual .main-visual--inr .main-heading span{
    font-size: 24px;
  }

  .main-visual--inr picture{
    margin: 30px 0 0;
  }
  .note__item{
    line-height: 1.8;
  }
}



/* MV下ブロック */
.mv-under{
  margin: 52px 0 0;
  padding: 40px 0 50px;
  background: url(/sites/default/files/media/service/imot/image/benefit_bg-pc.webp);
}
.benefit-heading{
  text-align: center;
}
.benefit-heading span{
  position: relative;
  display: inline-block;
  padding: 0 42px;
  color: #fff;
  font-size: 32px;
  font-weight: 900;
  line-height: 1.1;
}
.benefit-heading span::before,
.benefit-heading span::after{
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 5px;
  height: 44px;
  background: #FDD000;
}
.benefit-heading span::before{
  left: 0;
  transform: translateY(-50%) rotate(-26deg);
}
.benefit-heading span::after{
  right: 0;
  transform: translateY(-50%) rotate(26deg);
}

.benefit-list{
  max-width: 870px;
  margin: 40px auto 0!important;
}
.benefit-item{
  display: flex;
  align-items: center;
  gap: 40px;
}
.benefit-item p{
  margin-bottom: 0!important;
}
.benefit-item + .benefit-item{
  margin-top: 30px;
}
.benefit-title{
  width: calc(100% - 680px);
  margin: 0 !important;
  color: #fff;
  font-size: 22px!important;
  font-weight: 900!important;
}
.benefit-detail{
  width: 640px;
  max-width: 100%;
  padding: 10px 24px;
  border-radius: 10px;
  background: #fff;
}
.benefit-detail__title{
  margin: 0 !important;
  color: #bc2739;
  font-size: 25px!important;
  font-weight: 900!important;
}
.benefit-detail__text{
  margin: 10px 0 0!important;
  color: #4C4C85;
  font-size: 16px;
}
/* カンタンWEB申し込み */
.benefit-item--web .benefit-detail{
  display: flex;
  align-items: center;
  gap: 20px;
}
.benefit-item--web .benefit-detail__image{
  width: 99px;
  margin: 0;
}
.benefit-item--web .benefit-detail__body{
  width: calc(100% - 119px);
}
/* 事務手数料が無料 */
.benefit-item--commission .benefit-detail{
  padding: 10px 18px;
  background: #CC0033;
}
.benefit-item--commission .benefit-image{
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 0 6px;
}
.benefit-image__text{
  color: #fff;
  font-size: 19px;
  font-weight: 900;
  line-height: 1.3;
}
.benefit-image__item{
  border-radius: 0 10px 10px 0;
  overflow: hidden;
}
.benefit-item--commission .benefit-image img{
  width: 396px;
}
.benefit-item--commission .note{
  color: #fff;
  margin: 5px 0 0;
}
.benefit-item--commission .note__item{
  font-size: 13px;
}
.benefit-item--commission .note__item + .note__item{
  margin-top: 2px;
}

/* ImoTロゴポーチをプレゼント */
.benefit-item--present .benefit-detail{
  padding: 0;
  background: #F3EFFF;
}
.benefit-item--present .benefit-detail__body{
  padding: 8px 30px 16px;
}
.benefit-item--present .benefit-detail__title{
  font-size: 20px!important;
  text-align: center;
}
.benefit-item--present .benefit-detail__text{
  margin-top: 6px !important;
}

@media only screen and (max-width: 768px) {
  .mv-under{
    margin: 50px 0 0;
    padding: 38px 0 48px;
    background: url(/sites/default/files/media/service/imot/image/benefit_bg-sp.webp);
  }
  .mv-under .content-inner{
    padding: 0 16px;
  }

  h2.benefit-heading{
    margin: 0;
    padding: 0;
    border: none;
  }
  .benefit-heading span{
    padding: 0 30px;
    line-height: 1.2;
  }
  .benefit-heading span::before,
  .benefit-heading span::after{
    top: auto;
    bottom: 0;
  }
  .benefit-heading span::before{
    transform: rotate(-26deg);
  }
  .benefit-heading span::after{
    transform: rotate(26deg);
  }

  .benefit-list{
    margin-top: 48px!important;
  }
  .benefit-item{
    flex-direction: column;
    gap: 12px;
  }
  .benefit-item + .benefit-item{
    margin-top: 40px;
  }
  .benefit-title{
    width: 100%;
    text-align: center;
  }
  .benefit-detail{
    padding: 16px 20px;
  }
  .benefit-detail__title{
    font-size: 20px!important;
    line-height: 1.5!important;
  }
  .benefit-detail__text{
    margin-top: 2px !important;
    line-height: 1.5;
  }

  /* 事務手数料が無料 */
  .benefit-item--commission .benefit-image{
    flex-direction: column;
  }
  .benefit-item--commission .benefit-detail{
    padding: 10px 0 12px;
  }
  .benefit-item--commission .benefit-image{
    gap: 5px;
  }
  .benefit-image__text{
    text-align: center;
  }
  .benefit-image__item{
    margin: 0 14px;
    border-radius: 10px;
  }
  .benefit-item--commission .note{
    margin: 2px 22px 0;
  }
  .benefit-item--commission .note__item{
    line-height: 1.6;
  }

  /* ImoTロゴポーチをプレゼント */
  .benefit-item--present .benefit-detail__body{
    padding: 4px 20px 18px;
  }
  .benefit-item--present .benefit-detail__text{
    font-size: 15px;
  }

}



/* ImoTとは？ */
.how-heading{
  display: flex;
  align-items: end;
  justify-content: center;
  font-size: 24px!important;
  font-weight: 700!important;
}
.how-heading img{
  width: 250px;
}

.lead-text{
  margin: 24px 0 0!important;
  font-size: 22px!important;
}

.left-border__heading{
  margin: 80px 0 30px!important;
  padding-left: 20px;
  border-left: 5px solid #BC2739;
  font-size: 24px!important;
  font-weight: 700!important;
  line-height: 1.5!important;
}
.left-border__heading--gray{
  border-left-color: #7D7D7D;
  font-size: 18px!important;
}
.service-detail__block{
  margin-top: 0;
}
.service-detail__block p.lead-text{
  margin-top: 30px!important;
}

.how .note__item{
  margin: 3px 0 0;
  text-align: center;
}
.how .lead-text{
  text-align: center;
}
.how-image{
  max-width: 1000px;
  margin: 50px auto 0!important;
}

@media only screen and (max-width: 768px) {
  h2.how-heading{
    margin: 0;
    padding: 0;
    border: none;
  }

  .how .note__item{
    text-align: left;
  }
  .how .note__item{
    margin-top: 5px;
  }

}



/* 活用例/利用シーン */
.scene-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 44px 50px;
  max-width: 1000px;
  margin: 30px auto 0 !important;
}
.scene-item{
  width: calc((100% - 100px) / 3);
}
.scene-item__title{
  margin: 0!important;
  padding: 8px 10px 10px;
  border: none;
  border-radius: 10px 10px 0 0;
  background: #F3F3F3;
  color: #7F64EE;
  font-size: 22px!important;
  font-weight: 600!important;
  text-align: center;
  line-height: 1.1!important;
}

.scene-item__image{
  margin: 0!important;
}

.check-block{
  display: block;
  text-align: center;
}
.check-list{
  display: inline-block;
}
.check-item{
  position: relative;
  margin: 10px 0 0;
  padding-left: 40px;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
}
.check-item + .check-item{
  margin-top: 15px;
}
.check-item::before{
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: inline-block;
  width: 27px;
  height: 27px;
  background: url(/sites/default/files/media/service/imot/image/icon_check.webp) no-repeat center / contain;
}


/* 対象エリア */
.link-block{
  margin: 34px 0 0;
  text-align: center;
}
.link-block .oval-link{
  padding: 15px 65px;
}

@media only screen and (max-width: 768px) {
  .scene-list{
    flex-direction: column;
    margin-top: 30px!important;
    gap: 36px;
    max-width: 300px;
  }
  .scene-item{
    width: 100%;
  }

  .check-item{
    margin-top: 12px;
  }

}



/* 料金 */
.charge.content-block{
  margin-top: 104px;
}
.service-detail__block .charge .lead-text{
  text-align: left;
}
/* タブボタンデザイン */
.tab-btns{
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 20px;
  margin: 70px 0 0!important;
}
.tab-btn{
  width: 50%;
  padding: 0 20px;
  text-align: center;
}
.tab-btn__sb{
  position: relative;
  display: inline-block;
  margin: 0!important;
  padding: 12px 25px;
  border-radius: 100vh;
  background: #CCC;
  color: #fff;
  font-size: 17px;
  font-weight: bold;
  line-height: 1.8 !important;
}
.tab-btn__sb::before{
  content: "";
  display: inline-block;
  border-top: 10px solid #CCC;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
}
.tab-btn__button{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  margin: 20px 0 0!important;
  border-radius: 10px 10px 0 0;
  background: #ccc;
  color: #fff;
  font-size: 18px!important;
  font-weight: bold;
}
.tab-btn__button span{
  display: flex;
  align-items: flex-end;
  line-height: 1;
}

.tab-btn--iot .tab-btn__button img{
  width: 94px;
}
.tab-btn--iot-mini .tab-btn__button img{
  width: 70px;
}

.tab-btn.is-active{
  padding: 0;
}
.tab-btn.is-active .tab-btn__sb{
  background: #000;
  font-size: 20px;
}
.tab-btn.is-active .tab-btn__button{
  min-height: 80px;
  background: #7F64EE;
}
.tab-btn.is-active .tab-btn__sb::before{
  border-top-color: #000;
}

.tab-btn--iot.is-active .tab-btn__button img{
  width: 125px;
}
.tab-btn--iot-mini.is-active .tab-btn__button{
  background: #C04EC4;
  font-size: 24px !important;
}
.tab-btn--iot-mini.is-active .tab-btn__button img{
  width: 95px;
  margin-right: 3px;
}

/* タブ本体デザイン */
.charge-comparison{
  padding: 50px;
  text-align: center;
}
.charge-comparison p{
  margin-bottom: 0!important;
}
.charge-comparison:not(.is-active){
  display: none;
}
.service-detail__block p.charge-comparison__text{
  font-size: 22px;
}
.charge-type{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin: 24px 0 0;
}
.charge-type__image{
  width: 180px;
}
.charge-type__plan{
  width: 490px;
}
.charge-type__plan-item{
  display: flex;
  align-items: center;
}
.charge-type__plan-item::after {
  content: '';
  flex: 1 1 auto;
  height: 24px;
  margin: 0 28px;
  background: radial-gradient(#ccc 20%, transparent 0) center / 24px 24px;
  order: 1;
}
.charge-type__plan-gb,
.charge-type__plan-price{
  font-family: 'Lato', 'Noto Sans JP', Helvetica, Neue Haas Grotesk, Arial;
  font-size: 24px!important;
  font-weight: bold;
  line-height: 1.3!important;
}
.charge-type__plan-price {
  order: 2;
}
.charge-type__plan .note__item{
  text-align: left;
}
.charge-type__plan .note__item p{
  line-height: 1.8;
}

.charge-type__plan-gb .value-text{
  font-size: 40px;
}
.charge-type__plan-gb .unit-text{
  font-size: 32px;
  font-weight: 900;
}
.charge-type__plan-price .value-text{
  color: #7760D4;
  font-size: 50px;
}
.charge-type__plan-price .unit-text{
  font-size: 24px;
}

.charge-point{
  margin: 28px 0 0!important;
  color: #7F64EE;
  font-size: 24px!important;
  font-weight: 900;
}
.charge-image{
  margin: 10px auto 0!important;
  max-width: 1000px;
}

.charge-comparison--imot{
  background: #ECEBFF;
}
.charge-comparison--imot-mini{
  background: #f3f3f3;
}
.charge-type--imot-mini .charge-type__plan-price .value-text{
  color: #7760D4;
}
.charge-type--imot-mininosms .charge-type__plan-price .value-text{
  color: #C04EC4;
}
@media only screen and (max-width: 768px) {
  .charge.content-block{
    margin-top: 88px;
  }
  .charge .sub-heading,
  .charge .lead-text{
    margin-right: 24px!important;
    margin-left: 24px!important;
  }

  /* タブボタンデザイン */
  .tab-btns{
    gap: 10px;
    margin: 35px 15px 0!important;
  }
  .tab-btn__sb,
  .tab-btn.is-active .tab-btn__sb{
    border-radius: 10px;
    font-size: 14px!important;
  }
  .tab-btn--iot-mini.is-active .tab-btn__button{
    font-size: 15px !important;
  }
  .tab-btn__sb{
    width: 100%;
    padding: 15px 0;
  }
  .tab-btn{
    padding: 0;
  }
  .tab-btn__button{
    flex-direction: column;
    margin-top: 16px;
    font-size: 10px !important;
  }

  .tab-btn--iot .tab-btn__button img{
    width: 62px;
  }

  .tab-btn--iot-mini .tab-btn__button img{
    width: 41px;
  }
  .tab-btn--iot-mini.is-active .tab-btn__button img{
    width: 60px;
  }

  /* タブ本体デザイン */
  .charge-comparison{
    padding: 30px 16px;
  }
  .charge-type__image{
    width: 150px;
    margin: 0 auto;
  }
  .service-detail__block p.charge-comparison__text{
    margin-top: 20px;
  }
  .service-detail__block .charge-comparison__text +.charge-comparison__text{
    margin-top: 10px;
  }

  .charge-type{
    flex-direction: column;
    gap: 5px;
  }
  .charge-type__plan{
    width: 100%;
    padding: 0 34px 0 30px;
  }
  .charge-type__plan-item{
    flex-wrap: wrap;
    margin-top: 10px;
  }
  .charge-type__plan-item + .charge-type__plan-item{
    margin-top: 28px;
  }
  .charge-type__plan-gb,
  .charge-type__plan-price{
    line-height: 1 !important;
  }
  .charge-type__plan-gb{
    width: 100%;
    text-align: left;
  }

  .charge-type__plan .note__item{
    margin-top: 25px;
  }

  .charge-point{
    margin-top: 46px !important;
  }

  .charge-comparison--imot-mini .charge-type{
    margin-top: 30px;
  }
  .charge-comparison--imot-mini .charge-type__image{
    width: 180px;
  }
  .charge-comparison--imot-mini .charge-type__plan{
    padding: 0 0 0 10px;
  }

}


/* 料金プラン概要 */
.plan-table th{
  border: none!important;
  background: #4C4C4C;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
}
.plan-table th + th{
  border-left: 2px solid #fff!important;
}
.plan-table th,
.plan-table td{
  position: relative;
  padding: 10px;
  text-align: center;
  vertical-align: middle;
}
.plan-table td{
  border: 2px solid #E3E3E3;
  background: #F3F3F3;
}
.plan-table tr:first-of-type td{
  border-top: none;
}
.plan-table td .price{
  line-height: 1.2;
}
.plan-table td.bg--white,
.plan-table tr.bg--white td{
  background: #fff;
}
.icon-recommend{
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 10px);
}
.sub-heading,
.bootstrap h2.sub-heading,
.bootstrap h3.sub-heading{
  display: block;
  margin: 80px 0 30px;
  padding-bottom: 16px;
  border-bottom: 4px solid #e5e5e5;
  font-size: 32px;
  font-weight: 700;
}
.sub-heading::after{
  display: none;
}
.sub-heading::before{
  display: none;
}
.sub-heading:before{
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 4px #bc2739;
  bottom: -4px;
  width: 204px;
}

.charge-plan .note{
  margin: 10px 0 0;
}
@media only screen and (max-width: 768px) {
  .charge-plan .left-border__heading{
    margin: 72px 0 0;
  }

  .plan-table{
    min-width: 1224px;
  }
}



/* ImoTとのご利用におすすめのWi-Fiルーター */
.recommend.content-block{
  margin-top: 90px;
}
.recommend .left-border__heading{
  margin-top: 30px!important;
}
.recommend-top{
  display: flex;
  gap: 30px;
}
.recommend-product{
  width: 500px;
}
.recommend-detail{
  width: calc(100% - 530px);
}
.recommend-detail__title{
  margin: 0 !important;
  font-size: 24px!important;
  font-weight: bold;
}
.recommend-detail .price{
  font-size: 24px !important;
  font-weight: bold;
}
.recommend-detail .value-text{
  font-size: 50px;
}
.recommend-detail .unit-text{
  margin: 0 6px;
  font-size: 24px;
}
.recommend-detail__text{
  margin: 20px 0 0;
  font-size: 22px!important;
}
.recommend-detail__text + .note{
  margin: 10px 0 0;
}
.recommend-detail .link-block{
  text-align: left;
}
.recommend-detail .oval-link{
  padding: 15px 58px;
/*  max-width: 278px;*/
}
.recommend-detail .oval-link + .oval-link{
  margin-left: 30px;
}

/* スライダー個別設定 */
.recommend-product .slider__item{
  height: 208px;
}
.recommend-product .slider__item img{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0 auto;
}
.color-box{
  width: 157px;
  margin: 40px auto 0;
  padding: 10px;
  border: 2px solid #BC2739;
}
.color-box p{
  margin-bottom: 0;
}
.color-box__item{
  width: 26px;
  height: 26px;
  border-radius: 50%;
  margin: 0 auto;
}
.color-box__item--white{
  border: 2px solid #E5E5E5;
  background: #fff;
}
.service-detail__block p.color-box__text{
  margin-top: 3px;
  font-size: 14px;
  text-align: center;
}

/* 主な機能 */
.tbl-section thead th{
  padding: 11px 0;
  border-bottom: 2px solid #fff!important;
  background-color: #4c4c4c;
  color: #fff;
  font-weight: 400;
  text-align: center;
}
.tbl-section thead tr:first-child th{
  border-color: #4c4c4c;
}
.tbl-section thead th:nth-child(even){
  border-bottom: 2px solid #E3E3E3!important;
}
.tbl-section thead th + th{
  border-left: 2px solid #fff!important;
}
.tbl-section th{
  width: 350px;
  padding: 7px 20px;
  border: 1px solid #E3E3E3;
  background: #E5E5E5;
  color: #272727;
  font-weight: bold;
  text-align: left;
}
.tbl-section th,
.tbl-section td{
  vertical-align: middle;
}
.tbl-section th,
.tbl-section td{
  padding: 12px 18px;
  border: 2px solid #E3E3E3;
}
.tbl-section th{
  border-top: 2px solid #E3E3E3;
}
.tbl-section tr:not(:first-of-type) th{
  border-top: 2px solid #fff;
}
.tbl-section tr:not(:last-of-type) th{
  border-bottom: 2px solid #fff;
}
.tbl-section + .note{
  margin-top: 30px;
}

.service-detail__block p.tbl-section__text{
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}
@media only screen and (max-width: 768px) {
  .recommend .lead-text{
    text-align: left;
  }
  .recommend-top{
    flex-direction: column;
  }
  .recommend-product{
    width: 100%;
  }
  .recommend-detail{
    width: 100%;
  }

  .recommend-product .slider__item{
    height: 158px;
  }

  .recommend-detail .link-block{
    text-align: center;
  }
  .recommend-detail .oval-link + .oval-link{
    margin: 30px 0 0;
  }

  .recommend .left-border__heading{
    margin-top: 60px;
  }
  .tbl-section th,
  .tbl-section td{
    padding: 12px 16px;
  }
  .tbl-section th{
    width: 38%;
  }

}



/* ご利用開始までの流れ */
.flow.content-block{
  margin: 76px 0 0;
}
.step-list{
  display: flex;
  gap: 50px;
}
.step-item{
  position: relative;
  width: calc((100% - 100px) / 3);
  padding: 18px 14px 22px;
  border: 8px solid #ECEBFF;
  border-radius: 20px;
  text-align: center;
}
.step-item:nth-child(n + 2)::before{
  content: "";
  position: absolute;
  top: 50%;
  left: -42px;
  transform: translateY(-50%);
  display: inline-block;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-left: 20px solid #7D7D7D;
}
.service-detail__block p.step-step{
  display: inline-block;
  margin: 0;
  padding: 10px 30px;
  border-radius: 100vh;
  background: #7760D4;
  color: #fff;
  font-family: 'Lato', 'Noto Sans JP', Helvetica, Neue Haas Grotesk, Arial;
  font-size: 25px;
  font-weight: 700;
  line-height: 1;
}
.step-step span{
  display: inline-block;
  margin-left: 4px;
  font-size: 29px;
}
.step-title{
  margin: 14px 0 0 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
}
.step-image{
  display: block;
  width: 269px;
  margin: -6px auto 0;
}
.service-detail__block p.step-text{
  margin: -8px 0 0;
  font-size: 16px;
  text-align: left;
}

.step-item--01 .step-image{
  margin-top: -20px;
}
.service-detail__block .step-item--01 p.step-text{
  margin-top: 20px;
}

.step-item--03 .step-image{
  width: 305px;
  margin: 8px auto 0;
}
.step-item--03 .step-text{
  margin-top: 22px!important;
}

.step-list + .left-border__heading{
  margin-top: 70px;
}
@media only screen and (max-width: 768px) {
  .step-list{
    flex-direction: column;
  }
  .step-item{
    width: 100%;
    padding: 18px 14px 24px;
  }
  h3.step-title{
    display: block;
    min-height: auto;
    padding: 0;
  }
  .step-image{
    width: 76.5%;
    margin-top: -6px;
  }

  .step-item:nth-child(n + 2)::before{
    border-top: 20px solid #7D7D7D;
    border-right: 20px solid transparent;
    border-left: 20px solid transparent;
    left: 50%;
    transform: translateX(-50%);
    border-bottom: none;
    top: -42px;
  }
}

/* ご利用までの詳細なお手続きについて */
.accordion-heading{
  cursor: pointer;
  position: relative;
  transition: all 0.25s;
}
.accordion-heading:after{
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  bottom: auto;
  transform: translateY(-50%);
  display: inline-block!important;
  width: 16px;
  height: 16px;
  border: none;
  background: url(/sites/default/files/media/service/imot/image/icon_plus.webp) no-repeat center / 100%;
}
.accordion-heading.is-active::after{
  background: url(/sites/default/files/media/service/imot/image/icon_minus.webp) no-repeat center / 100%;
}
@media only screen and (max-width: 768px) {
  .accordion-heading{
    padding-right: 38px;
  }
}
.accordion-body{
  margin: 30px 0 0;
  padding: 0;
}



/* よくあるご質問 */
.faq-answer__block *{
  font-size: 16px!important;
  line-height: 1.8 !important;
}
.faq-list > li{
  border: none;
}
.faq-answer__block ul + p{
  margin-top: 30px;
}
.faq-answer__block .note--numbered{
  margin: 0;
}
.faq-answer__block .note--numbered .note__item{
  margin-left: 1.75em;
  text-indent: -1.75em;
}
.faq-answer__block .note--numbered .note__item::before{
  margin: 0;
}



/* 注意事項 */
.attention .dot-list__item,
.attention .note__item{
  font-size: 14px;
}
.attention .dot-list__item:not(:first-of-type),
.attention .note__item:not(:first-of-type){
  margin-top: 16px;
}
.attention .dot-list__item::before{
  top: calc(.5em);
  left: 2px;
  width: 6px;
  height: 6px;
}
.attention .note__item--asterisk::before{
  margin-right: 4px;
}


/* フッター */
.footer-sitemap__block--col2 .sitemap-list__item{
  margin: 0px 0 16px;
}
.footer-sitemap .sitemap-list--col1 .sitemap-list__item {
  margin-right: 24px;
}
