@charset "utf-8";
/*
 * smp.css
 *
 *  version --- 1.0
 *  updated --- 2024/10/24
 */

/***  751px ~ ***/
@media screen and (min-width: 751px) {
    .is-sp {
        display: none;
    }
}

@media only screen and (max-width : 750px){
	.is-pc {
		display: none;
	}
}


/* ipad */
@media (max-width: 959px) and (min-width: 751px) {
    
}

/* sp */
@media only screen and (max-width : 750px){
	#wrapper {
		overflow: hidden;
		padding-top: 4.6rem;
	}
	
	.header-inner {
		align-items: center;
		gap: 0 1.5rem;
		height: 4.6rem;
	}
	.header-inner.inner {
		padding: 0 1.5rem;
	}
	
	#header .left {
		display: flex;
		align-items: center;
		gap: 0 1.5rem;
	}
	
	.header-logo a {
		margin-top: 2rem;
	    width: 6.6rem;
	    height: 6.6rem;
	}
	.header-logo img {
	    width: 4.6rem;
	}
	
	.btn-menu {
		display: block;
		height: 2.2rem;
		width: 2.2rem;
		background: url(../img/common/icon_menu.svg)no-repeat center;
		background-size: 100%;
	}
	
	#g-navi {
		display: none;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 2;
		padding: 2rem 3.2rem 6rem;
		width: 100%;
		background: #fff;
	}
	#g-navi .btn-menu {
		margin: 0 0 2rem auto;
		height: 3.2rem;
		width: 3.2rem;
		background-image: url(../img/common/icon_close.svg);
	}
	#g-navi ul {
		display: block;
		height: auto;
	}
	#g-navi li {
	    display: block;
	    padding: 0;
	}
	#g-navi li + li {
		border-left: 0;
	}
	#g-navi li a {
		display: block;
		padding: 1.5rem 0;
	}
	
	.header-sns img {
	    width: 2.4rem;
	} 
	
	/* !footer */
	#footer {
	    margin-top: 5rem;
	}
	.footer-inner {
	    padding: 1.5rem 3.2rem;
		margin: 0 -2.8rem;
	}
	#footer-logo {
	    background-position: 1rem 2rem;
	    background-size: 14.5rem;
		padding-top: 20rem;
	}
	#footer-logo h2 img {
	    max-width: 20rem;
	}
	.foot-links {
		display: none;
	}
	#copyright {
	    padding: 1rem 0 4.5rem;
	    font-size: 1.4rem;
	}
	
	/* !common */
	.inner {
		padding: 0 2.8rem;
	}
	
	.head-large .jap {
		font-size: 2rem;
	}
	.head-large .eng img {
	    width: 26.6rem;
	}
	
	.goods-list {
	    grid-template-columns: repeat(2, 1fr);
	    gap: 0.9rem 1.2rem;
	}
	.top-online .goods-list li .img img {
	    height: 17rem;
	}
	
	.goods-list li .hd01 {
		font-size: 1.5rem;
	}
	.goods-list li .info {
	    padding: 0.6rem;
	}
	.goods-list li .btn img {
		max-width: 9.4rem;
	}
	.goods-list li .tit {
		font-size: 1.9rem;
	}
	
	.btn-link {
	    margin-top: 1.4rem;
	}
	.btn-link .btn {
		min-width: 25.5rem;
		border-radius: 0.6rem;
	}

	.btn-link {
		width: 80%;
	}

	
	/* !page */
	/*
	#main-visual {
		margin: 0 -2.8rem;
	}
	*/
	#main-visual .ban img {
		object-fit: cover;
		width: 100%;
		height: 48rem;
	}
	/*
	#main-visual .movie {
	    padding-top: 131.4%;
	}
	*/
	
	/*
	.ban {
		width: 100%;
	}
	
	.ban video {
		width: 100%;
	}
	*/
	
	.ban {
	    display: flex;
	    justify-content: center;
	    align-items: center;
		height: 80vh;
		overflow: hidden;
	}
	
	.ban video {
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
		  object-position: center;
	}
	
	
	.top-mission {
	    padding: 5rem 0 0;
	    background-image: url(../img/top/bg_foods_sp01.png);
		background-position: 50% -5.2rem;
	    background-size: 30rem;
	}
	
	.top-topics {
	    padding: 6rem 0 0;
	    background-image: url(../img/top/bg_foods_sp02.png);
		background-position: 50% 1.5rem;
	    background-size: 30rem;
	}
	.top-topics .goods-list li .img img {
	    height: 12rem;
	}
	
	.top-online {
	    padding: 6rem 0 0;
	    background-image: url(../img/top/bg_foods_sp03.png);
		background-position: 50% 7.5rem;
	    background-size: 30rem;
	}
	.top-online .head-large .eng img {
	    width: 24.2rem;
	}
	
	.top-online-tax .title {
		margin: 0 -2.8rem 0.5rem;
	}
	.top-online-tax .title .logo {
		width: 21.2rem;
	}
	.top-online-tax ul {
	    grid-template-columns: repeat(2, 1fr);
	    gap: 1.2rem;
	}
	
	.top-commitment {
	    padding: 5rem 0 0;
	    background-image: url(../img/top/bg_foods_sp04.png);
		background-position: 50% 3.2rem;
	    background-size: 30rem;
	}
	.top-commitment .head-large .eng img {
	    width: 26.2rem;
	}
	
	.top-group .head-large .eng img {
	    width: 29.6rem !important;
	}
	
	.top-commitment ul {
	    grid-template-columns: repeat(1, 1fr);
	    gap: 0;
	}
	
	.top-group {
	    padding: 5rem 0 2rem;
	    background-image: url(../img/top/bg_foods_sp05.png);
		background-position: 50% 3rem;
	    background-size: 30rem;
	}
	.top-group ul {
	    gap: 0 0.6rem;
	}
	.top-group li {
		width: calc(100% / 2 - 0.4rem);
	}
	.top-group li .btn {
	    bottom: 0.6rem;
		padding: 0 1.5rem 0 0;
	    min-width: 10rem;
		height: 2rem;
		background-position: right 0.4rem center;
		background-size: 1.5rem;
		font-size: 1rem;
	}
	.top-group li .small {
		white-space: nowrap;
		word-wrap: break-word;
		word-break:break-all;
	    font-size: 0.75em;
	}
	
	.top-notice {
	    padding: 5.2rem 0;
	    background-image: url(../img/top/bg_foods_sp06.png);
		background-position: 50% 4.5rem;
	    background-size: 30rem;
	}
	.notice-list li {
	    margin-bottom: 1.3rem;
	}
	.notice-list .date {
		margin-bottom: 0.3rem;
	    font-size: 1.2rem;
	}
	.notice-list .dd {
		line-height: 1;
	    font-size: 1.7rem;
	}
	
	.topInstagram {
	    padding: 1.2rem 0 0;
		margin: 0 -2.8rem;
	    background: none;
	}
	.topInstagram .box {
	    margin-top: 4.8rem;
	    padding: 0.5rem 0 2rem;
	    background-size: url(../img/top/bg_natural_sp.png);
	}
	.topInstagram .head .logo {
	    top: -4.8rem;
		padding-top: 1rem;
	    width: 11rem;
	    height: 11rem;
	}
	.topInstagram .head .logo img {
	    width: 9rem;
	}
	.topInstagram ul {
	    gap: 0;
	}
	
	.topMovie {
		margin-bottom: 5rem;
	}
	
	.topMovie .movie-area {
		width: 96%;
		margin: 2rem auto 0;
	}

	.topMovie .movie-area video {width: 100% !important;}
	.online-img {padding: 0 2.8rem;}
	
	
	/* !page-mv
	---------------------------------------------------------- */
	#page-mv .inner {padding: 6rem 2rem;}
	#page-mv h2 {font-size: 2rem;}

	
	/* !pan
	---------------------------------------------------------- */
	#pan {
		width: 94%;
		max-width: 94%;
		font-size: 1.2rem;
	}
	
	#pan a {font-size: 1.2rem;}
	
	
	/* !contents
	---------------------------------------------------------- */
	.page-contents {
		padding: 5rem 0;
	}

	.ttl-img {
		width: 68%;
		margin: 0 auto;
		text-align: center;
	}

	/* !about
	---------------------------------------------------------- */

	p.philosophy-txt {
		text-align: center;
		font-size: 1.4rem;
	}
	
	.commitment {padding: 1rem;}
	.message-area {padding: 5rem 0;}
	
	.message-area .message-inner {
		flex-wrap: wrap;
		padding-top: 5rem;
	}	

	.message-area .message-inner .message-info {
		width: 100%;
		max-width: 100%;
		margin-bottom: 3rem;
	}

	.message-area .message-inner .message-info h3 {
		font-size: 2rem;
		line-height: 1.8;
		margin-bottom: 1rem;
	}

	.message-area .message-inner .message-info p {font-size: 1.3rem;}
	.message-area .message-inner .message-info p + p {margin-top: 2rem;}
	.message-area .message-inner .message-img {
		width: 100%;
		max-width: 100%;
	}

	ul.business-list {
		padding-top: 5rem; 
		margin-bottom: 5rem;
	}
	ul.business-list li + li {margin-top: 3rem;}

	ul.business-list li .business-inner {
		flex-wrap: wrap;
	}

	ul.business-list li .business-inner .business-info {
		width: 100%;
		max-width: 100%;
		padding: 2rem 0;
	}

	ul.business-list li .business-inner .business-info h3 span{
		font-size: 1.8rem;
	}

	ul.business-list li .business-inner .business-info p {
		font-size: 1.3rem;
	}

	ul.business-list li .business-inner .business-img {
		width: 100%;
		max-width: 100%;
	}	
	

	.business-history {margin-bottom: 5rem;}
	.business-history .history-area {
		padding: 3rem 0 0;
	}
	
	
	.business-history .history-inner {
		display: flex;
		justify-content: space-between;
	}
	
	.business-history .history-area ol li dl {
		width: 90%;
		max-width: 90%;
		display: flex;
		padding-top: 0.5rem;
	}
	
	.business-history .history-area ol li dl dt {
		width: 18%;
		max-width: 18%;
		font-size: 1.4rem;
	}

	.business-history .history-area ol li dl dd {
		width: 82%;
		max-width: 82%;
		font-size: 1.4rem;
	}
	
	/* !group
	---------------------------------------------------------- */
	.group-inner {
		padding-top: 5rem;
		flex-wrap: wrap;
		margin-bottom: 5rem;
	}	
	
	.group-inner .group-img {
		width: 100%;
		max-width: 100%;
		margin-bottom: 2rem;
	}

	.group-inner .group-info {
		width: 100%;
		max-width: 100%;
	}
	
	ul.link-nav {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 5rem;
	}

	ul.link-nav li {width: 100%;}
	ul.link-nav li + li {margin-top: 3rem;}
	
	ul.link-nav li p,
	ul.link-nav li:last-child p{font-size: 1.6rem;}
	
	
	/* !notice
	---------------------------------------------------------- */

	.notice-area {padding: 5rem 3rem;}
	.notice-area ul.notice-list {}
	.notice-area ul.notice-list p {
		font-size: 1.4rem;
		font-weight: bold;
	}

	.notice-area p.data {
		font-size: 1.4rem;
		margin-bottom: 1rem;
	}
	
	.notice-area h2 {
		font-size: 2rem;
		font-weight: bold;
		border-bottom: 1px solid #000;
		padding-bottom: 1rem;
		margin-bottom: 3rem;
	}

	.notice-area .single-area {margin-bottom: 5rem;}
	.notice-area .single-area p {
		font-size: 1.3rem;
	}

	.notice-area .single-area p + p {margin-top: 2rem;}
	
	/* !recruit
	---------------------------------------------------------- */

	.recruit-top {
		flex-wrap: wrap;
		margin-bottom: 4rem;
	}
	
	.recruit-area {padding: 5rem 3rem;}

	.recruit-top .recruit-ttl {
		width: 100%;
		max-width: 100%;
		margin-bottom: 3rem;
	}

	.recruit-top .recruit-ttl h3 {
		font-size: 1.8rem;
	}

	.recruit-top .recruit-ttl p {
		font-size: 1.4rem;
	}

	.recruit-top .recruit-img {
		width: 100%;
		max-width: 100%;
	}

	.recruitment-area {margin-bottom: 8rem;}
	.recruitment-area h3 {
		font-size: 1.6rem;
	}

	.recruitment-area dl {
		display: flex;
		border-bottom: 1px solid #333333;
		padding: 2rem 0;
	}

	.recruitment-area dl dt {
		width: 40%;
		max-width: 40%;
		font-size: 1.2rem;
		font-weight: bold;
	}

	.recruitment-area dl dd {
		width: 60%;
		max-width: 60%;
		font-size: 1.2rem;
		font-weight: 500;
	}
	
	/* !404
	---------------------------------------------------------- */
	.error-area {
		text-align: left;
	}
	
	.error-area h3 {
		font-size: 1.6rem;
		text-align: center;
	}
	.error-area .btn {
		width: 100%;
		display: block;
		text-align: center;
	}
	
	
	/* !contact
	---------------------------------------------------------- */	
	.contact-area {
		padding: 5rem 2rem;
	}
	
	.contact-area p.txt {
		font-size: 1.3rem;
		line-height: 2;
	}
	
	.select-wrap {
	    position: relative;
	    width: 80%;
	}
	
	.wpcf7-submit {
		width: 100%;
		height: 66px;
		line-height: 66px;
	}

	.wpcf7-previous {
		width: 100%;
		margin-right: 0;
		margin-bottom: 2rem;
	}
	
	.contact-form table th,
	.contact-form table td{
		width: 100% !important;
		max-width: 100% !important;
		display: block;
		padding: 2rem 0 !important;
	}
	
	.contact-form table th {font-weight: bold;}
	.contact-form table td {font-size: 1.4rem;}

	.contact-form table td {
	    padding-left: 0;
	}


	.wpcf7-select {
	    width: 100% !important;
	    height: 60px !important;
	    padding: 1.5rem 2rem;
	}
	
	/* !privacy
---------------------------------------------------------- */
	.privacy-area {
		padding: 5rem 3rem;
	}
	
	/* !sitemap
	---------------------------------------------------------- */
	ul.sitemap-nav {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 2.5rem 6rem;
	}
	
	.ttl-img,
	.group-ttl {
		width: 70% !important;
		max-width: 70% !important;
	}
	
	h3.group-ttl-top {
		width: 80%;
		font-size: 2rem;
	}
	p.group-ttl-txt b {font-size: 1.8rem;}
	p.group-ttl-txt {
		width: 90%;
		font-size: 1.6rem;
	}
	
	p.modaal_txt {
		font-size: 1.4rem;
		line-height: 2;
	}
	
	
	
	

	
	
	
}