@charset "utf-8";
.breadcrumbs {
    background-color: #F0F0EE;
}
.breadcrumbs > div {
    padding: 1em 0;
    margin: 0 auto;
    width: 960px;
    font-size: 80%;
}
main {
    margin: 0 auto;
    padding: 50px 0 0;
    width: 960px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
article{
    width: 640px;
    padding: 0 0 60px;
}
article h1 {
    padding: 2px 0 0 0.5em;
    border-left: 10px solid #2156A5;
    font-size: 215%;
    font-weight: bold;
}
article .update {
    padding: 0 0 8px;
    text-align: right;
}
article .update span {
    padding: 0 0 0 20px;
    display: inline-block;
    font-size: 80%;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_time.png) no-repeat 0 0;
    background-size: 15px 15px;
}
article .faceBold {
    font-weight: bold;
}
article .faceBoldSiteColor {
    font-weight: bold;
    background: linear-gradient(transparent 45%, #FECEE2 45%);
}
article p {
    font-size: 114%;
    line-height: 1.75;
}
.lead {
    margin: 0 0 20px;
}
.lead img {
    margin: 0 0 15px;
    width: 640px;
    height: auto;
}
.lead p {
    padding: 1em 0 0;
}
.index {
    padding: 1.3em 1em;
    border: 1px solid #C8C8C8;
}
.index-title {
    font-size: 128%;
    font-weight: bold;
    text-align: center;
}
.index-title span {
    margin: -2px 0 0 0.7em;
    padding: 0.2em 1em 0.1em 1em;
    width: 6.5em;
    display: inline-block;
    color: #FFF;
    font-size: 66%;
    font-weight: bold;
    background-color: #4D4D4D;
    text-align: center;
    vertical-align: middle;
}
.index-title span::after {
    padding: 0 0 0 1.3em;
    width: 3em;
    display: inline-block;
}
.index-title span.active::after {
    content: "閉じる";
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_arrow_white_up.png) no-repeat left 0.2em;
    background-size: 1em 1em;
}
.index-title span::after {
    content: "開く";
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_arrow_white_down.png) no-repeat left 0.2em;
    background-size: 1em 1em;
}
.index-list {
    padding: 1em 0 0;
}
.index-list > li:not(:last-of-type) {
    margin: 0 0 1.2em;
}
.index-list > li > a {
    font-weight: bold;
}
.index-list > li img {
    margin: 0 0.5em;
    width: 65px;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}
