@charset "UTF-8";
:root {
  --headHeight:80px !important;
  --baseBgColor:#E9EFF6; }

/* CLASS */
.mv {
  border-radius: var(--radius);
  overflow: hidden; }
  @media (min-width: 768px) {
    .mv {
      border-radius: calc( var(--radius) * 2 ); } }

.block_lp .head.border_bottom {
  border-color: var(--tertiaryColor);
  border-bottom-width: 2px;
  padding-bottom: var(--space3); }
.block_lp .head.border_top {
  border-top: 2px solid var(--tertiaryColor);
  padding-top: var(--space3); }

.sub_block .head {
  background: var(--primaryColor);
  color: #FFF;
  border-radius: var(--radius);
  padding: var(--space1) var(--space3);
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: var(--buttonHeight); }

.tags {
  --borderColor:var(--tertiaryColor);
  --textColor:var(--tertiaryColor); }

.lp_contact_wrap {
  display: flex;
  flex-direction: column;
  grid-gap: var(--space4);
  align-items: center;
  padding-top: var(--space4);
  padding-bottom: var(--space4);
  text-align: center; }

.keisansho_wrap {
  display: flex;
  flex-direction: column-reverse;
  grid-gap: var(--space2) var(--space4);
  align-items: center; }
  .keisansho_wrap .logo_wrap {
    aspect-ratio: 25 / 9 !important;
    width: 250px !important; }
    .keisansho_wrap .logo_wrap .logo .a .icon {
      background-image: url("../images/hdx/logo_keisansho.jpg") !important; }
  .keisansho_wrap .text {
    padding: var(--space2);
    box-sizing: border-box;
    border-top: 1px solid var(--colorBlack);
    border-bottom: 1px solid var(--colorBlack);
    font-size: var(--fontSize_s); }

/* ID */
#head {
  position: absolute !important;
  top: 0; }
  #head .box_wrap_minimum {
    height: 100%;
    display: flex;
    flex-direction: row;
    grid-gap: var(--space2);
    justify-content: space-between;
    align-items: center; }
  #head .cont_title {
    line-height: 1.5;
    color: var(--tertiaryColor); }
    #head .cont_title .sub_title {
      font-size: var(--fontSize_ss); }
    #head .cont_title .title {
      font-size: var(--fontSize_h5);
      line-height: 1; }
  @media (max-width: 520px) {
    #head .to_link .a {
      min-width: 100px; } }
  @media (min-width: 521px) {
    #head .cont_title .title {
      font-size: var(--fontSize_h3); } }

#contents .section_cont:first-child {
  padding-top: var(--space2); }

#foot .to_pagetop {
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin: var(--space4) auto;
  position: relative !important; }
#foot .logo_wrap {
  aspect-ratio: 128/20;
  width: 220px; }
  #foot .logo_wrap .logo .a .icon {
    background-image: url("../images/common/logo.png"); }
@media (min-width: 1024px) {
  #foot .foot_upper {
    flex-direction: column; } }

.block_case_study .archives .slick-track {
  /*display:flex;*/ }
.block_case_study .archives .slick-list {
  padding: 0; }
.block_case_study .archives .archive {
  box-sizing: border-box;
  padding-left: var(--space2);
  padding-right: var(--space2);
  max-width: 80vw; }
@media (min-width: 768px) {
  .block_case_study .archives .archive {
    max-width: calc( 720px + var(--space2) * 2 ); } }

