@charset "utf-8";



body {
  font-size:1.5rem;
  line-height: 1.75;
  font-family:"Zen Kaku Gothic New",'ヒラギノ角ゴシック','Hiragino Sans',游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
  background:#F5F5F5;
  /* background-attachment:fixed; */
}

a {
  text-decoration: none;
  color:#1E1E1E;
}

a:hover {
  text-decoration: none;

}

img {
	vertical-align:bottom;
	display: block;
}

.wrapper {

}

.hover-img {
  opacity:1;
  transition:.5s;
}

.hover-img:hover {
  opacity:.5;
}

main {
	width:390px;
	box-shadow: 0px 0px 15px -3px #b0b0b0;
	position:relative;
	background:#fff;
	margin:auto;
  position:relative;
}

.pagelogo {
  position:fixed;
  top:24px;
  left:24px;
  width:200px;
}

@keyframes scaling {
    0% {
        transform:scale(0.93);
    }
    50% {
        transform:scale(1);
    }
    100% {
        transform:scale(0.93);
    }
}

.btnAnime {
    animation:scaling 2s infinite;
}

.offer p {
    text-align:center;
    font-size:1.1rem;
    line-height:1.55;
    padding-top:5px;
}

.mb-01 {
  margin:8px 0 16px;
}


/*
btn animation *****************/
@keyframes shiny {
    0% { left: -20%; }
    10% { left: 120%; }
    100% { left: 120%; }
}

.shiny-btn {
    position: relative;
    display: block;
    width: 100%;

    overflow: hidden;
}

.shiny-btn::after {
    content: '';
    position: absolute;
    top: -10%;
    left: -20%;
    width: 60px;
    height: 100%;
    transform: scale(2) rotate(20deg);
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, .5) 100%, rgba(255, 255, 255, 0) 0%);
    
    /* アニメーション */
    animation-name: shiny;
    animation-duration:4s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}


@keyframes float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-9px);
    }
}


.shrink-fade {
    animation: shrinkFade 0.8s cubic-bezier(.5,-3,.29,2.17) forwards !important;
}

@keyframes shrinkFade {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0.6);
    }
}


.offer-box {
    position:relative;
}

.offer-box-btn {
    width:100%;
    position:absolute;
    bottom:8%;
    left:0;
    overflow:hidden;
    border-radius:100px;
}



/*
.fix-btn01 {
	width:390px;
	position:fixed;
	bottom:0;
	z-index:2;
	display:none;
	padding:0 1.5%;
}
*/


.sideNav {
	position:fixed;
	top:40px;
	left:24px;
}


.sideNav__logo {
  width:140px;
	margin-bottom:24px;
}

.sideNav__qr {
	width:114px;
}

.sideNav__list {
	margin-bottom:32px;
}

.sideNav__list li {
	margin-bottom:20px;
}

.sideNav a {
	transition:.5s;
	display:inline-block;
	padding:2px 10px;
	font-weight:500;
	letter-spacing:1px;
	font-size:1.5rem;
  line-height:1.5;
  border-radius:3px;
}

.sideNav a:hover {
	opacity:.4;
}

.sideNav__active {
	color:#ff0;
}

.want {
  background:url(../imgs/bg-want.png) no-repeat 0 0 / cover;
  padding-bottom:28px;
}



.padding__lr-4 {
  padding:0 4%;
}


.hurry {
  padding-bottom:28px;
}

.faq {
  background:#f8f8f8;
  padding-bottom:28px;
}

.privacy {
  padding-bottom:28px;
}



.slick-prev, 
.slick-next {
    position: absolute;
    top: 52%;
    cursor: pointer;
    outline: none;
    border-top: 3px solid #f882b4;
    border-right: 3px solid #f882b4;
    height: 14px;
    width: 14px;
}
 
.slick-prev {
    left: 13%;
    transform: rotate(-135deg);
    z-index: 2;
}
 
.slick-next {
    right: 13%;
    transform: rotate(45deg);
    z-index: 2;
}
 
.slick-dots {
    text-align:center;
    margin:10px 0 0 0;
}
 
.slick-dots li {
    display:inline-block;
    margin:0 5px;
}
 
.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;
    height:8px;
    display:block;
    border-radius:50%;
    background:#ccc;
}
 
.slick-dots .slick-active button{
    background:#f882b4;
}


.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}



/*
.triangle {
  height: calc(60px / 2);
  width: 60px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background:#f00;
  transform:rotate(180deg) translateX(50%);
  position:absolute;
  left:50%;
  z-index:2;
}
*/

#faq:before {
  height: calc(60px / 2);
  width: 60px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
background:#fff;
  transform:rotate(180deg) translateX(50%);
  position:absolute;
  left:50%;
  z-index:2;
  top:-1px;
  display:block;
  content:'';
}

#faq {
  position:relative;
  background:#F6F6F6;
  padding-bottom:30px;
}









.hover {
	opacity:1;
	transition:.5s;
}

.hover:hover {
	opacity:0.9;
}

.ac {
margin-bottom:20px;
}

.ac dt {
cursor: pointer;
}

.ac dt img {
width: 100% !important;
height: auto;
}

.ac .wrap_btn .btn {
width: auto;
top: 0;
left: 0;
bottom:20%
}

.ac dd,
.ac .wrap_btn .btn.cls {
display: none;
}

.ac .wrap_btn.open .btn.opn {
display: none !important;
}

.ac .wrap_btn.open .btn.cls {
display: inline !important;
}

.ft {
	padding:50px 0 0;

	margin:40px auto 0;
	color:#fff;
background:#FFAEDA;
}

.ftLogo {
	width:30%;
	display:block;
	margin:auto;
}

.ft ul {
	display:flex;
	justify-content:center;

}

.ft a {
	color:#fff;
	text-decoration:none;
	font-size:1.3rem;

}

.copy {
	text-align:center;
	font-size:1rem;
	letter-spacing:0.5px;
	padding:10px 0;
	background:#FFAEDA;
	margin-top:30px;
}


@media screen and (max-width:840px) {
.hover-img:hover {
  opacity:1;
}

.sideNav {
	display:none;
}


.pagelogo {
  display:none;
}


.hover:hover {
	opacity:1;
}
}

@media screen and (max-width: 480px) { 
main {
  width:100%;
}

}


.lower__title {
  background:#ffaeda;
  color:#fff;
  padding:48px 0;
  margin-bottom:60px;
}


.lower__titleInner {
  text-align:center;
}

.lower__titleInner .txt-01 {
  font-size:2.2rem;
  letter-spacing:2px;
}

.lower__titleInner .txt-02 {
  font-size:1.5rem;
  letter-spacing:2px;
}


.lower__paddingLR {
  padding:0 5%;
}

dl.company__list {
  margin-bottom:40px;
}

dl.company__list dt {
  border-bottom:1px solid #ccc;
  padding-bottom:3px;
  margin-bottom:8px;
}

dl.company__list dd {
  margin-bottom:24px;
}

.mb24 {
  margin-bottom:24px;
}





.fixblock {
    position: fixed; /* ← スクロールに追従させるなら fixed が良い */
    z-index: 99;
    bottom: 0;
    left: 0;
    width: 100%;
    display: none; /* 初期は非表示 */
}
.fixblock__inner {
    max-width: 390px;
    margin: auto;
    position: relative;
    overflow:hidden;
}

.btn-fix{
    width:44%;
    display:block;
    position:absolute;
    top:20%;
    right:0.6%;    
}


