@media screen and (max-width:600px){
    .container {
        width: 100%;
    }
    .sp {
        display: block!important;
    }
    .pc {
        display: none!important;
    }
    .container-warpper {
        box-sizing: border-box;
        width: 100%;
        padding: 0 10px;
    }
    .content {
        padding-top: 50px;
    }
    .header {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 50px;
        background-color: #fff;
        z-index: 10;
    }
    .header .top {
        height: 50px;
        padding: 0;
        box-shadow: 0 0 10px #ccc;
    }
    .header .top .entrance {
        display: none;
    }
    .header .top .logo {
        height: 36px;
        margin-top: 8px;
        margin-left: 8px;
    }
    .header .top .logo img {
        height: 36px;
    }
    .header .top .sp-menu-btn {
        display: block;
        float: right;
        width: 50px;
        height: 50px;
        background: url(../images/menu.png) no-repeat center center;
        background-size: 50px 50px;
    }
    .header .top .sp-menu-btn.active {
        background: url(../images/menu_close.png) no-repeat center center;
        background-size: 50px 50px;
    }
    .header .nav {
        display: none;
        box-sizing: border-box;
        position: fixed;
        left: 0;
        top: 50px;
        padding: 20px 10px;
        width: 100%;
        height: calc(100vh - 40px);
        background-color: #fff;
        overflow: auto;
    }
    .header .nav .list {
        padding: 0;
    }
    .header .nav .list li {
        display: block;
        height: auto;
        padding: 0;
        margin-bottom: 10px;
        border: 1px solid #D00A41;
        border-radius: 4px;
        overflow: hidden;
    }
    .header .nav .list li:last-child {
        border-right: 1px solid #D00A41;
    }
    .header .nav .list li a,
    .header .nav .list li .sub-btn {
        box-sizing: border-box;
        display: block;
        padding: 10px;
        color: #221915;
    }
    .header .nav .list li a .icon.sp-img, 
    .header .nav .list li .sub-btn .icon.sp-img {
        display: inline-block;
    }
    .header .nav .list li a .icon.pc-img, 
    .header .nav .list li .sub-btn .icon.pc-img {
        display: none;
    }
    .header .nav .list li a .right-icon {
        display: block;
        float: right;
        width: 24px;
        height: 24px;
        background: url(/images/arrow_right_black.png) no-repeat center center;
        background-size: 24px 24px;
    }
    .header .nav .list li a .right-icon-red {
        background: url(/images/arrow_right_red.png) no-repeat;
        width: 22px;
        height: 22px;
        background-size: cover;
    }
    .header .nav .list li .sub-btn .right-icon {
        background: url(/images/add.png) no-repeat center center;
        background-size: 24px 24px;
    }
    .header .nav .list li .sub-btn.active .right-icon {
        background: url(/images/reduce.png) no-repeat center center;
        background-size: 24px 24px;
    }
    .header .nav .list li .sub-btn.active:before,
    .header .nav .list li .sub-btn.active:after {
        display: none;
    }
    .header .nav .list li .sub-menu {
        display: none;
        position: static;
        border: none;
        width: calc(100% + 20px);
        padding: 0;
        margin-top: 10px;
        margin-left: -10px;
        background-color: #F7F4EE;
        border-top: 1px solid #D00A41;
    }
    .header .nav .list li .sub-menu .sub-list li,
    .header .nav .list li .sub-menu .sub-list li.big {
        display: block;
        width: 100%;
        min-height: 1px;
        height: auto;
        padding-top: 0;
        margin-right: 0;
        border: none;
        border-bottom: 1px dotted #434A4A;
        border-radius: 0;
        margin-bottom: 0;
    }
    .header .nav .list li .sub-menu .sub-list li:last-child {
        border-bottom: none;
    }
    .header .nav .list li .sub-menu .sub-list li.big .list-title {
        letter-spacing: 2px;
    }
    .header .nav .list li .sub-menu .sub-list li.big .list-title,
    .header .nav .list li .sub-menu .sub-list li.little {
        padding: 0;
    }
    .header .nav .list li .sub-menu .sub-list li a {
        position: relative;
        height: 40px;
        line-height: 40px;
        padding: 0;
        padding-left: 40px;
    }
    .header .nav .list li .sub-menu .sub-list li .list-title {
        float: left;
        width: calc(100% - 44px);
        color: #434A4A;
        height: 40px;
        text-align: left;
        line-height: 40px!important;
        font-size: 12px;
    }
    .header .nav .list li .sub-menu .btn-warpper .btn {
        position: relative;
        width: 100%;
        height: 40px;
        line-height: 40px;
        padding: 0;
        padding-left: 40px;
        border: none;
        border-top: 1px dotted #434A4A;
        color: #434A4A;
        text-align: left;
        font-size: 12px;
    }
    .header .nav .list li .sub-menu .sub-list li a:after,
    .header .nav .list li .sub-menu .btn-warpper .btn:after,
    .header .nav .list li .sub-menu .text a:after {
        position: absolute;
        right: 10px;
        top: 8px;
        width: 24px;
        height: 24px;
        background: url(/images/arrow_right_black.png) no-repeat center center;
        background-size: 24px 24px;
        content: '';
    }
    .header .nav .list li .sub-menu .sub-list li.big .list-title span {
        display: inline;
    }
    .header .nav .list li .sub-menu .sub-list li.big .list-title span.title-span {
        font-size: 12px;
        color: #434A4A;
    }
    .header .nav .list li .sub-menu .btn-warpper .btn.right-btn {
        width: 100%;
        border-top: 1px dotted #434A4A;
        text-align: left;
    }
    .header .nav .list li .sub-menu .btn-warpper .btn .icon {
        display: none;
    }
    .header .nav .list li .sub-menu .text {
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    }
    .header .nav .list li .sub-menu .text a {
        position: relative;
        display: block;
        width: 100%;
        height: 40px;
        padding: 0;
        padding-left: 40px;
        line-height: 40px;
        border: none;
        font-size: 12px;
        color: #434A4A;
        border-bottom: 1px dotted #434A4A;
    }
    .header .nav .list li .sub-menu .btn-warpper {
        margin-top: 0;
    }
    .header .nav .list li .sub-menu .sub-list li:last-child .list-title {
        margin-top: 0!important;
    }
    .header .nav .list li .sub-menu .sub-list li:last-child .list-title span {
        display: inline;
    }
    .header .nav .list li .sub-menu .sub-list li .img {
        display: none;
    }
    .header .nav .list li .sub-menu .menu-title {
        display: none;
    }
    .header .nav .list li a .icon.pc-img {
        display: none;
    }
    .header .nav .list li a .icon.sp-img {
        display: inline-block;
    }
    .header .nav .list li a .text {
        color: #221915;
    }
    .header .nav .entrance {
        position: relative;
        display: block;
        margin-top: 54px;
        box-sizing: border-box;
        line-height: 30px;
        padding-left: 14px;
        font-size: 0;
        color: #505050;
    }
    .header .nav .entrance img {
        display: inline-block;
        vertical-align: top;
        margin-top: 3px;
    }
    .header .nav .entrance img:first-child {
        margin-right: 4px;
        margin-top: 7px;
    }
    .header .nav .entrance .text {
        font-size: 12px;
        font-family: 'Noto Sans CJK JP', 'Noto Sans JP', sans-serif;
   font-weight: 400;
    }
    .header .nav .entrance:before {
        position: absolute;
        top: -18px;
        left: 0;
        width: 100%;
        border-top: 1px dotted #434A4A;
        content: '';
    }
    .header .nav .list li .sub-menu .warpper {
        border: none;
        padding: 0;
        background-color: transparent;
    }
    .w1024-container {
        position: relative;
        width: 100%;
        margin: 0 auto;
    }
    .index .swiper1 .swiper-slide {
        width: 100%!important;
        height: auto;
        opacity: 1;
        overflow-x: hidden;
    }
    .index .swiper1 .pc-img {
        display: none;
    }
    .index .swiper1 .sp-img {
        display: inline-block;
    }
    .title .icon {
        width: 20px;
        margin-top: 5px;
    }
    .title .text {
        font-size: 18px;
    }
    .index .Information {
        padding-top: 20px;
    }
    .index .Information .swiper-warpper {
        padding-top: 18px;
    }
    .index .swiper1 .img-warpper {
        box-sizing: border-box;
        left: 0;
        top: 10px;
        width: 100%;
        padding: 0 16px;
        text-align: left;
    }
    .index .swiper1 .img-warpper .img1 {
        height: 150px;
        margin-bottom: 100px;
    }
    .index .swiper1 .btn,
    .index .swiper2 .btn,
    .index .swiper3 .btn {
        display: none;
    }
    .index .swiper2 .swiper-wrapper,
    .index .swiper3 .swiper-wrapper{
        display: block;
        transform: translate3d(0, 0px, 0px)!important;
    }
    .index .Information .swiper-warpper .banner .swiper-slide {
        float: left;
        height: auto;
        width: calc(50% - 3px)!important;
        margin-right: 6px!important;
        margin-bottom: 6px;
    }
    .index .Information .swiper-warpper .swiper-slide:nth-child(2n+0) {
        margin-right: 0!important;
    }
    .index #swiper2 .banner .swiper-slide .img {
        /* height: 96px; */
        text-align: center;
    }
    .index #swiper2 .banner .swiper-slide .img img {
        max-width: 100%;
        /* max-height: 96px; */
    }
    .index #swiper3 .banner .swiper-slide .img {
        text-align: center;
    }
    .index #swiper3 .banner .swiper-slide .img img {
        max-width: 100%;
        /* max-height: 156px; */
    }
    .banner .swiper2 .banner-img,
    .banner .swiper3 .banner-img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
    .banner .swiper1 .banner-img {
        max-width: 9999999px;
        width: 100%;
        /* height: 400px; */
    }
    .index .swiper2 {
        margin-bottom: 18px;
    }
    .index .Information .show-more {
        display: block;
        height: 30px;
        line-height: 30px;
        background-color: #fff;
        text-align: center;
        border-radius: 3px;
        border: 1px solid #B9B9B9;
    }
    .index .Information .show-more .icon {
        display: inline-block;
        vertical-align: middle;
        width: 24px;
        height: 24px;
        background: url(/images/arrow_down.png) no-repeat center center;
        background-size: 24px 24px;
    }
    .index .Information .show-more.active .icon {
        background: url(/images/arrow_up.png) no-repeat center center;
        background-size: 24px 24px;
    }
    .index .Information .swiper-pagination {
        display: none;
    }
    .index .Information .swiper-warpper .banner .swiper-slide .text {
        font-size: 12px;
        height: 45px;
    }
    .index .Information .swiper-warpper {
        padding: 18px 0;
    }
    .index .Information .swiper-warpper .banner .btn {
        display: none;
    }
    .index .more .btn .text {
        font-size: 14px;
    }
    .index .more .btn .icon {
        width: 12px;
        margin-top: 6px;
    }
    .index .more {
        margin-top: 8px;
    }
    .index .search {
        margin-top: 21px;
        padding: 30px 0 20px;
    }
    .index .search .list li {
        width: calc(50% - 3px);
        margin-right: 6px;
        margin-bottom: 6px;
    }
    .index .search .list li:nth-child(3n+0) {
        margin-right: 6px;
    }
    .index .search .list li:nth-child(2n+0) {
        margin-right: 0;
    }
    .index .search .list li .img img {
        width: 100%;
        height: auto;
    }
    .index .search .list li .text-warpper .text {
        font-size: 14px;
        line-height: 20px;
    }
    .index .search .href-btn .text {
        font-size: 14px;
    }
    .index .search .href-btn {
        margin-top: 18px;
    }
    .index .search .list li .text-warpper {
        height: 40px;
    }
    .index .search .list li .text-warpper .text span {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        font-size: 11px;
    }
    .index .search .list li .text-warpper .icon {
        vertical-align: top;
        margin-top: 4px;
    }
    .index .find {
        margin-top: 40px;
    }
    .index .find .banner .sp-img {
        display: inline-block;
    }
    .index .find .banner .pc-img {
        display: none;
    }
    .index .find .list {
        background: url(/images/btn_bg.png) repeat center center;
    }
    .index .find .list li {
        width: 100%;
        margin-bottom: 20px;
        border-right: none;
        background-color: #fff;
    }
    .index .find .list li:last-child {
        margin-bottom: 0;
    }
    .index .find .list li .text-warpper .text {
        font-size: 14px;
    }
    .index .find .btn-warpper {
        height: 100px;
        line-height: 100px;
        padding: 0 10px;
    }
    .index .find .btn-warpper .btn .text {
        font-size: 14px;
    }
    .index .tab .item {
        width: 100px;
        height: 100px;
        margin-right: 28px;
    }
    .index .tab .item .icon img {
        width: 26px;
    }
    .index .tab .item .text {
        font-size: 14px;
    }
    .index .recruit .banner .btn {
        width: 100%;
        left: 0;
        top: calc(50% - 28px);
        height: 56px;
        padding-top: 8px;
    }
    .index .recruit .banner .btn .recruit-title {
        font-size: 24px;
        line-height: 24px;
    }
    .index .recruit .banner .btn .text-warpper {
        line-height: 24px;
    }
    .index .recruit .banner .btn .text-warpper .text {
        font-size: 14px;
    }
    .index .recruit .banner .btn .text-warpper img {
        margin-top: 4px;
    }
    .index .recruit .warpper {
        padding: 28px 0;
    }
    .index .recruit .warpper .list {
        padding: 0 10px;
    }
    .index .recruit .warpper li {
        width: calc(50% - 3px);
        margin-right: 6px;
    }
    .index .recruit .warpper li .text {
        height: 22px;
        line-height: 11px;
        font-size: 11px;
    }
    .index .recruit .warpper li .explain {
        font-size: 14px;
    }
    .index .recruit .warpper li .explain .label {
        display: none;
    }
    .index .recruit .warpper li .explain.text-right {
        text-align: center;
    }
    .index .recruit .warpper li .img .label {
        display: block;
        position: absolute;
        right: 2px;
        bottom: -8px;
        height: 16px;
        line-height: 16px;
        padding: 0 8px;
        background-color: #E4007F;
        border-radius: 3px;
        font-size: 10px;
        color: #fff;
        font-family: 'Noto Sans CJK JP', 'Noto Sans JP', sans-serif;
   font-weight: 400;
    }
    .index .news {
        padding-top: 30px;
    }
    .index .news .list li  .text-warpper {
        display: block;
    }
    .index .news .list li  .text-warpper .date {
        width: 100%;
        font-size: 12px;
        line-height: 14px;
    }
    .index .news .list li  .text-warpper .text {
        width: 100%;
        font-size: 13px;
        line-height: 18px;
    }
    .footer {
        padding: 10px 8px 0;
    }
    .footer .page-top {
        width: 30px;
        height: 30px;
        background-size: 30px 30px;
        top: -24px;
    }
    .footer .nav {
        float: none;
    }
    .footer .nav li {
        padding: 0 10px;
    }
    .footer .nav li a {
        font-size: 11px;
        margin-top: 0;
    }
    .footer .nav {
        width: 100%;
        text-align: center;
    }
    .footer .logo {
        float: none;
        height: 17px;
        position: absolute;
        left: 8px;
        bottom: 7px;
    }
    .footer .logo img {
        height: 17px;
    }
    .footer .copyright {
        float: none;
        font-size: 8px;
        position: absolute;
        left: 85px;
        bottom: 4px;
    }
    .footer .copyright img {
        height: 8px;
    }
    .banner {
        width: 100%;
        margin: 0 auto;
    }
    .index .sp-img {
        display: inline-block;
    }
    .index .pc-img {
        display: none;
    }
    .index .find .list li .img {
        height: auto;
    }
    .page-link {
        padding: 20px 10px;
        font-size: 10px;
    }
    .select-box {
        width: calc(33.3333% - 4px);
        margin-right: 6px;
    }
    .select-box .select-btn {
        width: 100%;
        height: 40px;
        line-height: 40px;
        font-size: 12px;
    }
    .select-box .select-btn .icon {
        width: 16px;
        height: 16px;
        margin-top: 11px;
        background-size: 16px 16px;
    }
    .select-box .select-btn.active .icon {
        background-size: 16px 16px;
    }
    .select-box .select-option {
        top: 39px;
    }
    .select-box .select-option a {
        height: 30px;
        line-height: 30px;
        font-size: 12px;
    }
    .products-list-page .hot .list li {
        width: calc(50% - 3px);
        margin-right: 1px;
        margin-bottom: 6px;
    }
 /*   .products-list-page .hot .list li:nth-child(3n+0) {
        margin-right: 6px;
    }
    .products-list-page .hot .list li:nth-child(2n+0) {
        margin-right: 0;
    }*/
    .products-list-page .hot .list li .text-warpper {
        font-size: 10px;
        height: 55px;
    }
    .products-list .products-box li {
        width: calc(50% - 5px);
        margin-right: 6px;
        margin-bottom: 6px;
    }
    .products-list-2 .products-box li.border {
        height: auto;
    }
    .products-list-2 .products-box li.border .img img {
        width: auto;
        height: auto;
    }
    .products-list .products-box li:nth-child(4n+0) {
        margin-right: 6px;
    }
    .products-list .products-box li:nth-child(2n+0) {
        margin-right: 0;
    }
    .products-list .products-box .name {
        font-size: 14px;
    }
    .detail .products-warpper {
        padding: 28px 10px 70px;
    }
    .detail .products-detail .left {
        width: 100%;
        margin-right: 0;
    }
    .detail .products-detail .right {
        float: left;
        width: 100%;
    }
    .detail .parameter-list li .flex-box {
        display: block;
    }
    .detail .parameter-list li .flex-box .item {
        border-bottom: none;
        width: 100%;
    }
    .detail .parameter-list li .box .box-title .small {
        display: block;
        width: calc(100% - 30px);
        float: left;
        line-height: 20px;
    }
    .detail .products-list .sub-list li {
        width: calc(50% - 5px);
        min-height: 135px;
        margin-right: 6px;
        margin-bottom: 6px;
    }
    .detail .products-list .sub-list li:nth-child(2n+0) {
        margin-right: 0;
    }
    .products-list-list .tab .item {
        float: left;
        width: 50%!important;
        height: auto;
        margin-bottom: 10px;
        margin-left: -1px;
    }
    .products-list-list .tab .item .item-btn {
        display: block;
        font-size: 14px;
        border-right: 1px dotted #505050;
    }
    .products-list-list .tab .item .item-list {
        position: absolute;
        width: 100%;
        padding: 0;
        top: 48px;
        z-index: 999;
        background-color: #ffffff;
    }
    .products-list-list .tab .item.active .item-btn:before, 
    .products-list-list .tab .item.active .item-btn:after{
        display: none;
    }
    .products-list-list .tab .item .item-list a {
        display: block;
        text-align: center;
        margin-right: 0;
        font-size: 12px;
    }
    .products-list-list .tab .item .item-list a img {
        width: 18px;
    }
    .recipes .index .find .list li {
        margin-bottom: 0;
    }
    .recipes .index .find .list li .text-warpper {
        padding-left: 30px;
    }
    .recipes .index .find .text {
        padding-left: 30px;
        font-size: 13px;
    }
    .recipes .hot {
        margin-top: 40px;
    }
    .recipes .hot .products-list li {
        margin-top: 0;
    }
    .recipes .hot .products-list .products-box .img img {
        width: 92%;
        max-width: 180px;
    }
    .recipes .hot .products-list .products-box .img {
        padding-top: 8px;
        margin-bottom: 0;
    }
    .recipes .hot .products-list .products-box .img {
        height: auto;
        line-height: 1;
    }
    .recipes .hot .products-list .products-box .name span {
        font-size: 11px;
    }
    .recipes .search {
        margin-top: 50px;
    }
    .recipes .search .page-title {
        text-align: center;
        font-size: 18px;
    }
    .recipes .search .item {
        margin-top: 25px;
    }
    .recipes .search .item .search-type1 {
        padding: 22px 40px;
    }
    .recipes .search .item .search-type1 .btn {
        width: 100%!important;
        height: 54px;
        line-height: 54px;
        margin-right: 0;
    }
    .recipes .search .item .search-type1 .btn .icon {
        height: 54px;
        margin-top: 0;
    }
    .recipes .search .item .search-type1 .btn .en-text {
        float: right;
    }
    .recipes .search .item .search-type-2 .input-warpper {
        width: 100%;
        margin-right: 0;
        padding: 16px 10px;
    }
    .recipes .search .item .search-type-2 .input-warpper .input {
        font-size: 14px;
    }
    .recipes .search .item .search-type-2 .recommend {
        width: 100%;
        margin-top: 14px;
    }
    .recipes .search .item .search-type-2 .recommend .recommend-label {
        width: 100%;
        margin-right: 0;
        height: 45px;
        line-height: 45px;
    }
    .recipes .search .item .search-type-2 .recommend .recommend-label .icon {
        margin-top: 14px;
    }
    .recipes-1 .use {
        margin-top: 20px;
    }
    .recipes-1 .use .img-warpper {
        float: left;
        width: 100%;
        text-align: center;
    }
    .recipes-1 .use .text-warpper {
        width: 100%;
        margin-bottom: 20px;
    }
    .recipes-1 .use .text-warpper .title {
        font-size: 18px;
        line-height: 24px;
    }
    .recipes-1 .use .text-warpper .text {
        line-height: 24px;
        font-size: 16px;
    }
    .recipes-1 .anchor .btn {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .recipes-1 .products-list li {
        margin-top: 0;
    }
    .recipes-1 .products-list .products-box .img {
        height: auto;
        line-height: 1;
    }
    .recipes-2 .anchor {
        margin-top: 20px;
    }
    .recipes-3 .products-list {
        margin-top: 20px;
    }
    .page {
        margin-top: 40px;
    }
    .recipes_detail .detail-box {
        padding: 15px;
    }
    .recipes-detail .products-name {
        margin-top: 20px;
        margin-bottom: 10px;
        line-height: 24px;
        font-size: 18px;
    }
    .recipes-detail .products .img {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .recipes-detail .products .seasoning {
        width: 100%;
    }
    .recipes-detail .products .option {
        margin-top: 10px;
    }
    .recipes-detail .practice .material {
        width: 100%;
        margin-right: 0;
    }
    .recipes-detail .practice .method {
        width: 100%;
        margin-top: 30px;
    }
    .recipes-detail .introduce {
        margin-top: 30px;
    }
    .recipes-detail .introduce .box {
        display: block;
        text-align: center;
    }
    .recipes-detail .introduce .box .btn {
        display: inline-block;
    }
    .recipes-detail .introduce .box .text {
        box-sizing: border-box;
        width: 100%;
        margin-left: 0;
        padding: 10px;
        text-align: left;
    }
    .recipes-detail .products-list {
        margin-top: 20px;
    }
    .m_anchor {
        padding-top: 52px;
    }
    .products-list-list .products-list-warpper {
        margin-top: 25px;
    }
    .search-index .search-btn {
        width: 80%;
    }
    .search-index .search-list .search-item .btn-warpper .btn {
        width: 80%;
        margin-right: 0;
        margin-bottom: 15px;
        margin-left: 10%;
    }
    .search-index .search-list .search-item .btn-warpper {
        padding-left: 0;
    }
    .search-index .search-list .search-item .sub-list li {
        width: calc(50% - 5px);
        margin-right: 6px;
        margin-bottom: 6px; 
        height: 100%;
    }
    .search-index .search-list .search-item .sub-list li:nth-child(2n+0) {
        margin-right: 0;
    }
    .search-index .search-list .search-item .label-warpper {
        padding-left: 0;
        text-align: center;
    }
    a:hover {
        text-decoration: none;
    }
    .campaign-activity .list li .img {
        width: 100%;
        margin-bottom: 10px;
    }
    .campaign-activity .list li .text-warpper {
        width: 100%;
    }
    .campaign-index .index .recruit .warpper .tab {
        padding: 0 10px;
        margin-top: 20px;
        text-align: left;
    }
    .campaign-index .index .recruit .warpper .tab li {
        vertical-align: top;
        width: calc(33.3333% - 3px);
        margin-right: 2px;
    }
    .campaign-index .index .recruit .warpper .tab li a {
        width: 100%;
        height: auto;
        padding-top: 15px;
    }
    .campaign-index .index .recruit .warpper .tab li a .icon img {
        max-width: 60%;
    }
    .campaign-index .index .recruit .warpper .tab li a .text {
        font-size: 12px;
    }
    .index .recruit .warpper li .text {
        margin-bottom: 0;
    }
    .news-index .list li .text-warpper .date {
        margin-right: 15px;
    }
    /* EC 231005追加 */
    .news-index .btn-box{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-left: -10px;
        margin-top: -10px;
        padding: 0 10px;
    }
    .news-index .btn-box .btn{
        margin-right: 0;
        margin-left: 10px;
        margin-top: 10px;
    }
    .campaign-cm .list li {
        width: 100%;
        margin-right: 0;
    }
    .campaign-cm .list .video-img {
        height: auto;
    }
    .campaign-cm .video-warpper .video {
        width: 100%;
    }
    .page-title {
        width: auto;
    }
    .products-list-page .products-list-warpper .title {
        width: auto;
    }
    .products-list-list .tab .item:last-child {
        border-right: none;
    }
    .news-detail .detail-content .img-warpper {
        padding: 20px 0;
    }
    .news-detail .btn {
        width: 90%;
        margin-left: 5%;
    }
    .news-detail .adobe {
        width: 90%;
        margin-left: 5%;
    }
    .company-index .banner {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .company-index .index-content {
        padding: 15px;
    }
    .company-index .index-content .warpper {
        padding: 20px 10px;
    }
    .company-index .container-warpper .warpper .text_s {
        padding: 0;
    }
    .company-index .container-warpper .warpper .text_xs {
        padding: 0;
    }
    .company-index .index-content .warpper .list li .text .label {
        clear: both;
        float: none;
        display: block;
    }
    .company-index .index-content .warpper .list li .text span.text {
        clear: both;
        float: none;
        display: block;
        width: 100%;
        margin-bottom: 18px;
    }
    .company-overview .box {
        padding: 0;
    }
    .company-overview .box .tab .btn {
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0;
    }
    .company-overview .box .list li {
        display: block;
    }
    .company-overview .box .list li .label {
        width: 100%;
    }
    .company-overview .box .list li .text {
        padding: 10px;
    }
    .company-company .index-content .warpper {
        padding: 30px 0 40px;
    }
    .company-overview .box .list li .text .map-btn {
        position: static;
        text-align: right;
    }
    .company-company .index-content .warpper .list li {
        width: 100%;
        margin-right: 0;
    }
    .otoiawase-otoiawase .list li {
        width: 100%;
        margin-right: 0;
        padding: 10px;
        margin-bottom: 10px;
    }
    .otoiawase-otoiawase .href-btn {
        width: 98%;
        margin-left: 1%;
    }
    .otoiawase-qa .tab .btn {
        width: 100%;
        margin-right: 0;
    }
    .otoiawase-qa .box .container-warpper {
        padding: 0 10px;
    }
    .shopping-index .box .container-warpper {
        padding: 0 10px;
    }
    .shopping-index .box .list li {
        width: 100%;
        margin-right: 0;
    }
    .shopping-index .box1 .href-btn,
    .shopping-index .box2 .adobe {
        width: 100%;
    }
    .shopping-index .box1 .box-text {
        text-align: justify;
    }
    .shopping-index .box2 .warpper {
        width: 100%;
        padding: 10px;
    }
    .company-recruit .box {
        padding: 0 10px;
    }
    .company-recruit .box .tab .btn {
        width: 100%;
        margin-right: 0;
    }
    .company-recruit #recruit-1 .text {
        width: 100%;
        margin-right: 0;
        font-size: 14px;
    }
    .company-recruit #recruit-1 .href {
        width: 100%;
        text-align: center;
    }
    .company-recruit #recruit-1 .img {
        width: 260px;
        margin-left: calc(50% - 130px);
    }
    .company-recruit #recruit-2 .list li {
        display: block;
    }
    .company-recruit #recruit-2 .list li .label {
        width: 100%;
    }
    .company-recruit #recruit-2 .list li .text {
        padding: 10px;
    }
    .company-security .href-box .item {
        padding: 10px;
    }
    .company-security .href-box .item .list .img-warpper {
        display: flex;
        overflow-x: auto;
    }
    .company-security .href-box .item .list-3 .flex-list li {
        display: block;
    }
    .company-security .href-box .item .list-3 .flex-list li .label {
        width: 100%;
    }
    .company-security .href-box .item .list-3 .flex-list li .label-text {
        padding: 10px;
    }
    .company-security .href-box .item .item-desc2 span {
        width: 100%;
    }
    .company-security .href-box .item .item-desc2 img {
        float: none;
        display: block;
        margin: 0 auto;
    }
    .company-history .box {
        padding: 10px;
    }
    .company-history .box .warpper {
        padding: 20px;
    }
    .company-history .list li {
        position: relative;
        display: block;
    }
    .company-history .list li:before {
        position: absolute;
        left: -10px;
        top: 0;
        width: 3px;
        height: 100%;
        background: url(../images/line.png);
        content: '';
    }
    .company-history .list li:last-child:before {
        background: url(../images/dotted_line.png);
    }
    .company-history .list li:first-child:before {
        top: 4px;
        height: calc(100% - 4px);
    }
    .company-history .list li .time:before {
        display: none;
    }
    .company-history .list li .time:after {
        left: -17px;
    }
    .company-history .list li .time {
        box-sizing: border-box;
        padding-left: 10px;
    }
    .company-history .list li .text-warpper {
        padding-left: 10px;
    }
    .company-overview .box .list li .text .ntf_n {
        width: 100%;
    }
    .company-overview .box .list li .text .ntf_t {
        width: 50%;
    }
    .company-overview .box .list li .text .ntf_f {
        width: 50%;
    }
    .swiper_category .swiper-wrapper {
        display: block;
    }
    
    .swiper_category .swiper-slide {
        box-sizing: border-box;
        float: left;
        height: auto;
        max-width:280px;
        width: calc(50% - 3px)!important;
        margin-right: 6px!important;
        margin-bottom: 6px;
        border: 1px solid #CCC;
        text-align:center;
    }
    
    .swiper_category .swiper-slide div.img{
            display:inline-block;
            text-align:center;
    }
    
    .swiper_category .swiper-slide:nth-child(2n+0) {
        margin-right: 0!important;
        padding;auto;
    }
    .recipes-detail .products .seasoning .seasoning-box,
    .recipes-detail .products .seasoning .seasoning-box2{
        position: relative;
        min-height: 66px;
    }
    .recipes-detail .products .seasoning .seasoning-box2{
      width: 100%;
      margin-right: 0;
      margin-bottom: 2%;
      padding: 15px 0 0;
    }
    .recipes-detail .products .seasoning .seasoning-box > img,
    .recipes-detail .products .seasoning .seasoning-box2 > img {
      /*  position: absolute; */
        left: 0;
        top: 7px;
        width: 62px;
        height: 62px;
    }
    .recipes-detail .products .seasoning .seasoning-box2 > img {
        top: 10px;
    }
    .site-map .list .box {
        width: 100%;
        margin-right: 0;
        margin-bottom: 40px;
    }
    .site-map .list li .box:nth-child(2n+0) {
        margin-bottom: 0;
    }
    .recipes-detail .products .seasoning .seasoning-box .btn,
    .recipes-detail .products .seasoning .seasoning-box2 .btn {
        padding-left: 16px;
        text-align: center;
    }
    .recipes-detail .products .seasoning .seasoning-box2 .btn {
        padding-top: 16px;
    }
    .trivia .bg {
        width: 100%;
    }
    .trivia .list {
        padding: 0 10px 50px
    }
    .trivia .list .img {
        float: none;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    .trivia .list .title {
        margin-bottom: 10px;
    }
    .trivia .list .text-warpper {
        float: none;
        width: 100%;
        padding: 0!important;
    }
    .trivia .list .text-warpper .text {
        box-sizing: border-box;
        padding: 0 20px;
        font-size: 14px;
        line-height: 21px;
    }
    .trivia .list .text-warpper.block .text {
        padding-left: 20px;
        margin-bottom: 30px;
    }
    .detail .parameter-list li .box .text-warpper .item {
        width: 100%;
    }
}
@media screen and (max-width:360px){
    .company-recruit #recruit-1 .text {
        font-size: 12px;
    }
    .index .tab .item {
        width: 80px;
        height: 80px;
        padding-top: 14px;
    }
    .index .tab .item .text {
        font-size: 12px;
    }
    .index .recruit .warpper li .explain .text {
        font-size: 14px;
    }
    .select-box .select-btn,
    .select-box .select-option a {
        font-size: 10px;
    }
    .products-list .products-box .name {
        font-size: 12px;
        line-height: 18px;
    }
    .recipes .search .item .search-type-2 .input-warpper .input {
        font-size: 12px;
    }
    .index .search .list li .img img {
        max-height: 96px;
    }
    .header .nav .list li .sub-menu .sub-list li a {
        padding-left: 12px;
    }
    .header .nav .list li .sub-menu .btn-warpper .btn {
        padding-left: 12px;
        font-size: 11px;
    }
    .header .nav .list li .sub-menu .text a {
        padding-left: 12px;
    }
    .index .more .btn .text {
        font-size: 12px;
    }
    .footer .nav li a {
        font-size: 10px;
    }
    .search-index .search-list .search-item .label-warpper .label {
        width: 88px;
    }
    .news-detail .btn {
        font-size: 14px;
    }
    .products-list .products-box .name {
        height: 60px;
    }
    .hot .products-list .products-box li {
        height: 170px;
    }
    .search .products-list .products-box li {
        height: 190px;
    }
    .company-overview .box .list li .text .ntf_t {
        font-size: 15px;
    }
    .company-overview .box .list li .text .ntf_f {
        font-size: 15px;
    }
}

