@charset "utf-8";

/* ========================================================================== */
/* レスポンシブデザイン対応 - メディアクエリ                                 */
/* ========================================================================== */

/* ========================================================================== */
/* タブレット・スマートフォン対応 (640px以下)                                */
/* ========================================================================== */
@media screen and (max-width: 640px) {
	
	/* ========== 基本設定 ========== */
	body {
		-webkit-text-size-adjust: 100%;
		width: 100%;
		position: relative;
		margin: 0;
		padding: 0;
		background: #fff;
	}
	
	* {
		box-sizing: border-box;
	}
	
	img {
		width: 100%;
		max-width: 100%;
		height: auto;
	}
	
	/* ========== ヘッダー ========== */
	#header {
		margin-top: 0;
		padding: 15px 0px 0px 0px;
		position: relative;
	}
	
	#header h1 {
		width: 70%;
		max-width: 70%;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}
	
	#header h1 img {
		width: 100%;
		height: auto;
	}
	
	/* ========== ハンバーガーメニュー ========== */
	.hamburger-menu {
		display: block;
		position: absolute;
		top: 20px;
		right: 15px;
		width: 30px;
		height: 24px;
		cursor: pointer;
		z-index: 1001;
	}
	
	.hamburger-menu span {
		display: block;
		position: absolute;
		width: 100%;
		height: 3px;
		background-color: #333;
		left: 0;
		transition: all 0.3s ease;
	}
	
	.hamburger-menu span:nth-child(1) {
		top: 0;
	}
	
	.hamburger-menu span:nth-child(2) {
		top: 10px;
	}
	
	.hamburger-menu span:nth-child(3) {
		top: 20px;
	}
	
	.hamburger-menu.active span:nth-child(1) {
		transform: translateY(10px) rotate(45deg);
	}
	
	.hamburger-menu.active span:nth-child(2) {
		opacity: 0;
	}
	
	.hamburger-menu.active span:nth-child(3) {
		transform: translateY(-10px) rotate(-45deg);
	}
	
	/* ========== グローバルナビゲーション ========== */
	#globalnavi_bg {
		background-color: #E6E6E6;
		height: auto;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
		margin-bottom: 0;
	}
	
	#globalnavi_bg.open {
		max-height: 500px;
	}
	
	#globalnavi {
		width: 100%;
		height: auto;
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 0;
		clear: both;
		padding: 0;
	}
	
	#globalnavi li {
		float: none;
		list-style-type: none;
		display: block;
		line-height: auto;
		font-weight: bold;
		border-bottom: 1px solid #ccc;
	}
	
	#globalnavi ul li a {
		width: 100%;
		height: auto;
		display: block;
		overflow: visible;
		text-decoration: none;
		text-align: left;
		padding: 15px 15px;
		color: #333;
		font-size: 16px;
	}
	
	#globalnavi ul li a:hover {
		width: 100%;
		height: auto;
		display: block;
		overflow: visible;
		text-decoration: none;
		background-color: #B3B3B3;
		color: #ffffff;
	}
	
	#globalnavi a {
		display: block;
		overflow: visible;
	}
	
	/* ========== プロフィール（会社情報）セクション ========== */
	#profile_wrapper {
		background-color: #595758;
	}
	
	#profile {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-top: 30px;
		padding-bottom: 30px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#profile dl dt {
		width: 100%;
		display: block;
		clear: left;
		float: none;
		margin-bottom: 10px;
		color: #B4B4B4;
		font-weight: bold;
		font-size: 14px;
	}
	
	#profile dl dd {
		display: block;
		width: 100%;
		float: none;
		margin-bottom: 20px;
		color: #ffffff;
		font-size: 14px;
	}
	
	#profile_left {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#profile_right {
		float: none;
		width: 100%;
	}
	
	#profile_right .regi {
		width: 100%;
		margin-top: 10px;
	}
	
	#profile_right .regi img {
		display: block;
		margin-right: 0;
		margin-bottom: 10px;
		width: 100%;
		max-width: 100%;
	}
	
	/* ========== フッター ========== */
	#footer_wrapper {
		background-color: #DCDCDC;
	}
	
	#footer {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-top: 30px;
		padding-bottom: 30px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#footer_left {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#footer_left p,
	#footer_right p {
		margin-bottom: 1em;
		font-size: 14px;
	}
	
	#footer_right {
		float: none;
		width: 100%;
	}
	
	#footer_menu_wrapper {
		background-color: #595758;
	}
	
	#footer_menu {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		color: #ffffff;
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#footer_menu ul {
		text-align: center;
	}
	
	#footer_menu li {
		list-style-type: none;
		display: block;
		margin-right: 0;
		margin-bottom: 10px;
	}
	
	#footer_menu a:link {
		color: #ffffff;
		text-decoration: none;
		font-size: 14px;
	}
	
	#footer_menu a:visited {
		color: #ffffff;
		text-decoration: none;
	}
	
	#footer_menu a:hover {
		color: #cccccc;
		text-decoration: none;
	}
	
	#copyright {
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#copyright h1 {
		font-size: 12px;
		font-weight: bold;
	}
	
	/* ========== メインコンテンツ ========== */
	#main {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		margin-top: 20px;
		padding-bottom: 30px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	/* ========== 工事詳細 ========== */
	.kouji_detail {
		margin-bottom: 30px;
	}
	
	.kouji_left {
		float: none;
		width: 100%;
		margin-bottom: 20px;
	}
	
	.kouji_right {
		float: none;
		width: 100%;
	}
	
	.kouji_right dt {
		font-weight: bold;
		font-size: 120%;
		margin-bottom: 15px;
	}
	
	/* ========== 実績 ========== */
	.jisseki {
		margin-bottom: 30px;
	}
	
	.jisseki_left {
		float: none;
		width: 100%;
		margin-bottom: 15px;
	}
	
	.jisseki_left a:hover {
		opacity: 0.7;
	}
	
	.jisseki_right {
		float: none;
		width: 100%;
	}
	
	p.jisseki_title {
		font-size: 1.4em;
		font-weight: bold;
	}
	
	.jisseki_detail {
		margin-top: 15px;
	}
	
	/* ========== フロー ========== */
	dl.sonota {
		margin-top: 30px;
		margin-bottom: 50px;
	}
	
	dl.sonota dt {
		font-weight: bold;
		font-size: 16px;
	}
	
	dl.sonota dd {
		margin-bottom: 15px;
		font-size: 14px;
	}
	
	.flow {
		margin-bottom: 20px;
	}
	
	.flow_left {
		float: none;
		margin-right: 0;
		margin-bottom: 10px;
	}
	
	.flow_right span.tel,
	span.tel {
		font-size: 140%;
		font-weight: bold;
	}
	
	.flow_right span.jikan,
	span.jikan {
		font-size: 80%;
	}
	
	/* ========== テキスト ========== */
	.blog_text .more-link {
		margin-top: 1em;
		float: right;
		color: #40AAF8;
		font-size: 14px;
	}
	
	.blog_text a:hover {
		color: #1D2975;
	}
	
	/* ========== マップ ========== */
	#map_canvas {
		width: 100% !important;
		height: 300px !important;
	}
	
	/* ========== ニュース ========== */
	#news dl dt {
		float: none;
		margin-right: 0;
		margin-bottom: 5px;
		font-size: 12px;
	}
	
	#news dl dd {
		margin-bottom: 15px;
		font-size: 14px;
	}
	
	#news dl dd a {
		display: block;
	}
	
	/* ========== フォーム ========== */
	.wpcf7 input[name="your-name"],
	.wpcf7 input[name="your-email"],
	.wpcf7 input[name="your-subject"] {
		width: 100% !important;
		height: 40px !important;
		padding: 8px;
		font-size: 16px;
	}
	
	.wpcf7 textarea[name="your-message"] {
		width: 100% !important;
		height: 150px !important;
		padding: 8px;
		font-size: 16px;
	}
	
	input[type="submit"] {
		font-size: 16px;
		padding: 12px 20px;
		background: #3E3A39;
		color: #ffffff;
		width: 100%;
		height: auto;
		border: 1px solid #ccc;
		cursor: pointer;
	}
	
	input[type="submit"]:hover {
		background-color: #666666 !important;
	}
	
	/* ========== ページトップボタン ========== */
	#pageTop {
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 999;
	}
	
	#pageTop a {
		display: block;
		z-index: 999;
		width: 50px;
		height: 50px;
		background-color: #1D2975;
		color: #fff;
		font-weight: bold;
		text-decoration: none;
		text-align: center;
		vertical-align: middle;
		line-height: 50px;
		border-radius: 50%;
		font-size: 12px;
	}
	
	#pageTop a:hover {
		text-decoration: none;
		opacity: 0.7;
	}
	
	/* ========== テキストサイズ調整 ========== */
	h1 {
		font-size: 18px;
	}
	
	h2 {
		font-size: 20px;
		margin-bottom: 0px !important;
		padding-left:15px;
		padding-bottom:15px;
	}
	
	h3 {
		font-size: 16px;
		margin-bottom: 15px;
	}
	
	p {
		font-size: 14px;
		line-height: 1.6;
	}
	
	/* ========== 修飾用 ========== */
	.pc_only {
		display: none;
	}
	
	.mobile_only {
		display: inherit;
	}
	
	.marb10 {
		margin-bottom: 10px;
	}
	
	.marb30 {
		margin-bottom: 20px;
	}
	
	.marb50 {
		margin-bottom: 30px;
	}
	
	.marb65 {
		margin-bottom: 40px;
	}
	
	.marb105 {
		margin-bottom: 50px;
	}
	
	.mart30 {
		margin-top: 20px;
	}
	
	.mart75 {
		margin-top: 40px;
	}
	
	.marr45 {
		margin-right: 0;
	}
	
	.bold {
		font-weight: bold;
	}
	
	.clear {
		clear: both;
	}
	
	.center {
		text-align: left;
	}
	
	ul.hoyuu {
		margin-bottom: 30px;
		padding-left: 20px;
	}
	
	ul.hoyuu li {
		margin-left: 0;
		font-size: 14px;
		margin-bottom: 10px;
	}
	
	video {
		max-width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
		vertical-align: bottom;
	}
	
	.movie {
		position: relative;
		width: 100%;
		padding-top: 56.25%;
	}
	
	.movie iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}
}

