@charset "UTF-8";

/* =========================================================
■Reset of Default Style
========================================================= */
h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, form {
	margin: 0;
	padding: 0;
	border: 0;
    border-collapse: collapse;
    border-spacing: 0;
	font-style: normal;
	font-weight: normal;	
	font-size: 100%;
	line-height: 1.5;
	text-align: left;
}
textarea { font-size: 100%; }
img { vertical-align: bottom; }
hr  { display: none; }
html { overflow: auto; }

/* =========================================================
■body
========================================================= */
body {
	max-width: 100%;
	margin: 0 auto;
	background-color: #fff; /* 背景色 */
	color: #333; /* 文字色 */
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}
a:link {
	color: #d90000;
	text-decoration: none;
}
a:visited {
	color: #d90000;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
img {
	max-width: 100%;
	height: auto;
}
.pagetop {
	position: fixed; /* 固定 */
	bottom: 14px; /* 場所を右下に移動 */
	right: 14px; /* 場所を右下に移動 */
	display: block; /* aタグをblock要素に変更 */
	background-color: rgba(0,0,0,0.5);
	font-size: 18px; /* 文字サイズ */
	width: 40px;
	height: 40px;
	text-align: center;
	line-height: 1px;
	border-radius: 20px;
	padding-top: 20px;
	box-sizing: border-box;
	z-index: 3; /* 必要であればリンク要素の重なりのベース順序指定 */
}
.pagetop:link {
	color: #fff;
	text-decoration: none;
}
.pagetop:hover {
	opacity: 0.7;
}
/* =========================================================
■header
========================================================= */
#header {
	background-color: #2f2f2f;
	display: flex;
	flex-direction: column;
}
#header #headerbox {
	width: 1080px;
	margin: 0 auto;
}
@media only screen and (max-width: 1080px) {
#header #headerbox {
	width:100%;
	margin: 0 auto;
}
}
#header h1 {
	padding: 6px 1% 1px; /* 文字周りの余白 */
	font-size: 11px;
	color: #ccc;
	font-weight: normal;	
	line-height: 1.2;
}
#header #box_head {
	display:flex;
	justify-content: space-between;
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
#header #box_head .pc {
	display: block !important;
	margin-right: auto;
}
#header #box_head .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 768px) {
#header #box_head .pc {
	display: none !important;
	margin: auto;
}
#header #box_head .sp {
	display: block !important;
	margin: auto;
}
}

#header .box01 {
	margin: 2px 1.5% 0;
}
/* 画像マウスオーバー時に明るく */
#header .box01 a:hover img {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
}
#header .box02 {
	margin: 4px 1.5% 0;
	color: #fefefe;
}

#header #menu {
	width: 100%;
	margin: 0 auto;
	list-style: none;
}
#header #menu li {
	display: block;
	float: left;
	width: calc((100% / 6) - .01px);
	font-size: 15px;
	background-color: #2f2f2f;
	text-align: center;
	box-sizing: border-box;
}
#header #menu li:not(:last-child){
	border-right: solid 1px #666; /* 右線（実線 太さ 色） */
}
#header #menu li a {
	display: block;
	padding: 12px 0 10px;
	color: #fff;
	text-decoration: none;
}
#header #menu li a:hover {
	background-color: #d90000;
	transition: all 0.3s;
}

@media screen and (min-width: 768px) {
#header .sp-nav {
   display: none;
}
}

@media only screen and (max-width: 768px) {
#header #menu {
	display: none;
}
#header #box_head {
	display:flex;
	justify-content: start;
	padding-left: 2%;
	margin: 2px 0 5px;
}
#header .box01 {
	margin: 2px 0 0;
}
#header .box02 {
	margin: 4px 0 0;
	color: #fefefe;
}
/* hamburger(ハンバーガーアイコン) */
#header .hamburger {
	position: absolute;
	right: 3%;
	top: 42px;
	width: 40px;
	height: 36px;
	cursor: pointer;
	z-index: 30;
}
#header .hamburger__line {
	position: absolute;
	width: 40px;
	height: 3px;
	right: 0;
	background-color: #fff;
	transition: all 0.5s;
}
#header .hamburger__line--1 {
	top: 1px;
}
#header .hamburger__line--2 {
	top: 16px;
}
#header .hamburger__line--3 {
	top: 32px;
}
/*ハンバーガーがクリックされたら*/
#header .open .hamburger__line {
	background-color: #333;
}
#header .open .hamburger__line--1 {
	transform: rotate(-45deg);
	top: 11px;
}
#header .open .hamburger__line--2 {
	opacity: 0;
}
#header .open .hamburger__line--3 {
	transform: rotate(45deg);
	top: 11px;
}
/* sp-nav(ナビ) */
#header .sp-nav {
	position: fixed;
	right: -100%; /*ハンバーガーがクリックされる前はWindow右側に隠す*/
	top: 0;
	width: 70%; /* 出てくるスライドメニューの幅 */
	height: 100%;
	background: rgba(255, 255, 255, .9);
	transition: all 0.5s;
	z-index: 20;
	overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}