/* 追加：スマホ用メニュー（エレファント） */
.sp-navi{
  position: relative;
  margin: 10px 0;
  background: #f3f3f3;
  border-top: 2px solid #eee;
  border-bottom: 2px solid #eee;
  padding: 4vw 0 0 4vw;
}
.sp-navi .sp-navi-menu{
  position: relative;
  overflow: hidden;
}
.sp-navi .sp-navi-menu li{
  float: left;
  width: 33.3%;
  padding-bottom: 4vw;
}
.sp-navi .sp-navi-menu li a{
  display: block;
  text-align: center;
  background: linear-gradient(#FF2A61, #D00A41);
  color: #fff;
  padding: 2vw 0 2.5vw;
  margin-right: 4vw;
  border-radius: 5px;
  font-size: 96%;
  font-weight: 600;
}
.sp-navi .sp-navi-menu li a::before{
  content: "";
  display: block;
  width: 11vw;
  height: 11vw;
  margin: 0 auto;
}
.sp-navi .sp-navi-menu li:nth-child(1) a::before{
  background: url("../images/sp_nav_icon_01w.png") no-repeat center center;
  background-size: cover;
}
.sp-navi .sp-navi-menu li:nth-child(2) a::before{
  background: url("../images/sp_nav_icon_02w.png") no-repeat center center;
  background-size: cover;
}
.sp-navi .sp-navi-menu li:nth-child(3) a::before{
  background: url("../images/sp_nav_icon_03w.png") no-repeat center center;
  background-size: cover;
}
.sp-navi .sp-navi-menu li:nth-child(4) a::before{
  background: url("../images/sp_nav_icon_04w.png") no-repeat center center;
  background-size: cover;
}
.sp-navi .sp-navi-menu li:nth-child(5) a::before{
  background: url("../images/sp_nav_icon_05w.png") no-repeat center center;
  background-size: cover;
}
.sp-navi .sp-navi-menu li:nth-child(6) a::before{
  background: url("../images/sp_nav_icon_06w.png") no-repeat center center;
  background-size: cover;
}

/*ここから追加*/
@media screen and (max-width:600px){
    .banner .swiper2 .banner-img2,
    .banner .swiper3 .banner-img2 {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
    .banner .swiper1 .banner-img2 {
        max-width: 9999999px;
        width: 100%;
        /* height: 400px; */
    }
    
}