@charset "utf-8";
/*
Theme Name: Lightning Child Sample
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Template: lightning
Description: ★ テーマの説明（空欄でも可） ★
Author: ★ テーマ作成者の名前（空欄でも可） ★
Tags: 
Version: 0.1.4
*/

/**
 * =========================================
 * 文字フォント
 * =========================================
**/

.copy{
margin-top:6px;
}

.teikei{
	text-align:center;
	color:#ffffff;
	font-size:18px;
}

.teikei_wrap{
display:inline-block;
}

@media (min-width:1024px) {
.nurikae_logo img{
	width:300px;
	text-align:center;
	margin-top:3px;
}
}

@media (max-width: 480px) {
.nurikae_logo img{
	width:200px;
	text-align:center;
	margin-top:3px;
}
}

.customer_wrap{
	width:100%;
}

.naiyou_riyuu,
.naiyou_title,
.naiyou_text{
	margin-left:7px;
	margin-right:7px;
}


.thanks{
	font-size:15px;
	font-family:serif !important;
	font-weight:lighter !important;
	margin-left:7px;
	margin-top:30px;
	margin-bottom:50px;
}

.naiyou_title{
	font-size:18px;
	margin-bottom:5px;
}

.naiyou_text{
	font-family:serif !important;
	font-weight:lighter !important;
	text-align:justify;
}

@media (min-width:1024px){
.voice-frame{
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  width:80%;
  margin-right:auto;
  margin-left:auto;
  margin-top:30px;
}
}

@media (max-width: 480px){
.voice-frame{
  display:block;
  justify-content: space-between;
  width:80%;
  margin-right:auto;
  margin-left:auto;
  margin-top:30px;
}
}

.customer_p{
	width:100%;
	margin-top:-30px;
}

.q_title{
	background-color:#000000;
	color:#ffffff;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:10px;
	padding-right:10px;
	margin-bottom:10px;
	font-size:17px;
	margin-top:20px;
	width:100%;
}


body,
h1, h2, h3, h4, h5, h6 {
	font-family: a-otf-midashi-mi-ma31-pr6n,serif;
	font-weight: 600;
	font-style: normal;
}

/**
 * =========================================
 * 全体
 * =========================================
**/
/** ページ全体の幅を100%に再設定 */
.container {
	width: 100%;
}

/** 不要なpaddingを除去 */
.siteContent {
	padding: 0px!important;
}

/** 文字を中央寄せにしたいときに使用する */
.center {
	text-align: center;
}

/** font-sizeを20にする */
.size20 {
	font-size: 20px;
}

/** font-sizeを30にする */
.size30 {
	font-size: 30px;
}

/** margin-rightを50にする */
.margin50 {
	margin-right: 50px;
}

/** margin-bottom を30にする */
.margin-bottom30 {
	margin-bottom: 30px;
}

/** margin-bottom を0にする */
.margin-bottom0 {
	margin-bottom: 0;
}

/** margin-top を30にする */
.margin-top30 {
	margin-top: 30px;
}

/** チェック項目のデザインを変更 */
.check-item {
	display: block;
	margin-bottom: 5px;
}

/** 強調したい文字のデザイン */
.emphasis {
	font-size: 25px;
    margin: 0 5px;
    color: #ce2b30;
}

/** h5のデザイン */
h5 {
	border-left: 5px solid #131d2a;
    padding: 0 0 0 8px;
}

/** トップ 各タイトルの文字サイズ等設定(左) */
.lhome-title {
	text-align: left;
	font-size: 40px;
	/* width: 30%; */
	/* border-bottom: 3px solid; */
	position: relative;
}
.lhome-title span {
	z-index: 2;
	position: relative;
}

/* @media screen and (max-width: 1400px) {
	.lhome-title {
		width: 30%;
	}
} */

/* @media screen and (min-width: 1401px) {
	.lhome-title {
		width: 20%;
	}
} */

.left-title {
	margin-bottom: 50px;
}

/** トップ 各タイトルの文字サイズ等設定(右) */
.rhome-title {
	text-align: center;
	font-size: 40px;
	width: 30%;
	position: relative;
	float: right;
}
.rhome-title span {
	z-index: 2;
	position: relative;
}

/** トップ 各タイトルの文字サイズ等設定(真ん中) */
.center-title {
	text-align: center;
	font-size: 40px;
	width: 30%;
	border-bottom: 3px solid;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	color: #fff;
	height: 85px;
}

/** 
 * トップ タイトルの文字を一旦透明にする
 * (jsで不透明にする処理が入る)
 *  */
.movetext {
	opacity:0;
	margin-bottom: 0;
}
.movetext span {
	opacity:0;
}

/** グレー背景 */
.gray-area {
	background-color: #dddddd;
	min-height: 500px;
	padding-top: 50px;
	padding-bottom: 50px;
}

/** 黒背景 */
.black-area {
	background-color: #000000;
	min-height: 650px;
	padding-top: 50px;
	text-align: center;
	margin-top:-32px;
}

/** リンク画像透過 */
a:hover img{
    opacity:0.6;
    filter:alpha(opacity=80);
    -ms-filter: "alpha( opacity=80 )";
}

/** h1タグの左に余白を取る */
.page-header_pageTitle, h1.page-header_pageTitle:first-child {
	margin-left: 30px;
}

