@charset "utf-8";

/*
Theme Name: アドダス
Author: アドダス
Author URI: https://addas.jp
Description: Bootstrap5@Webpack
*/

/*　H-01style  ================================================================================= */

body {
	font-family: YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic","Noto Sans JP",  "メイリオ", sans-serif;
	padding-top: 0!important;
	letter-spacing: 2.0px;
}

:root {
    --primary-color: #676820;
    --secondary-color: #327a4e;
    --accent-color: #c9a870;
    --light-bg: #f1f6f1;
}

.bg-usugreen {
	background-color: #f1f6f1;
}

/* イントロセクション */
.intro-section {
	margin: 15px;
    padding: 5rem 0;
    background-image: url(img/bg-about.jpg);
	background-size: cover;
	background-position: center center;
}

.intro-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.intro-content h2 {
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 2rem;
}

.intro-content p {
    font-size: 1.1rem;
    line-height: 2;
    color: #655454;
    margin-bottom: 1.5rem;
}

.text-kin {
	color: #aea347;
}

a {
	color: #000;
}
a:hover {
    color: #000;
}

article.post {
    color: #000;
} 

.page-link:hover {
    border-color: #c2b8b9;
    background-color: #d9d9d9;
}

.lh-03 {line-height: 0.3;}
.lh-04 {line-height: 0.4;}
.lh-05 {line-height: 0.5;}
.lh-06 {line-height: 0.6;}
.lh-07 {line-height: 0.7;}
.lh-08 {line-height: 0.8;}
.lh-09 {line-height: 0.9;}
.lh-10 {line-height: 1;}
.lh-11 {line-height: 1.1;}
.lh-12 {line-height: 1.2;}
.lh-13 {line-height: 1.3;}
.lh-14 {line-height: 1.4;}
.lh-15 {line-height: 1.5;}
.lh-16 {line-height: 1.6;}
.lh-17 {line-height: 1.7;}
.lh-18 {line-height: 1.8;}
.lh-19 {line-height: 1.9;}
.lh-20 {line-height: 2.0;}
.lh-21 {line-height: 2.1;}
.lh-22 {line-height: 2.2;}
.lh-23 {line-height: 2.3;}
.lh-24 {line-height: 2.4;}
.lh-25 {line-height: 2.5;}
.lh-26 {line-height: 2.6;}
.lh-27 {line-height: 2.7;}
.lh-28 {line-height: 2.8;}
.lh-29 {line-height: 2.9;}
.lh-30 {line-height: 3.0;}

.ls-1 {letter-spacing: 1px;}
.ls-2 {letter-spacing: 2px;}
.ls-3 {letter-spacing: 3px;}
.ls-4 {letter-spacing: 4px;}
.ls-5 {letter-spacing: 5px;}
.ls-6 {letter-spacing: 6px;}
.ls-7 {letter-spacing: 7px;}
.ls-8 {letter-spacing: 8px;}
.ls-9 {letter-spacing: 9px;}
.ls-10 {letter-spacing: 10px;}

/* =============  角丸 ============ */
.rounded05 {border-radius:5px}
.rounded10 {border-radius:10px}
.rounded15 {border-radius:15px}
.rounded20 {border-radius:20px}
.rounded25 {border-radius:25px}
.rounded30 {border-radius:30px}
.rounded35 {border-radius:35px}
.rounded40 {border-radius:40px}
.rounded45 {border-radius:45px}
.rounded50 {border-radius:50px}

/* =============  上だけ角丸 ============ */
.rounded05-up {border-radius:5px 5px 0 0}
.rounded10-up {border-radius:10px 10px 0 0}
.rounded15-up {border-radius:15px 15px 0 0}
.rounded20-up {border-radius:20px 20px 0 0}
.rounded25-up {border-radius:25px 25px 0 0}
.rounded30-up {border-radius:30px 30px 0 0}
.rounded35-up {border-radius:35px 35px 0 0}
.rounded40-up {border-radius:40px 40px 0 0}
.rounded45-up {border-radius:45px 45px 0 0}
.rounded50-up {border-radius:50px 50px 0 0}

/* =============  下だけ角丸 ============ */
.rounded05-down {border-radius: 0 0 5px 5px}
.rounded10-down {border-radius: 0 0 10px 10px}
.rounded15-down {border-radius: 0 0 15px 15px}
.rounded20-down {border-radius: 0 0 20px 20px}
.rounded25-down {border-radius: 0 0 25px 25px}
.rounded30-down {border-radius: 0 0 30px 30px}
.rounded35-down {border-radius: 0 0 35px 35px}
.rounded40-down {border-radius: 0 0 40px 40px}
.rounded45-down {border-radius: 0 0 45px 45px}
.rounded50-down {border-radius: 0 0 50px 50px}

/* =============  左だけ角丸 ============ */
.rounded05-left {border-radius:5px 0 0 5px}
.rounded10-left {border-radius:10px 0 0 10px}
.rounded15-left {border-radius:15px 0 0 15px}
.rounded20-left {border-radius:20px 0 0 20px}
.rounded25-left {border-radius:25px 0 0 25px}
.rounded30-left {border-radius:30px 0 0 30px}
.rounded35-left {border-radius:35px 0 0 35px}
.rounded40-left {border-radius:40px 0 0 40px}
.rounded45-left {border-radius:45px 0 0 45px}
.rounded50-left {border-radius:50px 0 0 50px}

/* =============  右だけ角丸 ============ */
.rounded05-right {border-radius:0 0 5px 5px}
.rounded10-right {border-radius:0 0 10px 10px}
.rounded15-right {border-radius:0 0 15px 15px}
.rounded20-right {border-radius:0 0 20px 20px}
.rounded25-right {border-radius:0 0 25px 25px}
.rounded30-right {border-radius:0 0 30px 30px}
.rounded35-right {border-radius:0 0 35px 35px}
.rounded40-right {border-radius:0 0 40px 40px}
.rounded45-right {border-radius:0 0 45px 45px}
.rounded50-right {border-radius:0 0 50px 50px}

/* ====================================================

       　               色（ポジ)　

==================================================== */

/* ============= 背景色 ============= */
.bg-base {
	background-color: #fff;
}

/* ============= 文字の色 ============ */
/*　ヘッダーの文字の色　*/
#area-header #menu-global .menu-item .nav-link {
    color: #000;
}

/*　文章の色　*/
p {
	color: #000;	
}

/* ============ 見出しの色 ============ */
h1,h2,h3,h4,h5 {
	color: #000;
}

/* ============ ボタンの色 ============ */
/*　ボタンの中の文字の色　*/
.link-btn1 span {
    color: #fff!important;
}

/*　ボタンの中の文字の色(ホバー時の色)　*/
.link-btn1:hover span{
  	color: #000!important;
}

/*　ボタンの中の背景の色　*/
.link-btn1 {
	background-color: #000!important;
}

/*　ボタンの中の背景の色(ホバー時の色)　*/
.link-btn1:before {
	background-color: #fff!important;
  	border: 2px solid #000!important;
}


/* ====================================================

       　               色（ネガ)　
       
==================================================== */

/* ========== 背景色(ネガ) =========== */
.bg-nbase {
	background-color: #000;
}

/* ============= 文字の色 ============ */
/*　ヘッダーの文字の色(ネガ)　*/
#area-header.nega #menu-global .menu-item .nav-link {
    color: #fff;
}
/*　文章の文字の色(ネガ)　*/
.nega p {
	color: #fff;	
}

/* ========= 見出しの色(ネガ) ========== */
/*　見出しの色(白色の文字)　*/
.nega h1,.nega h2,.nega h3,.nega h4,.nega h5 {
	color: #fff;
}

/* ========== ボタンの色(ネガ) ========== */
.link-btn1n span {
    color: #000!important;
}

/*　ボタンの中の文字の色(ホバー時の色)(ネガ)　*/
.link-btn1n:hover span{
  	color: #fff!important;
}

/*　ボタンの中の背景の色(ネガ)　*/
.link-btn1n {
	background-color: #fff!important;
}
.link-btn1n:before {
	background-color: #000!important;
  	border: 2px solid #fff!important;
}


/*　ヘッダーお問い合わせボタンの背景の色　*/
.h-01 #area-header #menu-global .btn-contact {
	background-color: #000!important;
}

/*　ヘッダーお問い合わせボタンの文字の色　*/
.h-01 #area-header #menu-global .btn-contact.menu-item a.nav-link {
	color: #fff!important;
}

a.tel-link {
	color: #000!important;
}

a.tel-link a {
	color: #000!important;
}

.nega a.tel-link {
	color: #fff!important;
}

.nega a.tel-link a {
	color: #fff!important;
}


/*  ページナビ  */
.pagination .page-link.active, .active>.page-link {
    background-color: #000;
    border-color: #000;
}
.pagination .page-link {
    border: 1px solid #000;
    color: #000;
}
.pagination .page-link.current {
	color: #fff;
}

/*　文字調整　*/
h2.h2 {
	font-weight: bold;
	font-size: clamp(1.5rem, 1.35rem + 0.75vw, 2.25rem);
	letter-spacing: clamp(0.15rem, 0.08rem + 0.35vw, 0.5rem);
	line-height: clamp(2.188rem, 2rem + 0.94vw, 3.125rem);
}

.midashieigo {
	font-family: 'Oswald', sans-serif;
	font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
}


h4 {
	font-size: calc(1.275rem + 0.3vw);
	line-height: 2rem;
}

.indent-1 {
	padding-left:1em;
	text-indent:-1em;
}

h1,h2,h3,h4,h5,p {
	word-break: break-all;
}


/* 幅 */
/*60px-150px*/
.py-haba01 {
	padding-top: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
	padding-bottom: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
}
.pt-haba01 {
	padding-top: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
}
.pb-haba01 {
	padding-bottom: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
}

/*30px-75px*/
.py-haba02 {
	padding-top: clamp(1.875rem, 1.313rem + 2.81vw, 4.688rem);
	padding-bottom: clamp(1.875rem, 1.313rem + 2.81vw, 4.688rem);
}
.pt-haba02 {
	padding-top: clamp(1.875rem, 1.313rem + 2.81vw, 4.688rem);
}
.pb-haba02 {
	padding-bottom: clamp(1.875rem, 1.313rem + 2.81vw, 4.688rem);
}

