/***************************************
	PC版インテリアスタイルページ用CSS
	
	
***************************************/


/* インテリアスタイルページ */


.interior-overview-section{

}

.interior-overview-section h2.interior-overview-headline{
	border-bottom:#6dacbd 2px solid;
	padding:0 0 12px;
	font-size:28px;
	max-width:1000px;
	margin: 0 auto 14px;
}

.interior-overview-section ul.interior-overview-style-list{
	display:flex;
	max-width:1000px;
	margin:40px auto;
}

.interior-overview-section ul.interior-overview-style-list li{
	width:100%;
	margin:0 10px 40px;
}



.interior-overview-section ul.interior-overview-style-list li a:link,
.interior-overview-section ul.interior-overview-style-list li a:visited{
	display:block;
	font-size:20px;
	color:#ffffff;
	text-align:center;
	padding:10px 10px 40px;
	position:relative;
}

.interior-overview-section ul.interior-overview-style-list li a:hover,
.interior-overview-section ul.interior-overview-style-list li a:active{
	opacity:0.6;
}

.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-urban a:link,
.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-urban a:visited{
	background:url('../img/about/interior/overview-navi-bottom-arrow-urban.png') no-repeat;
	background-position:center 100%;
}

.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-urban a span{
	display:block;
	background:rgba(66,33,11,0.7);
	padding:10px;
}


.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-natural a:link,
.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-natural a:visited{
	background:url('../img/about/interior/overview-navi-bottom-arrow-natural.png') no-repeat;
	background-position:center 100%;
}

.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-natural a span{
	display:block;
	background:rgba(199,178,153,0.7);
	padding:10px;
}

.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-french a:link,
.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-french a:visited{
	background:url('../img/about/interior/overview-navi-bottom-arrow-french.png') no-repeat;
	background-position:center 100%;
}

.interior-overview-section ul.interior-overview-style-list li.interior-overview-style-french a span{
	display:block;
	background:rgba(111,172,189,0.7);
	padding:10px;
}


	/* アーバン */
	
.interior-urban-section{
	position:relative;
	margin-bottom:10vw;
}

.interior-urban-section .interior-urban-main-image{
	margin:0 5% 100px;
	position:relative;
	z-index:1;
}

.interior-urban-section .interior-urban-main-image img{
	width:70%;
}

.interior-urban-section .interior-urban-main-image::after{
	content:"";
	position:absolute;
	right:5%;
	top:15%;
	left:50%;
	bottom:-40%;
	background:rgba(66,33,11,0.13);
	z-index:-1;
	width:45%;
	height:140%;
}

.interior-urban-section .interior-urban-body{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: repeat(3, 1fr);
	gap: 2vw;
	margin:0 5%;
}

.interior-urban-section .interior-urban-body dl.interior-urban-description{
	grid-column: 1;
	grid-row: 1;
}

.interior-urban-section .interior-urban-body dl.interior-urban-description dt{
	margin-bottom:2vw;
	margin-right:4vw;
}

.interior-urban-section .interior-urban-body dl.interior-urban-description dt img{
	width:100%;
}

.interior-urban-section .interior-urban-body dl.interior-urban-description dd{
	color:#2a3133;
	font-size:2.1vw;
	line-height:2;
	font-weight:300;
}

.interior-urban-section .interior-urban-body .interior-urban-image2{
	grid-column: 2;
	grid-row: 1 / span 2;
	text-align:right;
	z-index:1;
	margin-left:8vw;
	margin-right:2vw;
}

.interior-urban-section .interior-urban-body .interior-urban-image3{
	grid-column: 1;
	grid-row: 2 / span 2;
	position:relative;
	z-index:1;
	padding-top:15vw;
	padding-right:5vw;
	overflow:visible;
	padding-left:2vw;
}

.interior-urban-section .interior-urban-body .interior-urban-image3::before{
	content:"";
	background: url('../img/about/interior/urban-theme-icon.png') no-repeat;
	background-position:100% 0;
	background-size:16vw auto;
	z-index:-1;
	position:absolute;
	top:-6vw;
	left:30vw;
	bottom:0;
	width:16vw;
}

