@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;
	

}

.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: 20%;
	height: 20%;
	padding-left: 20px;
}

.phead_logo img{
	width: 100%;
}

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

	
}

.phead_phone img{
	width: 100%;
}
}


/* sec01 */
.sec01 p{
	padding: 50px 20px 100px;
}

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

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

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

/* 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{
	background: url(../images/sec04_bg.webp)repeat-y;
	background-size: 100%;
	padding-bottom: 50px;
}

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

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

.sec04 h3{
	margin: 50px auto 0;
	padding-bottom: 20px;
}

.sec04 figure{
	margin: 0 auto;
}

.sec04 p{
	margin: 30px auto 50px;
}

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

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

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

/* sec05 */
.sec05 h2{
	width: 90%;
	margin: 30px auto 50px;

}

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

}


/* sec06 */
.sec06{
	background: url(../images/sec06_bg.webp);
}

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

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

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

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

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

.sec07 .inner{
	position: relative;
	width: 90%;
	margin: 30px auto 0;
	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: 20%;
}
}

/* sec08 */
.sec08{
  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);
}

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

.sec08 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%;
}

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

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

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

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

}

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

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

.sec09 .faq_a img{
	width: 3rem;
	padding-right: 10px;
}

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

.sec10 h3{
	text-align: center;
}

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

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

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

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

	font-weight: bold;
}


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

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

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

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

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

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

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

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

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

.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 10px;
	padding: 0 20px;
	font-weight: bold;
}

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

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

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




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