@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*テーブル構造*/

caption{
 font-size:1.5em;
}
table {
 width:100%;
 border-width:1px;
 border-style:solid;
 border-color:gray;
}
.tbl td, th {
 border-width:1px;
 border-style:solid;
 border-color:gray;
 text-align:center;
 vertical-align:middle;
}
.tbl th{ background:lemonchiffon;color:#800000;width:33%; }
.tbl td{ background:honeydew;color:#800080;width:33%;}

/*広告*/

/*楽天市場及び、アマゾン画像160px用の商品リンクcenter配置用*/
.ga180 {
   width:180px;
   margin-top:5px;
   margin-left:auto;
   margin-bottom:5px;
   margin-right:auto;
   text-align:center;
}
/*楽天市場及び、アマゾン画像の商品リンクはここまで*/

.ga336 {
   width:336px;
   margin-top:5px;
   margin-left:auto;
   margin-bottom:10px;
   margin-right:auto;
   text-align:center;
}

.ga468 {
   width:468px;
   margin-top:5px;
   margin-left:auto;
   margin-bottom:10px;
   margin-right:auto;
   text-align:center;
}

.ga650 {
   width:650px;
   max-width:100%;
   margin-top:5px;
   margin-left:auto;
   margin-bottom:10px;
   margin-right:auto;
   text-align:center;
}

.ga728 {
   width:728px;
   max-width:100%;
   margin-top:5px;
   margin-left:auto;
   margin-bottom:10px;
   margin-right:auto;
   text-align:center;
}


/*リンク*/


.shoplink {
   width:200px;
   margin-top:5px;
   margin-left:auto;
   /*margin-bottom:10px;*/
   margin-right:auto;
   text-align:center;
}

.rakuten ul {
  list-style: none;
  overflow: hidden;
  margin-left: 0;
  padding-left: 0;
}

.rakuten li {
  width: 195px;
  display:inline;
  text-align: center;
  background-color:#FF3300;
  float: left;
  height: 80px;
  line-height: 80px;
  /*margin-right: 5px;*/
  /*margin-bottom:10px;*/
}

.rakuten li a {
  width: 195px;
  text-decoration: none;
  color:#FFFFFF;
  font-weight: bold;
  /*padding:20px;*/
  display:inline;
  text-align: center;
  background-color:#FF3300;
  float: left;
  height: 80px;
  line-height: 80px
}

.rakuten li a:hover {
  color: #0000FF;
  background-color:#FFCC66;
} 

.rakuten li.active a {
  color:#0000FF;
  background:#FFCC66;
}
/*amazon*/

.amazon ul {
  list-style: none;
  overflow: hidden;
  margin-left: 0;
  padding-left: 0;
}

.amazon li {
  width: 195px;
  display:inline;
  text-align: center;
  background-color:#FF6600;
  float: left;
  height: 80px;
  line-height: 80px;
  /*margin-right: 5px;*/
  /*margin-bottom:10px;*/
}

.amazon li a {
  width: 195px;
  text-decoration: none;
  color:#FFFFFF;
  font-weight: bold;
  /*padding:20px;*/
  display:inline;
  text-align: center;
  background-color:#FF6600;
  float: left;
  height: 80px;
  line-height: 80px;

}

.amazon li a:hover {
  color: #0000FF;
  background-color:#FFCC66;
} 

.amazon li.active a {
  color:#0000FF;
  background:#FFCC66;
}

/*ベクター*/

.vector ul {
  list-style: none;
  overflow: hidden;
  margin-left: 0;
  padding-left: 0;
}

.vector li {
  width: 195px;
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;
  /*margin-right: 5px;*/
  /*margin-bottom:10px;*/
}

.vector li a {
  width: 195px;
  text-decoration: none;
  color:#FFFFFF;
  font-weight: bold;
  /*padding:20px;*/
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;

}

.vector li a:hover {
  color: #FFFFFF;
  background-color:#808080;
} 

.vector li.active a {
  color:#FFFFFF;
  background:#808080;
}


/*UNEXT*/

.unext ul {
  list-style: none;
  overflow: hidden;
  margin-left: 0;
  padding-left: 0;
}

.unext li {
  width: 195px;
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;
  /*margin-right: 5px;*/
  /*margin-bottom:10px;*/
}

.unext li a {
  width: 195px;
  text-decoration: none;
  color:#FFFFFF;
  font-weight: bold;
  /*padding:20px;*/
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;

}

.unext li a:hover {
  color: #FFFFFF;
  background-color:#808080;
} 

.unext li.active a {
  color:#FFFFFF;
  background:#808080;
}

/*autoway*/

.autoway ul {
  list-style: none;
  overflow: hidden;
  margin-left: 0;
  padding-left: 0;
}

.autoway li {
  width: 195px;
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;
  /*margin-right: 5px;*/
  /*margin-bottom:10px;*/
}

.autoway li a {
  width: 195px;
  text-decoration: none;
  color:#FFFFFF;
  font-weight: bold;
  /*padding:20px;*/
  display:inline;
  text-align: center;
  background-color:#000000;
  float: left;
  height: 80px;
  line-height: 80px;

}

.autoway li a:hover {
  color: #FFFFFF;
  background-color:#000080;
} 

.autoway li.active a {
  color:#FFFFFF;
  background:#0000ff;
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px) {
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
  .tbl th,
  .tbl td {
　　border-bottom: none;
    display: block;
    width: 100%;
   
  }
}
