@charset "utf-8";
/* 最小幅 0px以上 */
/* CSS Document */
*{/*margin: 0*/; /*padding: 0*/} /* リセット⇒　slick 左側余白無くなってしまう */
body{  /* スマホのヘッダー上の微かな隙間を取り除くための対策として入力した　*/
	margin: 0;
}

html{
    font-family: Raleway, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; 
    line-height: 1.5
}

img {width: 100%;} /* img要素に対しての指定 slickに対しては別に同記述あり */


h1 {
    font-size: 3em; /* 48px */
    line-height: 1; /* 48px */
	margin-bottom: 0.5em}
h2 {
    font-size: 2.25em; /* 36px */
    line-height: 1.3333; /* 48px */
    margin-bottom: 0.6667em} 
h3 {
    font-size: 1.5em; /* 24px */
    line-height: 1; /* 24px */
    margin-bottom: 1em} 
h4,h5,h6 {
    font-size: 1em; /* 16px */ 
    line-height: 1.5; /* 24px */
    margin-bottom: 1.5em}


#global_navi ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: none; 
}

#global_navi ul li a {
	display: block;
	padding: 0.3333em 2.2222em;
	margin: -0.861em; /* タイトルとスライダーの隙間の調整 */
	color: #020202;
	font-size: 1.125em;
	text-decoration: none;

   display: inline-block;
   transition: .3s;
   -webkit-transform: scale(1);
   transform: scale(1);
 }

#global_navi ul li a:hover {
	color: #000;
	-webkit-transform: scale(1.1);
    transform: scale(1.1);
}

header {
	background-color: #000;
    padding: 0.0625em;
	margin-top:-0.625em;
	margin-left: -1.5em;
	margin-right: -1.5em;
	margin-bottom: 3.125em;
} 

.site-title {
	color: #fff;
	text-align: center;
	line-height: 0.3;
	font-weight: 100;
}

.site-title-sub {
	color: #fff;
	text-align: center;
	line-height: 0.3;
}

 footer {  /* footer css の本体は、ずっと下にあるので注意 */
	color: #fff;
	text-align: center;
	background-color: #000;
	padding: 1.5em 0;
	margin-left: 0em;/* -1.5em */
	margin-right: 0em;/* -1.5em */
}


.link{
	color: #fff;
}

.slider{position: relative;}
.slick-content .comment2{
  position: absolute;
  top: 20%;left: 28.1%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);  
z-index: 150;
color: #222222;
text-decoration: none;

}

.slider{position: relative;}
.slick-content .comment3{
  position: absolute;
  top: 20%;left: 39.1%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);  
z-index: 150;
color: #696969;
text-decoration: none;
   
} 

.slider{position: relative;}
.slick-content .comment4{
  position: absolute;
  top: 20%;left: 50%;  /* オリジナルは top: 20%;left: 20% */
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);  
z-index: 150;
color: #dddddd;
text-decoration: none;

}

.slider{position: relative;}
.slick-content .comment22{
  position: absolute;
  top: 40%;left: 28.1%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #222222;
text-decoration: none;

}

.slider{position: relative;}
.slick-content .comment33{
  position: absolute;
  top: 40%;left: 39.1%;  /* オリジナルは top: 20%;left: 20% */
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #696969;
text-decoration: none;

}

.slider{position: relative;}
.slick-content .comment44{
  position: absolute;
  top: 40%;left: 50%;  /* オリジナルは top: 20%;left: 20% */
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #dddddd;
text-decoration: none;
    
}


/* ハンバーガーメニュー ボタン */
.menu-btn {
    position: fixed;
	/* position: relative; */
	top: 5.5em;
    right: 3em; /* 0.625em */
    display: flex;
	height: 2.8125em; 
    width: 2.8125em;  
    justify-content: center;
	align-items: center;
    z-index: 90;
    background-color: rgba(0, 138, 210, 1); 
} 
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 0.1875em;
    width: 1.565em;
    border-radius: 0.1875em;
    background-color: #ffffff;
    position: absolute;
}
.menu-btn span:before {
    bottom: 0.5em;
}
.menu-btn span:after {
    top: 0.5em;
}

/* MENU 文字の組込 */ 
.menu-btn:before  {
  position:absolute;
  font-size: 10px; 
  color: #fff;	
  font-weight: bold; 
  padding: 15px 0; 
  left: 45px;
  width: 45px; /* 84% */
  content:"MENU";
  background: rgba(0, 138, 210, 1);
  background-position: right 45px; 
} 
/* .menu-btn {
	right: 45px; 
} */
/* 組込ここまで */



#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/* メニューオープン時は真ん中の線を透明にする */
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}
#menu-btn-check {
    display: none;
}


/* ハンバーガーメニュー */
.menu-content {
    width: 100%; 
    height: 100%;  
    position: fixed;
    top: 5.5em; 
	left: 100%; 
    z-index: 80;
    background-color: rgba(0, 138, 210, 1);
	transition: all 0.5s;
}
 #menu-btn-check:checked ~ .menu-content {
    left: 70%;
}

.menu-content ul {
    padding: 4.375em 0.625em 0;
}
.menu-content ul li {
    border-bottom: solid 0.0625em #ffffff;
    list-style: none;
}
.menu-content ul li a {
    display: block;
    width: 30%; 
    font-size: 0.9375em;
    box-sizing: border-box;
    color:#ffffff;
    text-decoration: none;
    padding: 0.6em 1em 0.6666em 0;
    position: relative;
}
.menu-content ul li a::before {
    content: "";
	width: 7px; 
    height: 7px; 
    border-top: solid 0.125em #ffffff;
    border-right: solid 0.125em #ffffff;
    transform: rotate(45deg);
    position: absolute;
    right: 0.6875em;
    top: 1em;
}



