html {
  font-size: 14px;
    text-align: center;
}

hr {
  width: 80%;
}

.top-image img {
    width: 90%;
}

/* アイコン */

.wrapper-icon {
  display: flex;  
  flex-flow: column;
}

.wrapper-icon img {
    width: 90px;
    height: 60px;
}

.icon-table {
    margin: 0 auto 0 auto;
}

table.icon-table td {
    padding: 5px;
    text-align: left;
    vertical-align: middle;
    word-wrap: break-word;
    font-size: 1.2rem;
}

/* 買い取りリスト */

.wrapper-kaitori {
  display: flex;
  flex-flow: column; 
}

.kaitorihyou {
    width: 90%;
    margin: 20px auto 20px auto;
}

table.kaitorihyou {
    border-collapse:collapse;
}

table.kaitorihyou caption {
    font-size:1.6rem;
    font-weight: bold;
    padding: 5px
}

table.kaitorihyou {
        border: solid 2px;
}

table.kaitorihyou td,th {
    border: solid 1px;
    padding: 7px auto 7px auto;
    text-align: left;
    font-weight: bold;
    word-wrap: break-word;
    font-size: 1.2rem;
}

table.kaitorihyou td {
    background: #f2f5ff;
}

table.kaitorihyou th {
    font-size:1.2rem;
    background: #c2c5ff;
}

/* 注釈テキスト */
.chushaku {
  font-size: 1rem;
}

/* 取引の流れ */

.wrapper-nagare {
  display: flex;
  flex-flow: column; 
}


.wrapper-nagare {
  justify-content: center;
}

.title-box {
  width: 90%;
    margin-left : auto;
    margin-right : auto;
    margin-bottom : 5px;
  border: solid 2px;
  text-align:center;
  padding: 6px;
  background-color: #e3edff;
  border-radius: 0.5em;/*角丸*/
  font-size: 1.3rem;

}

.wrapper-nagare img {
  width: 150px;
  height: 40px;
  margin: 0px auto 0px auto;
}

.wrapper-nagare h3 {
  width:20rem;
  padding: 0.5rem;/*文字周りの余白*/
  margin:0.5rem auto;
  color: #000000;/*文字色*/
  background: #aaa3ff;/*背景色*/
  font-size: 1.4rem;
}


/**お見積りボタン**/
a.form-from {
    text-decoration: none;
    color: white;
    border: solid 5px black;
    padding: 10px 30px;
    border-radius: 20px;
    margin: 20px auto 20px;
    text-align: center;
    display: block;
    width: 150px;
    font-weight: bold;
    font-size: 1.2rem;
    box-shadow: 0px 0px;
    background-color: #C62E3C;
}
a.form-from:hover {
  transition: 200ms;
  box-shadow: 0px 3px black;
}


/* フッター */
.footer {
    margin-top: 10px;
}

/********** 大画面用 ****************/

@media screen and (min-width:600px) {

html {
  font-size: 12px;
}

h2 {
  font-size: 2rem;
}

  .top-image img {
      width: 80%;
  }
  
  .wrapper-icon {
      flex-flow: row;
    justify-content: center;
  }

  .icon-table {
      margin: 0px 10px 0px 0px;
  }

  .title-box {
      width: 60%;
  }
  
  .wrapper-kaitori {
      flex-flow: row;
    justify-content: center;
  }
  
  .kaitorihyou {
    width: 40%;
    margin: 0px 0px 40px 40px;
  }

}

@media screen and (min-width:900px) {

  .top-image img {
      width: 720px;
  }
  
  hr {
      width: 640px;
  }
  
  .title-box {
      width: 540px;
  }
  
  .kaitorihyou {
    width: 360px;
  }

}