@charset "UTF-8";
/* ----------------------------------
 COMMON SETTEING
-----------------------------------*/
.cp_breadcrumb {
  margin: 0 auto;
  max-width: 992px;
  padding: 0 16px;
}

.cp_block {
  max-width: none;
}

/* ----------------------------------
   セクションの共通クラス
  -----------------------------------*/
.cp_section {
  padding: clamp(32px, 8.5333333333vw, 40px) 16px;
}
.cp_section img {
  vertical-align: bottom;
  width: 100%;
}

/* ----------------------------------
   ボタン
  -----------------------------------*/
.cp_btn {
  --bg-color: #cc0033;
  --text-color: #fff;
  background: var(--bg-color);
  color: var(--text-color);
  display: inline-block;
  font-size: clamp(20px, 6.25vw, 24px);
  font-weight: 600;
  line-height: 1.3;
  padding: 12px 1.5em;
  position: relative;
  text-align: center;
  transition: opacity 0.3s;
  width: 100%;
}
.cp_btn:hover {
  opacity: 0.7;
}
.cp_btn > span {
  display: inline-block;
}
.cp_btn--border {
  --border-color: #000;
  border: solid 1px var(--border-color);
}
.cp_btn--three-d {
  --shadow-color: #920528;
  --shadow-x: 0px;
  --shadow-y: 4px;
  box-shadow: var(--shadow-x) var(--shadow-y) 0 var(--shadow-color);
  transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
}
.cp_btn--three-d:hover {
  box-shadow: 0px 0px var(--shadow-color);
  opacity: 1;
  transform: translateY(var(--shadow-y));
}
.cp_btn--arrow {
  --arrow-color: white;
  --arrow-weight: 3px;
  --arrow-right-margin: 16px;
  --arrow-size: 12px;
}
.cp_btn--arrow::after {
  content: "";
  width: var(--arrow-size);
  height: var(--arrow-size);
  position: absolute;
  right: var(--arrow-right-margin);
  top: 50%;
  border-top: var(--arrow-weight) solid var(--arrow-color);
  border-right: var(--arrow-weight) solid var(--arrow-color);
  transform: translateY(-50%) rotate(45deg);
}
.cp_btn--disabled {
  --shadow-color: #6c6c6c !important;
  --bg-color: #a1a1a1 !important;
  pointer-events: none;
}

/* ----------------------------------
   チェックボックス
  -----------------------------------*/
.cp_check-box {
  border-bottom: 1px solid #A1A1A1;
  border-top: 1px solid #A1A1A1;
  padding: 0.5em 0;
  text-align: center;
}
.cp_check-box > input[type=checkbox] {
  -webkit-appearance: checkbox;
  display: inline-block;
  line-height: 1;
  margin-right: 0.25em;
  vertical-align: -0.05em;
  visibility: visible;
}
.cp_check-box > label {
  font-size: clamp(13px, 4.0625vw, 16px);
  line-height: 1;
  margin: 0;
}

/* ----------------------------------
   コラム
  -----------------------------------*/
.cp_column {
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
  background: #fff;
  border-radius: 12px;
  padding-top: 44px;
  padding-right: 16px;
  padding-bottom: 24px;
  padding-left: 16px;
  position: relative;
  text-align: center;
  font-weight: 600;
  display: grid;
  row-gap: 16px;
  max-width: 500px;
  margin: 0 auto;
  width: 100%;
}
.cp_column__title {
  height: 48px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -41.6666666667%);
}
.cp_column__title > img {
  height: 100%;
}
.cp_column__book-cover {
  width: 42.1221864952%;
  margin: 0 auto;
}
.cp_column__price {
  line-height: 1 !important;
}
.cp_column__magazine-list {
  display: flex;
  -moz-column-gap: 16px;
  column-gap: 16px;
}
.cp_column__magazine-logo {
  margin-bottom: 12px;
}

/* ----------------------------------
   吹き出し
  -----------------------------------*/
.cp_fukidashi {
  --triangle-height: 12px;
  --triangle-width: 24px;
  background: #fff;
  border-radius: 8px;
  color: #000;
  display: inline-block;
  font-size: clamp(20px, 6.25vw, 24px);
  font-weight: 600;
  line-height: 1;
  padding: 12px 1.5em;
  position: relative;
  text-align: center;
  width: 100%;
}
.cp_fukidashi:after {
  background: #fff;
  bottom: 1px;
  -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  content: "";
  height: var(--triangle-height);
  left: 50%;
  position: absolute;
  transform: translate(-50%, 100%);
  width: var(--triangle-width);
}

/* ----------------------------------
   最大角丸ボタン
  -----------------------------------*/
.cp_full-rounded-btn {
  --bg-color: red;
  --text-color: white;
  --round-radius: 9999px;
  background: var(--bg-color);
  color: var(--text-color);
  display: inline-block;
  font-size: clamp(20px, 6.25vw, 24px);
  font-weight: 600;
  line-height: 1.3;
  padding: 12px 1.5em;
  position: relative;
  text-align: center;
  transition: opacity 0.3s;
  width: 100%;
  border-radius: var(--round-radius);
}
.cp_full-rounded-btn:hover {
  opacity: 0.7;
}
.cp_full-rounded-btn--border {
  --border-color: #000;
  border: solid 1px var(--border-color);
}
.cp_full-rounded-btn--three-d {
  --shadow-color: #D90041;
  --shadow-x: 0px;
  --shadow-y: 4px;
  box-shadow: var(--shadow-x) var(--shadow-y) 0 var(--shadow-color);
  transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
}
.cp_full-rounded-btn--three-d:hover {
  box-shadow: 0px 0px var(--shadow-color);
  opacity: 1;
  transform: translateY(var(--shadow-y));
}
.cp_full-rounded-btn--arrow {
  --arrow-color: white;
  --arrow-weight: 3px;
  --arrow-right-margin: 16px;
  --arrow-size: 12px;
  --arrow-deg: 45deg;
}
.cp_full-rounded-btn--arrow::after {
  content: "";
  width: var(--arrow-size);
  height: var(--arrow-size);
  position: absolute;
  right: var(--arrow-right-margin);
  top: 50%;
  border-top: var(--arrow-weight) solid var(--arrow-color);
  border-right: var(--arrow-weight) solid var(--arrow-color);
  transform: translateY(-50%) rotate(var(--arrow-deg));
}
.cp_full-rounded-btn--disabled {
  --shadow-color: #6c6c6c !important;
  --bg-color: gray !important;
  pointer-events: none !important;
}

