@charset "UTF-8";

/* ▼▼▼ トップ　▼▼▼ */
/* =====================================*/

/*コンテンツ*/

.red{
	color:red;
}

.bol{
	font-weight: bold;
}

.bol_red{
    font-weight: bold;
	color:red;
}
.blue{
	color:blue;
}

.clr_000099 {
	color:#000099;
}

.clr_000080 {
	color:#000080;
}

.nomal{
	font-size: 100%;
}


.small80{
	font-size: 80%;
}
.small90{
	font-size: 90%;
}
.large{
	font-size: 120%;
}

.x-large{
	font-size: 150%;
}

.large120{
	font-size: 120%;
}

.large140{
	font-size: 140%;
}

.large150{
	font-size: 150%;
}

/*文字間隔を詰める*/
.let_sp-005 {
  letter-spacing: -0.05em;
}


.margin_top05 {margin-top: 5px
}
.margin_top10 {margin-top: 10px
}
.margin_top15 {margin-top: 15px
}
.margin_top20 {margin-top: 20px
}
.margin_top30 {margin-top: 30px
}
.margin_top05_bottom05 {margin: 5px 0
}
.margin_top10_bottom10 {margin: 10px 0
}
.margin_top15_bottom15 {margin: 15px 0
}
.margin_bottom05 {margin-bottom: 5px
}
.margin_bottom10 {margin-bottom: 10px
}
.margin_bottom15 {margin-bottom: 15px
}
.margin_left01em {margin-left: 1.0em
}
.margin_left10 {margin-left: 10px
}
.margin_left15 {margin-left: 15px
}
.margin_left20 {margin-left: 20px
}
.margin_left10em {margin-left: 1.0em
}
.margin_right10 {margin-right: 10px
}
.margin_right20 {margin-right: 20px
}
.margin_left30 {margin-left: 30px
}
.margin_left10_right10 {margin: 0 10px
}
.margin_left20_right20 {margin: 0 40px
}

.padding_top05 {padding-top: 5px
}
.padding_top10 {padding-top: 10px
}
.padding_top20 {padding-top: 20px
}
.padding_bottom05 {padding-bottom: 5px
}
.padding_bottom10 {padding-bottom: 10px
}
.padding_bottom15 {padding-bottom: 15px
}
.padding_bottom20 {padding-bottom: 20px
}
.padding_left2em {padding-left: 2em
}



.center  {
    text-align:center;
}

.flex_end {
    align-items: flex-end;/* フレックスアイテムを末尾に寄せる */
}

.text-indent-10 {
    text-indent:-1.0em
}
.text-indent-05 {
    text-indent:-0.5em
}
.text-indent005 {
    text-indent:0.05em
}
.text-indent01 {
    text-indent:0.1em
}
.text-indent02 {
    text-indent:0.2em
}
.text-indent03 {
    text-indent:0.3em
}
.text-indent05 {
    text-indent:0.5em
}

.max_width200{
	max-width: 200px;
/*	margin: auto;*/
}





/* リンクの色と下線 */
.lead a{
	color: #000;
    text-decoration: underline;
	/*border-bottom: 1px solid #000; */
}
.lead a:hover{
	border-bottom: none;
	text-decoration: none;
}

.square a:hover{
	border-bottom: none;
	text-decoration: none;
}

.pdf_link  {
    text-align:center;
}

.pdf_link:before {
	content: "";
	margin: 0 4px 0 0;
	padding: 10px;
	background: url(../../new_common/img/pdf_icon.png) left center no-repeat;
}

.pdf_link a {
    color: #595960;
    text-decoration: underline;
}

/* QRコード画像 */
.qr_ig{
    display: block;
    margin: 0 auto;
    max-width: 350px;
    padding: 20px;
}

/* リスト */
.inquiry_list ul {
     padding-left: 1.4em;
}

.inquiry_list li{
    font-weight: normal;
    list-style: outside;
    list-style-type: disc;
    padding-left: 0em;
    margin-left: 0em;
    /*text-indent: -1.3em;*/
}


/*共通コンテンツの一部修正*/

/*タイトル*/
h2.title_save,h2.title_loan {
    border: 1px solid #b9b9b9;
	margin: 10px 10px 10px 10px;
    padding: 6px 5px 0 12px;
    border-left: 8px solid #006CB5;
    font-weight: bold;
    background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%);
	overflow: hidden;
}


