@charset "UTF-8";

/**************************************************************
*************************************************************

tsubasa

*************************************************************
****************************************************************/

.tsubasa {}
/* ===== カスタムプロパティ ===== */
.tsubasa {
 --em: #e14b44; /* 赤い強調 */
 --maincolor: #275dae;
}
.tsubasa .column__outer {}
@media (max-width: 1250px) {
 .tsubasa .column__outer {
  padding: 0 10px;
 }
}
.tsubasa .column__inner {
 width: 100%;
 margin: 0 auto;
}
@media (min-width: 1251px) {
 .tsubasa .column__inner {
  max-width: 1000px;
 }
}
@media (max-width: 1250px) {
 .tsubasa .column__inner {
  width: 100%;
  max-width: 1000px;
 }
}
/**************************************************************
*************************************************************

header

*************************************************************
****************************************************************/
.tsubasa header {
 background-color: var(--maincolor);
 color: #FFF;
}
.tsubasa header .inner {
 width: 100%;
 margin: 0 auto;
 display: flex;
 justify-content: flex-start;
 align-items: center;
 flex-wrap: wrap;
}
.tsubasa header .inner h1 {
 z-index: 1;
 position: relative;
 padding-top: 1rem;
}
@media only screen and (min-width : 1001px) {
 .tsubasa header .inner h1 {
  width: 340px;
 }
}
@media only screen and (min-width : 701px)and (max-width : 1000px) {
 .tsubasa header .inner h1 {
  width: 300px;
 }
}
@media only screen and (min-width : 481px)and (max-width : 700px) {
 .tsubasa header .inner h1 {
  width: 20rem;
 }
}
@media only screen and (max-width : 480px) {
 .tsubasa header .inner h1 {
  width: 210px;
 }
}
.tsubasa header .inner h1 img {
 width: 100%;
}
.tsubasa header .header-title {
 text-align: center;
 width: 100%;
 padding: 2rem 0 3rem;
}
@media only screen and (max-width: 700px) {
 .tsubasa header .header-title {}
}
.tsubasa header .header-title h2 {
 font-size: clamp(1.5rem, 3vw, 2rem);
 line-height: 1.6;
 font-weight: 700;
 margin: 0;
 color: #FFF;
}
@media only screen and (min-width: 481px) and (max-width: 700px) {
 .tsubasa header .header-title h2 {
  font-size: clamp(1.5rem, 3.5vw, 3rem);
 }
}
@media only screen and (max-width: 480px) {
 .tsubasa header .header-title h2 {
  font-size: clamp(1.4rem, 3vw, 2rem);
 }
}
/**************************************************************
 TSUBASAポイントの使い方セクション
**************************************************************/
#tsubasa-point-guide {
 padding: 4rem 0 0;
}
/*------------------------------------
  ボタン群
------------------------------------*/
.point-nav {
 text-align: center;
 margin-bottom: 3rem;
}
.point-nav__list {
 list-style: none;
 padding: 0;
 margin: 0;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 1rem;
}
/*------------------------------------
  ボタン群
------------------------------------*/
.point-nav {
 text-align: center;
 margin-bottom: 4rem;
}
.point-nav__list {
 list-style: none;
 padding: 0;
 margin: 0 auto 1.5rem;
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 max-width: 1000px;
}
@media (max-width: 700px) and (min-width: 401px) {
 .point-nav__list {
  gap: 0.6rem;
 }
}
@media (max-width: 400px) {
 .point-nav__list {
  flex-direction: column;
  align-items: stretch;
  gap: 0.8rem;
 }
}
.point-nav__list li {
 flex: 1 1 calc(25% - 0.75rem); /* gap分を差し引いて4つ均等 */
}
/*--- レスポンシブ ---*/
@media (max-width: 700px) and (min-width: 401px) {
 .point-nav__list li {
  flex: 1 1 calc(50% - 0.6rem); /* 2列×2段 */
 }
}
@media (max-width: 400px) {
 .point-nav__list li {
  flex: 1 1 auto;
 }
}
.point-nav__btn {
 display: flex;
 align-items: center;
 justify-content: center;
 width: 100%;
 height: 40px;
 border: 1.5px solid #335DA3;
 border-radius: 2px;
 font-weight: 700;
 font-size: 1rem;
 color: var(--maincolor);
 background: #fff;
 text-decoration: none;
 position: relative;
 transition: all 0.2s ease;
}
@media (min-width: 401px) and (max-width: 700px) {
 .point-nav__btn {
  font-size: 0.95rem;
  padding: 0.6em 1.2em;
 }
}
@media (max-width: 400px) {
 .point-nav__btn {
  width: 100%;
  font-size: 1rem;
 }
}
/* ▼ 下向きの“傘型矢印”（中抜き） */
.point-nav__btn::after {
 content: "";
 display: inline-block;
 width: 8px;
 height: 8px;
 margin-left: 0.6em;
 border-left: 2px solid var(--maincolor);
 border-bottom: 2px solid var(--maincolor);
 transform: rotate(-45deg);
 transition: transform 0.2s ease;
}
/* hover時 */
.point-nav__btn:hover {
 background: #335DA3;
 color: #fff;
}
.point-nav__btn:hover::after {
 border-color: #fff;
 transform: rotate(-45deg) translateY(3px);
}
/**************************************************************
 TSUBASAポイントの使い方（中身）
**************************************************************/
/*------------------------------------
 見出し
------------------------------------*/
.point-usage__title {
 font-size: clamp(1.4rem, 3vw, 2rem);
 font-weight: 700;
 color: #000;
 text-align: center;
 line-height: 1.4;
 letter-spacing: 0.02em;
 border-bottom: 2px solid #335DA3;
 padding: 0 0 2.5rem;
 margin-bottom: 3rem;
}
/**************************************************************
 TSUBASAポイントの使い方
**************************************************************/
/*------------------------------------
 usage-block（全体ラッパー）
------------------------------------*/
.usage-block {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 2.5rem;
 margin-bottom: 5rem;
 text-align: left;
 counter-increment: usage;
}
@media (max-width: 700px) {
 .usage-block {
  flex-direction: column;
  gap: 2rem;
 }
}
/*------------------------------------
 usage-block__body（本文カラム）
------------------------------------*/
.usage-block__body {
 flex: 1 1 auto;
 position: relative;
}
/*------------------------------------
 usage-block__title
------------------------------------*/
.usage-block__title {
 font-weight: 700;
 margin-bottom: 1.75rem;
 color: #000;
 position: relative;
 line-height: 1.2;
 padding-left: 50px;
}
@media (min-width: 701px) {
 .usage-block__title {
  font-size: 1.3rem;
 }
}
@media (max-width: 700px) {
 .usage-block__title {
  font-size: 1.4rem;
 }
}
@media (max-width: 600px) {
 .usage-block__title {
  font-size: 1.45rem;
 }
}
@media (max-width: 480px) {
 .usage-block__title {
  font-size: 1.3rem;
 }
}