/** 各ページのh1、スライダーの上に余白を取る */
#top__fullcarousel {
	margin-top: 16px!important;
}

@media only screen and (max-width: 1023px){
	.page-header{
		margin-top: 16px!important;
	}
}

/* 各ページのページタイトルh1の非表示 */
.page-header_pageTitle {
    display: none;
}
/* お知らせ、成功事例は表示→ページタイトルh1の非表示 */
.post-type-archive-voice .post-type-archive-case .page-header_pageTitle ,.post-type-archive-post .page-header_pageTitle{
    display: inherit;
}

/** パンくずリストの左に余白を取る */
.breadSection .breadcrumb {
	padding-left: 30px;
}

/** 各ページの幅 */
.col-md-8 {
	width: 100%;
}

/** 親ページに表示する子ページ一覧のデザイン */
.veu_childPage_list {
	width: 80%;
	margin: 2.5em auto;
}

/** タイトル前の画像 */
.h2-title:before,
.abiko-title:before,
.case-detail:before,
.case-comment:before {
	content: url(https://okada-k.biz/wp-content/uploads/2020/08/title_before_white.png);
	vertical-align: middle;
}

/** h2のデザイン消し */
.h2-title,
.case-detail,
.case-comment {
	background-color: #fff;
	border: none;
	margin-bottom: 0.3em;
}

/** h3のデザイン消し */
.h3-title {
	border: none!important;
}
.h3-title:after {
	border-bottom-color: transparent;
}

/** タイトルの文字位置 */
.h2-span,
.detail-span,
.comment-span {
	margin-left: -185px;
}

/** テーブルのデザイン */
.tablepress {
	margin-bottom: 50px;
}
.tablepress th {
	width: 25%;
}
.tablepress,
.tablepress th,
.tablepress td {
	border: 1px solid #e5e5e5;
}

/** h3のデザイン */
.h3-title {
	color: #464646;
	padding: 0.5em 0!important;
	border-top: solid 3px #464646!important;
	border-bottom: solid 3px #464646!important;
	text-align: center;
	margin-top: 80px!important;
}

/** marginなし */
.margin0 {
	margin-top: 0!important;
}

/** ページャーを改行する */
.pagination {
	grid-column: 1;
    width: 80%;
    margin: 20px auto;
    display: block;
}

.mt10px {
    margin-top: 10px;
}

.mb10px {
    margin-bottom: 10px;
}

/**
 * =========================================
 * ヘッダー	
 * =========================================
**/
/** 背景色 */
.siteHeader {
	background-color: #000000;
}

/** グロナビの背景色・文字色 */
#menu-headernavigation li a {
	background-color: #000000;
	color: #fff;
}

/** グロナビ ホバー時の文字色 */
#menu-headernavigation li a:hover {
	color: #808080;
}

/** グロナビをロゴの下に配置する */
#menu-headernavigation {
	clear: both;
}

/** ロゴ横 お問合わせの文字色 */
.logo-after {
	color: #fff;
}

/** ロゴ横 お問合わせの文字サイズ(メッセージ) */
.logo-after .message {
	font-size: 12px;
}

/** ロゴ横 お問合わせの文字サイズ(TEL) */
.logo-after .tel {
	font-size: 20px;
	color: #fff;
}

/** ロゴ・お問合わせ 本来の左寄せを一旦解除 */
.navbar-header {
	clear: both;
	width: 100%;
}

/** ロゴ 左寄せを再設定 */
.siteHeader_logo {
	float: left;
}

/** お問合わせ 右寄せの設定 */
.logo-after {
	float: right;
	margin-top: 10px;
}

/** 
 * ハンバーガーメニュー領域の高さ指定
 * iPad Pro未満のCSSピクセルの場合※  
**/
@media only screen and (max-width: 1023px) {
	html body div#wprmenu_bar {
		height: 58px;
	}
	#wprmenu_bar .menu_title {
		text-align: center;
	}
	#wprmenu_bar div.hamburger {
		margin-top: 5px;
	}
	.siteHeader {
		display: none;
	}
}

/** iPad Pro以上のサイズの時 */
@media screen and (min-width: 1024px) {
	/** スライダーのmarginを設定する */
	.slide-item-img {
		margin-top: 115px;
	}
}

/** スマホの時 */
@media screen and (max-width: 768px) {
	/** ハンバーガーメニューの上を少し広げる */
	#mg-wprm-wrap.cbp-spmenu-left,
	#mg-wprm-wrap.cbp-spmenu-right,
	#mg-widgetmenu-wrap.cbp-spmenu-widget-left,
	#mg-widgetmenu-wrap.cbp-spmenu-widget-right {
		top: 55px !important;
	}
}

/**
 * =========================================
 * HOME：サービス
 * =========================================
**/
/** 領域の幅を設定 */
.service {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-top:30px;
}

/** 背景設定 */
.col-md-12 {
	padding-left: 0px!important;
	padding-right: 0px!important;
}

/** 背景設定 */
#post-11 {
	background-image: url('https://okada-k.biz/wp-content/uploads/2020/07/bg_img-scaled.jpg');
	background-attachment: fixed;
}

