@charset "UTF-8";

/*
Theme Name: 2018mj9
Description: 2018mj9
Theme URI:
Author: 2018mj9
Author URI:
Version: 1.0.0
License: GNU General Public License
License URI: http://www.gnu.org/licen.breadcrumbsses/gpl-2.0.html
*/

html,
body {
	margin: 0;
	padding: 0;
}
body {
	font-size: 16px;
	line-height: 1.8;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif,'Roboto';
}
img {
	max-width: 100%;
	height:auto;
	box-sizing: border-box;
	vertical-align: bottom;
}
p {
	margin: 0 0 1em 0;
}

@media screen and (max-width: 768px) {
	body {
		font-size: 15px;
	}
}
@media screen and (max-width: 480px) {
	body {
		font-size: 14px;
	}
	p {
		margin: 0 0 8% 0;
	}
}
@media screen and (max-width: 320px) {
	body {
		font-size: 13px;
	}
}

/****************************************
h要素
*****************************************/
h1, h2, h3, h4, h5, h6 {
	margin:0;
}
h1 {
	font-size: 80%;
	margin: 0 0 1% 0;
	font-weight: normal;
}
.title h1 {
	font-size: 170%;
	font-weight: bold;
	margin: 0;
}
h2 {
	font-size: 140%;
	color: #0397e5;
}
#area h2,
#flow h2,
#help h2,
#faq h2 {
	overflow: hidden;
	margin: 30px 0;
	align-items: center;
	background: #3cb3e4;
	color: #FFF;
	height: 40px;
	line-height: 40px;
	display: flex;
}
#area h2:before,
#flow h2:before,
#help h2:before,
#faq h2:before,
#area h2:after,
#flow h2:after,
#help h2:after,
#faq h2:after {
	content: "";
	flex: 1;
	background: #fff;
	padding: 3px 0;
	height: 0;
	transform: rotate(45deg);
}
h3 {
	color: #0397e5;
	font-size: 120%;
}
#company #payment h3 {
	color: #999999;
	margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
	.title h1 {font-size:140%;}
}
@media screen and (max-width: 480px) {
	h1 {width:90%;margin:0 auto 1%;}
	.title h1 {font-size:120%;}
	h2 {font-size:130%;}
	#area h2:before,#flow h2:before,#help h2:before,
	#area h2:after,#flow h2:after,#help h2:after {content:"";flex: 1;background:#fff;padding:1px 0;height:0;transform:rotate(75deg);}
}

/****************************************
引用
*****************************************/
blockquote{
	margin-bottom: 2em;
	margin-left: 20px;
	padding-left: 20px;
	border-left: 5px solid #ddd;
}

/****************************************
リスト
*****************************************/
ul,ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul ul {
	margin-left: 1em;
}
dl, dt, dd {
	margin: 0;
}

/****************************************
リンク
*****************************************/
a {
	color: #0397E5;
	text-decoration: none;
}
a:hover {
	opacity: 0.7;
	transition: all .3s;
	-webkit-transition: all .3s;
}
a img:hover {
	opacity: 0.7;
	transition: all .3s;
	-webkit-transition: all .3s;
}

/****************************************
レスポンシブ
*****************************************/
.pc {display: block;}
.sp {display: none;}

@media screen and (max-width: 480px) {
	.pc {display: none;}
	.sp {display: block;}
}

/****************************************
別ウィンドウリンク
*****************************************/
a.window {margin-right: 5px;}
a.window:after {content: "\f2d2";font-family:"Font Awesome 5 Free";vertical-align: middle;display: inline-block;margin-left: 5px;}

/****************************************
ページトップへ戻る
*****************************************/
.totop_box {
	overflow: hidden;
	text-align: right;
	padding-right: 1px;
	padding: 1% 0;
}
.totop_box a {
	font-size: 90%;
	border: 1px solid;
	border-radius: 30px;
	padding: 5px 10px;
	text-decoration: none;
}
.totop_box a:after {
	content: "\f139";
	font-family: FontAwesome;
	vertical-align: middle;
	margin-left: 5px;
	font-size: 120%;
}
.totop_box a:hover {
	text-decoration: none;
	background: #144678;
	color: white;
}


/****************************************
ヘッダー
*****************************************/
header {position: sticky;left: 0;top: 0;width: 100%;z-index: 10;background: #FFFFFF;padding-top: 0.5%;box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.2);padding:8px 0 0;}
header .alignleft,header .alignright {line-height:1.3;margin-bottom:8px;}
header .alignleft {width: 53%;display: table;}
header .alignleft h1 {display: table-cell;vertical-align: middle;text-align: left;}
header .alignleft p#logo {display: table-cell;vertical-align:middle;margin:0 5px 1% 0;}
header .alignright {width: 47%;text-align: right;display:table;}
header .alignright a {display:table-cell;}

@media screen and (max-width: 1200px) {
	header .h1area h1 {width:90%;}
	header .inner {width:94%;}
}
@media screen and (max-width: 768px) {
	header .alignleft {float: none;width: 100%;margin-top: 1%;}
	header .alignright {display: none;width: 30%;}
	header .alignleft h1,header .alignleft p#logo {display:inline-block;margin-right:10px;}
}
@media screen and (max-width: 480px) {
	header {height:50px;}
	header .inner {width:86%;}
	header .alignleft {margin-top: 0;}
	header .alignleft h1,header .alignleft p#logo {width:100%;}
	header .alignleft h1 + img,header .alignleft p#logo + img {display:none;}/*カード画像 */
	header .alignright {margin-bottom: 0;}
}
@media screen and (max-width: 420px) {
	header {height:40px;}
	header h1 img {width:45%;height:auto;}
	header p#logo img {width:45%;height:auto;}
}

/****************************************
ナビ
*****************************************/
.navi-in{
	clear: both;
	max-width: 1000px;
	padding-top: 5px;
	margin-bottom: 5px;
}
.navi-in > ul {
	width: 100%;
  padding: 0;
  list-style: none;
  display: table;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}
.navi-in > ul li {
  display: table-cell;
	vertical-align: middle;
  width: 15.3%;
  height: 50px;
  line-height: 1.3;
	border-right: 1px solid #ededed;
}
.navi-in > ul li:first-child {
	width: 8%;
	border-left: 1px solid #ededed;
}
.navi-in > ul li:last-child {
}
.navi-in > ul li:hover > ul {
  display: block;
}
/*サブメニュー*/
.navi-in > ul .sub-menu {
  display: none;
  position: absolute;
  margin-left: 0;
  min-width: 300px;
  list-style: none;
  padding-left: 0;
  background-color: #fafafa;
  z-index: 99;
  text-align: left;
}
.navi-in > ul .sub-menu li {
	width: auto;
	height: auto;
	display: block;
}
.navi-in > ul .sub-menu a {
  padding: 5%;
}
/*サブメニューのサブメニュー*/
.navi-in > ul .sub-menu ul {
  top: -50px;
  left: 240px;
  position: relative;
}
.navi-in a {
	display: block;
	font-size: 85%;
	font-weight: bold;
	padding: 5px 0;
	color:#000000;
}
.navi-in a:hover {
  background-color: #ededed;
  transition: all 0.3s ease 0s;
}
.navi-in a:hover > ul {
  display: block;
}
.navi-in a i {
	display: block;
	margin-bottom: 5%;
	color: #0397e5;
	font-size: 130%;
}

@media screen and (max-width: 768px) {
	nav#navi {display:none;}
}

/****************************************
検索フォーム
*****************************************/

/* archive-work.php */
.category_menu_tab .serch {position:relative;width:55%;}
.category_menu_tab .serch input#s {padding: 10px 15px;font-size: 100%;width: 90%;}
.category_menu_tab .serch #searchsubmit {position: absolute;right: 10px;top: auto;width: 40px;height: 40px;background-size: 100%;margin: 0;}

input#s {
	padding: 5% 20% 5% 5%;
	width: 75%;
	font-size: 80%;
}
/* 検索フォームのマーク */
#searchsubmit {position: absolute;top: 12px;right: 5px;width: 30px;height: 26px;border: none;background: url(img/search.png) no-repeat;background-size: 70%;}

@media screen and (max-width: 480px) {
	.category_menu_tab .serch {width:100%;}
	.category_menu_tab .serch #searchsubmit {top:40%;}
}

/****************************************
レイアウト
*****************************************/
section {overflow: hidden;width: 100%;}
.inner {max-width: 1000px;margin: 0 auto;overflow: hidden;}
#index main {width: 100%;}
main {overflow: hidden;width: 100%;margin: 0 auto 0; }
article#index {background: url(img/index/menu_bg.png) repeat;padding-top: 5%;}

