*{
	font-family: "メイリオ" , Meiryo ,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro" , "ＭＳ Ｐゴシック" , Osaka ,sans-serif;
}
html{
	font-size:16px;text-align:center;
}@media screen and ( max-width:768px ){
     html{
	font-size:10px;text-align:center;
}}
body{
	background-color: #ffffff;color:#ffffff;
}

/*▼headerline*/
.headerline{
	margin-top:50px;position:fixed;width:100%;height:70px;display:table;text-align:center;background:rgba(255,255,255,0.8);z-index:10;
}
.headerline > *{
	display:table-cell;vertical-align:middle;
}
/*▲headerline*/

/*▼header*/
 #bg{
	width:100%;
}
.bg1{
	width:100%;z-index:initial;
}
.header{
	width:80%;margin: 0 auto 0 auto;height:100%;position:relative;z-index:initial;
}.header::after{content:" ";clear:both;}
.h_title{
	position:absolute;top:45%;width:100%;text-align:center;font-size:1.8rem;text-shadow:4px 4px 10px rgba(0,0,0,0.8),4px 4px 10px rgba(0,0,0,0.8),4px -4px 10px rgba(0,0,0,0.8),-4px -4px 10px rgba(0,0,0,0.8);
}
.h_title span{
	font-size:2rem;
}

@media screen and ( max-width:768px ){
   .h_title{
	position:absolute;top:55%;width:100%;text-align:center;font-size:1.5rem;
	
}}@media screen and ( max-width:600px ){
   .h_title{
	position:absolute;top:55%;width:100%;text-align:center;font-size:1.5rem;
}}
   

.nav{
	position:absolute;bottom:5%;width:100%;
}
.nav ul{
	margin:0 auto 0 auto;width:100%;max-width:1000px;list-style-type:none;
}
.nav li{
	width:13.8%;float:left;padding:0.2%;
}
.nav li a{
	display:block;padding:20px 0;border:1px solid #ffffff;background-color:rgba(195,195,195,0.3);text-align:center;font-size:0.8rem;text-decoration:none;color:#ffffff;text-shadow:2px 2px 5px #000000,2px 2px 5px #000000,2px -2px 5px #000000,-2px -2px 5px #000000;
}
.nav li:first-child a{
	background-color:rgba(220,50,0,0.5);
}
.nav li a:hover{
	background-color:rgba(51,51,0,0.5);color:#ffffff;text-shadow:2px 2px 5px #000000,2px 2px 5px #000000,2px -2px 5px #000000,-2px -2px 5px #000000;
}

      /*--------IE11---------
.nav ul{margin:0 auto 0 auto;width:100%;max-width:1000px;list-style-type:none;
        display:flex;flex-direction:row;justify-content:space-between;
        display:-webkit-flex;-webkit-direction:row;-webkit-justify-content:space-between;}
.nav li{margin:0.2em;flex-grow:1;-webkit-flex-grow:1;}
      -----------------------*/
/*▲header*/


/*-------------▼title---------------*/

.title{
	margin: 1rem auto 0 auto;width:80%;text-align:center;
}
.title p{
	top:1rem;color:#ffffff;font-size:2rem;border-bottom:1.5px solid #ffffff;
}
.title span{
	top:1rem;font-size:1.5rem;
}

@media screen and ( max-width:768px ){
    .title{
	margin: 1rem auto 0 auto;width:100%;height:80px;text-align:center;
}
    .title p{
	margin:0 auto 0 auto;width:90%;color:#ffffff;font-size:2rem;
}
    .title span{
	font-size:1rem;
	
}}

/*-------------▲title----------------*/


/*▼c3 department*/

.c3{
	position:relative;margin: 1rem auto 0 auto;width:80%;max-width:1000px;height:250px;
}

.c3::after{content:" ";clear:both;}
.col1{
	width:33%;height:250px;float:left;
  
}
.col2{
	width:34%;height:250px;float:left;
 
}
.col3{
	width:33%;height:250px;float:left;
 
}
.col1 a{
	display:block;height:250px;background : url(../images/top_cell_a.png)   ;width:100%;background-size: 100% 100%; 
}
.col2 a{
	display:block;height:250px;background : url(../images/top_cre_a.png) ;width:100%;background-size: 100% 100%; 
}
.col3 a{
	display:block;height:250px;background-image : url(../images/top_com_a.png)  ;width:100%;background-size: 100% 100%;  
}
.col1 a:hover{
	display:block;height:250px;background : url(../images/top_cell_b.png)  ;width:100%;background-size: 100% 100%;  
}
.col2 a:hover{
	display:block;height:250px;background : url(../images/top_cre_b.png) ;width:100%;background-size: 100% 100%;  
}
.col3 a:hover{
	display:block;height:250px;background : url(../images/top_com_b.png) ;width:100%;background-size: 100% 100%;  
}

