:root {
  --color-main: #fc685a;
  --color-white: #fff;
  --color-accent01: #0097f4;
  --color-accent02: #4c5a6c;
  --color-accent03: #004fc4;
  --color-accent04: #31cfeb;
  --color-accent05: #e5f4fd;
  --color-accent06: #79ccff;
  --color-accent07: #dbff12;
  --color-accent08: #3ddec6;
  --color-plan01: #178962;
  --color-plan01-bg: #eafff7;
  --color-plan02: #87d951;
  --color-plan02-bg: #f0ffe6;
  --color-black: #2c3540;
  --color-txt: #222;
  --color-gray: #ddd;
  --color-gray02: #929dac;
  --color-link: #00f;
}

/* =======================================================
fv
======================================================= */
.bl-fv {
  background: url("../images/generation-ai-practice/mv-bg.png") top center/cover no-repeat;
}
.bl-fv-hgroup .bl-hgroup-ttl-deco::after {
  right: -176px;
  bottom: -3px;
  width: 148px;
  height: 104px;
  background: url("../images/generation-ai/mv-robot.png") top center/contain no-repeat;
}
.bl-fv-item .bl-item-conts {
  font-size: 20px;
}

.bl-fv-hgroup-ttl{
  align-items: center;
}

.ttl-icon{
    width:56px;
    height:56px;
    display: inline-block;
    background-image: url(../images/generation-ai-practice/icon.svg);
    background-size: cover;
  }

