@charset "UTF-8";

/* --------------------------- 

事例 SP

------------------------------ */
.case-wrap{
  padding: 5rem 1.5rem;
  background: url(../img/case-bg.jpg);
}
.case-wrap section{
  max-width: 124rem;
  margin: 0 auto;
}
.case-wrap section h2{
  width: 28rem;
  margin: 0 auto;
  padding: 0 0 3rem;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  position: relative;
}
.case-wrap section h2 span{
  color: var(--yellow);
  font-size: 2.6rem;
}
.case-wrap section h2::before{
  display: block;
  content: "CASE";
  width: 8rem;
  line-height: 1.2;
  text-align: center;
  border-radius: 1rem;
  color: var(--green);
  background: #fff;
  font-family: "Outfit", sans-serif;  
  font-size: 1.6rem;
  position: absolute;
  left: 10px;
  top: -5px;
}
.case-wrap section h2 + p{
  max-width: 60rem;
  margin: 0 auto 3rem;
  padding: 1rem 0;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-align: center;
  border-top: 1px solid #7ccec2;
  border-bottom: 1px solid #7ccec2; 
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;  
}
.case-wrap section h2 + p span{
  padding: 0 0.2rem;
  font-size: 1.8rem;
}

/* 事例タイトル SP --------- */
.case-wrap section .case-content{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.case-wrap section article{
  width: auto;
  margin: 0 0 1rem;
  padding: 2rem;
  border-radius: 1rem;
  background: #fff;
}
.case-wrap section article figure{
  text-align: center;
}
.case-wrap section article h3{
  display: flex;
  padding: 2rem 0;
}
.case-wrap section article h3 span{
  display: block;
}
.case-wrap section article h3 span:first-child{
  width: 5rem;
  padding: 0.5rem 0 0;
  line-height: 1.2;
  font-family: "Outfit", sans-serif;
  font-size: 1.4rem;  
  font-weight: 500;
}
.case-wrap section article h3 span:first-child strong{
  display: block;
  font-size: 2.4rem;
}

.case-wrap section article h3 span:last-child{
  width: calc(100% - 5rem);
  padding: 0 0 0 1rem;
  line-height: 1.4;
  border-left: 1px solid #ccc;
  font-size: 1.8rem;
  font-weight: bold;
}
.case-wrap section article h3 span:last-child strong{
  color: var(--green);
}

/* 事例料金表 SP --------- */
.case-tb{
  padding: 0 0 3rem;
}
table#case-list{
  width: 100%;
  color: #4d7b69;  
  font-size: 1.4rem;
}
table#case-list tr{
  border-top: 1px dashed #5f9982;
  border-bottom: 1px dashed #5f9982;
}
table#case-list th{
  width: 33%;
  padding: 0 0 0 1rem;
  text-align: left;
}
table#case-list td.tb-calc{
  width: 35%;
  text-align: right;
}
table#case-list td.tb-total{
  width: 32%;
  padding: 0 1rem 0 0;
  text-align: right;
}
table#case-list td.tb-total span{
  padding: 0 0.2rem;
  font-size: 1.8rem;  
  font-weight: bold;
}
table#case-list th,table#case-list td{
  padding: 1rem 0;
}

dl.case-cash{
  display: flex;
  align-items: center;
  border-radius: 6rem;
  overflow: hidden;
  background: var(--green);
}
dl.case-cash dt{
  width: 12rem;
  padding: 0 0 0 2rem;
  color: #fff;
  font-size: 1.8rem;
}
dl.case-cash dd{
  width: calc(100% - 12rem);
  padding: 0.5rem 2rem;
  text-align: right;
  color: #106961;
  font-size: 1.6rem;
  background: var(--bggr);
}
dl.case-cash dd span{
  padding: 0 0.2rem;
  font-size: 2.4rem;
  font-weight: bold;
}


/*----------------------------------------------------
SP 420 --
----------------------------------------------------*/
@media screen and (min-width:420px) {

  /* 事例タイトル SP 420 --------- */
  .case-wrap section article h3 span:last-child{
    width: calc(100% - 6rem);
  }
  .case-wrap section article h3 span:last-child{
    width: calc(100% - 6rem);
    padding: 0 0 0 1.5rem;
  }


}



