@charset "utf-8";

.about{
	background-color: #eaeaea;
}

.about .wrap{
	height: auto;
	padding: 40px 0 60px;
}
.about .wrap2{
	height: auto;
	padding: 60px 0 40px;
}
.about .wrap .index{
	margin-bottom: .5em;
}

.about .wrap .image {
	margin-top: 48px;
}
@media screen and (max-width: 1070px){
	.about .wrap .index {
		font-size: 6.667vw;
	}
	.about .wrap .read {
		font-size: 4vw;
		text-align: center;
	}
}




.about2{
	background-color: #ffffff;
}

.about2 .wrap{
	height: auto;
	padding: 50px 0 40px; /* 上部76px→50px、下部64px→40pxに縮小 */
}

.about2 .wrap .index{
	margin-bottom: .8em;
}

.about2 .wrap .image {
	margin-top: 20px;
    margin-bottom: 60px;
}

.about3{
	background-color: #fdfaf5;
}

.about3 .wrap{
	height: auto;
	padding: 50px 0 40px; /* 上部76px→50px、下部64px→40pxに縮小 */
}

/* 変更: section02の上部paddingを大幅に縮める */
/* 構造: .wrap2(見出し) + .wrap(本文) の2段構成 */
#section-history .wrap2 {
    padding-bottom: 0; /* 見出し下の余白を削除 */
    padding-top: 30px; /* 上部は少し空ける */
}

#section-history .wrap {
    padding-top: 30px; /* 本文上の余白を縮小 (元76px) */
}


.about3 .wrap .index{
	margin-bottom: .8em;
}

.about3 .wrap .image {
	margin-top: 20px;
    margin-bottom: 60px;
}
@media screen and (max-width: 1070px){
	.about2 .wrap .index {
		font-size: 6.667vw;
	}
	.about2 .wrap .read {
		font-size: 4vw;
		text-align: center;
	}
	.about3 .wrap .index {
		font-size: 6.667vw;
	}
	.about3 .wrap .read {
		font-size: 4vw;
		text-align: center;
	}
}


/*--------------------------------------------------------------------*/

.pl_more_awabancha-extract-powder{
	margin-bottom: 0;
	background: none;
}

.pl_more_awabancha-extract-powder > .container{
	background-image: url("../img/awabancha-extract-powder/awabancha_001.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.awabancha-extract-powder.pl_top_articles article{
	padding-top: 0;
}

/*--------------------------------------------------------------------*/

.sections{
	padding-bottom: 0 !important;
}

.sections section.box:nth-of-type(odd){
	background-color: #FDFAF5;
}

.sections section.box:nth-of-type(even){
	background-color: #FFF8EA;
}

/* セクション5（content2 box）の背景を白色に */
section.content2.box {
	background-color: #ffffff !important;
}

/*--------------------------------------------------------------------*/

section.box{
	padding: 60px 0; /* 100px→60pxに縮小 */
}

section.box .intro{
	margin-bottom: 15px;
}

section.box .intro .index{
	margin-bottom: .8em;
}

section.box .intro .text{
	max-width: 450px;
	width: 48%;
}

/*--------------------------------------------------------------------*/

section.box .panel{
	width: 100%;
	padding: 4em;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	background-color: #fff;
	border-radius: 1.2em;
	-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.16);
	        box-shadow: 0 3px 6px rgba(0,0,0,.16);
}

section.box .panel:last-of-type{
	margin-bottom: 20px;
}

section.box .panel .title{
	color: #7D7D85;
	margin-bottom: 32px;
	font-size: 1.9rem;
}

section.box .panel .bottom{
	color: #9D9292;
	margin-top: 3em;
	text-align: left !important;
}

section.box .panel cite{
	font-style: normal;
	font-weight: normal;
}

/*--------------------------------------------------------------------*/

section.box .text p{
	margin-bottom: 2em;
}

section.box .read p{
	margin-bottom: 1em;
}

/*--------------------------------------------------------------------*/

.nmn.pl_awabancha-extract-powder{
	background-color: #F7F4F2;
}

/*--------------------------------------------------------------------*/

section.box.content2 .note_ttl {
					margin-bottom: 0;
					color: #9D9292;
				}

section.box.content2 .note ul li {
						margin-left: 1em;
						text-indent: -1em;
						line-height: 1.5;
						color: #9D9292;
						font-size: 1.2rem;
						font-weight: 400;
						letter-spacing: 0;
					}

