/* main{
  margin-top: 120px;
}
@media(max-width: 1024px){
  main{
    margin-top: 100px;
  }
}
@media(max-width: 768px){
  main{
    margin-top: 70px;
  }
} */
/* BREAD */
.c-bread {
  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;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  background-color: #f5f5fa;
  margin-bottom: 90px;
  height: 240px;
  padding-top: 140px;
  border-bottom-left-radius: 60px;
  border-bottom-right-radius: 60px;
}
.c-bread li a {
  display: block;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
}
@media all and (max-width: 768px) {
  .c-bread {
    padding: 110px 20px 30px;
    margin-bottom: 40px;
    height: auto;
    border-radius: 0;
  }
  .c-bread li a {
    font-size: 11px;
  }
}
/* END BREAD */
/* ======================================================== */
/* PAGE HEADING */
.c-page-heading {
  width: 100%;
  min-height: 400px;
  padding: 70px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.c-page-heading h1 {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  color: #fff;
}
.c-page-heading h1 strong {
  display: block;
  font-size: 42px;
  letter-spacing: 0;
}
@media screen and (max-width: 767px) {
  .c-page-heading {
    padding: 20px;
    min-height: 250px;
  }
  .c-page-heading h1 {
    font-size: 14px;
  }
  .c-page-heading h1 strong {
    font-size: 30px;
  }
}
/* END PAGE HEADING */
/* PAGINATION */
.c-pagination {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 70px;
}
.c-pagination .item {
  width: 32px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50px;
  font-weight: 500;
  font-size: 13px;
  -webkit-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
  margin: 0 5px;
}
.c-pagination .item.prev {
  margin-right: 40px;
  margin-left: 0 !important;
}
.c-pagination .item.next {
  margin-left: 40px;
  margin-right: 0 !important;
}
.c-pagination .item-arrow img {
  display: block;
  width: 17px;
  height: 17px;
}
.c-pagination .item a {
  display: block;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}
.c-pagination .item:not(.item-arrow) a:hover {
  opacity: 1;
}
.c-pagination .item:not(.item-arrow):hover,
.c-pagination .item.current {
  background: #5ed6ca;
  color: white;
}
.c-pagination .item.current,
.c-pagination .item.item-dot {
  pointer-events: none;
}
@media all and (max-width: 767px) {
  .c-pagination {
    margin-top: 30px;
  }
  .c-pagination .item {
    width: 30px;
    height: 30px;
    font-size: 10px;
  }
  .c-pagination .item.prev {
    margin-right: 10px;
  }
  .c-pagination .item.next {
    margin-left: 10px;
  }
}
/* End PAGINATION */

/**Header*/
.c-header__inner {
  background-color: #fff;
  max-width: 1805px;
  margin: auto;
  border-bottom-left-radius: 60px;
  border-bottom-right-radius: 60px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
.c-nav__menu {
  background-color: transparent;
  box-shadow: unset;
  border-bottom-right-radius: 60px;
}
.c-nav__phone {
  border-bottom-right-radius: 60px;
}

.active .c-header__inner {
  border-radius: 0;
  max-width: 100%;
  box-shadow: unset;
}
.active .c-nav__menu,
.active .c-nav__phone {
  border-radius: 0;
}
/**End Header*/
.bg-violet::before {
  background-color: rgba(93, 95, 172, 0.06);
  width: 2160px;
  height: 2160px;
  position: absolute;
  border-radius: 50%;
  z-index: -1;
}
.bg-violet.--top::before {
  top: -138%;
  right: -54%;
}
.bg-violet.--bottom::before {
  bottom: -45%;
  right: -58.5%;
}
.bg-violet.--style1::before {
  top: 5%;
  right: -56%;
}
@media (max-width: 768px) {
  .c-header__inner {
    border-radius: 0;
  }
}
/**===========================================*/
/**Merit*/
.c-merit {
  gap: 20px 6%;
  align-items: center;
}
.c-merit__img {
  width: 340px;
  height: 340px;
}
.c-merit__img img {
  display: block;
  width: 100%;
  border-radius: 50%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.c-merit__content {
  flex: 1;
}
.c-merit__head {
  display: flex;
  gap: 10px 20px;
  align-items: center;
  font-family: YuMincho;
}
.c-merit__label {
  flex: 0 0 80px;
  height: 80px;
  border-radius: 50%;
  background-color: #5d5fac;
  color: #fff;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 13px;
}
.c-merit__label strong {
  width: 100%;
  text-align: center;
  font-size: 26px;
  line-height: 1;
  transform: translateY(3px);
}
.c-merit__title {
  font-size: 23px;
  color: #5d5fac;
}
@media (max-width: 1024px) {
  .c-merit {
    gap: 20px 4%;
  }
  .c-merit__img {
    width: 300px;
    height: 300px;
  }
}
@media (max-width: 768px) {
  .c-merit {
    flex-wrap: wrap;
  }
  .c-merit__img {
    order: 1;
    width: 200px;
    margin: auto;
    height: 200px;
  }
  .c-merit__content {
    flex: auto;
    width: 100%;
    order: 2;
    text-align: center;
  }
  .c-merit__head {
    flex-wrap: wrap;
  }
  .c-merit__label {
    margin: -55px auto 0;
    height: 60px;
    flex: 0 0 60px;
    font-size: 10px;
  }
  .c-merit__label strong {
    font-size: 20px;
  }
  .c-merit__title {
    width: 100%;
    font-size: 17px;
    line-height: 1.6;
  }
}
/**End Merit*/
/**Howto*/
.c-howto {
  gap: 30px 4%;
  max-width: 1160px;
}
.c-howto__item {
  width: 48%;
}
.c-howto__head {
  background-color: #5d5fac;
  color: #fff;
  text-align: center;
  font-size: 20px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  padding: 22px 10px;
}
.c-howto__details {
  display: flex;
  gap: 10px 6%;
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
}
.c-howto__img {
  width: 240px;
  height: 180px;
}
.c-howto__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-bottom-left-radius: 20px;
}
.c-howto__content {
  padding-right: 34px;
  flex: 1;
  border-bottom-right-radius: 20px;
  padding-top: 20px;
}
.c-howto__content h4 {
  font-size: 18px;
}
.c-howto__content p {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 5px;
}
@media (max-width: 1200px) {
  .c-howto {
    gap: 40px;
  }
  .c-howto__item {
    width: 100%;
  }
  .c-howto__details {
    flex-wrap: wrap;
    gap: 0;
  }
  .c-howto__head {
    padding: 10px;
    font-size: 16px;
  }
  .c-howto__img,
  .c-howto__img img {
    width: 100%;
    border-radius: 0;
  }
  .c-howto__content {
    text-align: center;
    padding: 20px;
  }
}
@media (max-width: 768px) {
  .c-howto {
    flex-wrap: wrap;
    justify-content: center;
  }
}
/**End Howto*/
.c-cards__bg.--bg3 {
  height: 1088px;
}
@media (max-width: 1200px) {
  .c-cards__inner.--access::before {
    height: calc(100% - 140px);
  }
}
@media (max-width: 1024px) {
  .c-cards__bg.--bg3 {
    height: 1260px;
  }
}
@media (max-width: 768px) {
  .c-cards__bg.--bg3 {
    height: 1800px;
  }
}
@media (max-width: 600px) {
  .c-cards__bg.--bg3 {
    height: 1680px;
  }
}
@media (max-width: 500px) {
  .c-cards__bg.--bg3 {
    height: 1600px;
  }
}
@media (max-width: 400px) {
  .c-cards__bg.--bg3 {
    height: 1540px;
  }
}
/**==================================*/
/**Inside*/
.p-inside .bg-violet::before {
  top: 41%;
  right: -105%;
}
.c-inside__head {
  border-radius: 60px;
  background-color: #f5f5fa;
  font-family: YuMincho;
  width: 100%;
  padding: 27px 10px;
  text-align: center;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
.c-inside__items {
  display: flex;
  justify-content: center;
  gap: 40px 3.3%;
  max-width: 1200px;
}
.c-inside__item {
  width: 25%;
}
.c-inside__item .--img {
  aspect-ratio: 360 / 240;
}
.c-inside__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 30px;
  display: block;
}
.c-inside__item .--content {
  padding: 0 15px;
}

.c-inside__slider {
  width: 880px;
  max-width: 100%;
}
.c-inside__slider img {
  display: block;
  width: 100%;
  border-radius: 30px;
}
.c-inside__slider--wrapper {
  max-width: 1160px;
  position: relative;
}
.c-inside__slider .swiper-pagination {
  display: none;
}
@media (max-width: 768px) {
  .c-inside__head {
    padding: 16px 10px;
  }
  .c-inside__items {
    flex-wrap: wrap;
  }
  .c-inside__item {
    width: 48%;
  }
  .c-inside__item .--content {
    padding: 0;
  }

  .c-inside__slider .swiper-pagination {
    display: flex;
    justify-content: center;
  }
  .c-inside__slider--wrapper .swiper-button-prev,
  .c-inside__slider--wrapper .swiper-button-next {
    display: none;
  }
}
/**End Inside*/
/**=======================================================================================*/
/**Profile*/
.c-profile__head {
  background-color: #f5f5fa;
  border-radius: 30px;
  text-align: center;
  padding: 26px 10px;
}
/** DL style*/
.c-profile dl {
  display: flex;
  gap: 20px 20px;
}
.c-profile dt {
  border-bottom: 1px solid #5d5fac;
  font-size: 15px;
  font-weight: bold;
  width: 240px;
  padding: 20px 20px 24px;
}
.c-profile dd {
  font-size: 15px;
  font-weight: 500;
  border-bottom: 1px solid #111;
  padding: 20px 20px 24px;
  flex: 1;
}
.c-profile__info {
  gap: 20px 4.2%;
  max-width: 990px;
}
.c-profile__info .--img {
  width: 240px;
}
.c-profile__info .--content {
  flex: 1;
}
.c-map {
  height: 480px;
  border-radius: 30px;
  width: 100%;
}
.c-profile ul {
  display: flex;
  gap: 5px 20px;
  flex-wrap: wrap;
}

/** End DL style*/

/** Table style*/
.c-profile--table.c-profile dt,
.c-profile--table.c-profile dd {
  font-size: 16px;
  font-weight: bold;
  padding: 0 20px;
}
.c-profile--table.c-profile dt {
  border-right: 0;
  border-bottom: 0;
  text-align: center;
}
.c-profile--table.c-profile dd {
  border-left: 0;
  border-bottom: 0;
  padding: 0;
}
.c-profile--table.c-profile dl {
  gap: 0;
  background-color: rgba(93, 95, 172, 0.1);
  border-radius: 100px;
  padding: 21px 0;
}
.c-profile--table.c-profile dl ~ dl {
  margin-top: 20px;
}
.p-profile .bg-violet::before {
  top: 0;
  right: -144%;
}
/** End Table style*/

@media screen and (max-width: 1024px) {
  .c-profile dt {
    width: 180px;
  }
  .c-profile {
    padding: 0;
  }
  .c-map {
    height: 340px;
  }
}
@media screen and (max-width: 767px) {
  .c-profile dt {
    width: 125px;
    font-size: 13px;
    padding: 10px 5px 15px !important;
  }
  .c-profile dd {
    font-size: 12px;
    padding: 10px 5px 15px !important;
  }
  .c-profile dl {
    gap: 0 !important;
  }
  .c-map {
    height: 200px;
  }
  .c-profile--table.c-profile dl {
    padding: 10px 0;
    padding-right: 5px;
    border-radius: 5px;
  }
  .c-profile--table.c-profile dt,
  .c-profile--table.c-profile dd {
    font-size: 12px;
    padding: 0 !important;
  }
  .c-profile--table.c-profile dt {
    width: 110px;
    padding: 0 !important;
  }

  .c-profile__info {
    flex-wrap: wrap;
  }
  .c-profile__info .--img {
    margin: auto;
    max-width: 160px;
  }
  .c-profile__info .--content {
    flex: auto;
    width: 100%;
  }
  .c-profile__head {
    border-radius: 10px;
  }
}
/**End Profile*/

/* ======================================
  Feature Block
====================================== */

.p-guide-feature {
  display: flex;
  align-items: center;
  gap: 60px;
}

/* đảo layout */
.p-guide-feature--reverse {
  flex-direction: row-reverse;
}

/* image */
.p-guide-feature__media {
  width: 680px;
  border-radius: 20px;
  overflow: hidden;
}

.p-guide-feature__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* content */
.p-guide-feature__body {
  width: 690px;
  background: #fff;
  border-radius: 20px;
  padding: 0 56px 48px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  margin-left: -17%;
  min-height: 340px;
}
.p-guide-feature__title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
}
.p-guide-feature__text {
  width: 100%;
}

.p-guide-feature--reverse .p-guide-feature__body {
  margin-left: auto;
  margin-right: -17%;
  position: relative;
}
/* ======================================
  Badge ribbon
====================================== */

.p-guide-feature__badge {
  position: relative;
  display: inline-block;
  color: #fff;
  padding: 38px 16px 25px;
  text-align: center;
}

/* đuôi nhọn */
.p-guide-feature__badge::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  /* màu đậm hơn */
  z-index: 1;
  background-image: url("../images/pages/label.png");
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
}