.interior-urban-section .interior-urban-body .interior-urban-image3::after{
	content:"";
	background:rgba(66,33,11,0.13);
	background-position:20vw 0;
	background-size:16vw auto;
	z-index:-1;
	position:absolute;
	top:0;
	left:4vw;
	right:0;
	bottom:0;
	overflow:visible;
}

.interior-urban-section .interior-urban-body .interior-urban-image3 .interior-urban-image3-caption{
	font-size:1.4vw;
	color:#2a3133;
	padding-top:1vw;
	text-align:center;
}

.interior-urban-section .interior-urban-body .interior-urban-image4{
	grid-column: 2;
	grid-row: 3;
	margin-right:6vw;
	margin-left:0vw;
	padding-top:2vw;
	margin-bottom:3vw;
}



	/* ナチュラル */
	
.interior-natural-section{
	position:relative;
	margin-bottom:120px;
}

.interior-natural-section .interior-natural-main-image{
	margin:0 5% 100px;
	position:relative;
	z-index:1;
	text-align:right;
}

.interior-natural-section .interior-natural-main-image img{
	width:70%;
}

.interior-natural-section .interior-natural-main-image::after{
	content:"";
	position:absolute;
	left:5%;
	top:15%;
	right:45%;
	bottom:-30%;
	background:rgba(199,178,153,0.13);
	z-index:-1;
	width:50%;
	height:130%;
}



.interior-natural-section .interior-natural-body{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1px 1fr 1ft 1fr;
	gap: 2vw;
	margin:0 5%;
}

.interior-natural-section .interior-natural-dummy-first{
	/* 順番を調整するため */
	grid-column: 1;
	grid-row: 1;
}

.interior-natural-section .interior-natural-body dl.interior-natural-description{
	grid-column: 2;
	grid-row: 1 / span 2;
}

.interior-natural-section .interior-natural-body dl.interior-natural-description dt{
	margin-bottom:2vw;
	margin-right:0vw;
}

.interior-natural-section .interior-natural-body dl.interior-natural-description dt img{
	width:100%;
}

.interior-natural-section .interior-natural-body dl.interior-natural-description dd{
	color:#2a3133;
	font-size:2.2vw;
	line-height:2;
	font-weight:300;
}

.interior-natural-section .interior-natural-body .interior-natural-image2{
	grid-column: 1;
	grid-row: 2 / span 2;
	text-align:left;
	z-index:1;
	margin-right:8vw;
	margin-left:0vw;
	margin-top:-40px;
}

.interior-natural-section .interior-natural-body .interior-natural-image3{
	grid-column: 2;
	grid-row: 3 / span 2;
	position:relative;
	z-index:1;
	padding-top:7vw;
	padding-right:5vw;
	overflow:visible;
	padding-left:5vw;
	margin-right:5vw;
}

.interior-natural-section .interior-natural-body .interior-natural-image3::before{
	content:"";
	background: url('../img/about/interior/natural-theme-icon.png') no-repeat;
	background-position:100% 0;
	background-size:10vw auto;
	z-index:-1;
	position:absolute;
	top:-3vw;
	left:24vw;
	bottom:0;
	width:16vw;
}

.interior-natural-section .interior-natural-body .interior-natural-image3::after{
	content:"";
	background:rgba(199,178,153,0.13);
	background-position:0vw 0;
	background-size:16vw auto;
	z-index:-1;
	position:absolute;
	top:3vw;
	left:0vw;
	right:0;
	bottom:0;
	overflow:visible;
}

.interior-natural-section .interior-natural-body .interior-natural-image3 .interior-natural-image3-caption{
	font-size:1.4vw;
	color:#2a3133;
	padding-top:1vw;
	text-align:center;
}

.interior-natural-section .interior-natural-body .interior-natural-image4{
	grid-column: 1;
	grid-row: 4;
	margin-right:2vw;
	margin-left:6vw;
	padding-top:2vw;
	margin-bottom:3vw;
}


.interior-natural-section .interior-natural-body .interior-natural-image4 .interior-natural-image4-caption{
	font-size:1.4vw;
	color:#2a3133;
	padding-top:1vw;
	text-align:center;
}



	/* フレンチ */
	
.interior-french-section{
	position:relative;
	margin-bottom:10vw;
}