/** 画像 hover時 */
.service-area {
    max-width: 343px; /* 幅を指定 */
	margin-left: auto;
	margin-right: auto;
}
.service-link {
    display: block;
    overflow: hidden;
    padding: 60% 0 0; /* 縦横比を指定 */
    position: relative;
}
.service-img {
    left: 0;
    top: 0;
    display: block;
    height: auto;
    left: 0;
    position: absolute;
    top: 0;
    transition: all .2s ease-in-out;
    width: 100%;
}
.service-link:hover .service-img {
    transform: scale3d(1.1,1.1,1); /* hover時の倍率を指定 */
}

/** サービスタイトルのペンキローラー */
@media screen and (max-width: 774px) {
	.home-service:after {
		content: url(https://okada-k.biz/wp-content/uploads/2020/08/service_roller_smp.png);
		top: -46px;
		position: relative;
		right: 35px;
		z-index: 1;
	}
}
@media screen and (min-width: 775px) {
	.home-service:after {
		content: url(https://okada-k.biz/wp-content/uploads/2020/08/service_roller_green.png);
		top: 30px;
		position: relative;
		right: 305px;
		z-index: 1;
	}

}

/** PCの時のみ */
@media screen and (min-width: 1025px) {
	/** 上段2つのメニューの幅を設定 */
	.service-top {
		width: 75%;
		margin-left: auto;
		margin-right: auto;
		min-height: 300px;
	}

	/** 外壁塗装 左に寄せる */
	.s-outer {
		float: left;
		width: 50%;
	}

	/** 屋根塗装 左に寄せる */
	.s-roof {
		float: right;
		width: 50%;
	}

	/** 下段3つのメニューが回り込むのを防ぐ */
	.service-bottom {
		clear: both;
		margin-top: 50px;
		min-height: 400px;
	}

	/** 床下環境事業・防水リフォーム・マンションアパートを全て左寄せにする */
	.s-floor,
	.s-waterproof,
	.s-apartment {
		float: left;
		width: 33%;
		margin-left: auto;
		margin-right: auto;
	}
	
	/** スマホ用のタイトルは隠す */
	.smp-text,
	.smp-center-title{
		display: none;
	}
	
	/** PC用のタイトルは表示 */
	.home-service,
	.home-works,
	.center-title,
	.home-company,
	.home-contact {
		display: block;
	}
}

/** iPad Pro以上のサイズの時 */
@media screen and (min-width: 769px) {
	/** パンくずリストが入り込むのを防ぐ */
	.breadSection{
		margin-top: 36px;
	}
}

/** スマホの時のみ */
@media screen and (max-width: 1024px) {
	
	/** PC用のタイトルは隠す */
	.home-service,
	.home-works,
	.center-title,
	.home-company,
	.home-contact {
		display: none;
	}
	
	/** スマホ用のタイトルは表示 */
	.smp-text,
	.smp-center-title {
		display: block;
		margin-top: 3em;
	}
	
	/** 新着情報の色 */
	.smp-center-title {
		color: #fff;
		margin-top: 40px;
	}
	
	/** 日本語タイトル */
	.smp-jpn {
		font-size: 30px;
	}
	
	/** 英語タイトル */
	.smp-eng {
		font-size: 20px;
	}
	
	/** 英語タイトルの色 */
	.smp-service {
		color: #63845b;
	}
	.smp-works {
		color: #6b74b3;
	}
	.smp-news {
		color: #fffc9c;
	}
	.smp-company {
		color: #dc9fcc;
	}
	.smp-contact {
		color: #f1b039;
	}
	
	/** marginを設定する */
	.s-roof,
	.s-floor,
	.s-waterproof,
	.s-apartment {
		margin-top: 80px;
	}
	.service {
		margin-bottom: 120px;
	}
}

/**
 * =========================================
 * 施工事例
 * =========================================
**/
/** 領域の幅を設定 */
.works {
	clear: both;
	width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/** 施工事例タイトルのペンキローラー */
.home-works:after {
	content: url(https://okada-k.biz/wp-content/uploads/2020/08/service_roller_blue2.png);
    top: -42px;
    position: relative;
    right: 27px;
    z-index: 1;
}

/** 施工事例カルーセルの施工内容：背景色 */
.wp-posts-carousel-categories {
	background-color: transparent!important;
}

/** 施工事例カルーセルの施工内容デザイン */
.wp-posts-carousel-categories a {
	border: 1px solid;
	border-radius: 5px;
	padding: 1px 5px;
}

/** 施工事例カルーセルの[前へ][次へ]削除 
.owl-dots,
.owl-prev,
.owl-next {
	display: none!important;
}
*/

/**
 * =========================================
 * 施工事例 一覧
 * =========================================
**/
/** 施工内容のラベルデザイン */
.loop-const-span {
	margin-right: 5px;
    border: 1px solid #cccccc;
    border-radius: 5px;
    padding: 1px 5px;
    font-size: 13px;
	display: inline-block;
	margin-bottom: 3px;
}

/** 施工事例一覧のデザイン */
.child_page_block .thumbImage {
    display: block;
    border: 1px solid #ccc;
    width: 150px !important;
	margin: 0 auto;
}

/** 施工事例のタイトル */
.entryTitle {
	background-color: transparent;
    border-bottom: 1px solid;
    border-radius: 0;
    margin: 0 0 10px 0;
    padding: 5px 10px;
}

/** 施工事例一覧の余白設定 */
.child_page_block_Inner {
	padding: 15px 15px 10px;
	width: 250px;
}

/** 施工事例写真を中央に配置 */
.after-img {
	padding-right: 0;
}

/** 各施工事例の枠デザイン */
.child_page_block.layout_odd {
	float: left;
    clear: none;
    margin-right: 10px;
	height: 340px;
	border: 1px solid;
	margin-top: 30px;
}

/** [詳しくはこちら]ボタンの位置 */
.moreLink {
	float: right;
	margin-right: 13px;
}

/** [詳しくはこちら]ボタンのデザイン */
.case-link-btn {
	padding: 1px 7px;
    font-size: 13px;
    border: 1px solid;
    border-radius: 5px;
}

/** [詳しくはこちら]ボタン ホバー時のデザイン */
.case-link-btn:hover {
	color: #fff;
	background-color: #000;
	border-radius: 5px;
}

/** 一覧をgrid表示にする */
.post-type-archive-voice .mainSection .postList::after,
.post-type-archive-case .mainSection .postList::after,
.term-outerwall .mainSection .postList::after ,
.term-apartment .mainSection .postList::after ,
.term-waterproof .mainSection .postList::after ,
.term-floor .mainSection .postList::after,
.term-roof .mainSection .postList::after{
	content: none!important;
}

/**
 * =========================================
 * 施工事例 - 詳細
 * =========================================
**/
/** 枠 */
.case-frame {
	width: 95%;
	margin-left: auto;
	margin-right: auto;
}

/** before/after テーブルのデザイン */
.case-img {
	width: auto;
	border: none;
	margin-top: 50px;
}

/** before/after テーブルのtd */
.case-img td {
	border-bottom: none;
}

/*画像サイズ固定*/
.case-img img{
	width: 350px;
	height: 260px;
	object-fit:cover;
}

/** before/after の文字位置 */
.case-before,
.case-after {
	text-align: center;
}

/** before/after の文字デザイン */
.case-before-span,
.case-after-span {
	background-color: #000;
    color: #fff;
    padding: 3px 20px;
    border-radius: 25px;
    font-size: 20px;
}

/** 施工内容テーブルの幅 */
.case-info {
	width: 85%;
}

/** 施工内容テーブルのth, td */
.case-info th,
.case-info td {
	border: 1px solid #e5e5e5;
	padding: 0.5em 1em;
}

/** 施工内容テーブル 見出しをグレー背景にする */
.case-info th {
	background-color: #f6f6f6;
}

/** コメントエリア */
.case-comment-area {
	margin-top: 30px;
	margin-bottom: 100px;
}

/** 施工内容が外壁塗装の場合のラベル色 */
.case-outerwall {
	background-color: #eac39a;
	color: #fff;
	padding: 3px 5px;
    border-radius: 7px;
}

/** 施工内容が屋根塗装の場合のラベル色 */
.case-roof {
	background-color: #499475;
	color: #fff;
	padding: 3px 5px;
    border-radius: 7px;
}

/** 施工内容が床下環境事業の場合のラベル色 */
.case-floor {
	background-color: #ebc175;
	color: #fff;
	padding: 3px 5px;
    border-radius: 7px;
}

/** 施工内容が防水リフォームの場合のラベル色 */
.case-waterproof {
	background-color: #9599b2;
	color: #fff;
	padding: 3px 5px;
    border-radius: 7px;
}

/** 施工内容がマンション・アパートの場合のラベル色 */
.case-apartment {
	background-color: #ba7d8c;
	color: #fff;
	padding: 3px 5px;
    border-radius: 7px;
}

/** 施工内容のラベルデザイン */
.construction-category a {
	border: 1px solid #cccccc;
	border-radius: 7px;
	padding: 3px 5px;
	margin-right: 5px;
}

/** 施工事例詳細の余白設定 */
.case-detail-area {
	margin-bottom: 50px;
}

/**
 * =========================================
 * 新着情報
 * =========================================
**/
/** お知らせ記事の文字色を設定する */
.lcp_catlist {
	color: #8184a8;
}
.lcp_catlist a {
	color: #fff;
	margin-left: 50px;
	text-decoration: none;
}

/** お知らせ一覧の幅指定 */
.lcp_catlist {
	text-align: left;
	width: 90%;
	margin: 60px auto!important;
	padding: 0;
}

/** お知らせ一覧に下線を引く、<li>の点を消す */
.lcp_catlist li {
    list-style: none!important;
    padding: 10px 0!important;
    font-size: 1.1em;
	margin-bottom: 0px;
}

/** 問い合わせボタンのデザイン */
.info-button {
	border: 0 solid;
	box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
	outline: 1px solid;
	outline-color: #982124;
	outline-offset: 0px;
	text-shadow: none;
	transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
	color: #fff;
	padding: 10px 30px;
	background-color: #982124;
	display: block;
	width: 80%;
    margin: 0 auto;
} 

/** read more ボタンのデザイン */
.read-more {
	border: 0 solid;
	box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
	outline: 1px solid;
	outline-color: #982124;
	outline-offset: 0px;
	text-shadow: none;
	transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
	color: #fff;
	padding: 10px 30px;
	background-color: #982124;
} 

/** 各種ボタンのhover */
.info-button:hover,
.read-more:hover {
	border: 1px solid;
	box-shadow: inset 0 0 20px rgba(255, 255, 255, .5), 0 0 20px rgba(255, 255, 255, .2);
	outline-color: rgba(255, 255, 255, 0);
	outline-offset: 15px;
	text-shadow: 1px 1px 2px #427388; 
	text-decoration: none;
	color: #fff;
}

/** お知らせアーカイブの幅 */
.media {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * HOME：会社概要
 * =========================================
**/
/** 領域の高さを予め確保 */
.company-area {
	min-height: 750px;
	padding-top: 50px;
}

/** 領域の幅を設定 */
.company {
	width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/** PC時のみ */
@media screen and (min-width: 1025px) {
	/** 地図を左に配置する */
	.company-left {
		float: left;
		width: 60%;
		margin-top: 30px;
	}

	/** 会社情報を右に配置する */
	.company-right {
		float: right;
		width: 40%;
		margin-top: 30px;
	}	
}

/** スマホ時のみ */
@media screen and (max-width: 1024px) {
	/** 会社情報のmarginを設定する */
	.company-right {
		margin: 40px 0 0 0;
	}	
}

/** 会社名の文字サイズ */
.company-name {
	font-size: 1.5em;
	border-bottom: 3px solid;
}

/** 会社 住所・連絡先 */
.company-address {
	margin-top: 50px;
}

/** 会社概要タイトルのペンキローラー */
.home-company:after {
	content: url(https://okada-k.biz/wp-content/uploads/2020/08/service_roller_pink.png);
    top: 30px;
    position: relative;
    right: 305px;
    z-index: 1;
}

/** テーブルのデザイン */
.company-table {
	width: 100%;
	margin: 0 auto 50px auto;
}
.company-table th {
	width: 25%;
}
.company-table th,
.company-table td {
	border: 1px solid #e5e5e5;
}

/**
 * =========================================
 * HOME：6PR
 * =========================================
**/

.pr-section{
  background-color: #999;
  width: 100%;
  text-align: center;
  padding: 1rem;
  padding-bottom: 5rem;
}

.pr-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 3rem;
  max-width: 1200px;
  margin: 0 auto;
}

.pr-title {
  background-color: unset;
  width: 100%;
  text-align: center;
  border: none;
  padding: unset !important;
  margin: 5rem 0 !important;
	img {
	  position: relative;
	  top: -7px;
	}
}

@media screen and (min-width: 480px) {
	.pr-title br{
	   display: none;
	}
}

.pr-content-title {
  background-color: unset;
  text-align: center;
  font-size: 3rem;
  line-height: 1em;
  margin-bottom: 24px;
	span {
		font-size: 1.6rem;
	}
}

.pr-content {
  background-color: #fff;
  text-align: center;
  width: 350px;
  height: 450px;
  border-radius: 2.5rem;
	  p{
	  padding: 2rem;
	  text-align: left;
	  line-height: 2.5rem;
	}
}

.pr-content:nth-of-type(odd) {
  background-color: #ddd;
}

/**
 * =========================================
 * お問い合わせ
 * =========================================
**/
/** お問い合わせ領域の設定 */
.contact {
    clear: both;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/** 必須の文字色 */
.alert {
	color: #f00;
	font-size: 13px;
}

/** PCの時のみ */
@media screen and (min-width: 1025px) {
	/** 問い合わせフォームの幅 */
	.contact-table {
		width: 50%;
	}
}

/** スマホの時のみ */
@media screen and (max-width: 1024px) {
	/** 問い合わせフォームの幅 */
	.contact-table {
		width: 90%;
	}
}

/** 問い合わせフォームの枠線消し、幅の調節 */
.contact-table {
	clear: both;
	border: none;
	margin-left: auto;
	margin-right: auto;
}

/** 問い合わせフォームの縦並び、padding */
.contact-table th,
.contact-table td {
	display: block;
	border: none;
	padding: 0.5em;
}

/** 問い合わせフォームのtdの下padding */
.contact-table td {
	padding-bottom: 2em;
}

/** [送信]ボタンのサイズ調整 */
input.wpcf7-submit {
	font-size: 1.2em;
	padding-left: 30px;
	padding-right: 30px;
}

/** 問い合わせフォーム input の幅指定 */
.contact-table td .form-control {
	max-width: 100%;
}

/** 問い合わせフォームのエラーメッセージのデザイン */
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
    background-color: red;
    border: none;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

/** 問い合わせフォームのメッセージの枠色 */
.wpcf7 form.sent .wpcf7-response-output {
	border-color: #000;
}

/** お問い合わせタイトルのペンキローラー */
.home-contact:after {
	content: url(https://okada-k.biz/wp-content/uploads/2020/08/service_roller_gray.png);
    top: -42px;
    position: relative;
	right: 70px;
    z-index: 1;
}

/**
 * =========================================
 * フッター
 * =========================================
**/
/** フッターの背景色 */
.sectionBox {
	background-color: #000;
}

/** コピーライトの文字色 */
.copySection {
	color: #fff;
}

/** 会社住所の左寄せ */
.footer-company {
	text-align: left;
	/* width: 50%; */
	float: left;
}

.footer-company p {
	margin-top: 10px!important;
}

/** リンクの領域 */
.fotter-link {
	float: right;
	text-align: right;
	margin-bottom: 10px;
}

/** リンクの文字サイズ */
.fotter-link {
	font-size: 13px;
}

/** リンクの文字色 */
.fotter-link a {
	color :#fff;
	text-decoration: underline;
}

/** コピーライトのfloat解除 */
footer .copySection p {
	clear: both;
}

/** スライダー下、フッター上の余白を削除 */
.page .entry-body {
	padding-top: 2em;
	padding-bottom: 0;
}

/** 塗料メーカー バナーリンクのデザイン */
.paint-banner {
	clear: both;
	width: 60%;
    margin: 0 auto 50px auto;
}
.paint-banner ul {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
	list-style: none;
	padding-left: 0;
}
.paint-banner ul li {
	margin: 0 5px 10px;
	width: 170px;
}
.font-white {
	color: #fff;
}

/**
 * =========================================
 * TOPへ戻る矢印ボタン
 * =========================================
**/
#back-top {
	z-index: 500;
	position: relative;
}
#back-top a {
	display: block;
	overflow: hidden;
	position: fixed;
	bottom: 20px;
	right: 20px;
}
#back-top #pagetop {
	display: block;
	overflow: hidden;
	width: 45px;
	height: 45px;
}

/**
 * =========================================
 * サイドメニュー
 * =========================================
**/
/** サイドメニュー領域のデザイン */
#sidemenu li:nth-child(1) img {
	margin-bottom: 3px;
}
#sidemenu li:nth-child(1) {
	padding: 5px;
}
#sidemenu li:nth-child(2) {
	border-radius: 10px;
	font-size: 12px;
	margin-bottom: 10px;
}

/** ボタンの見た目調整 */
#sidemenu * {
	box-sizing: border-box;
}

/** サイドメニューの動き */
#sidemenu {
	transition: .35s ease-in;
	position: relative;
}