/*90px-180px*/
.py-haba03 {
	padding-top: clamp(5.625rem, 4.5rem + 5.63vw, 11.25rem);
	padding-bottom: clamp(5.625rem, 4.5rem + 5.63vw, 11.25rem);
}
.pt-haba03 {
	padding-top: clamp(5.625rem, 4.5rem + 5.63vw, 11.25rem);
}
.pb-haba03 {
	padding-bottom: clamp(5.625rem, 4.5rem + 5.63vw, 11.25rem);
}


.mt-haba01 {
	margin-top: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
}

.mt-30-90 {
	margin-top: clamp(1.875rem, 1.125rem + 3.75vw, 5.625rem);
}

.py-haba02 {
    padding-top: clamp(1.87rem, 1.3395rem + 2.68vw, 4.8675rem);
    padding-bottom: clamp(1.87rem, 1.3395rem + 2.68vw, 4.8675rem);
}

.py-haba03 {
	padding-top: clamp(6.25rem, 4.375rem + 9.38vw, 15.625rem);
	padding-bottom: clamp(6.25rem, 4.375rem + 9.38vw, 15.625rem);
}
.pt-haba03 {
	padding-top: clamp(6.25rem, 4.375rem + 9.38vw, 15.625rem);
}
.pb-haba03 {
	padding-bottom: clamp(6.25rem, 4.375rem + 9.38vw, 15.625rem);
}

/* ヘッダーロゴ設定 */
.h-01 #area-header .header-logo {
	width: 200px;
}
@media (min-width: 992px) {
	.h-01 #area-header .header-logo {
		width: 150px;
	}
}
@media (min-width: 1200px) {
	.h-01 #area-header .header-logo {
		width: 200px;
	}
}
.h-01 #area-header .navbar-brand {
    margin-right: 20px;
    width: auto;
}

/* ヘッダーナビ　ホバー処理 */
.h-01 #area-header #menu-global .menu-item:hover {
    background-color: #fff;
}
.h-01 #area-header #menu-global .btn-contact.menu-item:hover a.nav-link {
    color: #000;
}
.h-01 #area-header #menu-global .btn-contact.menu-item:hover {
    background-color: #fff;
}

/* ヘッダーナビ設定 */
.h-01 #area-header #menu-global .menu-item .nav-link a {
	color: #000;
}
.h-01 #area-header #menu-global .menu-item {
    background-color: transparent;
}

.h-01 #area-header #menu-global {
	margin-top: 60px;
}
@media (min-width: 768px) {
	.h-01 #area-header #menu-global {
		margin-top: 70px;
	}
}
@media (max-width: 768px) {
	.h-01 #area-header #menu-global {
		overflow-y: auto;
  		-webkit-overflow-scrolling: touch; 
	}
}

.h-01 #area-header.navbar {
	padding: 16px;
}
@media (min-width: 992px) {
	.h-01 #area-header.navbar {
		padding: 24px;
	}
}

.h-01 #area-header #menu-global .menu-item {
	margin-top: 10px;
}

.h-01 #area-header #menu-global .menu-item:last-child:hover {
	background-color: transparent;
}

@media (min-width: 992px) {
	.h-01 #area-header #menu-global .menu-item {
		margin-top: 0px;
	}
}

/*　ハンバーガーメニューボタン　*/
@media (max-width: 576px) {
	.h-01 #area-header .hamburger {
		position: absolute;
	    right: 0;
	    z-index: 100;
	}
}
@media (max-width: 992px) {
	.h-01 #area-header .hamburger {
	    right: 10px;
	}
}
@media (max-width: 992px) {
	.h-01 #area-header .globalMenuSp {
	  	position: fixed;
		z-index: -1;
		top: 0;
		left: 0;
		background: #ddd9d2;
		text-align: center;
		width: 100%;
		transform: translateX(100%);
		height: 100vh;
	}

	.h-01 #area-header .globalMenuSp ul {
	  margin: 0 auto;
	  padding: 0;
	  width: 100%;
	}

	.h-01 #area-header .globalMenuSp ul li {
	  list-style-type: none;
	  padding: 0;
	  width: 100%;
	}
	.h-01 #area-header .globalMenuSp ul li:first-child {
		padding-top: 0px;
	}
	.h-01 #area-header .globalMenuSp ul li:last-child {
	  padding-bottom: 0;
	}
	.h-01 #area-header .globalMenuSp ul li:hover{
	  background :#ddd;
	}

	.h-01 #area-header .globalMenuSp ul li a {
	  display: block;
	  color: #fff;
	  padding: 1.5em 0;
	  text-decoration :none;
	}

	.h-01 #area-header .globalMenuSp.active {
	  opacity: 100;
	  display: block;
	   transform: translateY(0%);
	}

	.h-01 #area-header .globalMenuSp .btn-english a {
		display: inline-block;
		margin-top: 25px;
		padding: 15px 30px;
		background-color: #fff;
	}
}

.h-01 #area-header #menu-global li:hover .dropdown-menu {
	display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.h-01 #area-header .openbtn{
	position: relative;
	cursor: pointer;
    width: 50px;
    height:50px;
	border-radius: 30px;
	background-color: #676820;
}

.h-01 #area-header .openbtn .openbtn-area{
    transition: all .4s;
}

.h-01 #area-header .openbtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 2px;
    border-radius: 1px;
	background: #fff;
  	width: 45%;
}

.h-01 #area-header .openbtn span:nth-of-type(1) {
	top:16px;	
}

.h-01 #area-header .openbtn span:nth-of-type(2) {
	top:23.5px;
}

.h-01 #area-header .openbtn span:nth-of-type(3) {
	top:33px;
}

.h-01 #area-header .openbtn.active .openbtn-area{
	transform: rotateY(-360deg);
}

.h-01 #area-header .openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-135deg);
    width: 30%;
}

.h-01 #area-header .openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.h-01 #area-header .openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(135deg);
    width: 30%;
}

@media (max-width: 992px) {
	.h-01 #area-header #menu-global .btn-contact {
		display: inline-block;
		width: 50%;
		margin: 0 auto;
	}
	.h-01 #area-header #menu-global .btn-contact.menu-item a.nav-link {
		padding-top: 15px;
		padding-bottom: 15px;
	}
}

.h-01 #area-header #navbarNav ul li.dropdown::before {
    content: '';
    position: absolute;
    right: -1%;
    top: 12px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(135deg);
}
.h-01 #area-header #navbarNav ul li.btn-contact.dropdown::before {
	border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}
@media (min-width: 1200px) {
	.h-01 #area-header #navbarNav ul li.dropdown::before {
	    right: 5%;
	}
}

.h-01 #area-header #navbarNav li.dropdown ul{
	position: absolute;
	left:0;
	top:62px;
	z-index: 4;
	background:#28BFE7;
	width:180px;
	visibility: hidden;
	opacity: 0;
	transition: all .3s;
}

.h-01 #area-header #navbarNav ul ul li.dropdown::before{
	content:'';
	position: absolute;
	left:6px;
	top:17px;
	width:6px;
	height:6px;
    border-top: 2px solid #fff;
    border-right:2px solid #fff;
    transform: rotate(45deg);
}

.h-01 #area-header #navbarNav li.dropdown ul{
    left: 0;
    top: 36px;
    z-index: 4;
    background: #fff;
    width: 120%;
    visibility: hidden;
    opacity: 0;
    transition: all .3s;
    border-radius: 0;
    width: 150%;
}

.h-01 #area-header #navbarNav li.dropdown ul li {
	width: 100%;
}
.h-01 #area-header #navbarNav li.dropdown.btn-contact ul li {
	background-color: #000;
}

.h-01 #area-header #navbarNav li.dropdown:hover > ul,
.h-01 #area-header #navbarNav li.dropdown ul li:hover > ul,
.h-01 #area-header #navbarNav li.dropdown:active > ul,
.h-01 #area-header #navbarNav li.dropdown ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

.h-01 #area-header #navbarNav li.dropdown ul li:last-child a{
	border-bottom:none;
}

.h-01 #area-header #navbarNav li.dropdown ul li a:hover,
.h-01 #area-header #navbarNav li.dropdown ul li a:active{
	background: #000;
}


@media screen and (max-width:992px) {
	.h-01 #area-header #navbarNav{
		padding: 0;
	}
	
	.h-01 #area-header #navbarNav ul{
		display: block;
	}
	
	.h-01 #area-header #navbarNav li.dropdown ul,
	.h-01 #area-header #navbarNav li.dropdown ul ul{
	  	position: relative;
		left:0;
		top:0;
		width:90%;
		visibility:visible;
		opacity:1;
		display: none;
		transition:none;
	}

	.h-01 #area-header #navbarNav ul li.dropdown::before{
		right:20px;
		top: 22px !important;
	}

	.h-01 #area-header #navbarNav ul ul li.dropdown::before{
	    transform: rotate(135deg);
		left:20px;
	}
	    
	.h-01 #area-header #navbarNav ul li.dropdown.active::before{
	    transform: rotate(-45deg);
	}
}

@media (min-width: 992px) {
	.h-01 #area-header #menu-global li:hover .dropdown-menu li a {
	   	background-image: none!important;
	}
}

.h-01 #area-header #menu-global li:hover .dropdown-menu {
	padding: 15px;
}

.h-01 #area-header #menu-global li:hover .dropdown-menu li a {
	display: block;
	padding: 15px 10px;
	width:  100%;
}

.h-01 #area-header #menu-global li .dropdown-menu li a:hover {
	color: #fff!important;
}

@media (max-width: 992px) {
	.h-01 .header_btn01,.header_btn02,.header_btn03 {
		display: none;
	}

	.h-01 #area-header #navbarNav ul li.dropdown::before {
	    right: 20px;
	    top: 30px!important;
	}

	.h-01 #area-header #menu-global .menu-item:hover {
	    background-color: transparent;
	}

	.h-01 #area-header #menu-global li:hover .dropdown-menu {
	    padding: 10px;
	}

	.h-01 #area-header #menu-global li .dropdown-menu > li {
		margin-top: 0;
	}
}


