@charset "UTF-8";

.rad5 {
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;}
.rad10 {
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;}

.pdt30 {padding-top:30px;}
.mgt20 {margin-top:50px;}  
.mgt50 {margin-top:50px;} 
.mgt100 {margin-top:100px;} 

@keyframes gray_col {
0% {filter: grayscale(100%);opacity:0.1;}
100% {filter: grayscale(0%);opacity:1;}
}

/* ぼかしからクリア */
@keyframes blur {
0% {filter: blur(12px);}
100% {filter: blur(0px);}
}

@media screen and (min-width: 768px),print  {
span.pc_br {display:block;}
img.w100 { width:100%;}

/* common */
.pagetitle {width:1000px; margin:60px auto 0 auto; padding:0 0 20px 0px; font-size:16px; line-height:1.0em; color:#FFF;}
.pagetitle span {font-family: 'Noto Serif JP', serif; font-weight:300; font-size:30px; padding-right:20px; letter-spacing:5px; color:#8eb4a7;}
.pt_w span {color:#FFFFFF;}
.bk_black {background: rgba(0,0,0,.5); padding:100px 0}

h2.copy_L {font-size:32px; text-align:center; line-height:1.6em; margin:40px 0 50px 0; letter-spacing:5px;}
h2.copy_L2 {font-size:28px; text-align:left; line-height:1.6em; margin:40px 0 50px 0; letter-spacing:3px;}
.copy_M {font-size:15px; line-height:2.2em; margin:0 0 60px 0; letter-spacing:1px;}
.pc_center {text-align:center;}
.pc_left {text-align:left !important;}
.eng {text-align:center; font-size:40px; letter-spacing:4px; margin:0; clear:both; padding:120px 0 0 0;}
.engL {text-align:left; font-size:18px; letter-spacing:10px; margin:0px 0 50px 0;}
.eng2 {text-align:center; font-size:20px; letter-spacing:7px; color:#929179; margin:70px 0 50px 0;}

p.caps {margin:5px 0 20px 0; padding:0; text-align:right; line-height:1.2em; font-size:13px}
p.cap2 {font-size:14px; margin:0; padding:0;}
.txtS {font-size:12px; line-height:1.4em; display:inline-block; margin-top:5px; letter-spacing:0}
.notes {clear:both; padding:10px 0px; font-size:11px; margin:20px 0px 0 0px; text-align:left;}
	
.box4 {clear:both; width:100%; font-size:0;}
.box4 div {width:calc(25% - 12px); display: inline-block; margin:0 0 10px 15px}
.box4 div:nth-last-of-type(4n){margin:0 0 10px 0}
.box4 div img {width:100%}

/* アクセス */
#access .ac_txt {margin:30px 50px 0 0; width:420px; font-size:0; display:inline-block; vertical-align:top}
#access .ac_route {margin:0 0; width:600px; font-size:0; display:inline-block} 
#access .ac_photo {clear:both; text-align:center; margin:80px 0 100px;width:100%; font-size:0;}
#access .ac_photo div {display:inline-block; width:25%; padding:0 2px; vertical-align:top;box-sizing:border-box;}
#access .ac_photo div img {width:100%;}
#access .ac_photo p {margin:5px 10px 0; padding:0; line-height:1.2em; text-align:right; font-size:17px;}

/* ロケーション */
#location{}
#location .loc_main {animation: gray_col 5s; width:100%;}
#location h3 {font-size:26px; text-align:left; letter-spacing:3px}
#location p.caps {font-size:14px}
	
#location .p1_L {width:700px; display:inline-block; text-align:left; }
#location .p1_L h3,#location .p1_L p.copy_M {margin:40px 0 0 40px}
#location .p1_L img {margin-top: 70px}
#location .p1_L img,#location .p1_R img {width:100%}
#location .p1_R {width:275px; display:block; float:right; margin:0px 0 0 0;}
#location .p2 { text-align: left; padding-top: 100px}
#location .p2_h3 {margin:0 0 0 540px; padding-top:30px}
#location .p2_a:after {content: "";clear: both;display: block;}
#location .p2_a_t {width:540px; float:right; text-align: left;}
#location .p2_a_p {width:398px; float:left; margin-top: -110px}
#location .p2_b {clear:both; width:398px; display:inline-block; margin-bottom:100px}
#location .p2_c {width:660px; display:inline-block; text-align:right}
#location .p2_c div {width:300px; display: inline-block;}
#location .p2_c img {width: 260px}
#location .p2_c p.caps {font-size: 13px !important}

#location .p3_a_t {width:450px; text-align:left; float:left;}
#location .p3_a_p {width:300px; float:left; margin:0 20px 60px 0}
#location .p3_b {width:300px; float:left;}
	
#location h4{text-align:center; font-size:26px; letter-spacing:5px; margin:100px 0 0px 0;}
#location dl {width:490px; margin:0 20px; float:left; font-size:15px;}
#location dl span {width:490px; display:block; clear:both; padding:40px 0 5px 0; margin-bottom:10px; border-bottom:solid 1px #CCC; font-size:20px; letter-spacing:2px; color:#8eb4a7; text-align:left}
#location dl dt {width:310px; float:left; margin:0 0 5px 0; padding:0; text-align:left}
#location dl dd {width:180px; float:left; margin:0 0 5px 0; padding:0; text-align:right;}
#location dl:first-of-type {margin-right:40px;}
#location .loc_map img {padding:80px 0 0 0;width:100%;}


/* コンセプト */
#concept {}
#concept img {max-width: 100%}
#concept .pagetitle {padding-top:60px}
#concept .con_main {margin:-60px 0 100px; background:#252525 url(../img/concept/main_back.jpg) no-repeat right bottom; background-size:1200px auto; height:700px;animation: gray_col 4s;}
#concept .con_main .contents {position:relative;}
#concept .main_copy1 {width:150px; position:absolute; top:-50px; right:270px;animation: blur 2s;}
#concept .main_copy2 {width:280px; position:absolute; top:100px; left:240px;animation: blur 3s;}
#concept .aerial {margin-bottom:100px}
#concept .p1 {width:70.8%; margin-left:2%; float:left}
#concept .p2 {width:23.6%; margin-right:2%; float:right; font-size:0; line-height:0}
#concept img.p3 {margin-top:calc(100% * 0.05)}
#concept .p4_box {clear:both; margin-right:40px}
#concept .p4_box,#concept .p5_box {width:520px; margin-top: 50px; float:left}
#concept .p4_box h4,#concept .p5_box h4 {font-size:20px; border-bottom: solid 1px #CCC; padding:0 0 5px 3px; text-align: left; letter-spacing: 5px}
#concept .p4_box h4 span,#concept .p5_box h4 span {font-size:14px; margin-left: 40px; letter-spacing: 0}
#concept .p4_box img,#concept .p5_box img {width:200px; margin-bottom:80px; float:left}
#concept .p4_box p,#concept .p5_box p {width:300px; float:left; text-align:left; margin:0 0 0 15px}

/* デザイン */
#design{}
#design img {max-width: 100%}
#design .des_main {animation: blur 2s; width:100%;}
#design .main_copy {}
#design .suimen {width:400px; text-align:left; float:left; margin:20px 50px 0 0;}
#design .suimen img {width: 200px; float:left; margin:0 20px 0 0}
#design .art {width:630px; text-align:left; float:left; background: rgba(0,0,0,.3); padding:10px 30px; box-sizing: border-box}
#design .art h4 {text-align: center; border-bottom: solid 1px #CCC; font-size:18px; margin:0 0 10px; padding:0}
#design .art p {width:200px; float:left;}
#design .art img {width:350px; float:right;}

#design .gaikan_back {margin:250px 0 0; background:#171009 url(../img/design/gaikan_back.jpg) no-repeat right top; background-size:auto 550px; height:500px; position:relative;animation: gray_col 5s;}
#design .gaikan1 {width:500px; float:left; margin: -600px 0 0 50px;}
#design .gaikan1 p.caps{margin:-220px 0 40px 0; text-align:left !important}
#design .gaikan1_copy{width:480px; float:left; margin: -470px 0 0 50px; text-align:left;}
#design .gaikan1_copy h2 {text-align: left}
#design .gaikan2 {width:350px; float:right; margin:50px 0 50px 0; clear: both}
#design .gaikan2 p.caps{margin:-100px 0 100px 0;}
#design .gaikan2_copy{width:600px; float:left; margin:50px 0 0 50px; text-align:left;}
#design .hallway {width:400px; float:left; margin: 0px 0 80px 70px; clear: both}
#design .hallway_copy{width:400px; float:right; margin: 0px 100px 0 0px; text-align:left}

#design .landplan {width:450px; float:left; margin:50px 0px 0px 0; text-align:left;}
#design .landinfo {width:550px; float:right; margin:0px 0px 100px 0; text-align:left}
#design .landinfo div {padding:0 0 30px 0}
#design .landinfo h4 {font-size:18px; border-bottom: solid 1px #CCC; padding:0 0 5px 3px; letter-spacing: 1px}
#design .landinfo img {width: 200px}
#design .landinfo p {width:330px; float:right}
#design .landinfo div.lp3 {margin:0 0 -30px 0}
#design .landinfo img.lp3_b {height:148px; width:auto; margin:0 0 0 20px; vertical-align: bottom}
#design .lp3_txt p {width:100%; margin-bottom: 40px; clear: both;}
	
/* 間取り */
#plan {}

/* コンセプトルーム */
#conceptroom {}

/* 設備・仕様 */
#equipment {}

/* 構造セキュリティ */
#structure {}

/* 現地案内図 */
#map img.areamap {margin-bottom:20px; width:998px}
#map .salon {background:#222222; font-size:0; width: 1000px; margin:70px auto 50px; padding:20px 0}
#map .salon img {display:inline-block; height:300px; margin:0 30px}
#map .map_btn img {margin-left:20px; margin-right:20px;}

/* 物件概要 */
h2.ol {margin:50px 0 15px 45px; font-weight:300; text-align:left}
table.gaiyo {width:1000px; border-top: dotted 1px #999999; border-collapse:collapse; margin:0 auto;}
table.gaiyo th {border-bottom: dotted 1px #999999; width:200px; background:rgba(255,255,255,.1); padding: 10px 0px 10px 15px; font-weight:normal; color:#FFF; text-align:left;}
table.gaiyo td {border-bottom: dotted 1px #999999; padding: 10px 0 10px 15px; text-align:left}

/* コンセプトムービー */
#movie {}
}

@media screen and (max-width: 767px) {
span.smp_br {display:block;}
	
/* common */
.pagetitle {margin:50px 10px 0 10px; font-size:12px; padding:15px 10px 7px 10px; color:#FFF;}
.pagetitle span {font-family: 'Noto Serif JP', serif; font-weight:400; font-size:19px; padding-right:10px; letter-spacing:2px; color:#8eb4a7;}
.pt_w span {color:#FFFFFF;}
.bk_black {background: rgba(0,0,0,.5); padding:60px 0}
	
.copy_L {font-size:20px; line-height:1.6em; margin:30px 0 30px 0; letter-spacing:1px; text-align:center;}
.copy_L2 {font-size:19px; line-height:1.6em; margin:30px 0 20px 0; letter-spacing:0; text-align:left;}
.copy_M {font-size:15px; line-height:2.0em; margin:0 0 30px 0;}
.eng {text-align:center; font-size:18px; letter-spacing:3px; margin:50px 0 20px 0;}
.engL {text-align:center; font-size:14px; letter-spacing:5px; margin:50px 0 20px 0;}
.eng2 {text-align:center; font-size:14px; letter-spacing:3px; color:#929179; margin:40px 0 40px 0;}

p.caps {margin:5px 0 20px 0; padding:0; text-align:right; line-height:1.1em; font-size:12px}
p.cap2 {font-size:12px; margin:0; padding:0;}
.txtS {font-size:10px; line-height:1.4em; margin-top:5px;}
.notes {clear:both; padding:0; font-size:11px; margin:40px 0 20px 0; text-align:left; line-height:1.4em;}

.box4 {clear:both; width:100%; font-size:0;}
.box4 div {width:calc(50% - 10px); display: inline-block; margin:0 0 0 20px;}
.box4 div:nth-last-of-type(2n){margin:0;}
	
/* アクセス */
#access .ac_txt {margin:50px 25px 50px;} 
#access .ac_route {margin:0px 5px 70px 5px;} 
#access .ac_photo {clear:both; text-align:center; margin:0 0 40px 0;width:100%; font-size:0;}
#access .ac_photo div {display:inline-block; width:48%; margin:0 1% 0 0;}
#access .ac_photo div:nth-child(odd) {clear:both; margin-left:1%;}
#access .ac_photo p {margin:2px 0 20px 0; padding:0; line-height:1.2em; text-align:right; font-size:13px;}

/* ロケーション */
#location{}
#location .loc_main {animation: gray_col 5s;}
#location h3 {font-size:18px; text-align: center; letter-spacing:2px; padding:0px 0 30px; font-weight: bold}
#location .p1_L {margin-bottom:40px;}
#location .p1_R {font-size:0;text-align: center; width:calc(100% + 40px); margin:0 0 0 -20px;}
#location .p1_R div {width:32%; display: inline-block; }
#location .p1_R div:nth-of-type(2) {margin:0 1%}
#location .p2 { text-align: left; padding-top:60px}
#location .p2_a_t {width:43%; float:left; text-align: left;}
#location .p2_a_p,#location .p2_b {width:55%; float:right; margin-right:-20px}
#location .p2_a_p p.caps,#location .p2_b p.caps {padding-right:15px}
#location .p2_c:before {content: "";clear: both;display: block; width:100%; height:40px}
#location .p2_c {font-size:0; margin-bottom: 50px}
#location .p2_c div {width:46%; margin:0 2%; display: inline-block;}
#location .p3_a_p,#location .p3_b {margin:0 10% 20px}

#location h4{text-align:center; font-size:18px; letter-spacing:3px; margin:60px 0 0px 0;}
#location dl {width:100%; float:left;}
#location dl span {width:100%; display:block; clear:both; padding:40px 0 5px 0; margin-bottom:10px; border-bottom:solid 1px #CCC; font-size:15px; letter-spacing:2px; color:#8eb4a7;}
#location dl dt {clear:both; float:left; margin:0 0 5px 0; padding:0;}
#location dl dd {float:right; margin:0 0 5px 0; padding:0; text-align:righ;}
#location dl:first-of-type {margin-right:40px;}
#location .loc_map img {padding:80px 0 0 0;}
	
/* コンセプト */
#concept {}
#concept .con_main {margin:50px 0 50px; padding-bottom:calc(100vw * 0.4); background:#252525 url(../img/concept/main_back.jpg) no-repeat right bottom; background-size:auto 80%;}
#concept .main_copy1 {width:25%; margin: 0 auto 50px;animation: blur 2s;}
#concept .main_copy2 {width:50%; margin: 0 auto;animation: blur 3s;}
#concept .aerial {margin-bottom:100px}
#concept .p1 {width:73.8%; float:left}
#concept .p2 {width:24.6%; float:right; font-size:0; line-height:0}
#concept img.p3 {margin-top:calc(100% * 0.05)}

#concept .p4_box,#concept .p5_box {clear:both; padding:40px 10px; box-sizing: border-box}
#concept .p4_box h4,#concept .p5_box h4 {font-size:19px; border-bottom: solid 1px #CCC; padding:0 0 5px 3px; margin-bottom: 10px; text-align: left; letter-spacing: 5px}
#concept .p4_box h4 span,#concept .p5_box h4 span {font-size:13px; margin-left:0px; letter-spacing: 0;display: block}
#concept .p4_box img,#concept .p5_box img {width:35%; margin-bottom:80px; float:left}
#concept .p4_box p,#concept .p5_box p {width:60%; float:left; text-align:left; margin:0 0 0 5%}
#concept .p5_box p {margin-bottom:50px}
#concept .txtS {display:block; line-height:1.2em;}

/* デザイン */
#design{}
#design .des_main {animation: blur 2s;}
#design .suimen {margin:40px 10px 50px; font-size:13px}
#design .suimen img {width:30%; float:left; margin:5px 15px 40px 5px}
#design .art {clear:both; background: rgba(0,0,0,.3); padding:10px 20px 20px; box-sizing: border-box;}
#design .art h4 {text-align: center; border-bottom: solid 1px #CCC; font-size:18px; margin:0 0 10px; padding:5px 0 5px}
#design .art p {margin:10px 0}

#design .gaikan_back {margin:150px 0 0; background:url(../img/design/gaikan_back.jpg) no-repeat right top; background-size:auto calc(100vw * 0.82); height:calc(100vw * 0.85); position:relative;animation: gray_col 5s;}
#design .gaikan1 {margin: calc(100vw * -0.98) 0 0; text-align: center}
#design .gaikan1 p.caps{margin:calc(100vw * -0.3) 0 calc(100vw * 0.4) 0; text-align:left !important}
#design .gaikan1 img {width: 80%}
#design .gaikan1_copy{margin:calc(100vw * -0.25) 0 0px;}
#design .gaikan2 {width:70%; margin:80px 15% 50px;}
#design .gaikan2 p.caps{margin:calc(100vw * -0.15) 0 calc(100vw * 0.15) 0;}
#design .hallway {width:60%; margin:90px 20% 20px;}
	
#design .landplan {margin:0 40px}
#design .landinfo div {padding:0 0 30px 0}
#design .landinfo h4 {font-size:16px; font-weight: bold; clear:both; border-bottom: solid 1px #CCC; padding:0 0 5px 5px; margin:0 10px 10px}
#design .landinfo img {width:30%; float:left; margin:0 15px 40px 10px}
#design .landinfo p {}
#design .landinfo div.lp3 { }
#design .landinfo div.lp3 img {margin-bottom:10px}
#design .landinfo img.lp3_b {height:calc(100vw * 0.2); width:auto; margin:0; vertical-align: bottom;}
#design .lp3_txt{ clear: both;}


/* 間取り */
#plan {}

/* コンセプトルーム */
#conceptroom {}

/* 設備・仕様 */
#equipment {}

/* 構造セキュリティ */
#structure {}
	
/* 現地案内図 */
.map {text-align:center; margin-top:20px;}
.map_btn {text-align:center;margin-top:30px;}
.map_btn img {width:200px;}
#map .salon {background:#222222; font-size:0; margin:70px auto 20px; padding:0; text-align: center}
#map img.salon1 {width:70%; padding:10px 0 10px}
#map img.salon2 {width:90%; padding:0px 0 20px}
	
/* 物件概要 */
h2.ol {margin:20px 0 10px 10px; font-size:18px; font-weight:400;}
table.gaiyo {border-collapse: collapse;border-bottom: solid 1px #999; margin:0; width:100%;}
table.gaiyo th {margin:10px 0 5px 0px; padding: 7px 0 7px 15px; line-height: 1.2em; font-size:14px; background:rgba(255,255,255,.1); border-bottom: dotted 1px #999; font-weight:normal; display:block; text-align:left; color:#FFF;}
table.gaiyo td {margin:0 0 15px 10px; padding-right:10px; line-height: 1.8em; font-size:14px; width:100%; display:block;}

/* コンセプトムービー */
#movie {}
	
}