/** お問い合わせボタンのタブ */
#sidemenu .btn-tab {
	background-color: #000;
	padding: 5px 3px;
	width: 30px;
	height: 160px;
	float: left;
	box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
	-webkit-box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
	-moz-box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
}

/** お問い合わせボタンのタブ「お問い合わせ」文字画像 */
#sidemenu .btn-tab img {
	width: 18px;
}

/** サイドメニュー右側 */
#sidemenu ul {
	display: inline-block;
	margin: 0;
	background: #000;
	padding: 20px 12px;
	width: 110px;
	list-style: none;
	box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
	-webkit-box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
	-moz-box-shadow: 7px 7px 10px 3px rgba(000, 000, 000, 0.5);
}
#sidemenu li {
	background-color: #fff;
	border-radius: 10px;
	font-size: 12px;
}
#sidemenu li a {
	text-decoration: underline;
	font-size: 14px;
}
#sidemenu li:first-child {
	margin-bottom: -10px;
}

/** サイドメニューを画面に固定し、一番上のレイヤーに持っていく */
#sidemenu {
	width: 140px;
	position: fixed;
	right: 0;
	bottom: 0;
	z-index: 10000;
	text-align: center;
}

/** クリック時にclass="close"が付与されるので、右に隠れる */
#sidemenu.close {
	right: -110px;
	transition: .35s ease-out;
	opacity: 1;
}

