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

#sub_layer #header{
  margin-bottom:0;
}

/* main imagw */
.top_main_bnr_box {
    display: block;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5 ease-in-out;
    -webkit-transform: translateY(5px);
    -ms-transform: translateY(5px);
    transform: translateY(5px);
    opacity: 0;
}
.top_main_bnr_box.active {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}

/* category link */
.top_category_menu {
  padding-bottom:30px;
}
.top_category_menu ul{
  display:flex;
  flex-wrap:wrap;
  width:100%;
  margin:0 auto;
}
.top_category_menu ul li {
  width: 25%;
  display: block;
  text-align: center;
  box-sizing:border-box;
  padding:0 2px;
  font-size:10px;
  font-weight:bold;
  position:relative;
  padding-bottom:15px;
}
.top_category_menu ul li span{
  font-size:22px;
  color:#fff;
  font-weight: normal;
  letter-spacing: 0.12em;
  background: rgba(0,0,0,0.2);
  width:100%;
  height:100%;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
 -webkit-justify-content: center; 
 justify-content: center;
  border-radius:5px;
}
.top_category_menu ul li a:hover{
  transition: 0.3s ease-in-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.top_category_menu ul li a:hover{
  opacity:0.6;
}
.top_cat_menu_bp a{
  background: url('/top/img/top_cat_menu_bp.png') top left no-repeat;
  background-size:100% auto;
  height:116px;
  position:relative;
  display:block;
  width:100%;
  border-radius:5px;
}
.top_cat_menu_accessory a{
  background: url('/top/img/top_cat_menu_accessory.png') top left no-repeat;
  background-size:100% auto;
  height:116px;
  position:relative;
  display:block;
  width:100%;
  border-radius:5px;
}
.top_cat_menu_goods a{
  background: url('/top/img/top_cat_menu_goods.png') top left no-repeat;
  background-size:100% auto;
  height:116px;
  position:relative;
  display:block;
  width:100%;
  border-radius:5px;
}
.top_cat_menu_sp a{
  background: url('/top/img/top_cat_menu_pieacer.png') top left no-repeat;
  background-size:100% auto;
  height:116px;
  position:relative;
  display:block;
  width:100%;
  border-radius:5px;
}


/* event */
/*.top_event_box{
  padding-bottom:50px;
}*/

/* staff coordinate */
.top_sc_box{
  /*border-bottom:3px solid #bdbdbd;*/
  padding-bottom:40px;
  margin-bottom:25px;
}
.staff_c_list_img01{
  padding-bottom:5px;
}
.staff_c_list_txt01 {
    font-size: 12px;
    text-align: center;
    font-weight: bold;
    line-height: 160%;
}



/*--------------------------------------
News & Topics
---------------------------------------*/
.top_news_box{
  background:#ebebeb;
  padding:30px 10px;
}

.top_news_topics_box{
  padding-bottom:25px;

}
.top_news_topics_box ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.top_news_topics_box ul li {
    background: none;
    width: 50%;
    box-sizing: border-box;
    padding: 0 40px 40px 0;
}
.top_news_topics_box ul li .top_news_topics_img_box01 {
    width: 35%;
    float: left;
}
.top_news_topics_box ul li .top_news_topics_img_box01 img {
    vertical-align: bottom;
    backface-visibility: hidden;
}
.top_news_topics_box ul li .top_ntopics_txt_box01 {
    width: 65%;
    float: left;
    padding-left: 10px;
    box-sizing: border-box;
}
.top_ntopics_date {
    font-weight: bold;
    color: #000;
    font-size: 12px;
}
.top_ntopics_title {
    font-weight: bold;
    color: #000;
    font-size: 14px;
}
.top_ntopics_txt01 {
    color: #000;
    font-size: 12px;
    line-height: 160%;
}

/*--------------------------------------
topics
---------------------------------------*/
#topics-box{
    padding: 16px 24px;
    background-color: #fff;
    border: 1px solid #ccc;
    max-width: 960px;
    margin: 0 auto;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;

}

#topics-box .topics_list{
    max-width: 960px;
    margin: 0 auto;
}

#topics-box div{
  font-size:14px;
  padding:2px;
  line-height: 1.3;
}

