@charset "utf-8";
.cont_img {
  background-image: url("../images/cont_img.jpg");
}
.cont_img h1 {
  background-image: url(../images/title.png);
}
#flow h2 {
  background: url("../images/h2.png") no-repeat center center;
}
#flow .bg {
  background: linear-gradient(180deg, #fff 0%, #fff 170px, #224169 100px, #224169 100%);
  padding: 0 0 100px;
}
#flow .leftbox {
  width: 50%;
  color: #fff;
}
#flow h3 {
  width: 285px;
  padding-top: 112px;
  overflow: hidden;
  height: 0;
  background: url("../images/line/h3.png") no-repeat center center;
  display: block;
  margin: 0 auto 110px;
}
#flow .step .box {
  overflow: hidden;
}
#flow .step h3 {
  width: 464px;
  padding-top: 152px;
  background: url("../images/line/h4.png") no-repeat center center;
  margin: 30px auto 60px;
}
#flow .step .box h4 {
  width: 89px;
  padding-top: 72px;
  overflow: hidden;
  height: 0;
  background: url("../images/line/step1.png") no-repeat center center;
  display: block;
  margin: 0 auto 20px;
}
#flow .step .box.b02 h4 {
  width: 45px;
  background: url("../images/line/step2.png") no-repeat center center;
}
#flow .step .box.b03 h4 {
  width: 45px;
  background: url("../images/line/step3.png") no-repeat center center;
}
#flow .step .box.b04 h4 {
  width: 91px;
  background: url("../images/line/step4.png") no-repeat center center;
}
#flow .step p {
  text-align: center;
}
#flow .step img {
  margin: 20px auto 0;
}
#flow .step .i02 {
  margin-top: 70px;
}
#flow .step .i03 {
  margin-top: 45px;
}
#flow .link {
  padding-top: 0;
}

@media only screen and (max-width: 768px) {
    .cont_img {
  background-image: url("../images/cont_img_sp.jpg");
}
  
.cont_img h1 {
  background-image: url(../images/title_sp.png);
  background-size: 100%;
}

#flow h2 {
  background: url(../images/h2_sp.png) no-repeat center center;
  background-size: 120%;
}
#flow h3 {
  width: 90%;
  padding-top: 35.29%;
  background: url("../images/line/h3_sp.png") no-repeat center center;
  background-size: 100%;
  margin-bottom: 30px;
}
#flow .leftbox {
  width: 100%;
  color: #333;
}
#flow .bg {
  background: none;
  padding: 0;
}
#flow .rightbox {
  width: 100%;
  margin-top: 30px;
}
#flow .img {
  width: 100%;
  padding-top: 65.67%;
  overflow: hidden;
  height: 0;
  background: url("../images/line/img_sp.jpg") no-repeat center center;
  background-size: 100%;
  display: block;
}
#flow .step h3 {
  width: 90%;
  padding-top: 30.61%;
  background: url("../images/line/h4_sp.png") no-repeat center center;
  background-size: 100%;
  margin-bottom: 40px;
}
#flow .step .box {
  width: 100%;
  margin-bottom: 50px;
}
#flow .step .box h4 {
  width: 30%;
  padding-top: 24.32%;
  overflow: hidden;
  height: 0;
  background: url("../images/line/step1_sp.png") no-repeat center center;
  background-size: 100%;
  display: block;
}
#flow .step .box.b02 h4 {
  width: 14%;
  background: url("../images/line/step2_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow .step .box.b03 h4 {
  width: 14%;
  background: url("../images/line/step3_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow .step .box.b04 h4 {
  width: 28%;
  background: url("../images/line/step4_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow .iphone {
  width: 60%;
  padding-top: 119%;
  overflow: hidden;
  height: 0;
  background: url("../images/line/01_sp.png") no-repeat center center;
  background-size: 100%;
  display: block;
}
#flow .iphone.i02 {
  background: url("../images/line/02_sp.png") no-repeat center center;
  background-size: 100%;
  margin-top: 20px;
}
#flow .iphone.i03 {
  background: url("../images/line/03_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow .iphone.i04 {
  background: url("../images/line/04_sp.png") no-repeat center center;
  background-size: 100%;
}
}
/*============================
直接郵送
============================*/

