@charset "utf-8";
@import url(../hamburgers-master/dist/hamburgers.css);
body, h1 {
	font-family: 'DB Ozone X Li'
}




.hvr-underline-from-center:before, .hvr-underline-from-left:before {
	height: 0;
}

.hvr-underline-from-center:hover:before, .hvr-underline-from-left:hover:before {
	height: 4px;
}


.black-ribbon {
  position: fixed;
  z-index: 9999;
  width: 70px;
}
@media only all and (min-width: 768px) {
  .black-ribbon {
    width: auto;
  }
}

.stick-left { left: 0; }
.stick-right { right: 0; }
.stick-top { top: 0; }
.stick-bottom { bottom: 0; }


.expert-detail:before, ul.up-arrow:after {
	content: ''
}
a:focus, a:hover {
	text-decoration: none
}
.mobile-only {
	display: block
}

.breadcrumb {
	background: none;
	padding: 0;
}
.breadcrumb>.active {
	font-weight: bold;
	font-size: 20px;
}

.breadcrumb li a {
	color: #777;
	font-size: 20px;
}

.breadcrumb>li+li:before {
    padding: 0 6px 0 0px;
    color: #ccc;
    content: ">";
}

@media screen and (min-width:320px) and (max-width:767px) {
.mobile-only {
	display: none
}
}
.product-bbl-box {
	position: absolute;
	right: 0;
	width: auto;
	height: auto;
	background: #fff;
	z-index: 99
}
.ads-close {
	position: absolute;
	right: 20px;
	top: -5px;
	font-size: 17px;
	color: #000
}
.click-btn i, .clock, .container, .share-fb-icon {
	position: relative
}
.product-bbl-box h2, .product-bbl-box p {
	font-size: 20px
}
.m-only {
	display: none
}
.d-only {
	display: block
}

h2.pink-color, h2.yellow-color, .home-product h2 {
	font-weight: bold;
}

@media screen and (min-width:320px) and (max-width:1023px) {
.m-only {
	display: block
}
.d-only {
	display: none
}
}

@media screen and (min-width:320px) and (max-width:992px) {
.home-product .m-only {
	display: block
}
.home-product .d-only {
	display: none
}
}

@media screen and (min-width:992px) and (max-width:1180px) {
.home-product .m-only {
	display: none
}
.home-product .d-only {
	display: block
}
.kid-top.m-only {
	display: none
}
.kid-top.d-only {
	display: block
}
}
body {
	color: #666
}
.top-10-up {
	margin-top: -10px
}
.top-15-up {
	margin-top: -15px
}
.pad-top-bottom {
	padding: 50px 0
}
img {
	max-width: 100%
}
.window-height {
	height: 100%
}
h1 {
	font-weight: 700;
	font-size: 30px
}

@media screen and (min-width:320px) and (max-width:1023px) {
h1 {
	font-family: 'DB Ozone X Li';
	font-weight: 700;
	font-size: 35px
}
}

@media screen and (width:1024px) {
.top-14 {
	margin-top: -18%
}
.top-43 {
	margin-top: -36%
}
.top-43 h2 {
	font-size: 22px
}
}

@media screen and (min-width:1025px) {
.top-14 {
	margin-top: -14%
}
.top-43 {
	margin-top: -18%
}
.top-43 h2 {
	font-size: 22px
}
}

@media screen and (max-width:768px) {
.top-14, .top-43 {
	margin-top: 0
}
}
.space-b-30, .space-bottom-30 {
	margin-bottom: 30px
}
.butterfly-icon {
	background: url(../images/butterfly-icon.svg) no-repeat;
	width: 50px;
	height: 50px
}
.butterfly-border {
	background: url(../images/butterfly-border.png) no-repeat;
	width: 150px;
	height: 150px
}
.butterfly-icon2 {
	background: url(../images/butterfly-icon2.svg) no-repeat;
	width: 50px;
	height: 50px
}

@media screen and (min-width:320px) and (max-width:1023px) {
.butterfly-icon {
	background: url(../images/butterfly-icon.svg) no-repeat;
	width: 30px;
	height: 30px
}
.butterfly-border {
	background: url(../images/butterfly-border.png) no-repeat;
	width: 150px;
	height: 150px
}
.butterfly-icon2 {
	background: url(../images/butterfly-icon2.svg) no-repeat;
	width: 30px;
	height: 30px
}
}
.cart-icon, .note-icon {
	width: 30px;
	height: 30px;
}
.note-icon {
	background: url(../images/note-btn.svg) no-repeat
}
.cart-icon {
	background: url(../images/cart-btn.svg) no-repeat
}
.bbl-icon-1 {
	background: url(../images/icon-bbl-1.svg) no-repeat;
	width: 42px;
	height: 68px
}
.bbl-icon-2 {
	background: url(../images/icon-bbl-2.svg) no-repeat;
	width: 42px;
	height: 68px
}
.share-fb-icon {
	background: url(../images/fb-share.svg);
	width: 30px;
	height: 30px;
	top: 10px
}
.bbl-icon-3 {
	background: url(../images/icon-bbl-3.svg) no-repeat;
	width: 70px;
	height: 68px
}
.bbl-icon-4 {
	background: url(../images/icon-bbl-4.svg) no-repeat;
	width: 70px;
	height: 68px
}
.bbl-icon-5, .bbl-icon-6, .bbl-icon-7 {
	width: 42px;
	height: 68px
}
.bbl-icon-5 {
	background: url(../images/icon-bbl-5.svg) no-repeat
}
.bbl-icon-6 {
	background: url(../images/icon-bbl-6-1.svg) no-repeat
}
.bbl-icon-7 {
	background: url(../images/icon-bbl-7-1.svg) no-repeat
}
.icon-all-baby {
	background: url(../images/all-baby.svg) no-repeat;
	width: 90px;
	height: 68px
}
.icon-all-mum {
	background: url(../images/all-mom.svg) no-repeat;
	width: 73px;
	height: 68px
}
.click-btn i {
	top: 2px;
	margin-left: 5px
}
.cart-2 {
	background: url(../images/cart-2.svg) no-repeat;
	width: 28px;
	height: 25px
}
.pink-color {
	color: #ec6ea5!important
}
.pink-bg {
	background: #ec6ea5
}
.yellow-color {
	color: #ffec00!important
}
.clock {
	background: url(../images/clock-icon.svg);
	width: 20px;
	height: 20px;
	top: 5px
}
body {
	font-size: 25px;
	line-height: 120%;
	background: #ccc
}

@media screen and (min-width:320px) and (max-width:1023px) {
body {
	font-family: 'DB Ozone X Li';
	font-size: 25px;
	line-height: 120%;
	background: #ccc
}
}
.col-33 {
	width: 33.33%;
	float: left
}
.icon {
	display: inline-block
}
.relate .icon {
	display: block
}
.embed-responsive-item {
	width: 100%!important;
	height: 100%!important
}
header, header.menu-2 {
	position: fixed;
	width: 100%;
	height: 100px;
	z-index: 9999
}
header {
	top: 0;
	left: 0;
	transform: translateX(0);
	-webkit-transform: translateX(0);
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}
header.slide-header {
	transform: translateX(-80%);
	-webkit-transform: translateX(-80%)
}
header.menu-2 {
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0 )
}

@media screen and (min-width:1025px) and (max-width:1180px) {
header.menu-2 {
	position: fixed;
	width: 100%;
	height: 100px;
	z-index: 9999;
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0 )
}
.space-header {
	margin-top: 80px!important;
	margin-bottom: 50px
}
}

@media screen and (min-width:1025px) and (max-height:630px) {
header.menu-2 {
	position: fixed;
	width: 100%;
	height: 100px;
	z-index: 9999;
	background: #fff
}
.space-header {
	margin-top: 80px!important;
	margin-bottom: 50px
}
}
.control-sound {
	position: absolute;
	top: 50%;
	right: 15px
}
.top-1 {
	position: relative;
	top: 2px
}
.logo-top-left {
	width: 15%;
	float: left
}
.logo-top-left a {
	display: block;
	margin-top: .5em
}
.logo-main {
	background-image: url(../images/logo-main.svg);
	background-repeat: no-repeat;
	background-size: 175px 66px;
	width: 219px;
	height: 82px
}
.home-text, .v-line>div {
	height: 100%;
	z-index: 9;
	align-items: center;
	color: #fff;
	overflow: hidden
}
nav.main-navigation {
	width: 100%;
	float: left;
	display: flex;
	margin-left: 0;
	margin-right: 0;
	position: absolute;
	justify-content: center;
}
nav.main-navigation ul {
	text-align: center;
	list-style: none;
	padding-left: 0;
	display: table-row
}
nav.main-navigation ul li {
	display: inline;
	display: table-cell;
	position: relative;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}
nav.main-navigation ul li a {
	margin-top: 25px;
	font-size: 20px;
	padding-left: .3em;
	padding-right: .3em;
	padding-bottom: 10px;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	color: #fff
}
nav.main-navigation ul li a>i {
	position: relative;
	top: 2px
}
nav.main-navigation ul li ul {
	position: absolute;
	left: 0;
	width: 250px;
    margin-left: 0px;
    z-index: -1;
    opacity: 0;
    transform: scale(0);
    transition: all .4s;
}
nav.main-navigation ul li:hover ul {
    z-index: 1;
    opacity: 1;
    transform: scale(1);
    height: auto;
}
nav.main-navigation ul li ul li {
	display: block;
	margin-top: 0;
	text-align: left;
	margin-left: 0;
	margin-right: 0;
    background: rgba(128, 128, 128, .9);
}
nav.main-navigation ul li ul li a {
	display: block;
	margin-top: 0;
	padding: 5px 15px
}
nav.main-navigation ul li ul.sub-product {
	width: 350px
}
nav.main-navigation ul li ul.sub-product a span {
	margin-right: 15px;
	margin-top: 0px;
	margin-bottom: 0px;
	display: inline-block
}
nav.main-navigation ul li ul.sub-product a span img {
	background: 0 0
}

