@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;700&display=swap');
body{background: #F8F8F8;margin: 0 auto;font-family: 'M PLUS Rounded 1c', sans-serif;font-size: 15px;}
.lp-box{overflow-x: hidden; max-width: 480px;box-shadow: 0 2px 8px rgba(64, 62, 61, .1);margin: 0 auto;    
background:rgba(255, 159, 207, 0.3) url('/assets/images/lp/live_main.webp');          
background-attachment: fixed;
background-size: contain;
background-position: center;

}
.lp-box-m{overflow-x: hidden; max-width: 480px;box-shadow: 0 2px 8px rgba(64, 62, 61, .1);margin: 0 auto;    
    background:rgba(116, 147, 231, 0.3) url('/assets/images/lp/live_main.webp');          
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    
    }








footer{background: #000000;font-size: 10px;color: #fff;padding:1.5rem 1rem;text-align: center;}
.lp-main{position: relative;margin: 0 auto;}

.lp-main {
position: relative;
margin: 0 auto;
}

.lp-main-img1 {
position: absolute;
top: 10px;
left: 5px;
z-index: 10;
width: 130px;
padding: 8px 20px 5px;
background: transparent linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
border: 1px solid #333333;
opacity: 0.9;
}

.lp-main-img2 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
animation: image1 1.5s forwards 0.5s;
opacity: 0;
}




@keyframes image1 {
0% {
opacity: 0;
}

100% {
opacity: 1;
}
}

@keyframes image1-2 {

0%,
100% {
transform: translateY(0);
}

50% {
transform: translateY(-5px);
}
}


.lp-main-img3 {
position: absolute;
top: 0;
left: 0;
z-index: 2;
animation: image1 1s forwards 0.5s, bounce-in-top 1s 1s both, bounce-in-top2 1s 2s infinite;
opacity: 0;
}


@keyframes bounce-in-top {
0% {
transform: translateY(-500px);
animation-timing-function: ease-in;
opacity: 0;
}

38% {
transform: translateY(0);
animation-timing-function: ease-out;
opacity: 1;
}

55% {
transform: translateY(-65px);
animation-timing-function: ease-in;
}

72% {
transform: translateY(0);
animation-timing-function: ease-out;
}

81% {
transform: translateY(-28px);
animation-timing-function: ease-in;
}

90% {
transform: translateY(0);
animation-timing-function: ease-out;
}

95% {
transform: translateY(-8px);
animation-timing-function: ease-in;
}

100% {
transform: translateY(0);
animation-timing-function: ease-out;
}
}


@keyframes bounce-in-top2 {


38% {
transform: translateY(0);
animation-timing-function: ease-out;
opacity: 1;
}

55% {
transform: translateY(-30px);
animation-timing-function: ease-in;
}

72% {
transform: translateY(0);
animation-timing-function: ease-out;
}

81% {
transform: translateY(-15px);
animation-timing-function: ease-in;
}

90% {
transform: translateY(0);
animation-timing-function: ease-out;
}

95% {
transform: translateY(-5px);
animation-timing-function: ease-in;
}

100% {
transform: translateY(0);
animation-timing-function: ease-out;
}
}

.lp-main-img4 {
position: absolute;
z-index: 3;
animation: bounceIn 1050ms backwards;
animation-delay: 500ms;
top: 50%;
transform: translate(0, -50%);
}

@keyframes bounceIn {

from,
20%,
40%,
60%,
80%,
to {
animation-timing-function: cubic-bezier(0.1, 0.1, 0.1, 1);
}

0% {
opacity: 0;
transform: scale3d(0.3, 0.3, 0.3) translate(0, -50%);
}

20% {
transform: scale3d(3, 3, 3) translate(0, -50%);
}

40% {
transform: scale3d(0.3, 0.3, 0.3) translate(0, -50%);
}

60% {
opacity: 1;
transform: scale3d(1.2, 1.2, 1.2) translate(0, -50%);
}

80% {
transform: scale3d(0.97, 0.97, 0.97) translate(0, -50%);
}

to {
opacity: 1;
transform: scale3d(1, 1, 1) translate(0, -50%);
}
}

.lp-link {
position: relative;
}


.lp-main-img5 {
position: absolute;
top: 0;
left: 0;
z-index: 3;
animation: image1 1s forwards 1s;
opacity: 0;
}

.lp-main-img6 {
position: absolute;
top: 0;
left: 0;
z-index: 3;
animation: image1 1s forwards 1s, image1-2 1s infinite ease-in-out;
opacity: 0;
}

.lp-main-img7 {
position: absolute;
top: 0;
left: 0;
z-index: 3;
animation: image1 1s forwards 1s, image1-2 1.5s infinite ease-in-out;
opacity: 0;
}
.lp-main-img8 {
position: absolute;
top: 0;
left: 0;
z-index: 3;
animation: image1 1s forwards 1s, filter-lp 2s infinite ease-in-out;
opacity: 0;
filter: drop-shadow(0px 0px 20px #F47D99);
}
@keyframes filter-lp {

50% {
filter: drop-shadow(0px 0px 20px #66BFDF);
}

}


.jello-horizontal{animation:jello-horizontal .9s both infinite;}

@keyframes jello-horizontal{
0%{transform:scale3d(1,1,1)}
30%{transform:scale3d(1.05,.95,1)}
40%{transform:scale3d(.95,1.05,1)}
50%{transform:scale3d(1.05,.95,1)}
65%{transform:scale3d(.95,1.05,1)}
75%{transform:scale3d(1.05,.95,1)}
100%{transform:scale3d(1,1,1)}}

a.lp-btn,a.lp-btn-m {
position: relative;
display: block;
font-size: 22px;
color: #fff;
width: 85%;
max-width: 380px;
padding: 1.2rem 0rem;
text-align: center;
display: block;
margin: 0 auto;
text-decoration: none;
border-radius: 60px;
line-height: 1.2;
margin-top:20px;
margin-bottom: 60px;

}
a.lp-btn {
background: transparent linear-gradient(180deg, rgba(244, 125, 131,0.8) 0%, rgba(255, 0, 191,0.8) 100%) 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 20px #FBDEE5;
border-bottom: solid 4px #c4028a;
}

a.lp-btn-m {
background: transparent linear-gradient(180deg, rgba(125, 157, 244, 0.8) 0%, rgba(0, 38, 255, 0.8) 100%) 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 20px #FBDEE5;
border-bottom: solid 4px #0246c4;
}

a.lp-btn::before,a.lp-btn-m::before {
content: '';
position: absolute;
background-image: url(https://pokewaku.com/assets/images/nonad/right-icon-white.svg);
width: 13px;
height: 13px;
background-size: contain;
background-repeat: no-repeat;
left: 90%;
top: 50%;
transform: translateX(-50%)translateY(-50%);
}

a.lp-btn span,a.lp-btn-m span {
font-size: 13px;
display: block;
}


.lp-poke {
position: relative;
margin: 0 auto;
}

.lp-poke-img2 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.lp-poke-img3 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
animation: image1-2 2s infinite ease-in-out;
}

.lp-poke-img1 {
position: absolute;
top: 0;
left: 0;
z-index: 2;
animation: image1 1s;
}

.lp-site {
position: relative;
margin: 0 auto;
}

.lp-site-img2 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.lp-site-img3 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
animation: image1-2 2s infinite ease-in-out;
}

.lp-site-img1 {
position: absolute;
top: 0;
left: 0;
z-index: 2;
animation: image1 1s;
}

.lp-reward {
position: relative;
margin: 0 auto;
}

.lp-reward-img2 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.lp-reward-img3 {
position: absolute;
top: 0;
left: 0;
z-index: 2;
animation: image1-2 2s infinite ease-in-out;
}

.lp-reward-img1 {
position: absolute;
top: 0;
left: 0;
z-index: 2;
animation: image1 1s;
}
.lp-chat{position: relative;margin: 0 auto;margin-bottom: -7px;}
.fadein.lp-chat-img1{position: absolute;top: 0;left: 0;z-index: 3;animation:image1-2 2s infinite ease-in-out;}
.fadein.lp-chat-img2{position: absolute;top: 0;left: 0;z-index: 1;animation: image1-2 2s infinite ease-in-out;}
.fadein.lp-chat-img3{position: absolute;top: 0;left: 0;z-index: 1;}
.fadein.lp-chat-img4{position: absolute;top: 0;left: 0;z-index: 1;animation:image1-2 2s infinite ease-in-out;}
.fadein.lp-chat-img5{position: absolute;top: 0;left: 0;z-index: 2;animation: image3 1s ;}
.lp-income{position: relative;margin: 0 auto;}
.lp-income-img1{position: absolute;top: 0;left: 0;z-index: 3;animation:image1-2 2s infinite ease-in-out;width: 100%;}
.lp-income-img2{position: absolute;top: 0;left: 0;z-index: 1;animation: image1-2 2s infinite ease-in-out;width: 100%;}
.lp-income-img3{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;}
.lp-income-img4{position: absolute;top: 0;left: 0;z-index: 2;animation:image1-2 2s infinite ease-in-out;width: 100%;}
.lp-income-img5{position: absolute;top: 0;left: 0;z-index: 2;animation: image3 1s;width: 100%;}
.lp-h2{font-size: 30px;position: relative;text-align: center;margin-top: 100px;line-height: 1.5;letter-spacing: 2px;background: linear-gradient(to right, #FC568E, #FF7DAB, #FC568E);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.lp-h2 b{color: #D974BD;letter-spacing: 2px;font-weight: 600;}
.lp-h2 span{font-size: 13px;display: block;}
.lp-h2::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-head-ac.svg);width: 80px;height: 80px;background-size: contain;background-repeat: no-repeat;left: 50%;top: 0;transform: translateX(-50%)translateY(-50%);}

.lp-h2-m{font-size: 30px;position: relative;text-align: center;margin-top: 100px;line-height: 1.5;letter-spacing: 2px;background: linear-gradient(to right, #3a76e6, #7497d9, #3a76e6);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.lp-h2-m b{color: #7497d9;letter-spacing: 2px;font-weight: 600;}
.lp-h2-m span{font-size: 13px;display: block;}
.lp-h2-m::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-head-ac.svg);width: 80px;height: 80px;background-size: contain;background-repeat: no-repeat;left: 50%;top: 0;transform: translateX(-50%)translateY(-50%);}

#chatlady p,#reward p{padding: 2.5rem;;font-size: 13px;line-height: 2;}
#chatlady,#reward{background: transparent linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 57%, #EED4D8 100%) 0% 0% no-repeat padding-box;padding-bottom: 20px;}
.reward-flex,.reward-flex02{display: flex;padding: 2rem;align-items: center;justify-content: center;margin:0 auto;margin-top: 30px;margin-bottom: -70px;max-width: 430px;}
.reward-flex{margin-top: 60px;}
.reward-flex div:nth-of-type(1){width: 35%;padding: 1rem;}
.reward-flex div:nth-of-type(2){width: 65%;padding: 1rem;}
.reward-flex02 div:nth-of-type(1){width: 65%;padding: 1rem;}
.reward-flex02 div:nth-of-type(2){width: 35%;padding: 1rem;}
.reward-flex div:nth-of-type(2) h3{position: relative;text-align: center;font-size: 20px;margin-bottom: 10px;}
.reward-flex div:nth-of-type(2) h3 span{background: #ffffff;position: relative;padding: 1rem;}
.reward-flex div:nth-of-type(2) h3::before{content: '';position: absolute;background: #000000;height: 1px;width: 100%;left: 50%;top: 50%;transform: translateX(-50%)translateY(-50%);}
.reward-flex div:nth-of-type(2) h3::after{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/top-chat-ic.svg);width: 50px;height: 50px;left: 50%;top: 50%;background-size: contain;background-repeat: no-repeat;top: -40px;left: 50%;transform: translateX(-50%)translateY(-50%);}
.reward-flex02 div:nth-of-type(1) h3{position: relative;text-align: center;font-size: 20px;margin-bottom: 10px;}
.reward-flex02 div:nth-of-type(1) h3 span{background: #ffffff;position: relative;padding: 1rem;}
.reward-flex02 div:nth-of-type(1) h3::before{content: '';position: absolute;background: #000000;height: 1px;width: 100%;left: 50%;top: 50%;transform: translateX(-50%)translateY(-50%);}
.reward-flex02 div:nth-of-type(1) h3::after{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/top-wark-ic.svg);width: 50px;height: 50px;left: 50%;top: 50%;background-size: contain;background-repeat: no-repeat;top: -40px;left: 50%;transform: translateX(-50%)translateY(-50%);}
.reward-flex02 div:nth-of-type(1) h4{position: relative;font-size: 55px;color: #E27685;margin-top: 0;text-align: right;margin-bottom: 0;font-weight: 600;}
.reward-flex div:nth-of-type(2) h4{position: relative;font-size: 55px;color: #E27685;margin-top: 0;text-align: right;margin-bottom: 0;font-weight: 600;}
.reward-flex div:nth-of-type(2) h4::before{content: '最大\A時給';position: absolute;left: 0;top: 50%;transform: translateY(-50%);white-space: pre-wrap;text-align: center;justify-content: center;align-items: center;display: flex;width: 40px;height: 40px;padding: 5px;background: #E47684;color: #fff;font-size: 13px;border-radius: 50%;}
.reward-flex02 div:nth-of-type(1) h4::before{content: '最大\A時給';position: absolute;left: -10px;top: 50%;transform: translateY(-50%);white-space: pre-wrap;text-align: center;justify-content: center;align-items: center;display: flex;width: 40px;height: 40px;padding: 5px;background: #E47684;color: #fff;font-size: 13px;border-radius: 50%;}
.reward-flex div:nth-of-type(2) h4 small,.reward-flex02 div:nth-of-type(1) h4 small{font-size: 16px;}
.reward-flex02 div:nth-of-type(1) p{margin-top: -20px;text-align:left;color: #E27685;margin-left: -20px;}
.reward-flex div:nth-of-type(2) p{margin-top: -30px;text-align: right;color: #E27685;}
.reward-box{width: 85%;margin: 0 auto;background: #fff;}
.reward-box h3{text-align: center;padding-top: 40px;margin-bottom: -10px;font-size: 22px;}
.reward-box h3 span{position: relative;padding-bottom: 10px;}
.reward-box h3 span::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/top-mission-ic.svg);background-repeat: no-repeat;left: -30px;top: 50%;width: 40px;height: 40px;transform: translateX(-50%) translateY(-50%);}
.reward-box h3 ::after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 8px;    background-image: repeating-linear-gradient(45deg, #E27685 0px, #E27685 1px, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%);background-size: 8px 8px;}
#safe{margin-top: 70px;}
#safe p{padding: 2.5rem;;font-size: 13px;line-height: 2;}
#safe h2 {position: relative;padding: 2rem 2rem;color: #fff;font-size: 24px;border-radius: 60px;background: #FF7DAB;width: 70%;margin: 0 auto;margin-top: 30px;text-align: center;animation:safeh2 1.5s infinite ease-in-out;}
#safe h2:after {position: absolute;bottom: -9px;left: 50%;transform: translateX(-50%);width: 0;height: 0;content: '';border-width: 10px 10px 0 10px;border-style: solid; border-color: #FF7DAB transparent transparent transparent;}
@keyframes safeh2 {0%, 100% { transform: translateY(0); }50% { transform: translateY(-10px); }}
.safe-box{background: transparent linear-gradient(180deg, #FFFFFF 0%, #D2ECFF 100%) 0% 0% no-repeat padding-box;position: relative;margin-top: 40px;}
.safe-box::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/paki-safe-07.svg);background-repeat: no-repeat;width: 70px;height: 70px;background-size: contain;left: 85%;top: 0;transform: translateX(-50%)translateY(-50%);}
.safe-flex{display: flex;align-items: center;justify-content: center;padding:1rem 3rem 0rem 3rem;}
.safe-flex div:nth-of-type(1){width: 30%;}
.safe-flex div:nth-of-type(2){width: 70%;}
#inexperience h2{position: relative;font-size: 36px;text-align: center;line-height: 1.2;margin-top: 100px; background: linear-gradient(to right, #FC568E, #FF7DAB, #FC568E);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
#inexperience h2 span{font-size: 13px;display: block;}
#inexperience h2::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-safe-02.webp);background-repeat: no-repeat;background-size: contain;width: 90px;height: 90px;left: 50%;top: -40px;transform: translateX(-50%)translateY(-50%);}
#inexperience-m h2{position: relative;font-size: 36px;text-align: center;line-height: 1.2;margin-top: 100px; background: linear-gradient(to right, #457cf5, #7db1ff, #457cf5);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
#inexperience-m h2 span{font-size: 13px;display: block;}
#inexperience-m h2::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-safe-02.webp);background-repeat: no-repeat;background-size: contain;width: 90px;height: 90px;left: 50%;top: -40px;transform: translateX(-50%)translateY(-50%);}
.inex-flex,.inex-flex2{display: flex;padding: 1rem;justify-content: center;align-items: center;}
.inex-flex div:nth-of-type(1){width: 30%;padding: 0.5rem;}
.inex-flex div:nth-of-type(2){width: 70%;padding: 1rem;}
.inex-flex2 div:nth-of-type(1){width: 70%;padding: 1rem;}
.inex-flex2 div:nth-of-type(2){width: 30%;padding: 0.5rem;}
.inex-flex{margin-bottom: -40px;}
.inex-flex2{margin-bottom: -40px;}
.balloon-left {position: relative;padding: 1.5rem 2rem;color: #fff;border-radius: 30px;background: #333;}
.balloon-left:after {position: absolute;top: 40%;right: -1rem;width: 0;height: 0;content: '';border-width: 15px 15px 10px 15px;border-style: solid;border-color: #333 transparent transparent transparent;}
.balloon-right {position: relative;padding: 1.5rem 2rem;color: #fff;border-radius: 25px;background: #FF7DAB;}
.balloon-right:after {position: absolute;top: 40%;left: -1rem;width: 0;height: 0;content: '';border-width: 15px 15px 10px 15px;border-style: solid;border-color: #FF7DAB transparent transparent transparent;}
.inex-p{padding: 2.5rem;;font-size: 13px;line-height: 2;}
#inexperience{}
#register{}
.register-p{padding: 2.5rem;;font-size: 13px;line-height: 2;}
.register-flex{display: flex;padding: 0rem 2.5rem;align-items: center;justify-content: center;}
.register-flex div{width: calc(100%/2);padding: 1rem;}
.register-h3,
.register-h3-2,
.register-h3-3{background: #000;color: #fff;width: 120px;margin: 0 auto;text-align: center;padding: 1rem;font-size: 16px;border-radius: 30px;position: relative;}
.register-h3::before,
.register-h3-2::before,
.register-h3-3::before{position: absolute;background: #fff;color: #000;border: solid 1px #000;border-radius: 50%;width: 30px;height: 30px;line-height: 30px;left: 0;top: 50%;transform: translateX(-50%)translateY(-50%);}
.register-h3::before{content: '01';}
.register-h3-2::before{content: '02';}
.register-h3-3::before{content: '03';}
.register-flex p{padding: 1rem 0rem;}
.register-box{position: relative;margin: 0 auto;text-align: center;margin-bottom: -40px;margin-top: -40px;}
.register-box span{font-size: 24px;display: block;color: #000;}
.register-box h3{font-size: 100px;color: #C9B076;}
.register-box h3 small{font-size: 40px;}
.register-box::before{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-regis-02.svg);width: 80px;height: 80px;left: 85%;top: 0;transform: translateX(-50%)translateY(-50%);background-size: contain;background-repeat: no-repeat;}
.register-box::after{content: '';position: absolute;background-image: url(https://vi-vo.link/lady/assets/images/lp-regis-02.svg);width: 80px;height: 80px;left: 15%;top: 100%;transform: translateX(-50%)translateY(-50%);background-size: contain;background-repeat: no-repeat;}
.yellow_line {background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #fff200 0%) repeat scroll 0 0;font-weight: 500;text-shadow: 0px 0px 10px #fff;font-weight: 700;}
.fade-body{animation: fade-body 0.5s ease-in-out;}@keyframes fade-body {0% {opacity: 0;}100% {opacity: 1;}}
.fadein { transition: all .6s ease-in-out } .fadein.toup { transform: translateY(10px); opacity: 0 }
.fadein.tor { transform: translateX(10px); opacity: 0 }
.fadein.tol { transform: translateX(-10px); opacity: 0 }
.fadein.show { transform: translate(0); opacity: 1 } 
.fixed-regbtn {position: fixed;width: 85%;max-width: 480px;margin: 0 auto;left: 50%;transform: translateX(-50%);z-index: 999;margin-bottom: 35px;animation:regbtn 1.5s infinite ease-in-out;filter: drop-shadow(0px 0px 10px #fff);}
@keyframes regbtn {0%, 100% { margin-bottom: 35px; }50% { margin-bottom: 30px; }}

