/* パソコンで見たときは"pc"のclassがついた要素が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた要素が表示される */
@media only screen and (max-width: 787px) {
.pc { display: none !important; }
.sp { display: block !important; }
}


/* アコーディオンメニュー */
.ac-menu:last-child {
  margin-bottom: 60px; /* 最後の要素の下にだけ余白 */
}
.ac-menu input {
  display: none;
}
.ac-menu label {
  color: #fff !important; /* 文字色 */
  font-size: 17px !important; /* 文字サイズ */
  line-height: 2; /* 行間 */
  font-weight: bold !important; /* 文字を太く */
  text-align: center; /* 文字を中央に */
  background: linear-gradient(179deg, #3c83ac, #00184e); /* グラデーションの背景色 */
  padding: 10px 20px !important; /* 内側の余白 */
  cursor: pointer !important;
  position: relative !important;
  display: block !important;
  line-height: 1.2em;
  margin-bottom: 5px;
  text-align: left;
}
.ac-menu label:after {
  position: absolute;
  right: 20px; /* 左からの距離 */
  top: 50%; /* 上下中央配置 */
  -webkit-transform : translateY(-50%);
  transform : translateY(-50%);
  content: "＋"; /* アイコン */
}
.ac-menu input:checked ~ label::after {
  content: "−"; /* クリック後のアイコン */
}
.ac-menu div {
  height: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.3s; /* 開閉スピード */
  font-size: 90%;
}
.ac-menu input:checked ~ div {
  height: auto;
  opacity: 1;
  padding: 20px; /* 中身の枠内の余白 */
  background: #EEE; /* 中身の背景色 */
  /*margin-top: -16px;*/
  margin-bottom: 5px;
  line-height: 1.5em;
  text-align: left;
}
.ac-menu-inside {
  color: #333; /* 中身の文字色 */
  font-size: 17px; /* 中身の文字サイズ */
  line-height: 2; /* 行間 */
}



/* APIタイプ別検索 /////////////// */
#category_nav ul {
  text-align: center;
  padding-left: 0;
  /*font-size: 0;*/
}
#category_nav li {
  display: inline-block;
  font-size: 10px;
  color: #333;
  width: 100px;
  height: 65px;
  background-color: #EEE;
  border-radius: 5px;
  text-align: center;
  font-weight: bold;
  border: 1px solid #CCC;
}
#category_nav img {
  margin-top: -23px;
  width: 75%;
}
/*要素全体にリンクをつけるために必要な要素*/
.linkbox {
  position: relative;
}
.linkbox a {
  position: absolute;
  top: 0;
  left: 0;
  height:100%;
  width: 100%;
  border-bottom: 0px;
}
.linkbox a:hover {
  background-color: #dc7800;
  color: #FFF;
  border-radius: 5px;
}
.linkbox a:hover img {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}
.stock_all {
  font-size: 80% !important;
  line-height: 1.2em;
}

.menu_hover {
  background-color: #dc0000;
  color: #FFF;
  border-radius: 5px;
}
.menu_hover img {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}