/*----------------------------------------------------
TB 750-
----------------------------------------------------*/
@media screen and (min-width:750px) {

  .case-wrap{
    padding: 5rem 3rem;
  }

  /* 事例タイトル 750 --------- */
  .case-wrap section .case-content{
    flex-direction: row;    
  }
  .case-wrap section article{
    width: 48%;
    margin: 0;
    padding: 2rem;
    border-radius: 2rem;
  }

}


/*----------------------------------------------------
PC 1600-
----------------------------------------------------*/
@media screen and (min-width:1000px) {

  .case-wrap{
    padding: 10rem 3rem;
  }
  .case-wrap section h2{
    width: 41rem;
    padding: 0 0 1.5rem;
    font-size: 2.6rem;
  }
  .case-wrap section h2 span{
    font-size: 4rem;
  }
  .case-wrap section h2::before{
    width: 12rem;
    font-size: 1.8rem;
  }
  .case-wrap section h2 + p{
    margin: 0 auto 8rem;
    padding: 1.5rem 0;
    letter-spacing: 0.025em;
    font-size: 2rem;
  }
  .case-wrap section h2 + p span{
    font-size: 2.4rem;
  }


}

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

  .case-wrap{
    padding: 10rem 0;
  }

  /* 事例タイトル 1200 --------- */
  .case-wrap section article{
    padding: 3rem 4rem;
  }

  .case-wrap section article h3{
    display: flex;
    padding: 3rem 0;
  }
  .case-wrap section article h3 span:first-child{
    width: 8rem;
    padding: 0.5rem 0 0;
    font-size: 2.1rem;  
    font-weight: 700;
  }
  .case-wrap section article h3 span:first-child strong{
    display: block;
    font-size: 4.2rem;
  }
  .case-wrap section article h3 span:last-child{
    width: calc(100% - 8rem);
    padding: 0 0 0 3rem;
    line-height: 1.4;
    font-size: 2.6rem;
  }

  /* 事例料金表 1200 --------- */
  .case-tb{
    padding: 0 0 4rem;
  }
  table#case-list{
    font-size: 1.8rem;
  }
  table#case-list td.tb-total span{
    font-size: 2.1rem;  
  }

  dl.case-cash dt{
    width: 14rem;
    padding: 0 0 0 4rem;
    font-size: 2.1rem;
  }
  dl.case-cash dd{
    width: calc(100% - 14rem);
    padding: 1.5rem 4rem;
    font-size: 2.4rem;
  }
  dl.case-cash dd span{
    font-size: 3rem;
  }

}

/* --------------------------- 

特徴 SP

------------------------------ */
.features-wrap{
  padding: 5rem 1.5rem;
  background: var(--lgreen);
}

.features-wrap section{
  max-width: 124rem;
  margin: 0 auto;
}
.features-wrap section h2{
  width: 18rem;  
  margin: 0 auto;
  padding: 0 0 4rem;
}

.features-wrap section article{
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 1.5rem;
  padding: 3rem 2rem;
  border-radius: 1rem;
  border: 4px dashed var(--green);
}
.features-wrap section article.fea-03{
  border: 4px dashed var(--red);  
}
.features-wrap section article h3{
  width: 24rem;
  margin: 0 auto 2rem;
  position: relative;
}
.features-wrap section article h3 img{
  display: block;
  width: 20rem;
  margin: 0 auto;  
}
.features-wrap section article h3 span{
  display: block;
  width: 7rem;
  height: 7rem;
  padding: 1.8rem 0 0;
  text-align: center;
  line-height: 1.1;
  border-radius: 50%;
  background: #ebeb03;
  font-size: 1.4rem;
  font-weight: bold;
  position: absolute;
  z-index: 10;
}
.features-wrap section article.fea-03 h3 span{
  color: #fff;
  background: var(--bred);
}

.features-wrap section article.fea-01 h3 span{
  left: -4%;
  top: 62%;
}
.features-wrap section article.fea-02 h3 span{
  left: -4%;
  top: 0;
}
.features-wrap section article.fea-03 h3 span{
  left: -4%;
  top: 2%;
}
.features-wrap section article h3 span strong{
  display: block;  
  font-family: "Outfit", sans-serif;
  font-size: 2.4rem;
  font-weight: 600;
}

/* 特徴 内容 SP 
------------------------------ */
.fea-content {
  width: auto;
  padding: 0;
  text-align: center;
}
.fea-content p.fea-catch,
.fea-content p.fea-catch-last{
  font-size: 2rem;
  font-weight: bold;
}

