@charset "UTF-8";

/*--------- CSS MENU ---------*/
/*------------------------------
/*  01.  top page - theme
/*  02.  top page - ranking
/*  03.  top page - new item
/*  04.  top page - special
/*  05.  top page - benefit
/*
/*
/*
--------------------------------
------------------------------*/

/*  01.  category page - intro
------------------------------*/
/*  sp  */
@media screen and (max-width: 979px) {
/*  category  *//*  intoro  */
#category_intro {float: left;width: 100%;height: auto;}
#category_intro img {float: left;width: 100%;height: auto;vertical-align: top;}
	
/*  category  *//*  intoro  *//*  detail  */
#category_intro_detail {float: left;width: 100%;height: auto;padding: 20px;background-color: #FFFFFF;box-sizing: border-box;border-bottom: 1px solid #EEEEEE;}
#category_intro_detail h2 {line-height: 20px;font-size: 16px;font-weight: bold;}
#category_intro_detail p {margin-top: 10px;line-height: 20px;font-size: 12px;font-weight: normal;}
}

/*  pc  */
@media screen and ( min-width : 980px ){
/*  category  *//*  intoro  */
#category_intro {position: relative;float: left;width: 100%;height: auto;}
#category_intro img {width: 100%;height: auto;vertical-align: top;}

/*  category  *//*  intoro  *//*  detail  */
#category_intro_detail {position: absolute;width: 350px;height: auto;top: 50%;right: 40px;padding: 20px;background-color: #FFFFFF;box-sizing: border-box;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);}
#category_intro_detail h2 {line-height: 30px;font-size: 20px;font-weight: bold;}
#category_intro_detail p {margin-top: 20px;line-height: 20px;font-size: 14px;font-weight: normal;}
}

/*  02.  category page - sort
------------------------------*/
/*  sp  */
@media screen and (max-width: 979px) {
/*  category  *//*  sort  */
#category_sort {float: left;}
#category_sort p {float: left; width: 70px; height: 20px; line-height: 20px;padding-left: 10px; padding-right: 10px; margin-left: 5px; margin-right: 5px; font-size: 10px; font-weight: normal; color: #FFFFFF; background-color: #EEEEEE; background-image: url(../image/icon_sort.png); background-size: 15px; background-position: 70px; background-repeat: no-repeat;}
#category_sort select#sort_order {margin-left: 10px; margin-right: 10px;}
/* select 矢印 */
#category_sort .select_wrap select {padding-right: 20px; -webkit-appearance: none; -moz-appearance: none;}
#category_sort .select_wrap {position: relative;display: inline-block;}
#category_sort .select_wrap:after {right: 18px;}
#category_sort .select_wrap.card_month:after {right: 16px;}
/* / select 矢印 */
}

/*  pc  */
@media screen and ( min-width : 980px ){
/*  category  *//*  sort  */
#category_sort {float: right; width: auto; height: auto; margin: 0px;}
#category_sort p {float: left; width: 70px; height: 20px; line-height: 20px; padding-left: 10px; padding-right: 20px; margin-right: 20px; font-size: 10px; font-weight: normal; color: #FFFFFF; background-color: #EEEEEE; background-image: url(../image/icon_sort.png); background-size: 20px; background-position: 70px; background-repeat: no-repeat;}
#category_sort select#sort_order {font-family: "Noto Sans Japanese", sans-serif; float: left; width: 150px; height: 30px; padding: 0 10px; font-size: 13px; background-color: #EEEEEE; outline: none; border: 0px; border-radius: 10px; -webkit-appearance: none; -moz-appearance: none;}
/* select 矢印 */
#category_sort .select_wrap select {padding-right: 20px; -webkit-appearance: none; -moz-appearance: none;}
#category_sort .select_wrap {position: relative; display: inline-block;}
#category_sort .select_wrap:after {content: "▼"; position: absolute; right: 8px; font-size: 10px; top: 7px;}
#category_sort .select_wrap.card_month:after {right: 16px;}	
/* / select 矢印 */
#category_sort select#sort_order::-ms-expand {border: none;}
}

