/* .lp-kyoto-wrapper 内のみにスタイルを適用し、
      既存サイトの他のデザインに影響を与えないようにしています。
    */
    .lp-kyoto-wrapper {
      width: 784px;
      margin: 0;
      padding: 0;
      font-family: "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
      color: #333;
      line-height: 1.6;
      box-sizing: border-box;
      background-color: #f5ebfb;
    }

	.font-serif-jp {
		font-family: 'Yu Mincho', 'YuMincho', 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'Noto Serif JP', serif;
    }

    .lp-kyoto-wrapper img {
      max-width: 100%;
      height: auto;
      vertical-align: bottom;
    }
    .lp-kyoto-wrapper p {
      margin-top: 0;
    }

    /* ユーティリティクラス */
    /*.lp-kyoto-wrapper .text-center { text-align: center; }*/
    .lp-kyoto-wrapper .text-red { color: #6b203c; }
    .lp-kyoto-wrapper .fw-bold { font-weight: bold; }
    .lp-kyoto-wrapper .mb-20 { margin-bottom: 20px; }
    .lp-kyoto-wrapper .mb-40 { margin-bottom: 40px; }

    /* ヘッダー帯 */
    .lp-kyoto-wrapper .header-bar {
      background-color: #6b203c;
      color: #fff;
      padding: 0.6em 0.5em;
      font-size: 35px;
      font-weight: bold;
      letter-spacing: 2px;
    }

    /* ヒーロー（購入）セクション */
    .lp-kyoto-wrapper .hero-section {
      padding: 30px 20px;
    }
    .lp-kyoto-wrapper .hero-title-sub {
      font-size: 12px;
      color: #6b203c;
      text-align: left;
      margin-bottom: 5px;
      border: 1px solid #6b203c;
      display: inline-block;
      padding: 2px 10px;
      border-radius: 10px;
    }
    .lp-kyoto-wrapper .hero-title {
      font-size: 35px;
      font-weight: bold;
      text-align: left;
      margin-bottom: 30px;
      margin-top: 0;
    }

    /* 左右カラムレイアウト */
    .lp-kyoto-wrapper .product-area {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
    }

    /* 左側：画像ギャラリーと詳細表 */
    .lp-kyoto-wrapper .product-left {
      width: 380px;
	  position: relative; /* ズーム領域の配置基準 */
    }
    .lp-kyoto-wrapper .main-image-box {
      text-align: center;
      margin-bottom: 10px;
      /*height: 350px;  メイン画像の高さを固定_コメントアウトで高さ調整 */
      display: flex;
      align-items: center;
      justify-content: center;
    }
	/*.lp-kyoto-wrapper .main-image-box img {
		width: 100%;
		height: 100%;
		object-fit: cover;
    }*/
    .lp-kyoto-wrapper .thumbnails {
      display: flex;
      justify-content: space-between;
      margin-bottom: 20px;
    }
    .lp-kyoto-wrapper .thumbnails img {
      width: 23%;
      border: 2px solid #eee;
      cursor: pointer;
      transition: opacity 0.2s;
    }
    .lp-kyoto-wrapper .thumbnails img:hover {
      opacity: 0.7;
      border-color: #6b203c;
    }
    .lp-kyoto-wrapper .product-spec {
      width: 100%;
      border-collapse: collapse;
      font-size: 12px;
      margin-bottom: 10px;
    }
    .lp-kyoto-wrapper .product-spec th, 
    .lp-kyoto-wrapper .product-spec td {
      border: 1px solid #ccc;
      padding: 10px;
    }
    .lp-kyoto-wrapper .product-spec th {
      background-color: #f9f9f9;
      width: 25%;
      text-align: left;
      font-weight: normal;
    }
    .lp-kyoto-wrapper .product-spec td {
      background-color: #f9f9f9;
    }
    .lp-kyoto-wrapper .spec-note {
		font-size: 11px;
      border: 1px solid #ccc;
      padding: 10px;
      margin-bottom: 5px;
      background-color: #f9f9f9;
    }
	    /* 画像ズーム（Magnifier）用スタイル */
    .lp-kyoto-wrapper .zoom-result {
      position: absolute;
      top: 0;
      left: 102%; /* メイン画像の右側に少し隙間を空けて表示 */
      width: 340px; /* 右カラムに被さるサイズ */
      height: 380px; /* メイン画像より少し大きめ */
      border: 1px solid #ddd;
      background-color: #fff;
      background-repeat: no-repeat;
      display: none;
      z-index: 1000;
      box-shadow: 0 4px 15px rgba(0,0,0,0.15);
      pointer-events: none; /* マウスイベントを貫通させる */
      border-radius: 4px;
    }

    /* PDFリンク用スタイル */
    .lp-kyoto-wrapper .pdf-link {
      display: inline-block;
      margin-top: 10px;
      font-size: 12px;
      color: #6b203c;
      text-decoration: underline;
    }
    .lp-kyoto-wrapper .pdf-link:hover {
      text-decoration: none;
      opacity: 0.8;
    }


    /* 右側：価格と購入ボタン */
    .lp-kyoto-wrapper .product-right {
      width: 340px;
    }
    .lp-kyoto-wrapper .price-box-teiki {
      background-color: #ffe3e3;
      border: 1px solid #bd2727;
      padding: 20px;
      margin-bottom: 20px;
    }
    .lp-kyoto-wrapper .price-box-teiki .box-title {
      text-align: center;
      font-weight: bold;
      font-size: 25px;
      margin-bottom: 15px;
    }
    .lp-kyoto-wrapper .price-row {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      margin-bottom: 10px;
      border-bottom: 1px dashed #dcb48b;
      padding-bottom: 5px;
    }
    .lp-kyoto-wrapper .price-row:last-child {
      border-bottom: none;
      margin-bottom: 0;
    }
    .lp-kyoto-wrapper .price-row .label { font-size: 18px; font-weight: bold; }
    .lp-kyoto-wrapper .price-row .price { font-size: 24px; font-weight: bold; }
    .lp-kyoto-wrapper .price-row .price span { font-size: 12px; font-weight: normal; }
    
    .lp-kyoto-wrapper .teiki-small-note {
      font-size: 11px;
      text-align: left;
      color: #6b203c;
      margin-top: -5px;
      margin-bottom: 5px;
    }

    .lp-kyoto-wrapper .teiki-note {
      margin-top: 15px;
    }
    .lp-kyoto-wrapper .teiki-note-item {
      background-color: #fff79b;
      color: #333;
      font-size: 12px;
      font-weight: bold;
      text-align: center;
      /* padding: 8px; */
      margin-bottom: 5px;
    }
    .lp-kyoto-wrapper .teiki-note-link {
      display: block;
      text-align: center;
      font-size: 11px;
      color: #333;
      text-decoration: none;
      margin-top: 10px;
      padding: 6px;
      border: 1px solid #ccc;
      background-color: #fff;
      cursor: pointer;
    }
    .lp-kyoto-wrapper .teiki-note-link:hover {
      background-color: #f5f5f5;
    }

    /* ポップオーバー（モーダル）用スタイル */
    .lp-kyoto-wrapper .teiki-modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0,0,0,0.6);
      z-index: 1000;
      display: none; /* 初期状態は非表示。JSでflexにする */
      align-items: center;
      justify-content: center;
    }
    .lp-kyoto-wrapper .teiki-modal-content {
      background-color: #fff;
      padding: 40px 30px;
      border-radius: 8px;
      width: 90%;
      max-width: 600px;
      max-height: 80vh;
      overflow-y: auto;
      position: relative;
      box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    }
    .lp-kyoto-wrapper .teiki-modal-close {
      position: absolute;
      top: 15px;
      right: 20px;
      font-size: 30px;
      line-height: 1;
      cursor: pointer;
      color: #999;
    }
    .lp-kyoto-wrapper .teiki-modal-close:hover {
      color: #333;
    }
    .lp-kyoto-wrapper .teiki-modal-body {
      font-size: 14px;
      line-height: 1.8;
      color: #333;
      text-align: left;
    }
    .lp-kyoto-wrapper .teiki-modal-body strong {
      display: block;
      margin-top: 20px;
      margin-bottom: 5px;
      color: #6b203c;
      border-bottom: 1px solid #eee;
      padding-bottom: 5px;
    }

    .lp-kyoto-wrapper .price-box-normal {
      padding: 10px 20px;
	  border: 1px solid  rgb(180, 180, 180);
		background-color: #efeeee;
    }
    .lp-kyoto-wrapper .price-box-normal .box-title {
      text-align: center;
      font-weight: bold;
      font-size: 25px;
      margin-bottom: 15px;
    }
    .lp-kyoto-wrapper .price-box-normal .price-row {
      border-bottom: 1px dashed #ccc;
    }

    /* 一回購入の送料注記用スタイル */
    .lp-kyoto-wrapper .normal-note {
      margin-top: 15px;
      font-size: 12px;
      background-color: #f9f9f9;
      padding: 10px;
      border: 1px solid #ddd;
    }
    .lp-kyoto-wrapper .normal-note-item {
      margin-bottom: 3px;
      color: #555;
    }
    .lp-kyoto-wrapper .normal-note-item:last-child {
      margin-bottom: 0;
    }

    .lp-kyoto-wrapper .btn-green {
      display: block;
      background-color: #17934c;
      color: #fff;
      text-align: center;
      padding: 18px;
      border-radius: 40px;
      text-decoration: none;
      font-size: 22px;
      font-weight: bold;
      margin-top: 20px;
      box-shadow: 0 4px 0 #106b37;
      transition: transform 0.1s, box-shadow 0.1s;
    }
    .lp-kyoto-wrapper .btn-green:hover {
      background-color: #158343;
    }
    .lp-kyoto-wrapper .btn-green:active {
      transform: translateY(4px);
      box-shadow: none;
    }

    /* 共通セクションスタイル */
    .lp-kyoto-wrapper .section-title-wrap {
      text-align: center;
      margin-bottom: 30px;
    }
    .lp-kyoto-wrapper .section-title-wrap .en {
      color: #6b203c;
      font-size: 12px;
      font-weight: bold;
      margin-bottom: 5px;
      letter-spacing: 1px;
    }
    .lp-kyoto-wrapper .section-title-wrap h2 {
      font-size: 40px;
      margin: 0;
      color: #333;
      position: relative;
      padding-bottom: 15px;
      display: inline-block;
    }
	.lp-kyoto-wrapper .section-title-wrap h2::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 40px;
      height: 3px;
      background-color: #6b203c;
    }
    .lp-kyoto-wrapper .section-subtitle {
      font-size: 28px;
      font-weight: bold;
      text-align: center;
      margin-bottom: 25px;
    }
    .lp-kyoto-wrapper .section-subtitle02 {
      font-size: 28px;
      font-weight: bold;
      text-align: center;
      margin-bottom: 25px;
      margin-top: 4em;
    }
    .lp-kyoto-wrapper .content-section {
      padding: 50px 20px;
    }
    .lp-kyoto-wrapper .text-content {
      font-size: 20px;
      line-height: 2;
      margin-top: 20px;
      margin-bottom: 20px;
    }

    /* 京都健康美人ができるまで (紫背景) */
    .lp-kyoto-wrapper .bg-purple {
      background-color: #eaddf0;
    }
    .lp-kyoto-wrapper .step-list {
      margin-top: 40px;
    }
    .lp-kyoto-wrapper .step-item {
      background: #fff;
      border-radius: 8px;
      display: flex;
      align-items: center;
      padding: 15px 20px;
      margin-bottom: 15px;
    }
    .lp-kyoto-wrapper .step-num {
      width: 70px;
      color: #a76ea8;
      text-align: center;
      font-weight: bold;
      display: flex;
      flex-direction: column;
      align-items: center;
      border-right: 1px solid #eee;
      padding-right: 15px;
    }
    .lp-kyoto-wrapper .step-num span.st { font-size: 14px; margin-bottom: -5px; }
    .lp-kyoto-wrapper .step-num span.num { font-size: 32px; line-height: 1; }
    
    .lp-kyoto-wrapper .step-text {
      flex: 1;
      padding: 0 25px;
    }
    .lp-kyoto-wrapper .step-text h3 {
      font-size: 16px;
      margin: 0 0 10px 0;
      color: #333;
    }
    .lp-kyoto-wrapper .step-text p {
      font-size: 13px;
      margin: 0;
      color: #555;
    }
    .lp-kyoto-wrapper .step-img {
      width: 130px;
      height: 90px;
      object-fit: cover;
      border-radius: 4px;
    }

   /* 特許取得 (青枠) */
   	.desc-patent-big-box_01 {
		background-color: #e8f4ff;
		border: solid 1px #aaa;
    width:88%;
		margin:0 auto;
    }
    .desc-patent-box_01 {
      border: 2px solid #00569f;
      margin-top: 30px;
      background-color:#fff;
    }
    .desc-patent-header_01 {
      background-color: #00569f;
      color: #fff;
      text-align: center;
      padding: 12px;
      font-weight: bold;
      font-size: 14px;
    }
    .desc-patent-body_01 {
      padding: 20px;
      font-size: 13px;
      line-height: 1.8;
      color: #333;
    }
    .desc-btn-yellow-small {
      display: table;
      margin: 20px auto 0;
      background-color: #f3b100;
      color: #fff;
      padding: 8px 30px;
      border-radius: 20px;
      font-weight: bold;
      font-size: 14px;
    }
    .desc-btn-yellow-small a{
      text-decoration:none;
      color: #fff;
    }

    /* 安心・安全への取り組み */
    .lp-kyoto-wrapper .safety-area {
      display: flex;
      justify-content: space-between;
      margin-top: 40px;
      /*flex-wrap:wrap; */
    }
    .lp-kyoto-wrapper .safety-item {
      width: 31%;
      text-align: center;
      margin:0 auto 4em;
    }
    .lp-kyoto-wrapper .safety-num {
      background-color: #6b203c;
      color: #fff;
      width: 36px;
      height: 36px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      font-size: 18px;
      margin-bottom: 15px;
    }
    .lp-kyoto-wrapper .safety-item img {
      margin-bottom: 15px;
      width: 100%;
      height: 160px;
      object-fit: cover;
    }
    .lp-kyoto-wrapper .safety-item h3 {
      font-size: 14px;
      margin: 0 0 10px 0;
    }
    .lp-kyoto-wrapper .safety-item p {
      font-size: 18px;
      text-align: left;
      line-height: 1.6;
    }

    /* フッター購入エリア (ピンク背景) */
    .lp-kyoto-wrapper .footer-cta {
      background-color: #faeceb;
      padding: 50px 20px;
      text-align: center;
    }
    .lp-kyoto-wrapper .footer-cta p {
      font-weight: bold;
      font-size: 16px;
      margin-bottom: 20px;
    }
    .lp-kyoto-wrapper .btn-orange {
      display: inline-block;
      background-color: #e59000;
      color: #fff;
      font-size: 22px;
      font-weight: bold;
      padding: 20px 80px;
      border-radius: 40px;
      text-decoration: none;
      margin-bottom: 20px;
      box-shadow: 0 4px 0 #c27a00;
      transition: transform 0.1s, box-shadow 0.1s;
    }
    .lp-kyoto-wrapper .btn-orange:hover { background-color: #da8900; }
    .lp-kyoto-wrapper .btn-orange:active {
      transform: translateY(4px);
      box-shadow: none;
    }
    .lp-kyoto-wrapper .or-text {
      margin-bottom: 20px;
      font-size: 14px;
      color: #666;
    }
    .lp-kyoto-wrapper .btn-outline-green {
      display: inline-block;
      border: 2px solid #17934c;
      color: #17934c;
      background: #fff;
      font-size: 18px;
      font-weight: bold;
      padding: 12px 60px;
      border-radius: 30px;
      text-decoration: none;
    }
    .lp-kyoto-wrapper .btn-outline-green:hover {
      background-color: #f0fdf5;
    }