#header .sp-nav ul {
	list-style-type: none;
	margin: 20px 0 0 4%;
}
#header .sp-nav li {
	color: #333;
	padding: 4px 0;
}
#header .sp-nav li a:link {
	color: #333;
}
#header .sp-nav li a:visited {
	color: #333;
	text-decoration: none;
}
#header .sp-nav li a:hover {
	color: #d90000;
	text-decoration: underline;
}
#header .sp-nav li a:active {
	text-decoration: none;
}
/*ハンバーガーがクリックされたら右からスライド*/
#header .open .sp-nav {
	right: 0;
}
/* black-bg(ハンバーガーメニュー解除用bg) */
#header .black-bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0;
	visibility: hidden;
	transition: all 0s;
	cursor: pointer;
	z-index: 10;
}
/*ハンバーガーメニューが開いたら表示*/
#header .open .black-bg {
	opacity: 0.3;
	visibility: visible;
}
}

/* =========================================================
■wrapper
========================================================= */
.wrapper {
	max-width: 1080px;
	margin: 0 auto;
}

/* =========================================================
■content
========================================================= */
.content {
	width: 75%;
	float: right;
	padding: 0 1%;
	box-sizing: border-box;	
}
.content h2 {
	font-size: 24px;
	font-weight: bold;
	padding: 0 0.5%;
	border-bottom: solid 2px #c0c0c0;
	margin: 8px 2% 0;
}
.content h2 span {
	display: block;
	font-size: 12px;
	font-weight: normal;
	margin-top: -2px;
}
.content h3 {
	width: 95%;
	font-size: 24px;
	font-weight: bold;
	padding: 0px 0.5% 1px;
	border-bottom: solid 2px #c0c0c0;
	margin: 8px 2% 10px;
}
.content h3 span {
	display: block;
	font-size: 12px;
	font-weight: normal;
	margin-top: -2px;
}
.content h4 {
    display: block;
	font-size: 22px;
	padding: 7px 1% 3px;
	background: -webkit-linear-gradient(top, #fff 0%, #f7f7f7 100%);
	background: linear-gradient(to bottom, #fff 0%, #f7f7f7 100%);
	border-top: solid 2px #e8383d; /* 上線（線 太さ 色） */
	border-bottom: solid 1px #ebebeb;
	margin: 30px 2% 0;
}
.content h4 span {
	display: block;
	font-size: 12px;
	font-weight: normal;
	margin-top: -2px;
}

.content .breadcrumbs {
	font-size: 12px;
	color: #444;
	line-height: 1;
	padding: 0;
    margin: 6px 0 0 1%;
}
.content .breadcrumbs ol li {
    display: inline;
    list-style-type: none;
}
.content .breadcrumbs ol li:before {
    content: " > ";
}
.content .breadcrumbs ol li:first-child:before {
    content: "";
}

.content .contenttitle-underbox {
	font-size: 14px;
	line-height: 1.5;
	padding-bottom: 12px;
	margin: 13px 3% 20px;
	border-bottom: solid 1px #ddd;
}
.content .contenttitle-underbox ul {
	width: 99%;
	font-size: 12px;
	list-style-type: lower-roman;
	margin-top: 6px;
}
.content .contenttitle-underbox li {
    margin-left: 20px;
}
.content .description-box1 {
	font-size: 14px;
	padding: 1% 2%;
    border: solid 1px #d4d9df; /* 線 */
    border-radius: 8px; /* 角の丸み */
	box-shadow: 0 0px 1px rgba(0, 0, 0, 0.32); /* 影 */
	box-sizing: border-box;
}
.content .dbxa {
	margin: 10px 3%;
}
.content .description-box2 {
	width: 96%;
	font-size: 16px;
	padding: 2% 2%;
	margin: 10px 2% 24px;
    border: solid 1px #d4d9df;
    border-radius: 8px;
	box-shadow: 0 0 1px rgba(0, 0, 0, 0.32);
	box-sizing: border-box;
}

/* マーカー線・黄 */
.content .marker13 {
	background:linear-gradient(transparent 75%, #f7f77c 75%);
}

.content .anchor {
	display: block;
	width: 96%;
	font-size: 14px;
	margin: 20px 2%;
	background-color: #f5f5f5;
}
.content .anchor ul {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
	list-style-type: none;
	padding: 1%;
}
.content .anchor li {
	position: relative;
	padding-left: 14px;
	margin: 0 20px;
}
.content .anchor li:before {
	content: "";
	position: absolute;
	top: 3px;
	left: -1px;
	-webkit-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
	width: 8px;
	height: 8px;
	border-top: solid 1px #d90000;
	border-right: solid 1px #d90000;
}
.content .anchor a:link,
.content .anchor a:visited {
	color: #404960;
}

.content .tbl-r01,
.content .tbl-r02 {
    width: 94%;
    margin: 20px 3% 40px;
	font-size: 14px;
}
.content .tbl-r01 th {
    width: 22%;
    color: #fff;
    text-align: center;
    padding: 10px 1%;
    background-color: #e60000;
    border: solid 1px #ddd;
}
.content .tbl-r01 td {
    padding: 10px 1%;
    border: solid 1px #ddd;
}
.content .tbl-r02 th {
    width: 22%;
    text-align: center;
    padding: 10px 1%;
    background-color: #f5f5f5;
    border-bottom: solid 1px #ddd;
}
.content .tbl-r02 td {
    padding: 14px 1.5%;
    border-bottom: solid 1px #ddd;
}
.content .tbl-r02 tr:last-child th,
.content .tbl-r02 tr:last-child td {
    border-bottom: none;
}
@media only screen and (max-width:768px) {
.content .tbl-r01,
.content .tbl-r02 {
    margin: 20px 3% 40px;
}
.content .tbl-r01 th,
.content .tbl-r01 td,
.content .tbl-r02 th,
.content .tbl-r02 td {
    width: 98%;
    display: block;
    border-top: none;
}
.content .tbl-r01 tr:first-child th,
.content .tbl-r02 tr:first-child th {
	border-top: solid 1px #ddd;
}
}

.content .tbl-r03 {
	table-layout: fixed;
    width: 94%;
    margin: -8px 3% 10px;
	font-size: 14px;
}
.content .tbl-r03 th {
    text-align: left;
    padding: 10px 1.5%;
    background-color: #f5f5f5;
    border: solid 1px #ddd;
}
.content .tbl-r03 td {
    padding: 10px 1.5%;
    border: solid 1px #ddd;
}
@media only screen and (max-width:481px) {
.content .tbl-r03 {
    margin: -8px 3% 10px;
}
.content .tbl-r03 th,
.content .tbl-r03 td {
    width: 97%;
    display: block;
    border-top: none;
    text-align: center;
}
.content .tbl-r03 tr:first-child th {
	border-top: solid 1px #ddd;
}
}

.content .tbl-r05 {
	table-layout: fixed;
    width: 94%;
	margin: 14px 3% 0;
	font-size: 13px;
}
.content .tbl-r05 th,
.content .tbl-r05 td {
    border: solid 1px #e3e3e3;
    text-align: center;
	padding: 10px 0.5%;
}
.content .tbl-r05 th {
    background-color: #595959;
    color: #fff;
    font-weight: bold;
}
.content .tbl-r05 .tbl-r05-img {
    text-align: center;
}
/* 画像マウスオーバー時に明るく */
.content .tbl-r05 .tbl-r05-img a:hover img {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
}
.content .tbl-r05 .col1 {
    width: 17%;
}
.content .tbl-r05 .col2 {
    width: 44%;
}
.content .tbl-r05 .col3 {
    width: 13%;
}
.content .tbl-r05 .col4 {
    width: 27%;
}
.content .tbl-r05 .col5 {
    width: 25%;
}
.content .tbl-r05 .col6 {
    width: 16%;
}
.content .tbl-r05 .col7 {
    width: 28%;
}
.content .tbl-r05 .col8 {
    width: 42%;
}
.content .tbl-r05 .col9 {
    width: 15%;
}
.content .tbl-r05 td:first-child {
    background-color: #e6e6e6;
}
@media screen and (max-width: 768px) {
.content .tbl-r05 {
    width: 93%;
	margin: 10px 2.5% 0;
}
.content .tbl-r05 .thead {
    display: none;
}
.content .tbl-r05 td {
    display: block;
    text-align: right;
	padding: 10px 1%;
    width: 100%;
}
.content .tbl-r05 td:first-child {
    background-color: #e6e6e6;
    font-weight: bold;
    text-align: center;
}
.content .tbl-r05 td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
}
}

.content .tbl-r07 {
	table-layout: fixed;
    width: 94%;
	margin: 14px 3% 0;
	font-size: 12px;
}
.content .tbl-r07 th,
.content .tbl-r07 td {
    border: solid 1px #e3e3e3;
    text-align: center;
	padding: 10px 1px;
}
.content .tbl-r07 th {
    background-color: #595959;
    color: #fff;
    font-weight: bold;
}
.content .tbl-r07 .tbl-r07-img {
    text-align: center;
}
.content .tbl-r07 td:first-child {
    background-color: #e6e6e6;
}
.content .tbl-r07 .col1 {
    width: 22%;
}
.content .tbl-r07 .col2 {
    width: 13%;
}
@media screen and (max-width: 768px) {
.content .tbl-r07 {
    width: 93%;
	margin: 10px 2.5% 0;
}
.content .tbl-r07 .thead {
    display: none;
}
.content .tbl-r07 td {
    display: block;
    text-align: right;
	padding: 10px 1%;
    width: 100%;
}
.content .tbl-r07 td:first-child {
    background-color: #e6e6e6;
    font-weight: bold;
    text-align: center;
}
.content .tbl-r07 td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
}
}

.content .r071 {
	margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
.content .r071 {
	margin-bottom: 20px;
}
}
.content .r072 {
	margin-top: -10px;
	margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
.content .r072 {
	margin-top: -6px;
	margin-bottom: 10px;
}
}

.content .tbl-r08 {
	table-layout: fixed;
    width: 94%;
	margin: 20px 3% 50px;
	font-size: 13px;
}
.content .tbl-r08 th,
.content .tbl-r08 td {
    border: solid 1px #e3e3e3;
    text-align: center;
	padding: 10px 1px;
}
.content .tbl-r08 th {
    background-color: #595959;
    color: #fff;
    font-weight: bold;
}
.content .tbl-r08 img {
	margin: 0 3px 2px 0;
}
.content .tbl-r08 td:first-child {
    background-color: #e6e6e6;
}
.content .tbl-r08 .col1 {
    width: 50%;
}
.content .tbl-r08 .col2 {
    width: 25%;
}
@media screen and (max-width: 768px) {
.content .tbl-r08 {
    width: 93%;
	margin: 20px 2.5% 50px;
}
.content .tbl-r08 .thead {
    display: none;
}
.content .tbl-r08 td {
    display: block;
    text-align: right;
	padding: 10px 1%;
    width: 100%;
}
.content .tbl-r08 td:first-child {
    background-color: #e6e6e6;
    font-weight: bold;
    text-align: center;
}
.content .tbl-r08 td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
}
}
.content .r081 {
	margin-top: 10px;
	margin-bottom: 18px;
}