/*スマホナビ調整*/
@media (max-width: 992px) {
	.h-01 #area-header #menu-global li .dropdown-menu {
		display: block!important;
	}

	.h-01 #area-header #navbarNav li.dropdown ul {
		background: transparent;
		border: 0;
	}

	.h-01 #area-header #menu-global li .dropdown-menu li a {
		text-align: left;
		padding: 0.3rem 0;
		font-size: 12px;
	}

	.h-01 #area-header .globalMenuSp ul li a {
	    padding: 1.2em 0;
	    text-align: left;
	}

	.h-01 #area-header #navbarNav ul li.dropdown::before {
	    display: none;
	}

	.h-01 #area-header #menu-global .btn-contact {
	    display: block;
	    width: 100%;
	    margin: 20px auto 20px 0;
	    padding-left: 10px;
	    padding-right: 10px;
	}

	.h-01 #area-header #menu-global {
	    margin-top: 60px;
	}

	.h-01 #area-header #menu-global {
		padding: 0 20px 20px 20px;
	}
}

.h-01 #area-header #menu-global .menu-item .nav-link  {
	color: #676820!important;
	margin: 0!important;
	position: relative;
	text-decoration: none;
}

@media (max-width: 991px) {
	.h-01 #area-header #menu-global.active .menu-item .nav-link {
		animation: slideIn .5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
		display: flex;
    	align-items: center;
	}
	@keyframes slideIn {
	  0% {
	    transform: translateX(-180px);
	    opacity: 0;
	  }
	  100% {
	    transform: translateX(0);
	  }
	  40%,100% {
	    opacity: 1;
	  }
	}

	.h-01 #area-header #menu-global .menu-item .nav-link::before {
	  content: "";
	  position: absolute;
	  left: 0;
	  bottom: -4px; /* 文字との距離。調整可 */
	  width: 100%;
	  height: 1px; /* 線の太さ */
	  background-color: currentColor; /* 文字色と同じ */
	  transform: scaleX(0);
	  transform-origin: left;
	  transition: transform 1.0s ease;
	}

	.h-01 #area-header #menu-global.active .menu-item .nav-link::before {
	  transform: scaleX(1);
	}
}

.h-01 #area-header #menu-global .menu-item.menu-item-673 .nav-link::after {
	content: "home";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-30 .nav-link::after {
	content: "oem products";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-29 .nav-link::after {
	content: "oem flow";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-28 .nav-link::after {
	content: "customer voice";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-27 .nav-link::after {
	content: "faq";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-26 .nav-link::after {
	content: "recruit";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
.h-01 #area-header #menu-global .menu-item.menu-item-25 .nav-link::after {
	content: "contact";
  	color: #aea347;
	font-family: "Playfair Display SC", serif;
	font-size: 12px;
	padding-left: 10px;
	letter-spacing: .5px;
}
@media (min-width: 992px) {
	.h-01 #area-header #menu-global .menu-item.menu-item-673 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-30 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-29 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-28 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-27 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-26 .nav-link::after,
	.h-01 #area-header #menu-global .menu-item.menu-item-25 .nav-link::after {
		display: block;
		padding-left: 0px;
		font-size: 10px;
	}
	.h-01 #area-header #menu-global {
        display: flex;
        align-items: center;
    }
    .h-01 #area-header #menu-global .menu-item .nav-link {
    	font-size: 15px;
    }
}

@media (min-width: 1200px) {
	.h-01 #area-header #menu-global .menu-item .nav-link {
    	font-size: 17px;
    }
}

/* =================================================================================　H-01style  */

/* oem_products ここから*/
/* ヘッダー */
.navbar {
    background-color: rgba(255, 255, 255, 0.98);
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    padding: 1rem 0;
}

.navbar-brand {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--primary-color) !important;
}

.nav-link {
    color: #333 !important;
    font-weight: 500;
    margin: 0 0.8rem;
    transition: color 0.3s;
}

.nav-link:hover {
    color: var(--primary-color) !important;
}

