@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;
}

/************************************************
共通設定
************************************************ */
body {
    color: #666;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    background-color: #ffffff;
    background-size:contain;
    font-size: 95%;
    line-height: 150%;
    letter-spacing: 0.1em;
}

/* 写真 */
img.picture {
    border: 1px solid #ccc;
}
.sp{display: none !important;}
.pc{display: block !important;}
span.pc{display: inline !important;}

@media only screen and (max-width: 768px) {
.sp{display: block !important;}
.pc,span.pc{display: none !important;}
}
.img_reset {
    max-width: 100%;
    height: auto;
}

/* ==============================================
フレーム
=============================================== */
/* 全体を包括 */
.frame_outer {
    margin: 0 auto;
    width: 100%;
    text-align: center;
    position: relative;
    z-index: 3;
}

/* コンテンツ */
#container {
    margin: 0 auto;
    padding: 0 15px 10px;
    max-width: 980px;
    width: 100%;
    background: #ffffff;
    text-align: left;
    box-sizing: border-box;
}


/* ==============================================
カラム指定
=============================================== */

/* メイン部
----------------------------------------------- */
#main_column {
    padding: 10px 0 0;
}

/* 1カラム時 */
#main_column.colnum1 {
    margin: 0 auto;
    width: 80%;
}

/* 2カラム時 (共通) */
#main_column.colnum2 {
    width: calc(100% - 195px);
}

/* 2カラム時 (メイン部が左) */
#main_column.colnum2.left {
    padding-left: 1.5%;
    float: left;
}

/* 2カラム時 (メイン部が右) */
#main_column.colnum2.right {
    float: right;
    box-sizing: border-box;
}

/* 3カラム時 */
#main_column.colnum3 {
    padding-left: 0.5%;
    width: 59%;
    float: left;
}

@media only screen and (max-width: 768px) {
#main_column.colnum2.right {
    float: none;
}
#main_column.colnum2 {
    width: 100%;
    box-sizing: border-box;
}
}

/* サイドカラム
----------------------------------------------- */
.side_column {
    padding: 10px 0 0;
}
#leftcolumn {
    float: left;
    width: 180px;
}
#rightcolumn {
    float: right;
    width: 20%;
}
@media only screen and (max-width: 768px) {
#leftcolumn {
    float: none;
    width: 100%;
}
}

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

/* 下層コンテンツ */
#undercolumn {
    width: 100%;
    margin: 0 0 30px 0;
}


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

/* リンク指定
----------------------------------------------- */
a:link,
a:visited {
    color: #39c;
    text-decoration: none;
}
a:link:hover,
a[href]:hover {
    color: #f60;
    text-decoration: underline;
}

.hover_change_image {
    transition: .5s;
    display: inline-block;
}
.hover_change_image:hover {
    opacity: .7;
}

/* フォント
----------------------------------------------- */
h1,
h2,
h3,
h4,
h5 {
    font-size: 150%;
    line-height: 150%;
}
.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;
}
.fw-normal {
    font-weight: normal;
}
.fw-bold {
    font-weight: bold;
}


/* フォーム
----------------------------------------------- */
select {
    border: solid 1px #ccc;
}
input[type='text'],
input[type='password'] {
    border: solid 1px #ccc;
    padding: 2px;
}

.box40 {
    width: 40px;
}
.box60 {
    width: 60px;
}
.box100 {
    width: 100px;
}
.box120 {
    width: 120px;
}
.box140 {
    width: 140px;
}
.box145 {
    width: 145px;
}
.box150 {
    width: 150px;
}
.box240 {
    width: 240px;
}
.box300 {
    width: 300px;
}
.box320 {
    width: 320px;
}
.box350 {
    width: 350px;
}
.box380 {
    width: 380px;
}

/* フォームが縦に重なり合う場合に併用する余白 */
.top { /* FIXME 簡素な単語は、単独で、込み入った指定に使用しない */
    margin-bottom: 5px;
}


/* タイトル
----------------------------------------------- */
h2.title {
    margin-bottom: 10px;
    padding: 8px;
    border-top: solid 1px #ebeced;
    color: #192f60;
    background-color: #c1e4e9;
    font-size: 170%;
}

