@charset "utf-8";

/*--- @group Reset ブラウザCSSリセット --*/
*{ margin: 0;padding: 0}
a { text-decoration : none}
ul, ol { list-style : none}
img { vertical-align : middle}
/*--------- @end ---------*/

/*--- @group HTML ベースフォント　--- */
html {
font-family : Oosaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif ;
font-size : 75%;
line-height : 1.7142;
color: #111111 ;}
/*--------- @end ---------*/

/*--- @group Fluid-img フルードイメージ---*/
img { width : auto;
	max-width : 100%;
    object-fit: cover; }
/*--------- @end ---------*/

/*--- @group Reset リンク設定 --*/
a[href]:hover { color: #ffcc00 }
a { outline: none; }
/*--------- @end ---------*/

/*--- @group リンク時画像半透明 ---*/
a img { border: none ;}
a:hover img{ opacity:0.5 ;
	filter: alpha(opacity=50) ;
	-ms-filter: "alpha( opacity=50 )" ;
	background-color : #fff;} 
/*--------- @end ---------*/


/* --------------@group　位置揃えと回り込み　------------------------------ */
.center { text-align:center ; }
.left { text-align:left ; }
.right { text-align:right ; }

.floatcenter { display:block ;
	margin:0.5em auto 0.5em ; }
.floatleft { float:left ; }
.floatright { float:right ; }

img.fl-left { margin:0.5em auto ;
	display: block ;}
img.fl-right { margin:0.5em auto ;
	display: block ;}

table.floatleft { margin-top:1em ;
	margin-right:1em ;
	margin-bottom:1em ;}
table.floatright { margin-top:1em ;
	margin-left:1em ;
	margin-bottom:1em ;}


.photo-1columnfull { width: 100% ;
	margin: 0.5em auto ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-1column { width: 70% ;
	margin: 0.5em auto ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-2column { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-3column { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-4column { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-5column { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-6column { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-float-l,
.photo-float-r { width: 50% ;
	margin: 0.5em auto ;
	text-align: center ;
	font-size: 0.95em ;}

.photo-2column-float-l { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-3column-float-l { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-4column-float-l { width: 48% ;
	margin: 0.5em 1% ;
	float: left ;
	text-align: center ;
	font-size: 0.95em ;}

.photo-2column-float-r { width: 48% ;
	margin: 0.5em 1% ;
	float: right ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-3column-float-r { width: 48% ;
	margin: 0.5em 1% ;
	float: right ;
	text-align: center ;
	font-size: 0.95em ;}
.photo-4column-float-r { width: 48% ;
	margin: 0.5em 1% ;
	float: right;
	text-align: center ;
	font-size: 0.95em ;}

.photo-1column img,
.photo-2column img,
.photo-3column img,
.photo-4column img,
.photo-5column img,
.photo-6column img,
.photo-float-l img,
.photo-float-r img,
.photo-2column-float-l img,
.photo-3column-float-l img,
.photo-4column-float-l img,
.photo-2column-float-r img,
.photo-3column-float-r img,
.photo-4column-float-r img
{ margin: 0 auto ;
	display: block ;}


.clearboth { clear:both ; }
/*--------- @end ---------*/


/*--- @group Heading  見出し ---*/

h1 { font-size: 1.5em ; 
  position: relative;
  padding: 0 ;
  border-bottom: 3px solid #00a384;
  color: #00a384;
  margin: 0 0 1em ;
}

h1:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 25%;
  height: 3px;
  content: '';
  background: #cccccc;
}

h2 {
  width: 80%;
  position: relative;
  margin: 1em auto;
  padding: 0.3em 0 0.3em ;
  font-size: 1.6em;
  text-align: center ;
  color: #ffffff;
  background-color: #5fbaa5 ;
  border-radius: 10px ;
  clear: both ;
}


h3 {
  width: 100%;
  position: relative;
  margin: 1em 0;
  padding: 0.3em 0 0.3em ;
  text-indent: 1em ;
  font-size: 1.3em;
  color: #ffffff;
  background-color: #00a384 ;
  border-radius: 9999px ;
  clear: both ;
}

h3.headline {  width: 97%;
  margin: 0;
  border-radius: 10px 10px 0 0 ;
}

h3.align-center {  text-align: center ;
}

h3.headline-title { width: 90% ;
	margin: 0 auto 0.5em ;
    text-indent: 0 ;
	text-align: center ;
	line-height: 2em ;
    font-size: 1.7em;
	font-weight:bold ;
	text-shadow: 2px 2px 2px #fff ;
	color: #666;
	border-radius: 20px ;
	background: linear-gradient(to top, #76c4b2, #d1ebe5) ;
}

h4 { font-size: 1.25em;
  position: relative;
  color: #00a384 ;
  border-bottom: 2px solid #76c4b2;
  margin: 1em 0 ;
  clear: both ;
}
h4:before {
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 30%;
  height: 4px;
  content: '';
  background: #fee081;
}


h5{	margin: 1em 0 ;
	padding: 0.25em 0 0.1em 0.5em;
	font-size: 1.2em;
	background: -moz-linear-gradient(bottom, #f76c4b2, #fff);
	background: -webkit-linear-gradient(bottom, #76c4b2, #fff);
	background: linear-gradient(to top, #76c4b2, #fff);
	border-bottom: 1px solid #00a384 ;
}

h6 { margin: 1em 0 ;
	padding: 0.25em 0 0.1em;
	font-size: 1.1em;
	border-bottom: 1px dashed #00a384 ;
}

h6.beta { margin: 0.25em 0 ;
	border-bottom: none ;
}

h6.headline-date { width: 80% ;
 	margin: 0 auto 0.5em ;
	text-align: center ;
	line-height: 2em ;
 	font-size: 1em ;
}

/*--------- @end  Heading  見出し---------*/



/*--- @group テーブル設定 ---*/
table { border-collapse: collapse;
	margin:0.5em 0 2em;
	width: 100% ;
	clear:both ;
	}
th { color:#00a384 ;
	line-height:120% ;
	padding:0.5em 0.5em 0.4em ;
	text-align:center ;
	border:1px #00a384 solid;
	background-color: #ccede6 ;
	vertical-align:middle; }
td { padding:0.5em 0.5em;
	border:1px #00a384 solid;
	line-height:130% ;
	vertical-align:middle; }
th.hleft {	text-align:left ;
	color: #ffffff ;
	background-color: #76c4b2 ;
    }

table.border-bottom { border-collapse:separate ; }
table.border-bottom th { border:none ;
	background-color: #ffffff ;
	border-bottom:2px #00a384 solid ; }
table.border-bottom td { border:none ;
	border-bottom:1px #666666 dotted ;}

table.alternate{
  border-collapse:separate;
	width: 75% ;
	margin:0 auto;
	background: #ffffff;
}
table.alternate th{
	border: 0;
  color:#fff;
  background:#76c4b2;
}
table.alternate td{border: 0;
	text-align:center ;
  background: #ffffff;
}
/*--------- @end ---------*/


/*--- @group 全体字下げ ---*/
.pad-l-1 { padding-left: 1em ;}
.pad-l-2 { padding-left: 2em ;}
.pad-l-3 { padding-left: 3em ;}
.pad-l-4 { padding-left: 4em ;}
/*--------- @end ---------*/


/*--- @group リストのインデント設定 ---*/
ul.list-1 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:1em ;
	text-indent:-1em ;}
ul.list-2 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:2em ;
	text-indent:-2em ;}
ul.list-3 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:3em ;
	text-indent:-3em ;}
ul.list-4 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:4em ;
	text-indent:-4em ;}
ul.list-circle li { list-style-position:inside;
 	padding-left:0.75em ;
	text-indent:-0.75em ;}
ul.list-circle li:before {
    content:  "";
    width:  0.75em;
    height:  0.75em;
	padding-top: -2px;
    display:  inline-block;
    background-color: #ff9900; 
    border-radius:  50%; 
}

ul.indent-1 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:1em ;}
ul.indent-2 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:2em ;}
ul.indent-3 li { list-style-position:inside ;
	list-style:none ;
 	padding-left:3em ;}
/*--------- @end ---------*/



/*--- @group カラー設定 ---*/
.color-base01	{ color: #00a384 ;}

.color-red	{ color: #c50000 ;}
/*--------- @end ---------*/


/*---- @group container コンテナ ---*/
body {
/* フッターを最下部に固定する */
	display: flex;
	flex-direction: column;
	min-height: 100vh;
/* フッターを最下部に固定する */
}

#body-inner {  width : 100%;
	margin : 0 auto ;
	overflow: hidden ;
/* フッターを最下部に固定する */
	display: flex;
	flex-direction: column;
	min-height: 100vh;
/* フッターを最下部に固定する */
}


/*---- header ---*/
header { margin: 0.25em auto 0.5em;
	padding: 0;
	width: 90%;
}

header #head01-logo { margin: 0.5em auto ;
	width: 60% ;
}
header a img {
	margin: 0 auto;
	display: block;
}

header #head02-link { display: none ;}
header #head02-link a {
 color: #666666 ;}
header #head02-link a:hover { color: #ffcc00 }

/*---- id="header-navi"は「slicknav-add-style.css」にスタイル記述---*/
/*---- header END ---*/

#contents { width : 90%;
	margin : 0 auto;
	background-color:#ffffff;
	overflow: hidden ;
	clear:both ;
}

/*--- @group Footer　フッター ---*/
footer { width: 100% ;
	clear:both ;
	text-align:center ;
/* フッターを最下部に固定する */
	margin-top: auto;
/* フッターを最下部に固定する */
	padding-top: 2em ;
}

footer #footer-link a {
	width: 80% ;
	display: block ;
	background-color: #d1ebe5 ;
	margin: 0.5em auto ;
	padding: 0.35em 0 ;
	border-radius: 9999px ;
}

footer #footer-inner01 { width: 90% ;
	margin: 0 auto ;
	overflow: hidden ;
}
footer a#page-top { display: block ;
	width: 80px ;
	padding: 0.25em 0.25em 0.5em 0 ;
	font-size: 75% ;
	line-height: 1.25em ;
	color: #00a384 ;
	float: right ;}
footer a#page-top:hover { color: #ffcc00 }

footer #footer-inner02 { width: 100% ;
	margin: 0 auto ;
	padding: 0.1em 0  ;
	overflow: hidden ;
}

footer #footer-title { color: #00a384 ;
    font-weight: bold ;
	width: 100% ;
	margin: 0 auto ;
	padding: 0.5em 0  ;
	overflow: hidden ;
	border-top: 5px solid #00a384 ; 
}

/*--- @group Footer　フッターEND ---*/


/*--- @group コンテナ左と右 ---*/
#container-l { width: 100% ;
	margin: 0 auto 1.5em ;
	overflow: hidden ;
}

#container-r { width: 100% ;
	overflow: hidden ;
}
/*--- @group コンテナ左と右 END ---*/


/*--- @group 写真や画像を入れるbox ---*/
.img-float-l,
.img-float-r { width: 75% ;
	margin: 0.5em auto ;
	text-align: center ;
	font-size: 0.95em ;}
.img-float-l img,
.img-float-r img { margin: 0 auto ;
	display: block ;}
/*--- @group 写真を入れるbox END ---*/

/*---- @group container コンテナ END ---*/



/*--------- @topのみ使用 ---------*/
/*--------- @スライダーのarea ---------*/
#main-image { width: 100% ;	
	clear: both;
	position: relative;
	margin: 0 auto 4em ;
}

#headline-area { width: 95.5% ;
	border: 1px solid #00a384 ;
	margin: 0 ;
	padding: 0.75em ;
}


#banner-area { width: 50% ;
	margin: 0 auto ;
	}
#banner-area a img { margin: 0 auto 1.75em ;
	display: block ;
	filter: drop-shadow(2px 2px 2px #666666);
	}

/*--------- @topのみ使用 ---------*/


/*--------- @日新火災労働組合についてで使用 ---------*/
.contents-box-text { width: 100% ;
	margin: 0 auto ;	
}
.contents-box-image { width: 75% ;
	margin: 0 auto ;
}
.contents-box-image img { margin: 0 auto ;
	display: block ;}
/*--------- @日新火災労働組合についてで使用 END---------*/


/*--------- @役員ページで使用 ---------*/

.yakuin-box { width: 46% ;
	margin: 0 2% 1em 2% ;
	float: left ;
	text-align: center ;
	line-height: 1.25em ;
}

.yakuin-box h6 { margin: 0.25em 0 0.75em ;
	padding: 0.5em 0;
	border-top: 1px dashed #00a384 ;
	height: 2.5em ;
	display: grid;
	place-items: center center;
}

.yakuin-box img { margin: 0 auto 0.25em ;
	display: block ;}

/*--------- @役員ページで使用 ---------*/

/*--------- @ヘッドライン個別ページで使用 ---------*/

.headline-lead { width: 90% ;
    position: relative;
	margin: 1em auto 1em ;
	color: #00a384;
	font-weight:bold ;
}

.image-row {
    display: flex;
    justify-content: center; /* 中央揃え */
    gap: 10px; /* 画像間の隙間 */
}



/*--------- @ヘッドライン個別ページで使用 ---------*/

/*---------------------------------------------------------*/
/*--------------------- 768px -----------------------------*/
@media screen and (min-width : 768px){

/*--- @group HTML ベースフォント　--- */
html {font-size : 87.5%;}
/*--------- @end ---------*/	


/*--- @group Heading  見出し ---*/

h3.headline {  width: 80%;
}
/*--------- @end ---------*/

img.fl-left { margin:0.5em 0.5em ;
	float: left ;}
img.fl-right { margin:0.5em 0.5em ;
	float:right;}

	
/*---- @group container コンテナ ---*/
/*---- header ---*/
header { width: 90%;
}
header #head01-logo { float: left ;
		width: 45% ;
}
header a img {
	margin: 0 ; }
/*---- header END ---*/

#contents { width : 90%;
}