nav.main-navigation ul li ul.group-product {
    display: flex;
    width: 800px;
    opacity: 0;
    z-index: -1;
    transition: all .4s ease;
}
nav.main-navigation ul li.product-group:hover ul.group-product {
    opacity: 1;
    z-index: 1;
}
nav.main-navigation ul li ul.group-product>li {
    background: none;
    margin: 0 0.5px;
    overflow: hidden;
}
nav.main-navigation ul li ul.group-product>li:first-child {
    margin-left: 0;
}
nav.main-navigation ul li ul.group-product>li:last-child {
    margin-right: 0;
}
nav.main-navigation ul li ul.group-product>li a {
    display: block;
    font-size: 17px;
    padding: 0;
    border: none;
}
nav.main-navigation ul li ul.group-product>li a.bg-great {
    background: rgba(216, 196, 100, .9);
}
nav.main-navigation ul li ul.group-product>li a.bg-good {
    background: rgba(128, 128, 128, .9)
}
nav.main-navigation ul li ul.group-product>li a.bg-normal {
    background: rgba(209, 142, 139, .9)
}
nav.main-navigation ul li ul.group-product>li span.group-head {
    display: block;
    background: rgba(239, 229, 180, .9);
    color: #1b1464;
    font-size: 20px;
    text-align: center;
}
nav.main-navigation ul li ul.group-product li.menu-group {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}
nav.main-navigation ul li ul.group-product li.menu-group-l {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
nav.main-navigation ul li ul.group-product li.menu-group-l .nav-list-box {
    display: flex;
}
nav.main-navigation ul li ul.group-product li.menu-group-l .nav-list-box a {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    display: block;
    margin: 0 0.5px;
}
nav.main-navigation ul li ul.group-product li.menu-group-l .nav-list-box a:nth-child(odd){
    margin-left: 0;
}
nav.main-navigation ul li ul.group-product li.menu-group-l .nav-list-box a:nth-child(even) {
    margin-right: 0;
}
#slides .slides-container {
	display: none;
}
.home-text {
	position: absolute;
	width: 100%;
	display: inline-block;
	justify-content: center
}
.home-text a {
	color: #fff;
	padding: 2px 30px;
	border-radius: 20px
}
.home-text-box {
	width: 100%;
	position: relative
}
.v-line>div {
	position: absolute;
	width: 100%;
	display: flex;
	justify-content: center
}
.text-small {
	font-size: 18px;
	margin-top: -15px
}
.home-text-box h1 {
	font-size: 40px;
}

.home-text-box .header-txt {
	font-size: 40px;
	font-weight: bold;
	margin-bottom: 20px;
}

@media screen and (max-width:1023px) and (min-width:320px) {
.home-text-box h1 {
	font-size: 30px
}

.home-text-box .header-txt {
	font-size: 30px
}

}
.home-text-box h2 {
	font-size: 30px;
	font-weight: 400;
	margin-top: -15px
}

.home-text-box .txt-desc {
	font-size: 30px;
	font-weight: 400;
	margin-top: -15px
}

@media screen and (min-device-width:769px) and (max-device-width:1024px) {
.right-btn {
	width: 10%
}
.home-text {
	font-size: 30px;
	line-height: 120%;
	letter-spacing: 1px
}
}

@media only screen and (min-width:1025px) {
.home-text {
	font-size: 23px;
	line-height: 120%;
	letter-spacing: 1px
}
}

@media only screen and (min-width:1600px) {
.home-text-box h1 {
	font-size: 40px
}
.home-text-box .txt-desc {
	font-size: 30px;
	font-weight: 700
}
.home-text {
	font-size: 25px;
	line-height: 120%;
	letter-spacing: 1px
}
nav.main-navigation ul li a {
	font-size: 24px;
	margin-top: 1em
}
nav.main-navigation ul li ul li a {
	padding: 15px
}
}

@media only screen and (min-width:1900px) {
.home-text-box h1 {
	font-size: 30px
}
.home-text-box h2 {
	font-size: 40px;
	font-weight: 700
}
.home-text {
	font-size: 35px;
	line-height: 120%;
	letter-spacing: 1px
}
nav.main-navigation ul li a {
	font-size: 24px;
	margin-top: 1em
}
}
ul.up-arrow {
	opacity: 1
}
ul:hover.up-arrow {
	background: #6b6868
}
ul.up-arrow:after {
	display: block;
	position: absolute;
	left: 15%;
	bottom: 100%;
	width: 0;
	height: 0;
	border-bottom: 10px solid #6b6868;
	border-top: 10px solid transparent;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent
}
header.menu-2 nav.main-navigation ul li a {
	color: #333
}
header nav.main-navigation ul li.main-link-icon {
	top: 0;
	position: relative;
}

header nav.main-navigation ul li.main-link-icon a:first-child {
	margin-left: 10px;
}

header.menu-2 nav.main-navigation ul li ul a:hover, header.menu-2 nav.main-navigation ul li ul li a {
	color: #fff
}
.hvr-underline-from-center:before, .hvr-underline-from-left:before, .hvr-underline-reveal:before {
	background: #ff7bac
}
.hvr-radial-out:before, .hvr-rectangle-in, .hvr-shutter-in-vertical, .hvr-shutter-out-horizontal, .hvr-sweep-to-right:before {
	background: #636363
}
.hvr-radial-out, .hvr-rectangle-in:before, .hvr-shutter-in-vertical:before, .hvr-shutter-out-horizontal:before {
	background: #6b6868
}
.social-nav {
	float: left;
	width: 20%;
	margin-top: 1em
}
#navbar-mobile-container ul li a i, .right-btn, .right-btn a {
	float: right
}
.fb-link, .ig-link, .line-link, .yt-link, .tvc-a {
	width: 40px;
	height: 40px;
	text-indent: -9000px
}
ul.social {
	list-style: none;
	padding-left: 0
}
ul.social li {
	display: inline
}
.fb-link, .ig-link, .line-link, .right-btn a, .yt-link, .tvc-a  {
	display: inline-block
}
.fb-link {
	background: url(../images/fb-btn.svg)
}
.yt-link {
	background: url(../images/yt-btn.svg)
}
.ig-link {
	background: url(../images/ig-btn.svg)
}
.line-link {
	background: url(../images/line-btn.svg)
}
.tvc-a {
	background: url(../images/tvc-btn.svg)
}
.right-btn {
	width: 20%;
	text-align: right;
	margin-right: -15px
}
.online-shop, .register-free {
	height: 90px;
	text-align: center;
	padding-top: 5px;
	opacity: .8;
	color: #59595b;
	width: 80px;
	font-weight: 700
}
.register-free {
	background: #F9A5C7;
	display: block;
	font-size: 18px
}
.register-free span {
	display: block;
	margin-top: -5px;
	line-height: 18px
}
.online-shop {
	background: #FFF100;
	display: block;
	font-size: 20px
}
.online-shop span {
	display: block;
	margin-top: 0;
	line-height: 18px
}
.register-free-icon {
	background: url(../images/register-free-icon.png);
	background-size: 101px 87px;
	width: 101px;
	height: 87px
}
.online-shoping-icon {
	background: url(../images/online-shoping-icon.png);
	background-size: 101px 87px;
	width: 101px;
	height: 87px
}
.hamburger {
	padding: 13px 10px 0;
	height: 50px;
	display: inline-block;
	cursor: pointer;
	transition-property: opacity, -webkit-filter;
	transition-property: opacity, filter;
	transition-property: opacity, filter, -webkit-filter;
	transition-duration: .15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	border: 0;
	margin: 0;
	overflow: visible;
	background: #4c4d4f
}
.hamburger-box {
	width: 30px;
	height: 24px;
	display: inline-block;
	position: relative
}
.hamburger-inner, .hamburger-inner::after, .hamburger-inner::before {
	width: 30px;
	height: 4px;
	background-color: #fff;
	border-radius: 4px;
	position: absolute;
	transition-property: -webkit-transform;
	transition-property: transform;
	transition-property: transform, -webkit-transform;
	transition-duration: .15s;
	transition-timing-function: ease
}
#navbar-mobile-container {
	display: none;
	background: #fff;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	zoom: 1;
	color: #f1f1f1;
	width: 300px;
	position: absolute;
	top: 0;
	right: 0;
	height: auto;
	padding: 5px 0;
	z-index: 99;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border: 1px solid #e6e6e6
}

@media screen and (min-width:320px) and (max-width:1024px) {
#navbar-mobile-container {
	top: 50px
}
}