.content #tbl-r09 {
    width: 96%;
	margin: 20px 2% 10px;
}
.content #tbl-r09 .fixed {
    min-width: 100px;
    left: 0;
    background-color: #ffffdb;
}
.content #tbl-r09 th, #tbl-r09 td {
    text-align: center;
    min-width: 160px;
    padding: 4px 1%;
    height: 60px;
    border: solid 1px #707070;
}
.content #tbl-r09 .head {
  background-color: #ffffdb;
}
.content #tbl-r09 .green {
  background-color: #dbf1e5;
}
.content #tbl-r09 .blue {
  background-color: #dbf2fc;
}
.content #tbl-r09 .purple {
  background-color: #eedbec;
}
.content #tbl-r09 .orange {
  background-color: #fdeedb;
}
@media only screen and (max-width: 768px) {
  .content #tbl-r09 {
    display: block;
    overflow-x: scroll;
  }
  .content #tbl-r09 .fixed {
    position: sticky;
    left: 0;
  }
  .content #tbl-r09 .fixed:before {
    content: "";
    position: absolute;
    top: 0;
    left: -1px;
    right: -1px;
    height: 100%;
    border-bottom: solid 1px #707070;
    border-left: 1px solid #707070;
    border-right: 1px solid #707070;
  }
}
.content #tbl-r09 a:link {
	color: #333;
	text-decoration: underline;
}
.content #tbl-r09 a:visited {
	color: #333;
	text-decoration: none;
}
.content #tbl-r09 a:hover {
	color: #d90000;
	text-decoration: underline;
}
.content #tbl-r09 a:active {
	text-decoration: none;
}

