@charset "UTF-8";

/**
 * layer.css
 *
 *
 * @media screen and (max-width: 1000px)
 * @media screen and (max-width: 768px)
 *
*/


/* ==========================================================================
   # layout
========================================================================== */

.l-cta {
	position: relative;
	text-align: center;
	margin: 0;
}

/* # CTA 共通設定
----------------------------------------------------------------- */
.cta-teiki-btnfv,
.cta-teiki-btn01,
.cta-teiki-btn02 {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	margin-bottom: 0!important;
}

/*定期購入ボタン*/
.cta-teiki-btnfv { bottom: 130px; }

.cta-teiki-btn01 { bottom: 20px; }

.cta-teiki-btn02 { bottom: 320px; }

@media screen and (max-width: 1000px) {
/* ==========================================================================
 #common module (max-width: 1000px)
========================================================================== */
	
	/* # CTA 共通設定
	----------------------------------------------------------------- */
	.cta-teiki-btnfv,
	.cta-teiki-btn01,
	.cta-teiki-btn02 {
		display: block;
		width: 100vw;
		margin: 0 auto!important;
	}
	
	/*定期購入ボタン*/
	.cta-teiki-btnfv { 
		bottom: 16vw; 
	}
	.cta-teiki-btn01 { 
		bottom: 5vw; 
	}
	
	.cta-teiki-btn02 { 
		bottom: 30vw; 
	}
}

@media screen and (max-width: 768px) {
/* ==========================================================================
 #common module (max-width: 768px)
========================================================================== */
	
	/* # CTA 共通設定
	----------------------------------------------------------------- */
	.cta-teiki-btnfv,
	.cta-teiki-btn01,
	.cta-teiki-btn02 {
		display: block;
		width: 95vw;
		margin: 0 auto!important;
	}
	
	/*定期購入ボタン*/
	.cta-teiki-btnfv { 
		bottom: 17vw; 
	}
	.cta-teiki-btn01 { 
		bottom: 4vw; 
	}
	
	.cta-teiki-btn02 { 
		bottom: 40.5vw; 
	}
}