@charset "utf-8";


/*-------*/
/*--reset--*/
*{margin: 0; padding: 0}

a { text-decoration : none;color:#1a1a1a}
a:hover{text-decoration:underline;color:#b12323}
ul, ol {margin-left:0;list-style:none}

img{vertical-align:top;border:0;}

img {max-width:100%;}
/*img, div { behavior: url(iepngfix.htc) }*//*追加*/


html {
font-family: "游明朝", "Yu Mincho", YuMincho, "メイリオ", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "Meiryo", serif;
font-size : 100%;
line-height : 1.5;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

h1,h2,h3,h4{margin-bottom:4px;font-weight:normal;}
h5,h6{margin-bottom:10px;margin-top:10px;font-weight:normal;}

input{margin:0;padding:0;}


body{
	font-size:100%;
	background-color:#fff;
	text-align:justify;
	text-justify: inter-ideograph;
	-webkit-text-size-adjust: 100%;
}


/* ---clearfix---*/
.clearfix:after {
content: ".";
topcontent: ".";
display: block;
visibility: hidden;
height: 0;
clear: both;
}
/*--
.clearfix {
zoom: 1;
}
--*/


/*=============================================
     common header area
==============================================*/
#container{
	margin:0;padding:0;
	background-color:#fff;
	overflow:hidden;
}

#containerTop{
	margin:0;padding:0;
	background-color:#fbf6e8;
	overflow:hidden;
}


#aboutcontainer{
	margin:0;padding:0;
    background-image:url(../images/about_bg.png);
}

h1{
	height:16px;
	line-height:16px;
	text-align:center;
	font-size:12px;
	font-weight: bold;
	color:#666;
	/*background:#2d2d2d;*/
	margin-bottom:0px
}

#topH{
	height:16px;
	line-height:16px;
	text-align:center;
	font-size:12px;
	font-weight: bold;
	color:#888;
	background:none;
	margin-bottom:0px;
}

#topH_02{
	height:30px;
	line-height:30px;
	text-align:left;
	font-size:1.8em;
	font-weight: bold;
	color:#666;
	background:none;
	margin:30px 0 50px 15px;
}


#example h1{
	height:20px;
	line-height:20px;
	text-align:center;
	font-size:11px;
	color:#ffffff;
	background:#2d2d2d;
	position: absolute;
  bottom: 0;
	width: 100%;
	margin-bottom:0px
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}

#topLine{
	background-color:#ffffff
}

#topLineimg{
	background-image:url(../images/header01.png);
}

header{
	max-width:100%;
	margin:0 auto;
}

#tophed{
	max-width:100%;
	margin:0 auto;
		height:0;
}


header #topArea{
	width:98%;
	padding:0;
	margin-left:auto;
	margin-right:auto;
	text-align:left
}

header #headerWrap{
	width:75%;
	float:left;
	clear:both;
	margin-top:4px;
	margin-bottom:8px
}

header #searchBox{
	width:25%;
	float:right;
	text-align:right;
	display:block;/*追加*/
}

header #searchBox ul{
	width:98%;
	margin:1em auto 0 auto;
	font-size:70%;
	clear:both
}

header #searchBox ul li{
	display:inline;
	padding:0 2em;

}

header #searchBox ul li a{
	color:#f1f1f1
}

header #searchBox ul li a:hover{
	color:#ffff00
}

header #searchBox .searchBoxInner{
	position:relative;
	top:0px;/*追加-修正20px→0pxに修正*/
	text-align:right;
	margin-top:0.5em;/*追加*/
}

header #headerWrap #logoBox{
	width:30%;
	float:left;
	margin: 20px 0 10px 10px ;

}

header #headerWrap #phoneBox{
	width:66.7%;
	float:right;
	text-align:right
}

header #headerWrap #phoneBox img{
	margin-top:10px
}

header #headerWrap #phoneBox_02{
	width:70%;
	float:right;
	text-align:center
}

header #headerWrap #phoneBox_02 img{
	margin:15px auto;
}

input.innerMoji{
	width:140px;
	color:#333;
	background:#f1f1f1
}



/*IE7*/
/*
*+html #menu{zoom:1;padding-bottom:0.25em;}
*/

#topcontents{
	/*max-width:1200px;*/
	margin:0 auto;
	position: relative;
	background-color:#fff;
}

#sekoujireicontents{
	max-width:1200px;
	margin:0 auto 4em auto
}

#topReformContents{
	width:100%;
}

#contents{
	max-width:1200px;
	margin:0 auto 4em auto
}

#aboutcontents{
	max-width:960px;
	margin:0 auto 0 auto;
	background-image:url(../images/about_bg.png);
}


/*=============================================
     common globalnavigation area
==============================================*/

#menu{
	width:100%;
	height:25px;
	line-height:15px;
/*	margin-bottom:7px;  */
}
/* for IE7*/
*:first-child+html{
	-zoom:1;
	margin-bottom:-10px;
	padding-bottom:0;
}

#frontArea{
	width:70%;
	padding:0;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:75%;
}

#frontArea a{
    text-decoration:none;
    color:#666
}

#frontArea a:hover{
    text-decoration:underline;
}

#frontArea_02{
	width:70%;
	padding:25px 0 0 0;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:75%;
}

#frontArea_02 a{
    text-decoration:none;
    color:#eee
}

#frontArea_02 a:hover{
    text-decoration:underline;
}


#topfrontArea{
	width:80%;
	padding:0;
	padding-top:50px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:85%;
}

#topfrontArea a{
    text-decoration:none;
    color:#999;
    font-family: "Yu Gothic";
    font-weight:600;
}

#topfrontArea a:hover{
    text-decoration:underline;
}


#menu li.sub img{display:none}


#menu li.sub{
	width:100%;

}

#menu li.sub ul{
	text-align:center;
	display:table;
	table-layout:fixed;
	width:100%;


}


#menu li.sub ul li.wd:first-child{
	border-left:1px solid #333
}


#menu li.sub ul li.wd{
	display:table-cell;
    background:#bfbfbf;
    border-right:1px solid #333;
    border-bottom:1px solid #333;
	vertical-align:middle;
	width:16.5%;
}

#frontArea ul #menu li.sub ul li{
	color:#666;
}


/*for IE6 */
* html #menu li.sub ul li.mt{
display: inline;
zoom: 1;
}
/*for IE7 */
*:first-child+html #menu li.sub ul li.mt{
display: inline;
zoom: 1;
}

#menu li.sub ul li.mt:first-child{
	border-left:none
}

#menu li.sub ul li.mt{
	display:table-cell;
	vertical-align:middle;
    width:15%;
	border-left:1px dotted #666;
}


#menu li.sub ul li.mtleft{
	display:table-cell;
	vertical-align:middle;
	width:14%
}

/*for IE6 */
* html #menu li.sub ul li.mtleft{
display: inline;
zoom: 1;
}
/*for IE7 */
*:first-child+html #menu li.sub ul li.mtleft{
display: inline;
zoom: 1;
}

#menu li.sub ul li.wd a{
	margin:0.2em 0.2em 0.1em 0.2em;
	padding:0;
    display:block;
    background:#fff;
    color:#000;
    font-size:12px;
    border:1px dotted #000;
}


#menu li.sub ul li.wd a:hover{
	background:#b8f1f1;
	color:#ff0000;
}



/*activeを追加*/
#menu li.sub ul li.active:first-child{
	border-left:1px solid #333
}

#menu li.sub ul li.active{
	display:table-cell;
    background:#bfbfbf;
    border-right:1px solid #333;
    border-bottom:1px solid #333;
	vertical-align:middle;
	width:16.5%;
}
/*for IE6 */
* html #menu li.sub ul li.active{
display: inline;
zoom: 1;
}
/*for IE7 */
*:first-child+html #menu li.sub ul li.active{
display: inline;
zoom: 1;
}

#menu li.sub ul li.active a{
	background:#ffdad6;
	margin:0.2em 0.2em 0.1em 0.2em;
	padding:0;
    display:block;
    color:#000;
    font-size:12px;
    border:1px dotted #000;
}


/*=============================================
     contents area (1)main for TOP PAGE
==============================================*/


/*
section{
	border-bottom:4px solid #323232
}
*/


#wrapper{
	width:100%;
	margin-top:1em
}

#topmain{
	float:left;
	width:100%;

}

#main{
	float:left;
	width:76%;

}



#reformmain{
	float:left;
	width:100%;
	margin-left:1em
}

#topmainwrap{
	width:97%;
	margin:0 10px;
	float:left;
}

#topmainwrapCenter{
	width:97%;
	margin:50px 10px 0 10px;
	float:left;
}

#topmainwrapRight{
	width:97%;
	margin:50px 10px 0 10px;
	float:left;
}


.topMainRead{
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	font-family:メイリオ;
	color: #777;
	line-height : 2.0;

}

.topMainRead a {
	text-decoration : none;color:#435aa0
}

.topMainBoxPhoto{
    margin-top:20px;
    width:100%;
}

#naliswrap{
	width:100%;
	margin-right:10px;

}

.nalisRead{
    width:87%;
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	font-family:ＭＳ Ｐ明朝;
	color: #888;
	line-height : 2.0;
}

.nalisBoxPhoto{
    margin-top:20px;
    width:100%;
}


.topwrap{
	width:100%;
	overflow:hidden
}



#sekoujireiwrap{
	width:100%;
	margin-right:10px;
	margin-top:2em;
	overflow:hidden
}

.openBoxLeft{
	float:left;
	width:23%;
	margin:1px 12.5px 2px 0px;

}

.openBoxCenter{
	float:left;
	width:23%;
	margin:1px 12.5px 2px 12.5px;

}

.openBoxRight{
	float:right;
	width:23%;
	margin:1px 0px 2px 12.5px;

}

#banner{
	width:80%;
	margin: 0 auto;
	padding-bottom: 4em;
	/*background-color: #F9F7F4;*/
	/*background-image: url(../images/top-content-back02.jpg);
	background-position: center;
	background-repeat: no-repeat;*/
}

#ContentBanner{
	width:80%;
	margin: 0 auto;
	padding-bottom: 4em;
	/*background-color: #F9F7F4;*/
	/*background-image: url(../images/top-content-back02.jpg);
	background-position: center;
	background-repeat: no-repeat;*/
}

#banner h3, 
#ContentBanner h3{
	font-size:110%;
	color:#333;
	text-align:center;
	padding:15px 20px 0px 20px;
	/*font-weight: bold;*/
}

#banner h3.fb{

	background-color:#3B5999;

}

#banner h3.sb{

	background-color:#DB5252;

}

#banner h3.cn{

	background-color:#5aaa6e;

}




#banner .bannerSentence{
	font-size:75%;
	border-top: 1px solid #E84698;
	margin:5px 22px 20px 22px;
	padding-top: 10px;
	color:#777;
}

#banner .bannerSentence_sb{
	font-size:75%;
	border-top: 1px solid #DB5252;
	margin:5px 22px 20px 22px;
	padding-top: 10px;
	color:#777;
}

#banner .bannerSentence_fb{
	font-size:75%;
	border-top: 1px solid #3B5999;
	margin:5px 22px 20px 22px;
	padding-top: 10px;
	color:#777;
}

#banner .bannerSentence_cn{
	font-size:75%;
	border-top: 1px solid #5aaa6e;
	margin:5px 22px 20px 22px;
	padding-top: 10px;
	color:#777;
}


#banner a{
	text-decoration:none;
}

.bannerBoxLeft{
	float:left;
	width:32%;
	margin:1px 14px 15px 0px;

	background-color: #FFF;
}

.bannerBoxLeft{
  transition: .2s ease-in-out;
}

.bannerBoxLeft:hover{
	opacity: .5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
    opacity: 0.5;
}


.bannerBoxCenter{
	float:left;
	width:23.5%;
	margin:1px 8px 15px 8px;
	border:solid 1px #ccc;
}

.bannerBoxCenter{
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
}

.bannerBoxCenter:hover{
	opacity: .5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}

.bannerBoxRight{
	float:right;
	width:23.5%;
	margin:1px 0px 15px 8px;
	border:solid 1px #ccc;

}

.bannerBoxRight{
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
}

.bannerBoxRight:hover{
	opacity: .5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}


.sekoujireikuwrap{
    clear:both;
	width:100%;
	margin-right:10px;
	margin-top:1em;
	overflow:hidden
}


#reformwrap{
    clear:both;
	width:100%;
	margin-right:10px;
	margin-top:1em;
	overflow:hidden
}
.reformBoxLeft{
	float:left;
	width:49%;
	padding:6px 4px 2px 4px;
	border:1px solid #cccccc
}

.sekoujireiBoxLeft{
	float:left;
	width:33%;
	margin:5px 0 2px 0;
}

.sekoujireiBoxCenter{
	float:left;
	width:33%;
	margin:5px 3px 2px 4px;
}

.sekoujireiBoxRight{
	float:right;
	width:33%;
	margin:5px 0 2px 0;
}

.sekouTop{
	font-size:95%;
	zoom:1;
	overflow:hidden;
	color: #555;
	line-height : 1.8;
	margin:5em 0 2em 0;
}

.sekouTop a{
  color:#4462d5
}

.openBoxAll{
	float:left;
	width:95%;
	padding:6px 4px 2px 4px;
	border:1px solid #257338
}
.eventBoxAll{
	float:left;
	width:95%;
	padding:6px 4px 2px 4px;
	border:1px dotted #F36421
}

.openhouseBoxall{
	float:left;
	width:95%;
	padding:6px 4px 2px 4px;
	border:1px solid #9A8168
}

.sekoujireiBoxall{
	float:left;
	width:97%;
	padding:6px 6px 6px 1px;
	border:1px solid #9A8168
}

.reformBoxAll{
	float:left;
	width:99%;
	padding:6px 4px 2px 4px;
	border:1px solid #cccccc
}

.reformIchiranLeft{
	float:left;
	width:32%;
	padding:6px 4px 2px 4px;
	margin-right:8px;
	border:1px solid #cccccc
}

.reformIchiranCenter{
	float:left;
	width:32%;
	padding:6px 4px 2px 4px;
	margin-right:6px;
	border:1px solid #cccccc
}

.reformIchiranRight{
	float:right;
	width:32%;
	padding:6px 4px 2px 4px;
	border:1px solid #cccccc
}

.photoInfo{
	float:left;
	width:100%;
}

.photoInfo img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    -webkit-transition: .5s ease-in-out;
       -moz-transition: .5s ease-in-out;
         -o-transition: .5s ease-in-out;
            transition: .5s ease-in-out;
}

.photoInfo img:hover{
	opacity: 1.5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}



.iconInfo{
	float:left
}
.sougouphotoInfo{
	float:left
}

.shortInfo{
	-zoom:1;
	overflow:hidden;
	font-size:9px;
	color:#9a9a9a;
	line-height:12px;
	padding-left:1px;
}
.shortInfo strong{
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	color:#666;
	line-height:20px;
	padding-left:1px;
}

.jireiInfo{
	-zoom:1;
	overflow:hidden;
	font-size:90%;
	padding-bottom:4px;
	vertical-align:middle;
}

.jireiInfo p.jireiphoto{
    width:100%;
    float:left;
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
}

.jireiInfo p.jireiphoto:hover{
	opacity: 1.5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}

.jireiInfo img{
    vertical-align:middle;
}

.jireiInfo h3 img{
	vertical-align: middle;
	margin: auto 0;
	padding-bottom: 4px;
}

.jireishortInfo{
	-zoom:1;
	overflow:hidden;
	font-size:10px;
	color:#8a8a8a;
	line-height:12px;
	padding-left:12px;
}

.jireishortInfo strong{
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	color:#666;
	line-height:20px;
	padding-left:1px;
}

.komidashiInfo{
	-zoom:1;
	overflow:hidden;
	font-size:14px;
	padding-left:10px;
	padding-top:12px;
}

.jisekiInfo{
	overflow:hidden;
	font-size:95%;
	padding-left:10px;
	padding-top:20px;
}

.reformBoxRight{
	float:right;
	width:49%;
	padding:6px 4px 2px 4px;
	border:1px solid #cccccc
}
/*
.ichiranBoxRight{
	float:right;
	text-align:right
	width:45%;
	padding:23px 4px 0 0;
	font-size:9px;
	color:#9a9a9a;
}
*/
.ichiranBoxRight{
	position: relative;
	right:10px;
	bottom:5px;
 	text-align: right;
	font-size:9px;
	transition: 0.6s;
}
.ichiranBoxRight a{

	color:#666;

}

h2.openInfoBar{
	border-bottom:4px solid #5F3F2E
}

h2.openInfoBar2{
	border-bottom:1px solid #333333
}

.toptitle{
	margin:100px 0 20px 0;
}

.topcontentstitle{
	margin:70px 40px 0 5px;
}

.toptitle h2{
	color:#444;
	font-size:160%;
	font-family:メイリオ;
	position: relative;
	top: -28px;
	left: 35px;
	width: 87%;
}

.topcontentstitle h2{
	color:#666;
	font-size:140%;
	position: relative;
	top: -28px;
	left: 20px;
	margin-bottom: -20px;
}


.topcontentstitle h2::after{
  position: absolute;
  content: "";
  background-color: #aaa; /*下線の色*/
  width: 40%; /*線の幅*/
  height: 1px; /*線の太さ*/
  bottom: -5px; /*線のタテ位置*/
  left: 0%;  /*線のヨコ位置*/
  transform: translateX(-0%);　/*線のヨコ位置*/
}


.toptitleright{
	margin-top:100px;
}

.toptitleright h2{
	color:#444444;
	font-size:120%;
	font-family:メイリオ;
	position: relative;
	top: -22px;
	left: 30px;
}


h3.topsekoutitle{
	color:#444;
	font-size:20px;
	font-weight:bold;
	font-family: "メイリオ", sans-serif;
	border-left:solid 6px #FFADD9;
	height:18px;
	line-height:20px;
	padding-left:5px;
	margin:40px 0 5px 0;
	text-align:left;
}

h2.topsubtitle{color:#444444;font-size:90%; margin-top:0px}
#pageContents h3.topsubtitle{
	color:#555;
	font-size:130%;
	font-weight:bold;
	font-family: "メイリオ", sans-serif;
	border-left:solid 6px #FFADD9;
	height:22px;
	line-height:26px;
	padding-left:7px;
	margin-top:40px;
	margin-bottom:15px;
}

h3.topsubtitle{
	color:#555;
	font-size:130%;
	font-weight:bold;
	font-family:メイリオ;
	border-left:solid 6px #FFADD9;
	height:22px;
	line-height:26px;
	padding-left:7px;
	margin-top:40px;
	margin-bottom:15px;
}

#pageContents h3.subtitlecontent{
	color:#555;
	font-size:140%;
	font-weight:bold;
	font-family:メイリオ;
	border-left:solid 6px #FFADD9;
	height:22px;
	line-height:26px;
	padding-left:7px;
	margin-top:150px;
	margin-bottom:35px;
}



h3.awardsubtitle{
	color:#555;
	font-size:15px;
	font-weight:bold;
	font-family:メイリオ;
	border-left:solid 6px #FFADD9;
	height:16px;
	line-height:18px;
	padding-left:5px;
}

.osusumeDetail{
	text-align:right
}



#newsinfo{
	/*margin-top:3em;
	margin-right:65px;*/
	margin:auto;
	display:block;
	width:50%;
	background-color: #fbf6e8;

}

#newsBox{
	font-size:12px;

	/*overflow:auto;*/
	overflow: visible;

}

#newsBox dl{
	clear:left;
	width:100%;
	margin:0 auto 5px auto;
	/*height:50px;*/

}



#newsBox dt{
	clear:left;
	float:left;
	width:50px;
	color:#666;
	padding: 5px 0;
}

#newsBox dd{
	margin-left:0;
	padding: 5px 0.5em 15px 7em;
	border-bottom:1px solid #ccc;
	color:#888
}

#newsBox dd a{
	color:#888
}

#newsBox dd a:hover{
	color:#FC5C0D;
	text-decoration:underline
}

#pickup{
	margin-top:3em;
	width:46%;
	display: inline-block;
}

#pickup #blogBox{
	width:100%;

}

#pickup #blogBox .blogBoxBar{
	padding-bottom:4px;
	border-bottom:4px solid #ccc
}


#pickup #blogBox .blogBoxInnerCase{
	height:250px;
	overflow:auto;
	background:#fbf6e8
}



#pickup #pickupContents{
	float:right;
	width:70%;
}



 .blogBoxInnerCase{
	/*border:1px solid #aaa;
	color:#888;*/
 }
 .blogBoxInnerCase ul{
	margin:0 auto 5px auto;
	font-size:75%;
	color:#666;

}
 .blogBoxInnerCase li{
	float:none;
	height:40px;
	line-height:40px;
	padding: 4px 0.5em;
	border-bottom:1px dotted #aaa;
	text-indent:4px;
	color:#666;
}
 .blogBoxInnerCase li a{

	color:#666;
}


/*=============================================
     contents area (2)sidemenu for TOP PAGE
==============================================*/


#wrapper #sideMenu{
	float:right;
	width:20%;
	display:block
}

#sideMenu .sideTopNav:first-child{
	margin-top:1em
}

#sideMenu .sideTopNav{
	margin-bottom:1em
}

#sideMenu .sideTopNav2{
	margin-bottom:1.3em
}


#sideMenu ul{
	width:100%;
	margin-top:2em
}

#sideMenu ul li{
	margin-bottom:1em;
	border:1px solid #CDC0C0;
	background-image:url(../images/navbutton.gif);
	background-repeat:no-repeat;
	background-position:4% 50%;
	text-indent:2.5em;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.1) inset;
	-moz-box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.1) inset;
	-webkit-box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.1) inset;
	-o-box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.1) inset;
	-ms-box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.1) inset;
		/*--↓IE9以下追加--*/
/*	filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=20);
    -ms-filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=20)";*/
}

#sideMenu ul li a{
	height:80px;
	line-height:80px
}


/*=============================================
     TOP PAGE bxslider
==============================================*/


.bxslider{
	display: inline;
	padding: 0;
	margin: 0

}

.sekoujpleft{
	width:30%;
	font-size:12px;
	color:#666;
	float: left;
	padding:2px 8px 2px 8px
}


.sekoujp p img{
	margin-left:30px;
	margin-right:50px
}



/*=============================================
     common footer area
==============================================*/
/*追加*/
#footerContents{
	width:100%;
	display:block;
	background-image:url("../images/blackbg.png");
	background-repeat:repeat-x;
	background-position:0% 100%;
}


#footerTopArea{
	max-width:1200px;
	margin:0 auto
}

footer{
	color:#666;
}

footer a{
	color:#e2e2e2;
	font-size:11px
}



#footerBox{
	max-width:1200px;
	margin:0 auto 2em auto;
	position:relative;
	top:10px
}

.footerMenuCase{
	float:right;
	display:block;
	margin:1em 2em 1.2em 3em;
	padding-left:2.5em;
	border-left:1px dotted #888888;
	font-size
	:12px
}
.footerMenuCase a{
	color:#666;
}


.footerCompanyCase{
	float:left;
	margin:1em 0 0 10px;
	font-size:12px;
	width:264px
}


p.flogo{
	float:left;
	margin:4px;
	width:100px;
}

.footerus{
	-zoom:1;
	overflow:hidden;
	font-size:11px
}

.permission{
	margin-top:0.5em;
	font-size:11px;
	clear:both
}


#footerBox ul li{
	list-style-type:none;
	margin-left:-10px;
	height:20px
}

#finalLine{
	text-align:center;
	background-color:#000000
}

#finalLine_02{
	text-align:center;

}

address{
	font-size:12px;
	font-style:normal;
	padding-top:1em
}
address a{
	color:#666
}





small{font-size:11px;}
.attn{font-weight:bold;color:#ff0000;font-size:12px;}
.attnRight{text-align:right;vertical-align:bottom;}
.attnDays{font-weight:bold;color:#FBAC71;}
.attnMoney{font-weight:bold;color:#F58585;}









/*========================================================
		page common contents zerostyle+
========================================================*/

#pankuzu{margin-top:1em;font-size:90%;display:block;width:100%;}
#pankuzu ul{height:30px;line-height:30px;clear:both}
#pankuzu ul li{float:left;padding-right:14px;text-indent:1.2em;background-image:url(../images/infonavi.gif);background-repeat:no-repeat;background-position:0 50%}
#pankuzu ul li:first-child{background:none;text-indent:0.6em;}
#pankuzu ul li.topicshort{width:90px;}
#pankuzu ul li.topicMiddle{width:120px;}
#pankuzu ul li.topicLong{width:200px;}
#pankuzu ul li.topiclast{width:80px;}
#pankuzu ul li.path{background:none;}


/*
#pankuzu{margin-top:1.2em;border:1px solid #666;font-size:90%;background:#f1f1f1;display:block;width:100%;}
#pankuzu ul{height:46px;line-height:46px;clear:both}
#pankuzu ul li{float:left;width:105px;text-indent:0.6em;background-image:url(../images/arrow3.png);background-repeat:no-repeat;background-position:100% 50%}
#pankuzu ul li.topicshort{width:80px;}
#pankuzu ul li.topicMiddle{width:160px;background:none}
#pankuzu ul li.topicLong{width:240px;background:none}
#pankuzu ul li.topiclast{width:80px;background:none}
#pankuzu ul li.path{background:none;}
*/


/* 背景変更14/5/13 */
#pageTitle h2, #pageTitle h2.pageTitleLong{color:#444444;border-bottom:3px solid #B8B8B8;font-size:150%;height:38px;line-height:40px;margin-top:20px}
.sekouTitle h2, .sekouTitle h2.pageTitleLong{color:#555;border-bottom:1px solid #888 ;font-size:140%;height:38px;line-height:30px;margin-top:20px;margin-bottom:10px}


#pageContents{width:100%;margin:10px 0px 0px 0px}
#pageContents h3{width:98%;margin:10px 10px 10px 0; padding:0 0 0 5px;font-weight:bold;font-size:120%;line-height:24px;}
#pageContents h3.thirdTitle{
	border-bottom:1px solid #ccc;
	/*background:#f9f9f9;*/
	height:40px;
	line-height:40px;
	padding-left:10px;
}
#pageContents h3.thirdTitle2{color:#444444;border-bottom:1px solid #B8B8B8;font-size:120%;height:40px;line-height:40px;padding-left:10px;}
#pageContents a{color:#4462d5}
#pageContents a:hover{text-decoration:underline;color:#b12323}
/*--reform--*/
#pageTitle h2.reformTitle{background-image:url(../images/reformTitle.png);background-repeat no-repeat;}
#pageContents #allmightyBox{width:90%;margin:0 auto;border:1px solid #ccc;padding:4px;}
#pageContents p.textrefo{-zoom:1;overflow:hidden;color: #707070;line-height : 1.5;font-size:90%;}
#reformmain #resultsnumber {float: left;width: 34%;}
#reformmain #results {float: right;width: 58%;padding: 5px;margin: 0;}


/*--openhouse--*/
#pageContents h3.semiTitle{border-bottom:4px solid #5F3C1C;margin-bottom:2em;padding-bottom:10px;}
#pageContents #bn{width:96%;margin:0 auto;padding:8px;margin-bottom:2em;}
#pageContents #bn ul{width:100%;margin-bottom:2em;font-size:80%;border:none;border-bottom:1px dotted #ccc}
#pageContents #bn ul li{list-style-type:disc;display:block;}
#pageContents #bn ul li img{vertical-align:middle}

#pageContents h4.fourthTitle{height:30px;line-height:40px;}
}

#pageContents h4, #pageContents h4.subTitleLong{width:98%;margin:0.4em auto;border-top:1px solid #ccc;border-bottom:1px solid #ccc;font-weight:bold;font-size:140%;text-indent:0.5em;height:30px;line-height:30px;background:#FFF9E2}
#pageContents h4.subTitleNor{
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	font-size:14px;
	font-weight:bold;
	background:#DCCFBF;
	background-image:url(../images/maru.gif);
	background-repeat:no-repeat;
	background-position:1% 50%;
	text-indent:2.5em;
}


#pageContents .mainRead{display:block;margin-left:0.5em;margin-right:1.6em;margin-bottom:2em;overflow:hidden}
/*#pageContents .mainRead img{float:left;margin-right:10px}*/
#pageContents .mainRead img.plusone{float:right;margin:6px}
#pageContents .mainRead p:first-child{text-indent:1em;}
#pageContents .mainRead p{font-size:95%;-zoom:1;overflow:hidden;color: #555;line-height : 1.8;margin:1em 0 2em 0;}
#pageContents .mainRead p.mainImgBox{float:left;margin-right:6px}
#pageContents .mainRead p.mainImgBox2{float:right;margin-left:6px;margin-bottom:1em;}
#pageContents .mainRead p.mainImgBox3{float:center;margin-bottom:1em;}
#pageContents .mainRead p.mainImgBox4{float:center;margin-top:3em;margin-bottom:2em;}

#pageContents .mainRead p.honbun{-zoom:1;overflow:hidden;text-indent:1em;}

#pageContents .questRead{display:block;margin-left:0.2em;margin-right:1.6em;margin-bottom:0.2em;overflow:hidden}
/*#pageContents .questRead img{float:left;margin-right:10px}*/
#pageContents .questRead img.plusone{float:right;margin:6px}
#pageContents .questRead p:first-child{text-indent:1em;}
#pageContents .questRead p{font-size:96%;line-height:1.6}
#pageContents .questRead p.questMark{margin:0.1em 1.4em 0.8em 0.8em;float:left;}
#pageContents .questRead .questTxt{margin:0.8em 1em 0.8em 0.8em;overflow:hidden;}

/* 0502新築・建替え */
#pageContents .mainRead p.textgray{-zoom:1;overflow:hidden;color: #555;line-height : 2.0;}

#pageContents .mainRead p.secondPara{margin-bottom:1em;}
/*#pageContents .mainRead p.brandCatch{-zoom:1;overflow:hidden;text-align:right}*/

#pageContents .subRead{width:100%;margin-top:2em;margin-bottom:2em}
#pageContents .subRead p{width:96%;margin:0 auto}
/* 0502新築・建替え */
#pageContents .subRead p.textgray{width:96%;margin:0 auto;color: #555;}

#pageContents .subRead p.smallCap{font-weight:bold;font-size:110%}
#pageContents #subReadBox{width:96%;margin:2em auto;display:block}
#pageContents .subReadBoxTitle{height:40px;line-height:40px;border-top:1px solid #ccc;border-bottom:1px solid #ccc}
#pageContents .subReadBoxInner{margin:1em 2em;font-size:86%;}
#pageContents .subReadBoxInner ul{list-style-type:disc;}

#pageContents .extraBox{width:100%}
#pageContents .extraBox p{width:90%;margin:2em auto;text-align:center}

h2{font-weight:bold;font-size:160%}
#pageContents .showCase{width:90%;margin:1em auto 5em auto;text-align:center}
#pageContents .showCasebox{width:90%;margin:5em auto 2em auto;}


#pageContents .brand{
	width:100%;
	clear:both;
	margin-top:1em;
}

