*{
line-height:1.75;
letter-spacing:0.05em;
}


.achievement-sub{
text-align:center;
margin: 35px auto !important;
}

.mid-offer-btn-area2 {
    display: flex;
    justify-content: center;
}

.btn-final-cta-arrow2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background-color: #c3a859;
    color: #ffffff !important;
    text-decoration: none;
    padding: 18px 100px;
    font-size: 1.5rem;
    border-radius: 8px;
    font-weight: normal;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", serif;
}

.btn-final-cta-arrow2::after {
    content: "▶";
    font-size: 10px;
    background-color: #5a529b !important;
    color: #ffffff !important;
    width: 22px;
    height: 22px;
    display: inline-block !important;
    line-height: 22px !important;
    text-align: center !important;
    border-radius: 50% !important;
    margin-left: 10px !important;
    box
}

/* ==========================================
   ① 上半分の「テキスト左・画像右」の横並び
========================================== */
.mask-select-card .card-upper-flex {
  display: flex;
  align-items: center;         /* 上下の中央を揃える */
  justify-content: space-between; /* 左右に綺麗に振り分け */
  gap: 15px;                   /* テキストと画像の間の隙間 */
  padding: 15px;               /* カードの内側の余白 */
  width: 500px;
  box-sizing: border-box;
}

/* 左側のテキストエリアを左寄せに */
.mask-select-card .card-text-area {
  text-align: left;
  flex: 1;                     /* 使える横幅をいっぱいまで広げる */
}

/* テキストのフォントサイズなど（必要に応じて調整してください） */
.mask-select-card .sub-title { font-size: 1rem; margin: 0 0 4px 0; color: #000000;     font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;text-align: left;}
.mask-select-card .product-name { font-size: 2rem!important; margin: 0 0 8px 0!important; font-weight: bold;     font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;}
.mask-select-card .price { font-size: 1rem; margin: 0;text-align: right;}
.mask-select-card .price4 { font-size: 0.8rem; margin: 0;text-align: right;}
.mask-select-card .price2 { font-size: 2.5rem; font-weight: bold; }
.mask-select-card .price3 { font-size: 1.5rem; font-weight: bold; }

/* 右側の画像エリアのサイズを制限（これでドカンと大きくならなくなります） */
.mask-select-card .card-img-area {
  width: 45%;                  /* カードの横幅に対して最大45%のサイズに縮小 */
  flex-shrink: 0;              /* 画像がこれ以上潰れないように固定 */
}
.mask-select-card .card-img-area img {
  width: 100%;                 /* エリアいっぱいに画像を広げる */
  height: auto;
  display: block;
}

/* ==========================================
   ② 下半分の「タグ横並び」の設定
========================================== */
.mask-select-card .card-tags {
  display: flex;
  flex-wrap: wrap;             /* 画面が狭くなったら自動で折り返し */
  justify-content: center;     /* タグ全体は中央揃え */
  gap: 10px;                   /* タグとタグの間の隙間 */
  margin: 15px 0;              /* 上下の余白 */
  width: 100%;
}

/* タグ単体のスタイル */
.mask-select-card .card-tags span {
  display: inline-block;
  white-space: nowrap;         /* タグの文字が途中で変に改行されるのを防ぐ */
  padding: 4px 20px;
  border-radius: 20px!important;
  font-size: 1rem;
  border: 1px solid #666666!important;
  color:#666666!important;
}

/* ボタンの調整（中央配置の維持） */
.mask-select-card .btn {
  display: block;
  margin: 0 auto 15px auto;
  text-align: center;
}



.bx-wrapper{
    max-width:1160px!important;
    margin: 0 auto!important;
}

    .sp-only {
        display: none;
    }

#fixed_link {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
    z-index: 10000;
}

.sokukounyuu {
    padding: 10px;
    background: #FF931E none repeat scroll 0% 0%;
    color: #FFF!important;
    display: block;
    border-radius: 5px;
    margin-top: 10px;
    text-decoration: none !important;
    font-size: 133%;
    text-align: center;
    cursor: pointer;
}


html {
  scroll-behavior: smooth;
}

.lp-wrapper {
    color: #333333;
    line-height: 1.6;
    background-color: #ffffff;
    width: 100%;
}

.dummy-image-tex {
    text-align:center;
    width: 100% !important;
    font-size: 1rem;
}

.product-info h2 {
    color: #000000 !important;
    margin-top: 50px !important;
    font-size: 1.5rem !important;
}

.lp-wrapper section,
.lp-wrapper div,
.lp-wrapper h1,
.lp-wrapper h2,
.lp-wrapper h3,
.lp-wrapper p,
.lp-wrapper ul,
.lp-wrapper li {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    background-color: transparent !important;
}