/*  03.  category page - number
------------------------------*/
/*  sp  */
@media screen and (max-width: 979px) {
/*  category  *//*  number  */
#page_number {width: 100%; height: auto; padding-top: 20px; margin-bottom: 20px;clear:both;}
#page_number:after{content: ""; clear: both; display: block;}
#page_number p {margin: 0px 5px 0px 5px; font-size: 13px;font-weight: normal;color: #777777;}
#page_number .text {margin:0 0 10px 0px; width: 100% !important; text-align: left; padding: 0 10px; box-sizing: border-box; none !important; float:none !important; }
#page_number .pagelink{text-align: left; padding-top: 8px; margin: 0 10px 10px;}
#page_number a {display: inline; line-height: 10px; font-size: 13px;font-weight: normal;color: #001489;}
#page_number a.to_move {background-color: #EEEEEE;color: #000;padding: 5px;}
}

/*  pc  */
@media screen and ( min-width : 980px ){
/*  category  *//*  number  */
#page_number {float: none; width: auto; height: auto; padding: 20px 10px; clear: both;}
#page_number:after{content: ""; clear: both; display: block;}
#page_number p {line-height: 10px; margin: 0px; padding: 5px; font-size: 13px;}
#page_number .text {margin-bottom: 10px; color: #363636;}
#page_number .pagelink{float: left; padding-top: 10px; color: #363636;}
#page_number .pagelink span{color: #777777;}
#page_number .pagelink .current{ color: #363636;}
#page_number .pagelink a:hover{text-decoration: underline;}
#page_number a {display: inline; line-height: 10px; font-size: 13px; color: #001489;}
#page_number a.to_move {color: #001489;}
#page_number select#SEARCH_MAX_ROW_LIST {float: left; margin-top: -10px; margin-right: 10px; padding: 10px; font-size: 11px; font-weight: normal; background-color: #EEEEEE; outline: none; box-sizing: border-box; border: 0px; border-radius: 10px;}
}

/*  04.  category page - item list
------------------------------*/
/*  category  *//*  item list  */
#item_list {float: left;width: 100%;height: auto;}

/*  05.  category page - sub menu
------------------------------*/
/*  sp  */
@media screen and (max-width: 979px) {
/*  category  *//*  sub menu  */
#category_sublist {float: left;width: 100%;height: auto;padding: 20px;background-color: #EEEEEE;box-sizing: border-box;}
#category_sublist p.title {line-height: 20px;font-size: 16px;font-weight: normal;}
#category_sublist ul {float: left;width: 100%;height: auto;}
#category_sublist ul li {position: relative;float: left;width: auto;height: 30px;line-height: 30px;margin-top: 10px;margin-right: 10px;font-size: 12px;font-weight: normal;color: #333333;}
#category_sublist ul li a {display: block;float: left;width: auto;height: 30px;line-height: 30px;padding: 0px 10px;font-size: 12px;font-weight: normal;color: #333333;background-color: #FFFFFF;border-radius: 10px;}
#category_sublist ul li a.select {background-color: #001489!important;color: #FFFFFF!important;}
#category_sublist ul li::before a.select {color: #FFFFFF!important;}
}

/*  pc  */
@media screen and ( min-width : 980px ){
/*  category  *//*  sub menu  */
#category_sublist {float: left;width: 100%;height: auto;padding: 20px;background-color: #EEEEEE;box-sizing: border-box;}
#category_sublist p.title {line-height: 20px;font-size: 16px;font-weight: normal;}
#category_sublist ul {float: left;width: 100%;height: auto;margin-top: 10px;}
#category_sublist ul li {position: relative;float: left;width: auto;height: 30px;line-height: 30px;margin-top: 10px;margin-right: 10px;font-size: 12px;font-weight: normal;color: #333333;}
#category_sublist ul li a {display: block;float: left;width: auto;height: 30px;line-height: 30px;padding: 0px 10px;font-size: 12px;font-weight: normal;color: #333333;background-color: #FFFFFF;border-radius: 10px;}
#category_sublist ul li a:hover {background-color: #001489!important;color: #FFFFFF!important;}
#category_sublist ul li a.select {background-color: #001489!important;color: #FFFFFF!important;}
#category_sublist ul li::before a.select {color: #FFFFFF!important;}
}
