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

body { line-height:1.5;font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }



span.futo{font-weight:bolder}

#s01{

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
	position:relative;
}
#map  {
position: relative;
/*padding-bottom: 20%; */
padding-bottom:340px; // これが縦横比
height: 0;
overflow: hidden;
}
#map iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}


.filtr-item {
    padding: 1rem;
}
.item-desc {
	color: #000;
}



#map_canvas_01, #map_canvas_02, #map_canvas_03 {
    width:350px;
    min-height: 500px;
}

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 5000;
}





@media only screen and (min-width: 769px) {
	/*　画面 横向き　*/
.smp_only{display:none}



.heater{
	position:absolute;
	top:0;
	width:100%;
	background:#FFF;
	height:60px;
}

.heat_area{
	width:100%;
	height:60px;
	margin:0 auto;
	padding:0;
}

.logo{
	width:125px;
	float:left;
	padding:18px 0 15px 20px;
}

ul.pc_menu{
	list-style:none;
	float:right;
	height:25px;
	padding:15px 0 0 0;
}

ul.pc_menu li{
	float:left;
	padding:20px 25px 0 0;
}

ul.pc_menu li.top{	width:28px; height:13px}
ul.pc_menu li.works{width:54px; height:13px}
ul.pc_menu li.owners{width:134px; height:13px}
ul.pc_menu li.reform{width:69px; height:13px}
ul.pc_menu li.after{width:49px; height:13px}
ul.pc_menu li.topix{width:44px; height:13px}
ul.pc_menu li.company{width:73px; height:13px}
ul.pc_menu li.contact{width:69px; height:13px}


ul.pc_menu li.sikiri{
	padding:0 20px;
	height:25px;
}

	

.pc_footer{
	position:absolute;
	bottom:0;
	width:99%;
	height:25px;
	font-size:10px;
	padding:15px 1% 0 0;
	background:#FFF;
	text-align:right;
}

.page_footer{
	width:100%;
	padding:60px 0 50px 0;
	text-align:center;
	color:#CCC;
	border-top: 1px #D8D7D7 solid;
	clear:both
}

.page_footer_navi{width: 560px; margin: 0 auto; padding: 20px 0 40px 0; text-align: center}
.page_footer_navi li.fnavi{ float: left; padding: 10px 25px 0 0;  }	
.page_footer_navi li.fnavi_form{ float: right; height: 15px }	
	
	
.page_footerEnd{
	width:100%;
	padding:15px 0 10px 0;
	background:#cacaca;
	text-align:center;
	color:#fff;
}

.gotoTop{position:fixed; bottom:15px; right:20px; width:74px; height:74px; z-index:5000}


#s02{
	padding:70px 0;
	margin:0 auto;
	width:600px;
}


/*　WORKS　*/

.works_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/works/page_titleBG.jpg) center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.works_pagetitle{
	width:150px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}

.main_lead{margin: 0 auto; padding: 80px 0; width: 380px; text-align: center; clear: both}

.price_box{ width: 700px; margin: 0 auto}
.price_txt{width: 700px; margin: 0 auto; padding: 15px 0; line-height: 180%; font-size: 10px; text-align: left}


	
	
/*　OWNERs　*/

.owner_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/owner/page_titleBG.jpg) center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.owner_pagetitle{
	width:320px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}	

.main_lead_ow{margin: 0 auto; padding: 80px 0; width: 380px; text-align: center; clear: both}

	
/*　REFORM　*/

.reform_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/reform/page_titleBG.jpg) center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.reform_pagetitle{
	width:190px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}	
.main_lead_reform{margin: 0 auto; padding: 80px 0; width: 400px; text-align: center; clear: both}	

	
	
.reform_naiyou{
	width: 700px; margin: 0 auto; padding: 40px 0 40px 0; text-align: center; font-size: 16px; line-height: 200%
}
	
.reform_naiyou img{ width:30%}
	
#icon_box{width:584px; margin: 0 auto 60px auto;}
	
