@charset "utf-8";

*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
a,
p,
span,
small,
strong,
ol,
ul,
li,
dl,
dt,
dd,
div,
section,
article,
main,
aside,
nav,
header,
footer,
img,
figure,
figcaption,
address,
time,
iframe,
table,
caption,
tbody,
tr,
th,
td {
	margin: 0;
	padding: 0;
	/*	border: 0;*/
}

html {
	font-size: 0.875rem;
}

html,
body {
	margin: 0;
	height: 100%;
}

body {
	/*	font-size: 1rem;*/
	text-align: center;
	font-family: 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'Meiryo UI', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', Verdana, sans-serif;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
	min-height: 100vh;
	background-color: #fff;
	color: #333;
	position: relative;
	z-index: 0;
}

ul,
ol {
	list-style: none;
}

img {
	display: inline-block;
	max-width: 100%;
	height: auto;
}

a {
	text-decoration: none;
}

a:hover,
a:active {
	opacity: 0.6;
}

/*
table {
	border-collapse: collapse;
	border-spacing: 0;
}
*/

footer {
	margin-top: auto;
}

/*背景色*/
.bgc_fff {
	background-color: #fff;
	/*白*/
}

.bgc_blk {
	background-color: #333;
}

.bgc_g {
	background-color: #669900;
}

/*文字白く光らせる*/
.halo {
	text-shadow: 2px 2px 3px #fff, -2px 2px 3px #fff, 2px -2px 3px #fff, -2px -2px 3px #fff, 2px 0px 3px #fff, 0px 2px 3px #fff, -2px 0px 3px #fff, 0px -2px 3px #fff;
}

/*リンク下線*/
.txtdeco_u {
	text-decoration: underline;
}

/*文字太さ*/
.fw_bld {
	font-weight: bold;
}

/*テキスト色*/
.fc_fff {
	color: #fff;
}

.fc_blk {
	color: #333;
}

.fc_bl1 {
	color: #006699;
}

.fc_bl2 {
	color: #6699CC;
}

/*明朝体*/
.mincho {
	font-family: 'Noto Serif JP', serif;
}

/*余白*/

/*上方向の余白*/
.pt20 {
	padding-top: 20px;
}

.ptop_30-60 {
	padding-top: 30px;
}

.ptop_50-80 {
	padding-top: 50px;
}

.mgtp_20-40 {
	margin-top: 20px;
}

.mgtp_30-50 {
	margin-top: 30px;
}

.mgtp_50-80 {
	margin-top: 50px;
}

/*下方向の余白*/

.pbtm20 {
	padding-bottom: 20px;
}

.pbtm30 {
	padding-bottom: 30px;
}

.pbtm_30-60 {
	padding-bottom: 30px;
}

.pbtm_50-80 {
	padding-bottom: 50px;
}

