@charset "UTF-8";
body{ width: 100%; font-family: noto-sans-cjk-jp, sans-serif; }

@media screen and (min-width: 768px),print {

main{  width: 100% !important;}

#modelhouse h1.main-title{ width: 100%; min-width: 1100px; min-height: 430px; background: url(../images/modelhouse/h1.png) no-repeat top center; color: #000; padding: 180px 0 150px; text-align: center; background-size: cover;}
#modelhouse h1.main-title .en { display: none;}
#modelhouse h1.main-title .jp { display: inline-block; font-size: 40px; font-weight: bold; border: solid 4px #000; padding: 0 15px;}

#con01{ width: 100%; margin: 0 auto 93px; background: url(../images/modelhouse/con01-bg01.png) no-repeat center top; }
#con01 .ttl{ margin-top: 46px; padding-top: 103px; text-align: center; font-size: 28px; font-weight: 700; letter-spacing: 2px; line-height: 41px; }
#con01 .box1{ width: 1100px; margin: 318px auto 0px; padding: 71px; background: url(../images/modelhouse/con01-bg02.png) no-repeat center top;  }
#con01 .box1 .ttl2{ width: 900px; margin: 0 auto 20px; }
#con01 .box1 .txt{ width: 900px; margin: -6px 51px 48px; font-size: 28px; font-weight: 700; line-height: 41px; letter-spacing: 2.7px; }
#con01 .box1 .inbox{ width: 900px; margin: 0 auto 20px; padding: 30px; border: 10px solid #F7D700; position: relative; background: #fff; z-index: 99; }
#con01 .box1 .inbox .icon{ position: absolute; top: 16px; left: -59px; }
#con01 .box1 .inbox .ttl3{ position: absolute; top: 92px; left: 58px; }
#con01 .box1 .inbox .list{ width: 540px; margin-left: 279px; letter-spacing: 1px; padding-bottom: 10px; }
#con01 .box1 .inbox .list li{
	background-image:url(../images/modelhouse/marker.png);
	background-position: 10px 20px;
	background-repeat:no-repeat;
	padding: 0 0 0 25px; font-size: 18px; font-weight: 550; line-height: 42px; border-bottom: 1px dotted;}

#con01 .box1 .inbox .list li span{ color: #FF8000; }
#con01 .box1 .inbox .pic{ position: absolute; top: -240px; right: 29px; }
#con01 .box2{ width: 1100px; margin: -190px auto 0px; background: #E6E6E6; padding: 139px 70px 100px; position: relative; }
#con01 .box2 .list2{ width: 960px; margin: 0 auto; display: flex; justify-content: space-between; }
#con01 .box2 .btn{ position: absolute; bottom: -33px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); }

#con02{ margin-bottom: 124px; }
#con02 .ttl{ width: 960px; margin: 0 auto 48px; }
#con02 .list{ width: 980px; margin: 0 auto 49px;     display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#con02 .list li{ width: 300px; margin-right: 40px; margin-bottom: 30px; }
#con02 .list li img{ margin-bottom: 15px; }
#con02 .list li p{ letter-spacing: 1.5px; line-height: 24px; }
#con02 .list li:nth-child(3){ margin-right: 0; }
#con02 .list li:nth-child(4){ margin-left: 170px; }

#con03{ width: 100%; margin: 0 auto; background: #E8E3D2; position: relative; }
#con03 .inner-Box{ width: 1100px; margin: 0 auto; position: relative; padding-top: 107px }
#con03 .ttl{ width: 680px; text-align: center; font-size: 28px; font-weight: 700; background: #4D3523; color: #fff; padding: 25px; letter-spacing: 2.3px; position: absolute; top: -50px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); }
#con03 .ttl::after{ content: "";width: 61px;height: 56px;background: url(../images/modelhouse/con03-icon01.png) no-repeat top center;position: absolute; top: 71px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%);z-index: 1; }
#con03 .txt{ text-align: center; font-size: 22px; font-weight: 700; letter-spacing: 2px; line-height: 40px; }
#con03 .txt span{ color: #FF8000; border-bottom: 1px solid #FF8000; }
#con03 .box1{ width: 680px; margin: 0 auto; background: #BDAA8D; border-radius: 20px 20px 0 0; padding: 40px 50px 20px 64px; margin-top: 55px; }
#con03 .box1 .txt2{ color: #fff; letter-spacing: 0.5px; line-height: 33px; font-weight: 500; }
#con03 .box1 .txt2 span{ border-bottom: 1px solid #fff; }
#con03 .box2{ width: 1100px; margin: 0 auto; background: #fff; border-top: 10px solid #BDAA8D; position: relative; }
#con03 .box2 .pic{ position: absolute; top: 48px; left: 46px; }
#con03 .box2 .txt3{ width: 480px; margin-left: 550px; margin-bottom: 101px; padding-top: 60px; font-size: 16px; line-height: 33px; letter-spacing: 1px; }
#con03 .box2 .txt3 span{ color: #FF8000; border-bottom: 1px solid #FF8000; font-weight: 550; }
#con03 .box2 .list{ width: 960px; padding-bottom: 50px; margin: 0 auto; display: flex; justify-content: space-between; }
#con03 .box2 .pic2{ position: absolute; top: -220px; right: 23px; }
	#con03 .vr-ttl{width: 439px;margin: 0 auto 15px;}
	#con03 .vr-area{width: 100%;height: 500px;}
	#con03 .vr-area iframe{width: 100%;height: 500px;}