/** スマホで見たときは、初期表示時に領域を閉じておく */
@media screen and (max-width: 700px) {
	#sidemenu {
		right: -111px;
	}
	
	#sidemenu.close {
		right: 0px;
	}
}

/** 開閉ボタン(700px以上) */
@media screen and (min-width: 700px) {
	/** クリック前(領域が開いているとき) */
	#sidemenu .btnClose:after {
		content: "";
		display: block;
		width: 20px;
		height: 20px;
		background: url(https://okada-k.biz/wp-content/uploads/2020/07/btn_icon_close.png) no-repeat;
		background-size: cover;
		position: absolute;
		top: 130px;
		left: 7px;
	}
	
	/** クリック後(領域が閉じているとき) */
	#sidemenu.close .btnClose:after {
		content: "";
		display: block;
		width: 20px;
		height: 20px;
		background: url(https://okada-k.biz/wp-content/uploads/2020/07/btn_icon_open.png) no-repeat;
		background-size: cover;
		position: absolute;
		top: 130px;
		left: 7px;
	}
}

/** 開閉ボタン(700pxまで) */
@media screen and (max-width: 700px) {
	/** クリック前(領域が閉じているとき) */
	#sidemenu .btnClose:after {
		content: "";
		display: block;
		width: 20px;
		height: 20px;
		background: url(https://okada-k.biz/wp-content/uploads/2020/07/btn_icon_open.png) no-repeat;
		background-size: cover;
		position: absolute;
		top: 130px;
		left: 7px;
	}
	
	/** クリック後(領域が開いているとき) */
	#sidemenu.close .btnClose:after {
		content: "";
		display: block;
		width: 20px;
		height: 20px;
		background: url(https://okada-k.biz/wp-content/uploads/2020/07/btn_icon_close.png) no-repeat;
		background-size: cover;
		position: absolute;
		top: 130px;
		left: 7px;
		
	}
}