#pageContents .brandImg{
	float:left;
	width:40%;
}

#pageContents .brandName{
	float:right;
	width:60%;
	height:80px;
	text-align:right;
}

#pageContents .brandName p{
	position:relative;
	top:50px;
	width:90%;

}



#pageContents ul{
	display:table;
	table-layout: fixed;
	width:98%;
	border:1px dotted #c1c1c1;
	margin-bottom:2em;

}

#pageContents ul.furniturepic{
	display:table;
	table-layout: fixed;
	width:98%;
	margin-bottom:0;
}

.jireiContents ul{
	display:table;
	table-layout: fixed;
	margin-bottom:0;
}

.jireiContents ul.jireiicon li{
	font-size:64%;
	color:#555555;
	border:solid 1px #aaa;
	float:left;
	margin:3px 4px 3px 0px;
	padding:4px 6px;
	width:inherit;
	line-height:9px;
	border-radius:30px;
}

.jireiContents ul.jireiicon li.house{
  color:#FFFFFF;
	background-color:#426669;/*御召茶*/
	border: none;
}

.jireiContents ul.jireiicon li.build{
  color:#FFFFFF;
	background-color:#e59f5c;
	border: none;
}

.jireiContents h3 a{
	font-size:96%;
	font-weight: bold;
	color:#444444;
	padding-left:2px;
}

#pageContents li{
	display:table-cell;
	padding-left:4px;
}

#pageContents li ul.photoTopic{
	font-size:86%;
	display:block;
	border:none;
}

#pageContents li ul.photoTopic li.photoParts{
	display:block;
	padding-left:0px;
}

#pageContents li ul.photoTopic li.photoCaption{
	display:block;
	padding-left:0px;
}


/*--追加2013・11・1広告ギャラリー用--*/
#pageContents li.ad{
	text-align:center;
	padding:4px;
}

#pageContents li.adText{
	font-size:90%;
	text-align:left;
}

#pageContents li img.adsm{
	width:50%;
}

#pageContents h3.adSubTitle{
	background-image:url(../images/bottomline.png) ;
	background-repeat:repeat-x;
	background-position:0 100%;
	font-size:120%;
	color:#333;
	height:40px;
	line-height:36px;
	background-color:#f4f4f4;
	padding-left:4px;
}

/*--追加ここまで--*/


/*--for reform top--*/



#pageContents ul.reformTop{
	margin-top:1em;
	border:none;
}

#pageContents ul.reformTop li{
	margin-bottom:1em;
}

#pageContents #afterservice {
	width: 100%;
	height: auto;
	margin: 10px 0px 0px 0px;
	clear:both;
	border:1px dotted #c1c1c1;
	display:block;
	overflow:hidden;

}

#pageContents #afterservice .afterserviceCase{
	width:80%;
	float:left
}

#pageContents #afterservice .afterserviceChara{
	width:18%;
	float:right
}


#pageContents #afterservice .afterserviceCase ul {
	padding: 10px 0px 0px 15px;
	display:block;
	border:none;
}

#pageContents #afterservice .afterserviceCase li {
	width: 86%;
	font-size:90%;
	background: #fff url(./images/reformIcon.jpg) no-repeat;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 20px;
	display:block;
}

#reformpageContents li{
	padding-left:4px;
}

#reformwrap #reformsideMenu{
	float:right;
	width:40%;
	margin-right:20px;
	display:block
}

#reformsideMenu ul{
	width:100%;
	margin-top:1em
}

#reformsideMenu ul li{
	margin-bottom:1em;
	border:1px solid #CDC0C0;
	background-repeat:no-repeat;
	background-position:4% 50%;
	font-size:90%;
	text-indent:1em;
		/*--↓IE9以下追加--*/
/*	filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=20);
    -ms-filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=20)";*/
}

#reformsideMenu ul li a{
	height:30px;
	line-height:50px
}




#pageContents #reform p.centerText {
	text-align: center;
}

#pageContents p.centerText {
	margin-bottom:20px;
}

#reformwrap #reformsideMenu .subInfo{
	width:100%;
	padding:0
}



/*----for kitchen reform-----*/
#pageContents ul.cab{
	width:60%;
	margin:0 auto;
	overflow:hidden;
}



#pageContents li ul.photoTopic li.photoCatch{
	background:#e42187;
	color:#fff;
	font-weight:bold;
	font-size:84%;
	width:100%;
	text-align:center;
	display:block;
	padding: 5px 0;
}


/*--for package--*/
#pageContents li ul.photoTopic li.photopack{
	background:#663333;
	color:#fff;
	font-weight:bold;
	font-size:100%;
	width:99%;
	text-align:center;
	display:block;
}


#pageContents table{
	width:96%;margin:0 auto;
	font-size:84%
}

#pageContents td.photoTable{
	width:25%;padding:0.4em;
	border:1px solid #ccc;
	text-align:center;
}

#pageContents td{
	width:75px;padding:0.4em;
	border:1px solid #ccc
}




#pageContents #subReadBox2{width:96%;height:86px;margin:2em auto;display:block;border-top:1px solid #ccc;border-bottom:1px solid #ccc}
#pageContents #subReadBox2 .subReadBoxLeft2{float:left;height:86px;line-height:86px;}
#pageContents #subReadBox2 .subReadBoxRight2{float:right;font-size:86%;}
#pageContents #subReadBox2 .subReadBoxRight2 ul{list-style-type:disc;}



/*--floatclear--*/
.floatclear{clear:both}

/*--moji decoration--*/
.mlarge{font-size:180%}
.attnBd{font-weight:bold;font-size:140%;}
.attnOg{color:#FE6C01}
.attnRed{color:#ff0000;font-weight:bold;font-size:200%;}
.attnRedsm{color:#ff0000;font-weight:bold;font-size:100%}
.attnSmall{color:#513600;font-size:90%}


#pageContents #pageNext{width:100%;text-align:center;margin-top:4em;margin-bottom:4em}
#pageContents #pageNext p{color:#5a5a5a;}

#main #pageNext{width:100%;text-align:center;margin-top:4em;margin-bottom:4em}
#main #pageNext p{color:#5a5a5a;}


#kanren{width:100%;margin:0 auto 6em auto;display:block}
#kanren dl{font-size:90%}
#kanren dl dd{text-indent:2em;background-image:url(../images/sankaku.png) ;background-repeat:no-repeat;background-position:2% 50%}
#kanren dl dd a{height:26px;line-height:26px}
#kanren dl dd a:hover{color:#B5320A;text-decoration:underline;}


aside{font-size:80%;color:#E44506;width:90%;margin:0 0 4em 3em;text-align:left}


/*==================================
		company info
====================================*/


#aboutUs {
	width: 100%;
	margin: 10px 0px 4em 0px;
	font-size: 90%;
}

#aboutUs table {
	width:100%;
	margin: 20px 0px 10px 0px;
}

/*
#aboutUs table th {
	width: 28%;
	background: #e2f7b6;
	border: 1px #94b34b solid;
	padding: 5px 0px 5px 5px;
}


#aboutUs table td {
	width: 72%;
	border: 1px #94b34b solid;
	padding: 5px 0px 5px 10px;
}
*/

#aboutUs table th,
#aboutUs table td{
border-bottom: 1px solid #dfddd9;
padding:10px 6px;
color:#555;
}

/* 追加2014.04.28 */
#aboutUs #resultsnumber {
	float: left;
	width: 34%;
}

#aboutUs #results {
	float: right;
	width: 58%;
	padding: 5px;
	margin: 0;
}

#aboutUs #resultsnumber p{
	font-size: 9px;
	text-align:right;
	color:#555;
}

#aboutUs #results h4 {
	margin: 0px 0px 10px 0px;
}

#aboutUs #results p {
	line-height: 1.6em;
	text-align:center;
	margin: 10px 0px 10px 3px;
	color:#555;
}

#aboutUs #accessMap {
	float: left;
	width: 56%;
}

#aboutUs #accessMap #map {
	width: 98%;
	border: 1px #94b54a solid;
	padding: 5px;
	margin: 20px auto 5px auto;
	text-align:center
}

#aboutUs #access {
	float: right;
	width: 36%;
	padding: 5px;
	margin: 18px 0px 0px 0px
}

#aboutUs #accessMap p {
	font-size: 1.0em;
	margin: 0px 0px 10px 5px;
	color:#555;
}

#aboutUs #access h4 {
	margin: 0px 0px 10px 0px;
}

#aboutUs #access p {
	line-height: 1.6em;
	margin: 0px 0px 10px 3px;
	color:#555;
}

/*--googlemap--*/
.embed-container{
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	max-width:100%;
	height:auto;
}

.embed-container iframe, .embed-container object, .embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*

.embed-container{
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	max-width:100%;
	height:auto;
}

.embed-container iframe, .embed-container object, .embed-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

*/


/*==================================
     privacy policy
===================================*/
#policyContents{
	width:100%;
	margin:2em 0;
	font-size:90%
}

#policyContents p{
	width:96%;
	margin:1em auto;
	line-height:1.6
}

#policyContents .policyTop{
	border:1px solid #c1c1c1
}

#policyContents .policyTop h3.policyTopline{
	font-weight:bold;
	font-size:110%;
	border-left:6px solid #a00404;
	line-height:1.8;
	text-indent:1.2em;
	background:#F3FADB;
	margin:2px
}

#policyContents #policyRead{
	width:96%;
	margin:0 auto;
	margin-bottom:1.2em
}

#policyContents .policyMain{
	width:90%;
	margin:0 auto 2em auto
}

#policyContents .policyMain ol{
	margin-top:1em
}

#policyContents .policyMain ol li{
	list-style-type:decimal;
	margin-bottom:0.6em;
	line-height:1.6
}

#policyContents .policyMain ol li.policyDetails{
	list-style-type:none
}

#policyContents .policyCounter{
	margin-top:1em;
	font-size:80%
}
.attnpo{
	color:#755717;
	font-weight:bold
}

/*===================================
      sitemap page
====================================*/
#sitemapContents{
	width:100%;
	margin:3em 0
}

#sitemapContents .cateMain h4.cateTitle{
	height:40px;
	line-height:40px;
	font-size:100%;
	font-weight:bold;
	text-indent:1em;
	background-image:url(../images/sitemap_bg.jpg);
	background-repeat:no-repeat
}

#sitemapContents .cateMain h4.cateTitle a{
	text-decoration:none;
	color:#333
}

#sitemapContents .cateMain h4.cateTitle a:hover{
	text-decoration:underline
}

#sitemapContents .cateSub{
	width:92%;
	margin:1em auto;
	font-size:90%;
}

#sitemapContents .cateSub ul li{
	height:40px;
	line-height:40px;
	background-image:url(../images/headermark_sm.jpg);
	background-repeat:no-repeat;
	background-position:2% 50%;
	text-indent:3em;
	margin-bottom:4px;
}


/*==================================
		recruit information page
===================================*/

#saiyoBox{
	width:100%;
	margin:2em auto;
	font-size:100%;
}

#saiyoBox p{
	line-height:28px;
	margin-bottom:1em
}

#saiyoBox .saiyoBoxInner{
	margin-top:10px;
	border:1px solid #cbcbcb;
	background-image:url(../images/recruit_bg.gif);
	background-repeat:no-repeat;
	background-position:90% 50%
}

#saiyoBox .saiyoBoxInner ul{
	width:500px
}

#saiyoBox .saiyoBoxInner ul li{
	border-left:6px solid #48A000;
	margin:2em 1em;
	text-indent:2em
}

#saiyoBox .saiyoBoxInner ul li b{
	color: red;
}


/*--各募集ページ--*/
#saiyoBox .saiyoBoxTitle{border-bottom:3px solid #4F3C3C;}
#saiyoBox h2.job{margin:1em 0;font-size:18px;font-weight:bold;border-left:8px solid #FB671F;text-indent:2em;}
#saiyoBox dl.jobcon{border-top:1px solid #cbcbcb;border-bottom:1px solid #cbcbcb;font-size:90%;padding:6px 0;line-height:140%;overflow:auto;margin-bottom:0.5em;clear:both;}
#saiyoBox dl{width:96%;font-size:90%;padding:6px 0;line-height:140%;border-bottom:1px solid #cbcbcb;margin-bottom:0.5em;}
#saiyoBox dl dt{width:25%;float:left;display:inline;}
#saiyoBox dl dd{width:70%;float:left;display:inline;padding-left:2px;}


/*==================================
		 link page
==================================*/

.aboutLink{
	width:90%;
	margin:1em auto;
	font-size:90%;
}

.aboutLink ul li{
	list-style-type:disc;
	line-height:1.6em

}



h5{
	background-image:url(../images/linkHeadlineBG.jpg);
	background-repeat:no-repeat;
	font-weight:bold;
	font-size:90%;
	text-indent:1em
	margin:1em auto;
}

/*=================================
		bank loan information
==================================*/


#pageContents table{
	width:96%;margin:0 auto;
	font-size:84%
}

#pageContents th{
	width:8%;padding:0.4em;
	border:1px solid #ccc
}

#pageContents td.bank{
	width:17%;
	padding:0.4em 0 0.4em 4px;
	border:1px solid #ccc;
	background:#e2e2c7
}

#pageContents td.bankLoan{
	width:70%;
	padding:0.4em 0 0.4em 4px;
	border:1px solid #ccc
}

#pageContents th.spectitle{
	width:24%;
	padding:1.5em;
	background:#F9F9E4;
	border:1px solid #ccc;
}

#pageContents td.spec{
	width:17%;
	border:1px solid #ccc;
}


/*======================================
	form
=======================================*/

#form {
	width: 60%;
	margin: 10px auto;
}

#form table {
	width:96%;
	font-size: 82%;
	border-collapse: collapse;
	margin: 0px 0px 0px 5px
}

#form table th{
	width: 32%;
	height:40px;
	background: #fafafa;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 10px;
	color:#777;
}

#form table td{
	width: 65%;
	background: #ffffff;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 10px;
}

#form table th span{
	color: #d92a27;
}

#form p{
	line-height: 1.4em;
	font-size:90%
	color:#555;
}

#form p.popLead{
	color:#555;
	font-size:90%;
}

#form p.required{
	font-size:90%;
	color: #d92a27;
	margin: 10px 10px 0px 0px;
}

#form small{
	font-size:75%;
	color:#777;
}


#form p.small{
	font-size:78%;
	color:#777;
}



#form #textfield03,#form #textfield06{
	width:90%;
}

#form #textfield08,#form #textfield17,#form #textarea01,#form #textarea02{
	width:80%
}

#form #textfield12,#form #textfield13{
	width:36%;
	margin-bottom:2px;
}

label.kinds{
	display:inline-block;
	width:150px;/*120px→150px変更14.12.11*/

}

label.landarea{
	display:inline-block;
	width:150px;
}




/*--*/
#form #buyForm table th{
	background: #c5f1fa;
	border: 1px #81c0e1 solid;
	text-align:left;
}

#form #buyForm td{
	border: 1px #81c0e1 solid;
}

#form #buyForm table th span{
	color: #2c639b;
	font-weight: bold;
}

#form #sellForm table th{
	background: #ffe7ed;
	border: 1px #fab7c9 solid;
	text-align:left;
}

#form #sellForm td{
	border: 1px #fab7c9 solid;
}

#form #sellForm table th span{
	color: #e24c69;
	font-weight: bold;
}

#form #reformForm table th{
	background: #fff5fc;
	border: 1px #f9b8e4 solid;
	text-align:left;

}

#form #reformForm td{
	border: 1px #f9b8e4 solid;
}

#form #reformForm table th span{
	color: #8c5aaf;
	font-weight: bold;
}

#form table th.tableHeadline{
	width: 600px;
}

#form p.centerText{
	text-align:center;
}









/*===================================================
 ■■■オススメ物件　追加 -- added in Sep.16.2013
==================================================*/
#houseInfo{
	width:100%;
	margin:2px 0
}

#houseInfo h2.houseInfoTitle{
	margin:1.2em 0;
	background:url(../images/housemark1.png);
	background-repeat:no-repeat;
	background-position:2% 50%;
	font-size:140%;
	font-weight:bold;
	text-indent:3em;
	height:56px;
	line-height:56px;
	border-bottom:4px solid #5F3F2E
}


/*--openhouse--*/
#houseInfo h2.openHouseTitle{
	margin:1.2em 0;
	background:url(../images/openhouse_button.png);
	background-repeat:no-repeat;
	background-position:2% 50%;
	font-size:140%;
	font-weight:bold;
	text-indent:4em;
	height:70px;
	line-height:70px;
	border-bottom:4px solid #5F3F2E
}




#houseInfo #bukken{
	width:100%;
	height:24px;
	margin-bottom:10px;
}

#houseInfo #bukken p.bukkenDetails{
	float:left;
	width:100px;
}

#houseInfo #bukken h3{
	font-size:90%;
	font-weight:bold;
	margin:0;
	padding:0;
}

#houseInfo #pickupInformation{
	width:100%;
	margin-bottom:2em;
	font-size:12px;
	border:1px solid #999999;
	background-color:#ffffff;
	display:block;
}

#houseInfo #pickupInformation dl{
	width:96%;
	margin:1em auto;
	height:26px;
	border-bottom:1px dotted #C4B0A2;
	clear:left;
	overflow:hidden;
}

#houseInfo #pickupInformation dl dt{
	float:left;
	display:inline;
}

#houseInfo #pickupInformation dl dd{
	float:left;
	display:inline;
	margin-left:1em;
}

/* 3/7追加 architect */
#houseInfo #architectInformation{
	width:100%;
	margin-bottom:2em;
	font-size:12px;
	border:1px solid #999999;
	background-color:#ffffff;
	display:block;
}

#houseInfo #architectInformation dl{
	width:96%;
	margin:1em auto;
	height:auto;
	border-bottom:1px dotted #C4B0A2;
	clear:left;
	overflow:hidden;
}

#houseInfo #architectInformation dl dt{
	float:left;
	display:inline;
}

#houseInfo #architectInformation dl dd{
	float:left;
	display:inline;
	margin-left:1em;
}



/*--price space years birth--*/
#houseInfo #pickupInformation .pickupInfoInner{
	display:block;
	width:96%;
	margin:0 auto;
	border-bottom:1px dotted #C4B0A2;
	overflow:hidden;
	clear:both
}

#houseInfo #pickupInformation .pickupInfoInner .priceSpace{
	float:left;
	display:block;
	width:48%;
}

#houseInfo #pickupInformation .pickupInfoInner .yearsBirth{
	float:right;
	display:block;
	width:52%;
}


#houseInfo #pickupInformation .pickupInfoInner .priceSpace ul{
	display:table;
	width:100%;
}

#houseInfo #pickupInformation .pickupInfoInner .priceSpace li{
	display:table-cell;
	padding-right:2px;
	padding-bottom:10px;
	width:25%;
}

#houseInfo #pickupInformation .pickupInfoInner .yearsBirth ul{
	display:block;
	width:100%;
}

#houseInfo #pickupInformation .pickupInfoInner .yearsBirth li{
	display:inline;
	width:100%;
	margin-right:4px;
}



#houseInfo #bukkenGaiyo{
	width:100%;
	margin-top:4em;
	border-bottom:1px solid #999999
}

#houseInfo #bukkenGaiyo h4{
	margin-bottom:10px;
	font-size:15px;
	font-weight:bold;
	height:24px;
	line-height:24px;
	border-left:4px solid #323232;
	text-indent:1em
}



/*
#houseInfo table{width:100%;margin:8px 0;}
#houseInfo th{text-align:center;width:25%;}
#houseInfo td{background-color:#ffffff;text-align:left;}*/

#houseInfo #mapGuide{width:100%;margin:2em 0 4em 0;border:1px solid #ccc;background-color:#fff;}
#houseInfo #mapGuide #mapGuideArea{width:800px;height:600px;margin:0.2em auto;}



#houseInfo .estateNav{
	width:100%;
	border:1px solid #ccc;
	padding:10px;
	margin:6px 0;
	height:40px;
	line-height:40px;
}

#houseInfo .estateNav .estateNavInner{
	border-left:6px solid #E85A05;
	width:94%;
	margin:0 auto;
	text-indent:2em;
}


#houseInfo h3.company{
	border-top:3px solid #124604;
	background:#f3f3f3;
	padding:2px 0;
	margin:4px 6px;
	width:100%;
	height:36px;
	line-height:36px;
	font-size:100%;
	font-weight:bold;
}

#houseInfo h3.cleaning{
    border-bottom:1px solid #0A50A1;
    font-weight:bold;
    height:38px;
    line-height:40px;
    margin-top:20px
}


/*--flow chart for buying--*/


#houseInfo h3.chart{
	/*border-top:3px solid #124604;
	border-bottom:1px dotted #ccc;
	background:#f3f3f3;*/
	padding:2px 0;
	margin:4px 6px;
	width:100%;
	height:36px;
	line-height:36px;
	font-size:100%;
	font-weight:bold;
}

#houseInfo h3.chart img{margin-left:6px;margin-right:1em;vertical-align:middle;}

#houseInfo .flowContents{
	width:100%;
	height:auto;
	display:block;
	overflow:hidden;
	font-size:90%;
	clear:both;
}

#houseInfo .flowContents .flowStream{
	width:41px;
	height:auto;
	float:left;
}


#houseInfo .flowContents p{
	margin-top:10px;
	-zoom:1;
	overflow:hidden;
}

#houseInfo .flowContentsEnd{
	width:100%;
	height:160px;
	display:block;
	overflow:hidden;
	margin-bottom:2em;
	font-size:90%;
	clear:both;
}

#houseInfo .flowContentsEnd .flowContentsGoal{
	width:32%;
	height:auto;
	float:left;
}

#houseInfo .flowContentsEnd p{
	margin-top:10px;
	-zoom:1;
	overflow:hidden;
}


/*--flow chart for selling--*/


#houseInfo .flowContents{
	clear:both;
}

#houseInfo .flowContents .sellWrapper{
	float:left;
	width:70%;
}

#houseInfo .flowContents .cellname{
	float:left;
	margin:10px 5px;
	font-weight:bold;
}

#houseInfo .flowContents .sellLeft{
	float:left;
	width:20%;
}
#houseInfo .flowContents .sellCenter{
	float:left;
	width:76%;
	line-height:1.8;
	color: #555
}

#houseInfo .flowContents .sellpr{
	float:left;
	width:76%;
	line-height:1.8;
}

#houseInfo .flowContents .sellRight{
	float:right;
	width:25%;
	text-align:right;
}

#houseInfo p.centerText{
	width:90%;
	margin:0 auto;
	text-align:center;
}



/*--文字装飾--*/
.mred{color:#FC652A;font-weight:bold;}
.mredsmall{color:#A1120B}

/*-------table 追加-----------------*/

#houseInfo table{
	width:100%;
	margin:8px 0;
	cellpadding:2px;
	cellspacing:2px;
	border:none;
	border-collapse: collapse;
  border-spacing: 0;
}

#houseInfo th{
	padding:2px;
	text-align:center;
	line-height:2.8;
	font-size:13px;
	background-color:#D9F7FE;
	border:1px solid #aaa
}

#houseInfo th.frontkmk{
	text-align:center
}

#houseInfo td{
	padding:2px;
	text-align:left;
	line-height:2.8;
	font-size:13px;
	border:1px solid #aaa
}

#houseInfo td.tokka{
	color:#ff0000;
	font-weight:bold
}



/*============================================================================
     new slide(fade) show
==============================================================================*/
#houseInfo #estateBox{
	width:100%;
	height:auto;
	margin:1em 0;
	background-color:#ffffff;
	overflow:hidden;
	display:block;
	border:1px solid #c1c1c1;
	padding:0
}

#estateBox_80{
	width:80%;
	height:auto;
	margin:1em auto;
	background-color:#ffffff;
	overflow:hidden;
	display:block;
	border:1px solid #c1c1c1;
	padding:0
}

#crossmain{
    position:relative;
    width:100%;
    height:100%;
    margin:0 auto;
    padding:0;
    display:block;
    overflow:hidden
}

#crossmain li {
    position:absolute;
    top:0;
    left:0;
    width:100%
}

#pageContents ul.sekouOutline{
    border:none;
}

#crossmain li.sekouShow{
    width:99%;
}

#crossmain li:first-child{
	position:relative
}

#crossmain li img{
	width:100%;
	margin:0 auto
}


.crossfaderPager{
	position:relative;
	width:90%;
    height:100%;
    margin:6px auto 2px auto;
    padding:0;
    overflow:hidden;
    clear:both;
    border:1px solid #fff;
}



.crossfaderPager li{
	display:inline;
}

.crossfaderPager li a{
    float:left;
    margin-left:10px;
    margin-bottom:4px;
    width:18%;
    border:1px solid #b1b1b1;
}

.crossfaderPager li.sekoulmg a{
    margin-left:0px;
    margin-top:4px;
    width:96%;
}

.crossfaderPager li a.active{
	border:1px dotted #f00
}

.crossfaderPager a:hover{
	border-bottom:1px solid #000;
}

#crossfaderFeed{
    width:330px;
    height:40px;
    margin:0 auto 1em auto;
    padding:0;
    list-style:none
}

#crossfaderFeed li{
	display: inline
}

#crossfaderFeed a{
    float:left;
    display:block;
    width:100px;
    height:40px;
    margin-right:5px;
    text-indent:-9999px;
    overflow:hidden;
    background:url(../images/a5e645a6.png) no-repeat 0 -240px
}

#crossfaderFeed a:hover{
	background-position:0 -280px
}

#crossfaderFeed #crossfaderNext a{
	background-position:0 -160px
}

#crossfaderFeed #crossfaderNext a:hover{
	background-position:0 -200px
}

#crossfaderController a{
	background:url(../images/a5e645a6.png) no-repeat
}

#crossfaderController a:hover{
	background-position:0 -40px
}

#crossfaderController a.play{
	background-position:0 -80px
}

#crossfaderController a.play:hover{
	background-position:0 -120px
}

/* =======================================
	new slide(fade) show 14.1.10
======================================= */
#slideshow {
	margin: 0 auto;
	width:100%;
	text-align: center;
}



#slideshow div{
	width: 100%;
	overflow: hidden;
	position: relative;
}

#slideshow div div{
	top: 0;
	left:0;
	float: left;
	position: absolute;
}

#slideshow ul {
	margin:10px auto;
}

#slideshow ul li {
	width: 50px;
	float: left;
	display: inline;
}

#slideshow .active {
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
}

#slideshow ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

#slideshow ul {
    display: inline-block;
    overflow: hidden;
}


#btn-prev {
	position: relative;
	left: -40px;
	top: -130px;
}
#btn-next {
	position: relative;
	left: 305px;
	top: -130px;
}


/* ===========ここまで=============*/

/*--図面& popup window--*/

#zumenWrap{
	width:100%;
}

#zumenWrap .zumenLeft{
	float:left;
	display:table;
	width:50%;
	margin-right:20px;
}