.usage-block__title::before {
 content: counter(usage);
 position: absolute;
 left: 0;
 top: -7px;
 width: 40px;
 height: 40px;
 border-radius: 6px;
 background: #335DA3;
 color: #fff;
 font-weight: 700;
 font-size: 1.2rem;
 display: flex;
 align-items: center;
 justify-content: center;
}
@media (max-width: 700px) {
 .usage-block__title::before {
  width: 34px;
  height: 34px;
  font-size: 1.05rem;
  left: 0;
 }
}
/*------------------------------------
 usage-block__lead（説明文）
------------------------------------*/
.usage-block__lead {
 color: #333;
 line-height: 1.8;
 margin: 0;
}
.usage-block__lead strong {
 display: block;
 color: var(--maincolor);
 font-weight: 700;
 margin-bottom: 0.3em;
}
@media (min-width: 701px) {
 .usage-block__lead strong {
  font-size: 1.2rem;
 }
}
@media (max-width: 700px) {
 .usage-block__lead strong {
  font-size: 1.25rem;
 }
}
@media (max-width: 600px) {
 .usage-block__lead strong {
  font-size: 1.3rem;
 }
}
@media (max-width: 480px) {
 .usage-block__lead strong {
  font-size: 1.2rem;
 }
}
.usage-block__lead span {
 display: block;
 font-weight: 400;
 color: #333;
}
@media (max-width: 700px) {
 .usage-block__lead span {
  font-size: 1.125rem;
 }
}