/* ヒーローエリア */
        .hero-section {
            position: relative;
            min-height: 600px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            overflow: hidden;
        }
        
        /* 動画プレースホルダー（実装時は<video>タグに差し替え） */
        .hero-video-placeholder {
            position: relative;
            top: 0;
            left: 0;
             width: 100vw;
  			height: 100vh;
  			overflow: hidden;
            /*background: linear-gradient(135deg, rgba(44, 95, 79, 0.85), rgba(139, 115, 85, 0.85)), 
                        url('https://via.placeholder.com/1920x1080/2c5f4f/ffffff?text=Video+Background') center/cover no-repeat;*/
            z-index: 0;
        }

        .hero-video {
		  position: absolute;
		  top: 50%;
		  left: 50%;
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
		  transform: translate(-50%, -50%);
		}
 
        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.3);
            z-index: 1;
        }
        
        .hero-content {
            position: absolute;
            z-index: 2;
            text-align: center;
            max-width: 900px;
            padding: 2rem;
        }
        
        .hero-content h1 {
        	font-family: YakuHanMP, "Zen Old Mincho", serif;
        	color: #fff;
            font-size: 3.2rem;
            margin-bottom: 1rem;
            line-height: 1.4;
            letter-spacing: 2px;
        }
        
        .hero-subtitle {
 			font-family: "Playfair Display SC", serif;
			color: #949535;
            font-size: 1.8rem;
            font-weight: 300;
            letter-spacing: 4px;
            text-align: center;
        }
        
        .btn-hero {
            padding: 1rem 3rem;
            font-size: 1.1rem;
            border-radius: 50px;
            font-weight: 600;
            transition: all 0.3s;
            text-decoration: none;
            display: inline-block;
            margin: 0.5rem;
        }
        
        .btn-hero-primary {
            background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
            color: white;
            border: 2px solid transparent;
            transition: transform 0.3s ease,box-shadow 0.3s ease,opacity 0.3s ease;
        }
        
        .btn-hero-primary:hover {
            background: linear-gradient(
		        135deg,
		        var(--primary-color),
		        var(--primary-color)
		    );
		    transform: translateY(-3px);
		    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
		    color: #fff;
        }

        .yajirushi {
		    display: inline-block;
		    margin-left: 0.3em;
		    transform: scaleX(1.5); 
		    transition: transform 0.6s ease;
		}

		.btn-hero-primary:hover .yajirushi {
		    transform: scaleX(2.0) translateX(20px);
		}
        
        /* 紹介セクション（旧ヒーローエリアのテキスト） */
        .intro-section {
            padding: 5rem 0;
            background-color: white;
        }
        
        .intro-content {
            max-width: 900px;
            margin: 0 auto;
            text-align: center;
        }
        
        .intro-content h2 {
            font-size: 2.5rem;
            font-weight: 700;
            color: var(--primary-color);
            margin-bottom: 1.5rem;
			letter-spacing: 3px;
        }
        
        .intro-content .lead-text {
            font-size: 1.3rem;
            color: var(--secondary-color);
            font-weight: 600;
            margin-bottom: 2rem;
            line-height: 1.8;
        }
        
        .intro-content p {
            font-size: 1.1rem;
            color: #555;
            line-height: 2;
            margin-bottom: 1.5rem;
        }
            margin: 0 0.5rem;
            transition: all 0.3s;
            font-weight: 600;
        }
        
        .btn-hero-primary {
            background-color: white;
            color: var(--primary-color);
            border: none;
        }
        
        .btn-hero-primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.2);
        }
        
        .btn-hero-outline {
            background-color: transparent;
		    color: #327a4e;
		    border: 2px solid #327a4e;

		    transition: 
		        transform 0.3s ease,
		        box-shadow 0.3s ease,
		        background-color 0.3s ease,
		        color 0.3s ease;
        }
        
        .btn-hero-outline:hover {
            background-color: white;
		    color: var(--primary-color);
		    transform: translateY(-3px);
		    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
        }
        .btn-hero-outline:hover .yajirushi {
		    transform: scaleX(2.0) translateX(20px);
		}
		        
        /* Aboutセクション */
        .about-section {
            padding: 6rem 0;
            background-color: white;
        }
        
        .section-title {
            text-align: center;
            margin-bottom: 1rem;
            font-size: 2.5rem;
            font-weight: 700;
            color: var(--primary-color);
        }
        
        .section-subtitle {
            font-size: 1.3rem;
		    color: var(--secondary-color);
		    font-weight: 600;
		    margin-bottom: 2rem;
		    line-height: 1.8;
        }
        
        .strength-card {
            text-align: center;
            padding: 2rem;
            border-radius: 15px;
            transition: all 0.3s;
            height: 100%;
        }
        
        .strength-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 40px rgba(0,0,0,0.1);
        }
        
        .strength-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            font-size: 2rem;
            color: white;
        }
        
        .strength-card h3 {
            font-size: 1.4rem;
            font-weight: 600;
            margin-bottom: 1rem;
            color: var(--primary-color);
        }
        
        .strength-card p {
            color: #666;
            line-height: 1.8;
        }
        
        /* お知らせセクション */
        .news-section {
            padding: 6rem 0;
            background-color: var(--light-bg);
        }
        
        .news-item {
            background: white;
            padding: 1.5rem;
            border-radius: 10px;
            margin-bottom: 1rem;
            display: flex;
            align-items: center;
            transition: all 0.3s;
            text-decoration: none;
            color: inherit;
        }
        
        .news-item:hover {
            transform: translateX(10px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }
        
        .news-date {
            background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
            color: white;
            padding: 0.1rem 1rem;
            border-radius: 5px;
            margin-right: 1.5rem;
            min-width: 120px;
            text-align: center;
            font-size: 15px;
        }

        .news-new {
			color: #676820;
			font-family: "Playfair Display SC", serif;
		}
		@media (min-width: 768px) {
			.news-new {
				font-size: 18px;
				margin-right: 20px;
			}
		}
        
        .news-title {
            flex: 1;
            font-weight: 500;
        }

        a.news-item:hover .yajirushi {
		    transform: scaleX(2.0) translateX(20px);
		}
        
        .view-more {
            text-align: center;
            margin-top: 2rem;
        }
        
        .view-more a {
            color: var(--primary-color);
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            transition: all 0.3s;
        }
        
        .view-more a:hover {
            color: var(--accent-color);
        }
        
        /* サービス紹介セクション - 横幅いっぱい */
        .service-visual-section {
            position: relative;
            height: 60vh;
            min-height: 450px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            overflow: hidden;
            background-size: cover;
            background-position: center;
        }
        
        .service-oem-products {
        	background-image: url(img/front-oemitem.jpg);
        	background-size: cover;
        	background-position: center center;
           /* background: linear-gradient(rgba(139, 115, 85, 0.85), rgba(139, 115, 85, 0.85)), 
                        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600"><rect fill="%238b7355" width="1200" height="600"/></svg>');*/
        }
        
        
        .service-oem-flow {
            background: linear-gradient(rgba(44, 95, 79, 0.85), rgba(44, 95, 79, 0.85)), 
                        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600"><rect fill="%232c5f4f" width="1200" height="600"/></svg>');
        }
        
        .service-voice {
            background: linear-gradient(rgba(201, 168, 112, 0.85), rgba(201, 168, 112, 0.85)), 
                        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600"><rect fill="%23c9a870" width="1200" height="600"/></svg>');
        }
        
        .service-content {
            position: relative;
            z-index: 2;
            text-align: center;
            max-width: 900px;
            padding: 3rem;
        }
        
        .service-label {
            display: inline-block;
            background-color: rgba(255, 255, 255, 0.2);
            padding: 0.5rem 2rem;
            border-radius: 30px;
            font-size: 0.9rem;
            font-weight: 600;
            letter-spacing: 2px;
            margin-bottom: 2rem;
        }
        
        .service-content h2 {
            font-size: 3rem;
            font-weight: 700;
            margin-bottom: 1.5rem;
            line-height: 1.3;
        }
        
        .service-content p {
            font-size: 1.2rem;
            margin-bottom: 2.5rem;
            line-height: 1.8;
            opacity: 0.95;
        }
        
        .btn-service {
            background-color: white;
            color: var(--primary-color);
            padding: 1rem 3rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 600;
            display: inline-block;
            transition: all 0.3s;
            border: none;
            font-size: 1.1rem;
        }
        
        .btn-service:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 40px rgba(0,0,0,0.3);
            color: var(--primary-color);
        }
        
        /* CTAセクション */
        .cta-section {
            padding: 6rem 0;
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            color: white;
            text-align: center;
        }
        
        .cta-section h2 {
            font-size: 2.5rem;
            font-weight: 700;
            margin-bottom: 1.5rem;
        }
        
        .cta-section p {
            font-size: 1.2rem;
            margin-bottom: 3rem;
            opacity: 0.95;
        }
        
        .btn-cta {
            background-color: white;
            color: var(--primary-color);
            padding: 1.2rem 4rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 600;
            display: inline-block;
            transition: all 0.3s;
            font-size: 1.2rem;
        }
        
        .btn-cta:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 40px rgba(0,0,0,0.3);
            color: var(--primary-color);
        }
        
        /* フッター */
        .footer {
            background-color: #2c2c2c;
            color: #aaa;
            padding: 4rem 0 2rem;
        }
        
        .footer h5 {
            color: white;
            font-weight: 600;
            margin-bottom: 1.5rem;
        }
        
        .footer a {
            color: #aaa;
            text-decoration: none;
            transition: color 0.3s;
        }
        
        .footer a:hover {
            color: white;
        }
        
        .footer-links {
            list-style: none;
            padding: 0;
        }
        
        .footer-links li {
            margin-bottom: 0.8rem;
        }
        
        .social-links {
            margin-top: 3rem;
        }
        
        .partner-banners {
            margin-top: 3rem;
            padding-top: 3rem;
            border-top: 1px solid #444;
        }
        
        .partner-banners h5 {
            color: white;
            font-weight: 600;
            margin-bottom: 2rem;
        }
        
        .banner-link {
            text-decoration: none;
            display: block;
        }
        
        .banner-item {
            background-color: white;
            border-radius: 10px;
            padding: 2rem 1rem;
            text-align: center;
            transition: all 0.3s;
            height: 120px;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        
        .banner-link:hover .banner-item {
            transform: translateY(-5px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.2);
        }
        
        .banner-item span {
            font-size: 1.2rem;
            font-weight: 600;
            color: var(--primary-color);
        }
        
        .social-links {
            margin-top: 2rem;
        }
        
        .social-links a {
            display: inline-block;
            width: 40px;
            height: 40px;
            background-color: #444;
            border-radius: 50%;
            text-align: center;
            line-height: 40px;
            margin-right: 0.5rem;
            transition: all 0.3s;
        }
        
        .social-links a:hover {
            background-color: var(--primary-color);
            color: white;
            transform: translateY(-3px);
        }
        
        .copyright {
            text-align: center;
            padding-top: 3rem;
            margin-top: 3rem;
            border-top: 1px solid #444;
            color: #777;
        }
        
        /* レスポンシブ */
        @media (max-width: 768px) {
            .hero-content h1 {
                font-size: 2.8rem;
                letter-spacing: 1px;
            }
            
            .hero-subtitle {
                font-size: 1rem;
                letter-spacing: 2px;
            }
            
            .intro-content h2 {
                font-size: 1.8rem;
                line-height: 1.5;
            }
            
            .intro-content .lead-text {
                font-size: 1.1rem;
            }
            
            .intro-content p {
                font-size: 1rem;
            }
            
            .btn-hero {
                padding: 0.8rem 2rem;
                font-size: 1rem;
                margin-bottom: 1rem;
                display: block;
                margin-left: auto;
                margin-right: auto;
            }
            
            .section-title {
                font-size: 1.8rem;
            }
            
            .service-content h2 {
                font-size: 2rem;
            }
            
            .service-content p {
                font-size: 1rem;
            }
            
            .news-item {
                flex-direction: column;
                text-align: center;
            }
            
            .news-date {
                margin-right: 0;
                margin-bottom: 1rem;
            }
        }

/* ページヒーロー */
.page-hero {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    padding: 5rem 0 3rem;
    text-align: center;
}

.page-hero h1 {
    font-size: 2.8rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.page-hero p {
    font-size: 1.2rem;
    opacity: 0.95;
    max-width: 800px;
    margin: 0 auto;
}

/* パンくずリスト */
.breadcrumb-section {
    padding: 1.5rem 0;
    background-color: var(--light-bg);
}

.breadcrumb {
    margin-bottom: 0;
    background-color: transparent;
}

.breadcrumb-item a {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item.active {
    color: #666;
}

/* カテゴリセクション */
.category-section {
    padding: 5rem 0;
}

.category-section:nth-child(even) {
    background-color: #f1f6f1;
}

.category-header {
    text-align: center;
    margin-bottom: 4rem;
}

.category-label {
    display: inline-block;
    background-color: var(--primary-color);
    color: white;
    padding: 0.5rem 2rem;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 1.5rem;
}

.category-header h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.category-header p {
    font-size: 1.1rem;
    color: #666;
    max-width: 800px;
    margin: 0 auto;
}

/* 商品カード */
.product-card {
    background: white;
    border-radius: 15px;
    padding: 2.5rem 2rem;
    height: 100%;
    transition: all 0.3s;
    box-shadow: 0 2px 15px rgba(0,0,0,0.05);
    position: relative;
    overflow: hidden;
}

.product-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
}

.product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
}

.product-icon {
    width: 70px;
    height: 70px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    color: white;
}

.product-card h3 {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--primary-color);
    text-align: center;
    margin-bottom: 1.5rem;
}

.product-card p {
    color: #666;
    line-height: 1.8;
    text-align: center;
    margin-bottom: 1.5rem;
}

.product-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-features li {
    padding: 0.5rem 0;
    color: #555;
    display: flex;
    align-items: center;
}

.product-features li::before {
    content: '✓';
    color: var(--primary-color);
    font-weight: 700;
    margin-right: 0.8rem;
    font-size: 1.2rem;
}

/* オーガニックセクション特別スタイル */
.organic-highlight {
	background-image: url(img/bg-naturalsozai.jpg);
	background-size: cover;
	background-position: left top;
    /*background: linear-gradient(135deg, rgba(44, 95, 79, 0.05), rgba(201, 168, 112, 0.05));*/
    border-radius: 20px;
    padding: 2rem;
    margin-top: 2rem;
}
@media (min-width: 768px) {
	.organic-highlight {
		padding: 3rem;
	}
}

.organic-features {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
    margin-top: 2rem;
}

.organic-badge {
    background-color: white;
    border: 2px solid var(--primary-color);
    border-radius: 50px;
    padding: 1rem 2rem;
    font-weight: 600;
    color: var(--primary-color);
    transition: all 0.3s;
}

.organic-badge:hover {
    background-color: var(--primary-color);
    color: white;
    transform: scale(1.05);
}

/* CTAセクション */
.cta-section {
    padding: 6rem 0;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    text-align: center;
}

.cta-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 3rem;
    opacity: 0.95;
}

.btn-cta {
    background-color: white;
    color: var(--primary-color);
    padding: 1.2rem 4rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
    font-size: 1.2rem;
    margin: 0 0.5rem;
}

.btn-cta:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    color: var(--primary-color);
}

.btn-cta-outline {
    background-color: transparent;
    color: white;
    border: 2px solid white;
}

.btn-cta-outline:hover {
    background-color: white;
    color: var(--primary-color);
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}

.banner-item {
    background-color: white;
    border-radius: 10px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.banner-link:hover .banner-item {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.banner-item span {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
}

.social-links {
    margin-top: 2rem;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #444;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .page-hero h1 {
        font-size: 2rem;
    }
    
    .category-header h2 {
        font-size: 1.8rem;
    }
    
    .organic-features {
        flex-direction: column;
        align-items: center;
    }
    
    .btn-cta {
        display: block;
        margin: 1rem auto;
    }
}

/* oem_products ここまで*/

/* oem_flow　ここから */
/* フローセクション */
.flow-section {
    padding: 5rem 0;
    background-color: var(--light-bg);
}

.section-header {
    text-align: center;
    margin-bottom: 5rem;
}

.section-header h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.section-header p {
    font-size: 1.1rem;
    color: #666;
}

/* フェーズ */
.phase-wrapper {
    margin-bottom: 3rem;
}

.phase-header {
    text-align: center;
    margin-bottom: 3rem;
}

.phase-label {
    display: inline-block;
    background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
    color: white;
    padding: 0.8rem 2.5rem;
    border-radius: 50px;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 1rem;
}

.phase-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
}

