/*-------------------------------------------------------------------------------------------------------------------------------*/
/* GLOBAL SETTINGS */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@media(max-width: 767px){
    .spacer-xl,.spacer-lg,.spacer-md {height: 50px;}
    .spacer-header {height: 20px;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* TYPOGRAPHY */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@media(max-width: 991px){
    .title-block .title-block-inner {padding: 15px;-ms-flex-wrap: wrap;flex-wrap: wrap;}
    .title-block .title-block-inner .title {width: 100%;margin-top: auto;}
    .title-block .title-block-inner .japan {font-size: 20px;text-align: left;padding-left: 55px;}
    blockquote {padding: 30px;margin: 8px 0;}
    blockquote::before,blockquote::after {width: 52px;height: 26px;}
    blockquote::before {left: 30px;top: -8px;}
    blockquote::after {right: 30px;bottom: -8px;}
}
@media(max-width: 767px){
    .title-margin-60,.title-margin-50,.title-margin-40,.title-margin-30 {margin-bottom: 20px;}
    .title-decor,.title-block .title-block-inner .title.title-decor,.title-block .title-block-inner .japan {padding-left: 0;}
    .title-decor::before {display: none;}
    h1 br,.h1 br,h2 br,.h2 br,h3 br,.h3 br,h4 br,.h4 br, h5 br,.h5 br,h6 br,.h6 br {display: none;}
    h1,.h1 {font-size: 46px;}
    h2,.h2 {font-size: 38px;}
    h3,.h3 {font-size: 36px;}
    h4,.h4 {font-size: 30px;}
    h5,.h5 {font-size: 24px;}
    h6,.h6 {font-size: 18px;}
    .text,.text p,.text.size-2,.text.size-2 p {font-size: 16px;}
    .title-block,.title-block .title-block-inner {padding: 10px;}
    .title-block .title-block-inner .title {font-size: 32px;text-align: center;}
    .title-block .title-block-inner .japan {display: none;}
    .text ul li {padding-left: 15px;}
    .text ul li:before {top: 11px;}
    .text ol li {padding-left: 18px;}
    .text ol li:before {font-size: 15px;}
    blockquote {margin: 0;padding: 20px;font-size: 17px;}
    blockquote::before,blockquote::after {display: none;}
}
@media(max-width: 575px){
    .text-line-1,.text-line-2,.text-line-3,.text-line-4,.text-line-5,.text-line-6 {-webkit-line-clamp: inherit;}
}
@media(max-width: 480px){
    .title-margin-50,.title-margin-40,.title-margin-30,.title-margin-20 {margin-bottom: 15px;}
    h1,.h1 {font-size: 36px;}
    h2,.h2 {font-size: 32px;}
    h3,.h3 {font-size: 26px;}
    h4,.h4 {font-size: 24px;}
    h5,.h5 {font-size: 20px;}
    .text,.text p,.text.size-2,.text.size-2 p {font-size: 15px;}
    .title-block {padding: 8px;}
    .title-block .title-block-inner .title {font-size: 26px;}
    .text * {margin-bottom: 10px;}
    .text ul li {padding-left: 12px;}
    .text ul li:before {top: 9px;}
    .text ol li {padding-left: 16px;}
    .text ol li:before {font-size: 14px;top: 2px;}
    blockquote {padding: 15px;}
}
@media(max-width: 400px){
    h1,.h1 {font-size: 32px;}
    h2,.h2 {font-size: 28px;}
    h3,.h3 {font-size: 24px;}
    h4,.h4 {font-size: 22px;}
    .title-block {padding: 5px;}
    .title-block .title-block-inner {padding: 8px;}
    .title-block .title-block-inner .title {font-size: 24px;}
    .text * {margin-bottom: 8px;}
    blockquote {padding: 12px;font-size: 16px;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* BANNER BLOCK */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@media(max-width: 991px){
    .home-banner .banner {height: 350px;}
    .home-banner::before {height: calc(100% - 340px);}
}
@media(max-width: 767px){
    .banner-opacity,.banner-opacity.mobile {display: none;}
    .banner-cont.mobile {margin-top: 15px;}
    .banner-cont {width: 80%;bottom: 20px;}
    .home-banner .banner {height: 320px;}
    .home-banner::before {height: calc(100% - 310px);}
}
@media(max-width: 575px){
    .banner-opacity-top {display: none;}
    .banner-cont.mobile {margin-top: 10px;}
    .banner-cont {width: 90%;bottom: 15px;}
    .home-banner .banner {height: 270px;}
    .home-banner::before {height: calc(100% - 260px);}
    .banner.simple-banner {margin-top: 20px;}
    .banner.simple-banner .banner-cont {padding-bottom: 15px;}
    .banner.simple-banner .banner-cont::before {height: 15px;}
}
@media(max-width: 480px){
    .banner-cont.mobile .title,.banner-cont.mobile .text {margin-bottom: 12px;}
    .home-banner .banner-cont .text {font-size: 15px;}
    .banner-cont {width: 95%;}
    .home-banner .banner {height: 250px;}
    .home-banner::before {height: calc(100% - 240px);}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* PAGE DECOR */
/*-------------------------------------------------------------------------------------------------------------------------------*/
@media(max-width: 1199px){
    .page-decor {display: none;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* BUTTONS */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@media(max-width: 767px){
    .simple-btn span {font-size: 16px;}
    .btn {height: 44px;padding: 0 20px;}
    .btn span {font-size: 13px;}
    .btn-close,.card-close {width: 14px;height: 14px;}
}
@media(max-width: 575px){
    .simple-btn,.simple-btn.red {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 100%;height: 44px;background-color: var(--color-red);border: 1px solid var(--color-red);}
    .simple-btn span,.simple-btn.red span {font-size: 13px;font-weight: 600;text-transform: uppercase;color: var(--color-white);}
    .simple-btn:active,.simple-btn.red:active {-webkit-transform: translateY(5px);-ms-transform: translateY(5px);transform: translateY(5px);}
    .btn {width: 100%;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
    .simple-btn::before,.btn::before {position: absolute;content: '';top: 0;left: 0;display: inline-block;width: 100%;height: 100%;background-image: url(../img/icons/btn_decor.svg);background-size: auto;background-repeat: repeat;background-position: top center;}
    .btn.red.active,.btn.white,.btn.white.active {background-color: var(--color-red);border-color: var(--color-red);}
    .btn.red.active span,.btn.white span,.btn.white.active span {color: var(--color-white);}
    .btn-block .btn {margin: 0;margin-bottom: 5px;}
    .btn-block .btn:last-child {margin-bottom: 0;}
    .card-close {top: 13px;right: 10px;}
}
@media(max-width: 400px){
    .simple-btn,.simple-btn.red,.btn {height: 40px;}
    .simple-btn span,.simple-btn.red span,.btn span {font-size: 12px;}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* COOKIES BLOCK */
/*-------------------------------------------------------------------------------------------------------------------------------*/
@media(max-width: 991px){
    .cookies-popup {left: 15px;}
    .cookies-popup.active {-webkit-transform: translateY(-15px);-ms-transform: translateY(-15px);transform: translateY(-15px);}
}
@media(max-width: 767px){
    .cookies-block {padding: 12px;padding-top: 22px;}
    .cookies-cont .cookies-buttons {margin-top: 8px;}
    .cookies-cont .cookies-buttons .simple-btn span {font-size: 13px;}
}
@media(max-width: 575px){
    .cookies-popup {left: 10px;width: calc(100% - 20px);}
    .cookies-popup.active {-webkit-transform: translateY(-10px);-ms-transform: translateY(-10px);transform: translateY(-10px);}
    .cookies-cont {max-width: 100%;}
    .cookies-block {padding: 10px;padding-top: 22px;}
    .cookies-cont .cookies-buttons {-ms-flex-wrap: wrap;flex-wrap: wrap;}
    .cookies-cont .cookies-buttons .simple-btn {margin-bottom: 5px;}
}
@media(max-width: 480px){
    .cookies-cont .text {font-size: 15px;}
}
@media(max-width: 400px){
    .cookies-popup {left: 5px;width: calc(100% - 10px);}
    .cookies-popup.active {-webkit-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* HEADER */
/*-------------------------------------------------------------------------------------------------------------------------------*/
@media(max-width: 767px){
    .header-menu li .list {display: inline-block;}
    .header-menu li .list .list-link {top: auto;}
    .header-top {padding: 0 15px;height: 45px;}
    .header-bottom {height: 50px;}
    .header-user-paner a {width: 30px;height: 30px;margin-right: 8px;}
    .header-user-paner a svg {width: 17px;}
    .header-logo {padding: 0 25px;}
    .header-logo img {width: 85px;}
    .header-basket {padding: 0 12px;}
    .header-margin {margin-bottom: 95px;}
    header.active-layer-close .layer-close.style-2 {top: 95px;}
    .header-left-menu {width: 350px;padding-top: 40px;-webkit-transform: translateX(-350px);-ms-transform: translateX(-350px);transform: translateX(-350px);}
    .header-left-menu ul,.header-delivery-city,.header-left-menu .header-left-info,.header-lan.on-mobile {padding-left: 15px;}
    .header-left-menu ul li {margin-bottom: 20px;}
    .header-left-menu ul li a,.header-delivery-city p,.header-lan .header-lan-main {font-size: 17px;}
    .header-left-info .header-delivery p {font-size: 15px;}
    .header-left-info .header-time a {font-size: 16px;}
    .header-left-info .header-time p {font-size: 15px;}
    .header-lan.active .header-lan-main::before {margin-top: -5px;}
    header.user .header-user-paner .with-class-user {height: 45px;}
    header.user .header-user-paner .with-class-user ul {padding-top: 12px;right: -7px;width: 204px;top: calc(100% + 1px);}
    header.user .header-user-paner .with-class-user ul li {padding: 0 12px;margin-bottom: 15px;}
    header.user .header-user-paner .with-class-user ul li.exit {padding: 12px;}
    header.user .header-user-paner .with-class-user svg {width: 17px;min-width: 17px;}
    header.user .header-basket .header-basket-label {font-size: 11px;}
    .header-user-paner .header-like span {margin-left: 18px;margin-top: -14px;}
    .cart-empty {padding: 15px;top: 75px;right: 10px;}
    .cart-empty.active {top: 55px;}
    .cart-empty-imgs,.like-empty-imgs {width: 36px;height: 36px;min-width: 36px;margin-right: 18px;}
    .like-empty {padding: 15px;width: 260px;right: 131px;top: 65px;}
    .like-empty.active,header.user .like-empty.active {top: 45px;}
    .header-delivery-city {margin-bottom: 50px;}
    .header-lan.on-mobile {margin: 50px 0;}
    .header-lan ul {margin-top: 15px;}
    .header-lan ul li {margin-bottom: 15px;}
    .header-lan ul li a {font-size: 15px;}
    .header-left-menu-close {top: 10px;font-size: 22px;}
    .header-bottom .header-user-paner,header.user .header-bottom .header-user-paner {right: 110px;}
    header.user .like-empty {right: 203px;top: 65px;}
    .header-plus {height: 45px;}
    .header-plus p {font-size: 14px;padding: 0 25px;}
    .header-menu {padding: 20px 25px;height: calc(100% - 95px);overflow: auto;-webkit-transform: translateY(75px);-ms-transform: translateY(75px);transform: translateY(75px);}
    .header-menu.active {-webkit-transform: translateY(95px);-ms-transform: translateY(95px);transform: translateY(95px);}
    .header-menu ul,.header-menu li,.header-menu li a {display: block;text-align: left;}
    .header-menu li {height: auto;padding-bottom: 20px;}
    .header-menu li a span,.header-menu li .list .list-link,.header-menu li .list ul li a span {font-weight: 500;font-size: 14px;}
    .header-menu li .list ul {display: none;opacity: 1;visibility: visible;position: relative;left: auto;top: auto;background-color: transparent;border: none;padding: 0;padding-left: 20px;margin-top: 20px;-webkit-transition: none;-o-transition: none;transition: none;}
    .header-menu li .list ul li {padding-bottom: 20px;margin: 0;}
    .header-menu li .list ul li:last-child {padding-bottom: 0;}
}
@media(max-width: 575px){
    .header-top {padding: 0 10px;}
    .header-delivery-city {padding-right: 10px;}
    .list ul li {margin-bottom: 8px;}
    .list ul li a {font-size: 15px;}
    .header-user-paner a {margin-right: 5px;}
    .header-logo {padding: 0 20px;}
    .header-logo img {width: 80px;}
    .header-basket {padding: 0 10px;}
    .header-basket span {font-size: 14px;}
    .header-left-menu {width: 100%;padding: 40px 20px 20px 20px;-webkit-transform: translateX(-100%);-ms-transform: translateX(-100%);transform: translateX(-100%);}
    .header-left-menu::before {display: none;}
    .header-left-menu ul li {margin-bottom: 18px;}
    .header-left-menu ul li a {font-size: 16px;}
    header.user .header-user-paner .with-class-user ul {right: -4px;}
    header.user .header-user-paner .with-class-user ul li a svg {width: 18px;min-width: 18px;}
    .cart-empty::before {right: 24px;}
    .cart-empty::after {right: 26px;}
    .cart-empty-imgs,.like-empty-imgs {width: 34px;height: 34px;min-width: 34px;margin-right: 15px;}
    .cart-empty-cont .title,.like-empty-cont .title {font-size: 17px;}
    .cart-empty-cont .text {font-size: 15px;}
    .like-empty {width: 245px;right: 115px;}
    .header-left-menu ul,.header-delivery-city,.header-left-menu .header-left-info,.header-lan.on-mobile {padding: 0;}
    .header-delivery-city {margin-bottom: 30px;}
    .header-lan.on-mobile {margin: 30px 0;}
    .header-left-menu ul li a,.header-delivery-city p,.header-lan .header-lan-main {font-size: 16px;}
    .header-lan ul {padding-left: 15px;}
    .header-lan ul li {margin-bottom: 15px;}
    .header-lan ul li a {font-size: 15px;}
    .header-left-menu-close {right: 20px;}
    .header-left-info .header-time a {margin-bottom: 5px;}
    .header-bottom .header-user-paner, header.user .header-bottom .header-user-paner {right: 100px;}
    header.user .like-empty {right: 190px;}
    .header-plus p {padding: 0 20px;}
    .header-plus .open-plus-menu {margin: 0 15px;}
    .header-menu {padding: 20px;}
}
@media(max-width: 480px){
    .header-left-menu {padding: 40px 15px 15px 15px;}
    .header-top {padding: 0 8px;}
    .header-basket img {margin-right: 8px;}
    .header-burger {width: 20px;height: 12px;}
    .header-logo img {font-size: 75px;}
    .list ul {padding: 8px;left: -8px;}
    header.user .header-user-paner a,header.user .header-user-paner .with-class-user {padding: 0 8px;}
    header.user .header-user-paner .with-class-user svg {margin-right: 15px;}
    header.user .header-user-paner .with-class-user ul {padding-top: 10px;width: 200px;right: -2px;}
    header.user .header-user-paner .with-class-user ul li {padding: 0 10px;}
    header.user .header-user-paner .with-class-user ul li.exit {padding: 10px;}
    header.user .header-user-paner .with-class-user p {font-size: 0;padding: 0;}
    .header-left-info .header-time a {font-size: 15px;}
    .header-left-info .header-delivery p,.header-left-info .header-time p {font-size: 14px;}
    .header-left-menu-close {font-size: 20px;right: 15px;top: 6px;}
    .header-bottom .header-user-paner,header.user .header-bottom .header-user-paner {right: 95px;}
    header.user .like-empty {right: 124px;}
    .like-empty {right: 110px;}
}
@media(max-width: 400px){
    .header-logo {padding: 0 10px;}
    .header-logo img {width: 70px;}
    .header-user-paner a {margin-right: 3px;}
    .header-lan .header-lan-main {padding-right: 15px;}
    header.user .header-user-paner .with-class-user ul li a span {font-size: 14px;}
    header.user .header-user-paner .with-class-user ul li a svg {margin-right: 8px;}
    .cart-empty {right: 5px;}
    .cart-empty-cont .title,.like-empty-cont .title {font-size: 16px;}
    .like-empty {width: 230px;right: 106px;}
    .header-plus p {padding: 0 15px;}
    .header-menu {padding: 20px 15px;}
}