@charset "Shift_JIS";
/* CSS Document */

/*===================================================
    画面用CSS
===================================================*/

/*//////////////////////////////////////////////////
    Base layout(PC)
///////////////////////////////////////////////////*/
header:before,
header:after {
    height: 135px;
}
header:before {
	width: 10%;
}
header:after {
	width: 30%;
}
article {
	margin: 35px 0 0 0;
}
	article > .contWrap {
		padding: 40px 10px;
	}
.ttl01 {
	font-size: 20px;
}
.ttl01 + p {
	text-align: left;
}
.pcBreak {
	display: none;
}

/*//////////////////////////////////////////////////
    個人型確定拠出年金（iDeCo）への移換手続きの方法
///////////////////////////////////////////////////*/
#personal .btnList li {
	display: block;
	width: 100%;
}
#personal .btnList li + li {
	margin: 10px 0 0 0;
}
#personal section {
	margin-top: 0;
	padding-top: 0;
}
#personal section h3 {
	margin-bottom: 20px;
}
#personal section h3 span {
	display: block;
}
#personal section h3 + ol > li {
	padding: 20px 15px;
}
#personal section h3 + ol > li + li {
	margin: 35px 0 0 0;
}
/* 移換手続きの流れ
-------------------------------------------------- */
#personal #secFlow {
	margin-bottom: 30px;
}
#personal .flowList {
	margin-bottom: 40px;
}
#personal #secFlow .flowList .imgLeftBox {
	float: none;
	width: 90px;
	height: 90px;
	min-height: auto;
	margin: 0 auto 15px;
}
	#personal #secFlow .flowList .imgLeftBox .iconList li {
		width: 35px;
		opacity: 1;
	}
	#personal #secFlow .flowList .imgLeftBox .iconList li:first-child {
		position: absolute;
		top: 12px;
		left: 27px;
	}
	#personal #secFlow .flowList .imgLeftBox .iconList li:nth-child(2){
		position: absolute;
		top: 52px;
		left: 8px;
		margin: 0 auto;
	}
	#personal #secFlow .flowList .imgLeftBox .iconList li:nth-child(3){
		width: 30px;
		position: absolute;
		top: 48px;
		right: 8px;
	}
	#personal #secFlow .flowList .imgLeftBox .person01 {
		width: 56px;
		margin: 0 auto;
		padding: 10px 4px 0 0;
		box-sizing: content-box;
	}
	#personal #secFlow .flowList .imgLeftBox .phone {
		position: absolute;
		top: 49px;
		right: 15px;
		width: 24px;
		opacity: 1;
	}
	#personal #secFlow .flowList .imgLeftBox .pc {
		width: 50px;
		margin: 0 auto;
		padding: 20px 10px 0 0;
		box-sizing: content-box;
	}
	#personal #secFlow .flowList .imgLeftBox .document {
		position: absolute;
		top: 40px;
		right: 10px;
		width: 27px;
		opacity: 1;
	}
	#personal #secFlow .flowList .imgLeftBox .building {
		width: 38px;
		margin: 0 auto;
		padding: 28px 18px 0 0;
		box-sizing: content-box;
	}
	#personal #secFlow .flowList .imgLeftBox .document01 {
		position: absolute;
		bottom: 17px;
		right: 10px;
		width: 34px;
		opacity: 1;
	}
	#personal #secFlow .flowList .imgLeftBox .person02 {
		width: 62px;
		margin: 0 auto;
		padding: 10px 10px 0 0;
		box-sizing: content-box;
	}
	#personal #secFlow .flowList .imgLeftBox .document02 {
		position: absolute;
		bottom: 5px;
		right: 5px;
		width: 33px;
		opacity: 1;
	}
#personal #secFlow .flowList .rightBox {
	float: none;
	width:100%;
	max-width: 100%;
}
	#personal #secFlow .flowList .rightBox > dl > dt {
		margin-bottom: 10px;
	}
	#personal #secFlow .flowList .rightBox > dl > dd {
		padding: 0;
	}

#personal #secFlow .flowList li:not(:last-child) h4 {
	display: block;
	line-height: 1;
	margin-bottom: 15px;
}
	#personal #secFlow .flowList h4 span {
		display: block;
		width: 60px;
		margin: 0 0 20px 0;
		font-size: 12px;
		line-height: 25px;
	}

