@charset "UTF-8";
/************************************************
ブラウザリセット
************************************************ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
}

table, caption, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  text-align: left;
  font-weight: normal;
}

a img, iframe {
  border: none;
}

ol, ul, li {
  list-style: none;
}

input, textarea, select, button {
  font-size: 100%;
  font-family: inherit;
}

/************************************************
共通設定
************************************************ */
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  color: #333;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 1.4em;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-ideograph;
  -webkit-text-size-adjust: 100%;
}

/* コンテナ */
.container {
  position: relative;
  width: 1100px;
  margin: auto;
}

@media screen and (max-width: 768px) {
  .container {
    width: auto;
  }
}

/* 写真 */
img {
  max-width: 100%;
  height: auto;
}

img.picture {
  border: 1px solid #ddd;
}

/* ボタン */
.button {
  display: inline-block;
  min-width: 240px;
  padding: 0 15px;
  color: #fff;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  border: none;
  background: #00618b;
  cursor: pointer;
  transition: 0.5s ease;
}

.button:hover {
  opacity: 0.7;
}

.back {
  display: inline-block;
  min-width: 240px;
  padding: 0 15px;
  color: #fff;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  border: none;
  background: #999;
  cursor: pointer;
  transition: 0.5s ease;
}

.back:hover {
  opacity: 0.7;
}

/* カラム */
.row {
  margin: 40px -10px;
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .row {
    display: block;
    margin-left: 0;
    margin-right: 0;
  }
}

.col-1 {
  width: 8.33333%;
}

.col-2 {
  width: 16.666666%;
}

.col-3 {
  width: 24.99999%;
}

.col-4 {
  width: 33.33333%;
}

.col-5 {
  width: 41.66666%;
}

.col-6 {
  width: 49.99999%;
}

.col-7 {
  width: 58.33333%;
}

.col-8 {
  width: 66.66666%;
}

.col-9 {
  width: 74.99999%;
}

.col-10 {
  width: 83.33333%;
}

.col-11 {
  width: 91.66666%;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11 {
  padding-left: 10px;
  padding-right: 10px;
}

@media screen and (max-width: 768px) {
  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11 {
    width: auto;
    margin: 40px 0 0;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  .col-1:nth-child(1),
  .col-2:nth-child(1),
  .col-3:nth-child(1),
  .col-4:nth-child(1),
  .col-5:nth-child(1),
  .col-6:nth-child(1),
  .col-7:nth-child(1),
  .col-8:nth-child(1),
  .col-9:nth-child(1),
  .col-10:nth-child(1),
  .col-11:nth-child(1) {
    margin-top: 0;
  }
}

.row.pd20 {
  margin: 40px -20px;
}

@media screen and (max-width: 768px) {
  .row.pd20 {
    margin-left: 0;
    margin-right: 0;
  }
}

.row.pd20 .col-1,
.row.pd20 .col-2,
.row.pd20 .col-3,
.row.pd20 .col-4,
.row.pd20 .col-5,
.row.pd20 .col-6,
.row.pd20 .col-7,
.row.pd20 .col-8,
.row.pd20 .col-9,
.row.pd20 .col-10,
.row.pd20 .col-11 {
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (max-width: 768px) {
  .row.pd20 .col-1,
  .row.pd20 .col-2,
  .row.pd20 .col-3,
  .row.pd20 .col-4,
  .row.pd20 .col-5,
  .row.pd20 .col-6,
  .row.pd20 .col-7,
  .row.pd20 .col-8,
  .row.pd20 .col-9,
  .row.pd20 .col-10,
  .row.pd20 .col-11 {
    padding-left: 0;
    padding-right: 0;
  }
}

.row.reverse {
  flex-direction: row-reverse;
}

/* マージン */
.mt_0 {
  margin-top: 0px !important;
}

.mr_0 {
  margin-right: 0px !important;
}

.mb_0 {
  margin-bottom: 0px !important;
}

.ml_0 {
  margin-left: 0px !important;
}

.mt_10 {
  margin-top: 10px !important;
}

.mr_10 {
  margin-right: 10px !important;
}

.mb_10 {
  margin-bottom: 10px !important;
}

.ml_10 {
  margin-left: 10px !important;
}

.mt_20 {
  margin-top: 20px !important;
}

.mr_20 {
  margin-right: 20px !important;
}

.mb_20 {
  margin-bottom: 20px !important;
}

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

.mt_30 {
  margin-top: 30px !important;
}

.mr_30 {
  margin-right: 30px !important;
}

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

.ml_30 {
  margin-left: 30px !important;
}

.mt_40 {
  margin-top: 40px !important;
}

.mr_40 {
  margin-right: 40px !important;
}

.mb_40 {
  margin-bottom: 40px !important;
}

.ml_40 {
  margin-left: 40px !important;
}

.mt_50 {
  margin-top: 50px !important;
}

.mr_50 {
  margin-right: 50px !important;
}

.mb_50 {
  margin-bottom: 50px !important;
}

.ml_50 {
  margin-left: 50px !important;
}

.mt_60 {
  margin-top: 60px !important;
}

.mr_60 {
  margin-right: 60px !important;
}

.mb_60 {
  margin-bottom: 60px !important;
}

.ml_60 {
  margin-left: 60px !important;
}

.mt_70 {
  margin-top: 70px !important;
}

.mr_70 {
  margin-right: 70px !important;
}

.mb_70 {
  margin-bottom: 70px !important;
}

.ml_70 {
  margin-left: 70px !important;
}

.mt_80 {
  margin-top: 80px !important;
}

.mr_80 {
  margin-right: 80px !important;
}

.mb_80 {
  margin-bottom: 80px !important;
}

.ml_80 {
  margin-left: 80px !important;
}

.mt_90 {
  margin-top: 90px !important;
}

.mr_90 {
  margin-right: 90px !important;
}

.mb_90 {
  margin-bottom: 90px !important;
}

.ml_90 {
  margin-left: 90px !important;
}

.mt_100 {
  margin-top: 100px !important;
}

.mr_100 {
  margin-right: 100px !important;
}

.mb_100 {
  margin-bottom: 100px !important;
}

.ml_110 {
  margin-left: 110px !important;
}

.mt_120 {
  margin-top: 120px !important;
}

.mt_130 {
  margin-top: 130px !important;
}

.mt_140 {
  margin-top: 140px !important;
}

.mt_150 {
  margin-top: 150px !important;
}

/* テーブル　スマホ時横スクロール */
@media screen and (max-width: 768px) {
  .tbl_wrapper {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}

/* ==============================================
フレーム
=============================================== */
/* 全体を包括 */
/* コンテンツ */
#container {
  padding: 110px 15px 0 15px;
}

@media screen and (max-width: 768px) {
  #container {
    padding-top: 50px;
  }
}

/* ==============================================
カラム指定
=============================================== */
/* メイン部
----------------------------------------------- */
/* サイドカラム
----------------------------------------------- */
.side_column {
  padding: 10px 0 0;
}

#leftcolumn {
  float: left;
  width: 20%;
}

#rightcolumn {
  float: right;
  width: 20%;
}

/* 他
----------------------------------------------- */
/* ヘッダーとフッターの上下 */
#topcolumn, #bottomcolumn, #footerbottomcolumn {
  margin: 0px;
  background: #fff;
  text-align: left;
  clear: both;
}

/* 下層コンテンツ */
#undercolumn {
  width: 1100px;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  #undercolumn {
    width: auto;
  }
}

/* ==============================================
ユーティリティ
=============================================== */
/* フロート回り込み解除
----------------------------------------------- */
.clearfix:after {
  display: block;
  clear: both;
  height: 0px;
  line-height: 0px;
  visibility: hidden;
  content: ".";
}

.clear {
  clear: both;
}

/* リンク指定
----------------------------------------------- */
a {
  color: #333;
  text-decoration: underline;
  transition: 0.3s ease;
}

a:hover {
  opacity: 0.7;
}

/* フォント
----------------------------------------------- */
h1 h2,
h3,
h4,
h5,
h6 {
  margin: 75px 0 25px;
  font-size: 100%;
  line-height: 150%;
}

h1 h2:nth-child(1),
h3:nth-child(1),
h4:nth-child(1),
h5:nth-child(1),
h6:nth-child(1) {
  margin-top: 0;
}

