/* CSS Document */

#wrap{}
	#wrap #main{}
		#wrap #main .section{}
			#wrap #main .recruit h2{ text-align:center;
			margin:0 0 30px;}
			#wrap #main .recruit dl{ text-align:center;
			margin:0 0 50px;}
			#wrap #main .recruit dt{ font-size:14px;
			color:#09284f;
			margin:0 0 20px;}
			#wrap #main .recruit dd{}
			#wrap #main .recruit ul.menu{ width:882px;
			margin:0 auto 57px;}
			#wrap #main .recruit .menu li{ float:left;
			position:relative;}
			#wrap #main .recruit .menu li.l0{ margin-right:24px;}
				#wrap #main .recruit .menu li span{ position:absolute;
				width:187px;
				left:225px;
				top:50px;}
			#wrap #main .recruit .button{ text-align:center;
			margin:0 0 200px;}


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

				p,dt,dd,span,small,th,td,address{
					font-size: 200%!important;
				}

				address{
					text-align: center;
					margin: 10px auto;
				}

				#cont,#contwrap,.menu,.about{
					width: 100%!important;
				}

				.section,.menu ul .ph,.box,.ph{
					width: 100%;
					margin: 0 auto!important;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				.diva{
					width: 90%!important;
					margin: 20px auto!important;
					padding: 0 0 20px 0!important;
					height: auto!important;
					float: none!important;
				}

				.diva p{
					text-align: center;

				}

				.box h2,.section h2,.contact h2{
					width: 70%!important;
					margin: 30px auto!important;
				}
				.box h2 img,.section h2 img{
					width: 100%!important;
				}

				.contact{
					width: 100%!important;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				.contact h2{
					text-align: center;
				}
				.contact h2 img{
					width: 50%;
					margin: 0 auto;
				}

				.contact h2 span{
					top:100px!important;
					left:0!important;
				}


				.contact .clearfix,.contact .clearfix li {
					width: 90%;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				.contact .clearfix{
					padding: 20px!important;
					height: 400px!important;
				}

				.contact .clearfix li {
					position: relative;
					top:50px;
				}

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

				.contact .clearfix li img,.mail a img{
					width: 70%!important;
					margin: 0 auto;
				}

				.ph img{
					width: 100%;
				}

				.box .diva{
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
				}

				.box .diva dl{
					width: 90%!important;
					margin: 0 auto;
					text-align: center;
				}

				.box .diva .ph img{
					width: 95%!important;
					margin: 0 auto;
				}

				.recruit{
					width: 100%!important;
				}

				#foot .inner{
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				#foot .inner .l{
					width: 100%!important;

				}

				#foot .inner .l tr{
					width: 90%!important;
					margin: 0 auto;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					flex-wrap: wrap!important;

				}

				#foot .inner .l tr td{
					width: 30%;
					height: 50px;
				}


				#foot .inner .l table{
					width: 90%!important;
					margin: 0 auto!important;
					padding: 10px!important;
				}

				#foot .inner .l td{
					padding: 10px!important ;
					font-size: 70%;
				}


				#foot .inner dl{
					width: 90%!important;
					padding: 10px!important;
					margin: 10px auto;
				}

				#foot .inner dl dt img{
					width: 40%!important;
				}

				.pagetop a img{
					width: 40%;
				}

				.section dl{
					width: 100%!important;
				}

				.section dd{
					width: 90%!important;
					margin: 0 auto;
				}

				.map,.map .clearfix{
					width: 100%;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				#gmap{
					width: 90%!important;
					height: 400px!important;
					margin: 0 auto!important;
				}

				.txt {
					width: 100%!important;
				}
				.txt dl{
					width: 90%!important;
					margin: 0 auto!important;
					float: none!important;

				}

				.txt dl dt{
					width: 70%!important;
				}

				.txt dl dt dd{
					width: 70%!important;
					margin: 0 auto;
				}

				.txt dl dt img{
					width: 50%;
				}


				.recruit h2 img{
					width: 50%!important;
				}

				.recruit .diva{
					width: 100%!important;
					display: -webkit-flex;
					display: -ms-flex;
					display: flex!important;
					-webkit-flex-direction: column;
					-ms-flex-direction: column;
					flex-direction: column;
					-ms-align-items: center;
					align-items: center;
				}

				.recruit .diva a {
					width: 100%!important;
				}

						.recruit .diva a img{
							width: 100%;
							margin: 20px auto;
						}

							.recruit ul li span{
								width: 100%!important;
								left:15px!important;
								top:95%!important;
							}

							.button{
								width: 100%;
							}

							.button a img{
								width: 70%;
								margin: 0 auto;
							}



			}