@charset "UTF-8";
/* ----------------------------------------------------------
　検索ＢＯＸ
---------------------------------------------------------- */
#searchbox{
  position: fixed;
  width: auto;
  /*
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  */
  top: 60px;
  right: 10px;
  /*
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  */
  color: #fff;
  z-index: 999;
}

body > #searchbox {
  height: auto;
}
  
.searchboxinner {
  width: 100%; /*全体の横幅*/
/*  border: 1px solid #333; */
  border-radius: 10px;/*角の丸み*/
  font-size: 12px;
  background: #fff;
  margin-bottom: 5px;
}

.searchboxinner li:first-child {
  border-top: none;
}

.searchboxinner title {
/*  background: #56b329;*/
/*  color: #fff;*/
/*  padding: 5px 5px;*/
/*  display: block;*/
/*  margin: 0;*/
/*  text-align: center;*/
/*  font-size: 12px; */
/*  border-radius: 10px;/*角の丸み*/
/*  border-top: 1px solid #ccc;*/
/*  cursor: pointer;  */
  display: flex;            /* 親要素をFlexboxにする */
  justify-content: center;  /* 横を中央揃えにする */
  align-items: center;      /* 縦を中央揃えにする */
}

.exitBtnStyle{
  display     : inline-block;
  position    : absolute;
  top         : 5px;
  right       : 10px;
  cursor      : pointer;
  font-size   : 12px;
  line-height : 12px;
  border      : 1px solid #ccc;
  padding     : 3px;
  background  : rgba(255, 255, 255, .5);
  color: #000;
  border-radius: 3px;
}
.exitBtnStyle:hover{
  background  : #fff;
}
.searchboxinner ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.searchboxinner li {
  border-top: 1px dashed #ddd;
  padding: 8px 20px;	    /* 上下　左右　*/
}
.searchboxinner li a{
  font-size: 12px;
}
/*
@media screen and (max-width: 767px) {
    #searchbox{
      width: 100%;
    }
}
*/
title.button {
  position: absolute;
  min-width: 100px;
  height: 30px;
  text-align: center;
  font-size: 16px;
  right: 0px;
}

@media screen and (max-width: 767px) {
  #searchbox{
    top: 30px;
    right: 0px;
  }
}
@media screen and (max-width: 767px) {
  title.button {
    min-width: 60px;
    font-size: 12px;
  }
}