@media screen and (min-width:1025px) and (max-width:1180px) {
#navbar-mobile-container {
	top: 80px
}
}
#navbar-mobile-container ul {
	list-style: none;
	padding-left: 0;
	background: 0 0
}
#navbar-mobile-container ul>li {
	border-bottom: 1px solid #e6e6e6;
	padding: 0 30px
}
#navbar-mobile-container ul>li:last-child {
	border-bottom: none
}
#navbar-mobile-container ul li a {
	font-size: 20px;
	color: #444;
	display: block;
	padding: 5px 0
}
#navbar-mobile-container ul.sub-product li a img {
	width: 30px
}
#navbar-mobile-container ul li.main-link-icon a {
	font-size: 24px;
	color: #fff;
	display: inline-block
}
#navbar-mobile-container ul li ul {
	padding-left: 20px;
	display: none
}
#navbar-mobile-container ul li ul li {
	border-bottom: none;
	padding: 0
}
#navbar-mobile-container ul li ul li.group-nav {
	margin-left: -50px;
    text-align: center;
    background: #ccc;
    margin-right: -50px;
}
#site_container {
	transform: translateX(0);
	-webkit-transform: translateX(0);
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	width: 100%;
	z-index: 999;
	background: #ccc;
	visibility: visible
}
#site_container.slide-left {
	transform: translateX(-80%);
	-webkit-transform: translateX(-80%)
}

@media screen and (min-width:320px) and (max-width:1023px) {
.show-menu header.menu-2, header, header.menu-2 {
	position: fixed;
	width: 100%;
	z-index: 9999;
	height: 50px
}
header.menu-2 {
	background: #fff
}
.show-menu header.menu-2 {
	background: 0 0
}
.logo-top-left {
	width: 40%
}
.logo-top-left a {
	display: block;
	margin-top: 1px
}
.logo-main {
	background-image: url(../images/logo-main.svg);
	background-repeat: no-repeat;
	background-size: 130px auto;
	width: 130px;
	height: 50px
}
.hamburger {
	padding: 13px 10px 0;
	height: 50px;
	display: inline-block;
	cursor: pointer;
	transition-property: opacity, -webkit-filter;
	transition-property: opacity, filter;
	transition-property: opacity, filter, -webkit-filter;
	transition-duration: .15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	border: 0;
	margin: 0;
	overflow: visible;
	background: #4c4d4f
}
nav.main-navigation {
	display: none
}
.right-btn {
	width: 60%
}
.online-shop, .register-free {
	width: 50px;
	height: 50px;
	text-align: center;
	font-size: 10px;
	padding-top: 5px;
	font-weight: 700;
	opacity: .8;
	color: #59595b;
	display: block
}
.online-shop {
	background: #FFF100
}
.register-free {
	background: #F9A5C7
}
.online-shop span, .register-free span {
	display: block;
	margin-top: -12px;
	line-height: 12px
}
.cart-icon, .note-icon {
	width: 15px;
	height: 15px;
	margin-top: 5px
}
.note-icon {
	background: url(../images/note-btn.svg) no-repeat
}
.cart-icon {
	background: url(../images/cart-btn.svg) no-repeat
}
}
.article-link, .article-link a, .bbl-video, .home-online, .video-container, section {
	overflow: hidden
}

@media screen and (min-width:1024px) and (max-width:1024px) {
.right-btn .hamburger {
	display: none
}
nav.main-navigation {
	width: 65%;
	float: left;
	display: table;
	margin-left: 16%;
	margin-right: 8%;
	position: absolute
}
nav.main-navigation ul li.d-icon {
	display: none
}
nav.main-navigation ul li a {
	margin-top: 37px;
	font-size: 16px;
	padding-left: .5em;
	padding-right: .5em;
	padding-bottom: 10px;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	color: #fff
}
.hamburger {
	width: 77px;
	height: 77px
}
.hamburger-box {
	width: 30px;
	height: 24px;
	display: inline-block;
	position: relative;
	margin-top: 10px;
	margin-right: 12px
}
.right-btn {
	width: auto
}
.online-shop, .register-free {
	width: 77px;
	height: 77px;
	text-align: center;
	font-size: 13px;
	padding-top: 5px;
	font-weight: 700;
	opacity: .8;
	color: #59595b;
	display: block
}
.online-shop {
	background: #FFF100
}
.register-free {
	background: #F9A5C7
}
.cart-icon, .note-icon {
	width: 30px;
	height: 30px;
	margin-top: 10px
}
.note-icon {
	background: url(../images/note-btn.svg) no-repeat
}
.cart-icon {
	background: url(../images/cart-btn.svg) no-repeat
}
.register-free span {
	display: block;
	margin-top: -7px;
	line-height: 10px
}
.online-shop span {
	display: block;
	margin-top: -5px;
	line-height: 18px
}
}

@media screen and (min-width:1025px) and (max-width:1179px) {
.right-btn .hamburger, nav.main-navigation ul li.d-icon {
	display: block
}
nav.main-navigation {
	display: none;
	width: 70%;
	margin-left: 15%
}

	nav.main-navigation ul li a {
		padding-left: 0.2em;
		padding-right: 0.2em;
	}
.hamburger {
	width: 77px;
	height: 77px
}
.hamburger-box {
	width: 30px;
	height: 24px;
	display: inline-block;
	position: relative;
	margin-top: 10px;
	margin-right: 12px
}
.right-btn {
	width: auto
}
.online-shop, .register-free {
	width: 77px;
	height: 77px;
	text-align: center;
	font-size: 13px;
	padding-top: 5px;
	font-weight: 700;
	opacity: .8;
	color: #59595b;
	display: block
}
.online-shop {
	background: #FFF100
}
.register-free {
	background: #F9A5C7
}
.cart-icon, .note-icon {
	width: 30px;
	height: 30px;
	margin-top: 10px
}
.note-icon {
	background: url(../images/note-btn.svg) no-repeat
}
.cart-icon {
	background: url(../images/cart-btn.svg) no-repeat
}
.register-free span {
	display: block;
	margin-top: -7px;
	line-height: 10px
}
.online-shop span {
	display: block;
	margin-top: -5px;
	line-height: 18px
}
}

@media screen and (min-width:1180px) and (max-width:1326px) {
.hamburger, nav.main-navigation ul li.d-icon {
	display: none
}
nav.main-navigation {
	width: 70%;
	margin-left: 13%;
}
.right-btn {
	width: auto;
	float: right;
	text-align: right;
	margin-right: -15px
}
}

@media screen and (min-width:1179px) {
.right-btn a.hamburger {
	display: none
}
}
#control-sound {
	position: absolute;
	top: 120px;
	right: 15px;
	z-index: 99999
}
.sound {
	width: 30px;
	height: 21px;
	display: block
}
.sound.off {
	background: url(../images/sound-off.png)
}
.sound.on {
	background: url(../images/sound-on.png)
}
#sound_text {
	position: absolute;
	left: -100px;
	top: -2px
}
.bbl-video {
	position: relative;
	width: 100%
}

@media screen and (min-width:320px) and (max-width:375px) {
.bbl-video {
	position: relative;
	background: url(../images/mobile-banner-home.png) center top no-repeat;
	background-size: cover;
}
}

@media screen and (min-width:376px) and (max-width:750px) {
.bbl-video {
	position: relative;
	background: url(../images/mobile-banner-home.png) center top no-repeat;
	background-size: 600px auto
}
}

@media screen and (min-width:751px) and (max-width:1024px) {
.bbl-video {
	position: relative;
	background: url(../images/tablet-banner-home.png) top right no-repeat;
	background-size: 1200px auto
}
}
.hero-background {
	overflow: hidden;
	height: auto;
	width: 100%;
	z-index: 1;
	position: absolute;
	top: 0
}
.homepage-hero-module {
	border-right: none;
	border-left: none;
	position: relative
}
.no-video .video-container video, .touch .video-container video {
	display: none
}
.no-video .video-container .poster, .touch .video-container .poster {
	display: block!important
}
.video-container {
	position: relative;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: #000
}
.video-container .poster img {
	width: 100%;
	bottom: 0;
	position: absolute
}
.video-container .filter {
	z-index: 100;
	position: absolute;
	background: rgba(0,0,0,.4);
	width: 100%
}
.video-container .title-container {
	z-index: 1000;
	position: absolute;
	top: 35%;
	width: 100%;
	text-align: center;
	color: #fff
}
.video-container .description .inner {
	font-size: 1em;
	width: 45%;
	margin: 0 auto
}
.video-container .link {
	position: absolute;
	bottom: 3em;
	width: 100%;
	text-align: center;
	z-index: 1001;
	font-size: 2em;
	color: #fff
}
.video-container .link a {
	color: #fff
}
.video-container video {
	position: absolute;
	z-index: 0;
	bottom: 0
}
.video-container video.fillWidth {
	width: 100%
}
.video-overlay {
	background: #000;
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2
}
.article-link {
	position: absolute;
	bottom: 0;
	z-index: 99;
	width: 100%
}
.article-link h1 {
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}
.article-link ul {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
	text-align: center;
	height: 140px
}
.article-link ul li {
	display: inline
}
.article-link a {
	display: inline-block;
	color: #fff;
	font-size: 22px;
	padding: 10px;
	border: 2px solid #fff;
	border-bottom: none;
	margin-left: 0px;
	margin-right: 5px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	position: relative;
	text-align: center;
	width: 170px;
	height: 50px;
	top: 10px
}

@media screen and (min-width:1024px) and (max-width:1199px) {
.article-link a {
	display: inline-block;
	color: #fff;
	font-size: 20px;
	padding: 10px 0;
	border: 2px solid #fff;
	border-bottom: none;
	margin-left: 0;
	margin-right: 0;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	position: relative;
	text-align: center;
	width: 130px;
	height: 50px;
	overflow: hidden;
	top: 10px
}
}