#personal #secFlow .flowList #step1 > dl > dd > p:first-child:not(:last-child) {
	margin-bottom: 15px;
	line-height: 1.5;
}

#personal #secFlow .annotationBox li dt {
	display: block;
}

#personal #secFlow .annotationBox li dd {
	position: relative;
	display: block;
	padding-left: 1em;
}

	#personal #secFlow .annotationBox li dd::before {
		position: absolute;
		top: 0;
		left: 0;
		padding: 0;
	}

/*----------STEP1-----------*/
#personal #secFlow #step1 em {
	display: inline;
}

/*----------STEP2-----------*/
#personal #secFlow .flowList #step2 > dl > dd {
	padding: 0;
}

#personal #secFlow .flowList #step2 > dl > dd > p:first-child {
	padding: 0;
}

#personal #secFlow .flowList #step2 .reqBox .linkRequest {
	width: 100%;
	margin-bottom: 5px;
	box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
}

#personal #secFlow .flowList #step2 .reqBox .linkRequest .after {
	display: none;
}
#personal #secFlow .flowList #step2 .reqBox .linkRequest .before {
	width: 100%;
	background: url("../img/common/icon_target.png") right 10px top 10px no-repeat;
	background-size: 10px auto;
	font-size: 16px;
	letter-spacing: .04em;
	padding: 20px 0;
}

/*----------GOAL-----------*/
#personal #secFlow .flowList > li:last-child h4 {
	margin: -37px auto 20px;
	width: 250px;
	height: 34px;
	border-radius: 22px;
	font-size: 16px;
	line-height: 34px;
	letter-spacing: 0;
}

#personal #secFlow .flowList #goal > dl > dd {
	padding: 0;
}

#personal #secFlow .flowList #goal .docBox {
	display: block;
}

#personal #secFlow .flowList #goal .docBox .annotationBox {
	width: 100%;
}
#personal #secFlow .flowList #goal .docBox .annotationBox:not(:last-child) {
	margin-bottom: 10px;
}

#personal #secFlow .flowList #goal .docBox .annotationBox:first-child li:nth-child(2) {
	letter-spacing: -.04em;
}

#personal #secFlow .flowList #goal .cautionBox dt {
	padding: 27px 0 0;
	margin-bottom: 15px;
	width: 100%;
	background-position: top 0 center;
	text-align: center;
	line-height: 1;
}


/* 移換手続きにおけるご注意事項
-------------------------------------------------- */
#personal #secCaution h3 + ol {
	margin-bottom: 20px;
}
/*お手続き期限*/
#personal #secCaution #limitBox {
	padding: 0;
}
#personal #secCaution #limitBox .limitTxt {
	margin: 10px 0 15px;
	font-size: 14px;
}
#personal #secCaution #limitBox .docBox {
	margin-bottom: 10px;
	padding: 10px 5px;
}
	#personal #secCaution #limitBox .docBox p + p {
		padding: 0 10px;
	}
#personal #secCaution #limitBox > dl {
	margin-top: 20px;
}
	#personal #secCaution #limitBox > dl > dd {
		padding: 0;
	}
#personal #secCaution #limitBox .cautionBox {
	padding: 10px;
}
/*お手続きにかかる手数料*/
#personal #secCaution #commission {
	padding: 0;
}
#personal #secCaution #commission .ttl {
	padding-left: 1em;
}
	#personal #secCaution #commission .ttl span {
		left: 0;
	}

#personal #secCaution #commission table {
	float: none;
	width: 100%;
	font-size: 13px;
}
#personal #secCaution #commission table + table {
	margin-top: 10px;
}
	#personal #secCaution #commission table th {
		width: calc(100% / 3);
		vertical-align: middle;
		font-size: 13px;
	}
	#personal #secCaution #commission table td span + span {
		display: block;
	}
#secCaution ol + .cautionBox dt {
	display: block;
	margin-bottom: 5px;
	padding: 25px 0 0 0;
	text-align: center;
	background-position: center top;
}
#personal #secCaution #commission table td {
	padding: 8px
}
#personal #secCaution #commission table td.number {
	text-align: right;
	padding-right: 20px;
	font-size: 18px;
}
#personal #secCaution #commission table tr:first-child {
	font-size: 16px;
}
#personal #secCaution #commission table tr:not(:first-child) th {
	line-height: 70px;
}
#personal #secCaution #commission table tr:not(:first-child) td {
	vertical-align: middle;
}