/* 03 ラスト SP  -------*/
.fea-content p.fea-catch-last{
  max-width: 36rem;
  margin: 0 auto;
  padding: 0 0 0 5rem;
  position: relative;
}
.fea-content p.fea-catch-last::before {
    display: block;
    content: url('../img/plan-icon-reco_sp.svg');
    width: 9rem;
    position: absolute;
    top: -10px;
    left: -40px;
}
@media screen and (min-width:420px) {
  .fea-content p.fea-catch-last::before {
      left: -15px;
  }
}

/* 01・03 SP  -------*/
.fea-content dl{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 0 1.5rem;
  padding: 0;
  line-height: 1.2;
  font-weight: bold;
}
.fea-content dl dt{
  line-height: 1.4;
  color: #fff;
  text-align: center;
  border-radius: 0.5rem;
  background: var(--bgreen);
  font-size: 1.8rem;
}

.features-wrap section article.fea-01 .fea-content dl dt{
  width: 7rem;  
}
.features-wrap section article.fea-02 .fea-content dl dt{
  width: 9rem;  
}
.fea-content dl dd{
  padding: 0 0 0 1rem;
  font-size: 1.6rem;
}
.fea-content dl dd strong{
  padding: 0 0.2rem;
  color: var(--bgreen);
  font-family: "Outfit", sans-serif;
  font-size: 3.6rem;
  font-weight: 600;
}
.fea-content dl dd small{
  font-size: 1.2rem;
}

/* 03 SP ----------- */
.fea-content p.fea-dl{
  margin: 0 0 1.5rem;
  padding: 0;
  line-height: 1.6;
  color: var(--bred);
  font-size: 2rem;
  font-weight: bold;  
}
.fea-content p.fea-dl span{
  font-size: 2.4rem;
}

/* 特徴 共通 文章 SP */
.fea-content p.fea-ttl{
  margin: 0;
  padding: 1rem 1rem 0;
  text-align: left;
  border-top:1px solid #ccc;
  font-size: 1.6rem;
}

/* 特徴 02 文章 SP */
.features-wrap section article.fea-02 p.fea-ttl span{
  display: block;
  font-size: 1.3rem;
}
.features-wrap section article.fea-02 p.fea-ttl small{
  font-size: 1.2rem;
}

/* 特徴 03 文章 SP */
.features-wrap section article.fea-03 p.fea-ttl span{
  color: var(--bred);
}


/*----------------------------------------------------
TB 750 --
----------------------------------------------------*/
@media screen and (min-width:750px) {

  .features-wrap{
    padding: 10rem 3rem;
  }

  .features-wrap section article{
    flex-direction: row;
    margin: 0 0 2rem;/* 4 */
    padding: 3rem 5rem;/* 3 120 */
    border-radius: 2rem;
  }
  .features-wrap section article.fea-02{
    flex-direction: row-reverse;
  }

  .features-wrap section article h3{
    width: 35%;
    margin: 0;
    padding: 0;
  }
  .features-wrap section article h3 img{
    width: 20rem;  
  }
  .features-wrap section article h3 span{
    width: 7rem;
    height: 7rem;
    padding: 1.8rem 0 0;
    font-size: 1.4rem;
  }
  .features-wrap section article h3 span strong{
    font-size: 2rem;
  }


  /* 特徴 内容 TB 
  ------------------------------ */
  .fea-content {
    width: 65%;
    padding: 0 0 0 3rem;
    text-align: left;
  }
  .features-wrap section article.fea-02 .fea-content{
    padding: 0 3rem 0 0;    
  }

  .fea-content dl{
    justify-content: flex-start;
  }


  /* 03 用 750 ----------- */
  .fea-content p.fea-catch-last{
    max-width: 100%;
    margin: 0;
    padding: 0 0 0 6rem;
  }
  .fea-content p.fea-catch-last::before {
    content: url('../img/plan-icon-reco_pc.svg');
    width: 10rem;
    position: absolute;
    top: 10px;
    left: -50px;
  }
  .fea-content p.fea-dl{
    padding: 0 0 0 5rem;
    line-height: 1.2;
  }

}