#zumenWrap .zumenRight{
	dispaly:table-cell;
	varticla-align:middle;
}

#zumenWrap .zumenRight p{
	width:100%;
	margin:1em auto;
	font-size:80%;
}

#infoContact{
	width:100%;
}

#infoContact img{
	margin:10em 0 1em 2px;
}



#infoContactOther{width:100%;margin-top:3em;margin-bottom:2em;display:block;}
#infoContactOther p{width:90%;margin:1em auto;}




/*--ここからPOPUP--*/
/*--
div#modal {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
}
div#modal div.background {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000000;
	opacity: 0.75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha(opacity=75)";
}
div#modal div.container {
	position: relative;
	width: 500px;
	height: 500px;
	background-color: #ffffff;
}
*/

/*=============================================
     ie-aicon
==============================================*/


/*.home {
font-size: 9px;
height: 1.7em;
width: 0.8em;
background-color: #E5278B;
margin-top: 5em;
margin-left: 0em;
border-bottom: none;
border-right: 0.8em solid #000000;
border-left: 0.8em solid #000000;
border-top: 0.1em solid #000000;
position: relative;
}

.home::before {
border-left: 1.2em solid transparent;
position: absolute;
content: "";
top: -1.0em;
right: -0.8em;
width: 0em;
height: 0em;
border-right: 1.2em solid transparent;
border-bottom: 0.9em solid #000000;
}

_::-webkit-full-page-media, _:future, :root .home::before {
	border-left: 1.2em solid transparent;
	position: absolute;
	content: "";
	top: -1.0em;
	right: -0.8em;
	width: 0em;
	height: 0em;
	border-right: 1.2em solid transparent;
	border-bottom: 0.95em solid #000000;
}*/

.pentagon {
  position: relative;
  width: 54px;
  border-width: 50px 18px 0;
  border-style: solid;
  border-color: #55A4A0 transparent;
}

.pentagon:before {
  content: "";
  position: absolute;
  height: 0;
  width: 0;
  top: -85px;
  left: -18px;
  border-width: 0 45px 35px;
  border-style: solid;
  border-color: transparent transparent #55A4A0;
}

/*
.sekouhome {
font-size: 9px;
height: 1.7em;
width: 0.8em;
background-color: #E5278B;
margin-top: 5em;
margin-left: 0em;
border-bottom: none;
border-right: 0.8em solid #000000;
border-left: 0.8em solid #000000;
border-top: 0.1em solid #000000;
position: relative;
}

.sekouhome::before {
border-left: 1.2em solid transparent;
position: absolute;
content: "";
top: -1.0em;
right: -0.8em;
width: 0em;
height: 0em;
border-right: 1.2em solid transparent;
border-bottom: 0.9em solid #000000;
}
*/

/*=============================================
     animation
==============================================*/

.animation {
width: 100%;
}



.fadeInDown {
 -webkit-animation-fill-mode:none;
 -ms-animation-fill-mode:none;
 animation-fill-mode:none;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(10px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


/*=============================================
     img animation
==============================================*/

figure {
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	opacity: 0.9;
	display: block;
}



.imgAnimationShinchiku img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    -webkit-transition: 0.5s ease-in-out;
       -moz-transition: 0.5s ease-in-out;
         -o-transition: 0.5s ease-in-out;
            transition: 0.5s ease-in-out;

}
.imgAnimationShinchiku img:hover{
	opacity: .5;
	filter: alpha(opacity=50);

}

.imgAnimationShinchiku {
    color: #fff;
}

.imgAnimationSougo {
    color: #fff;
}

.imgAnimationSougo img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    -webkit-transition: 0.5s ease-in-out;
       -moz-transition: 0.5s ease-in-out;
         -o-transition: 0.5s ease-in-out;
            transition: 0.5s ease-in-out;

}
.imgAnimationSougo img:hover{

	opacity: .5;
	filter: alpha(opacity=50);
}

.imgAnimationSonota {
    color: #fff;
}

.imgAnimationSonota img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    -webkit-transition: 0.5s ease-in-out;
       -moz-transition: 0.5s ease-in-out;
         -o-transition: 0.5s ease-in-out;
            transition: 0.5s ease-in-out;

}
.imgAnimationSonota img:hover{
	opacity: .5;
	filter: alpha(opacity=50);
}

/*======================================
	2016.2.5追加
=======================================*/

.slider img {
  display: block;
  height: auto;
  text-align:center;
  margin:0 auto;
  width: 100%;
  border: 0;
  }

.slider_container {
  margin-bottom: 10px;
  position: fixed;
  float: left;
  width: 100%;
  overflow: hidden;
  z-index:1;
  }

.centered-btns_nav {
  z-index: 3;
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 50%;
  left: 0;
  opacity: 0.7;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 61px;
  width: 38px;
  background: transparent url("../images/themes.gif") no-repeat left top;
  margin-top: -45px;
  }

.centered-btns_nav:active {
  opacity: 1.0;
  }

.centered-btns_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
  }

.centered-btns_nav:focus,
.transparent-btns_nav:focus,
.large-btns_nav:focus {
  outline: none;
  }

.centered-btns_tabs,
.transparent-btns_tabs,
.large-btns_tabs {
  margin-top: 0px;
  text-align: center;
  }

.centered-btns_tabs li,
.transparent-btns_tabs li,
.large-btns_tabs li {
  display: inline;
  float: none;
  _float: left;
  *float: left;
  margin-right: 5px;
  }

.centered-btns_tabs a,
.transparent-btns_tabs a,
.large-btns_tabs a {
  text-indent: -9999px;
  overflow: hidden;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background: #ccc;
  background: rgba(0,0,0, .2);
  display: inline-block;
  _display: block;
  *display: block;
  -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  width: 9px;
  height: 9px;
  }

.centered-btns_here a,
.transparent-btns_here a,
.large-btns_here a {
  background: #222;
  background: rgba(0,0,0, .8);
  }

/*======================================
	2016.4.15追加   award
=======================================*/


.award{
	margin-top:200px;
}

#awardInfo{
	width:100%;
	margin:20px 0
}

#awardInfo h2.awardTitle{
	font-family:メイリオ;
	color: #333;
	margin:2em 0 0 0;
	font-size:160%;
	font-weight:bold;
	height:40px;
	line-height:40px;
	border-bottom:2px solid #5F3F2E
}

.btn01 {
	color:#666;
	font-size:13px;
	font-weight:bold;
	font-family:メイリオ;
    text-decoration: none;
    float:right;
    text-align:center;
    display: block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
    /* ここで動く速度とか設定 */
    transition: all .7s ease;
    -webkit-transition: all .7s ease;
}
.btn01:hover {
    transform: rotate(720deg);
    -webkit-transform: rotate(720deg);
}

.btn a { text-decoration : none;color:#fff}
.btn a:hover {text-decoration:underline;color:#fff}

.btn04 {
	color:#fff;
	font-size:15px;
	font-weight:bold;
	font-family:メイリオ;
	float:right;
    text-decoration: none;
    text-align: center;
    position: relative;
    z-index: 10;
    display: block;
    width: 70px;
    height: 70px;
    line-height: 70px;
}

.btn04::before {
    content: '';
    background-color: #dda284;
    display: block;
    position: absolute;
    width: 70px;
    height: 70px;
    z-index: -1;
    border-radius: 50%;
    box-shadow:
        0 0 0 0 #fff,
        0 0 0 0 #dda284;
    transition: all .2s ease;
    -webkit-transition: all .2s ease;
}
.btn04:hover::before {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    box-shadow:
        0 0 0 15px #fff,
        0 0 0 17px #dda284;
}

/*======================================
	2016.5.1追加   personality-room
=======================================*/

.personalitymain{
	float:left;
	margin:0 0 120px 0;
}

.personalityMuku{
	margin:10px 0 50px 0;
	float:left;
}

.personalityMukuSekou{
	margin:0 10px 10px 0;
	float:left;
}

.personalityTileSekou{
	margin:0 10px 10px 0;
	float:none;
}

.mukuprice{
	font-size:200%;
	color:#9D0022;
}

.mukusentence{
	float:left;
	width:100%;
}

/*======================================
	2016.5.10追加   homes-banner
=======================================*/

.homes-banner{
	margin:20px 0 0 0;
}


.homes-banner img{
	margin:20px 3px 0 3px;
	width:48%;
}

/*======================================
	2016.5.26追加   area
=======================================*/

#area {
	width: 100%;
	margin: 10px 0px 4em 0px;
	font-size: 90%;
}

#area table {
	width:60%;
	margin: 20px 0px 10px 0px;
}


#area table th {
	width: 32%;
	text-align:center;
	background: #ddd;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 5px;
}


#area table td {
	width: 68%;
	text-align:center;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 10px;
}

#area table th,
#area table td{
border-bottom: 1px solid #dfddd9;
padding:10px 6px;
color:#555;
}

.eqinquiry{
	margin-top:50px;
}

/*======================================
	2016.6.4追加   earthquake
=======================================*/

.eqchart{
	width: 100%;
	border-collapse: collapse;
	text-align:center;
	margin: 20px 0px 10px 0px;
}

.eqchart th{
	background-color: #ddd;
	height:50px;
}

.ecosection{
	margin: 30px 0px 70px 0px;
	overflow: auto;
	white-space: nowrap;
	color:#555;
}

.ecochart{
	width: 100%;
	border-collapse: collapse;
	text-align:center;
	margin: 20px 0px 10px 0px;
}
.ecosection::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 5px;
}
.ecosection::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.ecosection::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}

.ecochart th{
	background-color: #ddd;
	height:50px;
}
.ecochart td{
	font-size: 0.9em;
	height:40px;
}
.eqsection{
	margin: 30px 0px 70px 0px;
}

#pageContents .mainRead h4{
	font-size:17px;
	border-bottom:solid 1px #999;
	margin:50px 10px 20px 0;
	font-weight:bold;
	color:#555;
}

#pageContents .mainRead .chartcontent h4{
	font-size:17px;
	border-bottom:solid 1px #999;
	margin:50px 10px 20px 30px;
	font-weight:bold;
	color:#555;
}

#pageContents .mainRead .chartcontent p{
	width:98%;
	border:none;
	margin-bottom:1em;
	font-size:15px;
	color:#555;
	margin-left:40px;
	clear: both;
}

#pageContents .mainRead .chartcontent ul{

	width:98%;
	border:none;
	margin-bottom:1em;
	font-size:15px;
	color:#555;
	margin-left:40px;
	clear: both;
	list-style-type: disc;
}

#pageContents .mainRead .chartcontent ul li{
	display: block;
	position: relative;


}


#pageContents .mainRead .matomecontent ul{
	display: block;
	width:80%;
	border:none;
	margin-bottom:2em;
	font-size:15px;
	color:#555;
	margin-left:40px;
	clear: both;
}

#pageContents .mainRead .matomecontent ul li{
	display: block;
	position: relative;
	padding:5px;
}

#pageContents .mainRead .matomecontent ul li:after {
	display: block;
	content: '';   /*コンテンツを挿入*/
	position: absolute;
	top: 12px;
	left: -1em;
	width: 7px;
	height: 7px;
	background-color: #FFADD9;
	transform: rotate(-45deg)!important;  /*45度回転させている*/

}

#form .eqfield01{
	width:40%;
	border:1px solid #ddd;
	margin:10px 0 10px 0;
	height:40px;
}

#form .eqfield02{
	width:40%;
	border:1px solid #ddd;
	margin:10px 0 10px 0;
	height:40px;
}

#form .eqfield03{
	width:90%;
	border:1px solid #ddd;
	margin:10px 0 10px 0;
	height:40px;
}


#form .eqfield04{
	width:70%;
	margin:10px 0 10px 0;
	height:40px;
}

#form .eqfield05{
	width:15%;
	border:1px solid #ddd;
	margin:10px 0 10px 0;
	height:30px;
}
.eqcontact{
	font-weight:bold;
	margin:40px 0 0 0;
}

.eqcontact span{
	font-size:80%;
	color:#d92a27;
}

#pageContents .mainRead .eqdate{
	width:100%;
}

#pageContents .mainRead .eqdate img{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.eqhaba{
	width:93%;
}



.sekouwid{
	width:85%;
}

#pageContents .sekouwid .mainRead p.imgMabefore{
	margin:150px 0 0 0;
}

#pageContents .sekouwid .mainRead p.imgMa{
	line-height:50px;
	display: inline;
	width:100%;
}

#pageContents .sekouwid .mainRead p{
	margin-top:0px;
}

#sectionRedColor {
     background: #fff;
}

#example {
	margin-top: 80px;
	height:800px;
  width: 100%;
	background-attachment: fixed;
	-webkit-background-size: cover;
	background-size: cover;
	background-position: center center;
	position: relative;
	overflow: hidden;
}




#exampleTop {
	background-image:url("../images/ie.svg");
	background-repeat: no-repeat;
	background-size: cover;
  background-position: top center;
  z-index:11;
	height:100%;
	margin-top: -6px;
	padding: 0;
}




_::-webkit-full-page-media, _:future, :root #exampleTop {
	margin-top: -4px;
}

#example .previous {
	left:10px;
	right:auto;
	top: 50%;
	background-image:url(../images/top-sild-previous.png)!important;
	transform: translateY(-50%);
	opacity: .8;
  position: absolute;
  width: 32px;
  height: 32px;
  background: center center no-repeat;
  background-size: cover;

}
#example .next {
	left:auto;
	right:10px;
	top: 50%;
	background-image:url(../images/top-slid-next.png)!important;
	transform: translateY(-50%);
	opacity: .8;
    position: absolute;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    background: center center no-repeat;
    background-size: cover;

}



.top-banner{
	margin:150px 0 0 0;
	text-align: center;
}


/* ================================================================================================
  2017/4/2追加   reformtop
 =================================================================================================== */




.reformIcon{
	float:left;
	width:18%;
	margin:1px 23.5px 15px 0px;
}

.reformIcon{
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
}

.reformIcon:hover{
	opacity: .5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
    opacity: 0.5;
}

.reformIcon h3{
	font-size:80%;
	text-align:center;
	color:#555;
	width:90%;
	margin:0px auto;
}

.reformta{
	width:50%;
	margin:5px 0 15px 0;
}

.reformChart{
	border-collapse: collapse;
	text-align:center;
	margin: 20px 0px 10px 0px;
}

.reformChart th{
	background-color: #ddd;
	height:30px;
}

.iconBox{
	margin:0 0 10px 20px;
	display: inline-block;
	float:none;
	text-align:none;
	align:none;
}

.haikei {
  background-image:url("../images/reform-naiyou.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: center center;
	overflow: hidden;
}

.image-base {
	min-height: 600px; /* 高さの最小値を決めることで高さを確保させます。デバイスサイズに応じて数値を変更させると、背景画像もレスポンシブに変化します。　*/
/*	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover; */
	padding:50px;
}

.image-base p{
	font-size:170%;
	font-family: Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	color:#fff;
	opacity: 0.8;
	margin:50px 0;
}

.reformContent{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    background: #fff;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
}




/* ================================================================================================
  2017/6/17追加   問い合わせスタイル
 =================================================================================================== */

#inquiryContents{
	width:100%;
}

#inquiryContents .inquirytitle{
	width:100%;
	/*
	background-image:url(../images/header-bg.gif);
	*/
	padding:40px 0 0 0;
}

#inquiryContents h2{
	max-width:1200px;
	font-size:2.5em;
	font-weight:bold;
	color:#7a7c7d;
	text-align:center;
	margin:0 auto;

}

#inquiryContents h4{
	max-width:1200px;
	font-size:2.5em;
	font-weight:bold;
	color:#7a7c7d;
	text-align:center;
	margin:0 auto;

}
#inquiryContents .ftInformation{
	font-size:70%;
	max-width:1100px;
	color:#777;
	margin:0 auto;
	padding:0 10px;
}

#inquiryContents .ftsentence{
	max-width:600px;
	color:#777;
	margin:50px auto;
	padding:0 10px;
	font-size:105%;
}

#inquiryContents .ftsentence02{
	max-width:600px;
	color:#aaa;
	margin:50px auto;
	padding:0 10px;
}

#inquiryContents .inquirytitle img{
	margin:30px auto;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
}

#inquiryContents .inquirytitle img:hover{
	opacity: 1.5;
	filter: alpha(opacity=50);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

.ftfield01{
	color: #666;
	width:60%;
	border:1px solid #ddd;
	margin:0 0 10px 0;
	height:40px;
}

.ftfield02{
	color: #666;
	width:100%;
	border:1px solid #ddd;
}

.ftfield03{
	width:80%;
	border:1px solid #ddd;
	margin:0 0 10px 0;
	height:40px;
}

.ftfield04{
	width:30%;
	border:1px solid #ddd;
	margin:0 0 10px 0;
	height:40px;
}

.ftfield05{
	width:50%;
	border:1px solid #ddd;
	margin:0 0 10px 0;
	height:40px;
}

.ftfield06{
	margin:20px 0 0 0;
}

.ftfield06_02{
	color:#555;
}

.ftfield07{
	width:35%;
	border:1px solid #ddd;
}

.ftfield07_02{
	color:#555;
		margin:20px 0 0 0;
}

#ftform{
	max-width:600px;
	margin:0 auto;
	padding:0 10px;
}

#ftform small{
	color:#777;
}

#ftform .form1 {
	width:70%;
	font-size: 82%;
	margin: 0px 0px 0px 5px
}

#ftform .form1 th{
	width: 30%;
	background: #fafafa;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 10px;
}

#ftform .form1 td{
	width: 65%;
	background: #fff;
	border: 1px #ddd solid;
	padding: 5px 0px 5px 10px;
}


.ftcontact{
	color:#666;
	font-weight:bold;
	margin:40px 0 0 0;
}

.ftcontact span{
	font-size:20%;
	color:#ba5126;
}

.ftCenterText{
	text-align:center;
	margin:50px auto 0 auto;
}

.ftCenterText_so{
	text-align:center;
	margin:50px auto 10px auto;
}

/* ================================================================================================
  2019/10/27 お問い合わせフォーム追記
 =================================================================================================== */

.form_sub{
	font-size:1.1em;
	font-weight:bold;
	color:#e42187;
	margin-top: 30px;
}


/* ================================================================================================
  2017/8/1追加   建築用語
 =================================================================================================== */
#kenchikuyougo{
	width:98%;
	margin:10px 0 0 0;
}
#kenchikuyougo p{
	margin:1em 0 1.6em 0;
	line-height:1.9;
	color:#555;

}

#kenchikuyougo .mainRead .kenchikuImg{
	margin:50px auto;
	text-align:center;

}

#kenchikuyougo h3{
	border-bottom:solid 2px #FFADD9;
	font:bold 140%/150% "メイリオ";
}


#kenchikuyougo .mainRead .matomecontent ul{
	display: block;
	width:80%;
	border:none;
	margin-bottom:2em;
	font-size:15px;
	color:#555;
	margin-left:40px;
	clear: both;
}

#kenchikuyougo .mainRead .matomecontent ul li{
	display: block;
	position: relative;
	padding:5px;
	color:#555;
}

#kenchikuyougo .mainRead .matomecontent ul li:after {
	display: block;
	content: '';   /*コンテンツを挿入*/
	position: absolute;
	top: 12px;
	left: -1em;
	width: 5px;
	height: 5px;
	background-color: #FFADD9;
	transform: rotate(-45deg)!important;  /*45度回転させている*/

}

/* ================================================================================================
  2017/10/31追加   リフォーム価格カウンター
 =================================================================================================== */

.cf{
  margin-left:20px;
}
.label-checkbox input[type="checkbox"]{
  display: none;
}
/*
.boxGroup{
	display:block;
  margin-bottom:140px;
}
*/
h4.ctDesi{
font-weight: bold;
border-left:solid 8px #FFADD9;
padding-left:8px;
line-height:8px;
margin:20px 0 18px 0;
}



.ctboxSideTop{
 position: relative;
 margin:25px 0 90px 20px;
}

.ctboxSide{
 position: relative;
 margin:-20px 0 160px 20px;
}

.ctboxSide02{
 position: relative;
 margin:-45px 0 230px 20px;
}

.label-checkbox{
  cursor: pointer;
  position: relative;
  padding: 7px 15px;
  border: 1px solid #ddd;
  border-radius:20px;
  background: #f47795;
  color:#fff;
  vertical-align:middle;
  font-size:85%;
  margin: 0;
}

_::-webkit-full-page-media, _:future, :root .label-checkbox {
  padding: 8px 15px;
}


.ctBtn01{
  position : absolute;
  left:0;
}

.ctBtn02{
  position : absolute;
  left:31%;

}

.ctBtn03{
  position : absolute;
  left:63%;
}

.label-haba{
 margin-bottom:25px;
}

#ctPrice{
  border:solid 6px #e55777;
  width:70%;
  margin:50px auto 70px auto;
}

#ctPrice dl dt{
  font:bolder 33px 'arial black','arial','メイリオ',sans-serif;
  color:#fff;
  float:left;
  clear:left;
  padding:0 20px;
  vertical-align:middle;
  background:#e55777;
  line-height:80px;
}

.ctSougaku{
  font:bolder 48px 'arial black','arial','メイリオ',sans-serif;
  color:#e55777;
  text-align:center;
  background:#fff;
  line-height:80px;
}

.ctCbox{
  display: block;
  color: #777;
  font-weight: normal;
  display: inline-block;
  padding: 8px 15px;
  border: 1px solid #bbb;
  border-radius:20px;
  margin-right: 12px;
  vertical-align:middle;
  -webkit-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.ctCbox:before{
  content:'';
  position: absolute;
  left: 16px;
  top: 9px;
  border: 1px solid #bbb;
  background: #fff;
  width: 14px;
  height: 14px;
  border-radius:100%;
  -webkit-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 200ms cubic-bezier(1, 0, 0, 1);
  transition: all 200ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}


/*マウスのっけた時の色*/
.label-checkbox:hover{
   border-color: #f47795;
}


/*チェックを入れたら線の色を変更する*/

.label-checkbox input[type="checkbox"]:checked + .ctCbox{
   background: #fff;
   border-color:#fff;
}


/*チェックを入れたら線の色を変更する*/
.label-checkbox input[type="checkbox"]:checked + .koko{
   background: #f47795;
   border-color:#fff;
}


/*丸の動き・色*/
.label-checkbox input[type="checkbox"]:checked + .ctCbox:before{
   left: 31px;
   margin-left: -0px;
   border-color: #fff;
   background: #f47795;
}
/*
.reformPrice{
	 font-size: 90%;
}

.en{
	 font-size: 80%;
}
*/


html
.papala{
  height: 100%;
  margin: 0 auto;
  letter-spacing: 2px;
  font-size: 10px;
}

/*固定する背景*/
.parallax-bg{
  box-sizing: border-box;
  color: #FFF;
  font-size: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 5%;
}

.scrollbox{
  box-sizing: border-box;
  color: #FFF;
  font-size: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 5%;
}

.parallax-bg {
  background-image: url('../images/top-slid-kogashi-y.jpg');
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

/*スクロールするコンテンツ*/
.scrollbox {
  background-color: #111;
}


/* ================================================================================================
  2018/2/21追加   工事詳細
 =================================================================================================== */
#koujigenba{
	width:90%;
	margin:10px auto 0 auto;
}
#koujigenba p{
	margin:1em 0 1.6em 0;
	padding:0 15px;
	line-height:1.9;
	color:#555;
	font-size: 1.05rem;
}

#koujigenba .mainRead .koujiImg{
	margin:0 auto;
	text-align:center;
}

#koujigenba .mainRead .koujiImgba{
	margin:0 auto 15px auto;
	text-align:center;
}

#koujigenba .mainRead .koujiImgTop{
	margin:20px auto;
	text-align:center;
}

#koujigenba h3{
	color:#333;
	/*border-bottom:solid 3px #FFADD9;*/
	border-bottom:solid 1px #666;
	font:bold 140%/150% ;
	padding:10px 5px;
	margin-top:60px;
}


#koujigenba .mainRead .matomecontent ul{
	display: block;
	width:80%;
	border:none;
	margin-bottom:2em;
	font-size:16px;
	color:#555;
	margin-left:40px;
	clear: both;
}

#koujigenba .mainRead .matomecontent ul li{
	display: block;
	position: relative;
	padding:5px;
	color:#555;
}

#koujigenba .mainRead .matomecontent ul li:after {
	display: block;
	content: '';   /*コンテンツを挿入*/
	position: absolute;
	top: 12px;
	left: -1em;
	width: 5px;
	height: 5px;
	background-color: #f0b4b4;
	transform: rotate(-45deg)!important;  /*45度回転させている*/

}

#koujigenba .mainRead .matomecontent ul li a{
	color: #4462d5;
}

#koujigenba table{
	width:96%;margin:0 auto;
	font-size:84%
}

#koujigenba th{
  padding:0.4em;
	border:1px solid #ccc
}

#koujigenba td.photoTable{
	width:25%;padding:0.4em;
	border:1px solid #ccc;
	text-align:center;
}

#koujigenba td{
	width:75px;padding:0.4em;
	border:1px solid #ccc
}

.koujiFa{
	color: #db4f23;
}

#koujigenba h4{
	color:#333;
	font-size:130%;
	font-weight:bold;
	border-left:solid 6px #666;
	height:20px;
	line-height:23px;
	padding-left:7px;
	margin-top:50px;
	margin-bottom:35px;
	margin-left: 10px;
}

#koujigenba .mainRead h4{
	border-bottom: none;
}

#koujigenba .mainRead p.imgMabefore{
	margin:150px 0 0 0;
}

.koujigenbaTitle{
	margin:70px 40px 0 5px;
}

.koujigenbaTitle h2{
	color:#666;
	font-size:140%;
	position: relative;
	top: -28px;
	left: 20px;
	margin-bottom: -20px;
}

.koujigenbaTitle h2::after{
  position: absolute;
  content: "";
  background-color: #b3364f; /*下線の色*/
  width: 35%; /*線の幅*/
  height: 2px; /*線の太さ*/
  bottom: -5px; /*線のタテ位置*/
  left: 0%;  /*線のヨコ位置*/
  transform: translateX(-0%);　/*線のヨコ位置*/
}

.koujigenbaTitle h2::before{
  position: absolute;
  content: "";
  background-color: #aaa; /*下線の色*/
  width: 40%; /*線の幅*/
  height: 1px; /*線の太さ*/
  bottom: -5px; /*線のタテ位置*/
  left: 0%;  /*線のヨコ位置*/
  transform: translateX(-0%);　/*線のヨコ位置*/
}

.coronavirusTitle{
	margin:70px 40px 0 5px;
}

#pageContents .mainRead .coronavirusTitle h2{
	color:#333;
	font-size:160%;
	font-family:メイリオ;
	position: relative;
	top: -28px;
	left: 37px;
	margin-bottom: -20px;
}


/* ================================================================================================
  住宅機器特別価格ページ
 =================================================================================================== */

/*テーブル*/

.tokkachart{
	border-collapse: collapse;
	text-align:center;
	margin: 100px 0px 10px 0px;
}

.tokkachart th{
	background-color: #ddd;
	border: solid 1px #ddd;
	height:25px;
	width:40%;
}
.tokkachart td{
	border: solid 1px #ddd;
	height:25px;
	width:40%;
}

.tokkasection{
	width: 80%;
	margin: 30px 0px 70px 0px;
}

/*見出し*/

#koujigenba .tokkaMidashi{
	width: 70%;
	font-size:3em;
	font-weight: bold;
	color: #fff;
	background-color: #f93636;
	text-align: center;
	border:solid 10px #f23030;
	border-radius: 80px;
	margin: 0 auto;
}

#koujigenba .tokkaMidashi02{
	width: 90%;
	font-size:3em;
	color: #f93636;
	font-weight: bold;
	text-align: center;
	margin: 20px auto;
}

#koujigenba .tokkaMidashi03{
	width: 90%;
	font-size:2.5em;
	color: #777;
	font-weight: bold;
	text-align: center;
	margin: 20px auto;
}

#koujigenba .tokkaMidashi04{
	width: 90%;
	font-size:2.2em;
	color: #f93636;
	font-weight: bold;
	text-align: center;
	margin: 20px auto;
}

#koujigenba .tokkaMidashi05{
	width: 90%;
	font-size:6em;
	line-height: 100%;
	color: #f93636;
	font-weight: bold;
	text-align: center;
	margin: 20px auto;
}

#koujigenba .tokkaMidashiImg{
	text-align: center;
	margin: 20px auto;
}

/*項目アイコン*/

.iconwaku{
	width: 90%;
	padding:10px 0 50px 0;
	margin: 0 auto 80px auto;
	float: none;
}

#koujigenba ul.tokkaicon{
  text-align: center;
}

#koujigenba ul.tokkaicon li{
	font-size:1.7em;
	color:#777;
	border:solid 1px #ddd;
	float:left;
	margin:3px 10px auto 0px;
	padding:20px 10px;
	line-height:9px;

}

#koujigenba ul.tokkaicon li.iconCol{
	background-color: #F0D7D7;
}