@media screen and (width <= 750px) {
  .bl-fv {
    background: url("../images/generation-ai-practice/mv-bg-sp.png") top center/contain no-repeat,linear-gradient(270deg,#BED569,#BED569);
    background-color: #BED569;
  }
  .bl-fv-txt {
    margin-bottom: 44px;
  }
  .bl-fv-hgroup {
    margin-bottom: 125px;
  }
  .bl-fv-item:first-of-type::after {
    top: -102px;
    left: -30px;
    width: 176px;
    height: 123px;
    background: url("../images/generation-ai/mv-robot-sp.png") top center/contain no-repeat;
  }
  .bl-fv-item .bl-item-conts {
    font-size: 36px;
  }
  
}

.bl-fv-system {
  /* position: absolute; */
  /* bottom: -30px; */
  /* right: 0; */
  margin-top:32px;
}
.el-fv-system-ttl {
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.56px;
  width: 348px;
  height: 56px;
  padding: 5px 0;
  background: url("../images/ai-personnel/mv-ribbon.png") top center/cover no-repeat;
  margin-bottom: 8px;
  color: #573909;
}
.el-fv-system-ttl > span {
  font-size: 15px;
  letter-spacing: 0.6px;
  color: #573909;
}
.bl-fv-system-item {
  display: flex;
  flex-flow: nowrap;
  justify-content: flex-start;
  gap: 16px;
}
.bl-fv-system-item > div {
  width: 100%;
  max-width:348px;
  padding: 8px 14px;
}
.bl-fv-system-item-personnel {
  background-color: #FFFAFA;
  border: 1px solid #F40000;
}
.el-fv-system-item-ttl {
  font-size: 14px;
  color: #FFFFFF;
  font-weight: bold;
  letter-spacing: 0.56px;
  text-align: center;
  padding: 1px 0 2px;
  margin-bottom: 8px;
}
.bl-fv-system-item-business .el-fv-system-item-ttl {
  background-color: #00B114;
}
.el-fv-system-item-sub-wrap{
  display: flex;
  justify-content: center;
  align-items: center;
  gap:16px;
}
.el-fv-system-item-sub-ttl {
  font-size: 15px;
  font-weight: bold;
  letter-spacing: 0.6px;
  text-align: center;
}
.el-fv-system-item-discount-box{
  display: flex;
  justify-content: center;
  align-items: center;
  gap:8px;
}
.el-fv-system-item-discount-num {
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.56px;
  display: flex;
  align-items: center;
  position: relative;
}
.bl-fv-system-item-business .el-fv-system-item-discount-num,
.bl-fv-system-item-business .el-fv-system-item-discount-txt {
  color: #00B114;
}
.el-fv-system-item-discount-num > span {
  font-size: 40px;
  letter-spacing: 1.6px;
  padding: 0 0 6px 8px;
  line-height: 1em;
}
.el-fv-system-item-discount-txt {
  /* position: absolute; */
  /* display: flex; */
  /* flex-flow: column; */
  font-size: 14px;
  font-weight: bold;
  top: 153px;
}
.bl-fv-system-item-personnel .el-fv-system-item-discount-txt {
  right: 200px;
}
.bl-fv-system-item-business .el-fv-system-item-discount-txt {
  right: 27px;
}
.bl-fv-system-item .el-att {
  display: block;
  text-align: center;
}
.bl-fv-system-item .el-btn {
  font-size: 15px;
  text-decoration: underline;
}
.bl-fv-system-item-business {
  background-color: #F4FFF5;
  border: 1px solid #00B114;
}

@media screen and (width <= 750px) {

  .bl-fv-system {
    margin-top: 64px;
    position: relative;
    bottom: unset;
    right: unset;
  }
  .el-fv-system-ttl {
    padding: 12px;
    font-size: 30px;
    letter-spacing: 1.2px;
    width: 690px;
    height: 112px;
    background: url(../images/ai-personnel/mv-ribbon-sp.png) top center / cover no-repeat;
    margin-bottom: 24px;
  }
  .el-fv-system-ttl > span {
    font-size: 30px;
    letter-spacing: 1.2px;
  }
  .bl-fv-system-item {
    gap: 24px;
  }
  .bl-fv-system-item > div {
    width: 100%;
    max-width: none;
    padding: 24px;
  }
  .el-fv-system-item-ttl {
    font-size: 28px;
    letter-spacing: 1.12px;
    padding: 4px 0 5px;
    margin-bottom: 16px;
  }
  .el-fv-system-item-sub-ttl {
    font-size: 30px;
    letter-spacing: 1.2px;
  }
  .el-fv-system-item-discount-num {
    font-size: 28px;
    letter-spacing: 1.12px;
  }
  .el-fv-system-item-discount-num > span {
    font-size: 90px;
    letter-spacing: 3.6px;
    padding: 0 0 6px 8px;
    line-height: 1em;
  }
  .el-fv-system-item-discount-txt {
    flex-flow: initial;
    font-size: 28px;
    top: 362px;
  }
  .el-fv-system-item-discount-txt > span:last-of-type{
    padding-left: 8px;
  }
  .bl-fv-system-item-personnel .el-fv-system-item-discount-txt {
    right: 390px;
  }
  .bl-fv-system-item-business .el-fv-system-item-discount-txt {
    right: 27px;
  }
  .bl-fv-system-item .el-att {
    margin-bottom: 16px;
  }
  .bl-fv-system-item .el-btn {
    font-size: 28px;
  }
}


/* =======================================================
about
======================================================= */
.bl-about .bl-column-head {
  margin-bottom: 24px;
}
.bl-about .bl-column-head .bl-head-list {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(5, auto);
  gap: 8px 40px;
}
.bl-about .bl-column-head .bl-head-item {
  padding: 8px 24px 11px;
  background: var(--color-white);
  width: 468px;
}
.bl-about .bl-body-txt + .bl-body-txt {
  margin-top: 1.3em;
}

.bl-practice-content{
  display: flex;
  flex-direction: column;
  gap:10px;
}

.bl-practice-content-item{
  display: grid;
  grid-template-columns: calc(30% + 20px) 1fr;
  gap: 0px;
}
.bl-practice-content_ttl{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:8px;
  background-color: var(--color-accent01);
  color:var(--color-white);
  padding:16px 32px 16px 16px;
  position: relative;
  font-weight: bold;
  clip-path: polygon(
  0 0,
  calc(100% - 20px) 0,
  calc(100% - 20px) calc(50% - 9px),
  100% 50%,
  calc(100% - 20px) calc(50% + 9px),
  calc(100% - 20px) 100%,
  0% 100%);
}
.bl-practice-content_ttl span{
  color:var(--color-accent07);
}


.bl-practice-content_body{
  padding:16px;
  background-color: #fff;
}

.bl-practice-content_body ul{
  list-style: disc;
}
.bl-practice-content_body li{
  margin-left:30px;
}
.bl-practice-content_ttl_sub{
  margin:10px 0;
  border-bottom:1px solid var(--color-accent01);
  color:var(--color-accent01);
  font-weight: bold;
}

@media screen and (width <= 750px) {
  .bl-about .bl-column-head .bl-head-list {
      grid-auto-flow: row;
    gap: 6px;
  }
  .bl-about .bl-column-head .bl-head-item {
    padding: 12px 32px 16px;
    width: 100%;
  }
  .bl-practice-content-item{
    grid-template-columns: 1fr;
  }
  .bl-practice-content_ttl{
    clip-path: none;
    font-size:32px;
    padding:32px;
  }
}

/* =======================================================
bl-comparison-table
======================================================= */
.bl-comparison-table {
  padding: 64px 0;
}
.bl-comparison-table-ttl {
  margin-bottom: 40px;
}
.bl-comparison-table-intro {
  margin-bottom: 8px;
  text-align: center;
}
.bl-comparison-table-intro-att {
  margin-bottom: 40px;
  justify-content: center;
}
.bl-comparison-table-tbl {
  width:100%;
}
.bl-comparison-table-tbl-outer {
  margin-bottom: 40px;
}
.bl-comparison-table-tbl-wrapper {
  margin-bottom: 8px;
}
.bl-comparison-table-tbl-att {
  display: none;
}
.bl-comparison-table-thead {
}
.bl-comparison-table-thead .bl-comparison-table-tr {
}

.bl-comparison-table-thead .bl-comparison-table-tr.is-col3 {
}

.bl-comparison-table-thead .bl-comparison-table-th {
  padding: 16px 16px;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-white);
  background: var(--color-accent01);
  border-top: 1px solid var(--color-white);
  border-left: 1px solid var(--color-white);
}