@media (max-width: 480px) {
 .usage-block__lead span {
  font-size: 1rem;
 }
}

/*------------------------------------
 usage-step（全体）
------------------------------------*/
.usage-step {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  margin-top: 2rem;
  align-items: stretch; /* 各STEPの高さを揃える */
}
@media (max-width: 480px) {
  .usage-step {
    grid-template-columns: 1fr; /* ← 1列化 */
    gap: 1.5rem;
  }
}


/*------------------------------------
 usage-step__item（STEP単体）
------------------------------------*/
.usage-step__item {
  display: grid;
  grid-template-rows:
    auto   /* ① ラベル＋タイトル */
    auto   /* ② 注意文 */
    1fr    /* ③ 余白（高さ合わせ） */
    auto;  /* ④ 画像 */
  /*gap: 0.8rem;*/
}

/*------------------------------------
 usage-step__item__over（ラベル＋タイトル）
------------------------------------*/
.usage-step__item__over {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  min-height: 3.8em; /* ← タイトル行高さ統一 */
}
@media (max-width: 480px) {
  .usage-step__item__over {
    min-height: auto;
				/*align-items: center;*/
				
  }
}

/*------------------------------------
 usage-step__label（STEPラベル）
------------------------------------*/
.usage-step__label {
  display: inline-block;
  border: 1.5px solid #335DA3;
  border-radius: 30px;
  color: #335DA3;
  font-size: 0.9rem;
  font-weight: 700;
  padding: 0.01em 1.4em;
		white-space: nowrap;
}

/*------------------------------------
 usage-step__text（STEP見出し）
------------------------------------*/
.usage-step__text {
  color: var(--maincolor);
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 701px) {
 .usage-step__text {
  font-size: 1.2rem;
 }
}
@media (max-width: 700px) {
 .usage-step__text {
  font-size: 1.25rem;
 }
}
@media (max-width: 600px) {
 .usage-step__text {
  font-size: 1.3rem;
 }
}
@media (max-width: 480px) {
 .usage-step__text {
  font-size: 1.2rem;
 }
}

.usage-step__text .pc__view {
}

@media (min-width: 481px) {
 .usage-step__text .pc__view {
  display:inline;
 }
}

@media (max-width: 480px) {
 .usage-step__text .pc__view {
  display: none;
 }
}


/*------------------------------------
 usage-step__note（注意文）
------------------------------------*/
.usage-step__note {
  font-size: 0.82rem;
  color: #333;
  line-height: 1.7;
  margin: 0;
  min-height: 5em; /* ← 注意文行の高さを統一 */
  align-self: start;
}
@media (max-width: 700px) {
 .usage-step__note {
  font-size: 1.125rem;
 }
}

@media (max-width: 480px) {
 .usage-step__note {
  font-size: 1rem;
		min-height: auto; /* ← SPでは解除 */
 }
}

/*------------------------------------
 usage-step__note（注意文）
------------------------------------*/
.usage-step__note_list {
	min-height: 4em;
	margin-top: 1rem;
}
.usage-step__note_list li {
  font-size: 0.82rem;
  color: #333;
  line-height: 1.7;
  margin: 0;
  align-self: start;
	 padding-left: 1.2rem;
	 position: relative;
}
@media (max-width: 700px) {
 .usage-step__note_list li {
  font-size: 1.125rem;
 }
}

@media (max-width: 480px) {
 .usage-step__note_list li {
  font-size: 1rem;
		min-height: auto; /* ← SPでは解除 */
 }
}

.usage-step__note_list li::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 2px;
}

/*------------------------------------
 usage-step__item figure（画像）
------------------------------------*/
.usage-step__item figure {
  margin: 0;
  text-align: center;
  align-self: end; /* ← 画像の開始位置を統一 */
}
.usage-step__item figure img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: inline-block;
}