/* お知らせ iframe */
.news{
position: relative;
margin-top: 80px;
margin-bottom: 10px;
}
.news h4{
  margin-top: -40px;
 margin-bottom: 10px;
}
.frame{
margin:0 auto;
} 

/* お知らせのiframe +レシポンシブル */
.frame{
position:relative;
width:80%;
height:0;
padding-top:15%;
}
.frame iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

/* 当事業所について */
.about{
position: relative;
margin-top: 120px;
margin-bottom: 0px;
}

/* 業務情報 */
.aboutplus{
position: relative;
}

.aboutplus h4{
text-align: left;
position: absolute; left: 2%;
margin-top: 0px; /* 10px */
margin-bottom: 10px; /* 0px */
}

.aboutplus p img{
 max-width: 96%; /* スマホで見た時、画面中央になるようにした 96% */
 width: auto;
 vertical-align:bottom;
 float: left;
 padding:0.625em;
}


/* お問い合わせ */
.img_contact{position: relative;}
.contact .comment0{
  position: absolute;
  top: 20%;left: 50%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #000000;
text-decoration: none;
font-size: 24px;

}

.img_contact{position: relative;}
.contact .comment00{
  position: absolute;
  top: 30%;left: 50%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #000000;
text-decoration: none;
font-size: 24px;

}

/* .img_contact p img{
	margin-left: -0.5em;
	margin-right: -0.5em;
	
} */


/* アクセス */
.img_access{position: relative;}
.access .comment1{
  position: absolute;
  top: 20%;left: 50%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);  
z-index: 150;
color: #ffffff;
text-decoration: none;
font-size: 24px;
 
}

.img_access{position: relative;}
.access .comment11{
  position: absolute;
  top: 30%;left: 50%;  
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: 150;
color: #ffffff;
text-decoration: none;
font-size: 24px;
     
}

/* .img_access p img{
	margin-left: -0.5em;
	margin-right: -0.5em;
} */

/* アクセス */
/* グーグルマップ・レスポンシブレイアウト */
/* ⇒@media only screen and (max-width: 480px)  @media screen and (min-width: 480px)　の所を参照 */