/* ----------------------------------
   両端に水平線のライン
  -----------------------------------*/
.cp_horizontal-line {
  --gap: 0.25em;
  --line-weight: 2px;
  --line-length: 1.5em;
  --line-color: red;
  display: flex;
  align-items: center;
  justify-content: center;
  -moz-column-gap: var(--gap);
  column-gap: var(--gap);
}
.cp_horizontal-line::before, .cp_horizontal-line::after {
  content: "";
  height: var(--line-weight);
  width: var(--line-length);
  background: var(--line-color);
  vertical-align: bottom;
}

/* ----------------------------------
   KV
  -----------------------------------*/
.cp_KV {
  background: url(../img/kv/bg.jpg) no-repeat;
  background-size: cover;
}
.cp_KV__img {
  max-width: 960px;
  margin: 0 auto;
}
.cp_KV__img > img {
  width: 100%;
}

/* レスポンシブルな開き線のあしらい */
.cp_open-line {
  --gap: 0.25em;
  --line-weight: 2px;
  --line-length: 1.5em;
  --line-color: red;
  --line-deg: 45deg;
  display: flex;
  align-items: center;
  -moz-column-gap: var(--gap);
  column-gap: var(--gap);
  justify-content: center;
}
.cp_open-line::before, .cp_open-line::after {
  content: "";
  height: var(--line-weight);
  width: var(--line-length);
  background: var(--line-color);
  vertical-align: bottom;
}
.cp_open-line::before {
  transform: rotate(var(--line-deg));
}
.cp_open-line::after {
  transform: rotate(calc(-1 * var(--line-deg)));
}

/* ----------------------------------
   本CP汎用ボタン
  -----------------------------------*/
.cp_primary-btn {
  --bg-color: red;
  --text-color: white;
  --round-radius: 9999px;
  --arrow-color: white;
  --arrow-weight: 3px;
  --arrow-right-margin: 20px;
  --arrow-size: 9px;
  --arrow-deg: 45deg;
  --shadow-color: #be0030;
  --shadow-x: 0px;
  --shadow-y: 4px;
  --arrow-translate-y: -50%;
  background: var(--bg-color);
  color: var(--text-color);
  display: inline-block;
  font-size: clamp(20px, 6.25vw, 22px);
  font-weight: 600;
  line-height: 1.3;
  padding: 14px 1.5em;
  position: relative;
  text-align: center;
  width: 100%;
  border-radius: var(--round-radius);
  box-shadow: var(--shadow-x) var(--shadow-y) 0 var(--shadow-color);
  transition: transform 0.3s, box-shadow 0.3s, background 0.3s, opacity 0.3s;
}
.cp_primary-btn::after {
  content: "";
  width: var(--arrow-size);
  height: var(--arrow-size);
  position: absolute;
  right: var(--arrow-right-margin);
  top: 50%;
  border-top: var(--arrow-weight) solid var(--arrow-color);
  border-right: var(--arrow-weight) solid var(--arrow-color);
  transform: translateY(var(--arrow-translate-y)) rotate(var(--arrow-deg));
}
.cp_primary-btn:hover {
  box-shadow: 0px 0px var(--shadow-color);
  opacity: 1;
  transform: translateY(var(--shadow-y));
  color: var(--text-color);
}
.cp_primary-btn--blue {
  --bg-color: #3A70FC;
  --shadow-color: #0015D0;
}
.cp_primary-btn--orange {
  --bg-color: #FF9900;
  --shadow-color: #FF7A00;
}
.cp_primary-btn--green {
  --bg-color: #3F8E4A;
  --shadow-color: #006A0F;
}
.cp_primary-btn--arrow-bottom {
  --arrow-deg: 135deg;
  --arrow-translate-y: calc(-50% - 2px);
}
.cp_primary-btn--disabled {
  --shadow-color: #6c6c6c !important;
  --bg-color: gray !important;
  pointer-events: none !important;
}

/* レスポンシブルなリボン */
.cp_ribbon {
  --notch: 10px;
  --bg-color: orange;
  --text-color: white;
  background: var(--bg-color);
  color: var(--text-color);
  padding: 0.5em;
  width: calc(100% - var(--notch) * 2);
  margin: 0 auto;
  position: relative;
  box-sizing: border-box;
  display: grid;
  place-items: center;
}
.cp_ribbon::before, .cp_ribbon::after {
  content: "";
  position: absolute;
  width: calc(var(--notch) + 1px);
  height: 100%;
  background: var(--bg-color);
  top: 0;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 90% 50%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 90% 50%);
}
.cp_ribbon::before {
  left: calc(var(--notch) * -1);
}
.cp_ribbon::after {
  right: calc(var(--notch) * -1);
  transform: scaleX(-1);
}

/* ----------------------------------
   角丸ボタン
  -----------------------------------*/
.cp_rounded-btn {
  --bg-color: red;
  --text-color: white;
  --round-radius: 8px;
  background: var(--bg-color);
  color: var(--text-color);
  display: inline-block;
  font-size: clamp(20px, 6.25vw, 24px);
  font-weight: 600;
  line-height: 1.3;
  padding: 12px 1.5em;
  position: relative;
  text-align: center;
  transition: opacity 0.3s;
  width: 100%;
  border-radius: var(--round-radius);
}
.cp_rounded-btn:hover {
  opacity: 0.7;
}
.cp_rounded-btn--border {
  --border-color: #000;
  border: solid 1px var(--border-color);
}
.cp_rounded-btn--three-d {
  --shadow-color: #D90041;
  --shadow-x: 0px;
  --shadow-y: 4px;
  box-shadow: var(--shadow-x) var(--shadow-y) 0 var(--shadow-color);
  transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
}
.cp_rounded-btn--three-d:hover {
  box-shadow: 0px 0px var(--shadow-color);
  opacity: 1;
  transform: translateY(var(--shadow-y));
}
.cp_rounded-btn--arrow {
  --arrow-color: white;
  --arrow-weight: 3px;
  --arrow-right-margin: 16px;
  --arrow-size: 12px;
  --arrow-deg: 45deg;
}
.cp_rounded-btn--arrow::after {
  content: "";
  width: var(--arrow-size);
  height: var(--arrow-size);
  position: absolute;
  right: var(--arrow-right-margin);
  top: 50%;
  border-top: var(--arrow-weight) solid var(--arrow-color);
  border-right: var(--arrow-weight) solid var(--arrow-color);
  transform: translateY(-50%) rotate(var(--arrow-deg));
}
.cp_rounded-btn--disabled {
  --shadow-color: #6c6c6c !important;
  --bg-color: gray !important;
  pointer-events: none !important;
}

