@charset "utf-8";
/*WEBフォント*/
html {
	height: 100%;
	width: 100%;
	font-size: calc(100vw / 32);
	font-family: "Shin Maru Go Regular"!important;
	
}

.jun501{
	font-family: "Jun 501"!important;
	
}

.marugo{
	font-family: "Shin Maru Go Regular"!important;
	
}

/*スマホのみ電話を発信CSS*/
@media(min-width: 768px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}
@media (min-width: 768px) {
html {
	font-size:62.5%;
	width: 100%;
}

  }

body {
	position: relative;
}

/*リセットCSS*/
body, input, select, textarea,h1,h2,h3,h4,h5,h6 {
	color: #534741!important;
	margin: 0;
	padding: 0;
	font-size:1.6rem;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	font-size: 1rem;
}

@media (max-width: 575px) {
p{
	font-size:1.4rem;
}
}

@media screen and (min-width: 576px) and (max-width: 767px) {
p{
	font-size:1.4rem;
}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
p{
	font-size:1.4rem;
}

}

@media screen and (min-width: 992px) and (max-width: 1199px) {
p{
	font-size:1.4rem;
}

}
	
@media (min-width: 1200px) {
p{
	font-size:1.4rem;

}
}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
a {outline: none; text-decoration:none!important;}
a:link {color:#000; text-decoration:none!important; transition: color 0.3s ease-out;}
a:visited {color: #000; text-decoration:none!important;}
a:hover {color: #808080; text-decoration:none!important;}

ul{margin:0; padding:0;}
li{list-style:none;}

/*containerの隙間を無くす*/
.no-gutters {
  margin:0!important;
  padding:0!important;
}
 
.no-gutters　> .col,
.no-gutters　> [class*="col-"] {
  margin:0!important;
  padding:0!important;
}

.no-padding{
	padding-left: 0!important;
	padding-right: 0!important;
}

.clear{
	clear: both;
}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.tab { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
}

@media (max-width: 767px) {
.tab { display: none !important; }
}

/*文字のサイズ 変更*/
.size-button {
	color: #717071;
  cursor: pointer;
  display: inline-block;
  text-align: center;
	
  }


/*文字のサイズ*/
@media (max-width: 575px) {
	
.font--XSmall{
	font-size: .8rem;
	
}

.font--Small{
	font-size: 1.2rem;
	
}

.font--Mid{
	font-size: 1.6rem;
	
}

.font--Big{
	font-size: 2rem;
}


}

@media screen and (min-width: 576px) and (max-width: 767px) {
	
.font--XSmall{
	font-size: .8rem;
	
}

.font--Small{
	font-size: 1.4rem;
	
}

.font--Mid{
	font-size: 1.8rem;
	
}

.font--Big{
	font-size: 2.4rem;
}


}

@media (min-width: 768px) {

.font--XSmall{
	font-size:1rem;
	
}

.font--Small{
	font-size: 1.4rem;
	
}

.font--Mid{
	font-size: 2rem;
	
}

.font--Big{
	font-size: 3rem;
}
}
/*文字の色*/

.font--Blue{
	color: #808080;
}

.font--Blue2{
	color: #1ccaf1;
}


.font--Gray{
	color: #595757;
}

.font--Green{
	color: #5dcd33;
}

.font--Y-Green{
	color: #a9c400;
}

.font--LightGray{
	color: #999;
}

.font--White{
	color: #fff!important;
}

.font--Black{
	color: #231815;
}

.font--Orange{
	color: #f29600;
}

.font--Red{
	color: #e50012;
}

.font--Purple{
	color:#824c71;
}

/*border*/
.bdr--blk{
	border: 1px solid #000;
	
}
.bdr--top--gray{
	border-top: 1px solid #838383;
	
}

.bdr--top--purple{
	border-top: 1px solid #824c71;
	
}

.bdr--btm--gray{
	border-bottom: 1px solid #838383;
	
}

.bdr--btm--white{
	border-bottom: 1px solid #fff;
	
}
.bdr--btm--blk{
	border-bottom: 1px solid #000;
	
}

.bdr--right--white2{
	
}

.bdr--btm--blue{
	border-bottom: 1px solid #808080;
	
}

.bdr--btm--blue3{
	border-bottom: 3px solid #808080;
	
}


.bdr--btm--white3{
	border-bottom: 3px solid #fff;
	
}

.bdr--btm--brown3{
	border-bottom: 3px solid #3e1f31 ;
	
}




/*br*/

@media (max-width: 575px) {
.sp__br{
	display: block;
	}
.sp__br--xs{
	display:block;
	}

.sp__br--none{
	display: none;
	
	}
	
.sp__br--xs--none{
	display: none;
	
	}
	
	
}


@media screen and (min-width: 576px) and (max-width: 767px) {
.sp__br{
	display: block;
	}
	
.sp__br--xs{
	display: none;
	}
.sp__br--none{
	display: none;
	}
.sp__br--xs--none{
	display: block;	
	}
.br--lg{
	display: none;
	}	
	
}
	
@media screen and (min-width: 768px) and (max-width: 989px) {
.sp__br{
	display: none;
	}
	
	
.sp__br--xs{
	display: none;
	}
.sp__br--xs--none{
	display: block;	
	}
	
	
.br--lg{
	display: none;
	}	
}


@media (min-width: 990px) {	

.sp__br{
	display: none;
	}
.sp__br--xs{
	display: none;
	}
.sp__br--xs--none{
	display: block;	
	}
	
	
.br--lg{
	display: block;
	}	

}


/* 5 Columns */

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

/*header*/
#header .container-fluid{
	padding-left: 0!important;
	padding-right: 0!important;
}

@media (max-width: 767px) {
header{
	width:100%;
	padding:0px;


}
header .main_box{
	width:100%;
	margin:0px auto;
	padding:0px;
	box-sizing: border-box;

}

header .main_box h1{
	float: left;
}

header .main_box h1.logo3 a{
	width:46.875vw;/*360px /767*/
	height:9.126vw; /*70px /767*/
	display:block;
	text-indent:-9999px;
	background: url("../img/logo_sp.webp");
	background-repeat:no-repeat;
	background-size: 46.875vw;/*360px /767*/
	float:left;
	position: fixed;
	margin: 0.652vw; /*5px /767*/
}


header .main_box .txt span{
	display: none;
}

header .main_box .menu_btn a{
	position: fixed;
	top:1.304vw; /*10px /767*/
	right:1.304vw; /*10px /767*/
    width:17.7083vw; /*136px /767*/
    height:6.77083vw; /*52px /767*/
	display:block;
	text-indent:-9999px;
	background:url(../img/nav_bn01.webp);
	background-repeat:no-repeat;
    background-size:auto 6.77083vw; /*52px /767*/
	background-position:right center;
	z-index: 99999;
	}
	
header .main_box .menu_btn.active a{
	position: fixed;
	top:1.304vw; /*10px /767*/
	right:1.304vw; /*10px /767*/
    width:17.7083vw; /*136px /767*/
    height:6.77083vw; /*52px /767*/
	display:block;
	text-indent:-9999px;
	background:url(../img/nav_bn02.webp);
	background-repeat:no-repeat;
    float:right;
    background-size:auto 6.77083vw; /*52px /767*/
	background-position:right center;
	z-index: 99999;

}
	
header .main_box .footer_btn--tel a{
	position: fixed;
	bottom:0; 
	left: 0;
    width:50vw;
    height:auto; 
	display:block;
	z-index: 999;
	}
	
header .main_box .footer_btn--line a{
	position: fixed;
	bottom:0; 
	right: 0;
    width:50vw;
    height:auto; 
	display:block;
	z-index: 999;
	}
	
header .main_box .footer_btn--line img, header .main_box .footer_btn--tel img{
	width: 50vw;
	height: auto;
	}
	



.header_navi{
    width:100%;
	height: 100%;
	margin:0px;
	top:0;
	position: fixed;
	z-index:9999;
	display:none;
	
}
.header_navi ul {
    width:100%;
    padding: calc((100vh - 70.404vw) /4) 0 0;
    list-style-type: none;
	text-align:  center;
	background: rgba(27,179,127,0.85);
	font-family: "Jun 501"!important;
	height: 100%;
	

}

.header_navi ul li{
    width:100%;
	margin-bottom: 10px;
	display: block;
	
}

.header_navi ul li a:link,.header_navi ul li a:visited{
    width:100%;

    margin:0 auto;
    text-align: center;
    font-size:1.4rem;
	font-weight: bold;
    line-height:3rem;
    color:#fff;
    display:block;
}
.header_navi ul li a:hover{
    width:100%;

    margin:0 auto;
    text-align: center;
    font-size:1.4rem;
	font-weight: bold;
    line-height:3rem;
	color: #fcee21!important;
    display:block;
	background: rgba(27,179,127,1);

}

.header_navi ul li.box__bn--fix{
	width:100%;
	height: 16.949vw; /*130px /767*/
	padding: 5px;
	display: block;

}

.header_navi ul li.box__bn--fix a img{
	width: 84.6354vw;/*650px /767*/
	height: 16.949vw; /*130px /767*/
	margin: 5px auto;

}



}

@media screen and (min-width: 768px) and (max-width: 1199px) {
header{
	width:100%;
	padding:0px;
	margin: 0 auto;

	box-sizing: border-box;
}
header .main_box{
	width:100%;
	margin:0px auto;
	padding:0px 50px;

}

header .main_box h1.logo a{
	width:28.333vw;/*340px /1200*/
	height:7.500vw;/*90px /1200*/ 
	margin-top:1.250vw;/*15px /1200*/
	display:block;
	text-indent:-9999px;
	background: url("../img/logo.webp");
	background-repeat:no-repeat;
	background-size:28.333vw 100%;/*340px /1200*/
	float:left;
}
	
header .main_box h1.logo2 a{
	width:18.333vw;/*220px /1200*/
	height:3.333vw;/*40px /1200*/
	margin-top:0.250vw;/*3px /1200*/
	display:block;
	text-indent:-9999px;
	background: url("../img/logo2.webp");
	background-repeat:no-repeat;
	background-size: 18.333vw;/*220px /1200*/
	float:left;
}

.header__bn , .header_navi, .menu_btn{
	display: none;
}
	
}

@media (min-width: 1200px) {
header{
	width:100%;
	padding:0px;
	box-sizing: border-box;
	

}
header .main_box{
	width:1200px;
	margin:0px auto;
	padding:0px 50px;
}

header .main_box h1.logo a{
	width:340px;
	height:90px;
	margin-top:15px;
	display:block;
	text-indent:-9999px;
	background: url("../img/logo.webp");
	background-repeat:no-repeat;
	background-size: 340px;
	float:left;
}
	
header .main_box h1.logo2 a{
	width:220px;
	height:40px;
	margin-top:3px;
	display:block;
	text-indent:-9999px;
	background: url("../img/logo2.webp");
	background-repeat:no-repeat;
	background-size: 220px;
	float:left;
}
	
header .main_box #nav{
	width:530px;
	margin:0px;
	padding:0px;
	height:85px;
	float: right;

}

header .main_box #nav ul{
	margin:35px 0 0 0; 
}

header .main_box #nav ul li a:link{
	float: left;
	font-size: 1.6rem;
	margin: 0 10px;
	height: 24px;
	line-height: 24px;
	color: #534741;
}
	
