@charset "UTF-8";
/* CSS Document */
.p-service {
  padding: 0 20px;
  color: #141F2E;
}

@media (min-width: 768px) {
  .p-service {
    padding: 0 40px;
  }
}
.p-service + .p-service {
  margin-top: 80px;
}

.p-service-list_item {
  margin-top: 72px;
}

.p-service-list_title {
  position: relative;
  margin-bottom: 16px;
  padding-left: 24px;
  font-size: 1.6rem;
}

@media (min-width: 768px) {
  .p-service-list_title {
    font-size: 1.8rem;
  }
}
.p-service-list_title::before {
  content: "";
  position: absolute;
  top: 0.75em;
  left: 0;
  width: 16px;
  height: 1px;
  background-color: #141F2E;
}

.p-service-list_text {
  font-size: 1.4rem;
  line-height: 1.8;
}

.p-service_title {
  margin-bottom: 16px;
  font-size: 1.6rem;
}

@media (min-width: 768px) {
  .p-service_title {
    font-size: 1.8rem;
  }
}
@media (min-width: 768px) {
  .p-service-flow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.p-service-flow_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

@media (min-width: 768px) {
  .p-service-flow_inner {
    display: block;
    width: calc(50% - 20px);
  }
}
.p-service-flow_inner + .p-service-flow_inner {
  margin-top: 48px;
}

@media (min-width: 768px) {
  .p-service-flow_inner + .p-service-flow_inner {
    margin-top: 0;
    margin-left: 40px;
  }
}
.p-service-flow_inner + .p-service-flow_inner::before {
  content: "";
  position: absolute;
  top: -36px;
  left: calc(50% + 14px);
  width: 10px;
  height: 24px;
  background: url(../../common/img/icon_arrow_cl_main.svg) 0 0/100% no-repeat;
  -webkit-transform: translateX(-50%) rotate(90deg);
          transform: translateX(-50%) rotate(90deg);
}

@media (min-width: 768px) {
  .p-service-flow_inner + .p-service-flow_inner::before {
    top: 50%;
    left: -30px;
    -webkit-transform: translate(50%, 0) rotate(0);
            transform: translate(50%, 0) rotate(0);
  }
}
.p-service-flow_lead {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 12px;
  line-height: 1;
}

@media (min-width: 768px) {
  .p-service-flow_lead {
    display: block;
    width: 100%;
    margin-bottom: 16px;
    text-align: center;
  }
}
.p-service-flow_lead .-arrow {
  position: absolute;
  top: 0;
  left: calc(50% - 0.5px);
  width: 1px;
  height: 100%;
  background-color: #141F2E;
}

@media (min-width: 768px) {
  .p-service-flow_lead .-arrow {
    top: calc(50% + 4px);
    left: 0;
    width: 100%;
    height: 1px;
  }
}
.p-service-flow_lead .-arrow::before, .p-service-flow_lead .-arrow::after {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 8px;
  background-color: #141F2E;
}

.p-service-flow_lead .-arrow::before {
  content: "";
  top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transform-origin: top right;
          transform-origin: top right;
}

@media (min-width: 768px) {
  .p-service-flow_lead .-arrow::before {
    left: -1px;
    -webkit-transform: rotate(-135deg);
            transform: rotate(-135deg);
  }
}
.p-service-flow_lead .-arrow::after {
  content: "";
  bottom: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
}

@media (min-width: 768px) {
  .p-service-flow_lead .-arrow::after {
    left: 100%;
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
  }
}
.p-service-flow_lead .-text {
  position: relative;
  padding: 12px 0;
  font-size: 1.2rem;
  background-color: #F8F8F8;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 0.3em;
}

@media (min-width: 768px) {
  .p-service-flow_lead .-text {
    padding: 0 16px;
    font-size: 1.4rem;
    -webkit-writing-mode: inherit;
        -ms-writing-mode: inherit;
            writing-mode: inherit;
    letter-spacing: 0;
  }
}
.p-service-flow_list {
  margin-left: 16px;
}

@media (min-width: 768px) {
  .p-service-flow_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 0;
  }
}
.p-service-flow_item {
  position: relative;
  padding: 20px;
  background-color: #FFFFFF;
}

@media (min-width: 768px) {
  .p-service-flow_item {
    width: calc(50% - 20px);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.p-service-flow_item + .p-service-flow_item {
  margin-top: 48px;
}

@media (min-width: 768px) {
  .p-service-flow_item + .p-service-flow_item {
    margin-top: 0;
    margin-left: 40px;
  }
}
.p-service-flow_item + .p-service-flow_item::before {
  content: "";
  position: absolute;
  top: -36px;
  left: 50%;
  width: 10px;
  height: 24px;
  background: url(../../common/img/icon_arrow_cl_main.svg) 0 0/100% no-repeat;
  -webkit-transform: translateX(-50%) rotate(90deg);
          transform: translateX(-50%) rotate(90deg);
}

@media (min-width: 768px) {
  .p-service-flow_item + .p-service-flow_item::before {
    top: 50%;
    left: -25px;
    -webkit-transform: translate(0, -50%) rotate(0deg);
            transform: translate(0, -50%) rotate(0deg);
  }
}
.p-service-flow_title {
  margin-bottom: 16px;
  font-size: 1.6rem;
  text-align: center;
}

@media (min-width: 768px) {
  .p-service-flow_title {
    font-size: 1.8rem;
  }
}
.p-service-flow_btn {
  position: relative;
  width: 100%;
  padding: 8px 32px 8px 12px;
  background-color: #E6ECF2;
  border: 1px solid #E6ECF2;
  color: #141F2E;
  font-size: 1.2rem;
  line-height: 1.3;
  cursor: pointer;
  text-align: left;
}

@media (min-width: 768px) {
  .p-service-flow_btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 33px;
    padding: 0 24px 0 12px;
    line-height: 1.5;
  }
  .p-service-flow_btn.-large {
    height: 115px;
  }
  .p-service-flow_btn.-medium {
    height: 53px;
  }
}
.p-service-flow_btn::before, .p-service-flow_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 1px;
  height: 12px;
  background-color: #141F2E;
}

