@charset "SJIS";
@import url("grid.css");

img {
	max-width:100%;
	height: auto;/*高さ自動*/
}


a {
    display:block;
    color: #666;
    text-decoration-line: none;
}

a:hover { 
    color: #999;
	opacity: 0.6 ;
}

/*コピーライトを下に固定
-------------------------------------*/
.wrapper{
    min-height: 100vh;
    position: relative;
    padding-bottom: 20px;/*←footerの高さ*/
    box-sizing: border-box;/*←全て含めてmin-height:100vhに*/
}

.copyright {
	width:100%;
	position: absolute;/*←絶対位置*/
    bottom: 0; /*下に固定*/
}


.f-small{
	font-size:12px;
	font-weight:normal;
}


.f10{
	font-size:10px;
}

.font02{
	margin-top:5rem;
	margin-bottom:5rem;
	text-align:center;
}


.center {
	text-align: center;
}

.left{
	text-align:left;
}

.mg01{
	margin:3rem 0;
}

.btn01{
	text-align:center;
	margin:0 auto;
}

/*ヘッダー
-------------------------------------*/
.header {
	display: flex;
    flex-direction: row;
    padding: 1rem 0 0 0;
}
.header-box {
	margin-left: auto;
	margin-top: 8px;
}
.contact-button {
	padding: 1rem;
	border: 2px solid #000;
}

/*メイン画像
-------------------------------------*/
.mainimg{
	line-height:0;
}


.mainimg img {
    width: 100vw;
}

.img-sp {
    display: none;
}

@media screen and (max-width: 414px){
    .img-pc {
        display: none;
    }

    .img-sp {
        display: block;
    }
}

/*メインコンテンツ
-------------------------------------*/
main {
    margin:0;
}

section {
	margin:0;
	padding:2rem 0 2.5rem 0;
}
.gray-back {
	background-color:#E8ECF6;
}


.gray-back02 {
	background: linear-gradient(#FFF, #D1D9ED);
}


.blue-back{
	background:url(../img/back01.png) repeat;
}

.blue-back02{
	background:#F0F0E1;
}

/*　斜めに
-------------------------------------*/
.content {
 background-color: #B2D8FF;  /* むらさき */ 
}
.content01 {
 height:auto;
 width: 100%;
 background-color: #FFF;  /* きみどり */
 clip-path: polygon(0 0, 100% 0, 100% 50%, 0 100%);
}
.content02 {
 height: auto;
 width: 100%;
 background-color: #B2D8FF;   /* むらさき */
}

/* キャッチ
-------------------------------------*/
.catch{
	padding:2rem 0;
	background:#D7EBFF;
	background:url(../img/catch-back.jpg) no-repeat bottom;
}

.catch-sub{
	font-weight:bold;
	text-align:center;
}

.balloon {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #FFF;
  font-size: 16px;
  background: #002DB2;
  border-radius: 100px;
}

.balloon:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #002DB2;
}


.catch h2 {
  margin-bottom:1rem;
  text-shadow:1px 0 0 #fff,0 1px 0 #fff,-1px 0 0 #fff,0 -1px 0 #fff,2px 2px 0 #fff;
 }

.cacth-title {
    background: none;
    color: #0E5CAD;
    font-size: 4.2rem;
}

.catch-back{
	background:url(../img/back02.png) repeat;
	border:solid 4px #0E5CAD;
	padding: 3rem;
    border-radius: 10px;
	box-shadow:0px 0px 10px 5px rgba(12,75,139,0.75) inset;
}

.catch p {
    font-size:1.6rem;
	color:#FFF;
}

.catch-pic{
	text-align:center;
	margin-top:auto;
	line-height:0;
}

.red{
	color:#C00;
}

.blue{
	color:#0059B2;
}

.yellow{
	color:#FFCF41;
}

