@charset "utf-8";

/************************************************************************************
smaller than 960 TB
*************************************************************************************/
@media screen and (max-width: 960px) {
  /* --------------------------------
   contentsArea 検索ページのみ左サイドバーなので、layout.css の定義をオーバーライド
   ----------------------------------*/
  .col2SearchLayout #mainContentsBlock {
    float: none;
    /*margin-right: 0;*/
    margin-left: 0;
  }
  .col2SearchLayout #mainContents {
    /*margin-right: 0;*/
    margin-left: 0;
  }
  .col2SearchLayout #subContentsBlock {
    float: none;
    width: auto;
    margin-bottom: 40px;
  }


  /* tbでは共通の左右余白、spで#mainContentsのみ余白なしに戻る。layout.css の #mainContents に合わせる */
  .col2SearchLayout #searchBlockWrap,
  .col2SearchLayout #subContentsBlock,
  .col2SearchLayout #mainContents {
    padding-right: 15px;
    padding-left: 15px;
  }

  #searchBlockWrap {
    margin-bottom: 30px;
  }

  /*searchBlockWrap*/
  #searchBlockGrid,
  #searchBlockRefineGrid {
    float: left;
    width: 100%;
  }
  #searchBlockGrid {
    padding-right: 0;
  }
  #searchBlockRefineGrid {
    padding-left: 0;
  }
  .col2SearchLayout #searchBlockInner #searchPart,
  #searchBlockInnerRefine #searchPartRefine {
    float: left;
    margin-left: 30px;
  }

  #searchResultRelateInner ul li {
    width: 48%;
  }
  #searchResultRelateInner ul li img {
    width: 50%;
  }


  /*subContentsBlock*/
  #subContentsBlock #searchSetting .sideSection ul li {
    display: inline;
  }
  #subContentsBlock #searchSetting .searchScopeBox {
    padding: 5px 5px 5px 15px;
  }
  #subContentsBlock #searchSetting .searchOptionScope dl dd > ul {
       -moz-column-count: 2;
    -webkit-column-count: 2;
            column-count: 2;
  }
  #subContentsBlock #searchSetting .searchOptionScope ul li {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
  }
  #subContentsBlock #searchSetting .searchOptionRange select {
    padding: 0 0.4em;
  }

  /*searchResultDataSingle*/
  .resultImgWrap {
    width: 13%;
  }
  .resultTextGridTop,
  .resultTextGridBottom {
    width: 82%;
    margin-left: 13%;
    padding-left: 5%;
  }


  /*Pager*/
  .pagerList li {
    display: inline-block;
    padding: 0;
    vertical-align: middle;
  }
  .pagerList li.pagerListPrev,
  .pagerList li.pagerListNext {
    max-width: 7em;
  }
  .pagerList li.pagerListNumber {
    width: 59%;
  }
  .pagerList li.pagerListNumber li {
    width: 8%;
  }

  /* 共通検索ヘルプページ用 notice-search.html */
  .searchHelpScreenshot {
    margin-right: 10px;
  }
}

/************************************************************************************
smaller than 768 TB
*************************************************************************************/
@media screen and (max-width: 768px) {
  /*searchResultDataSingle*/
  .resultImgWrap {
    width: 17%;
  }
  .resultTextGridTop,
  .resultTextGridBottom {
    width: 78%;
    margin-left: 17%;
    padding-left: 5%;
  }

  /* 共通検索ヘルプページ用 notice-search.html */
  .searchHelpScreenshot,
  .searchHelpGuide {
    float: none;
    display: block;
    margin: 0 auto 30px;
  }
}


/************************************************************************************
larger than 641 TB only search SPで折りたたみメニューが一度折りたたまれた後、
                               再度TB以上になった場合にメニューが非表示になってしまうのを回避
*************************************************************************************/
@media screen and (min-width: 641px) {
  #subContentsBlock #searchSetting {
    display: block !important;
  }
}