.index-list .index-list-nest {
    padding: 0.5em 0 0 3em;
}
.index-list .index-list-nest li:not(:last-of-type) {
    margin: 0 0 0.3em;
}
.articleMain {
    padding: 5em 0 0;
}
.articleMain h2 {
    margin: 0 0 0.8em;
    padding: 0.6em 1em 0.4em;
    font-size: 157%;
    font-weight: bold;
    color: #FFF;
    background-color: #3678BA;
}
.articleMain h2 img {
    margin: 0 0.3em;
    padding: 0;
    width: 78px;
    height: auto;
    display: inline-block;
    vertical-align: -0.2em;
}
.articleMain h3 {
    margin: 0 0 0.8em;
    padding: 2em 0 0;
    font-size: 142%;
    font-weight: bold;
    border-bottom: 2px solid #2156A1;
}
.articleMain h4 {
    margin: 1.5em 0 0;
    /* padding: 1.5em 0 0; */
    color: #2156A1;
    font-size: 128%;
    font-weight: bold;
}
.articleMain h4.iconPercent {
    padding: 0 0 0 1.8em;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_percent.png) no-repeat 0 0;
    background-size: 1.2em auto;
}
.articleMain h4.iconFinger {
    padding: 0 0 0 1.8em;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_finger.png) no-repeat 0 0;
    background-size: 1.2em auto;
}
.articleMain h4.iconHourglass {
    padding: 0.2em 0 0 1.8em;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_hourglass.png) no-repeat 0.3em 0.1em;
    background-size: 0.8em auto;
}
.articleMain h4.iconYen {
    padding: 0 0 0 1.8em;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_yen.png) no-repeat 0 0;
    background-size: 1.2em auto;
}
.articleMain img {
    margin: 0 auto;
    padding: 2.5em 0;
}
.articleMain p {
    padding: 1em 0 0;
}
.articleMain a.blank {
    margin: 0 0.3em 0 0;
    padding: 0 1.3em 0 0;
    display: inline-block;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_blank.png) no-repeat right 0.2em;
    background-size: 1em 1em;
}
.articleMain .summary {
    margin: 3em 0;
    padding: 2em 1.5em;
    background-color: #FFEBF6;
}
.articleMain .summary-title {
    margin: 0 0 0.5em;
    color: #FA62A6;
    font-size: 120%;
    font-weight: bold;
}
.articleMain .summary-title:not(:first-of-type) {
    padding: 1.8em 0 0;
}
.articleMain .summary-title + * {
    padding: 0;
}
.articleMain .summary li {
    margin: 0 0 0 1em;
    text-indent: -1em;
    line-height: 1.75;
}
.articleMain h2 + *,
.articleMain h3 + *,
.articleMain h4 + * {
    margin: 0;
    padding: 0;
}
.articleMain img + * {
    margin: 0;
    padding: 0;
}
.articleMain .summary + * {
    padding: 0;
}
.articleMain table {
    margin: 0.8em 0;
    width: 100%;
    line-height: 1.3;
}
.articleMain table thead th {
    border-right: 1px solid #FFFFFF;
    background-color: #DBE4F0;
    padding: 9px;
    font-weight: bold;
    color: #2156A1;
    text-align: center;
    vertical-align: middle;
}
.articleMain table thead th:last-child {
    border-right: none;
}
.articleMain table tbody tr th {
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    background-color: #DBE4F0;
    min-width: 111px;
    padding: 28px 10px 28px;
    font-weight: bold;
    color: #2156A1;
    text-align: center;
    vertical-align: middle;
}
.articleMain table.minWidthAuto tbody tr th { 
    /* min-widthを定義させない場合に使用 */
    min-width: auto;
}
.articleMain table tbody th:last-child {
    border-right: none;
}
.articleMain table tbody tr:last-child th {
    border-bottom: none;
}
.articleMain table tbody tr:last-child td {
    border-bottom: none;
}
.articleMain table tbody tr td {
    border-bottom: 1px solid #DFDFDF;
    border-right: 1px solid #DFDFDF;
    display: table-cell;
    background-color: #FAFAFA;
    min-width: 176px;
    padding: 24px 10px;
    text-align: center;
    vertical-align: middle;
}
.articleMain table.minWidthAuto tbody tr td { 
    /* min-widthを定義させない場合に使用 */
    min-width: auto;
}
.articleMain table tbody tr td:last-child {
    border-right: none;
}
.articleMain table tbody tr td.tableList {
    vertical-align: top;
    text-align: left;
}
.articleMain table tbody tr td.tableList ul li {
    margin-bottom: 20px;
    position: relative;
    padding-left: 15px;
}
.articleMain table tbody tr td.tableList ul li:before {
    content: '・';
    position: absolute;
    top: 0;
    left: 0;
}
.articleMain table tbody tr td.tableList ul li:last-child {
    margin-bottom: 0;
}
.articleMain .note {
    font-size: 86%;
    text-align: right;
    display: block;
}
/* tableを1列に2つ設置場合に使用 */
.articleMain .twoColumnTables {
    display: flex;
    padding:1em 0 0;
}
.articleMain .twoColumnTables > li {
    width: 310px;
}
.articleMain .twoColumnTables > li:last-child {
    margin-left: auto;
}
.articleMain .twoColumnTables .tableTitle {
    margin-bottom: 10px;
    display: block;
    text-align: center;
    font-weight: bold;
    color: #2156A1;
}
.articleMain .twoColumnTables table {
    margin: 0;
}
.articleMain .twoColumnTables table tbody tr td {
    min-width: auto;
    padding: 24px 4px;
}
.pickup {
    margin: 4.5em 0 0;
}
.pickup .pickup-title {
    padding: 0 0.5em 0 0;
    display: flex;
    flex-wrap: nowrap;
    background-color: #FFEBF6;
}
.pickup .pickup-title span,
.pickup .pickup-title div {
    min-height: 60px;
    display: flex;
    align-items: center;
}
.pickup .pickup-title span {
    padding: 0 0 0 0.7em;
    color: #FFF;
    font-size: 128%;
    font-weight: bold;
    background-color: #FA62A6;
    position: relative;
    white-space: nowrap;
}
.pickup .pickup-title span::after {
    content: "";
    width: 1em;
    height: 100%;
    background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #FA62A6 50.5%) no-repeat top right/100% 100%;
    position: absolute;
    top: 0;
    right: 1px;
    transform: translate(100%, 0);
}
.pickup .pickup-title div {
    padding: 0.6em 0 0.4em 1em;
    font-size: 157%;
    font-weight: bold;
    line-height: 1.4;
}
.pickup .comsList > li {
    padding: 30px 0;
    border-bottom: 1px solid #C8C8C8;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.pickup .comsList > li .comsList-img {
    width: 180px;
}
.pickup .comsList > li .comsList-img a {
    display: block;
}
.pickup .comsList > li .comsList-img a:hover {
    opacity: .8;
}
.pickup .comsList > li .comsList-img a img {
    padding: 0;
    width: 180px;
    height: auto;
}
.pickup .comsList > li .comsList-spec {
    width: 442px;
}
.pickup .comsList > li .comsList-name {
    padding: 0 0 0.5em;
    display: block;
    font-size: 143%;
    font-weight: bold;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/icon_arrow_02.png) no-repeat right 0.2em;
    background-size: 9px auto;
}
.pickup .comsList > li .comsList-name:hover {
    opacity: .8;
    text-decoration: none;
}
.pickup .comsList > li .comsList-point li {
    padding: 0 0 0 1em;
    font-size: 114%;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/dotted_list.gif) no-repeat 0.4em 0.6em;
    line-height: 1.75;
}
.pickup .comsList > li .comsList-note {
    width: 100%;
    padding: 0 0 0 198px;
}
.pickup .comsList > li .comsList-note li {
    color: #666;
    font-size: 86%;
}
.pickup .comsList > li .comsList-note ul.number li {
    margin: 0 0 0 2em;
    text-indent: -2em;
}
.pickup .comsList > li .comsList-note ul.asterisk li {
    margin: 0 0 0 1.5em;
    text-indent: -1.5em;
}
.button-top {
    text-align: center;
}
.button-top img:hover {
    opacity: .8;
}