.fv-section {
    padding: 80px 0;
    background-color: transparent;
}
.fv-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin: 100px auto !important;
}
.fv-text {
    flex: 1;
}
.catch-sub {
    font-size: 2.5rem;
    color: #000000;
    font-weight: bold;
    margin-bottom: 35px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
}
.catch-main {
    font-size: 2rem;
    color: #000000;
    line-height: 1.4;
    margin-bottom: 35px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
}
.fv-desc {
    font-size: 1.5rem;
    margin-bottom: 50px !important;
    line-height: 2rem;
}
.new-price {
    font-size: 1rem;
    font-weight: normal;
    margin-bottom: 25px;
}
.btn-cta {
    display: block;
    margin: 20px auto 25px;
    box-sizing: border-box;
    background-color: #c3a859;
    color: #ffffff !important;
    text-decoration: none;
    padding: 14px 10px;
    font-weight: bold;
    font-size: 1.5rem;
    border-radius: 8px;
    text-align: center;
    width: 100%;
}
.btn-cta:hover {
    background-color: #b08e4b;
    color: #ffffff !important;
}
.tags {
    display: flex;
    gap: 12px;
}
.tag-item {
    border: 1px solid #666666;
    padding: 6px 25px;
    font-size: 0.9rem;
    border-radius: 20px;
    color: #666666;
}
.fv-image {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.dummy-image-product, .dummy-image-person {
    width: 500px;
    height: auto;
    overflow: hidden;
}
.dummy-image-product {
    margin-bottom: 20px !important;
}
.trouble-section {
    background-color: #ffffff;
    padding: 80px 0;
    text-align: center;
    margin-bottom: 100px !important;
}
.trouble-bg-wrap {
    position: relative;
    width: 100%;
    display: block;
    padding: 80px 0 !important;
    margin-bottom: 100px !important;
    z-index: 1;
}
.trouble-bg-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    min-width: 1200px;
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_03.jpg");
    background-size: cover;
    background-position: center center;
    z-index: -1;
}
.trouble-grid {
    display: grid;
    grid-template-columns: repeat(3, 300px);
    justify-content: center;
    align-items: center;
    gap: 40px 60px;
    margin: 0 auto;
    max-width: 1200px;
}
.section-title {
    font-size: 2rem;
    line-height: 1.4;
    color: #ffffff!important;
    margin: 0 !important;
    text-align: center;
    width: 100%;
}
.trouble-card {
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.5);
    width: 320px;
    height: 320px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    margin: 0 auto;
}
.trouble-text {
    font-size: 1.5rem;
    color: #000000;
    line-height: 1.7;
}
.onayami {
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    font-size: 2.5rem !important;
    color: #ffffff !important;
    letter-spacing: 0.1rem;
    line-height: 4.2rem;
}
.trouble-summary {
    background-color: #ffffff;
    color: #333333;
    padding: 40px 50px;
    border-radius: 8px;
    text-align: left;
    max-width: 1200px;
    margin: 0 auto;
}
.summary-title {
    font-size: 2.5rem;
    margin-bottom: 35px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    color: #000000!important;
    text-align: center;
}
.summary-text {
    font-size: 1.5rem;
    margin-bottom: 35px !important;
    text-align: center;
}
.trouble-summary .lead-text {
    color: #453f7d;
    font-size: 2.5rem;
    font-weight: bold;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    display: block;
    width: max-content;
    margin: 35px auto 0 auto !important;
    background: linear-gradient(transparent 70%, rgba(223, 93, 141, 0.15) 0%);
    padding: 0 10px 4px 10px;
}
.feature-section {
    padding: 80px 0;
    background-color: #ffffff;
    margin-bottom: 100px !important;
}
.feature-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}
.feature-text {
    flex: 1;
}
.feature-title {
    font-size: 2rem!important;
    background-color: #e05e8d!important;
    color: #ffffff !important;
    padding: 6px 60px 6px 25px !important;
    margin-bottom: 30px;
    display: inline-block;
    clip-path: polygon(0% 0%, 88% 0, 100% 100%, 0% 100%);
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    width: 100%;
    text-align: center;
}
.feature-list {
    list-style: none !important;
    display: block !important;
    width: 100%;
    margin-top: 40px !important;
    padding-left: 80px !important;
}
.feature-item {
    position: relative !important;
    display: block !important;
    padding-left: 35px !important;
    margin-bottom: 24px !important;
    font-size: 1.5rem !important;
    line-height: 1.7 !important;
    text-align: left !important;
    color: #333333;
}
.feature-item::before {
    content: "●" !important;
    position: absolute !important;
    left: 12px !important;
    top: 48% !important;
    transform: translateY(-50%) !important;
    color: #e05e8d!important;
    font-size: 1.5rem !important;
}
.feature-image {
    flex: 1;
}
.dummy-image-mask {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}
.underl {
    border: none;
    border-top: 1px solid #eeeeee;
    margin-top: 80px;
}
.reasons-section {
    padding: 80px 0;
    text-align: center;
    margin-bottom: 100px !important;
}
.reasons-bg-wrap {
    position: relative;
    width: 100%;
    display: block;
    padding: 40px 0 100px!important;
    z-index: 1;
}
.reasons-bg-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    min-width: 1200px;
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_05.jpg");
    background-size: cover;
    background-position: center center;
    z-index: -1;
}
.reasons-title {
    font-size: 2.5rem !important;
    color: #000000 !important;
    padding: 15px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif!important;
    font-weight: normal !important;
}
.reasons-grid {
    display: flex;
    justify-content: center;
    gap: 30px;
}
.reasons-card {
    background-color: #ffffff;
    width: 300px;
    padding: 40px 25px 30px 25px;
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
    position: relative;
    text-align: center;
    height: 420px;
}
.reasons-number {
    position: absolute;
    top: -20px;
    left: 20px;
    font-size: 80px;
    font-family: "Times New Roman", serif;
    font-style: italic;
    color: #a8aee0;
    line-height: 1;
    font-weight: bold;
}
.reasons-image-circle {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    margin: 50px auto 30px auto !important;
    overflow: hidden;
}
.reasons-image-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.reasons-card-title {
    font-size: 1.5rem;
    color: #000000!important;
    font-weight: bold;
    line-height: 1.5;
    margin-bottom: 15px !important;
    height: 60px;
}
.reasons-card-text {
    font-size: 1rem;
    color: #000000;
    line-height: 1.6;
    padding: 10px !important;
}
.ingredients-section {
    padding: 100px 0 20px 0;
    text-align: center;
    background-color: #ffffff;
}
.ingredients-title {
    font-size: 2.5rem!important;
    color: #000000!important;
    margin-bottom: 15px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    font-weight: bold;
}
.ingredients-subtitle {
    font-size: 1.5rem;
    color: #000000;
    margin-bottom: 10px !important;
}
.ingredients-note {
    font-size: 1rem;
    color: #000000;
    margin-bottom: 50px !important;
}
.ingredients-grid {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 70px !important;
}
.ingredients-card {
    flex: 1;
    text-align: center;
}
.ingredients-image-box {
    width: 240px;
    height: 240px;
    overflow: hidden;
    margin: 0 auto !important;
}
.ingredients-image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ingredients-name {
    font-size: 1.3rem;
    color: #000000;
    line-height: 1.5;
    margin-top: 20px !important;
}
.ingredients-bottom-note {
    font-size: 1rem;
    color: #000000;
    text-align: right;
    max-width: 1200px;
    margin: 10px auto 40px auto !important;
}
.ingredients-detail-list-block {
    max-width: 1100px;
    margin: 0 auto 100px auto !important;
    text-align: left;
    background-color: #ffffff;
}
.ingredients-detail-group {
    margin-bottom: 20px;
}
.ingredients-detail-group-title, .ingredients-detail-group-text {
    font-size: 1rem;
    color: #000000!important;
}
.usage-section {
    padding: 100px 0;
    background-color: #ffffff;
    text-align: center;
    width: 100%;
    border-top: 3px solid #d2d4ed;
}
.usage-title {
    color:#000000 !important;
    font-size: 2.5rem !important;
    margin: 100px 0 60px 0 !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    letter-spacing: 0.2rem;
    font-weight: normal;
}
.usage-step-list {
    max-width: 650px;
    margin: 0 auto !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.usage-step-item {
    display: flex;
    align-items: center;
    text-align: left;
    width: 100%;
}
.usage-step-badge {
    width: 170px;
    height: 40px;
    border: 1px solid #7488cf;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #7488cf;
    background-color: #ffffff;
    flex-shrink: 0;
    font-weight: bold;
}
.usage-step-text {
    font-size: 1.5rem;
    color: #000000;
    padding-left: 40px !important;
    line-height: 1.6;
}
.usage-step-text span {
    font-size: 1rem;
    color: #666666;
    margin-left: 5px;
}
.usage-arrow {
    width: 40px;
    height: 25px;
    background-color: #8e93d3;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    margin: 15px 0 15px 65px !important;
    display: block;
    align-self: flex-start;
}
.why-easy-section {
    padding: 60px 0 100px 0;
    background-color: #ffffff;
    margin: 70px 0 150px!important;
}
.why-easy-box {
    border: 15px solid #dfe2f5;
    border-radius: 24px;
    padding: 40px 10px !important;
    max-width: 1180px;
    margin: 0 auto !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.why-easy-left {
    flex: 1;
    text-align: center;
}
.why-easy-title {
    font-size: 2rem !important;
    color: #222222!important;
    margin-bottom: 30px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    font-weight: normal;
    letter-spacing: 0.1rem;
}
.why-easy-title span {
    color: #7780df;
}
.why-easy-desc {
    font-size: 1.5rem;
    color: #333333;
    line-height: 1.8;
    margin-bottom: 40px !important;
}
.why-easy-circles {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    width: 500px;
    margin: 0 auto !important;
}
.why-easy-circle-item {
    width: 300px;
    height: 150px;
    background-color: #8e93d3;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    line-height: 1.4;
    text-align: center;
    box-shadow: 0 4px 10px rgba(123, 133, 167, 0.15);
}
.why-easy-right-image {
    width: 440px;
    height: auto;
    border-radius: 8px;
    overflow: hidden;
}
.recommend-section {
    padding: 80px 0;
    text-align: center;
}
.recommend-bg-wrap {
    position: relative;
    width: 100%;
    display: block;
    padding: 80px 0 !important;
    z-index: 1;
}
.recommend-bg-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    min-width: 1200px;
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_18.jpg");
    background-size: cover;
    background-position: center center;
    z-index: -1;
}
.recommend-title {
    font-size: 2.5rem !important;
    color: #000000!important;
    margin-bottom: 50px !important;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    font-weight: normal;
}
.recommend-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto !important;
    gap: 50px;
}
.recommend-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.recommend-item {
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    background-color: #ffffff;
    padding: 10px 20px !important;
    font-size: 1.5rem;
    color: #000000;
    text-align: left;
    width: max-content;
}
.recommend-item:nth-child(odd) {
    align-self: flex-end;
}
.recommend-item:nth-child(even) {
    align-self: flex-start;
}
.recommend-right-image {
    width: 500px;
    height: auto;
}
.confirm-section {
    padding: 100px 0 !important;
    background-color: #ffffff;
}
.confirm-box {
    border: 1px solid #000000;
    padding: 10px !important;
    max-width: 1100px;
    margin: 0 auto !important;
    display: flex;
    align-items: stretch;
    gap: 40px;
}
.confirm-title {
    font-size: 1rem;
    color: #000000!important;
    white-space: nowrap;
    line-height: 1.5;
    display: flex;
    align-items: center;
    border-right: 1px solid #000000;
    padding-right: 40px !important;
    padding-left: 40px !important;
}
.confirm-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px 40px;
    width: 100%;
}
.confirm-item {
    font-size: 1rem;
    color: #000000;
    position: relative;
    padding-left: 15px;
    line-height: 1.5;
    text-align: left;
}
.confirm-item::before {
    content: "・";
    position: absolute;
    left: 0;
    top: 0;
}
.mid-offer-section {
    width: 100%;
}
.mid-offer-bg-wrap {
    position: relative;
    width: 100%;
    padding: 100px 0!important;
    z-index: 1;
    display: flex;
    justify-content: center;
}
.mid-offer-bg-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(50% - 50vw);
    width: 100vw;
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_22.jpg");
    background-size: cover;
    background-position: center center;
    z-index: -1;
}
.mid-offer-container {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
    box-sizing: border-box;
    padding: 0 20px;
}
.mid-offer-title {
    font-size: 2.5rem!important;
    color: #ffffff!important;
    font-weight: bold;
    line-height: 1.6;
    margin: 0 0 40px 0;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    letter-spacing: 0.05rem;
}
.mid-offer-product-area {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin-bottom: 40px;
}
.mid-product-img {
    width: 230px;
    flex-shrink: 0;
}
.mid-product-img img {
    width: 100%;
    height: auto;
    display: block;
}
.mid-product-info-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.mid-offer-subtitle {
    font-size: 1.5rem;
    color: #ffffff;
    margin: 0 0 35px 0!important;
    letter-spacing: 0.02rem;
    font-weight: normal;
}
.mid-tags-list {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.mid-tag-badge {
    background-color: #ffffff;
    color: #000000;
    padding: 6px 18px;
    font-size: 1rem;
    border-radius: 30px;
    display: inline-block;
    border: 1px solid #e5a8af;
}
.mid-offer-btn-area {
    display: flex;
    justify-content: center;
}
.btn-cta-mid-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    background: linear-gradient(to right, #eed083, #c3a859);
    color: #ffffff !important;
    text-decoration: none;
    width: 100%;
    max-width: 440px;
    padding: 16px 0;
    font-size: 20px;
    border-radius: 50px;
    font-weight: bold;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: opacity 0.3s;
}
.btn-cta-mid-arrow:hover {
    opacity: 0.9;
}
.btn-cta-mid-arrow::after {
    content: "▶";
    font-size: 11px;
    background-color: #ffffff;
    color: #c3a859;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 2px;
    box-sizing: border-box;
}
.purchase-section {
    padding:100px 0 50px!important;
}
.purchase-container {
    max-width: 1000px;
    margin: 0 auto !important;
}
.purchase-flex-row {
    display: flex;
    justify-content: space-between;
    gap: 80px;
    align-items: flex-start;
}
.purchase-column {
    flex: 1;
}
.purchase-badge-recommend {
    background-color: #8f95d1;
    color: #ffffff;
    font-size: 1rem;
    padding: 0 8px;
    display: inline-block;
    margin-bottom: 8px !important;
    border-radius: 20px;
}
.purchase-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px !important;
}
.purchase-main-title {
    font-size: 2rem;
    font-weight: normal!important;
    color: #000000;
}
.purchase-shipping-tag {
    background-color: #ff7e9d;
    color: #ffffff;
    font-size: 1rem;
    padding: 2px 6px;
    border-radius: 5px;
}
.purchase-caption {
    font-size: 1rem;
    color: #000000;
    margin-bottom: 35px !important;
    text-align: left;
}
.purchase-price-display-box {
    text-align: center;
}
.purchase-price-line {
    font-size: 1.5rem;
    color: #333333;
    text-align: right;
}
.purchase-price-huge {
    font-size: 2.3rem;
    font-weight: bold;
    color: #000000;
}
.purchase-price-huge span {
    font-size: 1.5rem;
    font-weight: normal;
}
.btn-purchase-submit {
    display: block;
    padding: 18px;
    font-size: 1.5rem;
    color: #ffffff !important;
    text-decoration: none;
    text-align: center;
    border-radius: 4px;
    font-weight: bold;
}
.btn-style-red {
    background-color: #ff6380;
}
.btn-style-red:hover {
    background-color: #c9565f;
    color: #ffffff !important;
}
.btn-style-dark {
    background-color: #4e4d53;
}
.btn-style-dark:hover {
    background-color: #3b404c;
    color: #ffffff !important;
}
.purchase-rules-wrapper {
    margin-top: 80px !important;
}
.purchase-rules-heading {
    font-size: 1.5rem;
    color: #000000;
    font-weight: normal;
    text-align: left;
}
.purchase-rules-list {
    list-style: none !important;
}
.purchase-rules-item {
    font-size: 1rem;
    color: #000000;
    text-align: left;
    position: relative;
    padding-left: 8px !important;
    padding-right: 15px !important;
}
.purchase-rules-item::before {
    content: "○";
    font-size: 18px;
    position: absolute;
    left: -10px;
    top: -2px;
    color: #000000;
}

