@charset "utf-8";

@import "layout_sp.css";

/* ============================================================

    style info : スマホ用のスタイルを記述

============================================================ */

/* -----------------------------------
    basic
----------------------------------- */
body {
    font-size: 14px;
    text-align: left;
    line-height: 1.4;
}

img{
    width: auto;
    height: auto;
    max-width: 100%;
}


/* -----------------------------------
    PC用のClassリセット
----------------------------------- */
[data-sp-def="2"] .item:nth-child(n+3){ display: none; }
[data-sp-def="3"] .item:nth-child(n+4){ display: none; }
[data-sp-def="4"] .item:nth-child(n+5){ display: none; }
[data-sp-def="5"] .item:nth-child(n+6){ display: none; }
[data-sp-def="6"] .item:nth-child(n+7){ display: none; }
[data-sp-def="7"] .item:nth-child(n+8){ display: none; }
[data-sp-def="8"] .item:nth-child(n+9){ display: none; }
[data-sp-def="9"] .item:nth-child(n+10){    display: none; }
[data-sp-def="10"] .item:nth-child(n+11){   display: none; }
[data-sp-def="11"] .item:nth-child(n+12){   display: none; }

/* -----------------------------------
    utils
----------------------------------- */
.spOnly{ display: inherit; }
.pcOnly{ display: none; }