/* フレックスボックスの基本設定 等間隔（両端揃え）折返しあり */
[class^="flex-col"] {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 18px 3% 24px;
}
/* コンテンツ下のマージン */
.content .flex-child {
    position: relative;
	z-index: 1; /* 必要であればリンク要素の重なりのベース順序指定 */
}
.content .flex-child a {
	position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
	z-index: 2; /* 必要であればリンク要素の重なりのベース順序指定 */
}
.content .flex-child a:hover{/* マウスオーバー時に色変更*/
    opacity: 0.3;
    background-color: #fff;
}

/* 各カラム毎のコンテンツと疑似要素の横幅 */
.content .flex-col2 .flex-child {
	width: calc( (100% - 20px) / 2 );
}
.content .flex-col3::after,
.content .flex-col3 .flex-child {
	width: calc( (100% - 20px) / 3 );
}
.content .flex-col4::before,
.content .flex-col4::after,
.content .flex-col4 .flex-child { width: calc( (100% - 30px) / 4 );
}
/* 最終行は両端揃えにしない */
.content .flex-col3::after,
.content .flex-col4::before,
.content .flex-col4::after { content: "";
}
.content .flex-col4::before { order: 1;
}
/* レスポンシブ対応 */
/* 991px以下で4列 → 3列 */
@media screen and (max-width: 991px) {
	.content .flex-col4::after,
	.content .flex-col4 .flex-child { width: calc( (100% - 20px) / 3 ); }
}
/* 768px以下で4列・3列 → 2列 */
@media screen and (max-width: 768px) {
	.content .flex-col3 .flex-child,	
	.content .flex-col4 .flex-child {
		width: calc( (100% - 10px) / 2 );
		border-bottom: solid 1px #ddd;
		margin: 20px 0 0;
		}
}
/* 481px以下で全て1列 */
@media screen and (max-width: 481px) {
	.content .flex-col2 .flex-child,
	.content .flex-col3 .flex-child,
	.content .flex-col4 .flex-child {
		width: 100%;
		border-bottom: solid 1px #ddd;
		margin: 20px 0 0;
		}
	.content .flex-col2 .flex-child:last-child,
	.content .flex-col3 .flex-child:last-child,
	.content .flex-col4 .flex-child:last-child {
		border-bottom: none;
		}
}

