@charset "utf-8";
/* CSS Document */



/* GoogleFonts読み込み 下記のライセンス記述は削除禁止 */

/*

* "Noto Sans JP" licensed under the SIL Open Font License 1.1

* by https://fonts.google.com/specimen/Noto+Sans+JP

*/

@font-face {
font-family: "Noto Sans JP";
font-style: normal;
font-weight: 400;
src: url("fonts/NS-400.woff2") format("woff2"), url("fonts/NS-400.woff") format("woff");
font-display: swap;
}

@font-face {
font-family: "Noto Sans JP";
font-style: normal;
font-weight: 700;
src: url("fonts/NS-700.woff2") format("woff2"), url("fonts/NS-700.woff") format("woff");
font-display: swap;
}


/*--------------------------------------------------------------------------
 reset
---------------------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
small,
dl,
dt,
dd,
ol,
ul,
li {
margin: 0;
font-size: 100%;
}

ul {
margin: 0;
padding: 0;
vertical-align: baseline;
}

img {
vertical-align: top;
-webkit-backface-visibility: hidden;
}
li {
list-style-type: none;
vertical-align: baseline;
}

input, button, textarea, select {
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

html{
font-size:62.5%;
}

body {
color: #000;
font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', 'Open Sans', Arial, Verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
/*font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;*/
/*font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;*/
}
h1, h2, h3, h4, h5, h6 {
letter-spacing: 0.1rem;
/*font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', 'Open Sans', Arial, Verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;*/
/*font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;*/
/*font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "Roboto Slab" , Garamond , "Times New Roman" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/
}

.sp {
display: none;
}
.pc_br {
    display: block;
}
.sp_br {
    display: none;
}

/*--------------------------------------
　Base
---------------------------------------*/

body {
font-size: 14px;
font-size: 1.4rem;
line-height: 2em;
/*line-height: 1.8em;*/
min-width: 1000px;
height: 100%;
overflow-x: hidden;
position: relative;
}

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

a {
color: #000;
text-decoration: none;
}

a:hover {
}

.fl {
float: left;
}

.fr {
float: right;
}

.strong {
font-weight: bold;
}

.f110 {
font-size: 110%;
}

.f120 {
font-size: 120%;
}

.f130 {
font-size: 130%;
}

.f150 {
font-size: 150%;
}

.f200 {
font-size: 200%;
}

.f300 {
font-size: 300%;
}
.wi1000 {
width: 1000px;
margin: 0 auto;
}
.wi1100 {
width: 1100px;
margin: 0 auto;
}
.ab {
position: absolute;
}
.min {
font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "Roboto Slab" , Garamond , "Times New Roman" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}
.vertical {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}
.relative {
position: relative;
}
.center {
text-align: center;
}
.fc_navy {
color: #003674;
}
.fc_yel {
color: #ffdd21;
}

/* ================== */
/*header　*/
/* ================== */

header {
position: relative;
}
.sitename,
.sitename a {
position: relative;
font-size:12px;
font-size:1.2rem;
font-weight: normal;
color: #FFF;
text-align: right;
}
.sitename a:hover {
text-decoration: none;
opacity: 0.7;
}

/* ================== */
/*barger　*/
/* ================== */

.overlay {
content: "";
display: block;
width: 0;
height: 0;
background-color: rgba(0, 0, 0, 0.5);
position: absolute;
top: 0;
left: 0;
z-index: 5;
opacity: 0;
transition: opacity .5s;
}
.overlay.open {
width: 100%;
height: 100%;
opacity: 1;
}
.out-frame {
height: 100%;
min-height: 100vh;
transition: all .5s;
display: flex;
flex-direction: column;
justify-content: center;
}
.bargBg {
background: rgba(255,255,255,0.9);
position: fixed;
top: 30px;
right: 20px;
z-index: 100;
transform: translateX(0);
transition: transform .5s;
width: 52px;
height: 52px;
}
/*.bargBg p {
color: #FFF;
font-size: 12px;
font-size: 1.2rem;
margin: 0;
position: absolute;
left: calc(50% - 19px);
bottom: 4px;
}*/
.menu-trigger {
display: inline-block;
width: 36px;
height: 28px;
vertical-align: middle;
cursor: pointer;
}
/* .menu-trigger.active {
transform: translateX(-250px);
}*/
.bargBg.active {
transform: translateX(-300px);
}
.bargBg span {
display: inline-block;
box-sizing: border-box;
position: absolute;
left: 14px;
width: 24px;
height: 2px;
background-color: #003674;
}
.bargBg.active span {
background-color: #003674;
}
.bargBg span:nth-of-type(1) {
top: 15px;
}
.bargBg.active span:nth-of-type(1) {
transform: translateY(10px) rotate(-45deg);
}
.bargBg span:nth-of-type(2) {
top: 26px;
}
.bargBg.active span:nth-of-type(2) {
opacity: 0;
}
.bargBg span:nth-of-type(3) {
top: 37px;
}
.bargBg.active span:nth-of-type(3) {
transform: translateY(-12px) rotate(45deg);
}
nav {
overflow-y: scroll;
width: 300px;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
position: fixed;
top: 0;
right: 0;
z-index: 10;
transform: translate(300px);
transition: all .5s;
}
nav.open {
transform: translateZ(0);
}
nav li {
color: #fff;
text-align: center;
}

* {
box-sizing: border-box;
}
ul {
list-style: none;
}
.header-menu ul.accordion ul {
display: none;
}
#g-nav .accordion li {
border-bottom: 1px solid #ccc;
}
#g-nav .accordion li a {
display: block;
text-align: left;
padding: 15px;
font-size: 14px;
font-size: 1.4rem;
color: #FFF;
background: #003674 url("img/arr_white.png") 96% 50% no-repeat;
background-size: 8px auto;
}
#g-nav .accordion li .tglMenu {
text-align: left;
color: #FFF;
padding: 15px 32px 15px 15px;
background: #003674 url("img/arr_white_down.png") 96% 50% no-repeat;
background-size: 12px auto;
image-rendering: -webkit-optimize-contrast;
}
#g-nav .accordion li .tglMenu.open {
background: #003674 url("img/arr_white_up.png") 96% 50% no-repeat;
background-size: 12px auto;
}
#g-nav .accordion li a,
#g-nav .accordion li .tglMenu {
line-height: 2rem;
}
#g-nav .accordion li ul li a {
padding:15px 20px 15px 15px;
color: #000;
background: #FFF url("img/arr_black.png") 96% 50% no-repeat;
background-size: 8px auto;
}
#g-nav .accordion li ul li {
border-bottom: none;
border-top: 1px solid #eee;
image-rendering: -webkit-optimize-contrast;
}


/*--------------------------------------
　Main Contents
---------------------------------------*/


#contents {
/*margin: 0 auto 80px;*/
padding: 0;
}

#index,
#category,
#page {
margin: 0;
padding: 0;
}
#category, #page {
/*width: 760px;*/
position: relative;
margin: 0 auto 60px;
padding: 0;
}






/*--------------------------------------
　PageTop
---------------------------------------*/

#page-top {
position: fixed;
bottom: 40px;
right: 20px;
z-index: 999;
width: 60px;
}
#page-top:hover {
opacity: 0.7;
}

#fixBn {
position: fixed;
bottom: 40px;
right: 100px;
z-index: 4;
width: 330px;
image-rendering: -webkit-optimize-contrast;
}
#fixBn:hover {
opacity: 0.7;
}


/*--------------------------------------
Footer
---------------------------------------*/
footer {
/*margin: 100px 0 0 0;*/
padding: 0;
position: relative;
}