/* ステップカード */
.step-card {
    background: white;
    border-radius: 20px;
    padding: 2.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    position: relative;
    transition: all 0.3s;
}

.step-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 35px rgba(0,0,0,0.12);
}

.step-number {
    position: absolute;
    top: -20px;
    left: 30px;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.step-content {
    margin-left: 80px;
}

.step-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
    border-bottom: 1px solid #676820;
    padding-bottom: 10px;
}

.step-description {
    font-size: 1.05rem;
    color: #555;
    line-height: 1.9;
    margin-bottom: 1rem;
}

.step-details {
    background-color: var(--light-bg);
    border-radius: 10px;
    padding: 1.5rem;
    margin-top: 1.5rem;
}

.step-details h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.step-details ul {
    margin: 0;
    padding-left: 1.5rem;
}

.step-details li {
    margin-bottom: 0.5rem;
    color: #555;
}

/* フロー矢印 */
.flow-arrow {
    text-align: center;
    margin: 1rem 0;
}

.flow-arrow i {
    font-size: 2.5rem;
    color: var(--secondary-color);
}

/* タイムラインポイント */
.timeline-point {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2rem 0;
}

.timeline-line {
    height: 3px;
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
    flex: 1;
}

.timeline-circle {
    width: 20px;
    height: 20px;
    background: var(--accent-color);
    border-radius: 50%;
    margin: 0 1rem;
}

/* ハイライトボックス */
.highlight-box {
    background: linear-gradient(135deg, rgba(44, 95, 79, 0.05), rgba(201, 168, 112, 0.05));
    border-left: 5px solid var(--primary-color);
    padding: 2rem;
    border-radius: 10px;
    margin: 2rem 0;
}

.highlight-box h3 {
    color: var(--primary-color);
    font-weight: 700;
    margin-bottom: 1rem;
}

.highlight-box p {
    margin-bottom: 0;
    font-size: 1.05rem;
}


.highlight-box2 {
    background: linear-gradient(135deg, rgba(44, 95, 79, 0.6), rgba(201, 168, 112, 0.6));
    padding: 2rem;
    border-radius: 10px;
    margin: 2rem 0;
}
.highlight-box2 h3 {
    color: #fff;
    font-weight: 700;
    margin-bottom: 1rem;
}
.highlight-box2 p {
	color: #fff;
    margin-bottom: 0;
    font-size: 1.05rem;
}


/* ポイントセクション */
.points-section {
    padding: 5rem 0;
    background-color: white;
}

.point-card {
    text-align: center;
    padding: 2rem;
}

.point-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    color: white;
}

.point-card h3 {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.point-card p {
    color: #666;
}

/* CTAセクション */
.cta-section {
    padding: 6rem 0;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    text-align: center;
}

.cta-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 3rem;
    opacity: 0.95;
}

.btn-cta {
    background-color: white;
    color: var(--primary-color);
    padding: 1.2rem 4rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
    font-size: 1.2rem;
    margin: 0 0.5rem;
}

.btn-cta:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    color: var(--primary-color);
}

.btn-cta-outline {
    background-color: transparent;
    color: white;
    border: 2px solid white;
}

.btn-cta-outline:hover {
    background-color: white;
    color: var(--primary-color);
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}

.banner-item {
    background-color: white;
    border-radius: 10px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.banner-link:hover .banner-item {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.banner-item span {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
}

.social-links {
    margin-top: 2rem;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #444;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .page-hero h1 {
        font-size: 2rem;
    }
    
    .step-content {
        margin-left: 0;
        margin-top: 3rem;
    }
    
    .step-number {
        left: 50%;
        transform: translateX(-50%);
    }
    
    .btn-cta {
        display: block;
        margin: 1rem auto;
    }
}

/* oem_flow　ここまで */


/* voice　ここから */
/* 写真プレースホルダー */
.photo-placeholder {
    background-color: #d0d0d0;
    border: 3px dashed #999;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-weight: 600;
    text-align: center;
    padding: 2rem;
    position: relative;
}

.photo-placeholder i {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

.photo-label {
    font-size: 0.9rem;
    color: #888;
    margin-top: 0.5rem;
}

/* 事例セクション */
.case-section {
    padding: 5rem 0;
}

.case-section:nth-child(even) {
    background-color: var(--light-bg);
}

.case-header {
    margin-bottom: 3rem;
}

.case-number {
    display: inline-block;
    background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
    color: white;
    padding: 0.5rem 2rem;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 1rem;
}

.case-title {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.case-subtitle {
    font-size: 1.2rem;
    color: #666;
}

/* メインビジュアル（製品写真） */
.main-visual {
    height: 500px;
    margin-bottom: 3rem;
}

/* 打ち合わせ写真 */
.meeting-photo {
    height: 400px;
    margin-bottom: 2rem;
}

/* オーナー写真 */
.owner-photo {
    height: fit-content;
}

/* インタビューボックス */
.interview-box {
    background-color: white;
    border-radius: 20px;
    padding: 3rem;
    box-shadow: 0 5px 25px rgba(0,0,0,0.08);
    margin-bottom: 3rem;
}

.interview-section:nth-child(even) .interview-box {
    background-color: var(--light-bg);
}

.interview-question {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1.5rem;
    padding-left: 2rem;
    position: relative;
}

.interview-question::before {
    content: 'Q';
    position: absolute;
    left: 0;
    top: 0;
    font-size: 2rem;
    font-weight: 700;
    color: var(--accent-color);
}

.interview-answer {
    font-size: 1.1rem;
    line-height: 2;
    color: #555;
    padding-left: 2rem;
    position: relative;
}

.interview-answer::before {
    content: 'A';
    position: absolute;
    left: 0;
    top: 0;
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
}

/* 会社情報カード */
.company-info-card {
    background: linear-gradient(135deg, rgba(44, 95, 79, 0.05), rgba(201, 168, 112, 0.05));
    border-left: 5px solid var(--primary-color);
    padding: 2rem;
    border-radius: 10px;
    margin-bottom: 3rem;
}

.company-info-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.company-info-card dl {
    margin: 0;
}

.company-info-card dt {
    font-weight: 600;
    color: #555;
    margin-bottom: 0.3rem;
}

.company-info-card dd {
    color: #666;
    margin-bottom: 1rem;
    padding-left: 1rem;
}

/* 製品詳細グリッド */
.product-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.product-detail-item {
    background-color: white!important;
}

.product-detail-item h4	{
	background-color: #676820;
	color: #fff!important;
	padding: 15px;
}
.product-detail-item p	{
	background-color: #fff;
	padding: 15px;
}

.case-section:nth-child(even) .product-detail-item {
    background-color: var(--light-bg);
}

.product-detail-item h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
}

.product-detail-item p {
    margin: 0;
    color: #666;
}

/* クォートボックス */
.quote-box {
    background-color: white;
    padding: 2rem 2rem 2rem 3rem;
    border-radius: 10px;
    margin: 3rem 0;
    font-size: 1.2rem;
    line-height: 2;
    color: #555;
    font-style: italic;
}

.quote-author {
    text-align: right;
    margin-top: 1rem;
    font-style: normal;
    font-weight: 600;
    color: var(--primary-color);
}

/* CTAセクション */
.cta-section {
    padding: 6rem 0;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    text-align: center;
}

.cta-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 3rem;
    opacity: 0.95;
}

.btn-cta {
    background-color: white;
    color: var(--primary-color);
    padding: 1.2rem 4rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
    font-size: 1.2rem;
    margin: 0 0.5rem;
}

.btn-cta:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    color: var(--primary-color);
}

.btn-cta-outline {
    background-color: transparent;
    color: white;
    border: 2px solid white;
}

.btn-cta-outline:hover {
    background-color: white;
    color: var(--primary-color);
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}

.banner-item {
    background-color: white;
    border-radius: 10px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.banner-link:hover .banner-item {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.banner-item span {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
}

.social-links {
    margin-top: 2rem;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #444;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .page-hero h1 {
        font-size: 2rem;
    }
    
    .case-title {
        font-size: 1.8rem;
    }
    
    .main-visual {
        height: 300px;
    }
    
    .meeting-photo {
        height: 250px;
    }
    
    .owner-photo {
        height: 250px;
    }
    
    .btn-cta {
        display: block;
        margin: 1rem auto;
    }
}

/* voice　ここまで */

/* faq　ここから */
/* FAQセクション */
.faq-section {
    padding: 5rem 0 5rem;
}

.faq-category {
    margin-bottom: clamp(3.75rem, 2.679rem + 5.36vw, 9.375rem);
}

#faq .category-header {
    text-align: center;
    margin-bottom: 1rem;
	padding: 50px 0;
    border-radius: 20px 20px 0 0;
    margin-bottom: 0;
}

#faq .accordion-item+.accordion-item {
    margin-top: 20px;
}
@media (min-width: 992px) {
	#faq .accordion-item+.accordion-item {
	    margin-top: 40px;
	}
}

.category-label {
    display: inline-block;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    color: white;
    padding: 0.5rem 2rem;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 0rem;
}

#faq .category-title {
	text-align: center!important;
    font-size: clamp(1.5rem, 1.229rem + 1.36vw, 2.5rem);
    font-weight: 700;
    color: #fff;
}

/* アコーディオン */
.faq-accordion {
    margin: 0 auto;
    background-color: #f3f2ec;
    padding: 5%;
    border-radius: 0 0 20px 20px;
}

.accordion-item {
    border: none;
    margin-bottom: 1rem;
    border-radius: 15px !important;
    overflow: hidden;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}