.interior-french-section .interior-french-main-image{
	margin:0 5% 100px;
	position:relative;
	z-index:1;
}

.interior-french-section .interior-french-main-image img{
	width:70%;
}

.interior-french-section .interior-french-main-image::after{
	content:"";
	position:absolute;
	right:5%;
	top:15%;
	left:50%;
	bottom:-40%;
	background:rgba(109,172,189,0.13);
	z-index:-1;
	width:45%;
	height:140%;
}

.interior-french-section .interior-french-body{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: repeat(3, 1fr);
	gap: 2vw;
	margin:0 5%;
}

.interior-french-section .interior-french-body dl.interior-french-description{
	grid-column: 1;
	grid-row: 1;
}

.interior-french-section .interior-french-body dl.interior-french-description dt{
	margin-bottom:2vw;
	margin-right:4vw;
}

.interior-french-section .interior-french-body dl.interior-french-description dt img{
	width:100%;
}

.interior-french-section .interior-french-body dl.interior-french-description dd{
	color:#2a3133;
	font-size:2.1vw;
	line-height:2;
	font-weight:300;
}

.interior-french-section .interior-french-body .interior-french-image2{
	grid-column: 2;
	grid-row: 1 / span 2;
	text-align:right;
	z-index:1;
	margin-left:8vw;
	margin-right:2vw;
}

.interior-french-section .interior-french-body .interior-french-image3{
	grid-column: 1;
	grid-row: 2 / span 2;
	position:relative;
	z-index:1;
	padding-top:15vw;
	padding-right:5vw;
	overflow:visible;
	padding-left:2vw;
}

.interior-french-section .interior-french-body .interior-french-image3::before{
	content:"";
	background: url('../img/about/interior/french-theme-icon.png') no-repeat;
	background-position:100% 0;
	background-size:16vw auto;
	z-index:-1;
	position:absolute;
	top:-6vw;
	left:30vw;
	bottom:0;
	width:16vw;
}

.interior-french-section .interior-french-body .interior-french-image3::after{
	content:"";
	background:rgba(109,172,189,0.13);
	background-position:20vw 0;
	background-size:16vw auto;
	z-index:-1;
	position:absolute;
	top:0;
	left:4vw;
	right:0;
	bottom:0;
	overflow:visible;
}

.interior-french-section .interior-french-body .interior-french-image3 .interior-french-image3-caption{
	font-size:1.4vw;
	color:#2a3133;
	padding-top:1vw;
	text-align:center;
}

.interior-french-section .interior-french-body .interior-french-image4{
	grid-column: 2;
	grid-row: 3;
	margin-right:6vw;
	margin-left:0vw;
	padding-top:2vw;
	margin-bottom:3vw;
}


	/* アクセントクロス */
	

.interior-home-identity-section ul.interior-home-identity-design-list{
	display:flex;
	padding:0 20px 60px;
}

.interior-home-identity-section ul.interior-home-identity-design-list li{
	width:100%;
	margin:20px 20px;
}

.interior-home-identity-section ul.interior-home-identity-design-list li:nth-of-type(even){
	margin-top:6vh;
}

.interior-home-identity-section ul.interior-home-identity-design-list li:nth-of-type(3){
	margin-top:12vh;
}


	/* YouTubeへのリンク */
	
a.interior-youtube-link:link,
a.interior-youtube-link:visited{
	display:block;
	position:relative;
	overflow:hidden;
	background:#ffffff;
	transition:.3s;
}

a.interior-youtube-link:link::before,
a.interior-youtube-link:visited::before{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:rgba(255,255,255,0);
	z-index:1;
	width:100%;
	height:100%;
	content:"";
	transition:.3s;
}

a.interior-youtube-link:hover::before,
a.interior-youtube-link:active::before{
	background:rgba(255,255,255,0.5);
}

a.interior-youtube-link:link::after,
a.interior-youtube-link:visited::after{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100%;
	height:100%;
	background:url('../img/icon/sns/youtube-black-h128.png') no-repeat;
	background-size:30% auto;
	background-position:center;
	content:"";
	opacity:0;
	transition:.3s;
}

a.interior-youtube-link:hover::after,
a.interior-youtube-link:active::after{
	opacity:0.9;
	transition:.3s;
	z-index:2;
}