header .main_box #nav ul li a:hover{
	float: left;
	font-size: 1.6rem;
	margin: 0 10px;
	height: 24px;
	line-height: 24px;
	color: #e50012;
}
	
header .main_box #nav ul li img{
	width: 24px;
	height: 24px;


}


.header__bn , .header_navi, .menu_btn{
	display: none;
}

.header__logo{
	text-align: center;
}
	
#header { position: fixed; width: 100%; z-index: 1000; 
}
	
	

}
/* ヘッダー */
@media (max-width: 767px) {
.ly_header{
	position: absolute;
	top: 0;
	z-index: 9999;

}

.ly_fixedNav {
}
	
.box__header--btm{
	background-image: url("../img/header_bg_spbtm.webp");
	background-position: bottom;
	background-repeat: repeat-x;
	background-size: 100% auto;
	position: absolute;
	bottom:0;
	height: 100%;
	width: 100%;
	}
	

}


@media screen and (min-width: 768px) and (max-width: 1199px) {
	
	
.ly_header{
	font-size: 1.333vw;/*16px /1200*/
	float: right;
	position: absolute;
	top: 0;
	z-index: 9999;

	}
	
.box__header--btm{
	background-image: url("../img/header_bg_pcbtm.webp");
	background-position: bottom;
	background-repeat: repeat-x;
	background-size: 100% auto;
	position: absolute;
	bottom: 130px;
	height: 100%;
	width: 100%;
	}
	

.bl_headerNav {
	font-size: 1.333vw;/*16px /1200*/
	float: right;
}
	
.bl_headerNav ul{
	margin-top: 2.500vw;/*30px /1200*/
}
	


.ly_header_inner,
.bl_fixedNav {
  padding-inline: 1rem;
}

.ly_fixedNav {
  background-color: rgba(27,179,127,0.85);
  position: fixed;
  inset-block-start: -100%;
  inset-inline-start: 0;
  z-index: 30;
  inline-size: 100%;
  transition: inset-block-start .4s, visibility .4s;
  visibility: hidden;
	height: 4.75vw;/*57px /1200*/
}

.ly_fixedNav.is_active {
  inset-block-start: 0;
  visibility: visible;
}

.bl_headerNav_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
	font-family: "Jun 501"!important;
}
	
 .bl_headerNav_list  a:link, .bl_headerNav_list a:visited {
    display: inline-block;
    line-height: 1.5;
    padding-inline:  1.333vw;/*16px /1200*/
	  color: #534741;
	  font-weight: bold;
  }
	
 .bl_headerNav_list  a:hover {
	  color: #807773;

  }
	
 .bl_headerNav_list li{
	  border-right: 3px solid #534741;
}
	
 .bl_headerNav_list li:last-child{
	  border-right:none;
  }
	
