@charset "UTF-8";

/* CSS Document */

/*===================================================
    各画面作成用CSS
===================================================*/

/*//////////////////////////////////////////////////
    iDeCo節税シミュレーションページ(PC)
///////////////////////////////////////////////////*/

/* ランディングページから遷移した場合の表示
---------------------------------------------*/
#fstLoad {
    width: 100%;
    height: 90%;
    overflow: auto;
    position: fixed;
    left: 0;
    right: 0;
    top: -1000px;
    bottom: 0;
    z-index: -1;
    margin: 0 auto;
    transition: 0.4s;
    opacity: 0;
    max-width:600px;
    min-width: 300px;
}
#fstLoad.block {
    top: 10%;
    z-index: 99999;
    margin: auto;
    opacity: 1;
}
#fstLoad dl {
	padding: 40px;
	color: #111111;
 	background:#FFFFFF;
}
	#fstLoad dl dt {
		margin-bottom: 20px;
		font-size: 18px;
		text-align: center;
	}
	#fstLoad dl dd {
		font-size: 14px;
	}
		#fstLoad dl dd ul {
			margin-bottom: 30px;
		}
			#fstLoad dl dd ul li {
				position: relative;
				padding-left: 20px;
			}
			#fstLoad dl dd ul li:before {
				content: '';
				position: absolute;
				top: 6px;
				left: 0;
				width: 6px;
				height: 6px;
				background: url("../image/common/icon_disc_grey.png") left center no-repeat;
				background-size: 6px auto;
			}

		#fstLoad dl dd .modalClose {
			width: 180px;
			margin: 0 auto;
		}
			#fstLoad dl dd button {
				width: 100%;
				font-size: 18px;
				color: #FFFFFF;
				line-height: 45px;
				background: #003399;
			}

/* ボタン設定
--------------------------------------*/
#simulation button {
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-weight: 500;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	background:#C1C8D1;
	-webkit-appearance:none;
    -moz-appearance: none;
	appearance: none;
	color: #FFF;
}

/* --------------------------------------------------
    診断結果表示
-------------------------------------------------- */
#resultDiagnosis,
#resultDiagnosis .detailBox {
	display: table;
	width: 100%;
}
	#resultDiagnosis > *,
	#resultDiagnosis .detailBox > * {
		display: table-cell;
		vertical-align: middle;
	}
#resultDiagnosis {
	margin-bottom: 20px;
}
	#resultDiagnosis .detailBox {
		width: 510px;
	}
		#resultDiagnosis .detailBox > p {
			width: 106px;
			padding-right: 10px;
		}
		#resultDiagnosis .detailBox .kind {
			vertical-align: bottom;
		}
			#resultDiagnosis .detailBox .kind p {
				display: table;
				position: relative;
				width: 100%;
				height: 60px;
				font-size: 16px;
				background: #FFFFFF;
			}
				#resultDiagnosis .detailBox .kind p > span {
					display: table-cell;
					padding: 5px 90px 5px 85px;
					vertical-align: middle;
					text-indent: -4em;
				}
				#resultDiagnosis .detailBox .kind button {
					position: absolute;
					top: 0;
					bottom: 0;
					right: 10px;
					width: 60px;
					height: 35px;
					font-size: 12px;
					margin:auto 0;
				}

	#resultDiagnosis #maxInstalment {
		width: 490px;
		font-family: 'Noto Sans JP',Meiryo,"メイリオ";
		font-weight: 700;
		font-size: 14px;
		text-align: center;
	}
				#resultDiagnosis #maxInstalment .max-sup {
					font-size: 12px;
					display: block;
					text-align: left;
					margin-left: 25px;
					position: relative;
					padding-left: 15px;
				}
		
				#resultDiagnosis #maxInstalment .max-sup::before {
					content: '※';
					position: absolute;
					left: 0;
				}
		#resultDiagnosis #maxInstalment em {
			font-size: 30px;
			color: #E70202;
		}
		#resultDiagnosis #maxInstalment br {
			display: none;
		}
