﻿@charset "utf-8";

@media (min-width: 576px) {
   
}

@media (min-width: 768px) {
    .main .side {
        margin-bottom: 0;
    }
.home_link .slick .list_item {
    width: 32%;
   }
   
    .header .navbar-nav.nav-1 > li ul.navbar-nav {
        background: #f4ecd3;
    }
    .footer .footer-info .d-flex .infobox ul {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 16px;
    }

    .footer .footer-info .nav li.mail a {
        word-wrap: break-word;
    }
    .frame-small-box {
        width: 750px;
    }

body.about .txt .timeline .list_item {
    transform: translate(-100px);
}
body.about .txt .timeline .list_item:nth-child(even) {
 transform: translate(100px);
}
body.about .aboutbox:nth-child(even):after {
    right: 30%;
    left: -100%;
}
body.about .aboutbox:nth-child(even) .row {
    flex-direction: row-reverse;
}
body.about .txt .timeline .list_item img {
    width: 40%;
    margin-bottom: 20px;
}
    body.product .ptKind {
        align-items: center;
    }
}
@media (max-width: 1380px) {
body.about .txt .timeline .list_item .time {
    right: -110px;
}
body.about .txt .timeline .list_item:nth-child(even) .time {
    left: -110px;
}

}
@media (min-width: 1400px) {
body.home .home_story .top .btn-more {
    margin-top: 90px;
}
body.home .home_story .top .info {
    padding-left: 20px;
}
}
@media (min-width: 1300px) {
    body.home .home_strength > .container {
        max-width: 90%;
    }

}



