@charset "Shift_JIS";

/*//////////////////////////////////////////////////////////////////////////////

baseLayout.css

--------------------------------------------------------------------------------
Base styles for All pages
	 0. common
	 1. stage
	 2. header
	 3. logininfo
	 4. heading
	 5. flow
	 6. contents
	 7. footer

//////////////////////////////////////////////////////////////////////////////*/

/* -----------------------------------------------------------------------------
	 0. common
----------------------------------------------------------------------------- */
body {
	width       : 100%;
	min-width   : 960px;
	color       : #333333;
	font-family : 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Arial, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	font-size   : 100%;
	}

/* -----------------------------------------------------------------------------
	 1. stage
----------------------------------------------------------------------------- */
#stage {
	width     : 100%;
	min-width : 320px;
	}

/* -----------------------------------------------------------------------------
	 2. header
----------------------------------------------------------------------------- */
.header {
	position      : relative;
	width         : 100%;
	height        : 108px;
	border-bottom : 1px #cccccc solid;
	}
	.header > .innerblock {
		width  : 960px;
		margin : 0 auto;
		}
		.header .siteid {
			margin-top : 8px;
			}
/*
		.header .innerblock a:link, header .innerblock a:visited, header .innerblock a:active, header .innerblock a:hover {
			opacity    : 1.0;
			filter     : alpha(opacity=100);
			-ms-filter : "alpha(opacity=100)";
		}
*/
		.header .guide {
			float      : right;
			margin-top : 68px;
			}
			.header .guide li {
				display     : inline-block;
				line-height : 1.3;
				}
			.header .guide li + li {
				margin-left : 18px;
				}

/* -----------------------------------------------------------------------------
	 3. logininfo
----------------------------------------------------------------------------- */
.logininfo {
	position : relative;
	width    : 100%;
	height : 47px;
	}
	.logininfo > .innerblock {
		width   : 960px;
		margin  : 0 auto;
		padding : 11px 0;
		}
		.logininfo .account-name {
			float       : left;
			font-weight : bold;
			}
		.logininfo .guide {
			float : right;
			}
			.logininfo .guide li {
				display     : inline-block;
				line-height : 1.3;
				}
			.logininfo .guide li + li {
				margin-left : 18px;
				}

/* -----------------------------------------------------------------------------
	 4. heading
----------------------------------------------------------------------------- */
.header + .heading {
	margin-top : 47px;
	}
.heading {
	position   : relative;
	width      : 100%;
	background : #103184;
	}
	.heading > .innerblock {
		width   : 960px;
		margin  : 0 auto;
		padding : 22px 0;
		}
		.heading h1 {
			display     : block;
			color       : #ffffff;
			font-size   : 175%;
			font-weight : bold;
			line-height : 1.3;
			}
			.heading h1 > .h1-small {
				font-size : 18px;
				}
		.heading .btn {
			position   : absolute;
			right      : 0;
			top        : 50%;
			width      : 224px;
			margin-top : -32px;
			}