#main_column .sub_area h3,
#undercolumn_login .login_area h3,
#undercolumn_shopping h3,
#mypagecolumn h3,
#undercolumn_cart h3 {
    margin: 0 0 10px 0;
    padding: 5px 0 10px;
    color: #f60;
    background: url("https://img07.shop-pro.jp/PA01461/853/etc/line_01.gif?cmsp_timestamp=20210114112502") repeat-x left bottom;
    font-size: 120%;
}

div#undercolumn_login .login_area h4 {
    padding-left: 15px;
    background: url("../img/icon/ico_arrow_05.gif") no-repeat left;
}

/* ==============================================
ヘッダー
=============================================== */
/* レイアウト
----------------------------------------------- */
#header_wrap {
    /* border-top: solid 3px #fff; */
    min-height: 100px;
    background-color: #ffffff;
    background-size:cover;
}
#header {
    margin: auto;
    max-width: 980px;
    width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}
#header_utility {
    float: right;
    width: 580px;
}
#errorHeader {
    color: #F00;
    font-weight: bold;
    font-size: 12px;
    background-color: #FEB;
    text-align: center;
    padding: 5px;
}
@media only screen and (max-width: 768px) {
    #header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0;
    }
    #header_wrap {
        min-height: 0;
    }
}

/* ロゴ
----------------------------------------------- */
#logo_area {
    /* float: left; */
    width: 100%;
    text-align: left;
}
#site_description {
    font-size: 100%;
    text-align: left;
    width: 980px;
}
@media only screen and (max-width: 768px) {
    #logo_area {
        float: none;
        width: calc(100% - 150px);
        padding-left: 10px;
    }
}

/* ヘッダーナビ
----------------------------------------------- */
div#header_navi {
    max-width: 950px;
    width: 100%;
    height: 38px;
    margin: 0 auto;
    box-sizing: border-box;
}
div#header_navi ul {
    display: flex;
    justify-content: flex-end;
}
div#header_navi ul li {
    display: block;
    margin-top: 0px;
}
div#header_navi ul li.mypage,
div#header_navi ul li.entry {
    margin-top: 6px;
}

/* ==============================================
フッター
=============================================== */
#footer_wrap {
    margin: 0 auto;
    max-width: 980px;
    height: 80px;
    background: #fff;
}
#footer {
    margin: 0;
    padding: 10px 15px 0;
    border-top: solid 1px #ccc;
    max-width: 950px;
}
#pagetop {
    width: 210px;
    float: right;
    text-align: right;
}
#copyright {
    width: calc(100% - 240px);
    float: left;
    text-align: left;
    font-size: 97%;
}
@media only screen and (max-width: 768px) {
#pagetop,#copyright {
    float: none;
    width: 100%;
    text-align: center;
}
#pagetop {
    text-align: right;
    margin-bottom: 20px;
}
}

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

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

.btn_area li a:hover {
    text-decoration: none;
}

/* 完了メッセージ
----------------------------------------------- */
div#complete_area {
    margin-bottom: 20px;
}
div#complete_area .message,
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%;
}

/************************************************
カスタムメニュー　横並び
************************************************ */
.head_nav {
    max-width: 950px;
    margin: 0 auto;
}
ul.ulNav {
    padding: 0;
    border: solid 1px #ccc; /* メニューの枠線 */
    display: flex;
}