/* 画像の左に余白が生ずる事に対する対策 */
body {
    overflow-x: hidden;
}
.img_contact img {
    width: 100%;
    height: auto;
}
.img_contact{
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.img_access img {
    width: 100%;
    height: auto;
}
.img_access{
    margin-left: calc(-50vw + 50%); 
	margin-right: calc(-50vw + 50%);
    
}





/* フォーム サイズ変更 */
/* PC */
input[type="text"] {
		width: 40%;
		height: 2em;
	}
/*
input[type="email"] {
		width: 40%;
		height: 2em;
	}

textarea {
	width: 80%; 
	height: 12.5em; 

}

button[type="submit"]{
	margin:0.625em;
}
button[type="reset"]{
	margin:0.625em;
}


label[for="name"] {
margin-left: 2.5em;
}

label[for="mail"]{
margin-left: 2.5em;
}

label[for="contents"]{
margin-left: 2.5em;
}
*/

/*.background-service{
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 /*background-image: url("../images/bg.jpg") ;
 background-position: 50% 20%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%; /* -3% */ 
 /*padding-right: 0%; /* 300% */  
 /* } */ 

/*.background-business{
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ543 ÷ 画像横幅1222 × 100%) 正式な値は44.435% */
 /*background-image: url("../images/bg_viz_top.jpg") ;
 background-position: 50% 20%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 /*padding-right: 0%;/* 300% */ /* 20% */
 /* } */ 


/*.haikei .bg {
 width: 100%;        /*位置の設定*/
 /*height: 100%; 
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 /*top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 /*left: 0; 
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 /*background-image: url("../images/bg-bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%; /* -3% */	
 /*padding-right: 0%; /* 300% */
 /*opacity: 0.5; /*透過の設定*/
 /*}*/


/*.haikei-business .bg {
 width: 100%;        /*位置の設定*/
 /*height: 100%;
 /*position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 /*top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 /*left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 /*background-image: url("../images/bg_viz_bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/*-3%*/ 
 /*padding-right: 0%; /*300%*/ /* 20% */ 	

 /*opacity: 0.5; /*透過の設定*/	
/* } */
 

.service-title{
	color: #a9a9a9;
	text-align: center;
	background-color: #fff;
}

.business-title{
	color: #a9a9a9;
	text-align: center; 	
	background-color: #fff;
}


/* パンくずリスト　お問い合せ */
ol.contact{
	margin: 0 1.5625em;
	padding: 0;
	list-style-type: none;
	display: flex;
}

ol.contact li::after {
   	content: ">";
    margin: 0 0.625em;
}

ol.contact li:last-child::after {
	content: none;
}
/* パンくずリスト　アクセス */
ol.access{
	margin: 0 1.5625em;
	padding: 0;
	list-style-type: none;
	display: flex;
}

ol.access li::after {
   	content: ">";
    margin: 0 0.625em;
}

ol.access li:last-child::after {
	content: none;
}
/* パンくずリスト サービス */
ol.service{
	margin: 0 1.5625em;
	padding: 0;
	list-style-type: none;
	display: flex;
}

ol.service li::after {
   	content: ">";
    margin: 0 0.625em;
}

ol.service li:last-child::after {
	content: none;
}

/* パンくずリスト 事業所概要 */
ol.business{
	margin: 0 1.5625em;
	padding: 0;
	list-style-type: none;
	display: flex;
}

ol.business li::after {
   	content: ">";
    margin: 0 0.625em;
}

ol.business li:last-child::after {
	content: none;
}


/*表の装飾　事業所概要 */
caption{
  text-align: left;
  font-weight: bold;
}

.table-responsive .wrap_scroll_table {
  width: 80%; 
  overflow-x: scroll;
  margin: 0 auto;
  margin-bottom: 1.5em;
}

.table-responsive .scroll_table {
  margin-top: 10px;
  max-width: 80%; 
  margin: 0 auto;
  white-space: nowrap; /* スライドバーが正しく動作するよう新たに追加　折り返ししなくなる */
}

.table-responsive .scroll_table,
.table-responsive .scroll_table th {
  border: 1px solid #cbced2;
  border-collapse: collapse;
  text-align: center;
}

.table-responsive .scroll_table,
.table-responsive .scroll_table td {
  border: 1px solid #cbced2;
  border-collapse: collapse;
  text-align: left;
}

.table-responsive .scroll_table th {
  background: #f7f0f0;
  color: #a9a9a9;
  padding: 4px 12px;
}

.table-responsive .scroll_table td {
  background: #f5f6f8;
  padding: 4px 12px;
}


/* three.jsの試験  後での修正を考慮して、大きさはemでなく取敢えずpxとしておく */
/* ブラウザ画面の拡大縮小に伴って最上位の画像とthree.js搭載の画像に間に出現する隙間が大きくなったり、小さくなったりする。marginやaddingでは解決できないので保留とする */
.kv-block {
  height: 400PX; 
  position: relative;
  background-image: url("../images/bg_viz_top_3.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; /* cover containも試験した→NG */
  
  margin-left: 0%; /* -3% */ 
  margin-right: 0%; /* -3% */
  z-index: 0;
}

#canvas {
  width: 100%;
  height: 100%;
}


.bg_rgba {  /* 追加 */
    width: 85%; 
    height: 90%; 
    z-index: 200;
    content: " ";
    display: flex;  
    position: absolute; 
    top: 5%; 
    left: 7.5%; 
    background-color:  rgba(0, 72, 154, 0.5); 
	
	justify-content: center;
    align-items: center;
  
} 

.main-title {
  font-family: Raleway,sans-serif;
  text-align: center;
  font-size: 40px;
  color: #a9a9a9; 
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 1em;
  line-height: 1;
  text-shadow: 2px 2px 10px #808080;
  letter-spacing: 0.2em;
  pointer-events: none;
  z-index: 300;
}
 
.sub-title{
  font-family: Raleway,sans-serif;
  text-align: center;
  font-size: 16px;
  color: #a9a9a9;
  font-weight: bold;
  position: absolute;
  top: 80px;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 1em;
  line-height: 1;
  letter-spacing: 0.2em;
  pointer-events: none;
  z-index: 300;
}

@media screen and (max-width: 640px) { /* three.jsに付帯する部分しか書いてはいけない */
  .main-title {
    font-size: 20px;
  }
}
 
.text + .text {
  margin-top: 1em;
}
 
.contents-block {
  padding: 40px 0;
	
}
 
.title {
  font-size: 26px;
  font-weight: bold;
  line-height: 1.6;
  margin-bottom: 10px;
}
 
@media screen and (max-width: 640px) { /* three.jsに付帯する部分しか書いてはいけない */
  .title {
    font-size: 22px;
    line-height: 1.4;
  }
}


/* タブの導入 */
.tab_container {
  padding-bottom: 1em; 
  background-color: #fff;
  border:1px solid rgba(0, 138, 210, 1) ; 
  margin: 0 10%;} 
.tab_item {
  width: calc(100%/4);
  padding:15px 0;
  border-bottom: 3px solid rgba(0, 138, 210, 1); 
  background-color: #ececec;
  text-align: center;
  color: rgba(0, 138, 210, 1) ; 
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 1em 1em 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content {
  display: block;
}
.tab_container input:checked + .tab_item {
  background-color: rgba(0, 138, 210, 1); 
  color: #fff;
}
.c-txtsp{
  text-align: left;	
}



/* タブ中のボタン 見本１ 見本２ 共用 */
.btn a{
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#227DFF;
    text-align:center;
    color:#FFFFFF;
    font-weight:bold;
    border-radius:0.625em; 
    -webkit-border-radius:0.625em; 
    -moz-border-radius:0.625em; 
}
.btn a:hover{
    background:#1094FF;
    color:#BCDAFF;
    margin-left:0.25em; 
    margin-top:0.25em; 
    box-shadow:none;
}



/* トップページのフッター (アクセス　お問い合せ と共用) *//*フッターの帯を描画する部分がずっと上にあるので注意 */
ul {
  list-style: none;
  margin: 0;  
}

#footer01 {
  position: relative;
  margin-bottom: -10px; 	
}
 
#footer01 .logo {
  text-align: center;
  padding: 20px 0;
}
 
#footer01 .logo a {
  display: inline-block;
}
 
#footer01 .logo img {
  width: 120px;
}
 