/* --------------------------------------------------
    モーダルウインドウ
-------------------------------------------------- */
.modalOverlay {
	display: none;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: fixed;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
}

#simulation .modalContent {
	display: none;
    width: 100%;
    height: 90%;
    overflow: auto;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
    margin: auto;
    padding: 30px 40px;
    max-width:600px;
    min-width: 300px;
    background: #FFFFFF;
    z-index: 10000;
}
	#simulation .modalContent > p {
		font-size: 16px;
    	font-weight: bold;
    	text-align: center;
	}
	#simulation .modalContent dl {
		margin-bottom: 40px;
	}
		#simulation .modalContent dl dt {
			margin-bottom: 20px;
			font-size: 18px;
			text-align: center;
		}
		#simulation .modalContent dl dd {
			font-size: 14px;
		}
	#simulation .modalContent .modalClose button {
		width: 180px;
		margin: 0 auto;
		font-size: 14px;
		line-height: 45px;
	}

/* 職業選択モーダル
--------------------------------------*/
#simulation #kindBox {
	max-width:440px;
	height: 366px;
	padding: 0;
}
	#simulation #kindBox > p {
		padding: 15px 10px;
	}
	#simulation #kindBox ul li {
		position: relative;
		font-size: 14px;
		border-top: 1px solid #DDDDDD;
	}
		#simulation #kindBox ul li input[type="radio"] {
			position: absolute;
			opacity: 0;
			z-index: -1;
		}
		#simulation #kindBox ul li label {
			display: block;
			width: 100%;
			height: 100%;
			padding: 11px 30px 11px 15px;
			cursor: pointer;
			background: url("../image/simulation/radio_off.png") 98% center no-repeat;
			background-size: 20px auto;
		}
		#simulation #kindBox ul li input[type="radio"]:checked + label {
			background: url("../image/simulation/radio_on.png") 98% center no-repeat;
			background-size: 20px auto;
		}

/*通常リスト＆連番*/
#simulation .dot > li {
	position: relative;
	padding-left: 20px;
}
#simulation .dot > li:before {
	content: '';
	position: absolute;
	top: 6px;
	left: 0;
	width: 6px;
	height: 6px;
	background: url("../image/common/icon_disc_grey.png") left center no-repeat;
	background-size: 6px auto;
}
#simulation .num li {
	position: relative;
	padding-left: 30px;
	counter-increment: cnt;
	list-style-position:inside;
}
#simulation .num li+li {
	margin-top: 10px;
}

#simulation .num li span {
	font-size: 12px;
}
#simulation .num li:before {
	position: absolute;
	top: 0;
	left: 0;
	content: "(" counter(cnt) ") "
}

/*移換資産*/
#simulation #con1 {
	max-height: 250px;
}
/*毎月の掛け金*/
#simulation #con2 {
	max-height: 510px;
}
#simulation #con2 ul {
	margin: 1em 0;
}
#simulation #con2 ul strong {
	font-weight: bold;
}
#simulation #con2 .dot > li + li {
	margin-top: 1em;
}
#simulation #con2 p + p {
	margin-top: 1em;
}

/*運用利回り*/
#simulation #con3 {
	max-height: 600px;
}
#simulation #con3 ul {
	margin: 1em 0;
}
#simulation #con3 ul li {
	position: relative;
	padding-left: 20px;
}
#simulation #con3 ul li + li {
	margin-top: 1em;
}
#simulation #con3 ul li:before {
	content: '';
	position: absolute;
	top: 6px;
	left: 0;
	width: 6px;
	height: 6px;
	background: url("../image/common/icon_disc_grey.png") left center no-repeat;
	background-size: 6px auto;
}
/*加入プラン*/
#simulation #con4 {
	max-height: 454px;
}
	#simulation #con4 .dot {
		margin-top: 15px;
	}
		#simulation #con4 .dot > li {
			margin-bottom: 25px;
		}
		#simulation #con4 .num aside {
			margin-left: 7em;
		}