/* フレックスボックスの基本設定 等間隔（両端揃え）折返しあり */
[class^="flex-colu"] {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 18px 3% 24px;
}
/* コンテンツ下のマージン */
.content .flex-child2 {
    position: relative;
	margin-bottom: 16px;
	z-index: 1; /* 必要であればリンク要素の重なりのベース順序指定 */
}
/* 画像マウスオーバー時に明るく */
.content .flex-child2 a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* 各カラム毎のコンテンツと疑似要素の横幅 */
.content .flex-colu2 .flex-child2 {
	width: calc( (100% - 20px) / 2 );
}
.content .flex-colu3::after,
.content .flex-colu3 .flex-child2 {
	width: calc( (100% - 20px) / 3 );
}
.content .flex-colu4::before,
.content .flex-colu4::after,
.content .flex-colu4 .flex-child2 { width: calc( (100% - 30px) / 4 );
}
/* 最終行は両端揃えにしない */
.content .flex-colu3::after,
.content .flex-colu4::before,
.content .flex-colu4::after { content: "";
}
.content .flex-colu4::before { order: 1;
}
/* レスポンシブ対応 */
/* 991px以下で4列 → 3列 */
@media screen and (max-width: 991px) {
	.content .flex-colu4::after,
	.content .flex-colu4 .flex-child2 { width: calc( (100% - 20px) / 3 ); }
}
/* 768px以下で4列・3列 → 2列 */
@media screen and (max-width: 768px) {
	.content .flex-colu3 .flex-child2,	
	.content .flex-colu4 .flex-child2 { width: calc( (100% - 10px) / 2 ); }
}
/* 481px以下で全て1列 */
@media screen and (max-width: 481px) {
	.content .flex-colu2 .flex-child2,
	.content .flex-colu3 .flex-child2,
	.content .flex-colu4 .flex-child2 { width: 100%; }
}

.content .img_center {
	text-align: center;
	margin: 1px 0 4px;
}
.content .img_center2 {
	text-align: center;
	margin: 40px 1%;
}
/* 画像マウスオーバー時に明るく */
.content .img_center2 a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
.content .case_title1 {
	font-size: 15px;
    font-weight: bold;
	padding: 5px 2.5% 0;
}
.content .case_title2 {
	font-size: 15px;
    font-weight: bold;
	border-bottom: dashed 1px #ddd;
	padding: 0 1% 2px;
	margin: 0 2% 0;
}
.content .case_title3 {
	font-size: 14px;
	padding: 2px 3% 0;
}
.content .dashed_line {
	font-size: 14px;
	border-bottom: dashed 1px #ddd;
}
.content .ln1 {
	padding: 0 1.5% 2px;
	margin: 0 2% 0;
}
.content .ln2 {
	padding: 2px 1.5% ;
	margin: 0 2% 0;
}
.content .ln3 {
	padding: 2px 1.5% ;
	margin: 0 2% 20px;
}

.content .service_title {
	font-size: 15px;
    text-align: center;
	padding: 5px 1.5% 2px;
}
.content .service_line {
	font-size: 14px;
	border-bottom: dashed 1px #ddd;
	padding: 4px 1.5%;
	margin: 0 1% 20px;
}

.content .pointing01 {
	width: 94%;
	font-size: 14px;
	margin: 14px 3% 24px;
}
.content .pointing01 ul {
	list-style-type: none;
}
.content .pointing01 li {
	position: relative;
	line-height: 2;
	padding-left: 20px;
}
.content .pointing01 ul li::before {
	font-family: "Font Awesome 5 Free";
	content: "\f14a";
	position: absolute;
	left: 2px;
	color: #3cb371;
	margin-top: -1px;
}
.content .production_ex {
	width: 94%;
	font-size: 14px;
	margin: 14px 3% 0;
}
.content .production_ex ul {
	list-style-type: circle;
}
.content .production_ex li {
	margin-left: 18px;
	margin-bottom: 4px;
}

