@charset "UTF-8";
/* CSS Document */
/*デスクトップ用headerドロップメニュースタイル*/

body {
    text-align: left;
}

/*非表示要素*/
header .splogo,
.sp_cmn_menu,
.sp-benri-nav{
    display: none;
}
/*非表示要素*/

header {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    z-index: 100;
    background: #FFF;
}
header a {
	opacity: 1;
}

#nav-input {
    display: none;
}

#tool-content {
    padding: 0 1em;
    box-sizing: border-box;
}


@media screen and (max-width: 950px) {
	#tool-content {
		padding-right: 0;
	}
}

.logo {
    float: left;
    text-align: left;
    line-height: 1.4em;
    padding: 15px 0 0;
}
.logo span {
    font-size: 10px;
    padding-left: 5px;
    /*display: block;*/
}
.logo img {
    vertical-align: baseline;
}
@media screen and (max-width: 1060px) {
	.logo {
		padding-top: 5px;
		line-height: 1em;
	}
	.logo span {
		display: block;
		padding-left: 0;
	}
}
/*.logo:after {
    white-space: pre;
    content: "金融機関コード\A 0166";
    display: block;
    font-size: 11px;
    line-height: 1.2em;
    float: right;
    margin-left: 10px;
    vertical-align: bottom;
}*/