@media screen and ( max-width:768px ){
   .c3{
	position:relative;margin: 0.5rem auto 0 auto;width:80%;height:330px;
}
.col1{
	margin:1rem auto 0 auto;width:100%;height:100px;float:none;padding:0;
}
.col2{
	margin:1rem auto 0 auto;width:100%;height:100px;float:none;padding:0;
  }
.col3{
	margin:1rem auto 0 auto;width:100%;height:100px;float:none;padding:0;

	
}
 
.col1 a{
	display:block;width:100%;height:100px;background : url(../images/tops_cell_a.png)   ;background-size: 100% 100%;
}
.col2 a{
	display:block;width:100%;height:100px;background : url(../images/tops_cre_a.png) ;background-size: 100% 100%;
}
.col3 a{
	display:block;width:100%;height:100px;background : url(../images/tops_com_a.png) ;background-size: 100% 100%; 
}
.col1 a:hover{
	display:block;width:100%;height:100px;background : url(../images/tops_cell_b.png)  ;background-size: 100% 100%;
}
.col2 a:hover{
	display:block;width:100%;height:100px;background : url(../images/tops_cre_b.png) ;background-size: 100% 100%;
}
.col3 a:hover{
	display:block;width:100%;height:100px;background : url(../images/tops_com_b.png) ;background-size: 100% 100%;
	
}
 
 
 }



/*▲c3 department*/




/*▼soil*/
.soil{
	position:relative;margin:1rem auto 0 auto;padding:0;width:80%;max-width:800px;height:250px;
}
.soil a{
	display:block;width:100%;height:100%;background : url(../images/soil.jpg) 100% 100% ;
}
.soil a:hover{
	display:block;width:100%;height:100%;background : url(../images/soil_m.jpg) 100% 100% ;
}

@media screen and ( max-width:768px ){
.soil{
	position:relative;margin:1rem auto 0 auto;padding:0;width:80%;max-width:800px;height:100px;
}
.soil a{
	display:block;width:100%;height:100%;background : url(../images/soil.jpg) 100% 100% ;
}
.soil a:hover{
	display:block;width:100%;height:100%;background : url(../images/soil_m.jpg) 100% 100% ;
}
}

/*▲soil*/

/*▼news*/
.headlinenews{
	position:relative;margin:1rem auto 0 auto;padding:0;width:80%;max-width:800px;list-style-type:none;
}
.headlinenews li a{
	margin-bottom:0.5rem;line-height:1.5rem;display:block;padding:1rem 2rem;border:1px solid #ffffff;background-color:rgba(195,195,195,0.5);text-align:left;font-size:1rem;text-decoration:none;color:#000000;text-shadow:2px 2px 5px #c3c3c3,2px 2px 5px #c3c3c3,2px -2px 5px #c3c3c3,-2px -2px 5px #c3c3c3;
}
/*.headlinenews li:last-child a{
	border-bottom:1px solid #000000;
}*/
.headlinenews li a:hover{
	border: 2px solid rgba(0,0,0,0.5);
}
.headlinenews li a span{
	border-bottom:1px solid rgba(0,0,0,0.5);color:rgba(0, 0, 255,0.9);
}

@media screen and ( max-width:768px ){
   .headlinenews{
        margin-top:1rem;width:80%;
}
   /*.headlinenews li a{
	font-size: 1rem;margin-top:1rem;height:10rem;text-indent:-1rem;padding:2rem;line-height:1.5em;display:block;border:1px solid #000000;background-color:rgba(195,195,195,0.6);text-align:left;text-decoration:none;color:#000000;text-shadow:1px 1px 2.5px #c3c3c3,1px 1px 2px #c3c3c3,1px -1px 2px #c3c3c3,-2px -2px 2px #c3c3c3;
}*/

}
/*▲news*/