/* -----------------------------------
    パンクズ
----------------------------------- */
.breadcrumb{display: block; font-size: 11px; padding: 10px;border-bottom: #dadada solid 1px;}

/* -----------------------------------
    layout
----------------------------------- */
#page { margin: 0; }
#contents {  }
#contents .content { }


/* -----------------------------------
    parts > form
----------------------------------- */

/* -----------------------------------
    parts > Slide
----------------------------------- */
.itemView { position: relative; }

.itemView .slick-next,
.itemView .slick-prev {
    position: absolute;
    top: 16px;
    width: 20px;
    height: auto;
    border:none;
    z-index: 1;
    text-indent:-9999px;
    cursor:pointer;
    -webkit-transition: all 0.2s linear;
         -moz-transition: all 0.2s linear;
            -ms-transition: all 0.2s linear;
             -o-transition: all 0.2s linear;
                    transition: all 0.2s linear;
}

.itemView .slick-next:hover,
.itemView .slick-prev:hover {
    -ms-filter: "alpha(opacity=50)";
    opacity: 0.5;
}

.itemView .slick-next.slick-disabled,
.itemView .slick-prev.slick-disabled {
    -ms-filter: "alpha(opacity=20)";
    opacity: 0.2;
}

.itemView .slick-prev {
    left: -20px;
    background: url(../img/common/btn_arrow_left.png) center center no-repeat;
}

.itemView .slick-next {
    right: -20px;
    background: url(../img/common/btn_arrow_right.png) center center no-repeat;
}

#item .itemSummary .galleryColumn .itemView .slick-dots { display: none !important; }



/* -----------------------------------
    parts > title
----------------------------------- */

/* 新しいタイプのタイトル */
.title-section{
    width: 100%;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    padding: 40px 0 25px;
    text-align: center;
}
/* 古いタイプのタイトル */
.ttl-section{
    width: 100%;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    padding: 40px 0 25px;
    text-align: center;
    vertical-align: middle;
    
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
}
.ttl-section:before{
    background:  url(../img/sp/title_slash.png) no-repeat 50% 50%;
    background-size: 100% auto;
    content: "";
    display:inline-block;
    vertical-align:text-bottom;
    height: 34px;
    width: 10.46875%;
    margin:0 4%;
    box-sizing:border-box;
}
.ttl-section:after{
    background:  url(../img/sp/title_slash.png) no-repeat 50% 50%;
    background-size: 100% auto;
    content: "";
    display:inline-block;
    vertical-align:text-bottom;
    height: 34px;
    width: 10.46875%;
    margin:0 4%;
    box-sizing:border-box;
}
.ttl-section img {
    height:0.9em;
    line-height: 0.9em;
}
.android .ttl-section:before,
.android .ttl-section:after{
    background:  url(../img/sp/title_slash.png) no-repeat 50% 90%;
    background-size: 100% auto;
}
.android .ttl-section img {
    position: relative;
    top: 12px;
}

/* title logo */
.ttl-logo{
    padding: 10%;
    text-align: center;
    position:relative;
    box-sizing: border-box;
    max-height: 107px;
}
.ttl-logo img{
    position:absolute;
    left: 50%;
    top: 50%;
    width: auto;
    height: auto;
    max-height: 65%;
    vertical-align: top;
    -webkit-transform: translate(-50%,-50%);
         -moz-transform: translate(-50%,-50%);
                    transform: translate(-50%,-50%);
}


/* -----------------------------------
    parts > text
----------------------------------- */
.txt-limited{
    background:url(../img/common/icon_limitedList.png) no-repeat 1% center;
    background-size: 8%;
    background-color: #fff;
    font-size: 14px;
    display:block;
    padding: 3% 3% 3% 11%;
    border-top: #e5e5e5 solid 1px;
    border-bottom: #e5e5e5 solid 1px;
    color: #df4363;
}



/* -----------------------------------
    parts > button
----------------------------------- */
button{ outline:none; }
.button {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    display: inline-block;
    color:#fff;
    width: 100%;
    height: 42px;
    line-height: 42px;
    position: relative;
    border: none;
    margin: 2% auto;
    font-size: 15px;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none !important;
    zoom: 1;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    behavior: url('/js/PIE.htc');
}

.button-pnk {
    color:#fff !important;
    background-color: #df2c52;
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,-webkit-gradient(linear, left top, left bottom, from(#df2c52), to(#b42342)) !important;
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% , -moz-linear-gradient(top, #df2c52, #b42342);
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% , linear-gradient(to bottom, #df2c52, #b42342);
    -pie-background: url(../img/sp/arrow_next.png) no-repeat 95% 50% , linear-gradient(top, #df2c52, #b42342);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#df2c52', endColorstr='#b42342', GradientType=0)";
    background-size: 8px 13px, 100% 100% !important;
}

.button-pnk-f {
    color:#fff;
    background: #df4363 url(../img/sp/arrow_next.png) no-repeat 95% 50%;
    background-size: 8px 13px, 100% 100% !important;
}

.button-wht {
    color:#333;
    background: #e7e7e7 url(../img/sp/arrow_back.png) 5% 50% no-repeat;
    background-size: 8px 13px, 100% 100% !important;
}

/* 修正0046　ここから*/
.button-wht-next {
    border-color: transparent;
    background-color: #e7e7e7;
    background: url(../img/sp/arrow.png) no-repeat 95% 50% ,-webkit-gradient(linear, left top, left bottom, from(#e7e7e7), to(#e7e7e7));
    background: url(../img/sp/arrow.png) no-repeat 95% 50% ,-moz-linear-gradient(top, #e7e7e7, #e7e7e7);
    background: url(../img/sp/arrow.png) no-repeat 95% 50% ,linear-gradient(to bottom, #e7e7e7, #e7e7e7);
    -pie-background: url(../img/sp/arrow.png) no-repeat 95% 50% ,linear-gradient(top, #e7e7e7, #e7e7e7);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7e7e7', endColorstr='#e7e7e7', GradientType=0)";
    background-size: 8px 13px, 100% 100% !important;
}
/* 修正0046　ここまで*/

.button-blue { 
    margin-left: 10px;
    border-color: transparent;
    background-color: #00b1e3;
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,-webkit-gradient(linear, left top, left bottom, from(#00b1e3), to(#0094be));
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,-moz-linear-gradient(top, #00b1e3, #0094be);
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,linear-gradient(to bottom, #00b1e3, #0094be);
    -pie-background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,linear-gradient(top, #00b1e3, #0094be);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b1e3', endColorstr='#0094be', GradientType=0)";
    background-size: 8px 13px, 100% 100% !important;
}

.button-gray { 
    margin-left: 10px;
    border-color: transparent;
    background-color: #4b4b4b;
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,-webkit-gradient(linear, left top, left bottom, from(#4b4b4b), to(#4b4b4b));
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,-moz-linear-gradient(top, #4b4b4b, #4b4b4b);
    background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,linear-gradient(to bottom, #4b4b4b, #4b4b4b);
    -pie-background: url(../img/sp/arrow_next.png) no-repeat 95% 50% ,linear-gradient(top, #4b4b4b, #4b4b4b);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#4b4b4b', endColorstr='#4b4b4b', GradientType=0)";
    background-size: 8px 13px, 100% 100% !important;
}

.btn{
    display: block;
    width: 90.5%;
    padding: 5%;
    box-sizing: border-box;
    border: none;
    margin: 0 auto;
    font-size: 16px;
    background:#FFFFFF url(../img/sp/arrow_down.png) no-repeat 94% center;
    background-size: 20px;
    margin-top: 4%;
}

.btn-more {
    margin-bottom: 4%;  /* 修正0044 */
    color :#df2c52; /* 修正0070*/
    
}


/* -----------------------------------
    parts > select
----------------------------------- */
.custom,
.customSelect  {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 42px;
    padding: 0 25px 0 10px;
    border: 1px solid #ccc !important;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    text-align: left;
    behavior: url('/js/PIE.htc');
}

.cartNum { background: #fff url(../img/common/form_arrow2.png) no-repeat right 50%; }
.reseveNum { background: #fff url(../img/common/form_arrow3.png) no-repeat right 50%; }
.deadstockNum { background: #fff url(../img/common/form_arrow4.png) no-repeat right 50%; }

/* -----------------------------------
    parts > list > .listType1
----------------------------------- */
.hotEntry{
    padding-bottom:9%;
}
.listType1 .item{
    background-color:#FFFFFF;
    width: 93.75%;
    margin: 4% auto;
    position: relative;
    display:block;
}

.listType1 .item:after{
    content: "";
    display: block;
    clear: both;
}
.listType1 .item .visual{
    padding: 2%;
    width: 40%;
    box-sizing: border-box;
    background: url(../img/common/bg_dot.png) center top repeat;
    background-size: 75px;
    float: left;
    text-align:center;    /* 修正0024 */
}
.listType1 .item .badge{
    position: absolute;
    top: -4%;
    left: 24%;
    width: 15.16666666666667%;
}
.listType1 .item .info{
    float: left;
    /* 修正0024 ここから */
    /* padding: 3.125%; */
    padding: 3.125% !important;
    /* 修正0024 ここまで */
    width: 60%;
    box-sizing: border-box;
    text-align: left;
    font-size: 13px;
    height: auto !important;
}
.listType1 .item .info span{
    background-color: #f1f1f1;
    padding: 2px 6px;
    line-height: 1.8;
    font-weight: bold;
}
.listType1 .item .ttl{
    display: block;
}
.listType1 .item .ttl span{
    display: inline-block;
}
.listType1 .item .spec{
    margin-top: 2%;
}
.listType1 .item .spec span{
    display: inline-block;
    line-height: 1.6;
}
.listType1 .item .limitedList{
    background-color: transparent;
    line-height: 1.4;
    font-size: 10px;
    color: #df2c52;
    padding: 5px 0;
    margin-top: 6%;
    border-top: #e5e5e5 solid 1px;
    border-bottom: #e5e5e5 solid 1px;
}
.listType1 .item .newsList{
    border-bottom: #e5e5e5 solid 1px;
    padding:5px 0 3px;
}
.listType1 .item .newsList dt{
    display: inline-block;
    background-color: #df4363;
    color: #FFFFFF;
    padding:0 5px;
    font-size: 11px;
}
.listType1 .item .newsList dd{
    display:inline-block;
    font-size: 12px;
}
.listType1 .item .sales{
    word-spacing:-0.5em;
    margin-top: 6%;
}
.listType1 .item .sales span{
    font-size: 16px;
    font-weight: bold;
    padding: 2px 6px;
}
.listType1 .item .date{
    color:#df2c52;
    font-size: 12px;
    margin-bottom: 4px;
}


.listType1 .item.level1 .visual{
    padding: 0;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
}
.listType1 .item.level1 .info {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    padding:6% 3.125%;
}
.listType1 .item.level1 .info .badge{
    width: 28.16%;
    position:absolute;
    top:0;
    left: 0;
    -webkit-transform: translate(10%,-110%);
         -moz-transform: translate(10%,-110%);
                    transform: translate(10%,-110%);
}
.listType1 .item.level1 .info span{
    background-color:#000000;
    color:#FFFFFF;
    padding: 4px 6px ;
    line-height: 1.2;
}
.listType1 .item.level1 .info .ttl{
    font-size: 17px;
}
.listType1 .item.level1 .info .ttl span{
    line-height: 1.9;
}
.listType1 .item.level1 .limitedList{
}
.listType1 .item.level1 .info .spec{
    font-size: 14px;
}
.listType1 .item.level1 .txt-limited{
    margin-top: 6%;
}
.listType1 .item.level1 .limitedList{
    background:url(../img/common/icon_limitedList.png) no-repeat 1% center;
    background-size: 8%;
    background-color: #fff;
    font-size: 14px;
    display:block;
    padding: 3% 3% 3% 11%;
    border-top: #e5e5e5 solid 1px;
    border-bottom: #e5e5e5 solid 1px;
    color: #df4363;
}
.listType1 .item.level1 .info .sales{
    margin-top: 2%;
    font-size: 17px;
    word-spacing: -0.5em;
}
.listType1 .item.level1 .info .sales span{
    word-spacing: normal;
    display: inline-block;
}

/* -----------------------------------
    parts > list > .listType2
----------------------------------- */
.listType2 {
    width: 93.75%;
    margin-left:auto;
    margin-right:auto;
}
.listType2 .item {
    width: 50%;
    box-sizing: border-box;
    padding: 2%;
    float: left;
    text-align: left;
    position:relative;
}
.listType2 .item:nth-child(odd){
    clear:both;
}
.listType2 .item .badge{
    position:absolute;
    width: 36%;
    top: -6%;
    right: -6%;
    z-index: 1;
}
.listType2 .item .visual{
    background: #fff url(../img/common/bg_dot.png) center top repeat;
    background-size: 50%;
    padding: 50%;
    position: relative;
    margin-bottom: 4%;
}
.listType2 .item .visual img{
    width: auto;
    height: auto;
    position: absolute;
    max-width: 90%;
    max-height: 90%;
    left:50%; top:50%;
    -webkit-transform: translate(-50%,-50%);
         -moz-transform: translate(-50%,-50%);
                    transform: translate(-50%,-50%);
}
.listType2 .item .ttl,
.listType2 .item .spec{
    font-weight: normal;
    line-height: 1.4;
    font-size: 12px;
}
.listType2 .item .sales{
    margin-top:4%;
    font-size: 16px;
}


/* -----------------------------------
    parts > list > .listType3
----------------------------------- */
.listType3 {
    width: 93.75%;
    margin-left:auto;
    margin-right:auto;
}
.listType3 .item {
    width: 50%;
    box-sizing: border-box;
    padding: 0 4.6875%;
    margin-bottom: 6%;
    float: left;
    text-align: left;
    position:relative;
}
.listType3 .item:nth-child(odd){
    clear: both;
}
.listType3 .item .badge{
    position: absolute;
    width: 36%;
    top: -6%;
    right: -6%;
    z-index: 1;
}
.listType3 .item .visual{
    width: 100%;
    margin-bottom: 4%;
}
.listType3 .item .ttl,
.listType3 .item .spec{
    font-weight: normal;
    line-height: 1.4;
    font-size: 12px;
}
.listType3 .item .sales{
    margin-top:4%;
    font-size: 16px;
}


/* -----------------------------------
    header
----------------------------------- */
#header{
    z-index: 21;
    width: 100%;
    position: relative;
}

html.cssanimations #header input[type="submit"] {
    -moz-appearance: none;
    -webkit-appearance: none;
}

#header .holderFix{
    width: 100%;
    height:auto;
    position: relative;
    z-index:20;
    left:0 !important;
    top:0 !important;
}
#header .holderFix .menu{
    position:relative;
    background: url(../img/common/bg_body.png) center top repeat;
    z-index:300;
}
#header .holderFix .menu:after{
    clear:both;
    content:"";
    display:block;
}

#header .holderFix .menu > .cart{ float: right; width: 15.625%; }
#header img{
    width: auto;
    height: auto;
    max-width: 100%;
    vertical-align: top;
}

#header a{ color: #000; text-decoration:none; }
#header .logo a{
    z-index:3;
    display:block;
    height:auto;
    width: 41.25%;
    max-width:264px;
    position:absolute;
    left:50%; top:50%;
    -webkit-transform: translate(-50%,-50%);
         -moz-transform: translate(-50%,-50%);
             -o-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
                    transform: translate(-50%,-50%);
}
#header .logo a img{
    display:block;
    width:100%;
}
#header .logo .animationLogo {
    display:none;
}

#header .nav-toggle{
    position: absolute;
    left: 3.25%;
    top: 50%;
    -webkit-transform: translate(0,-50%);
         -moz-transform: translate(0,-50%);
                    transform: translate(0,-50%);
    width: 7.5%;
    height: 60%;
    z-index: 21;
}
#header .nav-toggle div {
    position: relative;
    width: 100%;
        height:100%;
}
#header .nav-toggle span {
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    background: #333;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
#header .nav-toggle span:nth-child(1) {top: 30%;}
#header .nav-toggle span:nth-child(2) {top: 50%;}
#header .nav-toggle span:nth-child(3) {top: 70%;}

/* #nav-toggle 切り替えアニメーション */
#header.open .nav-toggle span:nth-child(1) {
    top:  50%;
    -webkit-transform: rotate(45deg);
         -moz-transform: rotate(45deg);
                    transform: rotate(45deg);
}
#header.open .nav-toggle span:nth-child(2) {
    opacity:0;
}
#header.open .nav-toggle span:nth-child(3) {
        top:  50%;
    -webkit-transform: rotate(-45deg);
         -moz-transform: rotate(-45deg);
                    transform: rotate(-45deg);
}

#header .holderFix .menuHolder{ 
    z-index:19;
    background-color: #e7e7e7;
    width: 100%;
    position:absolute;
    left: 0;
    top:-500px;
    box-sizing:border-box;
                    
-webkit-transition: all 500ms cubic-bezier(0.800, 0.005, 0.285, 1.000);
   -moz-transition: all 500ms cubic-bezier(0.800, 0.005, 0.285, 1.000);
     -o-transition: all 500ms cubic-bezier(0.800, 0.005, 0.285, 1.000);
        transition: all 500ms cubic-bezier(0.800, 0.005, 0.285, 1.000);
}

#header .nav-tools{
    padding: 3.125% 3.125% 0;
}
#header .nav-tools li{
    float:left;
    width: 49.4%;
    margin:0.3%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    background-color: #fff;
    padding:1em 0;
}
#header .nav-tools li a{
    box-sizing:border-box;
    display: block;
    position: relative;
    text-align: left;
    height: 25px;
    line-height: 25px;
}
#header .nav-tools li.login,
/* #header .nav-tools li.news, */ /* 修正0053 */
#header .nav-tools li.member{
    width: 99.4%;
    /* background: #fff url(../img/sp/header_arrow.png) 96% center no-repeat; */ /* 修正0054 */
    /* background-size: 10px auto; */ /* 修正0054 */
    padding-right: 5%;
    box-sizing: border-box;
}
/* 修正0055  ここから */
#header .nav-tools li.news{
    width: 99.4%;
    background: #fff url(../img/sp/header_arrow.png) 96% center no-repeat;
    background-size: 10px auto;
    padding-right: 5%;
    box-sizing: border-box;
}
/* 修正0055  ここまで */

#header .nav-tools li.login a,
#header .nav-tools li.member a{
    padding:0 0.4em;
    display: inline-block;
    text-align: center;
}

#header .nav-tools li a .num{
    background-color: #df4363;
    width: 20px;
    height: 20px;
    border-radius:10px;
    display: block;
    position:absolute;
    top: -10px;
    left: 20px;
    font-size: 9px;
    text-align: center;
    color: #fff;
  line-height: 20px;
}
#header .nav-tools li a .hide{
    display:inline-block;
    height:25px;
    line-height: 25px;
    vertical-align: bottom;
}
/* #header .nav-tools li.news a, */ /* 修正0056 */
#header .nav-tools li.history a{
    text-align: center;
    background: url(../img/sp/header_arrow.png) 92% center no-repeat;
    background-size: 10px auto;
    padding-right: 10%;
}