#footer01 .nav a {
  display: block;
  padding: 0 10px;
  color: #fff; 
}




@media only screen and (min-width: 640px) {
  /* PCのみ */
  #footer01 .nav {
	display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px 0; 
  }
  
  #footer01 .nav li a{
	text-decoration: none; 
	   
  }
 	
}	
	
@media only screen and (max-width: 640px) {
  /* SPのみ */
  #footer01 {
    text-align: center;
  }
 
  #footer01 .nav li {
    
  }
 
  #footer01 .nav li:last-child {
   
  }
 
  #footer01 .nav li a {
	
	text-decoration: none;  
	padding: 6px 20px; 
    position: relative;   
	left: 46%; 
	margin-right: 0%; /* -50% */
    transform: translate(-50%, -50%)  
   }

  #footer01 p small{ /* コピーライトを下に移動 中央揃え */ 
	position: absolute;
	top: 360px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) 
   }

}




/* 文章の左右マージン */
/* topページ */
.about p{
   margin: 0 8px;
	
}
.aboutplus .margin{ /* 若干、右側の方の隙間が大きい。左寄せになっているため。後日、考慮 */
   margin: 0 8px 20px;  
   text-align: left;
}


/* サービス */
.service-title .margin-web-service{
	margin: 0 8px;
}
.service-title .margin-wireless-service{
	margin: 0 8px;
}
/* テキストを左揃えのまま中央寄せにする */
.service-wrapper{
	max-width: 950px;
    margin: 0 auto;
	text-align: center;
    background: #fff;
    margin-bottom: 20px;
}

.service-title .margin-web-service{
	margin: 0 8px;  
	display: inline-block;
    text-align: left;
	text-indent: 1em;
	
}

.service-title .margin-wireless-service{
	margin: 0 8px;  
	display: inline-block;
    text-align: left;
	text-indent: 1em;

}
 

.service-wrapper1{
	max-width: 950px;
    margin: 0 auto;
	text-align: center;
    background: #fff;
    
}
.service-wrapper2{
	max-width: 950px;
    margin: 0 auto;
	text-align: left;
    background: #fff;
    margin-bottom: 20px;
}


/* 事業所概要 */
.business-title h4{
    margin: 0 8px	
}

/* テキストを左揃えのまま中央寄せにする */
.business-wrapper{    
	max-width: 950px;
    margin: 0 auto;
	text-align: center;
    background: #fff;
	
}

.business-wrapper1{
	max-width: 950px;
    margin: 0 auto;
	text-align: left;
    background: #fff;
	margin-bottom: 20px;
	
}

.business-title .web-service-business{
	margin: 0 8px;  /* 0 8px */
	display: inline-block;
    text-align: left;
	text-indent: 1em; 
	
}

.business-title .wireless-service-business1{
	margin: 0 8px;  /* 0 8px */
	display: inline-block;
    text-align: left;
	text-indent: 1em;
}

.business-title .wireless-service-business{
	margin: 0 8px;
}
/* 以上 */

@media only screen and (max-width: 400px) {
	
	.spdvid .sp {
    position: absolute;max-width:100%;max-height:100%;z-intdex:150;margin-top:1.3%;
	margin-left:1.8%;text-align:center;color:#696969;font-size:12px;	
	}	
	
}

@media only screen and (min-width: 400px) {
    
	.spdvid .sp {
	position: absolute;max-width:100%;max-height:100%;z-intdex:150;margin-top:1.3%;
	margin-left:2.5%;text-align:center;color:#696969;font-size:12px;   	
	}	

}

/* お問い合わせのテキストエリア内、プレースホルダーの文字 */
.place::placeholder {
	  font-size: 12px;
	  font-family: Hiragino Kaku Gothic ProN;
}






/* スマートフォンで見たときは"sp"のclassがついた画像が表示される slickのみの調整*/
@media only screen and (max-width: 499px) {  /*ブレイクポイント480px　⇒　499px */
	
 header {
	background-color: #000;
    padding: 0.0625em;
	margin-top:-0.625em;
	margin-left: 0em; /* -1.5em */
	margin-right: 0em; /* -1.5em */
	margin-bottom: 3.125em; 
} 
	
	
	.pc { display: none !important; }
    .sp { display: block !important; }

	html{ font-size: 75%}        /* レシポンシブタイプセッティングの設定　12px(スマホ)/16px(ブラウザの文字) */


/* ハンバーガーメニュー ボタン */
.menu-btn {
    position: fixed;
	/* position: relative; */
    top: 5.5em;
    right: 4em; /* 0.625em *//* 11.5em */
    display: flex;
	height: 2.8125em; 
    width: 2.8125em;  
    justify-content: center;
	align-items: center;
    z-index: 90;
    background-color: rgba(0, 138, 210, 1); 
}
	
/* MENU 文字の組込 */
.menu-btn:before  {
  position:absolute;
  font-size: 10px; 
  font-weight: bold;
  color: #fff;
  padding: 9.3px 0; 
  left: 33.5px; /* 34px */
  width: 34px; /* 112% */
  content:"MENU";
  background-color: rgba(0, 138, 210, 1);
}
/*.menu-btn {
	right: 45px;
}
/* 組込ここまで */
	

/* ハンバーガーメニュー */
#menu-btn-check:checked ~ .menu-content {
    left: 70%; /* 70% *//* 50% */
}

	
/* お知らせ iframe +レシポンシブル */
.frame{
position:relative;
width:95%; /* 100% ⇒ 画面右側に微小隙間ができるので 95%とする */
height:0;
padding-top:50%;
}
.frame iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

