/* ==========================================================================
   冬のおすすめ生地特集 2026（autumn2026.css をベースに作成）
   ・クラス名 autumn2026 → winter2026
   ・カラー：#8c7962（ブラウン）→ #666666 / #eee9e3（ベージュ）→ #eeeeee
   ・6. ウィンターリネン バナー / 7. FAQ内リンクボタン を追加
   ========================================================================== */

/* ==========================================================================
   1. 見出し・基本テキスト共通スタイル
   ========================================================================== */
.winterlinen2025 h3	{
  margin : unset!important;
}
.winterlinen2025 h3.anchor{
z-index: initial;
pointer-events: none; 	
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP", serif!important;
text-align: left !important;	
}

/*h3 {
	font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP", serif;
	text-align: left !important;
}*/

.h3-lead {
	font-size: 16px;
    padding: 10px 0;
    font-weight: normal;
    font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho ProN", YuMincho, "Yu Mincho", "Noto Serif JP", serif !important;
    line-height: 180%;
	letter-spacing: 1px;
	margin: 35px 0;
}

.faq_2026spring h3 {
	font-family: "Quasimoda", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシックPro W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "Yu Gothic Medium", "メイリオ", Meiryo, Osaka, sans-serif !important;
	font-weight: normal !important;
}

.inside_margin {
margin: 60px auto 0 210px;
}

/* ==========================================================================
   2. 「生地の森が大切にしているものづくり」セクション
      (.container-winter2026 / .fade_winter2026 / .image-text / .sub-text)
   ========================================================================== */

.container-winter2026 {
  width: 850px;
  max-width: 100%;
  margin: 70px auto 100px;
  background: #eeeeee;
  padding: 80px 20px 10px;
	box-sizing: border-box;
}

.container-winter2026 .product-image {
	margin-bottom: 70px;
    display: flex;
    justify-content: center;
	font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP", serif;
}

.container-winter2026 .img-row {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin: 0 0 90px;
}

/* 行全体 */
.fade_winter2026 {
  position: relative;
  display: flex;
  width: 100%;
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 1s ease, transform 1s ease;
}

.fade_winter2026.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 画像カラム・テキストカラム 各50% */
.fade_winter2026 .img-wrap,
.fade_winter2026 .text-wrap {
  width: 50%;
}

.fade_winter2026 .text-wrap {
  position: relative; /* ここがテキストの配置基準 */
}

/* 奇数行:画像→テキスト / 偶数行:テキスト→画像 */
.fade_winter2026:nth-child(odd) {
  flex-direction: row-reverse;
}
.fade_winter2026:nth-child(even) {
  flex-direction: row;
}

.fade_winter2026 img {
  width: 100%;
  display: block;
}

.image-text,
.sub-text {
  font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP";
  position: absolute;
  width: 100%; /* テキストカラム(50%分)いっぱいを基準に、topとleftで自由配置 */
}

.image-text {
  top: 140px;
  left: 60px;
  font-size: 70px;
  font-weight: bold;
  color: #111111;
}

.sub-text {
  top: 220px;
  left: 60px;
  width: 50%;
}

.fade_winter2026:nth-child(even) .sub-text {
  left: 465px;
}

/* 「染・加工」は4文字のため改行させない */
.container-winter2026 .row-box03 .image-text {
  white-space: nowrap;
}


/* ==========================================================================
   3. 綿麻・ガーゼ 共通セクション (.cottonlinen-showcase / .gauze-showcase)
   ========================================================================== */
.cottonlinen-showcase,
.gauze-showcase {
  max-width: 100%;
  margin: 0 auto 100px;
}

.cottonlinen-showcase h4.group-title {
 margin: 50px auto;
 width: fit-content;
 font-size: 20px;
 display: flex;
 align-items: center;
 gap: 15px;
 font-weight: normal;	
}
.cottonlinen-showcase h4.group-title::before,
.cottonlinen-showcase h4.group-title::after {
  content: "";
  flex: 1;             /* 伸ばせるだけ伸ばす */
  width: 50px;         /* 線の長さ（固定したい場合） */
  height: 1px;         /* 線の太さ */
  background-color: #333;
}