.accordion-button {
    background-color: white;
    color: var(--primary-color);
    font-size: 1.2rem;
    font-weight: 600;
    padding: 0.5rem 1rem;
    border: none;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    background-color: var(--primary-color);
    color: white;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232c5f4f'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23327a4e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-button .question-number {
    font-family: YakuHanMP, "Zen Old Mincho", serif;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #676820;
    color: white;
    text-align: center;
    line-height: 1;
    margin-right: 1rem;
    padding: 0;
    font-size: clamp(1rem, 0.8rem + 1vw, 1.375rem)!important;
    border-radius: 50%;
    width: clamp(2.5rem, 2rem + 2.5vw, 3.75rem);
    height: clamp(2.5rem, 2rem + 2.5vw, 3.75rem);
    writing-mode: horizontal-tb;
    white-space: nowrap;
}


.accordion-button:not(.collapsed) .question-number {
    background: white;
    color: var(--primary-color);
}

.accordion-body {
    padding: 2rem;
    font-size: 1.05rem;
    line-height: 2;
    color: #fff;
    background-color: #676820;
	text-align: justify;
}

.accordion-body strong {
    color: var(--primary-color);
}

.accordion-body ul {
    margin-top: 1rem;
    padding-left: 1.5rem;
}

.accordion-body li {
    margin-bottom: 0.5rem;
}

/* 関連リンクセクション */
.related-section {
    padding: 5rem 0;
    background: linear-gradient(135deg, rgba(44, 95, 79, 0.05), rgba(201, 168, 112, 0.05));
}

.related-header {
    text-align: center;
    margin-bottom: 3rem;
}

.related-header h2 {
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.related-card {
    background: white;
    border-radius: 20px;
    padding: 3rem 2rem;
    text-align: center;
    transition: all 0.3s;
    height: 100%;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}

.related-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

.related-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    color: white;
}

.related-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.related-card p {
    color: #666;
    margin-bottom: 2rem;
}

.btn-related {
    background-color: var(--primary-color);
    color: white;
    padding: 0.8rem 2.5rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
}

.btn-related:hover {
    background-color: var(--secondary-color);
    color: white;
    transform: scale(1.05);
}

/* CTAセクション */
.cta-section {
    padding: 6rem 0;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    text-align: center;
}

.cta-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 3rem;
    opacity: 0.95;
}

.btn-cta {
    background-color: white;
    color: var(--primary-color);
    padding: 1.2rem 4rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
    font-size: 1.2rem;
}

.btn-cta:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    color: var(--primary-color);
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}

.banner-item {
    background-color: white;
    border-radius: 10px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.banner-link:hover .banner-item {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.banner-item span {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
}

.social-links {
    margin-top: 2rem;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #444;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .page-hero h1 {
        font-size: 2rem;
    }
    
    .accordion-button {
        font-size: 1.05rem;
        padding: 0;
    }
    
    .accordion-button .question-number {
        width: 40px;
    }
}
/* faq　ここまで */

/* recruit　ここから */
/* 採用メッセージセクション */
.message-section {
    padding: 5rem 0;
    background-color: white;
}

.message-content {
    max-width: 900px;
    margin: 0 auto;
}

.message-header {
    text-align: center;
    margin-bottom: 2rem;
}

.message-header h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.message-text {
    font-size: 1.1rem;
    line-height: 2;
    color: #555;
    margin-bottom: 2rem;
}

.photo-label {
    font-size: 0.9rem;
    color: #888;
    margin-top: 0.5rem;
}

/* 働く魅力セクション */
.appeal-section {
    padding: 5rem 0;
    background-color: var(--light-bg);
}

.section-header {
    text-align: center;
    margin-bottom: 4rem;
}

.section-header h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.section-header p {
    font-size: 1.1rem;
    color: #666;
}

.appeal-card {
    background: white;
    border-radius: 20px;
    padding: 2.5rem;
    height: 100%;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: all 0.3s;
}

.appeal-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

.appeal-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    color: white;
}

.appeal-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
    text-align: center;
    margin-bottom: 1rem;
}

.appeal-card p {
    color: #666;
    text-align: center;
    line-height: 1.8;
}

/* お仕事紹介セクション */
.job-section {
    padding: 5rem 0;
    background-color: white;
}

.job-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    margin-bottom: 3rem;
    transition: all 0.3s;
}

.job-card:hover {
    box-shadow: 0 10px 35px rgba(0,0,0,0.15);
}

/* ここから　写真背景削除 */
/* .job-photo {
    height: 300px;
    background-color: #d0d0d0;
    border: 3px dashed #999;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-weight: 600;
    text-align: center;
    padding: 2rem;
}

.job-photo i {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
} */
/* ここまで　写真背景削除 */

.job-content {
    padding: 2.5rem;
}

.job-label {
    display: inline-block;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    color: white;
    padding: 0.4rem 1.5rem;
    border-radius: 30px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 1rem;
}

.job-content h3 {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.job-content p {
    font-size: 1.05rem;
    color: #555;
    line-height: 1.9;
    margin-bottom: 1.5rem;
}

.job-details {
    background-color: var(--light-bg);
    border-radius: 10px;
    padding: 1.5rem;
}

.job-details h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.job-details ul {
    margin: 0;
    padding-left: 1.5rem;
}

.job-details li {
    margin-bottom: 0.5rem;
    color: #555;
}

/* 募集要項セクション */
.requirements-section {
    padding: 5rem 0;
    background-color: var(--light-bg);
}

.requirements-card {
    background: white;
    border-radius: 20px;
    padding: 3rem;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    max-width: 900px;
    margin: 0 auto;
}

.requirements-table {
    width: 100%;
}

.requirements-table tr {
    border-bottom: 1px solid #e0e0e0;
}

.requirements-table tr:last-child {
    border-bottom: none;
}

.requirements-table th {
    padding: 1.5rem 1rem;
    font-weight: 600;
    color: var(--primary-color);
    width: 30%;
    vertical-align: top;
}

.requirements-table td {
    padding: 1.5rem 1rem;
    color: #555;
    line-height: 1.9;
}

.requirements-table ul {
    margin: 0;
    padding-left: 1.5rem;
}

.requirements-table li {
    margin-bottom: 0.5rem;
}

/* 応募フローセクション */
.flow-section {
    padding: 5rem 0;
    /*background-color: white;*/
    background-image: url(img/bg-hamon5.jpg);
    background-size: cover;
    background-position: center center;
}

.flow-steps {
    max-width: 800px;
    margin: 0 auto;
}

.flow-step {
    display: flex;
    align-items: flex-start;
    margin-bottom: 2rem;
    position: relative;
}

.flow-step:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 35px;
    top: 70px;
    bottom: -30px;
    width: 3px;
    background: linear-gradient(180deg, var(--primary-color), var(--accent-color));
}

.flow-number {
    width: 70px;
    height: 70px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    font-weight: 700;
    flex-shrink: 0;
    margin-right: 2rem;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    position: relative;
    z-index: 1;
}

.flow-content h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
}

.flow-content p {
    color: #666;
    margin: 0;
}

.tejyun {
	width: 100px;
	position: absolute;
	top: -30px;
	left: -20px;
}
@media (min-width: 768px) {
	.tejyun {
		width: 120px;
	}
}
@media (min-width: 1200px) {
	.tejyun {
		width: 130px;
		left: -50px;
	}
}

.tejyunimg01 {
	min-height: 250px;
	background-image: url(img/tejyunimg01.jpg);
	background-size: cover;
	background-position: center center;
}
.tejyunimg02 {
	min-height: 250px;
	background-image: url(img/tejyunimg02.jpg);
	background-size: cover;
	background-position: center center;
}
.tejyunimg04 {
	min-height: 250px;
	background-image: url(img/tejyunimg04.jpg);
	background-size: cover;
	background-position: center center;
}

.tejyunimg08 {
	min-height: 250px;
	background-image: url(img/tejyunimg08.jpg);
	background-size: cover;
	background-position: center center;
}

/* CTAセクション */
.cta-section {
    padding: 6rem 0;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
    text-align: center;
}

.cta-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 3rem;
    opacity: 0.95;
}

.btn-cta {
    background-color: white;
    color: var(--primary-color);
    padding: 1.2rem 4rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s;
    font-size: 1.2rem;
}

.btn-cta:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
    color: var(--primary-color);
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}

