@charset "utf-8";
/* CSS Document */

.content_inner{padding-bottom: 6rem;}

/*---------------------------------------------------------------------
【検索結果】対象商品の件数
-----------------------------------------------------------------------*/
.result_alert {background: #f5f5f5; margin: 0 0 1.6rem 0; padding: 24px 0; text-align: center; width: 100%;}
.result_alert p { font-size: 1.4rem; font-weight: bold;}
.result_alert p span { color: #72767f; display: inline-block; font-size: 3.0rem; font-weight: bold; margin: 0 2%; vertical-align: sub;}

/*---------------------------------------------------------------------
【検索結果】大枠
-----------------------------------------------------------------------*/
.resultBox { padding: 0 15px;}

/*---------------------------------------------------------------------
【検索結果】商品絞り込み
-----------------------------------------------------------------------*/
/*大枠*/
.resultSort { margin: 0 0 2rem 0; -webkit-align-items: center; -ms-align-items: center; align-items: center;  -ms-flex-wrap: nowrap; flex-wrap: nowrap;}

/*赤い四角の商品絞り込み
--------------------------------------------*/
/*marginが大きいので調整*/
.resultSort ul { display: inline-flex; vertical-align: top; width: 70%; padding: 3rem .5rem !important;}
.resultSort ul.search_choose li { margin: 0 1% 0 0; padding: 0;}
.resultSort ul.search_choose li:last-child { margin: 0; padding: 0;}
.resultSort ul.search_choose li:nth-of-type(2) .custom_radio_chips > span {border-right: 1px solid #e67c7e; border-left: 1px solid #e67c7e; text-align: center;}
.resultSort ul.search_choose li .custom_radio_chips > span:after{display: none;}


/*件数と表示モード
--------------------------------------------*/
.resultSort_sub {display: inline-flex; vertical-align: top;}
.resultSort_sub ul { margin: 0; padding: 0; width: 100%; -webkit-align-items: center; -ms-align-items: center; align-items: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap;}/*1つめ：セレクトボックス*/
.resultSort_sub ul li:first-child { display: inline-block; margin: 0 16px 0 0; text-align: center; vertical-align: middle; width:78px;/* width: 41%; */}
/*2つめ：表示モード：画像*/
.resultSort_sub ul li { display: inline-block; margin: 0 10px 0 0; text-align: center; vertical-align: middle; width:calc(calc(100% - 90px) /2);}
/*3つ目：表示モード：リスト*/
.resultSort_sub ul li:nth-child(3n) {  margin: 0;}

/*アイコン下のテキスト*/
.resultSort_sub ul li span { display: block; font-size: 1.1rem; font-weight: bold; margin: 10px 0 0 0; padding: 0;}

/*セレクトボックス*/
.resultSort_sub ul li div select { background: #f5f5f5 url(/https/a-onstore.jp/bc/images/cmn/icon_resuletnum_arrow.png) 85% 45% no-repeat; background-size: 8px 17px; border: 1px solid #e3e3e3; border-radius: 5px; height: 38px; padding: 0 25px 0 15px; -webkit-appearance: none;	-moz-appearance: none;	appearance: none;  box-sizing:border-box;}


/*---------------------------------------------------------------------
【検索結果】商品リスト
-----------------------------------------------------------------------*/
.resultBox ul {}
.resultBox ul li.items {border-bottom: 2px solid #f5f5f5; position: relative; margin: 0 0 35px 0; padding: 0 0 35px 0; width: 100%;}


/*商品写真レイアウト*/
.resultBox ul li div.img_wrap { margin: 0 2% 0 0; vertical-align: top; width: 19.4%;}
/*.resultBox ul li div.item_img { margin: 0 2% 0 0; vertical-align: top; width: 19.4%;}*/
/*.resultBox ul li div.item_img img { height: auto; width: 100%; max-width: 190px;}*/

/*詳細レイアウト*/
.resultBox ul li .item_detail {/* display: inline-block; */ vertical-align: top; width:calc(100% - 21.4%); }
.resultBox ul li a.item_detail{display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;}
.resultBox ul li .item_detail p,
.resultBox ul li .item_detail .tocol1{margin-bottom: 1.6%;}
/*ボタンを下揃えにする都合でmargin-bottomを0に*/
.resultBox ul li .item_detail .tocol1 { margin: 0; -webkit-align-items: center; -ms-align-items: center; align-items: center; max-height: 50px;}

/*ボタンレイアウト*/
.resultBox ul li .item_detail_btn { display: inline-block; text-align: right; vertical-align: bottom; width: 24%; max-width: 100%;}
/*.resultBox ul li .item_detail_btn.btn_col{position: absolute; bottom: 35px; right: 0;}*/


/*タグの再調整*/
.resultBox ul li .tag { width: 100%;}
.resultBox ul li .tag span { margin:0 1% 0 0; width: 15%;}
.resultBox ul li .tag span:last-child { margin:0;}

/*商品名*/
.resultBox ul li .img_wrap .item_img{margin-bottom: 0;} 

.resultBox ul li .item_detail .item_name {font-size: 1.5rem; font-weight: bold; line-height: 1.3;}
/*商品名*/
.resultBox ul li .item_detail .artist_name {font-size: 1.3rem;}
/*価格*/
.resultBox ul li .item_detail .price {font-size: 1.7rem; text-align: left; }
.resultBox ul li .item_detail .price span{font-size: 1.2rem;}
/*発売日*/
.resultBox ul li .item_detail .sale_date { font-size: 1.4rem; line-height: 1.4; text-align: left; display: block;}
/*販売期間*/
.resultBox ul li .item_detail .sale_span { color: #acacac; font-size: 1.4rem; text-align: left; display: block; margin-top: 0.5rem;}

/*お気に入りボタン
--------------------------------------------*/
/*強制的に右上へ*/
.resultBox ul li.items .item_fav {position: absolute; top: 0; right: 5px;}

/*縦並び用でのみ使用するお気に入りボタンは表示させない*/
.resultBox ul li .item_detail ul li.items_4x5_fav { display: none;}


/*詳細ボタン
--------------------------------------------*/
.item_detail_btn{width:100%; max-width: 210px;}
.resultBox .btnwrap { margin: 0 0 6px 0; width: 100% !important;}
.resultBox .btnwrap:last-child { margin: 0; }

/*ボタン*/
.resultBox .item_detail_btn .btn.small { font-size: 1.4rem; margin: 0; padding: 1.7rem 0; max-width: 210px;}
.resultBox ul#items_4x5 li .item_detail_btn .btn.small{max-width: 100%;}






/*---------------------------------------------------------------------
【検索結果】商品リスト【横並び版】
-----------------------------------------------------------------------*/
.resultBox ul#items_4x5 { width: 100%;}
.resultBox ul#items_4x5 li.items { border: none;margin: 0 1% 4% 0; width: 22%;}

/*【横並び版】商品写真レイアウト*/
.resultBox ul#items_4x5 li div.item_img { display: block; margin: 0 0 1rem 0; vertical-align: top; width: 100%;}
/*.resultBox ul#items_4x5 li div.item_img img { height: auto; width: 100%; max-width: 100%;}*/

/*【横並び版】詳細レイアウト*/
.resultBox ul#items_4x5 li .item_detail { display: block;  vertical-align: top; width: 100%;}
.resultBox ul#items_4x5 li .item_detail p,
.resultBox ul#items_4x5 li .item_detail ul{margin-bottom: 1.1rem;}
/*【横並び版】ボタンを下揃えにする都合でmargin-bottomを0に*/
.resultBox ul#items_4x5 li .item_detail ul { margin: 0;}

/*【横並び版】ボタンレイアウト*/
.resultBox ul#items_4x5 li .item_detail_btn { display: block; text-align: right; vertical-align: bottom; width: 100%;}


/*商品名*/
.resultBox ul#items_4x5  li .item_detail .item_name {font-size: 1.4rem; font-weight: bold; line-height: 1.3;}
/*商品名*/
.resultBox ul#items_4x5  li .item_detail .artist_name {font-size: 1.4rem;}
/*価格*/
.resultBox ul#items_4x5  li .item_detail .price {font-size: 1.4rem; text-align: right;}
/*発売日*/
.resultBox ul#items_4x5  li .item_detail .sale_date { font-size: 1.1rem; line-height: 1.4; text-align: right;}

/*【横並び版】お気に入りボタンのために、日付と販売期間との枠を調整
--------------------------------------------*/
.resultBox ul#items_4x5 li .item_detail ul {-webkit-align-items: center; -ms-align-items: center; align-items: center;}
.resultBox ul#items_4x5 li .item_detail ul { margin: 0 0 1.6rem 0;}
.resultBox ul#items_4x5 li .item_detail ul li { font-size: 1.1rem;display: inline-block; text-align: right; vertical-align: middle;}

/*【横並び版】強制的に右上へ置くお気に入りボタンは使用しない*/
.resultBox ul#items_4x5 li.items .item_fav { display: none;}

/*【横並び版】縦並び用でのみ使用するお気に入りボタン*/
.resultBox ul#items_4x5 li .item_detail ul li.items_4x5_fav { margin: 0 2% 0 0; width: 8%; }

/*【横並び版】発売日と販売期間の枠（お気に入りボタンと横並びになる）*/
.resultBox ul#items_4x5 li .item_detail ul li:nth-child(2) { margin: 0; width: 87%; }




/*---------------------------------------------------------------------
【チェックした商品】商品リスト
-----------------------------------------------------------------------*/
#viewCheckBox {}

#viewCheckList {}

.resultBox ul#viewCheckList { max-width: 902px; width: 100%;}
.resultBox ul#viewCheckList li.items,
.resultBox ul#viewCheckList li.items:nth-child(4n){ border:none; display: inline-block; position: inherit; margin: 0 1% 3% 0; width: 18%;}


/*【横並び版】商品写真レイアウト*/
.resultBox ul#viewCheckList li div.item_img { display: block; padding: 0 0 2% 0; vertical-align: top; width: 100%;}
.resultBox ul#viewCheckList li div.item_img img { height: auto; width: 100%; max-width: 100%;}

/*【横並び版】詳細レイアウト*/
.resultBox ul#viewCheckList li .item_detail { display: block;  vertical-align: top; width: 100%;}
.resultBox ul#viewCheckList li .item_detail > * {margin-bottom: 1.8rem;}
/*【横並び版】ボタンを下揃えにする都合でmargin-bottomを0に*/
.resultBox ul#viewCheckList li .item_detail ul { margin: 0;}

.resultBox ul#viewCheckList li .item_detail .item_name { font-size: 100%;}


.noitem{text-align: center; line-height: 1.5;}

/*---------------------------------------------------------------------
【ページナビ】
-----------------------------------------------------------------------*/
#pageNav { margin: 0 0 6% 0; padding: 0; text-align: center;}
#pageNav ul { font-size: 0; line-height: 0; margin: 0; padding: 0; text-align: center;}

.navforSP {display:none !important; }
.navforSP.nopage{display: inline-block !important;}

@media screen and (min-width: 767.1px){
	.navforSP.nopage span{padding: 10px 0 !important;}
}


@media screen and (max-width: 767px){
.navforSP {display: inline-block !important;/* vertical-align: bottom; */}
}



/*基本のリスト
--------------------------------------------*/
#pageNav ul li { display: inline-block; height:40px; margin:0; padding: 0; vertical-align: top; width:40px;  box-sizing:border-box;}

/*前へ＆最初へ*/
#pageNav ul li.navprev { margin: 0 5% 0 0; width: 60px;}
#pageNav ul li.navprev_more { margin: 0 5% 0 0; width: 45px;}

/*次へ＆最後へ*/
#pageNav ul li.navnext { margin: 0 0 0 5%; width: 60px;}
#pageNav ul li.navnext_more { margin: 0 0 0 5%; width: 45px;}

/*テキスト
--------------------------------------------*/
/*テキスト（番号）*/
#pageNav ul li span {display:block;font-size:1.6rem;font-weight: bold;line-height:1.8rem;margin:0;padding: 0;text-align:center;width: auto;box-sizing:border-box;}

/*テキスト（番号以外）*/
#pageNav ul li.navprev span,
#pageNav ul li.navprev_more span,
#pageNav ul li.navnext span,
#pageNav ul li.navnext_more span { color: #a7a7a7;}

/*リンクの挙動
--------------------------------------------*/
/*クリック範囲を拡げる*/
#pageNav ul li a { display:block; height:100%; position:relative; top:0; left:0; padding:10px 0; text-decoration:none; width:100%;}

/*該当ページとhover時の挙動*/
#pageNav ul li.active a,
#pageNav ul li a:hover { background: #e67c7e; text-decoration: none;}
#pageNav ul li.active a span,
#pageNav ul li a:hover span { color: #fff !important;}








@media screen and (max-width: 767px){


/*---------------------------------------------------------------------
【SP】【検索結果】商品絞り込み
-----------------------------------------------------------------------*/

.resultSort{-ms-flex-wrap: wrap !important; flex-wrap: wrap !important;}

/*【SP】赤い四角の商品絞り込み
--------------------------------------------*/
/*【SP】marginが大きいので調整*/
.resultSort ul { padding:0 0 2rem 0 !important; width: 100% !important;}
.resultSort ul.search_choose{padding-bottom: 1.5rem;}
.resultSort ul.search_choose li .custom_radio_chips span span{display: block; font-size: 1.2rem; margin-top: 0.3em;}

/*【SP】件数と表示モード
--------------------------------------------*/
.resultSort_sub { display: block; width: 100% !important;}
.resultSort_sub ul { display: block !important; text-align: right; }
.resultSort_sub ul li { display: inline-block; width: auto !important;}

/*1つめ：セレクトボックス*/
.resultSort_sub ul li:first-child { min-width: auto;}
/*2つめ：表示モード：画像*/
.resultSort_sub ul li { min-width: auto;}
/*3つ目：表示モード：リスト*/
.resultSort_sub ul li:nth-child(3n) {  margin: 0;}


/*---------------------------------------------------------------------
【SP】【検索結果】商品リスト
-----------------------------------------------------------------------*/
.resultBox { padding: 3%;	 box-sizing:border-box;}
.resultBox ul { max-width: 100%; width: 100%;}

.resultBox ul li.items {position: relative; margin: 0 0 4% 0; padding: 0 0 4% 0; width: 100%;}

/*【SP】商品写真レイアウト*/
.resultBox ul li div.item_img,
.resultBox ul li div.img_wrap{ display: inline-block; padding: 0 2% 0 0; vertical-align: top; width: 28%;}

.resultBox ul li .img_wrap div.item_img {width: 100%; padding:0; margin-bottom:0;}

/*【SP】詳細レイアウト*/
.resultBox ul li .item_detail > *{margin-bottom: 4.1%;}
.resultBox ul li .item_detail { display: inline-block;  vertical-align: top; width: 70%;}
.resultBox ul li .item_detail ul { margin: 0 0 1.8rem 0;}

	.resultBox ul li .item_detail .price span{font-size: 1.1rem;}
/*【SP】ボタンレイアウト*/
.resultBox ul li .item_detail_btn { display: block; text-align: right; vertical-align: top; width: 100%;}
.resultBox ul li .item_detail_btn.btn_col{position: relative; bottom:auto !important;}
/*【SP】ボタン（枠）*/
.resultBox .btnwrap { margin: 3% 0 6px 0; }
/*【SP】ボタン*/
.resultBox ul li .item_detail_btn .btn.small { font-size: 1.4rem; margin: 0; padding: 1rem 0 !important; max-width: 210px;}

/*【SP】タグの再調整*/
.resultBox ul li .tag  {  width: 90%;}


/*---------------------------------------------------------------------
【SP】【検索結果】商品リスト【横並び版】
-----------------------------------------------------------------------*/
.resultBox ul#items_4x5 { max-width: 100%; width: 100%;}
.resultBox ul#items_4x5 li.items { border: none; display: inline-block; position: inherit; margin: 0 1% 3% 0; width: 48%;}
.resultBox ul#items_4x5 li.items:nth-child(2n),
.resultBox ul#items_4x5 li.items:nth-child(4n) { display: inline-block; position: inherit; margin: 0 0 3% 0; width: 48%;}

/*【SP】タグの再調整*/
.resultBox ul#items_4x5 li .tag  {  width: 100%;}


/*---------------------------------------------------------------------
【SP】【チェックした商品】商品リスト
-----------------------------------------------------------------------*/
/*【SP】タグの再調整*/
.resultBox ul#viewCheckList li .tag  {  width: 100%;}


/*---------------------------------------------------------------------
【SP】【ページナビ】
-----------------------------------------------------------------------*/

/*【SP】基本のリスト
--------------------------------------------*/
#pageNav ul li {display: none;border: 1px solid #a8a8a8;height:auto !important;margin:0;padding: 0;vertical-align: top;width:auto;box-sizing:border-box;}
#pageNav ul li.active,
#pageNav ul li.navforSP {border: none;display: inline-block;color: #333 !important;}

/*【SP】前へ＆最初へ*/
#pageNav ul li.navprev {  display: inline-block; margin: 0 3% 0 0; width: auto;}
#pageNav ul li.navprev_more { display: inline-block; margin: 0 3% 0 0; width: auto;}

/*【SP】次へ＆最後へ*/
#pageNav ul li.navnext { display: inline-block; margin: 0 0 0 3%; width: auto;}
#pageNav ul li.navnext_more { display: inline-block; margin: 0 0 0 3%; width: auto;}

	#pageNav ul li a{padding: auto !important;}

/*【SP】該当ページとhover時の挙動*/
#pageNav ul li.active a,
#pageNav ul li a:hover { background: none; text-decoration: none;}

#pageNav ul li a span,
#pageNav ul li.navforSP span {font-size: 3.3vw !important;padding: 0.5em !important;word-break: keep-all;display: block;}
/*#pageNav ul li a span { font-size: 4vw !important; padding: 0.5em !important;}*/

#pageNav ul li.active a span,
#pageNav ul li.navforSP span,
#pageNav ul li a:hover span { color: #333 !important;}
    #pageNav ul li.navforSP span{padding-left: 0 !important;}
    #pageNav ul li.navforSP span:before{content:'/'; display: inline-block; margin-right: .5em;}
	#pageNav ul li.navforSP.nopage span:before{content:''; }
    
/*【SP】リンクの挙動
--------------------------------------------*/
/*【SP】クリック範囲を拡げる*/
#pageNav ul li a,
#pageNav ul li.navforSP { padding: 1vw 0;}
	.resultBox ul li .item_detail_btn{margin-top: 1em;}
	.resultBox ul li .item_detail .tocol1 {max-height:100%;}
	.resultBox ul li .item_detail .sale_span.pc{display: none;}
}