/*------------------------------------
 usage-block__img（右側画像）
------------------------------------*/
.usage-block__img {
  flex: 0 0 250px;
  text-align: right;
  align-self: flex-start;
}
.usage-block__img img {
  width: 100%;
  height: auto;
  max-width: 260px;
}
@media (max-width: 700px) {
  .usage-block__img {
    text-align: center;
    flex: 0 0 auto;
    width: 70%;
    margin: 0 auto;
  }
}

/*------------------------------------
 usage-block__list
------------------------------------*/
.usage-block__list {
}
.usage-block__list li {
	position: relative;
	padding-left: 15px;
}
.usage-block__list li::before {
	position: absolute;
	content: "\30FB";
	left: 0;
	top: .01em;
}


/*------------------------------------
 見出し
------------------------------------*/
.partner__title {
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 700;
  color: #000;
  text-align: center;
  line-height: 1.4;
  letter-spacing: 0.02em;
  border-bottom: 2px solid #335DA3;
  padding: 0 0 2.5rem;
  margin-bottom: 3rem;
}

/*------------------------------------
 ロゴ群
------------------------------------*/
.partner__logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  margin-bottom: 3rem;
}
.partner__logos img {
  height: auto;
  max-height: 90px;
  width: auto;
  max-width: 315px;
}

/*------------------------------------
 ブロックタイトル＋文
------------------------------------*/
.partner__block {
  text-align: center;
  margin-bottom: 6rem;
}
.partner__subtitle {
  color: #335DA3;
  font-weight: 700;
  font-size: clamp(1.5rem, 4vw, 2.3rem);
  margin-bottom: 1.5rem;
}
.partner__text {
  font-size: 0.95rem;
  color: #000;
  margin-bottom: 2rem;
}

@media (min-width: 481px) and  (max-width: 700px) {
  .partner__text {
    font-size: 1.3rem;
				text-align: left;
  }
}

@media (max-width: 500px) {
  .partner__text {
    text-align: left;
  }
}

/*------------------------------------
 共通ボタンスタイル
------------------------------------*/
.btn--pdf,
.btn--detail {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6em;
  background-color: #275dae;
  color: #fff;
  font-weight: 700;
  font-size: 1.1rem;
  text-decoration: none;
  border-radius: 50px;
  padding: 0.9em 2.8em;
  box-shadow: 0 5px 0 rgba(0, 0, 0, 0.15);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
}

@media (min-width: 701px) {
  .btn--pdf,
  .btn--detail {
    width: 480px;
  }
}

@media (min-width: 501px) and  (max-width: 700px)  {
  .btn--pdf,
  .btn--detail {
    width: 480px;
				font-size: 1.5rem;
				padding: 0.8em 2.8em;
  }
}

@media (max-width: 500px) {
  .btn--pdf,
  .btn--detail {
    width: 100%;
  }
}

/* hover時の軽い浮き上がり */
.btn--pdf:hover,
.btn--detail:hover {
  transform: translateY(2px);
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.1);
}