/*----------------------------------------------------
TB 1000 --
----------------------------------------------------*/
@media screen and (min-width:1000px) {

  .features-wrap section article{
    margin: 0 0 4rem;
    padding: 5rem 6rem;
  }
  .features-wrap section h2{
    width: 23.6rem;
    margin: 0 auto;
    padding: 0 0 8rem;
  }
  .features-wrap section article h3 img{
    width: 30rem;  
  }
  .features-wrap section article h3 span{  
    width: 10rem;
    height: 10rem;
    padding: 2.5rem 0 0;
    line-height: 1.1;
    font-size: 1.6rem;
  }
  .features-wrap section article.fea-01 h3 span{
    left: -12%;
    top: 60%;
  }
  .features-wrap section article.fea-02 h3 span{
    left: -10%;
    top: 0;
  }
  .features-wrap section article.fea-03 h3 span{
    left: -10%;
    top: 2%;
  }
  .features-wrap section article h3 span strong{
    font-size: 3rem;
  }


  /* 特徴 内容 1000 
  ------------------------------ */
  .fea-content {
    padding: 0 0 0 6rem;
  }
  .fea-content p.fea-catch,
  .fea-content p.fea-catch-last{
    font-size: 3rem;
  }

  /* 03 ラスト 1000  -------*/
  .fea-content p.fea-catch-last{
    padding: 0 0 0 10rem;
  }
  .fea-content p.fea-catch-last::before {
    content: url('../img/plan-icon-reco_pc.svg');
    width: 16rem;
    position: absolute;
    top: 0;
    left: -70px;
  }
  .fea-content p.fea-dl{
    padding: 0 0 0 10rem;    
    line-height: 1.6;
    font-size: 1.8rem;
  }
  .fea-content p.fea-dl span{
    font-size: 3rem;
  }

  .fea-content dl{
    margin: 0 0 2rem;
    line-height: 1.2;
  }
  .fea-content dl dt{
    line-height: 1.4;
    font-size: 2.4rem;
  }

  .features-wrap section article.fea-01 .fea-content dl dt{
    width: 9rem;  
  }
  .features-wrap section article.fea-02 .fea-content dl dt{
    width: 12rem;  
  }

  .fea-content dl dd{
    padding: 0 0 0 1.5rem;
    font-size: 2.4rem;
  }
  .fea-content dl dd strong{
    font-size: 4.6rem;
  }
  .fea-content dl dd small{
    font-size: 1.4rem;
  }

  /* 特徴 共通 文章 1000 */
  .fea-content p.fea-ttl{
    padding: 2rem 0 0;
    font-size: 2rem;
  }

  /* 特徴 02 文章 1000 */
  .features-wrap section article.fea-02 p.fea-ttl span{
    font-size: 1.6rem;
  }
  .features-wrap section article.fea-02 p.fea-ttl small{
    font-size: 1.4rem;
  }



}


/*----------------------------------------------------
PC 1200 --
----------------------------------------------------*/
@media screen and (min-width:1200px) {

  .features-wrap section article{
    padding: 5rem 12rem;
  }
  .features-wrap section article h3 span{  
    width: 12rem;
    height: 12rem;
    padding: 3rem 0 0;
    font-size: 1.8rem;
  }
  .features-wrap section article h3 span strong{
    font-size: 3.6rem;
  }


  /* 03 ラスト 1200  -------*/
  .fea-content p.fea-catch-last{
    padding: 0 0 0 12rem;
  }
  .fea-content p.fea-catch-last::before {
    top: 10px;
    left: -50px;
  }

  .fea-content p.fea-dl{
    font-size: 2.4rem;
  }
  .fea-content p.fea-dl span{
    font-size: 3.6rem;
  }


}


/* --------------------------- 

コース 

------------------------------ */
.couse-wrap{
  padding: 5rem 1.5rem;
  background: url(../img/couse-bg.jpg) no-repeat center bottom;
  background-size: 750px;
}
.couse-wrap section{
  max-width: 124rem;
  margin: 0 auto;
}
.couse-wrap section h2{
  width: 30rem;
  margin: 0 auto;
  padding: 0 0 2rem;
}
.couse-wrap section h2 + p{
  max-width: 72rem;
  margin: 0 auto;
  padding: 1.5rem 0;
  line-height: 1.6;
  letter-spacing: 0.025em;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;  
}
.couse-wrap section h2 + p span{
  font-size: 1.8rem;
}

