@charset "utf-8";
body {
	font: normal 18px/1.7 "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",Arial,Verdana,sans-serif;
	text-align: left;
	color:#000;
	text-align: justify;
	overflow-x: hidden;
	background-color: #f4f4f4;
	font-feature-settings: "palt";

}

body .sp-item {
    display: none !important; }
  body .pc-item {
    display: block !important; }

  @media screen and (max-width: 640px) {
    body {
      min-width: inherit;
	  height:100%;
	  }
      body .sp-item {
        display: block !important; }
      body .pc-item {
        display: none !important; }
	  body .sp-item img {
		width:100%;}
}

@media screen and (max-width: 640px) {
	.sp img{
		max-width:90%;
}
	.sp02 img{
		max-width:100%;
}
.sp03 img{
		max-width:70%;
}
}

.fl_left {
	float: left;
}
.fl_right {
	float: right;
}
.ov_hd {
	overflow: hidden;
}
.bg_none {
	background-image: none!important;
}
a.rollover:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
.rollover:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
.center {
	text-align: center;
}
.right {
	text-align:right;
}
.line_0 {
	line-height: 0;
}
.zindex {
	z-index: 200;
}
input[type=radio] {
	width: 15px;
	height: 15px;
	vertical-align: middle;
}
input[type=image]:hover{
		opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	}


/* ----------------------------------------------------

    text

---------------------------------------------------- */
em {
	text-decoration: underline;
  font-style: normal;
}
.bd_red {
	border-bottom: 1px solid #FF0004;
	padding-bottom: 2px;
}
.bd_red02 {
	border-bottom: 3px solid #FF0004;
	padding-bottom: 0px;
}
.red {
	color: #ff0000;
}
.yellow {
	background-color: #ffff00;
}
.gray {
	color:#666666;
}
.bold {
	font-weight: bold;
}
strong {
	font-weight: bold;
}
.strike {
	text-decoration: line-through;
}
.ac {
	text-align: center !important;
}
.ar {
	text-align: right !important;
}
.al {
	text-align: left !important;
}
.bold {
	font-weight: bold !important;
}
.font10 {
	font-size: 10px !important;
}
.font11 {
	font-size: 11px !important;
}
.font12 {
	font-size: 12px !important;
}
.font13 {
	font-size: 13px !important;
}
.font14 {
	font-size: 14px !important;
}
.font15 {
	font-size: 15px !important;
}
.font16 {
	font-size: 16px !important;
}
.font17 {
	font-size: 17px !important;
	line-height:150%;
}
.font18 {
	font-size: 18px !important;
}
.font19 {
	font-size: 19px !important;
}
.font20 {
	font-size: 20px !important;
}
.font21 {
	font-size: 21px !important;
}
.font22 {
	font-size: 22px !important;
}
.font23 {
	font-size: 23px !important;
}
.font24 {
	font-size: 24px !important;
}
.font25 {
	font-size: 25px !important;
}
.font26 {
	font-size: 26px !important;
}
.font27 {
	font-size: 27px !important;
}
.font28 {
	font-size: 28px !important;
}
.font29 {
	font-size: 29px !important;
}
.font30 {
	font-size: 30px !important;
}
.font32 {
	font-size: 32px !important;
}
/* ----------------------------------------------------

    float

---------------------------------------------------- */
.fr {
	float: right !important;
}
.fl {
	float: left !important;
}
.clear {
	clear: both;
}
img {
	line-height: 0;
	padding: 0;
	margin: 0;
}
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
* html .clearfix {
	height: 1px;/*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

hr {
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
}
/* ----------------------------------------------------
    clearfix の代用
    <div class="hr"><hr /></div>
---------------------------------------------------- */

/* 共通 */
.container{
	box-shadow: 0 0 8px gray;
	width: 750px;
	margin: 0 auto;
	background-color: #fff;
}

section img{
	width:  100%;
}


@media screen and (max-width: 640px){
	.container{
		box-shadow: none;
		width: 100%;
	}

	h1 img{
		width: 100%;
	}

	section{
		background-color: #fff;
	}

	section img{
		width: 100%;
	}

}

/* 追従ボタン */
.wrapper{
	width: 100%;

}

.fix-btn{
  position:fixed; /*配置設定-fixed指定で追従*/
  z-index:1; /*前面・背面位置の設定*/
  right: 50px;
  bottom:10px;
}

.fix-btn img{
	width: 400px;
}

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


.fix-btn{
  position:fixed; /*配置設定-fixed指定で追従*/
  z-index:1; /*前面・背面位置の設定*/
  /*コンテンツの表示座標・位置※bottomも同様*/
	left: 10%;
  bottom:10px;
	width: 90%;
}

.fix-btn img{
	width: 90%;
}

}


/* ヘッダー */
header{
	width: 100%;
}

.phead{
	display: flex;
	align-items:center ;
	justify-content: space-between;
	background-color: #dde4ee;
	

}

.phead_logo{
	width: 230px;
	height: 125px;
	padding-left: 20px;
}

.phead_phone{
	width: 400px;
	height: 138px;

}

