@charset "utf-8";

/*リセット*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea {
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse;
    border-spacing:0;
}

img{
	max-width:100%;
}

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}

.clearfix {
	zoom: 100%;
}

.clearfix:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}

.both{
	clear:both;
}

body{
	color: #000;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.6;
	background-color: #fff;
	/* font-family: fot-tsukuardgothic-std, 'Noto Sans JP', sans-serif; */
    /* font-family: "Shippori Mincho", serif; */
    font-family:'メイリオ', 'Meiryo', sans-serif;
	overflow: hidden;
}

h1, h2, h3, h4, h5, h6, .fact .fact-number, .fact .fact-name, .site-title{
	color: #222;
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
	/* font-family: fot-tsukuardgothic-std, 'Noto Sans JP', sans-serif; */
}

a {
	-webkit-transition: all .3s;
    transition: all .3s;
}
a:hover{
	color: #000;
	opacity: .6;
	text-decoration: none;
	-webkit-transition: all .3s;
	transition: all .3s;
}

/* div, img {
	font-size: 0
} */

/* .fot{
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-weight: 700;
	font-style: normal;
}
.note{
	font-size: 18px;
} */



/*--------------------------------------------------------------
## 表示検証用
--------------------------------------------------------------*/

:root {
    --design-height1: 26970px;
    --design-height2: 12196px;
}

.main {
    /* height: calc(var(--design-height1)); */
    /* height: calc(var(--design-height1) + var(--design-height2)); */
}

/* .main:before,
.main:after {
    content: "";
    position: absolute;
    left: 0;
    opacity: 0.5;
    z-index: 13;
    display: block;
    width: 100%;
}

.main:before {
    background: url(../img/1.jpg) center center no-repeat;
    background-size: auto;
    height: var(--design-height1);
    top: 0;
}

.main:after {
    background: url(../img/2.jpg) center center no-repeat;
    background-size: auto;
    height: var(--design-height2);
    top: var(--design-height1);
}

.snsBox {
    height: 919px;
    background: #F00;
}

.snsBox > iframe {
    height: 1100px;
} */

/* :root {
    --design-height1: 25200px;
} */

/* .main:before {
    content: "";
    position: absolute;
    left: 0;
    opacity: 0.2;
    z-index: 13;
    display: block;
    width: 100%;
}

.main:before {
    background: url(../img/1.jpg) center center no-repeat;
    background-size: auto;
    height: var(--design-height1);
    top: 0;
}

/*--------------------------------------------------------------
## LP Page
--------------------------------------------------------------*/

html {
    font-size: 62.5%;
    font-family: "Shippori Mincho", serif;
}

.root {
    /* background-color: #000; */
    background: url(../img/bg01.jpg) center center no-repeat;
    background-size: cover;
    position: relative;
}

/* .root:after {
    content: "";
    width: 1px;
    height: 100vh;
    z-index: 999;
    display: block;
    pointer-events: none;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
    background: #F00;
} */

.sec {
    position: relative;
}

.ranking {
    margin: -24rem 0 0;
    text-align: center;
}

.rankingImg {
    margin: 0 0 0 25.7rem;
    max-width: 100vw;
}

.btnWrap01 {
    margin: -1rem 0 0;
    text-align: center;
}

.sakura {
    margin: -1rem 0 0;
}

.btnWrap02 {
    margin: -8rem 0 0;
    text-align: center;
}

.arrangeImg {
    margin: 0 0 0 43rem;
}

.arrange {
    text-align: center;
    z-index: 99;
}

.about01 {
    margin: -10rem 0 0;
    text-align: center;
    z-index: 999;
}

.about02 {
    margin: -40rem 0 0;
    text-align: center;
    z-index: 99;
}

.voice {
    margin: -5rem 0 0;
    text-align: center;
}

.faq {
    margin: -224rem 0 0;
    z-index: 9;
    text-align: center;
}

.faqImg {
    /* margin: 0 0 0 3.6rem; */
}

.sns {
    margin: -27rem 0 0;
    text-align: center;
}

.btnWrap03 {
    margin: 4rem 0px 0;
    text-align: center;
}

.cerisier:before {
    content: "";
    display: block;
    width: 100%;
    height: 222.6rem;
    position: absolute;
    top: 109rem;
    left: 0;
    background: url(../img/bg02.png) center center no-repeat;
    background-size: cover;
}

.cerisierImg {
    position: relative;
    z-index: 9;
}

.arrange:before {
    content: "";
    display: block;
    width: 100%;
    height: 184.4rem;
    position: absolute;
    top: 260rem;
    left: 0;
    background: url(../img/bg03.png) center center no-repeat;
    background-size: cover;
}

.arrangeImg {
    position: relative;
    z-index: 9;
}

.graph:before {
    content: "";
    display: block;
    width: 100%;
    height: 172.4rem;
    position: absolute;
    top: -38rem;
    left: 0;
    background: url(../img/bg04.png) center center no-repeat;
    background-size: cover;
}

.graphImg {
    position: relative;
    z-index: 9;
}

.faq:before {
    content: "";
    display: block;
    width: 100%;
    height: 244.4rem;
    position: absolute;
    top: -20rem;
    left: 0;
    background: url(../img/bg05.png) center center no-repeat;
    background-size: auto;
}