.banner-item {
    background-color: white;
    border-radius: 10px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.3s;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.banner-link:hover .banner-item {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.banner-item span {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
}

.social-links {
    margin-top: 2rem;
}

.social-links a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #444;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}
/* recruit　ここまで */

/* contact　ここから */
/* お問い合わせ方法セクション */
.contact-methods {
    padding: 3rem 0 5rem;
    background-color: white;
}

.method-card {
    background: linear-gradient(135deg, rgba(44, 95, 79, 0.05), rgba(201, 168, 112, 0.05));
    border-radius: 20px;
    padding: 2.5rem;
    text-align: center;
    height: 100%;
    transition: all 0.3s;
}

.method-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.method-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    color: white;
}

.method-card h3 {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.method-card p {
    color: #666;
    margin-bottom: 1rem;
}

.method-info {
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 1rem;
}
p.method-info {
	color: var(--secondary-color);
}

/* フォームセクション */
.form-section {
    padding: 5rem 0;
    background-color: var(--light-bg);
}

.section-header {
    text-align: center;
    margin-bottom: 3rem;
}

.section-header h2 {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.section-header p {
    font-size: 1.1rem;
    color: #666;
}

.form-container {
    max-width: 1000px;
    margin: 0 auto;
    background: white;
    border-radius: 20px;
    padding: 3rem;
    box-shadow: 0 5px 25px rgba(0,0,0,0.08);
}

.form-label {
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
}

.required {
    color: #dc3545;
    margin-left: 0.3rem;
}

.form-control,
.form-select {
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 0.8rem 1rem;
    font-size: 1rem;
    transition: all 0.3s;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.2rem rgba(44, 95, 79, 0.15);
}

textarea.form-control {
    min-height: 150px;
}

.form-text {
    font-size: 0.9rem;
    color: #666;
    margin-top: 0.3rem;
}

.privacy-box {
    background-color: #fff7de;
    padding: 1.5rem;
    margin: 2rem 0;
    max-height: 300px;
    overflow-y: auto;
    border: 3px solid #ddd;
}

.privacy-box h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.privacy-box p {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 0.8rem;
    line-height: 1.6;
}

.form-check-input:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-submit {
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    color: white;
    padding: 1rem 4rem;
    border-radius: 50px;
    border: none;
    font-weight: 600;
    font-size: 1.1rem;
    transition: all 0.3s;
    width: 100%;
    max-width: 400px;
    display: block;
    margin: 2rem auto 0;
}

.btn-submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    color: white;
}

.btn-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* 注意事項 */
.notice-box {
    background-color: #fff3cd;
    border-left: 5px solid #ffc107;
    padding: 1.5rem;
    border-radius: 10px;
    margin-top: 2rem;
}

.notice-box h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #856404;
    margin-bottom: 1rem;
}

.notice-box ul {
    margin: 0;
    padding-left: 1.5rem;
}

.notice-box li {
    color: #856404;
    margin-bottom: 0.5rem;
}

/* フッター */
.footer {
    background-color: #2c2c2c;
    color: #aaa;
    padding: 4rem 0 2rem;
}

.footer h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.footer a {
    color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: white;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 0.8rem;
}

.partner-banners {
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #444;
}

.partner-banners h5 {
    color: white;
    font-weight: 600;
    margin-bottom: 2rem;
}

.banner-link {
    text-decoration: none;
    display: block;
}


.banner-item01 {
	position: relative;
	height: 150px;
    background-image: url(img/bg-kingokingo.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}

.banner-item01 p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
    font-size: 20px;
    background-color: rgb(50 122 78 / 80%);
    padding: 5px 20px;
	width: 60%;
	line-height: 1.5;
    text-align: center;
}
.banner-item01 .banner-itemh {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 0%;
	height: 0%;
	background-color: rgb(50 122 78 / 80%);
	border-radius: 20%;
	mix-blend-mode: multiply;
}
.banner-item01:hover .banner-itemh {
	position: absolute;
	width: 200%;
	height: 200%;
	transition: 0.3s;
}
.banner-item01:hover p {
	background-color: transparent;
	transition: 0.3s;
}


.banner-item02 {
	position: relative;
	height: 150px;
    background-image: url(img/bg-tengen.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.banner-item02 p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
    font-size: 20px;
    background-color: rgb(103 104 32 / 80%);
    padding: 5px 20px;
	width: 60%;
	line-height: 1.5;
    text-align: center;
}
.banner-item02 .banner-itemh {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: rgb(103 104 32 / 80%);
	width: 0%;
	height: 0%;
	border-radius: 20%;
	mix-blend-mode: multiply;
}
.banner-item02:hover .banner-itemh {
	position: absolute;
	width: 200%;
	height: 200%;
	transition: 0.3s;
}
.banner-item02:hover p {
	background-color: transparent;
	transition: 0.3s;
}


.banner-item03 {
	position: relative;
	height: 150px;
    background-image: url(img/bg-orgmj.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.banner-item03 p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
    font-size: 20px;
    background-color: rgb(62 115 119 / 80%);
    padding: 5px 20px;
	width: 60%;
	line-height: 1.5;
    text-align: center;
}
.banner-item03 .banner-itemh {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: rgb(62 115 119 / 80%);
	width: 0%;
	height: 0%;
	border-radius: 20%;
	mix-blend-mode: multiply;
}
.banner-item03:hover .banner-itemh {
	position: absolute;
	width: 200%;
	height: 200%;
	transition: 0.3s;
}

.banner-item03:hover p {
	background-color: transparent;
	transition: 0.3s;
}



.social-links {
    margin-top: 2rem;
}

footer .social-links a {
   	display: inline-block;
    width: 50px;
    height: 50px;
    background-color: #aaaaaa;
    border-radius: 50%;
    text-align: center;
    line-height: 46px;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

footer .social-links a:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-3px);
}
footer .social-links .bi::before, footer [class^="bi-"]::before, footer [class*=" bi-"]::before {
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c2c2c;
    font-size: 21px;
    top: 10px;
}

.copyright {
    text-align: center;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid #444;
    color: #777;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .page-hero h1 {
        font-size: 2rem;
    }
    
    .form-container {
        padding: 2rem 1.5rem;
    }
    
    .btn-submit {
        padding: 0.9rem 2rem;
    }
}

/* contact　ここまで */

/*　P-03style  ================================================================================= */
.l-page-title.p-03 .bg-pagetitle_img {
    min-height: 80vh;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
@media (min-width: 992px) {
	.l-page-title.p-03 .bg-pagetitle_img {
		min-height: 500px;
		background-position: right center;
	}
}

.l-page-title.p-03 {
    position: relative;
}

@media (max-width: 991px) {
	.l-page-title.p-03 h1 {
	    font-weight: bold;
	    font-size: clam1.25rem, 0.8rem + 1vw, 2rem);
	    position: absolute;
	    z-index: 2;
	    bottom: 0;
        left: 0%;
	    -webkit-transform: translate(0%, 0%);page-break-before: ;
	    -moz-transform: translate(0%, 0%);
	    transform: translate(0%, 0%);
	    width: 100%;
	}

	.sp-overlay {
		background: linear-gradient(180deg, rgb(103 104 32 / 0%), #003314);
		opacity: 0.7;
	    position: absolute;
	    z-index: 1;
	    bottom: 0;
	    left: 0%;
	    -webkit-transform: translate(0%, 0%);
	    -moz-transform: translate(0%, 0%);
	    transform: translate(0%, 0%);
	    width: 100%;
	    height: 100%;
	    mix-blend-mode: multiply;
	    border-radius: 5px;
	}
}

@media (min-width: 992px) {
	.l-page-title.p-03 h1 {
	    font-weight: bold;
	    font-size: clamp(1.25rem, 0.8rem + 1vw, 2rem);
	    position: absolute;
	    z-index: 2;
	    top: 50%;
	    left: 50%;
	    -webkit-transform: translate(-50%, -50%);
	    -moz-transform: translate(-50%, -50%);
	    transform: translate(-50%, -50%);
	    width: 100%;
	}
}

.post-template-default .l-page-title.p-03,
.category-news .l-page-title.p-03 {
	height: 350px;
}
@media (min-width: 992px) {
	.post-template-default .l-page-title.p-03,
	.category-news .l-page-title.p-03 {
		height: 400px;
	}
}
.post-template-default .l-page-title.p-03 .bg-defalut,
.category-news .l-page-title.p-03 .bg-defalut {
	background-image: url(img/page-default01.jpg);
	background-size: cover;
	background-position: center center;
	position: absolute;
	width: 100%;
	height: 100%;
}

.post-template-default .l-page-title.p-03 h1,
#news .l-page-title.p-03 h1 {
	text-align: center;
	font-weight: bold;
    font-size: clamp(1.5rem, 1.182rem + 1.59vw, 2.375rem);
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: fit-content;
}
.post-template-default .l-page-title.p-03 h1 span {
	color: #676820;
	position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.post-template-default .l-page-title.p-03 h1 span::after {
	display: block;
	content: "news";
	font-family: "Playfair Display SC", serif;
	color: #676820;
	font-size: 15px;
	margin-top: 10px;
}

.post-template-default .l-page-title.p-03 .sp-overlay,
#news .l-page-title.p-03 .sp-overlay {
	display: none;
}

.page-titlebox {
	margin: 15px auto;
}
@media (min-width: 768px) {
	.page-titlebox {
		margin: 30px auto;
	}
}
@media (min-width: 1200px) {
	.page-titlebox {
		margin: 0px auto;
		max-width: 1140px;
	}
}

.page-title {
	font-size: clamp(1.5rem, 1.182rem + 1.59vw, 2.375rem);
}

.page-eigo {
	font-size: clamp(1.5rem, 1.182rem + 1.59vw, 2.375rem);
	font-family: "Playfair Display SC", serif;
	font-weight: 700;
	font-style: normal;
}

.page-sentence {
	font-size: clamp(0.875rem, 0.83rem + 0.23vw, 1rem);
	font-weight: normal;
	line-height: 2.0;
	letter-spacing: 2.0;
}
@media (min-width: 992px) {
	.page-sentence {
		width: 500px;
	}
}


/* =================================================================================　P-03style  */
.footer-address {
	color: #aaa;
    text-decoration: none;
    transition: color 0.3s;
}

.copyright p {
    text-align: center;
    color: #777!important;
}

.breadcrumb {
    padding: 1.5rem 0;
}
.breadcrumb a.home {
    color: var(--primary-color);
    text-decoration: none;
}

.playfair-display-sc-bold {
  font-family: "Playfair Display SC", serif;
  font-weight: 700;
  font-style: normal;
}

.playfair-display-sc-black {
  font-family: "Playfair Display SC", serif;
  font-weight: 900;
  font-style: normal;
}

p.lead-text {
    font-size: 1.3rem;
    color: var(--secondary-color);
    font-weight: 600;
    margin-bottom: 2rem;
    line-height: 1.8;
}

.strong-box {
	padding: 0 20px 30px 20px;
	margin-top: -40px;
	position: relative;
	z-index: 3;
}
@media (min-width: 992px) {
	.strong-box {
		padding: 0 30px 40px 30px;
	}
}

section h2 {
  font-size: 6rem;
  padding: 1rem;
}
section h2 span {
  font-size: 7rem;
}
.layer {
  margin-top: 0;
}
.layer .panel {
  height: 130vh;
  position: relative;
  margin: 10px;
}
@media (min-width: 768px) {
	.layer .panel {
	  margin: 20px;
	}
}
.layer .panel figure {
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 130vh;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}
@media (max-width: 768px) {
  .layer .panel figure {
    background-attachment: scroll;
    height: 90vh;
  }
  .layer .panel {
    height: 90vh;
  }
}

.layer .panel .title_desc {
  color: #000000;
  margin-left: auto;
  max-width: 40ch;
}
.layer .panel .title_desc h3 {
  font-size: 3rem;
  padding-top: 2rem;
}
.layer .panel .title_desc p {
  font-size: 1rem;
  padding-top: 1rem;
}
.layer .panel:first-of-type figure {
  background-image: url(img/front-oemitem.jpg);
}
.layer .panel:nth-of-type(2) figure {
  background-image: url(img/front-oemitem2.jpg);
}
.layer .panel:nth-of-type(3) figure {
  background-image: url(img/front-oemitem3.jpg);
}
.layer .panel:nth-of-type(odd) .title_desc {
  color: #ffffff;
  margin-left: 0;
  margin-right: auto;
  padding-left: 2rem;
}
.layer .panel:nth-of-type(even) {
  padding-right: 2rem;
}

a:hover .yajirushi {
    transform: scaleX(2.0) translateX(20px);
}

.service-content01 {
	position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    text-align: center;
    max-width: 900px;
    padding: 2rem;
}
@media (min-width: 768px) {
	.service-content01 {
		padding: 3rem;
	}
}
.service-content01 h2 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
}
@media (max-width: 576px) {
	.service-content01 h2 {
    	font-size: 2.2rem;
    }
}
.service-content01 .service-label {
    display: inline-block;
    background-color: rgb(52 121 75);
    color: #fff;
    padding: 0.5rem 2rem;
    border-radius: 0;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 2rem;
    border-radius: 30px;
}
.service01-overray {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(139, 115, 85);
	mix-blend-mode: multiply;
}