/*--------------------------------------------------------------------*/

@media screen and (min-width: 1071px) and (max-width: 1024px){
	.about .read {
		text-align: left;
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}
	.about .read br.pc {
		display: none;
	}
	.pl_more_awabancha-extract-powder > .container .head .sub br{
		display: block!important;
	}
	
	.about2 .read {
		text-align: left;
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}
	.about2 .read br.pc {
		display: none;
	}
	.about3 .read {
		text-align: left;
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}
	.about3 .read br.pc {
		display: none;
	}
	.pl_more_awabancha-extract-powder > .container .head .sub br{
		display: block!important;
	}
}

@media screen and (min-width: 1071px){
	.about .inner1175 {
		max-width: 1175px;
		width: 90%;
	} 
	.about .image img {
		width: 452px;
	}
	
	.about2 .inner1175 {
		max-width: 1175px;
		width: 90%;
	} 
	.about2 .image img {
		width: 452px;
	}
	.about3 .inner1175 {
		max-width: 1175px;
		width: 90%;
	} 
	.about3 .image img {
		width: 452px;
	}
	.pl_more_awabancha-extract-powder > .container .head .sub{
		font-size: 26px;
	}
	section.box .intro {
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
	}
	section.box .intro:last-of-type {
		margin-bottom: 30px;
	}
	section.box .intro .index {
		margin-bottom: 40px;
	}
	section.box .intro .panel {
		width: 50%;
	}
	section.box.content5 .intro .panel img {
		width: 100%;
	}
			section.box.content1 {
				padding-top: 117px;
			}
					section.box.content1 .intro .panel {
						padding: 32px;
					}
						section.box.content1 .intro:nth-of-type(1) .panel {
							width: 100%;
						}
			section.box.content2 {
				padding: 50px 0 60px; /* 上部60px、下部97px→60pxに統一 */
			}
			
			/* セクション04（科学的検証）の上部マージンをさらに調整 */
			#section-research.content2.box {
				padding-top: 40px; /* さらに上部マージンを縮小 */
			}
					section.box.content2 .intro .panel {
						padding: 37px 39.5px 33px 40.5px;
					}
					section.box.content3 .intro .panel {
						padding-top: 0;
						padding-bottom: 0;
					}
						section.box.content3 .intro .panel img {
							width: 299px;
						}
			section.box.content4 {
				padding-top: 105px;
			}
					section.box.content4 .intro .panel {
						padding: 0 87px 0 104px;
					}
}

@media screen and (max-width: 1070px){
	.about .wrap{
		height: auto;
		padding: 30px 7.3vw;
	}
	.about .read {
		text-align: left;
	}
	
	.about2 .wrap{
		height: auto;
		padding: 75px 7.3vw;
	}
	.about2 .read {
		text-align: left;
	}
	.about3 .wrap{
		height: auto;
		padding: 75px 7.3vw;
	}
	.about3 .read {
		text-align: left;
	}
	.pl_more_awabancha-extract-powder > .container{
		background-image: url("../img/awabancha-extract-powder/awabancha_001.png");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		height: 80vw;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.pl_more_awabancha-extract-powder > .container .head{
		margin-bottom: 0;
	}
	.pl_more_awabancha-extract-powder > .container .head .sub{
		font-size: 4.8vw;
	}
	.pl_more_awabancha-extract-powder > .container .head .fs_73{
		font-size: 9.3vw;
	}
	section.box.content2 .note_ttl {
		font-size: 2.933vw;
	}
	section.box.content2 .note ul li {
		font-size: 2.933vw;
	}
	.awabancha-extract-powder.pl_top_articles article .content4 .intro{
		margin-bottom: 2em;
	}
	.sections{
		padding: 0 !important;
	}
	section.box{
		padding: 75px 7.3vw;
	}
	section.box .intro{
		margin-bottom: 20px;
	}
	section.box .intro .index {
		font-size: 6.667vw;
	}
	section.box .intro .read {
		font-size: 3.733vw;
	}
	section.box .intro .text{
		max-width: none;
		margin-bottom: 2em;
	}
	section.box .intro .text:last-of-type {
		margin-bottom: 20px;
	}
	section.box .panel{
		padding: 9.333vw 4vw 6.667vw;
		margin-bottom: 2em;
		box-sizing: border-box;
	}
	section.box .panel .title{
		font-size: 4vw;
		margin-bottom: 1em;
		line-height: 1.4;
	}
	section.box .panel .bottom{
		font-size: .8rem;
	}
	section.box.content1 .intro:nth-of-type(1) .panel {
		margin-bottom: 2em;
	}
	section.box .panel cite {
		font-size: 3.2vw;
		line-height: 1.4;
		letter-spacing: 0;
	}
	.mt2em {
		margin-top: 2em;
	}
	/* スマホ表示時の画像の上下余白を調整 */
	section.box .panel .image {
		margin-top: 0;
		margin-bottom: 0;
	}
	section.box .panel .image img {
		margin-top: 0;
		margin-bottom: 0;
	}
}

@media screen and (min-width: 1071px) and (max-width: 980px){
	.intro.flex {
		display: block;
	}
	section.box .panel {
		width: 94vw!important;
		margin-bottom: 2em;
	}
	section.box .intro .text {
		width: 100%!important;
		max-width: 100%;
	}

}






.story-section {
  background-color: #4f4136;
  color: #fff;
  padding: 50px 0; /* 80px→50pxに縮小 */
}

.story-container {
  width: 90%;
  max-width: 980px;
  margin: 0 auto;
}

.story-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px; /* 60px→40pxに縮小 */
  gap: 40px;
}

