@charset "utf-8";


/* ======================= WORK ====== */

div.mvBox {
	background: url(../images/mv.jpg) center top no-repeat;
	padding: 113px 0;
	margin-bottom: 60px;
}

.section {
	max-width: 1200px;
	margin: 0 auto 60px;
}

div.rentBox {
	background: url(../images/icon_arrow.gif) center top no-repeat;
	border: 1px solid #2d8f74;
	padding-top: 60px;
}

ul.checkList {
	max-width: 670px;
	margin: 0 auto;
}

ul.checkList li {
	background: url(../images/icon_check.gif) left 2px no-repeat;
	border-bottom: 1px dotted #ccc;
	float: left;
	margin-bottom: 40px;
	padding-bottom: 10px;
	padding-left: 32px;
}

ul.checkList li.last {
	float: right;
}

div.grayBox {
	background: #f1f1f1;
	padding: 20px 40px;
}

div.grayBox h3 {
	color: #000;
	font-size: 15px !important;
	text-align: center;
	margin-bottom: 20px;
}

ul.numberList li {
	box-sizing: border-box;
	float: left;
	margin-bottom: 40px;
	margin-right: 4%;
	padding-left: 25px;
	width: 30.5%;
}

ul.numberList li p {
	font-weight: bold;
	font-family: 15px !important;
	color: #000;
}

ul.numberList li.num01 {
	background: url(../images/n_01.gif) left 2px no-repeat;
}

ul.numberList li.num02 {
	background: url(../images/n_02.gif) left 2px no-repeat;
}

ul.numberList li.num03 {
	background: url(../images/n_03.gif) left 2px no-repeat;
}

ul.numberList li.num04 {
	background: url(../images/n_04.gif) left 2px no-repeat;
}

ul.numberList li.num05 {
	background: url(../images/n_05.gif) left 2px no-repeat;
}

ul.numberList li.num06 {
	background: url(../images/n_06.gif) left 2px no-repeat;
}

ul.numberList li.num07 {
	background: url(../images/n_07.gif) left 2px no-repeat;
}

ul.numberList li.num08 {
	background: url(../images/n_08.gif) left 2px no-repeat;
}

.workHead {
	background: url(../images/bg_work.gif) left top repeat;
	padding-top: 4px;
}

.workHead span {
	background: #2d8f74;
	color: #fff;
	display: block;
	font-size: 20px !important;
	padding: 10px 0;
	text-align: center;
}

ul.bgList li {
	float: left;
	border-bottom: 1px dotted #CCC;
	text-align: center;
	padding-top: 400px;
	border-left: 1px dotted #CCC;
	padding-bottom: 40px;
}

ul.bgList li.bg01 {
	background: url(../images/bg_01.jpg) center top no-repeat;
	width: 25%;
}

ul.bgList li.bg02 {
	background: url(../images/bg_02.jpg) center top no-repeat;
	width: 25%;
}


ul.bgList li.bg03 {
	background: url(../images/bg_03.jpg) center top no-repeat;
	width: 25%;
}

ul.bgList li.bg04 {
	background: url(../images/bg_04.jpg) center top no-repeat;
	width: 25%;
	border-right: 1px dotted #CCC;
}

ul.bgList li h3 {
	color: #105c47;
	font-size: 16px !important;
	padding: 20px 0;

}

ul.bgList li ul {
	min-height: 44px;
}

ul.bgList li ul li {

	float: none;
	border-bottom: none;
	padding-top: 0;
	border-left: none;
	padding-bottom: 0;
}

ul.bgList li ul li span {
	padding-left: 16px;
	background: url(../images/icon_check_s.gif) left center no-repeat;
}

.mainArea {
	padding: 0 20px;
}

div.rentBox h2 {
	max-width: 90%;
	margin: auto;
	display: block;
}

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

	ul.bgList li.bg01,
	ul.bgList li.bg02,
	ul.bgList li.bg03,
	ul.bgList li.bg04 {
		width: 48%;
		border: 1px dotted #CCC;
		margin: 10px 1%;
	}
}

@media screen and (max-width: 830px) {
	div.mvBox {
		margin-bottom: 45px;
	}

	.section {
		margin: 0 auto 40px;
	}

	ul.checkList li {
		padding-bottom: 8px;
		padding-left: 32px;
		float: none !important;
		width: 90%;
		margin: 0 auto 30px;
	}

	div.grayBox {
		padding: 20px 10px;
	}

	.bgList {
		margin: 10px 0;
	}

	ul.numberList li {
		margin-bottom: 20px;
		width: 100%;
		margin-right: 0px;
	}
}

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

	ul.bgList li.bg01,
	ul.bgList li.bg02,
	ul.bgList li.bg03,
	ul.bgList li.bg04 {
		width: 100%;
		margin: 10px 0;
	}
}
