@charset "utf-8";
$pc: 1501px; // PC
$sp: 480px; // スマホ

@mixin pc {
  @media (max-width: ($pc)) {
    @content;
  }
}

@mixin sp {
  @media (max-width: ($sp)) {
    @content;
  }
}

/* sell
   ========================================================================== */

.sell {
  padding-bottom: 20px;


  h2 {
    padding-bottom: 15px;
  }

  p {
    &#p01 {
      padding: 24px 15px 30px;

      @include sp {
        padding: 20px;

        img {
          width: 100%;
          height: auto;
        }
      }
    }

    &#btn01 {
      padding: 0 0 31px 249px;

      @include sp {
        padding: 0;
        text-align: center;
      }
    }
  }

  #box01 {
    width: 725px;
    padding-left: 15px;
    margin-bottom: 45px;

    @include sp {
      width: 100%;
      padding-left: 0;
    }

    table {
      width: 720px;

      @include sp {
        width: 100%;

        tbody,
        tr {
          display: block;
        }
      }

      th {
        width: 205px;
        vertical-align: top;

        @include sp {
          display: block;
          width: 100%;
          height: 70px;

          img {
            height: 70px;
            object-fit: cover;
          }
        }

        &#th01 {
          background-color: #e10000;
        }

        &#th02 {
          background-color: #fa6c08;
        }

        &#th03 {
          background: #df9500 url(https://27.rims-web.com/id/reprice2/sell/img/index_bg01.gif) no-repeat left bottom;
          padding-bottom: 2px;
        }
      }

      td {
        background: url(https://27.rims-web.com/id/reprice2/sell/img/index_line01.gif) repeat-x left top;
        padding: 18px 0 16px 20px;

        @include sp {
          padding: 18px;
        }

        &#td_top {
          background: none;
          padding-top: 19px;
        }

        span {
          display: block;
          padding-top: 6px;
          padding-left: 1.1em;
          text-indent: -1.1em;
        }
      }
    }
  }

  #box02 {
    width: 725px;
    margin: 0 0 29px 15px;
    background: url(https://27.rims-web.com/id/reprice2/sell/img/index_flow_bg01.gif) repeat-y left top;

    @include sp {
      width: 100%;
      margin: 0 auto 30px;
      padding: 0 20px;
    }

    #box02_bg01 {
      background: #ffffff url(https://27.rims-web.com/id/reprice2/sell/img/index_flow_arrow01.gif) no-repeat left top;
      padding-top: 35px;
    }

    .box02_l01 {
      width: 105px;
      float: left;

      @include sp {
        width: 115px;
      }
    }

    .box02_r01 {
      width: 600px;
      float: right;

      @include sp {
        width: 100%;
        float: none;
      }

      h3 {
        padding-bottom: 12px;
      }
    }
  }
}