@media screen and (min-width:1200px) and (max-width:1300px) {
.article-link a {
	display: inline-block;
	color: #fff;
	font-size: 20px;
	padding: 10px;
	border: 2px solid #fff;
	border-bottom: none;
	margin-left: 5px;
	margin-right: 5px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	position: relative;
	text-align: center;
	width: 150px;
	height: 50px;
	overflow: hidden;
	top: 10px
}
}
.ani {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 15px
}
.relate {
	position: relative
}
.article-link a span.icon {
	display: none
}
.article-link a:hover span.icon {
	display: inline-block
}
.article-link a:hover {
	background: #fff;
	color: #ec6ea5
}
.mobile-slide {
	position: absolute;
	z-index: 9;
	bottom: 0;
	width: 100%
}
.carousel-inner .item {
	text-align: center
}
.carousel-inner .item>a {
	display: inline-block;
	color: #f05b87;
	font-size: 24px;
	padding: 10px;
	border: 2px solid #fff;
	border-bottom: none;
	margin-left: 5px;
	margin-right: 5px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	position: relative;
	text-align: center;
	background: #fff;
	width: 250px
}
.carousel-inner .item a span.icon {
	display: inline-block;
	width: 30px;
	height: 40px;
	margin-right: 15px
}
.carousel-inner .item a span.icon-all-mum {
	display: inline-block;
	width: 50px;
	height: 40px;
	margin-right: 15px;
	position: relative;
	top: 3px
}
.carousel-inner .item a span.icon-all-baby {
	display: inline-block;
	width: 60px;
	height: 40px;
	margin-right: 15px;
	position: relative;
	top: 3px
}
.carousel-inner .item a span.icon.bbl-icon-3, .carousel-inner .item a span.icon.bbl-icon-4 {
	display: inline-block;
	width: 30px;
	height: 40px;
	margin-right: 15px;
	position: relative;
	top: 15px
}
.carousel-inner .item a span.bbl-text {
	display: inline-block;
	position: relative;
	top: 0px
}
.carousel-control.left, .carousel-control.right {
	background-image: none
}
.home-promotion {
	background: #fff;
	position: relative
}
.middle-table {
	margin-top: 90px
}
.click-btn {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color: #fff;
	padding: 5px 10px;
	display: inline-block
}
.home-article {
	position: relative;
	background: url(../images/home_article.jpg) center center;
	padding: 100px 0;
	background-size: cover;
	color: #fff
}

@media screen and (min-width:320px) and (max-width:1023px) {
.middle-table {
	margin-top: 20px;
	font-size: 25px
}
.home-article {
	position: relative;
	background: url(../images/home_article.jpg) center center;
	padding: 0 0 20px;
	background-size: cover;
	color: #fff
}
}

@media screen and (width:768px) and (max-width:1023px) {
.home-article {
	position: relative;
	background: url(../images/home_article.jpg) center center;
	padding: 100px 0;
	background-size: cover;
	color: #fff
}
}
.home-online {
	position: relative;
	background: url(../images/home_onlineshop.jpg) right top no-repeat #fff;
	padding: 100px 0
}

@media screen and (min-width:320px) and (max-width:1023px) {
.home-online {
	position: relative;
	background: right top #fff;
	padding: 0 0 20px
}
}
.home-product {
	position: relative;
	background: right top #fff;
	padding: 0
}
.home-product .img {
	margin-bottom: 30px
}
#register .popup-wrapper, #register .popup-wrapper2, .popup-wrapper {
	background: #fff;
	margin: auto;
	position: relative;
	padding: 40px 20px;
	border-radius: 10px
}
.popup-wrapper {
	width: 1000px
}
#register .popup-wrapper {
	width: 400px
}
#register .popup-wrapper2 {
	width: 1000px
}
.fadeout-text, .shadow {
	position: absolute;
	width: 100%
}
#register .popup-wrapper2 h2 {
	font-size: 30px
}
#register .popup-wrapper2 ol li {
	font-size: 24px
}
.popup-scroll {
	width: 100%;
	overflow-y: hidden
}
.popup-scroll>div {
	padding-bottom: 0
}
.fadeout-text {
	height: 0;
	background: url(../images/fade.png);
	bottom: -80px;
	left: 0
}
.shadow {
	top: 8em;
	height: 2em;
	background: -webkit-linear-gradient(transparent, #fff);
	background: -o-linear-gradient(transparent, #fff);
	background: -moz-linear-gradient(transparent, #fff);
	background: linear-gradient(transparent, #fff)
}

@media screen and (min-width:320px) and (max-width:375px) {
.popup-wrapper {
	background: #fff;
	width: 80%;
	margin: auto;
	position: relative;
	padding: 40px 20px;
	border-radius: 10px
}
#register .popup-wrapper, #register .popup-wrapper2 {
	background: #fff;
	width: 100%;
	margin: auto;
	position: relative;
	padding: 40px 20px;
	border-radius: 0
}
#register .popup-wrapper2 h2 {
	font-size: 25px
}
.popup-scroll {
	width: 100%;
	overflow-y: scroll
}
.fadeout-text {
	width: 100%;
	height: 200px;
	background: url(../images/fade.png);
	position: absolute;
	bottom: -80px;
	left: 0
}
.popup-scroll>div {
	padding-bottom: 80px
}
}
.popup-wrapper ol {
	counter-reset: myOrderedListItemsCounter;
	padding-left: 0;
	margin-top: 30px;
	margin-bottom: 40px
}
.popup-wrapper ol li {
	list-style-type: none;
	position: relative;
	margin-bottom: 30px;
	font-size: 34px
}
.popup-wrapper ol li:before {
	background-color: #7f8080;
	width: 30px;
	height: 30px;
	counter-increment: myOrderedListItemsCounter;
	content: counter(myOrderedListItemsCounter);
	margin-right: .5em;
	border-radius: 50%;
	padding: 0 15px;
	color: #fff
}
#popup_content, #popup_overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999;
	top: 0;
	left: 0
}
#popup_overlay {
	background: #000;
	opacity: .8
}
#popup_content {
	display: flex;
	align-items: center;
	justify-content: center
}
.close-popup {
	position: absolute;
	width: 50px;
	height: 50px;
	top: 10px;
	right: 10px;
	background: url(../images/close-popup.png)
}

@media screen and (min-width:320px) and (max-width:375px) {
.popup-wrapper {
	background: #fff;
	width: 100%;
	margin: auto;
	position: relative;
	padding: 40px 20px;
	border-radius: 0;
	box-sizing: border-box
}
#popup_content {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center
}
.close-popup {
	position: absolute;
	width: 25px;
	height: 25px;
	top: 10px;
	right: 10px;
	background: url(../images/close-popup.png);
	background-size: 25px 25px
}
.popup-wrapper ol {
	counter-reset: myOrderedListItemsCounter;
	padding-left: 0;
	margin-top: 30px;
	margin-bottom: 40px
}
.popup-wrapper ol li {
	list-style-type: none;
	position: relative;
	margin-bottom: 15px;
	font-size: 25px
}
.popup-wrapper ol li:before {
	background-color: #7f8080;
	width: 20px;
	height: 20px;
	counter-increment: myOrderedListItemsCounter;
	content: counter(myOrderedListItemsCounter);
	margin-right: .5em;
	border-radius: 50%;
	padding: 0 10px;
	color: #fff
}
}

@media screen and (min-width:376px) and (max-width:1024px) {
.popup-wrapper {
	background: #fff;
	width: 100%;
	margin: auto;
	position: relative;
	padding: 40px 20px;
	border-radius: 0;
	box-sizing: border-box
}
#popup_content {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center
}
.close-popup {
	position: absolute;
	width: 25px;
	height: 25px;
	top: 10px;
	right: 10px;
	background: url(../images/close-popup.png);
	background-size: 25px 25px
}
.popup-wrapper ol {
	counter-reset: myOrderedListItemsCounter;
	padding-left: 0;
	margin-top: 30px;
	margin-bottom: 40px
}
.popup-wrapper ol li {
	list-style-type: none;
	position: relative;
	margin-bottom: 15px;
	font-size: 25px
}
.popup-wrapper ol li:before {
	background-color: #7f8080;
	width: 20px;
	height: 20px;
	counter-increment: myOrderedListItemsCounter;
	content: counter(myOrderedListItemsCounter);
	margin-right: .5em;
	border-radius: 50%;
	padding: 0 10px;
	color: #fff
}
}
.bbl-text, .playlist-content a, a.zoom-image {
	display: block
}
.top-btn {
	background: #fff;
	position: relative;
	padding-bottom: 30px
}
.calculator-bg, .expert {
	background-attachment: fixed
}
.calculator-bg, .expert, .expert-detail {
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%
}
.expert {
	background-image: url(../images/export_bg.png)
}
.calculator-bg {
	background-image: url(../images/product_all_bg.png)
}