#koujigenba ul.tokkaicon li.iconCol02{
	background-color: #ddd;
}



/*基本工事に含まれる内容*/

.kihonkouji{
	background-color: #f93636;
	padding:0 ;
	border-radius: 7px;
}

.kihonMidashi{
	background-color: #e20d0d;
	padding:0 ;
	border-radius: 7px 7px 0 0;
}

.kihoniconwaku{
	width: 90%;
	padding:2px 0 20px 10px;
	margin: 0 auto;
}

#koujigenba .kihonkouji p{
	font-size:1.4em;
	font-weight: bold;
	color: #fff;
	margin:20px 0;
}

#koujigenba ul.kihonicon{
	height: 100%;
	overflow: auto;
}

#koujigenba ul.kihonicon li{
	font-size:0.9em;
	font-weight: bold;
	color:#777;
	border:solid 1px #fff;
	float:left;
	margin:0 10px 10px 0px;
	padding:2px 10px;
	background-color: #fff;
	border-radius: 40px;
}

/*追加費用となる工事*/

.tuikahiyou{
	background-color: #3660f9;
	padding:0 ;
	border-radius: 7px;
}

#koujigenba .tuikahiyou p{
	font-size:1.4em;
	font-weight: bold;
	color: #fff;
	margin:20px 0;
}

.tuikaMidashi{
	background-color: #2e53db;
	padding:0 ;
	border-radius: 7px 7px 0 0;
}

/*下の価格・商品名*/

#koujigenba .tokkaMidashiUnder{
	width: 90%;
	font-size:2em;
	color: #777;
	font-weight: bold;
	text-align: center;
	margin: 10px auto;
}

#koujigenba .tokkaMidashiUnder02{
	width: 90%;
	font-size:2em;
	color: #f93636;
	font-weight: bold;
	text-align: center;
	margin: 10px auto;
}

#koujigenba .tokkaMidashiUnder03{
	width: 90%;
	font-size:3.5em;
	line-height: 0;
	color: #f93636;
	font-weight: bold;
	text-align: center;
	margin: 30px auto 0 auto;
}

#koujigenba .tokkaMidashiUnder04{
	width: 90%;
	color: #777;
	text-align: center;
	margin: 15px auto;
}

/*問い合わせバナー*/

#koujigenba .tokkaToiawase{
	width:80%;
	font-size: 2.5em;
	font-weight: bold;;
	text-align: center;
	margin: 70px auto;

}

#koujigenba .tokkaToiawase a{
	display: block;
  color: #fff;
	text-decoration: none;
	margin: 0 auto;
	background-color: #f93636;
	padding:10px;
	border-top: 4px solid #f93636;
	border-bottom: : 4px solid #f93636;
	border-radius: 4px;
	color: #fff;
	text-decoration: none;
	border-bottom: solid 4px #627295;
}

#koujigenba .tokkaToiawase a:hover {/*ボタンを押したとき*/
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);/*下に動く*/
	border-bottom: solid 4px #fff;
  border-top: 4px solid #f93636;
  border-bottom: : 4px solid #f93636;
  transition: 0.2s;
	border-radius: 4px;
	opacity: 0.8;
}


/*自社工事*/

.zisyasekou{
	background-color: #fcc953;
	padding:0 ;
	border-radius: 7px;
}


#koujigenba p.zisyaSentence{
	width:90%;
	font-size:1.1em;
	color: #555;
	font-weight: bold;
	margin:20px auto 0 auto;
	line-height: normal;
}

#koujigenba p.zisyaTitle{
	font-size:1.4em;
	font-weight: bold;
	color: #fff;
	margin:20px 0;
}


.zisyaMidashi{
	background-color: #f4b700;
	padding: 0;
	border-radius: 7px 7px 0 0;
}

#koujigenba .zisyaIma{
	text-align: center;
}


/* ================================================================================================
  その他事例の下部分、前後事例のリンク
 =================================================================================================== */


 #pageContents ul.sonotaZirei,
 #detailContents ul.sonotaZirei
 {
 	display:table;
 	table-layout: fixed;
 	border:none;
	margin-top: 4em;
 	margin-bottom:5em;
    width:100%;
 }

 #detailContents ul.sonotaZirei li{
 display: table-cell;
}

.sonotaZireiLe{
	text-align: left;
	width: 50%;
}

.sonotaZireiRi{
	text-align: right;
	width: 50%;
}


/* ================================================================================================
  消毒のページ
 =================================================================================================== */

 .shiroari_chosa{
 	border: solid 3px #aaa;
	width:80%;
 	padding:15px 0;
	margin:0 auto;
 	border-radius: 7px;
 }

 .shiroari_waku{
 	padding:2px 0 20px 5px;
 	margin: 0 auto;
 }

 #koujigenba .chosa_dai{
	 font-size: 2.4em;
	 color: #f27c71;
   font-weight: bold;
	 margin: 10px 0 40px 10px;
 }

 #koujigenba .chosa_dai02{
	 font-size: 1.6em;
	 color: #777;
   font-weight: bold;
	 margin: 50px 0 0 20px;
	 line-height: 1;
 }

 #koujigenba .chosa_sen{
	font-size: 1em;
	color: #777;
	margin: 5px 40px;
	line-height: 1.2;
 }

 #koujigenba .chosa_photo{
	 float: left;
	 margin: 0;
 }

 /* ================================================================================================
   求人のページ
  =================================================================================================== */

 #koujigenba .mainRead .kyuyo{
 	margin:0 auto 20px auto;
 	text-align:center;
	float: left;
 }

 #koujigenba .mainRead .kyuyo02{
	 margin:0 auto;
	 text-align:center;

 }

 .kyujinchart{
 	border-collapse: collapse;
 	text-align:center;
 	margin: 100px 0px 10px 0px;
 }

 .kyujinchart th{
 	background-color: #ddd;
 	border: solid 1px #ddd;
 	height:25px;
 	width:30%;
 }
 .kyujinchart td{
 	border: solid 1px #ddd;
 	height:25px;
 	width:70%;
 	text-align:left;
 }

 .kyujinPosition{
 	width: 96%;
 	margin: 30px 0px 70px 0px;
 }

 #koujigenba .oubo{
 	width: 90%;
 	font-size:4em;
 	color: #555;
 	font-weight: bold;
 	text-align: center;
 	margin: 20px auto;
 }


 /* ================================================================================================
   TOP施工事例部分
  =================================================================================================== */

.sekouhaikei{
		background-color: #e5dce2;
		margin: 100px 0 0 0;
		padding: 20px 0 100px 0;
	}

.toppagetitle{
		margin:50px auto 50px auto;
	  	transition: all 0.5s linear;
	}

.toppagetitle h2{
		font-family:Constantia;
		font-style:italic;
		font-weight: inherit;
		color:#888;
		font-size:1.6rem;
		text-align: center;
		line-height: 33px;
	}


.toppagetitle h2 .toptitleBord{
		transition: all 0.5s linear;
		position: relative;
		margin: 0 auto;
		top:-5px;

	}

.toppagetitle h2 .topBord{
		font-size: 1rem;
		transition: all 0.6s ease;
		position: relative;
		left:50px;
	}


.toppagesekoutitle{
		width:150px;
		text-align: center;
		position: relative;
	  padding: 0.5em 1em;
	  border: none;
	  background-color: transparent;
	  cursor: pointer;
	  outline: none;
	  font-size: 17px;
	  margin:80px auto 40px auto;
	}

	.toppagesekoutitle_wide{
			width:200px;
			text-align: center;
			position: relative;
		  padding: 0.5em 1em;
		  border: none;
		  background-color: transparent;
		  cursor: pointer;
		  outline: none;
		  font-size: 17px;
		  margin:80px auto 40px auto;
		}

.toppagesubtitle{
	color: #666;
	text-align: center;
	margin:80px auto 40px auto;
	border: 1px solid #777;
	width:150px;
}





.button {
  position: relative;
  padding: 0.5em 1em;
  border: none;
  background-color: transparent;
  cursor: pointer;
  outline: none;
  font-size: 18px;
  margin: 1em 0.8em;
}

.type1 {
  color: #666;
		  transition: all 0.6s ease;
}
.type1.type1::after, .type1.type1::before {
  content: "";
  display: block;
  position: absolute;
  width: 20%;
  height: 20%;
  border: 1px solid;
  transition: all 0.6s ease;
  border-radius: 2px;
}
.type1.type1::after {
  bottom: 0;
  right: 0;
  border-top-color: transparent;
  border-left-color: transparent;
  border-bottom-color: #666;
  border-right-color: #666;
}
.type1.type1::before {
  top: 0;
  left: 0;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: #666;
  border-left-color: #666;
}
.type1.type1:after, .type1.type1:before {
  width: 101%;
  height: 102%;
}
.type2 {
  color: #666;
	transition: all 0.6s ease;
}
.type2.type2:after, .type2.type2:before {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #666;
  transition: all 0.3s ease;
  transform: scale(0.85);
}
.type2.type2:before {
  top: 0;
  transform: scale(1);
}
.type2.type2:after {
  transform: scale(1);
}

.type3 {
  color: #666;
	transition: all 0.6s ease;
}
.type3.type3:after, .type3.type3:before {
  content: "";
  display: block;
  position: absolute;
  width: 20%;
  height: 20%;
  border: 1px solid;
  transition: all 0.6s ease;
  border-radius: 2px;
}

.type3.type3:after {
  bottom: 0;
  right: 0;
  border-top-color: transparent;
  border-left-color: transparent;
  border-bottom-color: #666;
  border-right-color: #666;
}
.type3.type3:before {
  top: 0;
  left: 0;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: #666;
  border-left-color: #666;
}

.type3.type3:after, .type3.type3:before {
  border-bottom-color: #666;
  border-right-color: #666;
  border-top-color: #666;
  border-left-color: #666;
  width: 101%;
  height: 104%;
}



/*
.type3.type3:hover:after, .type3.type3:hover:before {
  border-bottom-color: #666;
  border-right-color: #666;
  border-top-color: #666;
  border-left-color: #666;
  width: 101%;
  height: 104%;
}
*/

.scroll_fadein,
.topPoliWrap,
#newsBox{
	transition: 0.8s;

}


/*
.type1 {
  color: #566473;
}
.type1.type1::after, .type1.type1::before {
  content: "";
  display: block;
  position: absolute;
  width: 20%;
  height: 20%;
  border: 1px solid;
  transition: all 0.6s ease;
  border-radius: 2px;
}
.type1.type1::after {
  bottom: 0;
  right: 0;
  border-top-color: transparent;
  border-left-color: transparent;
  border-bottom-color: #566473;
  border-right-color: #566473;
}
.type1.type1::before {
  top: 0;
  left: 0;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: #566473;
  border-left-color: #566473;
}
.type1.type1:hover:after, .type1.type1:hover:before {
  width: 101%;
  height: 102%;
}
.type2 {
  color: #16a085;
}
.type2.type2:after, .type2.type2:before {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #16a085;
  transition: all 0.3s ease;
  transform: scale(0.85);
}
.type2.type2:hover:before {
  top: 0;
  transform: scale(1);
}
.type2.type2:hover:after {
  transform: scale(1);
}
.type3 {
  color: #666;
	  transition: all 0.6s ease;
}
.type3.type3::after, .type3.type3::before {
  content: "";
  display: block;
  position: absolute;
  width: 20%;
  height: 20%;
  border: 1px solid;
  transition: all 0.6s ease;
  border-radius: 2px;
}

.type3.type3::after {
  bottom: 0;
  right: 0;
  border-top-color: transparent;
  border-left-color: transparent;
  border-bottom-color: #666;
  border-right-color: #666;
}
.type3.type3::before {
  top: 0;
  left: 0;
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-top-color: #666;
  border-left-color: #666;
}

.type3.type3:hover:after, .type3.type3:hover:before {
  border-bottom-color: #666;
  border-right-color: #666;
  border-top-color: #666;
  border-left-color: #666;
  width: 101%;
  height: 104%;
}
*/

.jireiTitle a{
	color: #333;
	font-size: 1.2em;
	text-align: center;
	margin: 10px auto;
	display: block;
}


/*フェードイン設定*/



/*スライダー内部の文字の位置・形状の設定*/

.swiper-container ul.jireiicon li{
	font-size:80%;
	color:#333;
	background-color: #ececec;
	/*border:solid 1px #ddd;*/
	float:left;
	margin:3px 4px 3px 0px;
	padding:4px 8px;
	width:inherit;
	line-height:12px;
	border-radius:40px;
}

.swiper-container ul.jireiicon li.house{
  color:#FFFFFF;
	background-color:#426669;/*御召茶*/
	border: none;
}

.swiper-container ul.jireiicon li.build{
  color:#FFFFFF;
	background-color:#fcbb59;
	border: none;
}

.swiper-container ul.jireiicon li.realestate{
  color:#FFFFFF;
	background-color:#B2854F;
}

.swiper-container{
	transition: 0.8s;
}

/*スライダー内部の写真のマウスオーバーアニメーション*/
.sekouImg{
	overflow: hidden;
	background: #000;
	position:	relative;
}

.sekouImg img{
	display: block;
	transition-duration: 0.3s;
}
/*
.sekouImg .mask_02{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity:0.2;
	transition:0.3s;
	background: #222;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}
*/
.sekouImg .mask{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity:0;
	transition:0.3s;
	background: #222;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

.sekouImg img:hover{
	transform: scale(1.1);
	transition-duration: 0.3s;
	opacity: 0.5;
}

.sekouImg:hover .mask{
	transition-duration: 0.3s;
	opacity: 0.8;
}
/*
.sekouImg:hover .mask_02{
	transition-duration: 0.3s;
	opacity: 0.8;
}*/

.sekouImg:hover img{
	transform: scale(1.1);
	transition-duration: 0.3s;
}


.caption{
	font-size: 1em;
	text-align: center;
	margin: auto;
	color:#fff;
	line-height: 30px;
}

.sekouImg:hover .caption{
	opacity: 1;
	color:#fff;
}


/*Policy 協和ハウスの建築　の部分の設定*/

.poli{
	width:70%;
	margin: 50px auto 200px auto;
	display: block;
}

.topPoliRead{
	-zoom:1;
	font-size:0.95em;
	font-family:メイリオ;
	color: #777;
	line-height: 1.7;
	display: block;
}

.topPoliRead_02{
	-zoom:1;
	font-size:0.95em;
    font-family: 游明朝;
    padding: 0 10px 20px 0;
	color: #777;
	line-height: 1.6;
	display: block;
}

.topPoliWrap{
	width:97%;
	margin:0 10px;
}

.top-policy-back{
	background-image: url(../images/top-policy-back.jpg);
	background-repeat: no-repeat;
	background-position: bottom center;
	width: 100%;
	padding: 100px 0;
}

h2.top_f{
	color:#fff;
	text-align: center;
	margin: 0 auto;

}

.toppagetitle h2.top_f .toptitleBord{
	border-bottom: 1px solid #fff;
}

.top-news-back{
	background-image: url(../images/top-news-back.jpg);
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	padding: 100px 0;
}

.top-content-back{
	background-color: #e5dce2;
	background-position: center;
	width: 100%;
	height: 100%;
	padding-top: 30px;

}

.top_banner_all{
	max-width: 100%;
	margin: 0 auto;
	display: block;
	text-align: center;
}

.top_banner_all p.top_banner{
	width:40%;
	margin: 70px 10px 0 10px;
	display:inline-block;
	vertical-align: middle;
}

.news_blog_box{
	max-width: 100%;
	margin: 0 auto;
}


/* ================================================================================================
	TOP施工事例部分
 =================================================================================================== */

.ecocarat_chart{
		width: 100%;
		border-collapse: collapse;
		text-align:center;
		margin: 20px 0px 10px 0px;
	}

	.ecocarat_chart th{
		background-color: #ddd;
		height:50px;
		width:30%;
	}


	/* ================================================================================================
		協和ハウスロゴpathの部分
	 =================================================================================================== */

	path.topLogo{
	    fill: none;
	    stroke: #666; /*線の色を指定*/
	    stroke-dasharray: 700;/*線の間隔を指定*/
	    stroke-dashoffset: 0;/*線の位置を指定*/
	    stroke-width: 0.3;/*線の太さを指定*/
	    -webkit-animation: khlogo 4s ease-in forwards;
	    animation: khlogo 4s ease-in forwards;
	}

	@keyframes khlogo {
	 0% {
	 stroke-dashoffset: 700;
	 fill:transparent; /*透過*/
	}
	 50% {
	 fill:transparent; /*透過*/
	}
	 100% {
	 stroke-dashoffset: 0;
	 fill:#666;
	}
	}

	path.sv_moji{
			fill: none;
			stroke: #EF1989;
			stroke-dasharray: 100;
			stroke-dashoffset: 0;
			stroke-width: 0.3;
			-webkit-animation: khmoji 4s ease-in forwards;
			animation: khmoji 4s ease-in forwards;
	}

	@keyframes khmoji {
	 0% {
	 stroke-dashoffset: 100;
	 fill:transparent;
	}
	 50% {
	 fill:transparent;
	}
	 100% {
	 stroke-dashoffset: 0;
	 fill:#EF1989;
	}
	}

	#circleTop {
	    fill: none;
	    stroke: #EF1989;
	    stroke-dasharray: 100;
	    stroke-dashoffset: 0;
	    stroke-width: 0.3;
	    -webkit-animation: khlogomaru 4s ease-in forwards;
	    animation: khlogomaru 4s ease-in forwards;
	}

	@keyframes khlogomaru {
	 0% {
	 stroke-dashoffset: 100;
	 fill:transparent;
	}
	 50% {
	 fill:transparent;
	}
	 100% {
	 stroke-dashoffset: 0;
	 fill:#EF1989;
	}
	}


#sv_logo{
	position: absolute;
	top: 25px;
	left: 30px;
	z-index: 12;
}

/* ================================================================================================
  工事コンテンツページ部分（写真画面フルサイズ）
 =================================================================================================== */
#detailTop{
	width:100%;
	height: 85vh;
	background-image: url(../images/tarflon-wood-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

.detailText {
	height: 100%;
	background: rgba(70,70,70,0.5);
}



.detailText p{
	font-size:calc(2em + 2vw);
	font-weight: bold;
	position: absolute;
	left:50%;
	transform: translate(-50%);
	top:50%;
	color:#ddd;
	text-align: center;
}

#detailContents{
	max-width:1000px;
	margin:0 auto 4em auto;
}

#sekouTopImage{
	width: 100%;
}

#sekouTopImage img{
	width: 100vw;
	height: 80vh;
	object-fit: cover;
}

#detailMain{
	width:100%;
}

#detailTopYane{
	width:100%;
	height: 85vh;
	background-image: url(../images/yane-syousai-top03.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYane .detailText {
	height: 100%;
	background: rgba(70,70,70,0.5);
}



#detailTopYane .detailText p{
	font-size:calc(2em + 2vw);
	font-weight: bold;
	position: absolute;
	left:50%;
	transform: translate(-50%);
	top:50%;
	color:#ddd;
	text-align: center;
}

