﻿@charset "utf-8";


#errMsg{color:red;font-weight:bold;display:none;}


.remodal h1{
	/*position: absolute;
	width: 94%;
	top: -60px;
	font-size: 25px;*/
}

/*.remodal h1 p{
	display:inline-block;
	padding:1px 10px 0px;
	color:#009a00;
	border:8px solid #f00;
	background-color:#fff;
}*/

.remodal .form_inner{
	margin-top:30px;
}

.remodal .form_inner>div{
	margin-bottom:20px;
}

.remodal .form_inner .borrowing{
	font-size: 26px;
	font-weight:bold;
	/*margin-right:20px;*/
}

.remodal .form_inner .borrowing p{
	margin-bottom:5px;
}

.remodal .form_inner span.attention{
	font-size: 24px;
	padding: 20px 0;
	display: block;
    text-align: center
}
.calc-box{
	background: #FFFF82;
}

#calcBtn{
	margin:25px auto;
	padding:5px 80px 4px;
	background: #FF7800;
	font-size: 26px;
	font-weight: bold;
	color: #fff;
	border: none;
}
.ct-btn{cursor: pointer}
.remodal .form_inner .attention{
	margin:20px auto;
	text-align:left;
	font-size:12px;
}
.remodal .form_inner .attention span{
	display: block;
	text-align: center;
	font-size: 14px;
	position: relative;
}
.remodal .form_inner .attention span:before{
	content: '';
	display: block;
	background: #2b2e38;
	height:1px;
	position: absolute;
	top:50%;
	width: 100%;
	z-index: 1;
}
.remodal .form_inner .attention span b{
	background: #fff;
	display: inline-block;
	z-index: 2;
	position: relative;
	padding: 0 20px;
	font-weight: bold;
}
#result h2{
	letter-spacing:2px;
	font-size:26px;
	font-weight:bold;
	position: relative;
	padding-top: 15px;
}
#result h2:before{
	content: '';
	display: inline-block;
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 60px 0 60px;
	border-color: #FFFF82 transparent transparent transparent;
	top:-20px;
	left:calc(50% - 60px);
}


#result div{
	font-size:18px;
	font-weight:bold;
	border-bottom: 3px solid #FF7800;
	width: 70%;
	margin: 0px auto;
	position: relative;
}
#result .result_num:after{
	content: '円';
	display: inline;
	font-size: 24px;
	color: #000;
	padding-left: .5em;
	position: absolute;
	bottom: .25em
}
#result div span{
	display: inline-block;
	width: 5.5em;
	text-align: right;
	position: relative;
    padding-right: 1em
}

#apply{
	font-weight: bold;
	margin:25px auto;
	/*display:inline-block;
	padding:5px 40px 4px;
	border-radius:6px;
	font-size:22px;
	text-decoration: none;
	color:#fff;*/
}
#repayment1{
	/*font-size: 36px;
	color:#FF7800;
	font-weight: bold;*/
}
.form_inner dl{font-size: 80%;}