.mb05 {
	margin-bottom: 5px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb15 {
	margin-bottom: 15px;
}

.mb20 {
	margin-bottom: 20px;
}

.mb30 {
	margin-bottom: 30px;
}

.mb50 {
	margin-bottom: 50px;
}

.mgbtm_10-20 {
	margin-bottom: 10px;
}

.mgbtm_20-40 {
	margin-bottom: 20px;
}

.mgbtm_30-50 {
	margin-bottom: 30px;
}

.mgbtm_40-60 {
	margin-bottom: 40px;
}

.mgbtm_50-80 {
	margin-bottom: 50px;
}

/*
======================================
=============mobile_style=============
======================================
ベースとなるstyle
*/

.inner {
	max-width: 1080px;
	padding-left: 20px;
	padding-right: 20px;
	margin: 0 auto;
}

/*.header */
.header_inner {
	display: flex;
	flex-direction: column;
	max-width: 1080px;
	padding-left: 20px;
	padding-right: 20px;
	margin: 20px auto 30px;
}

.header_logo {
	align-self: center;
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: 488px;
	margin-bottom: 30px;
}


.h_logo,
.h_bishoo {
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto;
	display: flex;
}

.header_logo a img {
	align-self: center;
	width: 100%;
}

.h_bishoo a img {
	align-self: flex-end;

}

.header_nav ul {
	align-self: center;
	display: flex;
	max-height: 100px;
	max-width: 530px;
	margin: 0 auto;
}

.header_nav ul li {
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: calc(100% / 4);
	border-right: 1px solid #ccc;
}

.header_nav ul li:first-of-type {
	border-left: 1px solid #ccc;
}

.header_nav ul li a {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 100px;
	position: relative;
}

.header_nav ul li a::before {
	content: "";
	display: block;
	min-height: 44px;
	background-size: 44px 44px;
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 50px;
}

.header_nav ul li a span {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: calc(100% - 44px);
}

.header_nav ul li:nth-of-type(1) a::before {
	background-image: url(../img/nav_icon_03.png);
}

.header_nav ul li:nth-of-type(2) a::before {
	background-image: url(../img/nav_icon_02.png);
}

.header_nav ul li:nth-of-type(3) a::before {
	background-image: url(../img/nav_icon_01.png);
}

.header_nav ul li:nth-of-type(4) a::before {
	background-image: url(../img/nav_icon_04.png);
}

/*お問合せフォームへのボタン*/
.contact_btn {
	position: fixed;
	right: -4px;
	top: 210px;
	z-index: 99;
}

.contact_btn a {
	display: block;
	width: 57px;
	height: 159px;
	background-image: url(../img/contact_btn.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

/*mainタグ IEが認識しないので記述*/
main {
	display: block;
	overflow: hidden;
}

/*page移動のボタン*/
.button_area {
	margin: 0 auto;
}

.button_area a {
	display: block;
	letter-spacing: 0.05em;
	text-align: center;
	border-radius: 8px;
	max-width: 300px;
	position: relative;
	padding-top: 0.5rem;
	padding-right: 1.5rem;
	padding-left: 1.5rem;
	padding-bottom: 0.5rem;
	margin: 0 auto 1rem;
}

/*page移動のボタン矢印_右*/
.fa-chevron-right {
	position: absolute;
	top: 50%;
	right: 0.5rem;
	transform: translateY(-50%);
}

/*page移動のボタン矢印_左*/
.fa-chevron-left {
	position: absolute;
	top: 50%;
	left: 0.5rem;
	transform: translateY(-50%);
}

/*背景のストライプ*/
.bg_stripe {
	background-image: linear-gradient(-45deg,
			rgb(255, 255, 255) 25%,
			rgb(225, 225, 225) 25%,
			rgb(225, 225, 225) 50%,
			rgb(255, 255, 255) 50%,
			rgb(255, 255, 255) 75%,
			rgb(225, 225, 225) 75%,
			rgb(225, 225, 225));
	background-size: 5px 5px;
	background-attachment: fixed;
}

/*footer*/
.footer_nav ul li {
	border-bottom: 1px solid #ccc;
}

.footer_nav ul li a {
	display: block;
	text-align: left;
	color: #333;
	padding-top: 10px;
	padding-right: 1rem;
	padding-bottom: 10px;
	position: relative;
}

.footer_nav ul li a span {
	display: inline-block;
	padding-left: 1.5rem;
	position: relative;
}

.footer_nav ul li a span::before {
	content: "";
	display: inline-block;
	width: 11px;
	height: 11px;
	background-image: url(../img/diamond.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	position: absolute;
	top: 0.5em;
	left: 0;
}

.footer_nav ul li a .fa-chevron-right {
	font-size: 0.75rem;
}

.m_company {
	text-align: left;
	margin-top: 50px;
}

.m_company a {
	display: inline-block;
	color: #000;
}

.m_company a img {
	width: 100%;
	max-width: 220px;
}

.suppocen {
	font-weight: 700;
}

.suppocen_detail {
	line-height: 1.8;
}

.tel-link a {
	text-decoration: underline;
}

.lic_number li {
	font-size: 12px;
}

.company_site {
	display: flex;
	flex-wrap: wrap;
}

.company_site li {
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: 240px;
}

.company_site li a {
	margin-right: 20px;
	margin-bottom: 10px;
}

.f_copyright {
	padding-top: 0.75em;
	padding-bottom: 0.75em;
	margin-top: 50px;

}


/*トップへ戻るボタン*/
#PageTopBtn {
	display: inline-block;
	position: fixed;
	bottom: 45px;
	right: 20px;
}

#PageTopBtn a {
	display: block;
	width: 50px;
	height: 50px;
	background-image: url(../img/pagetop_arrow.png);
	background-repeat: no-repeat;
	background-position: center;
	/*	background-size: ;*/
}

/*
======================================
=============tablet_syle==============
======================================
*/
@media (min-width:769px) {
	html {
		font-size: 1rem;
	}

	.ptop_30-60 {
		padding-top: 60px;
	}

	.ptop_50-80 {
		padding-top: 80px;
	}

	.mgtp_20-40 {
		margin-top: 40px;
	}

	.mgtp_30-50 {
		margin-top: 50px;
	}

	.mgtp_50-80 {
		margin-top: 80px;
	}

	.pbtm_30-60 {
		padding-bottom: 60px;
	}

	.pbtm_50-80 {
		padding-bottom: 80px;
	}

	.mgbtm_40-60 {
		margin-bottom: 60px;
	}

	.mgbtm_10-20 {
		margin-bottom: 20px;
	}

	.mgbtm_20-40 {
		margin-bottom: 40px;
	}

	.mgbtm_30-50 {
		margin-bottom: 50px;
	}

	.mgbtm_50-80 {
		margin-bottom: 80px;
	}

	.contact_btn a {
		width: 76px;
		height: 212px;
	}

	.footer_contentbox {
		display: flex;
		justify-content: space-between;
	}

	.footer_nav ul li a span::before {
		top: 50%;
		transform: translateY(-50%);
	}

	.footer_nav,
	.m_company {
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: calc(50% - 20px);
	}

	.m_company {
		margin-top: 0;
	}

	.f_copyright {
		margin-top: 20px;
	}
}

/*
======================================
=============wide_pc_syle=============
======================================
*/
@media (min-width:1121px) {
	.header_logo {
		margin-top: 0;
		margin-bottom: 0;
	}

	.header_inner {
		flex-direction: row;
		justify-content: space-between;
	}

	.header_nav {
		flex-grow: 0;
		flex-shrink: 1;
		flex-basis: 530px;
	}

	.contact_btn {
		top: 120px;
	}
}