@charset "utf-8";
 html,body {font-size: 14.5px; max-width: 100%;}
.container {width: calc(100% - 30px); margin: 0 auto;}
.pc,.tb {display:none;}
.sp.tb, .sp.pc {display:block;}
.breadcrumbs {margin: 16px 0 12px;}
hr {margin: 1rem 0;} .fs-09 {font-size: .8rem!important;}
.fs-10 {font-size: .9rem!important;}
.fs-12 {font-size: 1.1rem!important;}
.fs-13 {font-size: 1.2rem!important;}
.fs-14 {font-size: 1.3rem!important;}
.fs-15 {font-size: 1.4rem!important;}
.fs-16 {font-size: 1.5rem!important;}
.fs-17 {font-size: 1.6rem!important;}
.fs-18 {font-size: 1.7rem!important;} .vspace-0 {margin: 0!important;}
.vspace-05 {margin: .25rem 0!important;}
.vspace-10 {margin: .5rem 0!important;}
.vspace-15 {margin: .75rem 0!important;}
.vspace-20 {margin: 1rem 0!important;}
.vspace-30 {margin: 1.5rem 0!important;}
.vspace-40 {margin: 2rem 0!important;}
.vspace-t05 {margin-top: .25rem!important;}
.vspace-t10 {margin-top: .5rem!important;}
.vspace-t15 {margin-top: .75rem!important;}
.vspace-t20 {margin-top: 1rem!important;}
.vspace-t30 {margin-top: 1.5rem!important;}
.vspace-t40 {margin-top: 2rem!important;}
.vspace-b05 {margin-bottom: .25rem!important;}
.vspace-b10 {margin-bottom: .5rem!important;}
.vspace-b15 {margin-bottom: .75rem!important;}
.vspace-b20 {margin-bottom: 1rem!important;}
.vspace-b30 {margin-bottom: 1.5rem!important;}
.vspace-b40 {margin-bottom: 2rem!important;} .indent {padding: 0 1rem!important;}
.indent-2 {padding: 0 2rem!important;}
@media screen and (min-width: 768px) {
html,body {font-size: 15.5px;}
.pc,.sp {display:none;}
.tb.sp, .tb.pc {display:block;}
} .two-col {display: block;}
main,
.s-navi {width: 100%;}
header .title {display: flex; align-items: center; height: 54px;}
header .title p {line-height: 1.5;}
header .h-navi {position: fixed; top: 0; left: 0; display: flex; flex-direction: column; width: 100%; height: 100%; background-image: linear-gradient(60deg,#007c48 0%,#65b52f 30.49%,#007c48 100%); overflow-y: auto; opacity: 0; transition: .5s ease-in-out; z-index: -1;}
header .h-navi ul {display: block; margin: 40px 20px 0;}
header .h-navi ul:last-child {margin-bottom: 40px;}
header .h-navi li {padding: 8px 10px 8px 30px; background: url(//estsec.staging-env.dev/cms-059462/wp-content/themes/estsec/img/footer_circle-right.svg) 0 12px/22px 22px no-repeat;}
header .h-navi li.home {margin-bottom: 25px;}
header .h-navi h3 {font-size: 1.3rem; margin-bottom: 15px; padding: 5px; border-bottom: 1px solid #fff;}
header .h-navi a {font-size: 1.2rem;}
.nav-open header .h-navi {opacity: 1; z-index: 9000;}
#toggle {position: fixed; top: 0; right: 0; width: 54px; height: 54px; background: #007c48; z-index: 9002; transition: all .5s ease;}
#toggle:hover {cursor: pointer;}
#toggle div {position: absolute; left: 13px; width: 28px; height: 2px; background: #fff; overflow: hidden; transition: all .5s ease;}
#toggle div:nth-child(1) {top: 18px;}
#toggle div:nth-child(2) {top: 26px;}
#toggle div:nth-child(3) {top: 34px;}
.nav-open #toggle {background: #fff;}
.nav-open #toggle div {background: #007c48;}
.nav-open #toggle div:nth-child(1) {animation: open-bar-top .75s ease forwards;}
.nav-open #toggle div:nth-child(2) {opacity: 0;}
.nav-open #toggle div:nth-child(3) {animation: open-bar-bottom .75s ease forwards;}
.nav-close #toggle div:nth-child(1) {animation: close-bar-top .75s ease forwards;}
.nav-close #toggle div:nth-child(2) {opacity: 1;}
.nav-close #toggle div:nth-child(3) {animation: close-bar-bottom .75s ease forwards;}
@keyframes open-bar-top {
0% {transform: translateY(0) rotate(0);}
50% {transform: translateY(8px) rotate(0);}
100% {transform: translateY(8px) rotate(-45deg);}
}
@keyframes open-bar-bottom {
0% {transform: translateY(0) rotate(0);}
50% {transform: translateY(-8px) rotate(0);}
100% {transform: translateY(-8px) rotate(45deg);}
}
@keyframes close-bar-top {
0% {transform: translateY(8px) rotate(-45deg);}
50% {transform: translateY(8px) rotate(0);}
100% {transform: translateY(0) rotate(0);}
}
@keyframes close-bar-bottom {
0% {transform: translateY(-8px) rotate(45deg);}
50% {transform: translateY(-8px) rotate(0);}
100% {transform: translateY(0) rotate(0);}
}
footer {margin-top: 50px;}
footer .logo {margin-top: 60px;}
footer .logo span.small {font-size: .9rem; letter-spacing: 1px;}
footer .logo span.big {font-size: 2.4rem; letter-spacing: 3px;}
footer .f-navi {display: block; margin: 40px auto;}
footer .f-navi ul {margin: 0 20px 40px;}
footer .copyright {font-size: .9rem; padding: 0 20px 40px;}
.s-navi .list {margin-bottom: 50px;}
.s-navi .list nav a {font-size: 1rem;}
.s-navi .knowledge nav a {font-size: .9552rem;}
@media screen and (min-width: 768px) {
footer .f-navi {display: flex;}
.s-navi {display: flex; justify-content: space-between;}
.s-navi >div {width: 48%;}
} .main-head {margin-bottom: 20px;}
.main-head a {left: 4%; bottom: 15px; font-size: 1.1rem; line-height: 1.5; padding: 8px 42px 8px 18px;}
.main-head a:after {right: 12px; border-width: 10px 0 10px 16px;}
#front {margin: 0 -15px 20px; padding: 2px 10px;}
#front .intro {margin: 0 2px;}
#front .intro h2,
#front .intro h2 span {line-height: 1.3;}
#front .intro h2 {font-size: 2.2rem; letter-spacing: 1px; margin: 20px 0 25px;}
#front .intro p {font-size: 1.05rem; margin-bottom: 20px;}
#front .hikaku h2 {font-size: 1.65rem; line-height: 1.3; letter-spacing: 1px; margin: 50px 0 40px; padding: 12px 0;}
#front .hikaku article .date div {border-bottom: 1px solid #cbcbcb;}
#front .hikaku article .date div:last-child {border-bottom: none;}
#front .hikaku article .date dt {font-size: 1rem; padding: 4px 0;}
#front .hikaku article .date dd {padding: 10px 25px;}
#front .hikaku article .date div:first-child dd {align-items: center; text-align: center;}
#front .hikaku article .date div:first-child dd h3 {font-size: 1.1rem;}
#front .hikaku article .date div:first-child dd a {margin-top: 10px;}
#front .hikaku article .date div:first-child dd a.to-details {margin-top: 4px;}
#front .hikaku article .valu {flex-wrap: wrap; padding: 8px 20px;}
#front .hikaku article .valu div {margin-right: 20px;}
#front .hikaku article .valu div:first-child {width: 100%;}
#front .hikaku article .txt {padding: 18px 20px 4px;}
#front .hikaku article .txt .state {display: block; margin-bottom: 15px; padding-bottom: 12px;}
#front .hikaku article .txt .state dl {margin-bottom: 8px;}
#front .hikaku article .txt .state dt {white-space: nowrap; margin-bottom: 2px;}
#front .hikaku article .txt .state dd {line-height: 1.25;}
@media screen and (min-width: 768px) {
.main-head a {font-size: 1.2rem; padding: 12px 42px 12px 18px;}
.main-head a br {display: none;}
#front {margin-bottom: 20px; padding: 4px 20px;}
} #knowledge {margin: 0 -4px 24px; padding: 0 6px 6px; border-radius: 12px;}
#knowledge .inner {padding: 12px 14px; border-radius: 8px;}
#knowledge h1 {display: flex;}
#knowledge h1 img,
#knowledge h1 svg {min-width: 18px; width: 18px; height: 18px; margin: 4px 7px 0 3px;}
#knowledge h1 span {font-size: 1.425rem; line-height: 1.25;} #knowledge p,
#knowledge ul {margin-bottom: 1rem; line-height: 1.6;}
#knowledge ul.ls-05 li {margin-bottom: .25rem;}
#knowledge ul.ls-10 li {margin-bottom: .5rem;}
#knowledge h2 {margin: 1rem 0;}
#knowledge h3 {margin: 1rem 0 .625rem;}
#knowledge h4 {margin: .8rem 0;}
#knowledge h2.g-h2 {font-size: 1.325rem; margin: 1.75rem -7px 1.5rem; padding: 8px 10px 8px 16px; border-left: 5px solid #3a5886;}
#knowledge h3.g-h3-01 {font-size: 1.25rem; margin: 1.75rem 0 1.4rem; padding: 0 18px; border-left: 7px solid #e84994;}
#knowledge h3.g-h3-02 {font-size: 1.2rem; margin: 1.75rem 0 1.4rem; padding: 12px 1rem 12px 2.5rem; border-radius: 32px;}
#knowledge .g-hl {margin: 20px 0 35px;}
#knowledge .g-hl img {margin: 0 auto 15px;}
#knowledge .g-hl span {font-size: 1.75rem;}
#knowledge.meritdemerit .g-hl img {width: 53px;}
#knowledge.risk .g-hl img {width: 65px;}
#knowledge .note-01 {padding: 1rem .5rem;}
#knowledge .note-02 {margin: 1.25rem 0 2.25rem; padding: 1rem 1.25rem; border-radius: 18px;}
#knowledge .link-btn {font-size: 1.1rem; margin: 0 .5rem; padding: 8px 30px 8px 15px; border-radius: 10px;}
#knowledge .link-btn:after {right: 13px; border-width: 6px 0 6px 10px;} #knowledge.rate .kinri-explan {margin: 28px 0; padding: 14px 18px 16px;}
#knowledge.rate .kinri-explan h3 {position: relative; top: 0; left: -26px; margin: 0 0 16px;}
#knowledge.rate .kinri-explan h3 span.label {display: inline-block; font-size: 1.2rem; margin-bottom: 6px; padding: 3px 15px;}
#knowledge.rate .kinri-explan h3 span.main {font-size: 1.15rem; margin-left: 24px;}
#knowledge.rate .loan-explan {margin: 28px 0; padding-left: 15px; border-left: 5px solid #b4b2b2;}
#knowledge.rate .loan-explan h3 {font-size: 1.3rem;}
#knowledge.rate .loan-explan .becomes {margin: 14px 0;}
#knowledge.rate .loan-explan .becomes dl {font-size: 1.2rem;}
#knowledge.rate .loan-explan .becomes dt,
#knowledge.rate .loan-explan .becomes dd {text-indent: -1.2rem; padding-left: 1.2rem;}
#knowledge.select .sp-big {font-size: 3rem;}
#knowledge.meritdemerit .flex {display: block;}
#knowledge.meritdemerit .reference {display: block; margin: 1rem 0 0 1rem;}
#knowledge.risk .example dt {text-indent: -2rem; padding: 4px 1rem 4px 2.75rem;}
#knowledge.risk .not-collateral {margin: 1.5rem 0;}
#knowledge.risk .not-collateral dt {width: 100%; font-size: 1.3rem; margin-bottom: 12px;}
#knowledge.risk .not-collateral dd {color: #595757; line-height: 1.85; margin-left: 12px; padding: 2px 10px 2px 15px;}
#knowledge.example .utilize {font-size: 1.15rem; margin-bottom: -1.5rem;}
#knowledge.example .example-case {flex-direction: column; align-items: center; margin: 1.5rem 0;}
#knowledge.example .example-case ul {font-size: 1.15rem; margin: 12px 0 0;}
#knowledge.example .example-case.case01 img {width: 160px;}
#knowledge.example .example-case.case02 img {width: 151px;}
#knowledge.example .example-case.case03 img {width: 156px;}
#knowledge.example section {margin-bottom: 4rem;}
#knowledge.qanda .notice {display: block; margin-top: 16px;}
#knowledge.qanda .notice img {margin: 0 auto;}
#knowledge.qanda .notice p {margin: 15px 0 0;}
#knowledge.qanda .qanda {margin: 2rem 0;}
#knowledge.qanda .qanda dt,
#knowledge.qanda .qanda dd {padding-top: 40px;}
#knowledge.qanda .qanda dt:before,
#knowledge.qanda .qanda dd:before {width: 40px; height: 35px; background-size: 40px 35px;}
#knowledge.qanda .qanda dt {font-size: 1.35rem; margin-bottom: 14px;}
#knowledge.qanda .qanda dd {font-size: 1rem; line-height: 1.5;}
#knowledge.qanda section {margin-bottom: 3.5rem;}
#knowledge.matome .becomes-list dl {display: block; margin-bottom: 5px;}
#knowledge.matome .becomes-list dl * {font-size: 1.2rem;}
#knowledge.matome .becomes-list dt {text-indent: -1rem; padding-left: 1rem;}
#knowledge.matome .becomes-list dd {padding-left: 1rem;}
@media screen and (max-width: 320px) {
#knowledge.select .sp-big {font-size: 2.4rem;}
}
@media screen and (min-width: 768px) {
#knowledge h1 img,
#knowledge h1 svg {min-width: 20px; width: 20px; height: 20px; margin: 5px 8px 0 4px;}
#knowledge.example .example-case {flex-direction: row;}
#knowledge.example .example-case ul {margin: 0 0 -.5rem 18px;}
} #list {margin: 0 -4px 24px; padding: 0 6px 6px; border-radius: 12px;}
#list .inner {padding: 12px 14px; border-radius: 8px;}
#list .disc {padding: 8px 6px;}
#list .disc span.big {font-size: 1.2rem; line-height: 1.4; margin-bottom: 4px;}
#list .disc span.small {font-size: .7rem; line-height: 1.7;}
#list .about .headline {display: block; margin: 10px 0;}
#list .about .headline h1 span.big {font-size: 2.125rem;}
#list .about .headline h1 span.small {font-size: 1rem; margin-top: 12px;}
#list .about .headline .link {display: flex; align-items: flex-start; margin-top: 15px;}
#list .about .headline .link a {width: calc((100% - 15px) / 2); max-width: 160px; font-size: 1.15rem; margin-right: 15px; padding: 4px 24px 4px 0; box-sizing: border-box;}
#list .about .headline .link a:after {right: 15px; border-width: 7px 0 7px 14px;}
#list .about .headline .link a:last-child {margin-right: 0;}
#list .about .valu {flex-wrap: wrap; padding: 4px 20px;}
#list .about .valu div {margin: 0 24px 0 0;}
#list .about .valu div:first-child {width: 100%;}
#list .about .state {display: block; padding: 15px 0 10px;}
#list .about .state dl {font-size: .925rem; margin-bottom: 8px;}
#list .about .state dt {white-space: nowrap; margin-bottom: 2px;}
#list .about .state dd {line-height: 1.25;} #list .main section {margin-bottom: 2rem;}
#list .main p,
#list .main ul {margin-bottom: 1.25rem; line-height: 1.5;}
#list .main .summary {margin: 1.5rem 0 2.5rem;} #list .main .chara .txt {display: block; margin-top: 8px;} #list .main .attention {margin: 2.5rem 0; border-radius: 10px;}
#list .main .attention h2 {font-size: 1.2rem; line-height: 1.5; padding: 8px 15px; border-radius: 10px 10px 0 0;}
#list .main .attention .inner {padding: 15px 16px 20px;}
#list .main .attention p {font-size: 1.05rem;}
#list .main .attention h3 {font-size: 1.35rem; line-height: 1.5; margin: 1.75rem 0 .8rem; padding: 0 5px 4px;}
#list .main .attention h3 span {display: block; font-size: .9rem; margin-bottom: 4px;}
#list .main .attention h3:after {width: 100%;}
#list .main .attention .access dt {font-size: 1.1rem;}
#list .main .attention .access.tel dt {margin-bottom: 4px;}
#list .main .attention .access.tel a {font-size: 2rem;}
#list .main .attention .access.tel a img {width: 44px; margin-right: 10px;}
#list .main .attention .access.tel span {font-size: 1.05rem;}
#list .main .attention .access.web {margin-top: 16px;}
#list .main .attention .access.web dt {margin-bottom: 4px;}
#list .main .attention .access.web a {display: block; max-width: 290px; font-size: 1.3rem; padding: 9px 56px 9px 12px;}
#list .main .attention .access.web a:after {right: 18px; border-width: 9px 0 9px 18px;}
#list .main .attention .access.web span {margin-top: 8px;} #list .main .table-box {margin: 1.5rem 0;}
#list .main .table-box .headline {display: block; margin: 0 0 -5px;}
#list .main .table-box h2 {font-size: 1.5rem; line-height: 1.5; padding: 7px 18px; border-radius: 5px 5px 0 0;}
#list .main .table-box .sub {display: none;}
#list .main .table-box .box {padding: 5px; border-radius: 0 5px 5px 5px;}
#list .main .table-box .inner {display: block; padding: 15px;}
#list .main .table-box .table dt,
#list .main .table-box .table dd {display: block; font-size: 1rem;}
#list .main .table-box .table dt {padding: 6px 14px;}
#list .main .table-box .table dd {padding: 8px 14px;}
#list .main .table-box .table dd small {display: block; font-size: .875rem; margin-top: 5px; text-indent: -.825rem; padding-left: .825rem;}
#list .main .table-box .notice {min-width: 100%; max-width: 100%; margin: 15px 0 0; padding: 15px 0 0; border-top: 2px dotted #595757; border-left: none;} #list .main dl.notice {margin: 1.5rem 0 0;}
.table-scroll {margin: 1rem 0 2rem; overflow-x: scroll; white-space: nowrap; -webkit-overflow-scrolling: touch;}
@media screen and (max-width: 320px) {
#list .main .attention .access.tel a {font-size: 1.65rem;}
#list .main .attention .access.tel a img {width: 38px; margin-right: 10px;}
}