/*
 Template:     design1
 Theme Name:   miurajiko
 Theme URI: https://miurajiko.com/miurajiko/
 Author: systemknowledge
 Version:      1.0.0
*/

/*--------------------------------------------------------------
CSS Document
--------------------------------------------------------------*/

/* Add your custom css below
-------------------------------------------------------------- */
/* 共通 */
body
{
	/* font-family: "源ノ角ゴシック",sans-serif !important; */
	color: #000;
	font-size: 1rem;
	letter-spacing: 0.1em;
	line-height: 1.8;
}

hr {
	margin: 30px 0 !important;
}

h4 {
	font-size: 120% !important;
	margin: 30px 0 !important;
}

.fa
{
	margin-right: 10px;
}

table th
{
	font-size: 1rem;
}

table > thead > tr > th,
table > tbody > tr > th,
table > tfoot > tr > th,
table > thead > tr > td,
table > tbody > tr > td,
table > tfoot > tr > td
{
	padding: 10px;
}

.archive .list-article
{
	border: none;
}

/* ナビゲーションメニュー */

.onepress-menu ul
{
	min-width: 15em;
	width: 15em;
}

.onepress-menu ul li a ,
.onepress-menu a
{
	font-family: initial;
	font-size: initial;
}

.flex
{
	display: flex;
	list-style-type: none;
	flex-wrap: nowrap !important;
	padding: 0;
}

.flex li
{
	margin: 5px !important;
	width: auto !important;
	padding: 0 !important;
}


/* flexbox表示の設定 半分 */
/* 半分 */
.flex-half
{
	display: flex;
	list-style: none;
	padding: 0;
	justify-content: center;
}

.flex-half .flex-item
{
	width: 40%;
	margin: 1rem;
}

.flex-half .flex-item50
{
	width: 50%;
	margin: 3em 0;
	padding: 1em;
}

img.flex-item50-img
{
	width: 100%;
}

.flex-right
{
	flex-direction: row-reverse;
}

