/***************************************
	PC版ガイド-ローンページ用CSS
	
	
***************************************/


/* ローンシミュレーターページ */

.loan-header-section{
	margin:0 auto 0px;
	position:relative;
	max-height:600px;
	overflow-y:hidden;
}

.loan-header-section img{
	width:100%;
}

.loan-overview-section{
	max-width:1280px;
	margin:0 auto;
	background:rgba(255,255,255,0.8);
	position:relative;
	z-index:1;
	padding:10px 20px;
}

.loan-simulator-section{
	max-width:1280px;
	margin:40px auto;
}


.loan-simulator-section .loan-simulator-wrapper{
	background:#e2eff2;
	padding:40px;
	display:flex;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section{
	width:100%;
	margin-right:20px;
	text-align:center;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section{
	width:100%;
	margin-left:20px;
}

.loan-simulator-form-required-char{
	font-weight:bold;
}

		/* ローンシミュレーターのフォーム */
		
.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row{
	display:flex;
	align-items:center;
	margin-bottom:40px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dt{
	background:#6dacbd;
	padding:0 10px;
	text-align:center;
	width:100px;
	color:#ffffff;
	font-weight:bold;
	height:80px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dt .loan-simulator-form-row-annotation{
	display:block;
	font-size:14px;
	font-weight:normal;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dd{
	display:flex;
	align-items:center;
	height:80px;
	flex-grow:1;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dd input ,
.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dd select{
	height:80px;
	border:none;
	text-align:center;
	font-size:20px;
	flex-grow:1;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dd input::placeholder{
	color:#aaaaaa;
	font-size:14px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section dl.loan-simulator-form-row dd .loan-simulator-form-row-unit{
	min-width:3em;
	text-align:left;
	margin-left:5px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section p.loan-simulator-example-rate{
	margin-left:120px;
	margin-top:-30px;
	font-size:14px;
	text-align:left;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section .loan-simulate-form-trigger{
	margin:0 auto;
	background:#36535b url('../img/icon/arrow-white.png') no-repeat;
	background-size:auto 100%;
	background-position:96% center;
	color:#ffffff;
	text-align:center;
	padding:10px 60px 10px 40px;
	font-size:20px;
	border:none;
	transition:.3s;
	box-shadow:2px 2px 4px rgba(255,255,255,1);
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-form-section .loan-simulate-form-trigger:hover{
	cursor:pointer;
	background:#0099bc url('../img/icon/arrow-white.png') no-repeat;
	background-size:auto 100%;
	background-position:94% center;
	box-shadow:2px 2px 4px gray;
}


	/* シミュレーション結果 */
	
.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section .loan-simulate-result-headline{
	color:#6dacbd;
	margin-bottom:10px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section ul.loan-simulator-arert-list li{
	color:#dd6666;
	margin-bottom:10px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section p.loan-simulator-arert-caption{
	font-weight:bold;
	color:#dd6666;
	margin-bottom:10px;
}


.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section dl.loan-simulator-result-data{
	display:flex;
	align-items:center;
	margin-bottom:40px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section dl.loan-simulator-result-data dd{
	display:flex;
	flex-grow:1;
	align-items:center;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section dl.loan-simulator-result-data dd .loan-simulator-result-payment-amount{
	height:140px;
	text-align:center;
	font-size:28px;
	background:#ffffff;
	flex-grow:1;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:center;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section dl.loan-simulator-result-data dd .loan-simulator-result-unit{
	margin-left:5px;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section p.loan-simulator-result-parameter-caption{
	font-size:12px;
	text-align:left;
	margin-bottom:20px;
}

		/* 詳細内訳 */

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table{
	margin-bottom:10px;
	border:2px solid #ffffff;
	box-shadow:0px 0px 4px white;
	border-collapse: collapse;
	border-spacing:2px;
	width:100%;
}


.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr th{
	background:#d9dce0;
	color:#333333;
	padding:10px 12px;
	border:2px solid #ffffff;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr td{
	color:#333333;
	padding:10px 12px;
	text-align:center;
	border:2px solid #ffffff;
	background:#f4f6f8;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr.loan-simulator-result-payment-amount-table-current td{
	background:#ffeeee;
}


.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr.loan-simulator-result-payment-amount-table-current th,
.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table th.loan-simulator-result-payment-amount-table-current{
	background:#eebbbb;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr td.loan-simulator-result-payment-amount-table-current{
	background:#ffeeee;
}

.loan-simulator-section .loan-simulator-wrapper .loan-simulator-result-section table.loan-simulator-result-payment-amount-table tr.loan-simulator-result-payment-amount-table-current td.loan-simulator-result-payment-amount-table-current{
	background:#ee6666;
	color:#ffffff;
	font-weight:bold;
	font-size:20px;
}


	/* 資金計画 */
	
.loan-fp-section{
	max-width:1000px;
	margin:0 auto;
}

.loan-fp-section .loan-fp-calculation-formula-section{
	display:flex;
	justify-content:center;
	margin:40px 100px;
}

.loan-fp-section .loan-fp-calculation-formula-section .loan-fp-calculation-formula-object{
	background:#6facbd;
	color:#ffffff;
	display:flex;
	align-items:center;
	flex-grow:1;
	width:100%;
	text-align:center;
	justify-content:center;
	font-size:28px;
	padding:20px 10px;
	line-height:1.3;
}

.loan-fp-section .loan-fp-calculation-formula-section .loan-fp-calculation-formula-initial{
	background:#5b9bd5;
	color:#ffffff;
	display:flex;
	align-items:center;
	flex-grow:1;
	width:100%;
	text-align:center;
	justify-content:center;
	font-size:28px;
	padding:20px 10px;
	line-height:1.3;
}

.loan-fp-section .loan-fp-calculation-formula-section .loan-fp-calculation-formula-loan{
	background:#70ad47;
	color:#ffffff;
	display:flex;
	align-items:center;
	flex-grow:1;
	width:100%;
	text-align:center;
	justify-content:center;
	font-size:28px;
	padding:20px 10px;
	line-height:1.3;
}

.loan-fp-section .loan-fp-calculation-formula-section .loan-fp-calculation-formula-equal,
.loan-fp-section .loan-fp-calculation-formula-section .loan-fp-calculation-formula-plus{
	font-size:28px;
	padding:0 40px;
	display:flex;
	align-items:center;
}


.loan-fp-section h3.loan-fp-loan-example-headline{
	display:inline-block;
	color:#6dacbd;
	border-left:3px solid #6dacbd;
	border-right:3px solid #6dacbd;
	border-top:3px solid #6dacbd;
	padding:10px 60px 10px 20px;
	position:relative;
	background:url('../img/icon/arrow-down-wide-horizon.png') no-repeat;
	background-size:auto 0.8em;
	background-position:94% center;
	font-size:20px;
	margin-top:60px;
}


.loan-fp-section dl.loan-fp-loan-example-item-list{
	padding:0px 40px 40px;
	background:#6dacbd;
	margin-bottom:100px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dt{
	display:inline-block;
	padding:10px 24px;
	color:#6dacbd;
	font-weight:bold;
	font-size:20px;
	background:#ffffff;
	margin-top:40px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd{
	background:#ffffff;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-profile{
	display:flex;
	padding:10px 40px 10px 10px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-profile .loan-fp-example-item-profile-image{
	width:240px;
	margin-right:40px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-profile dl.loan-fp-example-item-profile-data{
	flex-grow:1;
	display:flex;
	align-items:center;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-profile dl.loan-fp-example-item-profile-data dt{
	border:2px solid #888888;
	padding:20px 40px;
	margin-right:20px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-profile dl.loan-fp-example-item-profile-data dd ul.loan-fp-example-item-profile-data-list li{
	list-style:disc;
	margin-left:20px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula{
	background:#eaf3f6;
	padding:40px;
	display:flex;
	align-items:center;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-object{
	color:#ffffff;
	background:#6dacbd;
	padding:10px;
	flex-grow:1;
	width:100%;
	height:80px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-initial{
	color:#ffffff;
	background:#5b9bd5;
	flex-grow:1;
	width:100%;
	height:80px;
	padding:10px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-loan{
	color:#ffffff;
	background:#70ad47;
	flex-grow:1;
	width:100%;
	height:80px;
	padding:10px;
	position:relative
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-loan > dd.loan-fp-example-item-payment-amount-data-rate{
	position:absolute;
	bottom:-24px;
	left:0;
	font-size:12px;
	color:#555555;
}


.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-object > dt,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-initial > dt,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-loan > dt{
	text-align:center;
	font-size:20px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-object > dd,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-initial > dd,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-loan > dd{
	text-align:center;
	font-size:16px;
	position:relative;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-object > dd .loan-fp-example-item-calculation-formula-value,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-initial > dd .loan-fp-example-item-calculation-formula-value,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula dl.loan-fp-example-item-calculation-formula-loan > dd .loan-fp-example-item-calculation-formula-value{
	font-size:24px;
}



.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula .loan-fp-example-item-calculation-formula-equal,
.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd .loan-fp-example-item-calculation-formula .loan-fp-example-item-calculation-formula-plus{
	font-size:24px;
	margin:0 20px;
}




.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd dl.loan-fp-example-item-payment-amount-data{
	display:flex;
	align-items:center;
	justify-content:center;
	background:#eaf3f6;
	padding:0 100px 40px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd dl.loan-fp-example-item-payment-amount-data dt{
	margin-right:5px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd dl.loan-fp-example-item-payment-amount-data dt .loan-fp-example-item-payment-amount-data-annotation{
	display:block;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd dl.loan-fp-example-item-payment-amount-data dd.loan-fp-example-item-payment-amount-data-value{
	background:#fff2cc;
	padding:20px;
	flex-grow:1;
	text-align:center;
	font-size:24px;
}

.loan-fp-section dl.loan-fp-loan-example-item-list > div > dd dl.loan-fp-example-item-payment-amount-data dd.loan-fp-example-item-payment-amount-data-unit{
	margin-left:5px;
}