@charset "UTF-8";
@media screen and (max-width: 750px) {
  .mainContent {
    padding-bottom: 0 !important; }

  h1 {
    background-image: url(../renovation/img/bg_mv_sp.jpg); }

  /* leader
  --------------------------------------------------------- */
  .leader {
    padding-top: 0 !important; }
    .leader dt {
      text-align: center;
      font-weight: bold;
      font-size: 18px;
      margin-bottom: 15px; }

  /* 新築そっくりさんが選ばれる理由
  ------------------------------------------- */
  .sub .list {
    background: #f9f8f3;
    padding: 35px 0 30px; }
    .sub .list ul {
      text-align: center; }
      .sub .list ul li {
        float: left;
        margin: 0 0 28px;
        width: 48%; }
        .sub .list ul li:nth-child(even) {
          float: right; }
        .sub .list ul li:nth-child(3) {
          float: none;
          margin: 0 auto 28px; }
        .sub .list ul li a {
          display: block; }
          .sub .list ul li a dl {
            background: #fff;
            position: relative;
            font-weight: bold; }
            .sub .list ul li a dl dt {
              background: #ffe100;
              font-size: 12px;
              width: 84px;
              height: 18px;
              border-radius: 100px;
              position: absolute;
              left: 50%;
              margin-left: -42px;
              top: -9px;
              line-height: 1;
              padding: 3px 0; }
            .sub .list ul li a dl dd {
              font-size: 15px;
              padding: 12px 0; }

  /* リノベーション・リフォームの流れ
  ------------------------------------------- */
  #flow {
    padding: 45px 0 0; }
    #flow .stepListTxt {
      color: #ef4a81;
      text-align: center;
      font-weight: bold;
      margin-top: 45px;
      font-size: 15px;
      letter-spacing: 1.3px;
      position: relative; }
      #flow .stepListTxt span {
        position: relative;
        z-index: 3;
        display: inline-block;
        background-color: #fff; }
        #flow .stepListTxt span br {
          display: none; }
    #flow ol {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      padding-top: 25px;
      text-align: center; }
      #flow ol li {
        width: 48.6%;
        margin-bottom: 15%;
        position: relative; }
        #flow ol li a {
          display: block; }
          #flow ol li a p {
            width: 100%;
            margin-top: 10px;
            padding: 13px 10px;
            font-size: 13px; }
        #flow ol li:before {
          content: '';
          display: block;
          width: 41px;
          height: 57px;
          background-size: contain;
          background-repeat: no-repeat;
          position: absolute;
          z-index: 6;
          top: -7px;
          left: 5px; }
        #flow ol li:nth-child(even):after {
          content: '';
          width: 200%;
          height: 29%;
          background: url(../renovation/img/img_arw_flow_sp.png) no-repeat;
          bottom: -34%;
          right: 0;
          margin-left: -100%;
          display: block;
          background-size: 100%;
          position: absolute; }
        #flow ol li:nth-child(1):before {
          background-image: url(../common/img/icon/icon_step1_sp.png); }
        #flow ol li:nth-child(2):before {
          background-image: url(../common/img/icon/icon_step2_sp.png); }
        #flow ol li:nth-child(3):before {
          background-image: url(../common/img/icon/icon_step3_sp.png); }
        #flow ol li:nth-child(4):before {
          background-image: url(../common/img/icon/icon_step4_sp.png); }
        #flow ol li:nth-child(5):before {
          background-image: url(../common/img/icon/icon_step5_sp.png); }
        #flow ol li:nth-child(6):before {
          background-image: url(../common/img/icon/icon_step6_sp.png); }
        #flow ol li:nth-child(7):before {
          background-image: url(../common/img/icon/icon_step7_sp.png); }
        #flow ol li:nth-child(8):before {
          background-image: url(../common/img/icon/icon_step8_sp.png); }
        #flow ol li:nth-child(9):before {
          background-image: url(../common/img/icon/icon_step9_sp.png); }
        #flow ol li.free .img {
          position: relative;
          overflow: hidden;
          z-index: 3; }
          #flow ol li.free .img:before {
            content: "";
            display: block;
            width: 96px;
            height: 96px;
            border-radius: 50%;
            background-color: #ef4a81;
            position: absolute;
            top: -48px;
            right: -48px;
            z-index: 4; }
          #flow ol li.free .img:after {
            content: "\00A5 0";
            letter-spacing: 0;
            position: absolute;
            top: 4px;
            right: 8px;
            font-size: 20px;
            color: #fff;
            z-index: 5;
            font-weight: bold; }

  /* categorylist
  ------------------------------------------- */
  .categorylist {
    background: #f9f8f3;
    padding: 10px 0 30px; }
    .categorylist li a {
      display: block;
      position: relative; }
      .categorylist li a:after {
        content: "";
        width: 30%;
        height: 40%;
        position: absolute;
        top: 10%;
        left: 50%;
        margin-left: -15%;
        background-size: 100%;
        background-repeat: no-repeat; }
    .categorylist li:nth-child(1) a:after {
      background-image: url(../common/img/icon/icon_pen_sp.png); }
    .categorylist li:nth-child(2) a:after {
      background-image: url(../common/img/icon/icon_money_sp.png); }
    .categorylist li:nth-child(3) a:after {
      background-image: url(../common/img/icon/icon_book_sp.png); } }
@media screen and (max-width: 320px) {
  #flow ol li a p {
    font-size: 11px; }

  #flow .btnGeneral:after {
    right: 10px; }

  #flow .stepListTxt span br {
    display: block; }

  .categorylist > div ul li a figure figcaption,
  .categorylist > div ul li a figure figcaption span {
    height: 45px; } }