@media screen and (min-width:320px) and (max-width:1023px) {
.calculator-bg {
	background-image: url(../images/product_all_bg.png);
	background-position: top center;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
}
.expert-detail {
	background-image: url(../images/expert_detail_bg.png);
	background-attachment: fixed
}
.expert-detail:before {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #000;
	opacity: .3
}
.animate-text-left-bottom, .animate-text-right-bottom {
	position: absolute;
	font-size: 30px;
	line-height: 120%;
	z-index: 9;
	color: #fff
}
.animate-text-left-bottom {
	bottom: 15px
}
.animate-text-right-bottom {
	bottom: 150px;
	right: 0
}

@media screen and (min-width:320px) and (max-width:1023px) {
.animate-text-left-bottom, .animate-text-right-bottom {
	position: absolute;
	color: #fff;
	font-size: 23px;
	line-height: 120%
}
.animate-text-left-bottom {
	bottom: 15px
}
.animate-text-right-bottom {
	bottom: 150px;
	right: auto
}
}
.content-wrapper {
	padding: 30px 0;
	background: #fff
}
.content-wrapper h1 {
	margin-top: 0
}
.text-inline {
	position: relative;
	overflow: hidden
}
.text-inline a img {
	transition: all .5s ease-in-out;
	overflow: hidden;
	width: 100%;
	height: 100%
}
a.zoom-image {
	overflow: hidden
}
a.zoom-image img {
	transition: all .5s ease-in-out;
	overflow: hidden;
	width: 100%;
	height: 100%
}
.text-inline a:hover img, a.zoom-image:hover img {
	transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1)
}
.text-inline img {
	margin: auto
}
.text-inline .text {
	position: absolute;
	bottom: 15px;
	width: 100%
}
.text-inline .text p {
	padding-left: 15px;
	padding-right: 15px;
	color: #fff
}
.text-inline a {
	display: block;
	position: relative
}
.text-inline>a:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}
.text-inline>a:hover:before {
	opacity: 0;
	background: #000;
	z-index: 1
}
.text-inline .text {
	z-index: 2
}
.text-inline .text p a, .text-inline a .text p {
	color: #333;
	font-size: 25px;
	background: #fff;
	padding: 15px;
	margin: -15px;
	height: 100px;
	opacity: .9;
	font-weight: 700
}

@media screen and (min-width:320px) and (max-width:1024px) {
.text-inline .text p {
	padding-left: 15px;
	padding-right: 15px;
	color: #fff
}
.text-inline .text p a, .text-inline a .text p {
	font-size: 23px;
	color: #333;
	background: #fff;
	padding: 15px;
	margin: -15px;
	height: 75px;
	opacity: .8
}
}
.article, .article-mum, .article-mum-detail {
	background-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden
}
.article, .article-mum, .article-mum-detail, .playlist-bg {
	width: 100%;
	height: 100%
}
.article {
	background-image: url(../images/article_bg.png)
}
.article-mum {
	background-image: url(../images/article_mum_bg.png)
}
.article-mum-detail {
	background-image: url(../images/mum_detail_bg.png)
}
.article-mum-detail:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #000;
	opacity: .3
}
.playlist-bg {
	position: relative;
	overflow: hidden;
	background: #fff
}
.overlay, .playlist, .video-playlist {
	position: absolute;
	height: 100%
}
.overlay, .playlist-content a:hover {
	background: #000
}
.video-playlist {
	width: 400px;
	top: 0;
	right: 0;
	z-index: 99
}
.overlay, .playlist, .playlist-content table {
	width: 100%
}
.overlay {
	opacity: .8
}
.playlist {
	top: 0
}
.playlist-content {
	position: relative;
	margin-top: 130px;
	color: #fff;
	overflow-y: auto
}
.playlist-content ul {
	list-style: none;
	padding-left: 0
}
.playlist-content table tr td {
	padding: 5px 10px;
	border-bottom: solid 1px #fff;
	color: #fff
}
.playlist-content table tr td:first-child {
	width: 30%
}
.yt-img {
	width: 80px;
	display: inline-block;
	margin-right: 15px
}
#mother_class h1.m-only {
	margin-top: 80px;
	text-align: center
}

@media screen and (min-width:320px) and (max-width:1023px) {
.playlist, .video-playlist {
	width: 100%;
	height: 100%;
	top: 0;
	position: relative
}
.video-playlist {
	right: 0;
	z-index: 99
}
.playlist-content {
	position: relative;
	margin-top: 0;
	color: #fff;
	overflow-y: auto
}
}
.intrinsic-container {
	position: relative;
	height: 0;
	overflow: hidden;
	margin-bottom: 15px
}
.intrinsic-container-16x9 {
	padding-bottom: 56.25%
}
.intrinsic-container-4x3 {
	padding-bottom: 75%
}
.intrinsic-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

@media screen and (min-width:1025px) {
.intrinsic-container {
	width: 700px;
	height: 500px;
	margin: auto
}
.intrinsic-container-4x3 {
	padding-bottom: 0
}
}
.share-fb, .tags, .time {
	margin-bottom: 30px
}
.tags a, .tags-box a {
	margin-left: 5px;
	margin-right: 5px;
	color: #666
}
.tags-box {
	display: inline
}
.arrow_box {
	position: relative;
	background: #949494;
	padding: 0 5px;
	color: #fff;
	border-right: solid 1px #949494;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	margin-right: 15px
}
.arrow_box:after, .arrow_box:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-radius: 5px;
	border-color: rgba(148,148,148,0);
	border-left-color: #949494;
	border-width: 16px;
	margin-top: -16px
}
.article-baby, .article-baby-detail {
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	background-color: #000;
	overflow: hidden;
	height: 100%;
	width: 100%
}
.share-fb {
	font-weight: 700;
	margin-top: 30px
}
.article-baby {
	background-image: url(../images/article_baby_bg.png);
	background-position: bottom center
}
.article-baby-detail {
	background-image: url(../images/baby_detail_bg.png);
	background-position: top center
}
.article-baby-detail:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #000;
	opacity: .3
}
.contact, .promotion {
	background-position: top center;
	background-repeat: no-repeat
}
.tag-list a {
	padding-left: 15px;
	padding-right: 15px;
	display: inline-block;
	color: #666
}
.promotion {
	background-image: url(../images/desktop-banner-promotion.png);
	background-attachment: fixed;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}

