/* キャンペーンに即した色などを設定する */
body {
    color: #000000;		/* 全体の文字色 */
}
:root {
  --campaign-kw-color: #ED6F3E;		/* お題や商材リンクの文字色 */
  --campaign-bd-color: #F9F9F9;		/* お題概要や商材リンクの罫線の色 */
  --campaign-bg-color: #faf9e3;		/* お題概要や商材リンクの背景色 */
  --campaign-kw-color-mo: #00A9CE;	/* 商材リンクの文字色（マウスオーバー時） */
  --campaign-bg-color-mo: #dfe5e7;	/* 商材リンクの背景色（マウスオーバー時） */
  --campaign-profile-item-width: 48%;	/* 見本投稿者の横幅（全体に対して）：3人なら30%、2人なら48%を設定 */
  --more-strong-bd-color: yellow;	/* strong.more-strongの下線の色 */
}

/* 強調をさらに強調する */
.entry-content .more-strong {
  background: linear-gradient(transparent 70%, var(--more-strong-bd-color) 30%);
  font-size: 1.3rem;
}

/* キャンペーン概要 */
.entry-content .campaign-content-main {
  border: solid 2px var(--campaign-bd-color);
  background-color: var(--campaign-bg-color);
  border-radius: .3em; /* デフォルト値は 5px */
  font-size: 1rem; /* デフォルト値は 1.2rem; */
  padding: .6em 3%; /* デフォルト値は padding: 10px 1.5em; */
  margin: 1em 0; /* デフォルト値は設定なし */
  word-wrap: break-word;
}

/* キャンペーン概要のキーワード */
.entry-content .campaign-content-main .campaign-keyword-box {
  display: flex;
  justify-content: center;
}
.entry-content .campaign-content-main .campaign-keyword-box .campaign-keyword {
  text-align: left; /* デフォルトは中揃え */
}
.entry-content .campaign-content-main .campaign-keyword-box .campaign-keyword strong {
  color: var(--campaign-kw-color);
}

.caution {
  font-size: .85rem;
}

/* ブラウザ幅が広いとき概要のフォントサイズを大きくする */
@media (min-width: 600px) {
  .entry-content .campaign-content-main {
    font-size: 1.2em;
    padding: 10px 1.5em;
  }
  .entry-content .campaign-content-main .campaign-keyword-box .campaign-keyword strong {
    font-size: 2rem;
  }
  .entry-content h3 {
    margin-top: 3.5em;  /* 見出しちょっと行間あける */
  }
}

/* 結果発表をするときに使うクラス */
.entry-content .campaign-content-added {
  border: solid 2px #F17C64;
  border-radius: 5px;
  padding: 10px 1.5em;
  margin: 2em 0;
}

/* デフォルトのボタンは使わない */
#requirement-and-entries > .entry-content > .campaign-entry-button-container {
  display: none;
}

/* 独自キャンペーンエントリーボタンの配置 */
.campaign-description .campaign-entry-button-container {
  margin: 1em 0;
}
@media (min-width: 600px) {
  .campaign-description .campaign-entry-button-container {
    margin: 2.5em 0;
  }
}

/* 独自キャンペーンエントリーボタンのスタイル */
.campaign-entry-button button.btn {
  background-color: #5C7FF7;
  font-size: 1.5rem;
  border-radius: .3em;
}

/* 誘導リンク */
.entry-content .induction {
  margin: 2em 3%;
  background-color: var(--campaign-bg-color);
  border: solid 5px var(--campaign-bd-color);
  font-weight: bold;
  font-size: large;
  border-radius: 10px;
}
.entry-content .induction a {
  display: table;
  padding: 1em 2em;
  box-sizing: border-box;
  width: 100%;
  text-decoration: none;
  vertical-align: middle;
  color: var(--campaign-kw-color);
  border-radius: 5px;
}
.entry-content .induction a:visited {
  color: var(--campaign-kw-color);
}
.entry-content .induction a:hover {
  color: var(--campaign-kw-color-mo);
  text-decoration: none;
  background-color: var(--campaign-bg-color-mo);
}

/* （主にプレゼント説明用途）画像とその説明を横並びに（ブラウザ幅が広いとき） */
@media (min-width: 600px) {
  .present-container {
    width: 90%;
    margin: auto;
    display: flex;
    align-items: center;
  }
  .present-container-image {
    width: 33%;
    display: flex;
    justify-content: center;
  }
  .present-container-image img {
    vertical-align: middle;
  }
  .present-container-text {
    flex: 1;
    margin: 0;
  }
}

/* キャンペーンのプレゼント画像 */
.entry-content .campaign-gift-items {
  margin: 2em auto;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}
.entry-content .campaign-gift-items > div {
  width: auto;
}
.entry-content .campaign-gift-items img {
  width: 100%;
  display: block;
}

/* はてなブロガー紹介 */
.entry-content .campaign-profile-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    margin: 2em 3%;
}
.entry-content .campaign-profile-item {
    text-align: center;
    margin-bottom: 2em;
    box-sizing: border-box;
}
.entry-content .campaign-profile-item .campaign-profile-title {
    font-weight: bold;
}
.entry-content .campaign-profile-name {
    margin: 0 auto .5em;
}
.entry-content .campaign-profile-item p {
    text-align: left;
    line-height: 1.5;
}
.entry-content .campaign-profile-item a {
    color: #969696;
}
.entry-content .campaign-profile-image {
    width: 150px;
    border-radius: .4em;
}
@media (min-width: 600px) {
    .entry-content .campaign-profile-items {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .entry-content .campaign-profile-item {
        width: var(--campaign-profile-item-width);
        margin-bottom: 0;
    }
}