.story-block.reverse {
}

.story-text {
  flex: 1;
  width: 40%; /* ベース幅 */
  font-size: 1.6rem;
  line-height: 2;
	font-weight: 400;
}

.story-image {
  flex: 1;
  width: 60%; /* ベース幅 */
}

.story-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* --- スマホ表示時 --- */
@media screen and (max-width: 1070px) {
  .story-block {
    flex-direction: column;
    margin-bottom: 60px;
    gap: 20px;
  }

  /* スマホ時は画像 → テキストの順 */
  .story-block .story-image {
    order: 1;
    width: 100%; /* 幅100%に */
    flex: auto;
  }

  .story-block .story-text {
    order: 2;
    width: 100%; /* 幅100%に */
    flex: auto;
    font-size: 3.733vw;
    margin-top: 0px;
  }

  .story-container {
    width: 90%;
  }
}





.profile-section {
  background-color: #fdfaf5; /* about3と同じベージュ色に変更 */
  color: #000;
  padding: 50px 10px; /* 80px→50pxに縮小 */
}

.profile-container {
  width: 980px;
  max-width: 100%;
  margin: 0 auto;
}

.profile-block {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 50px; /* 80px→50pxに縮小 */
}

.profile-image {
  flex: 0 0 300px; /* 画像の固定幅（必要に応じて調整） */
}

.profile-image img {
  width: 100%;
  height: auto;
  display: block;
  background-color: #ccc; /* 画像がない時に背景をグレーに */
}

.profile-text {
  flex: 1;
  font-size: 15px;
  line-height: 1.8;
}

/* スマホ表示 */
@media screen and (max-width: 768px) {
  .profile-block {
    flex-direction: column;
    gap: 20px;
    margin-bottom: 60px;
  }

  .profile-image {
    flex: none;
    width: 100%;
  }

  .profile-text {
    font-size: 14px;
  }

  .profile-container {
    width: 90%;
  }
}



.button-29 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 350px;
    margin: 0 auto;
    padding: .9em 2em;
    overflow: hidden;
    border: 1px solid #4f4136;
    border-radius: 5px;
    background-color: #fff;
    color: #000;
    font-size: 1.6rem;
    cursor: pointer;
    text-decoration: none;
    transition: all .3s ease;
    margin-top: 40px;
    opacity: 1 !important; /* ホバー時も透明にならない */
}

/* ホバー時のスタイル：背景色と文字色を変更 */
.button-29:hover {
    background-color: #4f4136;
    color: #fff;
    border-color: #4f4136;
}

/* ← 背景アニメーションを削除（::before部分） */
.button-29::before {
    content: none;
}

/* 矢印 */
.button-29::after {
    content: "→";
    margin-left: 8px;
    transition: transform 0.3s ease;
}

/* 矢印だけ動く */
.button-29:hover::after {
    transform: translateX(5px);
}

.button-29 span {
    position: relative;
    z-index: 1;
}