.inf{
	padding:1rem;position:relative;margin:1rem auto 0 auto;width:80%;min-height:100px;max-width:800px;list-style-type:none;background:rgba(0,0,0,0.2);
}
.inf p{
	text-align:center;width:100%;padding:0;color:#ffffff;line-height:1.5rem;
}
.inf a{
	text-align:center;width:100%;padding:0;color:#ffffff;line-height:1.5rem;text-decoration: none;display: block;
}
.inf a:hover{
	color: rgba(255,255,255,0.5);
}

/*▼nudermenu */
.undermenu{
	position:relative;margin:0 auto 0 auto;width:80%;max-width:1000px;height:200px;
}

.undermenu ul{width:25%;float:left;}
.undermenu h1{color:#ffffff;text-align:left;text-indent:3rem;font-size:1rem;}
.undermenu ul{margin:1rem 0 1rem 0;}
.undermenu li{display:block;text-align:left;text-indent:4.5rem;margin-top:0.2rem;font-size:1rem;}
.undermenu li a{display:block;text-decoration:none;font-size:0.8rem;color:rgb(255,255,255);}
.undermenu li a:hover{display:block;color:rgba(120,120,120,0.8);}
.undermenu ul::after{content:" ";clear:both;}
@media screen and ( max-width:800px ){
   .undermenu{
	display:none;
}}




/*▼footer*/
.footer{
	position:relative;margin:10px auto 0 auto;width:80%;max-width:1000px;border:1px solid #ffffff;height:7rem;
}
.footer section{
	width:50%;color:#ffffff;float:left;
}.footer::after{content:" ";clear:both;}
.footer h1{
	margin-top:10px;font-size:1em;letter-spacing:0.3em;text-align:center;
}
.footer p{
	font-size:0.9em;letter-spacing:0em;
}


@media screen and ( max-width:768px ){
   .footer{
	height:15rem;display:block;
}
   .footer h1{
	font-size:1rem;letter-spacing:0.1rem;
}
   .footer p{
	font-size:1rem;letter-spacing:0.1rem;
}
   .footer section{
	width:100%;color:#ffffff;float:none;
}}
/*▲footer*/

/*▼footer for IE11
.footer{border-top:1px solid #000000;margin:10px auto 0 auto;width:80%;height:120px;max-width:1000px;display:-webkit-flex;justify-content: center;-webkit-justify-content:center;display:-webkit-box;-webkit-box-pack: justify;display:-ms-flexbox;-ms-flexbox-pack:jastify;display:flexbox;display:flex;}
.footer section{padding:10px;color:#000000;flex-grow: 1;-webkit-flex-grow:1;-webkit-box-flex-grow: 1;}
.footer h1{margin-top:10px;font-size:1em;letter-spacing:0.3em;}
.footer p{font-size:0.9em;letter-spacing:0em}

   @media screen and ( max-width:800px ){
   .footer{height:90px;}
   .footer h1{font-size:0.8em;letter-spacing:0.1em;}
   .footer p{font-size:0.5em;letter-spacing:0.1em;}
   }
   @media screen and ( max-width:600px ){
   .footer{height:200px;display:block;}
   .footer h1{font-size:0.8em;letter-spacing:0.1em;}
   .footer p{font-size:0.8em;letter-spacing:0.1em;}
   }
▲footer for IE11*/

/*▼copyright*/
.copyright{
	width:100%;margin-top:1.5rem;position:relative;
}
.copyright p{
	color:#ffffff;font-size:0.8rem;padding:1.5rem;background:rgba(0,0,0,0.8);
}
/*▲copyright*/

/*▼gotop*/
#page-top{
	position: fixed;bottom: 20px;right: 10px;font-size: 1em;z-index:1;
}
#page-top a{
	background:rgba(0,0,0,0.5);text-decoration: none;color:#ffffff;width: 80px;padding:1.5em 0;text-align: center;display: block;
}
#page-top a:hover{
	text-decoration: none;background: rgba(0,0,0,0.2);
}@media screen and ( max-width:600px ){
   #page-top{
	position: fixed;bottom: 20px;right: 10px;font-size: 1em;z-index:1;
}
   #page-top a{
	background:rgba(0,0,0,0.5);text-decoration: none;color:#ffffff;text-align: center;display: block;width:24px;padding:10px 10px;border-radius:50%;
}
   #page-top a:hover{
	text-decoration: none;background: rgba(0,0,0,0.2);
}}
/*▲gotop*/