/* số */
.p-guide-feature__badge-no {
  display: block;
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
  position: relative;
  z-index: 1;
}

/* text */
.p-guide-feature__badge-label {
  display: block;
  font-size: 16px;
  letter-spacing: 0.08em;
  position: relative;
  z-index: 1;
}

/* ======================================
  Responsive
====================================== */

@media screen and (max-width: 768px) {
  .p-guide-feature {
    flex-direction: column;
    gap: 20px;
  }

  .p-guide-feature--reverse {
    /* flex-direction: column; */
  }

  .p-guide-feature__media,
  .p-guide-feature__body {
    width: 100%;
  }

  .p-guide-feature__body {
    padding: 0 20px 25px;
    margin: -50px auto 0 !important;
    max-width: 90%;
    min-height: auto;
  }
  .p-guide-feature__title {
    gap: 6px;
    flex-wrap: nowrap;
    line-height: 1.6;
  }
  .p-guide-feature__badge {
    padding: 15px 15px 12px;
    min-width: max-content;
  }
  .p-guide-feature__badge-no {
    font-size: 17px;
  }
  .p-guide-feature__badge-label {
    font-size: 11px;
  }
}
/**End Guide*/
/* ======================================
  Project : plan
====================================== */

/* =========================
  Tabs
========================= */
.p-plan__inner {
  max-width: 1306px;
}
.p-plan-tabs {
  margin-bottom: 60px;
}