/* 修正0057 ここから */
#header .nav-tools li.news a{
    text-align: center;
    /* background: url(../img/sp/header_arrow.png) 92% center no-repeat; */
    background-size: 10px auto;
    padding-right: 10%;
}
/* 修正0057 ここまで */

#header .nav-tools li.news a .icon,
#header .nav-tools li.history a .icon{
    background: url(../img/common/header_icon.png) 0 0 no-repeat;
    width: 38px;
    height:25px;
    display:inline-block;
  vertical-align: bottom;
    position:relative;
}
#header .nav-tools li.news a .icon{background-position:0 0;}
#header .nav-tools li.history a .icon{background-position:-38px 0;}
#header .nav-tools li.cart{ display: none; }

/* btn-close */
#header .btn-close{ 
    background: none;
    border: none;
    width: 10%;
    margin: 0 auto;
    padding: 5%;
    display:block;
    position: relative;
    margin-bottom: 6%;
}
#header .btn-close img{ display:none;}
#header .btn-close:before,
#header .btn-close:after{
    content:"";
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    background: #333;
    left: 0;
    top:  50%;
}
#header .btn-close:before{
    -webkit-transform: rotate(45deg);
         -moz-transform: rotate(45deg);
                    transform: rotate(45deg);
}
#header .btn-close:after{
    -webkit-transform: rotate(-45deg);
         -moz-transform: rotate(-45deg);
                    transform: rotate(-45deg);
}

