.mv {
  position: relative;
  overflow: hidden;
  padding-top: 2.5rem;
  padding-bottom: 0;
}

.mv_inner {
  isolation: isolate;
}

.mv::before {
  content: "";
  position: absolute;
  top: 0;
  right: max(0px, 50% - 68.3rem);
  z-index: -2;
  width: 136.6rem;
  height: 71.6rem;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.theme-hiroi .mv::before {
  background-image: url("../images/rakuoh-hiroi/mv_bg.webp");
}

.theme-mitsumori .mv::before {
  background-image: url("../images/rakuoh-mitsumori/mv_bg.webp");
}

.mv_visual {
  position: absolute;
  top: 0;
  right: max(0px, 50% - 68.3rem);
  z-index: -1;
  width: min(72.6rem, 100% - 64rem);
}

.mv_edge {
  position: absolute;
  top: 0;
  left: calc(50% + 68.3rem);
  right: 0;
  z-index: 1;
  height: 71.6rem;
  background-repeat: repeat-x;
  background-position: left top;
  background-size: auto 100%;
}

.theme-hiroi .mv_edge {
  background-image: url("../images/rakuoh-hiroi/mv_edge.webp");
}

.theme-mitsumori .mv_edge {
  background-image: url("../images/rakuoh-mitsumori/mv_edge.webp");
}

.mv_sub {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.5;
}

.mv_ttl {
  margin-top: 0.4rem;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1.3;
}

.mv_ttl em {
  font-style: normal;
  color: var(--brand);
  border-bottom: 3px solid var(--brand);
}

.mv_logo {
  width: 47.2rem;
  margin-top: 2.9rem;
}

.mv_lead {
  margin-top: 2.1rem;
}

.mv_btns {
  display: flex;
  align-items: flex-end;
  gap: 2.1rem;
  margin-top: 2.1rem;
}

.mv_btns .c-btn {
  min-width: 31rem;
}

.mv_btns .c-btn-outline {
  min-width: 17rem;
  font-size: 1.4rem;
}

.mv_cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  width: 86rem;
  margin: 8.1rem auto 0;
}

.mv_card {
  position: relative;
  overflow: hidden;
  padding-block: 2rem 2.6rem;
  padding-inline: 1.3rem;
  border: 1px solid var(--brand);
  border-bottom: 0;
  border-radius: 0.6rem 0.6rem 0 0;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(26, 45, 120, 0.22);
  text-align: center;
}

.mv_card_flag {
  position: absolute;
  top: 0;
  left: 0;
  width: 5.6rem;
  height: 5.6rem;
  background: var(--brand);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  color: #ffffff;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.3rem;
}

.mv_card_flag span {
  position: absolute;
  top: 0.6rem;
  left: 0.5rem;
  transform: rotate(-45deg);
}

.mv_card_num {
  color: var(--brand);
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 4.2rem;
  font-weight: 700;
  line-height: 1.2;
}

.mv_card_num small {
  font-size: 2.3rem;
}

.mv_card_txt {
  margin-top: 0.2rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -0.1em;
}

