@charset "utf-8";

/*###########################################################

 全ページ共通のレスポンシブ
 
#############################################################/*/

@media screen and (max-width: 1340px) {
	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	.osusume-cont ul li {width: 22.3%;margin-right: 2%;}
	.osusume-cont ul li .osusume-inner {height: 115px;margin-top: 165px;}
	.osusume-cont ul li .osusume-title {font-size: 158%;}
	.osusume-cont ul li .osusume-com1 {font-size: 79%;}
}





@media screen and (max-width: 1270px) {
	/* ========== 全ページ共通の横メニュー ============ */
	.menu-yokomenu-container{width:98%;}
}




@media screen and (max-width: 1130px) {
	/* ========== 全ページ共通の横メニュー ============ */
	ul#yoko-menu li.yokomenu1,
	ul#yoko-menu li.yokomenu2,
	ul#yoko-menu li.yokomenu7{display:none;}

	ul#yoko-menu li.yokomenu3{width:12%}
	ul#yoko-menu li.yokomenu4{width:15%}
	ul#yoko-menu li.yokomenu5{width:15%;}
	ul#yoko-menu li.yokomenu6{width:14%}
	ul#yoko-menu li.yokomenu8{width:14%}
	ul#yoko-menu li.yokomenu9{width:16%;}
	ul#yoko-menu li.yokomenu10{width:14%;}
	
	ul#yoko-menu > li.yokomenu8 a {border-right: 1px solid #c7c7c7;}
}




@media screen and (max-width: 1024px) {
	img{max-width: 100%;height: auto;width /***/:auto;　}
	#wrapper{overflow: hidden;}
	.container{width:98%;margin:0 auto;text-align:left;padding:0;}

	#pagetop a{display:none !important;}


	/*//////// 全ページ共通のheader ///////////////////////*/
	.head-cont {width: 98%;}

	/*/////////////　お知らせ　//////////////////////////////*/
	.news-ichiran{width: auto;right: 15px;}

	/*/////////////　建築事例　//////////////////////////////*/
	.index-work-cont ul{width: 105%;height: 245px;padding: 25px 0 0 5px;}
	.index-work-cont ul li{margin: 0 1.2%;width: 16.7%;}
}




@media screen and (max-width: 910px) {	
	/*パンくず------------*/
	.breadcrumb-box {padding-top:4px;width: 98%;}

	/*/////////////　建築事例　//////////////////////////////*/
	.index-work-cont ul {height:235px;}
	
	/*//////// 全ページ共通のfooter ///////////////////////*/
	#footer-link1 ul li a{margin-right:17px;}
}




@media screen and (max-width: 960px) {	
	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	body#home #field2 .container {padding: 0 3%;}
	.osusume-cont{overflow:hidden;padding-top:0px;}
	.osusume-cont ul {width: 100%;}
	.osusume-cont ul li {width: 100%;height:120px;margin-right: 0;}
	
	.osusume-cont ul li.osusume-kojin,
	.osusume-cont ul li.osusume-fudosan,
	.osusume-cont ul li.osusume-company{background-size: 200px;margin-bottom:8px;padding:0 !important;}		
	.osusume-cont ul li.osusume-fudosan.syukatsufudousan {background-size: 200px;background-position: left top -6px;}
	
	.osusume-cont ul li .osusume-inner {padding: 11px 10px 0 15px;height:120px;margin-top: 0;margin-left: 200px;}		
	.osusume-cont ul li .osusume-title {background: url(../img/mark1.png) no-repeat 0 center;padding-left: 43px;}	
	.osusume-cont ul li.osusume-fudosan .osusume-title{background:url(../img/mark2.png) no-repeat 0 center;}
	.osusume-cont ul li.osusume-company .osusume-title{background:url(../img/mark3.png) no-repeat 0 center;}	
	.osusume-cont ul li .osusume-com1 {font-size: 93%;}
	
	.osusume-cont ul a:hover li {-webkit-transform: translate(0%,0px);transform: translate(0%, 0px);}
}	





@media screen and (max-width: 860px) {			/*画面の横幅が840px */
	/* ページの各フィールド-------------------*/
	#field0,
	#field1,
	#field2,
	#field3,
	#field4,
	#field5{padding:65px 0 65px 0;}
	#field6{padding:0 0 65px 0;}
	#field-end{padding:65px 0 20px 0;}
	
	/*/////////////　建築事例　//////////////////////////////*/
	.index-work-cont ul {width: 104.5%;height:220px;}

	/*/////////////　バナー　//////////////////////////////*/
	.index-banner {padding: 0 9%;}

		/*/////////　全ページ共通のfooter　////////////*/
	.footer-zip-cont {margin-top: 15px;}
	#footer-link1 ul li ul.sub-menu {display: none;}
	#footer-link1 ul li {display: inline;}
	#footer-link1 ul li p{display:inline-block;vertical-align: top;}
	#footer-link1 ul li a {display: inline-block;vertical-align: top;}
	#footer-link1 ul li p a {padding-top: 0;background-position: left center;}
}