/* メニューの表示スタイル */
ul.ulNav li {
    line-height: 40px; /* 文字の縦位置（メニューの縦幅と同じにする） */
    width: calc(100% / 7); /* メニューの横幅 */
    height: 40px; /* メニューの縦幅 */
    position: relative;
    text-align: center;
    background: #ffffff; /* メニューの背景 以下グラデーションの設定*/
    background: -moz-linear-gradient(top, #ffffff 0%, #c1e4e9 50%, #c1e4e9 51%, #ffffff 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#c1e4e9), color-stop(51%,#c1e4e9), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%,#c1e4e9 50%,#c1e4e9 51%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%,#c1e4e9 50%,#c1e4e9 51%,#ffffff 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%,#c1e4e9 50%,#c1e4e9 51%,#ffffff 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ffffff 0%,#c1e4e9 50%,#c1e4e9 51%,#ffffff 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

ul.ulNav li:not(:last-child) {
    border-right:solid 1px #ccc; /* 区切り線 */
}

ul.ulNav li a{
    display:block;
    color:#666; /* メニューの文字色 */
}

ul.ulNav li a:hover{
    color:#39F; /* マウスオーバー時のメニューの文字色 */
    background: #c1e4e9; /* マウスオーバー時のメニューの背景色 */
    text-decoration:none;
}

ul.ulNav ul.second {
    position: absolute;
    top: 40px;/*親メニューの高さと同じにする*/
    width: 200px;
    white-space:nowrap;
    z-index: 100;
}
ul.ulNav ul.second li {
    visibility: hidden;
    overflow: hidden;
    width: 200px;/*サブメニューの幅*/
    height: 0;
    border-bottom:solid 1px #ccc;
    background:#c1e4e9;/*サブメニューの背景色*/
    font-size: 0.8em;
    padding:0 10px;
}
ul.ulNav ul.second li:hover, ul.ulNav ul.second li a:hover {
    background:#c1e4e9;/*ホバー時のサブメニューの背景色*/
}
ul.ulNav li:hover ul.second li, ul.ulNav li a:hover ul.second li{
    visibility: visible;
    overflow: hidden;
    height:40px;/*サブメニューの高さ*/
    z-index: 10;
}
/*アニメーションの速度*/
ul.ulNav * {
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

/* カスタムメニュー　横並び(SP)
----------------------------------------------- */
@media only screen and (max-width: 840px) {
ul.ulNav li a {
    font-size: 10px;
}
}
@media only screen and (max-width: 768px) {
#btn_menu {
    width: 44px;
}
.nav-trigger {
    color: transparent !important;
}
.btn_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 70px;
}
#icn_cart a{
    display: block;
}
#icn_cart i:before {
    color: #525263;
    font-size: 22px;
}
.nav-trigger {
    position: relative;
    display: block;
    width: 44px;
    height: 44px;
    overflow: hidden;
    white-space: nowrap;
    z-index: 3;
    cursor: pointer;
}
.nav-trigger span {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -2px;
    -webkit-transition: background 0.3s 0.3s;
    -moz-transition: background 0.3s 0.3s;
    transition: background 0.3s 0.3s;
}
.nav-trigger span::before {
    top: -6px;
}
.nav-trigger span::after {
    top: 6px;
}
.nav-trigger span, .nav-trigger span::before, .nav-trigger span::after {
    position: absolute;
    display: inline-block;
    height: 3px;
    width: 24px;
    background: #525263;
}
.nav-trigger span::before, .nav-trigger span::after {
    content: '';
    right: 0;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 0% 50%;
    -moz-transform-origin: 0% 50%;
    -ms-transform-origin: 0% 50%;
    -o-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-transition: -webkit-transform 0.3s 0.3s;
    -moz-transition: -moz-transform 0.3s 0.3s;
    transition: transform 0.3s 0.3s;
}
.drawer-open .nav-trigger span {
    background: rgba(46, 50, 51, 0);
}
.drawer-open .nav-trigger span::before, .drawer-open .nav-trigger span::after {
    background: #525263;
}
.drawer-open .nav-trigger span::before {
    -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg);
    -moz-transform: translateX(4px) translateY(-3px) rotate(45deg);
    -ms-transform: translateX(4px) translateY(-3px) rotate(45deg);
    -o-transform: translateX(4px) translateY(-3px) rotate(45deg);
    transform: translateX(4px) translateY(-3px) rotate(45deg);
}
.drawer-open .nav-trigger span::after {
    -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg);
    -moz-transform: translateX(4px) translateY(2px) rotate(-45deg);
    -ms-transform: translateX(4px) translateY(2px) rotate(-45deg);
    -o-transform: translateX(4px) translateY(2px) rotate(-45deg);
    transform: translateX(4px) translateY(2px) rotate(-45deg);
}
.overlay {
    position: fixed;
    z-index: 2;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    background-color: rgba(0,0,0, 0.5);
    visibility: hidden;
    opacity: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s;
}
.overlay.is-visible {
    -webkit-transform: translateX(-280px);
    -moz-transform: translateX(-280px);
    -ms-transform: translateX(-280px);
    -o-transform: translateX(-280px);
    transform: translateX(-280px);
}
.overlay.is-visible {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s;
}
.block_outer.head_nav {
    height: 0;
    visibility: hidden;
    -webkit-transition: visibility 0s 0.3s;
    -moz-transition: visibility 0s 0.3s;
    transition: visibility 0s 0.3s;
}
.block_outer.head_nav {
    position: fixed;
    top: 0;
    right: 0;
    width: 280px;
    background: #F6F6F6;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 1;
}
.drawer-open .block_outer.head_nav {
    height: 100%;
    visibility: visible;
    -webkit-transition: visibility 0s 0s;
    -moz-transition: visibility 0s 0s;
    transition: visibility 0s 0s;
}
ul.ulNav {
    display: block;
    border: none;
}
ul.ulNav li {
    background: none;
    width: 100%;
    height: auto;
    text-align: left;
}
ul.ulNav li:not(:last-child) {
    border-right: none;
}
ul.ulNav li a {
    font-size: 14px;
    border-bottom: 1px dotted #ccc;
    padding: 0 15px;
    box-sizing: border-box;
}
ul.ulNav ul.second {
    position: static;
    visibility: visible;
    width: auto;
}
ul.ulNav ul.second li {
    visibility: visible;
    overflow: hidden;
    width: auto;
    height: auto;
    border-bottom: none;
    background: none;
    font-size: 100%;
    padding: 0;
}
ul.ulNav ul.second li:hover {
    background: none;
}
ul.ulNav li:hover ul.second li, ul.ulNav li a:hover ul.second li{
    height: auto;
}
#container,.frame_outer,#footer_wrap {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform;
}
#container,.frame_outer,#footer_wrap {
    position: relative;
    -webkit-transition: -webkit-transform 0.3s;
    -moz-transition: -moz-transform 0.3s;
    transition: transform 0.3s;
}
.drawer-open #container,.drawer-open .frame_outer,.drawer-open #footer_wrap {
    -webkit-transform: translateX(-280px);
    -moz-transform: translateX(-280px);
    -ms-transform: translateX(-280px);
    -o-transform: translateX(-280px);
    transform: translateX(-280px);
}
}