.marker {
    background: linear-gradient(transparent 85%, #fef600 85%);
	font-size:2.4rem;
	color:#fef600;
}

/*　診断するボタン
-------------------------------------*/
.btn01{
	margin:3rem auto;
}


/*　お悩み
-------------------------------------*/
.worry{
	margin: 1.0rem auto;
    max-width: 1000px;
	background:url(../img/n-back.jpg) no-repeat;
    padding: 2.0rem 2.0rem 0 2.0rem;
    position: relative;
	box-shadow:0px 0px 10px 5px rgba(255,255,255, 0.9) inset;
}

.worry h2 {
    width: 80%;
	margin:0 auto 1rem auto;
    padding: 1rem;
    background: #333;
    color: #FFF;
    border-radius:10px;
}

.worry-box{
	width:80%;
	margin:2rem auto;
    display:flex;
	justify-content: center;
}

.worry-main {
    padding: 2rem;
	background:rgba(255,255,255,0.45);
	margin-bottom:2rem;
	margin-right:1rem;
	position: relative;
}

.worry-main p {
    padding-top:1.6rem;
	font-size:2.2rem;
	border-bottom:#B4B4B4 dashed 1px;
	font-weight:bold;
	color:#333;
}

.worry-sub{
	width:28%;
	margin-top: auto;
	line-height:0;
}


.worry-sub img{
	width:100%;
	height:auto;
}


/*　ローン
-------------------------------------*/
.loan01{
	background:#B2D8FF;
}

.loan01 h3{
	margin-top:3rem;
	color:#0059B2;
}

.loan02{
	width:80%;
	margin:0 auto 2rem auto;
	padding:1rem;
	background:url(../img/back01.png) repeat;
	text-align:center;
	color:#06C;
}

.line01 {
  font-weight:bold;
}

.under {
    border-bottom: 0.2rem solid #9DCEFF;
}

.mt01{
	margin-top:1.0rem;
}

.tagbox {
    text-decoration: none;
    padding: 0.5rem;
	margin-bottom:1rem;
    background: #f7f7f7;
    border-left: solid 8px #E8ECF6;
	border-left: solid 8px #FAAAB9;
    color: #58ad5a;
	color:#C00;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.22);
	font-size:2.0rem;
}

.f26{
	font-size:2.6rem;
}

.marker01{
    background: linear-gradient(transparent 85%, #fef600 85%);
}

.tagbox p{
	margin-bottom:0;
}

.loan-text{
	text-align:center;
}


.emp{
	font-size:2.6rem;
}

.table01{
width: 100%;
border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.table01 th{
width:25%;
padding:10px;
text-align: left;
vertical-align: top;
color: #444;
background-color: #f3f3f3;
border-top: 1px solid #fff;
border-right: 1px solid #CCC;
border-bottom: 1px solid #ccc;
font-weight:normal;
}
.table01 td{
width:75%;
padding:10px;
background-color: #fafafa;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

/*　ご融資の流れ
-------------------------------------*/

.flow-box{
	padding:1rem;
	background:#FFF;
	border:#CCC solid 1px;
}

.flow h3{
	padding-bottom:1.0rem;
	text-align:left;
	vertical-align:middle;
	color:#0059B2;
	border-bottom:#0059B2 solid 2px;
	font-size:1.8rem;
}

.flow h3 img{
	vertical-align:middle;
}

.yaji{
	color:#CCCCCC;
}

/*　お客様の声
-------------------------------------*/
.voice{
	background:#B2D8FF;
	padding-top:2rem;
}

.voice h3 {
    color: #0059B2;
}

.voice-box{
	  display:flex;
	  margin-bottom:2.6rem;
	  padding:0 6rem;
}

.voice-text {
	width:80%;
    padding: 2rem;
    background: #FFF;
    border-radius:10px;
	border:#FFF solid 1px;
	background:url(../img/back03.png) repeat;
}


.voice-pict {
  width: 20%;
  margin:0 3%;
}

.voice-pict img{
  width: 100%;
  height:auto;
}

.voice-box02 {
        flex-direction: row-reverse;
}

.back-yellow{
}

.v-icon{
	background:#FFCF40;
	padding:0 1rem;
    border-radius:100px;
	font-size:1.6rem;
	margin-right:1%;
	color:#FFF;
	vertical-align:middle;
}


/*　無料診断
-------------------------------------*/


.shindan dl{
	border-bottom:#CCC dashed 1px;
	padding: 15px 0;
}

.shindan dt{
	color:#278ECE;
	font-weight:bold;
padding-bottom: 5px;
}

.shindan dd{
padding-bottom: 5px;

}


.shindan input,.shindan textarea,.shindan select,.shindan fieldset {
    margin: 0;
}

.result-text01{
	font-size:26px;
	color:#278ECE;
}

.result-text02{
	font-size:60px;
	color:#F00;
	font-weight:bold;
}

.result{
	width:80%;
	margin:0 auto 3rem auto;
}

.result-box01{
	margin:3rem auto;
	padding:1rem;
	width:80%;
	text-align:center;
	border:#87cefa solid 6px;
	background:#ffffe0;
}


#shindan02{
	background:#f0f8ff;
	padding-top:2rem;
	border:#87cefa solid 4px;
	border-radius:16px;
}

#shindan02 h3{
	text-align:center;
	background:#0093E9;
	padding:1rem;
	color:#FFF;
}

/*　フォーム
-------------------------------------*/
#oderform{
	padding-top:2rem;
	background:#f5f5f5;
}

#oderform h3{
	padding:1rem;
	background:#095A91;
	color:#FFF;
}

