@charset "utf-8";
/* CSS Document */

/**
 * flow
 * clearfix
 */


/* flow
--------------------- */

article.lower section.flow {
	background: url(/recruit/fresh/img/bg_flow_01.png) 50% 100% no-repeat;
	margin-bottom: 40px;
	padding-bottom: 40px;
}
@media screen and (max-width: 1023px) {
	article.lower section.flow {
		background: url(/recruit/fresh/img/sp/bg_flow_01.png) 50% 100% no-repeat;
		-webkit-background-size: 150px 25px;
		-moz-background-size: 150px 25px;
		-ms-background-size: 150px 25px;
		-o-background-size: 150px 25px;
		background-size: 150px 25px;
		margin-bottom: 20px;
		padding-bottom: 25px;
	}
}

/* inner */
article.lower section.flow div.inner {
}

/* h1 */
article.lower section.flow h1 {
	background-color: #f5f7fa;
	border: 1px solid #e2e6ed;
	float: left;
	text-align: center;
	width: 208px;
}
@media screen and (max-width: 1023px) {
	article.lower section.flow h1 {
		float: none;
		margin-bottom: 10px;
		padding: 15px 0!important;
		text-align: center;
		width: auto;
	}
}
@media screen and (max-width: 767px) {
	article.lower section.flow h1 img {
		height: auto!important;
		width: 140px!important;
	}
}

/* h2 */
article.lower section.flow h2 {
	border-bottom: 1px dotted #000;
	font-size: 114%;
	font-weight: bold;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-bottom: 7px;	
}

/* content */
article.lower section.flow div.content {
	float: right;
	width: 464px;
}
@media screen and (max-width: 1023px) {
	article.lower section.flow div.content {
		float: none;
		width: auto;
	}
}

/* step1 */
article.lower section.step1 h1 {
	padding: 52px 0;
}
article.lower section.step1 ul {
	margin: 0 auto;
	padding: 0 0 10px 10px;
	width: 438px;
}
article.lower section.step1 li {
	float: left;
	margin: 0 10px 10px 0;
}

article.lower section.step1 li:nth-child(even) {
	margin-right:0;
}

article.lower section.step1 li img {
	max-width:100%;
	height:auto;
}

article.lower section.step1 li a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

@media screen and (max-width: 767px) {
	article.lower section.step1 ul {
		padding: 10px 0;
		width: 100%;
	}
	article.lower section.step1 li {
		float:none;
		text-align:center;
		margin: 0;
		padding: 0 12px 24px 12px
	}
}

/* step2 */
article.lower section.step2 h1 {
	padding: 52px 0;
}

/* step3 */
article.lower section.step3 h1 {
	padding: 43px 0;
}

/* step4 */
article.lower section.step4 h1 {
	padding: 43px 0;
}

/* step5 */
article.lower section.step5 h1 {
	padding: 43px 0;
}

/* step6 */
article.lower section.step6 h1 {
	padding: 43px 0;
}

/* step7 */
article.lower section.step7 h1 {
	padding: 33px 0;
}

/* step8 */
article.lower section.step8 h1 {
	padding: 52px 0;
}

/* step9 */
article.lower section.step9 {
	background: 0;
	margin-bottom: 0;
	padding-bottom: 0;
}
article.lower section.step9 h1 {
	float: none;
	padding: 52px 0;
	width: 100%;
}



.freshNav {
	border-top:#000 1px dotted;
	text-align:center;
	padding:25px 0;
}

.freshNav li {
	display:inline-block;
	text-align:center;
	padding:0 10px;
	line-height:1;
}

.freshNav li+li {
	border-left:#000 1px solid;
}

@media screen and (max-width: 767px) {
	.freshNav { 
		padding: 15px 0 0;
	}
	.freshNav li {
		margin:0 0 15px;
	}
}


/* clearfix
--------------------- */

article.lower section.flow div.inner:before,
article.lower section.flow div.inner:after,
article.lower section.step1 ul:before,
article.lower section.step1 ul:after {
	content: "";
	display: table;
}
article.lower section.flow div.inner:after,
article.lower section.step1 ul:after {
	clear: both;
}
article.lower section.flow div.inner,
article.lower section.step1 ul {
	zoom: 1;
}