/* ========================================================================== */
/* 中程度のタブレット対応 (641px - 768px)                                    */
/* ========================================================================== */
@media screen and (min-width: 641px) and (max-width: 768px) {
	
	#header {
		margin-top: 20px;
	}
	
	#header h1 {
		width: 80%;
		max-width: 80%;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}
	
	.hamburger-menu {
		display: block;
		position: absolute;
		top: 20px;
		right: 15px;
		width: 30px;
		height: 24px;
		cursor: pointer;
		z-index: 1001;
	}
	
	.hamburger-menu span {
		display: block;
		position: absolute;
		width: 100%;
		height: 3px;
		background-color: #333;
		left: 0;
		transition: all 0.3s ease;
	}
	
	.hamburger-menu span:nth-child(1) {
		top: 0;
	}
	
	.hamburger-menu span:nth-child(2) {
		top: 10px;
	}
	
	.hamburger-menu span:nth-child(3) {
		top: 20px;
	}
	
	.hamburger-menu.active span:nth-child(1) {
		transform: translateY(10px) rotate(45deg);
	}
	
	.hamburger-menu.active span:nth-child(2) {
		opacity: 0;
	}
	
	.hamburger-menu.active span:nth-child(3) {
		transform: translateY(-10px) rotate(-45deg);
	}
	
	#globalnavi_bg {
		background-color: #E6E6E6;
		height: auto;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
		margin-bottom: 0;
	}
	
	#globalnavi_bg.open {
		max-height: 500px;
	}
	
	#globalnavi {
		width: 100%;
		height: auto;
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 0;
		clear: both;
	}
	
	#globalnavi li {
		float: none;
		list-style-type: none;
		display: block;
		line-height: auto;
		font-weight: bold;
		border-bottom: 1px solid #ccc;
	}
	
	#globalnavi ul li a {
		width: 100%;
		height: auto;
		display: block;
		overflow: visible;
		text-decoration: none;
		text-align: left;
		padding: 12px 15px;
		color: #333;
		font-size: 15px;
	}
	
	#globalnavi ul li a:hover {
		width: 100%;
		height: auto;
		display: block;
		overflow: visible;
		text-decoration: none;
		background-color: #B3B3B3;
		color: #ffffff;
	}
	
	#profile {
		width: 90%;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#profile_left {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#profile_right {
		float: none;
		width: 100%;
	}
	
	#footer {
		width: 90%;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#footer_left {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#footer_right {
		float: none;
		width: 100%;
	}
	
	#main {
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.kouji_left {
		float: none;
		width: 100%;
		margin-bottom: 20px;
	}
	
	.kouji_right {
		float: none;
		width: 100%;
	}
	
	.jisseki_left {
		float: none;
		width: 100%;
		margin-bottom: 15px;
	}
	
	.jisseki_right {
		float: none;
		width: 100%;
	}
	
	#map_canvas {
		width: 100% !important;
		height: 400px !important;
	}
	
	.wpcf7 input[name="your-name"],
	.wpcf7 input[name="your-email"],
	.wpcf7 input[name="your-subject"] {
		width: 100% !important;
		height: 35px !important;
		padding: 8px;
		font-size: 15px;
	}
	
	.wpcf7 textarea[name="your-message"] {
		width: 100% !important;
		height: 140px !important;
		padding: 8px;
		font-size: 15px;
	}
	
	input[type="submit"] {
		font-size: 15px;
		padding: 10px 20px;
		background: #3E3A39;
		color: #ffffff;
		width: 100%;
		height: auto;
		border: 1px solid #ccc;
	}
	
	.pc_only {
		display: none;
	}
	
	.mobile_only {
		display: inherit;
	}
}