/************************************************
各ページコンテンツ用
************************************************ */
/* ==============================================
▼TOP
=============================================== */
/* メインイメージ
----------------------------------------------- */
#main_image {
    margin-bottom: 10px;
    text-align: center;
}

/* ==============================================
▼下層
=============================================== */
/* ==============================================
▼ガイド
=============================================== */
/* ◎◎について
----------------------------------------------- */
div#undercolumn_aboutus {
}

/* 特定商取引法
----------------------------------------------- */
div#undercolumn_order {
}

/* お問い合わせ
----------------------------------------------- */
div#undercolumn_contact {
    margin: 0 auto;
    width: 100%;
}

.zipimg img {
    vertical-align: middle;
}


/* ==============================================
▼MYページ
=============================================== */
/* 共通設定
----------------------------------------------- */
div#mypagecolumn {
    width: 100%;
}

div#mynavi_area {
    width: 100%;
}

div#mycontents_area {
    width: 100%;
}
div#mynavi_area .mynavi_list {
    margin-bottom: 20px;
    width: 100%;
}
div#mynavi_area .mynavi_list li {
    margin: 0 15px 5px 0;
    padding-left: 15px;
    float: left;
    background: url('https://img21.shop-pro.jp/PA01461/853/etc/ico_arrow_01.gif?cmsp_timestamp=20210107171216') no-repeat left ;
    font-size: 120%;
}

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/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 {
    width: 100%;
}

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


/* ==============================================
▼ログイン
=============================================== */
div#undercolumn_login {
    margin: 0 auto;
    width: 100%;
}

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

div#undercolumn_login .login_area .inputbox {
    margin: 15px auto 15px auto;
    padding: 15px 20px 10px 20px;
    background: #f0f0f0;
}

div#undercolumn_login .login_area .inputbox .btn_area {
    margin-top: 0;
}


/* ==============================================
▼エラー
=============================================== */
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("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") 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;
}
div.listphoto a {
    max-width: 132px;
    display: block;
}
div.listphoto a img {
    box-sizing: border-box;
}

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

