/* -----------------------------------------------
   ライフハウジングについて 2020/03/13
   ----------------------------------------------- */
@charset "utf-8";

div#ContentInner{
	width:100%;
    margin: 72px auto 10px auto;
}

/* -- h4 -- */
h4 {
	font-family: 'Dancing Script', cursive;
	margin:0 auto;
	padding:0px;
	font-size:56px;
	color:#333;
	background-color:#fff;
	border-bottom:1px solid #999;
	font-weight:bold;
	font-style: italic;
}

.LifeTitle{
	height:60px;
	margin:0;
	padding-top:30px;
	font-size:26px;
	color:#FFF;
	background-color:#222;
	text-align:center;
	/*border:1px solid red;*/
}

.ConBox2 {
	position:relative;
	overflow : hidden;
	width:auto;
	height:auto;
	background: rgba(255,255,255,0.8);
	margin:150px auto 0 auto;
	padding-top:0px;
	padding-bottom:0px;
	text-align:center;
}
.ConBox2 div.HeadBox{
	padding:10px;
	border:1px solid #222;
	background-color:#222;
	color:#FDFDFD;
}
.ConBox2 div.HeadBox2{
	margin-top:10px;
	padding:10px;
}
.ConBox2 div.HeadBox3{
	margin-top:20px;
	padding:10px 0px;
	border:1px solid #222;
	background-color:#222;
	color:#FDFDFD;
}

.ConBox2 p.Title{
	font-size:30px;
	margin-top:50px;
	margin-bottom:50px;
}
.ConBox2 p.Msg1{
	font-size:15px;
	margin-top:10px;
	margin-bottom:40px;
	line-height:1.2;
}
.ConBox2 p.Msg2{
	font-size:15px;
	margin-top:20px;
	margin-bottom:10px;
}
.ConBox2 p.Msg3{
	text-align:left;
	font-size:18px;
	margin-top:10px;
	margin-bottom:10px;
	margin-left:40px;
}
/* 品質 */
ul.QuePhoto {
	margin:40px auto 0 auto;
  	width:100%;
}
.QuePhoto li {
	width:49%;
	display: inline-block;
	vertical-align: top;
	text-align:left;
	line-height:1.5;
}
.QuePhoto li img {
	width:100%;
}
p.Que01{
	font-size:24px;
	font-weight:bold;
	margin:20px 40px 0px 40px;
	color:#a25768;
	text-align:left;
}
p.Queline {
	margin:0px 0px 0px 40px;
	height:1px;
	padding:0;
	/*border:1px solid #a25768;*/
	width:80%;
}


p.line {
	margin:0px 0px 0px 40px;
	height:1px;
	padding:0;
	border-top:1px solid #63b40d;
	width:80%;
}


.TopPhotoComment {
	position:absolute;
	top:530px;
	left:480px;
	margin:0;
	padding:0;
	text-align:right;
}

table.Location {
	width:98%;
	height:auto;
	margin:0 auto;
	padding:0;
	background-color:#999;
}

table.Location tr td {
	margin:0;
	padding:0;
}

table.Location tr td img{
	width:100%;
	margin:0;
	padding:0;
}


/* -- マウスオーバーで画像拡大 -- */
.scale img {
    -moz-transition: -moz-transform 0.3s linear;
    -webkit-transition: -webkit-transform 0.3s linear;
    -o-transition: -o-transform 0.3s linear;
    -ms-transition: -ms-transform 0.3s linear;
    transition: transform 0.3s linear;
}
.scale img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

/* -- Photo -- */
ul.CircleList { margin-top:20px; }

ul.CircleList li {
 font-size:18px;
 line-height:1.5;
 font-weight:normal;
 position:relative;
 padding:2px 0 12px 40px;
 margin:8px 0;
}

ul.CircleList li:before {
 border-radius:20px;
 -moz-border-radius:20px;
 -webkit-border-radius:20px;
 -o-border-radius:20px;
 -ms-border-radius:20px;
 content:"";
 position:absolute;
 top:0;
 left:0px;
 width:20px;
 height:20px;
 border:solid 5px #bfc5dc;
}

.imgPDF {
	width:64px;
}

div.TxtBox {
	display:block;
	width:650px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;  
	margin:10px auto;
	/*background-color:#FFF;*/
	/*opacity: 0.8;*/
}

div.TxtBox p{
	margin:50px 50px 10px 50px;;
	padding:5px;
	line-height:1.3;
}

a.LandGroup:link,
a.LandGroup:visited,
a.LandGroup:active{
	color:darkblue;
}




/* --- 丸ボタン --- */
.MaruBtn {
	border-radius: 50%;
	height: 30px;
	width: 30px;
	color:#FFF;
	background-color: #E55;
	padding:1px;
	padding: 0px 0px 10px 0px;
	font-size:18px;
	font-weight:bold;
}

button.css3button {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #ffffff;
	padding: 2px 0px;
	background: -moz-linear-gradient(
		top,
		#eb6c8c 0%,
		#ff82ec 25%,
		#fa0519);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#eb6c8c),
		color-stop(0.25, #ff82ec),
		to(#fa0519));
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	border: 2px solid #ffffff;
	-moz-box-shadow:
		2px 2px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,000,217,1);
	-webkit-box-shadow:
		2px 2px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,000,217,1);
	box-shadow:
		2px 2px 2px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,000,217,1);
	text-shadow:
		0px -1px 0px rgba(000,000,000,0.2),
		0px 1px 0px rgba(255,255,255,0.3);
}


