@charset "UTF-8";

/*-----------------------------
 reset CSS
-------------------------------*/
*,*::before,*::after{box-sizing:border-box}*{margin:0}
html,body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased}
img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}
#root,#__next{isolation:isolate}

/*-----------------------------
 contents
-------------------------------*/
.wrap{
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    background:#fff;
}
.wrap img{
    width:100%;
    height:auto;
}
.offer {
    position: relative;
}
.btn{
    position: absolute;
    margin: 0 auto;
    width: 90%;
    bottom: 30px;
    right: 0;
    left: 0;
}
.btn img {
    animation: cta-bound 1s infinite ease;
}
@keyframes cta-bound {
    0% { transform:translateY(5px); }
    50% { transform:translateY(-5px); }
    100% { transform:translateY(5px); }
}

/*-----------------------------
 SP 表示
-------------------------------*/
@media screen and (max-width:744px){
    /*sp_ボタン調整*/
    .btn{
        bottom: 5vw;
    }
    #fbtn_nsIn img {
        width: 90%;
    }
}

/*-----------------------------
 fv video
-------------------------------*/
.fv_video {
    background-color: #fff; 
}
.fv_video_inner {
    display: block;
    margin: 0 auto;
    width: 100%;
}

/*-----------------------------
 slide image
-------------------------------*/

.slide_block {
    position: relative;
}
.slide_item_nose {
    position: absolute;
    width: 560px;
    margin: 0 auto;
    bottom: 90px;
    left: 0;
    right: 0;
}
.slide_item_face {
    position: absolute;
    width: 500px;
    margin: 0 auto;
    bottom: 85px;
    left: 0;
    right: 0;
}

.images-compare-container {
    border: 5px solid #fff;
}
@media screen and (max-width:744px){
    .slide_item_nose {
        width: 80%;
        bottom: 12vw;
    }
    .slide_item_face {
        width: 68%;
        bottom: 11vw;
    }
}

/*-----------------------------
 追従ボタン
-------------------------------*/
#fbtn_ns {
    width: 100%;
    position: fixed;
    bottom: 0;
    text-align: center;
    z-index: 9990;
    display: none;
}
#fbtn_nsIn {
    max-width: 750px;
    margin: 0 auto;
}
#fbtn_nsIn a {
    display: block;
}
#fbtn_nsIn img {
    width: 70%;
    animation: cta-bound 1s infinite ease;
}

/*-----------------------------
 footer
-------------------------------*/
.info {
    margin: 30px 0;
}
.info_link {
    margin-bottom: 7px;
    padding: 20px 50px;
    font-size: 20px;
    background-color: #dcf1fa;
}
.info_link a:link {
    color: #5b85b0;
    text-decoration: underline;
}
.footer {
    margin-bottom: -3%;
    padding: 2% 0;
    color: #fff;
    background-color: #7cb4c4;
}
.copyright {
    padding: 1em 0;
    color: #fff;
    font-size: 14px;
    text-align: center;
}
@media screen and (max-width:744px){
    .info {
        margin: 6% 0;
    }
    .info_link {
        margin-bottom: 1%;
        padding: 3% 7%;
        font-size: 4vw;
    }
    .footer {
        margin-bottom: -3%;
        padding: 2% 0;
    }
    .copyright {
        padding: 1em 0;
        font-size: 3vw;
    }
}