.news h4{
 text-align: center; 
 
}

.about h4{
 text-align: left;
/* position: absolute; left: 11%; */
 margin-top: -90px;
 margin-bottom: 0px;
 margin-left: 2%;	
}
.about p{
 text-align: left;
 /*position: absolute; left: 11%;
 margin-top: -60px;
 padding-bottom: 0px;*/
}
	
/* 業務情報 */
/* .aboutplus {  
margin-top: 0px;
margin-bottom: 0px;
padding-top: 0px;
} */

	
/* 業務情報 */
.aboutplus{
position: relative;
padding-top: 16px;/* 追加 */
	
}

.aboutplus h4{
text-align: left;
position: absolute; left: 2%;
margin-top: 0;/* 10px */
margin-bottom: 10px;/* 0px */
}

	
	
/* フォーム サイズ変更 */
/* SP */
input[type="text"] {
		width: 80%;
		height: 1em;
	}

/* input[type="email"] {
		width: 80%;
		height: 1em;
	}

textarea {
	width: 80%; 
	height: 6.25em; 
	
   }

button[type="submit"]{
	margin:0.625em;
	font-size:1em;
}
button[type="reset"]{
	margin:0.625em;
	font-size:1em;
}

label[for="name"] {
margin-left: 3.3em;
}

label[for="mail"]{
margin-left: 3.3em;
}

label[for="contents"]{
margin-left: 3.3em;
}

*/



/* アクセス　撮影情報 */
/* グーグルマップ・レスポンシブレイアウト */
.creditUnit {
  margin: 0;
  padding: 0.3125em; 
  text-align: center;
}

.box {
  display:flex;
  flex-direction: column;
  margin-bottom: 0.3125em; 
  border: solid 1px #cccccc; 
  padding: 5px; 
}

.text {
  width: 100%; 
  text-align: center;
}

.text ul li {
  font-family: "Hiragino Kaku Gothic ProN";
  list-style: none;
}

h3 {
  font-size: 1em;
  margin: 0;
}

.gmap-wrap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%; /* 比率を4:3に固定 */ /* 40%としたが、比率が1:2.5にならない */

}

.gmap-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; /*オリジナルは 100%*/

}

	
.background-service{
 width: 100%;
 height: 0;
 padding-top: 150%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% *//* 120% */
 background-image: url("../images/bg.jpg") ;
 background-position:  50% 100%; 	
 background-size: cover;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%;/* 300% */ /* 10% */ /* 6.5% */
 } 	


.background-business{
 width: 100%;
 height: 0;
 padding-top: 44%; /* calc(画像高さ543 ÷ 画像横幅1222 × 100%) 正式な値は44.435% *//* 35% */
 background-image: url("../images/bg_viz_top.jpg") ;
 background-position: 50% 20%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%; /* -3% */  
 padding-right: 0%;/* 300% *//* 20% */ 
 } 	
	
	
.haikei .bg {
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100;/* 100% */
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 background-image: url("../images/bg-bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%; /* 300% */ /* スマホのハンバガーボタン・立体の位置が変わる */ /* 20% */ /* 6.5% */

 opacity: 0.5; /*透過の設定*/
}
	
	
.haikei-business .bg {
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 37%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% *//* 35% */
 background-image: url("../images/bg_viz_bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%; /*300%*/ /* スマホのハンバガーボタンの位置が変わる */ /* 20% */	

 opacity: 0.5; /*透過の設定*/	
}	
	
	
	
	
	
	
	
.haikei .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 }  

.haikei-business .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
}

	
/* タブ中のボタン 見本１ 見本２ 共用 */	
.btn{
    width:60%; 
    line-height:30px; 
}
.btn a{
    font-size:1em; 
}


/* サービスの背景 */	
.haikei {                         
width: 100%;  
height: 35%;   
position: relative; 

/* フッターの挿入ここから */
 background: #e5e5e5;
 text-align: center;
} 

.haikei a {
 color: #333333; /* #696969; */
 text-decoration: none;
}
.haikei a:hover {
 text-decoration: none; /*オリジナルは underline */
}
.haikei .menu {
 margin: 0;
 padding: 0;
 list-style: none;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 
 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em; 
 font-size : 12px; 
 font-weight: bold;
 text-align: center;	
 position: absolute;
 z-index: 10;
}
.haikei .menu li {
 margin: 0;
 padding: 0 20px;
}
/* フッターの挿入ここまで */

.haikei p{
 /*文字の装飾*/
 color: #333333; 
 font-size : 12px;
 font-weight: bold;
 text-align: center;

 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em;
 position: absolute; 	
 margin: auto;
 top: 10px;  
 bottom: 0; 
}  

	
/* 事業所概要の背景 */
.haikei-business {                
width: 100%; 
height: 35%;   
position: relative;  

 /* フッターの挿入ここから */
 background: #e5e5e5;
 text-align: center;
} 


.haikei-business a {
 color: #333333; 
 text-decoration: none;
}
.haikei-business a:hover {
 text-decoration: none; 
}
.haikei-business .menu {
 margin: 0;
 padding: 0;
 list-style: none;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 
 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em; 
 font-size : 12px;
 font-weight: bold;
 text-align: center;	
 position: absolute;
 z-index: 10;
}
.haikei-business .menu li {
 margin: 0;
 padding: 0 20px;
}
/* フッターの挿入ここまで */
 