.p-service-flow_btn::before {
  right: 18px;
  -webkit-transform: translateY(-50%) rotate(90deg);
          transform: translateY(-50%) rotate(90deg);
}

@media (min-width: 768px) {
  .p-service-flow_btn::before {
    right: 12px;
  }
}
.p-service-flow_btn::after {
  right: 18px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

@media (min-width: 768px) {
  .p-service-flow_btn::after {
    right: 12px;
  }
}
.p-service-flow_btn + .p-service-flow_btn {
  margin-top: 8px;
}

.p-service-flow_text {
  margin-top: 16px;
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .p-service-price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
.p-service-price_item {
  padding: 20px;
  background-color: #FFFFFF;
}

.p-service-price_item + .p-service-price_item {
  margin-top: 40px;
}

@media (min-width: 768px) {
  .p-service-price_item + .p-service-price_item {
    margin-top: 0;
  }
}
@media (min-width: 768px) {
  .p-service-price_item {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .p-service-price_item.-item01 {
    width: 313px;
  }
  .p-service-price_item.-item02 {
    width: 527px;
  }
}
.p-service-price_title {
  margin-bottom: 16px;
  font-size: 1.6rem;
}

@media (min-width: 768px) {
  .p-service-price_title {
    font-size: 1.8rem;
  }
}
.p-service-price_text {
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .p-service-price_text {
    margin-right: -5px;
  }
}
.p-service-price_text + .p-service-price_text {
  margin-top: 8px;
}

.p-service-price_lead {
  margin: 16px 0;
  padding: 12px 20px;
  background-color: #E6ECF2;
  font-size: 1.4rem;
}

@media (min-width: 768px) {
  .p-service-price_lead {
    font-size: 1.6rem;
  }
}
.p-flow {
  padding: 0 20px;
  color: #141F2E;
}

@media (min-width: 768px) {
  .p-flow {
    padding: 0 40px;
  }
}
@media (min-width: 768px) {
  .p-flow_list {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
    gap: 0px 20px;
  }
}
.p-flow_item {
  position: relative;
  padding: 20px;
  background-color: #F8F8F8;
}
.p-flow_item.-small {
  padding: 10px;
}

@media (min-width: 768px) {
  .p-flow_item {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: subgrid;
    grid-template-rows: subgrid;
    -ms-grid-row-span: 2;
    grid-row: span 2;
    gap: 0px;
    padding: 16px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.p-flow_item + .p-flow_item {
  margin-top: 56px;
}

@media (min-width: 768px) {
  .p-flow_item + .p-flow_item {
    margin-top: 0;
  }
}
.p-flow_item + .p-flow_item::before, .p-flow_item + .p-flow_item::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 1px;
  background-color: #141F2E;
}

.p-flow_item + .p-flow_item::before {
  top: -40px;
  height: 22px;
}

@media (min-width: 768px) {
  .p-flow_item + .p-flow_item::before {
    top: 50%;
    left: -20px;
    width: 20px;
    height: 1px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
.p-flow_item + .p-flow_item::after {
  top: -28px;
  height: 10px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
}

@media (min-width: 768px) {
  .p-flow_item + .p-flow_item::after {
    top: 50%;
    left: 0;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
  }
}
.p-flow_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media (min-width: 768px) {
  .p-flow_title {
    display: block;
  }
}
.p-flow_title .-num {
  font-family: "Roboto", sans-serif;
  font-size: 2.8rem;
}

@media (min-width: 768px) {
  .p-flow_title .-num {
    display: block;
    margin-top: 4px;
    text-align: center;
  }
}
.p-flow_title .-text {
  margin-left: 8px;
  font-size: 1.6rem;
}

.p-flow_item.-small .p-flow_title .-text {
  font-size: 1.3rem;
  letter-spacing: -1px;
}

@media (min-width: 768px) {
  .p-flow_title .-text {
    display: block;
    margin-left: 0;
    margin-top: 8px;
    text-align: center;
  }
}
.p-flow_text {
  margin-top: 20px;
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .p-flow_text {
    margin-top: 24px;
  }
}
.p-flow_lead {
  margin-top: 40px;
  color: #144B84;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 2;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (min-width: 768px) {
  .p-flow_lead {
    margin-top: 32px;
    font-size: 1.6rem;
  }
}
.p-flow_lead .-large {
  font-size: 2rem;
}

@media (min-width: 768px) {
  .p-flow_lead .-large {
    font-size: 2.4rem;
  }
}
.p-case {
  padding: 0 20px;
  color: #141F2E;
}

@media (min-width: 768px) {
  .p-case {
    padding: 0 40px;
  }
}
@media (min-width: 768px) {
  .p-case_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media (min-width: 768px) {
  .p-case_item {
    position: relative;
    width: calc(50% - 40px);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.p-case_item + .p-case_item {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #D5D5D5;
}

@media (min-width: 768px) {
  .p-case_item + .p-case_item {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
  }
  .p-case_item + .p-case_item::before {
    content: "";
    position: absolute;
    top: 0;
    left: -40px;
    width: 1px;
    height: 100%;
    background-color: #D5D5D5;
  }
}
.p-case_tag {
  display: inline-block;
  padding: 2px 12px;
  background-color: #141F2E;
  color: #FFFFFF;
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .p-case_tag {
    font-size: 1.4rem;
  }
}
.p-case_lead {
  margin-top: 12px;
  font-size: 1.6rem;
}

@media (min-width: 768px) {
  .p-case_lead {
    font-size: 1.8rem;
    line-height: 1.4;
  }
}
.p-case_text {
  margin-top: 20px;
  font-size: 1.2rem;
}

.p-case-box {
  position: relative;
  margin-top: 56px;
  padding: 20px;
  background-color: #F8F8F8;
}

.p-case-box::before, .p-case-box::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 1px;
  background-color: #141F2E;
}

.p-case-box::before {
  top: -40px;
  height: 22px;
}

.p-case-box::after {
  top: -28px;
  height: 10px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
}

.p-case-box_lead {
  color: #144B84;
  font-size: 1.4rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (min-width: 768px) {
  .p-case-box_lead {
    font-size: 1.6rem;
  }
}
.p-case-box_list {
  margin-top: 20px;
}

@media (min-width: 768px) {
  .p-case-box_list {
    margin-right: -10px;
  }
}
.p-case-box_item {
  position: relative;
  padding-left: 1.2em;
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .p-case-box_item {
    font-size: 1.4rem;
  }
}
.p-case-box_item::before {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
}

.p-case-box_item + .p-case-box_item {
  margin-top: 16px;
}

.p-case-box_txt {
  font-size: 14px;
  line-height: 180%;
  margin-top: 1rem;
}
@media screen and (max-width: 767px) {
  .p-case-box_txt {
    font-size: 12px;
  }
}

/* ----------------------------------------------------------------------------
　c-mv_title
---------------------------------------------------------------------------- */
.c-mv_title .c-mv_title-inner .-jp.-no-slash:before,
.c-mv_title .c-mv_title-inner .-jp.-no-slash:after {
  display: none;
}

/* ----------------------------------------------------------------------------
　c-text
---------------------------------------------------------------------------- */
.c-text._small {
  font-size: 1.4rem;
}

.c-text._center {
  text-align: center;
}

.c-text a {
  text-decoration: underline !important;
}
.c-text a[target$=blank] {
  position: relative;
  padding: 0 18px 0 0;
  margin-right: 0.5rem;
}
.c-text a[target$=blank]:after {
  content: "";
  width: 13px;
  aspect-ratio: 1;
  background: url("../img/link_blank_black.svg") 0 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0.7rem;
  right: 0rem;
}

/* ----------------------------------------------------------------------------
　c-anchor_list
---------------------------------------------------------------------------- */
.c-anchor_list {
  gap: 2rem 0;
}
/* ----------------------------------------------------------------------------
　is-visible
---------------------------------------------------------------------------- */
.is-visible-xld,
.is-visible-ld,
.is-visible-sd {
  display: none;
}

@media all and (max-width: 1366px) {
  .is-visible-xld {
    display: block;
  }
  .is-hidden-xld {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .is-visible-ld {
    display: block;
  }
  .is-hidden-ld {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .is-visible-sd {
    display: block;
  }
  .is-hidden-sd {
    display: none !important;
  }
}
._mt0 {
  margin-top: 0rem !important;
}

._mt1 {
  margin-top: 1rem !important;
}

._mt2 {
  margin-top: 2rem !important;
}

._mt3 {
  margin-top: 3rem !important;
}

._mt4 {
  margin-top: 4rem !important;
}

._mt5 {
  margin-top: 5rem !important;
}

._mt6 {
  margin-top: 6rem !important;
}

._mt7 {
  margin-top: 7rem !important;
}

._mt8 {
  margin-top: 8rem !important;
}

._mt9 {
  margin-top: 9rem !important;
}

._mt10 {
  margin-top: 10rem !important;
}

._mb1 {
  margin-bottom: 1rem !important;
}

._mb2 {
  margin-bottom: 2rem !important;
}

._mb3 {
  margin-bottom: 3rem !important;
}

._mb4 {
  margin-bottom: 4rem !important;
}

._mb5 {
  margin-bottom: 5rem !important;
}

._mb6 {
  margin-bottom: 6rem !important;
}

._mb7 {
  margin-bottom: 7rem !important;
}

._mb8 {
  margin-bottom: 8rem !important;
}

._mb9 {
  margin-bottom: 9rem !important;
}

._mb10 {
  margin-bottom: 10rem !important;
}

._w0 {
  width: 0% !important;
}

._w10 {
  width: 10% !important;
}

._w20 {
  width: 20% !important;
}

._w30 {
  width: 30% !important;
}

._w40 {
  width: 40% !important;
}

._w50 {
  width: 50% !important;
}

._w60 {
  width: 60% !important;
}

._w70 {
  width: 70% !important;
}

._w80 {
  width: 80% !important;
}

._w90 {
  width: 90% !important;
}

._w100 {
  width: 100% !important;
}

@media screen and (max-width: 767px) {
  ._w0sp {
    width: 0% !important;
  }
  ._w10sp {
    width: 10% !important;
  }
  ._w20sp {
    width: 20% !important;
  }
  ._w30sp {
    width: 30% !important;
  }
  ._w40sp {
    width: 40% !important;
  }
  ._w50sp {
    width: 50% !important;
  }
  ._w60sp {
    width: 60% !important;
  }
  ._w70sp {
    width: 70% !important;
  }
  ._w80sp {
    width: 80% !important;
  }
  ._w90sp {
    width: 90% !important;
  }
  ._w100sp {
    width: 100% !important;
  }
}
._indent-1px {
  letter-spacing: -1px;
}

.btn_style01._w50 {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .btn_style01._w100 {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .btn_style01 {
    width: 100%;
  }
}
.btn_style01 a {
  position: relative;
  background-color: #233C5A;
  color: #fff;
  font-size: 1.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2rem 1.5rem;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
@media screen and (max-width: 767px) {
  .btn_style01 a {
    font-size: 1.6rem;
    padding: 1rem 0;
  }
}
.btn_style01 a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -18px;
  width: 36px;
  height: 2px;
  background-color: #86a2be;
  z-index: 2;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
@media screen and (max-width: 767px) {
  .btn_style01 a::after {
    right: -10px;
    width: 20px;
  }
}
.btn_style01 a[target$=blank]:before {
  content: "";
  -webkit-box-flex: 0;
      -ms-flex: 0 0 15px;
          flex: 0 0 15px;
  aspect-ratio: 1;
  background-color: #fff;
  margin-left: 0.5rem;
  background: url("../img/link_blank_white.svg") 0 0 no-repeat;
  background-size: 100% auto;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0.1rem;
}
.btn_style01 a:hover:after {
  -webkit-transform: translateX(5px);
          transform: translateX(5px);
}
.btn_style01 a:hover::before {
  -webkit-transform: translateX(2px);
          transform: translateX(2px);
}
.btn_style01._small a {
  font-size: 1.6rem;
  padding: 1rem 0;
}
@media screen and (max-width: 767px) {
  .btn_style01._small a {
    font-size: 1.4rem;
  }
}
.btn_style01._center {
  margin: 0 auto;
}

a .btn_style01 {
  position: relative;
  background-color: #233C5A;
  color: #fff;
  font-size: 1.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2rem 0;
}
@media screen and (max-width: 767px) {
  a .btn_style01 {
    font-size: 1.6rem;
    padding: 1rem 0;
  }
}
a .btn_style01._small {
  font-size: 1.6rem;
  padding: 1rem 0;
}
@media screen and (max-width: 767px) {
  a .btn_style01._small {
    font-size: 1.4rem;
  }
}
a .btn_style01::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -18px;
  width: 36px;
  height: 2px;
  background-color: #86a2be;
  z-index: 2;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
@media screen and (max-width: 767px) {
  a .btn_style01::after {
    right: -10px;
    width: 20px;
  }
}

a:hover .btn_style01:after {
  -webkit-transform: translateX(5px);
          transform: translateX(5px);
}

.link_style01:not(:last-child) {
  margin-bottom: 2rem;
}
.link_style01 a {
  position: relative;
  padding: 0 0 2px 18px;
  background: linear-gradient(to top, currentColor 1px, transparent 0%) no-repeat;
  -webkit-transition: 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  background-position: 0% 100%;
  background-size: 0% 1px;
}
.link_style01 a:hover {
  opacity: 1;
  background-size: 200% 1px;
}
.link_style01 a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  display: block;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: absolute;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  top: 0.85rem;
  left: 0rem;
}
.link_style01 a[target$=blank] {
  padding: 0 18px 2px 18px;
}
.link_style01 a[target$=blank]::after {
  content: "";
  width: 13px;
  height: auto;
  aspect-ratio: 1/1.1;
  background: url(../img/link_blank_black.svg) 0 0/100% no-repeat;
  position: absolute;
  top: 0.7rem;
  right: 0rem;
}

.btn_top_ourstrength {
  width: 400px;
  margin: 0 auto 5rem !important;
}
@media screen and (max-width: 767px) {
  .btn_top_ourstrength {
    width: 90%;
  }
}

.table_style01 {
  width: 100%;
  border-collapse: collapse;
  border-collapse: separate;
  border-spacing: 4px;
}
.table_style01._none_border th {
  border: none;
}
.table_style01._none_border td {
  border: none;
}
.table_style01 th {
  border: 1px solid #ccc;
  padding: 1rem;
  background-color: #e7ecf2;
  font-weight: 500;
}
.table_style01 th._bg_gray {
  background-color: #F8F8F8;
}
@media screen and (max-width: 767px) {
  .table_style01 th {
    font-size: 1.4rem;
    padding: 0.8rem;
  }
}
.table_style01 td {
  border: 1px solid #ccc;
  background-color: #fff;
  padding: 1rem;
}
@media screen and (max-width: 767px) {
  .table_style01 td {
    font-size: 1.4rem;
    padding: 0.8rem;
  }
}
.table_style01 td._bg_gray {
  background-color: #F8F8F8;
}
.table_style01 td._bg_blue {
  background-color: #e7ecf2;
}
.table_style01._txt_small th {
  font-size: 1.4rem;
  padding: 0.8rem 1rem;
}
@media screen and (max-width: 767px) {
  .table_style01._txt_small th {
    font-size: 1.2rem;
    padding: 0.8rem 1rem;
  }
}
.table_style01._txt_small td {
  font-size: 1.4rem;
  padding: 0.8rem 1rem;
}
@media screen and (max-width: 767px) {
  .table_style01._txt_small td {
    font-size: 1.2rem;
    padding: 0.8rem 1rem;
  }
}
.table_style01 ._center {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .table_scroll_wrap {
    padding-bottom: 1rem !important;
    overflow-x: auto;
  }
  .table_scroll_wrap::-webkit-scrollbar {
    height: 5px;
  }
  .table_scroll_wrap::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.7);
  }
}
.table_scroll_wrap:not(._no_padding) {
  margin: 0 40px;
}
@media screen and (max-width: 767px) {
  .table_scroll_wrap:not(._no_padding) {
    margin: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .table_scroll_wrap table {
    width: 200% !important;
  }
}

.scenario_block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 4rem 2%;
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .scenario_block {
    padding: 0 20px;
  }
}
.scenario_block .scenario_block__box {
  width: 48.5%;
}
@media screen and (max-width: 767px) {
  .scenario_block .scenario_block__box {
    width: 100%;
  }
}

.step_chart {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 3.5rem;
}
.step_chart:not(:last-child) {
  margin-bottom: 7rem;
}
.step_chart:not(._no_padding) {
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .step_chart:not(._no_padding) {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .step_chart {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 3rem 0;
  }
}
.step_chart .step_chart__range {
  width: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.step_chart .step_chart__range._w70per {
  width: 70%;
}
.step_chart .step_chart__range._w30per {
  width: 30%;
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__range._w70per {
    width: 100%;
  }
  .step_chart .step_chart__range._w30per {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__range:has(.step_chart__range-ttl) {
    padding-left: 27px;
  }
}
.step_chart .step_chart__range .step_chart__range-ttl {
  position: relative;
  font-size: 1.4rem;
  line-height: 120%;
  text-align: center;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__range .step_chart__range-ttl {
    position: absolute;
    top: 0rem;
    left: -0.5rem;
    width: 25px;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.step_chart .step_chart__range .step_chart__range-ttl .-txt {
  background-color: #f8f8f8;
  position: relative;
  z-index: 2;
  padding: 0 1rem;
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__range .step_chart__range-ttl .-txt {
    padding: 12px 0;
    font-size: 1.2rem;
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    text-orientation: upright;
    letter-spacing: 0.3em;
  }
}
.step_chart .step_chart__range .step_chart__range__inner {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 3.5rem;
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__range .step_chart__range__inner {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 3rem 0;
  }
}
.step_chart._bg_white .step_chart__block {
  border: 1px solid #ccc;
}
.step_chart._bg_white .step_chart__range-ttl .-txt {
  background-color: #fff;
}
.step_chart._txt_small .step_chart__block {
  padding: 1rem;
}
.step_chart._txt_small .step_chart__block .ttl {
  font-size: 1.4rem;
}
.step_chart .step_chart__block {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  background-color: #fff;
  padding: 2rem;
  position: relative;
}
.step_chart .step_chart__block:not(._last)::after {
  content: "";
  width: 3.5rem;
  height: 100%;
  position: absolute;
  top: 0rem;
  left: 100%;
  background: url("/promotion/connected/common/img/icon_arrow_cl_main.svg") center center no-repeat;
  background-size: 10px auto;
}
@media screen and (max-width: 767px) {
  .step_chart .step_chart__block:not(._last)::after {
    width: 100%;
    height: 3.5rem;
    top: 100%;
    left: 0rem;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
}
.step_chart .step_chart__block .ttl {
  font-size: 1.8rem;
  text-align: center;
}
.step_chart .step_chart__block .ttl:not(:last-child) {
  margin-bottom: 1rem;
}
.step_chart .step_chart__block .txt {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.2rem;
  background-color: #E6ECF2;
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.step_chart .step_chart__block .txt:not(:last-child) {
  margin-bottom: 1rem;
}
.step_chart .step_chart__block .note {
  font-size: 1.2rem;
}
.step_chart .step_chart__block .list li {
  font-size: 1.2rem;
  position: relative;
  padding: 0 0 0 12px;
}
.step_chart .step_chart__block .list li:not(:last-child) {
  margin-bottom: 0.2rem;
}
.step_chart .step_chart__block .list li::before {
  content: "";
  position: absolute;
  top: 0.8rem;
  left: 0rem;
  width: 5px;
  border-radius: 100px;
  aspect-ratio: 1;
  background-color: #233C5A;
}

.step_chart__range-ttl .-arrow {
  position: absolute;
  top: 0;
  left: calc(50% - 0.5px);
  width: 1px;
  height: 100%;
  background-color: #141F2E;
}

@media (min-width: 768px) {
  .step_chart__range-ttl .-arrow {
    top: calc(50% + 4px);
    left: 0;
    width: 100%;
    height: 1px;
  }
}
.step_chart__range-ttl .-arrow::before, .step_chart__range-ttl .-arrow::after {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 8px;
  background-color: #141F2E;
}

.step_chart__range-ttl .-arrow::before {
  content: "";
  top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transform-origin: top right;
          transform-origin: top right;
}

@media (min-width: 768px) {
  .step_chart__range-ttl .-arrow::before {
    left: -1px;
    -webkit-transform: rotate(-135deg);
            transform: rotate(-135deg);
  }
}
.step_chart__range-ttl .-arrow::after {
  content: "";
  bottom: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
}

@media (min-width: 768px) {
  .step_chart__range-ttl .-arrow::after {
    left: 100%;
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
  }
}
.chart {
  margin: 0 auto;
}
.chart:not(._no_padding) {
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .chart:not(._no_padding) {
    padding: 0 20px;
  }
}
.chart:not(:last-child) {
  margin-bottom: 5rem;
}
.chart img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .chart:has(._sp_scroll) {
    padding-bottom: 1rem !important;
    overflow-x: auto;
  }
  .chart:has(._sp_scroll)::-webkit-scrollbar {
    height: 5px;
  }
  .chart:has(._sp_scroll)::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.7);
  }
  .chart:has(._sp_scroll) img {
    width: 200%;
  }
}

.whats_aws {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.whats_aws:not(._no_padding) {
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .whats_aws:not(._no_padding) {
    padding: 0 20px;
  }
}
.whats_aws:not(:last-child) {
  margin-bottom: 10rem;
}
@media screen and (max-width: 767px) {
  .whats_aws {
    display: block;
  }
}
.whats_aws h2 {
  display: none;
}
.whats_aws .whats_aws-txt {
  font-size: 1.4rem;
  line-height: 180%;
  margin-right: 5rem;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
@media screen and (max-width: 767px) {
  .whats_aws .whats_aws-txt {
    margin: 0 0 3rem;
  }
}
.whats_aws .whats_aws-mark {
  width: 200px;
}
@media screen and (max-width: 767px) {
  .whats_aws .whats_aws-mark {
    width: 70%;
    margin: 0 auto;
  }
}
.whats_aws .whats_aws-mark img {
  width: 100%;
}

.p-service-list_title2 {
  font-size: 1.8rem;
  position: relative;
  padding: 0 0 0 20px;
}
.p-service-list_title2:not(:last-child) {
  margin-bottom: 2rem;
}
.p-service-list_title2::before {
  content: "";
  position: absolute;
  top: 0.9rem;
  left: 0rem;
  width: 10px;
  height: 10px;
  background-color: #141F2E;
}
.p-service-list_title2._center {
  text-align: center;
}
.p-service-list_title2._center::before {
  display: none;
}

.list_style01:not(:last-child) {
  margin-bottom: 5rem;
}
.list_style01 li {
  position: relative;
  padding: 0 0 0 15px;
  font-size: 14px;
}
.list_style01 li:not(:last-child) {
  margin-bottom: 0.8rem;
}
.list_style01 li::before {
  content: "";
  position: absolute;
  top: 0.8rem;
  left: 0rem;
  width: 5px;
  border-radius: 100px;
  aspect-ratio: 1;
  background-color: #233C5A;
}
.list_style01 li .list_style01-heading {
  display: inline-block;
}
.list_style01 li .list_style01-heading._22rem {
  width: 22rem !important;
}
@media screen and (max-width: 767px) {
  .list_style01 li .list_style01-heading._22rem {
    width: auto !important;
  }
}

.intro_example__block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.intro_example__block:not(._no_padding) {
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .intro_example__block:not(._no_padding) {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .intro_example__block {
    display: block;
  }
}
.intro_example__block .before,
.intro_example__block .after {
  padding: 2rem;
  width: 50%;
  background-color: #f8f8f8;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .intro_example__block .before,
  .intro_example__block .after {
    width: 100%;
  }
}
.intro_example__block .before .ttl,
.intro_example__block .after .ttl {
  color: #333;
  border-bottom: 1px solid #333;
}
.intro_example__block .before .ttl,
.intro_example__block .after .ttl {
  font-size: 1.8rem;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
}
.intro_example__block .before .list li,
.intro_example__block .after .list li {
  position: relative;
  padding: 0 0 0 1.5rem;
  font-size: 1.4rem;
}
.intro_example__block .before .list li:not(:last-child),
.intro_example__block .after .list li:not(:last-child) {
  margin-bottom: 1rem;
}
.intro_example__block .before .list li::before,
.intro_example__block .after .list li::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0rem;
  width: 3px;
  aspect-ratio: 1;
  border-radius: 100px;
  background-color: #000;
}
.intro_example__block .arrow {
  width: 50px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 0rem;
  background: url("/promotion/connected/common/img/icon_arrow_cl_main.svg") center center no-repeat;
  background-size: 10px auto;
}
@media screen and (max-width: 767px) {
  .intro_example__block .arrow {
    width: 100%;
    margin: 1rem 0;
  }
}
.intro_example__block .after {
  background-color: #e6ecf2;
}

.padding_inner {
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  .padding_inner {
    padding: 0 20px;
  }
}

.application_chart {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border: 1px solid #233C5A;
  padding: 2.7rem 12%;
  margin: 0 auto 2.5rem;
}
@media screen and (max-width: 767px) {
  .application_chart {
    width: 100%;
    padding: 2.7rem 2rem;
    display: block;
  }
}

.application_chart .photo {
  width: 35%;
}
@media screen and (max-width: 767px) {
  .application_chart .photo {
    width: 85%;
    margin: 0 auto 3rem;
  }
}
.application_chart .photo img {
  width: 100%;
}

.application_chart .photo p {
  font-size: 1.4rem;
  font-weight: 600;
  color: #76499D;
  text-align: center;
  margin-bottom: 1rem;
}

.application_chart .copy {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .application_chart .copy {
    width: 100%;
  }
}
.application_chart .copy img {
  width: 100%;
}

.application_chart .copy h4 {
  font-weight: 600;
  margin-bottom: 1rem;
}

.application_chart .copy ul {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .application_chart .copy ul {
    margin-bottom: 3rem;
  }
}

.application_chart .copy ul li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0.6rem;
}

.application_chart .copy ul li p {
  font-size: 1.4rem;
}

.application_chart .copy ul li .txt1 {
  font-weight: 600;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 4rem;
          flex: 0 0 4rem;
}

.application_chart .copy ul li .txt2 {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}

.application_chart .copy ul li:nth-child(1) .txt1 {
  color: #01304D;
}

.application_chart .copy ul li:nth-child(2) .txt1 {
  color: #76499D;
}

.application_chart .copy ul li:nth-child(3) .txt1 {
  color: #800080;
}

@media screen and (max-width: 767px) {
  .application_chart .copy .photo02 {
    width: 70%;
    margin: 0 auto;
  }
}
.application_chart .copy .photo02 img {
  width: 100%;
}

.strengths__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1.5rem 2%;
}
@media screen and (max-width: 767px) {
  .strengths__list {
    display: block;
  }
}
.strengths__list.-column3 li {
  width: 32%;
}
.strengths__list li {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 49%;
  background-color: #E6ECF2;
  padding: 2rem;
  text-align: center;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .strengths__list li {
    width: 100%;
    margin-bottom: 1rem;
    font-size: 1.4rem;
    padding: 1rem;
  }
}

.service_flow {
  margin-bottom: 13rem;
}
@media screen and (max-width: 767px) {
  .service_flow {
    margin-bottom: 6rem;
  }
}

.service_flow .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .service_flow .flex {
    display: block;
  }
}

.service_flow dl {
  width: 31%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 1.5rem;
  background-color: #f8f8f8;
}
@media screen and (max-width: 767px) {
  .service_flow dl {
    width: 100%;
  }
}

.service_flow dl dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
}

.service_flow dl dt .ttl {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  color: #382d57;
  font-weight: 600;
  line-height: 140%;
}

.service_flow dl dd ul li {
  margin-bottom: 1.5rem;
}
.service_flow dl dd ul li:last-child {
  margin-bottom: 0rem;
}

.service_flow dl dd ul li .ttl {
  background-color: #E6ECF2;
  text-align: center;
  padding: 0.2rem 1rem;
  border-radius: 100px;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 0.8rem;
}
.service_flow dl dd ul li .ttl.purple {
  background-color: #233C5A;
  color: #fff;
}

.service_flow dl dd ul li .txt {
  font-size: 1.4rem;
  line-height: 140%;
  margin-bottom: 0rem;
}

.service_flow .arrow {
  width: 5%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 767px) {
  .service_flow .arrow {
    width: 100%;
  }
}
.service_flow .arrow img {
  width: 28%;
}
@media screen and (max-width: 767px) {
  .service_flow .arrow img {
    display: block;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    width: 5%;
  }
}

.service_flow .help .mark {
  position: relative;
  padding-left: 50px;
  font-size: 1.2rem;
}
.service_flow .help .mark:after {
  content: "";
  position: absolute;
  top: 0.2rem;
  left: 0rem;
  width: 45px;
  height: 15px;
  background-color: #ffc400;
  border-radius: 100px;
}

.service_flow .help .link {
  margin-top: 0.5rem;
  font-size: 1.2rem;
}
.service_flow .help .link a:hover {
  text-decoration: underline !important;
}

.smartphoneapp_case {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8rem;
}
@media screen and (max-width: 767px) {
  .smartphoneapp_case {
    display: block;
  }
}
.smartphoneapp_case .smartphoneapp_case__block {
  width: 100%;
  position: relative;
}
.smartphoneapp_case .smartphoneapp_case__block:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0rem;
  left: calc(100% + 4rem);
  width: 1px;
  height: 100%;
  background-color: #d5d5d5;
}
@media screen and (max-width: 767px) {
  .smartphoneapp_case .smartphoneapp_case__block {
    width: 100%;
    margin-bottom: 2.5rem;
  }
}
.smartphoneapp_case .smartphoneapp_case__block h3 {
  font-size: 1.8rem;
  margin-bottom: 1.5rem;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .txt {
  font-size: 1.2rem;
  margin-bottom: 2rem;
  line-height: 180%;
  word-break: break-all;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline {
  background-color: #f8f8f8;
  padding: 1.5rem;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl:not(:last-child) {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .smartphoneapp_case .smartphoneapp_case__block .copy .outline dl {
    display: block;
  }
  .smartphoneapp_case .smartphoneapp_case__block .copy .outline dl:not(:last-child) {
    margin-bottom: 1rem;
  }
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl dt {
  width: 100px;
  font-weight: 500;
  color: #233C5A;
  font-size: 1.4rem;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl dd {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl dd ul li {
  font-size: 1.4rem;
  position: relative;
  padding: 0 0 0 15px;
  color: #233C5A;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl dd ul li:not(:last-child) {
  margin-bottom: 0.5rem;
}
.smartphoneapp_case .smartphoneapp_case__block .copy .outline dl dd ul li::before {
  content: "";
  position: absolute;
  top: 0.7rem;
  left: 0rem;
  width: 4px;
  aspect-ratio: 1;
  background-color: #233C5A;
  border-radius: 100px;
}

.case_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 3rem 5%;
}
@media screen and (max-width: 767px) {
  .case_list {
    display: block;
  }
}
.case_list li {
  width: 30%;
}
@media screen and (max-width: 767px) {
  .case_list li {
    width: 100%;
  }
  .case_list li:not(:last-child) {
    margin-bottom: 3.5rem;
  }
}
.case_list li a {
  display: block;
}
.case_list li a .photo {
  margin-bottom: 1rem;
  position: relative;
}
.case_list li a .photo img {
  width: 100%;
}
.case_list li a .photo .category {
  position: absolute;
  top: 0rem;
  left: 0rem;
  z-index: 2;
  font-size: 1.4rem;
  line-height: 110%;
  padding: 0.5rem 1rem;
  color: #fff;
  background-color: #141F2E;
}
@media screen and (max-width: 767px) {
  .case_list li a .photo .category {
    font-size: 1.2rem;
  }
}
.case_list li a .copy .ttl {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  position: relative;
  overflow: hidden;
  padding-right: 24px;
  color: #141F2E;
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.case_list li a .copy .ttl:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 5px;
  height: 12px;
  background: url(../../common/img/icon_arrow_cl_main.svg) 0 0/100% no-repeat;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.case_list li a .copy .corpo {
  font-size: 1.4rem;
  color: #141F2E;
}

.solution_list {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 0px;
  width: 1000px;
  margin: 10rem auto;
}
@media screen and (max-width: 767px) {
  .solution_list {
    width: 100%;
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
.solution_list li {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: subgrid;
  grid-template-rows: subgrid;
  -ms-grid-row-span: 3;
  grid-row: span 3;
  gap: 0px;
  margin-left: -1px;
  position: relative;
}
.solution_list li::before {
  content: "";
  position: absolute;
  top: 0rem;
  left: 0rem;
  width: 1px;
  height: 100%;
  background-color: #D5D5D5;
}
@media screen and (max-width: 767px) {
  .solution_list li::before {
    display: none;
  }
}
.solution_list li::after {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  width: 1px;
  height: 100%;
  background-color: #D5D5D5;
}
@media screen and (max-width: 767px) {
  .solution_list li::after {
    top: 20px;
    height: calc(100% - 40px);
  }
}
@media screen and (max-width: 767px) {
  .solution_list li:nth-child(2n)::after {
    display: none;
  }
}
.solution_list li a {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: subgrid;
  grid-template-rows: subgrid;
  -ms-grid-row-span: 3;
  grid-row: span 3;
  gap: 0px;
  position: relative;
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.solution_list li a:hover {
  background-color: #f8f8f8;
}
@media screen and (max-width: 767px) {
  .solution_list li a {
    padding: 2rem 0;
  }
}
.solution_list li a .pict {
  width: 80px;
  margin: 0 auto 1rem;
}
.solution_list li a .pict img {
  width: 100%;
}
.solution_list li a .ttl {
  text-align: center;
  font-size: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
}
.solution_list li a .arrow {
  position: relative !important;
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  display: block;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: absolute;
  bottom: 0rem;
  left: calc((100% - 10px) / 2);
  font-size: 0rem;
  display: block;
}
@media screen and (max-width: 767px) {
  .solution_list li a::before {
    content: "";
    position: absolute;
    top: 0rem;
    left: 20px;
    width: calc(100% - 40px);
    height: 1px;
    background-color: #D5D5D5;
  }
}

.column_layout {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3rem;
}
.column_layout .column_layout__block {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .column_layout {
    gap: 5rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

@media screen and (max-width: 767px) {
  .bigdata_chart {
    overflow-x: auto;
    padding-bottom: 1rem !important;
  }
}
.bigdata_chart:not(._no_padding) {
  margin: 0 40px;
}
@media screen and (max-width: 767px) {
  .bigdata_chart:not(._no_padding) {
    margin: 0 20px;
  }
}
.bigdata_chart::-webkit-scrollbar {
  height: 5px;
}
.bigdata_chart::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.7);
}
@media screen and (max-width: 767px) {
  .bigdata_chart .bigdata_chart__inner {
    width: 250%;
  }
}
.bigdata_chart .bigdata_chart__flow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1rem;
  padding-left: px;
}
.bigdata_chart .bigdata_chart__flow li {
  width: 100%;
  text-align: center;
  background-color: #f5f5f5;
  padding: 1.2rem 0;
  position: relative;
  font-size: 1.4rem;
  font-weight: 500;
}
.bigdata_chart .bigdata_chart__flow li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0rem;
  right: -0.5rem;
  width: 22px;
  height: 100%;
  background-color: #fff;
  clip-path: polygon(50% 0, 70% 0, 100% 50%, 70% 100%, 50% 100%, 79% 50%);
  z-index: 2;
}
.bigdata_chart .bigdata_chart__flow li:last-child:after {
  content: "";
  position: absolute;
  top: 0rem;
  right: -1px;
  width: 10px;
  height: 100%;
  background-color: #fff;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 100% 50%);
  z-index: 2;
}
.bigdata_chart:not(:last-child) {
  margin-bottom: 5rem;
}
.bigdata_chart table {
  width: calc(100% + 8px);
  border-collapse: separate;
  border-spacing: 4px;
  position: relative;
  left: -8px;
}
.bigdata_chart table td:not(.hold) {
  background-color: #F8F8F8;
  padding: 0.5rem 1rem;
  font-size: 1.4rem;
  line-height: 160%;
}
.bigdata_chart table td:not(.hold)._bg_blue {
  background-color: #e7ecf2;
}
.bigdata_chart table .hold {
  font-size: 0rem;
}

.row_chart .row_chart-ttl {
  margin-bottom: 1.5rem;
  background-color: #e7ecf2;
  font-size: 1.4rem;
  font-weight: 500;
  padding: 1rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .row_chart .row_chart-ttl {
    font-size: 1.2rem;
  }
}
.row_chart .row_chart__block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .row_chart .row_chart__block {
    gap: 1rem;
  }
}
.row_chart .row_chart__block .block {
  width: 100%;
}
.row_chart .row_chart__block .block .heading {
  background-color: #F8F8F8;
  margin-bottom: 0.5rem;
  font-size: 1.4rem;
  padding: 0.5rem;
  text-align: center;
  position: relative;
}
@media screen and (max-width: 767px) {
  .row_chart .row_chart__block .block .heading {
    font-size: 1.2rem;
  }
}
.row_chart .row_chart__block .block .heading:not(._none_arrow) {
  margin-top: 2rem;
}
.row_chart .row_chart__block .block .heading:not(._none_arrow)::before {
  content: "";
  position: absolute;
  top: -18px;
  left: calc((100% - 30px) / 2);
  display: inline-block;
  color: #333;
  width: 1em;
  height: 1em;
  border: 0.2em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.row_chart .row_chart__block .block .txt {
  line-height: 180%;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .row_chart .row_chart__block .block .txt {
    font-size: 1.2rem;
  }
}