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

/* 初期化 */
*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role='list'],ol[role='list']{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}
li,ul{text-decoration: none;list-style: none;}
body,html {
  margin: 0;  /* 解決するため */
  padding: 0; /* 入れておくと無難 */
}

/* hader部分に入っているh1につけたid*/
#title{
   margin: 0;
}
/*モバイルファースト*/


.container{
	margin:0 auto;
	text-align: center;
	max-width:100%;
	padding:0 5px;
}


/*contact*/


@media screen and (min-width: 768px) {
.container,.contactWrap{
 
  max-width:768px;  
    }
}

.bl01,.bl02,.bl03,.bl04{
	margin-bottom:20px;
}

body{
	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}


header{
	height:50px;
	padding:20px 10px 10px 10px;
	background:#FEEE75;
}
header>h1>img{
	width:70px;
	height:auto;
}

@media screen and (min-width: 768px) {
  header{
	height:80px;
	
	background:#FEEE75;
}
header>h1>img{
	width:150px;
	height:auto;
	
}  
    
}
h2>img{
	margin:0 auto 15px auto;
}
.FV{
position:relative;
    background:#FEEE75;
}
.spFv,.pcFv{
width:100%;
height:auto;

}
.spFv{
	
}
.pcFv{
	display:none;
}


.fvCatch{

	
}

/*アニメーション*/
 .anim-box.poyoyon2.is-animated {
  animation: poyoyon2 1s ease-in-out forwards;
}
 
@keyframes poyoyon2 {
  0%  {
    transform: scale(1.0, 1.0) translate(0, 0);
  }
  15% {
    transform: scale(0.98, 0.9) translate(0, 5px);
  }
  30% {
    transform: scale(1.02, 1.0) translate(0, 8px);
  }
  50% {transform: scale(0.98, 1.05) translate(0, -8px);
  }
  70% {
    transform: scale(1.0, 0.9) translate(0, 5px);
  }
  100% {
    transform: scale(1.0, 1.0) translate(0, 0);
  }
  0%, 100% {
    opacity: 1;
  }
}


@media screen and (min-width: 768px) {

    
    .FV{
    background:#FEEE75;
    }
.fv img{
width:100%;
height:auto;
text-align: center;

}

.spFv{
	display:none;
}
.pcFv{
	display:block;
}
    
.fvCatch{
	position:absolute;
	width:22%;
	bottom:15%;
	left:23%;
}
 

}

/*fixed button*/
.fixed_btn { 
position: fixed;
bottom: 10px;
right: 10%;
left:10%;
width:80%;
z-index: 99999;
 cursor: pointer;
  transition: .3s;
margin:0 auto;
 text-align: center;
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
}

.fixed_btn a:hover{
opacity:0.85;	
}
/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}
.cvBtn{
	width:80%;
margin:-20px auto 10px auto;
position:relative;
z-index:999;
   text-align: center;
 cursor: pointer;
  transition: .6s;
   
}

.cvBtn a,fixed_btn a{
    display: block;
text-align: center;
margin:0 auto;
}
.cvBtn a:hover{
opacity:0.85;	
}

@media screen and (min-width: 768px) {
.fixed_btn { 
width:100%;
left:0;
    right:0;
}
.cvBtn{
	width:100%;
right: 0;
left:0;
}
.fixed_btn a{
margin:0 auto;
 text-align: center;
    }
.fixed_btn img{
  
        text-align: center;
        margin:0 auto;
    min-width:600px;
    }
    .cvBtn img{
        width:80%;
        text-align: center;
        margin:0 auto;
    }
    .question.container{
        text-align: center;
        margin:0 auto;
    }


}
section{
	
}
.bl02,.bl04{
	margin-bottom:10px;
}
.bl02>h2 img{
	margin:0 auto 15px auto;
	max-width:50%;
}

.bl05>h2 img{
    	margin:30px auto 20px auto;
	max-width:40%;
}
@media screen and (min-width: 768px) {

.bl02,.bl04{
	margin-bottom:30px;
}
    
.bl02>h2 img{
	margin:0 auto 20px auto;
	max-width:50%;
}
}
.worries{
display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.worries img{
max-width:49%;
padding:5px;
box-sizing:border-box;
}

.worries img:nth-child(even){
	margin-top:18px;
}

@media screen and (min-width: 768px) {
 .worries img{
max-width:calc(95% / 4);
padding:5px;
box-sizing:border-box;
}   
}

/*merit*/
.bl04>h2>img{
	max-width:80%;
	
}
.bl04 p{
font-size:0.85em;	
}
.bl04 h3{
	font-size:30px;
	color: #FFE736;
	margin-bottom:15px;
	 font-family: "Alata", sans-serif;
  font-weight: 400;
  font-style: bold;
	letter-spacing:0.1em;

	
}
.bl04 h4{
	margin-bottom:8px;
}

.bl04 .merit{
	padding:30px;
}

.bl04 .yBack{
	background:#FFFBDE;
}

@media screen and (min-width: 768px){
 .bl04 p{
font-size:1.2em;	
}
.bl04 h3{
	font-size:44px;
	color: #FFE736;
	margin-bottom:20px;
	 font-family: "Alata", sans-serif;
  font-weight: 400;
  font-style: bold;
	letter-spacing:0.1em;

	
}
.bl04 h4{
	margin-bottom:15px;
    font-size:1.5em;
}
   
    
}
/*スライダー*/
.slider {
  margin: 5px auto 15px auto;
width: 100%;
}
.slider img{
	padding:3px;
  height: auto;
  width: 100%;
box-sizing: border-box;
}
.slick-slider{
    padding:0;
}
/*コストカットのグラフ*/
.graff{
	width:100%;
	position: relative;
    margin:5px auto 10px auto;
	
    text-align: center;
}

.Number{
position:absolute;
width:13%;
bottom:16.5%;
left:42%;
}

@media screen and (min-width: 768px){
    
    .graff img{
    display:inline;
    }
}
/*bl05*/

/*サービス*/


.bl05{
    font-size:0.85em;
}

.aboutVideo{
    
    margin-bottom:20px;
}
.se01,.se03,.se04{
	position:relative;
}

.se03{
  margin-bottom:20px;  
}
.se04{
  margin-bottom:30px;   
}
.service{
	width:50%;
	
position:absolute;
	top:35%;
	right:5%;
}
.service03{
	width:50%;
	
position:absolute;
	top:35%;
	left:5%;
}

.movie{
    display:block;
    margin:10px auto 0px auto;
}
.pcVideo{display: none;}
@media screen and (min-width: 768px){
.bl05{
    font-size:1.2em;
}    
.service{
	width:45%;
	
position:absolute;
	top:35%;
	right:10%;
}
.service03{
	width:45%;
	
position:absolute;
	top:35%;
	left:10%;
}

.movie{
    text-align: center;
    margin:15px auto 10px auto;
}
    .pcVideo{display: block;
text-align: center;
    margin: auto;}
    .spVideo{
        display: none;
    }
}

/*footer*/

footer{
    color:#fff;
    background:#FEEE75;
    width:100%;
    padding:50px 20px 100px 20px;
    margin-top:-30px;
}
@media screen and (min-width: 768px){
	footer{
 
    padding:50px 20px 200px 20px;
  
}
}