.bl-comparison-table-thead .bl-comparison-table-th:last-of-type {
  border-right: 1px solid var(--color-white);
}
.bl-comparison-table-tbody {
}
.bl-comparison-table-tbody .bl-comparison-table-tr {
}
.bl-comparison-table-tbody .bl-comparison-table-tr.is-col3{
}
.bl-comparison-table-tbody .bl-comparison-table-tr:last-of-type .bl-comparison-table-th {
  border-bottom: 1px solid var(--color-white);
}
.bl-comparison-table-tbody .bl-comparison-table-tr:last-of-type .bl-comparison-table-td {
  border-bottom: 1px solid var(--color-gray);
}
.bl-comparison-table-tbody .bl-comparison-table-th {
  padding: 16px;
  font-weight: 400;
  background: var(--color-gray);
  border-top: 1px solid var(--color-white);
  border-left: 1px solid var(--color-white);
}
.bl-comparison-table-tbody .bl-comparison-table-th-deco {
  display: block;
  font-size: 15px;
}
.bl-comparison-table-tbody .bl-comparison-table-td {
  font-size: 20px;
  font-weight: 700;
  background: var(--color-white);
  border-top: 1px solid var(--color-gray);
  border-left: 1px solid var(--color-gray);
  text-align: center;
}
.bl-comparison-table-tbody .bl-comparison-table-td.is-accent{
  color:var(--color-main);
  font-weight: bold;
}
.bl-comparison-table-thead .bl-comparison-table-th:last-child,
.bl-comparison-table-tbody .bl-comparison-table-td:last-child{
  border-right: 1px solid var(--color-gray);
}
.bl-comparison-table-tr {
}
.bl-comparison-table-th {
}
.bl-comparison-table-td {
}
.bl-comparison-table .bl-price {
  margin-bottom: 16px;
}

