@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

.sample-img {
	width: 100%;
}

.circle-name {
	font-weight: bold;
}

#affiliate-button-top {
	display: none;
}

/* ===================================
   アフィリエイトボタンのスタイル
   =================================== */

/* ▼ ボタンの共通スタイル */
.affiliate-button {
  display: inline-block;
  margin: 20px 0;
  text-decoration: none;
  color: white !important; /* 文字色を白で固定 */
  font-weight: bold;
  text-align: center;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
}
/* マウスを乗せた時の共通エフェクト */
.affiliate-button:hover {
  opacity: 0.85;
  transform: translateY(-3px); /* 少し上に浮き上がる */
}




/* アニメーションで躍動感を出すボタン */
.affiliate-button {
  font-size: 1.3em;
  padding: 20px 30px;
	min-width: 70%;
  background-color: #ff6b81; /* 少し柔らかい赤 */
  border-radius: 8px;
  animation: pulse 2s infinite;
}

/* デザイン3用のアニメーション定義 */
@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 107, 129, 0.7);
  }
  70% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(255, 107, 129, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 107, 129, 0);
  }
}




/* レビュー用スタイル */

/*
  ユーザーレビューセクションのスタイル
*/

.review {
  background-color: #f9f9f9;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 15px;
  margin-bottom: 15px;
}

.review p {
  margin: 0 0 10px 0;
}

.review p:last-child {
  margin-bottom: 0;
}

.review strong {
  color: #555;
}

.stars {
  color: gold;
  font-size: 1.2rem;
  font-weight: bold;
}