@charset "utf-8";

/* base */

.bcenter {
    text-align: center;
}

.bpad10 {
    padding: 10px;
}

.bpad20 {
    padding: 20px;
}


/* font */

.bfont_small {
    font-size: small;
}

.bfont_medium {
    font-size: medium;
}

.bfont_large {
    font-size: large;
}

.bpickup {
    font-weight: bold;
    color: #ff4500;
    
}

.bbong {
    color: #DE5D50;
    font-weight: bold;
    
}

.bbong2 {
    color: #000000;
    font-weight: bold;
    border-bottom: solid 2px #000000;
}

/* topページ装飾用ここから */

.specialoffer_h {
    color: #fff;
    font-weight:bold;
    position: relative;
    padding: 10px;
    background: #ff1493;
    margin-right:20px;
}

.specialoffer_h:before {
    content: " ";
    position: absolute;
    top: 100%;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 0;
    border-color: transparent;
    border-right-color: #8b0000;
}

.seasonoffer_h {
    color: #fff;
    font-weight:bold;
    position: relative;
    padding: 10px;
    background: #483d8b;
    margin-right:20px;
}
.seasonoffer_h:before {
    content: " ";
    position: absolute;
    top: 100%;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 0;
    border-color: transparent;
    border-right-color: #6a5acd;
}

.blockmargin{
    margin-top: 30px;
    margin-bottom: 30px;
}

.mcenter{
    text-align: center;
}

.makerbanner{
    max-width: 270px;
    margin: 2px;
    border: 1px #444 solid;
}

/* topページ装飾用ここまで */

/* 商品詳細ページ装飾用ここから */

.dmf_bold{
    font-weight: bold;
}

.dmf_small{
    font-size: small;
}

.dmf_bold2{
    color: #DE5D50;
    font-weight: bold;
    margin-left: 10px;
}

.dmf_nomal2{
    margin-left: 10px;
}

.dmf_bold_large{
    font-weight:bold;
    font-size: large;
}