/*//////////////////////////////////////////////////
    自動移換されてしまった方へ
///////////////////////////////////////////////////*/
#portability {
	margin: 35px 0 20px 0;
}
#portability .contWrap {
	padding-bottom: 20px;
}
#portability .ttl01 + p {
	margin-bottom: 15px;
}
#portability .exception {
	margin: 0 auto 20px;
	padding: 20px 10px;
}
#portability .portabilityCnt h3 {
	margin-bottom: 20px;
}
#portability .portabilityCnt section {
	padding: 20px 10px;
}
#portability .portabilityCnt section + section {
	margin-top: 15px;
}
#portability .portabilityCnt .topCnt {
	margin-bottom: 85px;
	padding: 15px 8px;
}
	#portability .portabilityCnt .topCnt .listCase {
		margin: 0 auto 25px;
	}
		#portability .portabilityCnt .topCnt .listCase li {
			float: none;
			width: 100%;
			font-size: 16px;
		}
		#portability .portabilityCnt .topCnt .listCase li + li {
			margin: 20px 0 0 0;
		}
			#portability .portabilityCnt .topCnt .listCase li img {
				display: inline-block;
				width: 42%;
			}
			#portability .portabilityCnt .topCnt .listCase li p {
				display: inline-block;
				width: 55%;
				padding: 2%;
				vertical-align: middle;
			}
				#portability .portabilityCnt .topCnt .listCase li p em {
					line-height: 16px;
				}
	#portability .portabilityCnt .topCnt .caseResult {
		margin: 0 auto 15px;
		border: none;
	}
		#portability .portabilityCnt .topCnt .caseResult dt {
			width: 90%;
			margin: 0 auto 10px;
		}
		#portability .portabilityCnt .topCnt .caseResult dd {
			width: 100%;
			margin: 0 auto;
		}
			#portability .portabilityCnt .topCnt .caseResult dd ul {
				padding: 0;
			}
	#portability .portabilityCnt .topCnt .caseMsg {
		margin: 0 auto -90px;
		padding: 15px 8px 80px;
	}
	#portability .portabilityCnt .topCnt .caseMsg:before {
		content: '';
		position: absolute;
		top: auto;
		left: -20px;
		bottom: 0;
		width: 60px;
		height: 69px;
		background: url("../img/portability/case_img_ideco_left.png") no-repeat;
		background-size: 60px auto;
	}
	#portability .portabilityCnt .topCnt .caseMsg:after {
		background: none;
	}
		#portability .portabilityCnt .topCnt .caseMsg p {
			max-width: 400px;
			padding: 0 4%;
			font-size: 20px;
			opacity: 1 !important;
		}
		#portability .portabilityCnt .topCnt .caseMsg p:before {
			left: -10px;
			top: auto;
			bottom: 5px;
		}
		#portability .portabilityCnt .topCnt .caseMsg p:after {
			right: -10px;
			top: auto;
			bottom: 5px;
		}
		#portability .portabilityCnt .topCnt .caseMsg dd {
			padding: 0 0 0 15%;
			text-align: left;
		}