.col_inner h3{
	margin: 10px 0 10px 0;/*h3の上部余白を10px追加*/
	padding: 0 0 2px 0;
	border-bottom: 1px #000 solid;
}

.col_inner .magin_top0 {
	margin: 0 0 10px 0;/*h3の上部余白を0pxに詰める*/
	padding: 0 0 2px 0;
	border-bottom: 1px #000 solid;
}

.col_inner h3:before{
	content:"";
	margin: 0 4px 0 0;
	padding: 3px;
	background:url(../img/clo_h3_bg.png) left center no-repeat;
}


/*画像横並びの表(お問い合わせページ「個人」「法人」お問い合わせの表に利用)*/
.img_sidebyside {
        border-spacing: 10px; 
}





/* 退職予定者イメージ画像 */
.retirement_img{
    padding: 0 0 5px 0;
}

/* パソコンで見たときは"pc_imagesc"のclassがついた画像が表示される */
.pc_images {
    display: block !important;
}
.sp_images {
    display: none !important;
}


/* リンクの色と下線 */
.link a{
	color: #000;
    text-decoration: underline;
	/*border-bottom: 1px solid #000; */
}
.link a:hover{
	border-bottom: none;
	text-decoration: none;
}

.subhead {
    color: #000000;
    padding: 5px 10px;
    margin-bottom: 10px;
    /*overflow: hidden; */
    background: #ffff99
}

.subhead a{
    color: #000;
    text-decoration: underline;
}

/* 角丸ボタン（各種お手続きボタンに使用） */
a.round_button {
    border: 2px solid #000080;
	color: #000080;
    border-radius: 50px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 360px;
    padding: 10px 25px;
    transition: 0.3s ease-in-out;
    font-size: 120%;
    font-weight: bold;
}
a.round_button:hover {
    background: #000080;
    color: #FFF;
}
a.round_button:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #000080;
    border-right: 3px solid #000080;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
a.round_button:hover:after {
    border-color: #FFF;
}

/* 画像横並び PC画像は同一の高さ(相談申込に利用) */
.flex_box_same_height {
    display:flex;
}
.flex_box_same_height div {
    max-width: 50%;
    margin :  auto;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align : center ;
}
.flex_box_same_height div img{
    max-height: 130px;
    margin-bottom : 10px;
}
/*
.flex_box_same_height div #qr_img{
    max-height: 100px;
    margin-bottom : 20px;
}
*/

/* リンクボタン */
a.button01 {
    border: 2px solid #000080;
	color: #000080;
    border-radius: 50px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    width: 330px;
    padding: 10px 10px;
    transition: 0.3s ease-in-out;
    font-size: 120%;
    font-weight: bold;
}
a.button01:hover {
    background: #000080;
    color: #FFF;
}
a.button01:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #000080;
    border-right: 3px solid #000080;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
a.button01:hover:after {
    border-color: #FFF;
}


/* アスタリスクのリストが表示されるように設定 */
.asterisk li {
    list-style-type: circle;
    text-indent: -1em;
    padding-left: 1em; 
 }
.asterisk li:before {
    display: inline;
    content: "※";
}


/* ご退職に伴うお手続きの流れ フローチャート */
/*body {
  line-height: 1.25;
}*/

.retirement_flow {
        border-collapse: collapse;
        margin: 0 auto;
        padding: 0;
        table-layout: fixed; /*均等幅*/ 
        width: 100%;
        height:100%;
        /*text-align:center;*/ 
}

table tr {
  /*padding: .35em;*/
  /*border-bottom: 2px solid #fff;*/
}

.bgc_bisque{
        background: bisque;   
}

.bgc_lightyellow{
        background: lightyellow;   
}

.bgc_lightskyblue{
        background: lightskyblue;   
}

.bgc_pink{
        background: pink;   
}

.bgc_tan{
        background: tan;   
}




/*自動音声案内テーブルデザイン(pc_images)*/

.tel_voice_guidance_table_pc {
    /*margin: 20px 10px 0px 10px; */
    width:100%;
    /*margin-top: 20px; */
    border: 1px #999999 solid;
    border-collapse: collapse;
    overflow: hidden;
    word-break: break-all;/*改行*/
    /*word-wrap: break-word;*/    
}

.tel_voice_guidance_table_pc th {
    padding: 5px;
    border: 1px dimgray solid;
    /*border-collapse: collapse;*/
    /*border-top: solid 1px dimgray;*/
    min-width: 3.5em;
    overflow: hidden;
    color: #13131e;
    font-style: normal;
    font-weight: bold;
    font-size: 100%;
    text-align: center;
    word-break: break-all;
    word-wrap: break-word;
    vertical-align: top;
    background-color: #ffffb4;
}

