@charset "UTF-8";
/* CSS Document */

/* title */
#title{
	background: url("../img/title_bg.jpg");
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size:cover;
	min-height: 400px;
	margin: 0 auto;
	padding: 70px;
	margin-top: -80px;
}
#title .title_wrapper{
	max-width: 1480px;
}
#title h2{
	color:#0C5EA4;
	font-size: 60px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	margin-top: 80px;
}
#title p{
	color:#0C5EA4;
	font-size: 20px;
}

@media screen and (max-width: 767px) {
	#title{
		padding:60px 20px;
		margin-top: -40px;
	}
	#title h2{
		font-size: 40px;
	}
}


/* 問い合わせフォーム */
#contactform{
	max-width: 1480px;
	padding: 130px 70px;
	margin: 0 auto;
}
.formTable.contct_form{
	width: 100%;
}
.formTable.contct_form th,.formTable.contct_form td{
	margin-bottom: 20px;
	padding: 30px 0;
	font-size: 18px;
}
.formTable.contct_form tr{
	border-bottom: 1px solid #DCE0E8;
}
.formTable.contct_form th{
	font-weight: 500;
}
.formTable.contct_form th span{
	padding:2px 10px 4px 10px;
	background: #D64545;
	font-size: 12px;
	color:#fff;
	margin-left: 5px;
}
form input[type="text"],textarea{
	border:1px solid #DCE0E8;
	background: #EBEDF2;
	width: 100%;
	padding: 20px;
}
form input[type="checkbox"]{
	margin: 0 5px 3px 5px;
}
.keibinaiyou input{
	display: inline-block;
}
.form-btn{
	padding-top: 50px;
	margin: 0 auto;
	text-align: center;
}
form input[type="submit"], form input[type="reset"], form input[type="button"],
#formWrap input[type="button"]{
	background: rgb(18,123,197);
	background: linear-gradient(90deg, rgba(18,123,197,1) 0%, rgba(6,66,134,1) 100%);
	font-size: 14px;
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	padding: 22px 22px;
	width: 300px;
	border-radius: 50px;
	display: inline-block;
	margin-top: 60px;
}
form input[type="submit"]:hover, form input[type="reset"]:hover, form input[type="button"]:hover,
#formWrap input[type="button"]:hover{
	opacity: 0.7;
}

@media screen and (max-width: 767px) {
	#contactform{
		padding: 60px 20px;
	}
	.formTable.contct_form th,.formTable.contct_form td{
		display: block;
		font-size: 15px;
	}
	.formTable.contct_form th{
		padding-bottom: 0;
	}
	.formTable.contct_form tr{
		margin-bottom: 0;
	}
	.formTable.contct_form td{
		padding: 10px 0;
	}
	.form-btn{
		padding-top: 10px;
	}
	.keibinaiyou input{
	display: inline-block;
}
	form input[type="submit"], form input[type="reset"], form input[type="button"],
#formWrap input[type="button"]{
	margin-top: 10px;
	width: 100%;
	}
}


/* fee */
#fee{
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(220,224,232,1) 100%);
	padding: 100px 70px;
}
#fee .fee_wrapper{
	background: #fff;
	box-shadow: 0 0 15px rgba(6,66,134,.15);
	padding: 80px;
	border-radius: 10px;
}
#fee .fee_wrapper h3{
	font-size: 36px;
	color: #064286;
	text-align: center;
	margin-bottom: 40px;
}
#fee .fee_wrapper table{
	border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width:100%;
  table-layout: fixed;
}
#fee .fee_wrapper table tr {
  background-color: #EBEDF2;
  padding: .35em;
  border-bottom: 2px solid #fff;
}
#fee .fee_wrapper table th,
#fee .fee_wrapper table td {
  padding:30px 10px;;
  border-right: 2px solid #fff;
}
#fee .fee_wrapper table th {
  font-size: .85em;
}
#fee .fee_wrapper table thead tr{
  background-color: #064286;
  color:#fff;
}
#fee .fee_wrapper table tbody th {
    background: #064286;
    color: #fff;
}
#fee .fee_wrapper .price{
	font-size: 24px;
	font-weight: 400;
  text-align: center;
  color: #064286;
}
#fee .fee_wrapper .non{
  background:#fff
}