.p-plan-tabs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.p-plan-tabs__item {
  list-style: none;
}

.p-plan-tabs__link {
  display: flex;
  min-width: 280px;
  padding: 20px 25px;
  background: #fff;
  color: #333;
  justify-content: space-between;
  font-size: 14px;
  position: relative;
  border-radius: 20px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
}

.p-plan-tabs__link::after {
  content: "";
  position: absolute;
  right: 20px;
  width: 7px;
  height: 12px;
  background-size: contain;
  background-image: url("../images/common/ic-arrR2-b.png");
  background-repeat: no-repeat;
  top: 50%;
  transform: translateY(-50%);
}

.p-plan-tabs__item.is-active .p-plan-tabs__link,
.p-plan-tabs__item:hover .p-plan-tabs__link {
  background: #5d5fac;
  color: #fff;
  opacity: 1;
}
.p-plan-tabs__item.is-active .p-plan-tabs__link:after,
.p-plan-tabs__item:hover .p-plan-tabs__link:after {
  background-image: url("../images/common/ic-arrR2-w.png");
}

/* =========================
  Lead
========================= */

.p-plan .bg-violet::before {
  bottom: -22%;
  right: -117%;
}

/* =========================
  Plan Card
========================= */

.p-plan-card {
  display: flex;
  gap: 30px 5.2%;
  align-items: center;
}

