.container{ max-width: 1200px; }
.content{ padding:0; }

.pc{ display: block;}
.mb{ display: none;}

.section-kv{ }
.section-kv .container{ width: 100%; max-width: 1920px; margin: 0 auto;}
.section-kv .kv img{ max-width: 100%; }

.section-info{ background: url("../images/products/namida/bg_top.jpg") center top no-repeat; background-size: 1920px auto; position: relative; }
.section-info::before{ background: #fff url("../images/products/namida/bg_bottom.jpg") center bottom no-repeat; background-size: 1920px auto; content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.section-info .container{ padding: 60px 0 10px; }
.section-info h2{ color: #182b84; font-size: 40px; font-weight: 600; margin-bottom: 30px;}
.section-info h2 strong{ font-size: 56px; font-weight: 700; border-bottom: #7ecef4 solid 7px; line-height: 1;}

.product-box{ margin-bottom: 60px;}
.product-box .product-name{ color: #182b84; margin-bottom: 40px; }
.product-box .product{ width: 90%; max-width: 500px; margin: 0 auto 40px;}
.product-box .btn-instructions{ color: #182b84; }

.feature-box{ background: url("../images/products/namida/bg_water.png") center 90% no-repeat; background-size: 100% auto; margin: 0 auto 60px;}
.feature-box .title-1{ margin-bottom: 50px; }
.feature-box .flex{ display: flex; justify-content: space-around; width: 90%; max-width: 980px; margin: 0 auto 100px; }
.feature-box .flex .box{ width: 30%; position: relative; }
.feature-box .flex .box .pic{ }
.feature-box .flex .box .text{ color: #163177; position: absolute; top: 17%; left: 0; width: 100%; }
.feature-box .flex .box-3 .text{ top: 25%; }
.feature-box .flex .box .text h3{ font-size: 32px; font-weight: 500; line-height: 1.3; margin-bottom: 30px; }
.feature-box .flex .box .text p{ margin-bottom: 0; line-height: 1.2; font-size: 14px; }

.chart-box{ display: flex; justify-content: space-between; width: 90%; max-width: 980px; margin: 0 auto 60px;}
.chart-box .box{ width: 48%; background-color: #eaf7fd; border-radius: 30px; padding: 20px 3% 30px;}
.chart-box .box h3{ font-size: 32px; font-weight: 600; line-height: 90px; margin-bottom: 20px; background-position: 50% 50%; background-repeat: no-repeat; }
.chart-box .box-1 h3{ color: #595757; background-image: url("../images/products/namida/icon_x.png"); background-size: 90px auto;}
.chart-box .box-2 h3{ color: #182b84; background-image: url("../images/products/namida/icon_o.png"); background-size: 90px auto;}
.chart-box .box p{ font-size: 22px; color: #fff; line-height: 1.3; border-radius: 15px; margin-bottom: 20px; padding: 20px 3%; }
.chart-box .box p strong{ font-weight: 700;}
.chart-box .box-1 p{ background-color: #595757; }
.chart-box .box-2 p{ background-color: #182b84; }
.chart-box .box img{ }

.case-box{ background-color: #fff; border: #036eb7 solid 3px; border-radius: 30px; width: 90%; max-width: 980px; margin: 0 auto 60px; overflow: hidden;}
.case-box h2{ background-color: #036eb7; color: #fff; padding: 10px 0 15px; position: relative;}
.case-box h2::after{ content: ''; background: url("../images/products/namida/icon_1.png") no-repeat; background-size: 90px auto; width: 90px; height: 25px; position: absolute; bottom: -25px; left: 50%; transform: translateX(-50%);}
.case-box .inner-box{ display: flex; justify-content: space-around; padding: 30px 5%;}
.case-box .inner-box .box{ width: 30%; }
.case-box .inner-box .box .pic{ margin-bottom: 10px;}
.case-box .inner-box .box p{ color: #076fb8; font-size: 24px; margin-bottom: 0;}

.use-box{ width: 90%; max-width: 980px; margin: 0 auto 60px;}
.use-box h2{}
.use-box .inner-box{ background-color: #fff; border: #7fcef4 solid 3px; border-radius: 30px; padding: 30px 2%; position: relative;}
.use-box .inner-box::before{ content: ''; background: url("../images/products/namida/icon_2.png") no-repeat; background-size: 90px auto; width: 90px; height: 25px; position: absolute; top: -25px; left: 50%; transform: translateX(-50%);}
.use-box .inner-box .text{ font-size: 28px;}
.use-box .inner-box .pic{ width: 100%; max-width: 570px; margin: 0 auto;}

.note{ color: #666666; font-size: 14px; }


/*	RESPONSIVE:  */
@media only screen and (max-width:1280px) {
}

/*	RESPONSIVE:  */
@media only screen and (max-width:1000px) {
	
.feature-box .flex .box{ width: 32%; }
.feature-box .flex .box .text{ top: 15%;  }
.feature-box .flex .box-3 .text{ top: 23%; }
.feature-box .flex .box .text h3{ font-size: 27px; margin-bottom: 20px; }
	
}



/*	RESPONSIVE:  */
@media only screen and (max-width:767px){

.pc{ display: none;}
.mb{ display: block;}
	
.section-info{ background-size: 810px auto; }
.section-info::before{ background-size: 810px auto; }
.section-info .container{ padding: 40px 0 10px; }	
.section-info h2{ font-size: 26px; }
.section-info h2 strong{ font-size: 36px; }

.product-box{ margin-bottom: 20px;}	
	
.feature-box{ background: url("../images/products/namida/bg_water.png") center 90% no-repeat; background-size: 150% auto; margin: 0 auto 40px;}
.feature-box .title-1{ line-height: 2; }
.feature-box .flex{ flex-wrap: wrap; justify-content: center; margin-bottom: 50px;}
.feature-box .flex .box{ width: 50%; margin: 0 auto; }
.feature-box .flex .box .text{ top: 15%; }
.feature-box .flex .box-3 .text{ top: 22%; }
.feature-box .flex .box-1{ margin-top: 25%; transform: scale(1.2);}
.feature-box .flex .box-2{ transform: scale(1.2);}
.feature-box .flex .box-3{ margin-top: -25%; margin-left: 40%; transform: scale(1.15); }
.feature-box .flex .box .text h3{ font-size: 22px; line-height: 1.2; margin-bottom: 6.5%; }
.feature-box .flex .box .text p{ font-size: 11px; }
	
.chart-box{ display: block; margin: 0 auto 40px;}
.chart-box .box{ width: 100%; border-radius: 20px; padding: 20px 3%;}
.chart-box .box-1{ margin-bottom: 20px;}
.chart-box .box h3{ font-size: 28px;}
.chart-box .box p{ font-size: 18px; }
	
.case-box{ border-radius: 20px; margin: 0 auto 40px;}
.case-box h2{ }
.case-box .inner-box{ flex-wrap: wrap; justify-content: center; padding: 10px 2%;}
.case-box .inner-box .box{ width: 49%; margin: 0 0.5% 20px; }
.case-box .inner-box .box .pic{ margin-bottom: 10px;}
.case-box .inner-box .box p{ font-size: 18px; }
	
.use-box .inner-box{ margin: 0 auto 40px;}
.use-box .inner-box .text{ font-size: 18px; }
	
}



/*	RESPONSIVE:  */
@media only screen and (max-width:480px) {


}

.anim-floating {
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-duration: 6s;
  transform-origin: 50% 50% 0;
  animation-name: anim-floating;
}

@keyframes anim-floating {
  from {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  to {
    transform: translateY(0);
  }
}

.anim-liq {
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-duration: 12s;
  transform-origin: 50% 50% 0;
  animation-name: anim-liq;
}


@keyframes anim-liq {
  from {
    transform: scale3d(1, 1, 1) rotate(-4deg);
  }
  50% {
    transform: scale3d(0.95, 1.05, 1.05) rotate(4deg);
  }
  to {
    transform: scale3d(1, 1, 1) rotate(-4deg);
  }
}

