@charset "Shift_JIS";

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

/* header */
#header {
	display: block;
	position: relative;
	width: 100%;
	height: 44px;
	margin: 0 auto 0;
	border-bottom: #d8d8d8 1px solid;
	}
	#ci {
		display: block;
		position: absolute;
		top: 9px;
		left: 8px;
		width: 188px;
		height: 27px;
		background: url(../images/ci.gif) no-repeat 0 0 / 188px auto;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		}
	#hnav-container {
		display: none;
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		height: calc(100vh - 45px);
		background-color: rgba(255,255,255,1.00);
		overflow-y: auto;
		}
	#hnav-container.open {
		display: block;
		z-index: 20000;
		}
	#hnav {
		display: block;
		position: relative;
		top: auto;
		left: auto;
		width: 80%;
		height: auto;
		margin: 0 auto;
		}
		#hnav ul {
			display: block;
			width: 100%;
			}
			#hnav ul li {
				display: block;
				float: none;
				opacity: 0;
				transition: .35s ease-out all;
				transform: translateY(-24px) scale(1.1);
				border-bottom: 1px solid #b2b2b2;
				}
			#hnav-container.open #hnav ul li {
				opacity: 1;
				transform: translateY(0) scale(1);
				}
			#hnav #nav-top			{ transition-delay: 300ms; }
			#hnav #nav-message		{ transition-delay: 350ms; }
			#hnav #nav-company		{ transition-delay: 400ms; }
			#hnav #nav-gijutsu		{ transition-delay: 450ms; }
			#hnav #nav-chiiki		{ transition-delay: 500ms; }
			#hnav #nav-field		{ transition-delay: 550ms; }
			#hnav #nav-recruitinfo	{ transition-delay: 600ms; border-bottom: none; }
	
				#hnav ul li a,
				#hnav dt,
				#hnav dd a{
					display: block;
					width: 100%;
					height: auto;
					background: none;
					text-indent: 0;
					white-space: normal;
					overflow: hidden;
					padding: 1em 0 .8em;
					text-align: center;
					color: #0072bb;
					font-size: 16px;
					}
				#hnav ul li a:not([href]) {
					pointer-events: none;
					cursor: auto;
					color: #DDD;
					}
	
				#hnav #nav-top a::before,
				#hnav #nav-message a::before,
				#hnav #nav-gijutsu a::before,
				#hnav #nav-chiiki a::before,
				#hnav #nav-field a::before,
				#hnav #nav-person a::before
				/*#hnav #nav-recruitinfo a::before*/{
					position: absolute;
					top: 7px;
					right: 8px;
					bottom: 0;
					margin: auto;
					content: "";
					vertical-align: middle;
					width: 6px;
					height: 6px;
					border-top: 1px solid #0072BB;
					border-right: 1px solid #0072BB;
					-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
				}
	
				#nav-company .pc{display: none;}
				#nav-company dl{
					display: block;
					margin-bottom: 0;
				}
	
				#hnav #nav-company a{
						padding: 1em 0 .8em;
					}
				#nav-company dt {
						position: relative;
						cursor: pointer;
						font-weight: normal;
					}
				#nav-company dd {
						position: relative;
						display: none;
						margin-left: 0;
						border-top: 1px dashed #b2b2b2;
						background-color: #EEE;
					}
					#hnav #nav-company dl dd a::before{
						position: absolute;
						top: 7px;
						right: 8px;
						bottom: 0;
						margin: auto;
						content: "";
						vertical-align: middle;
						width: 6px;
						height: 6px;
						border-top: 1px solid #0072BB;
						border-right: 1px solid #0072BB;
						-webkit-transform: rotate(45deg);
						transform: rotate(45deg);
					}
				#nav-company dd:last-child {
						border-bottom: 1px solid #b2b2b2;
					}
	
					.accordion_icon,
					.accordion_icon span {
						display: inline-block;
						transition: all .4s;
						box-sizing: border-box;
					}
					.accordion_icon {
						position: absolute;
						width: 20px;
						height: 20px;
						top:20px;
						right: 2px;
					}
					.accordion_icon span {
						position: absolute;
						left: 6px;
						width: 50%;
						height: 1px;
						background-color: #0072BB;
						border-radius: 4px;
						-webkit-border-radius: 4px;
						-ms-border-radius: 4px;
						-moz-border-radius: 4px;
						-o-border-radius: 4px;
					}
					.accordion_icon span:nth-of-type(1) {
						top: 5px;
						transform: rotate(0deg);
						-webkit-transform: rotate(0deg);
						-moz-transform: rotate(0deg);
						-ms-transform: rotate(0deg);
						-o-transform: rotate(0deg);
					}
					.accordion_icon span:nth-of-type(2) {
						top: 5px;
						transform: rotate(90deg);
						-webkit-transform: rotate(90deg);
						-moz-transform: rotate(90deg);
						-ms-transform: rotate(90deg);
						-o-transform: rotate(90deg);
					}
					/*�{�A�|�؂�ւ�*/
					.accordion_icon.active span:nth-of-type(1) {
						display:none;
					}
					.accordion_icon.active span:nth-of-type(2) {
						top: 5px;
						transform: rotate(180deg);
						-webkit-transform: rotate(180deg);
						-moz-transform: rotate(180deg);
						-ms-transform: rotate(180deg);
						-o-transform: rotate(180deg);
					}


				#hnav ul li#nav-top 			{ width: 100%; }
				#hnav ul li#nav-message 		{ width: 100%; }
				#hnav ul li#nav-company 		{ width: 100%; }
				#hnav ul li#nav-gijutsu 		{ width: 100%; }
				#hnav ul li#nav-chiiki 			{ width: 100%; }
				#hnav ul li#nav-field 			{ width: 100%; }
				#hnav ul li#nav-person 			{ width: 100%; }
				#hnav ul li#nav-recruitinfo 	{ width: 100%; }


	#hnav-sub {
		display: block;
		position: relative;
		top: auto;
		left: auto;
		width: 80%;
		height: auto;
		margin: 0 auto;
		}
		#hnav-sub ul {
			display: block;
			text-align: left;
			}
			#hnav-sub ul li {
				display: inline-block;
				width: 100% !important;
				padding: 0;
				border-right: none;
				margin-top: 10px;
				}
			#hnav-sub ul li:first-of-type {
				padding-left: 0;
				}
			#hnav-sub ul li:last-of-type {
				padding-right: 0;
				border-right: none;
				}
				#hnav-sub ul li a {
					display: block;
					height: auto;
					background: none;
					text-indent: 0;
					white-space: normal;
					overflow: hidden;
					
					background-color: #0072bb;
					border-radius: 5px;
					padding: 1em 0 .8em;
					text-align: center;
					color: #FFF;
					font-size: 16px;
					font-weight: bold;
					}
				#hnav-sub ul li a:not([href]) {
					pointer-events: none;
					cursor: auto;
					background-color: #EEE;
					}
	
	
	#hnav-sp-bth {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 45px;
		height: 45px;
		background-color: #0072bb;
		}
		#hnav-sp-bth span {
			display: inline-block;
			position: absolute;
			box-sizing: border-box;
			left: 9px;
			width: 27px;
			height: 2px;
			background-color: #fff;
			transition: all .4s;
			}
			#hnav-sp-bth span:nth-of-type(1) {
				top: 12px;
				}
			#hnav-sp-bth span:nth-of-type(2) {
				top: 21px;
				}
			#hnav-sp-bth span:nth-of-type(3) {
				bottom: 13px;
				}

		#hnav-sp-bth.on span:nth-of-type(1) {
			-webkit-transform: translateY(9px) rotate(-45deg);
			transform: translateY(9px) rotate(-45deg);
			}
		#hnav-sp-bth.on span:nth-of-type(2) {
			opacity: 0;
			}
		#hnav-sp-bth.on span:nth-of-type(3) {
			-webkit-transform: translateY(-9px) rotate(45deg);
			transform: translateY(-9px) rotate(45deg);
			}
	