.form_inner .footer-contact-cell {height: auto;padding:10px;}
.form_inner .footer-contact-list li{font-size: 1.75rem}
.form_inner .footer-contact-list li:first-child{margin-right: 15px;}
.form_inner .footer-contact-list .tel-icon {top: 5px;margin-right: 3px;}
.form_inner .footer-contact-text01,.form_inner .footer-contact-text03{font-size: 96%;font-weight: normal}
.form_inner .footer-contact-text03{margin-top: 10px;}
.form_inner .footer-contact-box02.type-logo {padding: 20px 10px 20px 80px;}
.form_inner .footer-contact-box02{}
@media only screen and (min-width: 768px){
	.form_inner .footer-contact-box { }
	.form_inner .flx-box > *{}
	.form_inner .flx-box{display: flex;justify-content: center}
	.form_inner .ct-btn02 .table-cell {height: 156px;}
	.form_inner .footer-contact-box02 dt {font-size: 1.5rem;}
	.form_inner .footer-col2{margin:20px 0;justify-content: space-between}
	.form_inner .footer-col2-small {justify-content: space-between}
	.form_inner .footer-col2-elm-small{width: 48.5%;margin: 0}
}
@media only screen and (max-width: 800px){
	.form_inner .flx-box{display: block}
	.form_inner .footer-col2-elm-small{width: 80%;margin-left: auto;margin-right: auto}
}
@media only screen and (max-width: 767px){
	/* iOSでのデフォルトスタイルをリセット */
	input[type="submit"],input[type="button"] {
		border-radius: 0;
		-webkit-box-sizing: content-box;
		-webkit-appearance: button;
		appearance: button;
		border: none;
		box-sizing: border-box;
		cursor: pointer;
	}
	input[type="submit"]::-webkit-search-decoration,
	input[type="button"]::-webkit-search-decoration {  display: none;}
	input[type="submit"]::focus,
	input[type="button"]::focus {  outline-offset: -2px;}
	/**/
	.remodal h1{text-align: left;}
	.remodal h1 img{max-width: 90%	}
	.remodal .form_inner{margin-top:10px;}
	#borrowed,#borrowingYears{
		margin-left:10px;
		width:110px;
		font-size: 24px;}
	.remodal .form_inner .borrowing,
	.remodal .form_inner span.attention{font-size:6vmin}
	#result h2:before{border-width: 20px 15vw 0 15vw;left:calc(50% - 15vw);}
	#result div{width: 80%}
	#apply .main-text:before {top: 6px;}
	.form_inner .flx-box > *{margin: 20px auto;}
	.form_inner .footer-contact-box02.type-logo{padding-left: 55px}
}

/* 20191128 add */
#inputTabel{
	position:relative;
}
#inputTabel table{
	margin: 0 auto;
    width: 100%
}
#inputTabel table tr{
	border-bottom: solid 5px transparent;
	color: #ff7800;
    font-size: 26px;
    line-height: 1.5
}
#inputTabel table tr:nth-child(2) td{color: #000;font-weight: normal;font-size: 78%}
#inputTabel table tr:nth-child(2) td:first-child{}
#inputTabel table tr td{font-weight: bold}
#inputTabel table tr td:nth-child(1){	
	text-align: right;
    width: 40%
}
#borrowed,#borrowingYears,
#bonus, #interest{
	margin-left:10px;
	margin-right:5px;
	text-align:right;
	width:145px;
	height:40px;
	font-size: 30px;
	font-weight: bold;
	border:1px solid #FFB400
}
#bonus, #interest{
	width:165px;
}
#borrowed{
	width:165px;
}
#borrowingYears{
	width:170px;
	font-size: 20px;
}
.result_num{
	font-size: 36px;
	color: #FF7800;
	font-weight: bold;
}
#result {
	position: relative;
}
#result::before {
	content: '';
	display: inline-block;
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 60px 0 60px;
	border-color: #FFFF82 transparent transparent transparent;
	top: -72px;
	left: calc(50% - 60px);
}
#result {
    border: 12px solid   #FF7800;
    margin-top: 60px;
    margin-left: 20%;
    margin-right: 20%;
    border-radius: 12px;
	padding: 0 20px 20px;
}
#result h3 {
	letter-spacing: 2px;
	font-size: 26px;
	font-weight: bold;
	position: relative;
	padding-top: 15px;
}
.infomation{
	border-top: solid 1px #ddd;
}
.infomation-inner{
	width: 80%;
	font-size: 12px;
	text-align: left;
	padding-top:5px;
	margin: 10px auto 0;
}
#interest_info{
	width:45%;
	position:absolute;
	top:90px;
	right:-230px;
	font-size:12px;
	background: #ffb400;
}
#interest_info h3{
	font-size: 26px;
	font-weight: bold;
	text-align:center;
}
#interest_info p{
	font-size: 16px;
	font-weight: bold;
}
#interest_info p span{
	color:red;
}
#interest_info::before{
	content:"";
	display:block;
	position:absolute;
	top:63px;
	left:-50px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 50px 15px 0;
	border-color: transparent #ffb400 transparent transparent;
}
#errMsg{
	margin-top:10px;
}
#result .hide{
	display:none!important;
}
/* end 20191128 add */

