@charset "utf-8";
@import url(base.css);



	#imagewrapper{
		max-width:1200px;
		width:100%;
		margin:0 auto 50px;
		position:relative;
		overflow:hidden;
	}
		
@media screen and (max-width:1200px){

	#imagewrapper{
		margin-bottom:0;
	}
		
}
		
@media screen and (max-width:640px){

	#imagewrapper{overflow:hidden;}

	#imagewrapper li{
	}
		
}
	

	#main{
		padding-top:0;
		position:relative;
	}
		
@media screen and (max-width:1000px){

	#main{
	}
		
}
		
@media screen and (max-width:480px){

	#main{
	}
		
}

	
		#imagemain{
			width:100%;
		}
		
			#imagemain img{
				width:100%;
			}



		#brakenews{
			padding:30px 0 50px;
			color:#100c57;
			background-color:#f2f2f2;
			z-index:100;
		}
		
	@media screen and (max-width:1000px){

		#brakenews{
			margin:0;
		}
		
	}

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

		#brakenews{
			padding:10px 0 30px;
		}
		
	}

		#brakenews .inner{
			max-width:1000px;
			width:90%;
			margin:10px auto 0;
		}
		
		



			#brakenews h3{
				margin-bottom:10px;
			}
			
			#brakenews h3:before{
				content:url(../shared/ico_info.png);
				position:relative;
				margin-right:15px;
				top:5px;
			}

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

			#brakenews h3{
				margin:9px 10px 0;
				font-size:0.9em;
			}
			
			#brakenews h3:before{
				margin-right:10px;
				top:5px;
			}
		}

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

			#brakenews h3{
			}

		}

		#brakenews li{
			padding:15px 5px;
			list-style:none;
			border-bottom:1px dashed #ccc;
		}
		#brakenews li:nth-of-type(1){
			border-top:1px dashed #ccc;
		}







/* オンライン御用聞き */
	
	#mainnote{
		clear:both;
		max-width:1000px;
		width:100%;
		margin:0 auto;
		padding-bottom:30px;
	}
	
@media screen and (max-width:1000px){
	
	#mainnote{
		width:90%;
	}
	
}
	
	
	@media screen and (max-width:1100px){
		
		#mainnote ul{
			margin-right:5%;
		}
	
	}
	
	@media screen and (max-width:1000px){
		
		#mainnote ul{
			margin-right:0;
		}
	
	}
	
			#mainnote li{
				list-style:none;
			}
	
			#mainnote li{zoom:1;}
			#mainnote li:after{
			  content: ""; 
			  display: block; 
			  clear: both;
			}
		
			#mainnote li:nth-of-type(2){
				clear:both;
				/*margin-bottom:-340px;*/
				position:relative;
				top:-40px;
			}
		
		@media screen and (max-width:900px){
		
			#mainnote li:nth-of-type(2){
				margin-bottom:0;
				top:0;
			}
		
		}
			
				#mainnote li .noteimgwrapper{
					display:block;
					max-width:350px;
					width:35%;
					margin-right:10px; 
					float:left;
				}
				#mainnote li .noteimgwrapper img{
					width:100%;
				}

				#mainnote li:nth-of-type(2) .noteimgwrapper{
					height:430px;
				}
	
			@media screen and (max-width:1100px){

				#mainnote li:nth-of-type(2) .noteimgwrapper{
					height:400px;
				}
	
			}
	
			@media screen and (max-width:1000px){

				#mainnote li:nth-of-type(2) .noteimgwrapper{
					height:350px;
				}
	
			}
	
			@media screen and (max-width:900px){
		
				#mainnote li .noteimgwrapper{
					width:240px;
					margin:0 auto; 
					float:none;
				}
		
				#mainnote li:nth-of-type(2) .noteimgwrapper{
					max-width:none;
					width:400px;
					height:240px;
					margin:0 auto; 
					float:none;
					overflow:hidden;
				}
				
				#mainnote li .noteimgwrapper img{
					display:block;
					width:240px;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#mainnote li .noteimgwrapper{
					width:200px;
				}
		
				#mainnote li:nth-of-type(2) .noteimgwrapper{
					width:320px;
					height:200px;
				}
				
				#mainnote li .noteimgwrapper img{
					width:200px;
				}
	
			}
	
			@media screen and (max-width:420px){
		
				#mainnote li .noteimgwrapper{
					width:160px;
				}
		
				#mainnote li:nth-of-type(2) .noteimgwrapper{
					width:270px;
					height:160px;
				}
				
				#mainnote li .noteimgwrapper img{
					width:160px;
				}
	
			}
			
				#mainnote li .note{
					max-width:540px;
					width:54%;
					padding:57px 0 0 30px;
					background-image:url(../images/img_circle.png);
					background-repeat:no-repeat;
					float:left;
				}
	
			@media screen and (max-width:1000px){
			
				#mainnote li .note{
					padding:34px 0 0 30px;
					background-size:100px auto;
				}
	
			}
	
			@media screen and (max-width:900px){
		
				#mainnote li .note{
					max-width:640px;
					width:90%;
					margin:0 auto 30px;
					padding:34px 0 0;
					float:none;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#mainnote li .note{
					margin:0 auto;
					padding-top:0;
					background-image:none;
				}
	
			}
			
				#btn_goyoukiki{
					max-width:361px;
					width:36%;
					float:right;
					position:relative;
					top:120px;
				}
		
			@media screen and (max-width:900px){
			
				#btn_goyoukiki{
					display:block;
					width:300px;
					margin:0 auto;
					float:none;
					top:0;
				}
		
			}
		
			@media screen and (max-width:640px){
			
				#btn_goyoukiki{
					width:240px;
				}
		
			}

	
				#mainnote li h4{
					color:#c30;
					font-size:1.9em;
					font-family:"kozuka-mincho-pro";
				}
		
				#mainnote li p{
					margin-top:25px;
					font-size:1.2em;
					font-family:"kozuka-mincho-pro";
					line-height:2.0em;
				}
	
			@media screen and (max-width:1100px){
	
				#mainnote li h4{
					font-size:1.8em;
				}
		
				#mainnote li p{
					margin-top:20px;
					font-size:1.0em;
					line-height:1.9em;
				}
	
			}
	
			@media screen and (max-width:640px){
	
				#mainnote li h4{
					margin:30px 0 20px;
					line-height:1.4em;
					text-align:center;
				}
		
				#mainnote li p{
					margin-top:10px;
				}
	
			}
	
			@media screen and (max-width:370px){
	
				#mainnote li h4{
					font-size:1.6em;
				}
	
			}