/*section#page {float: left;width: 70%;margin: 5% 0 15% 0;}
@media screen and (max-width: 768px) {
	section#page {float: none;width: 85%;margin: 5% auto 10%;}
}*/

figure {display:block;margin:0;line-height:1;}
figcaption {text-align:center;line-height:1.8;font-size:80%;}

.aligncenter {display: block;margin-right: auto;margin-left: auto;}
.alignleft {float: left;}
.alignright {float: right;}

@media screen and (max-width: 1200px) {
	.inner {width:90%;}
}
@media screen and (max-width: 999px) {
	main {width:100%;}
}
@media screen and (max-width: 768px) {
	.inner {width:90%;}
}
@media screen and (max-width: 480px) {
	.inner {width:86%;}
}


/****************************************
サイドバー
*****************************************/
aside {float: right;width: 25%;margin: 5% 0 10% 0;}
aside a {color:#000000;}
aside h3 {color:#E2046C;text-align:center;margin-bottom:10px;}

aside #sidebar-top,aside #sidebar-menu1,aside #sidebar-menu2,aside #sidebar-menu3,aside .sidebar-other1,aside .sidebar-other2 {margin-bottom:30px;}

aside #sidebar-menu1 {
	border: 1px solid #dddddd;
	border-radius: 16px 16px 0 0;
}
aside #sidebar-menu1 h3 {
	color: #FFF;
	background: #0397e5 url(img/common/aside-h3_bg.png) no-repeat;
	background-position: center;
	background-size: cover;
	padding: 10px;
	border-radius: 15px 15px 0 0;
	margin-bottom: 0;
}
aside ul#menu-side1 li {
	border-bottom: 1px solid #ededed;
}
aside ul#menu-side1 li:first-child {background:url(img/common/menu-side1_menu-item_bg_01-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li:nth-child(2) {background:url(img/common/menu-side1_menu-item_bg_02-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li:nth-child(3) {background:url(img/common/menu-side1_menu-item_bg_03-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li:nth-child(4) {background:url(img/common/menu-side1_menu-item_bg_04-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li:nth-child(5) {background:url(img/common/menu-side1_menu-item_bg_05-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li:nth-child(6) {background:url(img/common/menu-side1_menu-item_bg_06-min.jpg) no-repeat;background-position:2%;background-size:50px;}
aside ul#menu-side1 li a {
	display: block;
	padding: 15px 0 15px 26%;
}
aside ul#menu-side1 li a:hover {
	background: #0397e5;
	color: #fafafa;
}

aside ul#menu-side2 {border-bottom: 1px solid #ddd;border-left: 1px solid #ddd;border-right: 1px solid #ddd;}
aside ul#menu-side2 li a {display:block;padding:10px 30px 10px 15px;border-top:1px solid #ddd;position:relative;}
aside ul#menu-side2 li a:after {content: "\f105";display: block;font-family: "FontAwesome";text-align: center;width: 36px;position: absolute;top: 50%;right: 0;line-height: 1;margin-top: -0.5em;}
aside ul#menu-side2 li a:hover {background:#ededed;}

aside ul#menu-side3 {font-size: 80%;margin-bottom: 30px;}
aside ul#menu-side3 li:before {content: "\f105";font-family: "FontAwesome";margin-right: 5px;}

/* メーカー */
aside .maker {margin-bottom: 30px;}
aside .maker ul {overflow: hidden;}
aside .maker ul li {float: left;width: 50%;line-height: 0;}
aside .maker p {background: #E2046C;color: #FFFFFF;padding: 3%;line-height: 1.3;}

/* お知らせ */
aside ul.parts-newslist {margin-bottom: 10px;}
aside ul.parts-newslist li {border-bottom: 1px solid #ededed;padding:5px 0;}
aside ul.parts-newslist h4 {font-size:100% !important;font-weight:normal;}
aside ul.parts-newslist h4 a {display:block;}
aside ul.parts-newslist p.date {font-size:70%;margin:0;color:#999999;}

@media screen and (max-width: 768px) {
	aside {display: none;}
}


/****************************************
404
*****************************************/
#error p {font-size: 160%;}


/****************************************
fp-free3line.php
*****************************************/
#fp-free3line {background:url(img/fp-free3line/bg-min.jpg) no-repeat;background-size:cover;background-position:center;padding:30px 0;}
#fp-free3line .sp {
	
}

@media screen and (max-width: 480px) {
	#fp-free3line {
		background: #0397e5;
		padding: 30px 0;
	}
	#fp-free3line .sp {
		width: 90%;
	}
	#fp-free3line .sp ul {
		text-align: center;
		margin-bottom: 10px;
	}
	#fp-free3line .sp ul li {
		display: inline-block;
		position: relative;
		background: #FFF;
		color: #0397e5;
		padding: 5px 10px;
		font-weight: bold;
		margin-top: 25px;
	}
	#fp-free3line .sp ul li.free {
		background: none;
		color: #FFF;
		font-size: 1.5em;
		padding: 0;
		margin: 0;
		vertical-align: middle;
	}
	#fp-free3line .sp ul li:before {
		content: "";
		display: inline-block;
		background: url(img/fp-free3line/icon-crown.png) no-repeat;
		background-size: 20px;
		position: absolute;
		width: 20px;
		height: 20px;
		top: -25px;
		left: 0;
		right: 0;
		margin: auto;
		z-index: 1;
	}
	#fp-free3line .sp ul li.free:before {
		content: none !important;
	}
	#fp-free3line .sp p.text {
		text-align: center;
		color: #FFF;
		font-size: 1.3em;
		font-weight: bold;
		margin: 10px auto 0;
	}
}

/****************************************
index トップページ
*****************************************/
#index {overflow: hidden;}
#index h2 {margin: 0 0 5%;font-weight: 100;text-align: center;}
#index #top {background: url(img/index/top_bg.png) no-repeat;background-size: cover;background-position: center;text-align: center;padding:2% 0 0;}
#index #top p {margin-bottom: 0;}
#index #top p a.tocampaign {background: #000;color: #FFF;padding: 10px 15px;border-radius: 4px;} 
#index #menu ul {line-height: 0;} 
#index #menu ul li {float: left;} 
#index .article {overflow: hidden;width: 1000px;margin: 0 auto 5%;}
#index .article dl {overflow: hidden;float: left;width: 25%;}
#index .article dt span {background: #11233D;padding: 3px;margin-right: 5%;}
#index .article dt a {display: inline-block;vertical-align: middle;}
#index .article dd {padding: 3%;}
#index .article dd .more {text-align: center;}
#index .type-post {overflow: hidden;background: #FFFFFF;float: left;width: 27.7%;padding: 2%;margin: 0 2% 2% 0;box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.2);height: 320px;}
#index .type-post h2 {font-size:100%;font-weight: bold;margin-top: 0;margin-bottom: 5px;line-height: 1.3;}
#index .type-post p.post-meta {font-size: 70%;margin: 0 0 2% 0;}
#index .type-post p.post-meta span.post-date {display: block;padding-right: 0;line-height: 1;text-align: right;color: #999999;}
#index .type-post:nth-child(3n) {margin-right: 0;}
#index .type-post p.post-meta span.comment-num {float: right;}
#help-menu {padding:80px 0;}
#help-menu ul.help-menu-list {display:table;}
#help-menu ul.help-menu-list li {display:table-cell;}

@media screen and (max-width: 980px) {
	#index .type-post {height: 310px;}
}
@media screen and (max-width: 768px) {
	#index #slide {padding: 30%;margin-bottom: -14%;}
	section#menu {width: 90%;}
	section#menu ul.menuB li {width: 32.5%;}
	#index .insta {width: 90%;}
	#index .information {width: 90%;}
	#index .information dt {width: 30%;}
	#index .information dd {width: 70%;}
	#index .type-post {width: 45%;height: auto;}
	#index .type-post:nth-child(even) {margin-right: 0;}
	#index .type-post:nth-child(odd) {margin-right: 2%;}
	#index .type-post:nth-child(even) {margin-right: 0;}
}
@media screen and (max-width: 580px) {
	#index .information dt {float: none;width: 100%;margin-bottom: 1%;}
	#index .information dd {float: none;width: 100%;}
}
@media screen and (max-width: 480px) {
	#index #slide {margin-bottom: -26%;padding: 40%;}
	section#menu ul.menuA li:first-child {float: none;}
	section#menu ul.menuA li:last-child {float: none;}
	section#menu ul.menuA li {width: 100%;}
	section#menu ul.menuB li {width: 48%;margin-right: 2%;margin-bottom: 2%;}
	section#menu ul.menuB li:nth-child(even) {margin-right: 0;}
	section#article {padding-bottom: 20%;}
	#help-menu a.help-title {}
	#help-menu a.help-title:before {content:"";display:inline-block;background:url(img/index/help_title_sp-min.png) no-repeat;background-size:contain;width:100%;height:110px;}
	#help-menu a.help-title img {display:none;}
	#help-menu ul.help-menu-list li {display:block;width:50%;float:left;}
}
@media screen and (max-width: 380px) {
	#index .type-post {float: none;width: 96%;margin: 2% 0;}
	#index .type-post img {width: 30%;float: left;}
	#index .type-post h2 {width: 67%;float: right;font-size: 90%;}
	#index .type-post p.post-meta {width: 67%;float: right;margin: 0;}
	#index .type-post p.post-meta span.post-date {display: inline-block;float: right;}
	#index .type-post:nth-child(odd) {margin-right: 0;}
}