.p-plan-card__media {
  width: 55.3%;
  border-radius: 20px;
  overflow: hidden;
}

.p-plan-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.p-plan-card__body {
  flex: 1;
}

.p-plan-card__title {
  background: #5d5fac;
  padding: 18px 10px;
  border-radius: 30px;
  text-align: center;
  margin-bottom: 21px;
  font-size: 30px;
  font-family: "YuMincho";
  color: #fff;
}



.p-plan-card__note {
  text-align: center;
  color: #5d5fac;
  margin-bottom: 20px;
  font-size: 16px;
  padding-bottom: 12px;
  border-bottom: 1px dashed #cccccc;
}

/* price */
.p-plan-card__price {
  margin-bottom: 30px;
  display: flex;
  font-family: "YuMincho";
  justify-content: center;
  align-items: flex-end;
  gap: 15px;
}
.p-plan-card__price-detail {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 3px;
}
.p-plan-card__price-label {
  display: inline-block;
  border: 1px solid currentColor;
  color: #dc2c2c;
  padding: 0px 12px;
  border-radius: 50px;
  font-size: 15px;
}

.p-plan-card__price-value {
  font-size: 60px;
  font-weight: 700;
  line-height: 1;
  color: #dc2c2c;
  margin-bottom: -8px;
}

