@charset "UTF-8";

/*==================================================================
  design.css ― グローベル浦和 ザ・ヒルズ / DESIGN 専用スタイル
  ・共通CSS(base/margin_padding/width/common/hd_ft ほか)を土台に。
  ・801pxブレイク（〜800=スマホ / 801〜=PC）。
  ・見出し・本文は designスライス から書き出した透過画像スライスを配置、
    写真は design@2x から実寸切り出し、背景の暗色帯はCSSグラデーション。
==================================================================*/

/*---------- フルワイド写真 ----------*/
.dsn_main{
	clear:both;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	position:relative;
}
.dsn_main img{ width:100%; height:auto; }

/*---------- テキストスライス（透過画像・中央） ----------*/
.dsn_txt{
	clear:both;
	width:100%;
	margin:0 auto;
	text-align:center;
	position:relative;
}
.dsn_txt img{
	width:auto;
	height:auto;
	max-width:88%;
	margin:0 auto;
}

/*---------- 暗色帯（Facade〜Entrance Hall） ----------*/
.dsn_dark{
	clear:both;
	width:100%;
	margin:0;
	padding:0;
	position:relative;
	background:#3a2c27;
	background:linear-gradient(180deg,#564a44 0%,#3a2c27 46%,#241a16 100%);
}

/*---------- コンテンツ内写真（contents1000等に内包） ----------*/
.dsn_ph{ clear:both; width:100%; position:relative; }
.dsn_ph img{ width:100%; height:auto; }

/*---------- キャプション ----------*/
.dsn_cap{
	clear:both;
	width:100%;
	margin-top:0.5em;
	font-family:'NotoSerifCJKjp','Noto Serif JP','ヒラギノ明朝 Pro W3',serif;
	color:#4a423c;
	text-align:right;
	letter-spacing:0.02em;
	line-height:140%;
	font-size:2.5vw;
}
.dsn_cap.fff{ color:#d9d2c6; }
.dsn_cap.abs{
	position:absolute;
	right:1em;
	bottom:0.6em;
	margin:0;
	color:#fff;
	text-shadow:0 0 3px rgba(0,0,0,.6),0 0 6px rgba(0,0,0,.5);
}
@media print,screen and (min-width:801px){
	.dsn_cap{ font-size:11px; }
}

/*---------- 植栽 6点グリッド ----------*/
.dsn_plants{
	clear:both;
	width:100%;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.dsn_plants .p{ width:31.5%; margin-bottom:16px; }
.dsn_plants .p img{ width:100%; height:auto; }
.dsn_plabel{
	width:100%;
	text-align:center;
	margin-top:0;
	padding: 4px 0 5px;
	font-family: "noto-serif-jp", 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', sans-serif;
	color:#fff;
	letter-spacing:0.02em;
	line-height:120%;
	font-size:2.65vw;
	background: #695d42;
}
@media print,screen and (min-width:801px){
	.dsn_plants .p{ width:15.2%; margin-bottom:0; }
	.dsn_plabel{ font-size:14px; }
}

/*---------- 注釈 ----------*/
.dsn_notes{
	clear:both;
	width:100%;
	font-family:'Noto Sans JP',sans-serif;
	color:#6a635d;
	font-size:2.4vw;
	line-height:170%;
	letter-spacing:0.01em;
}
.dsn_notes p{ padding-left:1em; text-indent:-1em; }
.dsn_notes p.ind{ padding-left:1.9em; text-indent:0; }
@media print,screen and (min-width:801px){
	.dsn_notes{ font-size:11.5px; }
}



.design_feat{ clear:both; width:100%; }
.design_feat_row{
	clear:both;
	width:100%;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-start;
	background: #d1c9ad;
}
@media print,screen and (min-width:801px){
	.design_feat_row.rev{ flex-direction:row-reverse; }
}


.design_feat_txtcol{
	width:100%;
	
}
.design_feat_txtcol2{
	width:85%;
	height: auto;
	margin: 0 auto;
	padding: 30px 0 10px;
	
}
.design_feat_phcol{
	width:100%;
	position: relative;
}
@media print,screen and (min-width:801px){
.design_feat_txtcol{
	width:52%;
	max-width: 520px;
	
	width: 100%;
	height: auto;
	margin: 0 ;
	padding: 0;
	
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	
}
.design_feat_txtcol2{
	width:80%;
	height: auto;
	margin: 0 auto;
	
}
.design_feat_phcol{
	width:48%;
	max-width: 480px;
}
}



/*---------- 小見出し（ボックス内・明朝ボールド） ----------*/
.design_head{
	clear:both;
	width:100%;
	font-family: "noto-serif-jp", 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', sans-serif;
	font-weight:500;
	text-align:left;
	color: #231815;
	letter-spacing:0.04em;
	line-height:150%;
	font-size:3.6vw;
	font-feature-settings: "palt";/*（自動カーニング）*/
}
.design_head.fff01{ color:#fff; }
@media print,screen and (min-width:801px){
.design_head{
	font-size:18px;
	line-height:166%;
}
}




/*---------- 本文（明朝・両端揃え） ※共通 contents_txt2 を基本利用。補助 ----------*/
.design_txt{
	clear:both;
	width:100%;
	font-family: "noto-serif-jp", 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', sans-serif;
	font-weight:400;
	text-align:justify;
	color: #231815;
	letter-spacing:0.04em;
	line-height:160%;
	font-size:2.8vw;
	font-feature-settings: "palt";/*（自動カーニング）*/
}
.design_txt.fff01{ color:#fff; }
.design_txt.center{ text-align:center; }
@media print,screen and (min-width:801px){
.design_txt{
	font-size:14px;
	line-height:186%;
}
}




/* 〜スマホ共通 */
.design_feat_row{ width:100%; }
.design_feat_txtcol{ width:100%; }
.design_feat_txtcol2{
	width:85%;
	margin:0 auto;
	padding:30px 0 10px;
}
.design_feat_phcol{ width:100%; position:relative; }

@media print,screen and (min-width:801px){
.design_feat_row{
	display:flex;              /* ★ 追加：2カラムを横並びに */
	flex-wrap:nowrap;
	align-items:stretch;       /* ★ 追加：txtcol を写真の高さまで伸ばす */
	justify-content:space-between;
}
.design_feat_txtcol{
	width:52%;                 /* ★ width:100% の上書きを削除 */
	margin:0;
	padding:0;
	display:flex;
	align-items:center;        /* txtcol2 を縦センター */
	justify-content:center;
}
.design_feat_txtcol2{
	width:80%;
	max-width:520px;           /* ← max-width は中身側へ移動 */
	margin:0 auto;
	padding:0;
}
.design_feat_phcol{ width:48%; }
}