.cottonlinen-list,
.gauze-list	{
  display: flex;
  flex-direction: column;
  gap: 70px;
  margin-bottom: 90px;
}

.cottonlinen-item,
.gauze-item	{
  display: flex;
  align-items: center;
  gap: 50px;
  flex-direction: column;
}

.cottonlinen-showcase .image-box,
.gauze-showcase .image-box {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: baseline;
}

.cottonlinen-showcase .image-box.img-right,
.gauze-showcase .image-box.img-right {
  flex-direction: row-reverse;
}

.cottonlinen-item .item-img,
.gauze-item .item-img	{
  width: 54.5%;
  flex-shrink: 0;
}

.cottonlinen-item .item-img img,
.gauze-item .item-img img 	{
  width: 100%;
  display: block;
}

.cottonlinen-item .item-body,
.gauze-item .item-body {
  width: 100%;
    display:flex;
    align-items: flex-end;
    margin-bottom: 50px;
    justify-content: space-between;
	padding: 0 20px;
}

.cottonlinen-item .item-body .item-link-box,
.gauze-item .item-body .item-link-box {
 width: 40%;
}

.cottonlinen-showcase .item-img-topics,
.gauze-showcase .item-img-topics {
  width: 100%;
}
.cottonlinen-showcase .item-img-topics img,
.gauze-showcase .item-img-topics img {
  width: 100%;
  display: block;
}


/* ==========================================================================
   4. ピックアップリスト（メイン商品紹介カード）セクション
      (.pickup-list / .pickup-item / .pickup-grid)
   ========================================================================== */