.haikei-business p{
 /*文字の装飾*/
 color: #333333; 
 font-size : 12px;
 font-weight: bold;
 text-align: center;

 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em;
 position: absolute; 	
 margin: auto;
 top: 10px; 
 bottom: 0;
 }  


#footer01 p small{ /* 追加 コピーライトを下に移動 中央揃え */ 
	position: absolute;
	top: 300px;
 }
	
/* three.jsの試験  後での修正を考慮して、大きさはemでなく取敢えずpxとしておく */
/* ブラウザ画面の拡大縮小に伴って最上位の画像とthree.js搭載の画像に間に出現する隙間が大きくなったり、小さくなったりする。marginやaddingでは解決できないので保留とする */
.kv-block {
  height: 400PX; 
  position: relative;
  background-image: url("../images/bg_viz_top_3.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; /* cover containも試験した→NG */
  
  margin-left: 0%; /* -3% */ 
  margin-right: 0%; /* -3% */
  z-index: 0;
}

#canvas {
  width: 100%;
  height: 100%;
}


.bg_rgba {  /* 追加 */
    width: 85%;
    height: 90%; 
    z-index: 200;
    content: " ";
    display: flex;  
    position: absolute; 
    top: 5%; 
    left: 7.5%; 
    background-color:  rgba(0, 72, 154, 0.5); 
	
	justify-content: center;
    align-items: center;
  
} 

/* フッターの帯の幅を小さくする */	
footer {  /* footer css の本体は、最小幅 0px以上の範囲のずっと下の方にあるので注意 */
	color: #fff;
	text-align: center;
	background-color: #000;
	padding: 1.5em 0;
	margin-left: 0em; /* -1.5em */
	margin-right: 0em; /* -1.5em */

}
	

/* 画像の左に余白が生ずる事に対する対策 */
body {
    overflow-x: hidden;
}
.img_contact img {
    width: 100%; /* 100% ⇒微調整(画像の右の微小隙間を無くすため) *//* 101.4% */
    height: auto;
}
.img_contact{
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.img_access img {
    width: 100%; /* 100% ⇒微調整(画像の右の微小隙間を無くすため) *//* 101.4% */
    height: auto;
}
.img_access{
    margin-left: calc(-50vw + 50%); 
	margin-right: calc(-50vw + 50%);
    
}
	


	
	
	
}


@media screen and (min-width: 499px) { /* 480px ⇒ 499px */
/* 最小幅480px以上の指定 */

header {
	background-color: #000;
    padding: 0.0625em;
	margin-top:-0.625em;
	margin-left: 0em; /* -1.5em */
	margin-right: 0em; /* -1.5em */
	margin-bottom: 3.125em; 
}
	
	
/* パソコンで見たときは"pc"のclassがついた画像が表示される slickのみの調整*/
.pc { display: block !important; }
.sp { display: none !important; }


/* mojiのスライドへの挿入 1 */
.slider{position: relative;}
.pc .comment1 {           
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:0.8%;
   margin-left:3%;text-align:center;color:#696969;font-size:16px; 
 }　

/* mojiのスライドへの挿入 2 */
.slider{position: relative;}  
.pc .comment11 {          
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:1.2%;
   margin-left:4.75%;text-align:center;color:#696969;font-size:16px; 
 }



#global_navi ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: none;
}

/* ハンバーガーメニュー ボタン */
.menu-btn {
   top: 88px; 
}

/* ハンバーガーメニュー */
.menu-content {
   top: 88px;   
}


/* お知らせ iframe +レシポンシブル */
.frame{
width:100%;
padding-top:50%;
}

.news h4{
 text-align: center; 
}

.about h4{
 text-align: left;
 margin-top: -90px;
 margin-bottom: 0px;
 margin-left: 2%;	
}
.about p{
 text-align: left;
}
	
/* 業務情報 */
/* .aboutplus{
margin-top: 0px;
margin-bottom: 0px;
padding-top: 0px;
} */

/* 業務情報 */
.aboutplus{
position: relative;
padding-top: 16px;
}

.aboutplus h4{
text-align: left;
position: absolute; left: 2%;
margin-top: 0px; /* 10px */
margin-bottom: 10px; /* 0px */
}	
	
	
/* アクセス */
/* グーグルマップ・レスポンシブレイアウト */
.creditUnit {
  margin: 0px; 
  padding: 20px;
}

.box {
  display:flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  border: solid 0.0625em #cccccc; 
  padding: 0.625em; 
}

.text {
  text-align: left;
  padding:1.25em; 
}

.text ul li {
  font-family: "Hiragino Kaku Gothic ProN";
}

h3 {
  font-size: 1em;
  margin: 0;
}

.gmap-wrap{
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 40%;  
}

.gmap-wrap iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; 
}


	
	
.haikei .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
} 	

.haikei-business .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
}

	
/* タブ中のボタン 見本１ 見本２ 共用 */	
.btn{
 width:30%; 
 line-height:30px;  
}	
.btn a{
    font-size:1em; 
}
	

	
/* サービスの背景 */	
.haikei {                        
width: 100%; 
height: 35%;    
position: relative;  

 /* フッターの挿入ここから */
 background: #e5e5e5;
 text-align: center;
} 