/* セクション共通 */
	
		.stdsec header{
			width:calc(200px - 2%);
			padding:0 0 25px 2%;
			float:left;
		}

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

		.stdsec header{
			width:calc(170px - 2%);
		}
		
	}

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

		.stdsec header{
			width:96%;
			padding:0 0 5px 2%;
			float:none;
		}
		
	}
		
	@media screen and (max-width:480px){

		.stdsec header{
			width:90%;
			padding:0 0 0 5%;
		}
		
	}

			.stdsec header p{
				margin:0;
				padding:35px 0 0;
				color:#c00;
				font-size:2.3em;
				font-weight:700;
				line-height:1.2em;
			}
		
		@media screen and (max-width:720px){

			.stdsec header p{
				padding:20px 0 0;
				font-size:1.8em;
			}

			.stdsec header p br{display:none;}
			.stdsec header h2 br{display:none;}
		
		}
		
		@media screen and (max-width:480px){

			.stdsec header p{
				font-size:1.6em;
			}
		
		}

			.stdsec header h2{
				margin:0;
				padding:7px 0 0;
				color:#030;
				font-size:1.2em;
				font-weight:700;
				line-height:1.4em;
			}
		
		@media screen and (max-width:480px){

			.stdsec header h2{
				font-size:1.0em;
			}
		
		}
		
		
			.stdsec .secnote{
				width:95%;
				margin:0 0 40px;
				padding-top:40px;
				color:#000;
				font-size:1.1em;
				font-family: "kozuka-mincho-pro";
			}

		@media screen and (max-width:720px){
		
			.stdsec .secnote{
				width:100%;
				padding-top:20px;
				font-size:1.0em;
			}
		
		}






/*  */