/*扶養配偶者、扶養している子供*/
#simulation #con5 ol,
#simulation #con6 ol {
	margin: 1em 0 0;
}
#simulation #con5 ol li,
#simulation #con6 ol li {
	position: relative;
	padding-left: 30px;
	counter-increment: cnt;
	list-style-position:inside;
}
#simulation #con5 ol li:before,
#simulation #con6 ol li:before {
	position: absolute;
	top: 0;
	left: 0;
	content: "(" counter(cnt) ") "
}
/*扶養配偶者（控除対象配偶者）*/
#simulation #con5 {
	max-height: 370px;
}
/*扶養している子供（控除対象扶養親族）*/
#simulation #con6 {
	max-height: 430px;
}
/*拠出時の税制優遇*/
#simulation #con7 {
	max-height: 310px;
}
/*運用時の税制優遇*/
#simulation #con8 {
	max-height: 310px;
}
/*受取時の税制優遇*/
#simulation #con9 {
	max-height: 440px;
}
#simulation #con7 p + p,
#simulation #con8 p + p,
#simulation #con9 p + p {
	margin-top: 1em;
}

/* --------------------------------------------------
    メイン
-------------------------------------------------- */
#simulation {
	max-width: 1020px;
	margin: -90px auto 0;
	padding: 230px 10px 0px;
}
/* --------------------------------------------------
    入力画面
-------------------------------------------------- */
#simulation #pageInput {
	margin-top: -140px;
	/*padding-top: 140px;*/
}
	#simulation #pageInput .contBox {
		padding: 5px 55px 40px;
		text-align: center;
		border: 3px solid #CCC;
		background: #FFFFFF;
	}

/* 入力ボックス
--------------------------------------*/
#simulation #pageInput .contBox > dl {
	display: table;
	width: 100%;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-size: 14px;
	text-align: left;
	border-bottom: 1px solid #DDDDDD;
}
#simulation #pageInput .contBox > dl > * {
	display: table-cell;
	padding: 15px 0;
	vertical-align: middle;
}
#simulation #pageInput .contBox > dl > dt {
	width: 200px;
	font-size: 15px;
	font-weight: 700;
}
#simulation #pageInput .contBox > dl > dt span {
	display: inline-block;
	width: 24px;
	margin-left: 9px;
	cursor: pointer;
}
#simulation #pageInput .contBox > dl > dd {
	position: relative;
	font-weight: 500;
}
#simulation #pageInput .contBox > dl > dd span {
	position: absolute;
	bottom:10px;
	font-size: 11px;
	color: #ABB2BB;
}
#simulation #pageInput .contBox > dl > dd + dd {
	width: 520px;
}
#simulation #pageInput dl dd .min {
	left:0;
}
#simulation #pageInput dl dd .max {
	right:0;
}
#simulation #pageInput dl dd .rangeslider:after {
	content: '';
	position: absolute;
	left:0;
	width: 100%;
	height: 16px;
}
#simulation #pageInput dl:first-child .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 135px center no-repeat,url("../image/simulation/scale_bg.png") 250px center no-repeat,url("../image/simulation/scale_bg.png") 365px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:first-child .scale1 {
			left:130px;
		}
		#simulation #pageInput dl:first-child .scale2 {
			left:245px;
		}
		#simulation #pageInput dl:first-child .scale3 {
			left:360px;
		}