.faqImg {
    margin: 0 auto;
    position: relative;
    z-index: 9;
    display: block;
}

.snsBox {
    max-width: 857px;
    margin: 0 auto;
}

.snsBox > iframe {
    max-width: 100% !important;
    width: 100% !important;
}

.snsBlock {
    margin: -19rem 0 0;
}

.btnImg01,
.btnImg02,
.btnImg03 {
    max-width: 65%;
}


















/* footer */

.footerTxt.footerTxtWeb {
    margin: 3rem 0 0;
}

.footerTxt.footerZip {
    margin: 5rem 0 0;
}

.footer {
    margin: 6.1rem 0 0;
    padding: 9.8rem 0 35rem;
    background: #ece6eb;
    position: relative;
}

.foooterImgBox {
    text-align: center;
}

.footer:before {
    content: "";
    display: block;
    width: 100%;
    height: 19.1rem;
    position: absolute;
    top: -7.3rem;
    left: 0;
    background: url(../img/span08.png);
    background-position: left top;
    background-repeat: no-repeat;
    background-size: contain;
}

.footerTtl {
    font-size: 4rem;
    color: 333333;
    /* font-family: fot-tsukuardgothic-std, 'Noto Sans JP', sans-serif; */
    font-family: 'Noto Serif JP', serif;
}

.footerTxt {
    font-size: 3rem;
    color: #333333;
    text-align: center;
    font-weight: 700;
    /* font-family: fot-tsukuardgothic-std, 'Noto Sans JP', sans-serif; */
    font-family: 'メイリオ', 'Meiryo', sans-serif;
}

.footerTxt > a {
    color: #9f4f54;
}

.footerInfo {
    margin: 0.7rem 0 0;
}

.copyright {
    margin: 13rem 0 0;
    color: #333;
    font-size: 2.7rem;
    text-align: center;
    font-weight: 700;
    /* font-family: fot-tsukuardgothic-std, 'Noto Sans JP', sans-serif; */
    font-family: 'メイリオ', 'Meiryo', sans-serif;
}

/*--------------------------------------------------------------
## 固定バナー
--------------------------------------------------------------*/

.btn-win {
    bottom: 10px;
    z-index: 100;
    display: none;
    margin: 0 auto;
    padding: 0 10px;
    position: fixed;
    max-width: 700px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

/* .btn-win{
	bottom: 10px;
	z-index: 100;
	display: none;
	margin: 0 auto;
	padding: 0 10px;
	position: fixed;
	max-width: 600px;
	right: 0;
    left: 0;
    margin: auto;
    text-align: center;
} */

.btn-win #btn {
    margin: auto auto 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 4%;
    left: 0;
    display: block;
    max-width: 701px;
    width: 100%;
    height: 60%;
    border-radius: 100px;
}

@media screen and (max-width: 1919.9999px){

	html {
		font-size: 0.533vw;
	}

    .snsBox {
        max-width: 800px;
    }


}

@media screen and (max-width: 750px){

	html {
		font-size: 1.333vw;
	}

    .coverImg {
        padding: 17rem 0 0;
        transform: scale(1.6);
    }

    .rankingImg {
        padding: 34rem 0 0;
        transform: scale(1.2);
        margin: 0 0 0 9rem;
    }

    .cerisierImg {
        padding: 24rem 0 0;
        transform: scale(1.8);
    }

    .sakuraImg {
        padding: 25rem 0 0;
        transform: scale(1.8);
    }

    .arrangeImg {
        transform: scale(1.5);
        margin: 0 0 0 19rem;
        padding: 15rem 0 0;
    }

    .aboutImg01 {
        transform: scale(1.2);
        padding: 38rem 0 0;
    }

    .aboutImg02 {
        padding: 41rem 0 0;
        transform: scale(1.2);
    }

    .graphImg {
        transform: scale(1.8);
        padding: 37rem 0 0;
    }

    .graph {
        position: relative;
        z-index: 99;
    }

    .faqImg {
        animation: none;
        padding: 4rem 0 0;
        transform: scale(1.6);
        margin: 0 0 0 -3rem;
    }

    .voiceImg {
        padding: 103rem 0 0;
        transform: scale(1.9);
    }

    .faq {
        margin: 0;
        position: relative;
    }

    .faq:before {
        display: none;
    }

    .voice {
        margin: 1rem 0 0;
    }

    .sns {
        margin: 0;
    }

    .snsImg {
        padding: 29rem 0 0;
        transform: scale(1.3);
    }

    .snsBlock {
        margin: 11rem 0 0;
        padding: 0 2rem;
    }

    .btnImg01, .btnImg02, .btnImg03 {
        max-width: 95%;
    }

	.btnWrap02 {
	    margin: 42rem 0 0;
	    position: relative;
	    z-index: 999;
	}

	.btnWrap01 {
	    margin: 39rem 0 0;
	    position: relative;
	    z-index: 9;
	}

	.graph:before {
	    top: -20rem;
	}

}

@media screen and (max-width: 481px){



}

@media screen and (max-width: 330px){



}