@charset 'utf-8';
/*	Cascading Style Sheets: style.css 5.2	*/


/* ヘッダー */
header a{color:#3d3d3d;}

/*共通ここから*/
.TOP_CONTENTS {width: 1000px;margin: 0 auto;margin-bottom: 100px;}
.TYTLES {margin-bottom: 40px;text-align: center;}
.TYTLES div {font-size: 12px;}
.TOP_IMG{position: relative;}
.TOP_IMG small {position: absolute;color: white;top: 54vw;letter-spacing: 1px;position: absolute;color: white;top: 53.5vw;letter-spacing: 1px;width: 99vw;text-align: right;font-size: 0.9rem;margin-right: 1vw;}

/*トップここから*/
.scrolldown1 {position: absolute;left: 50%;bottom: 10px;height: 50px;top: 46vw;}
.scrolldown1 span {position: absolute;left: -27px;top: -15px;color: #000;font-size: 0.7rem;letter-spacing: 0.15em;font-weight: 600;}
.scrolldown1::after {content: "";position: absolute;top: 0;width: 1px;height: 30px;background: #161616;animation: pathmove 1.4s ease-in-out infinite;opacity: 0;}
.top_tytle_logo {width: 240px;margin: 0 auto;margin-bottom: 20px;}
.top_tytle1 {letter-spacing: 4px;font-size: 18px;font-weight: 500;margin-top: 50px;letter-spacing: .2em;font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;}
.MAIN_COPY {position: absolute;bottom: 0px;left: 0;width: 43vw;}
.top_tytles {position: absolute;color: black;z-index: 1;text-align: center;top: 13vw;width: 15vw;
right:10vw;margin: 0 auto;}
.point {width: 22vw;margin: 0 auto;margin-top: 25px;}
@keyframes pathmove {
	0% {height: 0;top: 0;opacity: 0;}
	30% {height: 30px;opacity: 1;}
	100% {height: 0;top: 50px;opacity: 0;}
}


/*ニュースここから*/
.TOP_NEWS {	padding: 70px 0;margin-bottom: 100px;}
.TOP_NEWS a{display: initial;text-decoration: underline;}
.TOP_NEWS a:hover{opacity: 0.5;}
table {width: 800px;margin: 0 auto;}
tr {border-bottom: 1px solid #ccc;display: block;width: 800px;padding: 0 20px;padding-bottom: 5px;display: flex;padding: 12px 20px;}
th {font-weight: initial;letter-spacing: 2px;margin-right: 40px;display: inline-block;line-height: 24px;}
td {font-size: 15px;letter-spacing: 2px;}


/*ボタン*/
.BUTTONS {display: flex;margin-bottom: 70px;width: 960px;flex-wrap: wrap;margin: 0 auto;justify-content: center;margin-bottom: 80px;margin-top: 40px;flex-direction: column;}
.BUTTON{display: flex;justify-content: center;}
.btn{position: relative;overflow: hidden;text-decoration: none;display: inline-block;border: 2px solid #555;text-align: centeroutline: nonetransition: ease .2s;width: 270px;text-align: center;margin: 10px;padding: 15px 0;box-shadow: 2px 2px 4px #ccc;}
.btn span {position: relative;z-index: 3;color:#333;font-size: 17px;letter-spacing: 2px;}
.btn:hover span{color:#fff;}
.bgskew::before {content: '';position: absolute;top: 0;left: -130%;background:#333;width:120%;height: 100%;transform: skewX(-25deg);}
.bgskew:hover::before {animation: skewanime .5s forwards;}
@keyframes skewanime {100% {left:-10%;}}
.BUTTONS small{font-size: 13px;letter-spacing: 1px;}


/*コンセプトここから*/
.TOP_CONCEPT_BACK{padding-bottom: 30px;padding-top: 150px;margin-top: -170px;background-image: url(../img/background.jpg);background-size: cover;}
.TOP_CONCEPT{display: flex;width: 1050px;margin: 0 auto;flex-direction: row;margin-top: 150px;justify-content: space-between;margin-bottom: 520px;}
.CONCEPT_TYTLES{text-align: left;}
.TYTLE{font-size: 22px;letter-spacing: 5px;margin-bottom: 20px;color: #161616;font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;line-height: 41px;text-align: center;}
.CONCEPT_TYTLE{font-size: 30px;text-align: left;}
.TOP_CONCEPT_RIGHT{font-size: 15px;letter-spacing: 3px;line-height: 37px;position: relative;}
.TOP_CONCEPT_LEFT{width: 300px;position: relative;}
.TYTLES div.CON_TYTLE{width: 270px;text-align: left;}
.CONCEPT_PHOTO1{width: 265px;position: absolute;left: -3vw;top: 250px;}
.CONCEPT_PHOTO2{width: 240px;position: absolute;top: 550px;right: -2vw;}
.CONCEPT_PHOTO3{width: 630px;position: absolute;top: 620px;right: -6vw;}
.CONCEPT_PHOTO4{width: 260px;position: absolute;top: 810px;left: -7vw;}
.CONCEPT_PHOTO1 img{border-radius: 5px;}
.CONCEPT_PHOTO2 img{border-radius: 5px;}
.CONCEPT_PHOTO3 img{border-radius: 5px;}
.CONCEPT_PHOTO4 img{border-radius: 5px;}



.top_concepts{text-align: center;background-size: contain;padding-bottom: 70px;}
.square {font-size: 18px;border: 1px solid #4d4d4d;padding: 15px 0px;width: 380px;margin: 0 auto;letter-spacing: 5px;}
.plus{font-size: 20px;padding: 0px;font-weight: bold;}
.equal{font-size: 20px;padding: 10px 0px;font-weight: bold;writing-mode: vertical-rl;
margin: 0 auto;}
.line {border-top: 1px solid #ccc;width: 700px;margin: 0 auto;margin-bottom: 40px;}
.concept_bun {letter-spacing: 1px;line-height: 40px;font-size: 16px;margin: 40px 0 0 0;}
.concept_bun_lo{line-height: 48px;}
.concept_img {width: 250px;margin: 10px;height: auto;}
.concept_img img{width: 100%;margin-left: 3px;}
.concept_imgs {display: flex;margin: 0 auto;width: 810px; margin-bottom: 50px;margin-top: 30px;}
.concept_img img{width: 100%;}
.name{letter-spacing: 4px;line-height: 40px;font-size: 23px;margin-left: 1vw;}





/*ランドプランここから*/
.TOP_LANDPLAN{padding-top: 50px;padding-bottom: 80px;background: #EDEDED;}
.LANDPLAN_WRAP{display: flex;flex-direction: row;margin: 0 auto;justify-content: space-between;margin-top: 40px;align-items: center;width: 1000px;}
.LANDPLAN_TEXT{width: 500px;line-height: 30px;letter-spacing: 1px;text-align: justify;}
.LANDPLAN_TEXT small{line-height: 18px;display: inline-block;text-align: justify;margin-top: 20px;}
.LANDPLAN_KUKAKU{width: 1000px;background: white;margin: 0 auto;padding: 10px 50px;padding: 10px 80px;margin-top: 40px;}
.LANDPLAN_IMG{width: 450px;}

/*コンテンツここから*/
.TOP_CON{padding-top: 80px;}
.CONTENTS_WRAP{width: 1000px;margin: 0 auto;}
.CONTENTS{position: relative;height: 380px;}
.CONTENTS_TYTLE{color: rgba(155,145,135,0.23);font-weight: 600;font-size: 54px;letter-spacing: 11px;}
.CONTENTS_TEXT{width: 390px;position: absolute;z-index: 1;background: rgba(237,237,237,0.80);padding: 35px 45px;font-size: 15px;letter-spacing: 1px;text-align: justify;line-height: 24px;top: 60px;}
.CONTENTS_TEXT::before {position: absolute;background: none;top: -27px;z-index: -1;color: rgba(155,145,135,0.23);font-size: 47px;letter-spacing: 5px;}
.CONTENTS_IMG{width: 630px;position: absolute;right: 0;}
.CONTENTS_IMG::before {content: "";width: 190px;height: 190px;position: absolute;background: #A09F9F;bottom: -25px;right: -25px;z-index: -1;}
.CONTENTS_TEXT_PLAN::before{content: "PLAN";left: 0px;}
.CONTENTS_TEXT_SPEC::before{content: "EQUIPMENT";right: 0px;}
.CONTENTS_TEXT_LOCATION::before{content: "LOCATION";left: 0px;}
.CONTENTS_TEXT_OUTLINE::before{content: "OUTLINE";right: 0px;}
.CONTENTS_TEXT_R{right: 0;}
.CONTENTS_IMG_R{left: 0;}
.CONTENTS_IMG_R::before{left: -25px;}


/*矢印が右に移動する*/
.btnarrow4{
    /*矢印と下線の基点とするためrelativeを指定*/
	position: relative;
    /*形状*/
	padding: 0 20px;
    color: #333;
    text-decoration: none;
    outline: none;
		margin-top: 20px;
		display: block;
		width: 150px;
padding: 0;
font-size: 16px;
letter-spacing: 2px;
}

.btnarrow4:hover{opacity: 0.5}

/*矢印と下線の形状*/
.btnarrow4::before{
    content: '';
    /*絶対配置で下線の位置を決める*/
	position: absolute;
    bottom:7px;
    left:77%;
    /*下線の形状*/
    width: 85%;
    height: 1px;
	background:#333;
    /*アニメーションの指定*/
    transition: all .3s;
}

.btnarrow4::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    bottom:11px;
    right:-63%;
    /*矢印の形状*/
    width: 15px;
    height:1px;
	background:#333;
    transform: rotate(35deg);
    /*アニメーションの指定*/
    transition: all .3s;
}

/*hoverした際の移動*/
.btnarrow4:hover::before{
    left:90%;
}

.btnarrow4:hover::after{
    right:-75%;
}






/*PC・SP*/
.pc {display: block;}
.sp {display: none;}






@media screen and (max-width: 740px) {

	/*共通ここから*/
	.menu-btn i {	color: #161616;}
	/* header{margin-top: 89px;} */
	header.scroll-nav{border-bottom: none;}

	/*トップここから*/
	/* .TOP_IMG{padding-top: 138px;} */
	.TOP_IMG small {top: 54vw;letter-spacing: 1px;color: white;top: 158.5vw;letter-spacing: 1px;width: 99vw;text-align: left;font-size: 0.8rem;margin-left: 1vw;font-weight: bold;font-weight: initial;}
	.scrolldown1 {top: 145vw;}
	.top_tytles {width: 35vw;margin: 0 auto;left: -42vw;top: 25vw;}
	.top_tytle_logo {width: 50vw;}
	.top_tytle1 {font-size: 16px;letter-spacing: 0.1em;margin-top: 50px;}
	.MAIN_COPY {left: 0;width: 84vw;}
	.point {width: 67vw;margin: 0 auto;margin-top: 40px;}

	/*ニュースここから*/
	.TOP_NEWS {padding: 35px 0 40px 0;margin-bottom: 50px;background: none;}
	.TYTLES {margin-bottom: 0px;}
	table {width: 95vw;}
	tr {padding: 12px 0px;width: 95vw;flex-direction: column;text-align: left;}


	/*PC・SP*/
	.pc {display: none;}
	.sp {display: block;}
	#footer span.pc {display: none;}
	#footer span.sp {display: block;}
	#footer strong a {display: flex;justify-content: center;align-items: center;	}
	#footer strong a img {height: 24px;}
	.TOP_CONTENTS .TYTLES {margin-bottom: 30px;	}

	/*ボタン*/
	.BUTTONS {width: 100vw;background: #b4b4b4;margin: 0;padding-bottom: 80px;padding-top: 40px;}
	.btn{background: white;margin: 10px auto;}
	.BUTTONS .TYTLES{margin-bottom: 20px;width: 100vw;}
	.BUTTON{flex-direction: column;width: 100vw;}

	/*コンセプトここから*/
	.TOP_CONCEPT_BACK{background-image: url(../img/background_sp.jpg);background-size: cover;}

	.CONCEPT_TYTLE{font-size: 25px;margin: 0 auto;margin-top: 26px;letter-spacing: 3px;}
	.CONCEPT_TEXT{margin: 0 auto;text-align: justify;font-size: 15px;line-height: 30px;}
	.CONCEPT_IMG{width: 90vw;}
	.TOP_CONCEPT{flex-direction: column;width: 75vw;margin-bottom: 20px;margin-top: 0px;margin-left: 15vw;}
	.TOP_CONCEPT_RIGHT{text-align: justify;margin-top: 20px;line-height: 2.3;}
	.CONCEPT_PHOTO1 {width: 52vw;position: absolute;left: 0vw;top: -14vw;z-index: 1;}
	.CONCEPT_PHOTO2 {width: 67vw;position: absolute;top: 9vw;right: -4vw;z-index: 1;}
	.CONCEPT_PHOTO3 {width: 75vw;position: initial;margin-top: 50px;}
	.CONCEPT_PHOTO4{width: 75vw;right: 0vw;position: initial;margin-top: -20px;margin: 0 0 0 auto;}
	.CONCEPT_PHOTO3 img{border-radius: 0px;margin-bottom: 15px;}
	.CONCEPT_PHOTO4 img{border-radius: 0px;margin-bottom: 15px;}
	.TYTLES div.CON_TYTLE{width: auto;line-height: 1.5;}
	.TOP_CONCEPT_BACK{padding-top: 230px;}


  /*ランドプランここから*/
	.TOP_LANDPLAN{padding-bottom: 0px;}
	.LANDPLAN_WRAP{flex-direction: column;width: 90vw;margin-top: 20px;}
	.LANDPLAN_TEXT{width: 90vw;}
	.LANDPLAN_IMG{width: 90vw;margin: 0 auto;margin-top: 30px;margin-bottom: 30px;}
	.LANDPLAN_KUKAKU{width: 100vw;padding: 0;margin-top: 30px;background: none;}

	/*コンテンツ*/
	.CONTENTS_WRAP{margin-top: 40px;width: 100vw;margin-top: 60px;}
	.CONTENTS{width: 100vw;height: 410px;height: auto;margin-bottom: 70px;display: flex;flex-direction: column-reverse;}
	.CONTENTS_R{flex-direction: column-reverse;}
	.CONTENTS_IMG::before {display: none;}
	.CONTENTS_IMG{width: 100vw;z-index: 2;position: initial;}

	.CONTENTS_TEXT{width: 100VW;top: 120px;position: initial;}
	.CONTENTS_TEXT_PLAN::before{display: none;}
	.CONTENTS_TEXT_SPEC::before{display: none;}
	.CONTENTS_TEXT_LOCATION::before{display: none;}

	.CONTENTS_IMG_PLAN::after{font-weight: 600;color: rgba(155,145,135,0.23);content: "PLAN";position: absolute;top:0px;top: -46px;font-size: 50px;letter-spacing: 5px;}
	.CONTENTS_IMG_SPEC::after{font-weight: 600;color: rgba(155,145,135,0.23);content: "EQUIPMENT";position: absolute;top:0px;top: -46px;font-size: 50px;letter-spacing: 5px;}
	.CONTENTS_IMG_LOCATION::after{font-weight: 600;color: rgba(155,145,135,0.23);content: "LOCATION";position: absolute;top:0px;top: -46px;font-size: 50px;letter-spacing: 5px;}
  .TOP_CON{padding-bottom: 0px;}

}