@media screen and (max-width: 991px) {
	.menuBtn {
		position: absolute;
		top: 0;
		z-index: 2000;
		margin: 8px;
		padding: 8px 12px;
	}
	
	.menuBtn.btn-default {
		border-color: #fff;
		color: #fff;
	}
}

/**
 * =========================================
 * 法人のお客様へ
 * =========================================
**/
/** ページの幅 */
#post-57 .entry-body {
	width: 80%;
	margin: 0 auto 50px auto;
}

/**
 * =========================================
 * 我孫子市にお住まいのお客様へ
 * =========================================
**/
.font-red {
	color: #f00;
}

/** ページの幅、中央寄せ */
#post-59 .entry-body {
	width: 80%;
	margin: 0 auto 100px auto;
}

/**
 * =========================================
 * 外壁塗装・外壁リフォーム
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-17 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 外壁塗装・外壁リフォーム - 施工の流れ
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-19 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 外壁塗装・外壁リフォーム - 塗料の種類・プラン
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-22 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 屋根塗装・屋根リフォーム
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-25 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 屋根塗装・屋根リフォーム - 施工の流れ
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-27 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 屋根塗装・屋根リフォーム - 塗料の種類・プラン
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-29 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 床下環境事業
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-31 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/** 湿気項目のデザイン */
.moisture-item {
	font-size: 25px;
	color: #6776de;
}