.bl_fixedNav_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
	
.bl_fixedNav_list  a:link, .bl_fixedNav_list a:visited {
    display: inline-block;
    line-height: 1.5;
    padding-inline: 0.833vw;/*10px /1200*/
	  color: #fff;
	  font-weight: bold;
  }
	
.bl_fixedNav_list  a:hover {
	  color: #fcee21;

  }
	
.bl_fixedNav_list li{
	  border-right: 2px solid #fff;
}
	
.bl_fixedNav_list li:last-child, .bl_fixedNav_list li:nth-last-child(2) {
	  border-right:none;
  }
	
.bl_fixedNav_list li:last-child{
	  border-right:none;
  }
	
	
.ly_header .box__bn{
	float: right;

}

.ly_header .box__bn img{
	float: left;
	margin-left: 0.833vw;/*10px /1200*/
	width: 21.41667vw;/*257px /1200*/
	height: 4.75vw;/*57px /1200*/

}

.ly_header .box__bn--fix a{
	margin: 0!important;
	padding: 0!important;
}

.ly_header .box__bn--fix img.tel{
	float: left;
	width:7.583vw;/*91px /1200*/ 
	height:3.167vw;/*38px /1200*/

}

.ly_header .box__bn--fix img.line{
	float: left;
	margin-left: 0.833vw;/*10px /1200*/
	width:8.083vw;/*97px /1200*/
	height:3.167vw;/*38px /1200*/

}



}

