@charset "utf-8";
/* CSS Document */
/*-----------------------------
 reset
-------------------------------*/
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, 
img, small, strong, sub, sup,b, i,dl, dt, dd, ol, ul, li,
 form, label,table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,hgroup, menu, nav, section,
time, mark, audio, video {
margin:0;padding:0;border:0;outline:0;font-size:100%;
vertical-align:baseline;background:transparent;line-height:1.0;
}
th{font-style:normal;font-weight:normal;}
ul li{list-style:none; }
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%;}
a{display: block}
a:hover{opacity: 0.8}
body {line-height:1;position: relative}
nav ul {list-style:none;}
table {	border-collapse:collapse;border-spacing:0;}
input, select {vertical-align:middle;}
article, aside, figure, footer, header,hgroup, nav, section { display:block; }
img{vertical-align:bottom; display: block;width: 100%;}

/*-----------------------------
 main
-------------------------------*/
.tururinto_lp_main{
max-width: 640px;
margin: 0 auto;
overflow: hidden;
}
.wrap{
width: 100%;
}
.overlaid{
position: relative;
}
.btn,.gif,.option{
position: absolute;
}
.btn01{
width: 54%;
right: 5.4%;
bottom: 6.4%;
}
.btn02{
width: 100%;
bottom: 40.4%;
}
.tel{
right: 0;
left: 1%;
margin: 0 auto;
bottom: 13.9%;
width: 95%;
}
.np{
right: 0;
left: 1%;
margin: 0 auto;
bottom: 34.5%;
width: 89%;
}
.gif01{
width: 88%;
bottom: 27%;
left: 0;
right: 0;
margin: 0 auto;
}
.gif02{
width: 79%;
left: 0;
right: 0;
margin: 0 auto;
bottom: 52.2%;
}
.gif03{
width: 79%;
left: 0;
right: 0;
margin: 0 auto;
bottom: 17.7%;
}
.gif04{
max-width: 284px;
max-height: 284px;
overflow: hidden;
border-radius: 50%;
left: 8.8%;
bottom: 44%;
width: 45%;
}
.gif05{
max-width: 284px;
max-height: 284px;
overflow: hidden;
overflow: hidden;
border-radius: 50%;
left: 45.5%;
bottom: 19.4%;
width: 45%;
}
.gif05 img{
	width: 110%;
	margin-left: -5%;
}
.option01{
width: 15.2%;
left: 16%;
bottom: 68%;
}
.option02{
width: 15.2%;
left: 16%;
bottom: 33.5%;
}
.option03{
width: 12.8%;
bottom: 58.4%;
left: 8.5%;
}
.option04{
width: 12.8%;
bottom: 37.1%;
left: 75.5%;
}
.option05{
width: 23%;
left: 38.3%;
bottom: 16%;
}
.text{
font-size: 0.875rem;
text-decoration: underline;
text-align: center;
margin: 0 auto;
left: 0%;
right: 0;
bottom: 1.4%;
line-height: 2.8;
font-feature-settings: 'palt' 1;
}
.text a:visited{
	color: #1E4499;
}
.text a:hover{
	color: #1E4499;
}
.text a:link{
	color: #1E4499;
}
@media screen and (max-width:640px) {
.text{
	font-size: 2vw;
}
}

.change_wrap{
	overflow: hidden;
}
.change{
	width: 100vw;
	max-width: 640px;
}
.stage_01{
	position: absolute;
	left: 0;
	top: 0;
}
.stage_02{
	width: 0%;
}
.stage_03{
	width: 100%;
	transition: 2s;
}