/* hbs用 */
.boxes_hbs_scheme {
  margin-top: var(--space5);
  display: flex;
  flex-direction: column;
  grid-gap: var(--space4); }
  .boxes_hbs_scheme > .box {
    --circleSize:120px;
    width: 100%;
    display: flex;
    flex-direction: column;
    grid-gap: var(--space2) var(--space4); }
    .boxes_hbs_scheme > .box .category_circle {
      width: var(--circleSize);
      height: var(--circleSize);
      background: var(--tertiaryColor);
      color: #FFF;
      box-sizing: border-box;
      border-radius: 50%;
      padding-top: calc( var(--circleSize) * 3 / 4 );
      text-align: center;
      position: relative;
      font-size: var(--fontSize_ss);
      font-family: montserrat, noto-sans-cjk-jp, "Noto Sans", sans-serif;
      font-optical-sizing: auto;
      font-weight: 500;
      font-style: normal; }
      .boxes_hbs_scheme > .box .category_circle .img {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        bottom: calc( var(--circleSize) / 4 + var(--space1) ); }
      .boxes_hbs_scheme > .box .category_circle.category_circle_survey .img {
        width: 66%; }
      .boxes_hbs_scheme > .box .category_circle.category_circle_promotion .img {
        width: 68%; }
      .boxes_hbs_scheme > .box .category_circle.category_circle_verification .img {
        width: 66%; }
    .boxes_hbs_scheme > .box .inner {
      display: flex;
      flex-direction: column;
      grid-gap: var(--space2); }
      .boxes_hbs_scheme > .box .inner .flow_wrap {
        border-top: 1px solid var(--baseBorderColor);
        padding-top: var(--space2);
        display: flex;
        flex-direction: column;
        grid-gap: var(--space2); }
        .boxes_hbs_scheme > .box .inner .flow_wrap .flow {
          flex-direction: row;
          display: flex;
          grid-gap: var(--space2);
          position: relative; }
          .boxes_hbs_scheme > .box .inner .flow_wrap .flow:not(:last-of-type)::before {
            width: 1px;
            height: calc( 100% + var(--space2) );
            background: var(--tertiaryColor);
            content: "";
            position: absolute;
            top: 0;
            left: 12px; }
          .boxes_hbs_scheme > .box .inner .flow_wrap .flow .label {
            width: 24px; }
            .boxes_hbs_scheme > .box .inner .flow_wrap .flow .label .num {
              width: 24px;
              height: 24px;
              color: var(--tertiaryColor);
              position: relative;
              box-sizing: border-box;
              border: 1px solid var(--tertiaryColor);
              display: flex;
              justify-content: center;
              align-items: center;
              background: #FFF;
              position: relative;
              z-index: 2; }
          .boxes_hbs_scheme > .box .inner .flow_wrap .flow .cont {
            width: calc( 100% - ( 24px + var(--space2) ) );
            font-size: var(--fontSize_s); }
  @media (min-width: 768px) {
    .boxes_hbs_scheme {
      grid-gap: var(--space5); }
      .boxes_hbs_scheme > .box {
        --circleSize:180px;
        flex-direction: row; }
        .boxes_hbs_scheme > .box .category_circle {
          font-size: var(--fontSize_n); }
        .boxes_hbs_scheme > .box .inner {
          width: calc( 100% - ( var(--circleSize) + var(--space4) ) ); } }

.boxes_hbs_support {
  display: flex;
  flex-direction: column;
  grid-gap: var(--space4);
  padding-top: var(--space3); }
  .boxes_hbs_support > .box {
    display: flex;
    flex-direction: row;
    --gapSize:var(--space3);
    --imgWrapWidth:120px;
    grid-gap: var(--gapSize); }
    .boxes_hbs_support > .box .img_wrap {
      width: var(--imgWrapWidth);
      background: var(--baseBgColor);
      color: var(--tertiaryColor);
      font-size: var(--fontSize_s);
      font-family: montserrat, noto-sans-cjk-jp, "Noto Sans", sans-serif;
      font-optical-sizing: auto;
      font-weight: 500;
      font-style: normal;
      box-sizing: border-box;
      height: calc( var(--imgWrapWidth) * 2 / 3 );
      padding-top: calc( ( var(--imgWrapWidth) * 2 / 3 ) * 2 / 3 );
      position: relative;
      border-radius: var(--radius);
      display: flex;
      justify-content: center; }
      .boxes_hbs_support > .box .img_wrap .img {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        bottom: calc( calc( ( var(--imgWrapWidth) * 2 / 3 ) / 3 ) + var(--space1) / 2 ); }
    .boxes_hbs_support > .box:not(:last-child) .img_wrap::before {
      width: 19%;
      height: 100%;
      position: absolute;
      top: calc( 100% - 4px );
      left: 0;
      right: 0;
      margin: auto;
      background: url("../images/hbs/support_arrow.png") no-repeat top center;
      background-size: contain;
      content: ""; }
    .boxes_hbs_support > .box.box_01 .img_wrap .img, .boxes_hbs_support > .box.box_02 .img_wrap .img {
      width: 81%; }
    .boxes_hbs_support > .box.box_03 .img_wrap .img {
      width: 77%; }
    .boxes_hbs_support > .box.box_04 .img_wrap .img {
      width: 48%; }
    .boxes_hbs_support > .box.box_05 .img_wrap .img {
      width: 43%; }
    .boxes_hbs_support > .box .inner {
      width: calc( 100% - ( var(--gapSize) + var(--imgWrapWidth) ) ); }
  @media (min-width: 768px) {
    .boxes_hbs_support {
      grid-gap: var(--space5); }
      .boxes_hbs_support > .box {
        --gapSize:var(--space4);
        --imgWrapWidth:180px; } }