/* mypagePanel */
#header #mypagePanel{
    padding: 0 3.125%;
}
#header #mypagePanel li{
    float:left;
    width: 49.4%;
    margin:0.3%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    background-color: #fff;
    padding:1em 0;
}
#header #mypagePanel li a{
    display: block;
    box-sizing: border-box;
    text-align: center;
    background: url(../img/sp/header_arrow.png) 92% center no-repeat;
    background-size: 10px auto;
    padding-right: 10%;
}
#header #mypagePanel li.logout{
    width: 99.4%;
}
#header #mypagePanel li.logout a{
    padding:0 0.4em;
    background: #fff url(../img/sp/header_arrow.png) 96% center no-repeat;
    background-size: 10px auto;
    padding-right: 5%;
}

/* newsPanel */
#header .cover{
    position:fixed;
    width: 100%;
    height: 100%;
    left: 0; top: 0;
    display:none;
    z-index: 300;
    background: #666;
}
#header #newsPanel{
    display: none;
    position: absolute;
    left: 0; top: 0;
    width: 100%; 
    z-index: 301;
    background:#666;
    padding-bottom: 1px;
}
#header #newsPanel.show{ display: block; }
#header #newsPanel ul{ box-sizing: border-box; padding: 5%; }
#header #newsPanel li{ text-align: left; border-bottom:#949494 solid 1px; font-size: 12px; padding-bottom:1.5em; }
#header #newsPanel .ttl{ padding: 2em 0;}
#header #newsPanel .ttl > a{ color: #fff; font-weight: bold; font-size: 14px; }
#header #newsPanel .data{ padding-bottom: 10px;}
#header #newsPanel .infomation{ }