/* メニュー */

		#topmenu{
			width:100%;
			height:340px;
		}

			#topmenu h2{
				display:block;
				width:240px;
				margin:0 auto -240px;
				position:relative;
				top:60px;
			}
			#topmenu h2 img{width:100%;}
	
			#topmenu li{
				width:calc(100% / 3);
				height:340px;
				list-style:none;
				float:left;
				background-repeat:no-repeat;
				background-position:50% 0;
				background-size:auto 100%;
			}
			#topmenu li:nth-of-type(1){background-image:url(../images/img_menu1.jpg);}
			#topmenu li:nth-of-type(2){background-image:url(../images/img_menu2.jpg);}
			#topmenu li:nth-of-type(3){background-image:url(../images/img_menu3.jpg);}
			
			
	@media screen and (max-width:1200px){

		#topmenu{
			height:300px;
		}

			#topmenu h2{
				width:220px;
				margin:0 auto -220px;
				top:50px;
			}
	
			#topmenu li{
				height:300px;
			}

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

		#topmenu{
			height:240px;
		}

			#topmenu h2{
				width:180px;
				margin:0 auto -180px;
				top:40px;
			}
	
			#topmenu li{
				height:240px;
			}

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

		#topmenu{
			height:200px;
		}

			#topmenu h2{
				width:140px;
				margin:0 auto -140px;
				top:40px;
			}
	
			#topmenu li{
				height:200px;
			}

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

		#topmenu{
			height:160px;
		}

			#topmenu h2{
				width:100px;
				margin:0 auto -100px;
				top:40px;
			}
	
			#topmenu li{
				height:160px;
			}

	}
	
	
	

/* 会社概要 */

	#outline{
		width:50%;
		height:600px;
		background-color:#f2f2f2;
		float:left;
	}
	
@media screen and (max-width:1000px){

	#outline{
		width:100%;
		height:auto;
		float:none;
	}
	
}
	
	
		#outline .inner{
			width:80%;
			margin:0 auto;
			padding:40px 0;
		}
	
	@media screen and (max-width:1000px){

		#outline .inner{
			width:90%;
			padding:30px 0;
		}
	
	}

		
			#outline h2{
				margin-bottom:35px;
				font-family:"kozuka-mincho-pro";
				font-size:1.7em;
				text-align:center;
			}
	
		@media screen and (max-width:1000px){
	
			#outline h2{
				margin-bottom:25px;
			}
		
		}
	
			#outline li{
				padding:15px 5px 15px 0;
				border-bottom:1px dashed #b2b2b2;
				list-style:none;
				line-height:1.5em;
			}
			#outline li:nth-of-type(1){border-top:1px dashed #b2b2b2;}
	
#outline li{zoom:1;}
#outline li:after{
  content: ""; 
  display: block; 
  clear: both;
}
	
		@media screen and (max-width:1000px){
		
			#outline li{
				padding:12px 0 12px;
			}
			
		}
	

				#outline li h3{
					width:100px;
					color:#000;
					font-weight:700;
					text-align:center;
					float:left;
				}
	
			@media screen and (max-width:1000px){
		
				#outline li h3{
					width:120px;
				}
			
			}
	
			@media screen and (max-width:640px){
		
				#outline li h3{
					width:100px;
				}
			
			}
	

				#outline li p{
					width:calc(100% - 110px);
					margin:0;
					float:right;
				}
	
			@media screen and (max-width:1000px){
		
				#outline li p{
					width:calc(100% - 130px);
				}
			
			}
	
			@media screen and (max-width:1000px){
		
				#outline li p{
					width:calc(100% - 110px);
				}
			
			}

				#outline li p span{
					font-size:0.9em;
				}
	
			@media screen and (max-width:1000px){
		
				#outline li p span{
					font-size:0.8em;
				}
			
			}

/* アクセス */

	#access{
		width:50%;
		height:600px;
		float:right;
	}
	
@media screen and (max-width:1000px){

	#access{
		width:100%;
		height:400px;
		float:none;
	}
	
}
	