#detailTopBetakiso{
	width:100%;
	height: 85vh;
	background-image: url(../images/betakiso-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopBetakiso .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopEcocute{
	width:100%;
	height: 85vh;
	background-image: url(../images/ecocute-torikae-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopEcocute .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopNiwaConcrete{
	width:100%;
	height: 85vh;
	background-image: url(../images/niwa-concrete-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopNiwaConcrete .detailText p{
	font-size:calc(1.5em + 1.5vw);
}

#detailTopTacdine{
	width:100%;
	height: 85vh;
	background-image: url(../images/tacdine-kisohokyo-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopTacdine .detailText p, #detailTopTaflon .detailText p{
	font-size:calc(1.6em + 1.6vw);

}

#detailTopTaflon{
	width:100%;
	height: 85vh;
	background-image: url(../images/tarflon-wood-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}


#detailTopIh{
	width:100%;
	height: 85vh;
	background-image: url(../images/ih-koukan-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopIh .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopMat{
	width:100%;
	height: 85vh;
	background-image: url(../images/choshitsu-mat-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopMat .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopHaikan{
	width:100%;
	height: 85vh;
	background-image: url(../images/ecocute-sansoukan-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopHaikan .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopPump{
	width:100%;
	height: 85vh;
	background-image: url(../images/ecocute-sansoukan-syousai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopPump .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopCorona{
	width:100%;
	height: 85vh;
	background-image: url(../images/coronavirus-disinfection-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopCorona .detailText p{
	font-size:calc(1.6em + 1.6vw);
}


#detailTopShiroari{
	width:100%;
	height: 85vh;
	background-image: url(../images/shiroari-chosa-syoudoku-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopShiroari .detailText p{
	font-size:calc(1.6em + 1.6vw);
}

#detailTopTv{
	width:100%;
	height: 85vh;
	background-image: url(../images/4k-campaign-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopTv .detailText p{
	font-size:calc(1.4em + 1.4vw);
}

#detailTopSmartpv{
	width:100%;
	height: 85vh;
	background-image: url(../images/smartpv-multi-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopSmartpv .detailText p{
	font-size:calc(1.4em + 1.4vw);
}

#detailTopRosyutsuhaikan{
	width:100%;
	height: 85vh;
	background-image: url(../images/suidoukan-koukan-rosyutsuhaikan-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopRosyutsuhaikan .detailText p{
	font-size:calc(1.4em + 1.4vw);
}

#detailTopOnlineMeeting{
	width:100%;
	height: 85vh;
	background-image: url(../images/online-meeting-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopOnlineMeeting .detailText p{
	font-size:calc(1.4em + 1.4vw);
}


#detailTopKawaragalvalume{
	width:100%;
	height: 85vh;
	background-image: url(../images/yane-galvalume-fukikae-kawara-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopKawaragalvalume .detailText p{
	font-size:calc(1.6em + 1.6vw);

}

#detailTopEcocuteKosyouSyoujo{
	width:100%;
	height: 85vh;
	background-image: url(../images/ecocute-kosyou-syoujo-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopEcocuteKosyouSyoujo .detailText p{
	font-size:calc(1.6em + 1.6vw);

}


#detailTopTaiyoukoHiyouBaidenkakaku{
	width:100%;
	height: 85vh;
	background-image: url(../images/taiyouko-hiyou-baidenkakaku-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopTaiyoukoHiyouBaidenkakaku .detailText p{
	font-size:calc(1.3em + 1.3vw);

}


#detailTopYaneShikkui{
	width:100%;
	height: 85vh;
	background-image: url(../images/yanekawara-mune-shikkui-hosyu-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYaneShikkui .detailText p{
	font-size:calc(1.5em + 1.5vw);
}



#detailTopYukashitaShikkeKabi{
	width:100%;
	height: 85vh;
	background-image: url(../images/yukashita-shikke-kabi-taisaku-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYukashitaShikkeKabi .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopYuhariDenai{
	width:100%;
	height: 85vh;
	background-image: url(../images/furo-yuhari-denai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYuhariDenai .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopKateiyoChikudenchi{
	width:100%;
	height: 85vh;
	background-image: url(../images/kateiyo-chikudenchi-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopKateiyoChikudenchi .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopYokushitsuTilefuro{
	width:100%;
	height: 85vh;
	background-image: url(../images/yokushitsu-tilefuro-unitbath-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYokushitsuTilefuro .detailText p{
	font-size:calc(1.2em + 1.2vw);
}


#detailTopToilet{
	width:100%;
	height: 85vh;
	background-image: url(../images/toilet-koukan-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopToilet .detailText p{
	font-size:calc(1.2em + 1.2vw);
}

#detailTopToiletYukaKabe{
	width:100%;
	height: 85vh;
	background-image: url(../images/toilet-yukahaisui-kabehaisui-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopToiletYukaKabe .detailText p{
	font-size:calc(1.2em + 1.2vw);
}


#detailTopSs3Denki{
	width:100%;
	height: 85vh;
	background-image: url(../images/smartstar3-denki-sakugen-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopSs3Denki .detailText p{
	font-size:calc(1.2em + 1.2vw);
}



#detailTopSmartatar{
	width:100%;
	height: 85vh;
	background-image: url(../images/samartatar-pv-set-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopSmartatar .detailText p{
	font-size:calc(1.5em + 1.5vw);
}

#detailTopSmartatarHit{
	width:100%;
	height: 85vh;
	background-image: url(../images/smartstar-hit-set-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopSmartatarHit .detailText p{
	font-size:calc(1.5em + 1.5vw);
}

#detailTopGaihekiGenkan{
	width:100%;
	height: 85vh;
	background-image: url(../images/tosou-genkandoor-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopGaihekiGenkan .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopEcohojo{
	width:100%;
	height: 85vh;
	background-image: url(../images/hojokin-ecocute-2024-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopEcohojo .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopSyouene2024{
	width:100%;
	height: 85vh;
	background-image: url(../images/zyutaku-syouene-2024-top02.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopSyouene2024 .detailText p{
	font-size:calc(1.5em + 1.5vw);
}


#detailTopYouhekiMizumore{
	width:100%;
	height: 85vh;
	background-image: url(../images/youheki-mizumore-masu-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYouhekiBlockhei{
	width:100%;
	height: 85vh;
	background-image: url(../images/youheki-blockhei-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopDodomeYoheki{
	width:100%;
	height: 85vh;
	background-image: url(../images/dodome-youheki-hosyu-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopGAlvalumeCover{
	width:100%;
	height: 85vh;
	background-image: url(../images/yane-galvalume-cover-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#detailTopYouhekiMizumore .detailText p,
#detailTopYouhekiBlockhei .detailText p,
#detailTopGAlvalumeCover .detailText p,
#detailTopDodomeYoheki .detailText p
{
	font-size:calc(1.5em + 1.5vw);
}

/* ================================================================================================
topスライダ-
 =================================================================================================== */

.topPath{
	margin: 50px auto 70px auto;
	/*clip-path:polygon(0 100%,100% 96%,100% 0,0 0);*/
	clip-path:polygon(0 4%,100% 0,100% 100%,0 100%);
	-webkit-clip-path: polygon(0 4%,100% 0,100% 100%,0 100%);
	-ms-clip-path: polygon(0 4%,100% 0,100% 100%,0 100%);
	/*clip-path:polygon(0 16%,50% 0,100% 16%,100% 100%,0 100%);*/
	/*clip-path:polygon(0 20px,100% 0,100% 100%,0 100%);*/
}

.topSlideText{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
}

.topSlideText a{
 text-decoration: none;
}

.topSlideText p{
	width: 700px;
	font-size: 1.5em;
	color:#fff;
  text-align: center;
	opacity: 0;
	animation: topslide 1s ease 0.2s forwards ;
}

.topSlideText h3{
	font-size: 3em;
	font-weight: bold;
	color:#fff;
  text-align: center;
	animation: topslide 1s ease ;
}


.topSlideTextLong{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
}

.topSlideTextLong a{
 text-decoration: none;
}

.topSlideTextLong p{
	width: 700px;
	font-size: 1.5em;
	color:#fff;
  text-align: center;
	opacity: 0;
	animation: topslide 1s ease 0.2s forwards ;
}

.topSlideTextLong h3{
	font-size: 2.5em;
	font-weight: bold;
	color:#fff;
  text-align: center;
	animation: topslide 1s ease ;
}





.hedCol{
	background-color: #fff;
}


.details{
	display: block;
  width:200px;
  height:50px;
	line-height: 50px;
  text-align: center;
	margin: auto;
	color: #555;
  background-color: #fff;
  border: 1px solid #eee;
  border-radius: 25px;
	margin: 35px auto;
	transition: all 0.5s;
	opacity: 0;
	animation: topslide 1s ease 0.6s forwards ;
}



.details:hover{
  background-color: #EF1989;
  border: 1px solid #EF1989;
	color: #fff;
}
.details:hover a span{
	color: #fff;
}

@keyframes topslide{
	0% { opacity: 0; -webkit-transform: translateY(50px); }
  100% { opacity: 1; -webkit-transform: translateY(0); }
}


.realestateTopPath{
	margin: 0 auto;
	/*clip-path:polygon(0 100%,100% 96%,100% 0,0 0);*/
	clip-path:polygon(0 0,100% 0,100% 90%,0 100%);
	-webkit-clip-path: polygon(0 0,100% 0,100% 90%,0 100%);
	-ms-clip-path: polygon(0 0,100% 0,100% 90%,0 100%);
	/*clip-path:polygon(0 16%,50% 0,100% 16%,100% 100%,0 100%);*/
	/*clip-path:polygon(0 20px,100% 0,100% 100%,0 100%);*/
}


/* ================================================================================================
リフォーム詳細ページ　施工事例　枠
 =================================================================================================== */

 .jireiWaku h2 {
 	color: #666;
    font-size: 140%;
	 margin: 40px 20px 20px 20px;
	 padding: 0.1em 0.3em;
   background: transparent;
   border-left: solid 10px #888;
   line-height: 8px;
 }


 /* ================================================================================================
 20200621　トップページ　新デザイン
  =================================================================================================== */


.sekouhaikei{
		background-color: #e5dce2;
		clip-path:polygon(0 1%,100% 0,100% 99%,0 100%);
		-webkit-clip-path: polygon(0 1%,100% 0,100% 99%,0 100%);
		-ms-clip-path: polygon(0 1%,100% 0,100% 99%,0 100%);
}

.top-content-back{
		background-color: #e5dce2;
		clip-path:polygon(0 1%,100% 0,100% 100%,0 100%);
		-webkit-clip-path: polygon(0 1%,100% 0,100% 100%,0 100%);
		-ms-clip-path: polygon(0 0,100% 0,100% 90%,0 100%);
}


/* ================================================================================================
20200712 4Kテレビプレゼントページ
 =================================================================================================== */

.tv-taisyo{
		font-size: 2em;
		color: #555;
		margin-left: 60px;
}

.tv-taisyo-hyodai{
	width: 80%;
	margin: 20px auto 50px auto;
	text-align:center;
}

.tv-taisyo-hyo{
	border-collapse: collapse;
	text-align:center;
}

.tv-taisyo-hyo .tv-color{
	background-color: #ddd;
	height:30px;
	font-weight: bold;
}

/* ================================================================================================
20201206　その他施工事例写真遅延表示
 =================================================================================================== */


.jireiInfo .jireiphoto a img {
  opacity: 0;
  -webkit-transition: opacity 3s;
  transition: opacity 3s;
}
.jireiInfo .jireiphoto a img.lazyloaded {
  opacity: 1;
}


.canvas-container {
    position: relative;
    width:  calc(100% - 40px);
    height: 450px;
    overflow: hidden;
    margin:20px;
}

.canvas-container-doughnut {
    position: relative;
    width:  calc(100% - 40px);
    height: 500px;
    overflow: hidden;
    margin:20px;
}



/* ================================================================================================
20210707　テスラ蓄電池
 =================================================================================================== */


 #RightBox {
 	display: flex;
 	align-items: center;
 	float: right;
	flex-direction: column;
 }



#RightBox .RightBoxLogoJhs img{
	position: absolute;
	width: 120px;
	right: 10px;
	margin-top: 5px;
}

#RightBox .RightBoxLogo img{
	position: relative;
	width: 160px;
	right: 10px;
	top:55px;
}


#LeftBox {
 display: flex;
 align-items: left;
 float: left;
 flex-direction: column;
}

#LeftBox .LeftBoxLogoJhs img{

 width: 150px;
 margin: 5px 0;
}

#LeftBox .LeftBoxLogo img{

 width: 180px;
}



 #productContents{
	 width:100%;
 }

#productContents p {
    margin: 1em 0 1.6em 0;
    padding: 0 15px;
    line-height: 1.9;
		font-size: 0.9rem;
}

.productSection{
	margin: auto;
	width:80%;
}

.productSectionWhite{
	width:80%;
	background-color: #fff;
	margin: 50px auto;
}

.productSectionWhite_100{
	width:100%;
	background-color: #fff;
	margin:0 auto;
}

.productSectionWhite_top{
	display: block;
  	margin: 50px auto 0 auto;
  	padding: 0 10px;
  	max-width: 800px;
  	aspect-ratio: 16 / 9;
   /* position: relative;
    padding-bottom: 30%; 
    padding-top: 0px;
    height: 0;
    overflow: hidden;*/
}


 .productSectionWhite_top iframe{
  width: 100%;
  height: 100%;
  border-radius: 20px;
  /*width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0*/
}

.productSectionWhite_top_ins{
	display: block;
  	margin: 50px auto 0 auto;
  	padding: 0 10px;
  	max-width: 800px;
   /* position: relative;
    padding-bottom: 30%; 
    padding-top: 0px;
    height: 0;
    overflow: hidden;*/
}


 .productSectionWhite_top_ins_02{
  max-width: 400px;
  border-radius: 20px;
  margin: 20px auto 0 auto;
  /*width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0*/
}


.productSectionSmartstar{
	position: relative;
    padding-bottom: 30%; 
    padding-top: 0px;
    height: 0;
    overflow: hidden;
}


 .productSectionSmartstar iframe{
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0
}



.productSectiongray_01{
	width:90%;
	margin: 50px auto;
	display: flex;
	flex-direction:column;
	align-items: center;
	justify-content: center;
}

.productSmartStar_01{
	width:80%;
	margin: 50px auto;
	display: flex;
	flex-direction:column;
	align-items: left;
	justify-content: left;
}

.productSectionOnline{
	width:90%;
	margin: 50px auto;
}

.productSectionGray{
	margin: auto;
	width:80%;
	padding: 50px 20px;
}

.productSectionBlack{
	margin: auto;
	width:100%;
	height: 100%;
	background-color: #111;
	padding: 50px 20px 0px 20px;
}

.productSectionBlack_02{
	margin: auto;
	width:100%;
	height: 100%;
	background-color: #111;
	padding: 50px 0 20px 0;
}

#productContents .productSectionBlack,.productSectionBlack_02 p,h3{
 color: #fff;
}

#productContents .productSectionWhite p,h3,h4{
 color: #444;
}

.productSectionBg{
	margin: auto;
	width:100%;
	background-color: #f9f9f9;
	padding: 30px 0;
}

.productSectionPhoto{
	margin: auto;
	width:100%;
	background-image: url(../images/tesla-powerwall-nihonkaoku.jpg);
	background-size: cover;
	background-position: right;
	background-repeat: no-repeat;
	height: 100vh;
	max-height: 100vh;
	min-height: 100vh;
}


.productSectionPhotoSmart{
	margin: auto;
	width:100%;
	background-image: url(../images/smartstar-kaoku.jpg);
	background-size: cover;
	background-position: right;
	background-repeat: no-repeat;
	height: 100vh;
	max-height: 100vh;
	min-height: 100vh;
}

.productSectionPhotoVpp{
	margin: auto;
	width:100%;
	background-image: url(../images/vpp-01.png);
	background-size: 75%;
	background-position: right;
	background-repeat: no-repeat;
	heigth: 100vh;
	max-height: 100vh;
	min-height: 100vh;
}



.productSectionPhotoLeft{
	background-color: #fff;
	height: 100vh;
	width: 25%;
	padding: 50px 0;
	/*margin: 0 0 0 auto;*/
}

.productHead_25{
	font-size: 1.7rem;
	padding: 10px;
	text-align: center;
	font-weight: bold;
}

.InquiryFlowBoxAll{
	display: flex;
	flex-wrap: wrap;
	height: 100%;
}

#productContents h3.productHeading{
	display: flex;
	height: 150px;
}
/*
.productSectionSent{
	display: flex;
	height: 200px;
  align-items: center;
}
*/

.productHead_1{
	font-size: 2rem;
	font-weight: bold;
	justify-content: center;
  align-items: center;
	padding: 30px 10px;
	text-align: center;

}

.productHead{
	font-size: 1.7rem;
	width: 33%;
	padding: 10px;
	text-align: center;
	font-weight: bold}

.productHead_02{
	font-size: 1.8rem;
	padding: 10px;
	text-align: center;
	font-weight: bold;
}

.fontF{
	color: #f9f9f9
}

.productSectionTop{
	padding: auto 10px;
  text-align: center;
}

.productSmartStarL{
  text-align: left;
}

.productSmartStar80{
  width: 90%;
  margin-left: 3%;
  text-align: justify;
}

.productSmartStar80 b{
  font-size: 1.1rem;
  color: #333;
}

.imCnt{
	text-align: center;
}

#productContents .productSectionTop p{
	font-size: 1rem;
	line-height: 2;
}

.productSectionSub{
	margin-top: 40px;
  text-align: center;
}


#productContents .productSectionSub p{

	font-size: 1rem;
	line-height: 2;
}

.productSectionTop_50{
	margin-top: 100px;
}

.productSub{
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.productSub_02{
	display: flex;
	align-items: center;
	justify-content: space-around;
	margin-bottom: 30px;
}
/*
.productSub_02_02{
	display: flex;
	align-items: center;
	justify-content: space-around;
	margin-bottom: 30px;
}

.productSubIcon{
	margin: 0 10px;
}

.productSubIcon img{
	max-width: 40%;
	max-height: 100%;
}*/

.productSubTate{
	display: flex;
	align-items: center;
	flex-direction: column;
}

.productSub_50{
	width: 45%;
}

#productContents .productSubIcon p{
	font-size: 0.8rem;
}

.productSubIconSub{
	height: 50px;
}

.productSubSpec{
	text-align: left;
}

#productContents .productSubTitle{
	color: #444;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: left;
	margin: 0;
	padding: 0 15px;
}

#productContents .productSubTitle::after{
   content:"";
   display:block;
   width:90%;
   height:1px;
   background-color:#444;
   position:absolute;
   bottom:0;
   left:10px;
}

.productSubPlan{
	display: flex;
	flex-direction: column;
	align-items: left;
	width: 30%;
	min-width: 25%;
}

.productSubSent{
	width: 30%;
	margin: 0 auto;
	color: #666;
	font-size: 0.9rem;

}

#productContents p.productHeadSentence{
	justify-content: left;
  align-items: center;
	padding: 0 20px;
	font-size: 0.8em;
	line-height: 1.5;
}



.productSplit{
	display: flex;
	flex-direction: column;
	width: 33%;
	float: left;
	justify-content: center;
  align-items: center;
}

.productSplitSmartStar{
	display: flex;
	flex-direction: column;
	width: 49%;
	float: left;
	justify-content: center;
  align-items: center;
}

.productSplitSmartStarRight{
	display: flex;
	flex-direction: column;
	width: 49%;
	justify-content: center;
  align-items: center;
}

.productSplitSmartStar img,
.productSplitSmartStarRight img{
	max-width:78%;
	display: block;
	margin: auto;
}


.productSplitSpa{
	display: block;

}

#productContents p.productSplitTitle{
	font-size: 0.9rem;
    border: 2px solid #ccc;
    border-radius: 30px;
    width: 50%;
	padding: 3px;
	text-align: center;
}

#productContents p.SmartStarTenkiTitle{
	font-size: 0.9rem;
    border: 2px solid #ccc;
    border-radius: 30px;
    width: 30%;
	padding: 3px;
	text-align: center;
}

.SmartStarTenkiTitleSub{
	height: 120px;
}

.productSplit img,
.productSplitRight img{
	max-width:78%;
	display: block;
	margin: auto;
}


.productSplitRight{
	display: flex;
	flex-direction: column;
	width: 33%;
	justify-content: center;
  align-items: center;
}

.InquiryFlowBox{
	margin: 25px 8px 0 8px;
	width:30%;
	float: left;
	display: flex;
	flex-direction: column;
	align-items: flex-start;

}

#productContents .InquiryFlowBox h4{
	font-size: 1.1rem;
	font-weight: bold;
	margin: 1em 0 0 0;
	padding: 0 15px;
}

#productContents .InquiryFlowBox p{
line-height: 1.4;
}


.InquiryFlow{
	position: relative;

}

.InquiryFlowNunber{
	position: absolute;
	width: 30px;
	height: 30px;
	left: 5px;
	top: 5px;
	line-height: 30px;
	background-color: #ea2d93;
	border-radius: 50%;
	font-weight: 700;
	color: #fff;
	text-align: center;
	font-size: 1.2rem;
}

.InquiryFlowNunber img{
	position: absolute;
	left: 0;
	top: 0;
}

.imageBox{
	margin: auto;
	text-align: right;
}


.effect-fade {
　opacity : 0;
　transform : translate(0, 45px);
　transition : all 300ms;
}

.effect-fade.effect-scroll {
　opacity : 1;
　transform : translate(0, 0);
}

.showInquiry a{
	margin: 0 auto;
	text-align: center;
	width: 60%;
	position: absolute;
	left: 50%;
	top: calc(100vh - 20vh);
	border: 1px solid #000;
	font-size: 0.9rem;
	font-weight: bold;;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}

.showInquiry a:hover{
	color: #f9f9f9;
	border-color: #f9f9f9;
	background-color: #000;
}

.showInquiry_02 a{
	margin: 0 auto;
	text-align: center;
	width: 60%;
	position: absolute;
	left: 50%;
	top: calc(100vh - 20vh);
	border: 1px solid #f9f9f9;
	color: #f9f9f9;
	background-color: #000;
	font-size: 0.9rem;
	font-weight: bold;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}

.showInquiry_02 a:hover{
	color: #000;
	border-color: #000;
	background-color: #f9f9f9;
}

.showInquiry_03 a{
	text-align: center;
	width: 45%;
	position: absolute;
	left: 50%;
	top: 60vh;
	border: 1px solid #333;
	font-size: 0.8rem;
	font-weight: bold;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	background-color: #f9f9f9;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}

.showInquiry_03 a:hover{
	color: #f9f9f9;
	border-color: #f9f9f9;
	background-color: #111;
}

.showInquiry_03_02 a{
	text-align: center;
	width: 50%;
	position: relative;
	left: 25%;
	top: 10%;
	border: 1px solid #333;
	font-size: 0.8rem;
	font-weight: bold;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	background-color: #f9f9f9;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}


.showInquiry_03_02 a:hover{
	color: #f9f9f9;
	border-color: #f9f9f9;
	background-color: #111;
}

.showInquiry_04 a{
	text-align: center;
	width: 45%;
	position: relative;
	left: 0;
	top: 20px;
	border: 1px solid #333;
	font-size: 0.8rem;
	font-weight: bold;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	background-color: #f9f9f9;
}

.showInquiry_04 a:hover{
	color: #f9f9f9;
	border-color: #f9f9f9;
	background-color: #111;
}

.showInquiry_05 a{
	text-align: center;
	position: relative;
	left: calc(40% - 40px);
	top: 30px;
	border: 1px solid #333;
	font-size: 0.8rem;
	font-weight: bold;
	padding: 10px 10%;
	text-decoration: none;
	transition: all 0.5s 0s ease;
	background-color: #f9f9f9;
	transform: translateX(-40% - 40px);
	-webkit-transform: translateX(-30%);
}

.showInquiry_05 a:hover{
	color: #f9f9f9;
	border-color: #f9f9f9;
	background-color: #111;
}


#topTesla{
	width:100%;
	height: calc(100vh - 134px);
	background-image: url(../images/tesla-powerwall-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#topTeslaJirei{
	width:100%;
	height: calc(100vh - 134px);
	background-image: url(../images/reform2021/saitamashiiwatsukiku-i-tesla-powerwall04.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#topTeslaJirei_02{
	width:100%;
	height: calc(100vh - 134px);
	background-image: url(../images/reform2022/saitamashimidoriku-y-powerwall03.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

#teslajirei_02{
	display: flex;
	flex-direction: row;
}



.topTeslaLogo{
	position: absolute;
	left:3%;
}

.topTeslaLogo_02{
	margin: 0 10px 0 3%;
}

.topTeslaLogo span{
	color: #fff;
	font-size: 0.8rem;
}

.topTeslaLogo p{
	color: #fff;
	font-size: 0.95rem;
	line-height: 1.4;
	padding: 10px 20px;
	margin-top: 3px;
	width: 210px;
	text-shadow: 0px 0px 5px #555;
}

.topTeslaLogo_02 p{
	color: #fff;
	font-size: 0.95rem;
	line-height: 1.4;
	padding: 10px 20px;
	margin-top: 3px;
	width: 210px;
	text-shadow: 0px 0px 5px #555;
}

.productFullScroll {
	height: 100vh;
  overflow: visible;
  overflow-y: auto;
  scroll-snap-type: y proximity;
}

.productScrollSection{
	max-height: 100vh;
}

[data-scroll] {
  transition: opacity 1s;
}
[data-scroll="in"] {
  opacity: 1;
}
[data-scroll="out"] {
  opacity: 0;
}


 .char {
    transition: transform .3s cubic-bezier(.3, 0, .3, 1), opacity .3s linear;
    transition-delay: calc( 20ms * var(--char-index) );

  }

[data-scroll="out"] .char {
    opacity: 0;
    transform: translateY( .5em );
  }


.char {
    display: inline-block;
    -webkit-animation-delay: calc(0.3s + var(--char-index) * 0.03s);
    animation-delay: calc(0.3s + var(--char-index) * 0.03s);
    transition: all 0.3s calc(0.3s + var(--char-index) * 0.03s);
}


.productHead_02Mov  {
position: relative;
width: 100%;
padding: 20px 0 35%;
}


.productHead_02Mov video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}




*,
*:before,
*:after {
  padding: 0;
  margin: 0;
}



.showCasePowerwall {
  width: 100%;
  min-height: 100vh;
  position: relative;
}

.powerwallPart {
  width: 100%;
  height: 100vh;
  position: absolute;
  overflow: hidden;
  font-size: 3rem;
}

.powerwallPart .colorTitles {
  position: absolute;
  left: 20%;
  top: 10vh;
  transform: translate(-50%, 0);
  font-size: 1.8rem;
}

.colorTitles {
  width:30%;
}

.whitePart {
  background-color: #f2f2f2;
  z-index: 1;
}

.whitePart  p {
  font-size: 1.5rem;
}

.whitePart .colorTitles .blackTitle {
  color: #8b8b99;
}
.whitePart .colorTitles .whiteTitle {
  color: #000;
}

.blackPart {
  background-color: #000;
  z-index: 2;
  clip-path: inset(100% 0px 0px);
  -webkit-clip-path: inset(100% 0px 0px);
}

.blackPart  p {
  font-size: 1.0rem;
}

.blackPart .colorTitles .blackTitle {
  color: #f5f5f7;
}

#productContents .kakaku{
	display: block;
	text-align: center;
	font-size: 2.5rem;
	font-weight: bold;
	margin-top: -10px;
	margin-bottom: -5px;
}

#productContents .kakakuTop{
	display: block;
	text-align: center;
	font-size: 1.4rem;
	margin-top: 30px;
}

#productContents .kakakuMiddle{
	display: block;
	text-align: center;
	font-size: 2.8rem;
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: -10px;
}

#productContents .kakakuMiddle_02{
	display: block;
	text-align: center;
	font-size: 0.9rem;
	font-weight: bold;
	margin-top: 2px;
}


#productContents .kakakubotm{
	display: block;
	text-align: center;
	font-size: 1rem;
	margin-top: 3px;
}

.blackPart_02{
  background-color: #000;
  z-index: 2;
  clip-path: inset(100% 0px 0px);
  -webkit-clip-path: inset(100% 0px 0px);
}

.blackPart_02  p {
  font-size: 1.0rem;
}

.blackPart_02 .colorTitles .blackTitle {
  color: #f5f5f7;
}



.powerwallPart img {
	max-height: 115vh;
  position: absolute;
  left: 70%;
  bottom: 30%;
  transform: translate(-50%, 50vh);
}

.chikudenChart{
	margin: 70px auto;
}



.chikudenChart_02{
	width: 80%;
	border-collapse: collapse;
	text-align:center;
	margin: 20px auto 10px auto;
	border: 1px solid #ccc;
	font-size: 0.9rem;
	color: #222;
}

.chikudenChart span{
	width: 90%;
	display: block;
	text-align: right;
	font-size: 0.7rem;
}

.chikudenChart_02 th{
	background-color: #ddd;
	height:60px;
	width: 25%;
	border: 1px solid #ccc;
	font-weight: normal;
}

.chikudenChart_02 th.chikudenChartSub{
	background-color: #555;
	color: #fff;
}

.chikudenChart_02 td{
	height:50px;
	border: 1px solid #ccc;
	line-height: 1;
}

.chikudenChart_03 td{
	height:20px;
}
/*
.chikudenChart_03 tr:nth-child(odd) td{
  background-color: #a1c6d6;
}
*/
.chikudenChart_02 .chikudenChartSub{
	font-weight: bold;
	font-size: 1.1rem;
}

.chikudenChart_02 .sekoujireiSub{
	background-color: #eee;
}

.chikudenYoko{
overflow-x: scroll;
}


.illust70{
	width: 100%;
	margin: auto;
	padding: 50px 30px;
}

.illust80{
	width: 80%;
	padding: 50px 30px;
}

.tetest{
	-webkit-animation: haisenzu 3s ease-in infinite;
	animation: haisenzu 3s ease-in infinite;
}

@keyframes haisenzu {

0% {
opacity:0.2;
}

40% {
opacity:1.0;
}
60% {
opacity:1.0;
}

100% {
opacity:0.2;
}

}



/* ================================================================================================
  オンラインミーティング　2021/08/27
 =================================================================================================== */
.textCent{
	text-align: center;
	margin: auto;
}

.textCent img{
 vertical-align: middle;
	margin: auto;
	padding: 0 5px 0 0;
}

.appHeadIcon{
	font-size: 1.7rem;
	padding: 5px;
	text-align: center;
	font-weight: bold;
	margin-top: 150px;
}

.productHeadApp{
	font-size: 1.4rem;
	padding: 10px;
	text-align: center;
	font-weight: bold;

}

.App_50{
	width:60%;
	margin: 0 auto 50px auto;
}


.marker{
background: linear-gradient(transparent 40%, #fffaba 40% );
font-weight: bold;
color: #444;
}

.ftCenterText_sekoujirei{
	text-align:center;
	margin:50px auto 10px auto;
}

.ftCenterText_sekoujirei img{
	margin:50px auto 10px auto;
	width: 400px;
}

/* ================================================================================================
  お問い合わせボタン
 =================================================================================================== */
/*
.toiawaseButton a {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 50px auto;
  padding: 0.9em 2em;
  width: 300px;
  color: #fff;
  font-size: 1em;
  font-weight: 700;
  background-image: linear-gradient(175deg, #d81077, #c51971);
  border-radius: 50vh;
  transition: 0.3s;
	overflow: hidden;
	position: relative;

}
*/

.toiawaseButton a {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 50px auto;
  padding: 0.9em 2em;
  width: 300px;
  color: #fff;
  font-size: 1em;
  font-weight: 700;
  background-image: linear-gradient(175deg, #b3364f, #db536b);/*紅樺　薔薇*/
  border-radius: 50vh;
  transition: 0.3s;
	overflow: hidden;
	position: relative;

}


.toiawaseButton a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  transform: rotate(45deg);
}

.toiawaseButton a:hover {
  text-decoration: none;
	opacity: 0.7;
  /*background-image: linear-gradient(-170deg, #d81077, #c51971);*/
}
/*
.toiawaseButtonAc::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 37px;
    height: 100%;
    background-color: #fff;
    animation: toiawaseButtonAc 5s ease-in-out infinite;
}

@-webkit-keyframes toiawaseButtonAc {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(3) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(40) rotate(45deg); opacity: 0; }
}
*/
/* ================================================================================================
  ローディング画面
 =================================================================================================== */

 #loading-wrapper {
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   background: #fbf6e8;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   transition: all 0.3s;
   z-index: 9999;
 }

 .loaded {
   opacity: 0;
   visibility: hidden;
 }

/*
 .loader {
   color: #d81077;
   font-size: 90px;
   text-indent: -9999em;
   overflow: hidden;
   width: 1em;
   height: 1em;
   border-radius: 50%;
   margin: 72px auto;
   position: relative;
   -webkit-transform: translateZ(0);
   -ms-transform: translateZ(0);
   transform: translateZ(0);
   -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
   animation: load6 1.7s infinite ease, round 1.7s infinite ease;
 }
 @-webkit-keyframes load6 {
   0% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
   5%,
   95% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
   10%,
   59% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
   }
   20% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
   }
   38% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
   }
   100% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
 }
 @keyframes load6 {
   0% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
   5%,
   95% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
   10%,
   59% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
   }
   20% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
   }
   38% {
     box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
   }
   100% {
     box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
   }
 }
 @-webkit-keyframes round {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   100% {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }
 @keyframes round {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   100% {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }


*/


 .loader {
  font-size: 10px;
  margin: 50px auto;
  text-indent: -9999em;
  width: 11em;
  height: 11em;
  border-radius: 50%;
  background: #c7c7c7;
  background: -moz-linear-gradient(left, #c7c7c7 10%, rgba(199,199,199, 0) 42%);
  background: -webkit-linear-gradient(left, #c7c7c7 10%, rgba(199,199,199, 0) 42%);
  background: -o-linear-gradient(left, #c7c7c7 10%, rgba(199,199,199, 0) 42%);
  background: -ms-linear-gradient(left, #c7c7c7 10%, rgba(199,199,199, 0) 42%);
  background: linear-gradient(to right, #c7c7c7 10%, rgba(199,199,199, 0) 42%);
  position: relative;
  -webkit-animation: load3 1.4s infinite linear;
  animation: load3 1.4s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.loader:before {
  width: 50%;
  height: 50%;
  background: #c7c7c7;
  border-radius: 100% 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.loader:after {
  background: #fbf6e8;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
@-webkit-keyframes load3 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load3 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



 /* ================================================================================================
   TOPページデザイン　2021/12/17～
  =================================================================================================== */

.topSlidePath{
	margin: 0 calc(50% - 50vw);
	position: relative;
	top:0;
	left: 0;
	height: 100vh;
	width: 100vw;
	/*clip-path:polygon(0 100%,100% 96%,100% 0,0 0);
	clip-path:polygon(0 4%,100% 0,100% 100%,0 100%);
	-webkit-clip-path: polygon(0 4%,100% 0,100% 100%,0 100%);
	-ms-clip-path: polygon(0 4%,100% 0,100% 100%,0 100%);
	clip-path:polygon(0 16%,50% 0,100% 16%,100% 100%,0 100%);
	clip-path:polygon(0 20px,100% 0,100% 100%,0 100%);*/
}


#topfrontArea02{
	margin: 0 calc(50% - 50vw);
	position:absolute;
	left:50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	z-index:2;
	width:80%;
	padding:0;
	padding-top:50px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:85%;
}


#topfrontArea02 a{
    text-decoration:none;
    color:#fff;
    font-family: "Yu Gothic";
		font-size: 0.9rem;
    font-weight:bold;
}

#topfrontArea02 a:hover{
    text-decoration:underline;
}

.topSlideText02{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
}

.topSlideText02 a{
 text-decoration: none;
}

.topSlideText02 p{
	width: 700px;
	font-size: 1.2em;
	color:#fff;
  text-align: center;
	opacity: 0;
	animation: topslide 1s ease 0.2s forwards ;
}

.topSlideText02 h3{
	width: 700px;
	font-family: "Yu Gothic";
	font-size: 2.2em;
	font-weight: bold;
	color:#fff;
  text-align: center;
	animation: topslide 1s ease ;
}

.details02{
	font-family: "Yu Gothic";
	display: block;
	font-size: 0.8rem;
  width:150px;
  height:35px;
	line-height: 35px;
  text-align: center;
	margin: auto;
	color: #eee;
  background-color: transparent;
  border: 1px solid #eee;
  border-radius: 25px;
	margin: 15px auto;
	transition: all 0.5s;
	animation: topslide 1s ease 0.6s forwards ;
}

.details02:hover{
  background-color: #fff;
  border: 1px solid #fff;
	color: #555;
}






/*============
nav
=============*/


nav {
  display: block;
  position: fixed;
  top: 0;
  left: -100%;
  bottom: 0;
  width: 100%;
  background: #333;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: all .5s;
  z-index: 100;
  opacity: 0;
}
.open nav {
  left: 0;
  opacity: 0.8;
}
nav .inner {
  padding: 50px 25px;
}
nav .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav .inner ul li {
  position: relative;
  margin: 0;
}
nav .inner ul li a {
  display: block;
  color: #fbf6e8;
  font-size: 14px;
  padding: 1em;
  text-align: center;
  text-decoration: none;
  transition-duration: 0.2s;
}
nav .inner ul li a:hover {
  background: #777;
}

/*============
.toggle_btn
=============*/
.toggle_btn {
  display: block;
  position: fixed;
  top: 22px;
  right: 22px;
  width: 22px;
  height: 22px;
  transition: all .5s;
  cursor: pointer;
  z-index: 101;
}
.toggle_btn span {
  display: block;
  position: absolute;
  left: 0;
  width: 30px;
  height: 2px;
  background-color: #999;
  border-radius: 4px;
  transition: all .5s;
}

.toggle_btn span:nth-child(1) {
  top: 0;
}
.toggle_btn span:nth-child(2) {
  top: 10px;
}

.toggle_btn span:nth-child(3)  {
	bottom: 0;
}

.toggle_btn span:nth-child(1) {
  -webkit-animation: btn07-bar01 .75s forwards;
  animation: btn07-bar01 .75s forwards;
}
@-webkit-keyframes btn07-bar01 {
  0% {
    -webkit-transform: translateY(10px) rotate(45deg);
  }
  50% {
    -webkit-transform: translateY(10px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(0) rotate(0);
  }
}
@keyframes btn07-bar01 {
  0% {
    transform: translateY(10px) rotate(45deg);
  }
  50% {
    transform: translateY(10px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}


.toggle_btn span:nth-child(3)  {
	-webkit-animation: btn07-bar03 .75s forwards;
  animation: btn07-bar03 .75s forwards;
}
@-webkit-keyframes btn07-bar03 {
  0% {
    -webkit-transform: translateY(-10px) rotate(-45deg);
  }
  50% {
    -webkit-transform: translateY(-10px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(0) rotate(0);
  }
}
@keyframes btn07-bar03 {
  0% {
    transform: translateY(-10px) rotate(-45deg);
  }
  50% {
    transform: translateY(-10px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}

.open .toggle_btn span {
  background-color: #fff;
}
.open .toggle_btn span:nth-child(1) {
  -webkit-animation: open-btn07-bar01 .75s forwards;
  animation: open-btn07-bar01 .75s forwards;
}
@-webkit-keyframes open-btn07-bar01 {
  0% {
    -webkit-transform: translateY(0) rotate(0);
  }
  50% {
    -webkit-transform: translateY(10px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(10px) rotate(45deg);
  }
}
@keyframes open-btn07-bar01 {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(10px) rotate(0);
  }
  100% {
    transform: translateY(10px) rotate(45deg);
  }
}
.open .toggle_btn span:nth-child(2) {
  opacity: 0;
}
.open .toggle_btn span:nth-child(3) {
	-webkit-animation: open-btn07-bar03 .75s forwards;
	animation: open-btn07-bar03 .75s forwards;
}
	@-webkit-keyframes open-btn07-bar03 {
	  0% {
	    -webkit-transform: translateY(0) rotate(0);
	  }
	  50% {
	    -webkit-transform: translateY(-10px) rotate(0);
	  }
	  100% {
	    -webkit-transform: translateY(-10px) rotate(-45deg);
	  }
	}
	@keyframes open-btn07-bar03 {
	  0% {
	    transform: translateY(0) rotate(0);
	  }
	  50% {
	    transform: translateY(-10px) rotate(0);
	  }
	  100% {
	    transform: translateY(-10px) rotate(-45deg);
	  }
	}

/*============
#mask
=============*/
#mask {
  display: none;
  transition: all .5s;
}
.open #mask {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #aaa;
  opacity: .8;
  z-index: 2;
  cursor: pointer;
}


/* ================================================================================================
  2022/01/19　クーポンガチャページ
 =================================================================================================== */

 .coupon{
 	margin:auto;
 	text-align: center;
 }

.coupon img{
	margin:auto;
	text-align: center;
	display: block;
	max-width: 100%;
	height:100vh;
}

.couponBotn{
	position: absolute;
	bottom: 10%;
	left: 50%;
 margin:auto;
 text-align: center;
 transform: translateX(-50%);
 -webkit-transform: translateX(-50%);
}

#gatyaBotn{
	display       : inline-block;
	border: none;
  border-radius : 4%;          /* 角丸       */
  font-size     : 1.6em;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 42px;   /* 余白       */
  background-color: #777;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  opacity       : 1;           /* 透明度     */
  transition    : .3s;         /* なめらか変化 */
	box-shadow    : 2px 2px 3px #666666;  /* 影の設定 */
}
/*
#gatyaBotn:hover {
  opacity       : 0.8;
	box-shadow    : none;
}
*/







.card {
  float: left;
  padding: 0 0.2rem;
  width: 31%;
	margin-top: 25px;
}




.card .menu-content {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.card .menu-content::before, .card .menu-content::after {
  content: "";
  display: table;
}
.card .menu-content::after {
  clear: both;
}
.card .menu-content li {
  display: inline-block;
}
.card .menu-content a {
  color: #fff;
}
.card .menu-content span {
  position: absolute;
  left: 50%;
  top: 0;
  font-size: 10px;
  font-weight: 700;
  font-family: 'Noto Sans JP';
  transform: translate(-50%, 0);
}
.card .contentWrapper {
  background-color: #fff;
  min-height: 450px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2);
}

.contentWrapper{
 display: block;
	    transition-duration: 0.3s;
	}

.contentWrapper:hover{
	opacity: 0.8;
	    transition-duration: 0.3s;
	}

.card .contentWrapper:hover .contentData {
  transform: translateY(0);
}
.card .contentData {
  position: absolute;
  bottom: 0;
  width: 100%;
  transform: translateY(calc(50px + 1em));
  transition: transform 0.3s;
}
.card .contentData .contentSentence {
  padding: 1em;
  position: relative;
  z-index: 1;
}
.card .author {
  font-size: 12px;
}
.card .title {
  margin-top: 10px;
}
.card .textContent {
  height: 50px;
	padding-top: 10px;
  margin: 0;
	font-size: 0.8rem;
}

.contentCard .contentDate {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #E84698;
  color: #fff;
  padding: 0.8em;
}

.contentCard .contentSentence {
  background-color: #fff;
  box-shadow: 0 5px 30px 10px rgba(0, 0, 0, 0.3);
}
.contentCard .title a {
  color: gray;
}




.cardHref {
  text-decoration:none;
  color: #333;

}

.card_maintitle {
  font-size: 1.1rem;
  font-weight: bold;
  text-decoration:none;
　color:#aaa;
}




/*リンクカード調整*/
.linkcard * {
	text-decoration:none !important;
}

.linkcard:before {
	content: "参考ページ";
	position: relative;
	top:  12px;
	left:  23px;
	background-color: #db536b;
	padding: 5px 14px;
	font-size: 0.8em;
	border-radius:  3px;
	color:  #fff;
	z-index: 1;
}

.linkcard *:hover {
	opacity:0.8;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

.linkcard {
	margin: 22px auto;
	display:block;
	width: 80%;
}

.lkcExternalWrap {
	/*max-width: 100%;*/
	background:  #fff;
	border: solid 1px #db536b;
	border-radius:  4px;
	padding:15px;

}

.lkcExternalWrap p {
	padding-bottom: 5px !important;
}

.lkcTitle {
	font-size:1.2em;
	font-weight:normal;
	margin-bottom: 6px;
	display:  block;
}

.lkcExcerpt {
	display:block;
	margin: 0;
  color: #555;
  font-size: 0.9rem;
  line-height: 1rem;
  padding: 0;
  overflow: hidden;
}

.lkcThumbnailImg{
	width: 150px;
    max-height: 150px;
    box-shadow: 3px 3px 6px rgb(0 0 0 / 50%);

}

.lkcTitleText{
	  color: #666;
    font-size: 1.15rem;
    line-height: 1.4rem;
    font-weight: bold;
    overflow: hidden;
    word-break: break-all;
}

.lkcThumbnail{
	max-width: 150px;
			max-height: 150px;
			padding: 0;
			margin: 0 6px 4px 4px;
			float: left;
}

.lkcContent{
	height: 108px;
margin: 6px 0 0 0;
word-break: break-all;
white-space: normal;
overflow: hidden;
}

.lkcCard{
	margin-top: 16px;
margin-right: 7px;
margin-bottom: 7px;
margin-left: 7px;
}

/* ================================================================================================
  トップページ帯  #e64e9e, #E5278B
 =================================================================================================== */



.obi{
	background:linear-gradient(to right, #e64c9d, #E5278B);
	background: -moz-linear-gradient(left, #e64c9d, #E5278B);
  background: -webkit-linear-gradient(left, #e64c9d, #E5278B);
	padding: 60px 10px;
	margin-bottom: 150px;
}

.obiTopmain{
	background:linear-gradient(to right, #e64c9d, #E5278B);
	background: -moz-linear-gradient(left, #e64c9d, #E5278B);
  background: -webkit-linear-gradient(left, #e64c9d, #E5278B);
	padding: 60px 10px;
}


.obiSentence{
	display: flex;
	flex-direction: column;
	align-items: center;
	color: #fff;
	font-weight: bold;
}

.obiTop{
	font-size: 1.4rem;
}

.obiSecond{
	font-size: 2.0rem;
}

.obiBox{
	width: 260px;
  height: 60px;
	margin: 50px auto 30px auto;
}

.obiLink{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 16px;
	font-weight: bold;
	width: 100%;
	height: 100%;
  background: #fff;
	color: #e64c9d;
	position: relative;
	transition: background-color .3s ease, color .3s ease;
}

.obiToi{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20px;
	height: 20px;
	margin-right: 15px;
}

.obiToi::before{
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #e64c9d;
	border-right: 2px solid #e64c9d;
	transform: rotate(45deg);
	position: relative;
	left: -2px;
	transition: border-color .3s ease;
}


.obiFukidashi {
  margin: 1.5em auto;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  box-sizing: border-box;
	text-align: center;
}



.obiFukidashi span {
  margin: 0;
}

/* ================================================================================================
  20221130　トップページカウンター
 =================================================================================================== */


.topWord{
	vertical-align: middle;
	text-align: center;
	display: flex;
	flex-direction: column;
	margin-top: 30px;
}

.topWordMovie{
	vertical-align: middle;
	text-align: left;
	padding: 0 10px 10px 10px;
	margin-top: 30px;
}



.topWord,
.topWordMovie p{
	color: #777;
}

.topWord p.topWordTop{
	font-size: 2.5rem;
	font-weight: bold;
}

.topWord span{
	color: #e64c9d;
	font-size: 6.0rem;
	font-weight: bold;
	line-height: 6.0rem;
}

.topWord p.topWordKabu{
	font-size: 1.0rem;
	font-weight: normal;
	margin: 40px auto 40px auto;
	width:60%;
	text-align: left;
	line-height: 1.6rem;
}



.scrollInAnime path animate{
    opacity: 0;
    dur: 0.3s;
    repeatCount: 1;
    begin: 0.5s;
    fill:freeze;
   /* stroke: #85B1DF; /* アウトライン色 */
  /*  fill: none; /* 塗りの色 */
  /*  stroke-width:1; /* 線の太さ */
   /* stroke-dasharray: 3000;
    stroke-dashoffset:3000;*/
    animation: DASH 3s ease-in alternate forwards;
        -webkit-animation:DASH 3s ease-in 0s forwards;
        -o-animation:DASH 3s ease-in 0s forwards;
    animation:DASH 3s ease-in 0s forwards;
}

/* ================================================================================================
  動く星座　幾何学模様
 =================================================================================================== */




#particles-js{ 
  position:fixed;/*描画固定*/
  z-index:-1;/*描画を一番下に*/
  width: 100%;
  height: 100vh;
background-color:hsla(229,100%,5%,1);
background-image:
radial-gradient(at 32% 82%, hsla(233,64%,12%,1) 0px, transparent 50%),/*真ん中左の黒,at 横 縦,hsla(色相、彩度、輝度、アルファ値)*/
radial-gradient(at 50% 20%, hsla(236,100%,16%,1) 0px, transparent 60%),/*真ん中上の黒*/
radial-gradient(at 30% 2%, hsla(310,100%,18%,0.8) 0px, transparent 50%),/*左上の紫*/
radial-gradient(at 59% 0%, hsla(206,100%,32%,1) 0px, transparent 50%),/*右上の青*/
radial-gradient(at 0% 50%, hsla(240,100%,8%,0.4) 0px, transparent 50%),/*左真ん中の黒*/
radial-gradient(at 80% 50%, hsla(260,100%,13%,1) 0px, transparent 50%),/*右真ん中の黒*/
radial-gradient(at 0% 90%, hsla(205,100%,13%,1) 0px, transparent 70%),/*左下の青緑*/
radial-gradient(at 69% 81%, hsla(240,28%,18%,0.2) 0px, transparent 50%),/*右下の黒*/
radial-gradient(at 76% 99%, hsla(0,0%,80%,0.1) 0px, transparent 50%);/*右下の白*/
	/*background: linear-gradient(-225deg, rgba(0, 20, 30, 1), rgba(0, 81, 137, 0.6)),url(../images/smartstar-top.png);

  background-repeat: no-repeat;
  backface-visibility: visible;
  background-position: bottom;*/
}

#kikagaku{
  position: relative;
  z-index: 1;
  width:100%;
  height: 100vh;
  background-image: url(../images/jinkouchinou-top.png), url(../images/smartstar-smartstar3.png);
  background-repeat: no-repeat, no-repeat;
  backface-visibility: visible, visible;
  background-position: left 50% bottom 50%, bottom;
  opacity: 0.9;
  background-color:rgba(255,255,255,0.1);
}


#kikagaku{
  display: flex;
  flex-direction: column;
  justify-content:flex-start;
  align-items: center;
  text-align:center;
  color: #fff;
  top:0;
}

#kikagaku h1{
	text-align:center;
	font-size:2.5rem;
	font-weight: bold;
	color:#ffffff;
	background: none;
	margin-top: 8%;
}

#kikagaku p{
	text-align:center;
	font-size:1.4rem;
	color:#ffffff;
	background: none;
	margin-top: 3%;
}

.svgTopLogo{
	margin-top: 5%;
}

/* ================================================================================================
  蓄電池残量アニメーション
 =================================================================================================== */

.wavebox {
  width: 55%;
  height: 30%;
  border-radius: 0;
  background: lighten(#f0f4c3, 10%);
  position: absolute;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  bottom:12.4%;
  left: 50%;
      transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);

}

.waveboxSvgCenter {
  position: relative;
  text-align: center;

}

.wave30 {
  opacity: .4;
  position: absolute;
  top: 3%;
  left: 50%;
  background: #ECE038;
  width: 5000px;
  height: 5000px;
  margin-left: -2500px;
  margin-top: 4%;
  transform-origin: 50% 50%;
  border-radius: 49.8%;
  animation: drift 12000ms infinite linear;
}

.wave30.-three {
  animation: drift 7000ms infinite linear;

}

.wave30.-two {

  animation: drift 9000ms infinite linear;
  opacity: .1;
  background: yellow;
}

.wavebox:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(243, 244, 127,1), rgba(247, 170, 20,0.5)40% , rgba(238, 170, 85,0)100%);
  z-index: 11;
  transform: translate3d(0, 0, 0);
}





.wavebox100 {
  width: 55%;
  height: 100%;
  border-radius: 0;
  background: lighten(#f0f4c3, 10%);
  position: absolute;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  bottom:12.4%;
  left: 50%;
      transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
}

.wavebox100 img{
	width: 50%;
}
.wavebox100:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 90%;
  background: linear-gradient(to top, rgba(243, 240, 127,1), rgba(247, 170, 20,0.8)40% , rgba(255, 207, 48,0)100%);

   /* background: linear-gradient(to top, rgba(233, 128, 053,0.5) , rgba(238, 170, 85,0)100%);
background:
radial-gradient(at 95% 50%, hsla(38,98%,67%,0.7) 0px, transparent 50%),
radial-gradient(at 0% 47%, hsla(50,84%,75%,0.8) 0px, transparent 50%),
radial-gradient(at 94% 93%, hsla(50,100%,76%,1) 0px, transparent 70%),
radial-gradient(at 20% 80%, hsla(38,91%,54%,1) 0px, transparent 70%);
*/
  z-index: 11;
  transform: translate3d(0, 0, 0);
}

.wave100 {
  opacity: .4;
  position: absolute;
  top: 3%;
  left: 50%;
  background: #ecdf2b;

  width: 5000px;
  height: 5000px;
  margin-left: -2500px;
  margin-top: 25%;



  transform-origin: 50% 50%;
  border-radius: 49.8%;
  animation: drift 15000ms infinite linear;
}

.wave100.-three {
  animation: drift 10000ms infinite linear;

}

.wave100.-two {

  animation: drift 12000ms infinite linear;
  opacity: .1;
  background: yellow;
}


@keyframes drift {
  from { transform: rotate(0deg); }
  from { transform: rotate(360deg); }
}

.wave100Full {
  position: absolute;
  left: 0;
  top: 40%;
  width: 100%;
  height: 100%;
  z-index: 12;
  text-align: center;
  color: white;
  text-transform: uppercase;
  letter-spacing: .4em;

}

.tetetst{
	position: absolute;
  width: 100%;
  height: 100%;
	z-index: 100;
}


/* ================================================================================================
  蓄電池の実例ページ
 =================================================================================================== */

/*文字上下余白合計1ページ分*/


/*線の太さ*/
#koujigenba p.mojiYohaku_1{
	font-size: 3rem;
	font-weight: bold;
	color: #d81077;
	margin-top: 50vh;
	margin-bottom: 50vh;
}

.taWakuB{
	border:solid #db4f23;
	border-width:6px 6px 0px 6px;
	font-size: 0.95rem;

}
.taWakuB02{
	border:solid #db4f23;
	border-width:0px 6px 6px 6px;
	font-size: 0.95rem;
}


/* ================================================================================================
  トップページコンテンツのスライド
 =================================================================================================== */


.TopContentSlide {
	transform: scale(.75);
	transition: opacity .3s, transform .5s;
}
.TopContentSlide.slick-center {
	transform: scale(1);
}


/* ================================================================================================
  トップページのロゴ部分
 =================================================================================================== */

.topLogoKyouwa{
	height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.topLogoKyouwa img{
	margin: auto;
	width: 200px;

}

.topLogoKyouwa_m{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.topLogoKyouwa_m img{
	width: 200px;
}

.topmenu_soudan{
	font-family: 游明朝;
	margin-top: 50px;
	background-color: #fbf6e8;
	padding: 10px 40px;
	border-radius: 30px;
	color: #666;
	font-size: 1.4em;
}

.topmenu_tel{
	color: #fbf6e8;
	margin-bottom: 30px;

}
/* ================================================================================================
  トップページ下部コンテンツのスライダー
 =================================================================================================== */

.TopBottomSlider .TopBottomSlide{
margin-right:4px;
margin-left:4px;

}


/* ================================================================================================
  News一覧ページ
 =================================================================================================== */

.newsListWrapper{
	width: 95;
    margin: 100px auto;
}

.newsList{
	display: grid;
	grid-template-columns: minmax(0, 1fr);
}


.newsListItem{
	border-top:1px solid #ccc ;
}

.newsListItemSen{
	display: grid;
	grid-template-columns: 85px 1fr;
	gap: 13px 38px;
	margin: 40px 0;
}

.newsListTime{
    grid-column: 1 / 2;
    font-family: "游明朝", "Yu Mincho", serif;
    color: #666;
    margin: auto 0 auto 15px;
}


#koujigenba .newsListItemSen p{
	margin: 0 5px;
    padding: 0 15px;
    color: #666;
}


.contentsListItemSen{
	display: grid;
	grid-template-columns: 170px 1fr;
	grid-template-rows: 20% 80%;
	gap: 20px 38px;
	margin: 20px 0;
}

#koujigenba .contentsListItemSen p{
	margin: 5px 0 0 0;
	line-height: 1.4;
    color: #666;
    padding: 0 15px;
}


.contentsListItemSen_02{
 grid-area: 1 / 1 / 3 / 2;/*縦の開始位置/横の開始位置/縦の終了位置/横の終了位置*/
}

#koujigenba .newsListWrapper .newsList h3{
	color: #666;
    font-size: 120%;
    font-weight: bold;
    border-left: none;
    border-bottom: none;
    padding: 0 5px;
 	line-height: 22px;
    margin-top: 0px;
    margin-bottom: 10px;
    margin-left: 10px;
}


#koujigenba .newsListWrapper a:hover{
	opacity: 0.8;
	background-color: #f2f2f2;
	transition-duration: 0.5s;
	text-decoration: none;
}

.youhekiAnime{
	width: 90%;
	margin: auto;
	text-align: center;
}

.kisoAnime {
    width: 100%;
    max-width: 1000px;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
}
/* ================================================================================================
  RESPONSIBLE CSS for tablet & iphone 1024px-1366px browser size
 =================================================================================================== */

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

#example {
	height:700px;
}

#banner{
	width:90%;
}

.bannerBoxLeft {
    width: 30%;
}

.poli{
	width:85%;
}



.tv-taisyo{
		font-size: 1.7em;
}

#topTesla{
	height: calc(100vh - 126px);
	background-attachment: scroll;
}


#detailTopSmartatar .detailText p{
font-size:calc(1.2em + 1.2vw);
}

#detailTopSmartatarHit{
width:100vw;
height: 60vh;
 background-image: url(../images/smartstar-hit-set-top.jpg);
background-position: center;
 background-size: cover;
 background-attachment: scroll;
}

#detailTopSmartatarHit .detailText p{
transform: translate(-50%);
 top:35%;
}

#detailTopGaihekiGenkan{
 width:100vw;
 height: 85vh;
 background-image: url(../images/tosou-genkandoor-top-1000.jpg);
 background-attachment: scroll;
}

#detailTopEcohojo{
 width:100vw;
 height: 85vh;
 background-attachment: scroll;
}

#detailTopSyouene2024{
 width:100vw;
 height: 85vh;
 background-attachment: scroll;
}

}

/* ================================================================================================
  RESPONSIBLE CSS for tablet & iphone 769px-1023px browser size
 =================================================================================================== */

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

header{
	width:100%;
}

header #headerWrap{
	width:64%
}

header #searchBox{
	width:36%
}

header #searchBox{
	width:34%;
}

header #searchBox ul{
	width:80%;
	display:table;
	position:relative;
	left:30px
}

header #searchBox ul li{
	display:table-cell;
	padding:0;
	background-position:25% 50%
}

header #searchBox .searchBoxInner{
	text-align:right
}

.photoInfo{
	float:left;
}

.openBoxLeft{
	float:left;
	width:47%;
	margin:1px 30px 2px 0px;
}

.openBoxCenter{
	float:left;
	width:47%;
	margin:1px 0 2px 0;
}

.openBoxRight{
	float:left;
	width:47%;
	margin:1px 0px 2px 30px;
}

.openBoxAll{
    width:98%
    padding:6px 2px 2px 2px;
}

.sekoujireiBoxLeft{
	width:100%;
	margin:6px 1px 2px 1px;
	clear:left;
}

.sekoujireiBoxCenter{
	width:100%;
	margin:6px 1px 2px 1px;
	clear:left;
}

.sekoujireiBoxRight{
	width:100%;
	margin:6px 1px 2px 1px;
	clear:left;
}

.bannerBoxLeft{
	float:left;
	width:30%;
	margin:1px 6px 6px 0px;
	height: 330px;
}

.bannerBoxCenter{
	float:left;
	width:30%;
	margin:1px 6px 6px 0px;
}

.bannerBoxRight{
	float:left;
	width:30%;
	margin:1px 6px 6px 0px;

}
.reformBoxLeft{
	width:47%;
	padding:6px 2px 2px 2px;
}

.reformBoxRight{
	width:47%;
	padding:6px 2px 2px 2px;
}

.eventBoxAll{
    width:98%
    padding:6px 2px 2px 2px;
}

.sougouphotoInfo img{
	width:100%
}

.jireiInfo{
	margin:0 0 4px 0;
	clear:left;
}



.jireiInfo ul.jireiicon{
    margin:0px;
}


#naliswrap{
	width:90%;
	margin-right:10px;
	overflow:hidden
}

#pickup{
	width:100%;
}

#newsinfo{
	width:70%;
}

 .blogBoxInnerCase{
 	/*border:1px solid #aaa;*/
 }
 .blogBoxInnerCase ul{
	margin:0 auto 5px auto;
	/*height:64px;*/
	font-size:75%;
/*	border:1px solid #ccc;*/
}
 .blogBoxInnerCase li{
	float:none;
	height:40px;
	line-height:40px;
	padding: 4px 0.5em;
	border-bottom:1px dotted #ccc;
	text-indent:4px;
	color: #666;
}



/*
#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl dd{
	float:none;
	margin-left: 0;
  	padding: 0px 0.5em 0px 0.5em;
}*/



#sideMenu .sideTopNav{
	margin-bottom:1em;
}
#sideMenu .sideTopNav2{
	margin-bottom:0.3em;
}



#footerTopArea{
	max-width:100%;
}


#footerBox{
	max-width:100%;
}

.footerMenuCase{
	margin:1em 1.5em 1.2em 1em;
	padding-left:2em;
}


.footerCompanyCase{

	margin:1em 0 0 10px;

}

.jireiInfo ul.jireiicon{
    padding:0 0 30px 0;
}


/*--zerostyle page--*/


#pageTitle h2{
	font-size:100%;
}

.sekouTitle h2{
	font-size:100%
}

#pageContents h4{
	font-size:110%
}




.mlarge{
	font-size:140%;
	font-weight:bold
}

.attnBd{
	font-weight:bold;
	font-size:120%
}


#pageContents .mainRead p.mainImgBox{float:none;text-align:center;margin-bottom:1em;}
#pageContents .mainRead p.honbun{-zoom:0;overflow:visible}


.imgAnimationShinchiku {
	color: #fff;
	float:left;

}

.imgAnimationSougo {
    color: #fff;
	float:left;
	margin:0 2px 25px 0;
}

.imgAnimationSonota {
    color: #fff;
	float:left;
	margin:0 2px 25px 0;
}




.fadeinSentence{
	float:left;
}

/*--for realestate information --*/

#houseInfo #bukken{
	height:40px;
}

#houseInfo #bukken h3{
	-zoom:1;
	overflow:hidden
}



#zumenWrap{
	width:100%;
}

#zumenWrap .zumenLeft{
	float:none;
	display:block;
	width:100%;
	margin-right:0px;
}

#zumenWrap .zumenRight{
	dispaly:block;
	varticla-align:middle;
}

