@charset "UTF-8";
/* ==========================================================================
//
// TABLET & SMARTPHONE
//
========================================================================== */
@media screen and (max-width:1024px) {
  
  /* ========================================================================
  // area_page_main
  ======================================================================== */
  .area_page_main {
    padding: 0 0 30px;
}

  /* box_txt_overview
  -------------------------------------------------------- */
  .box_txt_overview {
    width: 45%;
    margin: 0 auto;
    padding: 150px 0 0;
  }
  .box_txt_overview .ttl_01 {
    font-size: 26px;
  }
  .box_txt_overview .txt_01 {
    width: 100%;
    font-size: 16px;
    margin: 0 0 35px;
  }
  .box_txt_overview .box_page_list {
    font-size: 18px;
    display: block;

  }
  .box_txt_overview .box_page_list li {
    margin: 0 0 20px;
  }
  .box_img_overview {
    background-image: url("/usedparts/img/img_usedparts_main_01.png");
    background-position: left center;
    background-repeat:no-repeat;
    background-size: 130%;
    width: 50%;
    position: relative;
    height: 350px;
    margin: 100px 0 0 auto;
    padding-bottom: 100px;
  } 
  .box_img_overview img {
    position: absolute;
    top: 28%;
    left: 25%;
    padding: 0;
    animation: anim_page_main 1s;
    width: 70%;
  }
  @keyframes anim_page_main {
    0% {
    transform: translateX(100px);
    opacity: 0;
    }
    100% {
    transform: translateX(0px);
    opacity: 1;
    }
  }
    /* btn_orange
  -------------------------------------------------------- */
  .btn_orange_01 {
    width: 100%;
    margin: 30px 0 0;
  }


  /* ========================================================================
  // area_parts_guide
  ======================================================================== */
  .area_parts_guide {

    background-size: 50%;
    padding: 80px 0;
  } 
  .box_parts_guide {
    width: 90%;
    display: block;
  }
  .box_parts_guide .box_ttl {
    font-size: 27px;
  }
  .box_parts_guide .box_ttl p {
    line-height: 1.5;
    margin: 0 0 30px;
  }
  .box_parts_guide .box_features {
    width: 680px;
  }
  .box_parts_guide .box_features .txt_ttl {
    font-size: 27px;
    font-weight: 700; 
    line-height: 1.6;
    color: #F56600;
    margin: 0 0 30px;
  }
  .box_parts_guide .box_features .list_features {
    margin: 0 0 40px;
  }
  .box_parts_guide .box_features .list_features li {
    background-color: #F56600;
    color: #ffffff;
    font-size: 20px;
    border-radius: 6px;
    margin: 0 0 7px;
    padding: 20px 20px 20px 65px;
    position: relative;
  }
  .box_parts_guide .box_features .list_features li:before {
    width: 24px;
    height: 24px;
    background-color: #ffffff;
    color: #F56600;
    position: absolute;
    border-radius: 30px;
    top: 8px;
    left: 10px;
    text-align: center;
    padding: 10px;
  }
  .box_parts_guide .box_features .list_features li:first-child:before{
    content: "01";
  }
  .box_parts_guide .box_features .list_features li:nth-child(2):before{
    content: "02";
  }
  .box_parts_guide .box_features .list_features li:nth-child(3):before{
    content: "03";
  }
  .box_parts_guide .box_features p {
    margin: 0 0 80px;
  }
  .box_parts_guide .box_features dl {
  }
  .box_parts_guide .box_features dl dt {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 15px;
  }
  .box_parts_guide .box_features dl dd {
    line-height: 1.6;
    margin: 0 0 30px;
  }

  
  
  /* ========================================================================
  // area_product
  ======================================================================== */
  .area_product {
    background-image: none !important;
    padding: 0 0 100px;
  }


  /* box_top
  -------------------------------------------------------- */
  .box_top {
    display: block;
    position: relative;
    background-position: top right;
    background-size: 30%;
 }
  .box_top_txt {
    display: block !important;
    width: 90%;
    margin: 0 auto;
    padding: 60px 0 0;
    position: relative;
}
  .box_top_txt .ttl_02 {
    font-size: 26px;
    margin: 0 0 25px;
  }
  .box_top_txt .list_product {
    padding: 20px 0 5px 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 50%;
    margin: 0 0 0 25px;
    z-index: 100;
  }
  @media screen and (max-width:1000px) {
    .box_top_txt .list_product {
      width: 50%;
    }
  }
  @media screen and (max-width:860px) {
    .box_top_txt .list_product {
      width: 60%;
    }
  }
  @media screen and (max-width:768px) {
    .box_top_txt .list_product {
      width: 70%;
      margin: 0 0 0 0;
    }
  }
  @media screen and (max-width:625px) {
    .box_top_txt .list_product {
      width: 80%;
    }
  }
  @media screen and (max-width:550px) {
    .box_top_txt .list_product {
      width: 100%;
    }
  }

  .box_top_txt .list_product ul {
    margin: 0 0 30px;
  }
  .box_top_txt .list_product li {
    width: auto;
    margin: 0 20px 15px 0;
  }
  @media screen and (max-width:1000px) {
    .box_top_txt .list_product li {
      font-size: 14px;
    }
  }
  .box_top_img {
    width: 100%;
    background-position: top right -100%;
    background-size: 80%;
    margin: -350px 0 0 0;
    padding: 0 0 50px;
  } 
  @media screen and (max-width:768px) {
    .box_top_img {
      margin: -300px 0 0 0;
    }
  }
  .box_top_img img {
    padding: 10% 0 0 50%;
    width: 40%;
    height: auto;
}

  /* box_bottom
  -------------------------------------------------------- */
  .box_bottom {
    display: block;
    position: relative;
  }
  .box_bottom_txt {
    display: block !important;
    width: 80%;
    padding: 0 0 0 0;
    margin: -150px 0 0 auto;
    z-index: 100;
    color: #ffffff;
    background-image: none !important;
  }
  @media screen and (max-width:660px) {
    .box_bottom_txt {
      width: 90%;
      margin: 0 auto 0 auto;
    }
  }
  .box_bottom_txt .ttl_02 {
    font-size: 26px;
    font-weight: 500;
    text-align: right;
    padding: 0 50px 0 0;
  }
  @media screen and (max-width:660px) {
    .box_bottom_txt .ttl_02 {
      text-align: left;
    }
  }
  .box_bottom_txt .list_product {
    border-left:1px solid #ffffff;
    padding: 30px 0 10px 30px;
    display: flex;
    flex-wrap: wrap;
    width: 690px;
    margin: 0 0 0 25px;
    z-index: 100;
  }
  @media screen and (max-width:700px) {
    .box_bottom_txt .list_product {
      width: 100%;
      margin: 0;
    }   
  }
    .box_bottom_txt .list_product ul {
      margin: 0 0 30px;
  }

  .box_bottom_txt .list_product li {
    width: auto;
    margin: 0 50px 15px 0;
  }
  @media screen and (max-width:1000px) {
    .box_bottom_txt .list_product li {
      font-size: 14px;
    }
  }
  .box_bottom_img {
    /*border: 1px solid #000;*/
    width: 100%;
    background-position: top left -100%;
    background-size: 80%;
    text-align: right;
    position: relative;
    margin: -70px 0 0 0;
    padding: 0 0 100px;
  }  
  .box_bottom_img img {
    padding: 2% 60% 0 0;
    width: 45% ;
    height: auto;
}

  
  
  /* ========================================================================
  // area_partsstorage
  ======================================================================== */

  .area_partsstorage {
  }



  /* ========================================================================
  // area_slider
  ======================================================================== */

  .area_slider {
  }
  .box_slider {
    width: 90%;
    margin: 0 auto;
    padding: 100px 0 50px;
}

  /* box_txt
  -------------------------------------------------------- */
  .box_txt {
    width: 100%;
    position: relative;
    z-index: 1;
  }
  .box_txt .ttl_sub {
    font-size: 26px;
    margin: 0 0 20px;
  }
    
    
  /* box_slider
  -------------------------------------------------------- */
  .box_slider {
  }
  .slider {
    margin: 0 0 50px;
    width: 100%;
    min-width:100%; 
    max-width: 100%;
    position: static;
    padding: 80px 0;
    z-index: 0;
  }
  .slick-prev::before, .slick-next::before {
    font-size: 24px;
  }
  .center-item {
    margin: 0 0 0 0;
    display: flex;
  }
  
  
  
  /* ========================================================================
  // area_inspection
  ======================================================================== */
  .area_inspection {
    /*background-color: #91C926;*/
    padding: 100px 0 0;
  }
  .box_inspection {
    width: 90%;
    /*margin: 0 auto;
    position: relative;
    color: #ffffff;*/
  }
  .illust_inspection_01 {
    position: absolute;
    right: 0;
    top: -130px;
    width: 50%;
    height: auto;
  }
  .box_inspection dl {
  }
  .box_inspection .box_inspection_inner_01 {
    display: block;
    /*;justify-content: space-between;*/
  }
  .box_inspection .box_inspection_inner_01 dl:first-of-type {
    width: 100%;
  }
  .box_inspection .box_inspection_inner_01 dl:nth-of-type(2) {
    width: 100%;
  }
  .box_inspection .box_inspection_inner_01 > dl > dt,
  .box_inspection .box_inspection_inner_02 > dl > dt{
    font-size: 26px;
    /*font-weight: 500;*/
    margin: 0 0 25px;
  }
  .box_inspection .box_inspection_inner_01 dl dd {
    /*line-height: 1.8;
    text-align: justify;
    text-justify: inter-ideograph;*/
    margin: 0 0 50px;
  }
  .box_inspection .box_inspection_inner_01 dl dd span {
    /*font-size: 20px;
    font-weight: 500;
    display: block;
    margin: 0 0 10px;*/
  }

  .box_inspection .box_inspection_inner_02 {
    padding: 30px 0 130px;
  }
  .box_inspection .box_inspection_inner_02 dl:first-of-type {
    /*width: 100%;*/
  }
  .box_inspection .box_inspection_inner_02 dl:nth-of-type(2) {
    /*width: 100%;*/
    padding: 80px 0 0;
  }
  .box_inspection .box_inspection_inner_02 > dl > dt{
    /*text-align: center;*/
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl{
    display: block;
    /*flex-wrap: wrap;*/
    /*width: 100%;*/
  }

  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt,
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dd{
    /*box-sizing: border-box;
    padding: 25px;*/
    line-height: 1.4;
}

  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt{
    width: 100%;
    font-size: 18px;
    padding: 20px 15px 0;
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt:before{
    /*content: '';
    display: inline-block;
    width: 21px;
    height: 21px;
    background-image: url("/usedparts/img/icon_usedparts.png");
    background-size: contain;
    vertical-align: middle; 
    margin: -2px 8px 0;*/
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dd{
    width: 100%;
    /*font-size: 14px;*/
    padding: 15px 28px 20px;
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt:nth-of-type(odd),
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dd:nth-of-type(odd){
    /*background-color: #ABD026;*/
}

  
  
  
  
  
  
}
  
  
/* ==========================================================================
//
// SMARTPHONE
//
========================================================================== */
@media screen and (max-width:480px) {

  /* ========================================================================
  // area_page_main
  ======================================================================== */
  .area_page_main {
    display: block;
    padding: 0 0 0;
  }

  /* box_txt_overview
  -------------------------------------------------------- */
  .box_txt_overview {
    width: 96%;
    margin: 0 auto;
    padding: 100px 0 0;
  }
  .box_txt_overview .ttl_01 {
    font-size: 22px;
  }
  .box_txt_overview .txt_01 {
    width: 100%;
    font-size: 15px;
    margin: 0 0 35px;
  }
  .box_txt_overview .box_page_list {
    font-size: 16px;
    display: flex;
    justify-content: space-between;
  }
  .box_txt_overview .box_page_list li {
    margin: 0 0 0 !important;

  }
  .box_txt_overview .box_page_list a {
    margin: 0 0 0 !important;  }
  
  .box_txt_overview .box_page_list a:after {
    margin: 0 0 0 3px;
  }
  .box_img_overview {
    background-image: url("/usedparts/img/img_usedparts_main_01.png");
    background-position: left top;
    background-repeat:no-repeat;
    background-size: 130%;
    width: 100%;
    position: relative;
    height: 250px;
    margin: -40px 0 0 auto;
    padding-bottom: 130px;
  } 
  .box_img_overview img {
    position: absolute;
    top: 100px;
    left: 90px;
    padding: 0;
    animation: anim_page_main 1s;
    width: 70%;
  }
  @keyframes anim_page_main {
    0% {
    transform: translateX(100px);
    opacity: 0;
    }
    100% {
    transform: translateX(0px);
    opacity: 1;
    }
  }
  
  
  /* ========================================================================
  // area_parts_guide
  ======================================================================== */
  .area_parts_guide {
    background-size: 90%;
    padding: 40px 0 60px;
  } 
  .box_parts_guide {
    width: 90%;
    display: block;
  }
  .box_parts_guide .box_ttl {
    font-size: 22px;
    margin: 0 0 30px;
  }
  .box_parts_guide .box_ttl p {
    line-height: 1.5;
  }
  .box_parts_guide .box_features {
    width: 100%;
  }
  .box_parts_guide .box_features .txt_ttl {
    font-size: 22px;
    line-height: 1.4;
  }
  .box_parts_guide .box_features .list_features {
    margin: 0 0 20px;
  }
  .box_parts_guide .box_features .list_features li {
    font-size: 16px;
    padding: 10px 15px 10px 60px;
    position: relative;
    line-height: 1.4;
  }
  .box_parts_guide .box_features .list_features li:before {
    width: 22px;
    height: 22px;
    bposition: absolute;
    top: 14px;
    left: 10px;
    padding: 8px;
  }
  .box_parts_guide .box_features p {
    margin: 0 0 40px;
  }
  .box_parts_guide .box_features dl {
  }
  .box_parts_guide .box_features dl dt {
    font-size: 16px;
    margin: 0 0 10px;
  }
 .box_parts_guide .box_features dl dd {
    margin: 0 0 20px;
  }


  
  /* ========================================================================
  // area_product
  ======================================================================== */
  .area_product {
    padding: 0 0 50px;
  }

   /* slide
  -------------------------------------------------------- */
  .area_product .slide-right {
    transform: translateX(50px);
  }
  .area_product .slide-left {
    transform: translateX(-50px);
  }

  /* box_top
  -------------------------------------------------------- */
  .box_top {
 }
  .box_top_txt {
    padding: 40px 0 0;
  }
  .box_top_txt .ttl_02 {
    font-size: 22px;
    margin: 0 0 15px;
  }
  .box_top_txt .list_product {
    padding: 10px 0 5px 5px;
    width: 80%;
    margin: 0 0 0 0;
  }
  @media screen and (max-width:460px) {
    .box_top_txt .list_product {
      width: 90%;
    }
  }
  @media screen and (max-width:400px) {
    .box_top_txt .list_product {
      width: 100%;
    }
  }
  .box_top_txt .list_product ul {
    margin: 0 0 30px;
  }
  .box_top_txt .list_product li {
    width: auto;
    margin: 0 0 15px 0;
    font-size: 12px;
  }
  @media screen and (max-width:350px) {
    .box_top_img {
      margin: 0px 0 0 0 !important;
    }
  }
  .box_top_img {
    margin: -200px 0 0 0 ;
  }  


  /* box_bottom
  -------------------------------------------------------- */
  .box_bottom {
    display: block;
    position: relative;
  }
  .box_bottom_txt {
    display: block !important;
    width: 75%;
    margin: -50px auto 0;
    padding: 0px 60px 0 0;
}
  .box_bottom_txt .ttl_02 {
    font-size: 22px;
    font-weight: 500;
    text-align: left;
    margin:0 0 15px
  }
  .box_bottom_txt .list_product {
    padding: 10px 0 10px 5px;
    width: 100%;
    margin: 0 0 0 0;
  }
  .box_bottom_txt .list_product ul {
    margin: 0 0 20px;
  }
  .box_bottom_txt .list_product li {
    width: auto;
    margin: 0 30px 15px 0;
    font-size: 12px;
  }
  .box_bottom_img {
    width: 100%;
    background-position: top left -100%;
    background-size: 80%;
    text-align: right;
    position: relative;
    margin: -70px 0 0 0;
    padding: 0 0 100px;
  }  
  .box_bottom_img .img_01 {
    padding: 1% 50% 0 0;
    width: 47%;
    height: auto;
}
  .box_bottom_img .img_02 {
    display: none;

}


  
  /* ========================================================================
  // area_partsstorage
  ======================================================================== */

  .area_partsstorage {
  }



  /* ========================================================================
  // area_slider
  ======================================================================== */

  .area_slider {
    background-size: 100%;
  }
  .box_slider {
    padding: 50px 0 50px;
}

  /* box_txt
  -------------------------------------------------------- */
  .box_txt {
    position: relative;

  }
  .box_txt .ttl_sub {
    font-size: 22px;
    margin: 0 0 20px;
  }
    
    
  /* box_slider
  -------------------------------------------------------- */
  .box_slider {
  }
  .slider {
    margin: 0 0 0;
    width: 100%;
    min-width:100%; 
    max-width: 100%;
    position: static;
    background-size: 150%;
    background-position: left top;
    padding: 40px 0;
    z-index: 0;
  }
  .slick-prev::before, .slick-next::before {
    font-size: 24px;
  }
  .slick-prev
  {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 37%;
    left: 1%;
    display: block;
    width: 30px;
    height: 30px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    outline: none;
    border-radius: 50%;
    z-index: 100;
}
.slick-prev:before  {
    content: '';/*何も入れない*/
    display: inline-block;/*忘れずに！*/
    width: 30px;/*画像の幅*/
    height: 30px;/*画像の高さ*/
    background-image: url("/assets/img/arrow_prev.png");
    background-size: contain;
    vertical-align: middle;
  }
  .slick-next
  {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 37%;
    right: 1%;
    display: block;
    width: 30px;
    height: 30px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    outline: none;
    border-radius: 50%;
    z-index: 100;
  }
  .slick-next:before  {
    content: '';/*何も入れない*/
    display: inline-block;/*忘れずに！*/
    width: 30px;/*画像の幅*/
    height: 30px;/*画像の高さ*/
    background-image: url("/assets/img/arrow_next.png");
    background-size: contain;
    vertical-align: middle;
  }

  .center-item li {
    margin: 0 0;
  }
  .center-item li .ttl_slide {
    font-size: 16px;
    margin: 10px 0 10px;
  }

  
  
  
  /* ========================================================================
  // area_inspection
  ======================================================================== */
  .area_inspection {
    padding: 50px 0 0;
  }
  .illust_inspection_01 {
    position: absolute;
    right: 0;
    top: -65px;
  }
  .box_inspection .box_inspection_inner_01 > dl > dt,
  .box_inspection .box_inspection_inner_02 > dl > dt{
    font-size: 22px;
    margin: 0 0 15px;
  }
  .box_inspection .box_inspection_inner_01 dl dd {
    margin: 0 0 30px;
  }
  .box_inspection .box_inspection_inner_01 dl dd span {
    font-size: 18px;
  }

  .box_inspection .box_inspection_inner_02 {
    padding: 20px 0 80px;
  }
  .box_inspection .box_inspection_inner_02 dl:nth-of-type(2) {
    padding: 50px 0 0;
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt{
    font-size: 16px;
    padding: 10px 10px 0;
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dt:before{
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    background-image: url("/usedparts/img/icon_usedparts.png");
    background-size: contain;
    vertical-align: middle; 
    margin: -2px 6px 0;
  }
  .box_inspection .box_inspection_inner_02 > dl > dd > dl dd{
    padding: 10px 20px 18px;
  }


  

  
  
  
  
  
  
}