@media screen and (min-width:320px) and (max-width:480px) {
.promotion {
	background-image: url(../images/mobile-banner-promotion.png);
	background-position: top center;
	background-attachment: inherit;
	background-repeat: no-repeat;
	background-size: 480px auto;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
}

@media screen and (min-width:481px) and (max-width:640px) {
.promotion {
	background-image: url(../images/mobile-banner-promotion.png);
	background-position: top center;
	background-attachment: inherit;
	background-repeat: no-repeat;
	background-size: 640px auto;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
}

@media screen and (min-width:641px) and (max-width:1023px) {
.promotion {
	background-image: url(../images/tablet-banner-promotion.png);
	background-position: top center;
	background-attachment: inherit;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
}

@media screen and (width:1024px) {
.promotion {
	background-image: url(../images/tablet-banner-promotion.png);
	background-position: top center;
	background-attachment: inherit;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
}
.time {
	color: #999;
	font-size: 20px;
	margin-top: -15px
}
p.video-content {
	width: 600px;
	height: 400px;
	border: 10px solid #ffffab
}

@media screen and (min-width:320px) and (max-width:767px) {
p.video-content {
	width: 100%;
	height: auto;
	border: 10px solid #ffffab
}
}

@media screen and (min-width:768px) and (max-width:1023px) {
p.video-content {
	width: 100%;
	height: 500px;
	border: 10px solid #ffffab
}
}
.form-email {
	position: absolute;
	width: 40%;
	top: 16px;
	right: 0
}
.form-email input {
	width: 70%;
	border-radius: 20px;
	display: inline;
	font-size: 18px
}
.form-email button {
	width: 25%;
	margin-left: 1%
}
.contact, .online {
	background-color: #000;
	position: relative;
	overflow: hidden;
	width: 100%;
	color: #fff
}
.form-email div {
	padding-left: 5px;
	padding-right: 5px
}
.contact {
	background-image: url(../images/contact_bg.jpg);
	background-attachment: fixed;
	background-size: cover;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center
}

@media screen and (min-width:320px) and (max-width:480px) {
.contact {
	background-image: url(../images/mobile/contact.png);
	background-size: 480px auto;
	background-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: auto!important;
	width: 100%;
	display: inherit;
	padding-top: 80px;
	align-items: center;
	justify-content: center;
	color: #fff
}
}

@media screen and (min-width:481px) and (max-width:640px) {
.contact {
	background-image: url(../images/mobile/contact.png);
	background-size: 640px auto;
	background-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: auto!important;
	width: 100%;
	display: inherit;
	padding-top: 80px;
	align-items: center;
	justify-content: center;
	color: #fff
}
}
.online, .product-all {
	background-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover
}

@media screen and (min-width:641px) and (max-width:1023px) {
.contact {
	background-image: url(../images/contact_bg.jpg);
	background-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #000;
	position: relative;
	overflow: hidden;
	height: auto!important;
	width: 100%;
	display: inherit;
	padding-top: 80px;
	align-items: center;
	justify-content: center;
	color: #fff
}
}
.online {
	background-image: url(../images/online_bg.png);
	height: 100%
}
.top-65-up {
	margin-top: -75px
}
.online h1, .online h2 {
	margin-left: 40px
}
.col-33 img {
	width: 150px
}
.pd-all {
	padding-top: 130px;
	padding-bottom: 130px
}
.contact-detil {
	position: absolute;
	bottom: 15px
}

@media screen and (min-width:320px) and (max-width:1023px) {
.col-33 img {
	width: 100%
}
.online h1, .online h2 {
	margin-left: 0
}
.pd-all {
	padding-top: 50px;
	padding-bottom: 50px
}
.contact-detil {
	position: relative;
	bottom: 15px;
	padding: 30px 15px
}
}
a.pink-bg, button.gray-bg, button.pink-bg {
	border: none;
	color: #fff;
	height: 34px;
	padding: 2px 12px;
	border-radius: 20px
}
.product, .product-all {
	background-color: #fff;
	height: 100%;
	width: 100%;
	position: relative;
	color: #666;
	overflow: hidden
}
.space-top-30 {
	padding-top: 30px
}
.product {
	display: flex;
	align-items: center;
	justify-content: center
}

@media screen and (min-width:320px) and (max-width:1023px) {
.product {
	background-color: #fff;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%;
	color: #666
}
.product.d-only {
	display: none
}
}
.product-all {
	background-image: url(../images/product_all_bg.png)
}
.fix-left {
	position: relative;
	left: 0;
	width: 100px;
	display: inline;
	text-align: center;
	z-index: 9;
	background: #fff;
	margin: auto
}
#slides {
	margin-left: -120px
}
#video #slides {
	margin-left: 0
}
#product .box-vline {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #666
}
.arrow-l, .arrow-r {
	width: 42px;
	height: 72px;
	position: absolute;
	top: 40%
}
.d-table {
	display: table!important
}
.text-big {
	font-size: 30px
}
.space-l-30 {
	margin-left: 70px
}
.space-l-50 {
	margin-left: 53px
}
.fix-left a {
	padding: 2px;
	display: inline-block
}
.fix-left a.current {
	border: 2px solid #ff7bac;
	display: inline-block;
	padding: 0
}
.list-number {
	margin-left: 50px
}
.num {
	background: #666;
	border-radius: 50%;
	text-align: center;
	padding: 0 13px;
	color: #fff;
	margin-right: 10px
}
.arrow-l {
	background: url(../images/product/arrow-btn-l.png);
	left: 0
}
.arrow-r {
	background: url(../images/product/arrow-btn-r.png);
	right: 0
}
.gray-color {
	color: #666
}
.product-online {
	background-image: url(../images/produc_bg.png);
	background-position: bottom center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #fff;
	position: relative;
	overflow: hidden;
	height: 100%;
	width: 100%
}
.space-header {
	margin-top: 50px;
	margin-bottom: 50px
}
.circle, .circle-pink, .circle-pink-2 {
	border-radius: 50%;
	display: inline-block;
	margin-bottom: 5px;
	font-weight: 700
}
.circle {
	width: 40px;
	height: 40px;
	background: #fff;
	padding: 6px
}
.circle-pink, .circle-pink-2 {
	width: 30px;
	height: 30px;
	background: #ff7bac;
	padding: 1px;
	position: absolute;
	top: -10px;
	right: -5px;
	color: #fff;
	text-align: center
}
.other-product, .usage {
	position: relative;
	height: 100%;
	width: 100%;
	overflow: hidden
}
.usage {
	background-color: #ffffab
}
.max-with-95 {
	max-width: 95%
}
.other-product {
	background-color: #fff
}
.usage table tr td {
	padding: 5px
}
.usage table tr td:first-child {
	padding-left: 0
}
.circle-head {
	border-radius: 15px;
	padding: 5px;
	color: #fff
}
.detail-product {
	padding: 0 50px
}
.space-header .text-small {
	color: #fff;
	font-size: 20px;
	margin-top: 10px
}
.product.m-only {
	display: none
}
.pd-online a {
	width: 24%
}
.pd-preview>div {
	width: 20%;
	float: left
}

@media screen and (min-width:320px) and (max-width:480px) {
.pd-preview>div {
	width: 50%;
	float: left
}
}

@media screen and (min-width:480px) and (max-width:1023px) {
.pd-preview>div {
	width: 20%;
	float: left
}
}
.carousel-control {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 6%;
	font-size: 50px;
	color: #ccc;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	background-color: rgba(0,0,0,0);
	filter: alpha(opacity=50);
	opacity: .5
}
#carousel2.carousel .item a {
	border-radius: 0;
	padding: 0;
	border: 0;
	margin: 0
}

@media screen and (min-width:320px) and (max-width:1180px) {
.product.d-only {
	display: none
}
.detail-product {
	padding: 0
}
.pd-online {
	text-align: center
}
.product.m-only {
	display: block
}
.max-with-95 {
	max-width: 100%
}
.product .carousel-indicators {
	position: relative;
	top: 0;
	left: 0;
	z-index: 15;
	width: 100%;
	margin-left: 0;
	text-align: center;
	list-style: none;
	margin-top: 15px;
	padding: 5px 0;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc
}
.product .carousel-indicators li {
	display: inline-block;
	width: 50px;
	height: 50px;
	margin: 1px;
	text-indent: 0;
	cursor: pointer;
	background-color: #000\9;
	background-color: rgba(0,0,0,0);
	border: 1px solid #fff;
	border-radius: 10px
}
.product .carousel-indicators li.active {
	border: 2px solid #ff7bac;
	display: inline-block;
	padding: 0
}
.product .carousel-control .glyphicon-chevron-left, .product .carousel-control .glyphicon-chevron-right, .product .carousel-control .icon-next, .product .carousel-control .icon-prev, .product i {
	position: absolute;
	top: 10%;
	z-index: 5;
	display: inline-block;
	margin-top: 120px;
	width: 100%;
	left: 0
}
.other-product .carousel-control i {
	position: absolute;
	top: 50%;
	z-index: 5;
	display: inline-block;
	margin-top: -25px;
	width: 100%;
	left: 0
}
.carousel-control {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 6%;
	font-size: 50px;
	color: #ccc;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	background-color: rgba(0,0,0,0);
	filter: alpha(opacity=50);
	opacity: .5
}
.arrow-l, .arrow-r {
	width: 42px;
	height: 72px;
	top: 15%;
	position: absolute
}
.arrow-l {
	background: url(../images/product/arrow-btn-l.png);
	left: 0
}
.arrow-r {
	background: url(../images/product/arrow-btn-r.png);
	right: 0
}
.circle-pink, .circle-pink-2 {
	width: 30px;
	height: 30px;
	background: #ff7bac;
	border-radius: 50%;
	display: inline-block;
	padding: 1px;
	font-weight: 700;
	margin-bottom: 5px;
	position: absolute;
	top: -3px;
	right: -7px;
	color: #fff;
	text-align: center
}
}

@media screen and (max-height:630px) {
.detail-product {
	padding: 0
}
.pd-online {
	text-align: center
}
.product.m-only {
	display: block
}
.product.d-only {
	display: none
}
.max-with-95 {
	max-width: 100%
}
.product .carousel-indicators {
	position: relative;
	top: 0;
	left: 0;
	z-index: 15;
	width: 100%;
	margin-left: 0;
	text-align: center;
	list-style: none;
	margin-top: 15px;
	padding: 5px 0;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc
}
.product .carousel-indicators li {
	display: inline-block;
	width: 50px;
	height: 50px;
	margin: 1px;
	text-indent: 0;
	cursor: pointer;
	background-color: #000\9;
	background-color: rgba(0,0,0,0);
	border: 1px solid #fff;
	border-radius: 10px
}
.product .carousel-indicators li.active {
	border: 2px solid #ff7bac;
	display: inline-block;
	padding: 0
}
.product .carousel-control .glyphicon-chevron-left, .product .carousel-control .glyphicon-chevron-right, .product .carousel-control .icon-next, .product .carousel-control .icon-prev, .product i {
	position: absolute;
	top: 10%;
	z-index: 5;
	display: inline-block;
	margin-top: 120px;
	width: 100%;
	left: 0
}
.other-product .carousel-control i {
	position: absolute;
	top: 50%;
	z-index: 5;
	display: inline-block;
	margin-top: -25px;
	width: 100%;
	left: 0
}
.carousel-control {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 6%;
	font-size: 50px;
	color: #ccc;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	background-color: rgba(0,0,0,0);
	filter: alpha(opacity=50);
	opacity: .5
}
.arrow-l, .arrow-r {
	width: 42px;
	height: 72px;
	top: 15%;
	position: absolute
}
.arrow-l {
	background: url(../images/product/arrow-btn-l.png);
	left: 0
}
.arrow-r {
	background: url(../images/product/arrow-btn-r.png);
	right: 0
}
.circle-pink, .circle-pink-2 {
	width: 30px;
	height: 30px;
	background: #ff7bac;
	border-radius: 50%;
	display: inline-block;
	padding: 1px;
	font-weight: 700;
	margin-bottom: 5px;
	position: absolute;
	top: -3px;
	right: -7px;
	color: #fff;
	text-align: center;
	z-index: 1;
}
}
.about, .kid-top, .yellow-bg-2 {
	position: relative
}
.about {
	background-color: #fff;
	overflow: hidden;
	height: 100%;
	width: 100%
}
.full, .yellow-bg-2 {
	background: #fffcdc
}
.about .space-header {
	padding-top: 60px;
	position: relative;
	z-index: 1
}
.full {
	width: 100%;
	padding: 50px 0
}
.yellow-bg-2 {
	margin-top: -95px
}
.kid-top {
	margin-top: -235px
}
.img-space-top {
	margin-top: 85px
}
.sun-smile {
	background: url(../images/about/sun.png);
	width: 244px;
	height: 235px;
	position: absolute;
	top: -200px;
	right: 0
}

