/* カテゴリ・グループのフリースペース内全体の指定 */
.cg_freespace_01 {
  padding:0;
  margin:20px 0 20px 0;
}
.cg_freespace_02 {
  padding:0;
  margin:20px 0 20px 0;
}
/* カテゴリ・グループのフリースペース内の<p>タグの余白設定 */
.cg_freespace_01 p,
.cg_freespace_02 p {
  margin:0 0 10px 0;
}
/* カテゴリ・グループのフリースペース内の<ul>タグの余白設定 */
.cg_freespace_01 ul,
.cg_freespace_02 ul {
  margin:0 0 10px 20px;
  padding:0;
}

#list-content {  padding-top: 20px; }

#side { background: #f3f3f3; padding: 20px 0 30px;}
#side .category { margin: 0 15px 30px 15px; }
#side .category ul { margin: 5px; list-style: none; }
#side .category ul li { margin: 5px 0; list-style: none; font-size: 14px; }
#side .category ul li  a { text-decoration: none; }
#side h3 { font-size: 20px; border-bottom: 1px solid #888; margin: 0 0 10px 0; }
#side h3 span { font-size: 12px; font-weight: normal; color: #999; }
#side .color-block div { width: 29px; height: 29px; margin: 0 3px 3px; float: left; }
#side .color-block div.white { background: #fff; border: 1px solid #eee; }
#side .color-block div.black { background: #000; border: 1px solid #eee; }
#side .color-block div.blue { background: blue; border: 1px solid #eee; }
#side .color-block div.red { background: red; border: 1px solid #eee; }
#side .color-block div.yellow { background: yellow; border: 1px solid #eee; }
#side .color-block div.glay { background: gray; border: 1px solid #eee; }
#side .color-block div.tya { background: #a0522d; border: 1px solid #eee; }
#side .color-block div.navy { background: navy; border: 1px solid #eee; }
#side .color-block div.orange { background: orange; border: 1px solid #eee; }
#side .color-block div.green { background: green; border: 1px solid #eee; }

#list-block { width: 75%; float: right; }
#list-block .item_box { width: 29%; margin: 0 1.5% 20px; }
#list-block .head-title { position: relative; z-index: 10; }
#list-block h2 { font-size: 22px; text-align: center; border-bottom: 2px solid #ccc; padding-bottom: 6px; margin-bottom: 30px; }

#box_history { padding-top: 35px; clear: both; }
h3.title-history { font-size: 22px; text-align: center; padding: 0 0 12px; background: url(https://img21.shop-pro.jp/PA01330/759/etc/german.jpg?cmsp_timestamp=20160204124726) no-repeat center bottom;}
p.title-history-sub { text-align: center; margin: 11px 0 25px; }
#box_history .item_box { width: 23%; margin: 0 1% 60px; display: block; float: left; }

.paging { margin: 20px 0; text-align: center; font-size: 15px; }
.paging a { padding: 5px 10px; background: #eee; text-decoration: none; border-radius: 3px; margin: 0 2px 10px; display: inline-block; }
.paging span { padding: 5px 10px; }

.dropdown { position: absolute; top: 1px; right: 0px; }

#tg {
  display: none;
  }

.menu {
  position: relative;
  visibility: hidden;
  opacity: 0;
  top: -10px;
  list-style: none;
  background: #fff;
  padding: 8px;
  }

.dropInput:checked ~ .menu {
  visibility: visible;
  opacity: 1;
  top: 0;
  }

.dropLabel {
  padding: 5px 10px;
  display: block;
  background-color: #fff;
  text-align: center;
  position: relative;
  color: #333;
  text-decoration: none;
  background: #eee;
  border-radius: 3px;
}
.item-list {
  padding: 1em 1.5em;
  display: block;
  background-color: #fff;
  text-align: center;
  position: relative;
  color: #333;
  text-decoration: none;
  }

.item-list:hover {
  background-color: #888;
  color: #fff;
  }

.dropLabel:hover, .dropInput:checked + label {
  background: #888;
  color: #fff;
  }

.animation {
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -ms-transition: all .3s;
  transition: all .3s;
  }
dl dt { display: none; } 
dl dd.right { display: none; }

@media screen and (max-width: 480px) {
  #list-content {  margin: auto; width: 100%; }
  #list-block { width: 94%; float: none; margin: 50px auto 0; }
  #list-block .item_box { width: 46%; margin: 0 1.5% 20px; }
  #side { float: none; width: 100%; background: #888; color: #fff !important; }
  #side a, #side h3 span { color: #fff; }
  #side h3 { border-bottom: 1px solid #fff; }
  dl dt { display: block; text-align: center; }
  .accordion { position: relative; }
  dl.accordion dt.left { width:50%; margin:0 0 30px; font-size:15px; position: absolute;top:0; left:0; border-right: 1px solid #fefefe; margin-left: -1px;}
  dl.accordion dt.right { width:50%; margin:0 0 30px; font-size:15px; position: absolute; top: 0; right:0; border-left: 1px solid #aaa; margin-right: -1px; }
  dl.accordion dd.right, dl.accordion dd.left { background: #888; padding: 45px 0 15px; text-align: center; }
  dl.accordion dd.right div a, dl.accordion dd.right div span { width: 85%; margin: 0 auto 5px; border: 1px solid #888; padding: 5px 0; display: block; text-decoration: none; font-size: 15px; color: #fff; }
  dl.accordion dt { height:40px; text-indent:10px; line-height:40px; color:#555; cursor:pointer; background: #eee; }
  dl.accordion dt.open { background: #888; color: #fff; }
  dl.accordion dd { line-height:1.5; display:none;width: 100%;}
  #list-block .head-title { position: static; }
  .dropdown { display: none; }
  #box_history .item_box { width: 46%; margin: 0 2% 30px; display: block; float: left; }
}