.phead_phone img{
	width: 100%;
}

h1{
	text-align: center;
	
}

h1 img{
	max-width: 750px;
	
}

@media screen and (max-width: 640px){
	.phead_logo{
	width: 24%;
	height: 24%;
	padding-left: 20px;
}

.phead_logo img{
	width: 100%;
}

.phead_phone{
	width: 60%;
	height: 20%;

	
}

.phead_phone img{
	width: 100%;
}
}


/* sec01 */
.sec01{
	background-color: #dde4ee;
}

.sec01 p{
	margin-top: 50px;
}

.sec01 p:last-of-type{
	margin-top: 50px;
	padding-bottom: 50px;
}

@media screen and (max-width: 640px){
	.sec01 p{
	margin-top: 30px;
}

.sec01 p:last-of-type{
	margin-top: 30px;
	padding-bottom: 30px;
}
}

/* sec02 */
.sec02 figure{
	margin: 50px auto;
}

.sec02 p{
	max-width: 90%;
	margin: 0 auto;
}

@media screen and (max-width: 640px){
	.sec02{
		margin-bottom: 30px;
	}
}

/* sec03 */
.sec03{
	background-color:#f3e1ce ;
}

.sec03 .inner{
	position: relative;
	width: 90%;
	margin: 30px auto;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.sec03 .inner iframe{
	position: absolute;
	width: 100%;
	height: 100%;
}

/* sec04 */
.sec04 p{
	width: 94%;
	margin: 30px auto 50px;
}

.sec04 p:last-of-type{
	width: 94%;
	margin: 30px auto 100px;
}

@media screen and (max-width: 640px){
	.sec04 h2{
		width: 90%;
		margin: 30px auto;
	}

	.sec04 p:last-of-type{
	width: 94%;
	margin: 30px auto 50px;
}

}
/* sec05 */
.sec05 h2{
	margin: 30px auto 50px;

}

.sec05 p{
	width: 90%;
	margin: 0 auto 20px;

}

@media screen and (max-width: 640px){
	.sec05 h2{
	margin: 20px auto;

}
}

/* sec06 */
.sec06{

	background: url(../images/sec06_top.webp)top no-repeat,url(../images/sec06_bottom.webp)bottom no-repeat;
	background-size: 100%;
	background-color: #f2ece2;
}

.sec06 figure{
	width: 90%;
	padding: 30px 0;
	margin: 0 auto;
}

.sec06 figure:first-of-type{
	width: 90%;
	padding: 100px 0 30px;
	margin: 0 auto;
}

.sec06 p{
	width: 90%;
	padding: 30px 0 100px;
	margin: 0 auto;
}

@media screen and (max-width: 640px){
	.sec06 figure:first-of-type{
	width: 90%;
	padding: 50px 0 30px;
	margin: 0 auto;
}

.sec06 p{
	width: 90%;
	padding: 30px 0 50px;
	margin: 0 auto;
}
}

/* sec07 */
.sec07{
	background: url(../images/sec04_bg.webp)repeat-y;
	background-size: 100%;
	padding-bottom: 50px;
}

.sec07 h2{
	width: 90%;
	margin: 0 auto ;
	padding-top: 50px;
}

.sec07 .voice{
	width: 90%;
	margin: 0 auto;
}

.sec07 h3{
	margin: 50px auto 30px;
	padding-bottom: 20px;
}

.sec07 figure{
	margin: 0 auto;
}

.sec07 p{
	margin: 40px auto 50px;
}

.sec07 .inner{
	position: relative;
	width: 100%;
	margin: auto;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.sec07 .inner iframe{
	position: absolute;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 640px){
	.sec07{
	padding-bottom: 20px;
}

.sec07 h3{
	margin: 50px auto 15px;
	padding-bottom: 0;
}

.sec07 p{
	margin: 20px auto 50px;
}


}

/* sec08 */
.sec08 h2{
	width: 90%;
	margin: 50px auto;
}

.sec08 p{
	width: 80%;
	margin: 50px auto;
}

@media screen and (max-width: 640px){
	.sec08 p{
	margin: 30px auto;
}
}

/* sec09 */
.sec09{
	background: url(../images/sec09_bg.webp);
}

.sec09 p{
	width: 90%;
	margin: 0 auto;
	padding: 20px 0;
}

.sec09 p:last-of-type{
	width: 90%;
	margin: 0 auto;
	padding: 20px 0 50px;
}

/* sec10 */
.sec10{
	background: url(../images/sec10_03.webp) no-repeat;
	background-position: bottom;
	background-size: 100%;
	background-color: #ffffdd;
	padding-top: 30px;
	padding-bottom: 150px;
}

.sec10 h2,.sec10 figure{
	width: 90%;
	margin: 0 auto;
}

.sec10 p{
	font-weight: bold;
	text-align: center;
	margin: 10px 0 30px;
}

.sec10 .inner{
	position: relative;
	width: 90%;
	margin: 30px auto 0;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.sec10 .inner iframe{
	position: absolute;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 640px){
	.sec10{

	padding-bottom: 20%;
}
}

/* sec11 */
.sec11{
  margin     : auto;
 /* ドット（水玉）模様のCSS */
  background-color : #ffffff;
  background-image :

  repeating-linear-gradient(to bottom,          /* 横線 */
       transparent 26px,
       rgba(235, 207, 196, 0.50) 27px,  rgba(235, 207, 196, 0.50) 27px,
       transparent 28px,  transparent 53px, 
       rgba(235, 207, 196, 0.50) 54px,  rgba(235, 207, 196, 0.50) 54px,
       transparent 55px,  transparent 80px, 
       rgba(235, 207, 196, 0.50) 81px,  rgba(235, 207, 196, 0.50) 81px,
       transparent 82px,  transparent 107px, 
       rgba(235, 207, 196, 0.50) 108px,  rgba(235, 207, 196, 0.50) 108px,
       transparent 109px,  transparent 134px, 
       rgba(235, 207, 196, 0.50) 135px,  rgba(235, 207, 196, 0.50) 135px),

    repeating-linear-gradient(to right,          /* 縦線 */
       transparent 26px,
       rgba(235, 207, 196, 0.50) 27px,  rgba(235, 207, 196, 0.50) 27px,
       transparent 28px,  transparent 53px, 
       rgba(235, 207, 196, 0.50) 54px,  rgba(235, 207, 196, 0.50) 54px,
       transparent 55px,  transparent 80px, 
       rgba(235, 207, 196, 0.50) 81px,  rgba(235, 207, 196, 0.50) 81px,
       transparent 82px,  transparent 107px, 
       rgba(235, 207, 196, 0.50) 108px,  rgba(235, 207, 196, 0.50) 108px,
       transparent 109px,  transparent 134px, 
       rgba(235, 207, 196, 0.50) 135px,  rgba(235, 207, 196, 0.50) 135px);
}

.sec11 figure{
	margin-top: 30px;
}

.sec11 p{
	width: 90%;
	padding-bottom: 50px;
	margin: 30px auto 0;
}

/* cta */
.cta{
	background-color: #d3dce9;
	padding: 50px 0;
}

.cta h2{
	margin: 0 auto ;
	padding-top: 30px;
	width: 90%;
}

.cta_box{
	background-color: #ffffff;
	width: 90%;
	margin: 0 auto;
}

.cta .btn_area{
	margin: 30px auto;
	text-align: center;
}

.cta .btn{
	margin-bottom: 30px;
}

.cta .btn img{
	width: 90%;
}

.cta p{
	margin: 0 auto ;
	padding-bottom: 30px;
	width: 80%;
}


/* sec12 */
.sec12 h2{
	color: #6988bb;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	margin-top: 50px;
}

.sec12 .faq_area{
	width: 90%;
	margin: 30px auto 0;
}

.sec12 .faq_header{
	display: flex;
	background-color: #6988bb;
	padding: 10px 20px;
	margin-bottom: 10px;
}

.sec12 .faq_header h3{
	color: #fff;
	font-weight: bold;

}

.sec12 .faq_header img{
	width: 2rem;
	padding-right: 10px;
}

.sec12 .faq_a{
	display: flex;
	padding: 0 20px;
}

.sec12 .faq_a img{
	width: 2rem;
	padding-right: 10px;
}



/* sec13 */
.sec13 h2{
	color: #6988bb;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0 20px;
}

.sec13 h3{
	text-align: center;
}

.sec13 .area{
	width: 94%;
	border-top: 1px solid #6988bb;
	margin: 30px auto;
}

.sec13 .area:last-of-type{
	width: 94%;
  border-bottom: 1px solid #6988bb;
	margin: 30px auto;
}

.sec13 .area h4{
	margin: 20px 0;
	padding: 0 20px;
	font-weight: bold;
}

.sec13 .area h4 span{
	color: #6988bb;

	font-weight: bold;
}


.sec13 .area p{
	margin: 20px 0;
	padding: 0 20px;
}





/* sec14 */
.sec14{
	background-color: #d3dce9;
	padding: 50px 20px 0;
}

.sec14 h2{
	font-size: 36px;
	font-weight: bold;
	padding-left: 5px;
}

.sec14 figure{
	width: 98%;
	margin: 0 auto;
}

/* sec15 */
.sec15 h2{
	color: #6988bb;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0 20px;
}

.sec15 .area{
	width: 94%;
	border-top: 1px solid #6988bb;
	margin: 30px auto;
}


.sec15 .area:last-of-type{
	width: 94%;
  border-bottom: 1px solid #6988bb;
	margin: 30px auto;
}

.sec15 .area h4{
	margin: 20px 0 10px;
	padding: 0 20px;
	font-weight: bold;
}

.sec15 .area p{
	margin: 10px 0 20px;
	padding: 0 20px;
}

.sec15 .area ul{
	margin: 10px 0 20px;
	padding: 0 20px;
}

.sec15 .area ul li{
	padding-bottom: 10px;
	line-height: 1.5;
}




footer{
	padding: 50px 0;
	text-align: center;
	font-size: 14px;
}