.tel_voice_guidance_table_pc tr td:nth-of-type(1) { /* 1列目のスタイル */
    font-weight:bold;
    background-color: #ffffb4;
    text-align: center;
}
.tel_voice_guidance_table_pc tr td:nth-of-type(2) { /* 2列目のスタイル */
    font-weight:bold;
    background-color: #ffffb4;
}
.tel_voice_guidance_table_pc tr td:nth-of-type(3) { /* 3列目のスタイル */
    min-width: 4.3em;
}
.tel_voice_guidance_table_pc tr td:nth-of-type(4) { /* 4列目のスタイル */
    /*min-width: 5.5em;*/
}
.tel_voice_guidance_table_pc td {
    padding: 5px;
    border: 1px dimgray solid;
    /*border-collapse: collapse;*/
    text-align: left;
    /*font-weight:bold;*/
    vertical-align: top;
    color: black;
    background-color: white;
    /*border-top: dotted 1px #e0dccc;*/
    overflow: hidden;
    word-break: break-all;
    word-wrap: break-word;
}

.tel_voice_guidance_table_pc td a{
	color: #000;
    text-decoration: underline;
    font-weight: bold;
}




/* 定額自動送金サービス内容テーブルに※印を表示し改行時に１文字空けるように設定 */
/*.tel_voice_guidance_table_asterisk ul {
    list-style-type: none;
    padding-left: 1.3em;
    text-indent: -1.3em;
}
.tel_voice_guidance_table_asterisk li::before {
    display: inline;
    content: "※ ";
}*/




table.ex_table {
  border-collapse: collapse;
  border: 0;
}

table.ex_table td {
  border: 1px solid #222;
  padding: 3px;
}

table.ex_table td.ex_border_f {
  border-right: 15px solid #222;
}


.txt{
   text-align: left;
   font-size: .85em;
}
.price{
  text-align: right;
  color: #167F92;
  font-weight: bold;
}
.non{
  background:#fff
}






/* 下向き矢印 */

.down_arrow20 {
    width: 16px; /* 領域確保 */ 
    height: 40px; /* 領域確保 */
    position: relative;
    margin: auto;
}


.down_arrow20::before{
    content: "";
    display: block;
    position: relative;
    top: 0px;
    left: -19px;
    width: 16px;
    height: 20px;
    background: darkgray;
}
.down_arrow20::after{
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    left: -12px;
    width: 0;
    height: 0;
    border: 20px solid;
    border-color: darkgray transparent transparent transparent;
}

/* 矢印の縦棒 */
.vertical_bar {
    width: 16px; /* 領域確保 */ 
    height: 100%;  /* 領域確保 */
    position: relative;
    margin: auto;
}

.vertical_bar::before{
    content: "";
    display: block;
    position: relative;
    /*top: 1em;*/
    /*left: 12px;*/
    width: 16px;
    height: 100%;
    /*background-size:16px auto;*/
    background: darkgray;
}


.inquiry_flow table th,table td {
        /*display: block;*/    
        /*padding: 0px 0px 0px 0px;*/
        border: 0; /*px solid #fff;*/
        /*width: 25%;*/
        /*border-right: 2px solid #fff;*/
        text-align:center; 
        vertical-align:middle;
}

.inquiry_flow_resul {
        border-collapse: collapse;
        border: 0;
        table-layout: fixed;/*均等幅*/ 
        width: 100%;
        height:100%;
}

.inquiry_flow_resul td.border_right {
        border-right: 1ex solid transparent;
}



/* 退職後もご利用いただけるその他サービスについての表 */
.add_top {
    margin: 5px;
    padding: 5px; 
    background-color: gold;
    font-weight: bold;
    /*color: #ffffff;*/
    /*text-align:center;*/    
 }

.add_bot {
    margin: 5px;
    padding: 5px; 
    background-color: bisque;
    /*text-align:center;*/
 }




 
/* 電話案内ボタンを小さく表示(pc_image) */
.col_inner .tel_btn{
	max-width: 305px;
	margin: 5px auto;
}
.col_inner .tel_save_btn,
.col_inner .tel_loan_btn {
	/*max-width: 300px;*/
	margin: 5px auto;
}



/* チラシのイメージ画像 */
.flyer_ig{
    display: block;
    margin: 0 auto;
    max-width: 500px;
    padding: 10px 10px 10px 10px;
}