/*------------------------------------
 PDFボタン
------------------------------------*/
.btn--pdf::after {
  position: absolute;
	 right: 2rem;
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2044.6%2052.2%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%3E%20%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M20.4%2C26.3v7.7h1.4c1.2%2C0%2C2.1-.4%2C2.8-1.1.7-.7%2C1-1.7%2C1-2.9s-.4-2.1-1.1-2.8c-.7-.7-1.6-1-2.8-1h-1.4Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M10.7%2C26.2h-1.1v3.8h1.1c1.5%2C0%2C2.2-.6%2C2.2-1.9s-.7-1.9-2.2-1.9Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M44.6%2C24.3c0-2-1.2-3.8-2.8-4.7v-4.2c0-.5%2C0-1.1%2C0-1.7%2C0-.3%2C0-.5-.3-.8%2C0%2C0%2C0%2C0%2C0%2C0-1-1.1-2.1-2.1-3.1-3.1-2.7-2.7-5.4-5.4-8-8l-1.6-1.6s0%2C0%2C0%2C0c0%2C0-.2-.2-.3-.2-.1%2C0-.3%2C0-.4%2C0%2C0%2C0%2C0%2C0%2C0%2C0H4C3.4%2C0%2C2.9.5%2C2.9%2C1.1v18.5c-1.6.9-2.6%2C2.5-2.8%2C4.5-.1%2C1.7%2C0%2C3.4%2C0%2C5v6.3c0%2C1.2.2%2C2.3.8%2C3.3.5.8%2C1.2%2C1.5%2C2%2C2v4.3c0%2C2%2C0%2C4.1%2C0%2C6.1%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C.6.5%2C1.1%2C1.1%2C1.1h36.7c.6%2C0%2C1.1-.5%2C1.1-1.1v-10.5c1.7-1%2C2.8-3%2C2.8-5.2v-6.2c0-1.6%2C0-3.3%2C0-4.9ZM5.1%2C7.3V3.1c0-.3%2C0-.6%2C0-1h21.8v11.6c0%2C.6.5%2C1.1%2C1.1%2C1.1h11.6v4c-.3%2C0-.5%2C0-.8%2C0-3%2C0-6%2C0-9%2C0h-14.9c-3%2C0-6%2C0-9.1%2C0-.3%2C0-.5%2C0-.8%2C0V7.3ZM37.2%2C29.3v2.1h-3.9v4.7h-2.5v-11.8h6.8v2.1h-4.2v3h3.9ZM28.3%2C30c0%2C1.8-.6%2C3.3-1.8%2C4.4-1.2%2C1.1-2.7%2C1.7-4.6%2C1.7h-4.1v-11.8h4.1c4.2%2C0%2C6.3%2C1.9%2C6.3%2C5.8ZM15.6%2C28c0%2C1.2-.4%2C2.2-1.3%2C2.9-.9.7-2%2C1.1-3.3%2C1.1h-1.3v4.1h-2.5v-11.8h4.1c2.9%2C0%2C4.4%2C1.2%2C4.4%2C3.7ZM39.6%2C46.5v3.5H5.1v-8.7c.1%2C0%2C.3%2C0%2C.4%2C0%2C2.5.1%2C5.1%2C0%2C7.7%2C0h25.8c.2%2C0%2C.5%2C0%2C.7%2C0v5.2Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
}

/*------------------------------------
 詳細はこちらボタン
------------------------------------*/
.btn--detail::after {
  position: absolute;
	 right: 2rem;
  content: "";
  display: inline-block;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2031.7%2031.7%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20%232658a2%3B%20%7D%20.cls-2%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%3E%20%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M26.8%2C25.2h-15.4c-2.7%2C0-4.9-2.2-4.9-4.9V4.9c0-2.7%2C2.2-4.9%2C4.9-4.9h15.4c2.7%2C0%2C4.9%2C2.2%2C4.9%2C4.9v15.4c0%2C2.7-2.2%2C4.9-4.9%2C4.9ZM11.4%2C2.6c-1.2%2C0-2.2%2C1-2.2%2C2.2v15.4c0%2C1.2%2C1%2C2.2%2C2.2%2C2.2h15.4c1.2%2C0%2C2.2-1%2C2.2-2.2V4.9c0-1.2-1-2.2-2.2-2.2h-15.4Z%22%2F%3E%20%3Cg%3E%20%3Crect%20class%3D%22cls-1%22%20x%3D%221.3%22%20y%3D%227.9%22%20width%3D%2222.5%22%20height%3D%2222.5%22%20rx%3D%226.8%22%20ry%3D%226.8%22%2F%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M20.3%2C31.7H4.9c-2.7%2C0-4.9-2.2-4.9-4.9v-15.4c0-2.7%2C2.2-4.9%2C4.9-4.9h15.4c2.7%2C0%2C4.9%2C2.2%2C4.9%2C4.9v15.4c0%2C2.7-2.2%2C4.9-4.9%2C4.9ZM4.9%2C9.2c-1.2%2C0-2.2%2C1-2.2%2C2.2v15.4c0%2C1.2%2C1%2C2.2%2C2.2%2C2.2h15.4c1.2%2C0%2C2.2-1%2C2.2-2.2v-15.4c0-1.2-1-2.2-2.2-2.2H4.9Z%22%2F%3E%20%3C%2Fg%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M7.3%2C7.9h10.5c3.3%2C0%2C6%2C2.7%2C6%2C6v.8H1.3v-.8c0-3.3%2C2.7-6%2C6-6Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
}