@media (min-width: 1200px) {
    
   
    
    body.home .home_strength .d-flex >*{
        width:49%;
    }
	body.about .docDownload ul li a span {
		margin-right: 6px;
        color: #9a6c14;
		display: inline-block;
	}
}
@media (min-width: 992px) {


    

        .is_scroll .header .navbar .navbar-brand {
            /* margin-top: 5px; */
            /* margin-bottom: 5px; */
            width: 300px;
        }

    .is_scroll .header .navbar-nav .nav-link {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    body.home .home_story .d-flex.top > * {
        width: 49%;
    }
    body.home .home_story .bottom .pic {
        width: 32%;
    }

    body.home .home_story .bottom .info {
        width: 65%;
    }
   .footer .footer-info .d-flex .logobox {
        width: 25%;
    }

    .footer .footer-info .d-flex .infobox {
        width: 70%;
    }

    
}

@media (min-width: 1500px) {
    /*body.home .home_strength > .container {
        max-width: 75%;
    }*/
}

@media (max-width: 1600px) {
    body.home .home_story .rellax {
        width: 400px;
        bottom: 125px;
    }
    body.home .home_strength .wid .list_item .icon {
        width: 60px;
        height: 48px;
        margin-bottom: 5px;
        background-size: 115%;
        background-position: top -160px center;
    }
    body.home .home_strength .desc {
        font-size: 20px;
        line-height: 1.5;
        width: 90%;
        margin: 0 auto;
    }
    body.home .home_strength .wid .list_item {
        width: 19%;
    }
    
    body.home .home_strength .wid .list_item:nth-child(2) .icon {
        background-position: top -4px center;
        background-size: 115%;
    }
    body.home .home_strength .wid .list_item:nth-child(3) .icon {
        background-position: top -300px center;
    }
    body.home .home_strength .wid .list_item:nth-child(4) .icon {
        background-position: top -85px center;
    }
    body.home .home_strength .wid .list_item:nth-child(5) .icon {
        background-position: top -373px center;
    }
    
}
@media (max-width: 1500px) {
    body.home .home_story .rellax {
        bottom: 258px;
        width: 300px;
        opacity: 0.3;
    }
    body.home .home_story .bottom {
        padding-right: 0;
    }
	.header .navbar-nav .nav-link {
		padding: 20px 8px;
	}
	.header .navbar .navbar-brand {
        width: 380px;
    }
}
@media (max-width: 1400px) {
    
    .header .navbar .navbar-brand {
        width: 328px;
    }
    body.home .home_strength ul li {
        font-size: 18px;
    }
	body.about .btbox.mission .list-item {
        width: 250px;
        height: 250px;
    }
	
}

@media (max-width: 1280px) and (min-width:768px) {
    .navbar-expand-md .navbar-collapse {
        justify-content: center !important;
    }
	 .header .navbar .small-btn-box {
        position: absolute;
        right: 0;
        top: 22px;
        z-index: 12;
    }
}
@media (max-width: 1280px) {
   
    .nav-brand-wrapper {
        flex: 0 0 100%;
        text-align: center;
    }
    .header .navbar {
        flex-wrap: wrap;
        justify-content: center;
    }
    .nav-search-li .nav-search-box .search-area {
        right: 0;
        left: auto;
    }
}

@media (max-width: 1199px) {
    body.home .home_strength ul {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px 20px;
    }
    body.home .home_story .bottom .info h4 span {
        display: block;
    }
    body.home .home_strength .rellax {
        text-align: center;
    }
    body.home .home_strength .rellax img.img-fluid {
        width: 60%;
        margin: 0 auto;
    }
    
    body.home .home_strength ul:before {
        bottom: -180px;
    }
    body.home .home_visual {
        padding-top: 54px;
    }
	body.about .txt .international .world_area:after {
		width: 320px;
		height: 306px;
		right: 20%;
	}
	body.about .txt .timeline .list_item {
		width: 40%;
	}
	body.about .txt .timeline .list_item .time {
        right: -135px;
    }
	body.about .txt .timeline .list_item:nth-child(even) .time {
        left: -135px;
    }
	body.about .btbox.mission .list-item {
	
		width: 200px;
		height: 200px;
   
	}
	body.about .docDownload .descbox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		text-align: left;
	}
	body.about .docDownload .descbox h4, body.about .docDownload .descbox p {
		text-align: left;
	}
	body.about .docDownload .descbox > * {
        width: 48%;
        text-align: left;
    }
	body.about .docDownload .list-inline li {
		display: block;
		padding: 0;
		margin-bottom: 10px;
		width: 100%;
	}
	body.about .docDownload ul li a span {
		display: block;
		/* padding: 5px; */
		margin-bottom: 6px;
		/* background: #333; */
		color: #9a6c14;
		font-weight: bold;
		font-size: 20px;
	}
	body.about.kind_60 .editor ul.labelTag li a {
		display: flex;
		height: 100%;
		justify-content: center;
		align-items: center;
	}
}
@media (max-width:1099px) {
    body.home .home_strength .wid .list_item {
        width: 30%;
        margin: 0 10px 20px 10px;
    }
    body.home .home_strength .list {
        justify-content: center !important;
    }
    body.home .home_strength .info {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: rgb(0 0 0 / 40%);
        border-radius: 50%;
        color: #fff;
        padding-top: 0;
    }
	body.home .home_story .top p {
		margin-bottom: 24px;
		font-size: 18px;
	}
}
@media (max-width: 991px) {
    
    .side .h3 {
        margin-top: 20px;
    }

    .side .filter-title .collapsed-btn, .side .filter-sidebar.multiple-collapse .collapsed-btn {
        font-size: 1rem;
    }
    body.home .sec01 {
        padding-top: 60px;
        position: relative;
    }
    body.home .home_story .top .pic:before {
        top: -60px;
    }
    body.home .home_story .d-flex.top .pic.pos-relative {
        width: 60%;
        margin: 0 auto;
    }
    body.home .home_story .top .info {
        margin-top: 30px;
    }
    body.home .home_story .d-flex.top {
        margin-bottom: 50px;
    }
    body.home .home_story .bottom .d-flex {
        align-items: center;
        justify-content: center;
    }
    body.home .home_story .bottom .pic {
        width: 60%;
        margin-bottom: 20px;
    }
    body.home .home_story .bottom .info h4 span {
        display: inline-block;
    }
    
    body.home .home_visual .visualbg:before,body.home .home_visual .visualbg:after {

        height: 0;
        padding-bottom: 8%;
        background-size: 100% auto;
    }
    body.home .home_visual > img {
        display: none;
    }

    body.home .home_visual:before {
        content: "";
        height: 144px;
        width: 100%;
        display: block;
        background: url(../images/all/slogan2m.png) top center no-repeat;
        background-size: contain;
    }
    body.home .linearbg {
        background-position: right center;
        background-size: auto;
    }

    body.home .home_visual #curve {
        font-size: 26px;
    }
    .footer .footer-info .social-box {
        display: inline-block;
    }
    .footer .footer_logo {
        width: 145px;
        /* max-width: 120px; */
        margin-bottom: 0;
    }
    .footer .footer-info .logobox {
        margin-bottom: 20px;
    }
    .wid-float-section ul li, .wid-float-section ul li a {
        width: 100%;
        border-radius: 0;
        padding: 0;
    }
    .wid-float-section ul li a {
        height: auto;
        display: block;
        margin: 0 auto;
        line-height:unset;
        color:#fff;
        font-size:15px;
        padding:5px;
    }
        .wid-float-section ul li.service {
        position: fixed;
        width: auto;
        right: 10px;
        bottom: 80px;
    }
    .wid-float-section ul li.service a {
        width: 90px;
        height: 90px;
        border: 1px solid #eddbb2;
        border-radius: 20px;
        background: rgb(231 208 153 / 70%);
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 6px;
    }
    .wid-float-section ul li.service a .txt {
        background: none;
        display:block;
    }
    body.contact .section .container > .row:before {
        right: -323px;
    }
	body.about .txt .international .world_area:after {
        width: 242px;
        height: 230px;
        right: 10%;
    }
	body.about .txt .aboutbox .rellax.spoon {
		width: 300px;
	}
	 body.about .txt .timeline .list_item .time {
        right: -112px;
    }
	 body.about .txt .timeline .list_item:nth-child(even) .time {
        left:  -112px;
    }
	body.about .btbox.mission .list-item {
        width: 50%;
        height: auto;
        padding: 16px;
        border-radius: 0;
        background: none;
        backdrop-filter: none;
        border-top: 0;
        border-left: 0;
    }
	body.about .btbox.mission .list-item:nth-child(even) {
    border-right: none;
	}
	
	body.about .btbox.mission .list-item:nth-child(3),
	body.about .btbox.mission .list-item:nth-child(4) {
		border-bottom: 0;
	}
	body.about .docDownload ul li a:before {
		width: 100px;
		height: 100px;
	}
	body.about .docDownload ul li a span {
		display: block;
		margin-bottom: 8px;
		font-size: 18px;
		background: #efdac3;
		border-radius: 8px;
		padding: 5px;
	}
	
}