#zumenWrap .zumenRight p{
	width:100%;
	margin:1em auto;
	font-size:80%;
}

.infoContact{
	width:100%;
	margin-top:0;
}

.infoContact img{
	margin:0;
}

.personalityMukuSekou{
	margin:10px 10px 10px 0;
	float:none;
	width:85%;
}



.eqhaba{
	width:100%;
}
.sekouwid{
	width:100%;
}

#example {
	height:500px;

}

/*--zerostylehouse--*/
#pageContents .mainRead p.mainImgBox2{float:none;width:100%;text-align:center}

#pageContents .mainRead p.honbun{-zoom:1;overflow:hidden;text-indent:1em;}


.reformIcon{
	float:left;
	width:30%;
	margin:1px 23.5px 15px 0px;
}

.reformta{
	width:100%;
	margin:5px 0 15px 0;
}

.image-base p{
	font-size:150%;
	font-family: Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	color:#fff;
	opacity: 0.8;
	margin:50px 0;
}

#inquiryContents h2{
	font-size:2em;
}

#inquiryContents h4{
	font-size:2em;
}

#form {
	width: 90%;
	margin: 10px auto;
}

.haikei {
	background-attachment: scroll;
}

.image-base p{
	font-size:140%;
}

#finalLine_02{
	margin-bottom: 90px;

}

/*=============================================
     TOPロゴ
==============================================*/
.topLogoKyouwa{
	height: 90vh;
}

/*=============================================
     価格カウンター
==============================================*/

#ctPrice{
  position: fixed;
  bottom:0;
  left:0;
  width:99%;
  border:solid 5px #e55777;
  background:#fff;
  margin:0 auto 80px auto;
  z-index:5;
}

_::-webkit-full-page-media, _:future, :root #ctPrice {
    width:98.7%;
}

#ctPrice dl dt{
  font:bolder 35px 'arial black','arial','メイリオ',sans-serif;
  color:#fff;
  float:left;
  clear:left;
  padding:0 20px;
  vertical-align:middle;
  background:#e55777;
  line-height:80px;
}

h4.ctDesi{
margin:60px 0 0 0;
}

.ctSougaku{
  margin:0;
  font:bolder 50px 'arial black','arial','メイリオ',sans-serif;
  color:#e55777;
  text-align:center;
  background:#fff;
  line-height:80px;

}

.ctboxSideTop{
  position: relative;
  margin:30px 0 20px 20px;
}

.ctboxSide{
 position: relative;
 margin:0 0 20px 20px;
}

.ctboxSide02{
 position: relative;
 margin:0 0 20px 20px;
}

.ctBtn01{
  position : relative;
  left:0;
}

.ctBtn02{
  position : relative;
  left:0;

}

.ctBtn03{
  position : relative;
  left:0;
}


/* ================================================================================================
  住宅機器特別価格ページ
 =================================================================================================== */


 #koujigenba .tokkaToiawase{
 	width:90%;
 	font-size: 1.9em;
 }

 #koujigenba .tokkaMidashiUnder{
 	width: 90%;
 	font-size:1.6em;
 }

 #koujigenba .tokkaMidashiUnder02{
 	width: 90%;
 	font-size:1.8em;
 }

 #koujigenba .tokkaMidashiUnder03{
 	width: 100%;
 	font-size:2.5em;
 }

 #koujigenba .tokkaMidashi{
 	width: 70%;
 	font-size:2.6em;
 }

 #koujigenba .tokkaMidashi02{
 	width: 90%;
 	font-size:2.6em;
 }

 #koujigenba .tokkaMidashi05{
 	font-size:5em;
 }

 #koujigenba .oubo{
 	font-size:3em;

 }

 /* ================================================================================================
   工事コンテンツページ部分（写真画面フルサイズ）
  =================================================================================================== */

 #detailTop .detailText p{
 	font-size:calc(1.7em + 1.7vw);
 }

#detailTopYane .detailText p{
 font-size:calc(1.7em + 1.7vw);
}

#detailTopBetakiso .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

#detailTopTacdine .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

#detailTopNiwaConcrete .detailText p{
	font-size:calc(1.3em + 1.3vw);
}

#detailTopIh .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

