﻿/* ===============================================
    PBM
   =============================================== */
.pbm {
  min-width: 900px;
  margin: 0 auto;
  padding: 0;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", sans-serif;
	color: #660000;
}

.pbm-rules { width:800px; margin: 10px auto 0; text-align:left; color:#6d2a05;}
.pbm-rules dt { width:180px; float:left;margin-bottom:1em; clear:both; text-align:right; font-weight:bold; color:#893000; }
.pbm-rules dd { width:600px; float:left; margin-top:0; margin-bottom:1em; margin-left:20px; font-size:12px; line-height:1.8; }
.pbm-rules .rules-point { color: #f53508; }


/* ===============================================
    LAYOUT
   =============================================== */

.clear {
	clear: both;
}
* {
	margin: 0;
	padding: 0;
}

p.indent-1 {
padding-left:1em;
text-indent:-1em;
}

.category {padding:15px 50px 10px 55px; text-align: left; clear: both;
}

/*------------------------------------------
【エピソードリスト】
--------------------------------------------*/
img.example {
width: 120px;
}

ul.pickup{
    margin:0 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
}
 
    ul.pickup li {
        margin:0 10px 10px 0;
        padding:10px;
        border:1px solid #c9c9c9;
        width:440px;
        list-style:none;
		background-color:#ffffcc;
		text-align: left;
    }

.pickup_text {
	font-size: 14px;
	line-height: 1.3em;
	}

.pickup_image {
	float: left;
	margin-right:1em;
	margin-bottom:1em;
}
.pickup_name {
    overflow: hidden;
	font-size: 11px;
	margin-bottom: 10px;
}
.pickup_summary {
    overflow: hidden;
	font-size: 14px;
}
.pink_heading {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
	color: #f45f9a;
}

.purple_heading {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
	color: #a96de8;
}

.green_heading {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
	color: #4cad4b;
}

.blue_heading {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
	color: #1dc1de;
}

/*トイレトレーニング*/
ul.training {
    margin:10px 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
    }
 
    ul.training li {
    margin:0 15px 15px 0;
    padding:15px;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 3px #ffbad8;
    border:3px solid #ffffff;
    width:430px;
    list-style:none;
    border-radius: 15px 15px;
    }

/*お着替え応援*/
ul.okigae {
    margin:10px 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
    }
 
    ul.okigae li {
    margin:0 15px 15px 0;
    padding:15px;
    background: #edeafe;
    box-shadow: 0px 0px 0px 3px #d6b6f8;
    border:3px solid #ffffff;
    width:430px;
    list-style:none;
    border-radius: 15px 15px;
    }

/*登園応援*/
ul.touen {
    margin:10px 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
    }
 
    ul.touen li {
    margin:0 15px 15px 0;
    padding:15px;
    background: #e7ffe6;
    box-shadow: 0px 0px 0px 3px #a4d9a3;
    border:3px solid #ffffff;
    width:430px;
    list-style:none;
    border-radius: 15px 15px;
    }

/*登園応援*/
ul.touen {
    margin:10px 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
    }
 
    ul.touen li {
    margin:0 15px 15px 0;
    padding:15px;
    background: #e7ffe6;
    box-shadow: 0px 0px 0px 3px #a4d9a3;
    border:3px solid #ffffff;
    width:430px;
    list-style:none;
    border-radius: 15px 15px;
    }

/*その他*/
ul.other {
    margin:10px 0 10px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:980px;
    }
 
    ul.other li {
    margin:0 15px 15px 0;
    padding:15px;
    background: #eaffff;
    box-shadow: 0px 0px 0px 3px #93d0db;
    border:3px solid #ffffff;
    width:430px;
    list-style:none;
    border-radius: 15px 15px;
    }



/*------------------------------------------
【商品一覧】
--------------------------------------------*/
.list {
    display: table;
    width: 95%;
}
.list_item {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.list_item a {
    display: block;
    padding: 5px 0;
}



/*================================================================
【きゃらふるインナー商品一覧用】
==================================================================*/

/*------------------------------------------
カテゴリメニュー
--------------------------------------------*/
#catMenu { margin: 0 0 20px 0; padding: 0 67px;}

/*タイトル*/
#catMenu div { padding: 20px 0;}

/*リスト*/
#catMenu ul { font-size: 0; line-height: 0; text-align: center;}
#catMenu ul li { display: inline-block; margin: 0 3px 5px 0; padding: 0; vertical-align: top;}
#catMenu ul li:nth-child(4n) { display: inline-block; margin: 0 0 5px 0; padding: 0; vertical-align: top;}


/*------------------------------------------
商品リスト
--------------------------------------------*/
/*各カテゴリ名称を定義だけしておく*/
#sentai {}
#rider {}
#splatoon {} 
#precure {}
#precureas {}
#lumitear {}

/*ヘッダー
--------------------------------------------*/
#sentai .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_sentai_02.png);background-position: center top; background-repeat: repeat-y;}
#rider .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_build_02.png);background-position: center top; background-repeat: repeat-y;}
#splatoon .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_splatoon_02.png);background-position: center top; background-repeat: repeat-y;}
#precure .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_precure_02.png);background-position: center top; background-repeat: repeat-y;}
#precureas .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_precure_as_02.png);background-position: center top; background-repeat: repeat-y;}
#lumitear .pdList {background: url(/bc/images/shop_top_apparel/20180330_charafulinner_list_lumitear_02.png);background-position: center top; background-repeat: repeat-y;}

/*ヘッダー（タイトル）とフッター（枠の閉じ）
--------------------------------------------*/
.catHead,
.catFoot { text-align: center;}

/*TOPに戻るボタン
--------------------------------------------*/
.catBack { padding: 5px 85px 0 0; position: relative; text-align: right; z-index: 10;}

/*リスト中身
--------------------------------------------*/
.pdList ul {font-size: 0; line-height: 0;	margin: 0 auto; padding: 0 75px 10px 75px; text-align:left; width:900px; -webkit-box-sizing:border-box; box-sizing:border-box;}
.pdList ul li { display: inline-block; margin:0 15px 0 0; padding: 20px 0 0 0; text-align:center; vertical-align: top; width:240px; -webkit-box-sizing:border-box; box-sizing:border-box;}
.pdList ul li:nth-child(3n) { display: inline-block; margin:0 0 0 0; padding: 20px 0 0 0; vertical-align: top; width:240px; -webkit-box-sizing:border-box; box-sizing:border-box;}

/*リンク*/
.pdList ul li a { text-decoration: none;}

/*基本の商品名*/
.pdList ul li span { display: block; font-size: 16px; line-height: 18px; margin: 10px 0 0 0; padding: 0;}

/*キャラ毎に商品名の色を変える*/
.pdList ul.item_sentai li span { color: #00a0e9;}
.pdList ul.item_rider li span { color: #ff3442;}
.pdList ul.item_splatoon li span { color: #29b06c;}
.pdList ul.item_precure li span { color: #e85298;}
.pdList ul.item_precureas li span { color: #ff53dd;}
.pdList ul.item_lumitear li span { color: #b77cff;}

/*値段と発売日（共通）*/
.pdList ul li span small { color: #6d2a05; display: block; font-size: 14px; line-height: 18px;}


/*------------------------------------------
ページ下部のお知らせ
--------------------------------------------*/
.pdInfo { margin: 40px 0 0 0; text-align: center;}

/*注記*/
.pdInfo span { color: #666666; display: block; font-size: 10px; line-height: 11px; margin: 20px 0 40px 0;}

/*コピーライト*/
.pdInfo span.copy { color: #666666; display: block; font-size: 10px; line-height: 11px; margin: 0;}

/*特設ページへボタン*/
.pdInfo .pdInfo_Btn { margin: 0 0 40px 0;}













