@charset "UTF-8";

@media screen and (max-width: 768px) {/* width768px以下で適用 */

  .relative{
    height: 77.5vw;
  }

/*
ファーストビュー下のテキストゾーン
*/
.logo{
  width: 27.5vw;
  left: 4vw;
  top: 0vw;
}

.fv_img1, .fv_img2{
  display:none;
}

.fv_img1_sp{
  display:inline;
  position: absolute;
  width:100%;
  top:7vw;
  z-index: 10;  /*画像の重ね順：.scrollが上になるように*/
}

.fv_img2_sp{
  display:inline;
  position: absolute;
  width: 42vw;
  top: 57vw;
  right: 13vw;
  z-index: 10;  /*画像の重ね順：.scrollが上になるように*/
}

.fv_text1 {
    font-size: 6vw;
    width: 30vw;
    top: 48.6vw;
    right: 4.2vw;
}

.fv_text2 {
    width: 37vw;
    top: 8.8vw;
    left: -12.5vw;
}

.firstview_box{
  display: none;
}


/*
ファーストビュー下のテキストゾーン
*/
.scroll{
  display: none;
}

.fvtext{
  margin-left: 13.5vw;
  font-size: 3.5vw;
  margin-top:7vw;
  line-height: 6vw;
}


/*
こんな方におすすめです
*/

/*タイトル*/
.recommend_container1{
  margin-top: 16vw;
  line-height: 4vw;
}

.recommend_text{
  font-size: 5.9vw;
  margin-left: -2vw;
}

.accent_b{
  margin-left: 13vw;
  height: 6vw;
}

/*アイコン*/
.recommend_container2{
  display: grid;
  margin-top: 8vw;
}

.recommend_img1,
.recommend_img2,
.recommend_img3{
  width: 60vw;
  margin-left: 21vw;
  margin-bottom: 3vw;
}

/*背景・タイトル*/
.click_box{
  height: 137.5vw;
  margin-top: 15vw;
  padding-bottom: 5vw;
}

.click_title{
  font-size: 4vw;
  padding-top: 8vw;
}

/*詳細*/
.click_text1{
  text-align: center;
  font-size: 5vw;
}

.click_img{
  margin-left: 20vw;
  width: 60vw;
  margin-top:-1.5vw;
}

.line{
  border-top: solid 2px #fff;
  border-left:0vw;
  width:75vw;
  height:0vw;
  margin-left: 13vw;
  margin-top: 10vw;
  margin-bottom: 10vw;
}

.line-sp{
  border-top:solid 2px #fff;
  width:25vw;
  margin:8vw auto;
}

/*
QUOカードペイプレゼント
*/

/*pcとspの切り替え*/
.present_img{
 display: none;
}

.present_img2{
 display: inline;
}

/*吹き出し関係*/
.present_img2{
  width: 31.5vw;
  margin-left: 66vw;
  position: absolute;
  margin-top: 7vw;
}

.present_title{
  margin-left: 69.5vw;
  position: absolute;
  font-weight: normal;
  font-size: 2.5vw;
  line-height: 3vw;
  margin-top: 7.5vw;
  text-align: center;
}

.present_textbox{
  position: absolute;
}

.present_text{
  margin-left: 69vw;
  font-size: 4.5vw;
  font-weight: bold;
  line-height: 4.5vw;
  margin-top: 18.3vw;
  margin-bottom: -0.5vw;
}

.present_subtext{
  margin-left: 73.5vw;
  font-size: 2vw;
  font-weight: bold;
}

.mask_img3{
  width: 7vw;
  margin-left: 87.5vw;
  margin-top: -12vw;
}

.text_red{
  color: red;
  font-weight: bold;
  font-size:2.5vw;
  line-height: 4vw;
}


/*バナー本体*/
.mask_box02{
  height: 45vw;
}

.mask_titlebox02{
  padding-top:6vw;
}

.accent_b3{
  margin-left: 13vw;
  height: 5vw;
}

.mask_title02{
  font-size: 4.5vw;
  line-height: 6.5vw;
  margin-top: 2vw;
}

.mask_text02{
  font-size: 7.3vw;
  text-align: left;
  margin-top: 0vw;
  line-height: 6vw;
  line-height: 12vw;
  /*margin-left:10.5vw;
  margin-top: -2vw;*/
  margin-left: 17.5vw;
  margin-top: 2vw;
}
.mask_text02 img{
  width: 70vw;
}

/*
マスクプレゼント
*/

/*.mask_box{
  height: 50vw;
}

.mask_titlebox{
  padding-top: 7vw;
}

.mask_img{
  width: 31vw;
  height: 15vw;
  margin-left: 4vw;
  margin-top: 3vw;
}

.accent_b2{
  margin-left: -2vw;
  height: 5vw;
}

.mask_title{
  font-size: 5.6vw;
  line-height: 6.5vw;
  margin-top: 2vw;
}

.mask_textbox{
  display: block;
}

.mask_text{
  font-size: 9.5vw;
  text-align: center;
  margin-top: -2vw;
}

.mask_subtext{
  font-size: 3.5vw;
  margin-left: 70vw;
  margin-top: 1vw;
}
*/

/*
おうちでもできる住まいづくり
*/

/*タイトル*/
.intro_title{
  font-size: 5.9vw;
  margin-top: 13vw;
}

.line2{
  width: 40vw;
  border: solid 1px;
  margin-top: -5vw;
  margin-bottom: 9vw;
}

.intro_num{
  display: none;
}

/*背景・見出し*/
.intro_box{
  height: auto;
  margin-top: -2vw;
  margin-bottom: 11vw;
}

.intro_index1{
  font-size: 5.9vw;
  margin-left: 7vw;
  padding-top: 0;
}

.intro_index2{
  font-size: 5.9vw;
  margin-left: 20vw;
  padding-top: 0;
}

/*詳細*/
.intro_container1{
  display: grid;
}

.intro_img1,
.intro_img2,
.intro_img3{
  width: 76.5vw;
  margin-left: -0.7vw;
  padding-top: 57vw;
  margin-right: 0vw;
}

.intro_sub{
  font-size: 4.5vw;
  margin-left: -1vw;
  margin-top: 4vw;
}

.intro_text{
  font-size: 3.4vw;
  margin-left: -1vw;
  margin-right: 5vw;
  margin-top: -23px;
  line-height: 1.8em;
  margin-bottom: 6vw;
}

.banner1{
  width: 83vw;
  margin-top:-6vw;
}

/*
web商談できます
*/

.notice_box{
  height: 105vw;
  margin-top:13vw
}

.accent_w{
  height:6vw;
  margin-left: 16.5vw;
}

.notice_title{
  font-size: 7.5vw;
}

.notice_text{
  font-size: 4vw;
  margin: 10vw auto;
  line-height: 7.5vw;
}

/*　　　　 　   　　end　　　　　　　   　*/



/*
ご相談の流れ
*/

.flow_title{
  font-size: 6.3vw;
  margin-top: 13vw;
}

.flow_container1{
  display:grid;
  margin-left: 10.5vw;
  margin-top:11.5vw;
}

.flow_container2{
  display: grid;
  width:79.5vw;
}

.flow_img{
  width: 20vw;
  margin: 4vw auto;
}

.flow_figure{
  width: 11vw;
  height: 13vw;
  margin-left: 35.5vw;
  margin-top:5vw;
  transform: rotate( 90deg );
  margin-bottom: 4vw;
}

.flow_index{
  font-size: 5.5vw;
}

.flow_text1{
  font-size: 3.8vw;
  height:5vw;
  margin-top:-5vw;
}

.flow_text2{
  font-size: 3.8vw;
  height:15vw;
  margin-bottom: -6vw;
}

.flow_text3{
  font-size: 3.8vw;
  height:18vw;
  margin-bottom: -9vw;
}

.flow_text4{
  font-size: 3.8vw;
  height:23vw;
}

.banner2{
  width: 83vw;
  margin-top: 0vw;
}


/*
その他のご相談・お問い合わせはこちら
*/

.other_title{
  font-size:4vw;
  margin-top:23vw;
}

.other_container{
  display:grid;
  margin-left: 20vw;
  margin-top:2.5vw;
}

.other_img1, .other_img2{
  width:60vw;
  margin-left:0vw;
}


/*
フッター
*/

.fotter_logo{
  width: 45vw;
  margin-top:25vw;
}

.fotter_copy{
  font-size: 3.5vw;
  margin-top:1.3vw;
  margin-bottom:25vw;
}


}