@media (min-width:1200px) {
.ly_cont {
  text-align: center;
  block-size: 1100px;
  padding-block-start: 60px;
}
	

.ly_header{
	font-size: 16px;
	float: right;
	position: absolute;
	top: 0;
	z-index: 9999;
	}
	

	

.bl_headerNav {
	font-size: 16px;
	float: right;
}
	
.bl_headerNav ul{
	margin-top: 30px;
}
	


.ly_header_inner,
.bl_fixedNav {
  padding-inline: 1rem;
}

.ly_fixedNav {
  background-color: rgba(27,179,127,0.85);
  position: fixed;
  inset-block-start: -100%;
  inset-inline-start: 0;
  z-index: 30;
  inline-size: 100%;
  transition: inset-block-start .4s, visibility .4s;
  visibility: hidden;
	height: 57px;
}

.ly_fixedNav.is_active {
  inset-block-start: 0;
  visibility: visible;
}

.bl_headerNav_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
	font-family: "Jun 501"!important;
}
 .bl_headerNav_list  a:link, .bl_headerNav_list a:visited {
    display: inline-block;
    line-height: 1.5;
    padding-inline: 1em;
	  color: #534741;
	  font-weight: bold;
  }
 .bl_headerNav_list  a:hover {
	  color: #807773;

  }
 .bl_headerNav_list li{
	  border-right: 3px solid #534741;
}
	
 .bl_headerNav_list li:last-child {
	  border-right:none;
  }
	