#header #newsPanel .data,
#header #newsPanel .infomation{ color: #ccc; }
#header #newsPanel .btn-close:before,
#header #newsPanel .btn-close:after{background: #FFF;}


/* cartPanel */
#header #cartPanel{
    display: none;
    position: fixed;
    left: 0; top: 0;
    width: 100%; 
    z-index: 301;
    background:#FFF;
    padding-bottom: 1px;
}
#header #cartPanel.show{ display: block; }
#header #cartPanel.bind-scroll{
    top:0 !important; 
    box-shadow:0px 0px 9px 4px #CCC;
    -moz-box-shadow:0px 0px 9px 4px #CCC;
    -webkit-box-shadow:0px 0px 9px 4px #CCC;
}
#header #cartPanel .inner{ padding:30px 20px;}
#header #cartPanel .frame{ max-height: 200px; overflow-y:auto; -webkit-overflow-scrolling: touch; border-bottom:#949494 solid 1px;}
#header #cartPanel .frame > ul{ box-sizing:border-box; padding: 0;}
#header #cartPanel .frame > ul > li{ text-align: left; border-top:#949494 solid 1px; font-size: 12px; padding: 10px 5px; position:relative; }
#header #cartPanel .frame > ul > li:first-child{ border-top: none; }
#header #cartPanel .frame > ul > li>div{ position:relative;padding-left: 90px;box-sizing:border-box; min-height:80px;}
#header #cartPanel .frame .ttl{font-size: 14px; font-weight: normal; padding:0;}
#header #cartPanel .frame .photo{ position: absolute;left: 0;top: 0; max-width:80px;max-height:80px;}
#header #cartPanel .frame .photo img{ height: auto; width: auto; max-height:100%; max-width:100%;}
#header #cartPanel .frame .limitedList{padding: 0 0 20px 0;}
#header #cartPanel .frame .limitedList li{font-size: 12px;color: #df2c52; padding: 0 0 2px 0;}
#header #cartPanel .frame .subtotal{ text-align: right; font-size: 14px; position: absolute;bottom: 0;right: 0;}
#header #cartPanel .frame .subtotal .button {padding:2px 10px 2px 9px;font-size: 12px;margin: 0px 17px 0 0;display: inline-block; line-height:1.2; height:auto; width:60px; background:#E4E4E4; }
#header #cartPanel .total{ text-align: right; margin: 15px 0; font-size: 14px;}
#header #cartPanel .total span{color: #df2c52; font-size: 16px; font-weight: bold;}