.p-plan-card__price-unit,
.p-plan-card__price-tax {
  color: #dc2c2c;
  display: block;
}
.p-plan-card__unit {
  line-height: 1.4;
}
.p-plan-card__price-tax {
  padding-left: 8px;
}
/* button */
.p-plan-card__btn {
  display: block;
  background: #f5f5fa;
  color: #5d5fac;
  text-align: center;
  padding: 4px 10px;
  border-radius: 50px;
  margin-bottom: 24px;
  font-weight: 600;
  font-size: 18px;
}

/* list */
.p-plan-card__list {
  font-size: 15px;
  display: flex;
  flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 400px;
  margin: auto;
}
.p-plan-card__list li::marker {
}
.p-plan-card__list li {
  list-style: disc;
  width: max-content;
  margin-right: 35px;
}

.p-plan-card___mv {
  width: 90%;
  max-width: 600px;
  margin: auto;
}


/* =========================
  Responsive
========================= */
@media (max-width: 1024px) {
  .p-plan-card {
    flex-direction: column;
  }
  .p-plan-card__media,
  .p-plan-card__body {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .p-plan-card__title {
    padding: 10px;
    font-size: 18px;
  }
  .p-plan-card__note {
    font-size: 13px;
  }
  .p-plan-card__price {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 20px;
  }
  .p-plan-card__price-value {
    font-size: 48px;
  }
  .p-plan-card__list,
  .p-plan-card__price-label,
  .p-plan-card__price-unit,
  .p-plan-card__price-tax {
    font-size: 13px;
  }
  .p-plan-card__btn {
    font-size: 15px;
    margin-bottom: 15px;
  }
  .p-plan-tabs__link {
    padding: 15px;
    font-size: 13px;
    border-radius: 10px;
  }
}
/**End Plan*/
/**Flower*/
.p-flower .bg-violet::before {
  top: -20%;
  right: -145%;
}
/**End Flower*/
/**Offerings*/
.p-offerings .bg-violet::before {
  top: -15%;
  right: -150%;
}
.p-offerings--inner {
  max-width: 1200px;
}
.p-offerings__items {
  display: flex;
  gap: 50px 3%;
  flex-wrap: wrap;
}
.p-offerings__item {
  width: 30%;
}
.p-offerings__img {
  aspect-ratio: 360 / 240;
}
.p-offerings__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.p-offerings__btn {
  border-radius: 60px;
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  width: 445px;
  height: 62px;
  display: block;
  margin: auto;
  max-width: 100%;
}
.p-offerings__btn img {
  width: 100%;
  display: block;
  border-radius: 60px;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 768px) {
  .p-offerings__items {
    gap: 30px 4%;
  }
  .p-offerings__item {
    width: 48%;
  }
  .p-offerings__btn {
    padding: 10px;
    height: 50px;
  }
}
/**End Offerings*/
/**Flow*/
.c-flow {
  position: relative;
}
.c-flow__wrapper {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.c-flow__wrapper2 {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 120px;
}
.c-flow__txt1 {
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 36px;
  margin-top: 34px;
  margin-bottom: 82px;
}
.c-flow__txt2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
}
.c-flow__txt2::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: #707070;
  display: block;
}
.c-flow__txt2 p {
  display: inline-block;
  flex-shrink: 0;
  font-weight: 600;
  font-size: 23px;
  letter-spacing: 0;
  line-height: 28px;
}
.c-flow__table {
  display: flex;
  gap: 40px 20px;
}
.c-flow__table-col {
  display: flex;
  flex-direction: column;
}
.c-flow__table-col.--col1 {
  width: 38.8%;
}
.c-flow__table-col.--col2 {
  width: 82px;
  flex-shrink: 0;
}
.c-flow__table-col.--col3 {
  flex: 1;
}
.c-flow__table-title {
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 28px;
  position: relative;
  text-align: center;
  padding-bottom: 15px;
  margin-bottom: 10px;
}
.c-flow__table-title::after {
  content: "";
  width: 100%;
  height: 12px;
  border-radius: 5px;
  background-color: currentColor;
  position: absolute;
  bottom: 0;
  left: 0;
}
.c-flow__table-row {
  flex: 1;
  display: flex;
  gap: 20px;
}
.c-flow__table-cell {
  flex: 1;
  display: flex;
  align-items: center;
  writing-mode: vertical-lr;
  padding: 42px 10px 30px;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 8px;
  border-radius: 10px;
}
.c-flow__table-col.--blue .c-flow__table-title {
  color: #5d7aac;
}
.c-flow__table-col.--blue .c-flow__table-cell {
  color: #fff;
  background-color: #5d7aac;
}
.c-flow__table-col.--green .c-flow__table-title {
  color: #6ebb90;
}
.c-flow__table-col.--green .c-flow__table-cell {
  color: #fff;
  background-color: #6ebb90;
}
.c-flow__table-col.--red .c-flow__table-title {
  color: #d57e7e;
}
.c-flow__table-col.--red .c-flow__table-cell {
  color: #fff;
  background-color: #d57e7e;
}
.c-flow__item {
  gap: 30px;
  position: relative;
  padding-left: 76px;
}
.c-flow__item:after,
.c-flow__item:before {
  content: "";
  position: absolute;
}
.c-flow__number {
  background-color: #5d5fac;
  color: #fff;
  border-radius: 50%;
  width: 81px;
  height: 81px;
  display: inline-flex;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
  position: absolute;
  left: -31px;
  top: -31px;
  font-family: YuMincho;
  gap: 4px;
}
.c-flow__number strong {
  font-size: 26px;
  width: 100%;
  line-height: 1;
}
.c-flow__number span {
  font-size: 13px;
  line-height: 1;
}
/* .c-flow__item:before{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #5D5FAC;
    top: 9px;
    left: 0;
} */
.c-flow__item:after {
  width: 1px;
  height: calc(100% + 50px);
  left: 9px;
  background-color: #5d5fac;
  top: 15px;
  z-index: -1;
}
.c-flow__item ~ .c-flow__item {
  margin-top: 82px;
}

