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


/* ----------------------------------------------------
   index setting
------------------------------------------------------- */

main h2 {
	margin: 2.5rem 0;
    font-size: 155%;
    position: relative;
    letter-spacing: 0.16em;
    line-height: 1.6em;
	text-align: center;
	color: #005AAE;
	font-weight: bold;
}


.fr3 {
	display: grid;
	grid-gap: 20px;
	grid-template-columns: repeat(auto-fit,minmax(350px,1fr));
}

@media screen and (max-width: 767px){
	.fr3 {
		grid-gap: 10px;
	}
}

/* main visual setting:
--------------------------------------------*/

#main_v img {
	width: 100%;
	height: auto;
}

/* emergency:
--------------------------------------------*/

#emergency div{
	border: 2px solid #CF413C;
	display: grid;
	grid-column-gap: 1.5rem;
	grid-template-columns: 13rem 1fr;
	align-items: center;
	padding: 1rem 1.3rem;
	margin-top: 3rem;
	margin-bottom: 2.5rem;
}

#emergency h2{
	font-size: 110%;
	margin: 0;
	color: #CF413C;
    letter-spacing: 0.1em;
}

#emergency h2::before {
	content: "";
	display: inline-block;
	width: 27px;
	height: 27px;
	background-image:url("../img/index/icon_emergency.svg");
	background-size: contain;
	vertical-align: middle;
	background-repeat: no-repeat;
	margin-right: .5rem;
}

#emergency ul li{
	margin-bottom: .5rem;
}

#emergency ul li:last-child{
	margin-bottom: 0;
}

#emergency ul li a{
	color: #CF413C;
	text-decoration: none;
	line-height: 1.7rem;
	font-size: 95%;
}

#emergency ul li a:hover
{
	text-decoration: underline;
}

#emergency ul li a:before {
    content: "";
    display: inline-block;
    margin-right: 11px;
    border-color: transparent;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    border-left-color: #CF413C;
    -webkit-transition: border-color 0.2s;
   	transition: border-color 0.2s;
}


/* news:
--------------------------------------------*/

#news {
	margin: 3rem 0;
}

#news li{
	position: relative;
	display: flex;
	flex-wrap: wrap;
}

#news li > *{
	width: 100%;
}

#news li a{
	background: #EBFAFF;
	display: block;
	padding: 2.4rem 1.1rem 1.6rem;
	text-decoration: none;
	position: relative;
	line-height: 1.7rem;
	border: 2px solid #FFF;
}

#news li a:hover{
	border: 2px solid #0D75CD;
}

#news li a:after {
    content: "";
    bottom: 8px;
    right: 8px;
    border-top: 12px solid transparent;
    border-right: 12px solid #FFBB00;
    position: absolute;
}

#news li time {
	color: #005AAE;
	font-weight: 500;
	display: block;
	margin-bottom: .3rem;
}

#news li span.category{
	position: absolute;
	right: 8px;
	top: 8px;
	display: inline-flex;
}

#news li span.txt{
	font-size: 95%;
}

#news li span:is(.category1,.category2,.category3,.category4,.category5,.category6,.category7,.category8,.category9,.category10, .category11, .category12, .category13) {
	min-width: 4rem;
	font-size: 80%;
	padding: .01rem .1rem;
	margin-left: 7px;
	text-align: center;
	background-color: #fff;
}

#news li span.category1 {border: 3px solid #B1E3C9;}/*全体*/
#news li span.category2 {border: 3px solid #FAD0F2;}/*石綿*/
#news li span.category3 {border: 3px solid #D8C9F2;}/*ぜん息*/
#news li span.category4 {border: 3px solid #a9e7fb;}/*大気*/
#news li span.category5 {border: 3px solid #FDE3A2;}/*基金*/
#news li span.category6 {border: 3px solid #dbf1a5;}/*賦課金*/
#news li span.category7 {border: 3px solid #fcd4cf;}/*推進費*/
#news li span.category8 {border: 3px solid #C5F5AE;}/*COPD*/
#news li span.category9 {border: 3px solid #ACCEFA;}/*食物アレルギー*/
#news li span.category10 {border: 3px solid #FACAA0;}/*アトピー*/
#news li span.category11 {border: 3px solid #90dfc0;}/*SIP*/
#news li span.category12 {border: 3px solid #df9094;}/*熱中症*/
#news li span.category13 {border: 3px solid #bbddb8;}/*自然共生*/

#news .lnk1 a{
	margin: 1.2rem 0 0;
}

/* works:
--------------------------------------------*/

#works {
	background: #EBFAFF;
	padding-top: .4rem;
	padding-bottom: 3rem;
}

#works li a{
	background: #fff;
	background-repeat: no-repeat;
    background-position: bottom 1rem left 1rem;
    background-size: 24%;
	display: block;
	padding: 1.5rem;
	text-decoration: none;
	min-height: 260px;
	line-height: 1.9rem;
	position: relative;
	border: 2px solid #FFF;
}

#works li a:hover{
	border: 2px solid #0D75CD;
}

#works li a:after {
    content: "";
    bottom: 8px;
    right: 8px;
    border-top: 12px solid transparent;
    border-right: 12px solid #FFBB00;
    position: absolute;
}

#works li:nth-child(1) a{background-image: url(../img/index/works09.svg);background-size: 25%;}
#works li:nth-child(2) a{background-image: url(../img/index/works10.svg);}
#works li:nth-child(3) a{background-image: url(../img/index/works01.svg);}
#works li:nth-child(4) a{background-image: url(../img/index/works02.svg);}
#works li:nth-child(5) a{background-image: url(../img/index/works03.svg);background-size: 30%;}
#works li:nth-child(6) a{background-image: url(../img/index/works04.svg);}
#works li:nth-child(7) a{background-image: url(../img/index/works05.svg);background-size: 21%;}
#works li:nth-child(8) a{background-image: url(../img/index/works06.svg);}
#works li:nth-child(9) a{background-image: url(../img/index/works07.svg);}
#works li:nth-child(10) a{background-image: url(../img/index/works08.svg); background-size: 20%;}

#works li a h3{
	background: #0D75CD;
	color: #fff;
	font-weight: 500;
	font-size: 115%;
	padding: .5rem;
	text-align: center;
	margin-bottom: 1rem;
}


@media screen and (max-width: 1170px){
	#works li a{
		min-height: 210px;
	}
}

@media screen and (max-width: 768px){
	#works li a{
		min-height: 190px;
		background-size: 14.5%;
	}
	#works li:nth-child(3) a{background-image: url(../img/index/works02.svg);background-size: 13%;}
	#works li:nth-child(4) a{background-image: url(../img/index/works03.svg);background-size: 19%;}
	#works li:nth-child(6) a{background-image: url(../img/index/works05.svg);background-size: 12%;}
	#works li:nth-child(9) a{background-image: url(../img/index/works08.svg); background-size: 11.5%;}
	#works li:nth-child(1) a{background-image: url(../img/index/works09.svg); background-size: 14.5%;}
}



@media screen and (max-width: 600px) {
	#works li a{
		background-size: 19%;
	}
	#works li:nth-child(3) a{background-image: url(../img/index/works02.svg);background-size: 18%;}
	#works li:nth-child(4) a{background-image: url(../img/index/works03.svg);background-size: 22%;}
	#works li:nth-child(6) a{background-image: url(../img/index/works05.svg);background-size: 15%;}
	#works li:nth-child(9) a{background-image: url(../img/index/works08.svg); background-size: 15%;}
	#works li:nth-child(1) a{background-image: url(../img/index/works09.svg); background-size: 18%;}
}