@charset "UTF-8";

@media screen and (min-width:768px) {
	html {
		overflow-y: scroll;
		font-size: 100%;
	}
	
	body {
		min-width:1200px;
		color: #333;
		font-family:"Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
		font-size: 0.95rem;
		line-height: 1.8;
		letter-spacing:0.05rem;
		-webkit-text-size-adjust: 100%;
		word-wrap: break-word;
		overflow-x:hidden;
	}
	
	a {
	}
	
	/*header*/
	
	header {
		width:100%;
		height: 160px;
		background-color: #fff;
		background-image: url(../img/header/bg_.gif);
		background-position: top center;
		background-repeat: no-repeat;
	}
	#header_inner {
		position: relative;
		width: 1200px;
		height: 114px;
		margin: 0 auto;
		padding: 0 20px;
	}
	#header_inner img {
		display: block;
		position: absolute;
		top: 50%;
		left: 20px;
		transform: translateY(-50%);
	}
	#header_inner  #sitetitle {
		position: absolute;
		top: 50%;
		left: 205px;
		transform: translateY(-50%);
		font-size: 2.2rem;
		color: #ff9933;
		font-weight: normal;
	}
	#header_inner #sitetitle span {
		font-size: 1.5rem;
	}
	#header_inner p {
		position: absolute;
		top: 50%;
		left: 590px;
		transform: translateY(-50%);
	}
	nav {
		position: absolute;
		width: 100%;
		height: 46px;
		background: #f93;
	}
	nav.fixed{
		position: fixed;
		top: 0;
		z-index:10000;
	}
	nav ul {
		width: 1200px;
		height: 46px;
		margin: 0 auto;
		padding: 0 40px;
	}
	nav ul li {
		display: inline-block;
		margin: 9px 20px 0 0;
	}
	nav ul li a {
		color: #fff;
		text-decoration: none;
	}
	
	div#container {
		width: 1200px;
		height: auto;
		margin: 50px auto 0;
		padding: 0 20px;
	}
	
	/*main*/
	
	main {
		float: left;
		width: 760px;
	}
	
	/*side*/
	
	div#right {
		float: left;
		width: 332px;
		margin-left: 68px;
	}
	
	div#right img#entry_banner {
		width: 332px;
		height: 327px;
	}
	
	div#right aside ul {
		margin-top: 30px;
	}
	
	div#right aside ul li{
		margin-top: 30px;
	}
	
	div#right aside ul li:first-child {
		margin-top: 0;
	}
	
	/*footer*/
	
	footer {
		margin: 80px 0 0;
		width: 100%;
		border-top: 10px solid #f93;
	}
	
	#footer_inner {
		position: relative;
		width: 1200px;
		height: 200px;
		margin: 0 auto;
		padding: 0 20px;
	}
	
	#footer_inner img {
		display: block;
		position: absolute;
		top: 50%;
		left: 50px;
		transform: translateY(-50%);
	}
	
	#footer_inner dl {
		display: block;
		position: absolute;
		top: 50%;
		left: 230px;
		transform: translateY(-50%);
	}
	
	#footer_inner small {
		display: block;
		position: absolute;
		top: 50%;
		right: 50px;
		transform: translateY(-50%);
	}
	
}

@media screen and (max-width:767px) {
	html {
		overflow-y: scroll;
		font-size: 62.5%;
	}
	
	body {
		color: #333;
		font-family:"Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
		font-size: 1.4rem;
		line-height: 1.8;
		-webkit-text-size-adjust: 100%;
		word-wrap: break-word;
	}
	
	a {
	}
	
	header {
		width:100%;
		height: 110px;
		background-color: #fff;
		background: url(../img/header/bg_sp_.gif) no-repeat center right;
		background-size: auto 100%;
		border-bottom: 1px solid #fb7;
	}
	
	#header_inner {
		position: relative;
		width:100%;
		height: 110px;
		margin: 0 auto;
		padding: 0 20px;
	}
	
	#header_inner img {
		display: block;
		width: 25%;
		height: auto;
		position: absolute;
		top: 10px;
		left: 10px;
	}
	
	#header_inner #sitetitle {
		position: absolute;
		top: 55px;
		left: 15px;
		transform: translateY(-50%);
		font-size: 2.0rem;
		color: #f93;
		text-shadow: 2px 2px 3px #fff;
		font-weight: bold;
	}
	
	#header_inner #sitetitle span {
		font-size: 1.5rem;
	}
	
	#header_inner p {
		position: absolute;
		width: 55%;
		top: 70px;
		left: 15px;
		font-size: 0.95rem;
	}
	
	header nav ul {
		height: 100%;
		padding: 6.5em 1em 1em;
		background: url("../img/nav_bg.gif") top center no-repeat;
		background-size: 100% auto;
	}
	
	header nav ul li {
		font-size: 1.4em;
		font-weight: bold;
		padding: 0;
		margin: 1em auto 0 1em;
	}
	
	header nav ul li a {
		color: #333;
		text-decoration: none;
	}
	
	/*container*/
	
	div#container {
		width: 100%;
		height: auto;
		background-color: #F5F5F5;
		padding: 30px 0;
	}
	
	/*main*/
	
	main {
		width: 100%;
	}
	
	/*side*/
	
	div#right {
		width: 100%;
		margin-top: 20px;
		padding: 30px 0;
	}
	
	div#right img#entry_banner {
		display: block;
		width: 90%;
		margin: 0 auto;
	}
	
	div#right aside ul {
		width: 90%;
		margin: 30px auto 0;
	}
	
	div#right aside ul li{
		margin-top: 30px;
	}
	
	div#right aside ul li:first-child {
		margin-top: 0;
	}
	
	div#right aside ul li img{
		width: 100%;
	}
	
	/*footer*/
	
	footer {
		width: 100%;
	}
	
	#footer_inner {
		padding: 30px;
		text-align: center;
	}
	
	#footer_inner img {
		display: block;
		margin: 0 auto;
	}
	
	#footer_inner dl {
		margin: 20px auto 0;
	}
	
	#footer_inner dl dd{
		font-size: 0.8em;
	}
	
	#footer_inner small {
		display: block;
		margin: 20px auto 0;
	}
	
	/*ハンバーガーメニューとお仕事詳細のエントリーボタンの共通スタイル*/
	
	button.job_entry {
		background:#f93;
		border-width:2px;
		border-style: solid;
		position:relative;
		margin:1em;
		display:inline-block;
		padding:1em;
		transition:all 0.3s ease-in-out;
		text-align:center;
		font-weight:bold;
		font-size: 1.7rem;
		color:#fff;
		border-color:#f93;
	}
	
	button.drawer-hamburger {
		background-color: rgba(255,255,255,0.75);
		margin:1em;
		padding-left: 1.5em;
		padding-right: 1.5em;
	}
	
	button.job_entry:before, button.job_entry:after ,button.drawer-hamburger:before, button.drawer-hamburger:after {
		content:'';
		display:block;
		position:absolute;
		box-sizing:border-box;
		border-style:solid;
		width:1em;
		height:1em;
		transition:all 0.3s ease-in-out;
		border-color:#f93;
	}
	
	button.job_entry:before ,button.drawer-hamburger:before {
		top:-6px;
		left:-6px;
		border-width:2px 0 0 2px;
		z-index:5;
	}
	
	button.job_entry:after ,button.drawer-hamburger:after {
		bottom:-6px;
		right:-6px;
		border-width:0 2px 2px 0;
	}
	
	img.middle {
		display: block;
		width: 90%;
		height: auto;
		border: 6px solid #ccc;
		margin: 40px auto 0;
	}
}
/*border: 1px solid #333;*/