/*--------------------------------------
　Pankuzu
---------------------------------------*/
#pankuzuWrap {
margin: 0 0 60px 0;
}
#pankuzu {
font-size: 12px;
font-size: 1.2rem;
margin: 0 auto;
padding: 5px;
width: 1000px;
color: #999;
}
#pankuzu span {
font-size: 12px;
font-size: 1.2rem;
color: #999;
}
#pankuzu a {
color: #999;
}
#pankuzu * {
/*color: #FFF;*/
}
#pankuzu a:hover {
text-decoration: underline;
}


footer {
padding: 60px 0 0 0;
background: #003674;
}
footer .foot_logo {
width: 190px;
margin: 0 auto 40px;
}
footer .foot_logo a:hover {
opacity: 0.7;
}
footer .areaInner {
width: 1000px;
margin: 0 auto;
padding: 0;
}
footer a {
text-decoration: none;
color: #FFF;
}
footer a:hover {
text-decoration: underline;
}
footer .areaInner .footBox {
margin: 0 0 30px 0;
}
footer .areaInner .footBox .sttl {
border-bottom: 1px solid #FFF;
padding: 0 0 6px 0;
margin: 0 0 14px 0;
}
footer .areaInner .footBox .sttl a {
background: url("img/arr_white.png") 6px 50% no-repeat;
background-size: 8px auto;
display: inline-block;
font-size: 16px;
font-size: 1.6rem;
font-weight: bold;
padding: 3px 0 3px 30px;
}

footer .areaInner .smap {
margin: 0 0 50px 0;
}
footer .areaInner .smap .sttl a{
font-size:16px;
font-size:1.6rem;
font-weight: 600;
}

footer .foot_link {
font-size: 14px;
font-size: 1.4rem;
text-align: right;
margin-bottom: 50px;
}
footer .foot_link a {
font-size: 14px;
font-size: 1.4rem;
text-decoration: underline;
}
footer .foot_link a:nth-child(1) {
display: inline-block;
margin-right: 15px;
}
footer .foot_link a:nth-child(2) {
display: inline-block;
margin-left: 15px;
}
footer .foot_link a:hover {
text-decoration: none;
}

footer .footBox ul {
padding: 0 20px;
}
footer .areaInner .footBox .accChild {
padding: 0 0 0 10px;
box-sizing: border-box;
}
footer .areaInner .footBox .accChild li {
background: none;
}
footer .areaInner .footBox .accChild li.subCat {
margin: 0 30px 0 0;
padding: 0;
}
footer .areaInner .footBox .accChild li.subCat::after{
content: "　/　";
letter-spacing: 0;
color: #FFF;
}
footer .areaInner .footBox .accChild .sp + li::before{
/* content: "　|　"; */
letter-spacing: 0;
}
footer .areaInner .footBox .accChild .sp + li::before{
/* content: "|　"; */
letter-spacing: 0;
}
footer .areaInner .footBox .accChild .sp + li.subCat::before {
content: "";
}
footer .areaInner .footBox .accChild .subList li::after{
content: "　/　";
letter-spacing: 0;
color: #FFF;
}
footer .areaInner .footBox .accChild li {
display: inline-block;
margin: 0 20px 0 0;
}
footer .areaInner .footBox .accChild li.sp {
display: none;
}
footer .areaInner .footBox .accChild li a {
/*background: url("img/arrow_white.png") 0 50% no-repeat;
background-size: 5.5px;*/
font-size: 14px;
font-size: 1.4rem;
font-weight: normal;
padding: 0 0 0 16px;
}
footer .areaInner .footBox .accChild .subList li:first-child:before {
content: "　/　";
letter-spacing: 0;
color: #FFF;
}
footer .areaInner .footBox .accChild .subList {
display: inline-block;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
footer .areaInner .footBox .accChild .subList li {
padding: 0 0 0 0;
display: inline-block;
margin: 0;
}
footer .areaInner .footBox .accChild .subList li a {
/*background: url(img/arrow_white.png) left center no-repeat;
background-image: none;
background-size: 4px auto;*/
padding: 0 10px;
font-size:13px;
font-size:1.3rem;
}
footer .smLink {
display: inherit;
text-align: right;
margin: 0 0 40px 0;
}
footer .smLink a {
/*background: url("img/arrow_square_black.png") 6px 50% no-repeat;
background-size: 17px;*/
padding: 2px 0 2px 30px;
}
footer .areaInner .noticeArea {
box-sizing: border-box;
width: 71%;
background-color: #1a4a82;
padding: 20px 30px;
margin: 0 auto;
}
footer .areaInner .noticeArea p {
color: #FFF;
font-size:12px;
font-size:1.2rem;
margin: 0;
}
footer .botPrg{
padding: 15px 0 0;
margin: 0 0 50px 0;
text-align: center;
font-size: 12px;
font-size: 1.2rem;
color: #FFF;
}
footer .botArea {
padding: 13px 0;
border-top: 1px solid #FFF;
}
footer .botArea .botInner {
width: 1000px;
margin: 0 auto;
position: relative;
}
footer .botArea .botInner .smap {
float: right;
}
footer .botArea .botInner .smap a {
background: url("img/arr_white.png") 6px 50% no-repeat;
background-size: 8px;
padding: 2px 0 2px 30px;
text-decoration: none;
}
footer .botArea .botInner .smap a:hover {
text-decoration: underline;
}
footer p.copy {
padding: 0;
margin: 0;
font-size: 12px;
text-align: left;
color: #FFF;
}
footer p.copy a {
}


/* ================== */
/*メインコンテンツ　*/
/* ================== */


p span {
    font-weight: bold;
    background: #ffdd21;
}
p span.extra {
color: #000;
}

#contents .caption {
display: block;
text-align: center;
}





/*--------------------------------------
　content
---------------------------------------*/


#keyArea.sec {
background: url("img/key_sec.jpg") 50% 0 no-repeat;
background-size: 100% auto;
position: relative;
}
#keyArea.sec .wi1000 {
position: relative;
padding: 20px 0 40px 0;
}
#keyArea.sec .logo {
width: 250px;
image-rendering: -webkit-optimize-contrast;
}

#keyArea.sec .logo a:hover {
opacity: 0.8;
}
#index h2, #category h1, #page h1{
color: #FFF;
font-size: 3.4rem;
background: #003674;
border-bottom: 5px solid #1766dd;
font-weight: bold;
line-height: 1.4;
margin: 0 0 50px;
padding: 22px 20px 22px 40px;
position: relative;
z-index: 1;
image-rendering: -webkit-optimize-contrast;
}
#index h2:before, #category h1:before, #page h1:before{
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 35px auto;
width: 35px;
height: 53px;
top: -10px;
left: 10px;
image-rendering: -webkit-optimize-contrast;
z-index: -1;
}

#index h2 a, #category h1 a, #page h1 a{
color: #FFF;
background: url("img/arr_white.png") right 0 top 50% no-repeat;
background-size: 8px auto;
padding: 0 30px 0 0;
display: block;
}
#index h2 a:hover, #category h1 a:hover, #page h1 a:hover {
opacity: 0.8;
}

#index h3, #category h2, #page h2 {
background: #f2f2f2;
border-left: 10px solid #003675;
margin: 10rem 0 30px;
padding: 18px 20px 18px 30px;
font-size:28px;
font-size:2.8rem;
line-height: 4rem;
text-align: left;
color:#000;
image-rendering: -webkit-optimize-contrast;
}
#index h3:after, #category h2:after, #page h2:after {
/*
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 10px;
left: 10px;
background: #c62509;
z-index: -1;
*/
}
#index h3 a, #category h2 a, #page h2 a {
text-align: left;
display: block;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 8px auto;
padding: 0 20px 0 0;
}
#index h3 a, #category h2 a, #page h2 a{
text-decoration: none;
}
.sitemap ul a {
text-decoration: underline;
}
.sitemap ul a:hover {
text-decoration: none;
}
#index h3 a:hover, #category h2 a:hover, #page h2 a:hover{
opacity:0.7;
}
#index h4,
#category h3,
#page h3 {
	font-size: 22px;
	font-size: 2.2rem;
	margin: 7rem 0 30px;
	padding: 15px 20px;
	line-height: 1.5;
	border-bottom: solid 3px #ddd;
	position: relative;