/* hdx用*/
.columns_hdx_contents {
  --columnColumnGap:var(--space5);
  --columnRowGap:var(--space5);
  --plusIconSize:calc( var(--columnRowGap) * 3 / 5 ); }
  .columns_hdx_contents .column {
    background: var(--baseBgColor);
    box-sizing: border-box;
    padding: var(--space2);
    border-radius: var(--radius);
    position: relative;
    display: flex;
    flex-direction: column;
    grid-gap: var(--space2); }
    .columns_hdx_contents .column .title_wrap {
      color: var(--primaryColor);
      text-align: center;
      width: 100%;
      justify-content: center;
      align-items: center; }
    .columns_hdx_contents .column:not(:last-child)::after {
      width: var(--plusIconSize);
      height: var(--columnRowGap);
      content: "";
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      margin: auto;
      background: url("../images/hdx/icon_plus.png") no-repeat center center;
      background-size: contain; }
    .columns_hdx_contents .column .boxes {
      display: flex;
      flex-direction: column;
      grid-gap: var(--space2); }
      .columns_hdx_contents .column .boxes .box {
        display: flex;
        flex-direction: column;
        grid-gap: var(--space1); }
        .columns_hdx_contents .column .boxes .box .label {
          display: flex; }
          .columns_hdx_contents .column .boxes .box .label .txt {
            padding: calc( var(--space1) / 2 ) var(--space2);
            min-height: 32px;
            display: flex;
            align-items: center;
            background: #FF;
            border: 1px solid var(--colorGray);
            border-radius: 4px;
            background: #FFF; }
  @media (min-width: 768px) {
    .columns_hdx_contents .column:not(:last-child)::after {
      width: var(--columnColumnGap);
      height: var(--plusIconSize);
      top: 0;
      bottom: 0;
      left: 100%;
      right: auto; }
    .columns_hdx_contents .column .title_wrap .title {
      font-size: var(--fontSize_h4); } }

.grids_hdx_contents {
  display: grid;
  grid-gap: var(--space1); }
  .grids_hdx_contents .grid {
    background: var(--primaryColor);
    color: #FFF;
    box-sizing: border-box;
    padding: var(--space2);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    grid-gap: var(--space2); }
    .grids_hdx_contents .grid .label {
      --iconSize:24px;
      display: flex;
      grid-gap: var(--space1);
      align-items: center;
      font-family: montserrat, noto-sans-cjk-jp, "Noto Sans", sans-serif;
      font-optical-sizing: auto;
      font-weight: 500;
      font-style: normal;
      font-size: var(--fontSize_l); }
      .grids_hdx_contents .grid .label .icon {
        width: var(--iconSize);
        display: flex;
        justify-content: center;
        align-items: center; }
    .grids_hdx_contents .grid.grid_02 .label .icon img {
      width: 83%; }
    .grids_hdx_contents .grid.grid_05 .label .icon img {
      width: 54%; }
  @media (min-width: 521px) {
    .grids_hdx_contents {
      grid-template-columns: 1fr 1fr; }
      .grids_hdx_contents .grid.grid_01 {
        grid-column-start: 1;
        grid-column-end: 3; } }
  @media (min-width: 1024px) {
    .grids_hdx_contents {
      grid-template-columns: 1fr 1fr 1fr; }
      .grids_hdx_contents .grid.grid_01 {
        grid-column-start: 1;
        grid-column-end: 2;
        grid-row-start: 1;
        grid-row-end: 3; }
      .grids_hdx_contents .grid .label {
        font-size: var(--fontSize_n); }
      .grids_hdx_contents .grid .cont .text {
        font-size: var(--fontSize_s); } }

.boxes_hdx_support {
  display: flex;
  flex-direction: column;
  grid-gap: var(--space2); }
  .boxes_hdx_support .box {
    border-radius: var(--radius);
    box-sizing: border-box;
    padding: var(--space2);
    border: 2px solid var(--tertiaryColor);
    display: flex;
    flex-direction: column;
    grid-gap: var(--space2) var(--space2); }
    .boxes_hdx_support .box .label {
      display: flex;
      grid-gap: var(--space1);
      align-items: center;
      font-size: var(--fontSize_l);
      color: var(--tertiaryColor);
      font-family: montserrat, noto-sans-cjk-jp, "Noto Sans", sans-serif;
      font-optical-sizing: auto;
      font-weight: 500;
      font-style: normal; }
      .boxes_hdx_support .box .label .num {
        color: #FFF;
        background: var(--tertiaryColor);
        width: 32px;
        height: 32px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 2px; }
  @media (min-width: 768px) {
    .boxes_hdx_support .box {
      flex-direction: row;
      align-items: center; }
      .boxes_hdx_support .box .label {
        width: 8em; }
      .boxes_hdx_support .box .cont {
        width: calc( 100% - ( 8em + var(--space2) ) ); } }
