@charset "utf-8";

/*---------------------------------------------
kinri_rate Layout Style
---------------------------------------------*/

/*---------------------------------------------
共通
---------------------------------------------*/
.form .unit03,
.form .lead,
.form .table-default.table-form td { text-align:start; }

/*---------------------------------------------
金利相場
---------------------------------------------*/
.rate a                                       { color: white; }
.rate th a,
.rate li a,
.rate .item a                                 { color: black; }
.rate td                                      { text-align: right; }
.rate .right                                  { text-align: right; }
.rate .margin-bottom                          { margin-bottom: 40px; }
.rate .item                                   { display: flex; flex-direction: column; position: relative; padding-left: 14px; }
.rate .item:before                            { content: ""; position: absolute; top: 10px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #3eb134; }
.rate .table01                                { width: 100%; border-top: 1px solid #ccc; table-layout: fixed; border-collapse:separate }
.rate .table01 th,
.rate .table01 td                             { padding: 20px; border-bottom: 1px solid #cccccc; vertical-align: middle;}
.rate .table01 th                             { background: #f5f5f5; border-right: 1px solid #cccccc; vertical-align: top;}
.rate .table01 .head th:last-of-type          { border-right: 0 }
.rate .table01 th:first-of-type               { border-right: 1px solid #cccccc; width: 350px; text-align: left;}
.rate .table01 th                             { text-align: left;}
.rate .table01 td                             { border-right: 1px solid #cccccc; }
.rate .table01 td:last-of-type                { border-right: 0 }
.rate .table01 .head th                       { text-align: center; }
.rate .table01 + p                            { margin-top: 30px; }

.rate .table02                                { width: 100%; border-top: 1px solid #ccc; table-layout: fixed; border-collapse:separate }
.rate .table02 th,
.rate .table02 td                             { padding: 20px; border-bottom: 1px solid #cccccc; vertical-align: middle;}
.rate .table02 th                             { background: #f5f5f5; border-right: 1px solid #cccccc; vertical-align: middle; }
.rate .table02 .head th:last-of-type          { border-right: 0 }
.rate .table02 th:first-of-type               { border-right: 1px solid #cccccc; width: 350px; text-align: left;}
.rate .table02 th                             { text-align: left;}
.rate .table02 td                             { border-right: 1px solid #cccccc; }
.rate .table02 td:last-of-type                { border-right: 0 }
.rate .table02 .head th                       { text-align: center; }
.rate .table02 + p                            { margin-top: 30px; }


@media (max-width: 767px) {
.rate .mobile_table td                        { display: table-cell; }
.rate .mobile_table2 td                       { table-layout:fixed; height: 150px}
.rate .widthChange td                         { width: 30%; }

.rate .table01 th:first-of-type               { width: 30%; }
.rate .table01 th,
.rate .table01 td                             { padding: 10px; }
.rate .table01.table-style02 th,
.rate .table01.table-style02 td               { width: 100%; display: block; }
.rate .table01.table-style02 th:first-of-type { border-right: 0; }

.rate .table02 th:first-of-type               { width: 30%; }
.rate .table02 th,
.rate .table02 td                             { padding: 10px; }
.rate .table02.table-style02 th,
.rate .table02.table-style02 td               { width: 100%; display: block; }
.rate .table02.table-style02 th:first-of-type { border-right: 0; }

/* ------------
ページ内リンク
--------------- */
.rate .loan-menu 			      { font-size: 1.4rem; font-weight: 400; }
.rate .loan-menu li:not(:last-child)          { margin-bottom: 5px; }
.rate .loan-menu li:last-child                { margin-bottom: 15px; }
.rate .loan-menu li a		              { display: inline-block; position: relative; padding-left: 18px; }
.rate .loan-menu li a:after		      { content: ""; position: absolute; top: 4px; left: 0; width: 8px; height: 8px; border-top: 1px solid #3eb134; border-right: 1px solid #3eb134; transform: rotate(45deg); }
.rate .loan-menu li ul			      { margin-top: 5px; }
.rate .loan-menu li li			      { margin-left: 1em; }

}