@charset "utf-8";

/*----------------------------------------
Outline
----------------------------------------*/

#lparea{
	max-width: 2000px;
	left :calc(50% - 1000px);
}

#lparea img{
	width: 800px;
	min-width: 800px;
	position: relative;
	margin: 0 auto;
}

#lparea .buyareaSingle img{
	width: 450px;
	min-width: 450px;
	position: relative;
	margin: 0 auto;
}

#lparea .buyarea5set img{
	width: 700px;
	min-width: 700px;
	position: relative;
	margin: 0 auto;
}

#lparea .buyarea3set img{
	width: 700px;
	min-width: 700px;
	position: relative;
	margin: 0 auto;
}

/*----------------------------------------
BuyArea
----------------------------------------*/

#lparea .buyarea {
	width: 800px;
	height: 1472px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea.jpg) no-repeat center top/100%;
}

#lparea .buyarea1480 {
	width: 800px;
	height: 1472px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_1480.jpg) no-repeat center top/100%;
}

#lparea .buyarea1980_mercari {
	width: 800px;
	height: 1472px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_1980_211111.jpg) no-repeat center top/100%;
}

#lparea .buyarea980 {
	width: 800px;
	height:  1584px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_980_np_factory.jpg) no-repeat center top/100%;
}

#lparea .buyarea798 {
	width: 800px;
	height: 1564px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_798.jpg) no-repeat center top/100%;
}

#lparea .buyarea a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	height: 240px;
	display: block;
	bottom: 208px;
}

#lparea .buyarea1480 a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	height: 240px;
	display: block;
	bottom: 208px;
}

#lparea .buyarea1980_mercari a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	height: 240px;
	display: block;
	bottom: 208px;
}

#lparea .buyarea980 a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	height: 240px;
	display: block;
	bottom:  209px;
}

#lparea .buyarea798 a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	height: 240px;
	display: block;
	bottom: 208px;
}


#lparea .buyarea5set {
	width: 800px;
	height:  1124px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_5set.jpg) no-repeat center top/100%;
}

#lparea .buyarea5set a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	display: block;
	bottom:  37px;
}


#lparea .buyarea3set {
	width: 800px;
	height:  905px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_3set.jpg) no-repeat center top/100%;
}

#lparea .buyarea3set a {
	position: absolute;
	bottom: 0;
	left: 0;
	margin :0;
	width: 800px;
	display: block;
	bottom:  37px;
}

#lparea .buyareaSingle {
	width: 800px;
	height:  485px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background:url(../img/00_buyarea_Single.jpg) no-repeat center top/100%;
}

#lparea .buyareaSingle a {
	position: absolute;
	bottom: 0;
	left: 107px;
	margin :0;
	width: 800px;
	display: block;
	bottom:  85px;
}



/*----------------------------------------
ボタン光るアニメーション
----------------------------------------*/
@keyframes shiny {
    0% { left: -20%; }
    10% { left: 120%; }
    100% { left: 120%; }
}

.shiny-btn {
    position: relative;
    display: block;
    overflow: hidden;
}

.shiny-btn::after {
    content: '';
    position: absolute;
    top: -10%;
    left: -20%;
    width: 40px;
    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: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}


.shiny-btnset {
    position: relative;
    display: block;
    overflow: hidden;
}

.shiny-btnset::after {
    content: '';
    position: absolute;
    top: -10%;
    left: -20%;
    width: 40px;
    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: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

/*----------------------------------------
ボタン揺れるアニメーション
----------------------------------------*/
.yureru-s {
    animation: yureru-s 2s infinite;
}
@keyframes yureru-s {
    0% {
        transform: translate(2px, 0px);
    }
    5% {
        transform: translate(-2px, 0px);
    }
    10% {
        transform: translate(2px, 0px);
    }
    15% {
        transform: translate(-2px, 0px);
    }
    20% {
        transform: translate(2px, 0px);
    }
    25% {
        transform: translate(-2px, 0px);
    }
    30% {
        transform: translate(0px, 0px);
    }
}	

/*----------------------------------------
FAQ
----------------------------------------*/

.faq {
	width: 800px;
	margin: 0 auto;
	background: #eaffff url(../img/16_faq_top.png) no-repeat center top/800px;
	padding: 416px 0 120px 0;
}
.faq_actab {
	width: 740px;
}
.faq label {
	font-size: 18px;
	font-weight: bold;
}
.faq .faq_actab-ctt {
	padding: 0 20px;
	width: 700px;
	font-size: 16px;
}
.faq .faq_actab input[type=checkbox]:checked ~ .faq_actab-ctt {
	padding: 20px;
}

/*----------------------------------------
FAQ 中高年訴求
----------------------------------------*/

.faq_k {
	margin: 0 auto;
	background: #fff8d8 url(../img_k/16_faq_top_k.png) no-repeat center top/100%;
	padding: 52vw 0 15vw 0;
}
.faq_actab {
	width: 95%;
	/*width: 94vw;*/
}
.faq_k label {
	font-size: 16px;
}
.faq_k .faq_actab-ctt {
	padding: 0 3vw;
	width: 100%;
	/*width: 86vw;*/
}
.faq_k .faq_actab input[type=checkbox]:checked ~ .faq_actab-ctt {
	padding: 3vw;
}

/*----------------------------------------
ボイスのとこアコーディオン
----------------------------------------*/
.cp_actab_d {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
    color: #fff;
    }
    
.cp_actab_d input {
    position: absolute;
    z-index: 1;
    opacity: 0;
    }
    
.cp_actab_d label {
    font-weight: bold;
    line-height: 1.5;
    position: relative;
    display: block;
    padding: 0 0 0 0;
    cursor: pointer;
    margin: 0 0 8px 0;
    /*background: #fff;*/
	background-image: url("https://suplif.com//upload/save_image/kiroros/img_k/06_voice_k1_2_bg.jpg");
	background-size: 100%;
	padding-bottom: 0;
	margin-bottom: 0;
	max-width: 800px;
    }
    
.cp_actab_d .cp_actab-content {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.5s;
    transition: max-height 0.5s;
    color: #333333;
    background: #fff;
    }

/* :checked */
.cp_actab_d input:checked ~ .cp_actab-content {
    max-height: 80em;
	margin-top: -0em;
    }
    
/*チェックのアイコン（↓）*/
.cp_actab_d label:after{
    color: #790933;
    font-family:"Font Awesome 5 Free";
    content:" \f13a";
    position: absolute;
    top: 40%;
    right: 0.25em;
    width: 1em;
    height: 3em;
	font-size: 2.2em;
    }

@media screen and (min-width: 999px) {
	.cp_actab_d label:after{
		font-size: 3.5em;
	}
}
/*チェックのアイコン（↑）*/
.cp_actab_d input:checked ~ label::after {
    color: #790933;
    font-family:"Font Awesome 5 Free";
    content:" \f139";
    }	  
	
td:nth-child(odd) {
	background:#fff;
    color: #FFF;
    width: 20%;
    text-align: center;
    font-weight: bold;
	}
	

/*微調節*/
.cp_actab_d .cp_actab-content>.doctor{
	margin-top: 0;
	margin-bottom: 0;
	}