#simulation #pageInput dl:first-child .scaleType1 .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 125px center no-repeat,url("../image/simulation/scale_bg.png") 228px center no-repeat,url("../image/simulation/scale_bg.png") 333px center no-repeat,url("../image/simulation/scale_bg.png") 438px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:first-child .scaleType1 .scale1 {
			left:120px;
		}
		#simulation #pageInput dl:first-child .scaleType1 .scale2 {
			left:223px;
		}
		#simulation #pageInput dl:first-child .scaleType1 .scale3 {
			left:327px;
		}
		#simulation #pageInput dl:first-child .scaleType1 .scale4 {
			left:433px;
		}
	#simulation #pageInput dl:nth-child(2) .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 135px center no-repeat,url("../image/simulation/scale_bg.png") 250px center no-repeat,url("../image/simulation/scale_bg.png") 365px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:nth-child(2) .scale1 {
			left:125px;
		}
		#simulation #pageInput dl:nth-child(2) .scale2 {
			left:240px;
		}
		#simulation #pageInput dl:nth-child(2) .scale3 {
			left:355px;
		}
	#simulation #pageInput dl:nth-child(3) .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 80px center no-repeat,url("../image/simulation/scale_bg.png") 170px center no-repeat,url("../image/simulation/scale_bg.png") 250px center no-repeat,url("../image/simulation/scale_bg.png") 330px center no-repeat,url("../image/simulation/scale_bg.png") 400px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:nth-child(3) .scale1 {
			left:160px;
		}
		#simulation #pageInput dl:nth-child(3) .scale2 {
			left:315px;
		}
	#simulation #pageInput dl:nth-child(4) .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 145px center no-repeat,url("../image/simulation/scale_bg.png") 275px center no-repeat,url("../image/simulation/scale_bg.png") 400px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:nth-child(4) .scale1 {
			left:135px;
		}
		#simulation #pageInput dl:nth-child(4) .scale2 {
			left:265px;
		}
		#simulation #pageInput dl:nth-child(4) .scale3 {
			left:390px;
		}
	/* 最大掛金別の刻み値位置調整*/
		/* 自営業*/
		#simulation #pageInput.-selfEmployed dl:nth-child(4) .rangeslider:after {
			background: url("../image/simulation/scale_bg.png") 130px center no-repeat, url("../image/simulation/scale_bg.png") 240px center no-repeat, url("../image/simulation/scale_bg.png") 350px center no-repeat;
		}
		#simulation #pageInput.-selfEmployed dl:nth-child(4) .scale1 {
			left: 120px;
		}
		#simulation #pageInput.-selfEmployed dl:nth-child(4) .scale2 {
			left: 230px;
		}
		#simulation #pageInput.-selfEmployed dl:nth-child(4) .scale3 {
			left: 340px;
		}
		/* 企業型確定拠出年金のみあり・確定給付企業年金等のみあり・両方あり・公務員 */
		#simulation #pageInput.-DConly dl:nth-child(4) .rangeslider:after,
		#simulation #pageInput.-DBonly dl:nth-child(4) .rangeslider:after,
		#simulation #pageInput.-both dl:nth-child(4) .rangeslider:after,
		#simulation #pageInput.-publicServant dl:nth-child(4) .rangeslider:after {
			background: url("../image/simulation/scale_bg.png") 140px center no-repeat, url("../image/simulation/scale_bg.png") 265px center no-repeat, url("../image/simulation/scale_bg.png") 385px center no-repeat;
		}
		#simulation #pageInput.-DConly dl:nth-child(4) .scale1,
		#simulation #pageInput.-DBonly dl:nth-child(4) .scale1,
		#simulation #pageInput.-both dl:nth-child(4) .scale1,
		#simulation #pageInput.-publicServant dl:nth-child(4) .scale1 {
			left: 125px;
		}
		#simulation #pageInput.-DConly dl:nth-child(4) .scale2,
		#simulation #pageInput.-DBonly dl:nth-child(4) .scale2,
		#simulation #pageInput.-both dl:nth-child(4) .scale2,
		#simulation #pageInput.-publicServant dl:nth-child(4) .scale2 {
			left: 250px;
		}
		#simulation #pageInput.-DConly dl:nth-child(4) .scale3,
		#simulation #pageInput.-DBonly dl:nth-child(4) .scale3,
		#simulation #pageInput.-both dl:nth-child(4) .scale3,
		#simulation #pageInput.-publicServant dl:nth-child(4) .scale3 {
			left: 370px;
		}
	#simulation #pageInput dl:nth-child(5) .rangeslider:after {
		background: url("../image/simulation/scale_bg.png") 135px center no-repeat,url("../image/simulation/scale_bg.png") 250px center no-repeat,url("../image/simulation/scale_bg.png") 365px center no-repeat;
		background-size: 1px auto;
	}
		#simulation #pageInput dl:nth-child(5) .scale1 {
			left:125px;
		}
		#simulation #pageInput dl:nth-child(5) .scale2 {
			left:240px;
		}
		#simulation #pageInput dl:nth-child(5) .scale3 {
			left:355px;
		}