/*自動移換後のお手続きかんたんチェック表*/
#portability #pcCheck,
#portability #pcResultList {
	display: none;
}
#portability #smtCheck {
	display: block;
}
	#portability #smtCheck > div {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 10px 10px 15px;
		border-radius: 4px;
		border: 2px solid #eadeaf;
		background: #ffffff;
		min-height: 400px;
	}
	#portability #smtCheck button.navi {
		display: block;
		width: 100%;
		max-width: 220px;
		margin: auto auto 0;
		font-size: 14px;
		line-height: 50px;
		color: #FFFFFF;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		background:#C1C8D1;
		-webkit-appearance:none;
	    -moz-appearance: none;
	    appearance: none;
	}
	#portability #page1 button.navi,
	#portability #page2 button.navi,
	#portability #pageResult button.navi {
		background: #cb2d2d;
	}
	#portability #smtCheck button.yes {
		background: #76caf0;
	}
	#portability #smtCheck button.no {
		background: #fa7676;
	}
	#portability #smtCheck button.back {
		margin: 0 auto 10px 0;
		padding-left: 14px;
		font-size: 14px;
		color: #5d5d5d;
		cursor: pointer;
		border: none;
		background: url("../img/common/icon_arrow_back.png") left 5px no-repeat #ffffff;
		background-size: 7px;
		-webkit-appearance:none;
	    -moz-appearance: none;
	    appearance: none;
	}
	#portability #page1 .ttl {
		width: 220px;
		margin: 40px auto 30px;
		padding-left: 50px;
		font-size: 17px;
		font-weight: bold;
		color: #cb2d2d;
		line-height: 1.4;
		background: url("../img/portability/smt/icon_note.png") left center no-repeat;
		background-size: 40px auto;
	}
	#portability #page1 ul {
		display: flex;
		flex-wrap: wrap;
		max-width: 220px;
		margin: 0 auto;
		align-items: flex-end;
	}
		#portability #page1 ul li {
			width: 50%;
		}
		#portability #page1 ul li:nth-child(n+3) {
			margin-top: 20px;
		}
#portability #page2 .jobList {
	width: 100%;
}
#portability #page2 .jobList li {
	position: relative;
	display: table;
	width: 100%;
	height: 60px;
	padding: 0 10px;
	font-size: 15px;
	text-align: center;
	border-radius: 4px;
	border: 2px solid #faa6a6;
	background: #ffffff;
}
#portability #page2 .jobList li.active {
	color: #ffffff;
	background: #faa6a6;
}
#portability #page2 .jobList li + li {
	margin-top: 10px;
}
	#portability #page2 .jobList li > p {
		display: table-cell;
		width: 60px;
		vertical-align: middle;
	}
	#portability #page2 .jobList li > div {
		display: table-cell;
		padding-left: 5%;
		font-weight: bold;
		vertical-align: middle;
		text-align: left;
		line-height: 1.2;
	}
		#portability #page2 .jobList li > div aside p {
			margin-top: 5px;
			font-size: 10px;
			font-weight: normal;
		}
#portability #page2 .jobList input[type="radio"] {
    position: absolute;
    left: 0;
    top:0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    cursor: pointer;
}
#portability #page2 .navi[disabled] {
	cursor: default;
	opacity: 0.6;
}
#portability #page3 .ttl {
	margin: 80px auto 0;
	font-size: 15px;
	font-weight: bold;
	text-align:center;
}
#portability #page4 .ttl,
#portability #page5 .ttl {
	margin: 30px auto;
	padding: 0 10px;
	font-size: 15px;
	font-weight: bold;
	text-align:center;
}
#portability .ttl + aside {
	margin-bottom: 80px;
	padding: 0 10px;
}
#portability .listBox {
	padding: 0 10px;
}
	#portability .listBox li {
		position: relative;
		padding-left: 10px;
		font-size: 12px;
		line-height: 1.4;
	}
	#portability .listBox li:before {
		content: "";
		position: absolute;
		top: 7px;
		left: 0;
		width: 4px;
		height: 4px;
		border-radius: 50%;
		background-color: #5f728a;
	}
#portability .choiceList {
	margin-top: auto;
	width: 100%;
	max-width: 220px;
}
#portability .choiceList li + li {
	margin-top: 10px;
}
	#portability #pageResult dl dt {
		margin-bottom: 10px;
		font-size: 17px;
		color: #cb2d2d;
		font-weight: bold;
		text-align: center;
	}
	#portability #pageResult dl dd {
		padding: 10px;
		border-radius: 4px;
		background: #eeeeee;
	}
		#portability #pageResult dl dd > div {
			display: table;
			width: 100%;
			height: 40px;
			margin-bottom: 5px;
			text-align: center;
			background: #ffffff;
		}
		#portability #pageResult dl dd > div.hide {
			display: none;
		}
			#portability #pageResult dl dd > div p {
				display: table-cell;
				font-size: 20px;
				font-weight: bold;
				color: #c69f00;
				vertical-align: middle;
				line-height: 0.6;
			}
				#portability #pageResult dl dd > div p span {
					font-size: 11px;
					font-weight: normal;
				}
	#portability #pageResult dl dd table {
		width: 100%;
		border-top: 1px solid #b4c5cc;
		border-right: 1px solid #b4c5cc;
		border-left: 1px solid #b4c5cc;
	}
		#portability #pageResult dl dd table tr {
			border-bottom: 1px solid #b4c5cc;
		}
		#portability #pageResult dl dd table tr.hide {
			display: none;
		}
		#portability #pageResult dl dd table th {
			width: 30px;
			padding: 10px;
			font-size: 16px;
			font-weight: bold;
			color: #5f728a;
			text-align: center;
			vertical-align: middle;
			border-right: 1px solid #b4c5cc;
			background: #eeeeee;
		}
		#portability #pageResult dl dd table td {
			padding: 5px 10px;
			font-weight: bold;
			vertical-align: middle;
			background: #ffffff;
		}