/* 引続きご利用される場合のご案内 */
.retirement_p{
    padding:10px;
}


/*退職される方へPDF*/
.retirement_pdf p{
	margin: 10px 0 10px 24px;
	text-indent: -24px;
    text-align: center;
}
.retirement_pdf p a{
	text-decoration: underline;
}
.retirement_pdf p:before{
	content:"";
	margin: 0 5px 0 0;
	padding: 10px;
	background:url(../../new_common/img/pdf_icon24.png) center center no-repeat;
}


/* pdfイメージ画像(PCサイズの場合最大表示を小さくする) */
.pdf_ig {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 260px; /* 最大幅 */
}
    

/* 注意書きのリストが表示されるように設定 */
.asterisk li {
    list-style-type: circle;
    text-indent: -1em;
    padding-left: 1em; 
 }
.asterisk li:before {
    display: inline;
    content: "※";
}


/* PDF箇条書き */
.inquiry_pdf_list ul li{
	/*margin: 0 0 5px; */
    margin: 5px 0 0px 24px;
	text-indent: -24px;
}
.inquiry_pdf_list ul li a{
	color: #000;
    text-decoration: underline;
	/*border-bottom: 1px solid #000; */
}
.inquiry_pdf_list ul li a:hover{
	border-bottom: none;
	text-decoration: none;
}

.inquiry_pdf_list ul li:before{
    content: "";
    margin: 0 5px 0 0;
    padding: 8px;
    background: url(../../common/images/icon_pdf.gif) center center no-repeat;
    background-size: contain;
}


/* アコーディオンメニュー */
.accordion {
    /*max-width: 500px;*/
    margin-bottom: 7px;
    border: solid 2px #000080;
    border-radius: 10px;
    padding: 0 1em 0 1em;
}

.accordion summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 1em 1em 0;
    color: #333333;
    /*font-weight: 6000;*/
    cursor: pointer;
    font-size: 130%;
    /*background: #fff;*/
    color: #000080;
    font-weight: bold;
}

.accordion summary::-webkit-details-marker {
    display: none;
}

.accordion summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #333333b3;
    border-right: 3px solid #333333b3;
    content: '';
    transition: transform .3s;
}

.accordion[open] summary::after {
    transform: rotate(225deg);
}

.accordion p {
    transform: translateY(-10px);
    opacity: 0;
    /*margin: 0;*/
    padding: 0.0em 0 0.1em 1.2em;
    /*color: #333333;*/
    transition: transform .5s, opacity .5s;
}

.accordion[open] p {
    transform: none;
    opacity: 1;
}

.accordion[open] hr {
    margin: 0 0 1em 0;
}



.col_inner .btn{
	max-width: 192px;
	margin: 20px auto 0;
}
.col_inner .btn02{
	max-width: 192px;
	margin: 10px auto 0;
}


/*入金方法の表(PCサイズ)*/
.col_inner table.inquiry_tbl{
	border-bottom:1px solid #ccc;
	margin:15px 0;
    font-size: 1em;
    width: 100%;
}
.col_inner table.inquiry_tbl th{
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
    border-right:1px solid #ccc;
	padding:6px 7px 2px 7px;
	background-color: aliceblue;
    text-align-last: justify;
    font-weight: bold;
    white-space: nowrap;/*改行禁止*/
    vertical-align: middle;
}
.col_inner table.inquiry_tbl td{
	border-top:1px solid #ccc;
	/*border-left:1px solid #ccc;*/
	border-right:1px solid #ccc;
	padding:6px 7px 2px 7px;
	text-align:left;
    vertical-align: middle;
}
.col_inner table.inquiry_tbl td img{
	float:right;
    padding:5px;
}



/*** レスポンシブテーブルデザイン ***/