/* 扶養している子供　
-------------------------------------------------- */
#simulation #pageInput .contBox .children {
	margin-bottom: 20px;
}
#simulation #pageInput .contBox .children > * {
	vertical-align: top;
}
	#simulation #pageInput .contBox .children ul {
		overflow: hidden;
		width: 480px;
	}
		#simulation #pageInput .contBox .children ul li {
			float: left;
			width: 240px;
		}
		#simulation #pageInput .contBox .children ul li:nth-child(n+3) {
			margin-top: 20px;
		}
	#simulation #pageInput .contBox .children dl {
		display: table;
		width: 100%;
	}
		#simulation #pageInput .contBox .children dl dt {
			display: table-cell;
			width: 90px;
		}
		#simulation #pageInput .contBox .children dl dd {
			display: table-cell;
		}

/* 数値入力設定
-------------------------------------------------- */
#simulation input[type="tel"],
#simulation input[type="number"] {
	width: 80px;
	height: 40px;
	padding: 0 5px;
	font-size: 16px;
	text-align: right;
	border-radius: 4px;
	border: 1px solid #CCC;
	background: #F3F3F3;
	-webkit-appearance: none;
	appearance: none;
	-moz-appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ラジオボタン設定　
-------------------------------------------------- */
#simulation .radioBox {
    display: table;
    width: 300px;
    border-radius: 4px;
	border: 1px solid #CCC;
}
    #simulation .radioBox li {
        position: relative;
        display: table-cell;
        width: 50%;
        height: 40px;
    }
    #simulation .radioBox li:first-child {
    	border-right: solid 1px #CCC;
    }

        #simulation .radioBox li input[type="radio"] {
            position: absolute;
            left: 0;
            top:0;
            width: 98%;
            height: 90%;
            opacity: 0;
            z-index: 1;
            cursor: pointer;
            -ms-filter: "alpha(opacity=0)";
            -webkit-appearance:none;
            -moz-appearance: none;
            appearance: none;
        }
        #simulation .radioBox li label {
            display: block;
            font-family: 'Noto Sans JP',Meiryo,"メイリオ";
            font-weight: 500;
            text-align: center;
            text-decoration: none;
            line-height: 40px;
            background: #F3F3F3;
        }
        #simulation .radioBox li input[type="radio"]:checked + label {
            color: #FFFFFF;
            border: none;
            background: #003399;
        }

/* セレクトボックス設定　
-------------------------------------------------- */
#simulation .selectBox {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    height: 40px;
    border-radius: 4px;
	border: 1px solid #CCC;
    background: url("../image/simulation/icon_select.png") 94% center no-repeat #F3F3F3;
	background-size: 9px auto;
}
    #simulation .selectBox label {
        position: absolute;
        top:10px;
        left: 20px;
    }
        #simulation .selectBox select {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
            font-size: 16px;
            -ms-filter: "alpha(opacity=0)";
            -webkit-appearance:none;
            -moz-appearance: none;
            appearance: none;
            cursor: pointer;
        }