p,
ul,
ol,
dl,
table,
blockquote,
iframe {
/*  margin-top: 25px; */
  margin-top: 0px;
}

p:nth-child(1),
ul:nth-child(1),
ol:nth-child(1),
dl:nth-child(1),
table:nth-child(1),
blockquote:nth-child(1),
iframe:nth-child(1) {
  margin-top: 0;
}

.sale_price {
  color: #f00;
}

.normal_price {
  font-size: 90%;
}

.point {
  color: #f00;
  font-weight: bold;
}

.user_name {
  font-weight: bold;
}

.recommend_level {
  color: #ecbd00;
}

.attention {
  color: #f00;
}

.attentionSt {
  color: #f00;
  font-weight: bold;
}

.st {
  font-weight: bold;
}

.mini {
  font-size: 90%;
}

/* 行揃え
----------------------------------------------- */
.alignC {
  text-align: center;
}

.alignR {
  text-align: right;
}

.alignL {
  text-align: left;
}

.pricetd em {
  font-weight: bold;
}

/* フォーム
----------------------------------------------- */
select {
  height: 33px;
  border: 1px solid #ccc;
}

input[type='text'], input[type='password'] {
  padding: 5px;
  border: 1px solid #ccc;
}

@media screen and (max-width: 768px) {
  input[type='submit'], input[type='reset'] {
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
}

.box40 {
  max-width: 90px;
  width: 40px;
}

.box60 {
  max-width: 90px;
  width: 60px;
}

.box100 {
  max-width: 90%;
  width: 100px;
}

.box120 {
  max-width: 90%;
  width: 120px;
}

.box140 {
  max-width: 90%;
  width: 140px;
}

.box145 {
  max-width: 90%;
  width: 145px;
}

.box150 {
  max-width: 90%;
  width: 150px;
}

.box240 {
  max-width: 90%;
  width: 240px;
}

.box300 {
  max-width: 90%;
  width: 300px;
}

.box320 {
  max-width: 90%;
  width: 320px;
}

.box350 {
  max-width: 90%;
  width: 350px;
}

.box380 {
  max-width: 90%;
  width: 380px;
}

/* フォームが縦に重なり合う場合に併用する余白 */
.top {
  margin-bottom: 5px;
}

/* タイトル
----------------------------------------------- */
h2.title {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 24px;
  font-size: 2.4rem;
  letter-spacing: 0.3em;
  text-align: center;
}

@media screen and (max-width: 768px) {
  h2.title {
    font-size: 22px;
    font-size: 2.2rem;
  }
}

h3.title {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.3em;
}

h4.title {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.2em;
}

#main_column .sub_area h3, #undercolumn_login .login_area h3, #undercolumn_shopping h3, #mypagecolumn h3, #undercolumn_cart h3 {
  color: #00b0fa;
  font-size: 18px;
  font-size: 1.8rem;
}

div#undercolumn_login .login_area h4 {
  margin: 3em 0 0;
}

div#undercolumn_login .login_area h4 + p {
  margin-top: 0.5em;
}

/* ==============================================
ヘッダー
=============================================== */
/* レイアウト
----------------------------------------------- */
#header_wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  padding: 0 15px;
  background: #fff;
  transition: 0.8s ease;
}

@media screen and (max-width: 768px) {
  #header_wrap {
    border-bottom: 1px solid #ddd;
  }
}

#header {
  position: relative;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

@media screen and (max-width: 768px) {
  #header {
    width: auto;
  }
}

#errorHeader {
  color: #F00;
  font-weight: bold;
  font-size: 12px;
  background-color: #FEB;
  text-align: center;
  padding: 5px;
}

/* ロゴ
----------------------------------------------- */
#logo_area {
  padding: 20px 0;
  text-align: left;
}

@media screen and (max-width: 768px) {
  #logo_area {
    padding: 10px 0;
  }
}

#logo_area svg {
  width: 260px;
  height: 72px;
  fill: #00618b;
}

@media screen and (max-width: 768px) {
  #logo_area svg {
    width: 90px;
    height: 30px;
  }
}

#site_description {
  font-size: 90%;
}

/* ヘッダーナビ
----------------------------------------------- */
#header_navi {
  position: absolute;
  bottom: 20px;
  right: 0;
}

@media screen and (max-width: 768px) {
  #header_navi {
    position: static;
    display: none;
    margin-left: -15px;
    margin-right: -15px;
  }
}

#header_navi ul li {
  display: inline-block;
  margin-left: 60px;
}

@media screen and (max-width: 768px) {
  #header_navi ul li {
    display: block;
    margin: 0;
    border-top: 1px solid #ddd;
  }
}

#header_navi ul li a {
  color: #00618b;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.3em;
  text-decoration: none;
}

@media screen and (max-width: 768px) {
  #header_navi ul li a {
    position: relative;
    display: block;
    padding: 15px;
  }
}

@media screen and (max-width: 768px) {
  #header_navi ul li a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    display: block;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-top: 2px solid #00618b;
    border-right: 2px solid #00618b;
    transform: rotate(45deg);
  }
}

/* ヘッダーログイン
----------------------------------------------- */
#headerInternalColumn {
  position: absolute;
  top: 20px;
  right: 0;
}

@media screen and (max-width: 768px) {
  #headerInternalColumn {
    top: 0;
    right: -15px;
  }
}

@media screen and (max-width: 768px) {
  #headerInternalColumn ul {
    font-size: 0;
  }
}

/* #headerInternalColumn ul li {
  display: inline-block;
  margin-left: 10px;
  vertical-align: top;
} */

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li {
    margin-left: 0px;
    border-left: 1px solid #ddd;
  }
}

/* #headerInternalColumn ul li a {
  display: block;
  padding: 3px 10px;
  color: #fff;
  letter-spacing: 0.2em;
  text-decoration: none;
  background: #00618b;
} */

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li a {
    width: 50px;
    height: 50px;
    text-indent: -9999px;
    background: #fff;
  }
}

#headerInternalColumn ul li.menu {
  display: none;
}

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li.menu {
    display: inline-block;
  }
}

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li.cart a {
    background-image: url(../img/common/btn_cart01.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li.login a {
    background-image: url(../img/common/btn_login01.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

@media screen and (max-width: 768px) {
  #headerInternalColumn ul li.menu a {
    background-image: url(../img/common/btn_menu01.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

/* ==============================================
タイトル
=============================================== */
#title_area {
  margin: 0 -15px 40px;
  padding: 20px 15px;
  color: #fff;
  background: #00618b;
}

#title_area h2.title {
  font-size: 18px;
  font-size: 1.8rem;
}

/* ==============================================
バナー
=============================================== */
#banner_wrap {
  padding: 60px 15px 0;
}

@media screen and (max-width: 768px) {
  #banner_wrap {
    padding: 30px 15px 0;
  }
}

#banner ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}

@media screen and (max-width: 768px) {
  #banner ul {
    margin: 0 -5px;
  }
}

#banner ul li {
  width: 33.33333%;
  padding: 10px;
}

@media screen and (max-width: 768px) {
  #banner ul li {
    width: 50%;
    padding: 5px;
  }
}

#banner ul li img {
  width: 100%;
  vertical-align: bottom;
}

/* ==============================================
フッター
=============================================== */
#footer_wrap {
  padding: 60px 15px;
}

@media screen and (max-width: 768px) {
  #footer_wrap {
    padding: 30px 15px;
  }
}

#footer {
  position: relative;
  font-size: 13px;
  font-size: 1.3rem;
}

@media screen and (max-width: 768px) {
  #footer {
    width: auto;
  }
}

#footer h3 {
  margin-bottom: 40px;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.3em;
  text-align: center;
}

#footer h3:after {
  content: "";
  display: block;
  width: 100px;
  height: 1px;
  margin: 10px auto 0;
  background: #00618b;
}

#footer h4 {
  margin: 40px 0 5px;
  font-size: 16px;
  font-size: 1.6rem;
}

#footer p {
  margin: 10px 0;
}

.footer_tel {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 32px;
  font-size: 3.2rem;
  letter-spacing: 0.2em;
  line-height: 1.4;
}

.footer_tel span {
  font-size: 20px;
  font-size: 2rem;
}

.footer_info dt {
  float: left;
  clear: both;
}

.footer_info dd {
  margin-left: 5em;
}