image-rendering: -webkit-optimize-contrast;
}
#index h4:before,
#category h3:before,
#page h3:before {
	content: "";
	background: #ffdd21;
	display: inline-block;
	width: 80px;
	height: 4px;
	position: absolute;
	top: 0;
	left: 0;
}
#index h4 a, #category h3 a, #page h3 a {
display: block;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 8px auto;
padding: 0 20px 0 0;
}
#index h4 a:hover, #category h3 a:hover, #page h3 a:hover {
opacity: 0.8;
}

#index h5, #category h6,
#category h4, #category h5, #category h6,
#page h4, #page h5, #page h6{
position: relative;
color: #003675;
margin: 35px 0 20px;
padding: 5px 20px 15px 20px;
background: linear-gradient(to right,
#003675 0%,/*色の部分*/
#003675 55%,/*色の部分*/
rgba(0,0,0,0) 40%,/*空白の部分*/
rgba(0,0,0,0) 100%)/*空白の部分*/
repeat-x left bottom/10px 3px;
/*border-bottom: 2px dotted #951816;*/
/*background: url(img/line01.gif) 0 100% repeat-x;*/
/*background-size: auto 3px;*/
font-size:20px;
font-size:2rem;
image-rendering: -webkit-optimize-contrast;
}
#index h5 a, #category h6 a,
#category h4 a, #category h5 a, #category h6 a,
#page h4 a, #page h5 a, #page h6 a {
position: relative;
color: #003675;
display: block;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 8px auto;
padding: 0 20px 0 0;
font-size:20px;
font-size:2rem;
}
#index h5 a:hover, #category h6 a:hover,
#category h4 a:hover, #category h5 a:hover, #category h6 a:hover,
#page h4 a:hover, #page h5 a:hover, #page h6 a:hover {
opacity: 0.8;
}

#contents ul{
margin: 20px 0 20px;
padding:10px 10px 0;
}
#contents ul li{
padding:0 0 6px 22px;
background:url(./img/listicon.png) 2px 7px no-repeat;
background-size: auto 14px;
}
#contents ul li a {
text-decoration: underline;
}
#contents ul li a:hover {
text-decoration: none;
}
span {
/*font-size: 1.7rem;*/
/*color: #f06d22;*/
}



/*--------------------------------------
　table
---------------------------------------*/

#contents table {
width: 100%;
table-layout: fixed;
margin:30px auto 30px;
}
#contents table th,
#contents table td {
word-break: break-all;
}
#contents table th {
width: 24%;
padding: 14px 16px;
background: #eef4f9;
border: 1px solid #003675;
line-height: 1.5;
text-align:center;
font-size:16px;
font-size:1.6rem;
font-weight: normal;
}
#contents table td {
line-height: 1.5;
padding: 13px;
border: 1px solid #003675;
/*background: #FFF;*/
font-size:14px;
font-size:1.4rem;
text-align:left;
word-wrap: break-word;
}


/*--------------------------------------
　float img
---------------------------------------*/

.float-wrap{
margin: 30px auto;
padding: 0 0;
}
.float-wrap img{
width: 100%;
}
.float-wrap .catch {
font-family: 'Noto Sans JP', 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', 'Open Sans', Arial, Verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-size: 2rem;
color: #003675;
font-weight: bold;
margin: 0 0 20px 0;
line-height: 3.2rem;
}
.float-wrap p{
margin: 0;
padding: 0;
width: auto;
}

.float-wrap .fl{
width: 340px;
padding: 0 40px 10px 0;
text-align: center;
}
.float-wrap .fr{
width: 340px;
padding: 0 0 10px 40px;
text-align: center;
}

.float-wrap .center{
width: 500px;
margin: 0 auto;
padding: 0 0 20px;
text-align: center;
}
#contents .float-wrap table {
width: 55%;
margin: 2rem 0 3rem;
}
#contents .float-wrap table th {
width: 42%;
}
/*#contents .float-wrap table td {
text-align: center;
}*/

.caption{
margin: 8px 0 0;
font-size:10px;
font-size:1.0rem;
line-height: 1.8rem;
word-break: break-all;
color: #999;
}
.caption a {
color: #999;
text-decoration: underline;
}
.caption a:hover {
color: #999;
text-decoration: none;
}
/*--------------------------------------
　btn
---------------------------------------*/
.btn-link a,
.btn-internal a,
.btn-web a {
box-sizing: border-box;
border-radius: 5px;
}
.btn-link {
margin: 20px 0;
text-align: right;
image-rendering: -webkit-optimize-contrast;
}
.btn-link a {
color: #003674;
display: inline-block;
background: url("img/arr_black.png") 0% 50% no-repeat;
background-size: 8px;
padding: 4px 0 4px 16px;
line-height: 1.3;
text-decoration: underline;
}
.btn-link a:hover {
text-decoration: none;
}
.btn-internal {
width: 480px;
margin: 20px auto;
image-rendering: -webkit-optimize-contrast;
}
.btn-web {
width: 480px;
margin: 20px auto;
image-rendering: -webkit-optimize-contrast;
}
.btn-internal a {
background: #003674 url("img/arr_white.png") right 20px top 50% no-repeat;
background-size: 8px auto;
border-radius: 5px;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
font-weight: bold;
display: block;
text-align: center;
padding: 18px 36px 18px 18px;
}
.btn-internal a:hover {
opacity: 0.8;
}
.btn-tel {
display: none;
image-rendering: -webkit-optimize-contrast;
}
.btn-web a {
background: #b71137 url("img/arr_white.png") right 20px top 50% no-repeat;
background-size: 8px auto;
color: #FFF;
font-size: 15px;
font-size: 1.5rem;
font-weight: bold;
display: block;
text-align: center;
padding: 18px 36px 18px 18px;
}
.btn-web a:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
}
.btn-web a:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
}
.btn-web a:hover {
opacity: 0.8;
}


.wi1100 {
width: 1100px;
}
.auto {
margin: 0 auto;
}
.webLink {
font-size: 10px;
color: #808080;
text-align: center;
line-height: 1.6rem;
}
p {
margin: 0px 0px 15px 0px;
}
#page.sitemap {
width: 1000px;
margin: 0 auto;
}
#page.sitemap h2 a {
color: #444;
}
#page.sitemap li a:hover {
text-decoration: underline;
}


/*共通パーツ*/


/*目次*/
#contents #pageList {
background: #eef4f9;
padding: 60px 40px 40px 40px;
margin: 50px auto 50px;
}
#contents #pageList .titArea {
margin: 0 auto 20px;
line-height: 1;
}
#contents #pageList .titArea .decoTit {
text-align: center;
line-height: 1;
}
#contents #pageList .titArea .decoTit .enTit {
text-align: center;
font-size: 12rem;
color: rgba(213,228,244,0.4);
font-weight: bold;
line-height: 5rem;
letter-spacing: 0.4rem;
position: relative;
}
#contents #pageList .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -20px;
text-align: center;
font-size: 3rem;
font-weight: bold;
color: #003674;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
#contents #pageList .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 31px auto;
width: 31px;
height: 46px;
top: -40px;
right: -40px;
image-rendering: -webkit-optimize-contrast;
}
#contents #pageList #toc {
box-shadow: 0 0 10px #bdc6d1;
padding: 20px 30px;
background: #FFF;
}
#contents #pageList ul {
margin: 0;
padding: 0;
}
#contents #pageList ul li {
margin: 0 0 5px 0;
padding: 0 0 0 22px;
}
#contents #pageList ul ul {
margin: 0;
padding: 0 0 0 20px;
}
#contents #pageList ul li a {
}