.haikei a {
 color: #333333; 
 text-decoration: none;
}
.haikei a:hover {
 text-decoration: none; 
}
.haikei .menu {
 margin: 0;
 padding: 0;
 list-style: none;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 
 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em; 
 font-size : 16px; 
 font-weight: bold;
 text-align: center;	
 position: absolute;
 z-index: 10;
}
.haikei .menu li {
 margin: 0;
 padding: 10px 20px; 
}
/* フッターの挿入ここまで */

	
.haikei p{
 /*文字の装飾*/
 color: #333333; 
 font-size : 16px;
 font-weight: bold;
 text-align: center;

 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em;
 position: absolute; 	
 margin: auto;
 top: 20px;   
 bottom: 0; 
 }  

	
/* 事業所概要の背景 */
.haikei-business {                
width: 100%; 
height: 35%;   
position: relative;
background: #e5e5e5;
text-align: center;
} 

.haikei-business a {
 color: #333333;
 text-decoration: none;
}
.haikei-business a:hover {
 text-decoration: none; 
}
.haikei-business .menu {
 margin: 0;
 padding: 0;
 list-style: none;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 
 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em; 
 font-size : 16px; 
 font-weight: bold;
 text-align: center;	
 position: absolute;
 z-index: 10;
}
.haikei-business .menu li {
 margin: 0;
 padding: 10px 20px; 
}
/* フッターの挿入ここまで */

	
.haikei-business p{
 /*文字の装飾*/
 color: #333333;
 font-size : 16px;
 font-weight: bold;
 text-align: center;

 width: 100%; /*absoluteで位置を設定するときに、幅と高さは必ず必要*/
 height: 1.5em;
 position: absolute; 	
 margin: auto;
 top: 20px; 
 bottom: 0;
 }  


.background-service{
 width: 100%;
 height: 0;
 padding-top: 20%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% *//* 120% */
 background-image: url("../images/bg.jpg") ;
 background-position:  50% 0%; /* 50% 100% */ 	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%;/* 300% */ /* 10% */ /* 6.5% */
 } 	
	

	
/* 以下の画像のデータは、タブレット[600x800],[768x1024]のものとなる */	
.background-business{
 width: 100%;
 height: 0;
 padding-top: 20%; /* calc(画像高さ543 ÷ 画像横幅1222 × 100%) 正式な値は44.435% */ /* 35% */
 background-image: url("../images/bg_viz_top.jpg") ;
 background-position: 50% 0%; /* 50% 20% */	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%;/* 300% */ /* 20% */ 
 } 	
	
	
.haikei .bg { 
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 background-image: url("../images/bg-bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%; /* 300% */ /* スマホのハンバガーボタン・立体の位置が変わる */ /* 20% */ /* 6.5% */

 opacity: 0.5; /*透過の設定*/
 }  	
	
.haikei-business .bg {
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 background-image: url("../images/bg_viz_bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: contain;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%; /* -3% */
 padding-right: 0%; /*300%*//* 20% */ 	

 opacity: 0.5; /*透過の設定*/	
}	
	
	
	
	
	
	
	
	
	
	
	
	
/* three.jsの試験  後での修正を考慮して、大きさはemでなく取敢えずpxとしておく */
/* ブラウザ画面の拡大縮小に伴って最上位の画像とthree.js搭載の画像に間に出現する隙間が大きくなったり、小さくなったりする。marginやaddingでは解決できないので保留とする */
/*.kv-block {
  height: 400PX; 
  position: relative;
  background-image: url("../images/bg_viz_top_3.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; /* cover containも試験した→NG */
  
  /*margin-left: 0%; /* -3% */ 
  /*margin-right: 0%; /* -3% */
  /*z-index: 0;
}

#canvas {
  width: 100%;
  height: 100%;
}


.bg_rgba {  /* 追加 */
    /*width: 85%; 
    height: 90%; 
    z-index: 200;
    content: " ";
    display: flex;  
    position: absolute; 
    top: 5%; 
    left: 7.5%; 
    background-color:  rgba(0, 72, 154, 0.5); 
	
	justify-content: center;
    align-items: center;
  
}	*/

	
	
	
	
	
	
	
	
	
	
}




@media screen and (min-width: 780px) {     /*ブレイクポイント768px　⇒　780px */
/* 最小幅768px以上の指定 */
#global_navi ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
 }

/* mojiのスライドへの挿入 1 */
.pc .comment1 {           
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:0.8%;
   margin-left:3%;text-align:center;color:#696969;font-size:24px;  
 }

/* mojiのスライドへの挿入 2 */
.pc .comment11 {          
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:1.2%;
   margin-left:4.8%;text-align:center;color:#696969;font-size:24px; 
 }

.slider{position: relative;}
.slick-content .comment2{
  position: absolute;
  top: 20%;left: 28.1%;  
 -ms-transform: translate(-50%,-50%);
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%);  
 z-index: 150;
 color: #696969;
 text-decoration: none;
 font-size: 24px;
 }

.slider{position: relative;}
.slick-content .comment22{
  position: absolute;
  top: 40%;left: 28.1%; 
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 150;
  color: #696969;
  text-decoration: none;
  font-size: 24px;   
 }

.slider{position: relative;}
.slick-content .comment3{
  position: absolute;
  top: 20%;left: 39.1%;  
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);  
  z-index: 150;
  color: #222222;
  text-decoration: none;
  font-size: 24px;
 }
	
.slider{position: relative;}
.slick-content .comment33{
  position: absolute;
  top: 35%;left: 39.1%;  
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 150;
  color: #222222;
  text-decoration: none;
  font-size: 24px;
 }
	
