@charset "UTF-8";
html {color:#676969; background-color:#e8e8e8;}
body {margin:0;padding:0;}
#wrapper { background-color:#FFF;}
#container{max-width:1020px; padding:0 20px; margin: 0 auto; background:#FFF;}

table.shoplist_tbl{border-collapse:collapse; width: 100%;}
table.shoplist_tbl th,
table.shoplist_tbl td{border:1px solid #ccc; padding: 10px; font-size: 1.2rem; font-size: 12px;}
table.shoplist_tbl th{background-color: #efefef}
table.shoplist_tbl th.shoplist_name{width: 8%;}
table.shoplist_tbl th.shoplist_ad{width: 35%;}
table.shoplist_tbl th.shoplist_tel{width: 25%;}
table.shoplist_tbl th.shoplist_service{width: 12%;}
table.shoplist_tbl th.shoplist_completed{width: 20%;}
table.shoplist_tbl th.shoplist_name2{width: 70%;}
table.shoplist_tbl th.shoplist_tel2{width: 13%;}

#responsiveTabs h3{ color:#e10023;}
#responsiveTabs .pc_hidden{ display:none;}

@media only screen and (max-width:768px){
  #responsiveTabs .pc_hidden{ display:inline;}

  #responsiveTabs h3{ display:none;}

  table.shoplist_tbl{
    display: block;
  }
  table.shoplist_tbl thead{
    display: none;
  }
  table.shoplist_tbl tbody{
    display: block;
  }
  table.shoplist_tbl tbody tr{
    display: block;
    margin-bottom: 1.5em;
    padding-bottom: 1.5em;
    border-bottom: 1px solid #ccc;
  }
  table.shoplist_tbl tbody th,
  table.shoplist_tbl tbody td{
    display: list-item;
    border: none;
  }
  table.shoplist_tbl tbody td{
    margin-left: 10px;
    list-style-type: none;
    padding: 0;
  }
  table.shoplist_tbl tbody td:first-child{
    /*font-weight: bold;*/
  }

  table.shoplist_tbl tbody td:nth-of-type(1):before { content: "品番："; }
  table.shoplist_tbl tbody td:nth-of-type(2):before { content: "品名："; }
  table.shoplist_tbl tbody td:nth-of-type(3):before { content: "色柄："; }
  table.shoplist_tbl tbody td:nth-of-type(4):before { content: "JAN："; }
  table.shoplist_tbl tbody td:nth-of-type(5):before { content: "発売時期："; }
}


.tab ul li {font-size: 1.3em; display: inline-block; margin: 0 10px 10px;}

@media only screen and (max-width: 768px) {
    .tab ul li {font-size: 1.2em; display: inline-block; margin: 0 10px 10px;}
}

.r-tabs .r-tabs-nav {
  margin: 0;
  padding: 0;
}

.r-tabs .r-tabs-tab {
  display: inline-block;
  margin: 0;
  list-style: none;
}

.r-tabs .r-tabs-panel {
  display: none;
}

.r-tabs .r-tabs-accordion-title {
  display: none;
}

.r-tabs .r-tabs-panel.r-tabs-state-active {
  display: block;
}

/* Accordion responsive breakpoint */
@media only screen and (max-width: 768px) {
    .r-tabs .r-tabs-nav {
      display: none;
    }

    .r-tabs .r-tabs-accordion-title {
      display: block;
    }
}



/* Tabs container */
.r-tabs {
  position: relative;
}

/* Tab element */
.r-tabs .r-tabs-nav .r-tabs-tab {
  position: relative;
  background-color: #fff;
  margin-bottom: 20px;
}

/* Tab anchor */
.r-tabs .r-tabs-nav .r-tabs-anchor {
  display: inline-block;
  padding: 10px 12px;

  text-decoration: none;
  font-size: 14px;
  font-weight: bold;
  color: #e10023;
}

/* Disabled tab */
.r-tabs .r-tabs-nav .r-tabs-state-disabled {
  opacity: 0.5;
}

/* Active state tab anchor */
.r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
  color: #fff;
  background-color: #e10023;
  border-radius: 4px;
}

/* Tab panel */
.r-tabs .r-tabs-panel {
  background-color: white;
}

/* Accordion anchor */
.r-tabs .r-tabs-accordion-title .r-tabs-anchor {
  display: block;
  padding: 10px;

  background-color: #e10023;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  border-bottom: 1px solid #fff;
}

/* Active accordion anchor */
.r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor {
  background-color: #fff;
  color: #e10023;
  font-weight: bold;
}

/* Disabled accordion button */
.r-tabs .r-tabs-accordion-title.r-tabs-state-disabled {
  opacity: 0.5;
}