/* スマホ表示 */
@media screen and (max-width: 768px) {
    .button-29 {
        width: fit-content;
        font-size: 1.4rem;
        margin-top: 40px;
    }
}


.border1{border: 1px solid #e2e2e2;}

.border2{border: 1px solid #e2e2e2;
margin-top:20px;
margin-bottom:20px;}

/* border2とsection-dividerは不要なため削除済み */

/* =========================================
   Additional Styles for Awabancha Extract
   ========================================= */

/* toc-nmn styles */
.toc-nmn {
	margin: 40px 0 30px; /* 上部60px→40px、下部50px→30pxに縮小 */
	padding: 0 20px;
}
.toc-nmn__inner {
	background: #fff;
	border: 1px solid #e7ded5;
	border-radius: 18px;
	box-shadow: 0 12px 24px rgba(41, 35, 28, 0.08);
	padding: 32px 40px;
}
.toc-nmn__title {
	margin: 0 0 18px;
	color: #7a5837;
	text-align: center;
}
.toc-nmn__guide {
    text-align: center;
    margin-bottom: 24px;
    color: #9d9292;
}
.toc-nmn__list {
	counter-reset: toc;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr); /* PC表示時は2列に固定 */
	gap: 18px 30px;
	justify-items: start; /* 各項目を左揃え */
	max-width: 700px; /* 最大幅を制限して中央に配置 */
	margin-left: auto;
	margin-right: auto;
}
.toc-nmn__list li {
	counter-increment: toc;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-weight: 500;
}
.toc-nmn__list li::before {
	content: counter(toc, decimal-leading-zero);
	font-size: 0.9em;
	color: #c09a58;
	font-weight: 700;
	line-height: 1;
	margin-top: 3px;
}
.toc-nmn__list a {
	color: #23170d;
	text-decoration: none;
	line-height: 1.6;
	transition: color .2s ease;
}
.toc-nmn__list a:hover,
.toc-nmn__list a:focus {
	color: #c09a58;
	text-decoration: underline;
}
.toc-nmn__list a sup {
	font-size: 0.6em;
}

@media screen and (max-width: 1070px) {
	.toc-nmn {
		margin: 40px 0 35px;
		padding: 0 5.5vw;
	}
	.toc-nmn__inner {
		padding: 24px;
		border-radius: 14px;
	}
	.toc-nmn__title {
		font-size: 5.6vw;
		margin-bottom: 16px;
	}
    .toc-nmn__guide {
        font-size: 3.2vw;
        margin-bottom: 20px;
    }
	.toc-nmn__list {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.toc-nmn__list li {
		font-size: 4.2vw;
		gap: 10px;
	}
}

/* image-grid styles */
.image-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 20px;
}

.image-item {
	width: 100%;
}

.image-item img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

/* image-full-width styles */
.image-full-width {
	width: 100%;
	max-width: 600px; /* PCでの最大幅制限 */
	margin: 0 auto 20px;
	text-align: center;
}

.image-full-width img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

@media screen and (max-width: 768px) {
	.image-grid {
		grid-template-columns: 1fr;
	}
	.image-full-width {
		max-width: 100%; /* SPでは全幅 */
	}
}

/* profile-image transparent background */
.profile-image img[alt="株式会社AutoPhagyGOのロゴ"] {
    background: transparent;
    mix-blend-mode: multiply;
}

/* FV section text color */
.pl_more_awabancha-extract-powder > .container .head .main,
.pl_more_awabancha-extract-powder > .container .head .main h1 {
	color: #fff;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* summary-list styles for LLMO optimization */
.summary-list {
	background: #ffffff; /* 背景を白に変更 */
	padding: 25px 25px 25px 45px;
	border-radius: 10px;
	border-left: 4px solid #c09a58;
	margin: 25px auto;
	max-width: 800px;
	text-align: left;
	list-style-type: disc;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.summary-list li {
	margin-bottom: 12px;
	line-height: 1.8;
	font-size: 1.05em;
	color: #333;
}

.summary-list li:last-child {
	margin-bottom: 0;
}

.summary-list li strong {
	color: #7a5837;
	font-weight: 600;
}

/* closing-text style */
.closing-text {
    max-width: 800px; /* 他のセクション（summary-list等）と同じ幅に統一 */
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* Section Divider - 不要なため削除済み */