/*結果表示ボタン*/
#simulation #go {
	width: 300px;
	margin: 0 auto 40px;
	line-height: 55px;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-size: 18px;
	font-weight: 500;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	background: #003399;
	-webkit-appearance:none;
    -moz-appearance: none;
    appearance: none;
}
#simulation #go:hover {
	opacity: 0.6;
}
#simulation #go[disabled] {
	opacity: 0.6;
}
#simulation #go[disabled]:hover {
	opacity: 0.6;
}
	#simulation #go a {
		display: block;
		color: #FFFFFF;
	}
	#simulation #go[disabled]:hover a {
		cursor: default;
	}
#simulation #go + aside p {
	position: relative;
	padding-left: 1.2em;
	text-align: left;
	word-break: normal;
}
#simulation #go + aside p:before {
	content: '※';
	position: absolute;
	left: 0;
}

/* --------------------------------------------------
    結果画面
-------------------------------------------------- */
#pageResult {
	margin-top: -140px;
	/*padding-top: 140px;*/
}
#pageResult h2 {
	margin-bottom: 10px;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-weight: 700;
	font-size: 15px;
	text-align: center;
}
	#pageResult h2 em {
		display: block;
		font-size: 40px;
		color: #003399;
	}
#pageResult h3 {
	margin-bottom: 15px;
	padding-left: 40px;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-weight: 700;
	font-size: 24px;
	color: #003399;
}
#simulation #pageResult .topBox {
	margin-bottom: 40px;
	padding: 10px 40px;
	text-align: center;
	border: 3px solid #CCC;
	background: #FFFFFF;
}
#pageResult .topBox > div {
	overflow: hidden;
	position: relative;
	text-align: left;
	border-bottom: 1px solid #DDDDDD;
}
#pageResult .topBox > div .detailBox {
	float: left;
	display: table;
	width: 420px;
	padding: 10px 0;
}
	#pageResult .topBox > div .detailBox div {
		display: table-cell;
		width: 120px;
		padding-right: 30px;
	}
	#pageResult .topBox > div .detailBox p {
		display: table-cell;
		width: 300px;
		font-size: 16px;
		vertical-align: middle;
	}
		#pageResult .topBox > div .detailBox p span {
			text-indent: -4em;
			padding-left: 4em;
			display: inline-block;
		}

#pageResult .topBox > div .setting {
	float: right;
	width: 300px;
	margin-right: 120px;
	font-size: 14px;
}
	#pageResult .topBox > div .setting dl {
		display: table;
		width: 100%;
	}
	#pageResult .topBox > div .setting dl + dl {
		border-top: 1px solid #DDDDDD;
	}
	#pageResult .topBox > div .setting dl > * {
		display: table-cell;
		padding: 3px 0;
	}
	#pageResult .topBox > div .setting dl dt {
		width: 128px;
	}
	#pageResult .topBox > div .setting dl dd {
		position: relative;
	}
	#pageResult .topBox > div .setting dl dd:before {
		content: ':';
		position: absolute;
		left: -10px;
	}
	/*条件変更*/
	#pageResult .topBox > div .back button {
		position: absolute;
		top: 20px;
		right: 0;
		width: 100px;
		line-height: 35px;
		font-weight: 400;
		font-size: 12px;
	}
	#pageResult .topBox ul {
		overflow: hidden;
		width: 720px;
		margin: 0 auto;
	}
		#pageResult .topBox ul li {
			float: left;
			width: 320px;
			padding: 10px 0;
			font-size: 15px;
			font-weight: bold;
			text-align: left;
		}
		#pageResult .topBox ul li + li {
			float: right;
		}
			#pageResult .topBox ul li dl {
				display: table;
				width: 100%;
			}
				#pageResult .topBox ul li dl > * {
					display: table-cell;
					vertical-align: middle;
				}
				#pageResult .topBox ul li dl dt {
					width: 120px;
				}
				#pageResult .topBox ul li dl dd span {
					position: relative;
				}
				#pageResult .topBox ul li dl dd input {
					display: inline-block;
					vertical-align: middle;
				}
				#pageResult .topBox ul li dl dd input[type="tel"] {
					position: relative;
					width: 100px;
					padding-right: 35px;
				}
				#pageResult .topBox ul li dl dd input[type="button"] {
					width: 40px;
					height: 40px;
					border: 0;
					-webkit-appearance:none;
				    -moz-appearance: none;
				    appearance: none;
				}
				#pageResult .topBox ul li dl dd .minus1 {
					background: url("../image/simulation/btn_minus_int.png") center no-repeat;
					background-size: 40px auto;
				}
				#pageResult .topBox ul li dl dd .minus1 + span:before {
					content: '円';
					position: absolute;
					top: 0;
					right: 20px;
					bottom:0;
					margin: auto 0;
					line-height: 1.4;
					z-index: 1;
				}
				#pageResult .topBox ul li dl dd .plus1 {
					background: url("../image/simulation/btn_plus_int.png") center no-repeat;
					background-size: 40px auto;
				}
				#pageResult .topBox ul li dl dd .minus2 {
					background: url("../image/simulation/btn_minus_float.png") center no-repeat;
					background-size: 40px auto;
				}
				#pageResult .topBox ul li dl dd .minus2 + span:before {
					content: '%';
					position: absolute;
					top: 0;
					right: 20px;
					bottom:0;
					margin: auto 0;
					line-height: 1.4;
					z-index: 1;
				}
				#pageResult .topBox ul li dl dd .plus2 {
					background: url("../image/simulation/btn_plus_float.png") center no-repeat;
					background-size: 40px auto;
				}