@media screen and (max-width: 765px) {			/*画面の横幅が745px */
	.container {width: 94%;}
	
	/*//////// 全ページ共通のheader ///////////////////////*/  
	#header {height:65px;z-index: 300;background: #fff;border-bottom:2px solid #61a932;}
	dl.logo-dl {margin-top:0px;width: 240px;}
	dl.logo-dl dt img {width:47px;}
	dl.logo-dl dd {margin-top: 12px;}
	dl.logo-dl dd img {width:170px;}

	.head-tel-cont {margin: -2px 65px 0 0;}
	.head-tel-cont ul li.enquete{display:none;}

	/*index上部の切り替わる背景画像-----------------------*/
	#headerimgs {padding-top:65px;}
	
		
	/*-------------------------------------------------------------------------
	ページ上部右の出てくるナビmenuが出現して、入れ替わりに横メニューが消える
	--------------------------------------------------------------------------*/
	.yokomenu-bg{display:none;}
	
	#menubtn{position:absolute;z-index:700;top:14px;right:15px;background:url(../img/header_menu.png) no-repeat 0 0;width:54px;height:39px;text-indent:-8989px;display:block;overflow:hidden;cursor:pointer;}
	#menubtn.off{background-position:0 0;}
	#menubtn.on{background-position:0 -39px;}

	/*------------------------------------
	ページ上部右の出てくるナビmenu
	------------------------------------*/
	#navi_sp {display: none;width: 100%;position: fixed;z-index:200;padding-top:26px;right: 0;top: 0;overflow-y: scroll;height: 100%;}
	#navi_sp a,
	#navi_sp a:hover{text-decoration:none;}

	#navi_sp ul#yoko-menu-sp {width:100%;clear: both;padding:42px 10px 0 10px;list-style:none none outside;background-image:none;background-color: #eee;}
	#navi_sp ul#yoko-menu-sp li {position:relative;float:none;text-align:left;border-right:none;margin:4px 0;}
	#navi_sp ul#yoko-menu-sp li a {font-size:108%;color:#fff;text-decoration:none;display:block;background-color:#5b9f2f;padding:13px 0 13px 10px;cursor:pointer;text-indent:0px;overflow:hidden;height:auto;margin:0;border-bottom:none;}
	/*IE8以上*/
	#navi_sp ul#yoko-menu-sp li a {padding-top:14px\0;}
	#navi_sp ul#yoko-menu-sp li a:hover{background-color:#427422;}

	/*submenu*/
	#navi_sp ul#yoko-menu-sp li.spbox01{float:left;width:50%;margin:1px 0;}
	#navi_sp ul#yoko-menu-sp li.spbox00 > a{}
	#navi_sp ul#yoko-menu-sp li.spbox02 > a{background:#5b9f2f url(../img/header_menu_plus.gif) no-repeat right center;}
	#navi_sp ul#yoko-menu-sp li.spbox02 > a:hover{background-color:#427422;}
	#navi_sp ul#yoko-menu-sp li.selected > a{background:#666 url(../img/header_menu_down.gif) no-repeat right center;}

	#navi_sp li.left > a{border-right:4px solid #eee;}
	#navi_sp li.right > a{}
	
	#navi_sp ul#yoko-menu-sp ul.sub{list-style:none none outside;}
	#navi_sp ul#yoko-menu-sp ul.sub li a{text-indent:10px;}


	/*サブメニューの閉じる*/
	#navi_sp ul#yoko-menu-sp .sn_close{margin:0 0 0px 0;}
	#navi_sp ul#yoko-menu-sp .sn_close a{color:#fff;padding:11px 10px 11px 25px;display:block;background:#555 url(../img/header_menu_close.gif) no-repeat right center;cursor: pointer;}
	#navi_sp ul#yoko-menu-sp .sn_close a:hover{background-color:#111;opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha( opacity=100 )";}

	/*subsubmenu*/
	#navi_sp ul#yoko-menu-sp ul.sub ul.children{display:block !important;}
	#navi_sp ul#yoko-menu-sp ul.sub ul.children li {margin:3px 0;}
	#navi_sp ul#yoko-menu-sp ul.sub ul.children li a{text-indent:30px;}


	/*メニューの閉じる*/
	#navi_sp p#menuclose{clear:both;padding: 5px 10px 15px 10px;background-color: #eee;}
	#navi_sp p#menuclose a{font-size:115%;color:#FFF;padding:10px 12px;display:block;background:#555 url(../img/header_menu_close.gif) no-repeat right center;cursor: pointer;}/*9b9146*/
	#navi_sp p#menuclose a:hover{background-color:#111;opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha( opacity=100 )";}


	/* =============中ページ共通のスタイル================== */
	/*見出し----------------*/
	.midashi1 {font-size: 243%;letter-spacing: 0.1em;}


	/*/////////////////　 main　　////////////////////////////////*/

	/*/////////////　建築事例　//////////////////////////////*/
	.index-work-cont ul {height:205px;}
	
	/* ===== 全ページ共通のバナー ================*/
	.index-banner-sp{display:block;padding: 0 9%;}
}