/* ========================================================================== */
/* PC版 (769px以上)                                                          */
/* ========================================================================== */
@media screen and (min-width: 769px) {
	
	.hamburger-menu {
		display: none;
	}
	
	#globalnavi_bg {
		background-color: #E6E6E6;
		height: 50px;
		max-height: none;
		overflow: visible;
		/* margin-bottom: 30px; */
	}
	
	#globalnavi {
		width: 888px;
		height: 50px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 30px;
		clear: both;
	}
	
	#globalnavi li {
		float: left;
		list-style-type: none;
		display: block;
		line-height: 50px;
		font-weight: bold;
		border-bottom: none;
	}
	
	#globalnavi ul li a {
		width: 175px;
		height: 50px;
		display: block;
		overflow: hidden;
		text-decoration: none;
		text-align: center;
	}
	
	#globalnavi ul li a:hover {
		width: 175px;
		height: 50px;
		display: block;
		overflow: hidden;
		text-decoration: none;
		background-color: #B3B3B3;
		color: #ffffff;
	}
	
	.pc_only {
		display: inherit;
	}
	
	.mobile_only {
		display: none;
	}
}

@media screen and (max-width: 640px) {
	#header .center {
		text-align: left;
	}
	#header h2 img {
		width: 100%;
		height: auto;
		max-width: 240px; /* スマートフォンでの最大幅を調整 */
	}

	.flogo {
		width: 100%;
		height: auto;
		max-width: 280px; /* スマートフォンでの最大幅を調整 */
	}

	.flow {
		margin-top:30px;
	}

}

.title_01 {
	background-color:#e6e6e6;
	text-align:center;
	padding:5px;
	font-weight:bold;
	margin-bottom:10px;
}

.title_02 {
	background-color:#4499f4;
	color:#ffffff;
	text-align:center;
	padding:5px;
	font-weight:bold;
	font-size:120%;
	margin-bottom:10px;
}

.yajirushi {
	width:10%;
  display: block;
  margin: 0 auto;
}

.mar10 {
	margin-top:10px;
}