/****************************************
共通
*****************************************/
.mg10 {margin-bottom:10px;}
.mg20 {margin-bottom:20px;}
.mg30 {margin-bottom:30px;}
.mg50 {margin-bottom:50px;}
span.fontbold {font-weight:bold;}
span.blue {color:#0397e5;}


caption {font-size:80%;margin-bottom:5px;}

/* コンタクト */
ul.contact {
	text-align: center;
}
ul.contact li {
	float: left;
	width: 50%;
	line-height: 30px;
}
ul.contact li:first-child {
	font-size: 130%;
	font-weight: bold;
}
ul.contact li a {
	background: #ffa500;
	color: #FFFFFF;
	padding: 10px;
	display: block;
	border: 1px solid transparent;
	font-weight: bold;
}
ul.contact li a:hover {
	background: #FFFFFF;
	color: #ffa500;
	border: 1px solid #ffa500;
}
ul.contact li a.tel {
	font-size: 1.3em;
}

@media screen and (max-width: 480px) {
	ul.contact li {
		float: none;
		width: 100%;}
}
	
/* ページ内リンク（アンカー）のズレの処理 */
.anchor{display:block;padding-top:150px;margin-top:-150px;}

/* ブリンク（点滅） */
.blinking{-webkit-animation:blink 1s ease-in-out infinite alternate;-moz-animation:blink 1s ease-in-out infinite alternate;animation:blink 1s ease-in-out infinite alternate;}
@-webkit-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}
@-moz-keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}
@keyframes blink{
	0% {opacity:0;}
	100% {opacity:1;}
}

/* ・ドットを使うとき */
span.dot {
	margin: 0 -5px;
}

/* タイトル部分（パンくず） */
section#parts-breadcrumbs {
	width:100%;
	background: #f0faff;
	padding: 20px 0;
}
.breadcrumbs {
	font-size: .8em;
}

@media screen and (max-width: 480px) {
	section#parts-breadcrumbs {padding:10px 0;}
}

/* ストライプ */
.stripe {
	width: 100%;
	height: 20px;
	background-image: linear-gradient( -45deg, rgba(0, 0, 0, 0) 25%, #f3f3f3 25%, #f3f3f3 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.0) 75%, #f3f3f3 75%, #f3f3f3 );
	background-size: 12px 12px;
	margin-bottom: 5%;
}
.stripe_mini {
	width: 60%;
	margin: 0 auto;
	height: 15px;
	background-image: linear-gradient( -45deg, rgba(0, 0, 0, 0) 25%, #f3f3f3 25%, #f3f3f3 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.0) 75%, #f3f3f3 75%, #f3f3f3 );
	background-size: 5px 5px;
}

/* 下向きトライアングル */
.triangle {margin: 7% 0 0 0;text-align: center;}
.triangle span {width: 0;height: 0;border-top: 30px solid #0397e5;border-right: 80px solid transparent;border-bottom: 30px solid transparent;border-left: 80px solid transparent;}

@media screen and (max-width: 480px) {
	.triangle {margin:50px 0 0 0;}
}

.tolink {text-align: center;}
a.tolist {background: #E2046C;color: #FFFFFF;-webkit-transition: all .3s;transition: all .3s;padding: 5px;font-size: 90%;}
a.tolist:hover {background: #0397e5;}
a.blue {background: #0397e5;color: #FFFFFF;-webkit-transition: all .3s;transition: all .3s;padding: 10px 20px;font-size: 90%;}

/* 別ウィンドウリンク */
a.window {margin-right: 5px;}
a.window:after {content:"\f08e";font-family:FontAwesome;vertical-align:middle;display:inline-block;margin-left:5px;}

/* 問い合わせボタン */
.reserve {text-align: center;margin-bottom: 5%;}
.reserve a {position: relative;display: inline-block;padding: 2% 5%;text-decoration: none;color: #FFF;background: #11233D;transition: .4s;margin-bottom: 1%;}
.reserve a:hover {background: #0B1727;}

@media screen and (max-width: 480px) {
	.reserve a {padding: 2% 3%;}
}
@media screen and (max-width: 380px) {
	.reserve a {padding: 2% 3%;}
}

/* ミトン・鍋・泡立て器イラスト */
img.deco {width:15%;position:absolute;top:0;left:0;right:0;margin: auto;}

@media screen and (max-width: 480px) {
	img.deco {width: 25%;}
}


/****************************************
page-slug.php 固定ページ共通
*****************************************/
.msg {overflow: hidden;margin-bottom: 30px;}
#archive .post {margin-bottom: 30px;}

/****************************************
page 固定ページ
*****************************************/
section#contents .content {position: relative;float: left;width: 72%;margin: 5% 0;}
section#wide_contents .content {position: relative;width: 72%;margin: 5% auto;}

/*
section#contents .content h3::before,
section#contents .content h3::after{
	content: "";
	position: absolute;
	bottom: 0;
}
section#contents .content h3:before{
	border-bottom: 3px solid #FFA500;
	width: 100%;
}
section#contents .content h3:after{
	border-bottom: 3px solid #D8D8D8;
	width: 100%;
}*/

@media screen and (max-width: 1024px) {
	section#wide_contents .content {
		width: 80%;
	}
}
@media screen and (max-width: 768px) {
	section#contents .content {
		float: none;
		width: 100%;
		margin: 5% 0 100px;
	}
	section#wide_contents .content {
		width: 100%;
		margin: 5% 0 100px;
	}
}
@media screen and (max-width: 480px) {
	section#contents .content {
		margin: 30px 0 50px;
	}
}

/****************************************
helpの共通
*****************************************/
#help ul.menu {overflow:hidden;margin:50px 0;}
#help ul.menu li {float:left;width:50%;margin-bottom:10px;}
#help .box {margin:30px 0;}
#help .txt {width:96%;margin:0 auto;}
#help .stripe-box {position: relative;background: linear-gradient(-45deg,#fff 25%, #3cb3e4 25%,#3cb3e4 50%, #fff 50%,#fff 75%, #3cb3e4 75%,#3cb3e4);background-size: 8px 8px;padding: 8px;}
#help .stripe-box .in {overflow:hidden;background:#FFFFFF;padding:30px 20px 10px;}
#help .stripe-box .in-box {overflow:hidden;margin-bottom:10px;}
#help .stripe-box h3 {position:absolute;left:50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);background:#FFFFFF;padding:0 30px;}
#help .stripe-box img.left {float:left;max-width:48%;}
#help .stripe-box p.right {float:right;max-width:49%;}
#help .help-contact {}
#help .help-contact img.img-pc {
	display: block;
}
#help .help-contact img.img-tb,
#help .help-contact img.img-sp {
	display: none;
}

@media screen and (max-width: 768px) {
	#help .help-contact img.img-pc {
		display: none;
	}
	#help .help-contact img.img-tb {
		display: block;
	}
}
@media screen and (max-width: 480px) {
	#help .stripe-box img.left {float:none;max-width:100%;}
	#help .stripe-box p.right {float:none;max-width:100%;}
	#help .stripe-box h3 {width:50%;text-align:center;}
	#help .help-contact img.img-tb {
		display: none;
	}
	#help .help-contact img.img-sp {
		display: block;
	}
}