#topics-box div span.date{
  font-weight:bold;
  color:#888;
}

#topics-box div span.red{
  color:#e50046;
}

#topics-box div a , #topics-box div a:hover , #topics-box div a:link , #topics-box div a:visited {
  color:#040404;
}


/* feature */



.top_feature_box ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
}
.top_feature_box ul li {
    width: 25%;
    display: block;
    text-align: center;
    box-sizing: border-box;
    padding: 0 2px;
    font-size: 10px;
    /*font-weight: bold;*/
    position: relative;
    padding-bottom: 15px;
}
.top_feature_box .new{
  display:none;
}
.top_new_item_box .start{
  margin-bottom:3px;
  padding-top:3px;
}
.top_feature_box .name{
    font-weight: normal;
    font-size: 13px;
    line-height: 160%;
    margin-bottom:3px;
}
.top_new_item_box .price{
    font-weight: normal;
    font-size: 15px;
    line-height: 160%;
    margin-bottom:5px;
}

.pc_none{
    display:none !important;
}


/* New Item */



.top_new_item_box ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
}
.top_new_item_box ul li {
    width: 25%;
    display: block;
    text-align: center;
    box-sizing: border-box;
    padding: 0 2px;
    font-size: 10px;
    /*font-weight: bold;*/
    position: relative;
    padding-bottom: 15px;
}
.top_new_item_box .new{
  display:none;
}
.top_new_item_box .start{
  margin-bottom:3px;
  padding-top:3px;
}
.top_new_item_box .name{
    font-weight: normal;
    font-size: 13px;
    line-height: 160%;
    margin-bottom:3px;
}
.top_new_item_box .price{
    font-weight: normal;
    font-size: 15px;
    line-height: 160%;
    margin-bottom:5px;
}

.pc_none{
    display:none !important;
}

/*--------------------------------------
Ranking
---------------------------------------*/
.top_ranking_box{
  background:#ebebeb;
  padding:30px 10px;
}
.top_ranking_box ul{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
}
.top_ranking_box ul li div{
  font-weight: normal;
  font-size: 10px;
  line-height: 160%;
  margin-bottom: 3px;
  text-align:center;
  padding-top:3px;
}
.top_ranking_box ul li{
    width: 20%;
    display: block;
    text-align: center;
    box-sizing: border-box;
    padding: 0 3px;
    font-size: 14px;
    font-weight: bold;
    position: relative;
    padding-bottom: 15px;
}
/*.top_ranking_box ul li:nth-child(1):before{
  content: '1';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#d2c64a;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(2):before{
  content: '2';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#d9d9d9;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(3):before{
  content: '3';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#ed9641;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(4):before{
  content: '4';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;

}
.top_ranking_box ul li:nth-child(5):before{
  content: '5';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(6):before{
  content: '6';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(7):before{
  content: '7';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(8):before{
  content: '8';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box ul li:nth-child(9):before{
  content: '9';
  font-size:16px;
  color:#fff;
  padding:6px 11px;
  background:#000;
  position:absolute;
  top:0;
  left:0;
  z-index:1500;
}
.top_ranking_box .bx-wrapper .bx-viewport{
  background:#ebebeb;
}
/*
/*--------------------------------------
Series
---------------------------------------*/
.top_series_box{
  padding:30px 10px;
}

.col_03{
display: flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
justify-content: flex-start;
}

.col_03 li{
width: 24%;
padding-bottom: 25px;
box-sizing: border-box;
position: relative;
text-align: center;
padding: 0 2px 15px 0;
font-size: 11px;
margin-right: 1%;

}

.col_pickup{
display: flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
justify-content: space-between;
}

.col_pickup li{
width: 32%;
padding-bottom: 25px;
box-sizing: border-box;
position: relative;
text-align: center;
/*padding: 0 2px 15px 0;*/
font-size: 11px;
/*margin-right: 1%;*/

}