@media screen and (width <= 750px) {
  .bl-comparison-table {
    padding: 80px 0;
  }
  .bl-comparison-table-ttl {
    margin-bottom: 48px;
  }
  .bl-comparison-table-intro {
    margin-bottom: 16px;
  }
  .bl-comparison-table-intro-att {
    margin-bottom: 48px;
  }
  .bl-comparison-table-tbl {
    width: 1600px;
  }
  .bl-comparison-table-tbl-outer {
    margin-bottom: 64px;
  }
  .bl-comparison-table-tbl-wrapper {
    margin-bottom: 12px;
    overflow-x: scroll;
  }
  .bl-comparison-table-tbl-att {
    display: block;
    margin-bottom: 8px;
  }
  .bl-comparison-table-thead .bl-comparison-table-th {
    padding: 24px 16px;
    font-size: 30px;
    border-width: 2px;
  }
  .bl-comparison-table-thead .bl-comparison-table-th:last-of-type {
    border-width: 2px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-tr {
  }
  .bl-comparison-table-tbody .bl-comparison-table-tr:last-of-type .bl-comparison-table-th {
    border-width: 2px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-tr:last-of-type .bl-comparison-table-td {
    border-width: 2px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-th {
    padding: 24px 16px 27px;
    border-width: 2px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-th-deco {
    font-size: 22px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-td {
    font-size: 30px;
    border-width: 2px;
  }
  .bl-comparison-table-tbody .bl-comparison-table-td:last-of-type() {
    border-width: 2px;
  }
  .bl-comparison-table .bl-price {
    margin-bottom: 24px;
  }
}

/* =======================================================
plan
======================================================= */
.bl-plan-tbl-outer {
  margin-bottom: 0;
}

/* =======================================================
feature
======================================================= */
.bl-feature {
  padding: 64px 0;
}
.bl-feature-ttl {
  margin-bottom: 36px;
}

.dl-feature-flow {
  padding:16px;
  background-color: var(--color-accent05);
  margin-bottom:40px;
}

.dl-feature-flow-list{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap:20px;
  counter-reset: feature_flow_no;
}

.dl-feature-flow-item{
  display: flex;
  border:1px solid var(--color-accent01);
  background-color: var(--color-white);
  border-radius: 8px;
  padding:16px;
  color:var(--color-accent01);
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
.dl-feature-flow-item::before{
  counter-increment: feature_flow_no;
  content: counter(feature_flow_no);
  position: absolute;
  width:32px;
  height:32px;
  border-radius: 50%;
  background-color:var(--color-accent01);
  line-height:32px;
  text-align: center;
  color:var(--color-white);
  top:-16px;
  left:-16px;
}
.dl-feature-flow-item:not(:last-child)::after{
  position: absolute;
  content:"";
  width:16px;
  height:20px;
  display: block;
  right:-17px;
  top:50%;
  transform: translateY(-50%);
  background-color: var(--color-accent01);
  clip-path: polygon(0 0,100% 50%,0 100%);
}

@media screen and (width <= 750px) {
  .dl-feature-flow-list{
    grid-template-columns: 1fr;
    gap:40px;
  }
  .dl-feature-flow-item{
    font-size:30px;
    border-width: 5px;
  }
  .dl-feature-flow-item::before{
    width:48px;
    height:48px;
    line-height:48px;
    font-size:32px;
  }
  .dl-feature-flow-item:not(:last-child)::after{
    width:32px;
    height:40px;
    transform:translateX(-50%) rotate(90deg);
    top:auto;
    right:auto;
    left:50%;
    bottom:-35px;
  }
}

.bl-feature-list {
  display: grid;
  gap: 40px;
  margin-bottom: 40px;
}
.bl-feature-item {
  display: grid;
  grid-template: "head ttl" "head txt";
  grid-template-rows: auto 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 32px;
}
.bl-feature-item .bl-item-head {
  grid-area: head;
  padding: 20px 16px 24px;
  background: var(--color-accent05);
}
.bl-feature-item .bl-item-head .bl-head-dwrap {
  display: grid;
  grid-template-columns: 190px 1fr;
}
.bl-feature-item .bl-item-head .bl-head-dwrap:not(:last-of-type) .bl-head-dttl {
  border-bottom: 2px solid var(--color-white);
}
.bl-feature-item .bl-item-head .bl-head-dwrap:not(:last-of-type) .bl-head-ditem {
  border-bottom: 2px solid var(--color-accent05);
}
.bl-feature-item .bl-item-head .bl-head-dttl {
  display: grid;
  place-content: center;
  padding: 10px 0 12px;
  font-size: 18px;
  font-weight: 700;
  color: var(--color-accent07);
  background: var(--color-accent01);
}
.bl-feature-item .bl-item-head .bl-head-ditem {
  display: flex;
  align-items: center;
  padding-left: 12px;
  background: var(--color-white);
}
.bl-feature-item .bl-item-img-wrapper {
  grid-area: head;
}
.bl-feature-item .bl-item-ttl {
  grid-area: ttl;
  padding-bottom: 16px;
  margin-bottom: 16px;
  font-size: 24px;
  font-weight: 700;
  border-bottom: 1px solid var(--color-gray);
}
.bl-feature-item .bl-item-txt {
  grid-area: txt;
}
.bl-feature .bl-example-ttl,
.bl-feature .bl-uservoice-ttl {
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 44px;
  font-size: 28px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.06em;
  border-bottom: 1px solid var(--color-accent01);
}
.bl-feature .bl-example-ttl::after,
.bl-feature .bl-uservoice-ttl::after {
  position: absolute;
  bottom: -20px;
  left: 50%;
  width: 0;
  height: 0;
  content: "";
  border-color: var(--color-accent01) transparent transparent transparent;
  border-style: solid;
  border-width: 20px 40px 0;
  transform: translateX(-50%);
}
.bl-exercise .bl-exercise-def {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin-bottom: 72px;
}
.bl-exercise .bl-exercise-dwrap {
  border: 2px solid #0097F4;
  border-radius: 8px;
}
.bl-exercise .bl-exercise-dttl {
  padding: 14px 0 15px;
  font-size: 24px;
  font-weight: bold;
  color: #DBFF12;
  text-align: center;
  background: var(--color-accent01);
}
.bl-exercise .bl-exercise-ditem {
  padding: 32px;
}
.bl-exercise .bl-exercise-ditem .bl-bullet-list {
  gap: 16px;
}
.bl-exercise .bl-exercise-ditem .bl-bullet-list > li {
  display: initial;
  text-indent: -1em;
  padding-left: 1em;
}
.bl-exercise .bl-exercise-ditem .bl-bullet-list > li::before,
.bl-exercise .bl-exercise-ditem .bl-bullet-list > li > span {
  color: var(--color-accent01);
  font-weight: bold;
}
.bl-feature .bl-example-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.bl-feature .bl-example-item .bl-eitem-ttl {
  padding: 12px 0 15px;
  margin-bottom: 12px;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  background: var(--color-accent05);
}
.bl-eitem-ttl-sub{
        font-size:18px;
        border-bottom:1px solid #000;
        margin:12px 0;
    }
    .bl-eitem-ttl .is-sub{
        display: block;
        font-size:14px;
    }
    .bl-feature .bl-example-list {
        grid-template-columns: repeat(2,1fr);
    }
    @media screen and (width <= 750px) {
        .bl-eitem-ttl-sub{
          font-size:32px;
        }
        .bl-feature .bl-example-list {
            grid-template-columns: auto;
        }
        .bl-eitem-ttl .is-sub{
          font-size:24px;
          margin-top:0.5em;
        }
    }
.dl-example-flow {
  padding:16px;
  background-color: var(--color-accent05);
  margin-bottom:40px;
}

.dl-example-flow-list{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap:20px;
  counter-reset: feature_flow_no;
}

.bl-eitem-txt+.bl-eitem-txt{
  margin-top:8px;
}

.bl-eitem-txt strong{
  color:var(--color-accent01);
}

.dl-example-flow-item{
  
  position: relative;
}
.dl-example-flow-item::before{
  counter-increment: feature_flow_no;
  content: counter(feature_flow_no);
  position: absolute;
  width:32px;
  height:32px;
  border-radius: 50%;
  background-color:var(--color-accent01);
  line-height:32px;
  text-align: center;
  color:var(--color-white);
  top:-16px;
  left:-16px;
}
.dl-example-flow-item:not(:last-child)::after{
  position: absolute;
  content:"";
  width:16px;
  height:20px;
  display: block;
  right:-16px;
  top:50%;
  transform: translateY(-50%);
  background-color: var(--color-accent01);
  clip-path: polygon(0 0,100% 50%,0 100%);
}
.dl-example-flow-item_inner{
  display: flex;
  flex-direction: column;
  border:1px solid var(--color-accent01);
  background-color: var(--color-white);
  border-radius: 8px;
  color:var(--color-accent01);
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
}
.dl-example-flow-item figure{
  font-size: 0;
  aspect-ratio: 315 / 188;
  width: 100%;
}
.dl-example-flow-item figure img{
  width:100%;
}
.dl-example-flow-item p{
  padding:32px 16px;
  background-color: var(--color-accent01);
  color:var(--color-white);
  width:100%;
}

@media screen and (width <= 750px) {
  .dl-example-flow-list{
    grid-template-columns: 1fr;
    gap:40px;
  }
  .dl-example-flow-item_inner{
    font-size:30px;
    border-width: 5px;
  }
  .dl-example-flow-item::before{
    width:48px;
    height:48px;
    line-height:48px;
    font-size:32px;
  }
  .dl-example-flow-item:not(:last-child)::after{
    width:32px;
    height:40px;
    transform:translateX(-50%) rotate(90deg);
    top:auto;
    right:auto;
    left:50%;
    bottom:-35px;
  }
}

.bl-uservoice-ttl{
  margin-top:40px;
}
.bl-uservoicc_list{
  display: flex;
  flex-direction: column;
  gap:28px;
}
.bl-uservoice_item{
  background-color: var(--color-accent05);
  padding:16px;
  display: grid;
  grid-template-columns: 100px 1fr;
  gap:16px;
  align-items: flex-start;
}

.bl-uservoice_name{
  margin-top:8px;
  font-weight: bold;
  text-align: right;
}

@media screen and (width <= 750px) {
  .bl-feature {
    padding: 80px 0;
  }
  .bl-feature-ttl {
    margin-bottom: 48px;
  }
  .bl-feature-list {
    gap: 64px;
    margin-bottom: 64px;
  }
  .bl-feature-item {
    grid-template: "head" "ttl" "txt";
    grid-template-rows: auto;
    grid-template-columns: auto;
    gap: 0;
  }
  .bl-feature-item .bl-item-head {
    padding: 24px;
    margin-bottom: 24px;
  }
  .bl-feature-item .bl-item-head .bl-head-dwrap {
    grid-template-columns: 240px 1fr;
  }
  .bl-feature-item .bl-item-head .bl-head-dwrap:not(:last-of-type) .bl-head-dttl {
    border-width: 3px;
  }
  .bl-feature-item .bl-item-head .bl-head-dwrap:not(:last-of-type) .bl-head-ditem {
    border-width: 3px;
  }
  .bl-feature-item .bl-item-head .bl-head-dttl {
    padding: 15px 0 19px;
    font-size: 30px;
  }
  .bl-feature-item .bl-item-head .bl-head-ditem {
    padding-left: 18px;
  }
  .bl-feature-item .bl-item-img-wrapper {
    margin-bottom: 24px;
  }
  .bl-feature-item .bl-item-ttl {
    padding-bottom: 24px;
    margin-bottom: 24px;
    font-size: 36px;
    text-align: center;
    border-width: 2px;
  }
  .bl-feature .bl-example-ttl {
    padding-bottom: 24px;
    margin-bottom: 66px;
    font-size: 36px;
    border-width: 2px;
  }
  .bl-feature .bl-example-ttl::after {
    bottom: -30px;
    border-width: 30px 60px 0;
  }
  .bl-exercise .bl-exercise-def {
    grid-template-columns: repeat(1, 1fr);
  }
  .bl-exercise .bl-exercise-dttl {
    font-size: 36px;
  }
  .bl-exercise .bl-exercise-ditem {
    padding: 40px 32px;
  }
  .bl-exercise .bl-exercise-ditem .bl-bullet-list {
    gap: 24px;
  }
  .bl-feature .bl-example-list {
    grid-template-columns: auto;
    gap: 48px;
  }
  .bl-feature .bl-example-item .bl-eitem-ttl {
    padding: 16px 0 20px;
    margin-bottom: 18px;
    font-size: 32px;
  }
}
/* =======================================================
application
======================================================= */
.bl-application-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.bl-application-item {
  width: calc((100% - 32px) / 2);
}
.bl-application-item .bl-item-txt.el-att {
  justify-content: center;
  font-size: 17px;
}

@media screen and (width <= 750px) {
  .bl-application-item {
    width: 100%;
  }
  .bl-application-item .bl-item-txt.el-att {
    font-size: 28px;
  }
}
/* =======================================================
detail
======================================================= */
.bl-detail .bl-sample-ttl {
  margin-bottom: 24px;
  font-size: 26px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.06em;
}
.bl-detail .bl-sample-movie {
  width: 708px;
  height: 400px;
  margin: 0 auto;
  border: 1px solid #707070;
}
.bl-detail .bl-sample-movie > iframe {
  width: 100%;
  height: 100%;
}
.bl-detail .bl-support-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.bl-detail .bl-support-item .bl-sitem-txt {
  font-size: 18px;
}
.bl-detail .bl-support-item:first-of-type .bl-sitem-txt::after {
  background: url("../images/common/icon-support04.svg") top center/contain no-repeat;
}
.bl-detail .bl-support-item:nth-of-type(2) .bl-sitem-txt::after {
  background: url("../images/common/icon-support01.svg") top center/contain no-repeat;
}
.bl-detail .bl-support-item:nth-of-type(3) .bl-sitem-txt::after {
  background: url("../images/common/icon-support02.svg") top center/contain no-repeat;
}
.bl-detail .bl-support-item:nth-of-type(4) .bl-sitem-num {
  background: var(--color-accent08);
}
.bl-detail .bl-support-item:nth-of-type(4) .bl-sitem-txt {
  border-color: var(--color-accent08);
}
.bl-detail .bl-support-item:nth-of-type(4) .bl-sitem-txt::after {
  background: url("../images/common/icon-support03.svg") top center/contain no-repeat;
}
.bl-detail .bl-column-list .bl-citem-img-wrapper figcaption {
  margin-top: 8px;
}

@media screen and (width <= 750px) {
  .bl-detail .bl-sample-ttl {
    margin-bottom: 32px;
    font-size: 36px;
  }
  .bl-detail .bl-sample-movie {
    width: 100%;
    height: 388px;
    border-width: 2px;
  }
  .bl-detail .bl-support-list {
    grid-template-columns: auto;
    gap: 48px;
  }
  .bl-detail .bl-support-item .bl-sitem-txt {
    font-size: 30px;
  }
  .bl-detail .bl-column-list .bl-citem-img-wrapper figcaption {
    margin-top: 12px;
  }
}

/* =======================================================
application
======================================================= */
.bl-business-coupon {
  padding: 0px 0 80px;
}
.bl-business-coupon-cont {
  width: 976px;
  height: auto;
  padding: 24px 0 32px;
  background: url("../images/ai-personnel/business-coupon.jpg") top center / cover no-repeat;
  border: 2px solid #00B114;
  margin-left:auto;
  margin-right:auto;
}

.bl-business-coupon-cont .el-top.el-att{
  padding-left:0;
  text-indent: 0;
}
.bl-business-coupon-cont .el-top.el-att::before{
  min-width:1em;
  margin-left:-1em;
}

.bl-business-coupon-cont .bl-business-coupon-lbl {
  background-color: #00B114;
  color: var(--color-white);
  width: 130px;
  padding: 2px 0 4px;
  line-height: calc(25 / 17);
  font-weight: 700;
  margin: 0 auto 8px;
  text-align: center;
  font-size: 20px;
}
.bl-business-coupon-cont .bl-business-coupon-ttl {
  color: #222222;
  font-size: 20px;
  letter-spacing: 1.56px;
  margin-bottom: 8px;
  text-align: center;
}
.bl-business-coupon-cont .bl-business-coupon-ttl .el-big {
  font-size: 32px;
  letter-spacing: 1.28px;
  padding-left: 4px;
}
.bl-business-coupon-cont .bl-business-coupon-ttl .el-left {
  padding-left: 4px;
}
.bl-business-coupon-cont .el-att.el-top {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}
.bl-business-coupon-cont .bl-business-coupon-txt.el-middle {
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 1.56px;
  text-align: center;
  margin-bottom: 24px;
}
.bl-business-coupon-cont .bl-business-coupon-txt.el-lighter {
  text-align: center;
  margin-bottom: 48px;
}
.bl-business-coupon-cont > dl {
  display: flex;
  margin-bottom: 40px;
  gap: 48px;
  justify-content: center;
}
.bl-business-coupon-cont > dl > div {
  width: 351px;
  border: 2px solid #00B114;
  border-radius: 8px;
  position: relative;
}
.bl-business-coupon-cont > dl > div > dt {
  background-color: #00B114;
  color: #FFFFFF;
  text-align: center;
  letter-spacing: 0.8px;
  font-size: 20px;
  padding: 8px 0 9px;
}
.bl-business-coupon-cont > dl > div > dd {
  text-align: center;
  padding: 12px 0 14px;
  background-color: #FFFFFF;
  border-radius: 8px;
}
.bl-business-coupon-cont > dl > div:first-of-type::after {
  position: absolute;
  content: "＋";
  font-size: 30px;
  font-weight: bold;
  top: 50%;
  transform: translateY(-50%);
  right: -40px;
}
.bl-business-coupon-tbl-att {
  display: none;
}
.bl-business-coupon-cont .bl-business-coupon-table {
  margin: 0 auto 8px;
}
.bl-business-coupon-cont .bl-business-coupon-thead {
  display: block;
}
.bl-business-coupon-cont .bl-business-coupon-thead .bl-business-coupon-tr {
  display: grid;
  grid-template-columns: 210px repeat(3, 1fr);
}
.bl-business-coupon-cont .bl-business-coupon-thead .bl-business-coupon-th {
  padding: 18px 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-white);
  background: var(--color-accent01);
  border-top: 1px solid var(--color-white);
  border-left: 1px solid var(--color-white);
}
.bl-business-coupon-cont .bl-business-coupon-thead .bl-business-coupon-th:last-of-type {
  border-right: 1px solid var(--color-white);
}
.bl-business-coupon-cont .bl-business-coupon-tbody {
  display: block;
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-tr {
  display: grid;
  grid-template-columns: 210px repeat(3, 1fr);
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-tr:last-of-type .bl-business-coupon-th {
  border-bottom: 1px solid var(--color-white);
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-tr:last-of-type .bl-business-coupon-td {
  border-bottom: 1px solid var(--color-gray);
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-th {
  padding: 21px 0 18px;
  font-weight: 400;
  background: var(--color-gray);
  border-top: 1px solid var(--color-white);
  border-left: 1px solid var(--color-white);
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-th-deco {
  display: block;
  font-size: 15px;
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td {
  display: block;
  place-content: center;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  background: var(--color-white);
  border-top: 1px solid var(--color-gray);
  border-left: 1px solid var(--color-gray);
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td:nth-of-type(2) {
  padding: 0 12px;
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td .el-lighter {
  font-size: 15px;
  font-weight: lighter;
}
.bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td:last-of-type() {
  border-right: 1px solid var(--color-gray);
}
.bl-business-coupon-cont .bl-business-coupon-tr {
  display: block;
}
.bl-business-coupon-cont .bl-business-coupon-th {
  display: block;
}
.bl-business-coupon-cont .bl-business-coupon-td {
  display: block;
}
.bl-business-coupon-cont .el-att.el-bottom {
  margin-left: 138px;
}
.bl-business-coupon-cont .el-att.el-bottom:last-of-type {
  margin-bottom: 24px;
}
.bl-business-coupon-cont .el-att.el-bottom {
  display: block;
}
.bl-business-coupon-cont .el-att.el-bottom > a {
  color: #FC685A;
  text-decoration: underline;
  font-weight: bold;
}
.bl-business-coupon .bl-volume-btn-wrapper {
  display: flex;
  justify-content: center;
}
.bl-business-coupon .bl-able-btn-wrapper{
  display: flex;
  justify-content: center;
}
.bl-business-coupon .el-btn.--arrow {
  /* background-color: #00B114; */
}
.bl-business-coupon .el-btn-arrow::before,
.bl-business-coupon .el-btn-arrow::after {
  /* background-color: #00B114; */
}

@media screen and (width <= 750px) {
  .bl-business-coupon-cont {
    width: 100%;
    padding: 32px 0;
    background: url("../images/ai-personnel/business-coupon-sp.jpg") top center / cover no-repeat;
    border: 4px solid #00B114;
  }
  .bl-business-coupon-cont .bl-business-coupon-lbl {
    width: 180px;
    padding: 6px 0;
    margin: 0 auto 32px;
    font-size: 32px;
  }
  .bl-business-coupon-cont .bl-business-coupon-ttl {
    font-size: 30px;
    letter-spacing: 1.2px;
    margin-bottom: 24px;
  }
  .bl-business-coupon-cont .bl-business-coupon-ttl .el-big {
    font-size: 50px;
    letter-spacing: 2px;
  }
  .bl-business-coupon-cont .el-att.el-top {
    margin-bottom: 56px;
  }
  .bl-business-coupon-cont .bl-business-coupon-txt.el-middle {
    font-size: 40px;
    letter-spacing: 2.4px;
    margin-bottom: 32px;
  }
  .bl-business-coupon-cont .bl-business-coupon-txt.el-lighter {
    margin-bottom: 56px;
  }
  .bl-business-coupon-cont > dl {
    margin-bottom: 56px;
    gap: 40px;
  }
  .bl-business-coupon-cont > dl > div {
    width: 280px;
  }
  .bl-business-coupon-cont > dl > div > dt {
    letter-spacing: 1.12px;
    font-size: 28px;
    padding: 12px 0;
  }
  .bl-business-coupon-cont > dl > div > dd {
    padding: 32px 0 32px;
  }
  .bl-business-coupon-cont > dl > div:first-of-type::after {
    font-size: 32px;
    font-weight: bold;
    right: -40px;
  }
  .bl-business-coupon-tbl-att {
    display: block;
    margin: 0 0 16px 40px;
  }
  .bl-business-coupon-tbl-wrapper {
    margin: 0 40px 12px;
    overflow-x: scroll;
  }
  .bl-business-coupon-cont .bl-business-coupon-table {
    margin: 0 auto 16px;
    width: 1300px;
  }
  .bl-business-coupon-cont .bl-business-coupon-thead .bl-business-coupon-tr {
    grid-template-columns: 341px repeat(3, 1fr);
  }
  .bl-business-coupon-cont .bl-business-coupon-thead .bl-business-coupon-th {
    padding: 24px 0;
    font-size: 30px;
  }
  .bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-tr {
    grid-template-columns: 341px repeat(3, 1fr);
  }
  .bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-th {
    padding: 30px 0;
    font-size: 30px;
  }
  .bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td {
    font-size: 30px;
  }
  .bl-business-coupon-cont .bl-business-coupon-tbody .bl-business-coupon-td .el-lighter {
    font-size: 25px;
  }
  .bl-business-coupon-cont .el-att.el-bottom {
  margin: 0 40px;
  }
  .bl-business-coupon-cont .el-att.el-bottom:last-of-type {
    margin-bottom: 32px;
  }
  .bl-business-coupon .bl-volume-btn-wrapper {
    text-align: center;
    font-size: 30px;
  }
  .bl-business-coupon .bl-volume-btn-wrapper .el-btn.--arrow {
    width: 560px;
  }
}

/* 追加調整 */
.bl-lower-cta-btn {
  width:340px;
}

@media screen and (width <= 750px) {
    .bl-lower-cta-btn {
        width: 570px;
    }
}