#portability #pageResult dl + p {
	margin: 5px 0 10px;
	font-weight: bold;
}
#portability .checkTxt {
	overflow: hidden;
	margin: 10px 0;
}
/*印刷用画面を開く*/
#portability .checkTxt aside,
#portability .checkTxt .linkPrint {
	float: none;
}
#portability .checkTxt .linkPrint {
	margin-top: 15px;
	text-align: right;
}
#portability .attention aside p span {
	display: block;
	margin: 0;
}
#portability .contactBox {
	margin-bottom: 24px;
}
#portability .contactBox dd {
	text-align: left;
}
#portability .contactBox .tel {
	margin-top: 16px;
	text-align: center;
	font-size: 25px;
}
#portability .contactBox .info {
	margin-top: 8px;
	margin-left: 0;
}
#portability .contactBox .info p {
	text-align: center;
}
#portability .contactBox + .linkRequest {
	width: 220px;
	font-size: 14px;
	line-height: 1.3;
}
	#portability .contactBox + .linkRequest a {
		background: url("../img/common/icon_target.png") 93% center no-repeat #5f728a;
   		background-size: 10px auto;
	}
		#portability .contactBox + .linkRequest a br {
			display: block;
		}
/*自動移換にかかる手数料*/
#portability .portabilityCnt .commissionList h4 + dl dt {
	display: block;
	margin: 0 0 10px 0;
	padding-top: 0;
}
#portability .portabilityCnt .commissionList h4 + dl dd {
	display: block;
}
#portability .portabilityCnt .commissionList .linkRequest {
	width: 100%;
	max-width: 250px;
	margin: 0 auto 5px;
}
#portability .portabilityCnt .commissionList .linkRequest + p {
	width: 100%;
	max-width: 250px;
	margin: 0 auto;
}
#portability .portabilityCnt .commissionList ol {
	margin: -10px 0 10px 0;
}
	#portability .portabilityCnt .commissionList ol li {
		float: none;
		width: 100%;
		margin: 20px 0 0 0;
		padding: 15px;
	}
	#portability .portabilityCnt .commissionList ol li:nth-child(3),
	#portability .portabilityCnt .commissionList ol li:nth-child(4) {
		min-height: 0;
	}
#portability ~ footer .contactBox {
	display: none;
}
/* --------------------------------------------------
    モーダルウインドウ
-------------------------------------------------- */
#portability .modalContent {
	height: 93%;
	padding:35px 15px 30px;
}
	#portability .modalContent > div {
		margin: 0 auto 25px;
		padding:0;
	}
	#portability .modalContent .leftBox {
		float: none;
		width: 100%;
		margin-bottom: 20px;
		padding-top: 0;
	}
	#portability .modalContent .rightBox {
		float: none;
		width: 130px;
		margin: 0 auto;
	}