/***********************

insta_area

***********************/
.instagram_box{
  padding-top:30px;
}
.instagram_box .pc_insta ul{
  overflow:hidden;
  padding:0 5px;
}
.instagram_box .pc_insta ul li{
  float:left;
  width:20%;
  margin-bottom:30px;
  box-sizing:border-box;
  padding:0 5px;
  min-height:220px;
}
.instagram_box .pc_insta ul::before{
  content:"";
  display: block;
  width:23%;
  order:1;
}
.instagram_box .pc_insta ul::after{
  content:"";
  display: block;
  width:23%;
}

.instagram_box .pc_insta{
  padding-bottom:15px;
}
.pc_insta .insta_area_htxt01{
  font-size:18px;
  font-weight:bold;
  line-height:180%;
  padding-left:10px;
}
.pc_insta .insta_area_txt01{
  text-align:center;
  font-weight:bold;
  font-size:12px;
  line-height:150%;
  color:#000;
  padding:10px 0;
}
.pc_insta .insta_area_txt01 span{
  background:url(/common/img/icon/icon_instagram.png) no-repeat;
  background-size:16px 16px;
  background-position: center left;
  display:inline-block;
  vertical-align:middle;
  min-height:16px;
  padding-left:20px;
  transition: .4s;
}
.instagram_box .pc_insta ul a:hover .insta_area_txt01{
  opacity:0.6;
}
.instagram_box .pc_insta ul a .insta_area_btn01 {
    display: inline-block;
    padding: 0.3em 0.7em;
    text-decoration: none;
    color: #000;
    border: solid 2px #000;
    transition: .4s;
    display:block;
    font-size:13px;
    font-weight:bold;
    text-align:center;
    width:70%;
    border-radius:25px;
    margin:0 auto;
}
.instagram_box .pc_insta ul a:hover .insta_area_btn01 {
    background: #000;
    color: white;
}
/***********************

top_new

***********************/

.top_new {
 padding:0 0 15px;
}

/*�^�u�؂�ւ��S�̂̃X�^�C��*/
.tabs {
    margin-top: 50px;
    padding-bottom: 40px;
    width: 960px;
    margin: 0 auto;
}

/*�^�u�̃X�^�C��*/
.tab_item02 {
    box-sizing: border-box;
    text-align: center;
    padding: 8px 12px;
    float: left;
    width: 355px;
    /* background-color: #000; */
    /* color: #FFFFFF; */
    border-left: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    font-size: 11px;
    letter-spacing: 0.05em;
    margin: 40px 60px 40px 60px;
}

.tab_item02:hover {
  opacity: 0.75;
}

/*�^�u�؂�ւ��̒��g�̃X�^�C��*/
.tab_content {
  display: none;
  padding: 5px 5px 0;
  clear: both;
  overflow: hidden;
}


/*�I���Ă���^�u�̃R���e���c�݂̂�\��*/
#new_all:checked ~ #new_all_content,
#new_bdyp:checked ~ #new_bdyp_content,
#new_acc:checked ~ #new_acc_content,
#new_watch:checked ~ #new_watch_content, 
#new_bag:checked ~ #new_bag_content {
  display: block;
}

/*���W�I�{�^����S���*/
input[name="tab_item02"] {
  display: none;
}


/*�I���Ă���^�u�̃X�^�C����ς���*/
.tabs input:checked + .tab_item02 {
  border-bottom: 3px solid #666;
}


/***********************

top_ranking

***********************/

.top_ranking{
  padding:0 0 15px;
}

.tab_item:hover {
  opacity: 0.75;
}

/*���W�I�{�^����S���*/
input[name="tab_item"] {
  display: none;
}

/*�^�u�؂�ւ��̒��g�̃X�^�C��*/
.top_ranking .tab_content {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}

/*�I���Ă���^�u�̃R���e���c�݂̂�\��*/
#all:checked ~ #all_content,
#bdyp:checked ~ #bdyp_content,
#acc:checked ~ #acc_content {
  display: block;
}


.top_ranking .tab_content {
    width: 100%;
    margin: 0 auto ;
    overflow: hidden;
    padding: 0 0 20px;
}

.top_ranking .tab_item {
    box-sizing: border-box;
    text-align: center;
    padding: 8px 12px;
    float: left;
    width: 320px;
    /* background-color: #000; */
    /* color: #FFFFFF; */
    font-size: 11px;
    letter-spacing: 0.05em;
    margin: 40px 80px 40px 80px;
}