/* メインカラム用 2カラム時*/
#main_column.colnum2 div.listrightbloc {
    float: right;
    width: calc(100% - 145px);
}

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

@media only screen and (max-width: 400px) {
    div.listphoto {
        float: none;
    }
    div.listphoto a {
        max-width: none;
        text-align: center;
        margin-bottom: 20px;
    }
    #main_column.colnum2 div.listrightbloc {
        width: 100%;
    }
}

/* 商品情報 各種設定
----------------------------------------------- */
/* 商品ステータス */
div.listrightbloc ul.status_icon {
    margin-bottom: 10px;
    width: 100%;
}
div.listrightbloc ul.status_icon li {
    margin-right: 5px;
    float: left;
}

/* 商品名 */
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 .cart_area {
    padding: 10px;
    border: 1px solid #cef0f4;
    background-color: #ecf5ff;
    width: 94%;
    box-sizing: border-box;
}

/* 規格 */
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 {
    margin-bottom: 20px;
    width: 100%;
}

/* レイアウト
----------------------------------------------- */
/* 1カラム用 */
#main_column.colnum1 div#detailphotobloc {
    width: 37%;
    float: left;
}
#main_column.colnum1 #detailrightbloc {
    width: 63%;
    float: right;
}
#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;
}

/* 2カラム用 */
#main_column.colnum2 div#detailphotobloc {
    float: left;
    width: 37%;
}
#main_column.colnum2 #detailrightbloc {
    float: right;
    width: 60%;
}
#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;
}
@media only screen and (max-width: 768px) {
    #main_column.colnum2 div.subtext,
    #main_column.colnum2 div.subphotoimg,
    #main_column.colnum2 div#detailphotobloc,
    #main_column.colnum2 #detailrightbloc {
        float: none;
        width: 100%;
    }
    #main_column.colnum2 div.subphotoimg {
        text-align: center;
    }
    #main_column.colnum2 div#detailphotobloc {
        margin-bottom: 20px;
    }
    #main_column.colnum2 div#detailphotobloc .photo {
        text-align: center;
    }
}

/* 3カラム用 */
#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;
}

/* 商品情報 各種設定
----------------------------------------------- */
#detailrightbloc h2 {
    margin: 0 0 10px 0;
    padding: 0 0 15px 0;
    color: #666;
    background: url("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") 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("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") 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%;
}
#detailrightbloc ul.status_icon li {
    margin-right: 5px;
    margin-bottom: 3px;
    float: left;
}

/* 通常価格 */
#detailrightbloc .normal_price dt,
#detailrightbloc .normal_price dd {
    display: inline;
}

/* 販売価格 */
#detailrightbloc .sale_price dt,
#detailrightbloc .sale_price dd {
    display: inline;
}

/* ポイント */
#detailrightbloc .point dt,
#detailrightbloc .point dd {
    display: inline;
}

/* 規格 */
#detailrightbloc div.classlist {
    margin-bottom: 10px;
    padding-bottom: 10px;
    width: 100%;
    background: url("../img/background/line_dot_02.gif") repeat-x bottom ;
}
#detailrightbloc .classlist {
    margin-bottom: 5px;
}
#detailrightbloc ul {
    margin-bottom: 10px;
    width: 100%;
}
#detailrightbloc ul li {
    vertical-align: top;
    float: left;
}

/* メーカー */
#detailrightbloc .maker dt,
#detailrightbloc .maker dd {
    display: inline;
}

/* メーカーURL */
#detailrightbloc .comment1 dt,
#detailrightbloc .comment1 dd {
    display: inline;
}

/* 関連カテゴリ */
#detailrightbloc .relative_cat dd {
    margin-left: 1em;
}