/*関連記事*/
#contents #article {
background: #003674;
padding: 60px 40px 40px 40px;
margin: 8rem auto 50px;
}
#contents #article .titArea {
margin: 0 auto 20px;
line-height: 1;
}
#contents #article .titArea .decoTit {
text-align: center;
line-height: 1;
}
#contents #article .titArea .decoTit .enTit {
text-align: center;
font-size: 9rem;
color: rgba(213,228,244,0.4);
font-weight: bold;
line-height: 3rem;
letter-spacing: 0.4rem;
position: relative;
}
#contents #article .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -20px;
text-align: center;
font-size: 3rem;
font-weight: bold;
color: #FFF;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
#contents #article .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 31px auto;
width: 31px;
height: 46px;
top: -40px;
right: -40px;
image-rendering: -webkit-optimize-contrast;
}
#contents #article #toc {
background: #FFF;
padding: 20px 30px;
}
#contents #article ul {
margin: 0;
padding: 0;
}
#contents #article ul li {
margin: 0 0 5px 0;
padding: 0 0 0 22px;
}
#contents #article ul ul {
margin: 0;
padding: 0 0 0 20px;
}
#contents #article ul li a {
}





.comparts1 {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.comparts1 .sBox {
background: rgba(0,54,116,0.8);
border-radius: 5px;
width: 49%;
}
.comparts1_sec {
margin: 0 auto 80px;
width: 80%;
}
.comparts1_sec .sBox {
background: rgba(0,54,116,1);
box-shadow: 0 0 10px #bdc6d1;
margin-bottom: 5rem;
width: 100%;
}
.comparts1 .sBox .sTit {
background: #FFF;
font-size: 2.2rem;
font-weight: bold;
border-radius: 5px 5px 0 0;
padding: 6px 30px;
letter-spacing: 0.1rem;
}
.comparts1 .sBox .detail {
padding: 20px 30px;
}
.comparts1 .sBox .detail .catch {
font-size: 2.4rem;
color: #FFF;
font-weight: bold;
line-height: 3.6rem;
letter-spacing: 0.1rem;
border-bottom: 2px solid #f4d980;
padding: 0 0 20px 100px;
position: relative;
}
.comparts1 .sBox:first-child .detail .catch:before {
content: "";
position: absolute;
background: url("img/icon_matsumoto.png") no-repeat;
background-size: 80px auto;
width: 80px;
height: 80px;
top: calc(50% - 50px);
left: 0;
}
.comparts1 .sBox:last-child .detail .catch:before {
content: "";
position: absolute;
background: url("img/icon_zenken.png") no-repeat;
background-size: 80px auto;
width: 80px;
height: 80px;
top: calc(50% - 50px);
left: 0;
}
.comparts1 .sBox .detail .catch span {
font-size: 1.8rem;
background: none;
}
.comparts1 .sBox .detail p {
color: #FFF;
}


.sec_h2Area {
background: #f2f2f2;
display: table;
width: 100%;
margin: 7rem 0 4rem 0;
}
.sec_h2Area .mark {
background: #003674;
color: #FFF;
display: table-cell;
height: 100%;
vertical-align: middle;
font-size: 3.6rem;
font-weight: bold;
padding: 10px 20px;
line-height: 5rem;
text-align: center;
width: 18%;
}
.sec_h2Area .mark .fs_l {
font-size: 4.5rem;
position: relative;
}
.sec_h2Area .mark .fs_l:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 31px auto;
width: 31px;
height: 46px;
top: -10px;
right: -110px;
image-rendering: -webkit-optimize-contrast;
z-index: 1;
}
.sec_h2Area .sec_h2 {
font-size: 3rem;
font-weight: bold;
display: table-cell;
vertical-align: middle;
margin: 0;
padding: 20px 20px 20px 50px;
position: relative;
line-height: 4rem;
margin-top: 7rem;
}
.sec_h2Area .sec_h2:before {
content: "";
position: absolute;
display: block;
width: 40px;
height: 100%;
top: 0;
left: 0;
background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #003674 50.5%) no-repeat top right/100% 100%;
}



.installation_sec {
background: #eef4f9;
position: relative;
margin: 7rem auto 80px;
margin-left: -100%;
margin-right: -100%;
padding: 80px 0;
}
.installation_sec:before {
content: "";
position: absolute;
display: block;
width: 100%;
height: 390px;
bottom: 0;
right: 0;
background: #003674;
z-index: 0;
}
.installation .subTit {
text-align: center;
display: block;
margin: 0 auto 30px;
}
.installation .subTit p {
display: inline-block;
text-align: center;
margin: 0;
font-size: 3rem;
background: #003674;
border-radius: 10px;
padding: 20px 80px;
font-weight: bold;
color: #FFF;
position: relative;
}
.installation .subTit p span {
background: none;
}
.installation .subTit p:before {
content: "";
position: absolute;
bottom: -20px;
left: calc(50% - 20px);
width: 0;
height: 0;
border-style: solid;
border-width: 20px 20px 0 20px;
border-color: #003674 transparent transparent transparent;
}
.installation .titArea {
margin: 0 auto 30px;
}
.installation .titArea .decoTit {
text-align: center;
}
.installation .titArea .decoTit .enTit {
text-align: center;
font-size: 12rem;
color: rgba(213,228,244,0.4);
font-weight: bold;
line-height: 10rem;
letter-spacing: 0.4rem;
position: relative;
}
.installation .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -40px;
text-align: center;
font-size: 4.5rem;
font-weight: bold;
color: #003674;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
.installation .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 31px auto;
width: 31px;
height: 46px;
top: -40px;
right: -40px;
image-rendering: -webkit-optimize-contrast;
}
.installation .list {
background: #FFF;
box-shadow: 0 0 10px #bdc6d1;
}
.installation .list .caption {
text-align: center;
}
.installation .list .detail {
padding: 20px;
}
.installation .list .detail .name {
text-align: center;
font-size: 2.2rem;
font-weight: bold;
margin: 0 0 20px 0;
}
.installation .list .btn-web {
width: 100%;
margin: 0 auto;
}
.installation .list .btn-web a {
background: #b71137 url("img/arr_white.png") right 10px top 50% no-repeat;
background-size: 6px auto;
border-radius: 5px;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 10px 20px 10px 15px;
line-height: 2rem;
width: 100%;
margin: 0 auto;
}


.supervision {
background: #eef4f9;
border-radius: 5px;
margin: 8rem auto 4rem;
}
.supervision .titArea {
background: #003674;
border-radius: 5px 5px 0 0;
padding: 20px 40px 20px 140px;
position: relative;
}
.supervision .titArea .posi01 {
position: absolute;
width: 100px;
height: 100px;
top: -40px;
left: 20px;
}
.supervision .titArea .sTit {
display: inline-block;
vertical-align: middle;
background: #FFF;
border-radius: 5px;
color: #003674;
font-size: 2rem;
font-weight: bold;
padding: 6px 20px;
margin: 0 30px 0 0;
position: relative;
}
.supervision .titArea .sTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 31px auto;
width: 31px;
height: 46px;
top: -33px;
right: -18px;
image-rendering: -webkit-optimize-contrast;
}
.supervision .titArea .name {
color: #FFF;
font-size: 2.4rem;
font-weight: bold;
display: inline-block;
vertical-align: middle;
margin: 0;
}
.supervision .detail {
padding: 40px;
}
.supervision .detail p {
margin: 0;
}
.supervision .detail p.catch {
font-size: 2.4rem;
font-weight: bold;
color: #003674;
margin: 0 0 20px 0;
}




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

