@charset "utf-8";

/*---------------------------------------------------------------------------------------------
-------------------------------------- page_flow -------------------------------------------
-----------------------------------------------------------------------------------------------*/
#option01 {
	background: url(../images/kodawari/bg_option01.jpg) repeat center top;
	margin: 0 auto;
	width: 100%;
}
#option01 .inner {
	background: url(../images/kodawari/bg_inner01.png) repeat center top;
	margin: 0 auto;
	padding: 43px 97px 0;
	width: 956px;
	height: 596px;
	font-size: 16px;
	line-height: 180%;
	letter-spacing: -0.05em;
}
#option01 .inner .inner_copy {
	margin-bottom: 55px;
	text-align: center;
}
#option01 .inner .text {
	width: 696px;
}
#option02 {
	background: url(../images/kodawari/bg_option02.jpg) repeat center top;
	margin: 0 auto;
	width: 100%;
}
#option02 .inner {
	background: url(../images/kodawari/bg_inner02.png) repeat center top;
	margin: 0 auto;
	padding: 20px 97px 0;
	width: 956px;
	height: 551px;
	font-size: 16px;
	line-height: 180%;
	letter-spacing: -0.05em;
}
#option02 .inner .text {
	width: 510px;
}

/*----Maincolumn---*/
#maincolumn {
	font-size: 13px;
	line-height: 169%;
}
#maincolumn .box {
	background: #fff;
	margin-bottom: 37px;
	padding: 18px;
	border: 2px solid #DCDCDC;
	border-radius: 5px;
	position: relative;
}
#maincolumn .box .box_text {
	    float: right;
    width: 425px;
}
#maincolumn .box .box_pic {
    float: left;
    width: 180px;
}
#maincolumn .box02 {
	background: #fff;
	margin-bottom: 37px;
	padding: 18px;
	border: 2px solid #FF4800;
	border-radius: 5px;
	position: relative;
}
#maincolumn .box03 {
	background: #fff;
	margin-bottom: 37px;
	padding: 18px;
	border: 2px solid #539216;
	border-radius: 5px;
	position: relative;
}
#maincolumn .box_ttl {
	color: #115996;
	margin-bottom: 20px;
	font-size: 25px;
	line-height: 120%;
}
#maincolumn .box_ttl.short {
	letter-spacing: -0.1em;
}
#maincolumn .box_ttl.no_mgn {
	margin-bottom: 0;
}
#maincolumn .box_ttl.c-red {
	color: #ff4800;
}
#maincolumn .box_ttl.c-green {
	color: #539216;
}
#maincolumn .box_ttl span {
	background: #138AEE;
	display: inline-block;
	margin-right: 10px;
	padding: 6px 10px 4px;
	color: #fff;
	font-size: 20px;
	line-height: 100%;
	border-radius: 5px;
}
#maincolumn .box_ttl span.double {
	padding: 6px 5px 4px 3px;
	letter-spacing: -0.1em;
}
#maincolumn .list_pic {
	margin: 0 auto 20px;
	text-align: center;
	letter-spacing: -.40em;
}
#maincolumn .list_pic li {
	display: inline-block;
	margin: 0 22px;
	letter-spacing: normal;
}
#maincolumn .img_arrow {
	width: 100%;
	text-align: center;
	position: absolute;
	left: 0;
	bottom: -19px;
}
@media screen and (max-width:640px) {
	div#main_area {
		width: 100%;
		box-sizing: border-box;
	}
	#contents div {
		width: 100% !important;
		box-sizing: border-box;
		padding: 10px 2% !important;
		height: auto;
	}
	#contents div div {
		width: 100% !important;
		box-sizing: border-box;
		padding: 10px 5px !important;
	}
	#main_area {
	}
	#option01 {
	}
	#option01 .inner {
		height: auto;
		background: none;
		width: 100%;
		box-sizing: border-box;
		padding: 20px 2%;
	}
	#option01 .inner .inner_copy {
		margin-bottom: 20px;
	}
	#option01 .inner .text {
		width: 100%;
	}
	#option02 {
		height: auto;
		background-repeat: no-repeat;
		background-color: #efe9db;
		background-position: bottom right;
	}
	#option02 .inner {
		background-repeat: no-repeat;
		background-color: #efe9db;
		background-position: bottom right;
		background-image: none;
		height: auto;
		background: none;
		width: 100%;
		box-sizing: border-box;
		padding: 20px 2%;
	}
	#option02 .inner .text {
		width: 100%;
	}

	/*----Maincolumn---*/
	#maincolumn {
	}
	#maincolumn .box {
		margin-bottom: 20px;
	}
	#maincolumn .box span {
	}
	#maincolumn .box_text {
		width: 100%;
		float: none;
	}
	#maincolumn .box_pic {
		width: 100%;
		float: none;
		text-align: center;
		margin: 10px 0;
	}
}