/* コース [基本] 内容 SP
-------------------------*/
.couse-base{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 0 0 5rem;
  padding: 5rem 0 0;
  background-image: none;
}
.couse-base h3{
  height: 15px;
  margin: 0 2.5rem 2rem;
  text-align: center;
  border-top: 1px solid var(--green);
  border-left: 1px solid var(--green);
  border-right: 1px solid var(--green);   
  font-size: 2.4rem;
  font-weight: bold;
  writing-mode: horizontal-tb;
  color: var(--green);
  position: relative; 
}
.couse-base h3 span{
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  top: -25px;
}
.couse-base h3 span strong{
  display: block;
  width: 16rem;
  margin: 0 auto;
  text-align: center;
  background: #fff;
}

/* 枠のスタイルはすべて共通　SP ---------- */
.couse-wrap article{
  width: auto;
  margin: 0 0.5rem 1.5rem;
  box-shadow: 0 0 1rem rgba(102, 102, 102, 0.2);
  border-radius: 2rem;
  overflow: hidden;
}

/* コース[基本] 見出し SP --- */
.couse-note{
  display: flex;
  align-items: center;
  padding: 1.5rem 0 1rem;
  color: #fff;
  background: var(--green);
}
.couse-note > p{
  width: 8rem;
  text-align: center;
  line-height: 1.2;
  font-family: "Outfit", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
}
.couse-note > p span{
  display: block;
  letter-spacing: 0.05em;
  font-size: 2.1rem;
  font-weight: 500;  
}
.couse-note h4{
  width: calc(100% - 8rem);
  padding: 0 0 0 1.5rem;
  line-height: 1.6;
  border-left: 1px solid #76cac2;
  font-size: 2.1rem;
}
.couse-note h4 span{
  display: block;
  width: 7rem;
  line-height: 1.4;
  border-radius: 1.4rem;
  text-align: center;
  color: var(--green);
  background:#fff;
  font-size: 1.3rem;
  font-weight: 700;  
}
.couse-note h4 strong{
  color: var(--yellow);
}

/* コース[基本] 特徴 SP ---- */
.couse-content{
  padding: 1.5rem 1.5rem 1rem;
  background: #fff;
}
.couse-content dl{
  margin: 0 0 1rem;
  padding: 1.5rem;
  border-radius: 0.5rem;
  background: var(--bggr);
  font-weight: 700;
}
.couse-content dl dt,
.couse-content dl dd{
  line-height: 1.5;
}
.couse-content dl dt{
  padding: 0 0 0 2rem;
  border-bottom: 2px solid var(--green);
  font-size: 1.6rem;
  position: relative;  
}
.couse-content dl:first-child dt{
  width: 9rem;
}
.couse-content dl:last-child dt{
  width: 20rem;
}
.couse-content dl dt::before {
  display: block;
  content: url('../img/couse-check-green.svg');
  width: 1.2rem;
  position: absolute;
  top: 0;
  left: 0;
}
.couse-content dl dd{
  padding: 1rem 0 0;
  font-size: 1.4rem;
}
.couse-content dl dd span{
  font-size: 1.6rem;  
}
.couse-content dl dd br{
  display: block;
}


/* コース [追加保障] 内容 SP
-------------------------*/
.cover-base{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-image: none;
}
.cover-base h3{
  width: auto;
  height: 15px;
  margin: 0 2.5rem 2rem;
  text-align: center;
  border-top: 1px solid var(--blue);
  border-left: 1px solid var(--blue);
  border-right: 1px solid var(--blue);   
  font-size: 2.4rem;
  font-weight: bold;
  writing-mode: horizontal-tb;
  color: var(--blue);
  position: relative; 
}
.cover-base h3 span{
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  top: -25px;
}
.cover-base h3 span strong{
  display: block;
  width: 16rem;
  margin: 0 auto;
  text-align: center;
  background: #fff;
}


/* コース[追加保障]見出し SP --- */
.cover-note{
  display: flex;
  align-items: center;
  padding: 1.5rem 0 1rem;
  color: #fff;
  background: var(--blue);
}
/* マックス（赤）SP */
.cover-note.cover-red{
  background: var(--bred);  
}