.footer-plain-ingredients-section {
    padding: 20px 0!important;
}
.footer-plain-ingredients-text {
    max-width: 1000px;
    margin: 15px auto !important;
    font-size: 1rem;
    color: #000000;
    text-align: justify;
    margin-top: 70px !important;
}
.qa-section {
    padding: 60px 0!important;
    text-align: center;
    max-width: 1200px;
    margin: 60px auto!important;
    border-top: 3px solid #d1d5ee;
}
.qa-title {
    font-size: 2.5rem!important;
    color: #000000!important;
    font-weight: normal;
    margin: 50px 0 5px 0 !important;
    letter-spacing: 0.1rem;
}
.qa-subtitle {
    font-size: 1.5rem;
    color: #888888;
    margin-bottom: 60px !important;
    letter-spacing: 0.15rem;
}
.qa-list {
    max-width: 1000px;
    margin: 0 auto !important;
    display: flex;
    flex-direction: column;
    gap: 35px;
}
.qa-item {
    text-align: left;
}
.qa-question {
    font-size: 1.5rem;
    color: #000000;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px !important;
}
.qa-answer-box {
    background-color: #f4f6fa!important;
    padding: 10px 30px!important;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.qa-answer-text {
    font-size: 1.5rem;
    color: #333333;
    line-height: 1.6;
}
.qa-lead-q {
    font-family: "Times New Roman", serif;
    font-size: 1.5rem;
    color: #000000;
    font-weight: bold;
}
.qa-lead-a {
    font-family: "Times New Roman", serif;
    font-size: 20px;
    color: #7b85a7;
    font-weight: bold;
    line-height: 1.1;
}
.final-offer-section {
    padding: 120px 0;
    color: #ffffff;
    text-align: center;
    margin-bottom: 150px!important;
}
.final-offer-bg-wrap {
    position: relative;
    width: 100%;
    display: block;
    padding: 100px 0 !important;
    z-index: 1;
}
.final-offer-bg-wrap::before, .final-offer-bg-wrap::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    min-width: 1200px;
    z-index: -1;
}
.final-offer-bg-wrap::before {
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_23.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.final-offer-text-large {
    color:#000000!important;
    font-size: 2.5rem!important;
    font-weight: normal;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
    line-height: 1.7;
    margin-bottom: 40px !important;
    letter-spacing: 0.05rem;
}
.final-offer-text-sub {
    font-size: 1.5rem;
    line-height: 1.8;
    margin-bottom: 50px !important;
    color: #000000;
}
.btn-final-cta-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background-color: #c3a859;
    color: #ffffff !important;
    text-decoration: none;
    padding: 18px 140px;
    font-size: 1.5rem;
    border-radius: 8px;
    font-weight: normal;
    font-family:"Yu Mincho", "YuMincho", "Times New Roman", "Hiragino Mincho ProN", "MS Mincho", serif;
}
.btn-final-cta-arrow:hover {
    background-color: #b08e4b;
    color: #ffffff !important;
}
.btn-final-cta-arrow::after {
    content: "▶";
    font-size: 10px;
    background-color: #5a529b!important;
    color: #ffffff!important;
    width: 22px;
    height: 22px;
    display: inline-block !important;
    line-height: 22px !important;
    text-align: center !important;
    border-radius: 50% !important;
    margin-left: 10px !important;
    box-sizing: border-box !important;
}
.lp-wrapper a:hover,
.lp-wrapper a:hover img,
.lp-wrapper button:hover {
    opacity: 1 !important;
    background-color: transparent;
}
.lp-wrapper .btn-cta:hover,
.lp-wrapper .btn-cta-mid-arrow:hover,
.lp-wrapper .btn-final-cta-arrow:hover {
    background-color: #b08e4b !important;
    opacity: 1 !important;
}
.lp-wrapper .btn-style-red:hover {
    background-color: #c9565f !important;
    opacity: 1 !important;
}
.lp-wrapper .btn-style-dark:hover {
    background-color: #3b404c !important;
    opacity: 1 !important;
}
#main_column.colnum1 #detailrightbloc{
    width:50%;
}
#detailarea .photo {
    max-width: 500px;
}