.c-flow__content {
  flex: 1;
}
.c-flow__content .--title {
  margin-bottom: 15px;
  line-height: 1.6;
}
.c-flow__content .--title.--custom-border {
  padding-bottom: 20px;
  border-bottom: 1px solid currentColor;
}
.c-flow__item:last-child::after {
  display: none;
}
.c-flow .--text {
  max-width: 800px;
  line-height: 28px;
}

.c-flow__block + .c-flow__block {
  margin-top: 35px;
}
.c-flow__block2 + .c-flow__block2 {
  margin-top: 12px;
}
.c-flow__block-title {
  color: #5d5fac;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0;
  padding: 0 16px 20px;
  border-bottom: 1px solid currentColor;
}
.c-flow__wrapper3 {
  padding: 10px 16px 0;
}
.c-flow__section {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 40px 60px;
}
.c-flow__section-txt {
  flex: 1;
}
.c-flow__section-img {
  flex-shrink: 0;
  display: block;
}
.c-flow__btn {
  display: inline-flex;
  align-items: center;
  background-color: #5d5fac;
  border-radius: 5px;
  color: #fff;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0;
  padding: 4px 18px;
}
.c-flow__btn .phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
}
.c-flow__btn .phone img {
  display: block;
  width: 17px;
  flex-shrink: 0;
  position: relative;
  top: -1px;
}
.c-flow__pl1 {
  padding-left: 20px;
}

