@charset "UTF-8";
/* CSS Document */

/* header */

/* トップのスライド */

.slide {
    background-image: url(../img/slide_img01.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    top: 0;
    z-index: -999;
}
.slide_logo{width: 20%;margin-top: 20%}
.slide_h2{color: #ffffff;
letter-spacing: 0.4em;
}
.slide_copy{color: #ffffff;
line-height: 2em;}

/* スライドショーのCSS
-----------------------------------------*/
@-webkit-keyframes zoomUp {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.15);
transform: scale(1.15);
}
}

@keyframes zoomUp { //1.15倍させる指定
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.15);
transform: scale(1.15);
}
}

.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img { //12秒かけて拡大させる
-webkit-animation: zoomUp 12s linear 0s;
animation: zoomUp 12s linear 0s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.swiper-slide {
overflow: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.slide-img {
background-size: cover;
background-position: center center; //背景画像は中央を軸に表示させる
height: 600px; //600pxの高さで表示させる
}

//テキストを追加したい場合は以下を追加
.slide-text {
position: absolute;
z-index: 10;
font-size: 4rem;
color: #fff;
width: 100%;
top: 50%;
text-align: center;
font-weight: bold;
	}


/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */
/* PC版 w560以上に適応するcss ****************************************************************** */

/* section 1 */

/* section 2　優しさで創るリーベンホームの家 */
.h2_concept{letter-spacing: 0.2em;font-weight: bold;background-image: url("../img/h2_concept.svg");
background-repeat: no-repeat;background-size: 13%;height: 80px;padding-top: 50px;background-position:left;width: 90%;margin: 0 auto;}
.concept_small{font-size: 60%;color: #93a3ab;}

/* section 3 新着情報 */
.h2_news{letter-spacing: 0.2em;font-weight: bold;
height: 80px;padding-top: 50px;width: 100%;margin: 0 auto;}

/* section 4 リモート見学会 */
.remote{background-image: url("../img/remote_back.jpg");background-repeat: no-repeat;
background-size: cover;padding: 10% 0%;}
.remote_box{background: #ffffff;border-radius: 20px;padding: 0 8% 10%;box-shadow: 4px 4px 6px gray;}
.remote_mark{width: 10%;margin-top:-35px;float: right;margin-right: -100px;opacity:0.5;}
.pr5per{padding-right: 10%;}

/* section 5 リーベンホームの家づくりを見る */
.h2_works{letter-spacing: 0.2em;font-weight: bold;background-image: url("../img/works_mark.svg");
background-repeat: no-repeat;background-size: 13%;height: 80px;padding-top: 50px;background-position:left;width: 90%;margin: 0 auto;}

/* section 5 リーベンホームの家づくりを見る */
.h2_movie{letter-spacing: 0.2em;font-weight: bold;background-image: url("../img/movie_mark.svg");
background-repeat: no-repeat;background-size: 13%;height: 80px;padding-top: 50px;background-position:left;width: 90%;margin: 0 auto;}


.works_back{background-image: url("../img/works_back.png");
background-repeat: no-repeat;background-size: cover;height: 400px;}
.works_mark{width: 100%;padding: 10% 0 3% 0;}
.works02{width: 30%;padding: 3% 10%;}
.h4_works{font-size: 100%;}
.p_works{font-size: 90%;}
.motto_wide02{width: 70%;padding-top: 5%;}
.plan_back{background-image: url("../img/plan_back.png");
background-repeat: no-repeat;background-size: cover;height: 400px;}
/* section 6 */
.h2_construction{letter-spacing: 0.2em;font-weight: bold;background-image: url("../img/book.svg");
background-repeat: no-repeat;background-size: 13%;height: 80px;padding-top: 50px;background-position:left;width: 90%;margin: 0 auto;}

.h2_report{letter-spacing: 0.2em;font-weight: bold;background-image: url("../img/report_img.svg");
background-repeat: no-repeat;background-size: 25%;height: 120px;padding-top: 30px;background-position:left;width: 60%;margin: 0 auto;}
.report_copy{height: 30px;}
.report_back{background-color: #F0EFE4;}
.report{background-image: url("../img/report_back.png");background-repeat: no-repeat;background-size: cover;background-position: bottom;padding-bottom: 20%;}
.m_center{width: 40%;margin: 0 auto;}

/* section 6 はじめての家づくり */
.point_back	{
	background-image:url("../img/point_back.png");background-repeat: no-repeat;background-size: cover;background-position: bottom; padding-bottom: 35%;}
.point_en {width: 48%; background-image:url("../img/point_en.png");background-repeat: no-repeat;background-size: contain;text-align: center;padding-top: 15%;padding-bottom: 8%}
.point_left{width: 25%;margin-left: 15%;}
.lh_mark{width: 50%;}
.point_en img{width: 58%;margin-bottom: 2%;}

/* section 8 スペシャル動画コンテンツ */
.special{background-image:url("../img/special_back.jpg");background-repeat: no-repeat;background-size: cover;}

/* section 9 リーベンホームの施工エリア */
.area{background-image:url("../img/area_back.jpg");background-repeat: no-repeat;background-size: contain;background-color: #f8f8f8;}
.area_left{width: 24%;border-right: solid 1px #666666;margin-left: 5%;padding: 1% 0;}
.area_right{width: 60%;margin-right: 5%;padding-top: 1%;}


/* 新着情報CSS追加20231019 */
.oshirase_mark{width: 14%;float: left;}
ul.news li{width: 100%; margin: 1.6% 0;padding: 2% 3%;list-style:none;border-bottom: dotted 1px gray;clear: both;}
ul.news li p{display:inline-block;float:left;width:86%;}

/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */
/* スマホ版 w560以下に適応するcss *************************************************************** */

@media screen and (max-width: 560px) {
/* 新着情報CSS追加20231019 */
.oshirase_mark{width: 100%;float: none;}
ul.news li{width: 100%; margin: 1.6% 0;padding: 2% 3%;list-style:none;border-bottom: dotted 1px gray;clear: both;}
ul.news li p{display:inline-block;float:none;width:100%;}

/* section 1 */
.slide_logo{width: 50%;margin-top: 10%}
/* section 2 */
.h2_concept{letter-spacing: 0;font-weight: bold;background-image: url("../img/h2_concept.svg");
background-repeat: no-repeat;background-size: 20%;height: 80px;padding-top: 30px;background-position:left;width: 100%;margin: 0 auto;padding-left: 5%;}
.concept_small{font-size: 60%;color: #93a3ab;}

/* section 3 */
.h2_news{letter-spacing:0em;font-weight: bold;
height: 80px;padding-top: 50px;width: 100%;margin: 0 auto;}

/* section 4 */
.remote{background-image: url("../img/remote_back.jpg");background-repeat: no-repeat;
background-size: cover;padding: 10% 10%;}
.remote_box{background: #ffffff;border-radius: 20px;padding: 0 8% 10%;box-shadow: 4px 4px 6px gray;}
.remote_mark{width: 20%;margin-top:-20px;float: right;margin-right: -60px;opacity:0.5;}
.pr5per{padding-right: 0%;}
/* section 5 */
.h2_works{letter-spacing: 0em;font-weight: bold;background-image: url("../img/works_mark.svg");
background-repeat: no-repeat;background-size: 20%;height: 80px;padding-top: 20px;background-position:left;width: 100%;margin: 0 auto;padding-left: 5%;}
	
	.h2_movie{letter-spacing: 0em;font-weight: bold;background-image: url("../img/movie_mark.svg");
background-repeat: no-repeat;background-size: 20%;height: 80px;padding-top: 20px;background-position:left;width: 100%;margin: 0 auto;padding-left: 5%;}
	
	
	
.works_back{background-image: url("../img/works_back_sp.jpg");
background-repeat: no-repeat;background-size: contain;height: auto;}
.works_mark{width: 80%;padding: 55% 10% 0;margin: 0 auto;}
.works02{width: 100%;padding: 10% 0% 5%;}
.h4_works{font-size: 100%;}
.p_works{font-size: 80%;}
.motto_wide02{width: 70%;padding-top: 5%;}
.plan_back{background-image: url("../img/plan_back_sp.jpg");
background-repeat: no-repeat;background-size: contain;height: auto;}
/* section 6 */
.h2_construction{letter-spacing: 0em;font-weight: bold;background-image: url("../img/book.svg");
background-repeat: no-repeat;background-size: 20%;height: 80px;padding-top: 20px;background-position:left;width: 100%;margin: 0 auto;padding-left: 5%;}

.h2_report{letter-spacing: 0em;font-weight: bold;background-image: url("../img/report_img.svg");
background-repeat: no-repeat;background-size: 18%;height: 80px;padding-top: 10px;background-position:left;width: 100%;margin: 0 auto;padding-left: 5%;}

.report{background-image: url("../img/report_back.png");background-repeat: no-repeat;background-size: contain;background-position: bottom;padding-bottom: 30%;}
	
/* section 6 はじめての家づくり */
.point_back	{
	background-image:url("../img/point_back_sp.png");background-repeat: no-repeat;background-size: contain;padding-bottom: 35%;
	background-position: top center;}
.point_en {width: 100%; background-image:url("../img/point_en.png");background-repeat: no-repeat;background-size: contain;text-align: center;padding-top: 30%;padding-bottom: 12%}
.point_left{width: 84%;margin-left: 8%;}
.lh_mark{width: 30%;}
.point_en img{width: 58%;margin-bottom: 2%;}
	
/* section 9 リーベンホームの施工エリア */
.area{background-image:url("../img/area_back.jpg");background-repeat: no-repeat;background-size: cover;}
.area_left{width: 95%;border-right: none;margin-left: 5%;padding: 1% 0;}
.area_right{width: 95%;margin-right: 0%;padding-top: 1%;margin-left: 5%;}
	
}