.icon_setL{float: left; width: 287px; height: 89px; padding-bottom: 10px}	
.icon_setR{float: right; width: 287px; height: 89px; padding:0 0 10px 10px}	
.iconL,.icon02,.iconR{width: 89px; height: 89px}

.iconL{float: left}
.icon02{float: left; margin: 0 0 0 10px}
.iconR{float: right}


#icon_box_B{width:486px; margin: 0 auto 60px auto;}
.icon_setR_B{float: right; width: 189px; height: 89px; padding:0 0 10px 10px}	
	


/*　AFTER　*/

.after_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/after/page_titleBG.png) center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.after_pagetitle{
	width:190px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}	
.main_lead_after{margin: 0 auto; padding: 80px 0; width: 600px; text-align: center; clear: both}		

.a_boxset{ width: 700px; margin: 0 auto; line-height: 220%; font-size: 12px}
.jio_box{width: 299px; padding-right: 50px; float: left; border-right:  #2D2C2C 1px dotted}
.jio_logo{text-align: center; height: 120px}
.bios_box{width: 300px; padding-left: 50px; float: right;}
.bios_logo{text-align: center; padding: 10px 0 0 0; height: 110px}
	
	
	
/*　topix　*/

.topix_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/topix/page_titleBG.jpg) center center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.topix_pagetitle{
	width:180px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}
	
.main_lead_topix{margin: 0 auto; padding: 80px 0; width: 440px; text-align: center; clear: both}
	
.ph_box01{width: 700px; margin: 0 auto; padding: 110px 0 0 0}	
.ph_box02{width: 700px; margin: 0 auto; padding: 30px 0 0 0}
.ph_L{width: 330px; float: left}
.ph_R{width: 330px; float: right}
.pre_box{width: 700px; margin: 0 auto; padding: 60px 0 0 0}
	
	
/*　company　*/
	
.company_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/company/page_titleBG.jpg) center center no-repeat;
	background-size:cover;
	width:100%;
	height:334px;
}

.company_pagetitle{
	width:240px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}
	

