@charset "UTF-8";
/* CSS Document */
@media screen and (max-width: 991px) {
  .header__wrap {
    background: #000;
    z-index: 9999; } }

#searchform {
  background: #000;
  border: 1px solid #fff;
  border-radius: 9999px;
  box-sizing: border-box;
  padding-left: 12px; }
  #searchform input {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    vertical-align: initial;
    font-size: 13px;
    font-size: 1.3rem;
    color: #fff;
    width: 125px; }
  #searchform button {
    margin: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box;
    padding: 8px 12px 8px 0;
    cursor: pointer;
    transition: .5s; }
    #searchform button:hover {
      scale: 1.2; }

@media screen and (max-width: 991px) {
  .pc-form {
    display: none !important; } }
@media screen and (min-width: 992px) {
  .pc-form {
    display: block !important; } }
@media (min-width: 992px) and (max-width: 1235px) {
  .pc-form input {
    width: 8vw !important; } }

@media screen and (max-width: 991px) {
  .sp-form {
    display: block !important; } }
@media screen and (min-width: 992px) {
  .sp-form {
    display: none !important; } }
.sp-form .submit_search_btn {
  background: none;
  border: none;
  box-sizing: border-box;
  padding: 9px; }
  .sp-form .submit_search_btn img {
    width: 19px; }

.bgbg {
  display: none;
  transition: .5s; }

.bgbg.is-show {
  display: block;
  width: 100vw;
  top: 97px;
  height: calc(100vh - 65px);
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  left: 0;
  z-index: -1; }

.is--navi-open .sp-form,
.is--navi-open .bgbg {
  display: none !important; }

#searchform.searchform-page {
  display: flex;
  justify-content: space-between;
  padding: 0 30px;
  background-color: #fff; }
  #searchform.searchform-page input {
    font-size: 19px;
    font-size: 1.9rem;
    width: 90%;
    color: #000; }
    @media screen and (max-width: 991px) {
      #searchform.searchform-page input {
        font-size: 16px;
        font-size: 1.6rem; } }
  #searchform.searchform-page button {
    padding: 20px 0;
    width: 3%;
    filter: brightness(0); }
    @media screen and (max-width: 991px) {
      #searchform.searchform-page button {
        padding: 15px 0;
        width: 7%; } }

.search .search_txt {
  color: #fff;
  margin: 3% 0; }
.search .search_txt_02 {
  margin-top: 0; }

.header .sp-form_form {
  transition: .5s;
  position: absolute;
  top: 0;
  left: 0; }
  @media screen and (min-width: 992px) {
    .header .sp-form_form {
      display: none; } }
  .header .sp-form_form #searchform {
    top: 0;
    transition: .2s;
    opacity: 0; }
  .header .sp-form_form #searchform {
    position: absolute;
    width: 100vw;
    left: 0;
    background: #eaeaea;
    border-radius: 0;
    padding: 20px 16px;
    display: flex;
    justify-content: space-between;
    border: none; }
    .header .sp-form_form #searchform input {
      font-size: 1.6rem;
      background: #fff;
      width: 80%;
      padding: 17px 10px;
      box-sizing: border-box;
      color: #0A0A0A; }
    .header .sp-form_form #searchform button {
      padding: 0;
      background: #333;
      width: 18%;
      position: relative; }
      .header .sp-form_form #searchform button:hover {
        scale: 1; }
      .header .sp-form_form #searchform button:before {
        content: "click";
        font-size: 1.6rem;
        color: #fff; }
      .header .sp-form_form #searchform button img {
        display: none; }
.header .sp-form_form.is-show #searchform {
  top: 90px;
  opacity: 1; }