.service-content02 {
	position: absolute;
    z-index: 2;
    top: 50%;
    left: 0%;
    width: 100%;
    transform: translate(0%, -50%);
    max-width: 900px;
    padding: 2rem;
    text-align: center;
}
@media (min-width: 768px) {
	.service-content02 {
		left: 10%;
		text-align: start;
		padding: 3rem;
	}
}
.service-content02 h2 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
}
@media (max-width: 576px) {
	.service-content02 h2 {
    	font-size: 2.2rem;
    }
}
.service-content02 .service-label {
    display: inline-block;
    background-color: rgb(52 121 75);
    color: #fff;
    padding: 0.5rem 2rem;
    border-radius: 0;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 2rem;
    border-radius: 30px;
}
.service02-overray {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgb(164 167 128);
	mix-blend-mode: multiply;
}

.service-content03 {
	position: absolute;
    z-index: 2;
    top: 50%;
    right: 0%;
    width: 100%;
    transform: translate(0%, -50%);
    max-width: 900px;
    padding: 2rem;
    text-align: center;
}
@media (min-width: 768px) {
	.service-content03 {
		right: 10%;
		text-align: end;
		padding: 3rem;
	}
}
.service-content03 h2 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
}
@media (max-width: 576px) {
	.service-content03 h2 {
    	font-size: 2.2rem;
    }
}
.service-content03 .service-label {
    display: inline-block;
    background-color: rgb(52 121 75);
    color: #fff;
    padding: 0.5rem 2rem;
    border-radius: 0;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 2rem;
    border-radius: 30px;
}
.service03-overray {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(128 167 155);
	mix-blend-mode: multiply;
}

.logo-white {
	width: 80%;
}

.eigo {
	font-family: "Playfair Display SC", serif;
	color: #aea347;
}
.text-kin {
	color: #aea347;	
}


.img-wrap {
  clip-path: circle(0 at 50% 50%);
  -webkit-clip-path: circle(0 at 50% 50%);
}

.img-wrap.is-active {
  animation: img-wrap 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes img-wrap {
  to {
    clip-path: circle(100% at 50% 50%);
    -webkit-clip-path: circle(100% at 50% 50%);
  }
}


.img-wrap-updown {
  position: relative;
  overflow: hidden;
  clip-path: inset(100% 0 0 0);
}

.img-wrap-updown.is-active {
  animation: reveal-top 1.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes reveal-top {
  to {
    clip-path: inset(0 0 0 0);
  }
}

#toPageTop a:hover {
    background-color: #327a4e;
}

.drnature-logo {
	width: 70%;
	display: block;
	margin: 0 auto;
}
@media (min-width: 768px) {
	.drnature-logo {
		width: 60%;
	}
}
@media (min-width: 1200px) {
	.drnature-logo {
		width: 500px;
	}
}

.bg-soudan {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(img/bg-soudan.jpg);
	background-size: cover;
	background-position: center center;
	mix-blend-mode: overlay;
}

.bg-hamon2 {
    padding: 5rem 0;
    background-image: url(img/bg-hamon2.jpg);
    background-size: cover;
    background-position: center center;
}

/*.tejyun-checkmark {
	width: 18px;
	margin: 0;
	display: inline-block;
}*/

.tejyun-naiyou li {
  padding-left: 26px; /* 18px(アイコン幅) + 8px(margin-right) */
  position: relative;
}

.tejyun-naiyou li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em; /* テキストの高さに合わせて微調整 */
  width: 18px;
  height: 18px;
  background-image: url(img/SVG/checkmark.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

#voice .faq-container {
    max-width: 800px;
    margin: 0 auto;
}

#voice .faq-container .faq-item {
    background: white;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#voice .faq-container .question {
    padding: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-weight: 600;
    color: var(--primary-color);
    transition: background 0.3s;
    background: #f5f5db;
}

#voice .faq-container .question span {
	color: var(--primary-color);
	line-height: 1.3;
}

#voice .faq-container .question::after {
    content: '+';
    font-size: 24px;
    color: #666;
    transition: transform 0.3s;
	margin-left: auto;
}

#voice .faq-container .question.active::after {
    transform: rotate(90deg);
}

#voice .faq-container .answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

#voice .faq-container .answer-content {
    padding: 20px;
    color: #666;
    line-height: 1.6;
}

#faq section h2 span {
	font-size: 1.2rem;
	line-height: 1.4;
}

#faq .category-header.category01 {
	background-image: url(img/faqcatego01img.jpg);
	background-size: cover;
	background-position: center center;
	margin-bottom: 0;
}
#faq .category-header.category02 {
	background-image: url(img/faqcatego02img.jpg);
	background-size: cover;
	background-position: center center;
	margin-bottom: 0;
}
#faq .category-header.category03 {
	background-image: url(img/faqcatego03img.jpg);
	background-size: cover;
	background-position: center center;
	margin-bottom: 0;
}
#faq .category-header.category04 {
	background-image: url(img/faqcatego04img.jpg);
	background-size: cover;
	background-position: center center;
	margin-bottom: 0;
}
#faq .category-header.category05 {
	background-image: url(img/faqcatego05img.jpg);
	background-size: cover;
	background-position: center center;
	margin-bottom: 0;
}


/* ここから　プライバシーポリシー　*/
    .privacy-policy-block {
        max-width: 900px;
        margin: 0 auto;
        padding: 40px 20px;
        background-color: #fff;
    }
    
    .privacy-policy-title {
        font-size: 2.5rem;
        color: var(--primary-color);
        margin-bottom: 30px;
        padding-bottom: 15px;
        text-align: center;
        font-weight: bolder;
    }

    .privacy-policy-part-title {
        font-size: 1.4rem;
        color: var(--primary-color);
        margin-top: 40px;
        margin-bottom: 20px;
        padding-left: 10px;
    }

    .privacy-policy-part-subtitle {
        font-size: 1.1rem;
        color: #444;
        margin-top: 25px;
        margin-bottom: 15px;
        font-weight: bolder;
    }

    .privacy-policy-part {
        margin-bottom: 15px;
        text-align: justify;
    }

    .section {
        margin-bottom: 30px;
    }

    .subsection {
        margin-left: 20px;
        margin-bottom: 15px;
    }

    .item {
        margin-bottom: 10px;
        padding-left: 1.5em;
        text-indent: -1.5em;
        margin-left: 1.5em;
    }

    .contact-info {
        background-color: #f9f9f9;
        padding: 20px;
        border-radius: 5px;
        margin-top: 20px;
    }

    a {
        color: var(--primary-color);
        text-decoration: none;
    }

    a:hover {
        text-decoration: underline;
    }

    .link-list {
        margin-left: 20px;
    }

    .link-list li {
        margin-bottom: 8px;
    }

/* ここまで　プライバシーポリシー */

.seizou-staff {
	background-image: url(img/tejyunimg08.jpg);
	background-size: cover;
	background-position: center center;
	min-height: 350px;
}

.seizou-staff2 {
	background-image: url(img/seizou-staff2.jpg);
	background-size: cover;
	background-position: center center;
	min-height: 350px;
}

.seizou-staff3 {
	background-image: url(img/oem-item01.jpg);
	background-size: cover;
	background-position: center center;
	min-height: 350px;
}

.seizou-staff4 {
	background-image: url(img/seizou-staff4.jpg);
	background-size: cover;
	background-position: center center;
	min-height: 350px;
}

@media (min-width: 992px) {
	#company .page-titlebox {
		background-color: #327a4e;
	    width: fit-content;
	    position: absolute;
	    left: 0;
	    transform: translate(-0%, -50%);
	    border-radius: 0 10px 10px 0;
	    padding-left: 50px !important;
	    padding-right: 50px !important;
	}
}

.company-info-section .info-table th {
	vertical-align: middle;
}

#privacy-policy .page-title {
	color: #676820;
}

#toPageTop a {
    display: block;
    width: 40px;
    height: 50px;
    font-size: 30px;
    background-color: #327a4e;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
#toPageTop {
    position: fixed;
    bottom: 0rem;
    right: 0rem;
    z-index: 9998;
}

.news-list-title {
	text-align: center;
    font-weight: bold;
    font-size: clamp(1.5rem, 1.182rem + 1.59vw, 2.375rem);
    color: #676820;
}

.news-list-titleeigo {
	display: block;
    font-family: "Playfair Display SC", serif;
    color: #676820;
    font-size: 15px;
    margin-top: 10px;
    text-align: center;
    margin-bottom: 0;
}

.btn-primary {
	background-color: #327a4e;
}

.btn:hover {
    background-color: #676820;
}

.saishin-post:before {
	font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f061";
    width: 13px;
    margin-right: 10px;
}

.bg-categotitle {
	background-color: #676820;
}

.wpcf7-submit.btn-submit {
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    color: #fff;
    padding: 1rem 4rem;
    border-radius: 50px;
    border: none;
    font-weight: 600;
    font-size: 1.1rem;
    width: 100%;
    max-width: 400px;
    display: block;
    margin: 2rem auto 0;
    box-shadow: none;
}