/************************************************************************************
smaller than 640 SP
*************************************************************************************/
@media screen and (max-width: 640px) {
  /*form*/
  .col2SearchLayout #searchBlockInner #searchPart,
  #searchBlockInnerRefine #searchPartRefine {
    float: none;
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }
  .col2SearchLayout #searchBlock input.search {
    width: 75%;
  }
  #searchBlockRefine input.searchRefineText {
    width: 40%;
  }
  #searchBlockRefine select.searchRefineSelect {
    width: 47%;
  }

  /* tbで余白をつけたものをspでは戻す */
  .col2SearchLayout #mainContents {
    padding-right: 0;
    padding-left: 0;
  }

  /*#subContentsBlock*/
  .col2SearchLayout #subContentsBlock h2 {
    /* r_layout.css の定義をオーバーライド */
    position: relative;
  }
  .col2SearchLayout #subContentsBlock h2 span {
    /* r_layout.css の定義をオーバーライド */
    display: inline-block;
  }
  #subContentsBlock #rsvSearchSetting {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    margin: 0;
    padding: 0;
    cursor: pointer;
  }
  #subContentsBlock #searchSetting {
    position: relative;
    top: -20px;
    left: 0;
    display: none;
    zoom: 1;
    box-sizing: border-box;
    padding: 0 15px 50px;
    border: solid 3px #005bac;
    background: #fff;
  }


  #subContentsBlock #searchSetting .searchScopeBox {
    padding: 5px 0 5px 5px;
  }
  #subContentsBlock #searchSetting ul li {
    margin-bottom: 0.3em;
  }
  #subContentsBlock #searchSetting .searchOptionScope dl dd > ul {
       -moz-column-count: auto;
    -webkit-column-count: auto;
            column-count: auto;
  }
  #subContentsBlock #searchSetting .searchOptionOrder ul li,
  #subContentsBlock #searchSetting .searchOptionNumber ul li,
  #subContentsBlock #searchSetting .searchOptionRange ul li {
    display: block;
  }
  #subContentsBlock #searchSetting .searchOptionSize ul,
  #subContentsBlock #searchSetting .searchOptionPdf ul {
    display: table;
    margin-left: 15px;
    table-layout: fixed;
    width:100%;
  }
  #subContentsBlock #searchSetting .searchOptionSize ul li,
  #subContentsBlock #searchSetting .searchOptionPdf ul li {
    display: table-cell;
  }
  #subContentsBlock #searchSetting .searchOptionRange {
    border-bottom: none !important;
  }
  #subContentsBlock #rsvSearchBtn {
    display: block;
    text-align: center;
  }

  #searchResultRelateInner ul li img {
    width: 60%;
  }

  .searchResultDataSingle {
    border-bottom: 1px dotted #ccc;
  }
  #searchResultDataInner {
    border-bottom: none; /* SPデザインのみ各ブロックごとにborder-bottomが付くため */
  }

  .resultTextGridBottom {
    float: none;
    clear: both;
    width: 100%;
    margin-bottom: 20px;
    margin-left: 0;
    padding-top: 0.8em;
    padding-left: 0;
  }

  /*#pager*/
  .pagerList li.pagerListNumber {
    width: 48%;
  }
  .pagerList li.pagerListNumber li {
    width: 17%;
  }
}

/************************************************************************************
smaller than 480 SP only search
*************************************************************************************/
@media screen and (max-width: 480px) {
  /*form*/
  .col2SearchLayout #searchBlock input.search {
    width: 87%;
    margin-right: 0;
  }
  .col2SearchLayout #searchBlock input.search,
  #searchBlockRefine input.searchRefineText {
    margin-bottom: 10px;
  }

  #searchBlockRefine input.searchRefineText {
    width: 77%;
  }
  #searchBlockRefine select.searchRefineSelect {
    width: 92%;
  }
  #searchBlockRefine select.searchRefineSelect {
    margin-left: 0;
  }
  #searchBlockRefine span {
    vertical-align: text-bottom;
  }


  /*#pager*/
  .pagerList li.pagerListNumber {
    width: 100%;
    margin-bottom: 10px;
  }
}

/************************************************************************************
smaller than 360 SP
*************************************************************************************/
@media screen and (max-width: 360px) {
}

/************************************************************************************
smaller than 320 SP
*************************************************************************************/
@media screen and (max-width: 320px) {
}