@media (max-width: 767px) {
    .nav-brand-wrapper {
        flex: 0 0 auto;
    }
    body.home .banner:before, body.home .banner:after {
        content: none;
    }
    .header .navbar {
        justify-content: start; 
    }

   

   
    .header .navbar {
        position: fixed;
    }

    .article-grid .item .info .date {
        font-size: 12px;
    }

    .article-grid.ar-img .item .info {
        padding: 10px 0;
    }

    .article-grid .item .info .kind a {
        font-size: 12px;
        padding: 1px 7px;
    }

    .article-grid.ar-img .item .info .desc, 
    .article-grid.ar-img .item .info .title,
    .article-grid.ar-img .item .info .desc a,
    .article-grid.ar-img .item .info .title a {
        font-size: 14px;
    }

    .product .gallery-list .item .title {
      
    }

    .product .gallery-list .item .info {
        padding: 0;
        margin-top: 0 !important;
    }

    .header .btn-group.lang .dropdown-item {
        padding: 6px 19px;
        font-size: 12px;
    }

    .footer .fot_sitemp ul li a:before {
        left: 4px;
        top: 15px;
        width: 4px;
    }

    .footer .footer_content.fc_seperate_bottom .footer-bottom {
        margin-top: 30px;
    }

    footer .footer_content.fc_seperate_bottom {
        padding: 17px 0 0;
    }

    .footer ul li a {
        padding: 0 4px;
    }

    .footer h4, .footer a.ti_p {
        margin-bottom: 0;
    }

    .footer a.ti_p {
        padding: 0 6px 0 0;
        display: inline-block;
        font-size: 12px;
    }

    .flex-column {
        flex-direction: unset !important;
    }

    .footer .fot_sitemp .d-flex {
        flex-wrap: wrap;
        justify-content: unset;
    }

    .footer .tep1:last-child {
        width: 100%;
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .footer .tep1 {
        width: 100%;
        margin-bottom: 20px;
        border-bottom: 1px solid #707070;
        padding-bottom: 20px;
    }

    .header .navbar-nav.navbar-mobile > .nav-item > .nav-link:before {
        left: 2px;
        top: 16px;
        display: none;
    }

    .article-grid.info-absolute .item a {
        font-size: 14px;
    }

    .article-grid.info-absolute .item {
        padding: 10px 10px 10px;
    }


    .footer .copyrights {
        text-align: center;
    }

    .banner {
        padding-top: 44px;
    }

  
    
    .header .navbar .navbar-brand {
        width: 80px !important;
        height: auto !important;
        /* height: auto !important; */
        margin: 10px 0;
    }
    .header .navbar.newtop.logo-show:not(.logo-ani-show) .navbar-brand .logo, 
    .header .navbar.newtop.logo-show:not(.logo-ani-show-bg) .navbar-brand .logo {
        display: block;
        display: none;
    }
    .header .navbar,
    .header .bsnav-mobile .navbar {
        background: rgb(255 255 255);
    }
    .bsnav-mobile.full.in .navbar {
        background: var(--main-color);
    }

    .bsnav-mobile.full.in .navbar-brand {
        display: none;
    }
    .header .navbar-nav .nav-item:hover > .nav-link {
  
        color: var(--main-color);
    }
    .header .navbar-nav.nav-1 > li:hover > .nav-link {
        background-position: top 3px center;
    }
    .bsnav-mobile .navbar-nav .nav-item .nav-link {
        padding: 12px 0;
       
    }
    .bsnav-mobile.full .navbar-nav .nav-item .navbar-nav {
        background: rgb(255 255 255 / 40%);
        margin: 0;
    }
    .bsnav-mobile .nav-share-btn-area li a {
        color: #fff !important;
    }
    .bsnavclose.close-btn {
        display: none;
    }
    body.home .home_strength ul {
        grid-template-columns: repeat(2, 1fr);
    }
    .footer .footer-info ul.nav.tat_x {
        display: block;
    }

    .footer .footer-info .nav li {
        margin-bottom: 20px;
    }


        .footer .footer-info .nav li:before {
            width: 36px;
            height: 36px;
        }

        .footer .footer-info .nav li.comname:before, .footer .footer-info .nav li.taxid:before {
            background-position: top -283px center;
        }

        .footer .footer-info .nav li.tel:before {
            background-position: top -3px center;
        }

        .footer .footer-info .nav li.fax:before {
            background-position: top -416px center;
        }

        .footer .footer-info .nav li.add:before {
            background-position: top -214px center;
        }

        .footer .footer-info .nav li.mail:before {
            background-position: top -349px center;
        }

    .footer .footer-info .nav li {
        padding-left: 42px;
    }
    body.home .home_strength .wid:before {
        width: 100%;
        height: 0;
        padding-bottom: 27%;
    }
    body.home .home_strength .wid .list_item {
        width: 31%;
        margin: 0 6px 20px 6px;
    }
    body.home .home_strength p.title {

        font-size: 24px;
    }
    body.home .home_strength .desc {
        font-size: 16px;
    }
    body.contact .section .container > .row:before {
        content: none;
    }
    body.contact  .content {
        position:relative;
    }
    body.contact .content:before {
        position: absolute;
        content: "";
        /* content: ""; */
        /* left: 0; */
        width: 100%;
        right: 0;
        left: 0;
        top: 0;
        height: 26%;
        background: #fbf6ea;
        z-index: -1;
    }
    body.contact .section .info_area {
        border-radius: 20px 20px 0 0;
    }
    body.contact .section .container > .row > div:nth-child(1) {
        border-radius: 0 0 20px 20px;
    }
    body.contact .main > .container .pt-5 {
        padding-top: 80px !important;
    }
    .frame-small-box .btn-area {
        flex-direction: column-reverse;
    }
	body.about .txt .international .world_area:after {
        position: static;
        display: block;
        margin: 0 auto;
		
        width: 345px;
        height: 325px;
    }
	body.about .txt .international .world_area {
		background: #f1ede6;
		padding: 60px 0 0;
		position: relative;
	}
	body.about .txt .aboutbox .rellax {
		transform: none !important;
	}
	body.about .txt .aboutbox .rellax.spoon {
		left: -44px;
		bottom: -22px;
		
   		 width: 290px;
	}
	body.about .aboutbox:after {
        right: -22px;
        bottom: auto;
        left: -28px;
        background: #f2dfb5;
        height: 25%;
    }
	body.about .aboutbox {
		padding: 60px 0 0;
		margin: 60px 0 0;
		position: relative;
	}
	body.about .txt .international .world_map {
		background-position:top center;
	}
	body.about .txt .timeline .list_item, body.about .txt .timeline .list_item:nth-child(even) {
        width: auto;
		margin: 30px 0;
        margin-left: 120px;
        float: none;
        min-height: auto;
    }
	body.about .txt .timeline .list_item .time, body.about .txt .timeline .list_item:nth-child(even) .time {
        right: auto;
        left: -136px;
    }
	body.about .txt .timeline:before,body.about .txt .timeline:after {
		transform: none;
	}
	body.about .txt .timeline:before{
		left: 0;
	}
	body.about .txt .timeline:after {
        left: -22px;
    }
	body.about .txt .timeline .list_item:nth-child(even)::before, 
	body.about .txt .timeline .list_item:before {
		right: auto;
		left: -55px;
	}
	body.about .certificate > div a {
		margin-bottom: 15px;
	}
	body.about .docDownload .d-block li {
		width: 100%;
		margin-bottom: 24px;
	}
	body.about .docDownload ul li a:before,body.about .docDownload ul li a:hover:before {
        width: 60px;
        height: 60px;
        position: absolute;
        left: 18px;
        top: 50%;
        transform: translateY(-50%);
        margin: 0;
    }
	body.about .docDownload ul li a {
        position: relative;
        padding: 25px 14px 25px 90px;
        background: #f7f7f7;
        border-radius: 20px;
    }
	body.about .docDownload ul li a span {
        display: inline-block;
        margin-bottom: 0;
        background: none;
        border-radius: 0;
        padding: 0;
        margin-right: 8px;
    }
	.tab-area.tab-accordion .tab-accordion-body {
        background: none;
    }
    body.product .ptKind .pic {
        margin-bottom: 18px;
    }
    body.product.kind_70.p01 .main .item {
        width: calc(100% / 2);
    }
    body.product.kind_70.p01 .main .section.pt-3 {
        padding-right: 0;
    }
    body.product.kind_70.p01 .main {
        /* background: url(../images/all/bg2m.jpg) no-repeat right bottom #ead6bd; */
        /* background-size: 100%; */
        padding-top: 15%;
        background-size: 50%, auto;
        background-position: right -73px top -12px;
    }
    body.product:not(.show) .main {
        background: url(../images/all/beans.png) no-repeat right bottom -43px;
        background-size: 188px;
    }
	body.product .ingredient {
		width: 100% !important;
	}
	body.about.kind_60 .editor ul.labelTag li {
        width: 32%;
        margin: 0;
    }
}

@media (max-width: 600px) {
    body.home .home_strength .wid .list_item {
        width: 47%;
    }
   body.about .docDownload .descbox {
        display: block;
       
    }
	 body.about .docDownload .descbox > * {
        width: 100%;
    }
	body.about .docDownload .descbox h4, body.about .docDownload .descbox p {
        text-align: center;
    }
}
@media (max-width: 575px) {
    
    .btn.more {
      font-size: 0.75rem;
    }

    .banner .slick-dots {
        bottom: 7px;
    }
    body.home .home_story .d-flex.top .pic.pos-relative {
        width: 80%;
    }
    body.home .home_strength ul li {
        padding-left: 67px;
    }
    body.home .home_strength ul li:before {
        width: 60px;
        height: 60px;
        top: calc(50% - 60px / 2);
        background-size: 55px;
    }

    body.home .home_strength ul li.i1:before {
        background-position: top 8px center;
    }
    body.home .home_strength ul li.i2:before {
        background-position: top -174px center;
    }
    body.home .home_strength ul li.i3:before {
        background-position: top -57px center;
    }
    body.home .home_strength ul li.i4:before {
        background-position: top -229px center;
    }
    body.home .home_strength ul li.i5:before {
        background-position: top -120px center;
    }
    body.home .home_strength ul li.i6:before {
        background-position: top -286px center;
    }
    body.home .home_visual #curve span {
        position: static !important;
        transform: none !important;
    }
    body.home .home_visual #curve > div {
        height: auto !important;
    }
    body.about .txt .timeline:before {
        left: 10px;
        width: 35px;
    }
	 body.about .txt .timeline:after {
        left: -2px;
        border-left: solid 29px transparent;
        border-right: solid 29px transparent;
        border-top: solid 30px #d7d7d7;
        bottom: -70px;
    }
	 body.about .txt .timeline .list_item .time, body.about .txt .timeline .list_item:nth-child(even) .time {
        width: 75px;
        height: 75px;
        right: auto;
        left: -90px;
        font-size: 20px;
    }
	 body.about .txt .timeline .list_item, body.about .txt .timeline .list_item:nth-child(even) {
        width: auto;
        margin: 30px 0;
        margin-left: 80px;
        float: none;
        min-height: auto;
    }

	body.about .btbox.mission .list-item {
        width: 100%;
        border: none;
        background: rgb(255 255 255 / 30%);
        backdrop-filter: blur(10px);
    }
	body.about .btbox.mission .list-item + .list-item {
		margin-top: 20px;
	}
	body.product .ingredient .list .grid-tr + .grid-tr {
  		 border-top: 1px solid #fff;
	}
}