/** ベスト四季のデザイン */
.bestshiki {
	font-size: 35px;
	color: #ce2b30;
}

/**
 * =========================================
 * 床下環境事業 - 施工の流れ
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-33 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * =========================================
 * 床下環境事業 - プラン（薬剤・広さ）
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-35 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/** 広さ領域の配置 */
/** PCの時のみ */
@media screen and (min-width: 1025px) {
	.shiroari-left {
		float: left;
		width: 50%;
		text-align: right;
	}
	.shiroari-plan {
		margin-bottom: 150px;
	}
}

/** スマホの時のみ */
@media screen and (max-width: 1024px) {
	.shiroari-plan {
		width: 80%;
		margin: 0 auto 50px auto;
		text-align: center;
		margin-bottom: 50px;
	}
}

/**
 * =========================================
 * 防水リフォーム
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-37 .entry-body {
	width: 80%;
	margin: 0 auto 50px auto;
}

/**
 * =========================================
 * マンション・アパート
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-39 .entry-body {
	width: 80%;
	margin: 0 auto 50px auto;
}

/**
 * =========================================
 * プライバシーポリシー
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-69 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/** margin */
#post-69 {
	margin-bottom: 100px;
}

/**
 * =========================================
 * 外壁塗装
 * =========================================
**/
/** 外壁リフォームの方法 タイトル */
.reform-title {
	font-size: 20px;
    background: linear-gradient(transparent 70%, #bfbfb0 50%);
    font-weight: bold;
    margin-right: 8px!important;
    margin-left: 8px!important;
}

/** 劣化のサイン 枠 */
.wall-sign {
	position: relative;
    margin: 0 auto 2em auto;
    padding: 30px 20px 30px 30px;
    background-color: #ffffff;
    color: #666;
    border: 1px solid #464646;
    box-shadow: 0 0 2px 1px #ccc;
    border-radius: 10px;
    font-size: 17px;
}

/**
 * =========================================
 * 施工の流れ
 * =========================================
**/
/** h2のデザイン */
.construction-flow {
	color: #464646;
	padding: 0.5em 0!important;
	border-top: solid 3px #464646!important;
	border-bottom: solid 3px #464646!important;
	text-align: center;
	background-color: transparent;
}

/**
 * =========================================
 * よくあるご質問
 * =========================================
**/
/** 
 * 外壁塗装・屋根塗装
 * ページの幅、中央寄せ
 */
#post-45 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * シロアリ駆除
 * ページの幅、中央寄せ
 */
#post-47 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * マンション・アパート
 * ページの幅、中央寄せ
 */
#post-49 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/**
 * オカダ建装について
 * ページの幅、中央寄せ
 */
#post-51 .entry-body {
	width: 80%;
	margin: 0 auto;
}

/** タイトル */
.faq-title {
	color: #464646;
	padding: 0.5em 0!important;
	border-top: solid 3px #464646!important;
	border-bottom: solid 3px #464646!important;
	text-align: center;
	background-color: transparent;
}

/** 質問デザイン */
.faq-q {
	border: none!important;
}
.faq-q:after {
	border-bottom-color: transparent;
}
.faq-q:before {
	content: "Q　";
	color: #1a4a72;
}

/** 回答デザイン */
.faq-a {
	padding: 20px 20px;
    margin-top: -25px;
    position: relative;
    background-color: #ebf3f9;
    color: #666;
    border: 1px solid #1a4a72;
    box-shadow: 0 0 2px 1px #bbb;
    border-radius: 10px;
}

/**
 * =========================================
 * 施工エリア
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-61 .entry-body {
	width: 80%;
	margin: 0 auto 100px auto;
}

/** PCの時のみ写真とスタッフ紹介文を横に並べる */
@media screen and (min-width: 1025px) {
	/** マップ横の説明 */
	.area-left {
		width: 60%;
		margin: 0 auto;
		float: left;
	}

	/** エリアマップ */
	.area-right {
		width: 40%;
		margin: 0 auto 50px auto;
		float: right;
	}
}

/** エリアマップを中央寄せする */
.area-right {
	text-align: center;
}

/**
 * =========================================
 * 固定ページ：会社概要
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-13 .entry-body {
	width: 80%;
	margin: 0 auto 50px auto;
}

/** 代表挨拶 */
.page-aisatsu {
	text-align: left;
    width: 90%;
    margin: 0 auto;
}