#footer {
	clear: both;
	width: 100%;
	background: url(../images/footer-bg.jpg) repeat-x left top / auto 80px;
	}
	#footer .inner {
		box-sizing: border-box;
		width: 100%;
		height: auto;
		margin: 0 auto;
		padding-top: .7em;
		padding-bottom: .6em;
		}
		#footer small {
			display: block;
			float: none;
			width: 100%;
			margin-bottom: .5em;
			color: #333;
			text-align: center !important;
			font-family: Georgia, "Times New Roman", Times, "serif";
			font-size: 8px;
			letter-spacing: 0;
			}
		#footer p {
			float: none;
			color: #333;
			text-align: center !important;
			font-size: 8px;
			}
	
	#main {}

		#main .inner950c {
			width: 100%;
			margin: 0 auto;
			}
		#main .inner1000c {
			width: 100%;
			margin: 0 auto;
			}
	
	.topicpass {
		display: block;
		width: 100%;
		margin: 0 auto 10px;
		padding: 0;
		}
		.topicpass li {
			display: inline-block;
			margin-right: 2px;
			color: #666666;
			font-size: 10px;
			}
		.topicpass li::after {
			display: inline-block;
			margin-left: 6px;
			content: ">"
			}
		.topicpass li:last-of-type::after {
			display: none;
			}
			.topicpass li a {
				color: #666666;
				}

}