/* ----------------------------------
   小さめボタン
  -----------------------------------*/
.cp_small-btn {
  --key-color: #F3003D;
  --sub-color: #fff;
  --height: auto;
  display: grid;
  place-items: center;
  background: var(--key-color);
  color: var(--sub-color);
  border-radius: 9999px;
  text-decoration: none;
  width: 100%;
  font-size: clamp(12px, 3.75vw, 15px);
  padding: 6px 0;
  line-height: 1.7;
  transition: opacity 0.3s;
  height: var(--height);
}
.cp_small-btn:hover {
  color: var(--sub-color);
}
.cp_small-btn--border {
  border: solid 2px var(--key-color);
  color: var(--key-color);
  background: var(--sub-color);
}
.cp_small-btn--border:hover {
  color: var(--key-color);
}
.cp_small-btn--green {
  --key-color: #3F8E4A;
}
.cp_small-btn--orange {
  --key-color: #FF9900;
}
.cp_small-btn--disabled {
  --key-color: gray !important;
  pointer-events: none !important;
}

/* ----------------------------------
   三角形
  -----------------------------------*/
.cp_triangle {
  --triangle-width: 18px;
  --triangle-height: 12px;
  --triangle-color: red;
  width: var(--triangle-width);
  height: var(--triangle-height);
  background: var(--triangle-color);
  -webkit-clip-path: polygon(0 0, 100% 0, 50% 100%);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  margin: 0 auto;
}
.cp_triangle--red {
  --triangle-color: #F3003D;
}
.cp_triangle--blue {
  --triangle-color: blue;
}
.cp_triangle--green {
  --triangle-color: #009872;
}

/*-----------------------
  close対応　
  ------------------------*/
.cp_attention__txt {
  border: 2px solid;
  color: #cc0033;
  font-size: 16px;
  font-weight: 600;
  margin: 15px 3%;
  padding: 3% 30px;
  text-align: center;
  background: #fff;
}
@media all and (min-width: 1000px) {
  .cp_attention__txt {
    margin: 0 0 15px;
  }
}

.close_btn a {
  pointer-events: none;
}

/*-----------------------------------
 各キャンペーンのエントリー
------------------------------------*/
.cp_bnrs__ribbon {
  --bg-color: #3F8E4A;
}
.cp_bnrs__title-text {
  width: min(72vw, 360px);
  margin-bottom: 0;
  line-height: 1;
}
.cp_bnrs__list-bnrs {
  display: grid;
  row-gap: 16px;
}
.cp_bnrs__list-item {
  width: 100%;
}
.cp_bnrs__list-item img {
  width: 100%;
}
.cp_bnrs__list-item > a {
  transition: opacity 0.3s;
}
.cp_bnrs__list-item > a:hover {
  opacity: 0.7;
}

.cp_coupon {
  background: #FEF2F0;
  padding-bottom: clamp(40px, 10.6666666667vw, 64px);
}
.cp_coupon__inner {
  display: grid;
  row-gap: clamp(48px, 12.8vw, 64px);
}
.cp_coupon__target-works {
  display: grid;
  row-gap: clamp(16px, 4.2666666667vw, 32px);
  justify-items: center;
}
.cp_coupon__title {
  height: clamp(36px, 9.6vw, 60px);
  margin-bottom: -2px;
}
.cp_coupon__title > img {
  height: 100%;
}
.cp_coupon__guide {
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
  background: #fff;
  border-radius: 12px;
  padding: 12px 16px;
  font-size: clamp(13px, 3.4666666667vw, 15px);
  font-weight: 600;
  border-radius: 12px;
  max-width: 640px;
  width: 100%;
}
.cp_coupon__guide__inner {
  display: flex;
  -moz-column-gap: clamp(12px, 3.2vw, 16px);
  column-gap: clamp(12px, 3.2vw, 16px);
  align-items: center;
  justify-content: center;
}
.cp_coupon__guide__inner > p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.cp_coupon__guide__inner > p > br {
  display: none;
}
@media screen and (min-width: 768px) {
  .cp_coupon__guide__inner > p > br {
    display: inline-block;
  }
}
.cp_coupon__coupon-get-icon {
  width: clamp(56px, 20%, 64px);
}
.cp_coupon__attention {
  font-size: 14px;
}
.cp_coupon__attention a {
  color: #000;
  text-decoration: underline;
}

.cp_desc {
  background: #FFFDC5;
}
.cp_desc__title {
  background: #E8FF00;
  padding: min(3.2%, 16px) 16px;
  position: relative;
  margin-bottom: 0;
  text-align: center;
  filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 0.15));
}
.cp_desc__title:after {
  background: #E8FF00;
  bottom: 1px;
  -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  content: "";
  height: 8px;
  left: 50%;
  position: absolute;
  transform: translate(-50%, 100%);
  width: 16px;
}
.cp_desc__title > img {
  max-width: 640px;
  display: inline-block;
}
.cp_desc__inner {
  display: flex;
  flex-direction: column;
  row-gap: 48px;
  max-width: 768px;
  margin: 0 auto;
}
.cp_desc__coupons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  row-gap: 24px;
  -moz-column-gap: 32px;
  column-gap: 32px;
}
.cp_desc__coupon {
  opacity: 0;
  transition: opacity 0.3s, transform 0.5s;
  transform: translateY(20px);
  filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 0.15));
}
.cp_desc__coupon--is-show {
  opacity: 1;
  transform: translateY(0);
}
.cp_desc img {
  width: 100%;
}
.cp_desc__annotation {
  grid-column: 1/-1;
}

.cp_entry {
  display: grid;
  row-gap: 16px;
}
.cp_entry__annotation {
  font-size: 14px;
}
.cp_entry__annotation a {
  color: #000;
  text-decoration: underline;
}
.cp_entry__annotation > ul {
  padding-left: 1em;
  text-indent: -1em;
}