.footer_caution {
  margin-top: 60px;
  color: #666;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

.footer_utility {
  margin-top: 20px;
}

.footer_utility ul li {
  display: inline-block;
  margin-right: 10px;
}

@media screen and (max-width: 768px) {
  .footer_utility ul li {
    margin: 10px 0 0 0;
  }
}

.footer_utility ul li a {
  display: block;
  padding: 3px 10px;
  color: #fff;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.2em;
  text-decoration: none;
  background: #00618b;
}

#copyright {
  position: absolute;
  bottom: 0;
  right: 0;
  color: #00618b;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 12px;
  font-size: 1.2rem;
}

@media screen and (max-width: 768px) {
  #copyright {
    position: static;
    margin-top: 20px;
  }
}

/* ==============================================
パーツ
=============================================== */
/* ボタン
----------------------------------------------- */
.btn_area {
  margin-top: 30px;
  width: 100%;
  text-align: center;
}

.btn_area:nth-child(1) {
  margin-top: 0;
}

.btn_area li {
  display: inline-block;
  padding: 0 10px;
}

@media screen and (max-width: 768px) {
  .btn_area li {
    display: block;
    padding: 10px 0;
  }
}

/* 完了メッセージ
----------------------------------------------- */
div#complete_area {
  margin-bottom: 20px;
}

div#complete_area .message {
  margin-bottom: 20px;
  line-height: 150%;
  font-weight: bold;
  font-size: 120%;
}

div#undercolumn_entry .message {
  margin-bottom: 20px;
  line-height: 150%;
  font-weight: bold;
  font-size: 120%;
}

div#complete_area .shop_information {
  margin-top: 40px;
  padding: 20px 0 0 0;
  border-top: solid 1px #ccc;
}

div#complete_area .shop_information .name {
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 140%;
}

/************************************************
各ページコンテンツ用
************************************************ */
/* ==============================================
▼TOP
=============================================== */
body.LC_Page_Index #header_wrap.scroll {
  background: transparent;
}

@media screen and (max-width: 768px) {
  body.LC_Page_Index #header_wrap.scroll {
    background: #fff;
  }
}

body.LC_Page_Index #header_wrap.scroll #logo_area svg {
  fill: #fff;
}

@media screen and (max-width: 768px) {
  body.LC_Page_Index #header_wrap.scroll #logo_area svg {
    fill: #00618b;
  }
}

body.LC_Page_Index #header_wrap.scroll #header_navi ul li a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  body.LC_Page_Index #header_wrap.scroll #header_navi ul li a {
    color: #00618b;
  }
}

@media screen and (max-width: 768px) {
  body.LC_Page_Index #header_wrap.scroll #header_navi ul li a:after {
    border-color: #00618b;
  }
}

body.LC_Page_Index #container {
  padding-top: 0;
}

/* ローディング
----------------------------------------------- */
#loader_area {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 100%;
  background: #f8f8f8;
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 15px;
  height: 15px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}

.loader {
  position: fixed;
  top: 40%;
  left: 50%;
  color: #00618b;
  font-size: 10px;
  margin: 0 0 0 -7px;
  text-indent: -9999em;
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}

.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.loader:after {
  left: 3.5em;
}

@-webkit-keyframes load7 {
  0%, 80%, 100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

@keyframes load7 {
  0%, 80%, 100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

/* メインイメージ
----------------------------------------------- */
#main_image {
  position: relative;
  margin: 0 -15px;
}

@media screen and (max-width: 768px) {
  #main_image {
    margin-top: 50px;
  }
}

#main_image .slider > div {
  width: 100%;
  height: 100vh;
  padding: 140px 10% 0 0;
}

@media screen and (max-width: 768px) {
  #main_image .slider > div {
    height: calc(100vh - 50px);
    padding: 30px 5% 0 0;
  }
}

#main_image .slider > div img {
  float: right;
}

#main_image .kv01 {
  background: url(../img/index/bg_kv01.jpg) no-repeat 50% 50%;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  #main_image .kv01 img {
    width: 110px;
  }
}

#main_image .kv02 {
  background: url(../img/index/bg_kv02.jpg) no-repeat 50% 50%;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  #main_image .kv02 {
    background-position: 35% 50%;
  }
}

@media screen and (max-width: 768px) {
  #main_image .kv02 img {
    width: 164px;
  }
}

#main_image .kv03 {
  background: url(../img/index/bg_kv03.jpg) no-repeat 50% 50%;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  #main_image .kv03 {
    background-position: 35% 50%;
  }
}

@media screen and (max-width: 768px) {
  #main_image .kv03 img {
    width: 218px;
  }
}

#main_image .kv04 {
  background: url(../img/index/bg_kv04.jpg) no-repeat 50% 50%;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  #main_image .kv04 {
    background: url(../img/index/bg_kv04_sp.jpg) no-repeat 50% 50%;
    background-size: cover;
  }
}

@media screen and (max-width: 768px) {
  #main_image .kv04 img {
    width: 218px;
  }
}

#main_image .campaign {
  position: absolute;
  bottom: 20px;
  right: 5vw;
  z-index: 100;
  width: 360px;
  /* max-width: 16.58986vw; */
  max-width: 25vw;
}

@media screen and (max-width: 768px) {
  #main_image .campaign {
    bottom: 5vw;
    max-width: 37.5vw;
  }
}

/*バナー
----------------------------------------------- */
.banner_area {
  margin: 0 -15px;
}

.banner_area ul {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .banner_area ul {
    display: block;
  }
}

.banner_area ul li {
  width: 50%;
}

@media screen and (max-width: 768px) {
  .banner_area ul li {
    width: 100%;
  }
}

.banner_area ul li img {
  width: 100%;
  vertical-align: bottom;
}

/* レギュラー商品
----------------------------------------------- */
.products_area {
  margin-top: 80px;
}

.products_area ul {
  display: flex;
  flex-wrap: wrap;
  width: 980px;
  margin: auto;
}

@media screen and (max-width: 768px) {
  .products_area ul {
    width: auto;
  }
}

.products_area ul li {
  width: 33.33333%;
  margin-top: 20px;
  padding-left: 10px;
  padding-right: 10px;
}

@media screen and (max-width: 768px) {
  .products_area ul li {
    width: 50%;
    padding-left: 5px;
    padding-right: 5px;
  }
}

.products_area ul li a {
  position: relative;
  display: block;
}

.products_area ul li a .detail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 46%;
  color: #fff;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.2em;
  text-align: center;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0;
  transition: 0.8s ease;
}