body {
line-height: 2em;
min-width: inherit;
width: 100%;
padding: 0 0 120px 0;
}
.pc_br {
display: none;
}
.sp_br {
display: block;
}
.pc {
display: none !important;
}
.sp {
display: block;
}
img {
max-width: 100%;
}
h1, h2, h3, h4, h5, h6 {
/*letter-spacing: 0rem;*/
}
p {
font-size: 15px;
font-size: 1.5rem;
margin: 0 0 10px 0;
}
a {
color: #000;
text-decoration: none;
}
.wi1000 {
width: 100%;
margin: 0 auto;
box-sizing: border-box;
}
#category, #page {
position: relative;
float: none;
width: 100%;
padding: 0 15px 0 15px;
box-sizing: border-box;
}
.wi1100 {
width: 100%;
margin: 0 auto;
padding: 0 10px;
box-sizing: border-box;
}
.sitename {
padding: 5px 60px 5px 10px;
line-height: 1.6rem;
}
.sitename,
.sitename a {
font-size:10px;
font-size:1rem;
text-align: left;
font-weight: normal;
color: #fFF;
font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}


/*--------------------------------------
　content
---------------------------------------*/

.temp_inner {
padding: 0;
box-sizing: border-box;
}

#keyArea.sec {
background: url(img/key_sec_sp.jpg) 50% 0 no-repeat;
background-size: cover;
position: relative;
}

#keyArea.sec .wi1000 {
padding: 10px 15px;
position: relative;
}
#keyArea.sec .logo {
width: 175px;
image-rendering: -webkit-optimize-contrast;
}
#keyArea.sec .logo img {
image-rendering: -webkit-optimize-contrast;
}
#keyArea.sec .logo a:hover {
opacity: 0.8;
}
#keyArea.sec h1 {
color: #000;
font-size: 20px;
font-size: 2rem;
line-height: 3.2rem;
padding: 0 28% 0 0;
}
#index h2, #category h1, #page h1 {
background:#003674;
border-bottom: 3px solid #1766dd;
position: relative;
margin: 23px auto 23px;
padding: 12px 10px 10px 20px;
box-sizing: border-box;
font-size:20px;
font-size:2rem;
line-height: 3rem;
}
#index h2:before, #category h1:before, #page h1:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 20px auto;
width: 20px;
height: 30px;
top: -6px;
left: 6px;
image-rendering: -webkit-optimize-contrast;
z-index: -1;
}


#index h2 a, #category h1 a, #page h1 a {
background: url("img/arr_white.png") right 0 top 50% no-repeat;
background-size: 8px auto;
padding: 0 20px 0 0;
display: block;
}
#index h2 {
width: 100%;
box-sizing: border-box;
}
#index h3, #category h2, #page h2 {
background: #f2f2f2;
background-size: 20px auto;
border-left: 5px solid #003675;
position: relative;
margin: 35px 0 20px;
padding:15px 10px 15px 15px;
font-size:20px;
font-size:2rem;
line-height: 2.4rem;
text-align: left;
color:#000;
}
/*
#index h3:after, #category h2:after, #page h2:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 5px;
left: 5px;
}
*/
/*#index h3:before, #category h2:before, #page h2:before {
content: "";
position: absolute;
background: url(img/icon_cate_p.png) no-repeat;
background-size: 44px auto;
width: 44px;
height: 59px;
bottom: 0;
left: 0;
z-index: -1;
}*/
#index h3 a, #category h2 a, #page h2 a {
text-align: left;
display: block;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 6px auto;
padding: 0 20px 0 0;
}
#index h4, #category h3, #page h3 {
position: relative;
margin: 35px 0 20px;
padding: 10px 10px 10px 15px;
font-size:17px;
font-size:1.7rem;
line-height: 2.4rem;
}
#index h4 a, #category h3 a, #page h3 a {
display: block;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 6px auto;
padding: 0 20px 0 0;
}
#index h4:before, #category h3:before, #page h3:before {
content: "";
background: #ffdd21;
display: inline-block;
width: 80px;
height: 3px;
position: absolute;
top: 0;
left: 0;
}


#index h5, #category h6, #category h4, #category h5, #category h6, #page h4, #page h5, #page h6 {
position: relative;
color: #003675;
margin: 35px 0 20px;
padding: 3px 10px 15px 10px;
font-size:16px;
font-size:1.6rem;
line-height: 2.4rem;
}
#index h5 a, #category h6 a, #category h4 a, #category h5 a, #category h6 a, #page h4 a, #page h5 a, #page h6 a {
position: relative;
background: url("img/arr_black.png") right 0 top 50% no-repeat;
background-size: 6px auto;
color: #003675;
display: block;
font-size: 16px;
font-size: 1.6rem;
padding: 0 20px 0 0;
}

.sitemap h2 a {
color: #000;
}



#contents ul{
margin: 20px 0 20px;
padding:10px 10px 0;
}
#contents ul li{
min-height:12px;
padding:0 0 4px 22px;
background:url(./img/listicon.png) 2px 8px no-repeat;
background-size: auto 14px;
image-rendering: -webkit-optimize-contrast;
font-size:13px;
font-size:1.3rem;
}

/*p span {
font-weight: bold;
background: #fffab6;
color: #256b8b;
}*/
/*--------------------------------------
　table
---------------------------------------*/

#contents table {
width: 100%;
table-layout: fixed;
margin: 30px auto 30px;
}
#contents table {
border-collapse: collapse;
width: 100%;
border: none;
}
#contents table th {
background: #eef4f9;
text-align: center;
font-size: 15px;
font-size: 1.5rem;
}
#contents table td {
font-size: 15px;
font-size: 1.5rem;
}
#contents table th,
#contents table td {
border: 1px solid #003675;
padding: 10px;
box-sizing: border-box;
}


/*--------------------------------------
　float img
---------------------------------------*/
#contents .float-wrap {
margin: 20px auto;
padding: 0;
width: 100%;
}
#contents .float-wrap .float-img {
margin: 0 0 12px 0;
}
#contents .float-wrap .fl {
width: 100%;
padding: 0 0 10px 0;
text-align: left;
}
#contents .float-wrap .fr {
width: 100%;
padding: 0 0 10px 0;
text-align: left;
}
#contents .float-wrap .center {
width: 100%;
padding: 0 0 10px 0;
text-align: left;
}
#contents .float-wrap img {
width: 100%;
}
#contents .float-wrap p {
    font-size: 1.4rem;
	line-height: 1.6;
	margin: 0 auto;
	width: 100%;
}
#contents .float-wrap .catch {
    font-size: 1.6rem;
	margin: 0 0 10px;
	line-height: 1.5;
}
#contents .float-wrap .fl.t_small{
	width: 40%;
	padding: 0 20px 0 0;
	text-align: center;
	float: left;
}	
#contents .float-wrap .fr.t_small{
	width: 40%;
	padding: 0 0 0 20px;
	margin: 0;
	text-align: center;
	float: right;
}
#contents .float-wrap table {
	width: 100%;
	margin: 2rem 0 2rem;
	display: table;
}
#contents .float-wrap table th {
    width: 100%;
	display: block;
	font-size: 1.6rem;
    border-bottom: none;
}
#contents .float-wrap table tr:nth-child(2) th {
    border-top: none;
}
#contents .float-wrap table td {
    text-align: left;
	display: block;
	font-size: 1.4rem;
}
#contents .caption {
margin: 8px 0 0;
font-size: 10px;
font-size: 1.0rem;
line-height: 1.3;
word-break: break-all;
color: #999;
text-align: center;
}


