@charset "UTF-8";


@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

@import url(//fonts.googleapis.com/css?family=Abril+Fatface|Josefin+Slab:700|Noto+Serif:200,400,700);

@import url(//fonts.googleapis.com/css2?family=Playfair+Display&display=swap);

* {
  font-family: 'Overpass', 'Noto Sans JP', sans-serif;
}





/*----------------------------------------
	clearfix
----------------------------------------*/
.clearfix:after {
content: "";
display: block;
clear: both;
}
/*----------------------------------------
	clearfix
----------------------------------------*/


.layout_header_search .btn0511 {
  width: 97%;
  height: 44px;
  font-size: 17px;
  display: none;
  position: relative;
  background: #fff;
  color: #000000;
  overflow: hidden;
  border: 1px solid #00365b;
  transition: all .3s;
  border-radius: 4px;
  margin: 0 auto 2%;
}

.layout_header_search .btn0511:hover {
  background: #00365b;
}

.layout_header_search .btn0511 a {
  display: block;
  padding: 11px 137px;
}


.layout_header_search .btn0511::before {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.layout_header_search .btn0511::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}


.layout_header_search .btn0511::before {
  width: 7px;
  height: 7px;
  left: 1.5rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
   transition: all .3s;
}

.layout_header_search .btn0511::after {
  left: -1rem;
  background: #00365b;
  z-index: 1;
  width: 6rem;
  height: 138%;
  border-radius: 50%;
  transform: translateY(-50%);
  transition: all .5s;
}

.layout_header_search .btn0511 span {
    transition: all .3s;
    z-index: 3;
    letter-spacing: .03em;
  }

.layout_header_search .btn0511:hover span {
    position: relative;
    color: #fff;
  }

.layout_header_search .btn0511::after span {
    right: 0;
    width: 120%;
    border-radius: 0;
  }

  .layout_header_search {
    float: left;
    width: 540px;
    margin-left: -4px;
    padding-top: 16px;
  }


  .layout_header_form_input {
    width: 448px;
    margin: 0 auto 2%;
    display: block;
    height: 36px;
    font-size: 14px;
    color: #444444;
    border: 1px solid #C8C7C6;
    border-radius: 0px;
    text-align: center;
  }


  .layout_header_form_button {
    background-size: 22px 22px;
    width: 24px;
    height: 29px;
    /* top: -5px; */
    background-image: url(https://skmk.itembox.design/item/top/search.svg);
  }

  .layout_header_navi_logo img {
    height: 60px;
    }

  .re_layout_header_form_input　{
    margin-bottom: -14px;
  }