/****************************************
トイレの選び方 help/toilettype/
*****************************************/
ul.help-menu {overflow:hidden;margin:30px 0;}
ul.help-menu li {float:left;width:50%;background:#f0faff;}
ul.help-menu li a {display:block;color:#3cb3e4;padding:5px 15px;position:relative;}
ul.help-menu li a:after {content: "\f105";display: block;font-family: "FontAwesome";text-align: center;width: 36px;position: absolute;top: 50%;right: 0;line-height: 1;margin-top: -0.5em;}
ul.help-menu li a:hover {background:#3cb3e4;color:#FFFFFF;}

#toilet1,#toilet2,#toilet3,#toilet4 {margin-bottom:30px;}
.merit {overflow:hidden;background:#FFF2F3 url(img/help/icon_merit.png) no-repeat;background-size:8%;background-position:20px 20px;padding:20px 0;}
.merit h3 {color:#fe99a1;}
.demerit {overflow:hidden;background:#F2F5FF url(img/help/icon_demerit.png) no-repeat;background-size:8%;background-position:20px 20px;padding:20px 0;}
.demerit h3 {color:#99B5FF;}
ul.list {width:85%;float:right;list-style:disc inside;}

@media screen and (max-width: 768px) {
	.merit,.demerit {padding:20px 15px 20px 0;background-position:12px 22px;}
}
@media screen and (max-width: 480px) {
	ul.help-menu li {float:none;width:100%;}
}

/****************************************
トイレの便利な機能 help/function/
*****************************************/
table.comparison {width:100%;}
table.comparison tr {display:block;margin-bottom:10px;}
table.comparison th {width:14%;}
table.comparison td {width:43%;}
table.comparison td.txt {vertical-align:top;font-size:95%;}

@media screen and (max-width: 480px) {
	table.comparison th,table.comparison td {display:block;}
	table.comparison th {width:100%;}
	table.comparison th img {width:30%;}
	table.comparison td.img {text-align:center;width:100%;}
	table.comparison caption {background:#ededed;}
}

/****************************************
工事の流れ flow
*****************************************/
#flow .towork {margin: 30px 0;}
#flow .towork ul {overflow: hidden;width: 100%;margin: 0 auto;padding: 0;}
#flow .towork ul li {float: left;width: 15%;height: 210px;background: #f0faff;padding: 10px 10px 0 10px;position: relative;margin-right: 20px;}
#flow .towork ul li:before {content: "";display: inline-block;border: 10px solid transparent;border-left-color: #f0faff;position: absolute;right: -20px;top: 50%;margin-top: -9px;}
#flow .towork ul li:last-child {margin-right: 0;}
#flow .towork ul li:last-child:before {border: none;}
#flow .towork ul li span {font-weight: bold;display: block;text-align: center;color: #333;line-height: 1.2;}
#flow .towork ul li span.number {font-family: Roboto;margin-right: 5px;font-size: 20px;background: #0397e5;color: #fff;height: 28px;width: 21px;padding: 0 4px;margin: 0 auto 5px;border-radius: 50%;line-height: 28px;text-shadow: 0px 0px 0px #666;vertical-align: sub;}
#flow .towork ul li span:nth-child(4) {font-weight: bold;font-size: 93%;}
#flow .towork ul li p {font-size: 90%;margin: 10px 0;line-height: 1.4;}
#flow .towork ul li span.free {font-weight: normal;background: #FF264A;color: #FFFFFF;font-size: 80%;padding: 4px;margin-top: 5px;}
#flow .tocompletion {margin: 30px 0;}
#flow .tocompletion .box {overflow: hidden;margin-bottom: 3%;}
#flow .tocompletion h3 {position:relative;display:inline-block;margin-bottom: 2%;width: 52%;padding-left: 6%;font-weight: bold;}
#flow .tocompletion h3 span.number {position: absolute;top:25%;left:0;font-family:Roboto;font-size:20px;font-weight: bold;background:#0397e5;color:#ffffff;padding:0 8px;border-radius:50%;line-height:28px;text-shadow:0px 0px 0px #666;vertical-align:middle;}
#flow .tocompletion h3 span.subttl {display: block;font-size:70%;font-weight: normal;color:#999999;}
#flow .tocompletion .detailbox {overflow: hidden;position: relative;margin-bottom: 3%;}
#flow .tocompletion .box img.number {position: absolute;width: 20%;z-index: -99999;}

@media screen and (max-width: 768px) {
	#flow .towork ul li {width:14.7%;}
}
@media screen and (max-width: 480px) {
	#flow .towork ul li {width:83%;margin:0 0 20px;height:auto;padding:15px 30px 20px 30px;}
	#flow .towork ul li:before {content:"";position:absolute;top:100%;left:0;right:0;width:0;margin:auto;border:15px solid transparent;border-top:15px solid #f0faff;}
	#flow .towork ul li .space:after {content:"";}
	#flow .towork ul li p {margin:10px 0 0;}
	#flow .tocompletion h3 {width:89%;padding-left:40px;}
	#flow .tocompletion .detailbox figure {float:none;width:100%;text-align:center;margin-bottom:20px;}
}

/****************************************
ごあいさつ greeting
*****************************************/
#greeting {
	
}
#greeting .welcome {
	
}
#greeting .problem {
}
#greeting .problem h3 {
	position: static !important;
	overflow: hidden;
	margin: 0;
	padding: 0;
}
#greeting .problem h3::before,
#greeting .problem h3::after {
	content: "";
	position: static;
	bottom: 0;
	border: none !important;
}
#greeting .problem .list {
	position: relative;
	margin-bottom: 8%;
}
#greeting .problem .list h4 {
	width: 40%;
	position: absolute;
	background: #FFF;
    border: 3px solid #E5F3FF;
	top: -15px;
    right: 0;
    left: 0;
    margin: auto;
	padding: 5px 0 5px 11%;
}
#greeting .problem .list img.checkicon {
	position: absolute;
	left: 19%;
    width: 15%;
    top: -25px;
}
#greeting .problem .list ul {
	background: #E5F3FF;
	padding: 8% 5% 5%;
}
#greeting .problem .list ul li {
	border-bottom: 1px dotted #FFF;
	padding: 10px 0;
}
#greeting .problem .list ul li:before {
	content: "\f14a";
	font-family: 'Font Awesome\ 5 Free';
	margin-right: 5px;
}

/****************************************
スタッフ staff
*****************************************/
#staff .introduction {
	overflow: hidden;
	margin-top: 30px;
}
#staff dl {
	display: table;
	margin-bottom: 3%;
}
#staff dl dt {
	display: table-cell;
	max-width: 28%;
	vertical-align: top;
}
#staff dl dd {
	position: relative;
	display: table-cell;
	width: 76.5%;
	vertical-align: middle;
	padding-left: 3%;
}
#staff dl dd p.comment {
	font-size: 80%;
	background: #f0faff;
	padding: 2% 20% 2% 3%;
	border-radius: 4px;
	line-height: 1.3;
}
#staff dl dd img.comment {
	position: absolute;
	bottom: 10%;
    right: 3%;
}

/****************************************
会社概要 company
*****************************************/
#comapny {
	overflow: hidden;
}
#company table {
	width:100%;
	margin:0 auto 50px;
}
#company table tr th {
	width:20%;
	padding:2%;
	background:#fafafa;
}
#company table tr td {
	padding: 2%;
}
#company table tr td span {
	margin-right: 5px;
	border-radius: 2px;
}
#company table tr td p.ttl {
	margin: 0;
	font-weight: bold;
}
#company ul {
	list-style: inside;
}
#company iframe {
	margin-top: 10px;
}

/* 理念 */
#company .philosophy {text-align:center;margin-bottom:50px;background: url(img/company/philosophy_bg.png);border-radius:4px;padding:10px 0 0;}
#company .philosophy h2 {display: inline-block;border-bottom: 2px solid !important;color:#000000;}
#company .philosophy .box {margin:0 auto;padding:5% 0 3%;}
#company .philosophy .box p {font-size: 120%;line-height: 2;font-weight: bold;}

/* 支払い */
#company #payment {margin-bottom:50px;}
#company #payment dl {display:table;width:100%;}
#company #payment dt,#company #payment dd {display:table-cell;padding:10px 0;}
#company #payment dt {width:20%;vertical-align:middle;border-bottom:1px solid #ededed;}
#company #payment dd {width:80%;border-bottom:1px solid #ededed;}

@media screen and (max-width: 480px) {
	#company table {width:100%;}
	#company table tr {display:block;margin-bottom:10px;border-bottom:1px solid #ededed;padding:0 0 10px;}
	#company table tr th {display:block;width:100%;background:none;font-weight:normal;font-size:85%;padding:0;text-align:left;margin-bottom:5px;}
	#company table tr td {display:block;width:100%;background:none;font-weight:bold;padding:5%;padding:0;}
	#company table tr td p.ttl {font-weight: normal;}
	#company .philosophy {font-size:85%;}
	#company .philosophy .box {width:90%;margin:0 auto;}
	#company .philosophy .box p {font-size: 110%;}
	#company #payment dl {margin-bottom:10px;}
	#company #payment dt,#company #payment dd {display:block;width:100%;}
	#company #payment dt {border-bottom:none;padding:0;}
}