/* 益城の見所 */

		#midokoro{
			padding:30px 0 60px;
		}
		
	@media screen and (max-width:420px){

		#midokoro{
			padding:30px 0;
		}
		
	}
	
			
				#midokoro .inner{
					max-width:1000px;
					width:90%;
					margin:0 auto;
					padding:57px 0 0;
					background-image:url(../images/img_circle.png);
					background-repeat:no-repeat;
				}
	
			@media screen and (max-width:1100px){
			
				#midokoro .inner{
					padding:24px 0 0 30px;
					background-image:none;
				}
	
			}
	
			@media screen and (max-width:900px){
		
				#midokoro .inner{
					max-width:640px;
					width:90%;
					margin:0 auto 30px;
					padding:34px 0 0;
					float:none;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#midokoro .inner{
					margin:0 auto;
					padding-top:0;
				}
	
			}
			
	
					#midokoro h4{
						padding-left:30px;
						color:#c30;
						font-size:1.9em;
						font-family:"kozuka-mincho-pro";
					}
			
		
				@media screen and (max-width:1100px){
		
					#midokoro h4{
						padding-left:0;
						font-size:1.8em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:640px){
		
					#midokoro h4{
						line-height:1.4em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:370px){
		
					#midokoro h4{
						font-size:1.6em;
					}
		
				}

			
				#midokoro h5{
					margin:30px 0 20px;
					padding-bottom:10px;
					color:#369;
					font-weight:700;
					font-size:1.4em;
					text-align:center;
					border-bottom:1px solid #369;
				}
				#midokoro h5:nth-of-type(1){
					margin:50px 0 10px 2%;
				}
		
			@media screen and (max-width:420px){
	
				#midokoro h5,
				#midokoro h5:nth-of-type(1){
					margin:10px 0;
					font-size:1.2em;
					border-bottom:0;
				}

			}
	
					#midokoro ul{
						width:100%;
						margin:0 auto;
					}
		
				@media screen and (max-width:640px){
	
					#midokoro ul{
						width:100%;
						max-width:480px;
						margin:0 auto;
					}
		
				}

					#midokoro ul{zoom:1;}
					#midokoro ul:after{
					  content: ""; 
					  display: block; 
					  clear: both;
					}
				

	
						#midokoro li{
							width:23%;
							margin:0 1% 15px;
							padding:10px 0;
							float:left;
							list-style:none;
							border-radius:8px;
					-moz-box-shadow:0 0 0 1px #ccc inset;
					-webkit-box-shadow:0 0 0 1px #ccc inset;
					box-shadow:0 0 0 1px #ccc inset;
						}
		
				@media screen and (max-width:900px){
	
						#midokoro li{
							width:calc((100% / 3) - 2%);
						}
		
				}
		
				@media screen and (max-width:640px){
	
						#midokoro li{
							width:calc((100% / 2) - 2%);
						}
		
				}
		
				@media screen and (max-width:420px){
	
						#midokoro li{
							max-width:240px;
							width:100%;
							margin:0 auto 15px;
							float:none;
						}
		
				}
				
				
							#midokoro li .imgbox{
								display:-webkit-flex;
								display:flex;
								justify-content: center;
								-webkit-align-items:center;
								align-items:center;
								margin:5px 0 0;
								text-align:center;
						}
	
							#midokoro li img{
								width:90%;
							}
	
							#midokoro li p{
								margin:10px 1% 0;
								text-align:center;
								line-height:1.4em;
							}

/* 業務内容 */

		#service{
			padding:0 0 30px;
		}

			
			#service .inner{
				max-width:1000px;
				width:90%;
				margin:0 auto;
				padding:57px 0 0;
				background-image:url(../images/img_circle.png);
				background-repeat:no-repeat;
			}
	
		@media screen and (max-width:1100px){
		
			#service .inner{
				padding:57px 0 30px;
				background-image:none;
			}

		}

		@media screen and (max-width:1000px){
		
			#service .inner{
				/*background-size:100px auto;*/
			}

		}

		@media screen and (max-width:900px){
	
			#service .inner{
				max-width:640px;
				width:90%;
				margin:0 auto 30px;
				padding-top:34px;
				float:none;
			}
	
		}
	
		@media screen and (max-width:640px){
	
			#service .inner{
				margin:0 auto;
				padding:30px 0 15px;
			}

		}


	
				#service h2{
					margin-bottom:40px;
					padding-left:30px;
					color:#c30;
					font-size:1.9em;
					font-family:"kozuka-mincho-pro";
				}
		
	
			@media screen and (max-width:1100px){
	
				#service h2{
					margin-bottom:30px;
					padding-left:0;
					font-size:1.8em;
					text-align:center;
				}
	
			}
	
			@media screen and (max-width:640px){
	
				#service h2{
					margin-bottom:20px;
					line-height:1.4em;
				}
	
			}
	
			@media screen and (max-width:370px){
	
				#service h2{
					font-size:1.6em;
				}
	
			}

	
				#service h3{
					margin:0 0 10px;
					color:#036;
					font-size:1.4em;
					font-family:"kozuka-mincho-pro";
				}
		
	
			@media screen and (max-width:1100px){
	
				#service h3{
					font-size:1.3em;
				}
	
			}
	
			@media screen and (max-width:640px){
	
				#service h3{
					line-height:1.2em;
				}
	
			}
	
			@media screen and (max-width:370px){
	
				#service h3{
					font-size:1.0em;
				}
	
			}


				#handled{
					width:160px;
					float:left;
					
				}
				
			@media screen and (max-width:720px){

				#handled{
					width:100%;
					float:none;
					
				}
				
			}
				
					#handled ul{
						margin-left:25px;
					}
		
				@media screen and (max-width:720px){
	
					#handled ul{
					}
					
						#handled li{
							margin-right:8%;
							float:left;
							line-height:1.3em;
						}
						#handled li:nth-last-of-type(1){margin-right:0;}
	
				}
	
					ul#servicephoto{
						width:calc(100% - 190px);
						margin-top:7px;
						float:right;
					}
	
				@media screen and (max-width:720px){
					
					ul#servicephoto{
						width:100%;
						margin-top:20px;
					}
	
				}
		
						#servicephoto li{
							width:23%;
							margin:0 1%;
							list-style:none;
							float:left;
							
						}
						
						#servicephoto li img{
							width:100%;
						}


					