@media screen and (min-width:320px) and (max-width:1023px) {
.img-space-top {
	margin-top: 0
}
.full.yellow-bg-2 {
	height: 0;
	margin-top: 0;
	padding: 0
}
.sun-smile {
	background: url(../images/about/sun.png);
	background-size: 122px auto;
	width: 122px;
	height: 117.5px;
	position: absolute;
	top: -102px;
	right: 15px
}
.kid-top {
	position: relative;
	margin-top: -125px
}
.kid-top img {
	width: 50%
}
.mobile-display {
	display: block
}
.ipad-display {
	display: none
}
}
.calculate-bt, .calculator, .footer, .footer form {
	position: relative
}

@media screen and (min-width:768px) and (max-width:1023px) {
.img-space-top {
	margin-top: 90px
}
.mobile-display {
	display: none
}
.ipad-display {
	display: block
}
.kid-top {
	position: relative;
	margin-top: 0
}
}

@media screen and (width:1024px) {
.img-space-top {
	margin-top: 0
}
.kid-top {
	position: relative;
	margin-top: -125px
}
.full.yellow-bg-2 {
	height: 0;
	margin-top: 0;
	padding: 0
}
}
.calculator, .register {
	overflow: hidden;
	height: 100%
}
.calculator {
	background-color: #fff;
	width: 100%
}
.calculator .space-header {
	padding-top: 80px
}
.calculator table.bbl-table {
	width: 100%;
	margin-top: 30px;
	background: #fffcdb;
	padding: 15px
}
.calculator table {
	width: 100%
}
.calculator table.bbl-table tr td {
	padding: 15px;
	border-left: dotted 2px #fff200;
	color: #f173ac;
	font-weight: 700;
	width: 13.33%;
	font-size: 23px
}
tr.bd-bottom td {
	border-bottom: dotted 2px #fff200
}
.calculator table.bbl-table tr td:first-child {
	border-left: none;
	width: 18%
}
.non-top-pd {
	padding-top: 0!important
}
.bg-rd-y {
	border-radius: 10px;
	display: block;
	padding: 2px 0;
	background: #fff200;
	margin-top: 0
}
.bg-2 {
	background: #ead6e7
}
tr.v-top td {
	vertical-align: top
}
td.header-table {
	color: #fff!important;
	font-size: 30px;
	font-weight: 700
}
.blue-bg {
	background: #77d9f0
}
.blue-color {
	color: #77d9f0
}
.blue-color2 {
	color: #0e76bc
}
.bt-calculate {
	color: #fff
}
.footer a, .footer2 a {
	color: #59595b
}
.calculate-bt {
	background: url(../images/calculate-bt.png);
	width: 26px;
	height: 25px;
	top: 5px;
	margin-right: 15px
}
.footer button, .footer2 button {
	width: 20px;
	height: 20px;
	border: none;
	top: 5px;
	right: 5px
}
td p.gray-color {
	font-weight: 400;
	font-size: 20px;
	margin-top: 10px;
	margin-bottom: 0
}
td.header-table p {
	margin: 0
}
.pre-footer {
	padding: 30px 0;
	background: #ffd
}
.pre-footer .text-inline .text p a {
	font-size: 20px
}

@media screen and (min-width:320px) and (max-width:1023px) {
.pre-footer .text-inline .text p a {
	font-size: 23px
}
.footer, .footer2 {
	display: none
}
}
.footer, .footer .form-control, .footer2, .footer2 .form-control {
	font-size: 20px
}
.footer {
	background: #fefcf0;
	padding: 30px 0
}
.footer ul {
	padding-left: 20px
}
.footer form {
	margin-top: 20px
}
.footer button {
	padding: 0;
	margin: 0;
	background: url(../images/search-icon.svg);
	position: absolute
}
.footer2 {
	position: relative;
	background: #fff;
	padding: 30px 0
}
.footer2 ul {
	padding-left: 20px
}
.footer2 form {
	margin-top: 20px;
	position: relative
}
.footer2 button {
	padding: 0;
	margin: 0;
	background: url(../images/search-icon.svg);
	position: absolute
}
.col-50 {
	width: 50%;
	float: left
}
.icon-1, .icon-2 {
	width: 25px;
	height: 22px;
	position: absolute
}
.col-50 a {
	font-size: 22px
}

@media screen and (min-width:320px) and (max-width:350px) {
.col-50 a {
	font-size: 20px
}
}
.m-footer {
	background: #fff;
	padding-top: 30px;
	padding-bottom: 30px
}
.copy {
	background: #FFFFAB;
	padding: 15px;
	/* margin-bottom: -30px */
}
.copy p:first-child, .copy p:last-child {
	font-size: 16px;
	margin-bottom: -5px
}
.icon-1 {
	background: url(../images/icon-1.png);
	margin-right: 50px;
	top: 0;
	left: 0
}
.icon-2 {
	background: url(../images/icon-2.png);
	margin-left: 50px;
	bottom: 0;
	right: 0
}
.gray-bg {
	background: #e5e4e9;
	overflow: visible
}
.gray-bg .space-header {
	padding-top: 0;
	padding-bottom: 0
}
.persenter {
	position: relative;
	margin-top: -80px;
	z-index: 9
}
.gray-bg .text-inline p, .gray-bg .text-inline p a {
	padding: 15px;
	margin: -15px;
	height: 100px;
	opacity: .8;
	background: #fff
}
.gray-bg .text-inline p {
	color: #333
}
.gray-bg .text-inline p a {
	font-size: 20px
}
.box-carousel {
	width: 100%;
	background: #fff;
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #666
}
.content-right, .img-left {
	width: 50%;
	float: left
}
/* .box, .box2 {
	padding: 50px
} */
.carousel-active .box-carousel {
	width: auto
}
.carousel-active .img-left {
	width: 100%;
	float: none;
	margin: auto
}
.carousel-active .content-right {
	display: none
}
.carousel-active .box2 {
	padding: 60px
}
.back-btn {
	display: block;
	margin-top: 10px
}
.back-btn .circle-pink {
	width: 30px;
	height: 30px;
	background: #ff7bac;
	border-radius: 50%;
	display: inline-block;
	padding: 3px;
	font-weight: 400;
	margin-bottom: 5px;
	position: relative;
	top: 0;
	color: #fff;
	text-align: center;
	margin-left: 10px;
	font-size: 20px
}

@media screen and (min-width:320px) and (max-width:480px) {
.box-carousel {
	width: 300px;
	background: #fff;
	border-radius: 20px;
	display: inline-block;
	align-items: center;
	justify-content: center;
	color: #666
}
.content-right, .img-left {
	width: 100%;
	float: none
}
/* .box, .box2 {
	padding: 0
} */
.img-left {
	text-align: center;
	margin-bottom: 15px
}
.flipster__button {
	position: absolute;
	top: 15%;
	display: block;
	appearance: none;
	background: 0 0;
	border: none;
	padding: 0;
	z-index: 999;
	cursor: pointer;
	font-size: 15px;
	opacity: .5;
	transition: opacity .5s ease;
	margin: -1em 2em
}
.img-left img {
	max-width: 60%;
	float: none
}
.flipster__item {
	display: inline-block;
	white-space: normal;
	word-spacing: normal;
	vertical-align: top
}
}

@media screen and (min-width:481px) and (max-width:767px) {
.box-carousel {
	width: 400px;
	background: #fff;
	border-radius: 20px;
	display: inline-block;
	align-items: center;
	justify-content: center;
	color: #666
}
.content-right, .img-left {
	width: 100%;
	float: none
}
/* .box, .box2 {
	padding: 0
} */
.img-left {
	text-align: center;
	margin-bottom: 15px
}
.flipster__button {
	position: absolute;
	top: 15%;
	display: block;
	appearance: none;
	background: 0 0;
	border: none;
	padding: 0;
	z-index: 999;
	cursor: pointer;
	font-size: 15px;
	opacity: .5;
	transition: opacity .5s ease;
	margin: -1em 2em
}
.img-left img {
	max-width: 60%;
	float: none
}
.flipster__item {
	display: inline-block;
	white-space: normal;
	word-spacing: normal;
	vertical-align: top
}
}

@media screen and (min-width:768px) and (max-width:1023px) {
.box-carousel {
	width: 700px;
	background: #fff;
	border-radius: 20px;
	display: inline-block;
	align-items: center;
	justify-content: center;
	color: #666
}
.content-right, .img-left {
	width: 100%;
	float: none
}
/* .box, .box2 {
	padding: 0
} */
.img-left {
	text-align: center;
	margin-bottom: 30px
}
.flipster__button {
	position: absolute;
	top: 30%;
	display: block;
	appearance: none;
	background: 0 0;
	border: none;
	padding: 0;
	z-index: 999;
	cursor: pointer;
	font-size: 15px;
	opacity: .5;
	transition: opacity .5s ease;
	margin: -1em 2em
}
.flipster__item {
	display: inline-block;
	white-space: normal;
	word-spacing: normal;
	vertical-align: top
}
.img-left img {
	max-width: 40%;
	float: none
}
}