/* 買い物カゴ */
#detailrightbloc .cart_area {
    padding: 10px;
    background-color: #ecf5ff;
    border: 1px solid #cef0f4;
}
#detailrightbloc .quantity dt,
#detailrightbloc .quantity dd {
    display: inline;
}
#detailrightbloc .cartin {
    text-align: center;
}
#detailrightbloc .cartin_btn {
    text-align: center;
}
#detailrightbloc .favorite_btn {
    text-align: center;
    margin-top: 10px;
}
#detailrightbloc .favorite_btn button {
    border: 0;
    background: none;
    cursor: pointer;
}
#detailrightbloc .favorite_btn button:focus {
	outline:0;
}
#detailrightbloc .cartin_btn button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}
@media only screen and (max-width: 768px) {
    #detailrightbloc h2 {
        font-size: 130%;
    }
}

/* 利用規約用文言 */
#detailrightbloc .kiyaku_text {
    font-size: 12px;
}

/* お客様の声
----------------------------------------------- */
div#customervoice_area {
    clear: both;
    padding: 35px 0 0 0;
}

div#customervoice_area h2 {
    margin-bottom: 20px;
    padding: 6px 0 8px 10px;
    border-top: solid 1px #f90;
    background: url('https://img07.shop-pro.jp/PA01461/853/etc/bg_tit_sub_01.jpg?cmsp_timestamp=20210114124438') repeat-x left bottom;
}

div#customervoice_area .review_bloc {
    margin-bottom: 20px;
    padding: 10px;
    background-color: #f6f6f6;
}

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 li {
    padding-bottom: 15px;
    margin-bottom: 15px;
    background: url("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") repeat-x bottom ;
}

div#customervoice_area .voicetitle {
    margin-bottom: 5px;
    color: #333;
    font-weight: bold;
}

div#customervoice_area .voicedate {
    margin-bottom: 10px;
}
@media only screen and (max-width: 768px) {
    div#customervoice_area .review_bloc p,
    div#customervoice_area .review_bloc .review_btn {
        float: none;
    }
    div#customervoice_area .review_bloc .review_btn {
        margin-top: 10px;
    }
    div#customervoice_area .review_bloc p {
        margin-right: 0;
    }
}

/* 関連商品（商品部分はbloc.cssのおすすめ商品と共通）
----------------------------------------------- */
div#whobought_area {
    clear: both;
    padding: 35px 0 0 0;
}

div#whobought_area h2 {
    border-top: solid 1px #f90;
    background: url('https://img07.shop-pro.jp/PA01461/853/etc/bg_tit_sub_01.jpg?cmsp_timestamp=20210114124438') repeat-x left bottom;
    padding: 5px 0 8px 10px;
    font-size: 14px;
}


/* ***********************************************
▼カートの中
/*********************************************** */
/* 現在のカゴの中
----------------------------------------------- */
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 {
}

.flow_area {
    margin: 0 0 20px 0;
}

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


/* お支払い方法・お届け時間等の指定
----------------------------------------------- */
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 {
    margin: 15px auto 20px auto;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}
table th {
    padding: 8px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #333;
    background-color: #f0f0f0;
    font-weight: normal;
}
table td {
    padding: 8px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

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

/* MYページ */
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;
}


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

div#bottomcolumn table {
    border: none;
    padding: 0;
}
div#bottomcolumn table td {
    border: none;
    /* padding: 0; */
}


table.layout,
table.layout th,
table.layout td {
    border: none;
    margin: 0;
    padding: 0;
    vertical-align: top;
}


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

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

▼各機能ブロックの指定
-新着情報
-現在のカゴの中
-カテゴリ
-ガイドリンク
-ログイン（サイド用）
-検索
-カレンダー
-おすすめ商品
    * 商品詳細のオススメ商品   [whobought_area]
*/


/* ==============================================
ブロック共通
    * #container から指定することで、ヘッダー・フッターには適用していない。
/* ============================================= */
.side_column {
    overflow-x: hidden; /* IE6 表示乱れ防止 */
}
.side_column .block_body,
#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,
.block_outer.head_nav {
    padding: 0 0 10px; /* #container の背景色を欠けさせないため敢えて padding */
}
#container #main_column .block_outer {
    padding: 0 0 20px;
}
#container .side_column .block_outer {
    padding: 0 0 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: #dcdcdc #ccc #ccc;
    border-width: 1px 1px 0;
    background-color: #ffffff;
    font-size: 14px;
}
#category_area h2 {
    border-top: solid 1px #dcdcdc;
    background-color: #ffffff;
    padding: 5px 0 8px 10px;
    font-size: 14px;
}

