@charset "utf-8";


/*
------------------------------------------------
共通
------------------------------------------------*/
body {
}


/*---- ヘッダー -----*/

header {
	border-bottom: 1px solid #B9B9C8;
}
header #headerWrap {
	width: 970px;
	height: 90px;
	margin: 0 auto;
	background: url(../images/header_img.jpg) right 15px no-repeat;
}
header #headerWrap h1 {
	padding-top: 23px;
	padding-right: 243px;
	float: left;
}
header #headerWrap ul {
	padding-top: 30px;
	float: left;
}
header #headerWrap ul li {
	float: left;
}


/*---- フッター -----*/

footer {
	background-color: #333333;
	padding-bottom:50px;
}
footer #footerNav {
	background-color: #646464;
}
footer #footerNav ul {
	width: 970px;
	margin: 0 auto;
	overflow: hidden;
	padding: 20px 0;
}
footer #footerNav ul li {
	float: left;
	padding-right: 40px;
}
footer #footerNav ul li a {
	color: #FFF;
}
footer #footerLogo {
	width: 970px;
	margin: 0 auto;
	text-align: right;
	padding:40px 0 20px 0;
}
footer #copy {
	width: 970px;
	margin: 0 auto;
	text-align: right;
	color: #FFF;
}


/* 画像マウスオーバー
----------------------------------------------- */
a img , .pagetop a img ,
input[type="image"] , pagetop input[type="image"] {
	/*CSS3*/
	transition: opacity 0.2s, background-color 0.2s, color 0.2s;
	-moz-transition: opacity 0.2s, background-color 0.2s, color 0.2s;
	-webkit-transition: opacity 0.2s, background-color 0.2s, color 0.2s;
}
a:hover img , .pagetop a:hover img ,
input[type="image"]:hover , .pagetop input[type="image"]:hover {
	-ms-filter: "alpha( opacity=70 )";
	filter: alpha( opacity=70 );
	opacity: 0.7;
}



/*
------------------------------------------------
トップページ
------------------------------------------------*/

/*---- メインビジュアル -----*/
#mainVisual {
	background-color: #F5F3F3;
	margin-top: 30px;
	text-align: center;
}
#mainVisual ul {
	width: 970px;
	height: 420px;
	margin: 0 auto;
	position: relative;
}
#mainVisual ul .scene02,
#mainVisual ul .scene03 {
	display: none;
}

/*---- リード -----*/
#lead {
	overflow: hidden;
	width: 970px;
	margin: 0 auto;
	padding-top: 40px;
}
#lead h2 {
	float: left;
	width: 350px;
	padding-top: 70px;
}
#lead .textArea {
	float: right;
	width: 580px;
	line-height: 2.0;
}
#lead .textArea h3 {
	font-size: 2.0rem;
	line-height: 1.8;
	font-weight: bold;
	margin-bottom: 10px;
}

/*---- Before After -----*/
#beforeAfter {
	width: 970px;
	margin: 0 auto;
	padding-top: 45px;
}
#beforeAfter .figure {
	text-align: center;
}

#beforeAfter #swapArea {
	position: relative;
	margin-top: 50px;
	overflow: hidden;
}
#beforeAfter #swapArea .naviImage {
	height: 455px;
}
#beforeAfter #swapArea .naviImage p {
	display: block;
	position: absolute;
	top: 0;
	left: 60px;
	z-index: 1;
}
#beforeAfter #swapArea .naviImage p.active { 
    z-index: 3;
}
#beforeAfter #swapArea .naviImage p.last-active { 
    z-index: 2;
}

#beforeAfter #swapArea .catch {
	float: left;
}
#beforeAfter #swapArea .navi {
	float: right;
	background-color: #EFEFEF;
	width: 530px;
	padding-left: 12px;
	height: 100px;	
}
#beforeAfter #swapArea .navi li {
	float: left;
	padding: 10px 12px 0 0;
}
#beforeAfter #swapArea .navi li span {
	position: relative;
	cursor: pointer;
}


/*---- ギャラリー -----*/
#gallery {
	width: 970px;
	margin: 50px auto 30px;
}
#gallery h2 {
    margin-bottom: 20px;
}
#gallery .galleryPerth {
	width: 970px;
    height: 730px;
    background: #edf5f0;
    position: relative;
    margin-bottom: 30px;
}
#gallery .galleryPerth .perth {
    position: absolute;
    top: 150px;
    left: 250px;
}
#gallery .galleryPerth .arrow {
    position: absolute;
    top: 170px;
    left: 220px;
}
#gallery .galleryPerth ul {
}
#gallery .galleryPerth ul li {
    background: #FFF;
    padding: 15px 15px 10px;
    border-radius: 10px;
    position: absolute;
}
#gallery .galleryPerth ul li img {
    width: 200px;
    height: auto;
    margin-bottom: 5px;
}
#gallery .galleryPerth ul li:nth-child(1) {
    top: 30px;
    left: 60px;
}
#gallery .galleryPerth ul li:nth-child(2) {
    top: 235px;
    left: 15px;
}
#gallery .galleryPerth ul li:nth-child(3) {
    top: 440px;
    left: 65px;
}
#gallery .galleryPerth ul li:nth-child(4) {
    top: 40px;
    left: 650px;
}
#gallery .galleryPerth ul li:nth-child(5) {
    top: 250px;
    left: 720px;
}
#gallery .galleryPerth ul li:nth-child(6) {
    top: 525px;
    left: 640px;
}