.bl_fixedNav_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.bl_fixedNav_list  a:link, .bl_fixedNav_list a:visited {
    display: inline-block;
    line-height: 1.5;
    padding-inline:0.5em;
	  color: #fff;
	  font-weight: bold;
  }
.bl_fixedNav_list  a:hover {
	  color: #fcee21;

  }
.bl_fixedNav_list li{
	  border-right: 2px solid #fff;
}
	
.bl_fixedNav_list li:last-child, .bl_fixedNav_list li:nth-last-child(2){
	  border-right:none;
  }

.ly_header .box__bn{
	float: right;

}

.ly_header .box__bn img{
	float: left;
	margin-left: 10px;
	width: 257px;
	height: 57px;

}

.ly_header .box__bn--fix a{
	margin: 0!important;
	padding: 0!important;
}


.ly_header .box__bn--fix img.tel{
	float: left;
	margin-left: 10px;
	margin-top: 3px;
	width:91px;
	height:38px;

}

.ly_header .box__bn--fix img.line{
	float: left;
	margin-left: 10px;
	margin-top: 3px;
	width:97px;
	height:38px;

}



	
}
/* header_nav
-------------------------------------------------*/
@media (max-width: 991px) {
.breadcrumb--extend{
	background-color: transparent !important ;
	padding-top: 5px !important;
	font-size: 1rem;
	height: 14px;
	padding-left: 0!important;
}

.breadcrumb-item+.breadcrumb-item::before {
  /* 記号 */
  content: ">" !important;
}

.breadcrumb--extend li a:link, .breadcrumb--extend li a:visited, .breadcrumb--extend li{
	text-decoration: none;
}
	
.breadcrumb--extend--White{
	background-color: transparent !important ;
	padding-top: 5px !important;
	font-size: 1rem;
	height: 14px;
	color: #fff;
}

.breadcrumb--extend--White .breadcrumb-item + .breadcrumb--extend--White .breadcrumb-item::before {
  /* 記号 */
  content: ">" !important;
	color: #fff!important;
	}

.breadcrumb--extend--White li a:link, .breadcrumb--extend--White li a:visited, .breadcrumb--extend--White li{
	text-decoration: none;
	color: #fff;
}

}

@media (min-width: 992px) {
.breadcrumb--extend{
	background-color: transparent !important ;
	padding-top: 40px !important;
	font-size: 1.2rem;
	height: 24px;
	padding-left: 0!important;
}

.breadcrumb-item+.breadcrumb-item::before {
  /* 記号 */
  content: ">" !important;
}

.breadcrumb--extend li a:link, .breadcrumb--extend li a:visited, .breadcrumb--extend li{
	text-decoration: none;
}
.breadcrumb--extend--White{
	background-color: transparent !important ;
	padding-top: 40px !important;
	font-size: 1.2rem;
	height: 24px;
	color: #fff;
}

.breadcrumb--extend--White .breadcrumb-item + .breadcrumb--extend--White .breadcrumb-item::before {
  /* 記号 */
  content: ">" !important;
	color: #fff!important;
	}

.breadcrumb--extend--White li a:link, .breadcrumb--extend--White li a:visited, .breadcrumb--extend--White li{
	text-decoration: none;
	color: #fff;
}
}