.sp-br {
    display: none;
}

@media screen and (min-width: 1200px) {
    .lp-wrapper {
        min-width: 1200px;
    }
}

@media screen and (max-width: 1199px) {

.mid-offer-bg-wrap {
    display: block;
}

.fv-container {
    align-items: flex-start;
}

.fv-container {
    justify-content: center;
}

.trouble-grid{
gap:20px;
}

.feature-item::before {
    left: -30px !important;
    top: 49% !important;
}

.feature-list{
padding-left: 40px !important;
}

.feature-item{
padding-left: 0 !important;
margin-bottom: 0 !important;
}

.trouble-card {
    width: 250px;
    height: 250px;
 }

    .final-offer-section {
        margin-bottom: 80px!important;
    }
    .history_list_wrapper{
        margin-top: 50px;
    }
    .history_list {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        overflow-x: auto;
    }
    .title-block h2 {
        background: transparent!important;
    }
    .img-box img{
        width:100%;
    }
    .history_list_wrapper .history_list li a:not(:has(img)) {
        display: inline-block !important;
        max-width: 5.5em !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        vertical-align: bottom !important;
    }
    .history_list_wrapper .history_list li a:has(img) {
        display: block !important;
        max-width: 100% !important;
        width: auto !important;
    }
    .bx-viewport{
        height:170px!important;
    }
    footer{
        margin-top:100px;
    }
    #detailarea{
        border-top:none;
    }
    #main_list_comment{
        display:none;
    }

    .lp-wrapper {
        min-width: 100% !important;
        width: 100% !important;
        overflow: hidden !important;
    }
    .container {
        width: 100% !important;
        max-width: 1000px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        margin: 0 !important;
    }
    .trouble-bg-wrap,
    .reasons-bg-wrap,
    .recommend-bg-wrap,
    .mid-offer-bg-wrap,
    .final-offer-bg-wrap {
        overflow: hidden !important;
        padding-left: 20px !important;
        padding-right: 0 !important;
    }
    .trouble-bg-wrap::before,
    .reasons-bg-wrap::before,
    .recommend-bg-wrap::before,
    .mid-offer-bg-wrap::before,
    .final-offer-bg-wrap::before,
    .final-offer-bg-wrap::after {
        min-width: 100% !important;
        width: 100vw !important;
        left: 0 !important;
        transform: none !important;
        background-size: cover !important;
        background-position: center center !important;
    }
    .fv-container {
        gap: 40px;
        margin: 100px auto 60px!important;
    }
    .fv-text {
         width: 400px !important;
      flex: none !important;
    }
    .fv-image {
        width: 100% !important;
        flex: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
        text-align: center !important;
    }
    .fv-image .dummy-image-tex {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
    }
    .dummy-image-product, .dummy-image-person {
        display: block !important;
        width: 100% !important;
        max-width: 400px !important;
        height: auto !important;
        margin: 0 auto !important;
    }
    .feature-container {
        margin-bottom:80px !important;
    }
    .feature-text, .feature-image {
        width: 100% !important;
        flex: none !important;
        max-width: 450px;
    }
    .dummy-image-mask {
        height: auto !important;
    }
    .dummy-image-mask img {
        max-width: 500px;
        width: 100%;
    }
    .dummy-image-tex {
        font-size: 1rem;
        margin-top: 0 !important;
    }
    .underl {
        margin-top: 20px;
    }
    .reasons-bg-wrap{
        margin-top:50px!important;
    }
    .reasons-grid {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
    .reasons-card {
        height: auto !important;
        min-height: 400px;
    }
    .ingredients-grid {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 30px !important;
    }
    .ingredients-image-box {
        width: 100% !important;
        max-width: 240px !important;
        aspect-ratio: 1 / 1;
    }
    .ingredients-detail-list-block{
        margin-bottom: 10px!important;
        margin-left: 20px!important;
    }
    .why-easy-box {
        flex-direction: column !important;
        padding: 30px 20px !important;
        margin: 50px 0 100px!important;
    }
    .why-easy-left, .why-easy-right-image {
        width: 100% !important;
        flex: none !important;
    }
    .why-easy-right-image {
        max-width: 440px;
        margin: 0 auto;
    }
    .recommend-container {
        flex-direction: column !important;
        gap: 30px;
    }
    .recommend-list, .recommend-right-image {
        width: 100% !important;
        flex: none !important;
    }
    .recommend-right-image {
        max-width: 500px;
        margin: 0 auto;
    }
    .mid-offer-product-area {
        flex-direction: column !important;
        text-align: center !important;
    }
    .mid-product-info-wrap {
        align-items: center !important;
        text-align: center !important;
    }
    .mid-tags-list {
        justify-content: center !important;
    }
    .purchase-flex-row {
        flex-direction: column !important;
        gap: 40px !important;
    }
    .purchase-column {
        width: 100% !important;
    }
    .purchase-price-display-box{
        margin-top: 0!important;
    }
    .confirm-box{
        margin-bottom: 100px !important;
    }
    .footer-plain-ingredients-text{
        margin-top: 30px!important;
    }
    .qa-section {
        width: 100% !important;
        border-top: none;
    }
    .qa-list {
        margin: 40px auto 100px!important;
    }
}

/* ==========================================================================
   マスク選択セクション (追加分)
   ========================================================================== */
.mask-select-section {
    padding: 60px 0;
    background-color: #fff;
}

.mask-select-container {
    max-width: 1200px;
    margin: 80px auto!important;
    padding: 0 20px!important;
    box-sizing: border-box!important;
}

.mask-select-grid {
    display: flex;
    justify-content: space-between;
    gap: 30px;
}

/* カードの基本設定 */
.mask-select-card {
    flex: 1;
    border-radius: 20px!important;
    padding: 20px!important;
    box-sizing: border-box;
    text-align: center;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 各カード個別の枠線カラー */
.mask-select-card.type-kihada {
    border: 2px solid #ffd4e2; /* 薄いピンク */
}
.mask-select-card.type-bikihada {
    border: 2px solid #e2e4f7; /* 薄いパープル・ネイビー */
}

/* キャッチコピー */
.card-lead-copy {
    font-size: 1.6rem;
    color: #333;
    margin: 0 0 10px 0;
    font-weight: bold;
}

/* 商品名 */
.card-product-name {
    font-size: 2.8rem;
    margin: 0 0 20px 0;
    font-weight: bold;
}
.text-kihada {
    color: #df587c; /* 輝肌ピンク */
}
.text-bikihada {
    color: #4a5c9e; /* 美輝肌ネイビーブルー */
}

/* 画像エリア */
.card-image-wrap {
    width: 100%;
    max-width: 240px;
    margin: 0 0 20px 0;
}
.card-image-wrap img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
}

/* 価格エリア */
.card-price-area {
    margin-bottom: 20px;
    line-height: 1.4;
}
.card-price-normal {
    font-size: 1.6rem;
    color: #333;
    font-weight: bold;
    margin: 0;
}
.card-price-normal .price-num {
    font-size: 3.4rem;
    letter-spacing: -0.05em;
}
.card-price-regular {
    font-size: 1.4rem;
    color: #555;
    margin: 5px 0 0 0;
}
.card-price-regular .price-num-sub {
    font-size: 1.8rem;
    font-weight: bold;
}

/* タグエリア */
.card-tags-area {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 280px;
    margin-bottom: 30px;
}
.card-tag {
    display: block;
    width: 100%;
    border: 1px solid #777;
    border-radius: 20px;
    padding: 6px 10px;
    font-size: 1.2rem;
    color: #555;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
}

/* CTAボタン共通 */
.card-btn-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 320px;
    height: 64px;
    border-radius: 12px;
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none;
    position: relative;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    transition: background-color 0.3s, transform 0.2s;
    margin-top: auto; /* コンテンツ量が違ってもボタン位置を下に揃える */
    padding-right: 40px;
    padding-left: 20px;
    box-sizing: border-box;
}

/* ボタン右側の円形矢印アイコン */
.card-btn-cta::after {
    content: '';
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
}
/* 円の中の三角矢印 */
.card-btn-cta::before {
    content: '';
    position: absolute;
    right: 23px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 7px;
    border-color: transparent transparent transparent #fff;
    z-index: 2;
}

.card-btn-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.2);
}

/* ボタンの色分け */
.bg-gold {
    background-color: #c5a452; /* 輝肌マスク：ゴールド系 */
}
.bg-gold:hover {
    background-color: #b39243;
}