#con04{ width: 1100px; margin: 0 auto 80px; overflow: hidden; }
#con04 .ttl{ font-size: 22px; font-weight: 550; text-align: center; line-height: 40px; letter-spacing: 2px; margin: 70px 0 50px; }
#con04 .ttl span{ color: #FF8000; border-bottom: 1px solid #FF8000; }
#con04 .box1{ width: 380px; background: #E6E6E6; padding: 30px; float: left; }
#con04 .box1 .txt{ line-height: 33px; margin-bottom: 18px; }
#con04 .box1 .inbox{ width: 320px; margin: 0 auto 19px; padding: 15px; letter-spacing: 1.5px; background: #fff; border: 1px dotted; }
#con04 .box1 .inbox .list li{ font-size: 16px; font-weight: 550; line-height: 31px; }
#con04 .box1 .inbox .list li span{ color: #FF8000; }
#con04 .box1 .txt2{ font-size: 16px; font-weight: 550; margin-bottom: 8px; letter-spacing: 2px; }
#con04 .box2{ float: right; width: 660px; height: 424px; }
#con04 .box2 iframe{ width: 660px; height: 424px; }

}


@media screen and (max-width: 767px) {
#modelhouse h1.main-title{ width: 100%; background: url(../images/modelhouse/sp-h1.png) no-repeat top center; color: #000; padding: 15vw 0; text-align: center; background-size: cover;}
#modelhouse h1.main-title .en { display: none;}
#modelhouse h1.main-title .jp { display: inline-block; font-size: 6vw; font-weight: bold; border: solid 3px #000; padding: 1vw 3vw 0.3vw;}

#con01{width: 100vw; margin: 0 auto 20vw; background: url(../images/modelhouse/sp-con01-bg01.png) no-repeat center top; background-size: 100%}
#con01 .ttl{ margin-top: 3vw; padding-top: 20vw; text-align: center; font-size: 4.6vw; font-weight: 900; letter-spacing: 0.3vw; line-height: 1.8; }
#con01 .box1{ margin: 2vw auto 0; padding: 8vw 3vw 3vw; background: url(../images/modelhouse/sp-con01-bg02.png) no-repeat center top; }
#con01 .box1 .ttl2{width: 75vw; margin: 0 auto 4vw; }
#con01 .box1 .txt{ text-align: center; font-size: 4.8vw; font-weight: 700; line-height: 1.8; letter-spacing: 0.5vw; }
#con01 .box1 .inbox{ margin: 8vw auto 4vw; padding: 4vw; border: 10px solid #F7D700; position: relative; background: #fff; z-index: 99; }
#con01 .box1 .inbox .icon{ position: absolute; top: -9vw; left: -1vw; width: 18vw; }
#con01 .box1 .inbox .ttl3{margin: 3vw 8vw 5vw;}
#con01 .box1 .inbox .list{ letter-spacing: 1px; padding-bottom: 3vw; }
#con01 .box1 .inbox .list li{
		background-image:url(../images/modelhouse/marker.png);
	background-position:1.5vw 3vw;
	background-repeat:no-repeat; padding: 1vw 0 1.5vw 5vw;
	font-size: 3.9vw; font-weight: 550; line-height: 1.6; border-bottom: 1px dotted;}