/* タイトルの背景 白 */
#recommend_area h2,
#news_area h2 {
    padding: 5px 0 8px 10px;
    border-style: solid;
    border-color: #dcdcdc #ccc #ccc;
    border-width: 1px 1px 0;
    background-color: #ffffff;
}


/* ***********************************************
▼各機能ブロックの指定
/*********************************************** */

/* ===============================================
▼新着情報
=============================================== */
#news_area .news_contents {
    padding: 10px;
    max-height: 260px;
    height: auto !important; /* hack? */
    height: 260px; /* hack? */
    overflow: auto;
    overflow-y: scroll;
}
#news_area dl.newslist {
    background: url("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") repeat-x bottom;
}
#news_area dl.newslist:last-child { /* IE9 未満では無効 (影響度合いが低いので黙殺) */
    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("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") 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("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") repeat-x top #ffffff;
    text-align: center;
}


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

#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;
}
#category_area li.level1 p {
    background: url("https://img21.shop-pro.jp/PA01461/853/etc/ico_arrow_01.gif?cmsp_timestamp=20210107171216") 2px 3px no-repeat;
}
#category_area li.level1 li p {
    background: url("../../img/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 {
    color: #f00;
}
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("https://img21.shop-pro.jp/PA01461/853/etc/bg_btn_list.jpg?cmsp_timestamp=20210105150944") 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("https://img21.shop-pro.jp/PA01461/853/etc/ico_arrow_02.gif?cmsp_timestamp=20210105150906") 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 {
    margin-bottom: 8px;
    width: 450px;
}
#container .login_area dl.formlist dt {
    margin-bottom: 3px;
    padding-left: 15px;
    color: #333;
    background: url("../img/icon/ico_arrow_03.gif") no-repeat left;
    width: 120px;
    float: left;
    font-size: 90%;
}
#container .login_area dl.formlist dd {
    margin-bottom: 5px;
    float: right;
    width: 300px;
    vertical-align: bottom;
    text-align: left;
}
#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 caption {
    margin-bottom: 5px;
    padding-left: 12px;
    background: url("https://img07.shop-pro.jp/PA01461/853/etc/ico_arrow_04.gif?cmsp_timestamp=20210112100651") 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%;
}
@media only screen and (max-width: 768px) {
    #calender_area table {
        width: 100%;
    }
    #calender_area table caption {
        text-align: center;
        padding-bottom: 15px;
    }
}


/* ===============================================
▼おすすめ商品
=============================================== */
/*
tplファイルのマークアップが同じ項目
メインカラム用
サイドカラム用           [side_column]
商品詳細のオススメ商品   [whobought_area]
=============================================== */
/* 共通
----------------------------------------------- */
#recommend_area .block_body,
#whobought_area .product_item {
    padding: 10px 0 10px;
    border-width: 1px 1px 0;
    background: url("https://img21.shop-pro.jp/PA01461/853/etc/line_dot_01.gif?cmsp_timestamp=20210105152247") 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: 22%;
}
/* サイドカラム用 */
.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%;
}
@media only screen and (max-width: 768px) {
    #main_column #recommend_area .product_item,
    #whobought_area .product_item {
        float: none;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    #main_column #recommend_area .product_item:after,
    #whobought_area .product_item:after {
        content: "";
        display: block;
        clear: both;
    }
}

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

/* メインカラム用 2カラム時*/
#main_column.colnum2 #recommend_area .block_body .productContents,
#main_column.colnum2 #whobought_area .productContents {
    float: right;
    width: 74%;
}

/* メインカラム用 3カラム時*/
#main_column.colnum3 #recommend_area .block_body .productContents,
#main_column.colnum3 #whobought_area .productContents {
    float: right;
    width: 67%;
}

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

/************************************************
インヘッダーブロック
************************************************ */
#headerInternalColumn {
    margin-top: 5px;
    float: right;
    width: 520px;
    height: 35px;
}

/* ***********************************************
追加ブロック
************************************************ */
/* 共通
----------------------------------------------- */
#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;
}

@media only screen and (max-width: 768px) {
    #leftcolumn .left_bnr {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    #leftcolumn .left_bnr > div {
        width: 48%;
    }
}