.bg-purple {
    background-color: #796fae; /* 美輝肌マスク：青紫・ネイビー系 */
}
.bg-purple:hover {
    background-color: #665b9b;
}

/* ==========================================================================
   レスポンシブ対応 (スマートフォン用ブレイクポイント)
   ========================================================================== */
@media screen and (max-width: 768px) {
    .mask-select-section {
        padding: 40px 0;
    }
    
    .mask-select-grid {
        flex-direction: column;
        gap: 30px;
    }
    
    .mask-select-card {
        padding: 30px 20px;
    }
    
    .card-product-name {
        font-size: 2.4rem;
    }
    
    .card-price-normal .price-num {
        font-size: 3.0rem;
    }
    
    .card-btn-cta {
        font-size: 1.6rem;
        height: 56px;
    }
}





@media screen and (max-width: 1023px) {

    .catch-sub, .catch-main {
        font-size: 1.5rem !important;
        line-height: 1.5 !important;
        text-align: center;
    }
    .fv-desc {
        text-align: center;
        white-space: nowrap;
        font-size: 1.3rem;
    }
    .product-info h2 {
        font-size: 1.8rem !important;
    }
    .new-price {
        font-size: 1.3rem;
    }
    .btn-cta {
        font-size: 1.3rem;
    }
    .tags {
        justify-content: center;
        flex-wrap: wrap;
    }
    .tag-item{
        font-size:1.3rem;
    }
    .section-title.onayami {
        font-size: 1.8rem!important;
        line-height: 1.4 !important;
        letter-spacing: 0.1rem !important;
        text-align:center!important;
    }
    .summary-title {
        font-size: 1.8rem;
        white-space: nowrap;
    }
    .summary-text {
        font-size: 1.3rem;
    }
    .trouble-summary .lead-text {
        width: auto !important;
        text-align: center;
        font-size: 1.8rem;
        white-space: nowrap;
    }
    .feature-title{
        font-size:1.3rem!important;
        margin-top:80px!important;
        white-space: nowrap;
    }
    .feature-list {
        padding-left: 0 !important;
    }
    .feature-item {
        font-size: 1.3rem !important;
    }
    .feature-item::before {
        left: -28px !important;
        top: 52% !important;
        font-size: 1.5rem !important;
    }
    .reasons-title {
        font-size: 1.8rem !important;
        text-align: center !important;
    }
    .reasons-card-title{
        font-size: 1.8rem !important;
    }
    .reasons-card-text {
        font-size: 1.3rem;
    }
    .ingredients-title{
        font-size: 1.8rem!important;
        text-align: center !important;
        padding: 30px 0 !important;
    }
    .ingredients-subtitle {
        font-size: 1.3rem;
    }
    .ingredients-card {
        flex: none !important;
        width: 45% !important;
    }
    .ingredients-bottom-note {
        text-align: center;
    }
    .usage-title{
        font-size: 1.8rem!important;
        text-align: center!important;
    }
    .usage-step-badge {
        font-size: 1.3rem;
    }
    .usage-step-text {
        font-size: 1.3rem;
    }
    .why-easy-desc{
        font-size: 1.3rem;
    }
    .why-easy-circle-item {
        font-size: 1.3rem;
    }
    .recommend-title{
        font-size:1.8rem!important;
        margin-bottom: 10px !important;
        text-align:center!important;
    }
    .recommend-item {
        width: 100% !important;
        align-self: center !important;
        font-size: 1.3rem;
    }
    .mid-offer-title{
        font-size: 1.8rem!important;
        text-align:center!important;
    }
    .mid-offer-subtitle {
        font-size: 1.3rem;
    }
    .mid-tag-badge {
        font-size: 1.3rem;
    }
    .purchase-main-title{
        font-size: 1.8rem;
    }
    .purchase-shipping-tag{
        font-size: 1.3rem;
    }
    .purchase-caption {
        font-size: 1.3rem;
    }
    .purchase-price-line {
        font-size: 1rem;
    }
    .btn-purchase-submit {
        font-size: 1.3rem;
    }
    .purchase-rules-heading {
        font-size: 1.3rem;
    }
    .purchase-rules-item {
        padding-left: 22px !important;
        font-size: 1.3rem;
    }
    .purchase-rules-item::before {
        font-size: 1.3rem;
        left: 0;
        top: 1px;
    }
    .confirm-title{
        font-size: 1rem;
    }
    .qa-title{
        font-size: 1.8rem!important;
        text-align:center!important;
        margin-top: 100px!important;
    }
    .qa-subtitle {
        font-size: 1.3rem;
    }
    .qa-question {
        font-size: 1.3rem;
    }
    .qa-answer-text {
        font-size: 1.3rem;
    }
    .qa-lead-a {
        font-size: 1.5rem;
        line-height: 2rem;
    }
    .final-offer-text-large {
        font-size: 1.8rem!important;
    }
    .final-offer-text-sub {
        font-size: 1.3rem;
    }
    .btn-final-cta-arrow {
        padding: 18px 20px !important;
        width: 70% !important;
        box-sizing: border-box;
        font-size:1.3rem;
        margin-top:30px;
    }
    .detailrightblock h3.product_name {
        font-size: 1.3rem!important;
    }
    .detailrightblock .normal_price, .mini, .sale_limit, .detailrightblock .deliv_fee.include, #cartbtn_default, .btn_sub, a.btn_sub, a.btn_sub:link, a.btn_sub:visited, a.btn_sub:hover{
        font-size: 1rem!important;
    }
    .price02_inctax_default, .cartbtn_default{
        font-size: 1.3rem!important;
    }
}