/*------------------------------------
 全体構成
------------------------------------*/
#otoku-partner {
  position: relative;
  margin-top: 11rem; /* 吹き出し分の上余白 */
}

/*------------------------------------
 背景エリア（ピンクオレンジ）
------------------------------------*/
.partner-area {
  background-color: #ee7b65;
  text-align: center;
  padding: 3rem 1rem 4rem;
  border-radius: 0;
}

/*------------------------------------
 見出し
------------------------------------*/
.partner-area__title {
  color: #fff;
  font-weight: 700;
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  margin-bottom: 1rem;
  letter-spacing: 0.03em;
}

/*
------------------------------------
 ボタン
------------------------------------
*/

.partner-area__btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 1rem;
 background: #fff;
 color: #000;
 font-weight: 700;
 font-size: 1.05rem;
 border-radius: 40px;
 padding: 0.7em 2.5em;
 box-shadow: 0 6px 0 rgba(0, 0, 0, 0.25);
 text-decoration: none;
 transition: all 0.25s ease;
 position: relative;
}
@media (min-width: 701px) {
 .partner-area__btn {
  width: 330px;
 }
}
@media (max-width: 700px) {
 .partner-area__btn {
  width: 300px;
 }
}
@media (max-width: 600px) {
 .partner-area__btn {
  width: 28rem;
 }
}
@media (max-width: 480px) {
 .partner-area__btn {
  width: 100%;
 }
}
@media (max-width: 350px) {
 .partner-area__btn {
  width: 100%;
 }
}
.partner-area__btn:hover {
 transform: translateY(2px);
 box-shadow: 0 3px 0 rgba(0, 0, 0, 0.15);
}
/* 矢印アイコン（黒） */
.partner-area__btn::after {
 content: "";
 display: inline-block;
 width: 10px;
 height: 10px;
 border-right: 3px solid #000;
 border-bottom: 3px solid #000;
 transform: rotate(-45deg);
 transition: transform 0.2s ease;
 position: absolute;
 right: 1rem;
}
.partner-area__btn:hover::after {
 transform: rotate(-45deg) translateX(3px);
}

/*
------------------------------------
 吹き出し
------------------------------------
*/

.bubble {
 position: absolute;
 top: -5rem;
 left: 50%;
 transform: translateX(-50%);
 background: #fff;
 border: 3px solid #d40000;
 border-radius: 50px;
 padding: 0.2rem 1.6rem;
 display: inline-block;
 margin-bottom: 1.2rem;
 width: 80%;
 box-sizing: border-box;
}
@media (min-width: 701px) {
 .bubble {
  width: 320px;
 }
}
@media (max-width: 700px) {
 .bubble {
  width: 300px;
		border: 2px solid #d40000;
		 padding: 0.1rem 1.6rem;
 }
}
@media (max-width: 600px) {
 .bubble {
  width: 28rem;
 }
}
@media (max-width: 480px) {
 .bubble {
 width: calc(100% - 40px);
 }
}
@media (max-width: 350px) {
 .bubble {
  width: 80%;
 }
}
.bubble::after {
 content: "";
 position: absolute;
 bottom: -8px;
 left: 50%;
 transform: translateX(-50%) rotate(45deg);
 width: 12px;
 height: 12px;
 background: #fff;
 border-right: 3px solid #d40000;
 border-bottom: 3px solid #d40000;
}
@media (max-width: 700px) {
 .bubble::after {
  border-right: 2px solid #d40000;
		border-bottom: 2px solid #d40000;
 }
}
.bubble img {
 display: block;
 margin: 0 auto;
}
@media (min-width: 1001px) {
 .bubble img {
  width: auto;
  max-width: none;
  height: 2.2rem;
 }
}
@media (max-width: 1000px) {
 .bubble img {
  width: 100%;
  height: auto;
 }
}

@media (max-width: 480px) {
 .bubble img {
  width: 80%;
  height: auto;
 }
}