/*20年後の税制メリット*/
#pageResult .ttlMerit {
	background: url("../image/simulation/ttl_icon_merit.png") left center no-repeat;
	background-size: 25px auto;
}
#pageResult .ttlMerit + .sub {
	margin-bottom: 40px;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-weight: 700;
	font-size: 15px;
	text-align: center;
	border: 3px solid #CCC;
	background: #FFFFFF;
}
	#pageResult .ttlMerit + .sub em {
		display: inline-block;
		margin: 0 15px;
		font-size: 36px;
		color: #E70202;
		vertical-align: -7px;
	}
/* グラフ */
#pageResult .chartBox {
	margin-bottom: 40px;
	padding: 20px;
	background: #FFFFFF;
}
#pageResult .chartBox .dispTop {
	overflow: hidden;
	margin-bottom: 20px;
}
	#pageResult .chartBox .dispTop p:first-child {
		float: left;
	}
	#pageResult .chartBox .dispTop p:nth-child(2) {
		float: right;
	}
.chart {
	/*position: relative;
	height: 360px;*/
}
#chart {
	/*width: 100%;
	height: 360px;*/
}

/* グラフ凡例 */
#legend {
	width: 100%;
	max-width: 600px;
	margin: 35px auto 0;
}
	#legend li {
		display: inline-block;
		padding-left: 50px;
		margin-right: 20px;
		position: relative;
	}
	#legend li:last-child {
		margin-right: 0;
	}
	#legend li:before {
		display: inline-block;
		content: "";
		width: 100%;
		max-width: 44px;
		height: 15px;
		box-sizing: border-box;
		position: absolute;
		left: 0;
	}
	/* 拠出時の優遇額累計 */
	#legend li.lineRed:before,
	#legend li.lineBlue:before {
		top: 6px;
		height: 3px;
	}

	/* 運用額 */
	#legend li.barRed:before {
		background-color: rgba(255,131,108,1);
		border: solid 3px #EB6877;
	}
	/* 投資額 */
	#legend li.barGray:before {
		background-color: rgba(231,231,231,1);
		border: solid 3px #DDD;
	}
	/* 拠出時の優遇額累計 */
	#legend li.lineRed:before {
		background-color: #EB6877;
	}
	/* 運用時の非課税額累計 */
	#legend li.lineBlue:before {
		background-color: #3F84E1;
	}