@media screen and (max-width: 730px) {
	/*/////////　全ページ共通のfooter　////////////*/
	.footer-zip-cont-left {width: 103px;text-align: left;}
	.footer-zip {font-size: 86%;}
	/*
	.footer-tel{float:none;line-height: 1.1;}
	.footer-mail {padding: 0 0 0 0;}
	*/
}






@media screen and (max-width: 680px) {		/* 画面の横幅が660pxまでの幅の場合に適応される(iPad 縦以下、iPhone6 横) */	
	/*/////////////　紹介文　//////////////////////////////*/
	.shoukai-com1 {font-size: 100%;}
		
	/*/////////////　全ページ共通のfooter　//////////////////////////////*/
	#footer-link1 ul {line-height: 1.5;}	
	#footer-link1 ul li {font-size: 94%;line-height: 1.0;font-weight: normal;}
	#footer-link1 ul li a {line-height: 1.7;}
	#footer-link1 ul li ul.sub-menu {display: none;}
}







@media screen and (max-width: 620px) {/* 画面の横幅が600px*/
	/* ページの各フィールド-------------------*/
	#field0,
	#field1,
	#field2,
	#field3,
	#field4,
	#field5{padding:50px 0 50px 0 !important;}
	#field6{padding:0 0 50px 0 !important;}
	#field-end{padding:50px 0 20px 0 !important;}
	body#home #field6{padding:20px 0 40px 0 !important;}
	
	/* =============中ページ共通のスタイル================== */
	/*見出し----------------*/
	.midashi1 {font-size: 236%;letter-spacing: 0.05em;}
	
	.shoukai-com1{text-align: left;}
	.shoukai-com1 span{display:inline;}


	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	body#home #field2{padding:40px 0;margin-top:10px;}


	/*/////////////　建築事例　//////////////////////////////*/
	body#home #field3{padding:30px 0 50px 0 !important;}

	.index-work-cont ul {width: 100%;height:auto;text-align: center;padding: 20px 0 5px 0px;}
	.index-work-cont ul li {width:26%;margin: 0 1.0% 10px 1.0%;position: unset;float: none;padding: 0 !important;display: inline-block;}
	.index-work-cont ul li a .index-work-text {line-height: 1.0;}
	
	.index-work-cont ul li a:hover img {opacity: 0.6;-webkit-transform: scale(1.0);-moz-transform: scale(1.0);-o-transform: scale(1.0);-ms-transform: scale(1.0);transform: scale(1.0);}
	.index-work-cont ul li a:hover .index-work-text{margin-top:0;}

	
	/*facebookとTV-CF動画*/
	.facebook-cont{display:block;width:500px;height:350px;margin:0 auto 30px auto;}
	.banner-cont{display:block;width:500px;height:310px;margin:0 auto 50px auto;}

	/* ===== 全ページ共通のバナー ================*/
	.index-banner-sp {padding: 0;}
	.index-banner {padding: 0;}
	
	
	/*/////////////　全ページ共通のfooter　//////////////////////////////*/
	.footer-zip-cont-left {display: block;text-align: center;width: 100%;margin-bottom: 8px;}
	.footer-zip-cont-right {display: block;text-align: center;}
	.footer-tel {float: none;}
	.footer-tel a {background: url(../img/tel.png) no-repeat 0 9px;background-size: 18px;font-size: 158%;padding-left: 19px;}
	.footer-mail {padding: 0;}
	.footer-mail a {margin: 5px auto 0 auto;}
}