/*--- @group Footer　フッター ---*/
footer #footer-inner01 { width: 80% ;
}

footer #footer-link {width: 80% ;
	margin: 0 auto ;}
	
footer #footer-link a {
	width: 32% ;
	float: left ;
	margin-right: 1% ;
}
/*--- @group Footer　フッターEND ---*/

/*--- @group 写真のボックス-正しい ---*/

.photo-3column { width: 31% ;}
.photo-4column { width: 23% ;}
.photo-5column { width: 18% ;}
.photo-6column { width: 15% ;
	margin: 0.5em 0.8% ;}
.photo-float-l { width: 31% ;
	margin: 0.5em 1% ;
	float: left ;}
.photo-float-r { width: 31% ;
	margin: 0.5em 2% ;
	float: right;}


.photo-2column-float-l { width: auto ;}
.photo-3column-float-l { width: auto ;}
.photo-4column-float-l { width: auto ;}

.photo-2column-float-r { width: auto ;}
.photo-3column-float-r { width: auto ;}
.photo-4column-float-r { width: auto ;}

/*--- @group 写真のボックス-正しい ---*/
	
	
/*--- @group 写真や画像を入れるbox ---*/
.img-float-l { width:50% ;
	float: left ;}
.img-float-r { width:50% ;
	float: right ;}