@media screen and (max-width: 767px) {
    .sp-br {
        display: inline;
    }

    .trouble-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px 15px !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 15px !important;
        max-width: 100% !important;
        white-space: nowrap;
    }
    .trouble-grid .trouble-card {
        width: 170px !important;
        height: 170px !important;
        min-width: 170px !important;
        min-height: 170px !important;
        padding: 15px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }
    .trouble-grid .trouble-card:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    .trouble-grid .trouble-text {
        font-size: 1.1rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
    }
    .section-title.onayami {
        order: -1 !important;
        margin-bottom: 20px !important;
        grid-column: 1 / -1;
    }

    .reasons-card {
        width: 95% !important;
        padding-bottom: 40px !important;
    }

    .ingredients-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 20px 10px !important;
    }
    .ingredients-card {
        width: 47% !important;
        flex: none !important;
    }
    .ingredients-image-box {
        width: 100% !important;
        max-width: 160px !important;
        aspect-ratio: 1 / 1;
        height: auto;
    }
    .ingredients-name {
        font-size: 1rem !important;
        margin-top: 5px !important;
    }

    .usage-step-item {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .usage-step-text {
        padding-left: 0 !important;
        margin-top: 15px!important;
        white-space: nowrap;
    }
    .usage-arrow {
        margin: 20px auto !important;
        align-self: center !important;
    }

    .why-easy-circles {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px 15px !important;
        justify-content: center !important;
        align-items: center !important;
        max-width: 100% !important;
    }
    .why-easy-circles .why-easy-circle-item:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    .why-easy-circle-item {
        width: 140px !important;
        height: 140px !important;
        margin: 0 auto !important;
    }

    .confirm-box {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .confirm-title {
        border-right: none !important;
        border-bottom: 1px solid #000000;
        padding: 0 0 15px 0 !important;
        justify-content: center;
    }
    .confirm-grid {
        grid-template-columns: 1fr !important;
    }

    .why-easy-title, .recommend-title, .final-offer-text-large {
        line-height: 1.4 !important;
        text-align:center !important;
        white-space: nowrap;
        font-size:1.8rem!important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {

.qa-section {
    margin: 0!important;
    margin-left: 20px!important;
}

.footer-plain-ingredients-section {
    margin:50px 0 0 20px !important;
}

.why-easy-section {
    margin-left:20px !important;
}

.ingredients-section {
    margin-left: 20px!important;
}

.purchase-rules-item::before {
    left: 5px;
    top: -1px;
}

.purchase-rules-item {
    padding-left: 25px !important;
}

.purchase-section {
    margin-left: 20px!important;
}

.purchase-price-huge {
    padding-top: 66px !important;
}

.catch-sub{
font-size: 2.2rem !important;
}

    .lp-wrapper {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    .container,
    .fv-container,
    .purchase-container,
    .mid-offer-container,
    .qa-section {
        width: calc(100vw - 40px) !important;
        max-width: 1200px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    .catch-sub {
        font-size: 2.2rem !important;
        line-height: 1.4 !important;
        text-align: left !important;
    }

    .catch-main {
        font-size: 2rem !important;
        line-height: 1.4 !important;
        text-align: left !important;
    }

    .fv-desc {
        font-size: 1.2rem !important;
        line-height: 2rem !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .product-info h2 {
        font-size: 1.5rem !important;
    }

    .new-price {
        font-size: 1rem !important;
    }

    .btn-cta,
    .btn-final-cta-arrow,
    .btn-purchase-submit {
        font-size: 1.5rem !important;
    }

    .tag-item,
    .mid-tag-badge {
        font-size: 1rem !important;
    }

    .section-title {
        font-size: 2rem !important;
    }

    .onayami {
        font-size: 2.5rem !important;
        line-height: 4.2rem !important;
    }

    .summary-title,
    .ingredients-title,
    .reasons-title,
    .recommend-title,
    .qa-title,
    .final-offer-text-large {
        font-size: 2.2rem !important;
        text-align: center !important;
        white-space: normal !important;
    }

    .summary-text,
    .ingredients-subtitle,
    .usage-step-text,
    .why-easy-desc,
    .recommend-item,
    .qa-question,
    .qa-answer-text,
    .final-offer-text-sub {
        font-size: 1.2rem !important;
    }

    .feature-title,
    .purchase-main-title,
    .why-easy-title {
        font-size: 2rem !important;
        white-space: normal !important;
    }

    .feature-item,
    .trouble-text,
    .ingredients-name,
    .usage-step-badge,
    .purchase-shipping-tag {
        font-size: 1.2rem !important;
    }

    .reasons-card-title {
        font-size: 1.5rem !important;
    }

    .reasons-card-text,
    .purchase-caption,
    .purchase-rules-item,
    .footer-plain-ingredients-text {
        font-size: 1rem !important;
    }

    .sp-br {
        display: none !important;
    }

    .fv-container {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start!important;
        justify-content: space-between !important;
        gap: clamp(20px, 3vw, 40px) !important;
        margin: 100px 0 !important;
    }

    .fv-text {
        flex: 0 1 48% !important;
        width: auto !important;
        min-width: 0 !important;
    }

    .fv-image {
        flex: 0 1 48% !important;
        width: auto !important;
        min-width: 0 !important;
        align-items: flex-end !important;
    }

    .dummy-image-product,
    .dummy-image-person {
        width: 100% !important;
        max-width: 400px !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }

    .tags {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 12px !important;
    }

    .trouble-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: clamp(20px, 3vw, 60px) !important;
        width: 100% !important;
        max-width: 1200px !important;
    }

    .trouble-card {
        width: 100% !important;
        max-width: 320px !important;
        height: auto !important;
        aspect-ratio: 1 / 1 !important;
    }

    .feature-container {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: clamp(24px, 4vw, 50px) !important;
    }

    .feature-text,
    .feature-image {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding-top: 0 !important;
    }

    .feature-list {
        padding-left: 80px !important;
    }

    .reasons-grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: clamp(16px, 2.5vw, 30px) !important;
    }

    .reasons-card {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        height: 420px !important;

    }

    .ingredients-grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: clamp(12px, 2vw, 20px) !important;
    }

    .ingredients-card {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
    }

    .ingredients-image-box {
        width: 100% !important;
        max-width: 240px !important;
        height: auto !important;
        aspect-ratio: 1 / 1 !important;
    }

    .why-easy-box {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: clamp(24px, 3vw, 40px) !important;
    }

    .why-easy-left {
        flex: 1 1 55% !important;
        min-width: 0 !important;
    }

    .why-easy-right-image {
        flex: 0 1 40% !important;
        width: auto !important;
        max-width: 440px !important;
        min-width: 0 !important;
    }

    .why-easy-circles {
        width: 100% !important;
        max-width: 500px !important;
        gap: 2% !important;
    }

    .why-easy-circle-item {
        width: 32% !important;
        aspect-ratio: 2 / 1 !important;
    }

    .recommend-container {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: clamp(24px, 4vw, 50px) !important;
    }

    .recommend-list {
        flex: 1 1 52% !important;
        min-width: 0 !important;
    }

    .recommend-right-image {
        flex: 0 1 43% !important;
        width: auto !important;
        max-width: 500px !important;
        min-width: 0 !important;
    }

    .recommend-item {
        width: max-content !important;
        max-width: 100% !important;
    }

    .mid-offer-product-area {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mid-product-img {
        width: 23% !important;
        max-width: 230px !important;
        min-width: 160px !important;
    }

    .mid-product-info-wrap {
        align-items: flex-start !important;
        text-align: left !important;
    }

    .purchase-flex-row {
        display: flex !important;
        flex-direction: row !important;
        gap: clamp(32px, 6vw, 80px) !important;
    }

    .purchase-column {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
    }

    .purchase-price-display-box {
        margin-top: 0 !important;
    }

    .confirm-box {
        flex-direction: row !important;
        margin-bottom: 0 !important;
        margin-left: 20px !important;
    }

    .confirm-grid {
        grid-template-columns: 1fr 1fr !important;
    }
}

html,
body {
    overflow-x: clip !important;
}

.lp-wrapper {
    overflow-x: visible !important;
}

.trouble-bg-wrap,
.reasons-bg-wrap,
.recommend-bg-wrap,
.mid-offer-bg-wrap,
.final-offer-bg-wrap {
    overflow: visible !important;
}

@media screen and (max-width: 767px) {

    html,
    body {
        overflow-x: hidden !important;
    }

    .lp-wrapper {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    .container {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }

    .fv-container,
    .feature-container,
    .recommend-container,
    .mid-offer-product-area,
    .purchase-flex-row,
    .why-easy-box,
    .confirm-box {
        flex-direction: column !important;
    }

    .fv-container {
        width: 100% !important;
        margin: 20px auto 100px !important;
        padding: 0 10px !important;
        gap: 40px !important;
    }

    .fv-text,
    .fv-image,
    .feature-text,
    .feature-image,
    .recommend-list,
    .recommend-right-image,
    .purchase-column,
    .why-easy-left,
    .why-easy-right-image {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
    }

    .dummy-image-product,
    .dummy-image-person,
    .dummy-image-mask img,
    .recommend-right-image img,
    .why-easy-right-image img {
        width: 100% !important;
        max-width: 500px !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .trouble-bg-wrap,
    .reasons-bg-wrap,
    .recommend-bg-wrap,
    .mid-offer-bg-wrap,
    .final-offer-bg-wrap {
        overflow: hidden !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .trouble-bg-wrap::before,
    .reasons-bg-wrap::before,
    .recommend-bg-wrap::before,
    .mid-offer-bg-wrap::before,
    .final-offer-bg-wrap::before,
    .final-offer-bg-wrap::after {
        width: 100vw !important;
        min-width: 100% !important;
        left: 0 !important;
        transform: none !important;
    }
}

@media screen and (max-width: 767px) {

    html,
    body {
        width: 100% !important;
        overflow-x: hidden !important;
    }

    .lp-wrapper {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    .container,
    .fv-container,
    .feature-container,
    .recommend-container,
    .purchase-container,
    .mid-offer-container,
    .qa-section {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
    }

    .fv-container,
    .feature-container,
    .recommend-container,
    .mid-offer-product-area,
    .purchase-flex-row,
    .why-easy-box,
    .confirm-box {
        display: flex !important;
        flex-direction: column !important;
    }

    .fv-text,
    .fv-image,
    .feature-text,
    .feature-image,
    .recommend-list,
    .recommend-right-image,
    .purchase-column,
    .why-easy-left,
    .why-easy-right-image {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .dummy-image-product,
    .dummy-image-person,
    .dummy-image-mask,
    .dummy-image-mask img,
    .recommend-right-image,
    .recommend-right-image img,
    .why-easy-right-image,
    .why-easy-right-image img {
        width: 100% !important;
        max-width: 500px !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .trouble-bg-wrap,
    .reasons-bg-wrap,
    .recommend-bg-wrap,
    .mid-offer-bg-wrap,
    .final-offer-bg-wrap {
        overflow: hidden !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .trouble-bg-wrap::before,
    .reasons-bg-wrap::before,
    .recommend-bg-wrap::before,
    .mid-offer-bg-wrap::before,
    .final-offer-bg-wrap::before,
    .final-offer-bg-wrap::after {
        width: 100vw !important;
        min-width: 100vw !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    .ingredients-section,
    .why-easy-section,
    .purchase-section,
    .footer-plain-ingredients-section,
    .qa-section {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .sp-br {
        display: inline !important;
    }
}

@media screen and (max-width: 767px) {
.final-offer-section {
    margin-bottom: 80px!important;
}

.ingredients-detail-list-block {
        margin-left: 0 !important;
    }

.history_list_wrapper{
margin-top: 50px;
}

.history_list {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  overflow-x: auto;
}

.title-block h2 {
   background: transparent!important;
}

.img-box img{
   width:100%;
}

.history_list_wrapper .history_list li a:not(:has(img)) {
    display: inline-block !important;
    max-width: 5.5em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: bottom !important;
}

.history_list_wrapper .history_list li a:has(img) {
    display: block !important;
    max-width: 100% !important;
    width: auto !important;
}
.bx-viewport{
height:170px!important;
}

footer{
margin-top:100px;
}

#detailarea{
border-top:none;
}

#main_list_comment{
display:none;
}

    .lp-wrapper {
        min-width: 100% !important;
        width: 100% !important;
        overflow: hidden !important;
    }
    .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .trouble-bg-wrap,
    .reasons-bg-wrap,
    .recommend-bg-wrap,
    .mid-offer-bg-wrap,
    .final-offer-bg-wrap {
        overflow: hidden !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .trouble-bg-wrap::before,
    .reasons-bg-wrap::before,
    .recommend-bg-wrap::before,
    .mid-offer-bg-wrap::before,
    .final-offer-bg-wrap::before,
    .final-offer-bg-wrap::after {
        min-width: 100% !important;
        width: 100vw !important;
        left: 0 !important;
        transform: none !important;
        background-size: cover !important;
        background-position: center center !important;
    }

    .fv-container {
        flex-direction: column-reverse!important;
        gap: 40px;
        margin: 20px auto 100px!important;
        padding: 0 10px !important;
    }
    .fv-text {
        width: 100% !important;
        flex: none !important;
    }
    .fv-image {
        width: 100% !important;
        flex: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
        text-align: center !important;
    }
    .fv-image .dummy-image-tex {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
    }
    .dummy-image-product, .dummy-image-person {
        display: block !important;
        width: 100% !important;
        max-width: 500px !important;
        height: auto !important;
        margin: 0 auto !important;
    }
    .catch-sub, .catch-main {
        font-size: 1.5rem !important;
        line-height: 1.5 !important;
        text-align: center;
    }
    .fv-desc {
        text-align: center;
        white-space: nowrap;
        font-size: 1.3rem;
    }
    .product-info h2 {
        font-size: 1.8rem !important;
    }
    .new-price {
        font-size: 1.3rem;
    }
    .btn-cta {
        font-size: 1.3rem;
    }
    .tags {
        justify-content: center;
        flex-wrap: wrap;
    }
    .tag-item{
        font-size:1.3rem;
    }

    .trouble-grid {
        grid-template-columns: repeat(auto-fit, 270px) !important;
        gap: 30px !important;
    }
    .section-title.onayami {
        grid-column: 1 / -1;
        font-size: 1.8rem!important;
        line-height: 1.4 !important;
        letter-spacing: 0.1rem !important;
        text-align:center!important;
    }
    .summary-title {
        font-size: 1.8rem;
        white-space: nowrap;
    }
    .summary-text {
        font-size: 1.3rem;
    }
    .trouble-summary .lead-text {
        width: auto !important;
        text-align: center;
        font-size: 1.8rem;
        white-space: nowrap;
    }

    .feature-container {
        flex-direction: column !important;
        gap: 30px;
        margin-bottom:80px !important;
    }
    .feature-text, .feature-image {
        width: 100% !important;
        flex: none !important;
        padding-top:80px;
    }
    .feature-title{
        font-size:1.3rem!important;
        margin-top:80px!important;
        white-space: nowrap;
    }
    .feature-list {
        padding-left: 0 !important;
    }
    .feature-item {
        font-size: 1.2rem !important;
        padding-left: 35px !important;
    }
    .feature-item::before {
        left: 7px !important;
        top: 52% !important;
        font-size: 1.5rem !important;
    }
    .dummy-image-mask {
        height: auto !important;
    }
    .dummy-image-mask img {
        max-width: 500px;
        width: 100%;
    }
    .dummy-image-tex {
        font-size: 1rem;
        margin-top: 0 !important;
    }
    .underl {
        margin-top: 20px;
    }

    .reasons-bg-wrap{
        margin-top:50px!important;
    }
    .reasons-title {
        font-size: 1.8rem !important;
        text-align: center !important;
    }
    .reasons-grid {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
    .reasons-card {
        height: auto !important;
        min-height: 400px;
    }
    .reasons-card-title{
        font-size: 1.8rem !important;
    }
    .reasons-card-text {
        font-size: 1.3rem;
    }

    .ingredients-title{
        font-size: 1.8rem!important;
        text-align: center !important;
        padding: 30px 0 !important;
    }
    .ingredients-subtitle {
        font-size: 1.3rem;
    }
    .ingredients-grid {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 30px !important;
    }
    .ingredients-card {
        flex: none !important;
        width: 45% !important;
    }
    .ingredients-image-box {
        width: 100% !important;
        max-width: 240px !important;
        aspect-ratio: 1 / 1;
    }
    .ingredients-bottom-note {
        text-align: center;
    }
    .ingredients-detail-list-block{
        margin-bottom: 10px!important;
    }

    .usage-title{
        font-size: 1.8rem!important;
        text-align: center!important;
    }
    .usage-step-badge {
        font-size: 1.3rem;
    }
    .usage-step-text {
        font-size: 1.3rem;
    }

    .why-easy-box {
        flex-direction: column !important;
        padding: 30px 20px !important;
        margin: 50px 0 100px!important;
    }
    .why-easy-left, .why-easy-right-image {
        width: 100% !important;
        flex: none !important;
    }
    .why-easy-desc{
        font-size: 1.3rem;
    }
    .why-easy-circle-item {
        font-size: 1.3rem;
    }
    .why-easy-right-image {
        max-width: 440px;
        margin: 0 auto;
    }

    .recommend-title{
        font-size:1.8rem!important;
        margin-bottom: 10px !important;
        text-align:center!important;
    }
    .recommend-container {
        flex-direction: column !important;
        gap: 30px;
    }
    .recommend-list, .recommend-right-image {
        width: 100% !important;
        flex: none !important;
    }
    .recommend-item {
        width: 100% !important;
        align-self: center !important;
        font-size: 1.3rem;
    }
    .recommend-right-image {
        max-width: 500px;
        margin: 0 auto;
    }

    .mid-offer-title{
        font-size: 1.8rem!important;
        text-align:center!important;
    }
    .mid-offer-subtitle {
        font-size: 1.3rem;
    }
    .mid-offer-product-area {
        flex-direction: column !important;
        text-align: center !important;
    }
    .mid-product-info-wrap {
        align-items: center !important;
        text-align: center !important;
    }
    .mid-tags-list {
        justify-content: center !important;
    }
    .mid-tag-badge {
        font-size: 1.3rem;
    }

    .purchase-flex-row {
        flex-direction: column !important;
        gap: 40px !important;
    }
    .purchase-column {
        width: 100% !important;
    }
    .purchase-main-title{
        font-size: 1.8rem;
    }
    .purchase-shipping-tag{
        font-size: 1.3rem;
    }
    .purchase-caption {
        font-size: 1.3rem;
    }
    .purchase-price-line {
        font-size: 1rem;
    }
    .purchase-price-display-box{
        margin-top: 0!important;
    }
    .btn-purchase-submit {
        font-size: 1.3rem;
    }
    .purchase-rules-heading {
        font-size: 1.3rem;
    }
    .purchase-rules-item {
        padding-left: 22px !important;
        font-size: 1.3rem;
    }
    .purchase-rules-item::before {
        font-size: 1.3rem;
        left: 0;
        top: 1px;
    }
    .confirm-box{
        margin-bottom: 100px !important;
    }
    .confirm-title{
        font-size: 1rem;
    }
    .footer-plain-ingredients-text{
        margin-top: 30px!important;
    }

    .qa-section {
        width: 100% !important;
        border-top: none;
    }
    .qa-title{
        font-size: 1.8rem!important;
        text-align:center!important;
        margin-top: 100px!important;
    }
    .qa-subtitle {
        font-size: 1.3rem;
    }
    .qa-list {
        margin: 40px auto 100px!important;
    }
    .qa-question {
        font-size: 1.3rem;
    }
    .qa-answer-text {
        font-size: 1.3rem;
    }
    .qa-lead-a {
        font-size: 1.5rem;
        line-height: 2rem;
    }

    .final-offer-text-large {
        font-size: 1.8rem!important;
    }
    .final-offer-text-sub {
        font-size: 1.3rem;
    }
    .btn-final-cta-arrow {
        padding: 18px 20px !important;
        width: 100% !important;
        max-width: 320px;
        box-sizing: border-box;
        font-size:1.3rem;
        margin-top:30px;
    }

    .detailrightblock h3.product_name {
        font-size: 1.3rem!important;
    }
    .detailrightblock .normal_price, .mini, .sale_limit, .detailrightblock .deliv_fee.include, #cartbtn_default, .btn_sub, a.btn_sub, a.btn_sub:link, a.btn_sub:visited, a.btn_sub:hover{
        font-size: 1rem!important;
    }
    .price02_inctax_default, .cartbtn_default{
        font-size: 1.3rem!important;
    }
}

@media screen and (max-width: 560px) {
    .trouble-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px 15px !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 15px !important;
        max-width: 100% !important;
        white-space: nowrap;
    }

    .trouble-grid .trouble-card {
        width: 170px !important;
        height: 170px !important;
        min-width: 170px !important;
        min-height: 170px !important;
        padding: 15px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    .trouble-grid .trouble-card:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }

    .trouble-grid .trouble-text {
        font-size: 1.1rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
    }

    .section-title.onayami {
        order: -1 !important;
        margin-bottom: 20px !important;
    }

    .reasons-card {
        width: 95% !important;
        padding-bottom: 40px !important;
    }

    .ingredients-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 20px 10px !important;
    }
    .ingredients-card {
        width: 47% !important;
        flex: none !important;
    }
    .ingredients-image-box {
        width: 100% !important;
        max-width: 160px !important;
        aspect-ratio: 1 / 1;
        height: auto;
    }
    .ingredients-name {
        font-size: 1rem !important;
        margin-top: 5px !important;
    }

    .usage-step-item {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .usage-step-text {
        padding-left: 0 !important;
        margin-top: 15px!important;
        white-space: nowrap;
    }
    .usage-arrow {
        margin: 20px auto !important;
        align-self: center !important;
    }

    .why-easy-circles {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px 15px !important;
        justify-content: center !important;
        align-items: center !important;
        max-width: 100% !important;
    }
    .why-easy-circles .why-easy-circle-item:last-child {
        grid-column: 1 / -1 !important;
        justify-self: center !important;
    }
    .why-easy-circle-item {
        width: 140px !important;
        height: 140px !important;
        margin: 0 auto !important;
    }

    .confirm-box {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .confirm-title {
        border-right: none !important;
        border-bottom: 1px solid #000000;
        padding: 0 0 15px 0 !important;
        justify-content: center;
    }
    .confirm-grid {
        grid-template-columns: 1fr !important;
    }

    .why-easy-title, .recommend-title, .final-offer-text-large {
        font-size:1.6rem!important;
        padding: 0!important;
    }

    .sp-only {
        display: block;
    }

.lp-wrapper a:hover, .lp-wrapper a:hover img, .lp-wrapper button:hover {
    background-color: #FF931E ;
}

}

@media screen and (max-width: 560px) {
    .sp-br {
        display: inline;
    }

.summary-text{
font-size:1rem!important;
}

.trouble-summary .lead-text{
font-size:1.5rem!important;
}
.feature-item {
        font-size: 1rem !important;
    }

.ingredients-grid {
    margin-bottom: 30px !important;
}

.recommend-right-image{
        display: none;
    }

.mask-select-card .card-upper-flex {
    display: contents;
    width: 100%;
}

.mask-select-card .card-img-area {
    width: 100%;
}

.mid-offer-btn-area2 {
    width: 100%;
}

.btn-final-cta-arrow2 {
    padding: 18px 20px!important;
    font-size: 1.2rem!important;
}

}

@media screen and (min-width: 768px) and (max-width: 1050px) {
#main_column.colnum1 #detailrightbloc {
    width: 350px;
    float:left;
}

#detailarea .photo{
    max-width: 350px;
    margin: 0 50px 0 20px!important;
}

#detailarea .cart_area {
    width: 220px;
    max-width: 220px;
    min-width: 220px;
    padding: 15px;
}
}


.dummy-image-tex{
        font-size: 0.8rem !important;
    }

.reasons-card-title{
        font-size: 1.6rem !important;
    }

.ingredients-detail-group-title, .ingredients-detail-group-text {
    font-size: 0.8rem;
}

.why-easy-desc {
        font-size: 1.1rem;
    }

.why-easy-circle-item {
        font-size: 1rem;
    }

}


@media screen and (min-width: 768px) and (max-width: 1050px) {
#main_column.colnum1 #detailrightbloc {
    width: 350px;
    float:left;
}

#detailarea .photo{
    max-width: 350px;
    margin: 0 50px 0 20px!important;
}

#detailarea .cart_area {
    width: 220px;
    max-width: 220px;
    min-width: 220px;
    padding: 15px;
}
}

@media screen and (min-width: 1001px) and (max-width: 1199px) {
.bx-wrapper {
    max-width: 970px !important;
    margin: 30px 40px !important;
}
.bx-viewport {
        height: 260px !important;
}

.mask-select-container{
margin-left:0!important;
margin-right:0!important;
}

.mask-select-card .card-upper-flex
{
    width: 370px!important;
}

.mask-select-card .product-name {
    font-size: 1.7rem !important;
}

.mask-select-card .sub-title {
    font-size: 0.8rem;
}

.btn-final-cta-arrow2 {
    font-size: 1.3rem;
   padding: 18px 70px;
}

}

@media screen and (min-width: 768px) and (max-width: 1000px) {
.bx-wrapper {
    max-width: 760px !important;
    margin: 30px 10px !important;
}
.bx-viewport {
        height: 220px !important;
}

.mask-select-grid{
display: grid;
}

.recommend-right-image{
display:none;
}

.why-easy-circle-item
{
        font-size: 1rem;
    }
}

/* ホバー時に背景が透明（白）になるのを防ぎ、ゴールドを維持する */
.lp-wrapper .btn-final-cta-arrow2:hover {
    background-color: #c3a859 !important;
    opacity: 1 !important;
}




/* ==========================================
   実績バッジ（月桂樹背景＋テキスト化）
========================================== */
.achievement-sub {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    
    /* 月桂樹のみの画像を背景に指定（元の画像を流用しつつ中央に配置） */
    background-image: url("https://ecolife.co.jp/user_data/packages/raku2pc/assets/images_khmsk_24n.png");
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    
    /* バッジ全体のサイズ調整（文字が綺麗に収まる枠） */
    width: 100%;
    max-width: 480px;
    height: 180px; 
    margin: 35px auto !important;
    box-sizing: border-box;
}

/* 「累計販売枚数」のテキスト */
.achievement-sub .achieve-title {
    font-size: 2rem;
    font-weight: bold;
    color: #4a4a4a;
    line-height: 1;
    margin-bottom: 2px;
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", sans-serif;
}

/* 「2,100万枚」の数字部分 */
.achievement-sub .achieve-number {
    font-size: 4.5rem;
    font-weight: bold;
    color: #c3a859; /* 高級感のあるゴールド */
    line-height: 1.1;
    font-family: "Times New Roman", Times, serif;
}

/* 「万枚」の単位部分 */
.achievement-sub .achieve-unit {
    font-size: 1.6rem;
    font-weight: bold;
    color: #c3a859;
    margin-left: 2px;
}

/* 「（2007年4月〜）」の注記部分 */
.achievement-sub .achieve-note {
    font-size: 0.8rem;
    color: #000000;
    line-height: 1;
    margin-top: 4px;
}

/* スマホ表示での調整 */
@media screen and (max-width: 767px) {
    .achievement-sub {
        max-width: 340px;
        height: 140px;
        margin: 20px auto !important;
    }
    .achievement-sub .achieve-title {
        font-size: 1rem;
    }
    .achievement-sub .achieve-number {
        font-size: 2.4rem;
    }
    .achievement-sub .achieve-unit {
        font-size: 1.2rem;
    }
    .achievement-sub .achieve-note {
        font-size: 0.65rem;
    }
}