#gallery h3 {
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    font-size: 22px;
    margin-bottom: 10px;
}
#gallery .galleryList {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 30px;
}
#gallery .galleryList li {
    width: 152px;
    margin-right: 10px;
}
#gallery .galleryList li:last-child {
    margin-right: 0;
}
#gallery .galleryList li img {
    width: 100%;
    height: auto;
    margin-bottom: 5px;
}





/*---- 大阪・広島ショールーム -----*/
.showroomBnr {
	padding-top: 45px;
	padding-bottom: 20px;
	margin: 0 auto;
	width: 970px;
}
.showroomBnr h2 {
	padding-bottom: 15px;
}
.showroomBnr ul {
	overflow: hidden;
}
.showroomBnr ul li {
	float: left;
}
.showroomBnr ul li.left {
	padding-right: 15px;
}



/*---- 製品ラインナップ -----*/
#lineup {
	margin-top: 40px;
	background-color: #e7a936;
}
#lineup .wrap {
	width: 970px;
	margin: 0 auto;
	padding: 50px 0 30px 0;
}
#lineup h2 {
	margin-bottom: 20px;
}
#lineup .lineupBlock {
	overflow: hidden;
	padding: 15px 0;
}
#lineup .lineupBlock h3 {
	float: left;
	vertical-align: middle;
	height: 100%;
}
#lineup .lineupBlock .listArea {
	float: right;
	width: 815px;
	border-left: dotted 1px #FFF;
}

#lineup .lineupBlock .listArea {
}
#lineup .lineupBlock .listArea ul {
	clear: both;
	padding-left: 10px;
}
#lineup .lineupBlock .listArea ul li {
	font-size: 1.5rem;
	background: url(../images/linup_icon.png) no-repeat 0 0 ;
	padding-left: 20px;
	line-height: 1.2;
	margin: 15px 0 15px 40px;
	float: left;
}
#lineup .lineupBlock .listArea ul li a {
	color: #FFF;
	text-decoration: none;
}
#lineup .lineupBlock .listArea ul li a:hover {
	text-decoration: underline;
}
#lineup .lineupBlock .listArea ul li.pdf {
	font-size: 1.2rem;
	padding-left: 10px;
	line-height: 1.2;
	margin: 15px 0 15px 40px;
	float: left;
	background-color: #7C7C7C;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-image: url(url);
}
#lineup .kenzai h3 {
	padding-top: 35px;
}
#lineup .mizumawari h3 {
	padding-top: 10px;
}


/*---- 地域包括ケアシステムの実現をめざして -----*/
.bnrConcept {
	text-align: center;
	margin-top: 40px;
}


/*----　ページトップボタン　 ---*/

p.gotop{
	width: 970px;
	margin: 40px auto 0 auto;
	text-align: right;	
}


/*----　フッターバナー　 ---*/

#footerBnr {
	background-color: #F6F6F6;
}
#footerBnr ul {
	width: 970px;
	margin: 0 auto;
	padding: 40px 0 35px 0;
	overflow: hidden;
}
#footerBnr ul li {
	float: right;
}
#footerBnr ul li:first-child {
	float: left;
}




/*
------------------------------------------------
地域包括ケアシステムの実現をめざして
------------------------------------------------*/

.careSystem .lead {
	width: 800px;
	margin: 0 auto;
	font-size: 1.6rem;
	padding-bottom: 50px;
}
.careSystem .lead h2 {
	padding: 60px 0 40px 0;
	text-align: center;
}
.careSystem .about {
}
.careSystem .about h3 {
	text-align: center;
	margin-bottom: 20px;
}
.careSystem .about .aboutBox {
	overflow: hidden;
	font-size: 1.4rem;
	border: 1px solid #A0A0A0;
	width: 850px;
	margin: 0 auto;
	padding: 45px 55px 40px 55px;
	border-radius: 10px;
}
.careSystem .about .aboutBox .textArea {
	float: left;
	width: 510px;
	padding-top: 25px;
}
.careSystem .about .aboutBox .textArea ul li {
	background: url(../images/caresystem/icon_list.jpg) no-repeat 0 5px;
	margin-bottom: 20px;
	padding-left: 20px;
}
.careSystem .about .aboutBox .imgArea {
	float: right;
}
.careSystem .about .aboutBox .note {
	clear: both;
	padding-top: 20px;
}
.careSystem .base {
	text-align: center;
	margin: 35px 0;
}
.careSystem .teian {
	text-align: center;
	margin-bottom: 40px;
}
.careSystem .fin {
	text-align: center;
	margin-bottom: 40px;
}
.careSystem .fin .text {
	font-size: 1.6rem;
	margin-top: 20px;
}