@media screen and (max-width: 768px) {
  .products_area ul li a .detail {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.products_area ul li a:hover {
  opacity: 1;
}

.products_area ul li a:hover .detail {
  opacity: 1;
}

/* お知らせ
----------------------------------------------- */
/* 
.news_area {
  margin: 80px -15px 0 -15px;
  padding: 20px 15px;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

.news_area h2 {
  position: absolute;
  top: 0;
  left: 50px;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}

@media screen and (max-width: 768px) {
  .news_area h2 {
    position: static;
    -webkit-writing-mode: initial;
    -ms-writing-mode: initial;
    writing-mode: initial;
  }
}

.news_area .news_list {
  display: flex;
  padding-left: 140px;
}

@media screen and (max-width: 768px) {
  .news_area .news_list {
    display: block;
    margin-top: 20px;
    padding-left: 0;
  }
}

.news_area .news_list > div {
  width: calc(33.33333% - 20px);
  margin-right: 20px;
  padding: 40px 20px 40px;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .news_area .news_list > div {
    width: auto;
    margin: 15px 0 0 0;
    padding: 15px;
  }
}

.news_area .news_list > div .date {
  margin: 0;
  color: #666;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
}

.news_area .news_list > div .title {
  margin: 20px 0 0 0;
}

.news_area .news_list > div .title a {
  color: #00b0fa;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  text-decoration: none;
}

.news_area .news_list > div .title + p {
  margin-top: 10px;
}

.news_area .more {
  position: absolute;
  bottom: 40px;
  left: 0;
  width: 140px;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .news_area .more {
    position: static;
    width: auto;
    margin-top: 20px;
  }
} */

/* SNS
----------------------------------------------- */
.sns_area {
  margin-top: 80px;
}

.sns_area .row {
  margin-left: 0;
  margin-right: 0;
}

.sns_area .row .col-6 {
  padding: 0 25px;
}

@media screen and (max-width: 768px) {
  .sns_area .row .col-6 {
    padding: 0;
  }
}

.sns_area h2.title {
  margin-bottom: 20px;
}

/* お酒のはなし
----------------------------------------------- */
.column_area {
  margin-top: 80px;
}

/* ==============================================
▼下層
=============================================== */
/* ==============================================
▼宝山の商品
=============================================== */
.item {
  position: relative;
  height: 100%;
  padding: 15px 15px 65px 15px;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

@media screen and (max-width: 768px) {
  .item {
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 130px;
  }
}

.item > div {
  margin-top: 15px;
}

.item .item_icon {
  position: absolute;
  top: -30px;
  right: 0;
  z-index: 1000;
  margin-top: 0;
}

@media screen and (max-width: 768px) {
  .item .item_icon {
    right: 10px;
  }
}

@media screen and (max-width: 768px) {
  .item .item_icon img {
    width: 60px;
  }
}

.item .item_photo {
  margin-top: 0;
}

@media screen and (max-width: 768px) {
  .item .item_photo {
    position: absolute;
    top: 15px;
    left: 15px;
    width: 100px;
  }
}

.item .item_photo img {
  width: 100%;
}

.item .item_title h3 {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .item .item_title h3 {
    text-align: left;
  }
}

.item .item_comment {
  height: 13em;
  font-size: 13px;
  font-size: 1.3rem;
}

@media screen and (max-width: 768px) {
  .item .item_comment {
    display: none;
  }
}

.item .item_price {
  font-size: 13px;
  font-size: 1.3rem;
}

.item .item_price table th {
  padding: 10px 0;
  width: 3em;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

@media screen and (max-width: 768px) {
  .item .item_price table th {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.item .item_price table td {
  padding: 10px 0;
  text-align: right;
}

@media screen and (max-width: 768px) {
  .item .item_price table td {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.item .item_detail {
  position: absolute;
  bottom: 15px;
  left: 0;
  width: 100%;
  padding: 0 15px;
}

.item .item_detail img {
  width: 100%;
}

.item .item_detail .button {
  min-width: auto;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .item .item_detail .button {
    display: block;
    width: auto;
  }
}

@media screen and (max-width: 768px) {
  .row.season {
    margin-top: 80px;
  }
}

/* ==============================================
▼酒蔵見学について
=============================================== */
.ul_visit01 li {
  position: relative;
  padding-left: 20px;
}

.ul_visit01 li:before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  display: block;
  width: 12px;
  height: 12px;
  background: #00b0fa;
  border-radius: 50%;
}

.tbl_visit01 td {
  padding-left: 10px;
}

.tbl_visit01 td span {
  font-weight: bold;
}

.txt_visit01 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 10px 10px 20px;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: .1em;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

@media screen and (max-width: 768px) {
  .txt_visit01 {
    display: block;
    padding: 10px;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 768px) {
  .txt_visit01 span {
    display: block;
  }
}

.txt_visit01 img {
  vertical-align: bottom;
}

/* ==============================================
▼ガイド
=============================================== */
/* ◎◎について
----------------------------------------------- */
div#undercolumn_contact {
  max-width: 880px;
  margin: auto;
}

/* 個人情報保護方針
----------------------------------------------- */
.dl_privacy01 dt, .dl_order01 dt {
  margin: 3em 0 0.5em;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 18px;
  font-size: 1.8rem;
}

.dl_privacy01 dt:nth-child(1), .dl_order01 dt:nth-child(1) {
  margin-top: 0;
}

.dl_privacy01 dd ul li, .dl_order01 dd ul li {
  position: relative;
  padding-left: 20px;
}

.dl_privacy01 dd ul li:before, .dl_order01 dd ul li:before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  display: block;
  width: 12px;
  height: 12px;
  background: #00b0fa;
  border-radius: 50%;
}

/* 特定商取引法
----------------------------------------------- */
#undercolumn_order {
  max-width: 880px;
  margin: auto;
}

/* お問い合わせ
----------------------------------------------- */
.zipimg img {
  vertical-align: middle;
}

/* ==============================================
▼MYページ
=============================================== */
/* 共通設定
----------------------------------------------- */
div#mypagecolumn, div#mynavi_area, div#mycontents_area {
  max-width: 880px;
  width: 100%;
  margin: auto;
}

@media screen and (max-width: 768px) {
  div#mypagecolumn table.delivname th,
  div#mypagecolumn table.delivname td, div#mynavi_area table.delivname th,
  div#mynavi_area table.delivname td, div#mycontents_area table.delivname th,
  div#mycontents_area table.delivname td {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  div#mypagecolumn table.delivname th, div#mynavi_area table.delivname th, div#mycontents_area table.delivname th {
    padding-bottom: 0;
    font-weight: bold;
  }
}

@media screen and (max-width: 768px) {
  div#mypagecolumn table.delivname td, div#mynavi_area table.delivname td, div#mycontents_area table.delivname td {
    padding-top: 0;
  }
}

div#mynavi_area .mynavi_list {
  margin-bottom: 20px;
  width: 100%;
}

div#mynavi_area .mynavi_list li {
  display: inline-block;
  margin: 0 20px 5px 0;
}

@media screen and (max-width: 768px) {
  div#mynavi_area .mynavi_list li {
    display: block;
  }
}

div#mynavi_area div.point_announce {
  margin-bottom: 30px;
  padding: 10px;
  border: solid 1px #ffcc62;
  background-color: #fffaf0;
}

div#mynavi_area div.point_announce p {
  padding-left: 20px;
  background: url("../img/icon/ico_point.gif") no-repeat left;
}

div#mycontents_area p.inforamtion {
  margin-bottom: 20px;
}

div#mypagecolumn h4 {
  margin: 10px auto;
  border-bottom: 1px solid #999;
  text-align: left;
  font-size: 120%;
}

div#mycontents_area div.mycondition_area {
  margin: 0 auto 20px 0;
  padding: 10px;
  border: solid 1px #ccc;
  width: 97%;
  background: #f9f9f9;
}

div#mycontents_area div.mycondition_area p {
  float: left;
}

div#mycontents_area div.mycondition_area .btn {
  width: 160px;
  margin-top: 15px;
  float: right;
}

/* 購入履歴一覧/詳細
----------------------------------------------- */
.add_address {
  margin-bottom: 20px;
}

/* 会員登録内容変更/退会
----------------------------------------------- */
div#mycontents_area .message_area {
  margin: 30px auto;
  padding: 30px;
  border: 1px solid #ccc;
  text-align: center;
}

div#mycontents_area .message_area p {
  margin-bottom: 20px;
}

div#undercolumn_entry {
  max-width: 880px;
  margin: auto;
}

div#undercolumn_entry .kiyaku_text {
  margin: 20px auto;
  padding: 10px;
  border: solid 1px #ccc;
  width: 94%;
  background: #fff;
}

@media screen and (max-width: 768px) {
  div#undercolumn_entry table th,
  div#undercolumn_entry table td {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  div#undercolumn_entry table th {
    padding-bottom: 0;
    font-weight: bold;
  }
}

@media screen and (max-width: 768px) {
  div#undercolumn_entry table td {
    padding-top: 0;
  }
}

div#undercolumn_login {
  max-width: 880px;
  margin: auto;
}

div#undercolumn_login .login_area {
  margin-bottom: 30px;
}

div#undercolumn_login .login_area .inputbox {
  margin: 15px auto;
  padding: 30px;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

@media screen and (max-width: 768px) {
  div#undercolumn_login .login_area .inputbox {
    padding: 15px;
  }
}

div#undercolumn_login .login_area .inputbox input[type='text'], div#undercolumn_login .login_area .inputbox input[type='password'] {
  width: 100%;
}

div#undercolumn_error .message_area {
  width: 80%;
  margin: 30px auto;
  padding: 30px;
  border: 1px solid #ccc;
  text-align: center;
}

div#undercolumn_error .message_area .error {
  padding: 120px 0;
}

/* ==============================================
▼会員登録
=============================================== */
/* ==============================================
▼ログイン
=============================================== */
/* ==============================================
▼エラー
=============================================== */
/* ==============================================
▼商品一覧
=============================================== */
/* ページ送り
----------------------------------------------- */
.pagenumber_area {
  padding-bottom: 10px;
  background: url("../img/background/line_dot_01.gif") repeat-x bottom;
}

.pagecond_area {
  margin-bottom: 20px;
  padding: 10px;
}