/* loginPanel */
#header #loginRegistPanel{
    display:none;
    position: absolute;
    left: 3.4%; top: 8.8%;
    box-sizing: border-box;
    width: 93.2%; 
    z-index: 301;
    background:#e7e7e7;
    padding-bottom: 1px;
    font-size: 12px;
}
#header #loginRegistPanel.show{
    display:block;
}
#header #loginPanel,
#header #registerPanel{
    position:relative;
    text-align: center;
    padding: 8% 0;
}
#header #loginPanel{
    border-bottom: #ccc solid 1px;
}
#header #registerPanel{
}
#header #loginPanel p,
#header #registerPanel p{
    width: 90%; 
    margin: 0 auto;
    box-sizing: border-box;
}
#header #loginPanel:before,
#header #registerPanel:before{
    content:none;
}
#header #loginPanel .inner,
#header #registerPanel .inner{
    position:relative;
}
#header #loginPanel a,
#header #registerPanel a{
    color: #df4363;
    text-decoration: underline;
}
#loginPanel h4,
#registerPanel h4{
    color:#df4363;
    font-size: 16px;
    font-weight: normal;
    padding-bottom: 6%;
}
#header #loginPanel .option{
    padding-top: 4%;
    color:#000000;
}
#header #loginPanel .option input[type=checkbox]{
    vertical-align: middle;
    display: inline-block;
    margin-top: -1px;
}

#header input.text{
    padding: 0.8em;
    width: 100%;
    box-sizing: border-box;
    margin: 5px auto;
    border: none;
    font-size: 16px;
    border-radius: 0;
}

/* ログアウト */
#header .nav-tools li.member{ display: none;}
#header #mypagePanel{ display: none; }

/* ログイン */
#header.login .nav-tools li.login{display: none;}
#header.login .nav-tools li.member{display: block;}
#header.login #mypagePanel{display: block;}




/* .g-navi */
#header .nav-global{
    padding: 3.125%;
}
#header .nav-global > ul > li{
    width: 99.4%;
    margin:0.3%;
    background: #d7d7d7 url(../img/sp/header_arrow.png) 96% center no-repeat;
    background-size: 10px auto;
    padding-right: 5%;
    box-sizing: border-box;
}

#header .nav-global > ul > li > a{
    font-size: 14px;
    font-weight: bold;
    display: block;
    padding:1em 0;
    text-align: center;
}
#header .nav-global li.m-search > a{ display: none; }
#header .nav-global li.m-search{ 
    background: #d7d7d7;
    padding: 2.5%;
}



/* 20170501 */
body #header .tickerArea{
	width: 100%;
	background-color: #b63e3d;
}
body #header .tickerArea .bx-wrapper{
	width: 100%;
	margin: 0 auto;
}
body #header .tickerArea .ticker .item{
	font-size: 14px;
	color: #c49a63;
	font-weight: bold;
	text-align: center;
	padding: 5px 10px;
	display: block;
}
/* 20170501 */



/* -----------------------------------
    footer
----------------------------------- */
#footer{
    background: url(../img/sp/bg_dot.png) center top repeat;
    background-size: 30% auto;
    text-align: left;
}
#footer a{
    color:#000;
    text-decoration:none;
}
#footer .pagetopButton{
    border-top: #cfcfcf solid 1px;
    border-bottom: #cfcfcf solid 1px;
}
#footer .pagetopButton a{
    padding: 10% 0;
    text-indent:-9999px;
    width: 100%;
    display: block;
    font-size: 10px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    background: #f1f1f1 url(../img/sp/footer_pagetop.png) center center no-repeat;
    background-size: 17% auto;
}
#footer .container{
    max-width: 1021px;
    width: 100%;
    margin: 0 auto;
}
#footer .footerTags {
    padding: 6% 0 0 0;
}
#footer .footerTags ul{
    float:left;
}
#footer .footerTags ul:nth-child(1){
    width: 35%;
    padding-left: 7.8125%;
    box-sizing:border-box;
}
#footer .footerTags ul:nth-child(2){
    width: 42%;
    padding-left: 4%;
    box-sizing:border-box;
}
#footer .footerTags ul:nth-child(3){
    width: 23%;
}
#footer .footerTags li a{
    display: block;
    padding: 0.3em 0;
    font-size: 13px;
}
#footer .searchBoxHolder{
    width: 84.375%;
    padding: 6% 0 8%;
}
#footer .footerNav{
    width: 84.375%;
    margin: 0 auto;
    border-top: #cfcfcf solid 1px;
    padding: 6% 0;
}
#footer .footerNav li{
    font-size: 12px;
    padding: 0.5em 0;
}
#footer .copyright{
    font-size: 10px;
    font-weight: bold;
    font-family:Arial, Helvetica, sans-serif;
    border-top:#cfcfcf solid 1px;
    line-height: 1;
    padding: 6%;
    text-align: center;
}



/* -----------------------------------
    検索ボックス
----------------------------------- */
.searchBoxHolder{
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}
.searchBoxHolder form{
    display: block;
    position: relative;
}
.searchBoxHolder .searchBox{
    border:none;
    box-sizing:border-box;
    width: 100%;
    padding:0.5em 1.8em 0.5em 0.5em;
    height: 2.2em;
    font-size: 16px;
    background: #FFF url(../img/sp/icon_search.png) 97% center no-repeat;
    background-size: 1em;
    text-align: center;
}
.searchBoxHolder .btn-submit{
    opacity:0;
    width: 2.5em;
    height: 100%;
    position:absolute;
    top: 0;
    right: 0;
    cursor:pointer;
    z-index:1;
}
.searchBoxHolder .searchList{
    display: none;
    width: 100%;
}
.searchBoxHolder .searchList.show{
    display: block;
    margin-top: 1px;
}
.searchBoxHolder .searchList li{
    margin-bottom: 1px;
    background-color: #fff;
}
.searchBoxHolder .searchList li a{
    width: 100%;
    text-align: left;
    box-sizing: border-box;
    display: block;
    padding:0.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}



