@charset "UTF-8";
/* CSS Document */
@media screen and (min-width: 480px) { /*ウィンドウ幅が480px以上の場合に適用*/

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




html{
	width:100%;
}
body {
	width:100%;
	margin:0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#222;
	font-size:16px;
	line-height:2.1rem;
	letter-spacing:-0.01rem
}

p {
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
a{
	text-decoration: none;
}
a:link ,a:visited{
	color:#333;
}
a:hover{
	cursor : pointer;
}
table,th,td{
	border-collapse: collapse;
}
ul{
	display: block;
    list-style-type: none;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0em;
}
h1 {
	width:100%;
    display: block;
    font-size: 2em;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.all{
	width:100%;
	max-width: 800px;
/*	min-width:960px;*/
	margin: 0 auto;
	padding-bottom: 100px;
}
.vtop{
	vertical-align:top;
}
.vbtm{
	vertical-align:bottom;
}
.ta-c{
	text-align: center;
}
.ta-r{
	text-align: right;
}
.ta-l{
	text-align: left;
}
.txt_bold{
	font-weight:600;
}
.txt_ul{
	text-decoration:underline;
}
.lspace_005rem{
	letter-spacing: 0.05rem;
}
.lspace_007rem{
	letter-spacing: 0.07rem;
}
.lspace_008rem{
	letter-spacing: 0.08rem;
}
.mgnt_10{
 margin-top:10px;
}
.mgnt_20{
 margin-top:20px;
}
.mgnt_30{
 margin-top:30px;
}

.mgnb_m10{
	margin-bottom:-10px;
}
.mgnb_60{
	margin-bottom:60px;
}
.mgnb_50{
	margin-bottom:50px;
}
.mgnb_80{
	margin-bottom:80px;
}
.mgnb_90{
	margin-bottom:90px;
}
.mgnb_100{
	margin-bottom:100px;
}
.mgnb_120{
	margin-bottom:120px;
}
.mgnb_30{
	margin-bottom:30px;
}
.mgnb_20{
	margin-bottom:20px;
}
.mgnb_10{
	margin-bottom:10px;
}
.fs18{
	font-size:18px;
}
.fs17{
	font-size:17px;
}
.fs15{
	font-size:15px;
}
.fs14{
	font-size:14px;
}
.fs13{
	font-size:13px;
}
.lht_2_5r{
	line-height:2.5rem
}
.lht_3r{
	line-height:3rem
}
.w60{
	width:60%;
}
.w80{
	width:80%;
}
.w100{
	width:100%;
}
.fadeinimg{
	display:none;
}
div{
	display: block;
}


.step{
	width:100%;
	max-width: 800px;
}
.step ul{
	width:100%;
}
.step ul li{
	width:49%;
	display:inline-block;
	padding:0;
}
.step ul li .btn{
	width:40%;
	font-size:14px;
	display:inline-block;
	border:1px solid #aaa;
	padding:2%;
	background-color: #FFF;
	text-align:center;
}
.nextarr{
	margin:50px 0;
}
.innerbox{
	width:100%;
	max-width:400px;
	display:inline-block;
	margin:0 auto;
/* border:1px solid #FF0; */
}
.innerbox img{
	width:110%;
	margin:0;
/*	display:inline-block; */
}
.innerbox_txt{
	width:100%;
	max-width:355px;
	display:inline-block;
	margin:0 auto;
}
.innerbox_txt img{
	width:100%;
	margin:0;
}


.innerbox2{
	display:inline-block;
	margin:0 auto;
/* border:1px solid #FF0; */
}
.cost li{
	margin-top:10px;
}

.interview{
	width:100%;
}
.interview ul{
	width:100%;
}
.interview ul li{
	width:48%;
	display:inline-block;
}
.introbox{
	width:70%;
	display:inline-block;
	margin:0 auto;
	text-align: left;
	line-height:1.2rem;
}
.introbox img{
	width:100%;
}
.obi{
	width:100%;
	background-color:#ECEBE5;
	text-align:center;
	padding:30px 0;
	line-height:2.5rem;
}
.infomation{
	width:100%;
	max-width:800px;
	display:block;
	margin:0 auto;
}
.shopname{
	font-size:14px;
}

.title1,.title2,.title3, .title4 , .title5  {
width:100%;
  height:35px;
  overflow: hidden;
  transform: translate(-100%, 0);
/*  transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 3.5s; */
  transition: all 0.8s ease-out;

  color: #000;

}

.title1 span, .title2 span , .title3 span , .title4 span, .title5 span {
  display: block;
  transform: translate(100%, 0);
/*  transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 3.5s; */
  transition: all 0.8s ease-out;
  font-family: 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro', '游明朝体' , 'YuMincho' ,sans-serif;
	letter-spacing:0rem;
	font-weight:0;

}

.title1.-visible,.title2.-visible,.title3.-visible,.title4.-visible,.title5.-visible,
.title1.-visible span,.title2.-visible span,.title3.-visible span,.title4.-visible span ,.title5.-visible span{
  transform: translate(0, 0);
}


}/*PCここまで*/






@media screen and (max-width: 479px) { /*ウィンドウ幅が480px以上の場合に適用*/
	
.pc { display: none !important; }
.sp { display: inline-block; }




html{
	width:100%;
}
body {
	width:100%;
	margin:0 auto;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#222;
	font-size:16px;
	line-height:1.5rem;
	letter-spacing:-0.06rem
}

p {
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
a{
	text-decoration: none;
}
a:link ,a:visited{
	color:#333;
}
a:hover{
	cursor : pointer;
}
table,th,td{
	border-collapse: collapse;
}
ul{
	display: block;
    list-style-type: none;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0em;
}
h1 {
	width:100%;
    display: block;
    font-size: 1.7em;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.all{
	width:95%;
	max-width: 850px;
/*	min-width:960px;*/
	margin: 0 auto;
	padding-bottom: 100px;
}
.vtop{
	vertical-align:top;
}
.vbtm{
	vertical-align:bottom;
}
.ta-c{
	text-align: center;
}
.ta-r{
	text-align: right;
}
.ta-l{
	text-align: left;
}
.txt_bold{
	font-weight:600;
}
.txt_ul{
	text-decoration:underline;
}
.mgnt_10{
 margin-top:10px;
}
.mgnt_20{
 margin-top:20px;
}
.mgnb_60{
	margin-bottom:60px;
}
.mgnb_80{
	margin-bottom:80px;
}
.mgnb_90{
	margin-bottom:90px;
}
.mgnb_100{
	margin-bottom:100px;
}
.mgnb_120{
	margin-bottom:60px;
}
.mgnb_30{
	margin-bottom:30px;
}
.mgnb_20{
	margin-bottom:20px;
}
.mgnb_10{
	margin-bottom:10px;
}
.fs18{
	font-size:18px;
}
.fs15{
	font-size:15px;
}
.fs14{
	font-size:14px;
}
.fs13{
	font-size:13px;
}
.lht_2_5r{
	line-height:2.5rem
}
.lht_3r{
	line-height:3rem
}
.w60{
	width:60%;
}
.w80{
	width:90%;
}
.fadeinimg{
	display:none;
}
div{
	display: block;
}

#mainvisual{
	text-align: center;
	line-height:2rem;
	margin-bottom:30px;
	max-width: 800px;
}
#mainvisual img{
	width:100%;
}
.step{
	width:100%;
	max-width: 800px;
}
.step ul{
	width:96%;
	margin:0 auto;
}
.step ul li{
	width:100%;
	display:inline-block;
	padding:0;
	vertical-align:top;
}
.step ul li img{
	width:100%;
}
.step ul.cost li{
	width:49%;
	display:inline-block;
}
.step ul li .btn{
	width:50%;
	font-size:14px;
	display:inline-block;
	border:1px solid #aaa;
	padding:2%;
	background-color: #FFF;
	text-align:center;
}
.nextarr{
	margin:50px 0;
}
.innerbox ,.innerbox_txt{
	width:100%;
	display:inline-block;
	margin:0 auto;
/* border:1px solid #FF0; */
}
.innerbox img{
	width:100%;
/*	display:inline-block; */
}
.innerbox2{
	display:inline-block;
	margin:0 auto;
/* border:1px solid #FF0; */
}


.interview{
	width:100%;
}
.interview ul{
	width:100%;
}
.interview ul li{
	width:100%;
	display:inline-block;
}
.introbox{
	width:70%;
	display:inline-block;
	margin:0 auto;
	text-align: left;
	line-height:1.2rem;
}
.introbox img{
	width:100%;
}
.obi{
	width:100%;
	background-color:#ECEBE5;
	text-align:center;
	padding:30px 0;
	line-height:2.0rem;
}
#obitxt{
	width:97%;
	margin:0 auto;
}
.infomation{
	width:100%;
	max-width:800px;
	display:block;
	margin:0 auto;
}
.infomation img{
	width:95%;
}
.shopname{
	font-size:14px;
}
.sptxtbox{
	width:95%;
	margin:0 auto;
}
.title1,.title2,.title3, .title4 , .title5  {
width:100%;
  height:35px;
  overflow: hidden;
  transform: translate(-100%, 0);
  transition: all 0.8s ease-out;
  color: #000;

}

.title1 span, .title2 span , .title3 span , .title4 span, .title5 span {
  display: block;
  transform: translate(100%, 0);
  transition: all 0.8s ease-out;
  font-family: 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro', '游明朝体' , 'YuMincho' ,sans-serif;
	letter-spacing:0rem;
	font-weight:0;

}

.title1.-visible,.title2.-visible,.title3.-visible,.title4.-visible,.title5.-visible,
.title1.-visible span,.title2.-visible span,.title3.-visible span,.title4.-visible span ,.title5.-visible span{
  transform: translate(0, 0);
}



	
}