.page-id-31 {
  background: #F2F7F8;
  padding: 0 2rem;
}
@media (max-width: 1023px) {
 .blake-tb {
	display: none;
}
}
@media (max-width: 500px) {
 .blake-tb {
	display: block;
}
}

/* .green-bc__inner {
	height: 100vh;
	max-height: 108rem;
	width: 60%;
	position: relative;
	right: 0;
	top: 0;
	z-index: -1;
} */
/* .green-bc__inner::before {
	content: "";
	background-image: url("../../../img/lp/o-bc.png");
	background-size: cover;
	background-position: left;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
} */

.o-mv.main-img {
	position: relative;
}
.o-mv.main-img::before {
	content: "";
	background-image: url("../../../img/lp/o-bc.png");
	background-size: cover;
	background-position: left;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	right: 0;
	width: 60%;
	height: 100%;
	z-index: -1;
} 



@media (max-width: 500px) {
 .o-mv {
	height: initial;
}
}

.o-mv__content {
	display: flex;
	align-items: center;
	gap: 3rem;
	max-width: 1400px;
	padding: 14rem 5rem 4rem;
	margin: 0 auto;
}


@media (max-width: 1023px) {
  .o-mv__content {
	flex-direction: column-reverse;
	padding: 10rem 0rem 4rem;
}
}
@media (max-width: 500px) {
  .o-mv__content {
	padding: 8rem 0rem 4rem;
	gap: 2rem;
}
}

.mv-title {
	margin-bottom: 1.5rem;
}
.mv-title p{
	font-size: 1.4rem;
	background-color: #00632D;
	color: #fff;
	padding: 0.3rem 1.5rem;
	border-radius: 2rem;
	display: inline-block;
	margin-bottom: 1rem;
}
.mv-title h1 {
	color: #00632D;
	font-size: 4.8rem;
	line-height: 6rem;
}

@media (max-width: 1023px) {
 .mv-title h1 {
	font-size: 3.8rem;
	line-height: 5rem;
}
}
@media (max-width: 500px) {
 .mv-title h1 {
	font-size: 3rem;
	line-height: 4rem;
}
}


.kaiketsu-title {
	color: #fff;
	background-color: #86C1B1;
	padding: 0.5rem 1.5rem;
	margin-top: 3rem;
	margin-bottom: 1.5rem;
}
@media (max-width: 1023px) {
  .kaiketsu-title {
	margin-top: 2rem;
	margin-bottom: 1rem;
}
}

.kaiketsu-list {
	font-weight: 700;
	margin-bottom: 5rem;
}
@media (max-width: 1023px) {
  .kaiketsu-list {
	margin-bottom: 3rem;
}
}
.kaiketsu-list li {
	padding-left: 5rem;
	position: relative;
	margin-bottom: 1.2rem;
}
.kaiketsu-list li::before {
	content: "";
	width: 2.6rem;
	height: 2.6rem;
	background-image: url("../../../img/lp/check.png");
	background-repeat: no-repeat;
	background-size: 100%;
	position: absolute;
	left: 1rem;
	top: 50%;
	transform: translateY(-50%);
}