/*--------------------------------------
　btn
---------------------------------------*/

.btn-link {
margin: 20px 0;
text-align: center;
}
.btn-link a {
background: #FFF url("img/arr_black.png") right 15px top 50% no-repeat;
background-size: 6px auto;
border: 2px solid #003674;
border-radius: 5px;
color: #003674;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 12px 26px 12px 15px;
position: relative;
text-decoration: none;
line-height: inherit;
}
.btn-link a:hover {
text-decoration: none;
}
.btn-internal,
.btn-web,
.btn-tel,
.btn-link {
width: 90%;
margin: 20px auto;
}
.btn-internal a {
background: #003674 url("img/arr_white.png") right 15px top 50% no-repeat;
background-size: 6px auto;
border-radius: 5px;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 12px 26px 12px 15px;
position: relative;
}
.btn-web a {
background: #b71137 url("img/arr_white.png") right 15px top 50% no-repeat;
background-size: 6px auto;
border-radius: 5px;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 12px 26px 12px 15px;
position: relative;
}
.btn-tel {
display: block;
}
.btn-tel a {
background: #2a9267 url("img/icon_tell.png") left 20px top 50% no-repeat;
background-size: 14px;
border-radius: 5px;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 12px 20px 12px 40px;
position: relative;
}





/*共通パーツ*/



/*目次*/
#contents #pageList {
background: #eef4f9;
padding: 20px 15px 15px 15px;
margin: 50px auto 50px;
}
#contents #pageList .titArea {
margin: 0 auto 5px;
line-height: 1;
}
#contents #pageList .titArea .decoTit {
text-align: center;
line-height: 1;
}
#contents #pageList .titArea .decoTit .enTit {
text-align: center;
font-size: 4.5rem;
color: rgba(213,228,244,0.4);
font-weight: bold;
line-height: 5rem;
letter-spacing: 0.4rem;
position: relative;
margin: 0;
}
#contents #pageList .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -20px;
text-align: center;
font-size: 2.5rem;
font-weight: bold;
color: #003674;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
#contents #pageList .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 18px auto;
width: 18px;
height: 26px;
top: -28px;
right: -20px;
image-rendering: -webkit-optimize-contrast;
}
#contents #pageList #toc {
box-shadow: 0 0 10px #bdc6d1;
padding: 15px;
background: #FFF;
}
#contents #pageList ul {
margin: 0;
padding: 0;
}
#contents #pageList ul li {
margin: 0 0 5px 0;
padding: 0 0 0 22px;
}
#contents #pageList ul ul {
margin: 0;
padding: 0 0 0 20px;
}
#contents #pageList ul li a {
}



/*関連記事*/
#contents #article {
background: #003674;
padding: 20px 15px 15px 15px;
margin: 50px auto 50px;
}
#contents #article .titArea {
margin: 0 auto 5px;
line-height: 1;
}
#contents #article .titArea .decoTit {
text-align: center;
line-height: 1;
}
#contents #article .titArea .decoTit .enTit {
text-align: center;
font-size: 3.5rem;
color: rgba(213,228,244,0.4);
font-weight: bold;
line-height: 3rem;
letter-spacing: 0.4rem;
position: relative;
margin: 0;
}
#contents #article .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -12px;
text-align: center;
font-size: 2.5rem;
font-weight: bold;
color: #FFF;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
#contents #article .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 18px auto;
width: 18px;
height: 26px;
top: -28px;
right: -20px;
image-rendering: -webkit-optimize-contrast;
}
#contents #article #toc {
background: #FFF;
padding: 15px;
}
#contents #article ul {
margin: 0;
padding: 0;
}
#contents #article ul li {
margin: 0 0 5px 0;
padding: 0 0 0 22px;
}
#contents #article ul ul {
margin: 0;
padding: 0 0 0 20px;
}
#contents #article ul li a {
}



.comparts1 {
display: block;
flex-wrap: wrap;
justify-content: flex-start;
}
.comparts1_sec {
margin: 0 auto 50px;
}
.comparts1 .sBox {
background: rgba(0,54,116,0.8);
border-radius: 5px;
}
.comparts1_sec .sBox {
background: rgba(0,54,116,1);
box-shadow: 0 0 10px #bdc6d1;
}
.comparts1 .sBox:first-child {
width: 100%;
margin: 0 0 15px 0;
}
.comparts1 .sBox:last-child {
width: 100%;
}
.comparts1 .sBox .sTit {
background: #FFF;
font-size: 1.5rem;
font-weight: bold;
border-radius: 5px 5px 0 0;
padding: 5px 15px;
letter-spacing: 0.1rem;
line-height: 2rem;
}
.comparts1 .sBox .detail {
padding: 15px 15px;
}
.comparts1 .sBox .detail .catch {
font-size: 1.6rem;
color: #FFF;
font-weight: bold;
line-height: 2.8rem;
letter-spacing: 0.1rem;
border-bottom: 2px solid #f4d980;
padding: 0 0 15px 65px;
position: relative;
}
.comparts1 .sBox:first-child .detail .catch:before {
content: "";
position: absolute;
background: url("img/icon_matsumoto.png") no-repeat;
background-size: 50px auto;
width: 50px;
height: 50px;
top: calc(50% - 32px);
left: 0;
}
.comparts1 .sBox:last-child .detail .catch:before {
content: "";
position: absolute;
background: url("img/icon_zenken.png") no-repeat;
background-size: 50px auto;
width: 50px;
height: 50px;
top: calc(50% - 32px);
left: 0;
}
.comparts1 .sBox .detail .catch span {
font-size: 1.2rem;
background: none;
}
.comparts1 .sBox .detail p {
color: #FFF;
}



.sec_h2Area {
margin: 0 0 50px 0;
}
.sec_h2Area .mark {
font-size: 1.8rem;
padding: 10px;
line-height: 3rem;
width: 26%;
}
.sec_h2Area .mark .fs_l {
font-size: 2.5rem;
position: relative;
}
.sec_h2Area .mark .fs_l:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 16px auto;
width: 16px;
height: 28px;
top: -8px;
right: -56px;
image-rendering: -webkit-optimize-contrast;
z-index: 1;
}
.sec_h2Area .sec_h2 {
font-size: 1.6rem;
font-weight: bold;
display: table-cell;
vertical-align: middle;
margin: 0;
padding: 10px 10px 10px 30px;
position: relative;
line-height: 2.4rem;
}
.sec_h2Area .sec_h2:before {
content: "";
position: absolute;
display: block;
width: 20px;
height: 100%;
top: 0;
left: 0;
background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #003674 50.5%) no-repeat top right/100% 100%;
}