#oderform .text01{
	text-align:center;
	margin-bottom:3rem;
}

#oderform th,#shindan02 th{
	font-weight:bold;
	color:#278ECE;
}

#oderform td{
	padding-left:0;
}


.table th {
	width: 300px;
}

.line-none{
	border:none;
}

.consent{
	margin:3rem 0;
}

.error{
	width:60%;
	margin:3rem auto 0 auto;
}

.error li{
	text-align:left;
	margin-left:20px;
}

.required{
	font-size:12px;
	padding:0.2rem;
	margin-bottom:0.4rem;
	background:#F00;
	color:#FFF;
}

.width01{
	width:60%;
	box-sizing: border-box;
}

.width02{
	width:80%;
	box-sizing: border-box;
}

.outcome{
	background:#FFC;
	margin:2rem 1rem;
}

#dobox {
  overflow:auto;
  height:190px;
  background:#F5F5F5;padding:10px;
  margin-top:4rem;
}


/*　フッター
-------------------------------------*/
footer {
    background-color:#696969;
    padding: 5rem 0;
	text-align:center;
	color:#FFF;
	font-size:16px;
}

footer h4{
	font-size:1.8rem;
}

footer ul{
	list-style:none;
}


/*　コピーライト
-------------------------------------*/
.copyright {
    text-align: center;
    padding: 1rem 0;
    background-color:#696969;
	color: #fff;
	font-size:12px;
}
.copyright a {
    color: #fff;
    text-decoration: none;
	display: inline;
}

/*　フッター固定申込みボタン
-------------------------------------*/
.footer_fix_btn {
  position:fixed;
  bottom:0;
  width:100%;
  padding:1rem;
  text-align:center;
  background: #e0ffff;
  font-size:16px;
  color:#000000;
  border:2px solid #0099ff;
  opacity:0.9;
  z-index: 99;
}

.footer_fix_btn a {
  display:block;
  width:100%;
  text-decoration:none;
  color: #0099ff;

}

.footer_fix_btn a:hover {
  opacity:0.8;
}

.bold{
	font-weight:bold;
}

@media screen and (min-width: 768px) {
   .fix-sp{
      display:none;
    }
	
.shindan dt {
    clear: left;
    float: left;
    width: 28%;
}

.shindan dd {
	margin-left:30%;
}


}


/*　ページトップへ戻るボタン
-------------------------------------*/
#pagetop {
    position: fixed;
    bottom: 15px;
    right: 15px;
}
#pagetop a {
    display: block;
    background: #a9a9a9;
    color: #fff;
    width: 50px;
    padding: 10px 5px;
    text-align: center;
}
#pagetop a:hover {
    background: #666;
}