.mv-content__right{
	max-width: 65rem;
	width: 100%;
	height: 60rem;
	background-image: url("../../../img/lp/o-mv.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 2rem;
}
@media (max-width: 1023px) {
 .mv-content__right{
	max-width: initial;
	width: 100%;
	height: 40rem;
	background-position: top center;
}

.o-mv .c-mv__cta {
	width: 100%;
	gap: 2.5rem;
	justify-content: center;
}
}
@media (max-width: 500px) {
  .mv-content__right{
	height: 25rem;
}
.o-mv .c-mv__cta {
	gap: 1rem;
}
}


/* =========================================================
   総合アウトソーシングとは（セクション）
   ========================================================= */

.p-outsourcingIntro {
  padding: 8rem 0 8rem;
}
@media (max-width: 500px) {
.p-outsourcingIntro {
  padding: 4rem 0;
}
}

.p-outsourcingIntro__inner {
  margin-inline: auto;
}


/* =========================================================
   Section Head Component
   ========================================================= */

.c-sectionHead {
  margin: 0 0 3rem;
}

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

/* タイトル */
.c-sectionHead__title {
  margin: 0;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 800;
  color: #222;
}

/* バー */
.c-sectionHead__bars {
  display: flex;
  justify-content: center;
  margin-top: 1.5rem;
}

.c-sectionHead__bar {
  height: 0.6rem;
  width: 6rem;
}

.c-sectionHead__bar--primary {
  background: #00632D;
}

.c-sectionHead__bar--secondary {
  background: #86C1B1;
}

/* リード */
.c-sectionHead__lead {
  margin: 2.4rem 0 0;
  font-size: 1.6rem;
  line-height: 1.6;
  color: #222;
}

/* SP */
@media (max-width: 699px) {
  .c-sectionHead__title {
    font-size: 2.6rem;
  }
}

/* =========================================================
   Table
   ========================================================= */

.p-outsourcingIntro__tableWrap {
  width: min(120rem, 100%);
  margin-inline: auto;
  border-radius: 0.8rem;
  overflow: hidden;
  box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.12);
  background: #fff;
}