.pagenumber_area {
  margin: 20px 0;
}

.pagecond_area {
  border: 1px solid #ccc;
}

.pagenumber_area .navi {
  width: 100%;
  text-align: left;
}

.pagenumber_area .navi li {
  display: inline;
}

.pagenumber_area .change {
  float: right;
  text-align: right;
  white-space: nowrap;
}

/* レイアウト
----------------------------------------------- */
div.list_area {
  padding: 0 0 30px 0;
  width: 100%;
  overflow: auto;
}

div.listphoto {
  float: left;
}

/* メインカラム用 1カラム時*/
#main_column.colnum1 div.listrightbloc {
  float: right;
  width: 74%;
}

#main_column.colnum2 div.listrightbloc {
  float: right;
  width: 80%;
}

#main_column.colnum3 div.listrightbloc {
  float: right;
  width: 74%;
}

/* メインカラム用 2カラム時*/
/* メインカラム用 3カラム時*/
/* 商品情報 各種設定
----------------------------------------------- */
/* 商品ステータス */
div.listrightbloc ul.status_icon {
  margin-bottom: 10px;
  width: 100%;
  text-align: right;
}

div.listrightbloc ul.status_icon li {
  display: inline-block;
  margin-left: 5px;
}

div.listrightbloc h3 {
  font-weight: bold;
  font-size: 120%;
}

div.listrightbloc .listcomment {
  margin: 0 0 10px 0;
  text-align: left;
}

div.listrightbloc .detail_btn {
  margin-bottom: 20px;
}

div.listrightbloc .pricebox {
  margin: 0 0 10px 0;
}

div.listrightbloc .classlist {
  margin-bottom: 10px;
  padding-bottom: 10px;
  background: url("../img/background/line_dot_02.gif") repeat-x bottom;
}

div.listrightbloc dl {
  width: 100%;
}

div.listrightbloc dt {
  display: inline-block;
  vertical-align: top;
}

div.listrightbloc dd {
  padding-bottom: 10px;
  display: inline-block;
}

div.listrightbloc dd p.attention {
  margin-top: 5px;
}

div.listrightbloc .cartin {
  margin: 0;
  float: right;
}

div.listrightbloc .cartin .quantity {
  padding: 3px 10px 0 0;
  width: 150px;
  float: left;
  text-align: right;
}

div.listrightbloc .cartin .quantity .box {
  width: 70px;
}

div.listrightbloc .cartin_btn {
  width: 160px;
  float: left;
}

/* 商品名 */
/* コメント */
/* 商品詳細を見る */
/* 価格 */
/* 買い物カゴ */
/* 規格 */
/* カゴに入れる */
/* ==============================================
▼商品詳細
=============================================== */
/* レイアウト

tplファイルのマークアップが同じ項目
* 1カラム時
* 2カラム時
* 3カラム時

----------------------------------------------- */
#detailarea, .sub_area {
  width: 100%;
  margin-bottom: 20px;
}

/* レイアウト
----------------------------------------------- */
/* 1カラム用 */
#main_column.colnum1 div#detailnamebloc h3 {
  margin: 0;
  color: #00618b;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 30px;
  font-size: 3rem;
}

@media screen and (max-width: 768px) {
  #main_column.colnum1 div#detailnamebloc h3 {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

#main_column.colnum1 div#detailphotobloc {
  width: 420px;
  padding: 0 20px;
}

@media screen and (max-width: 768px) {
  #main_column.colnum1 div#detailphotobloc {
    width: auto;
    padding: 0;
  }
}

#main_column.colnum1 div#detailphotobloc img {
  width: 100%;
}

#main_column.colnum1 div#detailphotobloc .share {
  margin-top: 10px;
}

#main_column.colnum1 div#detailphotobloc .share ul {
  display: flex;
  flex-wrap: wrap;
}

#main_column.colnum1 div#detailphotobloc .share ul li {
  margin-right: 3px;
}

#main_column.colnum1 #detailrightbloc {
  flex: 1;
  padding: 0 20px;
}

@media screen and (max-width: 768px) {
  #main_column.colnum1 #detailrightbloc {
    margin-top: 15px;
    padding: 0;
  }
}

#main_column.colnum1 div.subtext {
  margin-bottom: 20px;
  float: left;
  width: 69%;
}

#main_column.colnum1 div.subphotoimg {
  float: right;
  width: 25%;
  text-align: right;
}

#main_column.colnum1 p.subtext {
  margin-bottom: 20px;
}

#main_column.colnum2 div#detailphotobloc {
  float: left;
  width: 37%;
}

#main_column.colnum2 #detailrightbloc {
  float: right;
  width: 63%;
}

#main_column.colnum2 div.subtext {
  margin-bottom: 20px;
  float: left;
  width: 73%;
}

#main_column.colnum2 p.subtext {
  margin-bottom: 20px;
}

#main_column.colnum2 div.subphotoimg {
  float: right;
  width: 25%;
  text-align: right;
}

#main_column.colnum3 div#detailphotobloc {
  float: left;
  width: 49%;
}

#main_column.colnum3 #detailrightbloc {
  float: right;
  width: 50%;
}

#main_column.colnum3 div.subtext {
  margin-bottom: 20px;
  float: left;
  width: 63%;
}

#main_column.colnum3 p.subtext {
  margin-bottom: 20px;
}

#main_column.colnum3 div.subphotoimg {
  float: right;
  width: 35%;
  text-align: right;
}

/* 2カラム用 */
/* 3カラム用 */
/* 商品情報 各種設定
----------------------------------------------- */
#detailrightbloc h2 {
  margin: 0 0 10px 0;
  padding: 0 0 15px 0;
  color: #666;
  background: url("../img/background/line_dot_01.gif") repeat-x bottom;
  font-weight: bold;
  font-size: 160%;
}

#detailrightbloc .point, #detailrightbloc .relative_cat {
  margin: 0 0 10px 0;
  padding: 0 0 10px 0;
  background: url("../img/background/line_dot_01.gif") repeat-x bottom;
}

#detailrightbloc .main_comment {
  margin-bottom: 20px;
}

#detailrightbloc .product_code dt, #detailrightbloc .product_code dd {
  display: inline;
}

#detailrightbloc ul.status_icon {
  margin-bottom: 10px;
  width: 100%;
  text-align: right;
}

#detailrightbloc ul.status_icon li {
  display: inline-block;
  margin-left: 5px;
  margin-bottom: 3px;
}

#detailrightbloc .normal_price dt, #detailrightbloc .normal_price dd {
  display: inline;
}

#detailrightbloc .main_sale_price {
  margin: 10px 0;
}

#detailrightbloc .main_sale_price dt {
  display: none;
}

#detailrightbloc .main_sale_price dd {
  color: #E2041B;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: right;
}

#detailrightbloc .main_sale_price dd .tax {
  font-size: 14px;
  font-size: 1.4rem;
}

#detailrightbloc .sale_price dt, #detailrightbloc .sale_price dd {
  display: inline;
}

#detailrightbloc .point dt, #detailrightbloc .point dd {
  display: inline;
}

#detailrightbloc #pricetable table th,
#detailrightbloc #pricetable table td {
  padding: 10px;
}

#detailrightbloc #pricetable table th {
  background: transparent;
}

#detailrightbloc #pricetable table td {
  text-align: right;
}

#detailrightbloc .classlist ul {
  padding: 10px 0;
  border-bottom: 1px solid #ddd;
}

#detailrightbloc .classlist ul li {
  display: inline-block;
}

#detailrightbloc .maker dt, #detailrightbloc .maker dd {
  display: inline;
}

#detailrightbloc .comment1 dt, #detailrightbloc .comment1 dd {
  display: inline;
}

#detailrightbloc .relative_cat dd {
  margin-left: 1em;
}

#detailrightbloc .cart_area {
  margin-top: 40px;
}

#detailrightbloc .quantity {
  margin: -1px 0 0 0;
  padding: 10px 0;
  border-bottom: 1px solid #ddd;
}

#detailrightbloc .quantity dt,
#detailrightbloc .quantity dd {
  display: inline-block;
}

#detailrightbloc .cartin, #detailrightbloc .cartin_btn {
  margin-top: 20px;
  text-align: center;
}

#detailrightbloc .favorite_btn {
  text-align: center;
  margin-top: 10px;
}