/* --- スライダー関連 --- */
.slider {
	margin: 0 0 50px;
}
.slider img {
	width: 100%;
	height: auto;
}
.slick-prev::before, .slick-next::before {
	font-size: 24px;
}
.lazy-item .slick-next,
.thumb-item-nav .slick-next,
.multiple-item .slick-next,
.center-item .slick-next {
	right: 20px;
	z-index: 99;
}

.lazy-item .slick-prev,
.thumb-item-nav .slick-prev,
.multiple-item .slick-prev,
.center-item .slick-prev {
	left: 15px;
	z-index: 100;
}

.multiple-item1 .slick-prev::before, .multiple-item1 .slick-next::before {
	font-size: 42px;
	color:#444444;
}
.single-item .slick-prev::before,
.single-item .slick-next::before {
	color: #666;
}
.slick-dots {
	bottom:-25px;
}
.multiple-item li {
	margin: 0 5px;
}

/* --- スライドの矢印の位置 --- */
.slick-prev, .slick-next {
	top:30%;
}
.slick-prev {
    left: -45px;
}

/ IE11 スライドボタン対策 /
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .slick-prev, .slick-next { width: 40px;height:40px; } 
  *::-ms-backdrop, .slick-next { right:-45px; } 
}

/* --- 特選写真用 slider --- */
.ConBox2 .slider img {
	width: 100%;
	height: auto;
}
.ConBox2 .thumb-item {
	max-width: 900px;
	margin: 0 auto 5px;
	padding: 0 5px;
}
.ConBox2 .thumb-item-nav {
	max-width:880px;
	margin: 0 auto;
	cursor:pointer;
}
.ConBox2 .thumb-item-nav li{
	margin: 3px 2px;
	border:1px solid #AAA;
}
/* --- 左右の矢印の位置 --- */
.ConBox2 .slick-prev{
    left: -45px;
	top:50%;
	z-index: 99;
}
.ConBox2 .slick-next{
	top:50%;
}
[dir='rtl'] .ConBox2 .slick-prev{
    right: -45px;
    left: auto;
	z-index: 99;
}


/* --- スクロールフェードイン --- */

.ThisInview,
.ConBox2 img,
.ConBox2 p,
.ConBox2 h4,
.ConBox2 ul img,
.ConBox2 table,
.SiteName,
.Pers, .box
{
	/*transition: .8s;*/
	transition: all 1.3s  ease 100ms;
}

/* --- 要素を下から上 --- */
.ThisInview{
	opacity: 0.0;
	transform: translate(0,60px);
	-moz-transform: translate(0,60px);
	-webkit-transform: translate(0,60px);
}

/* --- 要素を右から左 --- */
.ThisInviewR2L{
	opacity: 0.0;
	transform: translate(250px,0px); 
	-moz-transform: translate(250px,0px);
	-webkit-transform: translate(250px,0px);
}
/* --- 要素を右から左(S) --- */
.ThisInviewR2LS{
	opacity: 0.0;
	transform: translate(200px,0px); 
	-moz-transform: translate(200px,0px);
	-webkit-transform: translate(200px,0px);
}
/* --- 要素を左から右 --- */
.ThisInviewL2R{
	opacity: 0.0;
	transform: translate(-250px,0px); 
	-moz-transform: translate(-250px,0px);
	-webkit-transform: translate(-250px,0px);
}
/* --- 元の位置 --- */
.ThisInviewDisp, .ThisInviewDispR2L, .ThisInviewDispR2LS, .ThisInviewDispL2R{
	opacity: 1.0;
	transform: translate(0,0); 
	-moz-ransform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* --- display: table-cell --- */
.boxTB{
	display:table;
	width:100%;
	margin:0 auto;
}
.boxTB .box{
	display:table-cell;
}
.boxTB img{
	width:100%;
}

/* --- top パース図のフェードイン --- */
.TopFadein{
	animation: fadeIn 4.0s ease-in-out 0s 1 normal;
	-webkit-animation: fadeIn 4.0s ease-in-out 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.topimg {
	width:100%;
}
.topimg img{
	width:100%;
}


/* ### スマホ start ############################# */
@media print, screen and (max-width: 640px) {

.LifeTitle{
	font-size:20px;
}

.ConBox2 {
	position:relative;
	overflow : hidden;
	width:100%;
	height:auto;
	background-color:#FFF;
	margin:0px auto 60px auto;
	padding-top:0px;
	padding-bottom:0px;
}

.ConBox2 div.HeadBox{
	border:1px solid #222;
	background-color:#222;
	color:#FDFDFD;
}
.ConBox2 p.Title{
	font-size:30px;
	margin-top:40px;
	margin-bottom:30px;
}
.ConBox2 p.Msg1{
	font-size:13px;
	margin-top:10px;
	margin-bottom:10px;
	text-align:left;
	line-height:1.6;
}
.ConBox2 p.Msg2{
	font-size:13px;
	margin-top:5px;
	margin-bottom:5px;
	text-align:left;
}

.ConBox2 p.Msg3{
	text-align:left;
	font-size:17px;
	margin:10px;
}

.SpQue01 {
	font-size:20px;
	font-weight:bold;
	margin:30px;
	color:#a25768
}
.SpQueTxt{
	font-size:13px;
	margin:15px;
	text-align:left;
}

.concepPhoto{
	width:50%;
	margin:0 auto;
	margin-top:30px;
}


} /* ### スマホ end ############################# */