@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");

/* 
  reset.css
  https://github.com/mayank99/reset.css/blob/main/package/index.css
 */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light;tab-size:2;scrollbar-gutter:stable}:where(html:has(dialog:modal[open])){overflow:clip}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(button){all:unset}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(a){color:inherit;text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg,video){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem);}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(dialog){border:none;background:none;inset:unset;max-width:unset;max-height:unset}:where(dialog:not([open])){display:none!important}:where(:focus-visible){outline:3px solid CanvasText;box-shadow:0 0 0 5px Canvas;outline-offset:1px}:where(:focus-visible,:target){scroll-margin-block:8vh}:where(.visually-hidden:not(:focus-within,:active)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

/* ######################################################################
  BASIC
###################################################################### */
html {
  width: 100%;
  min-width: 1000px;
  min-height: 100%;
}

body {
  width: 100%;
  min-width: 1000px;
  min-height: 100%;
  /* font-size: clamp(10px, calc(18/1440*100vw), 18px); */
  font-size: 16px;
  line-height: 1.5;
  font-family: "Noto Sans JP", "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #333;
  background: #fff;
  overflow-x: scroll;
}

a {
  color: #2874F2;
}

.content {
  position: relative;
  width: 100%;
  min-height: 100%;
  padding: 100px 0 0;
}

.content strong,
.content .font-black {
  font-weight: 900;
}
.content .font-bold {
  font-weight: 700;
}

.content img {
  display: inline-block;
  max-width: 100%;
  height: auto;
}

.content .section {
  position: relative;
  padding: 50px 0;
  z-index: 0;
}
.content .inner {
  position: relative;
  margin: 0 auto;
  padding: 0 10px;
  max-width: 1200px;
}
.section h1 ,
.section h2 {
  margin-bottom: 16px;
  color: #CC0033;
  font-size: 36px;
  text-align: center;
}
.section h1 + p {
  margin-bottom: 100px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
}
.section h2 + p {
  margin-bottom: 60px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
}

@media (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

@media (max-width: 767px) {
  html {
    min-width: 100%;
  }
  
  body {
    min-width: 100%;
    font-size: clamp(12px,3vw,16px);
  }

  .pc {
    display: none !important;
  }
  
  .content {
    padding: calc(170/750*100vw) 0 0;
  }
  .section h2 {
    font-size: clamp(16px,5vw,24px);
  }
  .section h1 + p ,
  .section h2 + p {
    font-size: clamp(13px,3.5vw,17px);
  }
}

/* ######################################################################
  .header
###################################################################### */
.header {
  position: fixed;
  z-index: 10;
  left: 0;
  top: 0;
  width: 100%;
  height: 100px;
  background: #fff;
}
.header .inner {
  max-width: 1440px;
  height: 100%;
}
.header .header_box {
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  width: calc(100% - 44px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.header .header_left {
  display: flex;
  align-items: center;
  gap: 20px;
}
.header .header_right li {
  width: 240px;
  height: 55px;
}
.header .header_right li a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 15px;
  width: 100%;
  height: 100%;
  background: #0070BF linear-gradient(90deg, #CC0033, #8D0023);
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border-radius: 5em;
}
.header .header_right li a::before {
  content: "";
  display: inline-block;
  margin-right: 8px;
  width: 20px;
  height: 16px;
  background: url("../img/icn_mail.png") no-repeat center center /contain;
  vertical-align: middle;
}
.header .header_right li a:hover {
  opacity: .7;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
  .header .header_box {
    left: 10px;
    width: calc(100% - 20px);
  }
  .header .header_left ,
  .header .header_right {
    width: calc(50% - 10px);
  }
  .header .header_right li {
    width: 100%;
  }
  .header .header_right li a {
    font-size: clamp(12px,3vw,16px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .footer
###################################################################### */
.footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 0;
  line-height: calc(32/18);
  text-align: center;
}
@media (max-width: 767px) {
  .footer {
    padding: 20px 15px;
    font-size: clamp(12px,3vw,16px);
    text-align: left;
  }
}

/* ######################################################################
  .sec_cv
###################################################################### */
.sec_cv {
  background: #F7F7F7;
}
.sec_cv h2 {
  margin-bottom: 20px;
  color: #484B50;
}
.sec_cv .cv_text {
  margin-bottom: 40px;
}
.sec_cv .cv_note {
  margin-top: 40px;
  font-size: 14px;
  text-align: center;
}
.sec_cv ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}
.sec_cv ul li {
  width: 62%;
  max-width: 620px;
}
.sec_cv ul li:first-child {
  width: 28%;
  max-width: 370px;
}
.sec_cv ul li a.btn_inq {
  max-width: 620px;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
  .sec_cv .cv_text {
    font-size: clamp(13px,3.5vw,17px);
  }
  .sec_cv .cv_note {
    font-size: clamp(12px,3vw,16px);
  }
  .sec_cv ul li ,
  .sec_cv ul li:first-child {
    width: 100%;
    max-width: 100%;
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .gnav
###################################################################### */
.gnav {
}
.gnav.gnav_fixed {
  position: fixed;
  top: 100px;
  left: 0;
  width: 100%;
  z-index: 10;
}
.gnav .inner {
}
.gnav .gnav_main {
  background: #000;
}
.gnav .gnav_sub {
  background: #F7F7F7;
}
.gnav ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.gnav ul li {
  flex: 1;
  background: #fff;
}
.gnav ul li a {
  display: block;
  padding: 15px 10px;
  background: #000;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
}
.gnav ul li a:hover {
  background: #CC0033;
  color: #fff;
}
.gnav_main ul li a.active {
  background: #CC0033;
}
.gnav_sub ul li a {
  padding: 25px 10px;
  background: #F7F7F7;
  color: #000;
  font-weight: normal;
}
@media (max-width: 1399px) {
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
  .gnav_sub ul li a {
    font-size: 16px;
  }
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
  .gnav ul li {
    flex: none;
    width: 100%;
  }
  .gnav ul li a ,
  .gnav_sub ul li a {
    padding: 10px;
    font-size: clamp(12px,3vw,16px);
  }
  .gnav_sub {
    display: none;
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .secHero
###################################################################### */
.secHero {
}
.secHero .inner {
  padding: 40px 10px;
}
.secHero2 {
  background: url("/businesspartner/assets/img/bgi_hero.jpg") no-repeat center top /cover;
}
.secHero2 .inner {
  padding: 50px 10px;
}
.secHero figure {
  text-align: center;
}
.hero_box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  gap: 30px;
}
.hero_left {
  color: #fff;
}
.hero_ttl {
  font-size: 32px;
  font-weight: bold;
}
.hero_text {
  font-size: 22px;
}
.btn_inq {
  display: block;
  margin: 0 auto;
  padding: 16px 32px;
  width: 100%;
  max-width: 570px;
  background: #CC0033 linear-gradient(90deg,#CC0033,#8D0023);
  color: #fff;
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  border-radius: 5em;
}
.btn_inq::after {
  content: "";
  display: inline-block;
  margin-top: -3px;
  margin-left: 8px;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  border-top: #fff 3px solid;
  border-right: #fff 3px solid;
  transform: rotate(45deg);
}
.btn_inq:hover {
  opacity: .7;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
  .hero_ttl {
    font-size: 24px;
  }
  .hero_text {
    font-size: 16px;
  }
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
  .hero_ttl {
    font-size: clamp(16px,4.5vw,26px);
  }
  .hero_text {
    font-size: clamp(12px,3vw,16px);
  }
  .btn_inq {
    font-size: clamp(13px,4vw,20px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .box_glay
###################################################################### */
.box_glay {
  margin-top: 100px;
  padding: 50px;
  background: #F7F7F7;
  border-radius: 25px;
}
.box_glay h3 {
  margin-bottom: 30px;
  color: #CC0033;
  font-size: 32px;
  text-align: center;
}

@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .box_glay {
    padding: 25px;
    border-radius: 13px;
  }
}
@media (max-width: 767px) {
  .box_glay {
    padding: 15px;
    border-radius: 8px;
  }
  .box_glay h3 {
    font-size: clamp(16px, 4.5vw, 20px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .lead
###################################################################### */
.lead {
}
.lead h1 {
  position: relative;
  padding-bottom: 100px;
}
.lead h1::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 2px;
  height: 80px;
  background: #CC0033;
}
.lead h1::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 15px;
  height: 15px;
  background: #CC0033;
  border-radius: 50%;
}
.lead h1 + p {
  margin-bottom: 20px;
}
.lead h1 + p + p {
  margin-bottom: 100px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
}
.lead_sol {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
.lead_sol_item {
  position: relative;
  padding: 24px 16px;
  width: calc(50% - 20px);
  border: #D5D5D5 1px solid;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
}
.lead_sol_tab {
  display: inline-block;
  position: absolute;
  left: 15px;
  top: 0;
  transform: translateY(-50%);
  padding: 5px 12px;
  background: #CC0033;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  border-radius: 6px;
}
.lead_sol_text + figure {
  width: 105px;
}
.lead_sol_text {
  width: calc(100% - 145px);
}
.lead_sol_text h3 {
  margin-bottom: 6px;
}
.lead_sol_text p {
  font-size: 14px;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .lead_sol_item {
    padding: 24px 16px;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .lead h1 + p + p {
    font-size: clamp(13px,3.5vw,17px);
  }
  .lead_sol_text p {
    font-size: clamp(12px,3vw,14px);
  }
}
@media (max-width: 575px) {
  .lead_sol_item {
    gap: 20px;
  }
  .lead_sol_text + figure {
    width: 100%;
    text-align: center;
  }
  .lead_sol_text {
    width: 100%;
  }
}

/* ######################################################################
  .service
###################################################################### */
.service {
  padding: 0 !important;
}
.box_glay_ser {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.box_glay_ser_item {
  padding: 30px;
  width: calc(50% - 12px);
  background: #fff;
}
.box_glay_ser_item h4 {
  margin-bottom: 20px;
  padding-left: 16px;
  color: #CC0033;
  font-size: 24px;
  border-left: #CC0033 5px solid;
}
.box_glay_ser_item h5 {
  margin: 20px 0 8px;
  color: #CC0033;
  font-size: 14px;
}
.box_glay_ser_item .ser_link {
  margin-bottom: 20px;
}
.box_glay_ser_item .ser_link li:not(:last-child) {
  margin-bottom: 8px;
}
.box_glay_ser_item .ser_link li a {
  color: #484B50;
  text-decoration: none;
}
.box_glay_ser_item .ser_link li a::after {
  content: "";
  display: inline-block;
  margin-left: 8px;
  width: 24px;
  height: 24px;
  background: url("/businesspartner/assets/img/icn_blank.png") no-repeat center center /contain;
  vertical-align: middle;
}
.box_glay_ser_item .ser_link li a:hover {
  text-decoration: underline;
}
.box_glay_ser_item .ser_tab {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.box_glay_ser_item .ser_tab li {
  padding: 8px;
  background: #FFE9E9;
  font-size: 12px;
  line-height: 1;
  border-radius: 6px;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .box_glay_ser_item {
    padding: 15px;
    width: 1000%;
  }
}
@media (max-width: 767px) {
  .box_glay_ser_item h4 {
    font-size: clamp(15px, 4vw, 18px);
  }
  .box_glay_ser_item h5 ,
  .box_glay_ser_item .ser_tab li {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .partner
###################################################################### */
.partner {
}
.partner_box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
.partner_item {
  padding: 50px 30px;
  width: calc(50% - 15px);
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 2px 30px 0px rgba(0, 0, 0, 0.15);
}
.partner_item h3 {
  margin-bottom: 20px;
  color: #CC0033;
  font-size: 24px;
  text-align: center;
}
.partner_item figure {
  margin: 30px 0;
  text-align: center;
}
.partner_item ul {
  margin-bottom: 30px;
  padding: 20px;
  background: #F7F7F7;
  border-radius: 8px;
}
.partner_item ul li {
  padding-left: 40px;
  text-indent: -40px;
}
.partner_item ul li::before {
  content: "";
  display: inline-block;
  margin-right: 16px;
  width: 24px;
  height: 24px;
  background: url("/businesspartner/assets/img/icn_check.png") no-repeat center center /contain;
  vertical-align: middle;
}
.partner_btn {
  position: relative;
  display: block;
  padding: 29px;
  color: #CC0033;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  border: #D34467 2px solid;
  border-radius: 5em;
}
.partner_btn i {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 50px;
  width: 28px;
  height: 28px;
  background: #CC0033;
  border-radius: 50%;
}
.partner_btn i::before ,
.partner_btn i::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 11px;
  width: 10px;
  height: 2px;
  background: #fff;
}
.partner_btn i::before {
  transform: rotate(45deg) translateY(-4px);
}
.partner_btn i::after {
  transform: rotate(-45deg) translateY(4px);
}
.partner_btn:hover {
  background: #CC0033;
  color: #fff;
}
.partner_btn:hover i {
  background: #fff;
}
.partner_btn:hover i::before ,
.partner_btn:hover i::after {
  background: #CC0033;
}

@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .partner_item {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .partner_item h3 {
    font-size: clamp(15px, 4vw, 18px);
  }
  .partner_btn {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 575px) {
  .partner_btn i {
    right: 20px;
  }
}

/* ######################################################################
  .support
###################################################################### */
.support {
}
.support_box {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.support_item {
  padding: 30px;
  width: calc(50% - 10px);
  border: #D5D5D5 1px solid;
  border-radius: 20px;
}
.support_item h3 {
  margin-bottom: 30px;
  color: #CC0033;
  font-size: 24px;
  text-align: center;
}
.support_item h3 img {
  margin-right: 14px;
  vertical-align: middle;
}
.support_item ol {
  counter-reset: num 0; 
}
.support_item ol li {
  counter-increment: num 1;
  font-size: 20px;
}
.support_item ol li::before {
  content: counter(num);
  display: inline-block;
  margin-right: 4px;
  width: 20px;
  height: 20px;
  background: #CC0033;
  color: #fff;
  font-size: 16px;
  text-align: center;
  line-height: 20px;
  border-radius: 50%;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
  .support_item ol li {
    font-size: 18px;
  }
}
@media (max-width: 991px) {
  .support_item {
    width: 100%;
  }
  .support_item ol {
    margin: 0 auto;
    width: fit-content;
  }
}
@media (max-width: 767px) {
  .support_item h3 {
    font-size: clamp(15px, 4vw, 18px);
  }
  .support_item ol li {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .entry
###################################################################### */
.entry {
}
.entry_box {
  counter-reset: num 0; 
  display: flex;
  flex-wrap: wrap;
  gap: 36px;
}
.entry_item {
  counter-increment: num 1;
  position: relative;
  width: calc((100% - 108px) / 4);
  border-radius: 8px;
  box-shadow: 3px 5px 8px 0px rgba(0, 0, 0, 0.15);
}
.entry_item:not(:last-child)::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: -12px;
  transform: translate(100%,-50%);
  width: 13px;
  height: 20px;
  background: #484b50;
  clip-path: polygon(0 0, 0 100%, 100% 50%);
}
.entry_item h3 {
  padding: 10px 5px;
  background: #CC0033;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.entry_item h3::before {
  content: "STEP " counter(num);
  display: block;
  margin: 0 auto 8px;
  padding: 2px 10px;
  width: fit-content;
  font-size: 9.6px;
  line-height: 1;
  border: #fff 1px solid;
  border-radius: 5em;
}
.entry_item ul {
  padding: 12px;
}
.entry_item ul li {
  font-size: 14px;
}
.entry_item ul li::before {
  content: "・";
  display: inline-block;
  margin-right: 5px;
  font-weight: bold;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
  .entry_item h3 {
    font-size: 17px;
  }
}
@media (max-width: 991px) {
  .entry_item {
    width: 100%;
  }
  .entry_item:not(:last-child)::after {
    top: inherit;
    right: inherit;
    left: 50%;
    bottom: -12px;
    transform: translate(-50%,100%) rotate(90deg);
  }
  .entry_item ul {
    margin: 0 auto;
    width: fit-content;
  }
  .entry_item h3 ,
  .entry_item ul li {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 767px) {
}
@media (max-width: 575px) {
}

/* ######################################################################
  .faq
###################################################################### */
.faq {
}
.faq_box {
}
.faq_box dl {
}
.faq_box dl dt ,
.faq_box dl dd {
  position: relative;
  margin-bottom: 20px;
  padding-left: 54px;
  font-size: 20px;
}
.faq_box dl dd {
  margin-bottom: 40px;
  font-size: 18px;
}
.faq_box dl dd:last-child {
  margin-bottom: 0;
}
.faq_box dl dt::before ,
.faq_box dl dd::before {
  content: "Q";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 33px;
  height: 33px;
  background: #CC0033;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 33px;
  border-radius: 4px;
}
.faq_box dl dd::before {
  content: "A";
  background: #F7F7F7;
  color: #CC0033;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
  .faq_box dl dt ,
  .faq_box dl dd {
    font-size: clamp(14px, 3.5vw, 18px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .about (2階層以下)
###################################################################### */
.about {
}
.about figure {
  margin-bottom: 32px;
  text-align: center;
}
.about figure + p {
  font-size: 18px;
}
.about table {
  margin-top: 100px;
  width: 100%;
  table-layout: fixed;
  border-top: #D5D5D5 1px solid;
  border-left: #D5D5D5 1px solid;
}
.about table th ,
.about table td {
  padding: 16px 24px;
  vertical-align: middle;
  border-right: #D5D5D5 1px solid;
  border-bottom: #D5D5D5 1px solid;
}
.about table th {
  background: #CC0033;
  color: #fff;
  font-size: 20px;
}
.about table td li {
  padding-left: 1em;
  text-indent: -1em;
}
.about table td .ul_col2 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.about table td .ul_col2 li {
  width: 49%;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .about table td .ul_col2 li {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .about figure + p {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .detail (2階層以下)
###################################################################### */
.detail {
}
.detail .box_glay {
  margin-top: 0;
}
.detail h2 {
  margin-bottom: 30px;
  font-size: 32px;
}
.detail table {
  margin-bottom: 60px;
  width: 100%;
  background: #fff;
}
.detail table th ,
.detail table td {
  padding: 16px 24px;
  vertical-align: middle;
}
.detail table th {
  background: #CC0033;
  color: #fff;
  font-size: 20px;
}
.merit_box {
  counter-reset: num 0; 
  display: flex;
  flex-wrap: wrap;
  gap: 22px;
  margin-bottom: 30px;
}
.merit_item {
  counter-increment: num 1;
  padding: 25px 16px;
  width: calc((100% - 66px) / 4);
  background: #fff;
  border-radius: 20px;
}
.merit_item h3 {
  margin-bottom: 6px;
  color: #CC0033;
  font-size: 18px;
}
.merit_item h3::before {
  content: counter(num) ".";
  display: inline-block;
  margin-right: 6px;
}
.merit_note {
  margin-bottom: 8px;
  padding-left: 1.5em;
  text-indent: -1.5em;
}
.merit_note:last-child {
  margin-bottom: 0;
}
.case_box {
  counter-reset: num 0; 
  margin-top: 40px;
  padding: 40px 30px 50px;
  background: #fff;
}
.case_item {
  counter-increment: num 1;
}
.case_item h3 {
  margin-bottom: 30px;
  color: #333333;
  font-size: 24px;
  font-weight: 500;
  text-align: left;
  border-bottom: #CC0033 1px solid;
}
.case_item h3::before {
  content: "事例" counter(num);
  display: inline-block;
  margin-right: 20px;
  padding: 7px 57px;
  background: #CC0033;
  color: #fff;
  font-size: 18px;
}
.case_item h4 {
  color: #CC0033;
  font-size: 20px;
}
.case_item p {
  margin-bottom: 30px;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .merit_item {
    padding: 15px;
    width: 100%;
  }
  .case_box {
    padding: 15px;
  }
}
@media (max-width: 767px) {
  .detail h2 {
    font-size: clamp(16px, 4.5vw, 20px);
  }
  .detail table th {
    font-size: clamp(14px, 3.5vw, 18px);
  }
  .merit_item h3 {
    font-size: clamp(12px, 3vw, 16px);
  }
  .case_item h3 {
    font-size: clamp(14px, 3.5vw, 18px);
  }
  .case_item h3::before {
    margin-right: 10px;
    padding: 5px 10px;
    font-size: clamp(12px, 3vw, 16px);
  }
  .case_item h4 {
    font-size: clamp(12px, 3vw, 16px);
  }
}
@media (max-width: 575px) {
}

/* ######################################################################
  .service_list (2階層以下)
###################################################################### */
.service_list {
}
.service_list h2 {
  margin-bottom: 60px;
}
.service_list_box {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.service_list_item {
  width: calc((100% - 48px) / 3);
  max-width: 384px;
  border-radius: 25px;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.service_list_item a {
  color: #333;
  text-decoration: none;
}
.service_list_item a:hover {
  opacity: .7;
}
.service_list_item h3 {
  margin-bottom: 6px;
  padding: 20px 20px 0;
  color: #CC0033;
  font-size: 20px;
  font-weight: bold;
}
.service_list_item p {
  padding: 0 20px 20px;
}
@media (max-width: 1399px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
  .service_list_item {
    width: 100%;
    border-radius: 15px;
  }
}
@media (max-width: 767px) {
  .service_list_item h3 {
    font-size: clamp(14px, 3.5vw, 18px);
  }
}
@media (max-width: 575px) {
}