/* 利用方法 */
.cp_how-to-use {
  display: grid;
  row-gap: clamp(24px, 6.4vw, 32px);
}
.cp_how-to-use__steps {
  padding: 0;
  display: grid;
  row-gap: clamp(12px, 3.2vw, 16px);
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
}
.cp_how-to-use__step {
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
  background: #fff;
  border-radius: 12px;
  padding: 24px 16px;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .cp_how-to-use__step p > span {
    display: inline-block;
  }
}
.cp_how-to-use__step__inner {
  row-gap: 16px;
  display: grid;
  max-width: 375px;
  margin: 0 auto;
}
.cp_how-to-use__num {
  height: clamp(32px, 8.5333333333vw, 44px);
}
.cp_how-to-use__num > img {
  height: 100%;
}
.cp_how-to-use__capture {
  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.3));
  position: relative;
}
.cp_how-to-use__capture::before {
  content: "例";
  position: absolute;
  width: 32px;
  height: 32px;
  top: 0;
  left: 0;
  transform: translate(-25%, -25%);
  display: grid;
  place-items: center;
  background: #fff;
  border: solid 2px #F3003D;
  border-radius: 9999px;
  color: #F3003D;
  font-size: 16px;
}
.cp_how-to-use__open-line {
  --line-weight: 3px;
  --line-length: 1.25em;
  --line-color: #FF94AF;
  --line-deg: 60deg;
  font-weight: 600;
  font-size: clamp(14px, 4.375vw, 16px);
  margin-bottom: 8px;
}

.cp_lead {
  background: #ceffe5;
}
.cp_lead__inner {
  display: flex;
  flex-direction: column;
  row-gap: clamp(24px, 6.4vw, 36px);
  max-width: 500px;
  margin: 0 auto;
}
.cp_lead__text {
  width: 93.2944606414%;
  margin: 0 auto;
}

/*-----------------------
  期間
  ------------------------*/
.cp_period {
  background: #009872;
  text-align: center;
  font-weight: 600;
  padding-top: clamp(8px, 2.5vw, 10px);
  padding-bottom: clamp(4px, 1.25vw, 6px);
  font-size: clamp(9px, 2.8125vw, 14px);
}
.cp_period__inner {
  display: grid;
  row-gap: clamp(2px, 0.625vw, 4px);
  max-width: 640px;
  margin: 0 auto;
  color: #fff;
}
.cp_period__date {
  background: #fff;
  color: #009872;
  border-radius: 4px;
  padding: clamp(2px, 0.625vw, 4px) clamp(2px, 0.625vw, 6px);
}

.cp_readme {
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
  background: #fff;
  border-radius: 12px;
  padding: 16px;
  font-size: 14px;
  display: grid;
  row-gap: 8px;
}
.cp_readme__title {
  --color: green;
  color: var(--color);
  font-size: 16px;
  text-align: center;
  margin-bottom: var(--row-gap);
  line-height: 1.7;
}
.cp_readme__title--green {
  --color: green;
}
.cp_readme__inner {
  display: grid;
  row-gap: 8px;
  line-height: 1.7;
}
.cp_readme__inner a {
  color: #000;
  text-decoration: underline;
}
.cp_readme__sub-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25em;
}
.cp_readme__sub-heading::before, .cp_readme__sub-heading::after {
  content: "";
  width: 1em;
  height: 2px;
  background: #009872;
  display: inline-block;
}

/*-----------------------------------
 作品リスト
------------------------------------*/
.cp_shelf {
  --col-num: 2;
  display: grid;
  -moz-column-gap: 4.6647230321%;
  column-gap: 4.6647230321%;
  row-gap: clamp(24px, 6.4vw, 36px);
  grid-template-columns: repeat(var(--col-num), 1fr);
  font-weight: 600;
  width: 100%;
  max-width: 640px;
}
.cp_shelf__item-container {
  display: grid;
  row-gap: 8px;
  grid-template-rows: 1fr clamp(170px, 53.125vw, 180px);
  height: 100%;
  transition: 0.3s;
  text-align: center;
}
.cp_shelf__btns {
  display: grid;
  row-gap: 12px;
}
.cp_shelf__sub-btns {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  row-gap: 8px;
}
.cp_shelf__thumbnail {
  border: 1px solid #ccc;
  background: #fff;
  transition: opacity 0.3s;
}
.cp_shelf__thumbnail > img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.cp_shelf__trial {
  display: grid;
  row-gap: 4px;
  width: 100%;
}
.cp_shelf__catch {
  --gap: 0.05em;
  --line-length: 1.25em;
  --line-color: #91B997;
  --line-deg: 60deg;
  text-align: center;
  font-size: clamp(10px, 3.125vw, 13.5px);
}
.cp_shelf__btn--get {
  font-size: clamp(13px, 4.0625vw, 18px);
  padding: 12px 0;
}
.cp_shelf__btn--trial {
  font-size: clamp(10.5px, 3.28125vw, 15px);
  --height: 40px;
}
.cp_shelf__btn--list {
  --height: 40px;
}

.cp_sub {
  background: #E9FFF2;
}
.cp_sub__header {
  background: #3F8E4A;
  padding: clamp(12px, 3.2vw, 16px) 16px;
  position: relative;
}
.cp_sub__header img {
  width: 100%;
}
.cp_sub__header__inner {
  position: relative;
  max-width: 640px;
  margin: 0 auto;
}
.cp_sub__catch {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(69.3333333333%, 360px);
}
.cp_sub__title {
  width: 100%;
  margin-bottom: 8px;
}
.cp_sub__date {
  background: #fff;
  color: #3F8E4A;
  font-weight: 600;
  text-align: center;
  border-radius: 4px;
  padding: clamp(2px, 0.625vw, 4px) clamp(2px, 0.625vw, 6px);
  font-size: clamp(10.5px, 3.28125vw, 14px);
}
.cp_sub__inner {
  display: grid;
  row-gap: clamp(32px, 8.5333333333vw, 48px);
  padding-top: clamp(16px, 4.2666666667vw, 24px);
  max-width: 500px;
  margin: 0 auto;
}
.cp_sub__desc {
  display: grid;
  row-gap: clamp(24px, 6.4vw, 36px);
}
.cp_sub__lead {
  font-size: 14px;
  display: grid;
  row-gap: 8px;
}