.p-outsourcingTable {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

/* 列幅（スクショの比率に寄せる） */
.p-outsourcingTable__col--item { width: 25%; }
.p-outsourcingTable__col--outsourcing { width: 45%; }
.p-outsourcingTable__col--dispatch { width: 30%; }

/* 上の濃い帯タイトル */
.p-outsourcingTable__title {
  background: #3F7F70;
  color: #fff;
  font-size: 2.2rem;
  font-weight: 800;
  text-align: center;
  padding: 2.2rem 2rem;
}

/* 2段目の見出し */
.p-outsourcingTable__th {
  padding: 2rem 2rem;
  font-size: 1.6rem;
  font-weight: 800;
  border-top: 1px solid #D8DEDE;
  border-bottom: 1px solid #D8DEDE;
}

.p-outsourcingTable__th--item {
  background: #F2F7F8;
  color: #222;
  text-align: left;
  border-right: 1px solid #D8DEDE;
}

.p-outsourcingTable__th--outsourcing {
  background: #DFF5F3;
  color: #00632D;
  text-align: left;
  border-right: 1px solid #D8DEDE;
}

.green-text {
color: #00632D;
font-weight: 900;
}
.p-outsourcingTable__th--dispatch {
  background: #F2F7F8;
  color: #222;
  text-align: left;
}

/* 左の行見出し（項目名） */
.p-outsourcingTable__rowHead {
  background: #fff;
  color: #222;
  font-size: 1.6rem;
  font-weight: 800;
  padding: 2.8rem 2rem;
  border-bottom: 1px solid #D8DEDE;
  border-right: 1px solid #D8DEDE;
  text-align: left;
}

/* セル */
.p-outsourcingTable__td {
  font-size: 1.6rem;
  line-height: 1.6;
  padding: 2.8rem 2rem;
  border-bottom: 1px solid #D8DEDE;
  color: #222;
}

.p-outsourcingTable__td--outsourcing {
  background: #DFF5F3;
  border-right: 1px solid #D8DEDE;
}

.p-outsourcingTable__td--dispatch {
  background: #fff;
}

/* チェック行 */
.p-outsourcingTable__checkLine {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
}

.p-outsourcingTable__check {
  width: 2.6rem;
  height: auto;
  flex: 0 0 auto;
}

/* 最終行の罫線を綺麗に */
.p-outsourcingTable tbody tr:last-child .p-outsourcingTable__rowHead,
.p-outsourcingTable tbody tr:last-child .p-outsourcingTable__td {
  border-bottom: 0;
}

/* =========================================================
   SP（崩れ防止：横スクロール）
   ========================================================= */
@media (max-width: 699px) {
  .p-outsourcingIntro {
    padding: 4rem 0 4rem;
  }

  .p-outsourcingIntro__title {
    font-size: 2.6rem;
  }

  .p-outsourcingIntro__tableWrap {
    overflow-x: auto;
  }

  .p-outsourcingTable {
    min-width: 60rem; /* 表の見た目を保つ */
  }
}

/* =========================================================
   導入のメリット
   ========================================================= */

.p-merit {
  padding: 8rem 5rem;
  background-color: #fff;
}

/* row（上段/下段） */
.p-merit__row {
  display: grid;
  gap: 1.5rem;
}

/* 上段：3列 */
.p-merit__row--top {
  grid-template-columns: repeat(3, 1fr);
  margin-top: 3rem;
}

/* 下段：2列（半分ずつ） */
.p-merit__row--bottom {
  grid-template-columns: repeat(2, 1fr);
  margin-top: 1.5rem;
}

/* カード */
.p-meritCard {
  background: #fff;
  padding: 1.5rem;
  box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.10);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.p-meritCard:hover {
  transform: translateY(-3px);
  box-shadow: 0 1.6rem 3.2rem rgba(0, 0, 0, 0.14);
}

.p-meritCard__icon {
  margin: 0 0 1rem;
}

.p-meritCard__icon img {
  width: 5rem;
  height: auto;
  display: block;
}

.p-meritCard__title {
  margin: 0 0 1rem;
  font-size: 2rem;
  line-height: 1.35;
  font-weight: 800;
  color: #428674;
}

.p-meritCard__text {
  margin: 0;
  font-size: 1.6rem;
  line-height: 1.6;
  color: #222;
}

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

@media (max-width: 1100px) {
  .p-merit__row--top {
    flex-direction: column;
  }

  /* 下段も2列のままでOK（同じ） */
}

@media (max-width: 699px) {
  .p-merit {
    padding: 4rem 2rem;
  }

  .p-merit__row--top,
  .p-merit__row--bottom {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .p-merit__row--top {
    margin-top: 3.2rem;
  }

  .p-merit__row--bottom {
    margin-top: 2rem;
  }

  .p-meritCard {
    padding: 1.5rem;
  }

  .p-meritCard__title {
    font-size: 2rem;
  }

  .p-meritCard__icon img {
    width: 5.2rem;
  }
}

/* =========================================================
   サービスメニュー
   ========================================================= */

.o-mv.l-container.service-menu {
	padding-left: 0;
	padding-right: 0;
}
.mv-title.service-menu__title{
	font-size: 2.8rem;
}
.mv-title.service-menu__title span{
	font-size: 4rem;
	color: #00632D;
	line-height: 4rem;
}
@media (max-width: 500px) {
.mv-title.service-menu__title{
	font-size: 2rem;
}
.mv-title.service-menu__title span{
	font-size: 3rem;
	color: #00632D;
	line-height: 4rem;
}
}

.o-mv__content.service-menu__content {
	padding: 8rem 0;
}
@media (max-width: 500px) {
.o-mv__content.service-menu__content {
	padding: 4rem 0;
}
}

.service-list {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}
.service-list li{
	flex: 1 1 calc((100% - 1rem) / 2); /* gap 1個分を引いて2等分 */
  	max-width: calc((100% - 1rem) / 2); /* 2列を固定して伸び過ぎ防止 */
	text-align: center;
	border: 0.1rem solid #87C1B1;
	padding: 0.8rem 1rem;
	background-color: #fff;
}

.kaiketsu-list.service-menu__list {
	font-weight: 500;
	margin-bottom: 0;
}
.kaiketsu-list.service-menu__list span{
	font-weight: 700;
	color: #0E7E60;
}

.mv-content__right.service-menu__right {
	max-width: 55rem;
	width: 100%;
	height: 60rem;
	background-image: url("../../../img/lp/o-service.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 2rem;	
}
@media (max-width: 1023px) {
 .mv-content__right.service-menu__right {
	max-width: initial;
	width: 100%;
	height: 40rem;
}
}
@media (max-width: 500px) {
 .mv-content__right.service-menu__right {
	height: 25rem;
}
}

/* =========================================================
   導入実績・事例
   ========================================================= */

.p-case {
  padding: 8rem 0;
  position: relative;
  z-index: 0;
}
/* 画面いっぱいの白背景 */
.p-case::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;          /* 画面幅いっぱい */
  height: 100%;
  background: #fff;      /* 白背景 */
  z-index: -1;
}

/* 白い外枠（カード） */
.p-case__box {
  background: #F2F7F8;
  border-radius: 1.2rem;
  overflow: hidden;
  box-shadow: 0 1.2rem 2.8rem rgba(0, 0, 0, 0.10);

  display: grid;
  grid-template-columns:35% 65%;
  align-items: stretch;
}

/* 左：画像 */
.p-case__media {
  position: relative;
  width: 100%;
  height: 100%;
}

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

/* 右：内容 */
.p-case__content {
  padding: 3rem 2rem;
}

.p-case__tag {
  display: inline-block;
  background: #fff;
  border: 1px solid #E5ECEC;
  border-radius: 0.4rem;
  padding: 1rem 2rem;
  margin: 0 0 1rem;

  font-size: 1.4rem;
  font-weight: 700;
  color: #222;
}

.p-case__title {
  margin: 0 0 2rem;
  font-size: 2.4rem;
  line-height: 1.45;
  font-weight: 800;
  color: #2F2F2F;
}

/* 課題/導入効果 2カラム */
.p-case__panels {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}

/* パネル共通 */
.p-casePanel {
  border-radius: 1.2rem;
  padding: 2rem;
  border: 1px solid transparent;
  background: #fff;
}

/* 課題（薄い赤） */
.p-casePanel--issue {
  background: #FCEAEA;
  border-color: #FFAAAA;
}

.p-casePanel--issue .p-casePanel__title {
  color: #EA4949;
}

/* 導入効果（薄い青） */
.p-casePanel--effect {
  background: #EEF2FF;
  border-color: #AAAAFF;
}

.p-casePanel--effect .p-casePanel__title {
  color: #1421BF;
}

/* パネル見出し */
.p-casePanel__head {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}

.p-casePanel__icon {
  width: 2.4rem;
  height: auto;
  flex: 0 0 auto;
}

.p-casePanel__title {
  margin: 0;
  font-size: 1.8rem;
  font-weight: 800;
}

/* リスト */
.p-casePanel__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.p-casePanel__item {
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  line-height: 1.8;
  color: #222;
}

.p-casePanel__item + .p-casePanel__item {
  margin-top: 1rem;
}

.p-casePanel__item::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

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

@media (max-width: 1100px) {
  .p-case__box {
    grid-template-columns: 1fr;
  }

  .p-case__media {
    min-height: 28rem;
	max-height: 40rem;
  }

  .p-case__content {
    padding: 3.2rem 3rem 3.2rem;
  }
}

@media (max-width: 699px) {
  .p-case {
    padding: 4rem 0;
  }

  .p-case__title {
    font-size: 2.2rem;
  }

  .p-case__panels {
    grid-template-columns: 1fr;
  }
  .p-case__content {
     padding: 1.5rem 1rem;
  }
  .p-casePanel {
    padding: 1.5rem 1rem;
  }
}


/* =========================================================
   MRSの強み（緑帯＋カード）
   ========================================================= */

.p-strengths {
  position: relative;
  padding: 8rem 0;
  z-index: 0;
}

/* コンテナ幅を超えて緑背景を敷く（100vw） */
.p-strengths::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  height: 100%;
  background-image: url("../../../img/lp/g-bc.jpg");
  background-position: center;
  z-index: -2;
}

.p-strengths__inner {
  position: relative;
}

/* 見出し */
.p-strengths__head {
  text-align: center;
  color: #fff;
  margin: 0 0 3rem;
}

.p-strengths__title {
  font-size: 3.2rem;
  line-height: 1.25;
  font-weight: 800;
}

.p-strengths__sub {
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.6;
  font-weight: 700;
  opacity: 0.95;
}

/* カード群 */
.p-strengths__cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.5rem;
  align-items: stretch;
}

