/*
  layout
================================*/
#base {
  width: auto;
  min-width: 1220px;
  font-family: "Noto Sans JP";
}
div#cont {
  margin: auto;
  width: 960px;
}
@media (max-width: 768px) {
  #base {
    min-width: auto;
  }
  div#cont { 
    width: 100%; 
  }
}
/*
  util
================================*/
.u_pc {
  display: block;
}
.u_indent {
  text-indent: -1em;
  padding-left: 1em;
}
@media (max-width: 768px) {
  .u_pc {
    display: none;
  }
}
/*
  contents
================================*/
/* mv */
.m_sec_mv {
  width: 100%;
  margin-bottom: 48px;
}
.m_anchor_list {
  margin-top: 24px;
  margin-bottom: 24px;
  display: flex;
  gap: 9px;
}
.m_anchor_itm {
  width: 100%;
}
.m_anchor_itm a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  color: #fff;
  background-color: #369BC9;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.7px;
}
.m_lead_txt {
  color: #2D313D;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}
@media (any-hover: hover) {
  .m_anchor_itm:hover a {
    text-decoration: none;
    opacity: 0.6;
    transition: 0.3s;
  }
}
@media (max-width: 768px) {
  .m_anchor_list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 8px;
  }
}
/* JOLLYGOOD+の特徴 */
.m_sec_point {
  margin-bottom: 56px;
}
.m_sec_ttl {
  position: relative;
  margin-bottom: 32px;
  padding-left: 22px;
  padding-bottom: 9px;
  color: #2D313D;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.72px;
}
.m_sec_ttl::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 14px;
  height: 14px;
  border-radius: 2px;
  background-color: #369BC9;
}
.m_sec_ttl::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, #0172E0, #E33F81);
}
.m_point_ttl {
  position: relative;
  margin-bottom: 16px;
  padding-left: 70px;
  font-size: 20px;
  font-weight: 700;
}
.m_point_ttl::before {
  position: absolute;
  top: 2px;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 10px;
  background: linear-gradient(90deg, #0172E0 0%, #E33F81 100%);
  border-radius: 64px;
  color: #fff;
  font-family: "Oswald";
  font-size: 14px;
  font-weight: 500;
}
.m_point_ttl.m_point_ttl__primary::before {
  content: "Point.1";
}
.m_point_ttl.m_point_ttl__secondary::before {
  content: "Point.2";
}
.m_point_txt {
  color: #2D313D;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 16px;
}
.m_point_img_primary {
  margin-bottom: 40px;
}
.m_point_img_secondary {
  width: 100%;
}
.m_point_img_secondary img {
  width: 1005;
}
/* 事例紹介 */
.m_sec_case {
  margin-bottom: 56px;
}
.m_case_ttl {
  position: relative;
  margin-bottom: 16px;
  padding-left: 95px;
  font-size: 20px;
  font-weight: 700;
}
.m_case_ttl::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 80px;
  height: 26px;
  background-size: cover;
  transform: translateY(-50%);
}
.m_case_ttl.m_case_ttl_primary::before {
  background-image: url(/resource/img/jollygood/icon_case_01.png);
}
.m_case_ttl.m_case_ttl_secondary::before {
  background-image: url(/resource/img/jollygood/icon_case_02.png);
}
.m_case_txt {
  margin-bottom: 16px;
  font-size: 16px;
  line-height: 1.6;
}
.m_case_list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.m_case_itm {
  position: relative;
  padding-left: 18px;
  font-size: 16px;
  line-height: 1.6;
}
.m_case_itm::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  width: 12px;
  height: 12px;
  background-color: #0172E0;
  border-radius: 50%;

}
.m_case_itm_ttl {
  display: block;
  font-weight: 700;
}
.m_case_img_primary {
  margin-bottom: 40px;
}
/* 料金プラン */
.m_sec_plan {
  margin-bottom: 48px;
}
.m_plan_txt_wrap {
  margin-bottom: 32px;
}
.m_plan_txt {
  font-size: 16px;
  line-height: 1.6;
}
.m_plan_note {
  font-size: 14px;
}
.m_plan_ttl {
  position: relative;
  margin-bottom: 16px;
  padding-left: 18px;
  font-size: 20px;
  font-weight: 700;
}
.m_plan_ttl::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translateY(-50%);
}
.m_plan_ttl.m_plan_ttl_monthly::before {
  background-color: #0172E0;
}
.m_plan_ttl.m_plan_ttl_rental::before {
  background-color: #E33F81;
}
.m_plan_table {
  border-collapse: collapse;
  width: 960px;
  border: 1px solid #555;
}
.m_plan_table th,
.m_plan_table td {
  height: 40px;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid #555;
  border-right: 1px solid #555;
}
.m_plan_table td {
  font-size: 16px;
  font-weight: 500;
}
.m_plan_table td small {
  font-size: 14px;
}
.m_monthly_plan_name {
  background-color: #004266;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_bg_gray {
  background-color: #F3F3F3;
}
.m_plan_bg_lightgray {
  background-color: #FCFCFC;
}
.m_monthly_entry {
  background-color: #25A5EB;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_monthly_light {
  background-color: #078FD9;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_monthly_pro {
  background-color: #0C78B3;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_monthly_enterprise {
  background-color: #005D90;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_table_cont {
  margin-bottom: 32px;
}
.m_rental_period {
  background-color: #CD1666;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_seven {
  background-color: #FD76B0;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_thirty {
  background-color: #F0599B;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_ninety {
  background-color: #E92E7F;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.m_plan_rental_th {
  width: 206px;
}
@media (max-width: 768px) {
  .m_plan_table_wrap {
    width: 100%;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
  .m_plan_table {
    min-width: 960px;
  }
}
/* お問い合わせ */
.m_sec_inquiry {
  margin-bottom: 173px;
}
.m_inquiry_txt {
  margin-bottom: 24px;
  font-size: 16px;
  line-height: 1.6;
}
.m_inquiry_btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 275px;
  height: 48px;
  background-color: #369BC9;
  border-radius: 224px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}
.m_inquiry_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 21px;
  width: 5px;
  height: 7px;
  background-image: url(/resource/img/jollygood/icon_arrow.svg);
  background-size: cover;
  transform: translateY(-50%);
}
@media (any-hover:hover) {
  .m_inquiry_btn:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.6;
    transition: 0.3s;
  }
}
@media (max-width: 768px) {
  .m_sec_inquiry {
    margin-bottom: 80px;
  }
  .m_inquiry_btn {
    margin: 0 auto;
  }
}