@media screen and (max-width: 767px) {
	#fee{
		padding: 60px 20px;
	}
	#fee .fee_wrapper{
		padding:20px;
	}
	#fee .fee_wrapper h3{
		font-size: 24px;
		margin-bottom: 20px;
	}
  #fee .fee_wrapper table {
    border: 0;
    width:100%
  }
  #fee .fee_wrapper table th{
    display: block;
    border-right: none;
  }
  #fee .fee_wrapper table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  #fee .fee_wrapper table tr {
    display: block;
    margin-bottom: .625em;
  }
  #fee .fee_wrapper table td {
    border-bottom: 1px solid #bbb;
    display: block;
    font-size:14px;
    text-align: right;
    position: relative;
    padding: .625em .625em .625em 4em;
    border-right: none;
  }
  
  #fee .fee_wrapper table td::before {
    content: attr(data-label);
    font-weight: bold;
    position: absolute;
    left: 10px;
    color: #064286;
  }
  #fee .fee_wrapper table td:last-child {
    border-bottom: 0;
  }
  #fee .fee_wrapper table tbody th{
    color: #fff;
	  font-size: 14px;
}
	
	#fee .fee_wrapper .price{
		font-size: 14px;
	}
}

p.notes{
	font-size: 14px;
	text-align: right;
}
p.fee_title{
	color:#064286;
	font-size: 18px;
	font-weight: 500;
	padding-bottom: 10px;
	border-bottom: 1px solid #064286;
}
p.fee_text{
	color:#064286;
	font-size: 18px;
	font-weight: 400;
	padding-top: 10px;
}
@media screen and (max-width: 767px) {
	p.fee_text{
		font-size: 14px;
	}
}

/* faq */
#faq{
	background: rgb(18,123,197);
	background: linear-gradient(90deg, rgba(18,123,197,1) 0%, rgba(6,66,134,1) 100%);
	padding: 100px 70px;
}
.faq_wrapper{
	max-width: 1480px;
	margin: 0 auto;
}
.faq_wrapper .faq_title{
	width: 30%;
}
.faq_wrapper .faq_contents{
	width: 70%;
}
.faq_wrapper .faq_title h3{
	font-size: 36px;
	color:#fff;
}

@media screen and (max-width: 767px) {
	#faq{
		padding: 60px 20px;
	}
	.faq_box{
		flex-direction: column;
	}
	.faq_wrapper .faq_title,
	.faq_wrapper .faq_contents{
	width: 100%;
	}
	.faq_wrapper .faq_title h3{
		font-size: 24px;
	}
}

/* アコーディオン */
.accordion-area{
    list-style: none;
    width: 100%;
    margin:0 auto;
}

.accordion-area li{
    margin: 10px 0;
}

.accordion-area section {
}

/*アコーディオンタイトル*/
.accordion-title-wrap {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:18px;
    font-weight: normal;
    padding:24px 20px;
    transition: all .5s ease;
	border-bottom: 1px solid #ccc;background: #fff;
	color:#064286;
}

/*アイコンの＋と×*/
.accordion-title-wrap::before,
.accordion-title-wrap::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #127BC5;
    
}
.accordion-title-wrap::before{
    top:48%;
    right: 15px;
    transform: rotate(0deg);
    
}
.accordion-title-wrap::after{    
    top:48%;
    right: 15px;
    transform: rotate(90deg);

}

/*　closeというクラスがついたら形状変化　*/

.accordion-title-wrap.close::before{
	transform: rotate(0deg);
}

.accordion-title-wrap.close::after{
	display: none;
}

/*アコーディオンで現れるエリア*/
.accordion-box {
    display: none;/*はじめは非表示*/
    background:#EBEDF2;
	margin:0;
    padding:20px;
	position: relative;
}
.accordion-box p{
	display: inline-block;
	color:#064286;
	font-size: 16px;
}
h5.accordion-title::before{
    display: inline-block;
    content:'';
    width: 40px;
    height: 40px;
    background:url("../img/icon_q.svg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-right: 10px;
	vertical-align: middle;
}
@media screen and (max-width: 768px) {
	.accordion-box::before{
		width: 30px;
		height: 30px;
	}
	.accordion-box p{
		padding-left: 40px;
	}
	h5.accordion-title::before{
		width: 30px;
		height: 30px;
	}
	.accordion-box,
	.accordion-title-wrap {
		padding: 10px 30px 10px 10px;
	}
}

/* サンキューページ*/
.thanks_wrapper{
	padding: 130px 70px;
	max-width:960px;
	margin:0 auto;
}
.thanks_wrapper h3{
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 30px;
	color:#064286;
}
.thanks_wrapper .thanks_text{
	font-size: 15px;
}
@media screen and (max-width: 768px) {
	.thanks_wrapper{
		padding: 60px 20px;
	}
	.thanks_wrapper .thanks_text{
		font-size: 14px;
	}
}

/*かくにんページ*/
.form_message_wrap{
	padding:130px 70px;
	margin: 0 auto;
	background:#EBEDF2;
	}
.form_message_wrap h3{
	color:#064286;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 30px;
}

@media screen and (max-width: 768px) {
	.form_message_wrap{
		padding: 60px 20px;
	}
}