/* =============================================================================
   下層:Xcanページメインコンテンツ
   ========================================================================== */

.page--xcan .sub-title-block__title {
  max-width: 200px;
}

/* キャンペーンタイトルセクション  */

.contents__campaign-title {
  text-align: center;
  margin-inline: auto;
  padding-block: 30px;
  width: 90%;
}

.contents__campaign-title img {
  width: 100%;
  max-width: 600px;
}

/* キャンペーン概要セクション  */

.contents__campaign-overview {
  margin: 30px auto;
  width: 90%;
}

.contents__campaign-overview__inner {
  background: white;
  border-radius: 8px;
  padding: 15px;
}

.contents__campaign-overview__title {
  background-color: #000;
  color: white;
  text-align: center;
  padding: 10px;
  margin: 0 0 15px 0;
  font-size: 1.1rem;
}

.contents__campaign-overview__text {
  line-height: 1.4;
  margin: 0;
}

/* 参加方法セクション  */

.contents__campaign-participation {
  background-image: url("../img/common/back_blue.png");
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 8px;
  border: 3px solid white;
  padding: 20px;
  margin: 60px auto 30px auto;
  width: 90%;
}

.contents__campaign-participation__title-image {
  width: 45%;
  max-width: 450px;
  margin: 0 auto 20px auto;
  display: block;
}

.contents__campaign-participation__step-item {
  margin-bottom: 40px;
  background: white;
  border-radius: 8px;
  padding: 15px;
}

.contents__campaign-participation__step-item {
  width: 100%;
  max-width: 500px;
}

.contents__campaign-participation__step-inner {
  text-align: center;
}

.contents__campaign-participation__step-inner img {
  width: 100%;
  max-width: 500px;
}

.xcan-step__images {
  margin-top: 15px;
}

.contents__campaign-participation__step-button {
  margin: 20px 0 10px 0;
}

.contents__campaign-participation__step-button button {
  background-color: #000;
  color: white;
  padding: 8px 16px;
  border-radius: 5px;
}

.contents__campaign-participation__bonus {
  margin: 40px 0;
}

.contents__campaign-participation__bonus img {
  width: 100%;
  max-width: 500px;
}

/* 賞品紹介セクション */
.contents__campaign-prizes {
  margin: 60px auto 30px auto;
  width: 90%;
}

.contents__campaign-prizes__title-image {
  width: 45%;
  max-width: 450px;
  margin: 0 auto;
  display: block;
}

/* 応募規約セクション */
.contents__campaign-terms {
  margin: 30px auto;
  width: 90%;
}

.contents__campaign-terms__title {
  background-color: #000;
  color: white;
  text-align: center;
  padding: 10px;
  margin-bottom: 15px;
  font-size: 1.1rem;
}

.contents__campaign-terms__inner {
  background: #f8f8f8;
  border-radius: 8px;
  padding: 15px;
}

.contents__campaign-terms__text {
  line-height: 1.4;
  font-size: 0.9rem;
  margin-bottom: 15px;
}

.contents__campaign-terms__text h3 {
  font-size: 1rem;
  margin-bottom: 10px;
}

.contents__campaign-terms__text p {
  margin-bottom: 10px;
}

.contents__campaign-terms__text a {
  margin-top: -10px;
  color: #1da1f2;
}

.contents__campaign-preview {
  margin: calc(50 / 2 / 395 * 100%) auto;
  width: calc(100% - 50px);
}

.contents__campaign-preview__item--1 {}

.contents__campaign-preview__item--1 .contents__campaign-preview__item-text {
  width: calc(493 / 2 / 344 * 100%);
}

.contents__campaign-preview__item--1 .contents__campaign-preview__item-image {
  width: calc(557 / 2 / 344 * 100%);
  margin-top: calc(-21.5 / 344 * 100%);
  position: relative;
  z-index: 1;
  margin-left: auto;
}

.contents__campaign-preview__item--2 {
  margin-top: 40px;
}

.contents__campaign-preview__item--2 .contents__campaign-preview__item-text {
  width: 100%;
}

.contents__campaign-preview__text {
  margin-top: 16px;
  padding-left: calc(20 / 2 / 344 * 100%);
}

.contents__campaign-preview__text p+p {
  margin-top: .5em;
}

.contents__campaign-preview__text p {
  font-size: 1em;
  line-height: calc(36/28);
}