.cover-note > p{
  width: 10rem;
  text-align: center;
  line-height: 1.2;
  font-family: "Outfit", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
}
.cover-note > p span{
  display: block;
  letter-spacing: 0.05em;
  font-size: 2.1rem;
  font-weight: 500;  
}
.cover-note h4{
  width: calc(100% - 10rem);
  padding: 0 0 0 1.5rem;
  line-height: 1.6;
  border-left: 1px solid #76cac2;
  font-size: 2.4rem;
}
/* マックス（赤）SP */
.cover-note.cover-red h4{
  border-left: 1px solid #e68080;
}

.cover-note h4 span{
  display: block;
  line-height: 1.4;
  border-radius: 1.4rem;
  text-align: center;
  color: var(--blue);
  background:#fff;
  font-size: 1.3rem;
  font-weight: 700;  
}
.cover-note h4 span.cover-h4-01{
  width: 10rem;
  color: var(--bred);
}
.cover-note h4 span.cover-h4-02{
  width: 8.5rem;
}
.cover-note h4 span.cover-h4-03{
  width: 13rem;
}
.cover-note h4 strong{
  color: var(--blue);
}

/* コース [追加保障] SP ---- */
.cover-content{
  padding: 1rem;
  background: #fff;
}
.cover-content dl.cover-pay{
  display: flex;
  align-items: center;
  margin: 0 0 1rem;
  border: 3px solid var(--lblue); 
  border-radius: 0.5rem;
  background: var(--lblue); 
  font-weight: 700;
}
/* マックス（赤）SP */
.cover-content.cover-red dl.cover-pay{
  border: 3px solid var(--lred); 
  background: var(--lred); 
}
.cover-content dl.cover-pay dt{
  width: 13rem;
  padding: 0 0 0 3.6rem;
  font-size: 1.6rem;
  position: relative;
}
.cover-content dl.cover-pay dt::before {
  display: block;
  content: url('../img/couse-check-blue.svg');
  width: 1.4rem;
  position: absolute;
  top: 5px;
  left: 15px;
}
/* マックス（赤）SP */
.cover-content.cover-red dl.cover-pay dt::before {
  content: url('../img/couse-check-red.svg');
}

.cover-content dl.cover-pay dd{
  width: calc(100% - 13rem);
  padding: 0 0 0 3rem;
  font-size: 1.6rem;
  background: #fff;
}
.cover-content dl.cover-pay dd span{
  padding: 0 0.2rem;
  font-size: 2.1rem;  
}

.cover-content dl.cover-point{
  margin: 0 0 1rem;
  padding: 1.5rem;
  border-radius: 0.5rem;
  background: var(--lblue);
  font-weight: 700;
}
/* マックス（赤）SP */
.cover-content.cover-red dl.cover-point{
  background: var(--lred);
}

.cover-content dl.cover-point dt,
.cover-content dl.cover-point dd{
  line-height: 1.6;
}
.cover-content dl.cover-point dt{
  width: 9rem;
  padding: 0 0 0 2.4rem;
  border-bottom: 2px solid var(--blue);
  font-size: 1.6rem;
  position: relative;  
}
/* マックス（赤）SP */
.cover-content.cover-red dl.cover-point dt{
  border-bottom: 2px solid var(--bred);
}
.cover-content dl.cover-point dt::before {
  display: block;
  content: url('../img/couse-check-blue.svg');
  width: 1.2rem;
  position: absolute;
  top: 0;
  left: 0;
}
/* マックス（赤）SP */
.cover-content.cover-red dl.cover-point dt::before {
  content: url('../img/couse-check-red.svg');
}
.cover-content dl.cover-point dd{
  padding: 1rem 0 0;
  font-size: 1.4rem;
}
.cover-content dl.cover-point dl dd span{
  font-size: 1.6rem;  
}