.cp_term {
  --key-color: #F3003D;
  display: grid;
  row-gap: 8px;
  justify-items: center;
}
.cp_term--green {
  --key-color: #3F8E4A;
}
.cp_term__title {
  --gap: 6px;
  --line-weight: 2px;
  --line-length: 1.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  -moz-column-gap: var(--gap);
  column-gap: var(--gap);
  font-size: clamp(14px, 4.375vw, 16px);
  font-weight: 600;
  margin-bottom: 8px;
  max-width: 500px;
  width: 100%;
  text-align: center;
}
.cp_term__title::before, .cp_term__title::after {
  content: "";
  height: var(--line-weight);
  flex-grow: 1;
  background: var(--key-color);
  vertical-align: bottom;
}
.cp_term__inner {
  max-width: 500px;
  background: #fff;
  padding: 16px;
  border: 2px solid #FDCCD9;
  font-size: 14px;
  aspect-ratio: 1/1;
  overflow: scroll;
}
.cp_term__inner--green {
  border: 2px solid #abdfb2;
}
.cp_term__lead {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 8px;
}
.cp_term__list {
  display: grid;
  row-gap: 8px;
}
.cp_term__list dt {
  font-size: 16px;
}
.cp_term__list dt::before {
  content: "■";
  color: var(--key-color);
}

/* ----------------------------------
   ユーティリティクラス
  -----------------------------------*/