/* -----------------------------------------------------------------------------
	 5. flow
----------------------------------------------------------------------------- */
.flow {
	position   : relative;
	width      : 100%;
	border-top : 1px #bfd3e5 solid;
	background : #effaff;
	}
	.flow > .innerblock {
		width   : 960px;
		margin  : 0 auto;
		padding : 11px 0;
		}
		.flow ul {}
			.flow ul li {
				display : table;
				float   : left;
				width   : 152px;
				height  : 64px;
				-webkit-box-sizing : border-box;
				-moz-box-sizing    : border-box;
				box-sizing         : border-box;
				}
			.flow ul li + li {
				padding-left : 13px;
				background   : url(../../PrdAutoBike/Image/Dynamic/common/img_flow_arrow_default.png) no-repeat 0 0;
				}
			.flow ul li.off + li {
				background   : url(../../PrdAutoBike/Image/Dynamic/common/img_flow_arrow_off.png) no-repeat 0 0;
				}
			.flow ul li.active + li {
				background   : url(../../PrdAutoBike/Image/Dynamic/common/img_flow_arrow_active.png) no-repeat 0 0;
				}
			.flow ul li:first-child {
				width          : 138px;
				}
			.flow ul li.flow-7 {
				width          : 61px;
				}
				.flow ul li > span {
					display        : table-cell;
					height         : 64px;
					padding-left   : 8px;
					border         : 1px #b2d1e7 solid;
					border-right   : none;
					vertical-align : middle;
					font-size      : 81.3%;
					line-height    : 1.4;
					letter-spacing : -0.1em;
					background     : #daf0ff;
					-webkit-box-sizing : border-box;
					-moz-box-sizing    : border-box;
					box-sizing         : border-box;
					-webkit-box-shadow : rgba(176, 211, 234, 1) 0 1px 0 0;
					-moz-box-shadow    : rgba(176, 211, 234, 1) 0 1px 0 0;
					box-shadow         : rgba(176, 211, 234, 1) 0 1px 0 0;
					}
				.flow ul li.off > span {
					border-color : #cecece;
					background   : #f8f8f8;
					-webkit-box-shadow : rgba(193, 202, 206, 1) 0 1px 0 0;
					-moz-box-shadow    : rgba(193, 202, 206, 1) 0 1px 0 0;
					box-shadow         : rgba(193, 202, 206, 1) 0 1px 0 0;
					}
				.flow ul li.active > span {
					border-color : #103184;
					color        : #ffffff;
					background   : #103184;
					-webkit-box-shadow : rgba(96, 121, 176, 1) 0 1px 0 0;
					-moz-box-shadow    : rgba(96, 121, 176, 1) 0 1px 0 0;
					box-shadow         : rgba(96, 121, 176, 1) 0 1px 0 0;
					}
				.flow ul li.flow-7 > span {
					padding        : 30px 0 0 0;
					border         : 1px #b2d1e7 solid;
					text-align     : center;
					background     : #daf0ff url(../../PrdAutoBike/Image/Dynamic/common/img_flow_complete.png) no-repeat center 11px;
					-webkit-box-shadow : rgba(217, 217, 217, 1) 0 1px 0 0;
					-moz-box-shadow    : rgba(217, 217, 217, 1) 0 1px 0 0;
					box-shadow         : rgba(217, 217, 217, 1) 0 1px 0 0;
					}
				.flow ul li.flow-7.active > span {
					border     : 1px #103184 solid;
					background : #103184 url(../../PrdAutoBike/Image/Dynamic/common/img_flow_complete_active.png) no-repeat center 11px;
					-webkit-box-shadow : rgba(96, 121, 176, 1) 0 1px 0 0;
					-moz-box-shadow    : rgba(96, 121, 176, 1) 0 1px 0 0;
					box-shadow         : rgba(96, 121, 176, 1) 0 1px 0 0;
					}

/* -----------------------------------------------------------------------------
	 6. contents
----------------------------------------------------------------------------- */
.contents {
	position : relative;
	width    : 100%;
	}
	.contents > .innerblock {
		position : relative;
		width    : 960px;
		margin   : 0 auto;
		padding  : 40px 0 90px 0;
		}
	.contents > .innerblock.login {
		padding-bottom : 10px;
		}
	.contents > .innerblock > :first-child :first-child {
		margin-top : 0;
		}
		.contents > .innerblock > .lay2col {}
		.contents > .innerblock > .lay2col + .lay2col {
			margin-top : 20px;
			}
			.contents > .innerblock > .lay2col > .col1 {
				width : 704px;
				}

			.contents > .innerblock > .lay2col > .col2 {
				width : 224px;
				}
		.contents > .innerblock > .lay2col.equality {
			margin-top : 20px;
			}
			.contents > .innerblock > .lay2col.equality > .col1 {
				width         : 50%;
				padding-right : 10px;
				-webkit-box-sizing : border-box;
				-moz-box-sizing    : border-box;
				box-sizing         : border-box;
				}
			.contents > .innerblock > .lay2col.equality > .col2 {
				width         : 50%;
				padding-right : 0;
				padding-left  : 10px;
				-webkit-box-sizing : border-box;
				-moz-box-sizing    : border-box;
				box-sizing         : border-box;
				}
		.contents .totop {
			position : absolute;
			bottom   : 20px;
			right    : 0;
			cursor   : pointer;
			}
/* -----------------------------------------------------------------------------
	 7. footer
----------------------------------------------------------------------------- */
.footer {
	position    : relative;
	width       : 100%;
	padding     : 11px 0;
	border-top  : 1px #cccccc solid;
	font-size   : 62.5%;
	line-height : 1.3;
	text-align  : center;
	}

	.CustomerServiceblue {
color:#103184;
}