/*//////////////////////////////////////////////////
    脱退一時金の請求
///////////////////////////////////////////////////*/
#secession > .contWrap > section {
	padding: 20px 15px;
}
#secession > .contWrap > section + section {
	margin-top: 25px;
}
#secession .cntBox {
	padding: 0;
}
#secession section:first-of-type .cntBox:first-of-type {
	margin-bottom: 20px;
}
#secession .cntBox > dt:before {
	top:4px;
	width: 18px;
	height: 18px;
}
#secession .cntBox dl dt {
	margin-left: 0;
}
#secession .cntBox dl dt {
	margin-bottom: 1px;
}
#secession .cntBox dl dt ~ dt {
	margin-top: 10px;
}
#secession .cntBox > dd {
	padding: 0;
}
#secession .cntBox dl {
	padding-left: 0;
}
#secession .cntBox > dd ul li {
	text-align: justify;
}
#secession .cntBox + .cautionBox {
	width: calc(100% - 10px);
	margin: 20px auto 20px;
}
#secession .cntBox + .cautionBox dt {
	padding: 27px 0 0;
	margin-bottom: 15px;
	width: 100%;
	background-position: top 0 center;
	text-align: center;
	line-height: 1;
}
#secession .cautionBox + p {
	width: calc(100% - 10px);
	margin: 0 auto;
	padding-left:  1em;
	position: relative;
	line-height: 1.4;
}
#secession .cautionBox + p::before {
	position: absolute;
	top: 0;
	left: 0;
}

/*//////////////////////////////////////////////////
    よくある質問
///////////////////////////////////////////////////*/
#faq .btnList li {
	display: block;
	width: 100%;
}
#faq .btnList li + li {
	margin: 10px 0 0 0;
}
#faq section {
	margin-top: 0;
	padding-top: 0;
}
#faq #secFaq {
	margin-bottom: 20px;
}
#faq #secFaq h3 + div > dl > dt,
#faq #secFaq h3 + div > dl > dd {
	padding-left: 30px;
}
#faq #secFaq h3 + div > dl > dd > div {
	padding: 10px;
}
#faq .tbl01 {
	width: 100%;
}
	#faq .tbl01 th,
	#faq .tbl01 td {
		padding: 5px 0;
		font-size: 12px;
	}
#faq .bnr {
	width: 100%;
}
#faq .bnr + p {
	font-size: 12px;
	width: 100%;
}
#faq .commission table {
	float: none;
	width: 100%;
	font-size: 13px;
}
#faq .commission table + table {
	margin-top: 10px;
}
	#faq .commission table th {
		width: calc(100% / 3);
		vertical-align: middle;
		font-size: 13px;
	}
	#faq .commission table td span + span {
		display: block;
	}
	#faq .commission table td {
		padding: 8px
	}
	#faq .commission table td.number {
		text-align: right;
		padding-right: 20px;
		font-size: 18px;
	}
	#faq .commission table tr:first-child {
		font-size: 16px;
	}
	#faq .commission table tr:not(:first-child) th {
		line-height: 70px;
	}
	#faq .commission table tr:not(:first-child) td {
		vertical-align: middle;
	}
#faq .flowList {
	padding: 10px;
	font-size: 12px;
	background:#fafafa;
}
	#faq .flowList > li:nth-child(odd) {
		position: relative;
		padding: 10px;
		background: #ffffff;
	}
	#faq .flowList > li:nth-child(1):before,
	#faq .flowList > li:nth-child(3):before {
		content: '';
		position: absolute;
		left:5px;
		bottom: -55px;
		width: 20px;
		height: 55px;
		background: url("../img/faq/smt/fllow_arrow.png") no-repeat;
		background-size: 20px auto;
	}
	#faq .flowList > li:nth-child(even) {
		display: table;
		width: 131px;
		height: 36px;
		margin: 10px 0 10px 28px;
		background: url("../img/faq/smt/flow_balloon.png") no-repeat;
		background-size: 131px auto;
	}
		#faq .flowList > li:nth-child(even) p {
			display: table-cell;
			font-weight: bold;
			text-align: center;
			vertical-align: middle;
		}
			#faq .flowList > li:nth-child(even) p br {
				display: none;
			}
	#faq .flowList > li > div {
		position: relative;
	}
	#faq .flowList > li .job {
		position: absolute;
		top: 0;
		left: 0;
		width: 32px;
	}
	#faq .flowList > li dl dt {
		margin-bottom: 10px;
		padding-left: 40px;
		font-weight:bold;
	}
	#faq .flowList > li dl + ul,
	#faq .flowList > li dl + p {
		margin-top: 10px;
		text-align: center;
	}
		#faq .flowList > li dl + ul li {
			display: inline-block;
			width: 16px;
		}
	#faq .flowList > li dl + p img {
		width: 16px;
	}