@media screen and (min-width: 576px) {
  .cp_u__sm\:hidden {
    display: none;
  }
}
.cp_u__text-link {
  color: #000;
  text-decoration: underline;
}
.cp_u__text-center {
  text-align: center;
}
.cp_u__text-left {
  text-align: left;
}
.cp_u__text-underline {
  text-decoration: underline !important;
}
.cp_u__hover\:text-underline:hover {
  text-decoration: underline !important;
}
.cp_u__border-bottom_1 {
  border-bottom: 1px solid currentColor !important;
}
.cp_u__animation-none {
  -webkit-animation: none !important;
  animation: none !important;
}
.cp_u__relative {
  position: relative;
}
.cp_u__select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.cp_u__events-none {
  pointer-events: none;
}
.cp_u__grayscale {
  filter: grayscale(1);
}
.cp_u__list-indent {
  padding-left: 1em;
  text-indent: -1em;
}
.cp_u__inline-block {
  display: inline-block !important;
}
.cp_u__flex {
  display: flex;
}
.cp_u__flex-col {
  display: flex;
  flex-direction: column;
}
.cp_u__m-0-auto {
  margin: 0 auto;
}
.cp_u__w-full {
  width: 100%;
}
.cp_u__grid {
  --row-gap: 1rem;
  --column-gap: 1rem;
  display: grid;
}
.cp_u__row-gap-0 {
  --row-gap: 0px;
}
.cp_u__column-gap-0 {
  --column-gap: 0px;
}
.cp_u__row-gap-4 {
  --row-gap: 4px;
}
.cp_u__column-gap-4 {
  --column-gap: 4px;
}
.cp_u__row-gap-8 {
  --row-gap: 8px;
}
.cp_u__column-gap-8 {
  --column-gap: 8px;
}
.cp_u__row-gap-12 {
  --row-gap: 12px;
}
.cp_u__column-gap-12 {
  --column-gap: 12px;
}
.cp_u__row-gap-16 {
  --row-gap: 16px;
}
.cp_u__column-gap-16 {
  --column-gap: 16px;
}
.cp_u__row-gap-20 {
  --row-gap: 20px;
}
.cp_u__column-gap-20 {
  --column-gap: 20px;
}
.cp_u__row-gap-24 {
  --row-gap: 24px;
}
.cp_u__column-gap-24 {
  --column-gap: 24px;
}
.cp_u__row-gap-28 {
  --row-gap: 28px;
}
.cp_u__column-gap-28 {
  --column-gap: 28px;
}
.cp_u__row-gap-32 {
  --row-gap: 32px;
}
.cp_u__column-gap-32 {
  --column-gap: 32px;
}
.cp_u__row-gap-36 {
  --row-gap: 36px;
}
.cp_u__column-gap-36 {
  --column-gap: 36px;
}
.cp_u__row-gap-40 {
  --row-gap: 40px;
}
.cp_u__column-gap-40 {
  --column-gap: 40px;
}
.cp_u__row-gap-44 {
  --row-gap: 44px;
}
.cp_u__column-gap-44 {
  --column-gap: 44px;
}
.cp_u__row-gap-48 {
  --row-gap: 48px;
}
.cp_u__column-gap-48 {
  --column-gap: 48px;
}
.cp_u__row-gap-52 {
  --row-gap: 52px;
}
.cp_u__column-gap-52 {
  --column-gap: 52px;
}
.cp_u__row-gap-56 {
  --row-gap: 56px;
}
.cp_u__column-gap-56 {
  --column-gap: 56px;
}
.cp_u__row-gap-60 {
  --row-gap: 60px;
}
.cp_u__column-gap-60 {
  --column-gap: 60px;
}
.cp_u__row-gap-64 {
  --row-gap: 64px;
}
.cp_u__column-gap-64 {
  --column-gap: 64px;
}
.cp_u__row-gap-68 {
  --row-gap: 68px;
}
.cp_u__column-gap-68 {
  --column-gap: 68px;
}
.cp_u__row-gap-72 {
  --row-gap: 72px;
}
.cp_u__column-gap-72 {
  --column-gap: 72px;
}
.cp_u__row-gap-76 {
  --row-gap: 76px;
}
.cp_u__column-gap-76 {
  --column-gap: 76px;
}
.cp_u__row-gap-80 {
  --row-gap: 80px;
}
.cp_u__column-gap-80 {
  --column-gap: 80px;
}
.cp_u__place-items-center {
  place-items: center;
}
.cp_u__opacity-0 {
  opacity: 0 !important;
}
.cp_u__opacity-10 {
  opacity: 0.1 !important;
}
.cp_u__opacity-20 {
  opacity: 0.2 !important;
}
.cp_u__opacity-30 {
  opacity: 0.3 !important;
}
.cp_u__opacity-40 {
  opacity: 0.4 !important;
}
.cp_u__opacity-50 {
  opacity: 0.5 !important;
}
.cp_u__opacity-60 {
  opacity: 0.6 !important;
}
.cp_u__opacity-70 {
  opacity: 0.7 !important;
}
.cp_u__opacity-80 {
  opacity: 0.8 !important;
}
.cp_u__opacity-90 {
  opacity: 0.9 !important;
}
.cp_u__opacity-100 {
  opacity: 1 !important;
}
.cp_u__pt-0 {
  padding-top: 0px !important;
}
.cp_u__pl-0 {
  padding-left: 0px !important;
}
.cp_u__pb-0 {
  padding-bottom: 0px !important;
}
.cp_u__px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.cp_u__py-0 {
  padding-bottom: 0px !important;
  padding-top: 0px !important;
}
.cp_u__mt-0 {
  margin-top: 0px !important;
}
.cp_u__mb-0 {
  margin-bottom: 0px !important;
}
.cp_u__ml-0 {
  margin-left: 0px !important;
}
.cp_u__mr-0 {
  margin-right: 0px !important;
}
.cp_u__pt-4 {
  padding-top: 4px !important;
}
.cp_u__pl-4 {
  padding-left: 4px !important;
}
.cp_u__pb-4 {
  padding-bottom: 4px !important;
}
.cp_u__px-4 {
  padding-left: 4px !important;
  padding-right: 4px !important;
}
.cp_u__py-4 {
  padding-bottom: 4px !important;
  padding-top: 4px !important;
}
.cp_u__mt-4 {
  margin-top: 4px !important;
}
.cp_u__mb-4 {
  margin-bottom: 4px !important;
}
.cp_u__ml-4 {
  margin-left: 4px !important;
}
.cp_u__mr-4 {
  margin-right: 4px !important;
}
.cp_u__pt-8 {
  padding-top: 8px !important;
}
.cp_u__pl-8 {
  padding-left: 8px !important;
}
.cp_u__pb-8 {
  padding-bottom: 8px !important;
}
.cp_u__px-8 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
.cp_u__py-8 {
  padding-bottom: 8px !important;
  padding-top: 8px !important;
}
.cp_u__mt-8 {
  margin-top: 8px !important;
}
.cp_u__mb-8 {
  margin-bottom: 8px !important;
}
.cp_u__ml-8 {
  margin-left: 8px !important;
}
.cp_u__mr-8 {
  margin-right: 8px !important;
}
.cp_u__pt-12 {
  padding-top: 12px !important;
}
.cp_u__pl-12 {
  padding-left: 12px !important;
}
.cp_u__pb-12 {
  padding-bottom: 12px !important;
}
.cp_u__px-12 {
  padding-left: 12px !important;
  padding-right: 12px !important;
}
.cp_u__py-12 {
  padding-bottom: 12px !important;
  padding-top: 12px !important;
}
.cp_u__mt-12 {
  margin-top: 12px !important;
}
.cp_u__mb-12 {
  margin-bottom: 12px !important;
}
.cp_u__ml-12 {
  margin-left: 12px !important;
}
.cp_u__mr-12 {
  margin-right: 12px !important;
}
.cp_u__pt-16 {
  padding-top: 16px !important;
}
.cp_u__pl-16 {
  padding-left: 16px !important;
}
.cp_u__pb-16 {
  padding-bottom: 16px !important;
}
.cp_u__px-16 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.cp_u__py-16 {
  padding-bottom: 16px !important;
  padding-top: 16px !important;
}
.cp_u__mt-16 {
  margin-top: 16px !important;
}
.cp_u__mb-16 {
  margin-bottom: 16px !important;
}
.cp_u__ml-16 {
  margin-left: 16px !important;
}
.cp_u__mr-16 {
  margin-right: 16px !important;
}
.cp_u__pt-20 {
  padding-top: 20px !important;
}
.cp_u__pl-20 {
  padding-left: 20px !important;
}
.cp_u__pb-20 {
  padding-bottom: 20px !important;
}
.cp_u__px-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.cp_u__py-20 {
  padding-bottom: 20px !important;
  padding-top: 20px !important;
}
.cp_u__mt-20 {
  margin-top: 20px !important;
}
.cp_u__mb-20 {
  margin-bottom: 20px !important;
}
.cp_u__ml-20 {
  margin-left: 20px !important;
}
.cp_u__mr-20 {
  margin-right: 20px !important;
}
.cp_u__pt-24 {
  padding-top: 24px !important;
}
.cp_u__pl-24 {
  padding-left: 24px !important;
}
.cp_u__pb-24 {
  padding-bottom: 24px !important;
}
.cp_u__px-24 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.cp_u__py-24 {
  padding-bottom: 24px !important;
  padding-top: 24px !important;
}
.cp_u__mt-24 {
  margin-top: 24px !important;
}
.cp_u__mb-24 {
  margin-bottom: 24px !important;
}
.cp_u__ml-24 {
  margin-left: 24px !important;
}
.cp_u__mr-24 {
  margin-right: 24px !important;
}
.cp_u__pt-28 {
  padding-top: 28px !important;
}
.cp_u__pl-28 {
  padding-left: 28px !important;
}
.cp_u__pb-28 {
  padding-bottom: 28px !important;
}
.cp_u__px-28 {
  padding-left: 28px !important;
  padding-right: 28px !important;
}
.cp_u__py-28 {
  padding-bottom: 28px !important;
  padding-top: 28px !important;
}
.cp_u__mt-28 {
  margin-top: 28px !important;
}
.cp_u__mb-28 {
  margin-bottom: 28px !important;
}
.cp_u__ml-28 {
  margin-left: 28px !important;
}
.cp_u__mr-28 {
  margin-right: 28px !important;
}
.cp_u__pt-32 {
  padding-top: 32px !important;
}
.cp_u__pl-32 {
  padding-left: 32px !important;
}
.cp_u__pb-32 {
  padding-bottom: 32px !important;
}
.cp_u__px-32 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}
.cp_u__py-32 {
  padding-bottom: 32px !important;
  padding-top: 32px !important;
}
.cp_u__mt-32 {
  margin-top: 32px !important;
}
.cp_u__mb-32 {
  margin-bottom: 32px !important;
}
.cp_u__ml-32 {
  margin-left: 32px !important;
}
.cp_u__mr-32 {
  margin-right: 32px !important;
}
.cp_u__pt-36 {
  padding-top: 36px !important;
}
.cp_u__pl-36 {
  padding-left: 36px !important;
}
.cp_u__pb-36 {
  padding-bottom: 36px !important;
}
.cp_u__px-36 {
  padding-left: 36px !important;
  padding-right: 36px !important;
}
.cp_u__py-36 {
  padding-bottom: 36px !important;
  padding-top: 36px !important;
}
.cp_u__mt-36 {
  margin-top: 36px !important;
}
.cp_u__mb-36 {
  margin-bottom: 36px !important;
}
.cp_u__ml-36 {
  margin-left: 36px !important;
}
.cp_u__mr-36 {
  margin-right: 36px !important;
}
.cp_u__pt-40 {
  padding-top: 40px !important;
}
.cp_u__pl-40 {
  padding-left: 40px !important;
}
.cp_u__pb-40 {
  padding-bottom: 40px !important;
}
.cp_u__px-40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}
.cp_u__py-40 {
  padding-bottom: 40px !important;
  padding-top: 40px !important;
}
.cp_u__mt-40 {
  margin-top: 40px !important;
}
.cp_u__mb-40 {
  margin-bottom: 40px !important;
}
.cp_u__ml-40 {
  margin-left: 40px !important;
}
.cp_u__mr-40 {
  margin-right: 40px !important;
}
.cp_u__pt-44 {
  padding-top: 44px !important;
}
.cp_u__pl-44 {
  padding-left: 44px !important;
}
.cp_u__pb-44 {
  padding-bottom: 44px !important;
}
.cp_u__px-44 {
  padding-left: 44px !important;
  padding-right: 44px !important;
}
.cp_u__py-44 {
  padding-bottom: 44px !important;
  padding-top: 44px !important;
}
.cp_u__mt-44 {
  margin-top: 44px !important;
}
.cp_u__mb-44 {
  margin-bottom: 44px !important;
}
.cp_u__ml-44 {
  margin-left: 44px !important;
}
.cp_u__mr-44 {
  margin-right: 44px !important;
}
.cp_u__pt-48 {
  padding-top: 48px !important;
}
.cp_u__pl-48 {
  padding-left: 48px !important;
}
.cp_u__pb-48 {
  padding-bottom: 48px !important;
}
.cp_u__px-48 {
  padding-left: 48px !important;
  padding-right: 48px !important;
}
.cp_u__py-48 {
  padding-bottom: 48px !important;
  padding-top: 48px !important;
}
.cp_u__mt-48 {
  margin-top: 48px !important;
}
.cp_u__mb-48 {
  margin-bottom: 48px !important;
}
.cp_u__ml-48 {
  margin-left: 48px !important;
}
.cp_u__mr-48 {
  margin-right: 48px !important;
}
.cp_u__pt-52 {
  padding-top: 52px !important;
}
.cp_u__pl-52 {
  padding-left: 52px !important;
}
.cp_u__pb-52 {
  padding-bottom: 52px !important;
}
.cp_u__px-52 {
  padding-left: 52px !important;
  padding-right: 52px !important;
}
.cp_u__py-52 {
  padding-bottom: 52px !important;
  padding-top: 52px !important;
}
.cp_u__mt-52 {
  margin-top: 52px !important;
}
.cp_u__mb-52 {
  margin-bottom: 52px !important;
}
.cp_u__ml-52 {
  margin-left: 52px !important;
}
.cp_u__mr-52 {
  margin-right: 52px !important;
}
.cp_u__pt-56 {
  padding-top: 56px !important;
}
.cp_u__pl-56 {
  padding-left: 56px !important;
}
.cp_u__pb-56 {
  padding-bottom: 56px !important;
}
.cp_u__px-56 {
  padding-left: 56px !important;
  padding-right: 56px !important;
}
.cp_u__py-56 {
  padding-bottom: 56px !important;
  padding-top: 56px !important;
}
.cp_u__mt-56 {
  margin-top: 56px !important;
}
.cp_u__mb-56 {
  margin-bottom: 56px !important;
}
.cp_u__ml-56 {
  margin-left: 56px !important;
}
.cp_u__mr-56 {
  margin-right: 56px !important;
}
.cp_u__pt-60 {
  padding-top: 60px !important;
}
.cp_u__pl-60 {
  padding-left: 60px !important;
}
.cp_u__pb-60 {
  padding-bottom: 60px !important;
}
.cp_u__px-60 {
  padding-left: 60px !important;
  padding-right: 60px !important;
}
.cp_u__py-60 {
  padding-bottom: 60px !important;
  padding-top: 60px !important;
}
.cp_u__mt-60 {
  margin-top: 60px !important;
}
.cp_u__mb-60 {
  margin-bottom: 60px !important;
}
.cp_u__ml-60 {
  margin-left: 60px !important;
}
.cp_u__mr-60 {
  margin-right: 60px !important;
}
.cp_u__pt-64 {
  padding-top: 64px !important;
}
.cp_u__pl-64 {
  padding-left: 64px !important;
}
.cp_u__pb-64 {
  padding-bottom: 64px !important;
}
.cp_u__px-64 {
  padding-left: 64px !important;
  padding-right: 64px !important;
}
.cp_u__py-64 {
  padding-bottom: 64px !important;
  padding-top: 64px !important;
}
.cp_u__mt-64 {
  margin-top: 64px !important;
}
.cp_u__mb-64 {
  margin-bottom: 64px !important;
}
.cp_u__ml-64 {
  margin-left: 64px !important;
}
.cp_u__mr-64 {
  margin-right: 64px !important;
}
.cp_u__pt-68 {
  padding-top: 68px !important;
}
.cp_u__pl-68 {
  padding-left: 68px !important;
}
.cp_u__pb-68 {
  padding-bottom: 68px !important;
}
.cp_u__px-68 {
  padding-left: 68px !important;
  padding-right: 68px !important;
}
.cp_u__py-68 {
  padding-bottom: 68px !important;
  padding-top: 68px !important;
}
.cp_u__mt-68 {
  margin-top: 68px !important;
}
.cp_u__mb-68 {
  margin-bottom: 68px !important;
}
.cp_u__ml-68 {
  margin-left: 68px !important;
}
.cp_u__mr-68 {
  margin-right: 68px !important;
}
.cp_u__pt-72 {
  padding-top: 72px !important;
}
.cp_u__pl-72 {
  padding-left: 72px !important;
}
.cp_u__pb-72 {
  padding-bottom: 72px !important;
}
.cp_u__px-72 {
  padding-left: 72px !important;
  padding-right: 72px !important;
}
.cp_u__py-72 {
  padding-bottom: 72px !important;
  padding-top: 72px !important;
}
.cp_u__mt-72 {
  margin-top: 72px !important;
}
.cp_u__mb-72 {
  margin-bottom: 72px !important;
}
.cp_u__ml-72 {
  margin-left: 72px !important;
}
.cp_u__mr-72 {
  margin-right: 72px !important;
}
.cp_u__pt-76 {
  padding-top: 76px !important;
}
.cp_u__pl-76 {
  padding-left: 76px !important;
}
.cp_u__pb-76 {
  padding-bottom: 76px !important;
}
.cp_u__px-76 {
  padding-left: 76px !important;
  padding-right: 76px !important;
}
.cp_u__py-76 {
  padding-bottom: 76px !important;
  padding-top: 76px !important;
}
.cp_u__mt-76 {
  margin-top: 76px !important;
}
.cp_u__mb-76 {
  margin-bottom: 76px !important;
}
.cp_u__ml-76 {
  margin-left: 76px !important;
}
.cp_u__mr-76 {
  margin-right: 76px !important;
}
.cp_u__pt-80 {
  padding-top: 80px !important;
}
.cp_u__pl-80 {
  padding-left: 80px !important;
}
.cp_u__pb-80 {
  padding-bottom: 80px !important;
}
.cp_u__px-80 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}
.cp_u__py-80 {
  padding-bottom: 80px !important;
  padding-top: 80px !important;
}
.cp_u__mt-80 {
  margin-top: 80px !important;
}
.cp_u__mb-80 {
  margin-bottom: 80px !important;
}
.cp_u__ml-80 {
  margin-left: 80px !important;
}
.cp_u__mr-80 {
  margin-right: 80px !important;
}
.cp_u__pl-1em {
  padding-left: 1em;
}
.cp_u__text-12 {
  font-size: 12px !important;
}
.cp_u__text-13 {
  font-size: 13px !important;
}
.cp_u__text-14 {
  font-size: 14px !important;
}
.cp_u__text-15 {
  font-size: 15px !important;
}
.cp_u__text-16 {
  font-size: 16px !important;
}
.cp_u__text-18 {
  font-size: 18px !important;
}
.cp_u__text-20 {
  font-size: 20px !important;
}
.cp_u__text-24 {
  font-size: 24px !important;
}
.cp_u__text-44 {
  font-size: 44px !important;
}
.cp_u__text-12_16 {
  font-size: clamp(12px, 3.2vw, 16px) !important;
}
.cp_u__text-12_14 {
  font-size: clamp(12px, 3.2vw, 14px) !important;
}
.cp_u__text-13_16 {
  font-size: clamp(13px, 3.4666666667vw, 16px) !important;
}
.cp_u__text-14_16 {
  font-size: clamp(14px, 3.7333333333vw, 16px) !important;
}
.cp_u__text-14_19 {
  font-size: clamp(14px, 3.7333333333vw, 19px) !important;
}
.cp_u__text-16_18 {
  font-size: clamp(16px, 4.2666666667vw, 18px) !important;
}
.cp_u__text-16_20 {
  font-size: clamp(16px, 4.2666666667vw, 20px) !important;
}
.cp_u__font-300 {
  font-weight: 300 !important;
}
.cp_u__font-400 {
  font-weight: 400 !important;
}
.cp_u__font-600 {
  font-weight: 600 !important;
}
.cp_u__text-red {
  color: #F3003D !important;
}
.cp_u__text-red-30 {
  color: #FF94AF !important;
}
.cp_u__text-blue {
  color: blue !important;
}
.cp_u__text-green {
  color: #009872 !important;
}
.cp_u__text-white {
  color: #fff !important;
}
.cp_u__text-black {
  color: #000 !important;
}
.cp_u__text-yellow {
  color: #E8FF00 !important;
}
.cp_u__text-orange {
  color: #FF9900 !important;
}
.cp_u__text-gold {
  color: #CFBB53 !important;
}
.cp_u__text-beige {
  color: #FFFEE0 !important;
}
.cp_u__text-gray {
  color: #a1a1a1 !important;
}
.cp_u__text-background--red {
  color: #FEF2F0 !important;
}
.cp_u__text-background--blue {
  color: #D9F4FF !important;
}
.cp_u__text-background--yellow {
  color: #FFFDC5 !important;
}
.cp_u__text-background--orange {
  color: #ceffe5 !important;
}
.cp_u__text-d-red {
  color: #cc0033 !important;
}
.cp_u__text-d-green {
  color: #3F8E4A !important;
}
.cp_u__background-red {
  background-color: #F3003D !important;
}
.cp_u__background-red-30 {
  background-color: #FF94AF !important;
}
.cp_u__background-blue {
  background-color: blue !important;
}
.cp_u__background-green {
  background-color: #009872 !important;
}
.cp_u__background-white {
  background-color: #fff !important;
}
.cp_u__background-black {
  background-color: #000 !important;
}
.cp_u__background-yellow {
  background-color: #E8FF00 !important;
}
.cp_u__background-orange {
  background-color: #FF9900 !important;
}
.cp_u__background-gold {
  background-color: #CFBB53 !important;
}
.cp_u__background-beige {
  background-color: #FFFEE0 !important;
}
.cp_u__background-gray {
  background-color: #a1a1a1 !important;
}
.cp_u__background-background--red {
  background-color: #FEF2F0 !important;
}
.cp_u__background-background--blue {
  background-color: #D9F4FF !important;
}
.cp_u__background-background--yellow {
  background-color: #FFFDC5 !important;
}
.cp_u__background-background--orange {
  background-color: #ceffe5 !important;
}
.cp_u__background-d-red {
  background-color: #cc0033 !important;
}
.cp_u__background-d-green {
  background-color: #3F8E4A !important;
}
.cp_u__max-w-280 {
  max-width: 280px !important;
}
.cp_u__max-w-500 {
  max-width: 500px !important;
}
.cp_u__max-w-640 {
  max-width: 640px !important;
}
.cp_u__max-w-sm {
  max-width: 576px !important;
}
.cp_u__max-w-tb {
  max-width: 768px !important;
}
.cp_u__max-w-pc {
  max-width: 960px !important;
}