/*----------------------------------------------------
TB 750 --
----------------------------------------------------*/
@media screen and (min-width:750px) {

  .couse-wrap{
    padding: 5rem 6rem;
    background: url(../img/couse-bg.jpg) no-repeat center bottom;
    background-size: 1000px;
  }
  .couse-wrap section h2{
    width: 36rem;
  }


  /* コース [基本] 内容 750
  -------------------------*/
  .couse-base h3{
    margin: 0 5rem 2rem;
  }
  .couse-content dl dd br{
    display: none;
  }

  .couse-note h4{
    font-size: 2.4rem;
  }
  .couse-content dl{
    padding: 2rem;
  }
  .couse-content dl dt{
    font-size: 1.8rem;
  }
  .couse-content dl dd{
    font-size: 1.6rem;
  }
  .couse-content dl dd span{
    font-size: 2.1rem;  
  }



  /* コース [追加保障] 内容 750
  -----------------------------*/
  .cover-base h3{
    margin: 0 5rem 2rem;
  }

  .cover-content dl.cover-point{
    padding: 2rem;
  }
  .cover-content dl.cover-pay dt{
    padding: 0.5rem 0 0.5rem 3.6rem;
    font-size: 1.8rem;
  }
  .cover-content dl.cover-pay dd{
    padding: 0.5rem 0 0.5rem 3.6rem;
    font-size: 1.8rem;
  }
  .cover-content dl.cover-pay dd span{
    font-size: 2.4rem;  
  }
  .cover-content dl.cover-point dd{
    font-size: 1.6rem;
  }
  .cover-content dl.cover-point dl dd span{
    font-size: 2.1rem;  
  }



}


/*----------------------------------------------------
PC 1000 --
----------------------------------------------------*/
@media screen and (min-width:1000px) {
 
  .couse-wrap{
    padding: 10rem 1.5rem;
    background: url(../img/couse-bg.jpg) no-repeat center bottom;
    background-size: auto;
  }
  .couse-wrap section h2{
    width: 42rem;
    padding: 0 0 3rem;
  }
  .couse-wrap section h2 + p{
    padding: 2rem 0;
    letter-spacing: 0.05em;
    font-size: 2.1rem;
  }
  .couse-wrap section h2 + p span{
    font-size: 2.4rem;
  }


  /* コース [基本] 内容 1000
  -------------------------------*/
  .couse-base{
    flex-direction: row;
    margin: 0 0 8rem;
    padding: 8rem 0 0;
    background-image: url("../img/couse-bgline-gr.png"), url("../img/../img/couse-bgline-gr.png");
    background-repeat: no-repeat, no-repeat;
    background-size: auto, auto;
    background-position: left 30%,left 90%;
  }
  .couse-base h3{
    width: 12%;
    height: auto;
    margin: 0;
    text-align: left;
    border-top: none;
    border-left: none;
    border-right: none;   
    writing-mode: vertical-rl;
    font-size: 2.4rem;    
  }
  .couse-base h3 span{
    display: block;
    left: -35%;
    top: 35%;
  }
  .couse-base h3 span strong{
    display: block;
    width: auto;
    margin: 0;
    text-align:left;
    background: transparent;
  }

  /* 見出し 1000 --- */
  .couse-note > p span{
    font-size: 2.1rem;
  }
  .couse-note h4{
    font-size: 2rem;
  }

  .couse-content dl dd br{
    display: block;
  }


  /* コース 「追加保障」 内容 1000
  --------------------------------*/
  .cover-base{
    flex-direction: row;
    background-image: url("../img/couse-bgline-bl.png"), url("../img/../img/couse-bgline-bl.png");
    background-repeat: no-repeat, no-repeat;
    background-size: auto, auto;
    background-position: left 30%,left 90%;
  }
  .cover-base h3{
    width: 12%;
    height: auto;
    margin: 0;
    text-align: left;
    border-top: none;
    border-left: none;
    border-right: none;   
    writing-mode: vertical-rl;
    font-size: 2.4rem; 
  }
  .cover-base h3 span{
    display: block;
    left: -35%;
    top: 45%;
  }
  .cover-base h3 span strong{
    display: block;
    width: auto;
    margin: 0;
    text-align:left;
    background: transparent;
  }

  /* 枠のスタイル　1000 ---------- */
  .couse-base article{
    width: 42.5%;
    margin: 0;
    padding: 0;
  }
  .cover-base article{
    width: 28%;
    margin: 0;
    padding: 0;
  }

  /* 見出し 1000 --- */
  .cover-note > p span{
    font-size: 2.1rem;
  }
  .cover-note h4{
    font-size: 2rem;
  }
  
  /* コース [追加保障] 1000 ---- */
  .cover-content dl.cover-pay{
    border-radius: 1rem;
  }
  .cover-content dl.cover-pay dt{
    width: 10rem;
    padding: 0.5rem 0 0.5rem 2.4rem;
    font-size: 1.6rem;
  }
  .cover-content dl.cover-pay dt::before {
    left: 10px;
  }
  .cover-content dl.cover-pay dd{
    width: calc(100% - 10rem);
    padding: 0.5rem 0 0.5rem 1.5rem;
  }
  .cover-content dl.cover-pay dd span{
    font-size: 2.1rem;  
  }

  .cover-content dl.cover-point{
    padding: 2rem 1.5rem;
  }
  .cover-content dl.cover-point dt,
  .cover-content dl.cover-point dd{
    line-height: 1.8;
  }
  .cover-content dl.cover-point dt{
    font-size: 1.6rem;
  }
  .cover-content dl.cover-point dd{
    padding: 1rem 0 0;
    font-size: 1.4rem;
  }
  .cover-content dl.cover-point dd span{
    font-size: 1.6rem;  
  }


}