/* グループ企業 */

		#group{
			padding:30px 0;
			background-color:#f2f2f2;
			/*border-bottom:1px solid #ccc;*/
		}

			
				#group .inner{
					max-width:1000px;
					width:90%;
					margin:0 auto;
					padding:57px 0 0;
					background-image:url(../images/img_circle2.png);
					background-repeat:no-repeat;
				}
	
			@media screen and (max-width:1100px){
			
				#group .inner{
					padding:34px 0 0 30px;
					background-image:none;
				}
	
			}
	
			@media screen and (max-width:1000px){
			
				#group .inner{
					padding:34px 0 0 30px;
					/*background-size:100px auto;*/
				}
	
			}
	
			@media screen and (max-width:900px){
		
				#group .inner{
					max-width:640px;
					width:90%;
					margin:0 auto 30px;
					padding-top:34px;
					float:none;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#group .inner{
					margin:0 auto;
					padding-top:0;
				}
	
			}
			
	
					#group h2{
						padding-left:30px;
						color:#c30;
						font-size:1.9em;
						font-family:"kozuka-mincho-pro";
					}
			
		
				@media screen and (max-width:1100px){
		
					#group h2{
						padding-left:0;
						font-size:1.8em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:640px){
		
					#group h2{
						line-height:1.4em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:370px){
		
					#group h2{
						font-size:1.6em;
					}
		
				}


			
		
				#group p{
					max-width:540px;
					width:54%;
					margin-top:25px;
					font-size:1.2em;
					font-family:"kozuka-mincho-pro";
					line-height:2.0em;
					float:left;
				}
	
	
			@media screen and (max-width:1100px){
	
				#group p{
					max-width:700px;
					width:90%;
					margin:0 auto 30px;
					padding:20px 0 0;
					float:none;
				}
	
			}
			
		
				#group .banbox{
					width:210px;
					float:right;
					position:relative;
					left:-10%;
					text-align:center;
				}
				#group .banbox img{
					max-width:180px;
					width:100%;
					height:auto;
				}
	
			@media screen and (max-width:1100px){
	
				#group .banbox{
					margin:0 auto 10px;
					padding:0;
					float:none;
					left:0;
					text-align:center;
				}
				#group .banbox img{
					width:150px;
					height:auto;
				}
	
	
			}

		
				#group .banbox p{
					max-width:100%;
					width:100%;
					margin:0;
					font-size:0.9em;
					font-family:'kozuka-gothic-pro','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
					line-height:1.7em;
					text-align:center;
					float:none;
				}
	
	
			@media screen and (max-width:1100px){
	
				#group .banbox p{
					margin:0;
					padding:0;
				}
	
			}



	/* ウイルス感染対策 */

	#covid19{
		margin:20px 0 60px;
		background-colog:#fff;
		position:relative;
		z-index:100;
	}

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

	#covid19{
		margin:20px 0 30px;
	}

}

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

	#covid19{
		margin:10px 0 20px;
	}

}
		
		
		
		#covid19 .inner{
			max-width:calc(1000px - 10%);
			width:84%;
			padding:20px 3%;
			margin:0 auto;
			border:1px solid #c00;
			border-radius:8px;
			background-colog:#fff;
		}
		
	
	@media screen and (max-width:480px){
	
		#covid19 .inner{
			width:82%;
			padding:15px 4%;
		}
	
	}
	
	#covid19 h2{
			color:#c33;
			font-weight:700;
			position:relative;
			left:-1%;
		}
		
		#covidlist{
			margin-left:20px;
		}
		
			#covidlist li{
				margin-bottom:5px;
			}
		
		#covidphoto{
			margin-top:20px;
		}
		
			#covidphoto li{
				max-width:240px;
				width:32%;
				margin-right:2%;
				float:left;
				list-style:none;
			}
			#covidphoto li:nth-last-of-type(1){margin-right:0;}

				#covidphoto li img{
					width:100%;
				}