.side-contents {
    width: 280px;
}
.recommend-title {
    padding: 10px 19px;
    color: #FFF;
    font-size: 142%;
    font-weight: bold;
    background-color: #2156A1;
    text-align: center;
    line-height: 1.2;
}
.recommend-title span {
    margin: 0 0 0.8em;
    padding: 0.4em 0.5em 0.3em;
    display: block;
    color: #2156A1;
    font-size: 80%;
    font-weight: bold;
    background-color: #FFF;
    position: relative;
    letter-spacing: -0.05em;
}
.recommend-title span.iconBeginner {
    padding: 0.4em 0.5em 0.3em 33px;
    background: #FFF url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/icon_beginner.png) no-repeat 13px center;
    background-size: 12px auto;
    text-align: left;
}
.recommend-title span::after {
    content: "";
    border: 5px solid transparent;
    border-top-color: #FFF;
    border-top-width: 8px;
    border-bottom-width: 0;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 100%);
}
.recommend .comsList {
    padding: 0 19px;
    border: 1px solid #C8C8C8;
}
.recommend .comsList > li {
    padding: 10px 0 30px;
}
.recommend .comsList > li:not(:last-of-type) {
    border-bottom: 1px solid #C8C8C8;
}
.recommend .comsList > li .comsList-img {
    margin: 0 auto;
    width: 240px;
}
.recommend .comsList > li .comsList-img a {
    display: block;
}
.recommend .comsList > li .comsList-img a:hover {
    opacity: .8;
}
.recommend .comsList > li .comsList-img a img {
    padding: 0;
    width: 240px;
    height: auto;
}
.recommend .comsList > li .comsList-name {
    padding: 0.7em 10px 0.5em 0;
    display: block;
    font-size: 143%;
    font-weight: bold;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/icon_arrow_02.png) no-repeat right center;
    background-size: 9px auto;
    line-height: 1.25;
}
.recommend .comsList > li .comsList-name:hover {
    opacity: .8;
    text-decoration: none;
}
.recommend .comsList > li .comsList-point {
    padding: 1.5em 0 0;
}
.recommend .comsList > li .comsList-point li {
    padding: 0 0 0 1em;
    font-size: 114%;
    background: url(https://img.phoenix.webcrew.co.jp/6400/card-loan/images/cont/dotted_list.gif) no-repeat 0.4em 0.5em;
    line-height: 1.5;
}
.recommend .comsList > li .comsList-point li:not(:last-of-type) {
    margin: 0 0 0.5em;
}
.recommend .comsList > li .comsList-note {
    padding: 0.5em 0 0;
}
.recommend .comsList > li .comsList-note li {
    color: #666;
    font-size: 86%;
}
.recommend .comsList > li .comsList-note ul.number li {
    margin: 0 0 0 2em;
    text-indent: -2em;
}
.recommend .comsList > li .comsList-note ul.asterisk li {
    margin: 0 0 0 1.5em;
    text-indent: -1.5em;
}
.recommend .comsList > li .comsList-button {
    margin: 1em 0 0;
    padding: 0.5em 0;
    border-radius: 6px;
    width: 240px;
    display: block;
    color: #FFF;
    font-size: 157%;
    font-weight: bold;
    background-color: #F58F00;
    text-align: center;
    box-shadow: 0 3px 0 0 rgba(0,0,0,.18);
    text-shadow: -1px -1px 0px rgba(0,0,0,.16);
}
.recommend .comsList > li .comsList-button:hover {
    opacity: .8;
    text-decoration: none;
    box-shadow: none;
    -ms-transform: translateY(3px);
    transform: translateY(3px);
}
.recommend .comsList > li .comsList-button span {
    display: block;
    font-size: 68%;
    font-weight: bold;
}