@media screen and (max-width: 1000px) {
  .mv_visual {
    position: static;
    width: 100%;
    margin-top: 2.4rem;
    z-index: auto;
  }
  .mv_edge {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .mv {
    padding-top: 1.9rem;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% auto;
  }
  .mv::before {
    display: none;
  }
  .theme-hiroi .mv {
    background-image: url("../images/rakuoh-hiroi/mv_bg_sp.webp");
  }
  .theme-mitsumori .mv {
    background-image: url("../images/rakuoh-mitsumori/mv_bg_sp.webp");
  }
  .mv_inner {
    text-align: center;
  }
  .mv_sub {
    font-size: 1.6rem;
    line-height: 1.5;
  }
  .mv_ttl {
    margin-top: 0.2rem;
    margin-inline: -1.3rem;
    font-size: 2rem;
    line-height: 1.45;
  }
  .mv_ttl em {
    border-bottom-width: 0.2rem;
  }
  .mv_logo {
    width: 100%;
    margin-top: 2.7rem;
  }
  .mv_visual {
    width: 100%;
    margin-top: 1.9rem;
  }
  .mv_lead {
    margin-top: 0.2rem;
    margin-inline: -1.3rem;
    font-size: 1.3rem;
    line-height: 2.15;
  }
  .mv_btns {
    flex-direction: column;
    align-items: stretch;
    gap: 1.6rem;
    margin-top: 2.4rem;
  }
  .mv_btns .c-btn, .mv_btns .c-btn-outline {
    min-width: 0;
    width: 100%;
  }
  .mv_cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.8rem;
    width: auto;
    margin: 3rem -1.3rem 0;
  }
  .mv_card {
    display: flex;
    flex-direction: column;
    min-height: 16.5rem;
    padding: 2.9rem 0.4rem 1.6rem;
    border-radius: 0.8rem 0.8rem 0 0;
    box-shadow: 0 2px 6px rgba(26, 45, 120, 0.14);
  }
  .mv_card_flag {
    width: 3.4rem;
    height: 3.4rem;
    font-size: 0.9rem;
  }
  .mv_card_flag span {
    top: 0.4rem;
    left: 0.3rem;
  }
  .mv_card_num {
    margin-top: auto;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
    font-size: 3.4rem;
    line-height: 1.2;
  }
  .mv_card_num small {
    display: block;
    font-size: 2.2rem;
    line-height: 1.1;
  }
  .mv_card_txt {
    margin-top: auto;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.385;
    letter-spacing: normal;
  }
}
.integration {
  overflow: hidden;
  padding-block: 9.9rem 10rem;
  background: var(--tint);
}

.integration_inner {
  display: flex;
  justify-content: space-between;
}

.integration_txt {
  flex-shrink: 0;
  width: 50rem;
}

.integration_side {
  flex-shrink: 0;
  width: 71.2rem;
  margin-left: -4.9rem;
  margin-right: -6.3rem;
}

.integration_ttl {
  margin-top: 5.2rem;
  font-size: 4rem;
}

.integration_lead {
  margin-top: 3.9rem;
}

.integration_txt .c-btn-outline {
  justify-content: flex-start;
  margin-top: 4.2rem;
  min-width: 34.7rem;
  min-height: 5.2rem;
  font-size: 1.5rem;
}

.integration_flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
}

.integration_flow_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 21.8rem;
  height: 21.8rem;
  border-radius: 100%;
  background: #ffffff;
  text-align: center;
}

.integration_flow_icon {
  width: 5.6rem;
}

.integration_flow_name {
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
}

.integration_flow_name small {
  font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  color: #222222;
}

.integration_flow_txt {
  font-size: 1.4rem;
}

.integration_flow_arrow {
  flex-shrink: 0;
  width: 0;
  height: 0;
  border: 1.4rem solid transparent;
  border-left-color: var(--accent2);
  border-right-width: 0;
}

.integration_img {
  display: block;
  width: 71.2rem;
  margin-top: -4.6rem;
}

@media screen and (max-width: 767px) {
  .integration {
    padding-block: 2.4rem 3.9rem;
  }
  .integration_inner {
    flex-direction: column;
  }
  .integration_txt, .integration_side {
    width: 100%;
    margin: 0;
  }
  .integration_side {
    order: -1;
    width: calc(100% + 5.4rem);
    margin-inline: -2.7rem;
  }
  .integration_txt {
    margin-top: 2.5rem;
  }
  .integration_ttl {
    margin-top: 2.1rem;
    font-size: 3.2rem;
    line-height: 1.4;
  }
  .integration_lead {
    margin-top: 1.6rem;
  }
  .integration_lead br {
    display: none;
  }
  .integration_flow {
    gap: 1rem;
  }
  .integration_flow_item {
    width: 14.6rem;
    height: 14.6rem;
    justify-content: flex-start;
    padding-top: 2.8rem;
  }
  .integration_flow_icon {
    width: 3.3rem;
  }
  .integration_flow_name {
    margin-top: 1rem;
    font-size: 1.6rem;
  }
  .integration_flow_name small {
    font-size: 1.3rem;
  }
  .integration_flow_txt {
    font-size: 1.2rem;
  }
  .integration_flow_arrow {
    border-width: 0.9rem;
    border-right-width: 0;
  }
  .integration_img {
    width: 100%;
    margin-top: -2.8rem;
  }
  .integration_txt .c-btn-outline {
    min-width: 0;
    width: 100%;
    min-height: 5.1rem;
    margin-top: 2.3rem;
    font-size: 1.5rem;
  }
}
.functions {
  padding-block: 9.9rem 13.7rem;
}