@media screen and (min-width:320px) and (max-width:767px) {
.form-group label, .form-group span {
	font-size: 22px
}
.inlineCheckbox1 {
	padding-bottom: 18px
}
.inlineCheckbox2 select {
	width: 50px;
	display: inline-block;
	padding: 2px
}
}
.html-editor-wrapper table {
	width: 100%!important
}
.html-editor-wrapper table tr td {
	vertical-align: top!important;
	padding: 15px
}
.html-editor-wrapper table tr td:first-child {
	vertical-align: middle!important
}
.register {
	background-image: url(../images/register_bg.png);
	background-position: bottom center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #fff;
	position: relative;
	width: 100%
}
.arrow, .arrow a:after, .bounce a {
	position: absolute
}
.error {
	color: #d9534f
}
.no-padding-left {
	padding-left: 0
}
.no-padding-right {
	padding-right: 0
}
label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 5px;
	font-weight: 400
}
.top-radius {
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	padding-top: 5px
}
.get-check.chk-1.chk-2 .inlineCheckbox1.top-radius {
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 0;
	-moz-border-radius-topright: 0;
	border-top-right-radius: 0
}
.get-check.chk-1.chk-2 .inlineCheckbox2.top-radius {
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	-webkit-border-top-left-radius: 0;
	-moz-border-radius-topleft: 0;
	border-top-left-radius: 0
}
.toggle-form {
	margin-top: -2px;
	padding: 15px 15px 1px;
	display: none;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px
}
@keyframes bounce {
0% {
transform:translateY(30%)
}
100% {
transform:translateY(-30%)
}
}
.bounce a {
	display: block;
	width: 50px;
	height: 50px;
	left: 5px;
	bottom: 10px;
	border: 1px solid #ccc;
	border-radius: 50%;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease
}
.bounce a:hover {
	-webkit-transform: scale(.95);
	-moz-transform: scale(.95);
	-ms-transform: scale(.95);
	-o-transform: scale(.95);
	transform: scale(.95)
}
.arrow i {
	margin-top: 10px
}
.arrow:hover i {
	font-size: 30px;
	margin-top: 8px;
	-webkit-animation: bounceY .8s infinite;
	-moz-animation: bounceY .8s infinite;
	-ms-animation: bounceY .8s infinite;
	-o-animation: bounceY .8s infinite;
	animation: bounceY .8s infinite
}
.arrow a:after, .form-control {
	font-size: 20px
}
.arrow {
	bottom: 30px;
	left: 50%;
	margin-left: -20px;
	width: 40px;
	height: 40px;
	z-index: 99
}
#jpreOverlay, #loading {
	background-color: #FFF100;
	height: 100%
}
.arrow a {
	color: #ddd
}
.arrow a:after {
	content: 'เลื่อนดูข้อมูลเพิ่มเติม';
	bottom: -34px;
	left: -35px;
	width: 123px;
	color: #666
}
@-webkit-keyframes bounceY {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-6px);
-moz-transform:translateY(-6px);
-ms-transform:translateY(-6px);
-o-transform:translateY(-6px);
transform:translateY(-6px)
}
60% {
-webkit-transform:translateY(-3px);
-moz-transform:translateY(-3px);
-ms-transform:translateY(-3px);
-o-transform:translateY(-3px);
transform:translateY(-3px)
}
}
@-moz-keyframes bounceY {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-6px);
-moz-transform:translateY(-6px);
-ms-transform:translateY(-6px);
-o-transform:translateY(-6px);
transform:translateY(-6px)
}
60% {
-webkit-transform:translateY(-3px);
-moz-transform:translateY(-3px);
-ms-transform:translateY(-3px);
-o-transform:translateY(-3px);
transform:translateY(-3px)
}
}
@-ms-keyframes bounceY {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-6px);
-moz-transform:translateY(-6px);
-ms-transform:translateY(-6px);
-o-transform:translateY(-6px);
transform:translateY(-6px)
}
60% {
-webkit-transform:translateY(-3px);
-moz-transform:translateY(-3px);
-ms-transform:translateY(-3px);
-o-transform:translateY(-3px);
transform:translateY(-3px)
}
}
@keyframes bounceY {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-6px);
-moz-transform:translateY(-6px);
-ms-transform:translateY(-6px);
-o-transform:translateY(-6px);
transform:translateY(-6px)
}
60% {
-webkit-transform:translateY(-3px);
-moz-transform:translateY(-3px);
-ms-transform:translateY(-3px);
-o-transform:translateY(-3px);
transform:translateY(-3px)
}
}
@-webkit-keyframes bounceX {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateX(0);
-moz-transform:translateX(0);
-ms-transform:translateX(0);
-o-transform:translateX(0);
transform:translateX(0)
}
40% {
-webkit-transform:translateX(-6px);
-moz-transform:translateX(-6px);
-ms-transform:translateX(-6px);
-o-transform:translateX(-6px);
transform:translateX(-6px)
}
60% {
-webkit-transform:translateX(-3px);
-moz-transform:translateX(-3px);
-ms-transform:translateX(-3px);
-o-transform:translateX(-3px);
transform:translateX(-3px)
}
}
#loading {
	position: fixed;
	z-index: 10000;
	width: 100%;
	top: 0;
	left: 0
}
#jpreLoader, #loader, .spinner {
	position: relative
}
#jpreOverlay {
	width: 100%;
	z-index: 9;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff
}
#logoLoader {
	background: url(../images/logo-main.svg) top center no-repeat;
	background-size: 130px auto;
	width: 100%;
	height: 65px
}
#jpreLoader {
	width: 300px
}
#jpreBar {
	height: 2px!important;
	background: #333
}
#jprePercentage {
	width: 100%;
	text-align: center;
	color: #333;
	margin-top: 15px;
	font-weight: 700
}
.pagerDB a, .pagerDB b {
	padding: 5px 15px;
	border-radius: 20px;
	margin: 0 2px;
	color: #fff
}
.pagerDB a {
	background: #B3B2B3
}
.pagerDB b {
	background: #EA6EA4;
	font-weight: 400
}
@-webkit-keyframes progress {
from {
background-position:0 0
}
to {
background-position:-60px -60px
}
}
@-moz-keyframes progress {
from {
background-position:0 0
}
to {
background-position:-60px -60px
}
}
@-ms-keyframes progress {
from {
background-position:0 0
}
to {
background-position:-60px -60px
}
}
@-o-keyframes progress {
from {
background-position:0 0
}
to {
background-position:-60px -60px
}
}
@keyframes progress {
from {
background-position:0 0
}
to {
background-position:-60px -60px
}
}
.spinner {
	width: 40px;
	height: 40px;
	margin: 20% auto
}
.double-bounce1, .double-bounce2 {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: #333;
	opacity: .6;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-animation: sk-bounce 2s infinite ease-in-out;
	animation: sk-bounce 2s infinite ease-in-out
}
.double-bounce2 {
	-webkit-animation-delay: -1s;
	animation-delay: -1s
}
@-webkit-keyframes sk-bounce {
0%, 100% {
-webkit-transform:scale(0)
}
50% {
-webkit-transform:scale(1)
}
}
@keyframes sk-bounce {
0%, 100% {
transform:scale(0);
-webkit-transform:scale(0)
}
50% {
transform:scale(1);
-webkit-transform:scale(1)
}
}

.online-box, .pd-online {
	text-align: center;
}

.online-box a, .pd-online a {
	width: 23%;
}

/* subscribe popup */
.subscribe-popup-overlay {
	position: fixed;
	top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index: 10000;
	background: #0b0b0b;
  	background: rgba(0, 0, 0, 0.9);
	opacity: 0;
  	-webkit-transition: opacity 0.3s ease;
  	-o-transition: opacity 0.3s ease;
  	transition: opacity 0.3s ease;
}
.subscribe-popup-overlay.opened {
  opacity: 0.8;
}
.subscribe-popup-overlay.closed {
  opacity: 0;
}

.subscribe-popup-box {
	position: fixed;
	display: flex;
	top: 0;
    left: 0;
    z-index: 10000;
	width: 100%;
	height: auto;
	justify-content: center;
	align-items: center;
}

.subscribe-popup-content {
	width: 800px;
	height: 100%;
	background:#fff;
	position: relative;
  	overflow: auto;
	pointer-events: auto;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
 	-webkit-overflow-scrolling: touch;
}

.subscribe-popup-close {
	position: absolute;
    z-index: 99;
    top: 15px;
    right: 15px;
    width: 36px;
    height: 36px;
    text-indent: -9000px;
	background: url(../images/subscribe-close.png);
	background-size: 36px auto;
}

.subscribe-popup-content iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}

@media screen and (max-width:800px) {
	.subscribe-popup-content {
		width: 95%;
		height: 95%;
		background:#fff;
		position: relative;
		overflow: auto;
		pointer-events: auto;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-overflow-scrolling: touch;
	}

	.subscribe-popup-box {
		position: absolute;
		display: flex;
		top: 0;
	    left: 0;
	    z-index: 10000;
		width: 100%;
		height: auto;
		justify-content: center;
		align-items: center;
	}

}

/* TVC */
.tvc-link {
	padding: 15px 0;
	display: block;
}
.k_setting_modal-button {
	border-color: #fdf131 !important;
	background-color: #fdf131 !important;
	color: #000105 !important;
  }
  
  .k_cookie_bar .bottom {
	align-items: center;
  }
  
  .k_setting_modal-category .category-label_text {
	width: 107px !important;
  }
  .k_setting_modal-category .category-heading_3 {
	width: calc(100% - 120px) !important;
  }