.c-flow__card1-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px 40px;
}
.c-flow__card1 {
  width: calc((100% - 80px) / 3);
}
.c-flow__card1-img {
  display: block;
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
.c-flow__card1-wrapper {
  padding: 20px 20px 0;
}
.c-flow__card1-title {
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 28px;
  margin-bottom: 8px;
}
.c-flow__card1-text {
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 28px;
}
@media (max-width: 1024px) {
  .c-flow__table-col.--col2 {
    width: 60px;
  }
  .c-flow__table-cell {
    padding: 25px 10px 20px;
    font-size: 16px;
  }
  .c-flow__card1-wrapper {
    padding: 20px 0 0;
  }
}
@media (max-width: 768px) {
  .c-flow__item {
    gap: 7px;
    flex-wrap: wrap;
    padding-left: 40px;
  }
  .c-flow__item strong {
    width: 100%;
  }

  .c-flow__item:after {
    left: 7px;
    height: calc(100% + 25px);
    top: 12px;
  }
  .c-flow__item ~ .c-flow__item {
    margin-top: 30px;
  }
  .c-flow__number {
    height: 50px;
    width: 50px;
    gap: 2px;
    top: -12px;
    left: -18px;
  }
  .c-flow__number strong {
    font-size: 18px;
  }
  .c-flow__number span {
    font-size: 10px;
  }

  .c-flow__txt1 {
    font-size: 13px;
    line-height: 1.6;
    margin-top: 25px;
    margin-bottom: 30px;
  }

  .c-flow__txt2 p {
    font-size: 14px;
    line-height: 1.6;
  }

  .c-flow__wrapper2 {
    margin-top: 40px;
  }

  .c-flow__table {
    gap: 20px 10px;
    flex-wrap: wrap;
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
  }
  .c-flow__table-row {
    gap: 10px;
  }
  .c-flow__table-col.--col1 {
    width: 79.6%;
  }
  .c-flow__table-col.--col2 {
    flex: 1;
  }
  .c-flow__table-col.--col3 {
    width: 100%;
    flex: 0 1 auto;
  }
  .c-flow__table-title {
    font-size: 16px;
  }
  .c-flow__table-cell {
    padding: 18px 10px 12px;
    font-size: 13px;
  }
  .c-flow .--text {
    line-height: 1.6;
  }
  .c-flow__block-title {
    font-size: 16px;
    line-height: 1.6;
    padding: 0 0px 4px;
  }
  .c-flow__content .--title.--custom-border {
    padding-bottom: 4px;
  }
  .c-flow__wrapper3 {
    padding: 10px 0 0;
  }
  .c-flow__btn {
    font-size: 13px;
    padding: 2px 10px;
  }
  .c-flow__pl1 {
    padding-left: 0;
  }
  .c-flow__section {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  .c-flow__section-txt {
    flex: 0 1 auto;
    width: 100%;
  }

  .c-flow__block + .c-flow__block {
    margin-top: 30px;
  }

  .c-flow__btn .phone {
    gap: 6px;
    font-size: 14px;
    line-height: 1;
  }
  .c-flow__btn .phone img {
    width: 14px;
  }
}
@media (max-width: 767px) {
  .c-flow__card1-list {
    gap: 30px;
  }
  .c-flow__card1 {
    width: 100%;
  }

  .c-flow__card1-title {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 8px;
  }
  .c-flow__card1-text {
    font-size: 13px;
    line-height: 1.6;
  }
}

/**End Flow*/
/***/
.c-plan__content {
  padding: 0 40px;
}
.c-plan__heading {
  color: #5d5fac;
  padding: 17px 40px;
  border: 1px solid #5d5fac;
  border-radius: 30px;
}
.c-plan__txt {
  padding: 0 40px;
}
.c-plan__txt.--recommended {
  position: relative;
}
.c-plan__txt.--recommended::before {
  width: 24px;
  height: 24px;
  background-image: url("../images/common/ic-check-v.png");
  margin-bottom: -1px;
  margin-right: 8px;
}
.c-plan__txt.--info {
  gap: 0 4%;
  flex-wrap: wrap;
}
.c-plan__info {
  width: 48%;
}
.c-plan__info dl {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px dashed #707070;
  font-size: 16px;
  padding: 20px;
}
.c-plan__step {
  padding-left: 65px;
  padding-right: 10px;
  padding-bottom: 30px;
  border-bottom: 1px dashed #707070;
  position: relative;
}
.c-plan__step.--last {
  border: 0;
  padding-bottom: 0;
}
.c-plan__step span {
  position: absolute;
  width: 48px;
  height: 48px;
  color: #fff;
  font-size: 26px;
  font-family: YuMincho;
  background-color: #5d5fac;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  left: 0;
  top: -7px;
}

.c-plan__flow {
  justify-content: center;
  gap: 40px;
}
.c-plan__flow .c-flow-item {
  background: #5d5fac;
  padding-left: 10px;
  padding-right: 10px;
  color: #fff;
  list-style: none;
  position: relative;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
.c-plan__flow .c-flow-item.c-flow-item_none {
  background: #eee;
  color: #ccc;
}
.c-plan__flow .c-flow-item::before {
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -25px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 10px solid #5d5fac;
}

.c-plan__flow .c-flow-item:last-child::before {
  display: none;
}

.c-plan__item ul{
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

.c-plan__item ul li{
  width: 25%;
  text-align: center;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 0 6px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.c-plan__item ul li figure{
    width: 80%;
    height: 57%;
}

.c-plan__item ul li figure img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-recommended {
  border-radius: 30px;
  border: 2px dashed #5d5fac;
  padding: 30px 60px;
  display: flex;
  flex-wrap: wrap;
  gap: 15px 2%;
  justify-content: space-between;
}
.c-recommended li {
  width: 49%;
  font-size: 16px;
  padding-left: 40px;
}
.c-recommended li::before {
  width: 28px;
  height: 28px;
  background-image: url("../images/common/ic-check2-v.png");
  margin-right: 15px;
  position: absolute;
  left: 0;
  top: -1px;
}
@media (max-width: 768px) {
  .c-plan__heading {
    padding: 8px 20px;
    border-radius: 15px;
    font-size: 20px;
  }
  .c-plan__info {
    width: 100%;
  }
  .c-plan__info dl {
    padding: 10px;
    font-size: 13px;
  }
  .c-plan__txt {
    padding: 0 20px;
  }
  .c-plan__item ul li figure{
      height: 40%;
  }
  .c-plan__item ul li p{
      font-size: 11px;
  }

  .c-recommended {
    padding: 20px 30px;
    border-radius: 20px;
  }
  .c-recommended li {
    width: 100%;
    font-size: 13px;
    padding-left: 25px;
  }
  .c-recommended li::before {
    width: 18px;
    height: 18px;
    margin-right: 10px;
    top: 1px;
  }
  .c-plan__txt.--recommended::before {
    width: 18px;
    height: 18px;
    margin-bottom: -3px;
    margin-right: 5px;
  }
  .c-plan__step span {
    width: 30px;
    height: 30px;
    font-size: 16px;
    top: -2px;
  }
  .c-plan__step {
    padding-left: 40px;
    padding-bottom: 20px;
  }
}