@media screen and (max-width: 530px) {		/* 画面の横幅が510px*/
	/*//////// 全ページ共通のheader ///////////////////////*/  
	.head-tel-cont {display: none;}

	/* =============中ページ共通のスタイル================== */
	/*見出し----------------*/
	.midashi1 {font-size:208%;letter-spacing: 0;margin: 0 0 20px 0;}	

	/*/////////////　お知らせ　//////////////////////////////*/
	.news-title {font-size: 186%;}

	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	.osusume-cont ul li .osusume-title {background: none;letter-spacing: 0.05em;padding-left: 0px;}
	.osusume-cont ul li .osusume-inner {padding: 11px 10px 0 15px;}
	.osusume-cont ul li.osusume-fudosan .osusume-title{background: none;}
	.osusume-cont ul li.osusume-company .osusume-title{background: none;}
	.osusume-cont ul li.osusume-fudosan.syukatsufudousan .osusume-title span	{transform: scale(0.85, 1);transform-origin: top left;width: 125%;display: inline-block;}
	.osusume-cont ul li .osusume-com1 {margin-top: 4px;}
	
	/*/////////////　全ページ共通のバナー　//////////////////////////////*/
	/*facebookとTV-CF動画*/
	.facebook-cont{width:90%;}
	.banner-cont{width:90%;}

	/*/////////////　全ページ共通のfooter　//////////////////////////////*/
	.footer-zip span {display: block;}
}





@media screen and (max-width: 450px) {		/* 画面の横幅が430px*/
	/*/////////////　お知らせ　//////////////////////////////*/
	.news-ichiran {position: unset;text-align: center;margin: -10px auto 10px auto;}

	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	.osusume-cont ul li .osusume-com1 {font-size: 86%;}
	.osusume-cont ul li.osusume-kojin,
	.osusume-cont ul li.osusume-fudosan,
	.osusume-cont ul li.osusume-company {background-size: 160px;}
	.osusume-cont ul li.osusume-fudosan.syukatsufudousan {background-size: 160px;}
	.osusume-cont ul li .osusume-inner {padding: 11px 10px 0 12px;margin-left: 160px;}

}





@media screen and (max-width: 380px) {		/* ＜pc確認は360px＞*/
	/*//////// 全ページ共通のheader ///////////////////////*/ 
	#menubtn {right: 10px;}

	/* =============中ページ共通のスタイル================== */
	/*見出し----------------*/
	.midashi1 {margin: 0 0 20px 0;text-align: left;font-size: 176%;}

	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	.osusume-cont ul li {height: 115px;}
	.osusume-cont ul li.osusume-kojin,
	.osusume-cont ul li.osusume-fudosan,
	.osusume-cont ul li.osusume-company {background-size:130px;}
	.osusume-cont ul li.osusume-fudosan.syukatsufudousan {background-size: 130px;background-position: left top 0;}
	.osusume-cont ul li .osusume-inner {padding: 11px 10px 0 12px;margin-left:130px;height: 115px;}
	.osusume-cont ul li .osusume-title {background: none;padding-left: 0;}
	.osusume-cont ul li.osusume-fudosan .osusume-title,
	.osusume-cont ul li.osusume-company .osusume-title{background:none;}
	.osusume-cont ul li .osusume-com1 {margin-top: 4px;}	

	/*/////////////　建築事例　//////////////////////////////*/
	.index-work-cont ul li { width:29%;}

	/*/////////////　全ページ共通のバナー　//////////////////////////////*/
	/*facebookとTV-CF動画*/
	.facebook-cont{margin-bottom:30px;}
	.banner-cont{height:210px;padding:0 11px;margin-bottom:30px;}
	.index-tvcf-title{padding-top:20px;}
	.index-tvcf15{padding-top:20px;}
	.index-tvcf30{padding-top:15px;}

}






@media screen and (max-width: 340px) {		/* 画面の横幅が320px*/	
	/*/////////////　おすすめコンテンツ　//////////////////////////////*/
	.osusume-cont ul li {height:108px;}
	.osusume-cont ul li.osusume-kojin,
	.osusume-cont ul li.osusume-fudosan,
	.osusume-cont ul li.osusume-company {background-size:120px;}
		.osusume-cont ul li.osusume-fudosan.syukatsufudousan {background-size: 120px;}
	.osusume-cont ul li .osusume-inner {padding:9px 8px 0 10px;margin-left:120px;height:108px;}
	.osusume-cont ul li .osusume-title {font-size: 143%;height:32px;}
	.osusume-cont ul li .osusume-com1 {font-size: 79%;}
	
	/*/////////////　全ページ共通のバナー　//////////////////////////////*/
	/*facebookとTV-CF動画*/
	.banner-cont{height:180px;}
}