/*　search */

/*------------------------------
	PC
------------------------------*/

@media screen and (min-width: 768px) {
    .section1{
        padding-top: 25px;
        padding-bottom: 90px;
    }
    .section1 h2{
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 4.8rem;
        color: #FFFFFF;
        text-align: center;
    }
    .section1 .txt{
        color: #FFFFFF;
        text-align: center;
        padding-bottom: 2.0rem;
    }
    .section1 .pickup{
        width: 100%;
        float: left;
        margin-left:20px;
    }
    .section1 .pickup:nth-of-type(2){
        float: right;
    }
    .section1 .pickup h3{
	    width:96%;
        text-align: center;
        color: #FFFFFF;
        font-size: 2.4rem;
        font-family: 'Roboto Condensed', sans-serif;
        padding-bottom: 1.0rem;
    }
    
    .section1 .pickup .slider-item {
        max-width:100%;
        overflow: hidden;
        opacity: 0;
        transition: 3s;
    }
    
    .section1 .pickup .slick-initialized {
        opacity: 1
    }

    .section1 .pickup dl{
        width: 230px;
        margin-right: 20px;
        float: left;
    }
    .section1 .pickup dl:nth-last-child(1) {
        margin-right: 0;
    }
    .section1 .pickup dt{
        background: #CECECE;
        text-align: center;
        color: #F61A0B;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.4;
        height: 172px;
        width:220px;
        overflow: hidden;
        position: relative;
    }
    .section1 .pickup dt p{
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          width: 100%;
          height: auto;
    }
    .section1 .pickup dt img {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          width: auto;
          height: 100%;
   }
    .section1 .pickup dd{
        background: #FFFFFF;
        padding-top: 15px;
        padding-bottom: 15px;
        padding-left: 15px;
        font-size: 1.2rem;
    }
    
    .section1 .pickup .reserve{
        background: rgba(93,93,93,0.7);
        background-blend-mode: multiply;
        position: relative;
        width: 100%;
        height: 100%;
    }
    .section1 .pickup .reserve p{
        color: #FFFFFF;
        position: absolute;
        font-size: 2.2rem;
        width: 100%;
        top: 72%;
    }
    .section1 .pickup .reserve p{
        color: #FFFFFF;
        position: absolute;
        font-size: 2.0rem;
        width: 100%;
        top: 70%;
    }
    
    .section1 .pickup .fa_agreement{
        background: url(../img/agreement.png) no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 40px;
        height: 45px;
        top: 20%;
        left: 42%;
    }
    
    .section1 .pickup dd .button {
        width: 93%;
        height: 35px;
        border-radius: 50px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        margin-top: 1.0rem;
        margin-right: auto;

    }
    .section1 .pickup dd .button a {
        font-size: 1.4rem;
        line-height: 31px;
        text-align: left;
        text-indent: 2.5rem  
    }
    .section1 .pickup dd .button a:hover {
      background-color: #FFFFFF;
      color: #276d7a;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
    }
    .category_wrap{width:1000px; margin:-50px auto;}
    input[type="radio"]{display:none;}
    .category_area{font-size:0; margin:0;}
    .category_area label{width:150px; display:inline-block; padding:15px 0; color:#444444; background:#E4E4E4; text-align:center; font-size:1.4rem; cursor:pointer; transition:ease 0.2s opacity; margin-right: 3px; font-weight: 700;} 
    .category_area label:hover{opacity:0.9;}
    .panel_area{background:#FFFFFF; }
    .category_panel{width:100%; padding:20px 0; display:none;}
    .category_panel p{font-size:1.4rem;}

    #category1:checked ~ .category_area .category1_label{background:#FFFFFF;}
    #category1:checked ~ .panel_area #panel1{display:block;}
    #category2:checked ~ .category_area .category2_label{background:#FFFFFF;}
    #category2:checked ~ .panel_area #panel2{display:block;}
    #category3:checked ~ .category_area .category3_label{background:#FFFFFF;}
    #category3:checked ~ .panel_area #panel3{display:block;}
    #category4:checked ~ .category_area .category4_label{background:#FFFFFF;}
    #category4:checked ~ .panel_area #panel4{display:block;}
    #category5:checked ~ .category_area .category5_label{background:#FFFFFF;}
    #category5:checked ~ .panel_area #panel5{display:block;}
    
    .requirements_btn{
        float: left;
        width: 22%;
        cursor:pointer;
        color: #FFFFFF;
        font-weight: 700;
        background: #276d7a;
        line-height: 3;
        text-align: center;
        border: 3px solid #276d7a;
        display: none;
    }
    .requirements_btn.open{
        color: #276d7a;
        background: #FFFFFF;
    }
    .pageNav{
        float: right;
        width: 70%;
        text-align: right;
    }
    .pageNav ul{
        zoom: 1;
        overflow: hidden;
        background: #FFFFFF;
        text-align: right;
    }

    .pageNav li {
        display:inline-block; 
        zoom:1;
    }
    .pageNav li span,
    .pageNav li a {
        float: left;
        padding: 5px 12px;
        background: #FFFFFF;
        border: 1px solid #276d7a;
        color: #276d7a;
        text-decoration: none;
        border-radius: 3px; 
    }
    .pageNav li span {
        background: #276d7a;
        color: #FFFFFF;
    }
    .pageNav li a:hover {
        background: #276d7a;
        border-color: #276d7a;
        color: #FFFFFF;
    }
    .inventoryTit{
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 1.6rem;
    }
    .inventoryTit span{
        font-size: 1.4rem;
        padding-left: 2.0em;
        border-left: 1px solid #666666;
    }
    .search_cate{
        font-size: 0;
        margin-top: 20px;
    }
    .search_cate li{
        font-size: 0;
        display: inline-block;
        margin-right: 6px;
        margin-bottom: 6px;
    }
    .search_cate li:nth-child(6n){
        margin-right: 0;
    }
    .sub_search{
        margin-top: 20px;
    }
    .sub_search dt,.sub_search dd{
        float:left;
        margin-bottom: 10px;
    }
    .sub_search dt{
        width: 220px;
        font-weight: 700;
        text-indent: 2.0em;
    }
    .sub_search dd{
        width: 760px;
        font-size: 1.6rem;
    }
    .search_num{
        display: inline;
        font-size: 1.8rem;
        font-weight: 700;
        vertical-align: middle;
    }
    .search_num span{
        font-size: 4.8rem;
        padding-right: 1.5rem;
        padding-left: 1.5rem;
    }
    .search_button{
        display: inline;
        vertical-align: middle;
        margin-left: 30px;
    }
    .search_button input{
        margin-top: 30px;
    }
    .panelNavArea{
        display: block;
        clear: both;
        padding-top: 0;
    }
    .tabcontent{
        clear: both;
    }
    .tab01,.tab02{
        display: none;
    }
    .tabnavi{
        margin-left: 900px;
        height: 50px;
    }
    .tabnavi li{
        display: inline-block;
    }
    .gritView .list_block{
        display: inline-block;
        font-size: 0;
        width: 300px;
        margin-right: 12px;
        margin-bottom: 50px;
        background: #F3F3F3;
        border: 1px solid #D2D6DA;
        padding-bottom: 3.0rem;
        position: relative;
    }
    .gritView .list_block:nth-of-type(4n) {
        margin-right: 0;
    }
    .gritView .list_block h3{
        background: #333333;
        color: #FFFFFF;
        text-align: center;
        font-size: 1.2rem;
        font-weight: 700;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }
    .gritView .list_block h3 span{
        color: #FFF100;
    }
    .gritView .list_block .aboutList{
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        height:30px;
    }
    .gritView .list_block .aboutList ul {
        display: table;
        table-layout: fixed;
        text-align: center;
        width: 100%;
        border-spacing:2px 0;
    }
    .gritView .list_block .aboutList li {
        display: table-cell;
        vertical-align: middle;
        color: #276d7a;
        font-size: 1.2rem;
        padding: 0.3rem 0;
        border: 2px solid #276d7a;
        margin-right: 2px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }
    .gritView .list_block .photo{
        text-align: center;
        color: #333333;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.4;
        height: 180px;
        width: 235px;
        overflow: hidden;
        position: relative;
    }
    .gritView .list_block .photo p.text{
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100%;
        height: auto;
    }
    .gritView .list_block .photo .area{
        background: rgba(93,93,93,0.8);
        position: absolute;
        bottom: 0;
        height: 30px;
        color: #FFFFFF;
        text-align: center;
        line-height: 30px;
        width: 100%;
    }
    .gritView .list_block .photo img {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          /* 画像をフィット heigth基本 */
          width: auto;
          height: 100%;
   }
    .gritView .list_block dl{
        width: 94%;
        margin-right: auto;
        margin-left: auto;
        margin-top: 1.0rem;
    }
    .gritView .list_block dt{
        width: 35%;
        float: left;
        font-size: 1.2rem;
        vertical-align: middle;
    }
    .gritView .list_block dd{
        width: 65%;
        float: left;
        font-size: 1.4rem;
        font-weight: 700;
        line-height: 1.3;
    }
    .gritView .list_block dt.price{
        line-height: 2.5rem;
        color: #FFFFFF;
        background: #276d7a;
    }
    .gritView .list_block dd.price{
        line-height: 2.5rem;
        color: #FFFFFF;
        background: #276d7a;
    }
    
    .gritView .list_block .button {
        border-radius: 50px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        height: 36px;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        position: absolute;
        right: 0;
        left:0;
        margin: auto;
        bottom: -20px;
    }
    .gritView .list_block .button a {
        line-height: 31px;
    }
    .gritView .list_block .button a:hover {
      background-color: #FFFFFF;
      color: #276d7a;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
    }
    .gritView .list_block .reserve{
        background: rgba(93,93,93,0.7);
        background-blend-mode: multiply;
        position: relative;
        width: 100%;
        height: 150px;
    }
    .gritView .list_block .fa_agreement{
        background: url(../img/agreement.png) no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 40px;
        height: 45px;
        top: 25%;
        left: 42%;
    }
    .gritView .list_block .fa_truck{
        background: url(../img/truck.png) no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 61px;
        height: 47px;
        top: 20%;
        left: 35%;
    }
    .gritView .list_block .reserve p{
        color: #FFFFFF;
        position: absolute;
        font-size: 2.4rem;
        width: 100%;
        top: 65%;
    }
    .gritView .list_block .contracted{
        background: rgba(93,93,93,0.7);
        position: relative;
        width: 100%;
        height: 150px;
    }
    .gritView .list_block .contracted p{
        color: #FFF100;
        position: absolute;
        font-size: 2.4rem;
        width: 100%;
        top: 40%;
    }
    .gritView .list_block .contracted p span{
        font-size: 1.4rem;
        display: block;
    }
    .gritView .list_block .backOrdered p{
        color: #333333;
        position: absolute;
        font-size: 2.4rem;
        width: 100%;
        top: 50%;
    }
    .listView .list_block{
        width: 100%;
        margin-bottom: 30px;
        background: #F3F3F3;
        border: 1px solid #D2D6DA;
        position: relative;
    }
    .listView .list_block .photo{
        text-align: center;
        color: #333333;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.4;
        height: 160px;
        width: 190px;
        overflow: hidden;
        position: relative;
        
    }
    .listView .list_block .photo .area{
        background: rgba(93,93,93,0.8);
        position: absolute;
        bottom: 0;
        height: 30px;
        color: #FFFFFF;
        text-align: center;
        line-height: 30px;
        width: 100%;
    }
    .listView .list_block .photo img {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          width: 120%;
          height: auto;
   }
    .listView .list_block dl{
        width: 570px;
        position: absolute;
        left: 210px;
        top: 15px;
        font-size: 0;
    }
    .listView .list_block dt{
        display: inline-block;
        font-size: 1.4rem;
        vertical-align: top;
        width: 15%;
    }
    .listView .list_block dd{
        display: inline-block;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.3;
        width: 35%;
        vertical-align: top;
    }
    .listView .list_block .aboutList{
        position: absolute;
        right: 10px;
        top: 30px;
        width: 220px;
    }
    .listView .list_block .aboutList ul {
        display: table;
        table-layout: fixed;
        text-align: center;
        width: 100%;
        border-spacing:2px 0;
    }
    .listView .list_block .aboutList li {
        display: table-cell;
        vertical-align: middle;
        color: #276d7a;
        font-size: 1.2rem;
        padding: 0.3rem 0;
        border: 2px solid #276d7a;
        margin-right: 2px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }
    
    .listView .list_block .aboutList.price{
        top: 10px;
    }
    
    .listView .list_block .aboutList .price{
        margin-top:10px;
        margin-left:2px;
        margin-right:2px;
        text-align: center;
        color: #FFFFFF;
        background: #276d7a;
    }
    
    .listView .list_block h3{
        background: #333333;
        color: #FFFFFF;
        font-size: 1.8rem;
        font-weight: 700;
        padding-top: 1.2rem;
        padding-bottom: 1.2rem;
        position: absolute;
        width: 810px;
        bottom: 0;
        left: 190px;
        text-indent: 2.0rem
    }
    .listView .list_block h3 span{
        color: #FFF100;
    }
    .listView .list_block .button {
        border-radius: 50px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        height: 36px;
        width: 20%;
        margin-right: auto;
        margin-left: auto;
        position: absolute;
        right: 10px;
        margin: auto;
        bottom: 10px;
    }
    .listView .list_block .button a {
        line-height: 31px;
        background: #FFFFFF;
        color: #276d7a;
        text-align: left;
        text-indent: 2.5rem;
        border-radius: 50px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
    }
    .listView .list_block .button a:hover {
      background-color: #276d7a;
      color: #FFFFFF;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
    }
    .listView .list_block .arrowNext a:before {
        background: #276d7a;
    }
    .listView .list_block .arrowNext a:after {
        background: #FFFFFF;
    }
    .listView .list_block .arrowNext a:hover:before {
        background: #FFFFFF;
    }
    .listView .list_block .arrowNext a:hover:after {
        background: #276d7a;
    }
    .listView .list_block .reserve{
        background: rgba(93,93,93,0.7);
        background-blend-mode: multiply;
        position: relative;
        width: 100%;
        height: 110px;
    }
    .listView .list_block .reserve p{
        color: #FFFFFF;
        position: absolute;
        font-size: 2.2rem;
        width: 100%;
        top: 72%;
    }
    .listView .list_block .reserve p{
        color: #FFFFFF;
        position: absolute;
        font-size: 2.0rem;
        width: 100%;
        top: 70%;
    }
    .listView .list_block .contracted{
        background: rgba(93,93,93,0.7);
        position: relative;
        width: 100%;
        height: 110px;
    }
    .listView .list_block .contracted p{
        color: #FFF100;
        position: absolute;
        font-size: 2.2rem;
        width: 100%;
        top: 35%;
    }
    .listView .list_block .contracted p span{
        font-size: 1.4rem;
        display: block;
    }
    .listView .list_block .backOrdered p{
        color: #333333;
        position: absolute;
        font-size: 2.2rem;
        width: 100%;
        top: 52%;
    }
    .listView .list_block .fa_agreement{
        background: url(../img/agreement.png) no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 40px;
        height: 45px;
        top: 20%;
        left: 42%;
    }
    .listView .list_block .fa_truck{
        background: url(../img/truck.png) no-repeat;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 61px;
        height: 47px;
        top: 15%;
        left: 35%;
    }
    hr{
        border-top: 5px solid #333333;
        padding-top: 20px;
        border-bottom: none;
        border-right: none;
        border-left: none;
    }
    button {
        padding: 0;
        border: none;
        background: transparent;
    }

    button img {
        display: block;
    }
    .photo .favorite_off {
        background-image: url('../img/favorite_off.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 5%;
        left: 5%;
        width: 15%;
        height: 15%;
        z-index:10;
    }
    .photo .favorite_on {
        background: url('../img/favorite_on.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 5%;
        left: 5%;
        width: 15%;
        height: 15%;
        z-index:10;
    }




}


/*------------------------------
	SP
------------------------------*/
@media screen and (max-width: 767px) {
    .tabcontent{
        clear: both;
    }
    .tab01,.tab02{
        display: none;
    }
    .tabnavi{
        margin-left:3%;
        height: 50px;
    }
    .tabnavi li{
        display: inline-block;
    }

	.section1 .pickup{

        margin-left:25px;
    }

    .section1 .pickup dt img {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          width: auto;
          height: 100%;
   }
   
 .category_wrap{width:100%; margin:3em auto;}
    .cat_area{
         overflow:hidden;
         display:table;
         margin:0;
         width: 100%;
        font-size: 0;
     }

    .cat_area li{
    width:19.2%; line-height: 1.2; display:inline-block; padding:0.7em 0; color:#444444; background:#E4E4E4; text-align:center; font-size:3vw; cursor:pointer; transition:ease 0.2s opacity;font-weight: 700; margin-right: 1%; vertical-align: middle; height: 6vw;
     }
    .cat_area li:nth-of-type(3){
        /*padding-top: 1.2em;*/
        /*padding-bottom: 0.2em;*/
    }
    .cat_area li:nth-of-type(5){
        margin-right: 0;
        letter-spacing: -1px;
    }
    .cat_area li.select{
         background-color:#276d7a; 
        color: #FFFFFF;
     }
    .hide{
        display:none;
        }

}


/* 20190607 */
.font-color		{color:#cc0000; font-weight:bold;}

@media screen and (orientation:landscape) {
.phone_panel{display:none;}
    
}