@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600&family=Noto+Serif+JP:wght@400;700&display=swap');
html {
	scroll-behavior: smooth;
}
body { }
.body--bg {
	width:100%;
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background-attachment: fixed;
	background-size:cover;
background: rgb(255,248,223);
background: -moz-linear-gradient(0deg, rgba(255,248,223,1) 0%, rgba(246,250,238,1) 58%, rgba(187,244,255,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(255,248,223,1) 0%, rgba(246,250,238,1) 58%, rgba(187,244,255,1) 100%);
background: linear-gradient(0deg, rgba(255,248,223,1) 0%, rgba(246,250,238,1) 58%, rgba(187,244,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fff8df",endColorstr="#bbf4ff",GradientType=1);
}
body a { color:#000;}
body a:hover { text-decoration:none;}

.container {
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	background: #0045a0;
	position: relative;
	z-index: 2;
}
.bx-bgpk { background:#ffe1e8;}

.footer{
    padding: 3em 0 0;
	text-align: center;
}
.footer--logo {
	margin:0 0 2em;
}
.footer--logo ul {
	display:flex;
	justify-content:space-around;
	margin:0 5% 9%;
}
.footer--logo ul li {
	width:26%;
}

.footer p {
	margin-bottom: 1.6em;
    text-align: center;
    font-size: 0.8rem;
    padding-bottom: 1px; 
    color: #414769;
}
.footer .footer--logo {
	margin: 7em 31% 1.5em;
    font-size: 0.6em;
}
.footer a {
    color: #414769;
}

.c01 {
	background:#4fc9ce url("../images/bg_01.jpg") center top no-repeat;
	background-size: 100% auto;
}
.c02 {
	/*padding-bottom: 3em;*/
	background:#00459f url("../images/bg_02.jpg") center top no-repeat;
	background-size: 100% 100%;
}

@media (min-width: 641px) {
/* PC用 */
	.container {
		width:768px;
		margin:0 auto;
		overflow: hidden; 
	}
    .c02 {}
	
	.header img,
	.container img { width:100%; height: auto;}
	
	.footer p.copy{
		font-size: 0.7rem;
	}
}
@media (max-width: 640px) {
/* SP用 */
	.c02 { }
	.header img,
	.container img { width:100%; height: auto;}
	
	.footer{
		padding: 18px 0 1em;
	}
	
	.footer img {}
}

.scrollanime {
	opacity: 0;
}
.fadeInDown {
	animation-name: fadeInDown;
	animation-delay: 0.7s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}
@keyframes fadeInDown {
	0% {
		opacity: 0;			
	}
	100% {
	opacity: 1;
	transform: translate(0);
	}
}

.updown {
	transform: translateY(-100px);
}
.downup {
	transform: translateY(100px);
}
.slide-right {
	transform: translateX(200px);
}
.slide-left {
	transform: translateX(-200px);
}


/* 
-------------------------------------------------- */
.fx {
	display:flex;
	justify-content: space-between;
}

.cv--area01 .item {
	width:42%;
}
.cv--area01 .txt {
	width:58%;
}

.cv--area02 .item {
	width:47%;
}
.cv--area02 .txt {
	width:53%;
}


@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}



/* buy_btn
-------------------------------------------------- */
.buy_btn {
	position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%);
    width: 100%;
    padding: 8px 8px 0;
	
    background: #16c228;
    visibility: hidden;
    opacity: 0;
    transition: .5s all;
}
.buy_btn.is--active {
	visibility: visible;
	opacity: 1;
}

.link_btn {
	position: relative;
}
.link_btn img:hover { cursor: pointer;}

.aroma_00 {
	position: relative;
	margin:0 .3%;
}
.forbuy {
	display: block;
	position: absolute;
	width:70%;
	bottom:13%;
	left:50%;
	transform: translateX(-50%);
}
.forbuy.href_02 { bottom:4%;}
.forbuy.href_03 { bottom:8.6%;}

.buy_btn::before {
	content:'';
	position:absolute;
	bottom:-10px;
	left:50%;
	transform: translateX(-50%);
	border-top:10px solid #16c228;
	border-left:5px solid rgba(0,0,0,0);
	border-right:5px solid rgba(0,0,0,0);
}
.buy_btn li {
	width:100%;
	margin-bottom: 8px;
	background: #fff;
}
.buy_btn li a {
	display: block;	
	padding:15px 30px;
	text-align: center;
}
.buy_btn li a img { width:100%;}
.buy_btn.is--active li a img { display: block; width:100%;}

#js--slider--03 a {
	display: block;
	position: absolute;
	width:74%;
	bottom:4%;
	left:50%;
	transform: translateX(-50%);
}


@media (min-width: 641px) {
/* PC用 */
	.buy_btn {
		display:flex;
		justify-content: space-between;
		flex-wrap: wrap;
		bottom:105%;
	}
	.buy_btn li {
		width:49%;
	}
}
@media (max-width: 640px) {
/* SP用 */	
	.buy_btn { width:100%;}
	
	.buy_btn.is--active li a {
		display: block;
		padding:12px 25px;
	}
}

.container .btn01 {
	margin: 0;
	padding:6% 14% 0;
	background: #fff;
}


/* sec02
-------------------------------------------------- */
.sec02 {
	background: url("../images/sec02_bg01.png") center top no-repeat;
	background-size:100% auto;
}
@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}

.btn_blue { margin:0 14%;}
.btn_blue .buy_btn {
	width:60%;
}

/* sec03_05
-------------------------------------------------- */
.sec03_05,
.sec03_06 { position: relative;}

.sec03_05 .img01,
.sec03_06 .img01 {
	position: absolute;
	top:0;
	left: 0;
}
.sec03_06 .img02 {
	position: absolute;
	top:13.2%;
	left: 0;
}

.ul--slider img { padding:0 10px;}
.slick-dots {
	display: flex;
	justify-content: center;
}
.slick-dots li { margin:0 8px;}
.slick-dots li button {
	width:8px;
	height:8px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	font-size:0;
	line-height: 8px;
	text-indent: -1000%;
	overflow: hidden;
	background: #f1e3b8;
}
#js--slider--02 .slick-dots li button { background: #ffda92;}
#js--slider--03 .slick-dots li button { background: #fff;}

.slick-dots .slick-active button {
	background: #606060 !important;
}

#js--slider--01,
#js--slider--02 { margin-bottom:25%;}

#js--slider--02 {}


.ul--slider li {
	position: relative;
}



@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
	/*#js--slider--02 .buy_btn img {
		width:96px;
		height:18px;
	}*/
}