/*----------------------------------------------------
PC 1200 --
----------------------------------------------------*/
@media screen and (min-width:1200px) {

 /* コース [基本] 内容 1200
  -------------------------*/
  .couse-base h3{
    font-size: 3rem;
  }
  .couse-base h3 span{
    top: 37%;
  }

  /* 見出し 1200 --- */
  .couse-note > p{
    width: 13rem;
    line-height: 1.2;
    font-size: 1.6rem;
  }
  .couse-note > p span{
    font-size: 3rem;
  }
  .couse-note h4{
    width: calc(100% - 13rem);
    padding: 0 0 0 3rem;
    font-size: 3rem;
  }
  .couse-note h4 span{
    width: 9.4rem;
    font-size: 1.6rem;
  }

  /* コース 特徴 1200 ---- */
  .couse-content{
    padding: 2rem 3rem;
  }
  .couse-content dl{
    margin: 0 0 1rem;
    padding: 3rem;
    border-radius: 1rem;
  }
  .couse-content dl dt{
    padding: 0 0 0.5rem 2.5rem;
    border-bottom: 3px solid var(--green);
    font-size: 2.1rem;
  }
  .couse-content dl:first-child dt{
    width: 9rem;
  }
  .couse-content dl:last-child dt{
    width: 20rem;
  }
  .couse-content dl dt::before {
    width: 1.6rem;
  }
  .couse-content dl dd{
    padding: 2rem 0 0;
    font-size: 2.1rem;
  }
  .couse-content dl dd span{
    font-size: 2.4rem;  
  }


/* コース [追加保障] 内容 1200
  -------------------------*/
  .cover-base h3{
    font-size: 3rem;
  }

  /* 見出し 1200 --- */
  .cover-note > p{
    width: 13rem;
    line-height: 1.2;
    font-size: 1.6rem;
  }
  .cover-note > p span{
    font-size: 3rem;
  }
  .cover-note h4{
    width: calc(100% - 13rem);
    padding: 0 0 0 2rem;
    font-size: 3rem;
  }
  .cover-note h4 span{
    font-size: 1.6rem;
  }
  .cover-note h4 span.cover-h4-01{
    width: 12rem;
  }
  .cover-note h4 span.cover-h4-02{
    width: 10.5rem;
  }
  .cover-note h4 span.cover-h4-03{
    width: 15.2rem;
  }

  /* コース [追加保障] 特徴 1200 ---- */
  .cover-content{
    padding: 2rem;
    border-radius: 1rem;
  }
  .cover-content dl.cover-pay dt{
    width: 12rem;
    padding: 1rem 0 1rem 3rem;
    font-size: 1.8rem;
  }
  .cover-content dl.cover-pay dt::before {
    top: 10px;
  }
  .cover-content dl.cover-pay dd{
    width: calc(100% - 12rem);
    padding: 1rem 0 1rem 2.4rem;
    font-size: 1.6rem;
  }
  .cover-content dl.cover-pay dd span{
    font-size: 2.8rem;  
  }


  .cover-content dl.cover-point{
    padding: 2rem;
  }
    .cover-content dl.cover-point dt{
    font-size: 1.8rem;
  }
  .cover-content dl.cover-point dd{
    padding: 1rem 0 0;
    font-size: 1.6rem;
  }
  .cover-content dl.cover-point dd span{
    font-size: 1.8rem;  
  }


}

/*----------------------------------------------------
PC 1400 --
----------------------------------------------------*/
@media screen and (min-width:1400px) {

  .couse-wrap{
    padding: 10rem 0;
  }

}