.installation_sec {
margin: 0 auto 50px;
padding: 40px 0;
}
.installation .subTit {
text-align: center;
display: block;
margin: 0 auto 15px;
}
.installation .subTit p {
display: inline-block;
text-align: center;
margin: 0;
font-size: 1.8rem;
background: #003674;
border-radius: 10px;
padding: 10px 25px;
font-weight: bold;
color: #FFF;
position: relative;
}
.installation .subTit p span {
background: none;
}
.installation .subTit p:before {
content: "";
position: absolute;
bottom: -10px;
left: calc(50% - 10px);
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #003674 transparent transparent transparent;
}
.installation .titArea {
margin: 0 auto 10px;
}
.installation .titArea .decoTit {
text-align: center;
line-height: 1rem;
}
.installation .titArea .decoTit .enTit {
font-size: 4rem;
line-height: 5rem;
letter-spacing: 0.4rem;
}
.installation .titArea .decoTit .jaTit {
display: inline-block;
position: relative;
top: -28px;
text-align: center;
font-size: 2.5rem;
font-weight: bold;
color: #003674;
line-height: 0;
letter-spacing: 0.2rem;
padding: 0;
}
.installation .titArea .decoTit .jaTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 15px auto;
width: 15px;
height: 24px;
top: -15px;
right: -20px;
image-rendering: -webkit-optimize-contrast;
}
.installation .list {
background: #FFF;
box-shadow: 0 0 10px #bdc6d1;
}
.installation .list .ph .captionWrap {
padding: 0 15px;
box-sizing: border-box;
}
.installation .list .detail {
padding: 20px;
}
.installation .list .detail .name {
text-align: center;
font-size: 1.8rem;
font-weight: bold;
margin: 0 0 15px 0;
}
.installation .list .btn-web a {
background: #b71137 url("img/arr_white.png") right 10px top 50% no-repeat;
background-size: 6px auto;
border-radius: 5px;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
display: block;
text-align: center;
padding: 10px 20px 10px 15px;
line-height: 2rem;
width: 100%;
margin: 0 auto;
}
.installation .list .btn-tel {
width: 100%;
margin: 15px auto 0;
}
.installation .list .btn-tel a {
background: #2a9267 url(img/icon_tell.png) left 15px top 50% no-repeat;
background-size: 10px;
padding: 12px 10px 12px 30px;
line-height: 2rem
}



.supervision {
width: 92%;
margin: 0 auto 50px;
}
.supervision .titArea {
padding: 10px 15px 10px 80px;
position: relative;
}
.supervision .titArea .posi01 {
position: absolute;
width: 50px;
height: 50px;
top: calc(50% - 25px);
left: 15px;
}
.supervision .titArea .sTit {
display: inline-block;
vertical-align: middle;
background: #FFF;
border-radius: 3px;
color: #003674;
font-size: 1rem;
font-weight: bold;
padding: 5px 10px;
margin: 0 0 5px 0;
position: relative;
line-height: 1rem;
}
.supervision .titArea .sTit:before {
content: "";
position: absolute;
background: url(img/icon_lightning.png) no-repeat;
background-size: 16px auto;
width: 16px;
height: 30px;
top: -20px;
right: -10px;
image-rendering: -webkit-optimize-contrast;
}
.supervision .titArea .name {
color: #FFF;
font-size: 1.8rem;
font-weight: bold;
display: inline-block;
vertical-align: middle;
margin: 0;
}
.supervision .detail {
padding: 15px;
}
.supervision .detail p {
margin: 0;
}
.supervision .detail p.catch {
font-size: 1.6rem;
font-weight: bold;
color: #003674;
margin: 0 0 15px 0;
}





/*ヘッダー*/

#sp_titArea {
/*padding: 10px;*/
box-sizing: border-box;
border-bottom: 1px solid #eee;
position: fixed;
top: 0;
right: 0;
z-index: 999;
}
#sp_titArea .mainTit {
/*background: url("img/logo_sp.png") 0 50% no-repeat;
background-size: 50px;*/
width: 80%;
margin: 0;
min-height: 40px;
}
#sp_titArea .mainTit a {
padding: 0 0 0 60px;
display: block;
}
#sp_titArea .mainTit,
#sp_titArea .mainTit a {
font-size: 15px;
font-size: 1.5rem;
font-weight: bold;
color: #444;
line-height: 2rem;
}



/*--------------------------------------
btn
---------------------------------------*/



#contents .sitemap {
padding: 0 10px;
box-sizing: border-box;
}

#contents .sitemap h1 {
width: 100%;
}


/* ================== */
/*header　*/
/* ================== */

#headNoteArea{
padding: 2px 10px;
background: #00344c;
font-size:11px;
font-size:1.1rem;
box-sizing: border-box;
}
#headNoteArea .areaInner{
width: 100%;
}
#headNoteArea h1,
#headNoteArea .sitename a{
font-size:11px;
font-size:1.1rem;
font-weight: normal;
color: #FFF;
}
#headNoteArea .h1Area {
padding: 0;
box-sizing: border-box;
}
#contents .sitename {
font-size: 14px;
font-size: 1.4rem;
color: #FFF;
margin: 0 0 10px 0;
position: relative;
z-index: 2;
padding: 0 40px 0 0;
}



#headNoteArea{
/*background: url("img/bg_cate_h1.jpg") -300px 60px no-repeat;
background-size: 880px auto;*/
width: 100%;
padding: 10px 0 0 0;
font-size:12px;
font-size:1.2rem;
box-sizing: border-box;
}
#headNoteArea .areaInner{
padding: 0 15px;
margin: 0 auto;
box-sizing: border-box;
}
#headNoteArea .sitename,
#headNoteArea .sitename a {
font-size: 13px;
font-size: 1.3rem;
font-weight: bold;
color: #000;
line-height: 2rem;
}
#headNoteArea .sitename a:hover {
text-decoration: underline;
}
#headNoteArea .h1Area {
padding: 28px 15px 12px 70px;
box-sizing: border-box;
}
#headNoteArea .h1Area h1 {
font-size: 20px;
font-size: 2rem;
line-height: 3rem;
font-weight: bold;
color: #000;
}
/*#contents .sitename {
font-size: 24px;
font-size: 2.4rem;
color: #FFF;
margin: 0 0 40px 0;
}*/


/*共通パーツ*/
.font_la {
font-size: 27px;
font-size: 2.7rem;
}


/* ハンバーガーメニュー */
nav {
width: 280px;
transform: translate(280px);
}

/* ハンバーガーメニュー */
.bargBg {
background: rgba(255,255,255,0.9);
position: fixed;
top: 20px;
right: 10px;
z-index: 100;
transform: translateX(0);
transition: transform .5s;
width: 46px;
height: 46px;
}
.bargBg p {
width: 46px;
text-align: center;
color: #FFF;
font-size: 7px;
font-size: 0.7rem;
margin: 19px auto 0;
position: inherit;
bottom: inherit;
left: inherit;
}
/*.bargBg p {
width: 32px;
color: #FFF;
font-size: 7px;
font-size: 0.7rem;
margin: 0;
position: absolute;
left: calc(50% - 16px);
bottom: -2px;
}*/
.bargBg.active {
transform: translateX(-280px);
}
.bargBg span {
display: inline-block;
box-sizing: border-box;
position: absolute;
left: calc(50% - 10px);
width: 20px;
height: 2px;
background-color: #003674;
}
.bargBg.active span {
background-color: #003674;
}
.bargBg span:nth-of-type(1) {
top: 13px;
}
.bargBg.active span:nth-of-type(1) {
transform: translateY(9px) rotate(-45deg);
}
.bargBg span:nth-of-type(2) {
top: 22px;
}
.bargBg.active span:nth-of-type(2) {
opacity: 0;
}
.bargBg span:nth-of-type(3) {
top: 31px;
}
.bargBg.active span:nth-of-type(3) {
transform: translateY(-9px) rotate(45deg);
}
.out-frame {
position: relative;
width: 100%;
}
.out-frame.black:after {
background: #FFF;
opacity: 0.8;
content: '';
height: 10000px;
right: 0;
top: 0;
padding: 0;
position: fixed;
width: 100%;
z-index: 1;
transition: all .5s ease;
-webkit-transition: all .5s ease;
-moz-transform: all .5s ease;
}
.out-frame:after {
background: #FFF;
opacity: 0;
content: '';
right: 0;
top: 0;
position: fixed;
width: 100%;
z-index: 1;
transition: all .5s ease;
-webkit-transition: all .5s ease;
-moz-transform: all .5s ease;
}
.header-frame {
position: relative;
width: 100%;
height: 64px;
}
.menu-btn {
/*background: url(./img/sp-btn-menu_off.png) 0 0 no-repeat;
background-size: 44px;*/
position: absolute;
top:10px;
right: 10px;
height: 44px;
width: 44px;
z-index: 10;
}
.navOpenOut {
background: rgba(255,255,255,0.5);
padding: 13px 10px;
box-sizing: border-box;
}
.navOpen {
/*background: url(./img/sp-btn-menu_off.png) 0 0 no-repeat;
background-size: 44px;*/
position: inherit;
top:inherit;
right: 10px;
height: 44px;
width: 44px;
z-index: 10;
float: right;
}