/* 3分の1*/
.flex-33
{
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.flex-33 .flex-item
{
	width: 33%;
	margin: 30px 0;
}

/* 4分の1*/
.flex-25
{
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
	justify-content: center;
}

.flex-25 .flex-item
{
	width: 23%;
	margin-left: 0;
	margin-bottom: 0;
}

/*flexbox表示の設定 5分の1*/
.flex-20
{
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
	justify-content: center;
}

.flex-20 .flex-item
{
	width: 20%;
	margin-left: 0;
	margin-bottom: 0;
}

@media screen and (max-width: 1140px) {

	.onepress-menu-mobile ul.sub-menu
	{
		width: 100%;
	}
	
}


@media screen and (max-width: 768px) {

	.flex-33 .flex-item
	{
		width: 49%;
	}
}


.btn-area
{
	margin: 30px auto;
}

.btn-blue
{
	background: #00589b;
}

.btn-orange
{
	background: #ffa352;
}

.btn-black
{
	background: #000;
}

.link-btn
{
	color: #fff;
	padding: 15px 35px;
	display: inline-block;
	border-radius: 35px;
	font-weight: 500;
}

.link-btn:hover
{
	color: #ffe900;
	text-decoration: none;
}


/* ----- トップページ ----- */
.section-title
{
	font-weight: 700 !important;
}

.hero-slideshow-wrapper
{
	height: 100% !important;
}

.backstretch
{
	width: 100%;
	height: 50% !important;
	position: initial !important;
}

.backstretch img
{
	width: 100% !important;
	left: 0 !important;
	height: auto !important;
	position: initial !important;
}


/*  高圧油圧出張サービス */
section#about
{
	background: linear-gradient(#d3251e, #ec5664);
	color: #fff;
	font-size: 120%;
}

section#about h4
{
	position: relative;
	display: inline-block;
	padding: 0 55px;
}

section#about h4:before
{
	left: 0;
}

section#about h4:after
{
	right: 0;
}

section#about h4:after,
section#about h4:before
{
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 45px;
	height: 1px;
	background-color: #fff;
}

section#about h4:after,
section#about h4:before
{
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 45px;
	height: 1px;
	background-color: #fff;
}

section#about .hydraulic-hose-repair-service
{
	text-align: center;
}

section#about .hydraulic-hose-repair-service ul.target-hose
{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}

section#about .hydraulic-hose-repair-service ul.target-hose li
{
	width: 30%;
	padding: 0 5px;
	margin-left: 25px;
	background-color: #fff;
	color: #f00;
	padding: 20px;
	text-align: center;
}

section#about .hydraulic-hose-repair-service ul.truck
{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}

section#about .hydraulic-hose-repair-service ul.truck li
{
	width: 33%;
	padding: 0 5px;
	color: #f00;
	text-align: center;
}


/* サービス内容 */
section#business .business_box
{
	padding: 0px 5px;
}

section#business h3.pt
{
	margin: 20px 0;
	text-align: center;
	font-size: 120%;
}

section#business a
{
	text-decoration: none;
	color: #22498e;
}

section#business .business_more_btn
{
	background: #00589b;
	color: #fff;
	padding: 10px 60px 10px 20px;
	display: inline-block;
	margin: 20px 0 40px;
	border-radius: 10px;
	position: relative;
}
section#business .business_more_btn:before
{
	width: 20px;
	height: 20px;
	border: 1px solid #fff;
	border-radius: 50%;
	top: calc(50% - 10px);
	right: 20px;
	position: absolute;
	content: "";
}
section#business .business_more_btn:after
{
	width: 6px;
	height: 6px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	top: calc(50% - 3px);
	right: 28px;
	transform: rotate3d(0, 0, 1, -45deg);
	position: absolute;
	content: "";
}
section#business .business_more_btn:hover:before
{
	border: 1px solid #00589b;
}
section#business .business_more_btn:hover:after
{
	border-right: 1px solid #00589b;
	border-bottom: 1px solid #00589b;
}

/* アクセス */
section#access
{
	padding: 0;
}
section#access .container
{
	padding: 0;
	width: auto;
}

section#access p
{
	margin: 0;
}

/* お問い合わせ */
section#inquiry
{
	background-image: url(/images/inquiry/bg-inquiry.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	color: #fff;
	text-align: center;
}

section#inquiry h3
{
	margin-bottom: 20px;
	font-size: 40px;
}

section#inquiry .address
{
	display: flex;
	list-style: none;
	justify-content: center;
	margin: 30px 0 10px;
}

section#inquiry .address li
{
	border: solid 1px #fff;
	margin: 0 20px;
}

section#inquiry .address li a
{
	color: #fff;
	font-size: 180%;
	text-decoration: none;
	padding: 10px 20px;
	display: block;
}

section#inquiry .address li a:hover
{
	background: #fff;
	color: #000;
}

section#inquiry .address li a i.fas
{
	font-family: 'FontAwesome';
	font-style: normal;
	margin-right: 10px;
}



@media screen and (max-width: 1140px) {
	section#about .hydraulic-hose-repair-service ul.target-hose,
	section#about .hydraulic-hose-repair-service ul.truck
	{
		padding: 0;
	}
	
	/*
	section#about .hydraulic-hose-repair-service ul.target-hose li ,
	section#about .hydraulic-hose-repair-service ul.truck li
	{
		width: 45%;
	}
	*/

}


@media screen and (max-width: 768px) {

	section#about .hydraulic-hose-repair-service ul.target-hose li
	{
		margin: 6px auto;
		padding: 20px 15px;
		width: auto;
	}
	
	
	section#about .hydraulic-hose-repair-service .hose-img
	{
		display: block;
		float: none;
		margin: 10px auto;
		width: auto;
	}
	
	section#about .hydraulic-hose-repair-service ul.truck li
	{
		width: auto;
	}

	section#inquiry .address
	{
		display: block;
	}

	section#inquiry .address li
	{
		margin: 8px 0;
	}
}


/* ----- 個別ページ ----- */

.entry-title {
	color: #22498e;
}

.entry-meta {
	padding-bottom: 15px;
}

/* お知らせ */
.post table th
{
	background-color: #eae83a;
}

/* 会社概要 */
.company h2
{
	text-align: center;
	padding: 1.5rem 0;
	margin-bottom: 3rem;
	background-image: linear-gradient( 90deg, #f5df4d 0 20%, #e8e8e8 20% );
	background-repeat: no-repeat;
	background-size: 15% 5%;
	background-position: bottom;
	font-size: 30px;
	font-size: 1.875rem;
}

.company table
{
	border: none;
}

.company table th,
.company table td
{
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: 1px solid #e9e9e9;
	padding: 10px 20px;
	line-height: 2;
}

.company table th
{
	width: 30%;
}

.company table td
{
	width: 70%;
}

.company table td ul
{
	padding: 0;
}


.company table td ul li
{
	margin-left: 1.5em;
}

@media screen and (max-width: 768px) {

	.company table th
	{
		display: block;
		width: 100%;
	}

	.company table td
	{
		display: block;
		width: 100%;
	}

}

/* サービス内容 */
.services .article-header
{
	padding-bottom: 20px;
	text-align: center;
	margin: 20px 0 30px;
}

.services .article-title
{
	margin: 0;
	position: relative;
	font-weight: normal;
	font-size: 40px;
	text-align: center;
	margin: 20px 0;
	display: inline-block;
	color: #22498e;
}

.services .article-title:before
{
	content: '';
	height: 30px;
	width: 30px;
	border: solid 1px #ccc;
	display: block;
	position: absolute;
	left: -30px;
	top: -10px;
	margin: auto;
	z-index: 0;
}

.services .article-title:after
{
	content: '';
	height: 25px;
	width: 25px;
	border: solid 1px #ccc;
	display: block;
	position: absolute;
	right: -25px;
	bottom: -10px;
	/* margin: auto; */
	/* z-index: -1; */
}


/* ----- archive用css ----- */
.archive .services h3:after
{
	left: 5px;
	top: 3px;
	color: #A1B8D1;
}

.archive .services h3:before
{
	left: 0;
	top: -3px;
}

.archive .services h3:before,
.archive .services h3:after
{
	content: "□";
	position: absolute;
}

.archive .services h3
{
	color: #22498e;
	position: relative;
	padding-left: 30px;
	font-size: 20px;
	margin: 30px 0;
}

.archive .services table th
{
	background: #eae83a;
}

.archive .services ul
{
	display: flex;
	flex-wrap: wrap;
}
.archive .services ul li
{
	width: 30%;
	padding: 0 5px;
	margin-left: 25px;
}

.archive .services .maker,
.archive .services .maker-sub
{
	list-style: none;
}

.archive .services .maker-sub li
{
	width: 20%;
}

.tel {
	background: #fff;
	display: block;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: 2px solid #22498e;
	padding: 60px 0;
	text-align: center;
	line-height: 1.5;
	text-decoration: none;
	font-size: 120%;
}

.tel .message
{
	color: #22498e;
	padding: 0 20px;
}

.tel .telephone
{
	color: #22498e;
	margin: 10px 0;
	line-height: 1;
	text-align: center;
	font-size: 200%;
	font-weight: bold;
}



@media screen and (max-width: 768px) {
	.archive .services ul
	{
		display: block;
	}
	
	.archive .services ul li
	{
		width: 100%;
		padding: 0;
	}

	.archive .services .maker li
	{
		margin-left: 0;
	}

}


/* 固定ページ */
.page  ul.certification {
	display: flex;
	flex-wrap: wrap;
}

.page ul.certification li {
	width: 30%;
	padding: 0 5px;
}


@media screen and (max-width: 768px) {

	.page  ul.certification {
		display: block;
	}

	.page ul.certification li {
		width: 100%;
		padding: 0;
	}
	
}



/* 個別ページ */
.single .services h4
{
	color: #d9534f;
	position: relative;
	border-top: solid 2px #d9534f;
	border-bottom: solid 2px #d9534f;
	line-height: 1.4;
	padding: 0.4em 0.5em;
	margin: 60px 0 30px !important;
	background: -webkit-repeating-linear-gradient(-45deg, #fff0f0, #fff0f0 3px,#ffe9e9 3px, #ffe9e9 7px);
	background: repeating-linear-gradient(-45deg, #fff0f0, #fff0f0 3px,#ffe9e9 3px, #ffe9e9 7px);
	font-size: 150% !important;
}

.single .services h4:after {
	position: absolute;
	font-family: "FontAwesome",'Quicksand','Avenir','Arial',sans-serif;
	font-weight: bold;
	content: '\f0a7\ POINT';
	background: #d9534f;
	color: #fff;
	left: 0px;
	bottom: 100%;
	border-radius: 10px 10px 0 0;
	padding: 10px 20px;
	font-size: 80%;
	line-height: 1;
	letter-spacing: 0.05em;
}

.single .services h5
{
	position: relative;
	line-height: 1.4;
	padding: 0.25em 1em;
	display: inline-block;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	left: 50%;
	margin: 30px 0;
}

.single .services h5:before
{
	border-left: solid 1px black;
	border-top: solid 1px black;
	border-bottom: solid 1px black;
	left: 0;
}

.single .services h5:after
{
	content: '';
	border-top: solid 1px black;
	border-right: solid 1px black;
	border-bottom: solid 1px black;
	right: 0;
}

.single .services h5:before,
.single .services h5:after
{
	position: absolute;
	top: 0;
	content: '';
	width: 8px;
	height: 100%;
	display: inline-block;
}

.single .services .machine
{
	display: flex;
	flex-wrap: wrap;
	padding: 0;
}

.single .services .machine li
{
	width: 16%;
}

.single .services .machine-image
{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
}

.single .services .machine-image li
{
	width: 30%;
	margin: auto auto;
}


.single .services .flow
{
	overflow: hidden;
	display: grid;
	gap: 42px;
	grid-template-columns: repeat(auto-fit, minmax(140px, 0fr));
}

.single .services .flow li
{
	font-size: 100%;
	color: #fff;
	position: relative;
	border-radius: 100%;
	background: #22498e;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
	text-align: center;
}

.single .services .flow li:before {
	display: block;
	content: '';
	padding-top: 100%;
}

.single .services .flow li:after {
	position: absolute;
	top: 50%;
	left: 110%;
	transform: translateY(-50%);
	width: 0px;
	height: 0px;
	border: 10px solid transparent;
	border-left: 15px solid #22498e;
	content: "";
}

.single .services .flow li:last-child {
	background: #fbf43c;
	color: #f10000;
	font-size: 125%;
	font-weight: bold;
	letter-spacing: 0;
}

.single .services .flow li:last-child:after {
	content: none;
}

.single .services .flow li p {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 65%;
}

.single .services .flow li:last-child p {
	width: 70%;
}


.single .services .kashimeki
{
	width: 30%;
	float: right;
}

.single .services .hose-image
{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}

.single .services .hose-image li
{
	width: 23%;
	margin: auto auto;
}


@media screen and (max-width: 1140px) {
	.single .services .machine li {
		width: 20%;
	}
}

@media screen and (max-width: 768px) {
	.entry-content li {
		margin-left: 0.5em;
	}
	.services.hydraulic-hose-repair .article-title:after ,
	.services.tire-change-and-sale .article-title:after
	{
		right: 0px;
		bottom: -30px;
	}
	
	.services.hydraulic-hose-repair .article-title:before ,
	.services.tire-change-and-sale .article-title:before
	{
		left: 0px;
		top: -30px;
	}
	.single .services .flow {
		grid-template-columns: repeat(auto-fit, minmax(115px, 0fr));
	}

	.single .services .machine li {
		width: 40%;
		margin-left: 2em;
	}

	.single .services .kashimeki
	{
		display: block;
		float: none;
		margin: 10px auto 30px;
		width: auto;
	}

}


/* フッター */
#footer-widgets
{
	padding: 2rem 0 3rem;
	margin: 0;
}

.footer-widgets .sidebar .widget
{
	margin: 0;
}

.footer-info
{
	text-align: center;
}

.footer-info .company-name
{
	font-size: 200%;
	font-weight: bold;
	padding: 0;
	margin: 0;
}

.footer-info .company-eng
{
	font-size: 120%;
	margin: 0;
	padding: 0;
}

.footer-info .company-addr
{
	margin: 0;
	padding: 0;
}

.site-footer .site-info
{
	padding: 0.5rem !important;
}

.site-footer .site-info .btt
{
	margin-bottom: 30px;
}