#detailTopMat .detailText p{
 font-size:calc(1.4em + 1.4vw);
}

#detailTopHaikan .detailText p{
 font-size:calc(1.4em + 1.4vw);
}

#detailTopCorona .detailText p{
 font-size:calc(1.4em + 1.4vw);
}

#detailTopShiroari .detailText p{
 font-size:calc(1.4em + 1.4vw);
}

#detailTopTv .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

#detailTopSmartpv .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

#detailTopEcocute .detailText p{
 font-size:calc(1.3em + 1.3vw);
}

 #detailTop{
 	background-size: auto;
 	background-attachment: fixed;
 }

 #detailTopRosyutsuhaikan .detailText p{
 	font-size:calc(1.2em + 1.2vw);
 }

 #detailTopKawaragalvalume .detailText p{
  font-size:calc(1.3em + 1.3vw);
 }

 #detailTopEcocuteKosyouSyoujo .detailText p{
	font-size:calc(1.3em + 1.3vw);
 }

 #detailTopTaiyoukoHiyouBaidenkakaku .detailText p{
	font-size:calc(1.2em + 1.2vw);
 }



 #detailTopGaihekiGenkan .detailText p{
 	font-size:calc(1.2em + 1.2vw);
 }



 /* ================================================================================================
   テスラ1023
  =================================================================================================== */


	.powerwallPart {
	  width: 100%;
	  height: 100vh;
	  position: absolute;
	  overflow: hidden;
	  font-size: 2rem;
	}

	#topTesla{
		height: calc(100vh - 126px);
		background-image: url(../images/tesla-powerwall-top.jpg);
	}


	.powerwallPart .colorTitles {
	  left: 50%;
	  top: 2vh;
	  transform: translate(-50%, 0);
	  font-size: 1.8rem;
	}

	.productSectionBlack{
		padding: 50px 0 0 0;
	}

	.productSectionBlack_02{
		padding: 50px 0 20px 0;
	}

	#productContents p.whiteTitle,
	#productContents p.blackTitle
	  {
		font-size: 1rem;
	  width: 80%;
		line-height: 1.6;
	  position: relative;
	  justify-content: center;
	  text-align: center;
	}

	.colorTitles{
		display: flex;
		flex-direction: column;
		width: 95%;
		justify-content: center;
		align-items: center;
	}

	#productContents .kakaku{
		display: block;
		text-align: center;
		font-size: 2.5rem;
		font-weight: bold;
		margin-top: 10px;
		margin-bottom: 5px;
	}


	.powerwallPart img {
	  position: absolute;
	  left: 50%;
	  bottom: 30%;
		max-height: 70vh;
	  transform: translate(-50%, 50vh);
	}

	.showInquiry a{
		width: auto;
		top: calc(100vh - 10vh);
		left: 3%;
		font-size: 0.7rem;
		font-weight: bold;
		padding: 10px 4%;
		transform: translate(-3%, -2%);
		-webkit-transform: translate(-3%, -2%);
	}


	.showInquiry_02 a{
		width: auto;
		top: calc(100vh - 10vh);
		left: 3%;
		font-size: 0.7rem;
		padding: 10px 4%;
		transform: translate(-3%, -2%);
		-webkit-transform: translate(-3%, -2%);
	}

	#productContents p.productSplitTitle{
		font-size: 0.8rem;
	}

	#productContents p.SmartStarTenkiTitle{
		font-size: 0.8rem;
    	width: 40%;
}

	.blackPart .colorTitles .blackTitle,
	.blackPart .colorTitles .whiteTitle,
	.whitePart .colorTitles .blackTitle,
	.whitePart .colorTitles .whiteTitle,
	.blackPart_02 .colorTitles .blackTitle,
	.blackPart_02 .colorTitles .whiteTitle {
	  display: block;
	}

	.productSub{
		flex-direction: column;
	}

	.productSubPlan{
		width: 95%;
	}

	.showInquiry_03 a,
	.showInquiry_03_02 a{
		margin: 0 15px;
		width: auto;
		font-size: 0.7rem;
		position: relative;
		top: 10px;
		left: 0;
		transform: none;
		-webkit-transform: none;
		padding: 10px 20px;
	}


	.productSectionPhotoLeft{
		background-color: #fff;
		height: auto;
		width: 100%;
		padding: 0 0 50px 0;
		/*margin: 0 0 0 auto;*/
	}

	.productHead_25{
		font-size: 1.7rem;
		padding: 50px 20px 30px 20px;

	}

	.productSectionPhoto{
		width:100vw;

		background-size: contain;
		background-position: bottom;
		height: 100vh;
		max-height: 100%;
		min-height: 100%;
	}

	.productSectionPhotoVpp{
		width:100vw;
		background-size: contain;
		background-position: bottom;
		height: 100vh;
		max-height: 100%;
		min-height: 100%;
}


	.productSubSpec{
		font-size: 0.9rem;
	}

	.chikudenChart_02{
		width: 90%;
		font-size: 0.7rem;
	}

	.chikudenChart_02 .chikudenChartSub{
		font-weight: bold;
		font-size: 0.9rem;
	}

	.chikudenChart span{
		width: 95%;
	}




	/* ================================================================================================
		オンライン1023
	 =================================================================================================== */

	.App_50{
		width:80%;
		margin: 0 auto 50px auto;
	}


	/* ================================================================================================
		リンクカード
	 =================================================================================================== */



	.linkcard {
		margin: 15px auto;
		width: 90%;
	}

	.lkcTitleText{
	    font-size: 1.1rem;
	    line-height: 1.3rem;
	}



	/* ================================================================================================
	  トップコンテンツ640px
	 =================================================================================================== */


	 .card {
	   width: 47%;
	 }

	 /* ================================================================================================
 	  下部分固定問合せフォーム
 	 =================================================================================================== */





	 .footerToiawase {
		 position: fixed;
     text-align: center;
	   bottom: 0;
	   left: 0;
	   width: 100%;
		 justify-content:space-around;
	   background-color: rgba( 50, 50, 50, 0.8 );
	 	 z-index: 100;
	 }
	 .footerToiawaseWaku{
		padding: 10px 0;
	 	display: flex;

	 }

	 .footerToiawase .footerToiawaseInner {
	   width: 100%;
	   margin: 0px auto;
	   padding: 5px 10px;
	 }


	 .footerToiawaseTel {
	   /*background-color: #e64c9d;
	   -webkit-border-radius: 3px;*/
	   display: inline-block;
	   text-align: center;
	   text-decoration: none;
	   width: 90%;
	   padding: 5px;
	   font-size: 1.1rem;
	   color: #fff;
	 }

	 .footerToiawaseTel_02 {
		 /*background-color: #fff;
		 -webkit-border-radius: 3px;*/
		 display: inline-block;
		 text-align: center;
		 text-decoration: none;
		 width: 90%;
		 padding: 5px;
		 font-size: 1.1rem;
		 font-weight: bold;
		 color: #E5278B;
	 }

	 .footerToiawaseTel:link, .footerToiawaseTel:visited {
	   color: #FFFFFF !important;
	 }
	 .footerToiawaseInner .footerToiawaseTel span{

		 font-size: 0.9rem;
	 }
	 .footerToiawaseInner .footerToiawaseTel_02 span{

		 font-size: 0.9rem;
	 }


	 /* ================================================================================================
	   トップカウンター1023px～
	  =================================================================================================== */
		.topWord p.topWordTop{
			font-size: 2.0rem;
		}

		.topWord span{
			font-size: 5.0rem;
			line-height: 5.0rem;
		}
		.topWord p.topWordKabu{
			width:80%;
		}



.productSectionSmartstar{
    padding-bottom: 56.25%; 
}


 .productSectionSmartstar iframe{
  height:100%;

}


/* ================================================================================================
 トップカウンター1023px～
=================================================================================================== */


#newsinfo{
	width:80%;
}



}



/* ================================================================================================
  RESPONSIBLE CSS for smartphone & iphone 768px-641px browser size
 =================================================================================================== */
 @media screen and  (max-width:768px){


h1{
	/*display:none*/
}

header h1#topH_02{
	display: block;
	height:30px;
	line-height:30px;
	text-align:left;
	font-size:1.5em;
	font-weight: bold;
	margin:30px 15px 50px 15px;
}


header{
	width:100%;
}

header #headerWrap{
	width:64%
}

header #searchBox{
	width:34%
}

header #searchBox ul{
	width:98%;
	display:block;
	position:static
}

header #searchBox ul li{
	display:block;
	padding:0;
	background-position:55% 50%;

}

header #searchBox .searchBoxInner{
	position:relative;
	top:10px
}





/*
#menu{
	width:100%;
	margin:0 auto;
	background:#8F5A2F;
	border:1px solid red;
}

#menu li.sub{
	margin:0;
	width:100%;
	border:1px solid blue
}

#menu li.sub img{
	display:none
}

#menu li.sub ul{
	display:table;
	table-layout: fixed;
	width:100%;
	border:1px solid red;

}

#menu li.sub li.wd{
	background:#000099;
	display:table-cell;
	vertical-align:middle;
}

#menu li.sub li.wd a{

	width:100%;

}

#menu li.sub li.wd a:hover{
	background-color:#BCE2FF;
	color:#333
}

*/





#contents{
	max-width:100%
}



#wrapper{
	width:100%;
	margin:1em auto 0 auto

}

#main{
	width:60%;
	margin-left:0.5em
}

.photoInfo{
	float:none;
	text-align:center
}

.sougouphotoInfo{
	float:none;
}

.photoInfo img{
	width:100%
}

.sougouphotoInfo img{
	width:100%
}

.fadeinSentence{
	float:none;
}

.shortInfo{
	margin:0 0 10px 0;
	clear:left;
}

.jireiInfo{
	margin:0 0 4px 0;
	clear:left;
}

.jireishortInfo{
	margin:0 0 5px 0;
	clear:left;
}


/*
#newsBox{
	border:none;
}


#newsBox dl{
	border-bottom:1px dashed #ccc;
	margin:0 auto 10px auto
}

#newsBox dt{
	clear:left;
	float:left;
	width:120px;
	padding:0
}

#newsBox dd{
	padding:0;
	display:table-cell;
	margin-left:0;
	border:none;
}
*/


.topMainRead{
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	font-family:ＭＳ Ｐ明朝;
	color: #888;
	line-height : 2.0;
	margin:0 10px 0 10px;
}

#naliswrap{
	width:97%;

}

.nalisRead{
	-zoom:1;
	overflow:hidden;
	font-size:12px;
	font-family:ＭＳ Ｐ明朝;
	color: #888;
	line-height : 2.0;
	margin:0 10px 0 10px;
}


.toptitleright{
	margin-top:0px;
}

#pickup{
	margin-top:1em;
	width:100%;
}

#pickup #blogBox{
	width:100%;
}

#pickup #blogBox .blogBoxInner{
	padding:0;
	border:none
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase{
	height:120px;
	overflow:hidden;
	margin:0 10px 0 10px;
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl{
	width:96%;
	margin:0 auto 10px 10px;
	height:40px;
	border-bottom:1px #ccc dashed
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl dt{
	float:left;
	padding:0
}
#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl dd{
	float:none;
	display:table-cell;
	padding:0
}


#pickup #pickupContents{
	float:none;
	margin-top:1em;
	text-align:center

}


#wrapper #sideMenu{
	width:35%;
	margin-right:0.5em
}


#sideMenu ul li a{
	height:60px;
	line-height:60px
}


#footerTopArea{
	display:none
}

#footerBox{
	width:100%;
}

.footerMenuCase{
	float:none;
	margin:0;
	padding-right:0;
	border-left:none
}

.footerCompanyCase{
	float: none;
	margin:6em auto 0 15px;

}

#footerBox ul{
	margin-left:-24px;
	margin-right:6px;
	padding:0;
}

#footerBox ul li{
	height:36px;
	line-height:36px;
	margin:0;
	border-bottom:1px solid #999;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%;
	text-indent:1em;/*
	-webkit-box-shadow: 0 2px 4px -3px #000;
    -moz-box-shadow: 0 2px 4px -3px #000;
    box-shadow: 0 2px 4px -3px #000;
    -ms-box-shadow: 0 2px 3px -3px #000;*/
}

#footerBox ul li a{
	display:block;
	height:36px;
}

#footerBox ul li a:hover{
	background:#787878;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%;
}

address{
	width:92%;
	margin:0 auto;
	/*text-align:left;*/
	font-size:11px;
}
/*
address a{
	color:#ffff00;
}
*/
.imgAnimationShinchiku {
	color: #fff;
	margin:0;
}

.imgAnimationSougo {
    color: #fff;
	margin:0;
}

.imgAnimationSonota {
    color: #fff;
	margin:0;
}



/*--zerostyle page--*/


#pageTitle h2.pageTitleLong{
	font-size:90%
}

#pageContents h4{
	font-size:100%
}






/*--reform bath--*/


#pageContents ul{
	display:block;
	border:none;
	margin-top:1em;
}

#pageContents ul.sonotaZirei{
 display:table;
 table-layout: fixed;
 border:none;
 margin-bottom:5em;

}


#pageContents li{
	display:block;
}


#pageContents li.sonotaZireiLe{
	text-align: left;
	width: 100%;
	display: clear;
	margin-bottom: 20px;
}

#pageContents li.sonotaZireiRi{
	text-align: right;
	width: 100%;
	display: clear;
}


#pageContents li ul.photoTopic{
	display:block;

}

#pageContents li ul.photoTopic li.photoParts{
	display:block;
	width:100%;
	margin:0 auto;
	text-align:center;

}



#pageContents li ul.photoTopic li.photoCaption{
	display:block;
	float:left;
	width:100%;
	border-bottom:2px dotted #ccc;
	margin-bottom:1.2em;
}

#pageContents li ul.photoTopic li.photoCatch{
	display:block;
	float:left;
	width:100%;
}




#pageContents .brandImg{
	float:none;
	width:100%;
}

#pageContents .brandName{
	float:none;
	width:100%;
	height:30px;
	text-align:left;
}

#pageContents .brandName p{
	position:relative;
	top:10px;
}


/*--for realestate information--*/

#houseInfo #pickupInformation dl{
	width:96%;
	margin:1em auto;
	height:auto;
	border-bottom:1px dotted #C4B0A2;
	clear:left;
	overflow:hidden;
}


#houseInfo #pickupInformation .pickupInfoInner .priceSpace{
	float:none;
	width:65%;
}

#houseInfo #pickupInformation .pickupInfoInner .yearsBirth{
	float:none;
	width:100%;
	margin-bottom:6px;
}

.crossfaderPager li.sekoulmg a{
    width:15%;
}

.award{
	margin-top:200px;
	margin-bottom:30px;
}

#area table {
	width:100%;
	margin: 20px 0px 10px 0px;
}


/*=============================================
     TOP PAGE bxslider
==============================================*/


.bxslider{
	display: inline;
	padding: 0;
	margin: 0

}

.sekoujpleft{
	width:280px;
	font-size:12px;
	color:#666;
	float: left;
	padding:2px 8px 2px 8px
}


.sekoujp p img{
	margin-left:30px;
	margin-right:50px
}

.reformIcon{
	float:left;
	width:44%;
	margin:1px 23.5px 15px 0px;
}

/*=============================================
     価格カウンター
==============================================*/




.ctSougaku{
  margin:0;
  font:bolder 50px 'arial black','arial','メイリオ',sans-serif;
  color:#e55777;
  text-align:center;
  background:#fff;
  line-height:80px;

}


.ctBtn01{
  position : relative;
  left:0;
}

.ctBtn02{
  position : relative;
  left:0;

}

.ctBtn03{
  position : relative;
  left:0;
}


/* ================================================================================================
  住宅機器特別価格ページ
 =================================================================================================== */


 #koujigenba .tokkaToiawase{
 	width:90%;
 	font-size: 1.2em;
 }

 #koujigenba .tokkaMidashiUnder{
 	width: 90%;
 	font-size:1.1em;
 }

 #koujigenba .tokkaMidashiUnder02{
 	width: 90%;
 	font-size:1.2em;
 }

 #koujigenba .tokkaMidashiUnder03{
 	width: 100%;
 	font-size:1.6em;
 }

 #koujigenba .tokkaMidashi{
 	width: 80%;
 	font-size:2em;
 }

 #koujigenba .tokkaMidashi02{
 	font-size:1.6em;
 }

 #koujigenba .tokkaMidashi03{
	 font-size:1.6em;
 }

 #koujigenba .tokkaMidashi04{
	font-size:2em;
 }

 #koujigenba .tokkaMidashi05{
 	font-size:3em;
 }

 /* ================================================================================================
   営業スタッフ募集ページ
  =================================================================================================== */

 #koujigenba .oubo{
 	font-size:2em;

 }

 /* ================================================================================================
   工事コンテンツページ部分（写真画面フルサイズ）
  =================================================================================================== */


 #detailTop .detailText p{
 	font-size:calc(1.6em + 1.6vw);
 }

 #detailTopYane .detailText p{
  font-size:calc(1.6em + 1.6vw);
 }

 #detailTopBetakiso .detailText p{
	font-size:calc(1.3em + 1.3vw);
 }


 #detailTop{
	 width:100vw;
  	height: 60vh;
  	background-image: url(../images/tarflon-wood-top-1000.jpg);
  	background-position: center;
  	background-size: cover;
  	background-attachment: scroll;
 }

 #detailTop .detailText p{
	 transform: translate(-50%);
	 top:35%;
 }

 #detailTopYane{
 	width:100vw;
 	height: 60vh;
 	background-image: url(../images/yane-syousai-top03.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopYane .detailText p{
 	transform: translate(-50%);
 	top:35%;
 }

 #detailTopBetakiso{
 	width:100vw;
 	height: 60vh;
 	background-image: url(../images/betakiso-syousai-top-1000.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopBetakiso .detailText p{
 	transform: translate(-50%);
 	top:35%;
 }

 #detailTopTacdine{
	 width:100vw;
	 height: 60vh;
	 background-image: url(../images/tacdine-kisohokyo-top-1000.jpg);
	 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopNiwaConcrete{
	 width:100vw;
	 height: 60vh;
   background-image: url(../images/niwa-concrete-syousai-top-1000.jpg);
	 background-attachment: scroll;
 }

 #detailTopNiwaConcrete .detailText p{
	 transform: translate(-50%);
	 top:35%;
   font-size:calc(1.1em + 1.1vw);
 }

 #detailTopIh .detailText p{
	 transform: translate(-50%);
	 top:35%;
 }

 #detailTopIh{
	 width:100vw;
	 height: 60vh;
	 background-image: url(../images/ih-koukan-syousai-top-1000.jpg);
	 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopTacdine .detailText p{
	 transform: translate(-50%);
	 top:35%;
 }

 #detailTopMat{
	 width:100vw;
	 height: 60vh;
	 background-image: url(../images/choshitsu-mat-syousai-top-1000.jpg);
	 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopMat .detailText p{
	 transform: translate(-50%);
	 top:35%;
 }


 #detailTopHaikan{
 	width:100vw;
 	height: 60vh;
 	background-image: url(../images/ecocute-sansoukan-syousai-top-1000.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopHaikan .detailText p{
 	transform: translate(-50%);
 	top:35%;
 }

 #detailTopCorona{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/coronavirus-disinfection-top-1000.jpg);
	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopCorona .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopShiroari{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/shiroari-chosa-syoudoku-top-1000.jpg);
	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopShiroari .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopTv{
 	width:100vw;
 	height: 60vh;
 	background-image: url(../images/4k-campaign-top-1000.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopTv .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopSmartpv{
 	width:100vw;
 	height: 60vh;
 	background-image: url(../images/smartpv-multi-top-1000.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopSmartpv .detailText p{
	 transform: translate(-50%);
   top:35%;
 }


 #detailTopEcocute{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/ecocute-torikae-top-1000.jpg);
 	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopEcocute .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopRosyutsuhaikan{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/suidoukan-koukan-rosyutsuhaikan-top-1000.jpg);
	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopRosyutsuhaikan .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopOnlineMeeting{
	width:100vw;
  height: 40vh;
 	background-image: url(../images/online-meeting-top-1000.jpg);
	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopOnlineMeeting .detailText p{
	 transform: translatex(-50%);
   top:25%;
 }

 #detailTopKawaragalvalume{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/yane-galvalume-fukikae-kawara-top-1000.jpg);
	background-position: center;
 	background-size: cover;
 	background-attachment: scroll;
 }

 #detailTopKawaragalvalume .detailText p{
	 transform: translate(-50%);
   top:35%;
 }


 #detailTopEcocuteKosyouSyoujo{
 width:100vw;
	height: 60vh;
	 background-image: url(../images/ecocute-kosyou-syoujo-top-1000.jpg);
 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopEcocuteKosyouSyoujo .detailText p{
	transform: translate(-50%);
	 top:35%;
 }

 #detailTopTaiyoukoHiyouBaidenkakaku{
 width:100vw;
	height: 60vh;
	 background-image: url(../images/taiyouko-hiyou-baidenkakaku-top-1000.jpg);
 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopTaiyoukoHiyouBaidenkakaku .detailText p{
	transform: translate(-50%);
	 top:35%;
 }

 #topTesla{
 	height: calc(100vh - 126px);
 	background-image: url(../images/tesla-powerwall-top-1000.jpg);
	 background-attachment: scroll;
 }

 #detailTopSmartatar{
 width:100vw;
	height: 60vh;
	 background-image: url(../images/samartatar-pv-set-top.jpg);
 background-position: center;
	 background-size: cover;
	 background-attachment: scroll;
 }

 #detailTopSmartatar .detailText p{
	transform: translate(-50%);
	 top:35%;
 }

 #detailTopSmartatarHit{
 width:100vw;
 height: 60vh;
	background-image: url(../images/smartstar-hit-set-top.jpg);
 background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopSmartatarHit .detailText p{
 transform: translate(-50%);
	top:35%;
 }

 #topTeslaJirei{
	 width:100vw;
	 height: 60vh;
	 background-attachment: scroll;
 }

 #topTeslaJirei_02{
	 width:100vw;
	 height: 60vh;
	 background-attachment: scroll;
 }

 #detailTopYaneShikkui{
	width:100vw;
	height: 60vh;
	background-image: url(../images/yanekawara-mune-shikkui-hosyu-top-1000.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopYaneShikkui .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopYouhekiMizumore,
 #detailTopYouhekiBlockhei,
 #detailTopGAlvalumeCover,
 #detailTopDodomeYoheki{
	width:100vw;
 	height: 60vh;
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopYouhekiMizumore .detailText p,
 #detailTopYouhekiBlockhei .detailText p,
 #detailTopGAlvalumeCover .detailText p,
 #detailTopDodomeYoheki .detailText p
 {
	 transform: translate(-50%);
   top:35%;
 }


 #detailTopYukashitaShikkeKabi{
	 width:100vw;
  	height: 60vh;
 	background-image: url(../images/yukashita-shikke-kabi-taisaku-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopYukashitaShikkeKabi .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopYuhariDenai{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/furo-yuhari-denai-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopYuhariDenai .detailText p{
	 transform: translate(-50%);
   top:35%;
 }

 #detailTopKateiyoChikudenchi{
	width:100vw;
  height: 60vh;
 	background-image: url(../images/kateiyo-chikudenchi-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopKateiyoChikudenchi .detailText p{
	 transform: translate(-50%);
   top:35%;
 }


 #detailTopYokushitsuTilefuro{
	 width:100vw;
  	height: 60vh;
 	background-image: url(../images/yokushitsu-tilefuro-unitbath-top.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopYokushitsuTilefuro .detailText p{
	 transform: translate(-50%);
   top:35%;
 }


 #detailTopToilet, #detailTopToiletYukaKabe, #detailTopSs3Denki{
	 width:100vw;
  	height: 60vh;
	background-position: center;
	background-size: cover;
	background-attachment: scroll;
 }

 #detailTopToilet .detailText p, 
 #detailTopToiletYukaKabe .detailText p,
  #detailTopSs3Denki .detailText p{
	 transform: translate(-50%);
   top:35%;
 }
 


 /* ================================================================================================
	 オンライン732
	=================================================================================================== */

 .App_50{
	 width:100%;
	 margin: 0 auto 50px auto;
 }


 /* ================================================================================================
	 トップ帯お問合せ
	=================================================================================================== */




 .obiSecond{
 	font-size: 1.5rem;
 }


 /* ================================================================================================
	 スマートスターページ
	=================================================================================================== */


#kikagaku h1{
	font-size:1.8rem;
	margin-top: 15%;
	display:block;
	}

#kikagaku p{
	text-align:center;
	font-size:1.4rem;
	color:#ffffff;
	background: none;
	margin-top: 3%;
}

.svgTopLogo{
	margin-top: 5%;
}

#ContentBanner{
	width:100%;
}



.card{

  width: 270px;
}



/* ================================================================================================
 詳細ページトップ　769px～
=================================================================================================== */


#koujigenba .newsListWrapper .newsList .newsListItem h3{
    font-size: 100%;
}

#koujigenba .newsListWrapper .newsList .newsListItem p{
    font-size: 90%;
}



}



/* ================================================================================================
  RESPONSIBLE CSS for smartphone & iphone 640px-320 browser size
 =================================================================================================== */


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

h1{
	/*display:none*/
}

header{
	width:100%
}

header #topArea{
	width:100%;
	text-align:center
}

header #headerWrap{
	float:none;
	width:100%;
	margin:0 auto
}

header #searchBox{
	display:none
}

header #headerWrap #logoBox{
	float:none;
	width:100%;
	text-align:center;
	border-bottom:1px solid #ccc
}

header #headerWrap #logoBox img{
	width:25%;
	height:auto;
	margin-top:10px;
	margin-bottom:10px
}

header #headerWrap #phoneBox{
	float:none;
	width:100%;
	text-align:center;
	background:#3C3937;
	-webkit-box-shadow: 0 10px 2px -8px #bbb;
    -moz-box-shadow: 0 10px 2px -8px #bbb;
    box-shadow: 0 10px 2px -8px #bbb;
    -ms-box-shadow: 0 10px 2px -8px #bbb;
}

header #headerWrap #phoneBox img{
	width:45%;
	height:auto;
	margin-top:10px;
	margin-bottom:10px;
	background:#3C3937
}


.top_banner_all p.top_banner{
	width:90%;
	margin: 30px 10px 0 10px;
}

#inquiryContents .inquirytitle h4{
 font-size: 1.3em;
}
/*=============================================
     TOP PAGE bxslider
==============================================*/


.bxslider{
	display: inline;
	padding: 0;
	margin: 0
}


.sekoujpleft{
	width:100%;
	font-size:12px;
	color:#666;
	float: left;
	padding:2px 8px 2px 8px

}


.sekoujp p img{
	margin-left:30px;
	margin-right:50px
}






/*-------------------------------------
　menuの設定
------------------------------------*/




#menu {
	position:absolute;
	top:0;
	left:0;
	width:99%;
	padding:0;
	margin:0 auto;
	background-color: transparent;
	height:90px;
	line-height:90px;
	margin-bottom:7px;
}

#menu ul {
	position:absolute;
	left:-9999px;
	width:100%;
	height:auto
}


/*--ナビボタンの位置--*/
#menu li {
	float:right;
	margin:0;
}


/*--ナビボタンの背景色--*/
#menu li.sub {
	background:#000;
	width:100%;
}

#menu li.menuBoxSub img {
	width:50px;
}


/*--ナビボタン表示on/off--*/
#menu li.sub img{
	display:inline;
	position:absolute;
	top:0;
	right:0;
	z-index: 11;
	margin-top: 15px;
}


#menu li.sub ul{
	text-align:center;
	display:block;
	table-layout:auto;
	width:100%;
	position:absolute;
	z-index:2;

}




#menu li, #menu li a{
	display:block;
	color:#111111;
	font-size:12px;
	line-height:40px;
/*	width:100px; */
	text-decoration:none;
	text-align:center;
	cursor:pointer;
	font-weight:bold;


}


#menu li.sub ul li.wd:first-child{
	border-left:none
}

#menu li.sub ul li.mt:first-child{
	border-left:none
}


#menu li.sub ul li.wd{
	display:block;
    background:#000;
    border-right:none;
    border-bottom:none;
    width:100%;
}

#menu li.sub ul li.mtleft{
	display:block;
    border-right:none;
    border-bottom:none;
    width:100%;
	text-align:center;
}

#menu li.sub ul li.mt{
	display:block;
    border-right:none;
    border-bottom:none;
    width:100%;
	text-align:center;
}


#menu li.sub li.wd{
	float:none;
	max-width:96%;
	border:none;
	margin:0 auto;
	background:#212121;
    filter:alpha(opacity=85);
    -moz-opacity:0.85;
    -khtml-opacity: 0.85;
    opacity:0.85;
}


menu li.sub li.mtleft{
	float:none;
	max-width:96%;
	border:none;
	margin:0 auto;
	background:#212121;
    filter:alpha(opacity=85);
    -moz-opacity:0.85;
    -khtml-opacity: 0.85;
    opacity:0.85;
}