.anchor{
	padding-top: 450px;
	margin-top: -450px;
}
.box__alert{
	border: 1px solid #000;
	text-align: center;
	font-size: 1.4rem;

}


.main__contents{

}
@media (max-width: 991px) {
.main__contents2{
	margin-top: 51px;

}
}

@media (min-width: 992px) {
.main__contents2{
	margin-top: 72px;
}
}





.box--yellow{
	background-color: #fff000;

}
.box--black{
	background-color: #000;

}
.box--white{
	background-color: #fff;

}

.box--blue{
	background-color: #566190;

}

.box--gray{
	background-color: #e0e0df;

}

.box--gray2{
	background-color: #595757;

}

.box--gray3{
	background-color: #e9e8e8;

}





#pageTop{
	background-image:url(../img/arrow_up.svg);
	background-size: 54px 54px;
	text-indent:-9999px;
	width:54px;
	height:54px;
	position:fixed;
	right:20px;
	bottom:20px;
	z-index:999;
	overflow:hidden;
	float:left;
	}
	
#pageTop:hover{
	background-image:url(../img/arrow_up.svg);
	background-size: 54px 54px;
	text-indent:-9999px;
	width:54px;
	height:54px;
	position:fixed;
	right:20px;
	bottom:20px;
	z-index:999;
	overflow:hidden;
	float:left;
	}





/* =======================================
    画像の拡大・縮小表示
======================================= */

.scale {
    -moz-transition: -moz-transform 0.2s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear;
}
.scale:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

/* =======================================
    フォームカスタマイズ
======================================= */

.cp_ipselect {
	overflow: hidden;
	width:100%;
	margin:0;
	text-align:left;
}
.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl01 {
	position: relative;
	border-radius: 2px;
	background: #ffffff;
	border: 1px solid #808080;

}
.cp_ipselect.cp_sl01::before {
	content: "";
position: absolute;
right:15px;
top:50%;
margin-top:-10px;
transform: rotate(-45deg);
width: 10px;
height: 10px;
border-bottom: 2px solid #ccc;
border-left: 2px solid #ccc;
}
.cp_ipselect.cp_sl01 select {
	padding: 8px 38px 8px 8px;
	color: #666666;
}

input {
	/*-webkit-appearance: none;*/
	border: 1px solid #808080;
}

select{

}


button{
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.is_hide{
 display:none;
}



@media (max-width: 767px) {
/*===========
inview 遅延ロードスライドin
===========*/
.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn.is-show {
  opacity: 1;
}

.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 2s;
}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_left {
  opacity: 0;
  transform: translate(-50%, 0);
  transition: 2s;
}
.fadeIn_left.is-show {
  transform: translate(0, 0);
  opacity: 1;
}
	
.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}

.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}


.inviewf{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 1s;
}

.inview1{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 2s;
}

.inview1.delay{
}

.inview1.show{
  opacity: 1;
  transform: translateY(0px); 
}

.inview2{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 2s;
}

.inview2.delay{
}

.inview2.show{
  opacity: 1;
  transform: translateY(0px); 
}
}
@media (min-width: 768px) {
/*===========
inview 遅延ロードスライドin
===========*/
.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn.is-show {
  opacity: 1;
}

.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 2s;
}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_left {
  opacity: 0;
  transform: translate(-50%, 0);
  transition: 2s;
}
.fadeIn_left.is-show {
  transform: translate(0, 0);
  opacity: 1;
}
	
.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}

.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}


.inviewf{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 1s;
}

.inview1{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 2s;
  transition-delay: 0.3s; /*遅延をかける秒数 */
}

.inview1.delay{
  transition-delay: 0.3s; 
}

.inview1.show{
  opacity: 1;
  transform: translateY(0px); 
}

.inview2{
   opacity: 0; /*表示前に透明にしておく */
  transform: translate(0, 50%);
  transition: 2s;
  transition-delay: 0.6s; /*遅延をかける秒数 */
}

.inview2.delay{
  transition-delay: 0.6s; 
}

.inview2.show{
  opacity: 1;
  transform: translateY(0px); 
}
}