/* -----------------------------------
    section
----------------------------------- */
.messageSection {
    padding: 30px 0;
    font-weight: bold;
    text-align: center;
}
.messageSection p {
    margin-bottom: 1em;
}


/* -----------------------------------
    pagination
----------------------------------- */
#history #contents ul.pagination {
    margin: 25px 0 0;
    text-align: center;
    font-size: 115%;
}
#history #contents ul.pagination li {
    overflow: hidden;
    display: inline-block;
    margin: 0 2px;
}
#history #contents ul.pagination li a {
    display: inline-block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    padding: 0;
    text-decoration: none;

    border: none;
    background: #e7e7e7;
    color: #333;
    font-weight: bold;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    behavior: url('assets/js/PIE.htc');
}
#history #contents ul.pagination li a:hover {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}
#history #contents ul.pagination li.current a {
    border: none !important;
    background-color: #df2c52;
    color: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#df2c52), to(#b42342));
    background: -moz-linear-gradient(top, #df2c52, #b42342);
    background: linear-gradient(to bottom, #df2c52, #b42342);
    -pie-background: linear-gradient(top, #df2c52, #b42342);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#df2c52', endColorstr='#b42342', GradientType=0)";
}
#history #contents ul.pagination li.nav a {
    text-indent: 300px;
}
#history #contents ul.pagination li.prev a {
    background: url(../img/common/btn_arrow_left.png) center center no-repeat;
}
#history #contents ul.pagination li.next a {
    background: url(../img/common/btn_arrow_right.png) center center no-repeat;
}

/* 修正0024 ここから */
.fb-page-parent > .fb-page {
    width: 300px;
}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
  width: 100% !important;
}
/* 修正0024 ここまで */

/* 修正0058 */

/* -----------------------------------
    special
----------------------------------- */

#specialHeader {
    position: relative;
    /* margin: 70px -10px -40px -10px; */ /* 修正0059 */
    padding: 10px;
    background: #fff;
    line-height: 1.4;
    font-size: 12px;    /* 修正0060 */
}
#specialHeader .visualColumn {
    display: none;
}
#specialHeader .title .logo {
    text-align: center;
}
#specialHeader .title .logo img {
    width: 60%;
    height: auto;
}
#specialHeader .title h1 {
    margin: 10px 0 15px 0;
    font-size: 150%;
    font-weight: bold;
    line-height: 1.3;
}
#specialHeader .title h1 span {
    font-size: 80%;
}
#specialHeader dl.benefit {
    padding: 15px 0;
    border-top: solid 3px #ccc;
}
#specialHeader dl.benefit dt {
    color: #ff4165;
    font-size: 150%;
    font-weight: bold;
    line-height: 1.3;
}
#specialHeader dl.benefit dd ul li {
    margin-top: 10px;
    padding-left: 1.2em;
    background: url(../../img/common/icn_circle_pnk.png) 1px 0.35em no-repeat;
    background-size: 7px;
}
#specialHeader dl.benefit dd ul li br {
    display: none;
}
#specialHeader .cautions {
    padding: 15px 0;
    border-top: solid 3px #ccc;
}
#specialHeader .cautions dl dt span {
    padding: 5px 0 5px 25px;
    background: url(../../img/common/icn_alert_l.png) left center no-repeat;
    background-size: 17px;
    color: #ff0000;
    font-size: 143%;
    font-weight: bold;
}
#specialHeader .cautions dl dd ul li {
    margin: 8px 0;
    padding-left: 1.2em;
    background: url(../../img/common/icn_circle_gry.png) 2px 0.4em no-repeat;
    background-size: 6px;
}
#specialHeader .spCopyright {
    color: #666;
    font-size: 84%;
}

/* 修正0061 ここから */
#specialHeader .button-l {
    width: 220px;
}
/* 修正0061 ここまで */

/* 修正0062 ここから */
/* 会社概要
----------------------------------------------------*/

/* 修正0052 ここから */
.companyInner {
    background-color:#fff;
    padding:5px 10px;
}
/* 修正0052 ここまで */

.companyTitle {
    overflow:hidden;
    margin:10px -5px;
    padding:5px 10px;
    /* 修正0052 ここから */
    /* background:#f3f3f3; */
    /* 修正0052 ここまで */
}

.companyTitle h1 {
    float:left;
    font-size:134%;
}

.companyTitle p {
    float:right;
    padding-top:3px;
}
.companyInfo {
    overflow:hidden;
    padding:10px 0 5px;
    border-bottom:1px dotted #ccc;
}

.companyInfo dt {
    clear:both;
    float:left;
    width:25%;
    font-weight:bold;
}

.companyInfo dd {
    float:left;
    width:75%;
}

.lastInfo {
    padding-bottom:30px;
    border-bottom:none;
}

.executiveList {
    overflow:hidden;
    padding-top:5px;
}

.executiveList dt {
    clear:both;
    float:left;
    width:50%;
    padding-bottom:5px;
}

.executiveList dd {
    float:left;
    width:50%;
    padding-bottom:5px;
}

/* .greetingTitle, */
.historyTitle {
    margin: 0 -5px;
    padding:5px 10px;
    font-size:126%;
    background:#F3F3F3;
}