.slider{position: relative;}
.slick-content .comment4{
  position: absolute;
  top: 20%;left: 50%;  
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);  
  z-index: 150;
  color: #dddddd;
  text-decoration: none;
  font-size: 24px;
 }
	
.slider{position: relative;}
.slick-content .comment44{
  position: absolute;
  top: 40%;left: 50%;  
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 150;
  color: #dddddd;
  text-decoration: none;
  font-size: 24px;
 }

	
/* お知らせ iframe +レシポンシブル */
.frame{
 width:80%;
 padding-top:15%;
 }

.news h4{
 text-align: left;
 position: absolute; left: 11%;
 }

	
/* 当方の説明・紹介・ご挨拶等 */
.about h4{
 text-align: left;
 position: absolute; left: 11%;
 }
.about p{
 text-align: left;
 position: absolute; left: 11%;
 margin-top: -60px;
 margin-bottom: 0px;
 }

	
/* 業務情報 */
.aboutplus{
 margin-top: 120px;
 margin-bottom: 0px;
 padding-top: 50px;
 }

.haikei .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 } 	

.haikei-business .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 }
	
.haikei p{
 top: 2.5em;  
 bottom: 0; 
 }  

.haikei .menu li {
 margin: 0;
 padding: 50px 20px; 
 }	

.haikei-business p{
 top: 2.5em; /* 0 *//* 40px */
 bottom: 0;
 }  	
	
.haikei-business .menu li {
 margin: 0;
 padding: 50px 20px; /* 0 20px */
 }

	
.bg_rgba {  
    width: 60%; 
    height: 90%; 
    z-index: 200;
    content: " ";
    display: flex;  
    position: absolute; 
    top: 5%; 
    left: 20%;
    background-color:  rgba(0, 72, 154, 0.5);
	
	justify-content: center;
    align-items: center;
  }	
	

	
/* 以下の画像のデータはスマホ[横画面]のものして使われる *//* 全てcoverを使用⇒coverを使用しないと、画像の両端に隙間ができる */	
.background-service{
 width: 100%;
 height: 0;
 padding-top: 50%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% *//* 120% */
 background-image: url("../images/bg.jpg") ;
 background-position:  50% 100%; 	
 background-size: cover;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%;/* 300% */ /* 10% */ /* 6.5% */  
 } 	
	
	
.background-business{
 width: 100%;
 height: 0;
 padding-top: 100%; /* calc(画像高さ543 ÷ 画像横幅1222 × 100%) 正式な値は44.435% */ /* 35% */
 background-image: url("../images/bg_viz_top.jpg") ;
 background-position: 50% 100%; /* 50% 20% */	
 background-size: cover;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%;/* 300% */ /* 20% */ 
 } 	
	
	
.haikei .bg { 
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 background-image: url("../images/bg-bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: cover;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%;/* -3% */ 
 padding-right: 0%; /* 300% */ /* スマホのハンバガーボタン・立体の位置が変わる */ /* 20% */ /* 6.5% */

 opacity: 0.5; /*透過の設定*/
 }  	
	
.haikei-business .bg {
 width: 100%;        /*位置の設定*/
 height: 100%;
 position: absolute; /* .bgの親要素 .haikei に配置規則を適用しないのでウインドウ全体の左上が基準位置となる */
 top: 0; /* 上からの位置　1619px(224%)で　背景画像・フッター上端一致⇒ */ /*⇒ topを取り除く方法で縦方向の隙間を解決 */
 left: 0;
	
 width: 100%;
 height: 0;
 padding-top: 35%; /* calc(画像高さ585 ÷ 画像横幅1222 × 100%) 正式な値は47.872% */
 background-image: url("../images/bg_viz_bottom.jpg") ;
 background-position: 50% 100%;	
 background-size: cover;
 background-repeat: no-repeat;
 overflow: hidden;
 background-attachment: fixed;
 margin-left: 0%; /* -3% */
 padding-right: 0%; /*300%*//* 20% */ 	

 opacity: 0.5; /*透過の設定*/	
}

	

	
	
	

	
	
	
	
	
	
}



@media screen and (min-width: 1200px) {  /*ブレイクポイント1024px　⇒　1200px */   
/* 最小幅1024px以上の指定 */

/* mojiのスライドへの挿入 1 */
.pc .comment1 {           
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:0.8%;
   margin-left:4.3%;text-align:center;color:#696969;font-size:24px;
 } 
	
/* mojiのスライドへの挿入 2 */
.pc .comment11 {          
   position: absolute;max-width:100%;max-height:100%;z-index:150;margin-top:1.2%;
   margin-left:5.2%;text-align:center;color:#696969;font-size:24px;
 }

.haikei .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 } 	

.haikei-business .copyright {
 margin: 0;
 padding: 25% 0 0 0; 
 }

	
.haikei p{
 top: 4.6875em;  
 bottom: 0; 
 }  
	
.haikei-business p{
 top: 4.6875em; 
 bottom: 0;
 }
	


	
	
	
	
	
	
	
	
	
	
	
	
	

}



@media screen and (min-width: 1350px) {
/* 最小幅 1350px以上の指定(フッターのみに使用) */
.haikei .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 } 	

.haikei-business .copyright {
 margin: 0;
 padding: 25% 0 0 0;  
 }
	
.haikei p{
 top: 6.25em; 
 bottom: 0;
 }
	
.haikei-business p{
 top: 6.25em; 
 bottom: 0;
 }

	
	
}