/* 1枚 */
.p-strengthCard {
  background: #fff;
  border-radius: 0.8rem;
  padding: 2rem 1rem 3rem;
  box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.18);
}

.p-strengthCard__icon {
  margin-bottom: 1.4rem;
}

.p-strengthCard__icon img {
  width: 5rem;
  height: auto;
  display: block;
  margin-inline: auto;
}

.p-strengthCard__title {
  margin: 0 0 0.5rem;
  font-size: 1.5rem;
  font-weight: 800;
  color: #0B7A60;
  text-align: center;
  line-height: 1.4;
}

.p-strengthCard__text {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.7;
  color: #222;
}

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

@media (max-width: 1100px) {
  .p-strengths__cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 699px) {
  .p-strengths {
    padding: 4rem 0;
  }

  .p-strengths__title {
    font-size: 2.6rem;
  }

  .p-strengths__cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.2rem;
  }

  .p-strengthCard {
    padding: 2rem 1.6rem 2.2rem;
  }
}
@media (max-width: 699px) {
  .p-strengths__cards {
    grid-template-columns: repeat(2, 1fr);
  }

  /* 最後のカードだけ横いっぱい */
  .p-strengthCard:last-child {
    grid-column: 1 / -1;
  }
}

/* =========================================================
   導入までの流れ
   ========================================================= */