#con01 .box1 .inbox .list li span{ color: #FF8000; }
#con01 .box1 .pic{  text-align: center;width: 100vw;}
#con01 .box2{ background: #E6E6E6; position: relative; }
#con01 .box2 .list2{ padding: 8% 5% 12%; overflow: hidden;; }
#con01 .box2 .list2 li{ width: 48%; margin-right: 4%; float: left; margin-bottom: 2%; }
#con01 .box2 .list2 li:nth-child(2n){ margin-right: 0; }
#con01 .box2 .btn{width: 80vw; position: absolute; bottom: -33px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); }

#con02{ margin-bottom: 20vw; padding: 0 5%; }
#con02 .ttl{ margin: 0 auto 6vw; }
#con02 .list{ margin: 0 auto 6vw; }
#con02 .list li{ margin-bottom: 6vw; }
#con02 .list li img{ margin-bottom: 3vw; }
#con02 .list li p{ letter-spacing: 0.2vw; line-height: 1.8; font-size: 3.6vw; text-align: center;}

#con03{ margin: 0 0 4vw; padding: 0 5% 15vw; background: #E8E3D2; position: relative; }
#con03 .inner-Box{ margin: 0 auto; position: relative; padding-top: 10vw }
#con03 .ttl{ width: 80%; text-align: center; font-size: 5vw; font-weight: 700; background: #4D3523; color: #fff; padding: 4vw; letter-spacing: 2.3px; position: absolute; top: -50px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); }
#con03 .ttl::after{ content: "";width: 6vw; height: 16vw; background: url(../images/modelhouse/con03-icon01.png) no-repeat top center;position: absolute; top: 14vw; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%);z-index: -1; }
#con03 .txt{ margin-top: 10vw; text-align: center; font-size: 3.9vw; font-weight: 700; letter-spacing: 0.3vw; line-height: 1.8; }
#con03 .txt span{ color: #FF8000; border-bottom: 1px solid #FF8000; }
#con03 .box1{ margin: 0 auto; background: #BDAA8D; border-radius: 20px 20px 0 0; padding: 4vw 4vw 12vw; margin-top: 6vw; }
#con03 .box1 .txt2{ color: #fff; letter-spacing: 0.5px; line-height: 33px; font-weight: 500; font-size: 3.9vw; }
#con03 .box1 .txt2 span{ border-bottom: 1px solid #fff; }
#con03 .box2{ margin: 0 auto; background: #fff; border-top: 10px solid #BDAA8D; position: relative; }
#con03 .box2 .pic{ margin: 5%; }
#con03 .box2 .txt3{ padding: 0 5%; margin-bottom: 10vw; padding-top: 5vw; font-size: 3.6vw; line-height: 1.8; letter-spacing: 0.2vw; }
#con03 .box2 .txt3 span{ color: #FF8000; border-bottom: 1px solid #FF8000; font-weight: 550; }
#con03 .box2 .list{ padding: 0 5% 5vw; overflow: hidden; }
#con03 .box2 .list li{ float: left; width: 48%; margin-right: 4%; margin-bottom: 4%; }
#con03 .box2 .list li:nth-child(2n){ margin-right: 0; }
#con03 .box2 .pic2{ width: 45%; position: absolute; top: -33vw; right: 0; }
	#con03 .vr-ttl{width: 70%;margin: 0 auto 3%;}
	#con03 .vr-area{width: 100%;height: 60vw;}
	#con03 .vr-area iframe{width: 100%;height: 60vw;}


#con04{ padding: 0 5%; margin-bottom: 10vw; overflow: hidden; }
#con04 .ttl{ font-size: 4vw; font-weight: 550; text-align: center; line-height: 1.8; letter-spacing: 0.5vw; margin: 8vw 0; }
#con04 .ttl span{ color: #FF8000; border-bottom: 1px solid #FF8000; }
#con04 .box1{ background: #E6E6E6; padding: 4vw; margin-bottom: 6vw; }
#con04 .box1 .txt{ line-height: 33px; margin-bottom: 3vw; }
#con04 .box1 .inbox{ margin: 0 auto 3vw; padding: 3vw; letter-spacing: 1.5px; background: #fff; border: 1px dotted; }
#con04 .box1 .inbox .list li{ font-size: 3.6vw; font-weight: 550; line-height: 1.8; }
#con04 .box1 .inbox .list li span{ color: #FF8000; }
#con04 .box1 .txt2{ font-size: 3.6vw; font-weight: 550; margin-bottom: 2vw; letter-spacing: 0.3vw; }
#con04 .box1 .pic{ width: 80%; }
#con04 .box2 iframe{ width: 100%; height: 60vw; }
footer .f-con-Box{  padding: 30vw 0 35vw;}

}