#detailcommentbloc > div {
  margin-top: 20px;
  padding: 30px;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc > div {
    padding: 15px;
  }
}

#detailcommentbloc h3 {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.2em;
}

#detailcommentbloc #product_guide {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide {
    display: block;
  }
}

#detailcommentbloc #product_guide h3 {
  width: 100%;
  margin-bottom: 20px;
}

#detailcommentbloc #product_guide #product_comment {
  flex: 1;
  padding-right: 60px;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide #product_comment {
    padding-right: 0;
  }
}

#detailcommentbloc #product_guide #product_comment dl {
  margin-top: 25px;
}

#detailcommentbloc #product_guide #product_comment dl dt {
  padding: 10px 0;
  float: left;
  clear: both;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

#detailcommentbloc #product_guide #product_comment dl dd {
  padding: 10px 0 10px 8em;
  border-bottom: 1px solid #ccc;
}

#detailcommentbloc #product_guide #product_taste {
  width: 220px;
  margin: 0;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide #product_taste {
    width: auto;
    margin-top: 20px;
    text-align: center;
  }
}

#detailcommentbloc #product_guide #product15_comment .catch,
#detailcommentbloc #product_guide #product15_comment .catch2,
#detailcommentbloc #product_guide #product16_comment .catch,
#detailcommentbloc #product_guide #product16_comment .catch2 {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

#detailcommentbloc #product_guide .product15_section {
  display: flex;
  flex-wrap: wrap;
  margin-top: 60px;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide .product15_section {
    display: block;
  }
}

#detailcommentbloc #product_guide .product15_section .title {
  width: 100%;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

#detailcommentbloc #product_guide .product15_section .left {
  flex: 1;
  padding-right: 40px;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide .product15_section .left {
    padding-right: 0;
  }
}

#detailcommentbloc #product_guide .product15_section .left dl dt {
  padding: 10px 0;
  float: left;
  clear: both;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

#detailcommentbloc #product_guide .product15_section .left dl dd {
  padding: 10px 0 10px 8em;
  border-bottom: 1px solid #ccc;
}

#detailcommentbloc #product_guide .product15_section .right {
  width: 220px;
}

@media screen and (max-width: 768px) {
  #detailcommentbloc #product_guide .product15_section .right {
    width: auto;
    margin-top: 25px;
    text-align: center;
  }
}

.itemlist li {
  position: relative;
  margin-top: 0.5em;
  padding-left: 15px;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 15px;
  font-size: 1.5rem;
}

.itemlist li:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  display: inline-block;
  width: 10px;
  height: 2px;
  margin-top: -1px;
  vertical-align: middle;
  background: #333;
}

.itemlist li a {
  text-decoration: none;
}

/* お客様の声
----------------------------------------------- */
div#customervoice_area {
  clear: both;
  margin-top: 40px;
  padding: 30px;
  background: url(../img/index/bg_news01.jpg) repeat 0 0;
}

@media screen and (max-width: 768px) {
  div#customervoice_area {
    padding: 15px;
  }
}

div#customervoice_area h4.title {
  margin-top: 0;
}

@media screen and (max-width: 768px) {
  div#customervoice_area h4.title {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

div#customervoice_area .review_bloc {
  margin-top: 10px;
}

div#customervoice_area .review_bloc p {
  padding-top: 3px;
  margin-right: 10px;
  float: left;
}

div#customervoice_area .review_bloc .review_btn {
  float: right;
  width: 160px;
}

div#customervoice_area ul {
  margin-top: 0;
}

div#customervoice_area ul li {
  margin-top: 20px;
  padding: 20px;
  font-size: 12px;
  font-size: 1.2rem;
  background: #fff;
}

div#customervoice_area .voicetitle {
  margin: 0;
  color: #333;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: bold;
}

div#customervoice_area .voicedate {
  margin-top: 10px;
}

div#whobought_area {
  clear: both;
  padding: 35px 0 0 0;
}

div#whobought_area h2 {
  border-top: solid 1px #f90;
  background: url("../img/background/bg_tit_sub_01.jpg") repeat-x left bottom;
  padding: 5px 0 8px 10px;
  font-size: 14px;
}

div#undercolumn_cart {
  max-width: 880px;
  margin: auto;
}

div#undercolumn_cart .point_announce {
  padding: 20px;
  margin-bottom: 20px;
  border: solid 1px #ffcc62;
  background: #fffaf0;
  font-size: 120%;
  text-align: center;
  line-height: 140%;
}

div#undercolumn_cart .totalmoney_area {
  margin-bottom: 20px;
}

div#undercolumn_cart p {
  margin: 10px 5px;
}

div#undercolumn ul#quantity_level li {
  padding: 3px;
  display: inline;
}

div#undercolumn .empty {
  text-align: left;
}

div.form_area {
  margin-bottom: 30px;
}

div#undercolumn_customer {
  max-width: 880px;
  margin: auto;
}

@media screen and (max-width: 768px) {
  div#undercolumn_customer table th,
  div#undercolumn_customer table td {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  div#undercolumn_customer table th {
    padding-bottom: 0;
    font-weight: bold;
    white-space: normal;
  }
}

@media screen and (max-width: 768px) {
  div#undercolumn_customer table td {
    padding-top: 0;
  }
}

/* 関連商品（商品部分はbloc.cssのおすすめ商品と共通）
----------------------------------------------- */
/* ***********************************************
▼カートの中
/*********************************************** */
/* 現在のカゴの中
----------------------------------------------- */
/* お客様情報入力
----------------------------------------------- */
.flow_area {
  margin: 0 0 20px 0;
  text-align: center;
}

div#undercolumn_customer th em {
  color: #000;
  font-weight: bold;
}

div#undercolumn_shopping {
  max-width: 880px;
  margin: auto;
}

div#undercolumn_shopping .pay_area {
  margin: 0 auto 30px;
  width: 100%;
}

div#undercolumn_shopping .pay_area02 {
  margin: 40px auto 30px auto;
}

div#undercolumn_shopping .pay_area02 .txtarea {
  margin: 5px 0 0 0;
  padding: 2px;
  border: 1px solid #ccc;
  width: 99%;
  height: 150px;
}

div#undercolumn_shopping .pay_area02 .select-msg {
  margin-bottom: 10px;
}

div#undercolumn_shopping .point_area {
  margin: 40px auto 0 auto;
}

div#undercolumn_shopping .point_area .point_announce {
  padding: 20px;
  border: 1px solid #ccc;
}

div#undercolumn_shopping .point_area p {
  margin-bottom: 20px;
}

div#undercolumn_shopping .point_area .point_announce li {
  margin-bottom: 5px;
}

/* お支払い方法・お届け時間等の指定
----------------------------------------------- */
/* お届け先の指定
----------------------------------------------- */
#address_area {
  margin-bottom: 10px;
  width: 100%;
}

#address_area .information {
  width: 65%;
  float: left;
}

#undercolumn_shopping .information {
  margin-bottom: 15px;
}

#address_area .add_multiple {
  padding: 15px 10px;
  border: 1px solid #ffcc62;
  float: right;
  width: 30%;
  color: #555;
  background: #fffaf0;
  text-align: center;
  font-weight: bold;
}

#address_area .add_multiple p {
  margin-bottom: 10px;
}

#address_area p.addbtn {
  font-weight: bold;
  font-size: 10px;
}

/* ==============================================
▼検索結果
=============================================== */
p.condition_area {
  margin: 0 auto;
  padding: 5px;
  border: solid 1px #333;
  width: 566px;
}

/************************************************
tables
************************************************ */
/* デフォルトテーブル
----------------------------------------------- */
table {
  width: 100%;
  font-size: 13px;
  font-size: 1.3rem;
  text-align: left;
  border-collapse: collapse;
}

table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

table th,
table td {
  padding: 15px;
  vertical-align: top;
}

table th {
  white-space: nowrap;
}

/* 見出し
----------------------------------------------- */
div#undercolumn_shopping table th[scope=col] {
  text-align: center;
}

div#undercolumn_shopping table.delivname th {
  width: 155px;
}

div#mycontents_area table th {
  text-align: left;
}

div#mycontents_area table th.alignR {
  text-align: right;
}

div#mycontents_area table th.alignL {
  text-align: left;
}

div#mycontents_area table th.alignC {
  text-align: center;
}

