/* BASIC css start */ #contentWrap {width:1300px!important;} #productClass.sh-ranking { --ranking-accent:#007aff; --ranking-ink:#151515; } .footer_section {display : none;} #productClass.sh-ranking [hidden] { display:none !important; } .cwwidth { width:1500px !important; max-width:100%; box-sizing:border-box; } #productClass.sh-ranking .ranking-head { margin:30px 0 32px; text-align:center; } #productClass.sh-ranking .ranking-head h2 { margin:0; color:#151515; font-size:32px; font-weight:800; letter-spacing:-.7px; line-height:1.3; display : none;} #productClass.sh-ranking .ranking-desc { margin:12px 0 0; color:#777; font-size:14px; line-height:1.6; } #productClass.sh-ranking .ranking-tab-wrap { display:flex; justify-content:center; margin:0; border-bottom:1px solid #e7e7e7; } #productClass.sh-ranking .ranking-tab { position:relative; display:block; min-width:180px; box-sizing:border-box; padding:18px 30px; text-align:center; font-size:16px; font-weight:500; color:#999; text-decoration:none; transition:color .15s,background .15s; } #productClass.sh-ranking .ranking-tab:hover { color:var(--ranking-accent); background:#f3f8ff; } #productClass.sh-ranking .ranking-tab.active { color:var(--ranking-accent); font-weight:800; } #productClass.sh-ranking .ranking-tab.active::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:var(--ranking-accent); } #productClass.sh-ranking a:focus-visible, #productClass.sh-ranking button:focus-visible { outline:2px solid var(--ranking-accent); outline-offset:3px; } #productClass.sh-ranking .page-body { padding-top:36px; } #productClass.sh-ranking .ranking-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:54px 24px; width:100%; margin:0; padding:0; } #productClass.sh-ranking .ranking-item { position:relative; float:none !important; width:100% !important; min-width:0; margin:0 !important; padding:0 !important; box-sizing:border-box; text-align:left; } #productClass.sh-ranking .thumb { position:relative; width:100%; margin:0; padding:0; overflow:hidden; } #productClass.sh-ranking .thumb > a { display:block; width:100%; } #productClass.sh-ranking .thumb img { display:block; width:100% !important; height:auto !important; margin:0; } #productClass.sh-ranking .ranking-badge { position:absolute; left:12px; top:12px; z-index:2; display:flex; align-items:center; gap:9px; min-height:38px; padding:4px 10px; box-sizing:border-box; background:#000; pointer-events:none; } #productClass.sh-ranking .ranking-num { color:#fff; font-size:24px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; } #productClass.sh-ranking .rank-top .ranking-num { color:#fff; } #productClass.sh-ranking .ranking-change { font-size:11px; font-weight:700; white-space:nowrap; } #productClass.sh-ranking .ranking-change.up { color:#ff8585; } #productClass.sh-ranking .ranking-change.down { color:#80baff; } #productClass.sh-ranking .ranking-change.same { color:#bbb; } #productClass.sh-ranking .ranking-change.new { color:#80baff; } #productClass.sh-ranking .prd-info { width:100%; margin:0; padding:12px 0 0; box-sizing:border-box; text-align:left; } #productClass.sh-ranking .prd-info > ul { margin:0; padding:0; list-style:none; } #productClass.sh-ranking .prd-info > ul > li { float:none; width:auto; padding:0; text-align:left; } #productClass.sh-ranking .prd-brand { margin:0 0 4px; color:#111; font-size:14px; font-weight:800; line-height:1.4; overflow-wrap:anywhere; } #productClass.sh-ranking .prd-name { margin:0; font-size:14px; font-weight:400; line-height:1.5; } #productClass.sh-ranking .prd-name a { color:#333;font-size:14px!important; text-decoration:none; display:block; overflow-wrap:anywhere; } #productClass.sh-ranking .prd-price { display:flex; flex-wrap:wrap; align-items:baseline; gap:3px 8px; min-height:0; margin:6px 0 0; line-height:24px; } #productClass.sh-ranking .prd-price strike { order:2; display:block; margin:0; color:#999; font-size:12px; font-weight:400; line-height:18px; } #productClass.sh-ranking .price-line { order:1; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; min-height:0; line-height:24px; } #productClass.sh-ranking .discount-rate { white-space:nowrap; color:var(--ranking-accent); font-size:17px; font-weight:800; } #productClass.sh-ranking .prd-price .price { white-space:nowrap; color:#111; font-size:17px; font-weight:800; letter-spacing:-.3px; } #productClass.sh-ranking .soldout, #productClass.sh-ranking .price-replace { color:#666; font-size:14px; line-height:24px; } #productClass.sh-ranking .prd-ico { margin:8px 0 0; line-height:1.4; } #productClass.sh-ranking .prd-ico:empty { display:none; } #productClass.sh-ranking .prd-ico img { max-width:100%; height:auto; vertical-align:middle; } #productClass.sh-ranking .prd-color { margin:7px 0 0; } #productClass.sh-ranking .prd-review { display:inline-block; margin:7px 7px 0 0; color:#777; font-size:12px; line-height:1.5; } #productClass.sh-ranking .optionPreview { position:relative; width:200px; max-width:100%; margin:8px 0 0; } #productClass.sh-ranking .optionPreview * { box-sizing:border-box; } #productClass.sh-ranking .optionPreview .mk_opt_oneclick, #productClass.sh-ranking .optionPreview > img { display:none !important; } #productClass.sh-ranking .prevOptionBtn { position:relative; display:block; width:100%; margin:0; padding:0 30px 0 12px; border:1px solid #dedede; border-radius:3px; background:#fff; color:#555; font-family:inherit; font-size:12px; line-height:32px; text-align:left; cursor:pointer; } #productClass.sh-ranking .prevOptionBtn img { position:absolute; top:14px; right:12px; width:auto; height:auto; } #productClass.sh-ranking .prevOptionBtn.open img { transform:rotate(180deg); } #productClass.sh-ranking .optionPreviewListWrap { display:none; position:relative; z-index:20; } #productClass.sh-ranking .optionPreview #MK_opt_preview { top:0 !important; left:0 !important; width:100% !important; margin:0 !important; border-radius:3px; background:#fff; } #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list { width:100% !important; padding:8px 0; border:1px solid #dedede; border-top:none; background:#fff; } #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list li { margin:5px 10px; padding-left:8px; text-align:left; } #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list li:hover { background:#f4f4f4; } #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list li.mk_opt_top, #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list h5.option-name, #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list li.mk_bt_opt_close { display:none; } #productClass.sh-ranking .optionPreview #MK_opt_preview .mk_prd_option_list li p { display:inline-block; font-size:12px; color:#242424; line-height:22px; } @media(max-width:1100px) { #productClass.sh-ranking .ranking-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px 18px; } } @media(max-width:768px) { #productClass.sh-ranking .ranking-head { margin:24px 0; } #productClass.sh-ranking .ranking-head h2 { font-size:26px; } #productClass.sh-ranking .ranking-desc { font-size:12px; } #productClass.sh-ranking .ranking-tab { flex:1; min-width:0; padding:15px 6px; font-size:14px; } #productClass.sh-ranking .page-body { padding-top:24px; } #productClass.sh-ranking .ranking-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:34px 12px; } #productClass.sh-ranking .ranking-badge { left:7px; top:7px; gap:6px; min-height:30px; padding:4px 7px; } #productClass.sh-ranking .ranking-num { font-size:19px; } #productClass.sh-ranking .ranking-change { font-size:10px; } #productClass.sh-ranking .prd-info { padding-top:12px; } #productClass.sh-ranking .prd-brand, #productClass.sh-ranking .prd-name { font-size:12px; } #productClass.sh-ranking .discount-rate, #productClass.sh-ranking .prd-price .price { font-size:15px; } } /* BASIC css end */