/*iDeCo 3つの税制優遇*/
#pageResult .ttlTax {
	background: url("../image/simulation/ttl_icon_tax.png") left center no-repeat;
	background-size: 23px auto;
}
#pageResult .explain {
	margin-bottom: 40px;
	padding: 30px 40px;
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-weight: 500;
	font-size: 15px;
	border: 3px solid #CCC;
	background: #FFFFFF;
}
#pageResult .explain ol > li {
	position: relative;
}
#pageResult .explain ol > li + li {
	margin-top: 40px;
}
#pageResult .explain ol > li p {
	display: inline-block;
	margin-bottom: 20px;
	font-size: 24px;
}
	#pageResult .explain ol > li p em {
		display: inline-block;
		margin-right: 20px;
		font-size: 30px;
		color: #003399;
		font-weight: 700;
		line-height: 40px;
		vertical-align: bottom;
	}
	#pageResult .explain ol > li p strong {
		display: inline-block;
		font-weight: 700;
		color: #003399;
		border-bottom: 3px solid #e8db00;
	}
	#pageResult .explain ol > li aside p {
		margin: 5px 0 0;
		font-size: 15px;
		font-weight: 400;
	}
	#pageResult .explain ol > li > span {
		display: inline-block;
		width: 24px;
		margin-left: 10px;
		line-height: 40px;
		vertical-align: top;
		cursor: pointer;
	}
	#pageResult .explain ul {
		display: table;
		width: 100%;
		border: 1px solid #CCCCCC;
	}
		#pageResult .explain ul li {
			display: table-cell;
			width: 50%;
			height: 60px;
			padding: 10px;
			text-align: center;
			vertical-align: middle;
			box-sizing: border-box;
			letter-spacing: 0.02em;
			line-height: 1.3;
			font-weight: 400;
		}
		#pageResult .explain ul .dispTreat.hide {
			display: none;
		}
		#pageResult .explain ul li + li {
			border-left: 1px solid #CCCCCC;
		}
			#pageResult .explain ul li span:not(.dspOperationalYears) {
				display: inline-block;
				margin-left: 15px;
				font-size: 24px;
				font-weight: 700;
			}

			#pageResult .explain ul li strong {
				display: inline-block;
				margin: 0 10px;
				font-size: 30px;
				font-weight: 700;
				color: #E70202;
				vertical-align: -4px;
				letter-spacing: 0.002em;
			}
			#pageResult .explain ul li em {
				color: #E70202;
			}
	#pageResult .explain ul #noTreat {
		display: none;
		width: 100%;
		height: auto;
		padding: 20px 10px;
	}

#pageResult .explain ol + p {
	margin-top: 25px;
	text-align: center;
}

/* 「運用益も非課税で再投資されます」の高さ調整 */
#pageResult .explain ol > li:first-child + li li {
	height: 90px;
}

/*サイトへ*/
#pageResult .btnLink {
	position: relative;
	width: 400px;
	margin: 0 auto 20px;
	
	font-family: 'Noto Sans JP',Meiryo,"メイリオ";
	font-size: 24px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 1.2;
	text-align: center;
	border-radius: 6px;
	background: #003399;
}
#pageResult .btnLink:hover {
	opacity: 0.6;
}
	#pageResult .btnLink a {
		display: block;
		padding: 25px 0;
		color: #FFFFFF;
	}
	#pageResult .btnLink a:after {
		content: "";
		position: relative;
		top: -4px;
		display: inline-block;
		vertical-align: middle;
		margin: 0 0 0 10px;
		width: 20px;
		height: 20px;
		background: url(../image/common/icon_target_white.png) 50% 50% no-repeat;
	}
/*前の画面に戻る*/
#pageResult .back {
	width: 180px;
	font-size: 14px;
	line-height: 50px;
	background: url("../image/simulation/btn_back_arrow.png") 10px center no-repeat #C1C8D1;
	background-size: 5px auto;
}
#pageResult .back:hover {
	opacity: 0.6;
}
	#pageResult .back a {
		display: block;
	}

/* note */
#pageResult .note {
	margin: 60px 0 0;
}