.fineindent{margin-left: 1.5em;text-indent: -1.5em}
@media only screen and (max-width: 768px) {/*タブレット以下*/
	#inputTabel {margin-right: 0;}
    #inputTabel table tr td {padding-right: 5px;}
    #inputTabel table tr td:first-child{text-align: right;padding-right: 0;}
	#inputTabel table tr td:nth-child(2){width: calc(170px + 3.5em);}
	#inputTabel table td input {
		/*width: 135px;*/
		display: inline-block;
		margin: 0 0 0 9px;
		}
	#inputTabel table td select{margin: 0 0 0 9px;}
    #interest_info {width: auto;
    position: relative;
    top: 16px;
    right: 0;
		padding-bottom: 1px
    }
    #interest_info::before {
    top: -16px;
    left: calc(50% - 16px);
    border-width: 0 16px 16px 16px;
    border-color: transparent transparent #ffb400 transparent;}
	#result{margin-right: auto;margin-left: auto}
	#result div span{padding-right: .75em}
	#inputTabel table tr {font-size: inherit}
}
@media only screen and (max-width: 375px) {
    #inputTabel table tr td:first-child{width: 32%}
	#result div{width: 94%}
	.request > .fw-b{font-feature-settings: 'palt';font-size: 18px}
	.footer-contact-list li >p{font-feature-settings: 'palt';letter-spacing: .075em;font-size: 4.75vw}
	.footer-col2 .footer-col2-elm .bg-white {font-size: 5vw;}
/*Safariに適用されるCSSハック*/
_::-webkit-full-page-media, _:future, :root #inputTabel table td input 
     {width: 10rem;}
}
@media only screen and (max-width: 320px) {/*iPhone5以下*/
    #inputTabel table tr td:nth-child(2){text-align: right}
}

/*   banner add_200430   */

.bnr {
    background: rgba(255,255,255,0.8);
    position: fixed;
    bottom: 0;
    width: 103%;
    height: auto;
    margin: 0 auto 0 -8px;
    padding: 2% 2%;
    z-index: 100;
	box-sizing:border-box;
	text-align:center;
}

.bnr p{
	width:39%;
	display:inline-block;
	max-width:420px;
}

p.bnr01{
	/*float:left;*/
	margin-right:3%;
}
/*
p.bnr02{
	float:right;
}
*/

.bnr a{
	display: block;
    font-size: 180%;
	padding:3% 0;
	text-align:center;
    box-sizing: border-box;
	width:100%;
	font-weight:bold;
	border-radius:5px;
}

.bnr img{
	width:10%;
	margin-right:10px;
	vertical-align:middle;
}

a.bnr_img {
	/*background: transparent url(/loan/house/reverse-mortgage/common/img/common/icon-link_red.png) no-repeat  8% 50%;*/
    background-color: #ffc000;
    color: #f00;
	background-size: 9.5%;
}
a.faqbnr_img {
	/*background: transparent url(/loan/house/reverse-mortgage/common/img/common/icon-link_white.png) no-repeat 8% 50%;*/
    background-color: #ff8914;
    color: #fff;
	background-size: 9.5%;
}

.sp{
	display:none;
}

.pc{
	display:inline-block;
}

.siryou{
    margin-top: 5px;
    line-height: 1.3;
    font-size:130%;
    font-weight:bold;
}

@media screen and (max-width: 750px) {

.pc{
	display:none;
}

.sp{
	display:inline-block;
}
.bnr img{
	width:13%;
}
}

@media screen and (max-width: 500px) {


.bnr a{
    font-size: 100%;
}
.siryou{
    font-size:100%;
}
/*   banner add_200430   */
		