/* ▼▼▼ 480px〜768px
=====================================*/
@media screen and (max-width: 768px) {	

/*メインコンテンツ*/
/*	#main{
		padding: 80px 0 0 0;
	}
	  */  

/* スマホで見たときは"sp_imagesc"のclassがついた画像が表示される */
.pc_images {
    display: none !important;
}
.sp_images {
    display: block !important;
}    

/* idリンクが固定ヘッダーでずれるのを修正 */
a.anchor {
    display: block;
    padding-top: 90px;
    margin-top: -90px;
}
    
/* キャンペーン概要の表 */
.outline th{
    width:100%;
    display:block;
    margin: 0 auto;
    border:none;
    border-radius: 3px;
}
.outline td{
    display: list-item;
    width: 100%;
    border-top: none !important;
}

/* メール送信ボタンの左右均等に表示(sp_image) */
.col_inner .mail_btn{
	max-width: 100%;
	margin: 5px auto;
}
    
/* 電話案内ボタンを小さく表示(sp_image) */
.col_inner .tel_btn{
	max-width: 48.575%;
	margin: 5px auto;
}

.col_inner .tel_save_btn,
.col_inner .tel_loan_btn{
	max-width: 300px;
	margin: 5px auto;
}

/*自動音声案内テーブルデザイン(sp_images)*/
.tel_voice_guidance_table_sp {
    /*margin: 20px 10px 0px 10px; */
    width:100%;
    /*margin-top: 20px; */
    border-right: 2px dimgray solid;
    border-left: 2px dimgray solid;
    border-bottom: 2px dimgray solid;
    border-collapse: collapse;
    overflow: hidden;
    word-break: break-all;/*改行*/
    /*word-wrap: break-word;*/    
}

.tel_voice_guidance_table_sp th {
    padding: 5px;
    border-top: 2px dimgray solid;
    border-collapse: collapse;
    /*border-top: solid 1px dimgray;*/
    /*min-width: 3.5em;*/
    overflow: hidden;
    color: black;
    font-style: normal;
    font-weight: bold;
    font-size: 120%;
    text-align: center;
    word-break: break-all;
    word-wrap: break-word;
    /*vertical-align: top;*/
    background-color: lightgray;
    width:100%;
    display:block;
    margin: 0 auto;
    /*border-top: solid 1px dimgray;*/
}


    
.tel_voice_guidance_table_sp tr td:nth-of-type(1) { /* 1列目のスタイル */
    font-size: 120%;
    font-weight:bold;
    background-color: #ffffb4;
    text-align: center;
}
.tel_voice_guidance_table_sp tr td:nth-of-type(2) { /* 2列目のスタイル */
    /*font-weight:bold;*/
    /*background-color: #ffffb4;*/
}
.tel_voice_guidance_table_sp tr td:nth-of-type(3) { /* 3列目のスタイル */
    font-weight:bold;
}

.tel_voice_guidance_table_sp td {
    padding: 5px;
    /*border: 1px dimgray solid;*/
    border-collapse: collapse;
    text-align: left;
    /*font-weight:bold;*/
    vertical-align: top;
    color: black;
    background-color: white;
    /*border-top: dotted 1px #e0dccc;*/
    overflow: hidden;
    word-break: break-all;
    word-wrap: break-word;
    display: list-item;
    width: 100%;
    /*border-top: dotted 1px #e0dccc;*/
    text-align: center;
}

.tel_voice_guidance_table_sp td a{
	color: #000;
    text-decoration: underline;
    font-weight: bold;
}   

/* 画像横並び 画像は同一の高さだが、スマホ用は同一の幅(相談申込に利用) */
.flex_box_same_height {
    display:block;
     text-align: center;
}
.flex_box_same_height div {
    max-width: 260px;
}
.flex_box_same_height div img{
    max-height: none; 
}    
    
/* キャンペーンイメージ画像(余白を設ける) */
.campaign_ig {
    padding: 0 10px 0 10px;
}

    
/* pdfイメージ画像(余白を設ける) */
.pdf_ig {
    padding: 0 10px 0 10px;
}

    
.col_inner .btn{
	max-width: 192px;
	margin: 20px auto 0;
}
.col_inner .btn02{
	max-width: 192px;
	margin: 10px auto 0;
}
    
/*入金方法の表(SPサイズ)*/
.col_inner table.inquiry_tbl{
	border-bottom:1px solid #ccc;
	margin:15px 0;
    font-size: 0.8em
}
.col_inner table.inquiry_tbl th{
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
	padding:6px 7px 2px 7px;
	background-color: aliceblue;
    text-align-last: justify;
    font-weight: bold;
    white-space: nowrap;/*改行禁止*/
    vertical-align: middle;
}
.col_inner table.inquiry_tbl td{
	border-top:1px solid #ccc;
	/*border-left:1px solid #ccc;*/
	border-right:1px solid #ccc;
	padding:6px 7px 2px 7px;
	text-align:left;
    vertical-align: middle;
}        
.col_inner table.inquiry_tbl td img{
	float:left;
    padding:5px;
}

}	
    /* end */