/* 商品ページ（S・NS・ギフト・その他・6本用）の商品部分だけを、元のサイトと同じ見た目にする（2026-10-29）
   元の style.css・base.css（先方の納品コード）から、商品部分で使う指定を <div class="orig"> の中だけに効くように写した。
   shop.css の共通の指定（見出しの帯・余白・ボタンの色など）を、この中では打ち消している。
   元は横幅960px固定。999px以下では商品の枠を縦に積む（下の「狭い画面」）。 */

/* ---------- 打ち消しと土台（元の base.css の冒頭） ---------- */
.orig, .orig * { box-sizing: content-box; }
.orig {
  font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", sans-serif;
  font-size: 16px; line-height: 200%; color: #473E2C;
}
.orig h2, .orig h3, .orig h4, .orig p, .orig dl, .orig dt, .orig dd, .orig ul, .orig li, .orig section {
  margin: 0; padding: 0; border: 0; background: none; color: inherit; line-height: inherit;
}
.orig h2 { font-size: 1.5em; }
.orig h3 { font-size: 1.17em; font-weight: bold; }
.orig h4 { font-size: 1em; font-weight: bold; }
.orig dt, .orig dd { font-weight: normal; }
.orig li { list-style: none; }
/* 元は枠より少し広い写真もそのまま出していた（縮めると組み立て方の写真の並びが崩れる）。999px以下では枠に収める */
.orig img { vertical-align: top; border: none; max-width: none; }
.orig a { color: #151515; text-decoration: none; }
.orig a:hover img { opacity: 0.7; }
.orig table { width: auto; border-collapse: collapse; border-spacing: 0; font-size: inherit; margin: 0; }
.orig th, .orig td { padding: 0; border: 0; background: none; vertical-align: middle; }
.orig th { text-align: center; }
.orig td { text-align: left; }
.orig input, .orig select { vertical-align: middle; font-family: inherit; }
/* 元は base.css の *{padding:0} が入力欄にも効いていた。ボタンはブラウザ標準の border-box に戻す（幅100pxを元と同じにするため） */
.orig input[type="text"] { padding: 0; }
.orig input[type="submit"] { box-sizing: border-box; }
.orig form { margin: 0; }

/* ---------- 余白（base.css） ---------- */
.orig .mar_t_05{margin-top:5px}.orig .mar_t_10{margin-top:10px}.orig .mar_t_15{margin-top:15px}.orig .mar_t_20{margin-top:20px}.orig .mar_t_25{margin-top:25px}.orig .mar_t_30{margin-top:30px}.orig .mar_t_35{margin-top:35px}.orig .mar_t_40{margin-top:40px}.orig .mar_t_50{margin-top:50px}.orig .mar_t_60{margin-top:60px}.orig .mar_t_70{margin-top:70px}
.orig .mar_r_05{margin-right:5px}.orig .mar_r_10{margin-right:10px}.orig .mar_r_15{margin-right:15px}.orig .mar_r_20{margin-right:20px}.orig .mar_r_30{margin-right:30px}.orig .mar_r_40{margin-right:40px}.orig .mar_r_50{margin-right:50px}.orig .mar_r_60{margin-right:60px}
.orig .mar_b_05{margin-bottom:5px}.orig .mar_b_10{margin-bottom:10px}.orig .mar_b_15{margin-bottom:15px}.orig .mar_b_20{margin-bottom:20px}.orig .mar_b_30{margin-bottom:30px}.orig .mar_b_40{margin-bottom:40px}.orig .mar_b_50{margin-bottom:50px}
.orig .mar_l_05{margin-left:5px}.orig .mar_l_10{margin-left:10px}.orig .mar_l_15{margin-left:15px}.orig .mar_l_20{margin-left:20px}.orig .mar_l_30{margin-left:30px}.orig .mar_l_40{margin-left:40px}.orig .mar_l_50{margin-left:50px}.orig .mar_l_60{margin-left:60px}.orig .mar_l_80{margin-left:80px}
.orig .mar_t_-05{margin-top:-5px}.orig .mar_t_-10{margin-top:-10px}.orig .mar_t_-15{margin-top:-15px}.orig .mar_t_-20{margin-top:-20px}
.orig .pad_a_05{padding:5px}.orig .pad_a_10{padding:10px}.orig .pad_a_20{padding:20px}
.orig .pad_t_05{padding-top:5px}.orig .pad_t_10{padding-top:10px}.orig .pad_t_20{padding-top:20px}.orig .pad_t_30{padding-top:30px}.orig .pad_t_40{padding-top:40px}
.orig .pad_r_05{padding-right:5px}.orig .pad_r_10{padding-right:10px}.orig .pad_r_20{padding-right:20px}.orig .pad_r_30{padding-right:30px}.orig .pad_r_40{padding-right:40px}
.orig .pad_b_05{padding-bottom:5px}.orig .pad_b_10{padding-bottom:10px}.orig .pad_b_20{padding-bottom:20px}
.orig .pad_l_05{padding-left:1%}.orig .pad_l_10{padding-left:10px}.orig .pad_l_15{padding-left:15px}.orig .pad_l_20{padding-left:20px}.orig .pad_l_30{padding-left:30px}
.orig .pad_20_10{padding:20px 10px !important}

/* ---------- 文字（base.css。太字を先に書き、大きさの指定で上書きする） ---------- */
.orig .bold{font-weight:bold;font-size:inherit}.orig .no_bold{font-weight:normal}
.orig .font-4{font-size:66.7%}.orig .font-3{font-size:75%;line-height:120%}.orig .font-32{font-size:90%;line-height:50%}.orig .font-2{font-size:83.3%;line-height:130%}.orig .font-1{font-size:91.7%;line-height:120%}
.orig .font_normal{font-size:100%}.orig .font1{font-size:108.3%}.orig .font2{font-size:116.7%}.orig .font3{font-size:125%}.orig .font4{font-size:133.3%}.orig .font5{font-size:141.7%}.orig .font6{font-size:150%}.orig .font7{font-size:158.3%}.orig .font8{font-size:166.7%}.orig .font9{font-size:175%}.orig .font10{font-size:183.3%}.orig .font11{font-size:191.7%}.orig .font12{font-size:200%}
.orig .c_red{color:#d90932}.orig .c_white{color:#fff}.orig .c_black{color:#333}.orig .c_pink{color:#da4583}.orig .c_yellow{color:#ed9425}.orig .c_darkblue{color:#2d4b61}.orig .c_karashi{color:#dcbd00}.orig .c_gray{color:#666}.orig .c_brown{color:#CC6600}
.orig .left{text-align:left}.orig .right{text-align:right}.orig .center{text-align:center}

/* ---------- 背景色・枠線・回り込み（base.css） ---------- */
.orig .bg_pink{background-color:#da4583}.orig .bg_red{background-color:#d90932}.orig .bg_yellow{background-color:#fff100}.orig .bg_glay{background-color:#c9c9c9}.orig .bg_darkblue{background-color:#2d4b61}.orig .bg_gray{background-color:#f9f6f3}.orig .bg_karashi{background-color:#dcbd00}.orig .bg_kogecha{background-color:#6a3906}.orig .bg_green{background-color:#486a00}
.orig .bg_wine{background-color:#bb2259}.orig .bg_navy{background:#002a4a}.orig .bg_orange{background-color:#f39700}
.orig .border_a{border:1px solid #999}.orig .border_t{border-top:1px solid #999}.orig .border_r{border-right:1px solid #999}.orig .border_b{border-bottom:1px solid #999}.orig .border_l{border-left:1px solid #999}
.orig .border_black{border:1px solid #000}.orig .border_b_white{border-bottom:1px solid #fff}
.orig .f_left{float:left}.orig .f_right{float:right}.orig .clear{clear:both}
.orig .clearfix::after{display:block;clear:both;content:"";height:0}
.orig .block{display:block}.orig .inline{display:inline}.orig .none{display:none}.orig .hidden{overflow:hidden}

/* ---------- 表（style.css） ---------- */
.orig .align_r{border:1px solid #CCC;text-align:right;padding-right:5px}
.orig .align_l{border:1px solid #CCC;text-align:left;padding-left:5px}
.orig .align_c{border:1px solid #CCC;text-align:center}
.orig .align_c_none{border-left:1px solid #CCC;border-right:1px solid #CCC;border-bottom:3px double #CCC;text-align:center}
.orig .border01_b{border-bottom:1px solid #CCC}

/* ---------- カゴに入れるボタン（style.css） ---------- */
.orig .addtocart{
  background-color:#448aca; color:#fff; font-size:13.3px; font-weight:normal; line-height:normal; border-radius:0; cursor:pointer;
  border-top:2px solid #4180b9; border-left:2px solid #4180b9; border-right:2px solid #26639c; border-bottom:2px solid #26639c;
  width:100px; padding:0 5px;
}
.orig .addtocart:hover{
  background-color:#5f95c7;
  border-top:2px solid #5f95c7; border-left:2px solid #5f95c7; border-right:2px solid #448aca; border-bottom:2px solid #448aca;
}
.orig .demo01{width:300px;padding:2px;background-color:#75A9FF;border:1px #666 solid;font-size:15px;text-align:center}
.orig .demo01:hover{background-color:#BAD3FF}

/* ---------- 酒ギフトケース・NSケース・Sケース（style.css） ---------- */
.orig .gift_point{position:relative;padding:20px;margin:10px 10px 30px 10px;border:1px solid #dcbd00}
.orig .gift_point_position{position:absolute;left:-15px;top:-15px}
.orig .gift_point .gift_yellow{color:#dcbd00}
.orig .gift_point p{line-height:26px}
.orig .ns_small{font-size:11px;line-height:14px}
.orig .bg_kadomaru{border-radius:10px;border:3px #999 solid;background-color:#999;color:#fff;font-size:11px;padding:0 5px}
.orig .price{float:left;width:300px}
.orig .price_right{float:left;width:380px;padding-left:40px}
.orig .price_w360{float:left;width:360px}
.orig .price_w460{float:left;width:460px}
.orig .price_w420{width:420px}
.orig .price_w400{float:left;width:400px}
.orig .price_w220{width:220px}
.orig .price_w180{width:180px}
.orig .price_w160{width:160px}
.orig .set_w195{width:195px;line-height:18px;float:left;margin-right:20px}
.orig .set_w193{width:193px;line-height:18px;float:left;margin-right:20px}
.orig .set_w182{width:182px;line-height:18px;float:left}
.orig .set_w176{width:176px;line-height:18px;float:left}
.orig .set_w164{width:176px;line-height:18px;float:left}
.orig .set_w153{width:153px;line-height:18px;float:left}
.orig .wrap{margin-top:10px}
.orig .border_pink{border:1px solid #da4583;margin:20px}
.orig .border_pink h3{padding:10px}
.orig .border_pink_inner{padding:20px;position:relative}
.orig .border_red{border:1px solid #d90932;margin:20px}
.orig .border_red h3{padding:10px}
.orig .border_red_inner{padding:20px;position:relative}
.orig .border_darkblue{border:1px solid #2d4b61;margin:20px}
.orig .border_darkblue h3{padding:10px}
.orig .border_darkblue_inner{padding:20px;position:relative}
.orig .price_w_small{width:220px}
.orig .price_w_middle{width:280px;float:left}
.orig .price_w_big{width:330px;float:left}
.orig .price_w_big2{width:370px;float:left}

/* 組み立て方の写真（元は highslide。今は shop.js の a.zoom で拡大。説明文は拡大用だったので出さない） */
.orig .highslide-caption{display:none}

/* ---------- 狭い画面（元は960px固定。枠を縦に積み、決め打ちの幅と位置を外す） ---------- */
@media (max-width: 999px) {
  .orig img { max-width: 100%; }
  /* 写真の左右の余白（mar_l_40・mar_r_60 など）は、狭い画面では横にはみ出す原因になるので外す */
  .orig img[class*="mar_l_"], .orig img[class*="mar_r_"] { margin-left: 0; margin-right: 0; }
  .orig h2 img { display: block; margin: 10px auto 0 !important; }
  .orig .gift_point .f_right, .orig .gift_point .f_left { float: none; }
  .orig .gift_point img { max-width: 100%; }
  .orig .border_darkblue, .orig .border_red, .orig .border_pink { margin: 16px 0; }
  .orig .border_darkblue_inner, .orig .border_red_inner, .orig .border_pink_inner { padding: 12px; }
  .orig .price, .orig .price_right, .orig .price_w360, .orig .price_w460, .orig .price_w400, .orig .price_w420,
  .orig .price_w_small, .orig .price_w_middle, .orig .price_w_big, .orig .price_w_big2 {
    float: none; width: auto; max-width: 420px; border-right: 0; padding: 0 0 16px; margin: 0 0 16px; border-bottom: 1px dashed #999;
  }
  .orig [style*="padding-top"] { padding-top: 0 !important; }
  /* 「ケース外寸」は写真と価格の下に回す（元は横に並べる前提で位置を決め打ちしていた） */
  .orig [class*="price_w_"] > p, .orig .price > p, .orig [class*="price_w"] > p.f_left { float: none; clear: both; padding-top: 8px !important; }
  .orig .font6.bold { white-space: nowrap; }
  .orig [style*="width"]:not(input) { max-width: 100%; }
}
@media (max-width: 640px) {
  .orig { font-size: 15px; }
  .orig .font12 { font-size: 160%; }
  .orig .gift_point { margin: 16px 6px 20px; padding: 16px 12px; }
  .orig table { max-width: 100%; }
}