.ab_dan{width: 800px; margin: 0 auto; padding:60px 0;}
.a_dan{margin: 0; padding: 0 0 20px 0; border-bottom: 1px solid #ccc; width: 800px;}
.b_dan{margin: 0; padding: 25px 0; border-bottom: 1px solid #ccc; width: 800px;}
.b_dan_L{width: 260px; padding-left: 10px; float: left}
.b_dan_R{width: 530px; float: left}
	

	
/*　FORM　*/

.form_pagetitleBG{
	margin:60px 0 0 0;
	background: url(../hokuyu_img/form/bg.jpg) center top no-repeat;
	width:100%;
	height:334px;
}

.form_pagetitle{
	width:220px;
	margin:0 auto;
	padding:100px 0;
	text-align:center;
}
	
.dummy_box0803{width: 700px; margin: 0 auto; font-size: 16px; line-height: 200%; text-align: center; padding:60px 0;}
	
.form_demand{
	float: left; 
	width: 180px;
	padding: 0 0 0 10px; 
	text-align: left;
	font-size: 13px
}	
.form_demand span{font-size: 12px; color: red;}
.form_item{float: right; width: 450px; text-align: left}
.form_hisu{font-size: 12px; color: red; text-align: right; padding: 80px 0 0 0; clear: both}

input[type="text"]{width: 98%; height: 26px; background-color: #eee; border: none}
textarea{width: 98%; background-color: #eee; border: none}
	
input[type="submit"]{width: 120px; height: 40px; background: #F7700A}
input[type="reset"]{width: 120px; height: 40px; background: #666; color: #fff}	

}




/*お詫び*/    
    .owabi{width: 100%; margin:40px 0 20px 0; }
    .owabi_txt{width: 600px; margin: 0 auto; padding: 8px 10px; border: 2px rgba(203,191,192,1.00) solid; background: rgba(248,251,228,0.00); line-height: 250%; text-align:center;}
    









@media only screen and (max-width: 768px) {
	/*　画面　縦向き　*/

.pc_only{display:none}



.heater{
	position:absolute;
	top:0;
	width:100%;
	background:#FFF;
	height:60px;
}

.heat_area{
	width:100%;
	height:60px;
	margin:0 auto;
	padding:0;
}

.logo{
	width: auto;
	height:25px;
	float:left;
	padding:20px 0 0 15px;
}





#navToggle {
	display: none;
	position:absolute;/*to body*/
	right:10px;
	top:12px;
	width:29px;
	height:21px;
	/*background:#000;*/
	padding:15px 10px 15px 14px;
	cursor:pointer}
#navToggle div {position:relative}
#navToggle span {
	display:block;
	position:absolute;/*to div*/
	width:100%;
	border-bottom:solid 3px #666;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out}
#navToggle span:nth-child(1) {top:0}
#navToggle span:nth-child(2) {top:7px}
#navToggle span:nth-child(3) {top:14px}

header nav {
	position:absolute;
	right:0;
    top:-600px; /*通常時はビュー外*/
	background:rgba(255,255,255,0.9);
    width:90%;
	padding:0 5%;
	-webkit-transition:.5s ease-in-out;
	-moz-transition:.5s ease-in-out;
	-o-transition:.5s ease-in-out;
	transition:.5s ease-in-out;
	text-align:left}
header ul {margin:0}
header ul li {display:block; margin:0; border-bottom:dotted 1px #666; line-height:3}
header ul li a {display:block; color:#000; text-decoration:none}
header ul li a:hover {display:block; color:#BFAAAB; text-decoration:none}	
	
/*header ul li:after {content:''; color:#666}
header ul li:last-child {border-bottom:none}*/
	
/* Toggle(Button) */
#navToggle {display: block}
/* Click Toggle(Button) */
.openNav #navToggle span:nth-child(1) {
	top: 9px;
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	transform:rotate(-45deg)}
.openNav #navToggle span:nth-child(2),
.openNav #navToggle span:nth-child(3) {
	top: 9px;
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	transform:rotate(45deg)}
/*header menu*/
.openNav nav {
	-moz-transform: translateY(660px);
	-webkit-transform: translateY(660px);
	transform: translateY(660px)}


.page_footer{
	width:100%;
	padding:30px 0 25px 0;
	text-align:center;
	color:#ccc;
	clear:both;
}

.page_footer a{
	text-decoration:none;
	color:#ccc;
}
.page_footer a:hover{
	text-decoration:underline;
	color:#ccc;
}
.page_footerEnd{
	width:100%;
	padding:15px 0 10px 0;
	background:#cacaca;
	text-align:center;
	color:#fff;
}

.gotoTop{position:fixed; bottom:15px; right:10px; width:40px; height:40px; z-index:5000}


/*　WORKS　*/

.works_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/works/page_titleBG.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.works_pagetitle{
	width:30%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}
.main_lead{margin: 0 auto; padding: 60px 0; width: 80%; text-align: center; clear: both}
	
.price_box{ width: 90%; margin: 0 auto}
.price_txt{width: 75%; margin: 0 auto; padding: 15px 0; line-height: 180%; font-size: 10px; text-align: left}
	
	
	
/*　OWNERs VOICE　*/

.owner_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/owner/page_titleBG.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.owner_pagetitle{
	width:50%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}	

.main_lead_ow{margin: 0 auto; padding: 80px 0; width: 75%; text-align: center; clear: both}
	
/*　REFORM　*/

.reform_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/reform/page_titleBG.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.reform_pagetitle{
	width:35%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}		
	
.main_lead_reform{margin: 0 auto; padding: 60px 0; width:80%; text-align: center; clear: both}	

	
	
.reform_naiyou{
	width: 88%; margin: 0 auto; padding: 40px 0 10px 0; text-align: center; font-size: 14px; line-height: 200%
}	
.reform_naiyou img{ width:45%}
	
#icon_box{width:70%; margin: 0 auto }
	
.icon_setL{float: left; width: 100%;}	
.icon_setR{float: right; width: 100%;}	
.iconL,.icon02,.iconR{width: 32%; height: 33%; padding-bottom: 2%}

.iconL{float: left}
.icon02{float: left; margin: 0 0 0 2%}
.iconR{float: right}
	

#icon_box_B{width:70%; margin: 0 auto;}	
.icon_setR_B{loat: right; width: 100%; text-align: center}	
.iconR_B{float: left}
	
	
	
/*　AFTER　*/

.after_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/after/page_titleBG.png) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.after_pagetitle{
	width:26%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}		
	
.main_lead_after{margin: 0 auto; padding: 60px 0; width:70%; text-align: center; clear: both}	
	
.a_boxset{ width: 90%; margin: 0 auto; line-height: 220%; font-size: 14px}
.jio_box{width: 100%; padding: 0 0 50px 0; border-bottom: 1px #000 dotted}
.jio_logo{text-align: center; height: 100px}
.bios_box{width: 100%t;}
.bios_logo{text-align: center; padding: 10px 0 0 0; height: 90px; margin: 50px 0 0 0}
	

	
/*　TOPIX　*/

.topix_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/topix/page_titleBG.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.topix_pagetitle{
	width:25%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}
	
.main_lead_topix{margin: 0 auto; padding: 60px 0; width:90%; text-align: center; clear: both}

.ph_box01{width: 80%; margin: 0 auto; padding: 90px 10% 0 10%}	
.ph_box02{width: 80%; margin: 0 auto; padding: 50px 10% 0 10%}
.ph_L{width: 100%; float: left; padding: 0 0 50px 0}
.ph_R{width: 100%; float: right}
.pre_box{width: 80%; margin: 0 auto; padding: 60px 0 0 0}	
	

	
	
/*　company　*/

.company_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/company/page_titleBG.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:200px;
}

.company_pagetitle{
	width:35%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}
.ab_dan{width: 100%; margin: 0 auto; padding:60px 0;}
.a_dan{margin: 0 auto; padding: 0 0 20px 0; border-bottom: 1px solid #ccc; width: 90%;}
	
.b_dan{margin: 0 auto; padding: 25px 0; border-bottom: 1px solid #ccc; width: 90%;}
.b_dan_L{width: 30%; padding-right: 5%; float: left}
.b_dan_R{width: 65%; float: left}
	
	
	
/*　FORM　*/

.form_pagetitleBG{
	margin:40px 0 0 0;
	background:url(../hokuyu_img/form/bg.jpg) center -150px no-repeat;
	width:100%;
	height:200px;
}

.form_pagetitle{
	width:25%;
	margin:0 auto;
	padding:60px 0;
	text-align:center;
}
	
.dummy_box0803{width: 90%; margin: 0 auto; padding: 0 5% 50px 5%; font-size: 16px; line-height: 200%; text-align: center; padding:60px 0;}

.form_demand{
	float: left; 
	width: 180px;
	padding: 0 0 0 10px; 
	text-align: left;
	font-size: 13px;
	clear: both
}	
.form_demand span{font-size: 12px; color: red;}
.form_item{float: right; width: 100%; text-align: left}
.form_hisu{font-size: 12px; color: red; text-align: right; padding: 80px 0 0 0; clear: both}

input[type="text"]{width: 98%; height: 26px; background-color: #eee; border: none}
textarea{width: 98%; background-color: #eee; border: none}
	
input[type="submit"]{width: 120px; height: 40px; clear: both; background: #F7700A}
input[type="reset"]{width: 120px; height: 40px; background: #666; color: #fff}	
	
/*お詫び*/    
    .owabi{width: 95%; margin: 20px auto;  }
    .owabi_txt{width: auto; margin: 0 auto; padding: 8px 10px; border: 2px rgba(203,191,192,1.00) solid; line-height: 250%; text-align:justify;}		

}