/****************************************
対応エリア　area
*****************************************/
#faq {overflow: hidden;}
#faq .set *,#faq .set *:before,
#faq .set *:after{font-family:'FontAwesome', sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;}
#faq .set dt {position: relative;margin: 0 0 1.5em 0;font-size:150%;}
#faq .set dd {margin: 0 0 2em 0;padding: 0 0 1.5em 2em;}
#faq .set dt::before {margin:0 20px 0 0;color:#ffffff;border-radius:50%;display:inline-block;width:40px;height:40px;text-align:center;font-size:90%;vertical-align:middle;}
#faq .set dt::before {padding:0.1em 0.3em;content:'\f128';background: #3cb3e4;}
#faq .set dt::after {position:absolute;top:0.5em;display:inline-block;width:0;height:0;content:'';border-width:10px 0 10px 15px;border-style:solid;}
#faq .set dt::after {left:30px;border-color:transparent transparent transparent #3cb3e4;}

@media screen and (max-width: 480px) {
	#faq .set dd {margin:0 0 30px 0;padding:0;}
	#faq .set dt {font-size:120%;}
	#faq .set dt::before {width:35px;height:35px;}
	#faq .set dt::before {padding:5px 6px;}
	#faq .set dt::after {left:25px;}
}

/****************************************
対応エリア　area
*****************************************/
#area {overflow: hidden;}
#area .box {margin: 10px 0 30px 0;}
#area p.title {
	font-size: 1.5em;
	text-align: center;
	margin: 0;
	font-weight: bold;
	background: #E2046C;
	color: #FFFFFF;
}
#area dl {
	width: 100%;
	margin: 0 0 30px;
}
#area dl dt {
	vertical-align: middle;
	padding: 10px 0;
	font-weight: bold;
}

@media screen and (max-width: 480px) {
	#area p.title {
		font-size: 1.2em;
		padding: 5px 15px;
	}
}

/****************************************
お問い合わせ　contact
*****************************************/
#page #contact .msg {margin-top:30px;}
#page #contact .step {position:relative;color:#0397e5;font-weight:bold;}
#page #contact .step:before {content:"";position:absolute;background: url(img/contact/icon.png) no-repeat;background-size:80%;background-position:left;padding:28px;}
#page #contact .step p {padding-left:55px;}

#contact table {
	width: 100%;
}
#page #contact table caption {font-weight: bold;background: url(img/contact/caption_bg.png) repeat;padding: 2%;color: #FFFFFF;font-size:100%;}
#page #contact table tr {display: table;width: 100%;}
#page #contact table th {width: 30%;padding: 2%;font-weight: normal;border-bottom: 1px solid #F5F5F5;}
#page #contact table th:last-child {border-bottom: none;}
#page #contact table th p {font-size: 80%;font-weight: normal;line-height: 1.3;margin-top: -1%;}
#page #contact table th span {background: #0397e5;color: #FFFFFF;font-size: 80%;font-weight: normal;padding: 3px;margin-left: 5px;border-radius: 2px;vertical-align: middle;}
#page #contact table td {width:70%;padding: 2%;border-bottom: 1px solid #F5F5F5;}
#page #contact table td p.memo {display: inline-block;margin-left: 5px;font-size: 70%;}
#page #contact table td input.wish {width: 25px;height: 25px;vertical-align: middle;}
#page #contact table td input.name,#page #contact table td input.kana,#page #contact table td input.tel {width: 50%;}
#page #contact table td input.mail,#page #contact table td input.time {width:90%;}
#page #contact table td input.location-date {width:30%;}
#page #contact table td input.location-time {width:40%;}
#page #contact table td label {display: inline-block;}
#page #contact input.postcode {width: 25%;margin-bottom: 2%;}
#page #contact input.add {width: 95%;}
#page #contact textarea.consultation {width: 95%;height: 200px;}
#page #contact .information {text-align: center;padding: 1% 0 0 0;font-size: 90%;margin: 5% 0 0 0;}
#page #contact input.maker {width: 80%;}
#page #contact .information p {margin: 0;}
#page #contact table td li {display:block;margin-bottom:10px;}
#page #contact table td li span {font-size:80%;margin-right:10px;}
#page #contact .btn {text-align: center;margin: 5% auto;}

@media screen and (max-width: 480px) {
	#page #contact .step:before {padding:16px;}
	#page #contact .step p {padding-left:32px;}
	#page #contact table th {
		display: block;
		width: 100%;
		padding: 5px 0;
		text-align: left;
		border: none;
	}
	#page #contact table th span {padding: 1%;}
	#page #contact table th:before {content:"■";}
	#page #contact table td {
		display: block;
		width: 100%;
		padding: 5px 0 15px;
	}
	#page #contact table td input.name,#page #contact table td input.kana,#page #contact table td input.tel,#page #contact table td input.mail,#page #contact textarea.consultation {width:94%;}
	#page #contact table td input.location-date {width:40%;}
	#page #contact table td input.location-time {width:45%;}
	#page #contact table td p.memo {margin:0;}
	#page #contact .btn {width: 80%;}
	#page #contact table td li span {display:block;}
}
@media screen and (max-width: 380px) {
	#page #contact table td input.name,#page #contact table td input.kana,#page #contact table td input.tel,#page #contact table td input.mail {width: 94%;}
	#page #contact table td input.location-date {
		width: 38%;
	}
}

/* プラグイン */
.mwform-checkbox-field label {
	display:　inline-block;
}
.mw_wp_form .horizontal-item + .horizontal-item {
	margin: 0 !important;
}
.mw_wp_form .error {
	color:　#E2046C !important;
	font-weight: bold;
}
.mw_wp_form .error::before {
	content: "\f06a";
	font-family: FontAwesome;
	margin-right: 5px;
}



/****************************************
プライバシーポリシー　privacy-policy
*****************************************/
#privacy-policy dt {
	font-weight: bold;
}
#privacy-policy dd {
	font-size: 90%;
	padding: 2% 0;
	margin-bottom: 1%;
}
#privacy-policy dd ul {
	margin-left: 3%;
	list-style: inside;
}
#privacy-policy dd img {
	display: inline;
}
#privacy-policy a {
	text-decoration: underline;
}

@media screen and (max-width: 380px) {
	#privacy-policy dd ul {
		margin-left: 2%;
	}
}


/****************************************
サイトマップ　sitemap
*****************************************/
#sitemap {
	
}

/****************************************
single 投稿ページ
*****************************************/
/****************************************
single-work.php 投稿ページ
*****************************************/
#single p.work_owner {margin: 0;}
#single .work_request {overflow: hidden;width: 100%;margin-bottom: 3%;}
#single .work_describe {width: 90%;margin: 0 auto 3%;}
#single .work_request dl {display: table;width: 99.8%;border: 1px solid #0397e5;border-radius: 4px;}
#single .work_request dt {display: table-cell;vertical-align: middle;width: 20%;background: url(img/work/work_request_bg.png) repeat;color: #FFFFFF;text-align: center;}
#single .work_request dd {display: table-cell;vertical-align: middle;width: 68%;padding: 2%;}
#single h2 {font-size:100%;margin-bottom:10px;}
#single h3 {font-size:120%;color: #0397e5;font-weight: bold;}
#single h3 span {float:right;font-size: 80%;color: #999999;}

.before_img_single {
	line-height: 0;
}
ul.before_img_double {
	overflow: hidden;
}
ul.before_img_double li {
	float: left;
    width: 50%;
	line-height: 0;
}
.after_img_single {
	line-height: 0;
}
ul.after_img_double {
	overflow: hidden;
}
ul.after_img_double li {
	float: left;
    width: 50%;
	line-height: 0;
}

@media screen and (max-width: 480px) {
	#single p.work_owner {color:#999999;font-size:90%;}
	#single .work_request dl {width:99.4%;}
	#single .work_describe {width:100%;margin:20px auto 20px;}
}

/****************************************
related-entries.php（single-work.phpの関連記事表示）
*****************************************/
#related-entries {overflow: hidden;margin-top: 5%;}
#related-entries h3 {color:#333333;}
#related-entries .category_display {overflow:hidden;position:relative;border-top:1px solid #0397e5;padding:3% 0;}
#related-entries p.category {position:absolute;right:0;top:0;font-size:80%;margin: 0 0 1% 0;color:#FFFFFF;}
#related-entries p.category span {display:block;position:relative;padding:5px 8px 5px 42px;background:#0397e5;margin-left:-33px;line-height:1.3;}
#related-entries p.category span::before {position: absolute;content:"";left:-10px;top:-33px;border: none;border-left:solid 30px white;border-top:solid 79px transparent;}
#related-entries dl {float:left;width:33.3333%;height:auto;}
#related-entries dt {padding:1%;line-height:0;}
#related-entries dd {padding:1%;}
#related-entries p.work_owner {font-size:80%;}
#related-entries p.work_request {font-size:80%;margin:0;}