.p-flow {
  padding: 8rem 0;
}

.p-flow__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

/* 1ステップ */
.p-flowStep {
  display: flex;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1rem 2rem rgba(0,0,0,0.08);
  border-bottom: 3px solid #428674; /* 下の緑ライン */
}

/* 左の番号帯 */
.p-flowStep__num {
  background: #428674;
  color: #fff;
  font-weight: 800;
  font-size: 1.6rem;
  width: 3.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 右のテキスト部分 */
.p-flowStep__content {
  padding: 2rem;
  flex: 1;
}

.p-flowStep__title {
  margin: 0 0 1rem;
  font-size: 1.6rem;
  font-weight: 800;
  color: #428674;
}

.p-flowStep__text {
  margin: 0;
  font-size: 1.3rem;
  line-height: 1.7;
  color: #222;
}

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

@media (max-width: 1100px) {
  .p-flow__steps {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 699px) {
  .p-flow {
    padding: 4rem 0;
  }

  .p-flow__steps {
    grid-template-columns: 1fr;
	gap: 1rem;
  }

  .p-flowStep__num {
    width: 4.8rem;
    font-size: 1.6rem;
  }

  .p-flowStep__title {
    font-size: 1.5rem;
  }

  .p-flowStep__text {
    font-size: 1.3rem;
  }
}


/* =========================================================
   関連サービス
   ========================================================= */

.p-related {
  position: relative;
  padding: 6rem 0;
  z-index: 0;
}

/* コンテナをはみ出す白背景 */
.p-related::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;      /* 画面幅いっぱい */
  height: 100%;
  background: #fff;  /* 白背景 */
  z-index: -1;
}

.p-related__title {
  margin: 0 0 1.5rem;
  font-size: 1.6rem;
  font-weight: 800;
  color: #6BB5A1;
}

/* 横並び */
.p-related__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

/* ボタンカード */
.p-related__item {
  display: block;
  background: #F3F7F7;
  padding: 2rem 1.6rem;
  text-align: center;
  font-size: 1.5rem;
  color: #222;
  text-decoration: none;

  box-shadow: 0 0.8rem 1rem rgba(0,0,0,0.08);
  transition: 0.25s ease;
}

.p-related__item:hover {
  transform: translateY(-3px);
  box-shadow: 0 1.2rem 2.2rem rgba(0,0,0,0.12);
  background: #E9F3F1;
}

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

@media (max-width: 1100px) {
	.p-related {
		padding: 4rem 0;
	}
  .p-related__list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 699px) {
  .p-related__list {
    grid-template-columns: 1fr;
  }

  .p-related__item {
    padding: 1.8rem;
    font-size: 1.4rem;
  }
}
/* =========================================================
   CTA（背景フルワイド）
   ========================================================= */

.p-cta {
  position: relative;
  padding: 7rem 0;
  z-index: 0;
  text-align: center;
}

.p-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  background: #0E7E60;
  z-index: -1;
}