/*  aroma_00
-------------------------------------------------- */
.cycle-slideshow { margin:0 -43% 0 -58.6%;}

@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}


/* sec03
-------------------------------------------------- */
@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}




/* 
-------------------------------------------------- */

@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}



/* 
-------------------------------------------------- */

@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}



/* 
-------------------------------------------------- */

@media (min-width: 641px) {
/* PC用 */
}
@media (max-width: 640px) {
/* SP用 */
}



/****************************************************************************
アニメーション
 ****************************************************************************/
.fadeInBottom,
.fadeInBottomLate {
  opacity: 0;
  transform: translateY(40px);
  transition: .7s ease;
}

.fadeInBottom.is-active,
.fadeInBottomLate.is-active {
  opacity: 1;
  transform: translateY(0px);
}

.fadeIn,
.fadeInLate {
  opacity: 0;
  transition: .7s ease;
}

.fadeIn.is-active,
.fadeInLate.is-active {
  opacity: 1;
}

.lineAnime {
  opacity: 0;
}

.lineAnime.is-active {
  opacity: 1;
}

.leftSlide {
  transform: translateX(-51.06667vw);
  transition: .5s ease;
}

.leftSlide.is-active {
  transform: translateX(0);
}

.fadeOrderTitle {
  opacity: 0;
  transform: translateY(20px);
}

.fadeOrderObj {
  opacity: 0;
}