.greetingTitle{
    margin: 0 -5px;
    padding:5px 10px;
    font-size:126%;
    /* 修正0052 ここから */
    /* background:#F3F3F3; */
    /* 修正0052 ここまで */
}

.greetingSubtitle {
    padding: 15px 0;
    font-size:115%;
}

.greetingText {
    padding:0 0 20px;
    line-height:1.7em;
}

.historyList {
    padding:20px 0;
    color:#333333;
}

.historyList li {
    overflow:hidden;
    padding:10px 0 5px;
    border-bottom:1px dotted #ccc;
}

.historyList li h3 {
    float:left;
    width:30%;
    font-size:100%;
}

.historyList li p {
    float:left;
    width:70%;
    line-height:1.5em;
}

.historyList .lastElem {
    border-bottom:none;
}



/* 配送料と支払い方法
----------------------------------------------------*/

/* 修正0052 ここから */
.howInner {
    background-color:#fff;
    padding:15px 20px;
}
/* 修正0052 ここまで */

.howTitle {
    overflow:hidden;
    margin: 0 -5px;
    padding:5px 10px;
    background:#f3f3f3;
}

.howTitle h1 {
    float:left;
    font-size:129%;
}

.howTitle p {
    float:right;
    padding-top:3px;
}

.howtoText {
    padding:20px 0 10px;
    line-height:1.5em;
}

.howtoText2 {
    padding:0 0 20px;
    line-height:1.5em;
}

.howtoText3 {
    padding:10px 0 20px;
    line-height:1.5em;
}

.howtoText span {
    font-size:84%;
}

.caseTitle {
    padding:0 0;
    margin-left:1.0em;
    text-indent:-1.0em;
}

.caseTitle span {
    padding-left:10px;
    border-left:4px solid #000;
}

.chargeList {
    margin-top:15px;
}

.chargeList li {
    overflow:hidden;
    padding: 5px 0;
    text-align:left;
    border-bottom:1px dotted #ccc;
}

.chargeList li.firstElem {
    border-top:1px dotted #ccc;
}

.chargeList h3 {
    clear:both;
    float:left;
    width:45%;
}

.chargeList p {
    float:left;
    width:55%;
}

.txtChargeAttent {
    margin: 10px 0 20px 0;
    padding-left: 1em;
    text-indent: -1em;
    font-size: 84%;
}

/* プライバシーポリシー
----------------------------------------------------*/

/* 修正0052 ここから */
.privacyInner {
    background-color:#fff;
    padding:15px 20px;
}
/* 修正0052 ここまで */

.pricacyLink{
    margin:20px 0;
    text-align: right;

}

.privacyTitle {
    margin: 0 -5px;
    padding:5px 10px;
    background:#f3f3f3;
    font-size:129%;
    line-height: 1.3;
}

.privacyTitle span {
    font-size:79%;
}

.dateList {
    padding:8px 0 15px;
    font-size:86%;
    line-height:1.6em;
    text-align:right;
}

.privacyText {
    padding-bottom:20px;
    line-height:1.5em;
}

.privacyText2 {
    padding-bottom:10px;
    line-height:1.5em;
}

.privacyText3 {
    padding-bottom:20px;
    font-size:84%;
}

.privacyList {
    padding:10px 0 30px;
}

.privacyList dt {
    padding-bottom:5px;
    font-weight:bold;
}

.privacyList dd {
    padding-bottom:15px;
    line-height:1.5em;
}
/* プライバシーポリシー　法的開示
----------------------------------------------------*/

#privacy .list_level1{
margin-left: 40px;
}

#privacy .list_level2{
margin-left: 80px;
}

#privacy .head-caption{
    text-align: center;
}
#privacy h3,
#privacy h4{
    margin-top: 20px;
}
#privacy .list_level1,
#privacy .list_level2{
margin-bottom: 10px;
}

#privacy .contact{
border: solid #ccc 1px;
    margin: 10px 0 ;
    padding: 15px;
}

#privacy .text-right{
    text-align: right;
}
/* 開示等請求の手続きについて
----------------------------------------------------*/


#privacy table.box {
    border-left: 1px solid #AFAFAF;
    border-top: 1px solid #AFAFAF;
    margin: 10px 0 10px 20px;
    width: 240px;
}

#privacy table.box td {
    border-bottom: 1px solid #AFAFAF;
    border-right: 1px solid #AFAFAF;
    padding: 10px;
    text-align: center;
}



/* 特定商取引法に基づく表示
----------------------------------------------------*/

#asct h1.basicTitle {
    overflow:hidden;
    margin: 0 -5px 20px -5px;
    padding:5px 10px;
    background:#f3f3f3;
    border-left: none;
}

#asct h2 {
    margin-bottom: 10px;
}
#asct h2 span {
    padding-left:10px;
    border-left:4px solid #000;
}

#asct .second{
    margin-top: 30px;
}

#asct dl {
    margin-bottom: 10px;
    padding:0 0 10px 0;
    border-bottom:1px dotted #ccc;
}
#asct dl dt {
    margin-bottom: 2px;
    font-weight:bold;
}
#asct dl dt br {
    display: none;
}

#asct .priceTable {
    margin-top:10px;
}

/* 修正0062 ここまで */

/* 修正0064 */
.paddEdit a:link,
.paddEdit a:visited,
.paddEdit a:hover,
.paddEdit a:active {
    color: #000;
}