div#mycontents_area table th.resulttd {
  text-align: right;
}

div#mycontents_area table caption {
  padding: 8px;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
  color: #000;
  background-color: #f0f0f0;
  text-align: left;
  font-weight: bold;
}

/* MYページ */
/* その他
----------------------------------------------- */
table select {
  margin-bottom: 7px;
  border: solid 1px #ccc;
}

/************************************************
ブロック用
************************************************ */
/*** 目次 ***

▼ブロック共通
リスト
タイトル
ヘッダー上、フッター下のブロックエリア

▼各機能ブロックの指定
-新着情報
-現在のカゴの中
-カテゴリ
-ガイドリンク
-ログイン（サイド用）
-検索
-カレンダー
-おすすめ商品
* 商品詳細のオススメ商品   [whobought_area]
*/
/* ==============================================
ブロック共通
* #container から指定することで、ヘッダー・フッターには適用していない。
/* ============================================= */
.side_column {
  overflow-x: hidden;
}

.side_column .block_body {
  border: solid 1px #ccc;
  border-top: none;
}

#main_column .block_body {
  border: solid 1px #ccc;
  border-top: none;
}

.side_column .block_body .box {
  border: solid 1px #ccc;
  width: 145px;
}

/* 外枠
----------------------------------------------- */
#container .block_outer {
  padding: 0 15px 10px;
}

#container #main_column .block_outer {
  padding: 0 0 20px;
}

#container .side_column .block_outer {
  padding: 0 7% 10px;
}

#container .block_outer .block_body dl.formlist {
  margin-bottom: 8px;
}

#container .block_outer .block_body dl.formlist dd {
  margin-bottom: 5px;
}

#container .block_outer .block_body dl.formlist dt {
  margin-bottom: 3px;
  padding-left: 15px;
  background: url("../img/icon/ico_arrow_03.gif") no-repeat left;
  font-size: 90%;
}

#container .block_outer .block_body dl.formlist span {
  vertical-align: top;
}

/* リスト
----------------------------------------------- */
/* ログイン 検索条件 */
/* タイトル
----------------------------------------------- */
/* タイトルの背景 白 */
#login_area h2, #search_area h2, #calender_area h2, #cart_area h2, #cart h2 {
  padding: 5px 0 8px 10px;
  border-style: solid;
  border-color: #f90 #ccc #ccc;
  border-width: 1px 1px 0;
  background: url("../img/background/bg_tit_bloc_01.jpg") repeat-x left bottom;
  font-size: 14px;
}

#category_area h2 {
  border-top: solid 1px #f90;
  background: url("../img/background/bg_tit_bloc_01.jpg") repeat-x left bottom;
  padding: 5px 0 8px 10px;
  font-size: 14px;
}

/* タイトルの背景 オレンジ */
#recommend_area h2 {
  padding: 5px 0 8px 10px;
  border-style: solid;
  border-color: #f90 #ccc #ccc;
  border-width: 1px 1px 0;
  background: url("../img/background/bg_btn_bloc_02.jpg") repeat-x left bottom #fef3d8;
}
/* 
#news_area h2 {
  padding: 5px 0 8px 10px;
  border-style: solid;
  border-color: #f90 #ccc #ccc;
  border-width: 1px 1px 0;
  background: url("../img/background/bg_btn_bloc_02.jpg") repeat-x left bottom #fef3d8;
}

#news_area .news_contents {
  padding: 10px;
  max-height: 260px;
  height: auto !important;
}

#news_area dl.newslist {
  background: url("../img/background/line_dot_01.gif") repeat-x bottom;
}

#news_area dl.newslist:last-child {
  background: none;
}

#news_area dl.newslist dt {
  margin-bottom: 5px;
}

#news_area dl.newslist dd {
  margin-bottom: 10px;
  padding-bottom: 10px;
} */

/* ***********************************************
▼各機能ブロックの指定
/*********************************************** */
/* ===============================================
▼新着情報
=============================================== */
/* ===============================================
▼現在のカゴの中
=============================================== */
#cart_area .information {
  padding: 10px;
}

#cart_area .postage {
  margin-top: 10px;
  padding-top: 10px;
  background: url("../img/background/line_dot_01.gif") repeat-x top;
}

#cart_area .postage .point_announce {
  padding: 2px 0 2px 20px;
  background: url("../img/icon/ico_price.gif") no-repeat left top;
}

#cart_area .btn {
  padding: 10px 0;
  background: url("../img/background/line_dot_01.gif") repeat-x top #f7f7e6;
  text-align: center;
}

/* ===============================================
▼カテゴリ
=============================================== */
#container #category_area .block_body {
  background-color: #fffaf0;
}

#category_area li {
  padding-left: 5px;
}

#category_area li.level1 {
  border-bottom: solid 1px #ccc;
}

#category_area li.level1 p {
  padding-left: 20px;
  margin: 7px 3px;
  background: url("../img/icon/ico_arrow_01.gif") 2px 3px no-repeat;
}

#category_area li.level1 li p {
  background: url("../img/icon/ico_level.gif") 7px 7px no-repeat;
}

#category_area li a {
  display: block;
  padding: 0;
}

a.onlink:link {
  color: #f00;
  text-decoration: underline;
}

a.onlink:visited, a.onlink:hover {
  color: #f00;
}

/* ===============================================
▼ガイドリンク
=============================================== */
#guide_area {
  border: none;
}

#guide_area li {
  margin-bottom: 5px;
  letter-spacing: -0.05em;
}

ul.button_like li {
  margin: 0;
  padding: 0 0 1px 0;
  background: url("../img/background/bg_btn_list.jpg") bottom repeat-x;
}

ul.button_like li a {
  margin: 0;
  padding: 10px 15px 10px 10px;
  border: 1px solid;
  border-bottom: none;
  border-color: #ccc;
  display: block;
  background: url("../img/icon/ico_arrow_02.gif") no-repeat right;
  text-decoration: none;
  outline: none;
}

/* ===============================================
▼ログイン（サイド用）
※ヘッダー用はbloc_alpha.css内に記述
=============================================== */
#container div#login_area .block_body {
  padding: 10px;
}

#container div#login_area .block_body p {
  margin-bottom: 5px;
}

#container div#login_area .block_body .btn {
  text-align: center;
}

#container .login_area dl.formlist {
  max-width: 400px;
  margin: 20px auto 0;
}

#container .login_area dl.formlist:nth-child(1) {
  margin-top: 0;
}

#container .login_area dl.formlist dt:before {
  content: ">>";
}

#container .login_memory {
  margin-top: 10px;
}

#container div#login_area .block_body .mini {
  margin-top: 5px;
  letter-spacing: -0.01em;
}

#container div#search_area .block_body {
  padding: 10px;
}

#container div#search_area .block_body .btn {
  text-align: center;
}

/* ===============================================
▼検索
=============================================== */
/* ===============================================
▼カレンダー
=============================================== */
#calender_area {
  background-color: transparent;
  border: none;
}

#calender_area .block_body {
  padding: 10px 0;
  background-color: #f1f9fc;
}

#calender_area table {
  background: #fff;
  border: none;
  width: 150px;
  margin: 0 auto 5px;
  font-size: 90%;
}

#calender_area table td {
  padding: 1px 3px;
  border-top: 1px solid #ccc;
  border-right: none;
  text-align: center;
}

#calender_area th {
  padding: 1px 3px;
  background: #fff;
  border: none;
  text-align: center;
}

#calender_area table .month {
  margin-bottom: 5px;
  padding-left: 12px;
  background: url("../img/icon/ico_arrow_04.gif") no-repeat left;
  font-size: 120%;
}

#calender_area .off {
  color: #f00;
}

#calender_area .today {
  background-color: #FFF99D;
  font-weight: bold;
}

#calender_area .information {
  margin-left: 10px;
  font-size: 90%;
}

/* ===============================================
▼おすすめ商品
=============================================== */
/*
tplファイルのマークアップが同じ項目
メインカラム用
サイドカラム用           [side_column]
商品詳細のオススメ商品   [whobought_area]
=============================================== */
/* 共通
----------------------------------------------- */
#recommend_area .block_body, #whobought_area .product_item {
  padding: 10px 0 10px;
  border: none;
  background: url("../img/background/line_dot_01.gif") repeat-x bottom;
}

#recommend_area .block_body p, #whobought_area .product_item p {
  margin: 0 0 5px 0;
}