.toolbox {
    float: right;
    display: flex;
    color: #003583;
}
.toolbox .btn a {
    display: inline-block;
    font-size: 95%;
    border: 1px solid #003583;
    text-decoration: none;
    margin-left:10px;
    width: 9em;
    text-align: center;
    padding: 0.8em 0.2em;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.toolbox .btn a:hover {
    background: #003583;
    color: #FFF;
}
.toolbox .login > a {
    background: #F18E24;
    border-left: 1px solid #003583;
    border-right: 1px solid #003583;
    display: block;
    color: #FFF;
    height: 70px;
    box-sizing: border-box;
    padding: 10px 2em;
    font-size: 90%;
    font-weight: 500;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.toolbox .login > a.business {
    background: #1CBE74;
    border-left: 1px solid #003583;
    border-right: 1px solid #003583;
    display: block;
    color: #FFF;
    height: 70px;
    box-sizing: border-box;
    padding: 10px 2em;
    font-size: 90%;
    font-weight: 500;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.toolbox .login > a:hover {
    background: #0064db;
}
.toolbox .login > a:before {
    content: "";
    background: url(../img/ico_login_on.svg) no-repeat center;
    background-size: contain;
    width: 28px;
    height: 28px;
    display: block;
    vertical-align: middle;
    margin: 0 auto 5px;
}
.toolbox .login .login_menu {
    display: none;
    position: absolute;
    background: #FFF;
    padding: 1.5em;
    z-index: 100;
}
.toolbox .login .login_menu .retail_login {
    display: block;
    background: #F18E24;
    color: #FFF;
    font-weight: 700;
    padding: 0.5em 1em;
    border-radius: 5px;
    margin-bottom: 10px;
    text-align: center;
    font-size: 120%;
    line-height: 1em;
}
.toolbox .login .login_menu .business_login {
    display: block;
    background: #1CBE74;
    color: #FFF;
    font-weight: 700;
    padding: 0.5em 1em;
    border-radius: 5px;
    text-align: center;
     font-size: 120%;
     line-height: 1em;
}
.toolbox .login .login_menu .retail_login span,
.toolbox .login .login_menu .business_login span {
    font-size: 75%;
    display: block;
}




.toolbox .store a {
    background: #FFF;
    border-right: 1px solid #003583;
    display: block;
    height: 70px;
    box-sizing: border-box;
    padding: 7px 0.75em;
    font-size: 80%;
    font-weight: 500;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.toolbox .store a:hover {
    background: #0064db;
    color: #FFF;
}
.toolbox .store a:before {
    content: "";
    background: url(../img/ico_store.svg) no-repeat center;
    background-size: contain;
    width: 30px;
    height: 30px;
    display: block;
    vertical-align: middle;
    margin: 0 auto 7px;
}
.toolbox .store a:hover:before {
    background: url(../img/ico_store_on.svg) no-repeat center;
}

.textlist {
    padding: 10px 1em;
    font-weight: 500;
    line-height: 1.6em;
    font-size: 90%;
}
.textlist li a:before {
    content: "";
    background: url(../img/icon01.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    margin-right: 2px;
}
.textlist li a:hover {
    text-decoration: underline;
    color: #666;
}

.textlist li {
    text-indent: -1.4em;
    padding-left: 1.4em;
}

.textsize {
    margin: 0.5em 0 0 10px;
}
.textsize p {
    margin-left: 0.5em;
}
.textsize ul {
    display: flex;
    line-height: 2em;
    color: #003583;
    font-weight: 500;
}
.textsize ul {
    margin: 0 0 0 10px;
}
.textsize ul li {
    margin-right: 10px;
    vertical-align: middle;
}
.textsize ul .textresizer-active {
    background: #003583;
    color: #FFF;
    padding:3px 0.75em 2px;
}

/*スクロール固定メニュースタイル*/
.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  width: 100%;
}
/*スクロール固定メニュースタイル*/

/*追加分*/
/*.nav-close {
    background: rgba(0,0,0,.5);
    position: absolute;
    top: 3.5em;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100vh;
    z-index: 2;
    display: none;
}
.nav-close.close {
    display: block;
}*/


/*メガメニュースタイル*/
.megaDrop {
	display: none;
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 3;
	background: #FFF;
    /*overflow: scroll;*/
}

.megaDrop-close {
    display: block;
    padding: 1em;
    color: #FFF;
    background: #00449c;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    margin-top: 1em;
    transition-property: background;
    transition-duration: 0.3s;
}

/*閉じるボタン以降の黒いエリア*/
.megaDrop-close:after {
    content: "";
    background: rgba(0,0,0,.75);
    position: absolute;
    left: 0;
    right: 0;
    margin-top: 1em;
    width: 100%;
    height: 100vh;
    display: block;
    z-index: 2;
    transition: 0.3s;
    /*transition: 0.5s;*/
}

.megaDrop-open {
    /*overflow: hidden;
    position: fixed;*/
}

/*.megaDrop{
    position: absolute;
      height: 0;
      left:0;
      right: 0;
      top:100%;
      z-index:1;
      overflow:hidden;
      width:100%;
      background: #FFF;
	  transition: 0.5s;
}*/

/*.header-nav-list > ul > li > a:hover + .megaDrop{
  display: block;
  height:auto;
  Z-index:20;
  transition: 0.3s;
}
.megaDrop:hover{
  display: block;
  height:auto;
  Z-index:20;
  transition: 0.5s;
}*/


.header-nav-list {
    background: linear-gradient(to bottom right,#1253bd,#0052d0 30%,#00208b);
	padding: 0 2em;
    position: relative;
}
.header-nav-list > ul {
    display: flex;
    justify-content: space-around;
}

@media screen and (min-width: 1200px) {
	.header-nav-list > ul > li {
		width: 100%;
	}
}

@media screen and (max-width: 1200px) {
	.header-nav-list > ul > li.retail-F {
		width: 16em;
	}
	.header-nav-list > ul > li:not(.retail-F) {
		width: 100%;
	}
	.header-nav-list > ul > li .header-nav-list-text {
		padding: 1em;
		width: 100%;
	}
}

.header-nav-list-text {
    /*padding: 1em 1.7em;*/
    padding: 1em;
    box-sizing: border-box;
    color: #FFF;
    text-align: center;
    /*margin: 0 1em 0 0;*/
    width: 100%;
    font-size: 110%;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
	white-space: nowrap !important;
}
.header-nav-list-text:hover {
    background: #FFF;
    color: #003583;
    font-weight: 700;
}
.active .header-nav-list-text {
    background: #FFF;
    color: #003583;
    font-weight: 700;
}

.header-nav-list-text:after {
    content:"";
}
.header-nav-list-text:before {
    content: "";
    /*border-right: 1px solid #FFF;*/
}
.header-nav-list-text.last {
    border-right: none;
}
/*下記の要素にスタイルを追加すると、詳細メニューが一時しか表示されない！
.header-nav-list-text以外にpadding、marginを加えること同様になる*/
/*.header-nav-list > ul > li {
    margin-right: 20px;
    padding: 1em;
}*/

@media screen and (max-width: 980px) {
	.header-nav-list-text {
		white-space: nowrap;
		padding: 1em 0.5em;
	}
}

/*safari用に調整*/
@media screen and (min-width: 1050px) {
	.banking-menu {
		white-space: nowrap;
	}
}


/*メガメニュー内のスタイル*/
.megaColumn {
    /*max-width: 1100px;*/
    width: 100%;
    margin: 0 auto;
    padding: 2em 2em 0;
    box-sizing: border-box;
    text-align: left;
    overflow-y: scroll;
    max-height: calc(100vh - (3em + 220px));
    /*overflow-y: scroll;*/
}

.megaColumn .title {
    font-size: 180%;
    color: #003583;
    font-weight: 700;
    line-height: 1.2em;
}
.megaColumn .banking,
.megaColumn .deposit,
.megaColumn .insurance,
.megaColumn .benri{
    margin-bottom: 0.5em;
}
.megaColumn .banking {
    text-indent: -35px;
    padding-left: 35px;
}
.megaColumn .banking:before {
    content: "";
    background: url(../img/ico_nav06.svg) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    width: 30px;
    height: 45px;
    margin-right: 5px;
    vertical-align: middle;
}
.megaColumn .deposit:before {
    content: "";
    background: url(../img/ico_nav01.svg) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    vertical-align: bottom;
}
.megaColumn .asset:before {
    content: "";
    background: url(../img/ico_nav05.svg) no-repeat left center;
    background-size: contain;
    display: inline-block;
    width: 50px;
    height: 50px;
    margin-right: 10px;
    vertical-align: middle;
}

.megaColumn .loan:before {
    content: "";
    background: url(../img/ico_nav02.svg) no-repeat left top;
    background-size: contain;
    display: inline-block;
    width: 55px;
    height: 55px;
    margin-right: 10px;
    vertical-align: middle;
}
.megaColumn .insurance:before {
    content: "";
    background: url(../img/ico_nav03.svg) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    vertical-align: bottom;
}

.megaColumn .benri {
    text-indent: -60px;
    padding-left: 60px;
}
.megaColumn .benri:before {
    content: "";
    background: url(../img/ico_nav04.svg) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    width: 50px;
    height: 50px;
    margin-right: 10px;
    vertical-align: bottom;
}


.megaColumn .subtitle {
    font-size: 85%;
    font-weight: 500;
    margin: 0 0 2em;
}

.col {
    display: table-cell;
    padding: 2em;
    box-sizing: border-box;
}
.col-2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	align-content: flex-start;
}
.col-2 > li {
    width: calc((100% - 15px) / 2);
    margin-right: 15px;
}
.col-2 > li:nth-of-type(2n) {
    margin-right: 0;
}

.col-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
}
.col-3 > li {
    width: calc((100% - 40px) / 3);
    margin-right: 20px;
}
.col-3 > li:nth-of-type(3n) {
    margin-right: 0;
}
/*Edgeハック（カラム崩れ防止）*/
_:-ms-lang(x), .col-3 > li {
    margin-right: 19px;
}

.col-4 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
}
.col-4 > li {
    width: calc((100% - 60px) / 4);
    margin-right: 20px;
}
.col-4 > li:nth-of-type(4n) {
    margin-right: 0;
}

.col-5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
}
.col-5 > li {
    width: calc((100% - 80px) / 5);
    margin-right: 20px;
}
.col-5 > li:nth-of-type(5n) {
    margin-right: 0;
}

.megaColumn-footer {
    text-align: center;
    margin-top: 1.5em;
}
.megaColumn-footer a {
    display: block;
    box-sizing: border-box;
    color: #FFF;
    text-decoration: none;
    background: #00449c;
    padding: 1em;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.megaColumn-footer a:hover {
    background: #0068b6;
}
.megaColumn-footer .close a:before {
    content: "";
    display: inline-block;
    background: url(../img/icon08.svg) no-repeat center;
    background-size: contain;
    width: 1.2em;
    height: 1.2em;
    margin-right: 7px;
    vertical-align: middle;
}

.h3_menu{
    border-bottom: 2px solid #003583;
    color: #003583;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 15px;
    text-align: left;
}
.mt22 {
    height: calc(1em + 37px);
}

.cssbtn {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 1.25em 2em 1.25em 0.75em;
    text-align: left;
    background: #FFF;
    border-top: 1px solid #003583;
    border-left: 1px solid #003583;
    border-right: 1px solid #003583;
    text-decoration: none;
    font-weight: 700;
    font-size: 90%;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
	position: relative;
}
.cssbtn[href$=".pdf"],
.cssbtn2[href$=".pdf"]{
	background: none;
	padding-right: 0.25em;
}

.cssbtn:hover {
    background: #0064db;
    color: #FFF;
}
/*.cssbtn:after {
    content: "";
    display: inline-block;
    background: url(../img/icon01.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    float: right;
}*/
.cssbtn:after {
    content: "";
    display: inline-block;
    background: url(../img/icon05.svg) no-repeat center;
    background-size: contain;
    width: 1.25em;
    height: 1.25em;
    line-height: 1em;
	vertical-align: middle;
	position: absolute;
	right: 0.25em;
	top: 50%;
	transform: translateY(-50%);
}
.cssbtn2 {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 0.85em 1.75em 0.85em 0.75em;
    text-align: left;
    background: #FFF;
    border-top: 1px solid #003583;
    border-right: 1px solid #003583;
    border-left: 1px solid #003583;
    /*border-radius: 5px;*/
    text-decoration: none;
    font-weight: 700;
    font-size: 95%;
    letter-spacing: 0.5px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    position: relative;
}
.cssbtn2:hover {
    background: #0064db;
    color: #FFF;
}
.cssbtn2:after {
    content: "";
    display: inline-block;
    background: url(../img/icon05.svg) no-repeat center;
    background-size: contain;
    width: 1.25em;
    height: 1.25em;
    line-height: 1em;
    float: right;
    vertical-align: top;
    position: absolute;
	right: 0.25em;
	top: 50%;
	transform: translateY(-50%);
}
.cssbtn2 span {
    font-size: 72%;
    display: block;
    margin-top: 4px;
    font-weight: 500;
    line-height: 1.2em;
    letter-spacing: 0;
}
.last {
    border-bottom: 1px solid #003583;
    margin-bottom: 10px;
}


.mainbtn .zoomimg {
    display: block;
    overflow: hidden;
    width: 100%;
}
.mainbtn .zoomimg img {
    transform: scale(1);
    transition-duration: 0.5s;
    overflow: hidden;
}
.mainbtn .zoomimg img:hover{
  transform: scale(1.1);
transition-duration: 0.5s;
}
.mainbtn span {
    display: block;
    background: #0064db;
    color: #FFF;
    text-align: center;
    padding: 1em;
    /*border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;*/
    font-weight: 700;
    font-size: 105%;
    letter-spacing: 1px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.mainbtn:hover span {
    background: #003583;
}
.margin_t10 {
    margin-top: 10px;
}

.bnrlink img {
    margin-bottom: 10px;
    display: block;
    border: 1px solid #999;
    box-sizing: border-box;
}
.bnrlink:hover img {
    opacity: 0.75;
}

/*.downmenu dt {
    text-align: center;
    margin-top:1em;
}*/
/*.downmenu dt a {
    font-weight: 500;
    display: block;
    padding: 1em;
    box-sizing: border-box;
    border: 1px solid #003583;
    border-radius: 40px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}*/
.downmenu dt {
    text-align: center;
    margin-top:1em;
    font-weight: 500;
    display: block;
    padding: 1em;
    box-sizing: border-box;
    border: 1px solid #003583;
    border-radius: 40px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.downmenu dt:after {
    content: "";
    background: url(../img/icon09.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}
.downmenu .open:after {
    content: "";
    background: url(../img/icon14.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}
.downmenu dt:hover {
    background: #DDD;
}
.downmenu dd {
    display: none;
    padding-top: 1em;
}
.downmenu dd .cssbtn {
    font-size: 85%;
}


/*インターネットバンキング*/
/*.bankinglogin:before {
    content: "ログインはこちら";
    font-weight: 700;
    color: #003583;
    margin-top: 20px;
    display: block;
    margin-bottom: 10px;
    border-bottom: 2px solid #003583;
    padding-bottom: 7px;
}*/
.bankinglogin a {
    display: block;
    text-align: center;
    color: #FFF;
    font-weight: 700;
    font-size: 135%;
    padding:10px 5px 12px;
    border-radius: 7px;
    margin-bottom: 7px;
}
.bankinglogin a span{
    display: block;
    font-size: 70%;
}
.bankinglogin a.direct {
    background: #F18E24;
}
.bankinglogin a.direct:hover {
    background: #FF6313;
}

.bankinglogin a.hojinib {
    background: #1CBE74;
}
.bankinglogin a.hojinib:hover {
    background: #198D61;
}



/*借りる*/
.sim,
.kinri,
.sodan {
    display: block;
    background: #d0e4ff;
    border: 1px solid #003583;
    border-radius: 7px;
    padding: 1em;
    text-align: center;
    font-weight: 700;
    font-size: 120%;
    color: #003583;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.sim:hover,
.kinri:hover,
.sodan:hover {
    background: #FFF;
}
.sim:before {
    content: "";
    display: inline-block;
    background: url(../img/ico_loan01.svg) no-repeat left center;
    background-size: contain;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-right: 5px;
}
.kinri:before {
    content: "";
    display: inline-block;
    background: url(../img/ico_loan02.svg) no-repeat left center;
    background-size: contain;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-right: 5px;
}
.sodan:before {
    content: "";
    display: inline-block;
    background: url(../img/ico_loan03.svg) no-repeat left center;
    background-size: contain;
    width: 45px;
    height: 30px;
    vertical-align: middle;
    margin-right: 5px;
}

.loanbtn {
    display: block;
    background: #FFF;
    padding:0.7em 1em 1em;
    border: 1px solid #999;
    border-radius: 7px;
    color: #003583;
    font-weight: 700;
    text-align: center;
    margin-bottom: 15px;
    transition-property: color, background-color;
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
}
.loanbtn:hover {
    background: #0064db;
    color: #FFF;
    opacity: 1 !important;
}

@media screen and (min-width: 780px) {
    .subtitle {
    font-size: 55%;
    line-height: 1.5em;
    margin-bottom: 1em !important;
    font-weight: 400 !important;
}
.content-top a {
    display: block;
    background: #DEDEDE;
    color: #333;
    font-weight: 700;
    padding: 0.75em 1em 0.75em 1.25em;
    border-radius: 20px;
    margin-top: 1.2em;
    margin-bottom: 7px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.content-top a:after {
    content: "";
    background: url(/common/nav/img/icon01.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    float: right;
}
.content-top a:hover {
    background: #0064db;
    color: #FFF;
}
.toolbtn a {
    display: block;
    background: #d0e4ff;
    color: #003583;
    font-weight: 700;
    padding: 0.75em 1em 0.75em 1.25em;
    border-radius: 20px;
    margin-top: 7px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.toolbtn a:after {
    content: "";
    background: url(/common/nav/img/icon01.svg) no-repeat center;
    background-size: contain;
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    float: right;
}
.toolbtn a:hover {
    background: #0064db;
    color: #FFF;
}

.sim,
.kinri,
.sodan {
    font-size: 100%;
    margin-top: 10px;
    padding: 0.5em 1em;
    text-align: left;
    background: #FFF;
}
.loanbtn {
    font-size: 90%;
    padding: 1.25em 0;
}

.card:before {
        content: "";
        background: url("../img/ico_loan04.svg") no-repeat center;
        background-size: contain;
        width: 50px;
        height: 35px;
        display: block;
        margin: 0 auto 15px;
    }
    .kyoiku:before {
        content: "";
        background: url("../img/ico_loan06.svg") no-repeat center;
        background-size: contain;
        width: 55px;
        height: 40px;
        display: block;
        margin: 0 auto 10px;
    }
    .car:before {
        content: "";
        background: url("../img/ico_loan05.svg") no-repeat center;
        background-size: contain;
        width: 52px;
        height: 37px;
        display: block;
        margin: 0 auto 13px;
    }
    .tamokuteki:before {
        content: "";
        background: url("../img/ico_loan08.svg") no-repeat center;
        background-size: contain;
        width: 40px;
        height: 40px;
        display: block;
        margin: 0 auto 10px;
    }
    .free:before {
        content: "";
        background: url("../img/ico_loan07.svg") no-repeat center;
        background-size: contain;
        width: 40px;
        height: 40px;
        display: block;
        margin: 0 auto 10px;
    }
    .reform:before {
        content: "";
        background: url("../img/ico_loan11.svg") no-repeat center;
        background-size: contain;
        width: 48px;
        height: 48px;
        display: block;
        margin: -3px auto 5px;
    }
    
    .card:hover:before {
        background: url("../img/ico_loan04_on.svg") no-repeat center;
    }
    .kyoiku:hover:before {
        background: url("../img/ico_loan06_on.svg") no-repeat center;
    }
    .car:hover:before {
        background: url("../img/ico_loan05_on.svg") no-repeat center;
    }
    .tamokuteki:hover:before {
        background: url("../img/ico_loan08_on.svg") no-repeat center;
    }
    .free:hover:before {
        background: url("../img/ico_loan07_on.svg") no-repeat center;
    }
    .reform:hover:before {
        background: url("../img/ico_loan11_on.svg") no-repeat center;
    }
}


/*お得・便利サービス*/
.web-service {
    background: #0068b6;
    border-radius: 10px;
    padding: 1em;
    text-align: center;
    margin-bottom: 15px;
}
.web-service p {
    color: #FFF;
    font-weight: 700;
    font-size: 110%;
}
.web-service a {
    display: block;
    background: #FFF;
    padding: 10px 1em;
    margin-top:10px;
    font-weight: 700;
    font-size: 90%;
    border-radius: 30px;
    transition-property: color, background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
}
.web-service a:before {
    content: "";
    background: url(../img/icon02.svg) no-repeat center;
    background-size: contain;
    width: 0.9em;
    height: 0.9em;
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
}
.web-service a:hover {
    background: #003583;
    color: #FFF;
}
.web-service a {
}

.cash,
.recomend {
    border-bottom: 3px solid #0068b6;
    padding: 10px 0;
    margin-bottom: 15px;
    font-size: 120%;
    color: #0068b6;
}
.cash:before {
    content: "";
    display: inline-block;
    background: url(../img/ico_benri01.svg) no-repeat left bottom;
    background-size: contain;
    width: 30px;
    height: 30px;
    vertical-align: middle;
}
.recomend:before {
    content: "";
    display: inline-block;
    background: url(../img/ico_benri02.svg) no-repeat left bottom;
    background-size: contain;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-right: 10px;
}



/*フッタースタイル*/
#footer-menu-content {
    /*background: linear-gradient(to bottom right,#1253bd,#0052d0 30%,#00208b), url(../img/logo_footer.svg) no-repeat center;*/
    background-image:url("../img/logo_footer.svg"), linear-gradient(to bottom right,#1253bd,#0052d0 30%,#00208b);
    background-repeat: no-repeat, no-repeat;
    background-position: center;
    background-size: 300px auto, auto;
    padding: 3em 2em;
    text-align: left;
}
#footer-menu-content a {
    color: #FFF;
}
#footer-menu-content .f-mainbtn a {
    font-size: 105%;
    letter-spacing: 0.5px;
    margin-bottom: 0.85em;
    display: inline-block;
    text-indent: -25px;
    padding-left: 25px;
    line-height: 1.3em;
}
#footer-menu-content .f-mainbtn a:before {
    content: "";
    display: inline-block;
    background: url(../img/icon06.svg) no-repeat left bottom;
    background-size: contain;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-right: 7px;
}
#footer-menu-content .f-subbtn {
    margin-left: 25px;
     text-align: left;
     font-size: 85%;
     line-height: 2em;
}

#footer-other-content {
    background: #FFF;
    text-align: center;
    padding: 2.2em 4em 1.8em;
    font-size: 85%;
    letter-spacing: 0.5px;
    font-weight: 500;
}
#footer-other-content ul li {
    display: inline-block;
    padding: 0 1.5em;
    margin-bottom: 12px;
    border-right: 1px solid #003583;
}
#footer-other-content ul li a {
    color: #003583;
}
#footer-other-content .f-other-content-open {
    display: none;
}


#footer-copyright {
    background: #EEE;
    text-align: center;
    padding: 1.5em 2em;
    line-height: 1.5em;
    font-size: 90%;
    font-weight: 500;
}
#footer-copyright .copyright {
    color: #003583;
}