@charset "shift_jis";
/* CSS Document */
*{ list-style:none; margin:0; padding:0;}
a{ text-decoration:none;}
a img{ border:none;}
/*PC*/

/*▽基本CSS*/
a{ text-decoration:none;}
a img{ border:none;}
#wrap2 p{ margin: none !important;}

#wrap2{ max-width:750px; margin:0 auto;  overflow: hidden; background-color: #011039; color: white;}
#wrap2 section a:hover{ opacity:0.2;  background-image:url("../IMAGE/petwinter2021/ac_link.jpg"); }

/*-----------------------------看板-----------------------------------*/
/*アンカー*/
#wrap2 div#kanban{ position: relative; }
#wrap2 div#kanban ul { position: absolute; top: 72%; padding: 0; left: 10%; right:10%;}
#wrap2 div#kanban ul li{ float: left; width: 33%;}


    
/*-----------------------------アイテムブロック section-----------------------------------*/

#wrap2 section{  width:100%; position: relative;}
#wrap2 section ul{ padding: 0 5%; overflow: hidden;}
#wrap2 section li.item{ clear: both; overflow: hidden; margin: 0 0 5%;}


/*テキスト*/
#wrap2 section h5{text-align: center; font-size: 0.9em;font-weight: normal; margin-top:1.5%}

/*商品名*/
#wrap2 section li.item dt{ color: #ffffff; font-weight: bold;font-family: "M PLUS 1p"; text-align: center;font-size: 1.3em; background-color:#a86900; padding: 0.2%;border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius; overflow: hidden; background-image: url("../IMAGE/petwinter2021/ac_textback.jpg"); }
#wrap2 section h4{ text-align: center;border-bottom: 2px solid gray; overflow: hidden; position: relative; font-size: 1.1em; clear: both; }

/*サイズ部分*/
#wrap2 section ul li.item dd.size{text-align: center;border-bottom: 1px dotted gray; overflow: hidden; position: relative;}
#wrap2 section ul li.item dd.size span{ border: 1px solid white; padding: 1%; margin: 1%;text-align: center; float: left; font-size: 1.1em;
    border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius: 10px; width: auto; min-width: 20%;}
#wrap2 section ul li.item dd.size div{ margin-top: 6px; }


/*三角つくるよ!*/
#wrap2 dd div.buy_price:after, #wrap2 section ul.clm2 li.item2 a dd.size div:after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    right: 2%;
    top: 30%;
    border: 3px solid transparent;
    border-left: 9px solid #ffcc31;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;}
#wrap2 section ul.clm2 li.item2 a dd.size div:after{ right: 0;}

/*----------ぶちぬき1カラム　clm0----------*/
#wrap2 section ul.clm0 dd.size{ padding: 1% 0; margin-bottom: 5%;}

#wrap2 section li.item dd.size_3{text-align: center;display: inline-block;font-size: 1.1em; width: 30%; margin: 1%; }
#wrap2 section li.item dd.size_3 span{  border: 1px solid white; padding: 1%; margin: 1%;text-align: center; float: left;
    border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius: 10px; width: 96%; }


/*----------横並びの1カラム　clm1----------*/
/*画像*/
#wrap2 section ul.clm1 dd:nth-of-type(1){ width: 50%; float: left; }
/*サイズ部分*/
#wrap2 section ul.clm1 dd.size{ float: right; width: 50%;padding: 0.5% 0;}


/*----------2カラム　clm2----------*/
#wrap2 section ul.clm2{
    clear: both;
    /*↓高さそろえるタグ*/
　display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;}

#wrap2 section ul.clm2 li.item {width: 46%; padding: 1%; }
#wrap2 section ul.clm2 li.item:nth-child(odd) { margin-right: 4%;}
/*画像*/
#wrap2 section ul.clm2 li.item dd:nth-of-type(1){ width: 100%; clear: both;}
/*サイズ部分*/
#wrap2 section ul.clm2 li.item dd.size{ clear: both;float: left; width: 100%; padding: 1% 0;}
#wrap2 section ul.clm2 li.item dd.size span{ width: 20%; }

#wrap2 section ul.clm2 li.item2 a { position: relative; text-indent: 0;}
#wrap2 section ul.clm2 li.item2 a:hover dd.size{ background-image:url("../IMAGE/petwinter2021/ac_link.jpg"); }
#wrap2 section ul.clm2 li.item2 dd div.buy_price:after{ display: none;}

/*-----------------------------価格-----------------------------------*/
/*販売価格*/#wrap2 dd div.buy_price{ position: relative;  text-align: center;}
/*販売価格*/#wrap2 dd div.buy_price li{ display: inline-block;}
/*販売価格*/#wrap2 dd div.buy_price li.price{color:#ffffff; }
/*販売価格文字*/#wrap2 dd div.buy_price li.price span.spesicalprice{ display: none;}
/*税抜き*/#wrap2 dd div.buy_price li.intax{ font-size: 0.8em;}

/*〜を無理やりつける*/
#wrap2 dd.kara li.intax::after{	content:"〜"; }

/*-----------------------------リンク範囲指定-----------------------------------*/

#wrap2 section li.item dd.size,
#wrap2 section li.item dd.size_3,
#wrap2 section li.item
{position: relative; overflow: hidden;}


#wrap2 section li.item dd.size a,
#wrap2 section li.item dd.size_3 a,
#wrap2 section li.item a
{ border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius: 10px;
position: absolute; width: 100%; height: 100%; top:0; left: 0;text-indent: 100%; white-space: nowrap;overflow: hidden;}

/*-----------------------------装飾-----------------------------------*/
#wrap2 p.bottomimg { margin-bottom: 20%;}
#wrap2 #topback{ position: fixed; bottom: 0; right: 0;}