/* 幅800px以下の表示
-------------------------------------*/
@media screen and (max-width: 800px){
	
.balloon {
  margin: 0 0 1.5em 0;
}
	
.cacth-title {
    font-size: 3.2rem;
}
	
.worry-box{
   margin-bottom:0;
}
.worry-main p {
	font-size:1.8rem;
}

.worry h2 {
	font-size:2.2rem;
}

.voice{
	margin:0 2rem;
}


}


/* 幅767px以下の表示
-------------------------------------*/
@media screen and (max-width: 767px){
	
/*　ヘッダー
-------------------------------------*/

.header-box {
	display: none;	
}

.font01{
	font-size:20px;
	padding-bottom:1.2rem;
}


section {
    padding:1rem 0;
}

/* キャッチ
-------------------------------------*/

.catch{
	background:url(../img/catch-back.jpg) no-repeat bottom;
}

.catch-sub{
	font-size:1.4rem;
}


.catch h2{
	font-size:2.6rem;
}

.catch-back{
	padding: 1.6rem;
}

.catch p {
    font-size:1.4rem;
}

.btn01{
	margin:2rem 1rem;
}

.balloon {
  font-size: 12px;
}


.marker {
	font-size:2.0rem;
}

.loan02{
	width:90%;
}

.loan-text{
	text-align:left;
}



.tagbox {
	font-size:1.8rem;
}

.voice-text {
    padding: 1rem;
    font-size: 1.2rem;
}

/*　お客様の声
-------------------------------------*/
.voice{
	margin:0 1rem;
}

.voice h3 {
	font-size:1.6rem;
}

.voice-box{
	  display:flex;
	  margin-bottom:2rem;
	  padding:0;
}

.voice-text {
	width:70%;

}

.voice-pict {
  width: 30%;
  margin:0 3%;
}

.voice-pict img{
  width: 100%;
  height:auto;
}

.voice-box02 {
        flex-direction: row-reverse;
}

.back-yellow{
	background:url(../img/back02.png) repeat;
}

.v-icon{
	padding:0 0.6rem;
	font-size:1.2rem;
	margin-right:1%;
}
	
/* 無料診断
-------------------------------------*/

.result-text01{
	font-size:22px;
}

.result-text02{
	font-size:40px;
}

.result{
	width:100%;
	margin:0 auto 3rem auto;
}

.result-box01{
	width:100%;

}


#shindan02{
	margin:0 1rem;
}

#shindan02 h2{
	margin-bottom:0;
}
	
/*　フォーム
-------------------------------------*/

#oderform .text01{
	text-align:left;
}

#oderform{
	margin:0 1rem;
}

.sp-line{
	border-bottom:none;
}


#oderform td{
	padding-top:0;
}

.table th {
	width:100%;
	display: block;
}	
.table td {
	display: block;
}

.width01{
	width:100%;
}

.width02{
	width:100%;
}

.error{
	width:90%;
}


.font02{
	text-align:left;
}


input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
    font-size: 14px;
}


}


/* 幅414px以下の表示
-------------------------------------*/
@media screen and (max-width: 767px){
	
body{
	font-size:14px;
}

.catch img{
	width:50%;
}

.catch-back p{
	font-size:1.4rem;
}


/*　お悩み
-------------------------------------*/
.worry-main {
    padding:0 1rem 1rem 1rem;
}

.worry-main p {
    font-size: 1.4rem;
    margin-bottom: 0;
}

.worry h2 {
    width: 100%;
	font-size:1.8rem;
}

.worry-box{
	width:100%;
	margin-bottom:0;
}

.worry-sub{
	width:40%;
}

.loan01 h3{
	font-size:1.8rem;

}
.table01 tr,.table01 td{
	font-size:14px;
}

#oderform h3,#shindan02 h3{
	font-size:18px;
}




/*　フッター
-------------------------------------*/
footer {
 	font-size:12px;
}

footer h4{
	font-size:1.4rem;
}

footer ul{
	list-style:none;
}


/*　コピーライト
-------------------------------------*/
.copyright {
	font-size:10px;
}
}