/* ラッパー */
.pickup-list {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* ===== 共通カードスタイル ===== */
.pickup-item {
    padding: 10px !important;
    margin: 0 !important;
}
.pickup-item img {
    display: block;
    width: 100%;
    height: 100%;
}
.pickup-item .item-body {
    padding: 24px 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.item-title {
    margin: 0 0 8px;
    font-size: 1.15em;
}

h4.item-title,
h5.item-title {
	font-size: 20px;
    text-align: left;
    font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Noto Serif JP", serif;
    font-weight: bold;
    letter-spacing: 0.5px;
}
.item-title small {
    display: block;
    background: #eeeeee;
    color: #666666;
    font-size: 0.6em;
    padding: 2px 8px;
    border-radius: 3px;
    margin-bottom: 15px !important;
    vertical-align: middle;
	width: fit-content;
	font-family: initial;
}

h5.lead,
h6.lead {
    padding: 0;
    margin: 0 !important;
    color: #000;
    font-size: 15px !important;
    line-height: 180%;
    font-family: "Quasimoda", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシックPro W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "Yu Gothic Medium", "メイリオ", Meiryo, Osaka, sans-serif;
    font-feature-settings: "palt";
	letter-spacing: 0.8px;
	text-align: left;
	font-weight: normal;
}

.item-spec {
    font-size: 13px;
    color: #777;
    margin: 0 0 10px;
}

/* --- ボタン・リンク類 --- */
.pickup-list .btn_box {
     margin: 40px 0 0 0 !important;
	 text-align: center;
}
.cottonlinen-list .btn_box,
.gauze-list .btn_box {
     margin: 0 0 0 0 !important;
	 text-align: center;
}
.pickup-list .btn_box a,
.cottonlinen-list .btn_box a,
.gauze-list .btn_box a {
    display: inline-block;
    padding: 8px 20px;
    border: 1px solid #666666;
    color: #666666;
    text-decoration: none;
    font-size: 0.85em;
    border-radius: 3px;
    transition: 0.2s;
	background: none!important;
}
.cottonlinen-list .btn_box a,
.gauze-list .btn_box a {
	margin-bottom: 15px;
	width: 80%!important;
}

.pickup-list .btn_box a:hover,
.cottonlinen-list .btn_box a:hover,
.gauze-list .btn_box a:hover
{
    background: #666666!important;
    color: #fff;
}

.pickup-list .item-body .sample-link {
    display: inline-flex;
    margin: 15px 0 0 auto;
    padding-bottom: 0px;
    font-size: 14px;
    color: #666;
    text-decoration: none;
    border-bottom: 1px solid #888;
    text-align: end;
    width: fit-content;
    flex-direction: column;
    align-items: center;
}

.cottonlinen-list .item-body .sample-link,
.gauze-list .item-body .sample-link {
    display: flex;
    margin: 0px 0 5px auto;
    padding-bottom: 0px;
    font-size: 14px;
    color: #666;
    text-decoration: none;
    border-bottom: 1px solid #888;
    text-align: revert-rule;
    width: fit-content;
    flex-direction: row;
}

/* ===== メインアイテム（1つ目・大きく目立たせる） ===== */
.pickup-item.main {
    flex-direction: row;
    align-items: stretch;
}

/* 画像3枚をコラージュ風に配置するエリア */
.pickup-item.main .item-img-collage {
    position: relative;
    width: 100%;
    height: 1000px;
}

/* 個別の画像。top / left / width で位置とサイズを調整してください */
.pickup-item.main .item-img-collage img {
    position: absolute;
    object-fit: cover;
}

/* 画像1：大（基準になるメイン画像） */
.pickup-item.main .img-1 {
    top: 0px;
    left: 0px;
    width: 62%;
    height: auto;
}

/* 画像2：中（右上あたりに散らす） */
.pickup-item.main .img-2 {
    top: 540px;
    right: 0px;
    width: 47%;
    height: auto;
}

/* 画像3：小（下側に散らす） */
.pickup-item.main .img-3 {
    top: 610px;
    left: 40px;
    width: 44%;
    height: auto;
}

.pickup-item.main .item-body {
    width: 100%;
}
.pickup-item.main .lead {
    font-size: 1.15em;
}

/* ===== 2つ目以降を並べるグリッド ===== */
.pickup-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
	margin-bottom: 80px;
}
.pickup-grid .pickup-item {
    flex-direction: row;
}
.pickup-grid .pickup-item .item-img {
    width: 100%;
    max-height: auto;
}
.pickup-grid .pickup-item .item-body {
    width: 100%;
    padding: 20px 0px;
}

/* 画像を右寄せにする（左右左のパターン用） */
.pickup-grid .pickup-item.img-right {
    flex-direction: row-reverse;
}

/*締めの挨拶*/
.last_spring {
 background-color: #eeeeee!important;
}

.other h3{
text-align: center;
margin-top: 100px !important;
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP", serif;
	box-sizing: border-box;
}


/* ==========================================================================
   6. 生地の森のウィンターリネン バナー (.winterlinen-bnr)
   ========================================================================== */
.winterlinen-bnr {
  width: 850px;
  max-width: 100%;
  margin: 0 auto 120px;
  text-align: center;
}
.winterlinen2025 .winterlinen-bnr h3 {
  text-align: center;
  font-size: 24px;
  letter-spacing: 2px;
  margin: 0 0 40px !important;
  font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, "Noto Serif JP", serif!important;	
}
.winterlinen-bnr .bnr-img {
  width: 80%;
  margin: 0 auto;
}
.winterlinen-bnr .bnr-img img {
  width: 100%;
  height: auto;
  display: block;
}
.winterlinen-bnr .bnr-img a:hover img {
  opacity: .8;
}
.winterlinen-bnr .bnr-text {
  margin: 40px 0 0;
  line-height: 200%;
  letter-spacing: 1px;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho ProN", YuMincho, "Yu Mincho", "Noto Serif JP", serif;
}
.winterlinen-bnr .btn_box {
  margin: 40px 0 0 !important;
}
.winterlinen-bnr .btn_box a,
.faq-item .btn_box a {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #666666;
  color: #666666;
  text-decoration: none;
  font-size: 0.85em;
  border-radius: 3px;
  transition: 0.2s;
  background: none !important;
}
.winterlinen-bnr .btn_box a:hover,
.faq-item .btn_box a:hover {
  background: #666666 !important;
  color: #fff;
}

/* ==========================================================================
   7. FAQ
   ========================================================================== */
	h4.faq-products-title{
	font-weight: bold;	
	}
	
.faq-item p.faq-products-lead{
        margin-bottom: 30px;
        padding: 0.5rem 1rem 1rem 0rem;
        line-height: 1.6;
        border-left: initial;
	}
.faq-item p.faq-products-lead::before{
        content: initial;
	}	

	
.faq-item .btn_box {
    margin: 0 0 30px!important;
    text-align: center;	
	}

.faq_2026spring .faq-item .answer{
	border-left: 4px solid #9a9a9a;
}


/* ==========================================================================
   5. レスポンシブ（〜640px）
      ※ 内部の並び順も上記のセクション構成（1〜4, 6, 7）に合わせています
   ========================================================================== */
@media screen and (max-width: 640px) {

	/* --- 1. 見出し・基本テキスト --- */
	hr {
		width: 100%!important;
	}
	h2 {
		margin-bottom: 10px!important;
	}
	h3 {
		padding: 0 10px;
		font-size: 21px !important;
		font-weight: bold !important;
		letter-spacing: 1px !important;
	}
	.h3-lead strong {
		font-size: 15px;
	}
	.h3-lead {
		padding: 0 10px;
		font-size: 14px;
		letter-spacing: .5px;
        line-height: 180%;
		margin: 50px 0!important;
	}

	.point .inside_margin{
	    margin: 30px 20px!important;
	}

	/* --- 2. 「生地の森が大切にしているものづくり」セクション --- */
	.container-winter2026 {
		width: 100%;
		margin: 60px auto;
		padding: 3%;
	}
	.container-winter2026 .product-image {
		margin: 40px 0 50px;
	}
	.container-winter2026 .product-image h3 {
		text-align: center!important;
		line-height: 170%!important;
		letter-spacing: 2px !important;
	}
	.container-winter2026 .img-row {
		margin: 0 0 80px;
		gap: 10vw;
	}

	/* 画像とimage-textを横並びのまま折り返し可能に */
	.fade_winter2026 {
		flex-wrap: wrap; /* sub-textの折り返しに必要 */
		align-items: flex-start;
	}

	/* 画像は80%、左右交互配置は維持 */
	.fade_winter2026 .img-wrap {
		width: 68%;
	}
	.fade_winter2026:nth-child(odd) .img-wrap {
		margin-left: auto;
		margin-right: 0;
	}
	.fade_winter2026:nth-child(even) .img-wrap {
		margin-right: auto;
		margin-left: 0;
	}

	/* テキストは画像の下、通常の流れに配置(overflow可) */
	.fade_winter2026 .text-wrap {
		width: 100%;
		position: relative;
		order: 1;
	}
	.fade_winter2026 .text-wrap {
		width: 32%;
		position: relative;
	}

	.container-winter2026 .image-text {
		position: relative;
		top: -22.5vw;
		left: -57vw;
		font-size: 60px;
	}
	.container-winter2026 .row-box02 .image-text {
		position: relative;
		top: -22.5vw;
		left: 58vw;
		font-size: 60px;
		text-align: end;
	}
	
	.container-winter2026 .row-box03 .image-text {
		writing-mode: vertical-rl;
		font-size: 60px;
		line-height: 1.2;
		top: -28.5vw;
		left: -70vw;
	}

	/* fade_winter2026直下の子として、画面(行)幅いっぱいに折り返す */
	.container-winter2026 .sub-text {
		position: relative;
		flex-basis: 100%;
		width: 100%;
		top: 7vw;
		left: 0vw;
	}
	.container-winter2026 .row-box02 .sub-text {
		position: relative;
		flex-basis: 100%;
		width: 100%;
		top: 7vw;
		left: 0vw;
		text-align: end;
	}

	/* --- 3. 綿麻・ガーゼ 共通セクション --- */
	.item-text-box {
		width: 100%;
	}

	.cottonlinen-showcase,
	.gauze-showcase {
		margin: 0 auto 60px;
		padding: 0 2%;
	}

	.cottonlinen-list,
	.gauze-list {
		gap:50px;
		margin-bottom: 70px;
	}
	.cottonlinen-item,
	.gauze-item {
		gap: 25px;
	}

	.cottonlinen-showcase .image-box,
	.gauze-showcase .image-box {
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.cottonlinen-showcase .image-box.img-right,
	.gauze-showcase .image-box.img-right {
		flex-direction: column;
		gap:10px;
	}

	.cottonlinen-item .item-img,
	.gauze-item .item-img {
		width: 100%;
	}
	.cottonlinen-item .item-body,
	.gauze-item .item-body {
		display: flex;
		align-items: flex-end;
		margin-bottom: 30px;
		justify-content: space-between;
		padding: 0 5px;
		flex-direction: column;
	}

	.cottonlinen-item .item-img img,
	.gauze-item .item-img img {
		width: 80%;
		display: block;
	}
	.cottonlinen-showcase .image-box.img-right .item-img img,
	.gauze-showcase .image-box.img-right .item-img img {
		width: 80%;
		display: block;
		margin: 0 0 0 auto;
	}
	.cottonlinen-item .item-img-topics img,
	.gauze-item .item-img-topics img {
		width: 70%;
		display: block;
		margin: 0 0 0 auto;
	}
	.cottonlinen-showcase .image-box.img-right .item-img-topics img,
	.gauze-showcase .image-box.img-right .item-img-topics img {
		width: 70%;
		display: block;
		margin: 0 auto 0 0;
	}
	.cottonlinen-item .item-body .item-link-box,
	.gauze-item .item-body .item-link-box {
		margin: 0 auto;
		width: 90%;
	}
	.cottonlinen-showcase h4.group-title {
		font-size: 17px;
		text-align: center;
		gap: 10px;
	}
	.cottonlinen-list .btn_box a, .gauze-list .btn_box a{
		width: 100%!important;
	}

	/* --- 4. ピックアップリスト（メイン商品紹介カード） --- */
	.pickup-list {
		gap: 20px;
	}
	h4.item-title,
	h5.item-title {
		font-size: 18px;
	}
	.item-spec {
		color: #666;
		font-size: 13px;
		margin-bottom: 10px;
	}
	.pickup-item h5.lead,
	h6.lead	{
		font-size: 14px!important;
	}
	.pickup-item .item-body {
		padding: 24px 0px;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.pickup-list .btn_box {
		margin: 0!important;
	}
	.pickup-list .btn_box a {
		background: none!important;
		margin: 20px auto;
	}
	.pickup-list .item-body .sample-link{
		margin: 0 0 0 auto;
	}

	.pickup-item.main .item-img-collage {
		height: 187vw;
	}
	.pickup-item.main .img-1 {
		top: 0px;
		left: 0px;
		width: 85%;
		height: auto;
	}
	.pickup-item.main .img-2 {
		top: 83vw;
		right: 3vw;
		width: 58%;
		height: auto;
	}
	.pickup-item.main .img-3 {
		top: 140vw;
		left: 7vw;
		width: 71%;
		height: 180px;
	}

	.pickup-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.pickup-grid .pickup-item,
	.pickup-grid .pickup-item.img-right {
		flex-direction: column;
	}
	.pickup-grid .pickup-item .item-img {
		width: 100%;
		padding: 0;
		height: auto;
	}
	.last_spring {
	padding: 15% 4%!important;
    margin: 50px 0 70px!important;
	}
	.other h3{
	margin: 100px auto 30px !important;
	width: 100% !important;
	}

	/* --- 6. ウィンターリネン バナー --- */
	.winterlinen-bnr {
		margin: 0 auto 80px;
		padding: 0 4%;
		box-sizing: border-box;
	}
	.winterlinen2025 .winterlinen-bnr h3 {
		margin: 0 0 30px !important;
	}
	.winterlinen-bnr .bnr-img {
		width: 100%;
	}
	.winterlinen-bnr .bnr-text {
		margin: 30px 0 0;
		font-size: 14px;
	}
	.winterlinen-bnr .btn_box {
		margin: 30px 0 0 !important;
	}
	/* --- 7. FAQ --- */	
.faq-item .btn_box {
    margin: 0 auto 30px!important;
	width: 80%;
	}	
	
}