@media screen and (max-width: 480px) {
	#related-entries .category_display {margin-bottom:10px;}
	#related-entries dl {width:50%;}
}

/****************************************
single-news.php 投稿ページ
*****************************************/
#single p.meta {
	background: #f0faff;
	border-bottom: 3px solid #D8F2FF;
	font-size: 80%;
    padding: 1%;
}
#single p.meta span.back {	
	text-align: left;
}
#single p.meta span.date {	
	float: right;
}
#single .news_describe {
	overflow: hidden;
	margin-bottom: 50px;
}


/****************************************
index.php
*****************************************/
.select {
	font-weight: bold;
}
.select span {
	font-weight: normal;
}


/****************************************
archive-news.php アーカイブ
*****************************************/
dl.type-news {overflow: hidden;border-bottom: 1px solid #ededed;padding: 2%;}
dl.type-news p {margin:0;}
dl.type-news dt {float:left;width:30%;}
dl.type-news dd {float:right;width:70%;}
dl.type-news h2 {font-size:100%;font-weight:normal;}
dl.type-news h2 a {display: block;}

/****************************************
archive-work.php アーカイブ
*****************************************/
.category_menu_tab {overflow:hidden;padding-bottom:40px;background-color:#fff;width: 100%;}
.tab_item {
	width: 50%;
	height: 50px;
	background: #d9d9d9;
	line-height: 50px;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
.tab_item:checked {
	background: red;
}


/*ラジオボタンを全て消す*/
input[name="tab_item"] {display: none;}

/*タブ切り替えの中身のスタイル*/
.tab_content {display:none;padding:3% 0;clear:both;overflow:hidden;}

/*選択されているタブのコンテンツのみを表示*/
#type:checked ~ #type_content,#maker:checked ~ #maker_content {display: block;}

/*選択されているタブのスタイルを変える*/
.category_menu_tab input:checked + .tab_item {background: #0397e5;color: #fff;}
.category_menu_tab ul.category {overflow: hidden;}
.category_menu_tab ul.category li {width: 49.9%;float: left;background: url(img/work/category_menu_tab_category_bg_01.jpg) no-repeat;background-size: 10%;background-position: 2%;margin-bottom: 1px;}
.category_menu_tab ul.category li {width:49.9%;float:left;margin-bottom: 1px;}
.category_menu_tab ul.category li:first-child {background:url(img/work/category_menu_tab_category_bg_01-min.jpg) no-repeat;background-size:10%;background-position:2%;}
.category_menu_tab ul.category li:nth-child(2) {background:url(img/work/category_menu_tab_category_bg_02-min.jpg) no-repeat;background-size:10%;background-position:2%;}
.category_menu_tab ul.category li:nth-child(3) {background:url(img/work/category_menu_tab_category_bg_03-min.jpg) no-repeat;background-size:10%;background-position:2%;}
.category_menu_tab ul.category li:nth-child(4) {background:url(img/work/category_menu_tab_category_bg_04-min.jpg) no-repeat;background-size:10%;background-position:2%;}
.category_menu_tab ul.category li:nth-child(odd) {margin-right: 1px;}
.category_menu_tab ul.category li a {display: block;padding: 8px 0 8px 13%;border: 1px solid #ededed;}
.category_menu_tab ul.tag li {width: 49.9%;float: left;margin-bottom: 1px;}
.category_menu_tab ul.tag li:nth-child(odd) {margin-right: 1px;}
.category_menu_tab ul.tag li:nth-child(1) {background: url(img/work/category_menu_tab_tag_bg_toto.jpg) no-repeat;background-size: 30%;background-position: 2%;}
.category_menu_tab ul.tag li:nth-child(2) {background: url(img/work/category_menu_tab_tag_bg_lixil.jpg) no-repeat;background-size: 30%;background-position: 2%;}
.category_menu_tab ul.tag li:nth-child(3) {background: url(img/work/category_menu_tab_tag_bg_inax.jpg) no-repeat;background-size: 30%;background-position: 2%;}
.category_menu_tab ul.tag li:nth-child(4) {background: url(img/work/category_menu_tab_tag_bg_panasonic.jpg) no-repeat;background-size: 30%;background-position: 2%;}
.category_menu_tab ul.tag li a {display: block;padding: 8px 0 8px 35%;border: 1px solid #ededed;}
.category_menu_tab .serch p {display: inline-block;}

ul.type-work {overflow:hidden;}
ul.type-work li {position:relative;overflow:hidden;border-top:1px solid #0397e5;padding:3% 0;}
ul.type-work li:last-child {padding-bottom: 0;}
ul.type-work li p.category {position: absolute;right: 0;top: 0;font-size: 80%;margin: 0 0 1% 0;color: #FFFFFF;}
ul.type-work li p.category span {display: block;position: relative;padding: 5px 8px 5px 42px;background: #0397e5;margin-left: -33px;line-height: 1.3;}
ul.type-work li p.category a {color: #FFFFFF;}
ul.type-work li p.category span:before {position: absolute;content: '';left: -10px;top: -33px;border: none;border-left: solid 30px white;border-top: solid 79px transparent;}
ul.type-work li .img {float: left;width: 40%;}
ul.type-work li .txt {margin-top: 3%;float: right;width: 57%;}
ul.type-work li .txt h2 {font-size: 100%;font-weight: bold;line-height: 1.3;}
ul.type-work li .txt h2:before,ul.type-work li .txt h2:after {content: none !important;}
ul.type-work li .txt p.maker {margin: 0 0 5px 0;font-size: 80%;font-weight: bold;}
ul.type-work li .txt p.work_owner {margin: 0;font-size: 80%;}
ul.type-work li .txt p.work_request {margin: 0;}
ul.type-work li .txt a.more {position: absolute;right: 0;bottom: 10%;background: #E2046C;color: #FFFFFF;-webkit-transition: all .3s;transition: all .3s;padding: 0 5px;float: right;font-size: 90%;}
ul.type-work li .txt a.more:hover {background: #0397e5;}

@media only screen and (max-width: 768px) {
	ul.type-work li .txt {margin-top:24px;}
}
@media only screen and (max-width: 480px) {
	.category_menu_tab ul.category li {float:none;width:100%;}
	.category_menu_tab ul.category li a {padding:9px 0 9px 13%;}
	.category_menu_tab ul.tag li {width:49.8%;}
	.category_menu_tab ul.tag li:nth-child(1) {background: url(img/work/category_menu_tab_tag_bg_toto.jpg) no-repeat;background-size:45%;background-position: 2%;}
	.category_menu_tab ul.tag li:nth-child(2) {background: url(img/work/category_menu_tab_tag_bg_lixil.jpg) no-repeat;background-size:45%;background-position: 2%;}
	.category_menu_tab ul.tag li:nth-child(3) {background: url(img/work/category_menu_tab_tag_bg_inax.jpg) no-repeat;background-size:45%;background-position: 2%;}
	.category_menu_tab ul.tag li:nth-child(4) {background: url(img/work/category_menu_tab_tag_bg_panasonic.jpg) no-repeat;background-size:45%;background-position: 2%;}
	.category_menu_tab ul.tag li a {padding:9px 0 9px 50%;}
	ul.type-work li {margin:0 0 30px;}
	ul.type-work li:first-child {}
	ul.type-work li .img {float:none;width:100%;margin:30px 0 10px;}
	ul.type-work li .txt {float:none;width:100%;}
	ul.type-work li .txt a.more {bottom:0;}
}

/****************************************
archive-voice.php アーカイブ
*****************************************/
ul.type-voice {overflow: hidden;}
ul.type-voice li {overflow: hidden;margin-bottom: 10px;}
ul.type-voice li h2 {margin-bottom: 10px;}
ul.type-voice li .img {float: left;width: 40%;}
ul.type-voice li .txt {float: right;width: 57%;}
ul.type-voice li .txt p.voice_owner {position: relative;display: inline-block;margin: 0 0 5% 0;padding: 5px 10px;min-width: 120px;max-width: 100%;color: #FFFFFF;font-size: 80%;background: #0397e5;}
ul.type-voice li .txt p.voice_owner:before {content: "";position: absolute;top: 100%;left: 20%;margin-left: -20px;border: 10px solid transparent;border-top: 10px solid #0397e5;}
ul.type-voice li .txt .voice_msg {font-size: 90%;}




.pagination {display: block;margin: 30px 0;}
.pagination span, .pagination a {display: block;float: left;margin: 2px 2px 2px 0;padding: 5px 10px 5px 10px;text-decoration: none;width: auto;color: #999999;background: #FFFFFF;border: 1px solid #999999;}
.pagination a:hover{color: #FFFFFF;background: #0397e5;}
.pagination .current{padding: 5px 10px 5px 10px;color: #FFFFFF;background: #0397e5;}

@media only screen and (max-width: 413px) {
	.pagination {font-size:12px;line-height:12px;}
	.pagination span, .pagination a {padding: 8px 10px 8px 10px;}
	.pagination .current{padding: 8px 10px 8px 10px;}
}
.screen-reader-text {clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute !important;width: 1px;word-wrap: normal !important;}

section.case .back {text-align: center;margin-bottom: 3%;}
section.case .back a {display: block;background: #ffae4c;width: 50%;margin: 0 auto;padding: 2% 0;border-radius: 4px;color: #FFF;font-weight: bold;}

/****************************************
検索ページ search.php
*****************************************/
p.search_items {font-weight: bold;color: #999999;font-size: 140%;}

/* 検索結果に表示された記事一覧のキーワードにハイライト（function.php） */
ul.search span.search-highlight {background:yellow;}

/* 検索結果がなかった場合 */
.re-search {margin: 30px 0;}


/****************************************
tocontact.php
*****************************************/
.tocontact {max-width: 100%;position: relative;background: url(img/tocontact.png) no-repeat;background-size: contain;padding: 20%;}
.tocontact a {position: absolute;background: red;color: #FFF;right: 5%;max-width: 100%;padding: 0 6px;border-radius: 4px;}

@media screen and (max-width: 480px) {
	.tocontact {
		background: url(img/tocontact_sp.jpg) no-repeat;
		background-size: 100%;
		padding: 115px;
	}
}
@media screen and (max-width: 400px) {
	.tocontact {
		padding: 105px;
	}
}
@media screen and (max-width: 320px) {
	.tocontact {
		padding: 90px;
	}
}

/****************************************
parts-contact-fixed.php（最下部固定）
*****************************************/
.contact-fixed {
	position: fixed;
	width: 100%;
	bottom: 0;
	background: #ffa500;
	z-index: 9;
}
.contact-fixed .box {
	width: 1100px;
	margin: 0 auto;
	position: relative;
}
.contact-fixed p {
	position: absolute;
	font-size: 80%;
	background: #FFFFFF;
	padding: 3px 15px;
	border-radius: 50px;
	left: 5%;
	top: -25%;
	border: 3px solid #ffa500;
}
.contact-fixed ul {
	display: table;
	width: 80%;
}
.contact-fixed ul li {
	display: table-cell;
	font-size: 1.7em;
	padding: 12px 0 8px;
	text-align: center;
	font-weight: bold;
}
.contact-fixed ul li.msg {
	width: 45%;
	color: #FFF;
}
.contact-fixed ul li.tel {
	width: 25%;
}
.contact-fixed ul li.tel span {
	margin-left: 15px;
}
.contact-fixed ul li.tel-text {
	display: none;
}
.contact-fixed ul a {
	color: #fff;
	display: block;
}
.contact-fixed .contact-btn {
	position: absolute;
	background: url("img/common/contact-fixed-mail.png") no-repeat;
	bottom: 0;
	right: 0;
	width: 200px;
}
.contact-fixed .contact-btn a {
	width: 220px;
	height: 110px;
	background: url("img/common/contact-fixed-mail.png") no-repeat;
	background-size: 100%;
	display: block;
	text-indent: -9999px;
	position: absolute;
	bottom: 0;
	right: 0;
}
.contact-fixed .contact-btn a:hover {
	background-image: url("img/common/contact-fixed-mail_on.png");
	opacity: 1;
}
@media screen and (max-width: 1230px) {
	.contact-fixed .box {
		width: 100%;
	}
	.contact-fixed ul {
		width: 75%;
	}
	.contact-fixed ul li.msg {
		width: 25%;
	}
	.contact-fixed ul li.tel {
		width: 15%;
	}
	.contact-fixed .contact-btn a {
		right: 20px;
	}
}
@media screen and (max-width: 1000px) {
	.contact-fixed ul {
		width: 75%;
	}
	.contact-fixed ul li.msg {
		display: none;
	}
	.contact-fixed ul li.tel {
		display: none;
	}
	.contact-fixed ul li.tel-text {
		display: block;
		color: #FFF;
	}
	.contact-fixed ul li.tel-text a {
		display: inline;
	}
}
@media screen and (max-width: 680px) {
	.contact-fixed ul li.tel {
		display: block;
		width: 70%;
	}
	.contact-fixed ul li.tel-text {
		display: none;
	}
}
@media screen and (max-width: 600px) {
	.contact-fixed p {
		display: none;
	}
}
@media screen and (max-width: 580px) {
	.contact-fixed ul li.tel {
		width: 80%;
		font-size: 1.3em;
	}
	.contact-fixed .contact-btn a {
		width: 160px;
		height: 80px;
		right: 5px;
	}
}


/****************************************
p-contact.php
*****************************************/
#p-contact {padding:7% 0 10%;position:relative;background: url(img/p-contact/bg-min.jpg) no-repeat;background-size:cover;text-align:center;}
#p-contact p.title {
	position:absolute;
	background:#ffa500;
	color:#FFFFFF;
	width:70%;
	font-weight:bold;
	font-size:170%;
	padding:5px 10px;
	text-align:center;
	top:-25px;
	right:0;
	left:0;
	margin:auto;
}
#p-contact .no1 {
	float: left;
	width: 50%;
}
#p-contact .no1:before {
	overflow: hidden;
	content: "";
	display: block;
	background: url(img/p-contact/img.png) no-repeat;
	background-size: 100%;
	background-position: center;
	width: 100%;
	height: 155px;
}
#p-contact .right {
	float: right;
	width: 45%;
	color: #ffa500;
}
#p-contact .tel,
#p-contact .mail {
	border: 1px solid #ffa500;
	text-align: center;
	background:#FFFFFF;
}
#p-contact a {color:#ffa500;}
#p-contact .tel {margin-bottom:5px;padding:10px;}
#p-contact .tel a {font-size:160%;}
#p-contact .tel span {display:block;}
#p-contact .mail a {padding:10px;display:block;}
#p-contact .mail a:hover {
	opacity: 1;
	background: #ffa500;
	color: #FFFFFF;
}

@media screen and (max-width: 1200px) {
	#p-contact p.title {width:80%;}
}
@media screen and (max-width: 980px) {
	#p-contact p.title {width:90%;}
}
@media screen and (max-width: 880px) {
	#p-contact {
		padding: 130px 0 10%;
	}
}
@media screen and (max-width: 768px) {
	#p-contact {
		padding: 7% 0 10%;
		position: relative;
		background: url(img/p-contact/bg_sp-min.jpg) no-repeat;
		background-size: cover;
		text-align: center;
	}
	#p-contact p.title {
		font-size: 1.3em;
	}
	#p-contact .no1 {
		float: none;
		width: 80%;
		margin:0 auto 30px;
	}
	#p-contact .no1:before {
		background: url(img/p-contact/img_sp.png) no-repeat;
		background-size: 100%;
		background-position: center;
		width: 100%;
		height: 200px;
	}
	#p-contact .right {float:none;width:100%;}
}
@media screen and (max-width: 480px) {
	#p-contact {
		padding: 50px 0 60px;
	}
	#p-contact p.title {
		font-size: 1.1em;
		width: 80%;
	}
	#p-contact .no1 {
		width: 100%;
		margin: 0 auto 10px;
	}
	#p-contact .no1:before {
		height: 120px;
	}
	#p-contact .right {float:none;width:100%;}
}

/****************************************
parts-greeting.php
*****************************************/
#parts-greeting {background: url(img/parts-greeting/bg-min.jpg) no-repeat;background-size: cover;background-position: center;padding:80px 0;}
#parts-greeting .inner {max-width: 900px;}
#parts-greeting .box {display: table;}
#parts-greeting .box .left {display: table-cell;width: 70%;padding-right: 5%;vertical-align: middle;font-size: 90%;}
#parts-greeting .box .left ul li {display: inline-block;margin-right: 10px;}
#parts-greeting .box .left ul li:before {content: "\f105";font-family: "FontAwesome";margin-right: 5px;}
#parts-greeting .box .right {display: table-cell;width: 30%;vertical-align: middle;}

@media screen and (max-width: 480px) {
	#parts-greeting .box .left,#parts-greeting .box .right {display:table;width:100%;}
	#parts-greeting .box .left {margin-bottom:10px;}
	#parts-greeting .box .right {text-align:center;}
	#parts-greeting .box .right img {width:60%;}
}

/****************************************
parts-footerline.php
*****************************************/
#parts-footerline {
	text-align: center;
}
#parts-footerline .reason {
	overflow: hidden;
	padding: 100px 0;
	background: url(img/parts-footerline/reason_bg.jpg) no-repeat;
	background-size: cover;
	background-position: center;
}
#parts-footerline .reason ul {
	overflow: hidden;
	width: 99%;
	margin: 0 auto 30px;
}
#parts-footerline .reason ul li {
	overflow: hidden;
	display: table;
	width: 100%;
	margin-bottom: 25px;
	border-radius: 10px;
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 5px 0 rgba(0, 0, 0, 0.08);
}
#parts-footerline .reason ul li:last-child {
	border: none;
}
#parts-footerline .reason h5 {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	font-weight: bold;
	font-size: 1.5em;
	padding: 25px;
	width: 45%;
	color: #FFF;
	background: #0397e5 url(img/parts-footerline/h5_bg.png) no-repeat;
	background-position: center;
	background-size: 40%;
}
#parts-footerline .reason .addition {
	display: table-cell;
	background: #FFF;
	vertical-align:middle;
	text-align: left;
	padding: 25px;
}
#parts-footerline .area {position:relative;background:#FFFFFF;padding:30px 0 50px;}
#parts-footerline .area p.title {
	position:absolute;
	background:#0397e5;
	color:#FFFFFF;
	width:70%;
	font-weight:bold;
	font-size:170%;
	padding:5px 10px;
	text-align:center;
	top:-25px;
	right:0;
	left:0;
	margin:auto;
}
#parts-footerline .area .city {color: #333333;margin:70px 0;float:left;width:70%;text-align:left;padding-right:5%;}
#parts-footerline .area .city .sta {font-size:70%;color:#999999;}
#parts-footerline .area .city .sta p.sta-title {font-weight:bold !important;}
#parts-footerline .area img {width:25%;margin:60px 0 0 0;}

