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

body,
html { overflow-x:hidden; }

#mainVisual { position: relative; padding: 40% 0 0 0; background: url(../img/lp/main_pc.jpg) center -3% / 100% auto no-repeat;}
#mainVisual h2 { position:absolute; left:27.6% ; width: 44.8%; top:0;}

.contentCover { }
.contentCover .content { padding: 25px 25px; }
.contentCover.titleCover .content { padding: 0 25px;}

#infoBox { width:960px; box-sizing:border-box; margin:40px auto 0 auto; position:relative; padding:0 0 0 260px;  height:90px; max-width:100%;  }
#infoBox h3 { position:absolute; left:0px; top:0px; width:260px; margin:0 0 0 0; }
#infoBox ul { background:#fff; overflow:scroll; height:90px; padding:15px 20px 15px 20px; box-sizing:border-box; overflow-x:hidden; border:#a88b6d solid 1px; }
#infoBox ul li span { color:#333; font-size:14px; font-weight:bold; display:inline-block; margin:0 20px 0 0; position:absolute; top:0px; left:0px; width:100px; }
#infoBox ul li { margin:0 0 10px 0; position:relative; padding:0 0 0 0; }
#infoBox ul li a { color:#4065b4; font-weight:bold; line-height:24px; font-size:20px; text-decoration:underline; }
#infoBox ul li a:before { content:'▶︎  '; }
#infoBox ul li a:hover { color:#4065b4; text-decoration:none; }

.content_copy{ max-width: 940px; padding: 0 20px; box-sizing: border-box; margin: 0 auto 20px auto;}

/* ACCESS */
#access{ background: url(../img/lp/access_bg.jpg) center top; background-repeat: repeat;}
#access .accessImg{ text-align: center; margin: 0 0 50px 0;}
.raijo_btn{ margin: 30px 0 0 0; text-align: center;}
.content.concepthouse{ background-image: url(../img/lp/concept_house_bg.png) ; background-repeat: no-repeat; background-position: 98% 3%;}

/* LAND PLAN */
#landplan {background: url(../img/lp/landplan_bg.jpg) center top; background-repeat: repeat;}
#landplan .landplanImg{ margin: 0 -60px 0 -60px; text-align: center;}

/*PLAN */
#plan {background: url(../img/lp/plan_bg.jpg) center top; background-repeat: repeat;}
#plan .planImg{ text-align: center; margin: 0 0 50px 0;}
.planBox { margin: 0 0 40px 0;}
.planBox .specBox { position: relative; padding: 0 230px 0 0; overflow: visible; margin: 0 0 40px 0;}
.planBox .specBox h4 { padding: 0 0 10px 0; border-bottom: #c9a063 solid 1px; margin: 0 0 10px 0;}
.planBox .specBox ul li { display: inline-block; font-size: 16px; line-height: 2em; margin: 0 2em 0 0;}
.planBox .specBox .thumbBox { position: absolute; right:0; top:0; width: 210px;}
.planBox .planMap { width: 100%; max-width: 700px; margin: 0 auto 40px auto;}
.planBox .photoContent { justify-content: center;}
.planBox .photoBox { flex-basis: calc( ( 100% - 30px ) / 3); margin: 0 15px 0 0;}
.planBox .photoBox:last-of-type { margin: 0;}
.planBox .photoBox figure { margin: 0 0 10px 0;}
.planBox .photoBox h6 { font-size: 18px; font-weight: bold; margin: 0 0 10px 0;}
.planBox .photoBox p { font-size: 14px; line-height: 2em;}

/* FACILITY */
#facility{background: url(../img/lp/facility_bg.jpg)center top; background-repeat: repeat;}
#facility .facilityImg{ margin: 0 -60px 30px -60px; text-align: center;}


/* OUTLINE */
#outline{background: url(../img/lp/outline_bg.jpg)center top; background-repeat: repeat;}

/* #outline #commonOutlineBox{width: 100%; max-width: 960px; margin: 0 auto 30px; display: flex; flex-wrap: wrap; justify-content: space-between;}
#outline #commonOutlineBox .item{ flex-basis: 48%; flex-direction: column;}
#outline #commonOutlineBox dl{ font-size: 15px; color: #595757; line-height: 1.4; box-sizing: border-box; position: relative; border-bottom: 2px dashed #595757;}
#outline #commonOutlineBox dl dt{width: 150px; padding: 10px;  position: absolute;}
#outline #commonOutlineBox dl dd{width: 100%; padding: 10px 10px 10px 150px;box-sizing: border-box;}
#outline #commonOutlineBox dl dd .indent_number{ padding: 0 0 0 1em; text-indent: -1em;} */


@media screen and (min-width:768px){

}
@media screen and (max-width:1000px) {
  #landplan .landplanImg{ margin: 0; }
  #facility .facilityImg{ margin: 0 0 30px ; }

  #outline #commonOutlineBox .item{ flex-basis:100%; flex-direction: column;}
}

@media screen and (max-width:767px) {
  #mainVisual { padding: 96% 0 0 0; background: url(../img/lp/main_sp.jpg)center top / 100% auto no-repeat; }

  .content.concepthouse{ background-image:none;}

  #infoBox { padding:0; height:auto; }
  #infoBox h3 { position:static; background:#009cac; text-align:left; width:100%; }
  #infoBox ul { padding:20px; height:150px; }
  #infoBox ul li a { font-size:16px; }
	
	.planBox { }
  .planBox .specBox { position: static; padding: 0 0 0 0; overflow: visible; margin: 0 0 40px 0;}
  .planBox .specBox h4 { padding: 0 0 10px 0; border-bottom: #c9a063 solid 1px; margin: 0 0 10px 0;}
  .planBox .specBox ul li { display: inline-block; font-size: 16px; line-height: 2em; margin: 0 2em 0 0;}
  .planBox .specBox .thumbBox { position: static; right:0; top:0; margin: 0 auto; text-align: center;}
  .planBox .planMap { width: 100%; max-width: none; margin: 0 auto 40px auto;}
  .planBox .flexBox.photoContent { justify-content: center;}
  .planBox .photoBox { flex-basis: 100%; margin: 0 0 20px 0;}
  .planBox .photoBox:last-of-type { margin: 0;}
  .planBox .photoBox figure { margin: 0 0 10px 0;}
  .planBox .photoBox h6 { font-size: 16px; font-weight: bold; margin: 0 0 10px 0;}
  .planBox .photoBox p { font-size: 12px; line-height: 2em;}
}

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

}