#searchField{
      font: 500 14px "Helvetica Neue", "Noto Sans JP", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Arial, メイリオ, Meiryo, sans-serif;
    }
    #searchField .searchField__heading{
      padding: 8px 10px;
      margin-bottom: 10px;
      background: #9e2730;
    }
    #searchField .searchField__ttl{
      line-height: 1;
      color: #fff;
      font-size: 14px;
      font-weight: bold;
    }
    #searchField .searchField__item + .searchField__item{
      margin-top: 8px;
    }
    #searchField .searchField__item + .searchField__item--opt{
      margin-top: 12px;
      text-align: right;
    }
    #searchField .searchField__label{
      line-height: 1;
      font-size: 12px;
    }
    #searchField .searchField__field{
      position: relative;
    }
    #searchField .searchField__field > input{
      padding: 5px 25px 5px 5px;
      width: 100%;
      border: solid 1px #666;
    }
    #searchField .searchField__btn{
      position: absolute;
      top: 0;
      bottom: 0;
      right: 8px;
      height: 19px;
      margin: auto 0;
    }
    #searchField .searchField__btn > img{
      vertical-align: top !important;
    }
    #searchField .searchField__reset{
      position: relative;
      display: inline-block;
      padding-left: 1.5em;
      color: #052674;
      text-decoration: underline;
      line-height: 1;
      font-size: 14px;
    }
    #searchField .searchField__reset:hover{
      color: #f79494;
      text-decoration: underline;
    }
    #searchField .searchField__reset::before{
      content: "\f0e2";
      display: block;
      position: absolute;
      top: 50%;
      left: 0;
      color: #9f2532;
      font-family: FontAwesome;
      transform: translateY(-50%) rotate(90deg);
    }
    #searchField .js_searchField__hide{
      display: none;  
    }
    #resultSearch{
      position: relative;
    }
    #resultSearch a{
      color: inherit;
    }
    #resultSearch .resultSearch__body--result{
      font: 500 14px "Helvetica Neue", "Noto Sans JP", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Arial, メイリオ, Meiryo, sans-serif;
    }
    #resultSearch .resultSearch__heading{
      position: relative;
      margin-bottom: 20px;
      padding-left: 40px;
      border-top: 3px solid #9E2730;
      border-bottom: 1px solid #ccc;
      line-height: 36px;
    }
    #resultSearch .resultSearch__heading::after{
      content: url("/resource/img/middle/middle_lineup.jpg");
      position: absolute;
      top: 0;
      left: 0;
    }
    #resultSearch .resultSearch__ttl{
      font-size: 20px;
      font-weight: bold;
    }
    #resultSearch .resultSearch__num{
      margin-bottom: 12px;
      text-align: right;
    }
    #resultSearch .resultSearch__item{
      line-height: 1.6;
      font-size: 14px;
    }
    #resultSearch .resultSearch__item + .resultSearch__item{
      margin-top: 16px;
    }
    #resultSearch .resultSearch__target{
      position: relative;
      display: block;
      padding-left: 1.5em;
      color: #052674;
      text-decoration: underline;
    }
    #resultSearch .resultSearch__target:hover{
      color: #f79494;
      text-decoration: underline;
    }
    #resultSearch .resultSearch__target::before{
      content: "▲";
      display: block;
      position: absolute;
      top: 50%;
      left: 0;
      color: #9f2532;
      transform: translateY(-50%) rotate(90deg);
    }
    #resultSearch .resultSearch__body.pageToggle-enter-active{
      transition: 1s opacity, 1s transform;
    }
    #resultSearch .resultSearch__body.pageToggle-leave-active{
      position: absolute;
      opacity: 0;
    }
    #resultSearch .resultSearch__body.pageToggle-enter{
      transform: translateY(100px);
      opacity: 0;
    }
    #resultSearch .listToggle-leave-active, #resultSearch .listToggle-enter-active{
      transition: 1s opacity, 1s transform;
    }
    /*#resultSearch .listToggle-leave-active{
      position: absolute;
    }*/
    #resultSearch .listToggle-enter, #resultSearch .listToggle-leave-to{
      transform: translateY(100px);
      opacity: 0;
    }
    #resultSearch .listToggle-move{
      transition: 1s transform;
    }
    #resultSearch .resultSearch__loader,
    #resultSearch .resultSearch__loader:before,
    #resultSearch .resultSearch__loader:after {
      border-radius: 50%;
    }
    #resultSearch .resultSearch__loader {
      color: #9e2730;
      font-size: 10px;
      text-indent: -99999em;
      margin: 0 auto;
      position: relative;
      width: 2em;
      height: 2em;
      box-shadow: inset 0 0 0 4px;
      transform: translateZ(0);
    }
    #resultSearch .resultSearch__loader:before,
    #resultSearch .resultSearch__loader:after {
      position: absolute;
      content: '';
    }
    #resultSearch .resultSearch__loader:before {
      width: 1.2em;
      height: 2.2em;
      background: #fff;
      border-radius: 2.2em 0 0 2.2em;
      top: -.1em;
      left: -.1em;
      transform-origin: 1.2em center;
      animation: resultSearchLoading 2s infinite ease 1.5s;
    }
    #resultSearch .resultSearch__loader:after {
      width: 1.2em;
      height: 2.2em;
      background: #fff;
      border-radius: 0 2.2em 2.2em 0;
      top: -.1em;
      left: 1.1em;
      transform-origin: 0 1.1em;
      animation: resultSearchLoading 2s infinite ease;
    }
    @keyframes resultSearchLoading {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }
    #resultSearch[v-cloak]{
      display: none;
    }