@media screen and (max-width: 1200px) {
	#parts-footerline .area p.title {width:80%;}
}
@media screen and (max-width: 980px) {
	#parts-footerline .area p.title {width:90%;}
}
@media screen and (max-width: 768px) {
	#parts-footerline .reason {
		overflow: hidden;
		padding: 80px 0;
		background: url(img/parts-footerline/reason_bg_tb.jpg) no-repeat;
		background-size: cover;
		background-position:center;
	}
	#parts-footerline .area p.title {
		font-size: 110%;
	}
	#parts-footerline .area .city {
		float: none;
		width: 100%;
		margin: 30px 0 0;
	}
	#parts-footerline .area img {
		width:100%;
		margin:0;
	}
	#parts-footerline .area .city .sta p.sta-title {
		margin-bottom: 0;
	}
}
@media screen and (max-width: 480px) {
	#parts-footerline .reason {
		overflow: hidden;
		padding: 50px 0;
		background: url(img/parts-footerline/reason_bg_sp.jpg) repeat;
		background-size: auto;
	}
	#parts-footerline .area p.title {
		width: 80%;
	}
	#parts-footerline .area {
		padding: 50px 0 60px;
	}
	#parts-footerline .reason ul {
		width: 100%;
	}
	#parts-footerline .reason ul li,
	#parts-footerline .reason h5,
	#parts-footerline .reason .addition {
		display: block;
		width: 100%;
	}
	#parts-footerline .reason h5 {
		padding: 10px 0;
		font-size: 1.3em;
		line-height: 25px;
	}
	#parts-footerline .reason .addition {
		width: auto;
		padding: 20px;
	}
}