/************************************************
ポップアップウィンドウ
************************************************ */
/* 共通
----------------------------------------------- */
/* div#windowcolumn {
    border-top: solid 3px #f90;
    width: 560px;
    height: 100%;
    margin: 15px 15px 0 15px;
    background: #fff;
}

div#windowcolumn h2 {
    margin-bottom: 10px;
    padding: 8px;
    border-top: solid 1px #ebeced;
    color: #f60;
    background: url("https://img07.shop-pro.jp/PA01461/853/etc/bg_tit_sub_01.jpg?cmsp_timestamp=20210114124438") repeat-x left bottom;
    background-color: #fef3d8;
    font-size: 170%;
}

div#window_area {
    margin: 15px auto 0 auto;
    padding-bottom: 20px;
    width: 540px;
    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%;
}
div#window_area table {
    width: 540px;
} */

/* お客様の声の書き込み、新しいお届け先の追加・変更
----------------------------------------------- */
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 {
    text-align: center;
}


/* 商品詳細拡大写真、カート拡大写真
----------------------------------------------- */
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;
}


/************************************************
印刷用
************************************************ */

@media print {
    body {
        zoom: 75%;
    }
}

/************************************************
TOP
************************************************ */
/* bxslider
----------------------------------------------- */
.slider {
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.bx-viewport {
    border: none !important;
    left: 0 !important;
}
.free_space_block {
    margin-top: 3em;
}
#slider {
    display:block;
}
.bx-wrapper .bx-viewport {
    box-shadow: none!important;
}
.bx-wrapper img {
    width:100%;
    height: auto;
}
.bx-wrapper .bx-pager.bx-default-pager a {
    background: #ddd!important;
    width: 13px!important;
    height: 13px!important;
    border-radius: 15px!important;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #D69746!important;
}

/* top_read_box
----------------------------------------------- */
.top_read_box li {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.top_read_box li .read_img {
    width: 48%;
}
.top_read_box li .read_img img {
    width: 50%;
}
.top_read_box li .read_text {
    width: 48%;
    font-size: 16px;
    margin-bottom: 20px;
}
@media only screen and (max-width: 768px) {
.top_read_box li {
    display: block;
}
.top_read_box li:not(:last-of-type) {
    margin-bottom: 30px;
}
.top_read_box li .read_img,
.top_read_box li .read_text {
    width: 100%;
    margin: 0 auto;
}
.top_read_box li .read_img {
    margin-bottom: 20px;
}
}

/************************************************
recomend_item
************************************************ */
.recomend_item {
    display: flex;
    flex-wrap:wrap;
    margin-bottom: 20px;
}
.recomend_item li {
    text-align: center;
    width: 32%;
}
.recomend_item li:not(:nth-of-type(3n)) {
    margin-right: 2%;
}
.recomend_item li:nth-of-type(n + 4) {
    margin-top: 30px;
}
@media only screen and (max-width: 768px) {
.recomend_item {
    justify-content: space-between;
}
.recomend_item li {
    width: 48%;
}
.recomend_item li:not(:nth-of-type(3n)) {
    margin-right: 0;
}
.recomend_item li:nth-of-type(n + 4) {
    margin-top: 0;
}
.recomend_item li:nth-of-type(n + 3) {
    margin-top: 30px;
}
}

.shop_obi{
    text-align: center;
    width: 100%;
    background-color:#f09b76;
}
.footer_link{
    text-align: right;
}
.space{
    padding-top: 20%;
}
.footer_line td{
    color: #000000;
    padding-left: 20px;
    padding-right: 20px;
}
.footer_line td:nth-of-type(n+2){
    background:url(https://img21.shop-pro.jp/PA01461/853/etc/footerinfo_line.jpg?cmsp_timestamp=20210106122222);
    background-repeat: repeat-y;
}
.footer_line h4{
    font-size: 120%;
}
@media only screen and (max-width: 768px) {
    .bottomcolumn tr td{
        display: block;
        padding: 0;
    }
    .space{
        padding: 0;
    }
    .footer_line td:nth-of-type(n+2){
        background: none;
        padding: 0;
    }
    div#bottomcolumn table td{
        max-width: initial;
    }
}