.dmf_maker1{
    font-weight: bold;
    font-size: large;
    background: linear-gradient(transparent 80%, #fff799 0%) ;
}

.dmf_st1{
    color: #DE5D50;
    font-size: large;
    font-weight: bold;
    line-height: 150%;
    
}

.dmf_box1{
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #000000;
    background: #FFFFFF;
    border: solid 3px #6091d3;
    border-radius: 10px;
}
.dmf_box1 p{
    margin: 0; 
    padding: 0;
}

.dmf_block_ref{
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #232323;
    background: #fff8e8;
    border-left: solid 10px #5CB1B1;
}

.dmf_block_ref p{
    margin: 0; 
    padding: 0;
}

.dmfhr {
   border-bottom: 1px dashed #666666;
}


.alrt_r {
    border: 2px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 2em;
    position: relative;
}
.alrt_r::before {
    background-color: #fff;
    color: #da4033;
    content: "ご注意";
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}

/* 商品詳細ページ装飾用ここまで */


/* 特集ブロック装飾用ここから */

.tokcen {
    text-align: center;
}

.tokpick {
    font-weight: bold;
    font-size: small;
    color: #DF013A;
}


.toktopban {
    border: 1px #ffffff solid;
    width: 30%;
    height: 30%;
    box-sizing: border-box;
}




/* button */

.topicate_btn {
  position: relative;
  display: inline-block;
  padding: 1em 3em;
  text-decoration: none;
  border-radius: 4px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
}

.topicate_btn:active {
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

.btncolor_orange {
  background: #fd9535;/*背景色*/
  border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/
}

.topicate2_btn {
  position: relative;
  display: inline-block;
  padding: 0.5em 1.5em;
  text-decoration: none;
  border-radius: 4px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
}

.topicate_btn:active {
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

.btncolor_red {
  background: #EC407A;/*背景色*/
  border-bottom: solid 2px #A52C55;/*少し濃い目の色に*/
}

.btn-animation-02 {
  display: inline-block;
  width: 200px;
  text-align: center;
  background-color: #4a488e;
  border: 2px solid #4a488e;
  font-size: 16px;
  color: #4a488e;
  text-decoration: none;
  font-weight: bold;
  padding: 10px 24px;
  border-radius: 4px;
  position: relative;
  margin: 2px 0px;
}

.btn-animation-02 span {
  position: relative;
  z-index: 1;
}

.btn-animation-02::before,
.btn-animation-02::after {
  content: "";
  display: block;
  background-color: #FFF;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-02::before {
  left: 0;
}
.btn-animation-02::after {
  right: 0;
}

.btn-animation-02:hover:before,
.btn-animation-02:hover:after {
  width: 0;
  background-color: #FFF;
}

.btn-animation-02:hover {
  color: #FFF;
}

.teibanb {
  display: inline-block;
  width: 200px;
  text-align: center;
  background-color: #9ec34b;
  border: 2px solid #9ec34b;
  font-size: 16px;
  color: #9ec34b;
  text-decoration: none;
  font-weight: bold;
  padding: 10px 24px;
  border-radius: 4px;
  position: relative;
}

.teibanb span {
  position: relative;
  z-index: 1;
}

.teibanb::before,
.teibanb::after {
  content: "";
  display: block;
  background-color: #FFF;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.teibanb::before {
  left: 0;
}
.teibanb::after {
  right: 0;
}

.teibanb:hover:before,
.teibanb:hover:after {
  width: 0;
  background-color: #FFF;
}

.teibanb:hover {
  color: #FFF;
}

/* linkcolor */

.linkcolor_white {
    color: #FFFFFF;

}

.linkcolor_white a {
    color: #FFFFFF;

}

.linkcolor_white:hover {
    color:#666666;

}

.sybox_w {
    padding: 1em 1.5em;
    margin: 2em 0;
    background-color:#fff;/*背景色*/
    border-left: solid 10px #7a7a7a;/*左ライン*/
    color:#000000;/*文字色*/
}
.sybox_w p {
    margin: 0; 
    padding: 0;
}

/* 特集 */

.topiczen {
    margin: 2em auto;
    padding: 1em;
    width: 90%;
    color: #666666;
    background-color: #f7f7f7;
    border: 1px solid #cccccc;
    box-sizing: border-box;
    
}

.tomida {
    border: 2px #444444 solid;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

.tocen {
    text-align: center;
    font-size: x-large;
}

.busertobor{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px #fff;
    border-bottom: solid 2px #fff;
}
.tobor:before, .tobor:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: #fff;
    
}
.tobor:before {left: 10px;}
.tobor:after {right: 10px;}
.tobor p {
    margin: 1em; 
    padding: 0;
    
}

.tobor{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px #F4F1ED;
    border-bottom: solid 2px #F4F1ED;
}
.tobor:before, .tobor:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: #F4F1ED;
    
}
.tobor:before {left: 10px;}
.tobor:after {right: 10px;}
.tobor p {
    margin: 1em; 
    padding: 0;
    
}

.busertopictitle {
  position: relative;
  box-shadow: 0px 0px 0px 5px #00a497;
  background: #00a497;
  border: dashed 2px white;
  padding: 0em 0em;
  color: #ffffff;
  
}

.topictitle {
  position: relative;
  box-shadow: 0px 0px 0px 5px #987654;
  background: #987654;
  border: dashed 2px white;
  padding: 0em 0em;
  color: #ffffff;
  
}

.bcomment {
    padding: 20px;
    margin: 0px 20px;
    background-color:#EAE3DC;
    
}

.pickupimg {
    border: 1px #444444 dashed;
    width: 22%;
    height: 22%;
    min-width: 150px;
    min-height: 150px;
    box-sizing: border-box;
    
}

.buserimg {
    border: 1px #444444 solid;
    width: 22%;
    height: 22%;
    min-width: 150px;
    min-height: 150px;
    box-sizing: border-box;
    
}

/* 定番ブロック */

.iyteiot {
    text-align: right;
    font-weight: bold;
    color: 3374b5;
}

/* 新着商品ブロック */

.newbun {
    font-size: small;
}


/* 会員向け定番 */

.utedv {
 position: relative;
 margin: 2em auto;
 padding: 1.2em;
 width: 90%;
 color: #555555; /* 文字色 */
 background-color: #fff;
 border: 2px solid #4a488e; /* 枠線の太さ・色 */
 box-shadow: 2px 2px 1px #ccc;/* 影の色 */

}
.utedv_title {
 position: absolute;
 padding: 0 .5em;
 left: 20px;
 top: -15px;
 font-weight: bold;
 background-color: #fff; /* タイトル背景色 */
 color: #4a488e; /* タイトル文字色 */
}

.uteinbox {
    display: inline-block;
    width: 25%;
    margin: 1em;
    min-width: 150px;
    min-height: 150px;
    letter-spacing: -0.4em;

}

.uteinbox p{
    letter-spacing: normal;
}

.uteimg {
    border: 1px #444444 solid;
    box-sizing: border-box;
    
}

.utecomm {
    text-align: left;
    font-size: medium;
    color: #666666;
}


.catiwak {
 margin: 2em auto;
 padding: 1em;
 background-color: #fff; /* 背景色 */
 border: 1px solid #ccc; /* 枠線 */
}

#footer ul.footer_nav {
    display: block;
}
#footer ul.footer_nav li {
    display: inline-block;
    margin: 0 0 0.8em 0;
}
#footer ul.footer_nav li:after {
    content: '|';
    margin: 0.7em;
}
#footer ul.footer_nav li:last-child:after {
    content: '';
}


.search {
    background: none;
    padding: 0;
}


/* RSSニュースフィード */

.rsstc   { font-size: 12px; background-color: #ffffff; margin: 0; padding: 0 }
.rsstc a { color: #666666;}
.rsstc em  { color: #000000; font-style: normal; font-weight: bold; margin-left: 10px; padding: 0 }
.rsstc ul   { background-color: #ffffff; margin: 0; padding: 0 ;border: solid 2px #ffffff }
.rsstc li   { list-style-type: none; padding-top: 1px; padding-bottom: 1px; padding-left: 5px; border-bottom: 1px dashed #ffffff }
.rsstc li:last-child   { border-bottom: none; }

/* 要同意書が含まれる商品があるときの注意 */
.alert-agreement-form {
    margin-bottom: 6px;
    margin-left: 12px;
    background-color: lightyellow;
    border-radius: 3px;
    padding: 6px;
    font-weight: bold;
}


/* 商品説明見出し */
.minth2 {
    border-top: 2px solid #00b4c8;
    border-left: 4px solid #00b4c8;
    border-bottom: 1px solid #b2e8ee;
    border-right: 1px solid #b2e8ee;
    font-size: 1.8rem;
    padding: 1.5rem 0 1.2rem 1.0rem;
}
.minth3 {
    font-size: 1.6rem;
    font-weight: bold;
    border-bottom: 2px dotted #00b4c8;
    padding-left: 10px;
}