#recommend_area .block_body img, #whobought_area .product_item img {
  margin: 0 5px 0 0;
}

#recommend_area .block_body h3, #whobought_area .product_item h3 {
  font-size: 100%;
  font-weight: normal;
}

/* サイドカラム用 */
.side_column #recommend_area .product_item {
  margin-bottom: 10px;
}

/* 画像
----------------------------------------------- */
/* メインカラム用 */
#main_column #recommend_area .block_body .productImage, #whobought_area .product_item .productImage {
  margin-bottom: 10px;
  float: left;
  width: 90px;
}

/* サイドカラム用 */
.side_column #recommend_area .block_body .productImage {
  float: none;
  text-align: center;
  width: auto;
}

/* 左右の振り分け
----------------------------------------------- */
#main_column #recommend_area .product_item, #whobought_area .product_item {
  float: left;
  width: 47.5%;
  padding-left: 1%;
  padding-right: 1%;
}

/* 商品説明テキスト
----------------------------------------------- */
/* メインカラム用 1カラム時*/
#main_column.colnum1 #recommend_area .block_body .productContents {
  float: right;
  width: 74%;
}

#main_column.colnum2 #recommend_area .block_body .productContents, #main_column.colnum2 #whobought_area .productContents {
  float: right;
  width: 74%;
}

#main_column.colnum3 #recommend_area .block_body .productContents, #main_column.colnum3 #whobought_area .productContents {
  float: right;
  width: 67%;
}

/* メインカラム用 2カラム時*/
/* メインカラム用 3カラム時*/
/* サイドカラム用 */
.side_column #recommend_area .block_body .productContents {
  clear: both;
}

/************************************************
インヘッダーブロック
************************************************ */
/* ログイン（ヘッダー用）
----------------------------------------------- */
#header_login_area {
  padding: 0 10px;
  border: solid 1px #ffc979;
  height: 30px;
  background: #fef3d3;
  letter-spacing: -0.075em;
}

#header_login_area ul.formlist {
  margin-top: 5px;
}

#header_login_area ul.formlist li {
  float: left;
}

#header_login_area ul.formlist li.mail {
  padding-left: 28px;
  width: 155px;
  background: url("../img/common/ico_arrow_login.gif") no-repeat left;
  font-size: 90%;
}

#header_login_area ul.formlist li.password {
  padding-right: 5px;
}

#header_login_area ul.formlist li.login_memory {
  padding-right: 5px;
  font-size: 90%;
}

#header_login_area ul.formlist li.forgot {
  margin-top: 3px;
  padding-right: 5px;
  font-size: 90%;
}

#header_login_area ul.formlist li.btn {
  padding-right: 5px;
  width: 53px;
}

#header_login_area p.btn {
  height: 20px;
  padding: 5px 0;
  vertical-align: middle;
}

#header_login_area p.btn input[type=image] {
  vertical-align: middle;
}

/* ***********************************************
追加ブロック
************************************************ */
/* 共通
----------------------------------------------- */
#container .block_outer #banner_area .block_body {
  border: none;
}

/* 【メイン】バナーエリア_02
----------------------------------------------- */
#main_column .block_outer #banner_area .block_body ul {
  width: 100%;
}

#main_column .block_outer #banner_area .block_body ul li {
  float: left;
}

#main_column .block_outer #banner_area .block_body ul li.sub_01 {
  padding-right: 8px;
}

/* 【サイド】バナーエリア_01
----------------------------------------------- */
/* 【サイド】バナーエリア_02
----------------------------------------------- */
#leftcolumn .block_outer #banner_area .block_body ul li, #rightcolumn .block_outer #banner_area .block_body ul li {
  margin-bottom: 8px;
}

/************************************************
ポップアップウィンドウ
************************************************ */
/* 共通
----------------------------------------------- */
div#windowcolumn {
  width: 100%;
  max-width: 560px;
  height: 100%;
  margin: auto;
  padding: 15px;
}

div#windowcolumn h2 {
  margin-bottom: 10px;
  padding: 8px;
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: normal;
  background: #00618b;
}

div#window_area {
  margin: 15px auto 0 auto;
  padding-bottom: 20px;
  min-height: 300px;
  height: auto !important;
}

div#window_area p.information {
  margin-bottom: 20px;
}

div#window_area .message {
  margin-bottom: 20px;
  color: #f60;
  line-height: 150%;
  font-weight: bold;
  font-size: 140%;
}

@media screen and (max-width: 768px) {
  div#window_area table th,
  div#window_area table td {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  div#window_area table th {
    padding-bottom: 0;
    font-weight: bold;
    white-space: normal;
  }
}

@media screen and (max-width: 768px) {
  div#window_area table td {
    padding-top: 0;
    white-space: normal;
  }
}

div#window_area #forgot {
  margin: 0 auto;
  padding: 20px;
  width: 440px;
  border: 1px solid #ccc;
  text-align: left;
}

div#window_area #forgot .mailaddres {
  margin-bottom: 10px;
}

div#window_area #forgot p {
  margin: 0;
}

div#bigimage, div#cartimage {
  margin-top: 15px;
  background-color: #fff;
  text-align: center;
}

div#bigimage img, div#cartimage img {
  padding: 10px;
  background-color: #fff;
}

div#zipsearchcolumn {
  margin: 15px auto 0 auto;
  border-top: 5px solid #ffa85c;
  border-bottom: 5px solid #ffa85c;
  width: 460px;
  background-color: #fff;
}

div#zipsearchcolumn h2 {
  margin: 0 0 15px 0;
  width: 460px;
}

div#zipsearch_area {
  margin: 15px auto 0 auto;
  width: 460px;
}

div#zipsearchcolumn .btn {
  margin: 15px 0 30px 0;
  text-align: center;
}

div#zipsearch_area #completebox p {
  padding: 60px 5px;
  text-align: center;
}

/* お客様の声の書き込み、新しいお届け先の追加・変更
----------------------------------------------- */
/* 商品詳細拡大写真、カート拡大写真
----------------------------------------------- */
/* 郵便番号検索
----------------------------------------------- */
/************************************************
お支払い方法
************************************************ */
div#undercolumn_payment {
  max-width: 880px;
  margin: auto;
}

/************************************************
商品のお届け
************************************************ */
div#undercolumn_shipping {
  max-width: 880px;
  margin: auto;
}

div#undercolumn_shipping h3.title span {
  margin-left: 1em;
  color: #00b0fa;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 18px;
  font-size: 1.8rem;
  letter-spacing: 0;
}

/************************************************
WordPress
************************************************ */
/* 記事一覧
----------------------------------------------- */
.secTopicsArchive {
  margin-bottom: 20px;
}

.secTopicsArchive a {
  position: relative;
  display: block;
  text-decoration: none;
}

.secTopicsArchive a .title {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  padding: 10px;
  color: #fff;
  background: rgba(0, 0, 0, 0.7);
}

.secTopicsArchive a img {
  width: 100%;
}

.wp-pagenavi {
  text-align: center;
}

.wp-pagenavi a {
  display: inline-block;
  margin: 0 3px;
  padding: 8px 15px;
  color: #00618b;
  text-decoration: none;
  border: 1px solid #00618b;
}

.wp-pagenavi a:hover,
.wp-pagenavi span {
  display: inline-block;
  margin: 0 3px;
  padding: 8px 15px;
  color: #fff;
  text-decoration: none;
  border: 1px solid #00618b;
  background: #00618b;
  opacity: 1;
}

/* 記事詳細
----------------------------------------------- */
#undercolumn_single {
  max-width: 720px;
  margin: auto;
}

#undercolumn_single a.list {
  display: inline-block;
  min-width: 240px;
  padding: 0 15px;
  color: #00618b;
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #00618b;
  cursor: pointer;
  transition: 0.5s ease;
}

#undercolumn_single a.list:hover {
  color: #fff;
  background: #00618b;
  opacity: 1;
}

.secTopicsSingle {
  margin-bottom: 40px;
}

.secTopicsSingle .date {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0.2em;
  text-align: center;
}

.secTopicsSingle .title {
  margin-top: 10px;
}

.secTopicsSingle .title h3 {
  font-family: '游明朝', 'YuMincho', "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: normal;
  letter-spacing: 0.2em;
  text-align: center;
}

.secTopicsSingle .content {
  margin-top: 20px;
}