#tyoku {
  margin-top: 100px;
}
#tyoku h3 {
  background: url("../images/tyoku/h3.png") no-repeat center center;
}
#flow #tyoku .step .box.b01 h4 {
  width: 222px;
  background: url("../images/tyoku/step1.png") no-repeat center center;
}
#flow #tyoku .step .box.b02 h4 {
  width: 111px;
  background: url("../images/tyoku/step2.png") no-repeat center center;
}
#flow #tyoku .step .box.b03 h4 {
  width: 45px;
  background: url("../images/tyoku/step3.png") no-repeat center center;
}
#flow #tyoku .step .box.b04 h4 {
  width: 66px;
  background: url("../images/tyoku/step4.png") no-repeat center center;
}
#tyoku .box2 {
  margin-top: 30px;
}
#tyoku .hako {
  width: 470px;
  padding-top: 350px;
  overflow: hidden;
  height: 0;
  background: url("../images/tyoku/hako.jpg") no-repeat center center;
  display: block;
  float: left
}
#tyoku .address {
  border: 2px solid #d5d5d5;
  padding: 20px 40px;
  width: 50%;
  font-size: 16px;
  float: right;
}
#tyoku table.info th {
  width: 70px;
  background: none;
  color: #eb685f;
  text-align: left;
}
#tyoku .attention {
  clear: both;
  padding-top: 20px;
}
#tyoku .bold {
  font-weight: bold;
}

@media only screen and (max-width: 768px) {
#tyoku {
  margin-top: 0;
}
#tyoku h3 {
  background: url(../images/tyoku/h3_sp.png) no-repeat center center;
  background-size: 100%
}
#flow #tyoku .img {
  background: url("../images/tyoku/img_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .step .box.b01 h4 {
  width: 70%;
  background: url(../images/tyoku/step1_sp.png) no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .step .box.b02 h4 {
  width: 35%;
  background: url(../images/tyoku/step2_sp.png) no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .step .box.b03 h4 {
  width: 14%;
  background: url(../images/tyoku/step3_sp.png) no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .step .box.b04 h4 {
  width: 21%;
  background: url(../images/tyoku/step4_sp.png) no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .img.img01 {
  background: url("../images/tyoku/01_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .img.img02 {
  background: url("../images/tyoku/02_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .img.img03 {
  background: url("../images/tyoku/03_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #tyoku .img.img04 {
  background: url("../images/tyoku/04_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#tyoku .hako {
  width: 100%;
  padding-top: 74.46%;
  background: url("../images/tyoku/hako_sp.jpg") no-repeat center center;
  background-size: 100%;
  float: none;
}
#tyoku .address {
  border: 0.3vw solid #d5d5d5;
  padding: 10px;
  width: 100%;
  float: none;
  margin-top: 20px;
}
}
/*============================
出張買取
============================*/
#kaitori h3 {
    background: url("../images/kaitori/h3.png") no-repeat center center;
}
#kaitori .step {
  margin-bottom: 60px;
}
#flow #kaitori .step .box.b01 h4 {
  width: 222px;
  background: url("../images/kaitori/step1.png") no-repeat center center;
}
#flow #kaitori .step .box.b02 h4 {
  width: 208px;
  background: url("../images/kaitori/step2.png") no-repeat center center;
}
#flow #kaitori .step .box.b03 h4 {
  width: 162px;
  background: url("../images/kaitori/step3.png") no-repeat center center;
}
#flow #kaitori .step .box.b04 h4 {
  width: 207px;
  background: url("../images/kaitori/step4.png") no-repeat center center;
}

@media only screen and (max-width: 768px) {
#kaitori h3 {
  background: url("../images/kaitori/h3_sp.png") no-repeat center center;
  background-size: 100%;
  padding-top: 37.29%;
}
#flow #kaitori .img {
  background: url("../images/kaitori/img_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .img.img01 {
  background: url("../images/kaitori/01_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .img.img02 {
  background: url("../images/kaitori/02_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .img.img03 {
  background: url("../images/kaitori/03_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .img.img04 {
  background: url("../images/kaitori/04_sp.jpg") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .step .box.b01 h4 {
  width: 76%;
  background: url("../images/kaitori/step1_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .step .box.b02 h4 {
  width: 71%;
  background: url("../images/kaitori/step2_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .step .box.b03 h4 {
  width: 55%;
  background: url("../images/kaitori/step3_sp.png") no-repeat center center;
  background-size: 100%;
}
#flow #kaitori .step .box.b04 h4 {
  width: 70%;
  background: url("../images/kaitori/step4_sp.png") no-repeat center center;
  background-size: 100%;
}
}