.content .note1 {
	display: block;
	font-size: 14px;
}
.content .note1 ul {
	list-style-type: none;
}
.content .note1 li {
    position: relative;
	padding-left: 12px;
	margin: 3px 4px;
}
.content .note1 ul li::after {
    content: '';
    position: absolute;
    top: 7px;
    left: 2px;
    width: 5px;
    height: 5px;
    background-color: #5D6562;
    border-radius: 100%;
}
.content .n01a {
	margin: 6px 3% 24px;
}
.content .n01c {
	font-size: 15px;
	margin: 14px 3% 24px;
}
.content .n01d {
	margin: 14px 3% 24px;
}
.content .n404 {
	margin: 6px 10% 24px;
}

.content .note3 {
	display: block;
	width: 94%;
	font-size: 14px;
	margin: 14px 3% 0;
}
.content .note3 ul {
	list-style-type: none;
}
.content .note3 li {
	position: relative;
	padding-left: 12px;
	margin: 0 2px;
}
.content .note3 ul li::after {
    content: '';
    position: absolute;
    top: 6px;
    left: -1px;
    width: 6px;
    height: 6px;
    border-right: solid 1px #555;
    border-bottom: solid 1px #555;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.content .n03a {
	margin: 14px 3% 20px;
}
.content .n03a li {
	margin-bottom: 4px;
}

.content .lbracketsbox {
	padding: 2%;
	margin: 14px 3.5% 42px;
	font-size: 14px;
	position: relative;
}
.content .lbracketsbox::before, .content .lbracketsbox::after {
	content: '';
	width: 15px;
	height: 100%;
	position: absolute;
}
.content .lbracketsbox::before {
	border-left: solid 2px #8e9999;
	border-top: solid 2px #8e9999;
	border-bottom: solid 2px #8e9999;
	top: 0;
	left: 0;
}
.content .lbracketsbox::after {
	border-right: solid 2px #8e9999;
	border-top: solid 2px #8e9999;
	border-bottom: solid 2px #8e9999;
	top: 0;
	right: 0;
}
.content .unitprice_box {
	font-size: 12px;
	line-height: 1.2;
	margin: 6px 3% 15px;
}
.content .unitprice_box2 {
	font-size: 12px;
	line-height: 1.2;
	margin: 6px 3%;
}
.content .box1 {
	font-size: 14px;
	box-sizing: border-box;
}
.content .uda {
	padding: 12px 1%;
    margin: 4px 2% 6px;
}
.content .bxa {
	padding: 6px 1%;
	margin: 14px 3% 22px;
}
.content .bxd {
	padding: 7px 1%;
    margin: -8px 3% 6px;
}
.content .bxe {
	padding: 7px 1%;
    margin: -8px 3% 14px;
}
.content .bxf {
	padding: 7px 1%;
    margin: -8px 3% 26px;
}
.content .cca {
	margin: 12px 4% 0 ;
}
.content .box_ar {
	font-size: 14px;
	padding: 8px 1% 0;
    margin: 0 3% 22px;
	box-sizing: border-box;
}
.content .box_ar img {
	max-width: 130px;
	height: auto;
	margin-bottom: 4px;
}
/* 画像マウスオーバー時に明るく */
.content .box_ar a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

.content .box03a {
	font-size: 15px;
	padding: 8px 1%;
    margin: 6px 2.5% 0;
	box-sizing: border-box;
}
.content .box03b {
	font-size: 15px;
	padding: 8px 1%;
    margin: 16px 2.5% 0;
	box-sizing: border-box;
}
.content .double-square {
	font-size: 14px;
    border: double #c0c0c0;
    border-radius: 2px;
	padding: 12px 2%;
	margin: 6px 3% 0;
	box-sizing: border-box;
}
.content .dsb {
	margin: 32px 3% 56px;
}
.content .dsc {
	margin: -10px 3% 58px;
}

.content .app_box01 {
	display: block;
	font-size: 14px;
	background-color: #fcf5f7;
	padding: 8px;
	margin: 12px 3% 0;
	overflow: hidden; /* heightを戻す */
}
.content .app_box01 ul {
	list-style-type: square;
}
.content .app_box01 li {
	float: left;
	margin-left: 18px;
	margin-right: 5%;
}
.content .app_box01 p {
	margin-bottom: 4px;
}
.content .apb1a {
	margin: 12px 3% 34px;
}