@media (max-width:480px) {

   /* body.home .home_strength .rellax img.img-fluid {
        width: 100%;
    }
    body.home .home_strength ul li:before {
        position: static;
        margin-bottom: 5px;
        margin: 0 auto 6px;
    }
    body.home .home_strength ul li span {
        display: block;
    }
    body.home .home_strength ul li {
        padding-left: 0;
        min-height: 0;
        display: block;
        text-align: center;
    }
    body.home .home_visual #curve {
        font-size: 22px;
        width: 80%;
        margin: 0 auto;
    }*/
    body.home .home_strength .wid .list_item {
        width: 70%;
        margin: 0 0 30px 0;
    }
    body.home .home_strength .desc {
        font-size: 20px;
    }
	body.about .txt .aboutbox .rellax.spoon {
        left: -32px;
        bottom: -46px;
        width: 210px;
    }
	.footer .footer-info .nav li.mail a {
		word-wrap: break-word;
	}
    body.product .ingredient .list .grid-tr > *, body.product .ingredient tr td {
        padding: 5px;
        letter-spacing: 0;
        font-size: 16px;
    }
	body.product .ingredient .list .grid-tr.t2:nth-child(5) .grid-th,
	 body.product .ingredient .list .grid-tr.t2:nth-child(6) .grid-th, 
	 body.product .ingredient .list .grid-tr.t2:nth-child(8) .grid-th {
    	padding-left: 14px;
	}
	body.about.kind_60 .is-title4-32.is-title-lite {
        font-size: 24px !important;
        text-align: center;
        padding: 10px;
        letter-spacing: 1px !important;
    }
	body.about.kind_60 .editor ul.labelTag li {
        width: 33%;
    }
	body.about.kind_60 .editor ul.labelTag li a {
		padding: 8px;
		font-size: 15px;
	}
	body.about.kind_60 .editor > .container.contentbuilder-box {
		padding: 0;
	}
}

@media (max-width:400px) {
    body.home .home_strength .wid .list_item {
        width: 90%;
    }
	 body.about.kind_60 .editor ul.labelTag li {
        width: 100%;
    }
	body.about.kind_60 .editor ul.labelTag li + li {
		margin-top: 5px;
	}
}