.header-menu ul li a{
display: block;
padding: 15px 30px 15px 10px;
/*background: #c3eced url("./img/arr02.png") 97% 50% no-repeat;
background-size: auto 15px;*/
/*border-bottom: 1px solid #FFF;*/
text-decoration: none;
line-height: 1.3;
color: #444;
font-size: 13px;
font-size: 1.3rem;
}
.header-menu ul.accordion li ul li:first-child a {
padding: 12px 30px 12px 10px;
}

.header-menu ul li.delete{
/*background: #444 url("img/batu.png") 61% 50% no-repeat;
background-size: 14px;*/
padding: 10px;
text-align: center;
color:#fff;
font-size: 13px;
font-size: 1.3rem;
}

.header-menu ul.accordion {
border-top: 1px solid #eee;
}
.header-menu ul.accordion ul{
display: none;
}
.header-menu ul.accordion .subCat ul.subList {
display: block;
}
.header-menu ul.accordion .tglMenu{
display: block;
padding: 15px 30px 15px 10px;
/*background: #c3eced url("img/arr02_dw.png") 97% 50% no-repeat;
background-size: auto 15px;*/
/*border-bottom: 1px solid #FFF;*/
text-decoration: none;
line-height: 1.3;
color: #444;
font-size: 13px;
font-size: 1.3rem;
}
.header-menu ul.accordion .open{
/*background: #c3eced url("img/arr02_up.png") 97% 50% no-repeat;
background-size: auto 15px;*/
}
.header-menu ul.accordion ul li a{
padding: 12px 30px 12px 20px;
/*background: #FFF url("img/arr_black_right.png") 97% 50% no-repeat;
background-size: auto 11px;*/
color: #444;
/*border-bottom: 1px dotted #ccc;*/
}
.header-menu ul.accordion ul li.subCat a,
.header-menu ul.accordion ul li.subCat ul.subList li a{
padding: 12px 30px 12px 20px;
}



/*--------------------------------------
Footer
---------------------------------------*/

/*--------------------------------------
pankuzu
---------------------------------------*/
#pankuzuWrap {
overflow: auto;
white-space: nowrap;
margin: 0;
}
#pankuzu {
box-sizing: border-box;
width: 100%;
padding: 6px 15px 8px;
font-size: 11px;
font-size: 1.1rem;
color: #000;
}
#pankuzu a {
color: #000;
}
footer {
box-sizing: border-box;
width: 100%;
padding: 20px 0 0 0;
margin: 0;
position: relative;
}
footer .foot_logo {
width: 200px;
margin: 0 auto 20px;
}
footer .foot_logo img {
image-rendering: -webkit-optimize-contrast;
}

footer .sitename {
padding: 30px;
box-sizing: border-box;
color: #000;
}
footer .sitename a {
display: block;
text-align: center;
font-size: 18px;
font-size: 1.8rem;
font-weight: bold;
color: #000;
}
footer .areaInner {
box-sizing: border-box;
position: relative;
width: 100%;
margin: 0 auto;
padding: 0;
border-top: 1px solid #FFF;
}
/*footer .areaInner .footBox {
border-top: 1px solid #444;
}*/
footer .areaInner .footBox {
margin: 0;
}
footer .areaInner .footBox .sttl a {
display: block;
box-sizing: border-box;
font-size: 14px;
font-size: 1.4rem;
color: #FFF;
background: #003674 url("img/arr_white_down.png") right 10px center no-repeat;
background-size: 12px auto;
padding: 10px 40px 10px 4%;
text-decoration: none;
}
footer .areaInner .footBox .sttl.open a{
background: #003674 url(img/arr_white_up.png) right 10px center no-repeat;
background-size: 12px auto;
}
footer .areaInner .footBox .sttl {
border-bottom: 1px solid #f3f3f3;
padding: 0;
margin: 0;
image-rendering: -webkit-optimize-contrast;
}
footer .areaInner .footBox .sttl.sitemap a {
background: #003674 url("img/arr_white.png") right 12px center no-repeat;
background-size: 8px auto;
}
footer .areaInner .footBox .accChild {
display: none;
padding: 0;
margin: 0;
box-sizing: border-box;
background: #FFF;
}
footer .areaInner .footBox .accChild li {
display: block;
float: none;
padding: 0;
background: none;
margin: 0;
image-rendering: -webkit-optimize-contrast;
}
footer .areaInner .footBox .accChild li.sp {
display: block;
}
footer .areaInner .footBox .accChild li.sp a {
/*background-color: #FFF;*/
}
footer .areaInner .footBox .accChild li a {
display: block;
box-sizing: border-box;
background: url("img/arr_black.png") right 12px center no-repeat;
background-size: 8px auto;
color: #000;
border-bottom: 1px dotted #eee;
padding: 10px 40px 10px 4%;
font-size: 13px;
font-size: 1.3rem;
}
footer .areaInner .footBox .accChild li.subCat {
margin: 0;
}
footer .areaInner .footBox .accChild li.subCat a {
display: block;
box-sizing: border-box;
background: url("img/arr_black.png") right 12px center no-repeat;
background-size: 6px auto;
color: #000;
border-bottom: 1px dotted #eee;
padding: 10px 40px 10px 8%;
}
footer .areaInner .footBox .accChild li.subCat:last-child li:last-child a {
border: none;
}
footer .areaInner .footBox .accChild .subList {
padding: 0;
margin: 0;
display: block;
}
footer .areaInner .footBox .accChild .subList li {
display: block;
}
footer .areaInner .footBox .accChild .subList li:first-child:before {
content: "";
}
footer .areaInner .footBox .accChild .subList li a {
padding: 10px 40px 10px 14%;
background: url("img/arr_black.png") right 12px center no-repeat;
background-size: 6px auto;
}
footer .areaInner .footBox .accChild .subList li:after {
content: "";
}
footer .areaInner .footBox .accChild li:after {
content: "";
}
footer .areaInner .footBox .accChild li.subCat:after {
content: "";
}
footer .areaInner .footBox .accChild li:last-child:after {
content: "";
}
footer .areaInner .noticeArea {
box-sizing: border-box;
width: 90%;
margin: 30px auto 10px;
padding: 20px;
box-sizing: border-box;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.8em;
}
footer .areaInner .noticeArea p {
font-size: 12px;
font-size: 1.2rem;
}
footer .botPrg {
padding: 0;
margin: 0 0 30px 0;
text-align: center;
font-size: 12px;
font-size: 1.2rem;
}
footer .botArea {
}
footer .botArea .botInner {
width: 100%;
}
footer .noticeArea p.botPrg{
padding: 6px 0 2px;
text-align: center;
}
footer p.copy {
margin: 0;
padding: 10px;
font-size: 10px;
font-size: 1.0rem;
line-height: 1.3;
text-align: center;
}
footer a {
text-decoration: none;
}


/*--------------------------------------
　PageTop
---------------------------------------*/

#page-top {
position: fixed;
bottom: 3%;
right: 15px;
z-index: 2;
width: 50px;
}
#page-top img {
}


#fixBn {
position: fixed;
bottom: 3%;
right: 23%;
width: 61%;
}
#fixBn:hover {
opacity: 0.7;
}


}