.functions_ttl {
  margin-top: 5.1rem;
}

.functions_lead {
  margin-top: 1.8rem;
}

.functions_list {
  margin-top: 8.7rem;
}

.functions_item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6rem;
}

.functions_item + .functions_item {
  margin-top: 9rem;
}

.functions_item:nth-child(even) {
  flex-direction: row-reverse;
}

.functions_body {
  flex: 1;
}

.functions_label {
  color: var(--brand);
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.4rem;
  letter-spacing: 0.14em;
}

.functions_item_ttl {
  margin-top: 2.4rem;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 2.6rem;
  font-weight: 700;
}

.functions_txt {
  margin-top: 0.4rem;
}

.functions_img {
  flex-shrink: 0;
  width: 50.4rem;
}

.functions_point {
  position: relative;
  margin-top: 4.3rem;
  padding: 1.8rem 2.4rem;
  border: 1px solid var(--accent2-weak);
  border-radius: 0.6rem;
  color: var(--accent2);
  font-size: 1.65rem;
}

.functions_point_label {
  position: absolute;
  top: -1.3rem;
  left: 1.6rem;
  padding: 0.2rem 1.4rem;
  border-radius: 99.9rem;
  background: var(--accent2);
  color: #ffffff;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.3rem;
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  .functions {
    padding-block: 2.8rem 3.9rem;
  }
  .functions_ttl {
    margin-top: 2.7rem;
  }
  .functions_lead {
    margin-top: 1.8rem;
  }
  .functions_list {
    margin-top: 3.8rem;
  }
  .functions_item, .functions_item:nth-child(even) {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .functions_item + .functions_item {
    margin-top: 5.8rem;
  }
  .functions_img,
  .functions_play {
    order: -1;
    display: block;
    width: calc(100% + 5.4rem);
    max-width: none;
    margin-inline: -2.7rem;
  }
  .functions_play .functions_img {
    width: 100%;
    margin-inline: 0;
  }
  .functions_body {
    margin-top: 2.2rem;
  }
  .functions_label {
    font-size: 1.2rem;
  }
  .functions_item_ttl {
    margin-top: 1.2rem;
    font-size: 2.1rem;
    line-height: 1.2;
  }
  .functions_txt {
    margin-top: 1.2rem;
    font-size: 1.5rem;
    line-height: 1.87;
  }
  .functions_txt br {
    display: none;
  }
  .functions_point {
    margin-top: 2.5rem;
    padding: 1.6rem 1.6rem 1.5rem;
    font-size: 1.6rem;
    line-height: 1.87;
    text-align: center;
  }
  .functions_point_label {
    top: -1.3rem;
    left: 0.2rem;
    font-size: 1.2rem;
  }
}
.getstarted {
  position: relative;
  padding-block: 7.5rem 0;
  background-image: linear-gradient(var(--tint), var(--tint));
  background-repeat: no-repeat;
  background-size: calc(100% - max((100% - 114.8rem) / 2, 0px) - 2.4rem) 100%;
}

.getstarted_img {
  position: absolute;
  top: 6.9rem;
  right: 0;
  width: 48.6rem;
  object-fit: cover;
}

.theme-hiroi .getstarted_img {
  aspect-ratio: 972/1308;
}

.theme-mitsumori .getstarted_img {
  aspect-ratio: 972/1244;
}

@media screen and (max-width: 1200px) {
  .theme-hiroi .getstarted_img,
  .theme-mitsumori .getstarted_img {
    aspect-ratio: 1500/1124;
  }
}
.getstarted_inner {
  position: relative;
  z-index: 2;
}

.getstarted_ttl {
  margin-top: 5.1rem;
}

.getstarted_lead {
  margin-top: 2rem;
}

.getstarted_steps {
  width: 62.8rem;
  margin-top: 4.6rem;
}

.getstarted_step {
  display: flex;
  align-items: center;
  gap: 1.3rem;
  padding: 1.4rem 1.1rem;
  border-radius: 0.6rem;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(26, 45, 120, 0.18);
}

.getstarted_step + .getstarted_step {
  margin-top: 1.4rem;
}

.getstarted_step_icon {
  flex-shrink: 0;
  width: 11.8rem;
}

.getstarted_step_no {
  color: var(--accent2);
  font-size: 1.5rem;
  font-weight: 700;
}

.getstarted_step_ttl {
  margin-top: 0.2rem;
  color: var(--brand);
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 2rem;
  font-weight: 700;
}

.getstarted_step_txt {
  margin-top: 0.4rem;
  font-size: 1.5rem;
  line-height: 1.7;
}

.getstarted_check {
  margin-top: 2.6rem;
}

.getstarted_check_label {
  display: inline-block;
  padding: 0.1rem 1.4rem;
  border-radius: 99.9rem;
  background: var(--accent2);
  color: #ffffff;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.3rem;
}

.getstarted_check_ttl {
  margin-top: 0.6rem;
  color: var(--accent2);
  font-size: 1.5rem;
  font-weight: 700;
}

.getstarted_check_txt {
  font-size: 1.5rem;
}

.getstarted_cta {
  display: flex;
  justify-content: center;
  padding-block: 6rem 15.5rem;
}

.getstarted_cta .c-btn {
  min-width: 62rem;
  min-height: 9.1rem;
}

@media screen and (max-width: 767px) {
  .getstarted {
    padding-block: 0 4rem;
    background-size: 100% 100%;
  }
  .getstarted_img {
    position: static;
    width: 100%;
  }
  .getstarted_inner {
    margin-top: 2.7rem;
  }
  .getstarted_ttl {
    margin-top: 2.8rem;
  }
  .getstarted_lead {
    margin-top: 1.9rem;
  }
  .getstarted_steps {
    width: 100%;
    margin-top: 2.6rem;
  }
  .getstarted_step {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0 2.1rem 1.9rem;
    border-radius: 1rem;
    box-shadow: 0 2px 6px rgba(26, 45, 120, 0.12);
  }
  .getstarted_step + .getstarted_step {
    margin-top: 0.8rem;
  }
  .getstarted_step_icon {
    width: 100%;
  }
  .getstarted_step_no {
    margin-top: 0.3rem;
    font-size: 1.6rem;
    line-height: 1.5;
  }
  .getstarted_step_ttl {
    margin-top: 0.6rem;
    font-size: 2rem;
    line-height: 1.2;
  }
  .getstarted_step_txt {
    margin-top: 0.9rem;
    font-size: 1.4rem;
    line-height: 2;
  }
  .getstarted_step_txt br {
    display: none;
  }
  .getstarted_check {
    margin-top: 2rem;
  }
  .getstarted_check_label {
    padding-block: 0;
    font-size: 1.3rem;
    line-height: 2.1rem;
  }
  .getstarted_check_ttl {
    margin-top: 0.4rem;
    font-size: 1.6rem;
    line-height: 1.45;
  }
  .getstarted_check_txt {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2;
  }
  .getstarted_cta {
    padding-block: 1rem 0;
    padding-inline: 2.7rem;
  }
  .getstarted_cta .c-btn {
    min-width: 0;
    width: 100%;
    min-height: 7rem;
  }
}
.faq {
  padding-block: 7.7rem 12.5rem;
}

.faq_ttl {
  margin-top: 4.7rem;
}

.faq_list {
  margin-top: 5.3rem;
}

.faq_item {
  border-radius: 0.6rem;
  background: var(--tint);
}

.faq_item + .faq_item {
  margin-top: 1rem;
}

.faq_q {
  display: flex;
  align-items: center;
  gap: 2.4rem;
  width: 100%;
  min-height: 7rem;
  padding: 1.2rem 2.6rem 1.2rem 1.5rem;
  text-align: left;
}

.faq_mark {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
  border-radius: 0.6rem;
  background: #ffffff;
  color: var(--brand);
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
  line-height: 1;
}

.faq_q_txt {
  flex: 1;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.faq_icon {
  position: relative;
  flex-shrink: 0;
  width: 1.8rem;
  height: 1.8rem;
}

.faq_icon::before, .faq_icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: var(--brand);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.faq_icon::after {
  transform: rotate(90deg);
}

.faq_q[aria-expanded=true] .faq_icon::after {
  transform: rotate(0);
}

.faq_a {
  overflow: hidden;
  height: 0;
  transition: height 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.faq_q[aria-expanded=true] + .faq_a {
  height: auto;
}

.faq_a_inner {
  display: flex;
  gap: 2rem;
  padding: 0 2.6rem 2.2rem;
}

.faq_a .faq_mark {
  background: var(--accent2);
  color: #ffffff;
  font-size: 1.8rem;
}

.faq_a_txt {
  flex: 1;
  padding-top: 0.4rem;
  font-size: 1.5rem;
}

@media (prefers-reduced-motion: reduce) {
  .faq_a {
    transition: none;
  }
}
@media screen and (max-width: 767px) {
  .faq {
    padding-block: 2.7rem 4.1rem;
  }
  .faq_ttl {
    margin-top: 2.8rem;
  }
  .faq_lead {
    margin-top: 1.8rem;
  }
  .faq_list {
    margin-top: 3.6rem;
    margin-inline: -1.3rem;
  }
  .faq_item + .faq_item {
    margin-top: 1.1rem;
  }
  .faq_q {
    gap: 1.2rem;
    min-height: 6.9rem;
    padding: 1rem 1.3rem 1rem 1.5rem;
  }
  .faq_q_txt {
    font-size: 1.6rem;
    letter-spacing: -0.05em;
    line-height: 1.4;
  }
  .faq_a_inner {
    padding: 0 1.5rem 1.8rem;
  }
}
.workspace {
  padding-block: 9.9rem 13rem;
  background: var(--brand);
  color: #ffffff;
}

.workspace .c-label {
  color: #ffffff;
}

.workspace_ttl {
  margin-top: 5rem;
  color: #ffffff;
}

.workspace_lead {
  margin-top: 2.4rem;
}

.workspace_cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.6rem;
  margin-top: 5.8rem;
}

.workspace_card {
  padding: 2.8rem 2.8rem 3.4rem;
  border-radius: 0.6rem;
  background: #ffffff;
  color: #222222;
}

.workspace_card_head {
  display: flex;
  align-items: center;
  gap: 1.8rem;
}

.workspace_card_icon {
  width: 6.2rem;
}

.workspace_card_no {
  color: #222222;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 1.4rem;
  letter-spacing: 0.12em;
}

.workspace_card_ttl {
  margin-top: 0.2rem;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
}

.integration_flow_name-hiroi,
.workspace_card_ttl-hiroi {
  color: #1a2d78;
}

.integration_flow_name-mitsumori,
.workspace_card_ttl-mitsumori {
  color: #e70244;
}

.workspace_card_txt {
  margin-top: 2rem;
  font-size: 1.5rem;
  line-height: 1.8;
}

.workspace_card .c-btn {
  margin-top: 2.4rem;
  min-height: 4.8rem;
  font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
  .workspace {
    padding-block: 2.8rem 4.2rem;
  }
  .workspace_ttl {
    margin-top: 2.7rem;
  }
  .workspace_lead {
    margin-top: 1.8rem;
  }
  .workspace_lead br {
    display: none;
  }
  .workspace_cards {
    grid-template-columns: 1fr;
    gap: 1rem;
    margin: 2.7rem -1.3rem 0;
  }
  .workspace_card {
    padding: 2.5rem 1.3rem 2rem 2.6rem;
    border-radius: 1rem;
  }
  .workspace_card_head {
    gap: 1.1rem;
  }
  .workspace_card_icon {
    width: 5.6rem;
  }
  .workspace_card_no {
    font-size: 1.2rem;
  }
  .workspace_card_ttl {
    font-size: 2.2rem;
  }
  .workspace_card_txt {
    margin-top: 1.7rem;
    font-size: 1.4rem;
    line-height: 2;
  }
  .workspace_card .c-btn {
    margin-top: 2.4rem;
    min-height: 5rem;
    font-size: 1.5rem;
  }
}
.plans {
  padding-block: 10rem 15.9rem;
  background: var(--tint);
}

.plans_ttl {
  margin-top: 4.5rem;
}

.plans_lead {
  margin-top: 1.9rem;
}

.plans_cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}

.plans_card {
  padding: 3rem 2.8rem 3.6rem;
  border-radius: 0.6rem;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(26, 45, 120, 0.18);
}

.plans_card_name {
  color: var(--accent2);
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.2;
}

.plans_card_price {
  margin-top: 1rem;
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 5.6rem;
  font-weight: 700;
  line-height: 1.5;
}

.plans_card_price small {
  margin-right: 1.5rem;
  font-size: 3rem;
}

.plans_card_unit {
  margin-top: 0.6rem;
  font-size: 1.4rem;
}

.plans_card_txt {
  margin-top: 2.2rem;
  padding-top: 2.8rem;
  background-image: repeating-linear-gradient(to right, #e8f1f8 0 5px, transparent 5px 12px);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100% 0.4rem;
  font-size: 1.4rem;
  line-height: 1.95;
}

.plans_note {
  margin-top: 2.4rem;
  font-size: 1.4rem;
}

.plans_cta {
  display: flex;
  justify-content: center;
  margin-top: 6.4rem;
}

.plans_cta .c-btn {
  min-width: 31.2rem;
  min-height: 7rem;
}

@media screen and (max-width: 767px) {
  .plans {
    padding-block: 2.7rem 4rem;
  }
  .plans_ttl {
    margin-top: 2.7rem;
  }
  .plans_lead {
    margin-top: 1.9rem;
  }
  .plans_cards {
    grid-template-columns: 1fr;
    gap: 0.9rem;
    margin-top: 2.4rem;
  }
  .plans_card {
    padding: 1.4rem 2.1rem 1.2rem;
    border-radius: 1rem;
    box-shadow: 0 2px 6px rgba(26, 45, 120, 0.12);
  }
  .plans_card_name {
    font-size: 2.7rem;
  }
  .plans_card_price {
    margin-top: 1.7rem;
    font-size: 4.8rem;
  }
  .plans_card_price small {
    margin-right: 1rem;
    font-size: 2.6rem;
  }
  .plans_card_unit {
    margin-top: 0.3rem;
    font-size: 1.4rem;
    line-height: 1.8;
  }
  .plans_card_txt {
    margin-top: 1.9rem;
    padding-top: 2.4rem;
    line-height: 2;
  }
  .plans_note {
    margin-top: 1.3rem;
    font-size: 1.3rem;
    line-height: 1.55;
  }
  .plans_cta {
    margin-top: 2.7rem;
  }
  .plans_cta .c-btn {
    min-width: 0;
    width: 100%;
    min-height: 7rem;
  }
}
.cta {
  position: relative;
  overflow: hidden;
  padding-block: 7.5rem 10.9rem;
  background: var(--band);
  color: #ffffff;
  text-align: center;
}

.cta_deco {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: 136.6rem;
  max-width: none;
  height: 100%;
}

@media screen and (max-width: 1365px) {
  .cta_deco {
    width: 100%;
    object-fit: fill;
  }
}
.cta_img {
  position: absolute;
  left: 0;
  bottom: 4.1rem;
  z-index: 1;
  width: 51rem;
}

.cta_inner {
  position: relative;
  z-index: 2;
}

.cta_ttl {
  font-family: "LINE Seed JP", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.5;
}

.cta_ttl em {
  font-style: normal;
  border-bottom: 3px solid #ffffff;
}

.cta_lead {
  margin-top: 2.2rem;
  font-size: 1.5rem;
}

.cta_btns {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 2.3rem;
  margin-top: 8.4rem;
}

.cta_btns .c-btn {
  min-width: 31rem;
}

.cta_btns .c-btn-ghost {
  min-width: 16.5rem;
  font-size: 1.4rem;
}

@media screen and (max-width: 767px) {
  .cta {
    padding-block: 3.3rem 3.9rem;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
  }
  .theme-hiroi .cta {
    background-image: url("../images/rakuoh-hiroi/cta_deco_sp.webp");
  }
  .theme-mitsumori .cta {
    background-image: url("../images/rakuoh-mitsumori/cta_deco_sp.webp");
  }
  .cta_deco {
    display: none;
  }
  .cta_img {
    position: static;
    z-index: 1;
    display: block;
    width: calc(100% - 5.4rem);
    margin-inline: auto;
  }
  .cta_inner {
    margin-top: 2rem;
  }
  .cta_ttl {
    margin-inline: -1.3rem;
    font-size: 2.5rem;
    line-height: 1.52;
  }
  .cta_ttl em {
    border-bottom-width: 0.3rem;
  }
  .cta_lead {
    margin-top: 2.2rem;
    font-size: 1.5rem;
    line-height: 1.93;
  }
  .cta_btns {
    flex-direction: column;
    align-items: stretch;
    gap: 1.4rem;
    margin-top: 2.2rem;
  }
  .cta_btns .c-btn, .cta_btns .c-btn-ghost {
    min-width: 0;
    width: 100%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1200px) {
  .mv_cards {
    width: 100%;
  }
  .mv_btns {
    flex-wrap: wrap;
  }
  .mv_btns .c-btn, .mv_btns .c-btn-outline {
    min-width: 0;
  }
  .integration_inner {
    flex-direction: column;
    gap: 3.2rem;
  }
  .integration_txt, .integration_side {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .integration_img {
    width: 100%;
    margin-top: 1.6rem;
  }
  .integration_txt .c-btn-outline {
    min-width: 0;
  }
  .functions_item {
    gap: 2.4rem;
  }
  .functions_img {
    width: 42%;
  }
  .getstarted_img {
    position: static;
    display: block;
    width: 70%;
    margin-top: 2.4rem;
    margin-inline: auto;
  }
  .getstarted_steps {
    width: 100%;
  }
  .getstarted_cta .c-btn {
    min-width: 0;
    width: 100%;
  }
  .integration_img {
    width: 70%;
    margin-inline: auto;
  }
  .plans_card {
    padding-inline: 1.6rem;
  }
  .plans_card_price {
    font-size: 3.6rem;
  }
  .plans_card_price small {
    margin-right: 0.8rem;
    font-size: 2rem;
  }
  .plans_cta .c-btn {
    min-width: 0;
  }
  .cta {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
  }
  .theme-hiroi .cta {
    background-image: url("../images/rakuoh-hiroi/cta_deco_sp.webp");
  }
  .theme-mitsumori .cta {
    background-image: url("../images/rakuoh-mitsumori/cta_deco_sp.webp");
  }
  .cta_deco {
    display: none;
  }
  .cta_img {
    position: static;
    display: block;
    width: 70%;
    margin-inline: auto;
  }
  .cta_inner {
    margin-top: 2.4rem;
  }
  .cta_btns {
    flex-wrap: wrap;
  }
  .cta_btns .c-btn, .cta_btns .c-btn-ghost {
    min-width: 0;
  }
}
.functions_play {
  position: relative;
  display: block;
  flex-shrink: 0;
  width: 50.4rem;
  line-height: 0;
  cursor: pointer;
  transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.functions_play:hover {
  opacity: 0.85;
}

.functions_play .functions_img {
  width: 100%;
}

.modal[hidden] {
  display: none;
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 2.4rem;
}

.modal_overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  opacity: 0;
  transition: opacity 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.modal_body {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 96rem;
  opacity: 0;
  transform: translateY(2.4rem) scale(0.96);
  transition: opacity 0.32s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.32s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.modal.is-open .modal_overlay {
  opacity: 1;
}

.modal.is-open .modal_body {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .modal_overlay, .modal_body {
    transition: none;
  }
  .modal_body {
    transform: none;
  }
}
.modal_media {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 0.6rem;
  background: #000000;
}

.modal_media video,
.modal_media iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.modal_media_empty {
  display: grid;
  place-items: center;
  height: 100%;
  padding: 2.4rem;
  color: #ffffff;
  font-size: 1.5rem;
  text-align: center;
}

.modal_close {
  position: absolute;
  top: -4.4rem;
  right: 0;
  width: 3.2rem;
  height: 3.2rem;
}

.modal_close::before,
.modal_close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: #ffffff;
}

.modal_close::before {
  transform: rotate(45deg);
}

.modal_close::after {
  transform: rotate(-45deg);
}

body.is-modalopen {
  overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 1200px) {
  .functions_play {
    width: 42%;
  }
}
@media screen and (max-width: 767px) {
  .modal_close {
    top: -4rem;
  }
  .functions_play {
    width: calc(100% + 5.4rem);
    margin-inline: -2.7rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
  .integration_txt {
    max-width: 100rem;
  }
  .integration_txt .c-label-wide {
    width: auto;
  }
  .integration_ttl br,
  .integration_lead br {
    display: none;
  }
  .mv_inner {
    text-align: center;
  }
  .mv_logo {
    margin-inline: auto;
  }
  .mv_visual {
    position: static;
    z-index: auto;
    width: 70%;
    margin-inline: auto;
  }
  .mv_edge {
    display: none;
  }
  .mv_btns {
    justify-content: center;
  }
  .mv_cards {
    margin-inline: auto;
  }
}
