@charset "utf-8";

/*===================================
 共通
===================================*/
body {
	color: #205177;
	display: block;
}

/* 戻る・終了 */
.back-btn,
.close-btn {
	color: #205177;
}

/* 戻る */
.back-btn::before {
	border-color: #30a8ed;
}

/* 終了 */
.close-btn::before,
.close-btn::after {
	border-color: #30a8ed;
}

/*=== リンクアイコン ===*/
.link-icon {
	color: #30a8ed !important;
}
.link-icon::before,
.link-icon::after {
	border-color: #30a8ed;
}

/*===================================
 ヘッダー
===================================*/
header {
	background: #fff;
	color: #333;
	box-shadow: 0 1px 0 #76adc7;
}

/* ページタイトル */
header .page-header {
    background: #145282;
}

/*=== STEP表示 ===*/
/* 数字アイコン */
header nav.step-nav li span:first-child {
    color: #145282;
    border-color: #145282;
}
header nav.step-nav li.current span:first-child {
    color: #fff;
    background: #145282;
}
/* ナビゲーションの外枠 */
header nav.step-nav li {
    border-color: #d8e1f3;
}
header nav.step-nav li:first-child {
    border-left-color: #d8e1f3;
}
header nav.step-nav li:last-child {
    border-right-color: #d8e1f3;
}
/* 矢印 */
header nav.step-nav li::before {
    border-left-color: #d8e1f3;
}
/* 矢印の塗りつぶし部分 */
header nav.step-nav li::after {
    border-left-color: #fff;
}
/* 選択中ステップ */
header nav.step-nav li.current::after {
    border-left-color: #d8e1f3;
}
header nav.step-nav li.current {
    background: #d8e1f3;
}

/* SP版 戻る */
header .back-btn::before {
	border-color: #fff;
}

/*===================================
 フッター
===================================*/
footer {
	border-color: #ebebeb;
}

/* ボタン */
footer .btn {
	background: linear-gradient(#5eaefd 20%, #57a2ec 40%, #4f94d7 60%, #4c8dce);
	border-top-color: #8cc5fd;
	border-bottom-color: #4b8ccc;
}

/*===================================
 コンテンツ
===================================*/
.content-wrap a {
	color: #2fa9ef;
}

/* タイトル */
.content-wrap .content-header {
	background: #feffe1;
	color: #205177;
	border-color: #ebebeb;
}
.content-wrap .content-header em {
	color: #2fa9ef;
}

/*=== コンテンツのタブ ===*/
.content-tab {
	background: linear-gradient(#feffe1 70%, #e3e4c9);
}
.content-tab ul li.active {
	color: #2fa9ef;
}

/* コンテンツの中身 */
.content-wrap .content-body em {
	color: #2fa9ef;
}

/*===================================
STEP1 確定給付型年金のヒアリング
===================================*/
.radio-list > li:not(:last-child) {
	border-color: #ebebeb;
}
.radio-list li ul li input:checked + label {
	background: url(../images/radio-checked-blue.png) no-repeat center /contain;
}

/*===================================
 STEP2 拠出上限額を確認
===================================*/


/*===================================
 STEP3 条件入力
===================================*/
.precondition-wrap .item {
	border-color: #ededed;
}

/* テキストボックス */
.precondition-wrap .item .input-box input {
	color: #2fa9ef;
}
/* select */
.m-wrap {
	color: #2fa9ef;
}
/*=== スライダー ===*/
/* 進行中のバー */
.precondition-wrap .item .slider-box .slider .ui-slider-range {
	background: #a0dcf3;
}
/* つまみ部分 */
.precondition-wrap .item .slider-box .slider .ui-slider-handle {
	border-color: #fff;
	background: radial-gradient(at left top, #3eb9fd, #36a0fd 65%, #3090e9 75%);
}

/*===================================
 STEP4 拠出時のメリット
===================================*/
.merit p span {
	color: #2fa9ef;
}
.merit p::before {
	content: url(../images/merit-blue.png);
}
.merit-detail table tr:last-child td{
    border-color: #2fa9ef;
}

/*===================================
 STEP4 運用時のメリット
===================================*/
.merit-flow ul li {
	border-color: #ccc;
	background: #fff;
}
.merit-flow ul li:last-child {
	border-color: #ccc;
}
/* 矢印 */
.merit-flow ul li:not(:first-child)::before {
	border-color: #ccc;
}
/* 税制メリット */
.merit-flow ul li:first-child {
	background: #448fb5;
	border-color: #448fb5;
}
.merit-flow ul li:nth-child(2)::before {
	background: linear-gradient(to right bottom, transparent 48%, #448fb5 48%);
	border-color: #448fb5;
}
@media print{
	.merit-flow ul li:first-child {
		color: #448fb5;
	}
}
/* 金額 */
.merit-flow ul li:last-child,
.merit-flow ul li:last-child::before {
	border-color: #2fa9ef;
}

/* SP版「税制メリット」 */
@media screen and (max-width: 767px) {
	.merit-flow ul li:first-child {
		background: url(../images/merit-blue.png) no-repeat center /contain;
	}
}

/*=== ストライプの枠 ===*/
.stripe-box {
	background: url(../images/stripe-box-pc-blue.png) no-repeat 0 /contain;
}
@media screen and (max-width: 767px) {
	.stripe-box {
		background: url(../images/stripe-box-sp-blue.png) no-repeat 0 /contain;
	}
}

/*=== グラフ ===*/
.graph-box {
	border-color: #999;
}
/* 運用益 */
.graph.graph-unyoEkiMinusHiKazei {
	border-bottom-color: #e2f4fe;
}
/* 積立元本 */
.graph.graph-tsumitateGanpon {
	border-bottom-color: #f7f9c7;
}

/*=== 計算式 ===*/
/* 運用益 */
.formula .val1 {
	background: #e2f4fe;
}
/* 積立元本 */
.formula .val2 {
	background: #f7f9c7;
}
/* 運用結果 */
.formula .total {
	background: #2fa9ef;
}
@media print{
	/* 運用益 */
	.formula .val1 {
		border: solid 2px #e2f4fe;
	}
	/* 積立元本 */
	.formula .val2 {
		border: solid 2px #f7f9c7;
	}
	/* 運用結果 */
	.formula .total {
		border: solid 2px #2fa9ef;
		color: #2fa9ef;
	}
}