/*�I���Ă���^�u�̃X�^�C����ς���*/
.top_ranking input:checked + .tab_item {
  border-bottom: 3px solid #666;
}

.top_ranking .tab_content ul{
  display:flex;
  flex-wrap:wrap;
  width:99%;
  margin:0 auto;
}

.top_ranking .tab_content ul li {
  width: 20%;
  display: block;
  text-align: center;
  box-sizing:border-box;
  padding:0 2px;
  font-size:11px;
  font-weight:bold;
  position:relative;
  padding-bottom:15px;
}


/*�^�u�؂�ւ��S�̂̃X�^�C��*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;

  width: 100%;
  margin: 0 auto;}

/*�^�u�̃X�^�C��
.tab_item {
  box-sizing: border-box;
  text-align: center;
  padding: 8px 0;
  float: left;
  width: 50%;
  background-color: #000;
  color: #FFFFFF;
  border-left: 1px solid #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
  font-size: 11px;
  letter-spacing: 0.05em;
  margin: 0 0 20px 0;
}*/

.tab_item:hover {
  opacity: 0.75;
}

/*���W�I�{�^����S���*/
input[name="tab_item"] {
  display: none;
}

/*�^�u�؂�ւ��̒��g�̃X�^�C��*/
.tab_content {
  display: none;
  padding: 5px 5px 0;
  clear: both;
  overflow: hidden;
}


/*�I���Ă���^�u�̃R���e���c�݂̂�\��*/
#rank_all:checked ~ #rank_all_content,
#rank_bdyp:checked ~ #rank_bdyp_content,
#rank_acc:checked ~ #rank_acc_content {
  display: block;
}

/*�I���Ă���^�u�̃X�^�C����ς���*/
.tabs input:checked + .tab_item {
    border-bottom: 3px solid #666;
}
.top_ranking .tab_content ul .rank_num {
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 4px;
    letter-spacing: 0.8px;
}

.top_ranking .tab_content ul li:first-child:before{
    display:none;
}
.top_ranking .tab_content ul li:nth-child(2):before{
    display:none;
}
.top_ranking .tab_content ul li:nth-child(3):before{
    display:none;
}
.top_ranking .tab_content ul li:nth-child(4):before{
    display:none;
}

.top_ranking .tab_content ul li:nth-child(5):before{
    display:none;
}

.top_ranking .tab_content ul li:nth-child(6):before{
    display:none;
}



/***********************

staff_cordinate

***********************/
.sc_item_list ul{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
}
.sc_item_list ul li{
    width:25%;
  padding-bottom:15px;
  position:relative;
    box-sizing:border-box;
    padding:0 2px;
    margin-bottom: 20px;
}
.sc_item_list ul li:nth-child(2n) {
  padding:0 0 0 1px;
}
.sc_item_img{
  /*background:#f1ece8;*/
  padding:5px;
}
.sc_item_txt_box{
  padding:5px 0 10px;
  text-align:center;
}

.sc_item_txt01{
  font-size:12px;
  line-height:160%;
  color:#888;

}
.sc_item_txt02{
  font-size:12px;
  line-height:160%;
  color:#000;
  font-weight:bold;
}

.sc_item_txt03{
    font-size:12px;
  color:#888
 }


.sc_item_list .insta_sumbnail img {
    width: 35px ;
    height: auto !important;
    border-radius: 50% !important;
    margin-top: 5px;
}

.sc_item_list .insta_sumbnail{
    clear:both;
    float:left;
    margin: 0 10px 0 0;
}

.sc_item_list .sc_item_txt_box{
    padding-bottom: 25px;
    text-align: left;
    display: inline-block;
}
.sc_item_txt_box p {
    text-align: left !important;
}

/*�X�}�z*/
@media screen and (max-width:480px) {

.sc_item_list ul li{
  width:49%;
  padding-bottom:15px;
  position:relative;
  padding:0 1px 0 0;
}

#ms_sc_wrap {
    padding: 5px 0;
}
.sc_item_list .insta_sumbnail{
    width: 40px;
    margin: 8px 5px 0 0;
}

}