.content .headding05 {
	position: relative;
	font-size: 15px;
	padding: 0 0 1px;
	margin: 20px 3.5% 6px;
}
.content .headding06 {
	position: relative;
	font-size: 15px;
	border-top: dotted 1px #808080;
	padding: 20px 0 1px;
	margin: 20px 3.5% 6px;
}
.content .guide-desc {
	font-size: 16px;
	margin: 14px 3% 10px;
}
.content .guide-box {
	font-size: 14px;
	margin: 16px 3% 4px;
}
.content .guide-box ul {
	list-style-type: decimal;
}
.content .guide-box li {
	list-style-type: decimal;
	line-height: 1.7;
	margin-left: 18px;
	margin-bottom: 20px;
}
.content .guide-box ol li {
	list-style-type: lower-alpha;
	margin-left: 32px;
	margin-bottom: 1px;
}
.content .guide-box p {
	line-height: 1.7;
}

.content .orderbox3 ul {
    margin: 16px 5% 40px;
    width: 92%;
	list-style-type: none;
	overflow: hidden;
}
.content .orderbox3 li {
    margin: 0 1%;
    float: left;
	width: 46%;
	font-size: 15px;
	font-weight: bold; /* 文字太さ */
    box-sizing:border-box;
    text-align: center;
    border: solid 2px #e60000;
}
.content .orderbox3 li a {
	color: #fff;
	background-color: #e60000;
	text-decoration: none;
    display: block;
    padding: 5% 0;
}
.content .orderbox3 li a:hover {
	color: #e60000;
	background-color: #fff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
@media screen and (max-width: 768px){
/* 768px以下は２列 */
.content .orderbox3 li {
	width: 96%;
    margin: 6px 1% 14px;
}
}
.content .orderbox4 {
	margin: 12px 6% 36px;
	font-size: 16px;
}
.content .subheading4 {
	font-size: 18px;
	font-weight: bold;
	padding: 8px;
	border: solid 2px #c0c0c0;
}
.content .subheading4::before {
	content: "";
	border-left: solid 5px #e60000;
    padding: 2px 3.5px; 
}
.content .sh4a {
	margin: 30px 4% 0;
}
.content .sh4b {
	margin: 30px 2% 0;
}

/* 横幅を指定するための要素 */
.content .gmap-wrap {
	max-width: 96%; /* ここに横幅を指定 */
	margin: 20px auto;
}

/* Google Mapを囲う要素 */
.content .gmap {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 75%; /* 比率を4:3に固定 */
}
/* Google Mapのiframe */
.content .gmap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.content .center1 {
	text-align: center;
	margin: 20px 1%;
}
.content .center3 {
	text-align: center;
	margin: 20px 1% 10px;
}
.content .center4 {
	text-align: center;
	margin: 6px 1% 20px;
}
.content .center5 {
	text-align: center;
	margin: 0 1% 30px;
}
.content .text1 {
	font-size: 10px;
}
.content .text7 {
	font-size: 12px;
	color: #ee0000;
	font-weight: normal;
}
.content .text12 {
	font-size: 12px;
}
.content .text13 {
	font-size: 13px;
}
.content .text18 {
	font-size: 18px;
	font-weight: bold;
}

.content .style11 {
	display: inline-block;
	font-size: 18px;
	color: #82ae46;
	padding: 0 1%;
	border-bottom: solid 3px #82ae46;
	line-height: 1.1;
}
.content .style12 {
	font-size: 18px;
	color: #387d39; 
	padding: 0 0.5%;
	border-bottom: solid 2px #82ae46;
	line-height: 1.1;
}
.content .style13 {
	margin: 6px 0 0;
}
.content .style14 {
	font-size: 18px;
	color: #e60000;
	padding: 0 0.5%;
	border-bottom: solid 1px #e60000;
	line-height: 1.2;
}
.content .style15 {
	font-size: 18px;
	color: #666;
	padding: 0 0.5%;
	border-bottom: solid 1px #043c78;
	line-height: 1.2;
}
.content .style16 {
	display: block;
	font-size: 13px;
	border-radius: 18px;
	clear: left;
	margin: 4px 0.5% 6px;
	padding: 2px 1%;
    color: #fff;
	box-sizing: border-box;
}
.content .darkgreen {
  background-color: #009945;
}
.content .darkblue {
  background-color: #009fe9;
}
.content .darkpurple {
  background-color: #9d2c8e;
}
.content .darkorange {
  background-color: #f19c2c;
}

.content .contact-area a {
	width: 64%;
	margin: 40px auto;
	font-size: 18px;
	color: #fff;
	font-weight: 600;
    text-decoration: none;
    display: block;
	padding: 24px 20px;
	line-height: 1.1;
    text-align: center;
    box-sizing: border-box;
    background-color: #e60000;
	border: solid 2px #e60000;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.content .contact-area a:hover {
	color: #e60000;
    background-color: #fff;
}
@media screen and (max-width: 900px){
/* 900px以下 */
.content .contact-area a {
	display: none;
}
}

/* =========================================================
■sidebar
========================================================= */
.sidebar {
	float: left;
	width: 25%;
	height: auto;
	padding: 0 1%;
	box-sizing: border-box;
}
.sidebar a:link {
	color: #404960;
	text-decoration: none;
}
.sidebar a:visited {
	color: #404960;
	text-decoration: none;
}
.sidebar a:hover {
	text-decoration: underline;
}
.sidebar a:active {
	text-decoration: none;
}

.sidebar .contact-area a {
	width: 96%;
	margin: 10px auto 6px;
	font-size: 15px;
	color: #fff;
	font-weight: 600;
    text-decoration: none;
    display: block;
	padding: 30px 6px;
	line-height: 1.1;
    text-align: center;
    box-sizing: border-box;
    background-color: #e60000;
	border: solid 2px #e60000;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.sidebar .contact-area a:hover {
	color: #e60000;
    background-color: #fff;
}
@media screen and (max-width: 900px){
/* 900px以下 */
.sidebar .contact-area a {
	width: 80%;
	font-size: 18px;
	margin: 40px auto;
	padding: 24px 20px;
}
}

.sidebar h5 {
	font-size: 14px;
	padding: 4px 1.5%;
	margin: 4px 1%;
	background-color: #eee;
	border-left: solid 5px #e8383d; /* 左線（実線 太さ 色） */	
}
.sidebar h6 {
	font-size: 14px;
	margin: 0;
}
.sidebar .box00a {
	margin: 12px 1% 6px;
	text-align: center;
}
/* 画像マウスオーバー時に明るく */
.sidebar .box00a a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
@media screen and (max-width: 900px){
/* 768px以下 */
.sidebar .box00a {
	display: none;
}
}

.sidebar .box00b {
	box-sizing:border-box;
	width: 98%;
	margin: 0 1%;
	padding: 6px 0 1px;
	text-align: left;
}
.sidebar ul {
	list-style-type: none;
}
.sidebar li {
	position:relative;
	margin-left: 1.5%;
	padding: 0 4px 3px 9px;
}
.sidebar li:before {
	position:absolute;
	content:'';
	top: 5px;
	left: 0;
	height:0;
	width:0;
	border-style: solid;
	border-width: 5px 0 5px 6px;
	border-color: transparent transparent transparent #d90000;
}

.sidebar #sb_box_a, #sb_box_c, #sb_box_e {
	padding: 14px 0 2px;
	margin: 0 4%;
	text-align: center;
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_a a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_a .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_a .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_a .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_a .sp {
	display: block !important;
	margin: auto;
}
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_c a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_c .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_c .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_c .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_c .sp {
	display: block !important;
	margin: auto;
}
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_e a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_e .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_e .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_e .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_e .sp {
	display: block !important;
	margin: auto;
}
}