.p-cta__title {
  margin: 0 0 2rem;
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.4;
  color: #fff;
}

.p-cta__lead {
  margin: 0 0 2rem;
  font-size: 1.6rem;
  line-height: 1.9;
  color: rgba(255, 255, 255, 0.88);
}

.p-cta__actions {
  display: flex;
  justify-content: center;
  gap: 3.2rem;
  flex-wrap: wrap;
}

.c-ctaCard__btn.yellow-btn,.c-ctaCard__btn.white-btn {
	margin: 0;
	padding: 3rem 2rem;
	max-width: 41rem;
	width: 100%;
	justify-content: left;
}
.c-ctaCard__btn.yellow-btn {
	color: #2F2F2F;
}
.c-ctaCard__btn.white-btn  {
	background-color: initial;
	border: #fff 1px solid;
	color: #fff;
}

.c-ctaBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.4rem;

  min-width: 44rem;       /* これが“横長”感の正体 */
  height: 10rem;          /* 高さしっかり */

  border-radius: 2.4rem;  /* 角丸大きめ */
  font-size: 2.4rem;
  font-weight: 800;
  text-decoration: none;
  line-height: 1;

  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.c-ctaBtn__arrow {
  width: 3.2rem; /* 矢印画像の想定 */
  height: auto;
  flex: 0 0 auto;
}

.c-ctaBtn__text {
  display: inline-block;
}

/* 左：黄色（塗り） */
.c-ctaBtn--primary {
  background: #DCDC52;
  color: #111;
  border: 3px solid #DCDC52;
}

.c-ctaBtn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.18);
}

/* 右：緑（背景同化）＋白枠 */
.c-ctaBtn--secondary {
  background: transparent;
  color: #fff;
  border: 3px solid #fff;
}

.c-ctaBtn--secondary:hover {
  transform: translateY(-2px);
  box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.18);
  background: rgba(255, 255, 255, 0.08);
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 900px) {
  .c-ctaBtn {
    min-width: 34rem;
    height: 9rem;
    font-size: 2.1rem;
  }
}

@media (max-width: 699px) {
  .p-cta {
    padding: 4rem 0;
  }

  .p-cta__title {
    font-size: 2.2rem;
  }

  .p-cta__actions {
    flex-direction: column;
    gap: 1.8rem;
  }

  .c-ctaBtn {
    width: 100%;
    min-width: 0;
    height: 8.6rem;
    padding: 0 2.4rem;
    font-size: 2rem;
    border-radius: 2rem;
  }

  .c-ctaBtn__arrow {
    width: 2.8rem;
  }

  .c-ctaCard__btn.yellow-btn,.c-ctaCard__btn.white-btn {
	margin: 0;
	padding: 3rem 2rem;
	max-width: 41rem;
	width: 100%;
	justify-content: left;
	margin: 0 auto;
}
}


/* =========================================================
   フルワイド画像（1枚）
   ========================================================= */
html, body {
  overflow-x: hidden;
}

.p-widePhoto {
  padding: 0; /* 必要なら上下余白はここで調整 */
}

/* ここが “コンテナを超える” 本体 */
.p-widePhoto__frame {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;         /* 画面幅いっぱい */
  max-width: 100vw;
  overflow: hidden;     /* はみ出しカット（端の余白防止） */
}

/* 画像表示 */
.p-widePhoto__img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* もし高さを揃えたい場合（任意） */
/*
@media (min-width: 700px) {
  .p-widePhoto__img {
    height: 36rem;
    object-fit: cover;
  }
}
*/