/****************************************
フッター
*****************************************/
footer {font-size: 90%;position: relative;background: #555555;clear: both;color: #FFFFFF;padding:5% 0 7%;}
footer::before {content: "";position: absolute;width: 200px;height: 100px;background: #555555;-moz-border-radius: 300px 300px 0 0;-webkit-border-radius: 300px 300px 0 0;border-radius: 300px 300px 0 0;top: -60px;left: 0;right: 0;margin: auto;}
footer .totop-fixed img.icon {
	position: fixed;
	bottom: 120px;
	right: 40px;
	z-index: 99;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
}
footer .totop-fixed a:hover {
	opacity: 1; /*外すとマウスオーバーでチラつく*/
}
footer .totop {position: relative;}
footer .totop img.icon {position:absolute;top:-90px;left:0;right:0;margin:0 auto;transition:0.5s;width:40px;height:auto;}
footer .totop img.icon:hover {-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-ms-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg);}

footer a {color:#FFFFFF;}
footer .footer-widget {margin-bottom:20px;}
footer .footer_left,footer .footer_center,footer .footer_right {float:left;}
footer .footer_left {width:35%;margin-right:40px;}
footer .footer_center,footer .footer_right {width:28%;margin-right:40px;}
footer .footer_right {margin-right: 0 !important;}
footer h5 {font-size:100%;margin:0 0 10px;}

@media screen and (max-width: 1024px) {
	footer {padding:5% 0 10%;}
	footer .totop img.icon {top:-70px}
}	
@media screen and (max-width: 768px) {
	footer {padding:5% 0 14%;}
	footer::before {width: 150px;top: -40px;height: 80px;}
	footer .totop {margin-bottom: 5%;}
	footer .totop img.icon {top:-50px;}
	footer .footer_left,footer .footer_center,footer .footer_right {float:none;width:100%;}
}
@media screen and (max-width: 480px) {
	footer {padding:5% 0 20%;}
	footer a {display:block;}
	footer::before {width: 120px;top: -30px;height: 60px;}
	footer .totop-fixed img.icon {
		width: 50px;
		right: 15px;
		bottom: 90px;
	}
	footer .totop img.icon {top:-30px;width:30px;height:30px;}
	footer .inner {padding-top:25px;}
	footer .inner .footer_contents {float: none;width: 100%;}
}
@media screen and (max-width: 320px) {
	footer {padding:5% 0 22%;}
}

/* フッター左 */
footer .footer_left iframe {margin-top:10px;}

/* フッター中央とフッター右 */
footer .footer_center ul li,footer .footer_right ul li {position:relative;padding-left:15px;}
footer .footer_center ul li:before,footer .footer_right ul li:before {position: absolute;content: "\f105";font-family: FontAwesome;left: 0;}
footer .footer_center ul li ul,footer .footer_right ul {width:100%;}
footer .footer_center ul li ul li::before,footer .footer_right ul li ul li::before {position:absolute;content:"\f105";font-family:FontAwesome;left: 0;}

.footer_right ul#menu-foot4 {font-size:80%;}

/* コピーライト */
#copyright {clear: both;padding-top: 3%;margin-bottom: 0;text-align: center;}

@media screen and (max-width: 480px) {
	#copyright {font-size: 90%;}
}

a.link {color: #FFF;text-align: center;}

/****************************************
フォーム
*****************************************/

input[type="text"],
input[type="tel"],
input[type="password"],
input[type="email"],
input[type="search"],
textarea {
	margin: 0;
	padding: 10px;
	max-width: 100%;
	outline: none;
	border: 1px solid #ddd;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background: #fafafa;
	color: #777;
	vertical-align: bottom;
	font-size: 100%;
}
textarea {
	overflow: auto;
}

input[type="text"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
	border: 1px solid #fafafa;
	background: #f0faff;
 	color: #333333;
}
/* submit・reset・button */
input[type="submit"],input[type="reset"],input[type="button"] {display: inline-block;border:2px solid #0397e5;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;text-decoration: none;font-weight: bold;line-height:50px;cursor: pointer;font-size:120%;color:#0397e5;background:#FFFFFF;-webkit-transition: all .3s;transition: all .3s;width:30%;-webkit-appearance: none;}
input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {color:#FFFFFF;background:#0397e5;}
input[type="submit"]:active,input[type="reset"]:active,input[type="button"]:active {position:relative;}
input[type="file"] {margin-bottom:20px;}

@media screen and (max-width: 768px) {
	input[type="submit"],input[type="reset"],input[type="button"] {width:35%;}
}
@media screen and (max-width: 480px) {
	input[type="submit"],input[type="reset"],input[type="button"] {width:85%;font-size:100%;margin-bottom:10px;}
}