.sidebar #sb_box_b, #sb_box_d, #sb_box_f {
	padding: 14px 0;
	margin: 0 4%;
	text-align: center;
	border-bottom: dotted 1px #999; /* 下線（点線 太さ 色） */
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_b a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_b .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_b .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_b .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_b .sp {
	display: block !important;
	margin: auto;
}
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_d a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_d .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_d .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_d .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_d .sp {
	display: block !important;
	margin: auto;
}
}
/* 画像マウスオーバー時に明るく */
.sidebar #sb_box_f a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.sidebar #sb_box_f .pc {
	display: block !important;
	margin: auto;
}
.sidebar #sb_box_f .sp {
	display: none !important;
	margin: auto;
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px) {
.sidebar #sb_box_f .pc {
	display: none !important;
	margin: auto;
}
.sidebar #sb_box_f .sp {
	display: block !important;
	margin: auto;
}
}

/* =========================================================
■footer
========================================================= */
#footer {
    width: 100%;
    float: left;
}
@media (max-width: 900px) {
     .wrapper, .content, .sidebar {
          float: none;
          margin: 0;
          width: auto;
}
}
#footer #footerbox {
	width: 1080px;
	margin: 0 auto;
}
@media only screen and (max-width: 1080px) {
#footer #footerbox {
	width:100%;
	margin: 0 auto;
}
}
#footer .foot-box01 {
	font-size: 14px;
	margin: 20px 1% 2px;
	text-align: center;
}
#footer .foot-box02 {
	padding: 7px 0 2px;
	font-size: 10px;
	line-height: 1;
	text-align: center;
	border-top: dotted 1px #999;
}
#footer .foot-box03 {
	padding: 8px 0;
	font-size: 12px;
	line-height: 1;
	text-align: center;
}
#footer .foot-box04 {
	margin: 0 1% 10px;
	font-size: 12px;
	text-align: center;
}