/** こだわり */
.page-kodawari {
	text-align: left;
    width: 90%;
    margin: 0 auto;
}

/** アクセスマップ */
.map-area {
	text-align: center;
}

/** 領域の幅を設定 */
.page-company {
	width: 90%;
    margin-left: auto;
    margin-right: auto;
}

/**
 * =========================================
 * 事業内容のお問合わせボタン
 * =========================================
**/
.contact-button {
	text-align: center;
	margin-top: 100px;
}

/**
 * =========================================
 * スタッフ紹介
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-635 .entry-body {
	width: 80%;
	margin: 0 auto 100px auto;
}

/**
 * =========================================
 * カード状に並べるデザイン
 * =========================================
**/
.card {
	margin: 30px;
	width: 280px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px #ccc;
	height: 505px;
	vertical-align: top;
	display: inline-block;
}

.outer-wall-card {
	margin: 30px;
	width: 280px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px #ccc;
	height: 420px;
	vertical-align: top;
	display: inline-block;
}

.shiroari-card {
	margin: 30px;
	width: 280px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px #ccc;
	height: 260px;
	vertical-align: top;
	display: inline-block;
}

.shiroari-flow-card {
	margin: 30px;
	width: 280px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px #ccc;
	height: 443px;
	vertical-align: top;
	display: inline-block;
}

.moisture-card {
	margin: 30px;
	width: 280px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px #ccc;
	height: 320px;
	vertical-align: top;
	display: inline-block;
}
.card-img,
.shiroari-card-img {
	border-radius: 5px 5px 0 0;
	max-width: 100%;
	height: auto;
	width: 90%;
    margin-left: auto;
    margin-right: auto;
}
.shiroari-card-img {
	margin-top: 30px;
}
.card-img img {
	width: 100%;
}
.card-content {
	padding: 20px;
}
.card-title {
	font-size: 20px;
	text-align: center;
	padding: 10px;
	background-color: #000;
    color: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
	margin-bottom: 20px;
	height: 87px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.card-text {
	color: #777;
	font-size: 14px;
	line-height: 1.5;
	text-align: left;
}
.card-grid,
.post-type-archive-voice .mainSection .postList,
.post-type-archive-case .mainSection .postList,
.term-outerwall .mainSection .postList,
.term-apartment .mainSection .postList,
.term-waterproof .mainSection .postList,
.term-floor .mainSection .postList,
.term-roof .mainSection .postList{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	grid-auto-rows: 1fr;
	grid-gap: 0.8em;
	padding: 0.8em;
	margin: 0 0 2em;
	text-align: center;
	justify-items: center;
    align-items: center;
}
.card-grid > div {
  background: #ddd;
  overflow: auto;
  min-width: 0;
  padding: 1em;
}

/**
 * =========================================
 * スタッフ紹介
 * =========================================
**/
/** PCの時のみ写真とスタッフ紹介文を横に並べる */
@media screen and (min-width: 1025px) {
	.staff-left {
		float: left;
		width: 35%;
	}
	.staff-right {
		float: right;
		width: 65%;
	}
}

/** 写真を中央寄せにする */
.staff-left,
.staff-name {
	text-align: center;
}

/** スタッフの名前の余白 */
.staff-name {
	margin-top: 10px;
}

/** スタッフの名前のサイズ */
.staff-jname {
	font-size: 30px;
}

/** スタッフの名前の色 */
.staff-ename {
	color: #a4b9f3;
}

/** スタッフ紹介テーブルのデザイン */
.staff-table,
.staff-table th,
.staff-table td {
	border: none;
}
.staff-table {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

.staff-container {
  overflow: auto;
  margin-bottom: 15rem;
}

.staff-table th {
  width: 50%;
}

/**
 * =========================================
 * お客様の声
 * =========================================
**/
/** ページの幅、中央寄せ */
#post-53 .entry-body {
	width: 80%;
	margin: 0 auto 50px auto;
}

/**
 * =========================================
 * フッター
 * =========================================
**/
/** tel番号の文字色 */
.footer-link-num {
	color: #fff;
}

/** tel番号のhover時の文字色 */
.footer-link-num:hover {
	color: #fff;
}

/** fax番号の文字色 */
/** (iPhoneの場合、自動でリンクになってしまうようなので再設定する) */
.footer-fax-num a {
	color: #fff;
	text-decoration: none;
}

/**
 * =========================================
 * Meta Slider
 * =========================================
**/
@media screen and (max-width: 414px) {
    .slider-smp{
        display:block;
    }
	.slider-pc{
		display:none;
	}
}

@media screen and (min-width:415px){
    .slider-smp{
        display:none;
    }
	.slider-pc{
		display:block;
		margin-top: 0!important;
	}
}

/**
 * =========================================
 * 我孫子市住宅リフォーム補助金について
 * =========================================
**/
#post-1143 .entry-body {
	width: 80%;
    margin: 0 auto 50px auto;
}

.tablepress tfoot th, .tablepress thead th {
	background-color: #464646;
    color: #fff;
}

.reform-link {
	color: #fff;
	float: right;
}

.reform-link a {
	color: #fff;
}

.reform-link {
    padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: bold;
	border: solid 2px #fff;
}

.reform-link a:hover {
	color: #808080;
}