/* ========================= TOP °ÂÁ´补Ãú¡Ê极简¡Ë ÂþºîÍÑв #k-top¡¤ÉÔ²þÉÛ¶É ========================= */ /* 1) 彻Äì隐é¶轮ÇÅ»Äα¡Ê?î¾?/圆ÅÀ/ÍÆ´ï¡Ë */ #k-top .slider, #k-top #slider, #k-top .bx-wrapper{ display: none !important; } /* 2) 标题风³ÊÍ¿ CHECKED ITEMS 对齐¡Ê±Ñʸ¾®¹æÂç¼Ì + Àõ³¥¡Ë */ #k-top .c-ttl-main, #k-top .c-ttl-sub{ /* ÊÝαÌÏÈĸ¶Í­Åª¾å²¼间µ÷¡¤ÉÔ强²þ margin */ font-weight: 800; font-size: 13px; line-height: 1; letter-spacing: .18em; text-transform: uppercase; color: #9AA0A6; border: 0; } #k-top .c-ttl-main__ja, #k-top .c-ttl-sub__ja{ margin-left: .6rem; font-weight: 600; font-size: 12px; color: #B5BCC4; letter-spacing: normal; text-transform: none; /* ÆüʸÉÔÂç¼Ì */ } /* 3) ÐóÊÍÑ乐Å·红¡ÊÅÀ缀¡Ë¡¤Â¶Õà颜¿§ÊÝ»ýÌÏÈÄàÔ认 */ #k-top .c-item-list__price{ color: #E60012; font-weight: 800; } /* ¡Ê²Ä选¡Ë»°张²£ÉýÇ¡²ÌÍÑλ 这种结构¡¤ 给图ÊÒ°ìФ°ÂÁ´ÅªºÛÀÚ¡¤ÉÔ²ñ±Æ响¶ÕàÌÏ块 */ #k-top .u-img-scale img{ display: block; width: 100%; height: 200px; object-fit: cover; border-radius: 12px; } @media (max-width: 767px){ #k-top .u-img-scale img{ height: 170px; } } /* ========================================================= OneAdapter – Minimal White + Rakuten Red (TOP + NAV) ºîÍÑç÷围¡§顶Éô导¹Ò¡¢#k-top ¶è°è¡ÊÉÔ±Æ响¶¾页ÌÌ¡Ë ¼ç题¿§¡§乐Å·红 #E60012 ========================================================= */ /* ---------- ´ð础¿§ & 变ÎÌ¡Ê仅 #k-top À¸ÚÃ¡Ë ---------- */ #k-top{ --pri:#E60012; /* 乐Å·红 */ --ink:#111; /* ¼çʸ»ú */ --muted:#666; /* ¼¡Ê¸»ú */ --line:#E9ECEF; /* 细ʬ³Ö线 */ --chip:#F7F7F7; /* Àõ³¥块 */ --radius:14px; --shadow:0 4px 12px rgba(17,24,39,.06); background:#fff; color:var(--ink); } #k-top a{color:var(--ink);text-decoration:none} #k-top a:hover{color:var(--pri)} /* ---------- 顶Éô导¹Ò¡ÊCATEGORY °ìÇÓ¡Ë ---------- */ .l-main-navi__in{ display:flex !important; justify-content:center !important; align-items:center !important; flex-wrap:nowrap !important; gap:10px !important; background:#fff !important; border-bottom:1px solid #f3f4f6 !important; padding:8px 6px !important; } .l-main-navi-list{ display:flex !important; flex-wrap:nowrap !important; gap:10px !important; align-items:center !important; margin:0 !important; padding:0 !important; } .l-main-navi-list__item{ list-style:none !important; margin:0 !important; padding:0 !important; } .l-main-navi-list__link, .l-main-navi-list__ttl{ display:block !important; white-space:nowrap !important; padding:9px 14px !important; border-radius:10px !important; font-weight:800 !important; letter-spacing:.06em !important; font-size:13px !important; color:#111 !important; background:#fff !important; border:1px solid #eee !important; transition:all .18s ease-in-out !important; box-shadow:0 1px 2px rgba(0,0,0,.04) !important; } .l-main-navi-list__link:hover, .l-main-navi-list__ttl:hover{ background:#E60012 !important; color:#fff !important; border-color:#E60012 !important; } /* ---------- 顶Éô¾®ºÚ单¡Ê你²ÃŪÖõÇÓºÚ单¡Ë ---------- */ #k-top .k-topbar{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; padding:8px 0 4px; border-top:2px solid #E60012; /* 顶Éô细红线 */ margin-bottom:6px; } #k-top .k-topbar a{ padding:8px 12px; border:1px solid #eee; border-radius:10px; background:#fff; font-weight:800; letter-spacing:.06em; font-size:13px; } #k-top .k-topbar a:hover{ background:#E60012; color:#fff; border-color:#E60012 } /* ---------- ¶è块标题¡ÊÍ¿ CHECKED ITEMS Ʊ风³Ê¡Ë ---------- */ #k-top .c-ttl-main, #k-top .c-ttl-sub{ margin:0 0 14px; font-size:13px; line-height:1; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#9AA0A6; display:flex; align-items:flex-end; gap:.6rem; } #k-top .c-ttl-main__ja, #k-top .c-ttl-sub__ja{ color:#B5BCC4; font-size:12px; font-weight:700 } /* ---------- USP »Í项 ---------- */ #k-top .k-card, #k-top .p-shopguide-box, #k-top .k-banner, #k-top .k-cta{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); } #k-top .k-usp{ margin-top:8px } #k-top .k-usp__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px } #k-top .k-usp__item{ padding:14px } #k-top .k-usp__item strong{ display:block; font-size:15px } #k-top .k-usp__item small{ color:var(--muted) } /* ---------- Quick Search °Ä钮 ---------- */ #k-top .k-quick__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px } #k-top .k-btn{ display:inline-flex; align-items:center; justify-content:center; height:46px; min-width:120px; padding:0 18px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font-weight:800; letter-spacing:.02em; transition:.18s; } #k-top .k-btn:hover{ border-color:var(--pri); color:#fff; background:var(--pri) } #k-top .k-btn--pri{ background:var(--pri); color:#fff; border-color:var(--pri) } #k-top .k-btn--pri:hover{ filter:brightness(1.06) } #k-top .k-btn--sec{ background:#fffdf8; color:#5a1114; border-color:#ead8d2 } #k-top .k-btn--sec:hover{ background:#fff4ef; color:#5a1114; border-color:#d8beb2 } /* ---------- »°联²£Éý ---------- */ #k-top .k-banner__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px } #k-top .k-banner img{ width:100%; height:200px; object-fit:cover; border-radius:12px; display:block } /* ---------- ʬ类卡ÊÒ ---------- */ #k-top .k-cat__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px } #k-top .k-cat{ display:flex; flex-direction:column; gap:.25rem; padding:16px; background:#fff; border:1px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); box-shadow:var(--shadow); transition:.18s; } #k-top .k-cat:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,.08) } #k-top .k-cat span{ font-weight:800 } #k-top .k-cat small{ color:var(--muted) } /* ---------- HOT ITEMS ¾¦ÉÊ卡³õÄì优²½ ---------- */ #k-top .c-item-list{ gap:0; row-gap:28px } #k-top .c-item-list__item{ padding-bottom:0; transition:transform .18s ease, box-shadow .18s ease } #k-top .c-item-list__item:hover{ transform:translateY(-2px) } #k-top .c-item-list__img{ margin-bottom:12px; border:1px solid var(--line); border-radius:12px; overflow:hidden; box-shadow:var(--shadow) } #k-top .c-item-list__img:before{ padding-top:100% } /* ÊÝ证Êý图Àê°Ì */ #k-top .c-item-list__ttl a{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; line-height:1.45; word-break:break-word; color:var(--ink); } #k-top .c-item-list__price{ margin-top:8px; color:var(--pri); font-weight:800 } #k-top .c-item-list__price.is-strikethrough{ color:#A0A7AF } #k-top .c-item-list__price.is-soldout{ color:#C1475B } /* ---------- NEWS / INFORMATION Îóɽ ---------- */ #k-top .k-news, #k-top .k-info, #k-top .p-information__body{ border:1px solid var(--line); border-radius:12px; padding:14px 16px; background:#fff; box-shadow:var(--shadow) } #k-top .k-news li{ display:flex; gap:.75rem; align-items:flex-start; padding:10px 0; border-bottom:1px solid var(--line) } #k-top .k-news li:last-child{ border-bottom:none } #k-top .k-news__date{ min-width:7em; color:#9AA0A6; font-size:12px } #k-top .k-news__txt{ color:var(--ink) } /* ---------- ÄìÉô CTA ¹Ô ---------- */ #k-top .k-cta__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; text-align:center } /* ---------- µîÙÜ´±Êý轮ÇÅ»ÄαͿ¶õ·ä¡Ê确ÊÝ关闭λ¸¸Åô¡Ë ---------- */ #k-top .slider, #k-top .bx-wrapper{ display:none !important } #k-top .u-container:empty{ display:none !important } /* ---------- 响应¼°Èù调 ---------- */ @media (max-width: 1030px){ .l-main-navi__in{ overflow-x:auto; justify-content:flex-start !important } } @media (max-width: 767px){ #k-top .k-banner img{ height:170px } #k-top .c-ttl-main{ font-size:12.5px } } /* --- TOP页导¹Ò½¤Àµ¡§µîÙܽÅ复Ū CATEGORY 标题¡¤ÂþÊÝα°Ä钮 --- */ .l-main.top .l-main-navi-list__ttl{ display:none !important; } /* --- TOP页导¹Ò²£¸þÇÓ齐 --- */ .l-main.top .l-main-navi__in{ display:flex !important; justify-content:center !important; align-items:center !important; gap:10px !important; background:#fff !important; border-bottom:1px solid #f3f4f6 !important; padding:8px 6px !important; } .l-main.top .l-main-navi-list{ display:flex !important; flex-wrap:nowrap !important; gap:10px !important; align-items:center !important; margin:0 !important; padding:0 !important; } .l-main.top .l-main-navi-list__item{ list-style:none !important; margin:0 !important; } /* 样¼°ÊÝ»ýÍ¿°Ä钮°ìÃ× */ .l-main.top .l-main-navi-list__link{ display:block !important; white-space:nowrap !important; padding:9px 14px !important; border-radius:10px !important; font-weight:800 !important; letter-spacing:.06em !important; font-size:13px !important; color:#111 !important; background:#fff !important; border:1px solid #eee !important; transition:all .18s ease-in-out !important; box-shadow:0 1px 2px rgba(0,0,0,.04) !important; } .l-main.top .l-main-navi-list__link:hover{ background:#E60012 !important; color:#fff !important; border-color:#E60012 !important; } /* ¾®Ö¢»Ù»ý²£¸þ³ê动¡¤ÉÔ换¹Ô */ @media (max-width:1030px){ .l-main.top .l-main-navi__in{ overflow-x:auto; justify-content:flex-start !important; } } /* ===== FIX: 顶Éô导¹Ò½Å复 & ̤对齐 ===== */ /* 1) µîÙÜ¡È标题¡ÉÆá份 CATEGORY¡¤ÂþÊÝα°Ä钮Æá份 */ .l-main-navi-list__ttl{ display:none !important; } /* 2) 导¹Ò²£¸þÇÓ齐 */ .l-main-navi__in{ display:flex !important; justify-content:center !important; align-items:center !important; gap:10px !important; padding:8px 6px !important; background:#fff !important; border-bottom:1px solid #f3f4f6 !important; } .l-main-navi-list{ display:flex !important; flex-wrap:nowrap !important; gap:10px !important; margin:0 !important; padding:0 !important; } .l-main-navi-list__item{ list-style:none !important; margin:0 !important; } /* 3) °Ä钮样¼° */ .l-main-navi-list__link{ display:block !important; white-space:nowrap !important; padding:9px 14px !important; border-radius:10px !important; font-weight:800 !important; letter-spacing:.06em !important; font-size:13px !important; color:#111 !important; background:#fff !important; border:1px solid #eee !important; transition:all .18s ease-in-out !important; box-shadow:0 1px 2px rgba(0,0,0,.04) !important; } .l-main-navi-list__link:hover{ background:#E60012 !important; color:#fff !important; border-color:#E60012 !important; } /* 4) ¾®Ö¢²Ä²£¸þ滚动¡¤ÉÔ换¹Ô */ @media (max-width:1030px){ .l-main-navi__in{ overflow-x:auto; justify-content:flex-start !important; } } /* ========== USP »Í宫³Ê统°ì优²½ ========== */ #k-top .k-usp__grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; /* ¸ÇÄê 4 ÎóÉÛ¶É */ gap: 16px !important; margin: 20px 0 !important; padding: 0 !important; } /* USP 每Ф卡ÊÒ样¼° */ #k-top .k-usp__item { display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; padding: 18px 10px !important; border-radius: 12px !important; border: 1px solid #e7eaee !important; background-color: #fff !important; box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important; transition: all 0.2s ease-in-out !important; height: 100% !important; text-align: center !important; min-height: 90px !important; } #k-top .k-usp__item:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important; transform: translateY(-2px); } /* USP ¼ç标题¡ÊPSEǧ¾Ú / ÅÅ°µ¥Õ¥ë¥ì¥ó¥¸ / Á÷ÎÁ̵ÎÁ / ¥«¥¹¥¿¥àÂбþ¡Ë */ #k-top .k-usp__item strong { font-size: 15px !important; font-weight: 700 !important; color: #111 !important; margin-bottom: 6px !important; letter-spacing: 0.02em !important; text-align: center !important; display: block !important; } /* USP Éû标题¡ÊÀâÌÀʸ¡Ë */ #k-top .k-usp__item small { display: block !important; font-size: 13px !important; font-weight: 500 !important; color: #656d76 !important; text-align: center !important; line-height: 1.4 !important; } /* 响应¼°¡§¾®Ö¢Ëë变两Îó */ @media (max-width: 767px) { #k-top .k-usp__grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; } #k-top .k-usp__item { padding: 14px 8px !important; min-height: 80px !important; } #k-top .k-usp__item strong { font-size: 14px !important; } #k-top .k-usp__item small { font-size: 12px !important; } } /*********************** OneAdapter – TOP °ìÂβ½½¤Àµ 极简ÇòÄì + 乐Å·红 / 仅对¼ó页µ¯ÚáÊ头Éô导¹Ò为ÄÌÍÑâ°ÂÁ´¡Ë ************************/ /* ====== Á´¶É´ð调¡Ê仅顶Éô #k-top Æâ¡Ë====== */ #k-top{ --rakuten:#E60012; --ink:#111; --muted:#656D76; --line:#E7EAEE; --bg:#fff; --radius:14px; --shadow:0 4px 12px rgba(17,24,39,.06); background:#fff; color:var(--ink); } #k-top .u-container{box-sizing:border-box;max-width:1200px;margin:0 auto;padding:0 16px} #k-top .k-section{margin:28px 0} /* ====== ?? 顶Éô导¹Ò¡Ê药´Ý°Ä钮¡ËµïÃæ + µî½Å ====== */ /* 隐鶡ÈCATEGORY¡ÉÆáФÀÅ态标题¡¤ÈòÌÈÏ°Ä钮½Å复¡ÊÁ´ãë隐é¶À§°ÂÁ´Åª¡Ë */ .l-main-navi .l-main-navi-list__ttl{display:none !important} /* 导¹ÒÍÆ´ïµïÃæ对齐Öõ°ô许¼«动换¹Ô */ .l-main-navi .l-main-navi__in{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap} /* 导¹ÒÎóɽÌéÍÑflexÇÓÉÛ¡¤À¶ÙÜÌÏÈÄŪ³°边µ÷ */ .l-main-navi .l-main-navi-list{display:flex;gap:10px;flex-wrap:wrap;margin:0 !important} /* ÇÄ每Ф°Ä钮ÐöÀ®圆³Ñ¡È药´Ý¡É */ .l-main-navi .l-main-navi-list__link{ display:inline-flex;align-items:center;justify-content:center; min-height:38px;padding:0 14px;border-radius:999px; border:1px solid #E7EAEE;background:#fff;color:#111; font-weight:800;letter-spacing:.04em;transition:.18s;text-decoration:none; } .l-main-navi .l-main-navi-list__link:hover{border-color:var(--rakuten);background:var(--rakuten);color:#fff} /* µîÙÜ你Ù£图ΤÆá¾òÀÃÌÜŪ红¿§²£线¡ÊÌÏÈľï见Ūborder/伪¸µÁÇ¡Ë */ .l-main-navi{border:0 !important;box-shadow:none !important} .l-header{border-bottom:0 !important} .l-header:before,.l-header:after,.l-main-navi:before,.l-main-navi:after{display:none !important} /* PC ÊÝ»ý°ì¹Ô¹¹紧凑 */ @media (min-width:1030px){ .l-main-navi .l-main-navi__in{gap:12px} .l-main-navi .l-main-navi-list{gap:12px} } /* ====== ?? USP »Í宫³Ê¡ÊPSEǧ¾Ú¡Ä¡Ë统°ì ====== */ #k-top .k-usp__grid{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:16px !important; margin:20px 0 !important; padding:0 !important; } #k-top .k-usp__item{ display:flex !important; flex-direction:column !important; justify-content:center !important; align-items:center !important; text-align:center !important; height:100% !important; min-height:120px !important; padding:22px 14px !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:12px !important; box-shadow:var(--shadow) !important; transition:.2s ease; } #k-top .k-usp__item:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(17,24,39,.10)} #k-top .k-usp__item strong{display:block;font-size:18px !important;font-weight:800 !important;color:#111 !important;margin-bottom:8px !important} #k-top .k-usp__item small{display:block;font-size:14px !important;color:#656D76 !important;line-height:1.45 !important} /* ¼ê´ù¡§两Îó显¼¨¡¢Î±Çò¹¹紧凑 */ @media (max-width:767px){ #k-top .k-usp__grid{grid-template-columns:repeat(2,1fr) !important; gap:12px !important} #k-top .k-usp__item{min-height:100px !important; padding:16px 10px !important} #k-top .k-usp__item strong{font-size:16px !important} #k-top .k-usp__item small{font-size:13px !important} } /* ====== ?? Quick Search / Banner / ʬ类卡ÊÒ¡Ê统°ì风³Ê¡¤ËÉ跑ÈÇ¡Ë ====== */ #k-top .k-card{background:#fff !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;box-shadow:var(--shadow) !important;padding:16px !important} #k-top .c-ttl-main{margin:0 0 14px;font:800 13px/1 system-ui;color:#9AA0A6 !important;letter-spacing:.18em;text-transform:uppercase;border:0 !important} #k-top .c-ttl-main__ja{margin-left:.6rem;color:#B5BCC4 !important;font-weight:600;font-size:12px} /* °Ä钮组 */ #k-top .k-quick__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px} #k-top .k-btn{ display:inline-flex;align-items:center;justify-content:center;height:46px; padding:0 16px;border-radius:10px;border:1px solid var(--line) !important; background:#fff !important;color:#222 !important;font-weight:700;transition:.18s;white-space:nowrap;text-decoration:none; } #k-top .k-btn--pri{border-color:var(--rakuten) !important;background:var(--rakuten) !important;color:#fff !important} #k-top .k-btn:hover{border-color:var(--rakuten) !important;background:var(--rakuten) !important;color:#fff !important} /* ²£Éý */ #k-top .k-banner__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px} #k-top .k-banner{padding:0 !important;overflow:hidden !important;background:#fff !important;border:1px solid var(--line) !important;border-radius:12px !important;box-shadow:var(--shadow) !important} #k-top .k-banner img{display:block;width:100%;height:200px;object-fit:cover} /* ʬ类卡ÊÒ */ #k-top .k-cat__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px} #k-top .k-cat{ display:flex;flex-direction:column;gap:.25rem;padding:16px !important;text-decoration:none; background:#fff !important;border:1px solid var(--line) !important;border-radius:12px !important;box-shadow:var(--shadow) !important;color:#222 !important;transition:.15s; } #k-top .k-cat:hover{transform:translateY(-1px)} #k-top .k-cat span{font-weight:800} #k-top .k-cat small{color:#656D76 !important} /* ¾¦ÉÊÎóɽ³õÄì */ #k-top .k-items .c-item-list__img{margin-bottom:10px;border:1px solid var(--line) !important;border-radius:12px !important;overflow:hidden !important;box-shadow:var(--shadow) !important;background:#fff !important} #k-top .k-items .c-item-list__ttl a{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;color:#222 !important;text-decoration:none} #k-top .k-items .c-item-list__price{margin-top:6px;color:var(--rakuten) !important;font-weight:800} /* 杂项¡§À¶ÍýǤ²¿»ÄαŪ¼ç视觉/轮ÇÅÍÆ´ï */ #k-top .slider,#k-top #slider,#k-top .bx-wrapper,#k-top .p-slider,#k-top .p-mainvisual,#k-top .p-hero{display:none !important} /* ===== 顶Éô导¹Ò¡§µîÙܽÅ复Ū¡ÈCATEGORY¡É标题 + µîÙÜ红线 ===== */ .l-main-navi .l-main-navi-list__ttl{display:none !important;} .l-main-navi,.l-header{border:0 !important;} .l-main-navi:before,.l-main-navi:after,.l-header:before,.l-header:after{display:none !important;} /* 让°Ä钮¼ÜÀ£¹¹¹îÀ©°ìº³¡Ê别Æá么¡ÈÈî¡É¡Ë */ .l-main-navi .l-main-navi-list__link{ min-height:34px;padding:0 12px;border-radius:8px; } /* ===== USP »Í宫³Ê¡§¸ÇÄê为 4 Åù宽Îó¡¤卡ÊÒµïÃæ对齐¡¢统°ì¹âÅÙ ===== */ #k-top .k-usp__grid{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; /* PC ¸ÇÄê 4 Îó¡¤ÉÔαÂçÊÒ¶õÇò */ gap:16px !important;margin:20px 0 !important;padding:0 !important; } #k-top .k-usp__item{ display:flex !important;flex-direction:column !important; justify-content:center !important;align-items:center !important;text-align:center !important; min-height:140px !important;padding:18px !important; background:#fff !important;border:1px solid #E7EAEE !important;border-radius:12px !important; box-shadow:0 2px 8px rgba(17,24,39,.06) !important; } #k-top .k-usp__item strong{font-size:20px !important;margin-bottom:6px !important;color:#111 !important;} #k-top .k-usp__item small{font-size:14px !important;color:#6B7280 !important;} @media (max-width:1030px){ #k-top .k-usp__grid{grid-template-columns:repeat(2,1fr) !important;} /* °Ü动ü两Îó */ } /* OneAdapter top mobile detail polish v1 start */ /* OneAdapter top mobile detail polish v1 */ @media (min-width: 768px) { #k-top .k-btn--sec, #k-top .k-btn--ghost { border-color: #ead8d2 !important; background: #fffdf8 !important; color: #5a1114 !important; } } @media (max-width: 767px) { .k-topbar { display: none !important; } #oa-soft-top .oa-soft-nav { display: none !important; } #oa-soft-top { padding-top: 60px !important; background: linear-gradient(180deg, #fffaf7 0%, #fff3ee 52%, #fffaf7 100%) !important; } #oa-soft-top .oa-soft-hero-grid { padding: 24px 0 26px !important; gap: 18px !important; } #oa-soft-top .oa-soft-kicker { margin-bottom: 10px !important; color: #9b1c22 !important; font-size: 11px !important; letter-spacing: .08em !important; } #oa-soft-top h1 { max-width: 11em !important; font-size: 30px !important; line-height: 1.34 !important; letter-spacing: 0 !important; color: #5a1114 !important; } #oa-soft-top .oa-soft-lead { margin-top: 16px !important; font-size: 14px !important; line-height: 1.88 !important; color: #655653 !important; } #oa-soft-top .oa-soft-search { margin-top: 18px !important; padding: 7px !important; border: 1px solid rgba(139, 30, 30, .18) !important; border-radius: 14px !important; background: rgba(255,253,248,.94) !important; box-shadow: 0 14px 26px rgba(62,28,12,.08) !important; } #oa-soft-top .oa-soft-search input { min-height: 48px !important; padding: 0 10px !important; font-size: 14px !important; } #oa-soft-top .oa-soft-search button { width: 96px !important; min-height: 48px !important; border-radius: 10px !important; background: linear-gradient(180deg, #a71b25, #6b1115) !important; color: #fffdf8 !important; box-shadow: none !important; } #oa-soft-top .oa-soft-actions { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; margin-top: 14px !important; } #oa-soft-top .oa-soft-actions .oa-soft-button { width: 100% !important; min-width: 0 !important; padding-right: 6px !important; padding-left: 6px !important; min-height: 44px !important; border-radius: 10px !important; font-size: 13px !important; line-height: 1.25 !important; box-shadow: 0 8px 18px rgba(62,28,12,.06) !important; } #oa-soft-top .oa-soft-visual { margin-top: 12px !important; padding: 14px !important; border-radius: 18px !important; background: rgba(255,253,248,.78) !important; box-shadow: 0 14px 30px rgba(62,28,12,.07) !important; } #oa-soft-top .oa-soft-visual img, #k-top .k-items .c-item-list__img img, #k-top .c-item-list__img img { display: block !important; max-width: 100% !important; height: auto !important; object-fit: contain !important; } #k-top .k-card { padding: 18px !important; border: 1px solid #ead8d2 !important; border-radius: 16px !important; background: #fffdf8 !important; box-shadow: 0 10px 26px rgba(62, 28, 12, .07) !important; } #k-top .k-quick__grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; } #k-top .k-btn { min-height: 52px !important; height: auto !important; padding: 11px 10px !important; border-radius: 11px !important; border-width: 1px !important; font-size: 14px !important; font-weight: 850 !important; line-height: 1.35 !important; letter-spacing: 0 !important; box-shadow: 0 6px 14px rgba(62, 28, 12, .055) !important; } #k-top .k-btn--pri { border-color: #8b1e1e !important; background: linear-gradient(180deg, #b91523 0%, #8f1119 56%, #641012 100%) !important; color: #fffdf8 !important; box-shadow: 0 8px 18px rgba(139, 30, 30, .16) !important; } #k-top .k-btn--sec, #k-top .k-btn--ghost { border-color: #ead8d2 !important; background: #fffdf8 !important; color: #5a1114 !important; } #k-top .k-btn:hover { border-color: #8b1e1e !important; background: #8b1e1e !important; color: #fffdf8 !important; } #k-top .k-cta__grid { grid-template-columns: 1fr !important; gap: 10px !important; } #k-top .k-cta__grid .k-btn { min-height: 54px !important; border-radius: 12px !important; } #k-top .k-cat__grid { grid-template-columns: 1fr !important; gap: 10px !important; } #k-top .k-cat { padding: 15px !important; border-radius: 13px !important; border-color: #ead8d2 !important; background: #fffdf8 !important; box-shadow: 0 8px 20px rgba(62, 28, 12, .055) !important; } #k-top .k-items .c-item-list__img { border-radius: 16px !important; border-color: #f0e7e1 !important; box-shadow: none !important; } #k-top .k-items .c-item-list__ttl a { line-height: 1.55 !important; } } /* OneAdapter top mobile detail polish v1 end */ /* OneAdapter top PC design polish v1 start */ /* OneAdapter top PC design polish v1 */ @media (min-width: 768px) { #k-top .k-topbar { justify-content: center !important; gap: 10px !important; padding: 10px 0 8px !important; border-top: 1px solid #ead8d2 !important; border-bottom: 1px solid #f1e5dd !important; background: #fffaf7 !important; } #k-top .k-topbar a { min-height: 34px !important; padding: 7px 14px !important; border: 1px solid #ead8d2 !important; border-radius: 10px !important; background: #fffdf8 !important; color: #3e1c0c !important; font-size: 13px !important; font-weight: 850 !important; letter-spacing: 0 !important; box-shadow: 0 4px 12px rgba(62, 28, 12, .04) !important; } #k-top .k-topbar a:hover { border-color: #7b1f16 !important; background: #7b1f16 !important; color: #fffdf8 !important; } #k-top .k-quick__grid { grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important; gap: 12px !important; } #k-top .k-quick__grid .k-btn, #k-top .k-quick__grid .k-btn--pri, #k-top .k-quick__grid .k-btn--ghost { box-sizing: border-box !important; min-width: 0 !important; height: 54px !important; min-height: 54px !important; max-height: 54px !important; padding: 0 14px !important; border: 1px solid #e6ddd0 !important; border-radius: 10px !important; background: #fffdf8 !important; color: #24201b !important; font-weight: 850 !important; letter-spacing: 0 !important; box-shadow: 0 8px 18px rgba(62, 28, 12, .05) !important; } #k-top .k-quick__grid .k-btn:hover { border-color: #7b1f16 !important; background: #f4e4dd !important; color: #4b130f !important; } #k-top .k-items .c-item-list__img, #k-top .c-item-list__img { background: #fffdf8 !important; } #k-top .k-items .c-item-list__img img, #k-top .c-item-list__img img { width: 100% !important; height: 100% !important; object-fit: contain !important; background: #fffdf8 !important; } } /* OneAdapter top PC design polish v1 end */ /* OneAdapter USP card alignment fix v1 start */ /* OneAdapter USP card alignment fix v1 */ #k-top .k-usp.k-card { display: block !important; box-sizing: border-box !important; width: 100% !important; } #k-top .k-usp__grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; align-items: stretch !important; width: 100% !important; box-sizing: border-box !important; gap: 16px !important; margin: 20px 0 !important; padding: 0 !important; } #k-top .k-usp__item { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; width: 100% !important; height: auto !important; min-height: 150px !important; padding: 22px 16px !important; text-align: center !important; } #k-top .k-usp__item strong, #k-top .k-usp__item small { width: 100% !important; box-sizing: border-box !important; text-align: center !important; } #k-top .k-usp__item strong { margin: 0 0 8px !important; line-height: 1.35 !important; } #k-top .k-usp__item small { margin: 0 !important; min-height: 0 !important; line-height: 1.55 !important; } @media (max-width: 767px) { #k-top .k-usp__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; margin: 14px 0 !important; } #k-top .k-usp__item { min-height: 104px !important; padding: 16px 10px !important; } } /* OneAdapter USP card alignment fix v1 end */ /* OneAdapter top color depth polish v1 start */ /* OneAdapter top color depth polish v1 */ #k-top { --oa-tech: #263442; --oa-copper: #c7874a; --oa-teal: #1f6f68; --oa-red-main: #8b1e22; --oa-ivory: #fffdf8; --oa-blue-soft: #edf3f7; --oa-teal-soft: #edf7f5; --oa-copper-soft: #fbf2e8; } #oa-soft-top .oa-soft-hero { background: radial-gradient(circle at 82% 12%, rgba(199, 135, 74, .24), transparent 30%), radial-gradient(circle at 94% 78%, rgba(38, 52, 66, .18), transparent 28%), linear-gradient(135deg, #fff7f1 0%, #fffdf8 38%, #eef4f6 100%) !important; } #oa-soft-top .oa-soft-kicker { color: var(--oa-copper) !important; } #oa-soft-top .oa-soft-spec { gap: 10px !important; } #oa-soft-top .oa-soft-spec span { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important; position: relative; overflow: hidden; padding-left: 17px !important; border-radius: 12px !important; border-color: rgba(38, 52, 66, .12) !important; background: var(--oa-ivory) !important; } #oa-soft-top .oa-soft-spec span:before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--oa-red-main); } #oa-soft-top .oa-soft-spec span:nth-child(1) { background: linear-gradient(180deg, #fffdf8, #fff1ee) !important; } #oa-soft-top .oa-soft-spec span:nth-child(1):before, #oa-soft-top .oa-soft-spec span:nth-child(1) b { color: var(--oa-red-main) !important; background: var(--oa-red-main); } #oa-soft-top .oa-soft-spec span:nth-child(2) { background: linear-gradient(180deg, #fffdf8, var(--oa-copper-soft)) !important; } #oa-soft-top .oa-soft-spec span:nth-child(2):before, #oa-soft-top .oa-soft-spec span:nth-child(2) b { color: #9a5b22 !important; background: var(--oa-copper); } #oa-soft-top .oa-soft-spec span:nth-child(3) { background: linear-gradient(180deg, #fffdf8, var(--oa-blue-soft)) !important; } #oa-soft-top .oa-soft-spec span:nth-child(3):before, #oa-soft-top .oa-soft-spec span:nth-child(3) b { color: var(--oa-tech) !important; background: var(--oa-tech); } #oa-soft-top .oa-soft-spec span b { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 32px !important; height: 24px !important; margin: 0 0 6px !important; padding: 0 8px !important; border-radius: 8px !important; color: var(--oa-ivory) !important; font-size: 13px !important; line-height: 1 !important; letter-spacing: .02em !important; } #oa-soft-top .oa-soft-spec span:nth-child(1) b { background: var(--oa-red-main) !important; color: var(--oa-ivory) !important; } #oa-soft-top .oa-soft-spec span:nth-child(2) b { background: var(--oa-copper) !important; color: var(--oa-ivory) !important; } #oa-soft-top .oa-soft-spec span:nth-child(3) b { background: var(--oa-tech) !important; color: var(--oa-ivory) !important; } #k-top .k-usp__item { position: relative; overflow: hidden; background: linear-gradient(180deg, #fff, #fffdf8) !important; } #k-top .k-usp__item:before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--oa-red-main); } #k-top .k-usp__item:after { content: ""; position: absolute; right: 16px; bottom: 14px; width: 34px; height: 34px; border-radius: 999px; background: rgba(139, 30, 34, .07); } #k-top .k-usp__item:nth-child(1):before { background: var(--oa-red-main); } #k-top .k-usp__item:nth-child(1):after { background: rgba(139, 30, 34, .07); } #k-top .k-usp__item:nth-child(2):before { background: var(--oa-tech); } #k-top .k-usp__item:nth-child(2):after { background: rgba(38, 52, 66, .07); } #k-top .k-usp__item:nth-child(3):before { background: var(--oa-copper); } #k-top .k-usp__item:nth-child(3):after { background: rgba(199, 135, 74, .10); } #k-top .k-usp__item:nth-child(4):before { background: var(--oa-teal); } #k-top .k-usp__item:nth-child(4):after { background: rgba(31, 111, 104, .08); } #k-top .k-usp__item:nth-child(2) strong { color: var(--oa-tech) !important; } #k-top .k-usp__item:nth-child(3) strong { color: #8a541f !important; } #k-top .k-usp__item:nth-child(4) strong { color: var(--oa-teal) !important; } #k-top .k-quick__grid .k-btn:nth-child(-n+4) { border-color: rgba(139, 30, 34, .18) !important; background: linear-gradient(180deg, #fffdf8, #fff4f1) !important; } #k-top .k-quick__grid .k-btn:nth-child(n+5) { border-color: rgba(38, 52, 66, .16) !important; background: linear-gradient(180deg, #fffdf8, #f1f5f7) !important; } #k-top .k-quick__grid .k-btn:nth-child(5), #k-top .k-quick__grid .k-btn:nth-child(6) { border-color: rgba(199, 135, 74, .22) !important; background: linear-gradient(180deg, #fffdf8, #fbf2e8) !important; } @media (max-width: 767px) { #oa-soft-top .oa-soft-hero { background: radial-gradient(circle at 94% 20%, rgba(199, 135, 74, .22), transparent 28%), linear-gradient(180deg, #fff7f1 0%, #fffdf8 58%, #edf4f6 100%) !important; } #k-top .k-usp__item:after { width: 24px; height: 24px; right: 10px; bottom: 10px; } } /* OneAdapter top color depth polish v1 end */