#menu li.sub li.mt{
	float:none;
	max-width:96%;
	border:none;
	margin:0 auto;
	background:#212121;
    filter:alpha(opacity=85);
    -moz-opacity:0.85;
    -khtml-opacity: 0.85;
    opacity:0.85;
}


#menu li.wd, #menu li.wd a{
	width:100%;
	border-bottom:1px solid #000
}





#menu li.sub ul li.wd a{
	margin:0;
	color:#fff;
	background:#333;
	border:1px solid #000;
}


#menu li:hover{
	background:#000;/*カーソルonの色*/
    /*color:#ffffff;*/
}

#menu li.sub ul li a{
    color:#fff;
}

#menu li.sub ul li a:hover{
	background:#000;/*カーソルonの色*/
    color:#fff;
	border-bottom:1px solid #000
}




#menu li.click {
	background:#111111;/*メニュー背景*/
    color:#ffffff;
}
#menu li.click ul{
	position:absolute;
	left:0;
	top:80px;/*メニュー表示位置*/
}


/*-------------------------------------
　ここまで
------------------------------------*/



/*--contents area for Toppage--*/

#contents{
	width:100%;
	margin:1em auto 2em auto
}

/*--toppage photo--*/
section{
	width:90%;
	margin:0 auto;
	/*border-bottom:none;*/
	border:none;

}

#contents section p img{
	width:100%;
	height:auto
}

#wrapper{
	margin:0 auto
}

/*--sidemenu--*/
#wrapper #sideMenu{
	float:none;
	width:90%;
	margin:0 auto;
}


#sideMenu .sideTopNav{
	margin-bottom:1em;
	text-align:center
}
#sideMenu .sideTopNav2{
	margin-bottom:0.1em;
	text-align:center
}
/*追加*/
#sideMenu .sideTopNav img{
	width:100%
}
#sideMenu .sideTopNav2 img{
	width:100%
}

#sideMenu .subInfo{
	border:1px solid #ccc;
	width:100%;
	padding:0
}

#sideMenu ul{
	margin-top:0
}

#sideMenu ul li:last-child{
	border-bottom:none
}

#sideMenu ul li{
	margin-bottom:0;
	font-size:90%;
	text-align:left;
	text-indent:1.4em;
	border:none
}

#sideMenu ul li a{
	border-left:6px solid #7f7f7f;
	border-bottom:1px solid #CDC0C0;
	display:block;
	height:50px;
	line-height:50px;
	background-color:#fff;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%
}

#sideMenu ul li a:hover{
	border-left:6px solid #dc4e4e;
	background:#f1f1f1;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%
}



/*--main contents for TOPPAGE--*/

#main{
	float:none;
	width:100%;
	margin-left:0
}

/*--realestate infomation--*/
.topwrap{
	margin-right:0;
	margin-top:1em
}
.photoInfo{
	float:left;
}
.openBoxLeft{
	width:100%;
	padding:6px 1px 2px 1px;
	clear:left;
}

.openBoxCenter{
	width:100%;
	padding:6px 1px 2px 1px;
	clear:left;

}

.openBoxRight{
	width:100%;
	padding:6px 1px 2px 1px;
	margin:1px 0px 2px 0px;
	clear:left;
}
.sekoujireiBoxLeft{
	width:100%;
	padding:6px 1px 2px 1px;
	clear:left;
}

.sekoujireiBoxCenter{
	width:100%;
	padding:6px 1px 2px 1px;
	clear:left;
}

.sekoujireiBoxRight{
	width:100%;
	padding:6px 1px 2px 1px;
	clear:left;

}
/*-------------------------------------
　2016.2.18 640px-320size
------------------------------------*/


#banner h3,
#ContentBanner h3{
	font-size:125%;
	padding:15px 0px 5px 0px;
}



.bannerBoxLeft{
	float:none;
	width:100%;
	margin:6px auto 40px auto;
	text-align: center;
  height: auto;
}

#banner .bannerSentence{
	font-size:95%;
	padding: 0px 0px;
}

#banner .bannerSentence_sb{
	font-size:100%;
	padding: 30px 0px;
}

#banner .bannerSentence_fb{
	font-size:100%;
	padding: 30px 0px;
}

#banner .bannerSentence_cn{
	font-size:100%;
	padding: 30px 0px;
}

.bannerBoxLeft img{
	width:100%;
}

.bannerBoxCenter{
	width:100%;
	margin:6px 1px 50px 0px;
	clear:left;
	text-align: center;
	border:none;

}

.bannerBoxRight{
	width:100%;
	margin:6px 1px 50px 0px;
	clear:left;
	text-align: center;
	border:none;

}


.photoInfo{
	float:left;
	text-align:center
}

.sougouphotoInfo{
	float:none;
	width:100%;
}

/*追加*/
.photoInfo a img{
	width:100%;
}

.sougouphotoInfo img{
	width:100%;
}

.shortInfo{
	padding-left:2px;

}

.shortInfo img{
	float:left;
	clear:both
}



.jireiInfo{
	margin:0 0 5px 0;
	clear:left;
}

.jireishortInfo{
	margin:0 0 5px 0;
	clear:left;
}

.jireiInfo ul.jireiicon{
    padding:0 0 30px 0;
}

.openBoxAll{
   width:97%;
   padding:6px 1px 2px 1px
}

.eventBoxAll{
    width:98%
    padding:6px 2px 2px 2px;
}

.osusumeDetail{
	text-align:center
}

.imgAnimationShinchiku {
	color: #fff;
	clear:left;
	margin:0 2px 25px 0;
}

.imgAnimationSougo {
    color: #fff;
	clear:left;
	margin:0 2px 25px 0;
	width:220px;
}

.imgAnimationSonota {
    color: #fff;
	clear:left;
	margin:0 2px 25px 0;
	width:220px;
}


.fadeinSentence{
	clear:none;
}

/*--news for TOP PAGE --*/
#newsinfo{
	margin-top:1em
}
/*
#newsBox{
	font-size:12px;
	border:none;
}


#newsBox dl{
	width:96%;
	height:60px;
	margin:0 auto 20px auto;
	border-bottom:none
}



#newsBox dt{
	float: none;
	padding:0;
}

#newsBox dd{
	float: none;
	padding:0;
	border-bottom:1px #ccc dashed

}

#newsBox dd a{
	color:#2b2bd5
}

#newsBox dd a:hover{
	color:#FC5C0D;
	text-decoration:underline
}
*/
/*--staff blog--*/

#pickup{
	margin-top:1em
}

#pickup #blogBox{
	float:none;
	width:100%
}

#pickup #blogBox .blogBoxBar{
	padding-bottom:2px
}

#pickup #blogBox .blogBoxInner{
	border:none
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase{
	height:148px;
	font-size:12px;
	overflow:hidden
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl{
	margin:0 auto 15px auto;
	height:36px;
	border:none
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl dt{
	float:none
}

#pickup #blogBox .blogBoxInner .blogBoxInnerCase dl dd{
	float:none;
	border-bottom:1px #ccc dashed
}

#pickup #pickupContents{
	float:none;
	width:100%;
	margin-top:20px;
	text-align:center
}




/*--common footer area --*/

#footerTopArea{
	display:none
}

#footerBox{
	width:100%;
}

.footerMenuCase{
	float:none;
	margin:0;
	padding-right:0;
	border-left:none
}



#footerBox ul{
	margin-left:-24px;
	margin-right:6px;
	padding:0;
}

#footerBox ul li{
	height:36px;
	line-height:36px;
	margin:0;
	border-bottom:1px solid #999;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%;
	text-indent:1em;
	/*-webkit-box-shadow: 0 2px 4px -3px #000;
    -moz-box-shadow: 0 2px 4px -3px #000;
    box-shadow: 0 2px 4px -3px #000;
    -ms-box-shadow: 0 2px 3px -3px #000;*/
}

#footerBox ul li a{
	display:block;
	height:36px;
}

#footerBox ul li a:hover{
	background:#787878;
	background-image:url(../images/arrow2.png);
	background-repeat:no-repeat;
	background-position:90% 50%;
}

address{
	width:92%;
	margin:0 auto;
	/*text-align:left;*/
	font-size:11px;
}
/*
address a{
	color:#ffff00;
}
*/
/*----*/

small{
	font-size:11px;
}

smallatt{
	font-size:11px;
	font-color:#ccc;
}

.attn{
	font-weight:bold;
	color:#ff0000;
	font-size:12px;
}





/*--sitemap--*/
#sitemapContents .cateSub ul li a{
	border:1px dotted #f3f3f3;
	display:block;
}

#sitemapContents .cateSub ul li a:hover{
	background:#e1e1e1
}

/*--recruit page--*/

#saiyoBox .saiyoBoxInner ul li a{
	display:block
}



/*--For each page --*/
#pankuzu{display:none}

/*--zerostyle page--*/


#pageTitle h2.pageTitleLong{
	font-size:80%
}
/*
#pageContents h2{
	font-size:100%
}
*/

#pageContents h4{
	font-size:90%
}

#pageContents h4.subTitleLong{
	margin-bottom:1.4em;
	font-size:80%;
	text-indent:0.2em;
	height:20px;
	line-height:20px;
	padding-bottom:20px
}



#kanren dl dd{text-indent:1.4em;font-size:90%;}

.mlarge{
	font-size:100%;
	font-weight:bold
}

.attnBd{
	font-weight:bold;
	font-size:100%
}

#pageContents .mainRead p{font-size:90%;line-height:1.6}
#pageContents h3{font-size:100%;}


/*--REFORM--*/










/*--for realestate information 640-320--*/


#houseInfo #bukken{
	height:auto
}

#houseInfo #bukken p.bukkenDetails{
	float:none;
}

#houseInfo #bukken h3{
	font-size:80%;
	-zoom:1;
	overflow:hidden
}



#houseInfo #pickupInformation .pickupInfoInner .priceSpace{
	width:100%;
}



/*--openhouse--*/
#houseInfo h2.openHouseTitle{
	font-size:100%;
}



/*--flow--*/
#houseInfo h3.chart{
	font-size:82%;
}

#houseInfo h3.chart img{
	width:42px;
	height:auto;
}

.jireiInfo{
	padding-bottom:1px;
	padding-top:1px;

}

.homes-banner img{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom; 20px;
	width:95%;
}

#example {
	height:400px;

}

.reformIcon{
	float:left;
	width:43%;
	margin:1px 23.5px 15px 0px;
}




#inquiryContents h2{
	font-size:1.6em;
}

#inquiryContents h4{
	font-size:1.6em;
}

.ftCenterText{
	text-align:center;
	margin:50px 10px 0 10px;
}

.ftCenterText_so{
	text-align:center;
	margin:50px 10px 10px 10px;
}

/*=============================================
     価格カウンター
==============================================*/

#ctPrice dl dt{
  font:bolder 25px 'arial black','arial','メイリオ',sans-serif;
  padding:0 14px;
  line-height:60px;
}

.ctSougaku{
  font:bolder 37px 'arial black','arial','メイリオ',sans-serif;
  line-height:60px;

}

#ctPrice{
  width:98%;
}

_::-webkit-full-page-media, _:future, :root #ctPrice {
    width:98.5%;
}




/* ================================================================================================
  住宅機器特別価格ページ
 =================================================================================================== */



#koujigenba .tokkaMidashiUnder{
 width: 90%;
 font-size:2em;
}

#koujigenba .tokkaMidashiUnder02{
 width: 90%;
 font-size:2em;
}

#koujigenba .tokkaMidashiUnder03{
 width: 100%;
 font-size:3.6em;
 	margin: 30px auto 30px auto;
}

#koujigenba .tokkaMidashi05{
 font-size:3.4em;
}


#koujigenba ul.tokkaicon li{
	font-size:1.4em;
	padding:15px 10px;


}


/* ================================================================================================
  消毒のページ
 =================================================================================================== */


 #koujigenba .chosa_dai{
	 font-size: 1.6em;
	 color: #f27c71;
   font-weight: bold;
	 margin: 10px 0 40px 10px;
 }

 #koujigenba .chosa_dai02{
	 font-size: 1.2em;
	 color: #777;
   font-weight: bold;
	 margin: 50px 0 0 20px;
	 line-height: 1;
 }

 #koujigenba .chosa_sen{
	font-size: 1em;
	color: #777;
	margin: 5px 40px;
	line-height: 1.2;
 }

 #koujigenba .chosa_photo{
	 float: left;
	 margin: 0;
 }




 /* ================================================================================================
	 協和ハウスロゴpathの部分
	=================================================================================================== */


#sv_logo{
 position: absolute;
 top: 10px;
 left: 10px;
 z-index: 12;
}



/* ================================================================================================
  工事コンテンツページ部分（写真画面フルサイズ）
 =================================================================================================== */


#detailTop .detailText p{
	font-size:calc(1.3em + 1.3vw);
	top:45%;
}

#detailTopYane .detailText p{
 font-size:calc(1.3em + 1.3vw);
 top:45%;
}

#detailTopBetakiso .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopTacdine .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopNiwaConcrete .detailText p{
	font-size:calc(0.95em + 0.95vw);
  top:45%;
}

#detailTopIh .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopMat .detailText p{
 font-size:calc(1.3em + 1.3vw);
 top:45%;
}

#detailTopHaikan .detailText p{
 font-size:calc(1.3em + 1.3vw);
 top:45%;
}

#detailTopCorona .detailText p{
 font-size:calc(1.3em + 1.3vw);
 top:45%;
}

#detailTopShiroari .detailText p{
 font-size:calc(1.3em + 1.3vw);
 top:45%;
}

#detailTopTv .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopSmartpv .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopEcocute .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopRosyutsuhaikan .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopYaneShikkui .detailText p{
	font-size:calc(1.2em + 1.2vw);
  top:45%;
}

#detailTopYouhekiMizumore .detailText p,
#detailTopYouhekiBlockhei .detailText p,
#detailTopGAlvalumeCover .detailText p,
#detailTopDodomeYoheki .detailText p
{
	font-size:calc(1.1em + 1.1vw);
  top:40%;
}

#detailTopYukashitaShikkeKabi .detailText p{
	font-size:calc(1.2em + 1.2vw);
  top:45%;
}

#detailTopYuhariDenai .detailText p{
	font-size:calc(1.2em + 1.2vw);
  top:45%;
}

#detailTopKateiyoChikudenchi .detailText p{
	font-size:calc(1.2em + 1.2vw);
  top:45%;
}

#detailTopYokushitsuTilefuro .detailText p{
	font-size:calc(1.1em + 1.1vw);
  top:45%;
}

#detailTopToilet, #detailTopToiletYukaKabe, #detailTopSs3Denki .detailText p{
	font-size:calc(1.1em + 1.1vw);
  top:45%;
}

#detailTopOnlineMeeting .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:35%;
}

#detailTopKawaragalvalume .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}

#detailTopEcocuteKosyouSyoujo .detailText p{
 font-size:calc(1.2em + 1.2vw);
 top:45%;
}


/* ================================================================================================
  トップスライダー　Flickity
 =================================================================================================== */


.topSlideText p{
	width: 600px;
	font-size: 0.7em;
}

.topSlideText h3{
	font-size: 1.7em;
}

.topSlideTextLong p{
	width: 600px;
	font-size: 0.7em;
}

.topSlideTextLong h3{
	font-size: 1.3em;
}



/* ================================================================================================
  トップページ　新デザイン
 =================================================================================================== */


.top-content-back{
		clip-path:polygon(0 1%,100% 0,100% 100%,0 100%);
		-webkit-clip-path: polygon(0 0.3%,100% 0,100% 100%,0 100%);
		-ms-clip-path: polygon(0 0,100% 0,100% 90%,0 100%);
}



/* ================================================================================================
  テレビプレゼントキャンペーン
 =================================================================================================== */


.tv-taisyo{
		font-size: 1.5em;
}



/* ================================================================================================
  テスラページ
 =================================================================================================== */

 #topTesla{
 	height: calc(100vh - 63px);
	background-image: url(../images/tesla-powerwall-top-02.jpg);
	background-position: left;
 }




 .topTeslaLogo{
 	position: absolute;
 	left:3%;
	width:40%;
 }

 .topTeslaLogo_02{
 width:40%;
 }

 #LeftBox .LeftBoxLogoJhs img{
  width: 110px;
 }

 #LeftBox .LeftBoxLogo img{
  width: 150px;
 }

 #productContents .productSectionSub p{
 	font-size: 0.8rem;
 	line-height: 2;
 }

 #RightBox .RightBoxLogoJhs img{
 	width: 100px;
 }

 #RightBox .RightBoxLogo img{
	width: 140px;
	top: 45px;
 }

.powerwallPart {
  width: 100%;
  height: 100vh;
  position: absolute;
  overflow: hidden;
  font-size: 2rem;
}

.powerwallPart .colorTitles {
  left: 50%;
  top: 2vh;
  transform: translate(-50%, 0);
  font-size: 1.8rem;
}

.topTeslaLogo p{
	font-size: 0.65rem;
	padding: 10px 2px;
	width: 98%;
}

.topTeslaLogo_02 p{
	font-size: 0.65rem;
	padding: 10px 2px;
	width: 98%;
}




#productContents p.whiteTitle,
#productContents p.blackTitle
  {
	font-size: 0.8rem;
  width: 100%;
	line-height: 1.6;
  position: relative;
  justify-content: center;
  text-align: center;
}

.colorTitles{
	display: flex;
	flex-direction: column;
	width: 95%;
	justify-content: center;
	align-items: center;
}


.powerwallPart img {
  width: calc(13rem + 20vw);
  position: absolute;
  left: 50%;
  bottom: 30%;
	max-height: 70vh;
  transform: translate(-50%, 60vh);
}

.productHead_1{
	font-size: 1.5rem;
}

.productHead_02{
	font-size: 1.5rem;
}

.productSection{
	margin: auto;
	width:95%;
}

.productSectiongray_01{
	width: 95%;
	margin: 50px auto;
}

.productSectionOnline{
	width: 95%;
	margin: 50px auto;
}

.productSectionGray{
	width: 95%;
	padding: 50px 0;
}


#productContents .productSectionTop p{
 font-size: 0.9rem;
 line-height: 1.6;
}

#productContents .kakakuTop{
	font-size: 1.2rem;
	margin-top: 10px;
}

#productContents .kakakuMiddle{
	font-size: 2.5rem;
	margin-top: 5px;
	margin-bottom: -15px;
}

#productContents .kakakuMiddle_02{
	font-size: 0.8rem;
	margin-top: 5px;
}


#productContents .kakakubotm{
	font-size: 1rem;
	margin-top: 2px;
}

#productContents .kakaku{
	font-size: 2.5rem;
	margin-top: 2px;
}


.showInquiry a{
	width: 40%;
	position: absolute;
	top: calc(100vh - 47vh);
	left: 50%;
	font-size: 0.8rem;
	font-weight: bold;;
	padding: 10px 5%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}


.showInquiry_02 a{
	width: 40%;
	top: calc(100vh - 47vh);
	left: 50%;
	font-size: 0.8rem;
	padding: 10px 5%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}




.productSub_02{
	flex-direction: column;
}

.productSubPlan{
	width: 100%;
}

#productContents p.productSplitTitle{
	font-size: 0.7rem;
	width: 70%;
}

#productContents p.SmartStarTenkiTitle{
    width: 70%;
}

.productSub_50{
	width: 100%;
	margin-bottom: 20px;
}

.InquiryFlowBox{
	margin: 10px 5px 0 5px;
	width:47%;

}

#productContents .InquiryFlowBox h4{
	font-size: 1rem;
	font-weight: bold;
	margin: 1em 0 0 0;
	padding: 0 5px;
}

#productContents .InquiryFlowBox p{
	font-size: 0.8rem;
	margin: 1em 0 0 0;
	padding: 0 5px;
	line-height: 1.5;
}

.productHead_02Mov {
position: relative;
width: 100%;
padding: 20px 0 50%;
}



.productSectionPhoto{
	width:100vw;
	background-image: url(../images/tesla-powerwall-nihonkaoku_02.jpg);
	background-size: contain;
	background-position: bottom;
	height: 110vh;
	max-height: 100%;
	min-height: 100%;
}


#frontArea_02{
	padding:0;

}

.illust70{
	padding: 5px 0;
}

.illust80{
	width: 95%;
	margin: auto;
	padding: 5px 0;
}

/* ================================================================================================
  トップスライダー640px
 =================================================================================================== */


.details{
	display: block;
	font-size: 0.6rem;
  width:90px;
  height:25px;
	line-height: 25px;
  text-align: center;
	margin: auto;
	color: #eee;
  background-color: transparent;
  border: 2px solid #eee;
  border-radius: 25px;
	margin: 35px auto;
	transition: all 0.5s;
	animation: topslide 1s ease 0.6s forwards ;
}

.details:hover{
  background-color: #fff;
  border: 2px solid #fff;
	color: #555;
}

/* ================================================================================================
  トップメニュー640px
 =================================================================================================== */



.topSlideText02 h3{
	width: 600px;
	font-size: 1.8em;

}

#navArea{
	display: flex;
}












 /* ================================================================================================
   トップカウンター640px
  =================================================================================================== */

	.topWord span{
		font-size: 4.0rem;
	}
	.topWord p.topWordKabu{
		width:85%;
	}



 /* ================================================================================================
   スマートスターページ640
  =================================================================================================== */


 #productContents p.SmartStarTenkiTitleSub{
 	font-size: 0.8rem;
 	line-height: 1.4;
 }




#kikagaku h1{
	font-size:1.4rem;
	margin-top: 20%;
	display:block;
	}

#kikagaku p{
	font-size:1.1rem;
	color:#ffffff;
	background: none;
	margin-top: 5%;
}

.svgTopLogo{
	margin-top: 5%;
	width: 70%;
}


#kikagaku{
  background-image:  url(../images/jinkouchinou-top.png), url(../images/smartstar-kikagaku.png);
  background-size: 50%, 60%;
  background-position: left 50% top 45%, bottom;

}


.productSmartStar_01{
	width:90%;

}


 /* ================================================================================================
   コンテンツ一覧640
  =================================================================================================== */


.contentsListItemSen{
	display: grid;
	grid-template-columns: 150px 1fr;
	grid-template-rows: 20% 80%;
	gap: 20px 20px;
	margin: 20px 0;
}

}

/* ================================================================================================
  RESPONSIBLE CSS for smartphone & iphone 413px-320 browser size
 =================================================================================================== */


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

#inquiryContents h2{
	font-size:1.4em;
}

#inquiryContents h4{
	font-size:1.4em;
}



/*=============================================
     価格カウンター
==============================================*/


.label-checkbox{
  font-size:80%;
}

.ctCbox:before{
  top:9px;
}

_::-webkit-full-page-media, _:future, :root .ctCbox:before {
  top:8px;
}

.ctboxSideTop{
 margin:20px 0 0 0;

}

.ctboxSide{
 margin:0px;
}

.ctboxSide02{
 margin:0px;
}

#ctPrice{
  width:96%;
}

_::-webkit-full-page-media, _:future, :root #ctPrice {
    width:97%;
}

#ctPrice dl dt{
  font:bolder 30px 'arial black','arial','メイリオ',sans-serif;
  color:#fff;
  float:none;
  text-align:center;
  padding:0 20px;
  vertical-align:middle;
  background:#e55777;
  line-height:60px;

}

.ctSougaku{
 	width:100%;
 	margin:0;
 	font:bolder 35px 'arial black','arial','メイリオ',sans-serif;
 	color:#e55777;
 	border:solid 1px #e55777;
	text-align:center;
 	background:#fff;
}

/* ================================================================================================
  消毒のページ
 =================================================================================================== */

 .shiroari_chosa{
	width:95%;
 }

 .shiroari_waku{
	 padding:2px 0 20px 0;
 }

 #koujigenba .chosa_dai{
	 font-size: 1.2em;
	 margin: 10px 0 40px 10px;
 }

 #koujigenba .chosa_dai02{
	 font-size: 1em;
	 margin: 50px 0 0 0px;
 }

 #koujigenba .chosa_sen{
	font-size: 1em;
	margin: 5px 20px;
 }

 /* ================================================================================================
   営業スタッフ募集ページ
  =================================================================================================== */

 #koujigenba .oubo{
 	font-size:1.5em;

 }






}

 /* ================================================================================================
   テスラ 320px
  =================================================================================================== */

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

 #productContents .kakakuTop{
 	font-size: 1rem;
 	margin-top: 10px;
 }

 #productContents .kakakuMiddle{
 	font-size: 2rem;
 	margin-top: 0;
 	margin-bottom: -15px;
 }

 #productContents .kakakuMiddle_02{
 	font-size: 0.7rem;
 	margin-top: 5px;
 }


 #productContents .kakakubotm{
 	font-size: 0.8rem;
 	margin-top: 0;
 }

 #productContents .kakaku{
 	font-size: 1.5rem;
 	margin-top: 2px;
 }

 #productContents p.whiteTitle,
 #productContents p.blackTitle
   {
 	font-size: 0.6rem;
 	line-height: 1.6;
 }

 .showInquiry a{
	width: 35%;
  font-size: 0.6rem;
  padding: 5px 5%;
 }

 .showInquiry_02 a{
 	width: 35%;
 	font-size: 0.6rem;
 	padding: 5px 5%;
 }

 .powerwallPart img {
   width: calc(13rem + 20vw);
   position: absolute;
   left: 50%;
   bottom: 0;
   max-height: 90vh;
   transform: translate(-50%, 50vh);
 }

 .productHead_1{
 	font-size: 1.2rem;
 }

 #productContents .productSectionTop p{
 	font-size: 0.7rem;
 	line-height: 1.6;
 }

 .productHead_25{
 	font-size: 1.2rem;
 	padding: 30px 20px 20px 20px;
 }

 .productSectionPhoto{
 	width:100vw;
 	background-image: url(../images/tesla-powerwall-nihonkaoku_03.jpg);
 	background-size: contain;
 	background-position: bottom;
 	height: 120vh;
 }

 #productContents .productSectionPhotoLeft p{
	 font-size: 0.7rem;
	 line-height: 1.6;
 }

 .productHead_02{
 	font-size: 1.2rem;
 }

 #productContents .productSectionSub p{
	font-size: 0.7rem;
	line-height: 1.6;
 }

 #productContents .productSubTitle{
 	font-size: 1rem;
 	margin: 0;
	padding: 0 15px;
 }

 #productContents .productSubPlan p{
 font-size: 0.7rem;
 line-height: 1.6;
 }

 #productContents p.productSplitTitle{
 	font-size: 0.6rem;
 	width: 70%;
 }




 .productSubSpec{
	 font-size: 0.7rem;
 }

}


@media screen  and (orientation:landscape) and (max-width: 926px){

	.powerwallPart .colorTitles {
	  position: absolute;
	  left: 25%;
	  top: 5vh;
	  transform: translate(-50%, 0);
	  font-size: 1.8rem;
	}

	.colorTitles {
	  width:40%;
	}

	.powerwallPart img {
		max-height: 115vh;
	  position: absolute;
	  left: 70%;
	  bottom: 30%;
	  transform: translate(-50%, 50vh);
	}

	#productContents p.whiteTitle,
	#productContents p.blackTitle
	  {
		font-size: 0.7rem;
	  width: 95%;
		line-height: 1.6;
	  position: relative;
	  justify-content: center;
	  text-align: center;
	}

	#productContents .kakakuTop{
		font-size: 1rem;
		margin-top: -10px;
	}

	#productContents .kakakuMiddle{
		font-size: 2rem;
		margin-top: 5px;
		margin-bottom: -15px;
	}

	#productContents .kakakuMiddle_02{
		font-size: 0.8rem;
		margin-top: 5px;
	}


	#productContents .kakakubotm{
		font-size: 0.7rem;
		margin-top: 2px;
	}

	#productContents .kakaku{
		font-size: 2rem;
		margin-top: 2px;
	}

	.showInquiry a{
		width: auto;
		left: 50%;
		top: calc(100vh - 17vh);
		font-size: 0.8rem;
		font-weight: bold;;
		padding: 10px 10%;
		transition: all 0.5s 0s ease;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
	}


	.showInquiry_02 a{
		width: auto;
		left: 50%;
		top: calc(100vh - 17vh);
		font-size: 0.8rem;
		font-weight: bold;;
		padding: 10px 10%;
		transition: all 0.5s 0s ease;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
	}



	#productContents .InquiryFlowBox h4{
		font-size: 0.9rem;
		font-weight: bold;
		margin: 1em 0 0 0;
		padding: 0 15px;
	}

	#topTesla{
		width:100%;
		width:100vw;
		height: 85vh;
		background-image: url(../images/tesla-powerwall-top-1000.jpg);
		background-attachment: scroll;
		background-repeat: no-repeat;
	}


	.topTeslaLogo{
	 position: absolute;
	 left:3%;
	 width:20%;
	}

}


/*641px～PC　PC上では見えないようにする*/
@media screen and (min-width:1024px){
 .footerToiawase{
	 display: none;
}
}