.img-float-l img,
.img-float-r img { margin: 0 auto ;
	display: block ;}
/*--- @group 写真を入れるbox END ---*/


/*---- @group container コンテナ END ---*/


/*--------- @日新火災労働組合についてで使用 ---------*/
.contents-box-text { width: 53% ;
	margin: 0 2% 0 0 ;
	float: left ;
}
.contents-box-image { width: 43% ;
	margin: 0 0 0 2% ;
	float: right ;
}
/*--------- @日新火災労働組合についてで使用 END---------*/

	
/*----------------------- 768px@end ------------------------------*/
}
/*----------------------- 768px@end ------------------------------*/






/*---------------------------------------------------------*/
/*--------------------- 1024px -----------------------------*/
@media screen and (min-width : 1024px) {

/*--- @group HTML ベースフォント　--- */
html {font-size : 100%;}
/*--------- @end ---------*/

/*---- @group container コンテナ ---*/
/*---- header ---*/
header { width: 1100px ;
}
header #head01-logo { width: 341px ;
}

header #head02-link { display :inherit ;
	text-align: right;
	width: 700px ;
	float: right ;
	padding: 15px 0 0 0 ; 
	}
/*---- header END ---*/


#contents { width : 1100px;
}
/*--- @group Footer　フッター ---*/
footer #footer-inner01 { width: 1100px ;
}

footer #footer-link {
	display: none ;
}
/*--- @group Footer　フッターEND ---*/
#container-l { width: 760px ;
	float: left ;
}

#container-r { width: 300px ;
	float: right;
}

/*---- @group container コンテナ END ---*/

/*--------- @topのみ使用 ---------*/
#banner-area { width: 100% ;
	}
/*--------- @topのみ使用 ---------*/

/*--------- @日新火災労働組合についてで使用 ---------*/
.contents-box-text { width: 730px ;
	margin: 0 ;
}
.contents-box-image { width: 350px ;
	margin: 0 ;
}
/*--------- @日新火災労働組合についてで使用 END---------*/

	
	
/*--------- @役員ページで使用 ---------*/
.yakuin-box { width: 21% ;
	margin: 0 2% 1em 2% ;
}
/*--------- @役員ページで使用 ---------*/

	
/*----------------------- 1024ppx@end ------------------------------*/
}
/*----------------------- 1024ppx@end ------------------------------*/