/* ---- CTA（記事途中）スタイル定義 -------------------------------- */

.case_detail_cvbtnarea {
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  column-gap: 10px;
  margin-top: 100px;
}

.btnarea {
  min-width: 340px;
  margin-top: 16px;
  align-self: start;
  padding-bottom: 24px;
}

.overcopy {
  font-size: 16px;
  font-weight: bold;
  color: #7c7c7c;
  text-align: center;
  margin-bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.mod-sec__01{
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .overcopy {
    font-size: 16px;
  }
}

.overcopy::before,
.overcopy::after {
  content: '';
  width: 1px;
  height: 24px;
  background-color: #7c7c7c;
}

.overcopy::before {
  margin-right: 16px;
  transform: rotate(-24deg)
}

.overcopy::after {
  margin-left: 16px;
  transform: rotate(24deg)
}

.case_detail_cv_item .cvbtn {
  background-color: #FFF;
  align-items: center;
  border-radius: 100px;
  margin: 0px 16px;
  width: 320px;
  cursor: pointer;
  border: #00b2ab 1px solid;
}

.case_detail_cv_item_right .cvbtn{
  background-color: #00b2ab;


}

@media (max-width: 768px) {
  .cvbtn {
    width: 90%;
  }
}

.case_detail_cv_item .cvbtn a {
  display: block;
  color: #00b2ab;
  font-size: 16px;
  font-weight: 600;
  padding: 10px 40px;
  position: relative;
  text-align: center;
}

.case_detail_cv_item_right .cvbtn a{
  color: #fff;
}

.case_detail_cv_item .cvbtn a span,
.case_detail_cv_item_right .cvbtn a span {
  position: relative;
  margin-left: -15px;
}

.case_detail_cv_item .cvbtn a span::after{
  content: '';
  position: absolute;
  display: block;
  background: url(/jp/products/justdb/data/case-cta-decoration-g.png) center / contain no-repeat;
  top: 0;
  right: -25px;
  width: 15px;
  height: 20px;
}

.case_detail_cv_item_right .cvbtn a span::after{
  background: url(/jp/products/justdb/data/case-cta-decoration-w.png) center / contain no-repeat;
}

@media (max-width: 768px) {
  .cvbtn a {
    font-size: 16px;
  }
}

.cvbtn:hover {
  opacity: 0.6;

}



.cvbtn img {
  width: 100px;
  position: absolute;
  left: -30px;
  top: -20%;
}

.cvbtn.download {
  display: flex;
  background-color: #000080;
  color: #fff;
}

@media (max-width: 768px) {
  .cvbtn.download {
    justify-content: center;
  }
  .case_detail_cvbtnarea .box-shadow.cvbtn{
    max-width: 100%;
    width: 95%;
    margin: 0 auto;
  }
}

.cvbtn.download a {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  position: relative;
  padding: 16px 36px 16px 80px;
  /* padding: 16px 40px 16px 80px; */
}

@media (max-width: 768px) {
  .cvbtn.download a {
    font-size: 16px;
  }
}

.cvbtn.inquiry:hover {
  opacity: 0.6;
}


@media screen and (max-width: 767px) {
      .case_detail_cvbtnarea {
        flex-flow: column;
        row-gap: 25px;
        margin-top: 50px;
      }

      .cvbtn {
        margin: 0 auto;
        margin-bottom: 20px;
      }
    }




/* ---- 最下部バナー部分のスタイル -------------------------------- */
.case_detail_bottom_banner{
  width: 860px;
  height: auto;
  margin: 100px auto 90px;
  background-color: #00b2ab;
  border-radius: 16px;
  padding: 10px 0;
}

.bottom_banner_contents{
  width: 97%;
  margin: 0 auto;
  height: 90%;
  background-color: #fff;
  border-radius: 14px;
  display: flex;
  justify-content: center;
  gap: 30px;
  padding: 12px 0 25px;
}

.banner_cv_area img{
  width: 340px;
  height: auto;
}

.banner_cv_area_left{
  border-right: #00b2ab 2px solid;
  padding-right: 30px;
}

.case_bottom_banner_cvbtn:hover {
  opacity: 0.6;
}

.case_bottom_banner_cvbtn{
  background-color: #00b2ab;
  width: 230px;
  text-align: center;
  border-radius: 30px;
  padding: 5px 0;
  margin: -13px 0 0 auto;
}

.case_bottom_banner_cvbtn a{
  color: #fff;
  font-size: 17px;
  cursor: pointer;
  display: block;
  position: relative;
}

.case_bottom_banner_cvbtn a::after{
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  bottom: 0;
  content: "";
  height: 9px;
  margin: auto;
  position: absolute;
  right: 22px;
  top: 0;
  transform: rotate(45deg);
  transition: all 0.3s ease;
  width: 9px;
}

  @media screen and (max-width: 767px) {
  .case_detail_bottom_banner{
    width: 100%;
  }
  .bottom_banner_contents{
    flex-flow: column;
    padding: 12px 10px 25px;
    width: 95%;
  }
  .banner_cv_area_left{
    padding-right: 0;
    border-right: none;
    border-bottom: #00b2ab 2px solid;
    padding-bottom: 30px;
  }
  .banner_cv_area img{
    width: 300px;
    margin: 0 auto;
    display: block;
  }
  .case_bottom_banner_cvbtn{
    width: 200px;
  }
  .case_bottom_banner_cvbtn a{
    font-size: 16px;
  }
  .case_bottom_banner_cvbtn a::after{
    right: 15px;
  }

}