@charset "UTF-8";
@import url("job_m.css");

.non-display {
	display: none;
}

@media (min-width:500px){

/* 職種紹介メニュー Begin */
#jobmenu {
	height: auto;
	width: 100%;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 35px;
	margin-bottom: 0px;
	clear: both;
}

#jobmenu ul {
	height: 20px;
	width: 100%;
}

#jobmenu ul li {
	list-style-image: none;
	list-style-type: none;
	font-size: 15px;
	float: left;
	text-align: center;
	width: 25%;
}

#jobmenu ul li a {
	text-decoration: none;
	display: block;
	padding: 10px 0;
	margin-right: 5px;
	border-radius: 10px;			/* CSS3草案 */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;		/* Firefox用 */
}

#jobmenu ul li a.se {
	background-color: rgba(0,145,57,0.5);
}

#jobmenu ul li a.wd{
	background-color: rgba(243,151,0,0.5);
}

#jobmenu ul li a.ne {
	background-color: rgba(188,138,226,0.5);
}

#jobmenu ul li a.pg {
	background-color: rgba(195,13,34,0.5);
}

/* 職種紹介メニュー End */

/* -- 枠内の設定 Begin -- */

.job_title h2{
	position: relative;
	padding: 15px;
	margin: 0 0 20px;
	color: #fff;
	transform: rotate(-3deg) skew(-3deg);
	-webkit-transform: rotate(-3deg) skew(-3deg);
	-moz-transform: rotate(-3deg) skew(-3deg);
	-o-transform: rotate(-3deg) skew(-3deg);
	-ms-transform: rotate(-3deg) skew(-3deg);
}

.return_top {
	display: block;
	height: 50px;
	width: 50px;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
	float: right;
}

.introduction {
	padding: 10px;
	line-height: 1.3em;
}

/* -- 枠内の設定 End -- */

/* -- 会話形式ボックス Begin -- */
.job_qa{
	width: 70%;
	padding: 10px;
	line-height: 1.3em;
	background-color: rgba(255,255,255,0.5);
}

.talk p {
	color: #122a88;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 10px;
	text-align: left;
	padding-left: 50px;
}

.master p {
	text-align: left;
	color: #777;
	padding: 10px 0;
}
/* -- 会話形式ボックス End -- */

/* -- system engeneer Setting Begin -- */
#system_engineer_box {
	margin: 0 auto;
	padding-top: 20px;
	text-align: center;
	width: 100%;
}

#system_engineer_box h2 {
	background-color: #009139;
	box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #009139, -25px 0 0 0 #009139;
	-moz-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #009139, -25px 0 0 0 #009139;
	-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #009139, -25px 0 0 0 #009139;
	-o-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #009139, -25px 0 0 0 #009139;
	-ms-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #009139, -25px 0 0 0 #009139;
}

#system_engineer_img {
	background-image: url(../job/image/se.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	height: auto;
	width: 95%;
	margin: 0px auto;
}

/* -- system engeneer Setting End -- */

/* -- programmer Setting Begin -- */
#programmer_box {
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	padding-top: 20px;
	text-align: center;
	width: 100%;
}

#programmer_box h2 {
	background-color: #c30d22;
	box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #c30d22, -25px 0 0 0 #c30d22;
	-moz-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #c30d22, -25px 0 0 0 #c30d22;
	-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #c30d22, -25px 0 0 0 #c30d22;
	-o-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #c30d22, -25px 0 0 0 #c30d22;
	-ms-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #c30d22, -25px 0 0 0 #c30d22;
}

#programmer_img {
	background-image: url(../job/image/pg.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	width: 95%;
	margin: 0px auto;
}
/* -- programmer Setting End -- */

/* -- web designer Setting Begin -- */
#web_designer_box {
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	padding-top: 20px;
	text-align: center;
	width: 100%;
}

#web_designer_box h2 {
	background-color: #f39700;
	box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #f39700, -25px 0 0 0 #f39700;
	-moz-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #f39700, -25px 0 0 0 #f39700;
	-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #f39700, -25px 0 0 0 #f39700;
	-o-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #f39700, -25px 0 0 0 #f39700;
	-ms-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #f39700, -25px 0 0 0 #f39700;
}

#web_designer_img {
	background-image: url(../job/image/wd.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	width: 95%;
	margin: 0px auto;
}
/* -- web designer Setting End -- */

/* -- Network engeneer Setting Begin -- */
#network_engineer_box {
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	padding-top: 20px;
	text-align: center;
	width: 100%;
}

#network_engineer_box h2 {
	background-color: #bc8ae2;
	box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #bc8ae2, -25px 0 0 0 #bc8ae2;
	-moz-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #bc8ae2, -25px 0 0 0 #bc8ae2;
	-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #bc8ae2, -25px 0 0 0 #bc8ae2;
	-o-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #bc8ae2, -25px 0 0 0 #bc8ae2;
	-ms-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3), 25px 0 0 0 #bc8ae2, -25px 0 0 0 #bc8ae2;
}

#network_engineer_img {
	background-image: url(../../ricruit2016/job/image/ne.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	height: auto;
	width: 95%;
	margin: 0px auto;
}

/* -- Network engeneer Setting End -- */

}