@charset "UTF-8";
/* CSS Document */

/* * {
  outline: 2px solid blue;
} */

body{
	margin: 0 auto;
	padding: 0;
	font-family: 'メイリオ','Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
	color: #181818;
}

img{
	max-width: 100%;
}

/* ヘッダー部分 */
header {
position:fixed;/* ヘッダーを固定する */
z-index: 10000;
top: 0; /* 上部から配置の基準位置を決める */
left: 0; /* 左から配置の基準位置を決める */
width: 100%; /* ヘッダーの横幅を指定する */
 /*height: auto;ヘッダーの高さを指定する */
/*: 10px 5px;  ヘッダーの余白を指定する(上下左右) */
background-color: #FFFFFF; /* ヘッダーの背景色を指定する */
color: #000000; /* フォントの色を指定する */	
box-sizing: border-box;
}

.heA{
display: flex;
flex-direction: column;
margin: 10px;
}

.heA P{
	text-align: center;
	color: #fff;
	background-color: #6C71B0;
	margin:0px;
	padding: 5px;	
}

.heB{
	display: flex;
	align-items: flex-end; /* 下に寄せる */
  justify-content: center; /* 横は中央（任意） */
}



.logo img {
  width: 100%; /* 親要素の幅に基づいてサイズを調整 */
 max-width: 200px; /* 最大幅を200pxに拡大 */
  height: auto; /* アスペクト比を維持 */
}


/* メニュー */
.nav-list {
	list-style: none;
  text-align: center;
  padding: 10px 0;
  margin: 0 auto;
}

.nav-list-item {
  display: inline-block;
  margin: 0 20px;
	
}
a {
  text-decoration: none;
  color: black; /* リンクの色を変更 */
}

.nav-list-item a {
  text-decoration: none;
  font-size: 16px;
  display: inline-block;
  transition: transform 0.3s ease;
	border-bottom: #f0ce00 3px solid;
	padding-bottom:1px;
}

.nav-list-item a:hover {
  transform: scale(1.25);
  color:#3C3B3B;
	border-bottom-style: none;
}



/*メインビジュアル*/

/* 複数画像切り替え---------------------------------------------- */


.slider-container {
	position: relative;
	width: 984px;  /* 幅を984pxに固定 */
	height: 250px;
	overflow: hidden;
	text-align: center;
	 margin: 0 auto;  /* 中央揃え */
	padding: 0;
}

.slideimg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	background-size: cover;/* 画像をスライド全体にカバー */
	animation: slideAnime 14s infinite; /* 15秒で1サイクル */
}

.slideimg img {
	width: 100%;
	height:100%;
	object-fit: contain; /* 画像を縮小して表示 */
}



@keyframes slideAnime {
	0%, 30%, 100% { opacity: 0; }/* スライドの非表示タイミング */
	10%, 20% { opacity: 1; }/* スライドの表示タイミング */
}


/* 各スライドのアニメーションタイミングを均等にずらす */
.slideimg:nth-of-type(1){
	animation-delay: 0s;
}

.slideimg:nth-of-type(2) {
	animation-delay: 3s;
}

.slideimg:nth-of-type(3) {
	animation-delay: 6s;
}

.slideimg:nth-of-type(4) {
	animation-delay: 9s;
}



/* 最新ニュース*/
.conBB {
  display: flex;
  justify-content: center; /* 水平方向の中央揃え */
  align-items: center;     /* 垂直方向の中央揃え */
	margin: 0;
	padding: 0;
}

.boxB {
  text-align: center; /* 画像がボックス内で中央に来るようにする */
}

.boxB img{
	max-width: 984px;
	margin: 0 auto;
}

.newsPhoto{	display: flex; /*横並び*/
	flex-basis:50%;
  margin-bottom: 50px;
 /* width: 100%; 親要素いっぱいに広げることで左揃えになる */
	gap:15px; /* 画像とテキストの間隔を設定 */
	padding: 15px;
background-color:#4CA3C2;/*カテゴリーカラー*/
	
}



/* 今月の２点ーーーータイトルーーーー */

.boxC{
	text-align: center;
}

.titleA {
    display: flex;
	text-align: center;
	align-items: center; /* 縦方向に中央揃え */
    justify-content: center; /* 横方向に中央揃え */
	margin:30px;
}

/* ボックス型タイトル */
.heading-19 {
    position: relative;
    padding: .5em .7em;
	 display: inline-block; /* 幅がコンテンツの文字サイズに合わせて広がるように設定 */
    border: 3px solid #333333;
    color: #333333;
}

.heading-19::before,
.heading-19::after {
    position: absolute;
    border: solid #333333;
    content: '';
}

.heading-19::before {
    top: 3px;
    right: -16px;
    transform: skewY(45deg);
    width: 10px;
    height: 100%;
    border-width: 4px 3px 3px 0;
}

.heading-19::after {
    bottom: -16px;
    left: 4px;
    transform: skewX(45deg);
    width: 100%;
    height: 10px;
    border-width: 0 2px 3px 4px;
}



/* 早割の２点ーーーー商品画像ーーーーー */

/* 早割の２点ーーーー表ーーーーー */


.allbox{
	display: flex;
	gap:20px;
	margin: 20px;
}
	.box1 h1{
		 background-color: #4CA3C2;
		color: #fff;
		font-size: 30px;
}

.box1{
	 background-color: #4CA3C2;
	
}

.box_shadow1{
	display: flex; /*横並び*/
	
border: 2px solid #090909;
  margin: 1em 0;
  padding: 1em;
 
  box-shadow: 7px 7px #000; /* 影指定 */
} 




.order-table{
	background: #fff;
	border-collapse: collapse;
  border: 1.5px solid #000;
margin: auto;
	width: 100%;
  table-layout: fixed; /* 各セルの幅を均等にする */
}

.order-table th {
  border: 1.5px solid #000;
  background: #fff;
padding: 5px;
	vertical-align: middle;
	 width:10%;
}

.order-table td {
  border-bottom: 1.5px solid #000;
	padding: 5px;
	 width:20%; /* 左右のセルを均等に */
  text-align: left;
  vertical-align: middle;

}

 /* 早割の２点ーーーー商品概要↑↑↑ー*/

.conCC{
	display: flex;
	padding:0 30px;
	gap:15px;
}

.photoC {
	display: flex; /*横並び*/
	flex-basis: 50%;

 /* width: 100%; 親要素いっぱいに広げることで左揃えになる */
	gap:0px; /* 画像とテキストの間隔を設定 */
	padding: 15px;
background-color:#4CA3C2;/*カテゴリーカラー*/
}

.photoCC{
	display: flex; /*横並び*/
	flex-basis:50%;

 /*width: 100%;  親要素いっぱいに広げることで左揃えになる */
	gap: 0px; /* 画像とテキストの間隔を設定 */
	padding: 15px;
	background-color:#3A6150;/*カテゴリーカラー*/
}

.caption-center {
  text-align: center;
	font-size: 0.65rem;
	color: #FFFFFF;
}

/*ーーーーーーーーーーーーーーーーーーーーー テキストエリアのデザイン */


.titleC {
	 height: 60px;
  display: flex;
  align-items: center;
  border-top: solid 1.5px #f0f8ff;
  border-bottom: solid 1.5px #f0f8ff;
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 10px;
	color: #fff;
}

del {
	color: #fff;
    background-image: linear-gradient(#fe3464, #fe3464);
    background-position: 0 50%;
    background-size: 100% 2px;
    background-repeat: repeat-x;
    margin: 0 0.4em;
    text-decoration: none;
}

.textC{
	color: #fff;
}

.taxc{
	font-size: 0.8rem;
}
.offc{
	font-size: 1.8rem;
	color: #fff;
}


/* 今月の２点ーーーー商品画像ーーーーー */

.conCC{
	display: flex;
	padding:0 30px;
	gap:20px;
}

/*今月の２点ーーーー商品画像1点目背景ーーーーー*/

.photoC01 {
	display: flex; /*横並び*/
	flex-basis:50%;
  margin-bottom: 50px;/* width: 100%; 親要素いっぱいに広げることで左揃えになる */
	gap:20px; /* 画像とテキストの間隔を設定 */
	padding: 30px;
background-color: #3A6150;/*カテゴリーカラー*/
}

/*今月の２点ーーーー商品画像２点目背景ーーーーー*/

.photoCC01 {
	display: flex; /*横並び*/
	flex-basis:50%;
 margin-bottom: 50px;
 width: 100%; /* 親要素いっぱいに広げることで左揃えになる */
	gap: 15px; /* 画像とテキストの間隔を設定 */
	padding: 15px;
	background-color: #4CA3C2;/*カテゴリーカラー*/
}


 .imageC {
  width:300px; /*画像とテキストの間が変更できる*/
  margin: 10px;
  padding: 3px;
  overflow: hidden;
  position: relative;
	box-sizing:border-box;
}

/*ーーーーーーーーーーーーーーーーーーーーー テキストエリアのデザイン */

.rightC {
  margin: 5px;
  padding: 0;
 max-width: 450px; /* テキスト部分の幅を調整 */
	text-align: left; /* テキストを左揃えに */
}


.titleC {
  margin-top: 10px;
  font-weight: bold;
  font-size: 18px;
	color: #fff;
}

del {
	color: #fff;
    background-image: linear-gradient(#fe3464, #fe3464);
    background-position: 0 50%;
    background-size: 100% 2px;
    background-repeat: repeat-x;
    margin: 0 0.4em;
    text-decoration: none;
}

.textC{
	color: #fff;
}

.taxc{
	font-size: 0.8rem;
}
.offc{
	font-size: 1.8rem;
	color: #fff;
}

/*ご購入はこちらからボタン solid018 */
.button_solid018{
	
	margin-top:20px; 
	
}

.button_solid018 a {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 240px;
    padding: 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 600;
    background:#FFFFFF;
    filter: drop-shadow(2px 2px 4px #000);
    border-radius: 2px;
	border: 1.5px solid #000;
}
.button_solid018 a:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 30px -5px rgb(0 0 0 / 15%), 0 0 5px rgb(0 0 0 / 10%);
}
.button_solid018 a:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #313131;
    border-right: 3px solid #313131;
    transform: rotate(45deg) translateY(-48%);
    position: absolute;
    top: 48%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}



/* 110のリストテーブル*/

.red{
	color: #FF0004;
	font-size: 14px;
}
.blue{color: #009CF5;
	font-size: 14px;
}
.gray{
	color:rgba(113,106,106,0.80);
	font-size: 14px;
}
.black{
	font-size: 14px;
}

.titleE p{
	text-align: center;
	font-size: 14px;
}


.listcolor{
	margin: 5px;
}

.conE {
  display: flex;
  flex-wrap: wrap; /* 子要素を折り返す */
  justify-content: center; /* 子要素を中央に揃える */
  gap: 10px; /* テーブル間の余白 */
  margin: 0 auto; /* 自動で中央揃え */
  max-width: 1200px; /* 最大幅を設定 */
}


/* テーブルの設定 */
.conE table {
	table-layout: fixed; /* 固定レイアウト */
flex: 1 1 calc(33% - 20px); /* 幅を動的に設定（33%）*/
  max-width:400px; /* テーブルの最大幅 */
  min-width: 300px; /* 最小幅を設定 */
  text-align: left; /* 左寄せで整列 */
  border-collapse: collapse; /* ボーダーの重複を防ぐ */
}

/* テーブルヘッダーのスタイル */
.conE th {
  text-align: center;
  color: #FFFFFF;
	 width: auto; /* 固定幅にしたくない場合は 'auto' */
}

/* テーブルセルのスタイル */
.conE td {
  padding: 2px;
	width: auto;
	height: 10px;
	text-align:left;
}


th, td{
table-layout: fixed;
 width: 100%;
height: 30px;
}

.conE table th {
  width: calc(100% / 3); /* 必要に応じてカラム数で割る */
  text-align: center; /* 中央揃えで均等に見せる */
}


.thA{
	background-color: #3A6150;
	color: #FFFFFF;
	 padding:2px;
}
.thB{
	background-color: #C83B18;
	color: #FFFFFF;
	 padding:2px;
}
.thC{
	background-color: #569D45;
	color: #FFFFFF;
	 padding:2px;
}
.thD{
	background-color: #EABD00;
	color: #FFFFFF;
	 padding:2px;
}
.thE{
	background-color: #A3A2A0;
	color: #FFFFFF;
	 padding:2px;
}
.thF{
	background-color: #4CA3C2;
	color: #FFFFFF;
	padding:2px;
}
.thG{
	background-color: #704894;
	color: #FFFFFF;
	padding:2px;
}
.thH{
	background-color: #D685A5;
	color: #FFFFFF;
	 padding:2px;
}
.thI{
	background-color: #734D3B;
	color: #FFFFFF;
	padding:2px;
}

.tabletext{
	color:rgba(113,106,106,0.65);
	margin: 0;
}

/* テキストのアニメーション(透過率変更) 今月発表商品*/
@keyframes blinkOpacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* テキストのアニメーション(透過率変更) 今月発表商品*/
.text-opacity {
  animation: blinkOpacity 1.2s ease-in-out infinite alternate;
color: red;
margin: 0;
}
/* テキストのアニメーション(透過率変更) 先月発表商品*/
.text-opacity01{
	  animation: blinkOpacity 1.2s ease-in-out infinite alternate;
color: #009CF5;
margin: 0;
	
}
/* テキストのアニメーション(透過率変更) 過去発表商品*/


.text-opacity02{
color: #0C0C0C;
margin: 0;
	
}

/*---------------------------カタログー--------- */
.catalogA{
	text-align: center;
	margin: 20px;
}
.catalog {
  display: flex;
  justify-content: center; /* 写真を中央に配置 */
  gap: 20px; /* 写真の間隔 */
  margin: 20px 0;
  flex-wrap: nowrap; /* 折り返さない */
}

.catalog img {
  width: auto; /* 幅を画像に合わせる */
  max-width: 200px; /* 最大幅を設定 */
  height: auto; /* 縦横比を維持 */
  border-radius: 5px; /* 見た目を少し柔らかくする */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* 少し影を追加 */
}

/*---------------------------フッター上のバナー--------- */
.bannerB{
	margin: 0 auto;
	max-width: 984px;
	margin-top: 10px;
}



/* ----------------------------------フッター-------------------------------------- */
footer{
	background-color: #6C71B0;
	color:#FFFFFF;
	margin: 0;
	margin-top: 20px;
	display: flex;

}

.footA{
	margin: 0;
	padding: 0;
}

footer .footA{
	padding: 20px 20px;
	text-align:left;
}

.footA h3{
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 16px;
	letter-spacing: 0.2em;
}
.footA p{
	margin-top: 0;
	margin-bottom: 0;
	font-size: 15px;
}

.footB p{
	font-size: 13px;
	text-align:center;
}

footer .nav-list ul{
	text-align: left;
	 flex-direction: column;
	 align-items: flex-start;
	  margin: 20px;
}

footer .nav-list-item a:hover {
  transform: scale(1.3);
  color: #fff;
	border-bottom-style: none;
}
footer a{
  text-decoration: none;
  color: #fff; /* リンクの色を変更 */
}


/* 別ページーーー通販ガイドーhowtoーーー */

.howto{
	max-width: 920px;
	margin: 0 auto;
}

.howA{
	max-width:　920px;
	text-align: left;
	
}

.howAA{
	border-bottom: groove;
}

.textF{
		margin: 20px;
	}

/* 別ページーー-----------------------ーご挨拶ーーー */
.hello img {
 	height: auto;
filter: drop-shadow(5px 5px 5px #aaa);
	margin-right: 30px;
}


.hello{
	max-width: 920px;
	margin: 0 auto;
}

.helloA{
	display: flex;
	margin: 10px;
	margin-top: 30px;
	text-align: left;
}

.textF {
  margin: 20px;
}


/* 別ページーー-----ーソフビ模型ーーーーーーーーーーーー */

.make{
	max-width: 920px;
	margin: 0 auto;
}

.makeAA{
	list-style: square;
}

/* 別ページーーーFactoryーーーーーーーーーーーーーー */

/* 生産者は私たちです*/
.factory img{
	height: auto;
filter: drop-shadow(5px 5px 5px #aaa);
	max-width: 100%;
}

.factory {
	max-width: 920px;
	margin: 0 auto;
}

.factoryA{
	display: flex;
	margin-top: 30px;
	text-align: left;
}

.textE{ 
	margin: 20px;
}

/* 別ページーーーSNSーーーー */
.snsB .snsBB {
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap; /* 必要に応じて改行 */
  gap: 20px; /* 子要素間の間隔 */
  justify-content: center; /* 全体を中央揃え */
}

.snsBB a {
  flex: 1;
  margin: 10px;
  display: flex;
  flex-direction: column; /* 子要素を縦並びに */
  align-items: center; /* 横方向の中央揃え */
  text-decoration: none; /* リンクの下線を消す */
  color: #181818;
	margin-top:20px;
}

.photoB {
  width: 50px;
  height: 50px;
  margin-bottom: 10px; /* テキストとの間隔 */
	padding-bottom: 5px;
}

.photoB img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 画像を親要素に合わせる */
}

.textB {
  text-align: center; /* テキストを中央揃え */
}

/* ホバー時の動き */
.snsBB a:hover .photoB img {
  transform: scale(1.5); /* 1.1倍に拡大 */
  opacity: 0.8; /* 透明度を少し下げる */
  transition: transform 0.3s ease, opacity 0.3s ease; /* スムーズなアニメーション */
}

.snsBB a:hover .textB {
  color: #0073e6; /* テキストの色を変える */
  transition: color 0.3s ease; /* スムーズな色変更 */
}

/* 別ページーーーSNSbボタンーーーー */
.arrow_button {
  display: inline-block;
  position: relative;
  padding: 8px 20px 8px 45px;
  background: #ff6347; /* デフォルトの背景色 */
  border-radius: 5px;
  color: #fff; /* テキストの色 */
	font-size: 14px; /* 標準的なフォントサイズに調整 */
  line-height: 1; /* 行間を詰める */
  transition: background-color 0.5s, box-shadow 0.8s;

}

.arrow_button p{
	padding-left: 10px;
}
 
.arrow_button::before { /* 矢印の表示設定 */
  content: "";
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 18px;
  width: 10px;
  height: 10px;
  border-top: 2.5px solid #fff;
  border-right: 2.5px solid #fff;
  transform: rotate(45deg);
}
 
.arrow_button::after { /* 矢印の丸枠の表示設定 */
  content: "";
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 13px;
  width: 23px;
  height: 23px;
  border: 2.5px solid #fff;
  border-radius: 50%;
}
 
.arrow_button:hover { /* マウスオーバー時のスタイル */
  background-color:#ffa899; /* マウスオーバー時の背景色 */
  box-shadow: 2px 3px 2px rgba(0,0,0,0.3) /* マウスオーバー時につける影 */
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーメディアクエリーーーーー */
@media(min-width:769px){
    .sm{
        display: none;
    }
}


/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーメディアクエリーーーーー */

@media (max-width: 768px) {
	main{
		padding: 0 1.5%;
	}
	
	 .nav-list {
    display: none !important;
  }
	
	.heA{
		display: flex;/* 横並びにする */
		align-items: center;/* 垂直方向の中央揃え */
		justify-content: space-between;/* 左右に余白を持たせる */
		padding: 10px 20px;/* 余白調整 */
		white-space: nowrap; /* 折り返し防止 */
		overflow: hidden;
		flex-direction: row; /* 横並びにする */
	}
	
	
	  .heA p {
        font-size: 1rem; /* 文字サイズを調整 */
        white-space: nowrap; /* 折り返しを防止 */
        overflow: hidden;
        text-overflow: ellipsis; /* 省略記号「…」を表示 */
        max-width: 70%; /* タイトルの最大幅を制限 */
    }
	
	.heA p{
		display: none;
	}
	
	.heB{
		 display: flex;
    justify-content: center;
    align-items: center; /* 必要なら垂直方向も中央揃え */
    flex-direction: column; /* 必要なら縦並びにする */
		width: 100%; /* 幅を100%にして中央揃えを確実にする */
	}
	
	
	 /* ヘッダー */
	
.logo {
	display: grid;
	text-align:center;
	margin: 3 0 2px;
	gap:5px;
    grid-template-columns:repeat(2,minmax(150px,1fr));
  }

 
	
	/**********************************　
以下、ハンバーガーメニューの設定　
************************************/


  #hamburger {
    background-color: transparent;
    position: relative;
    cursor: pointer;
    margin: 0 0 0 auto;
    height: 60px;
    width: 60px;
  }

  .icon span {
    position: absolute;
    left: 15px;
    width: 30px;
    height: 4px;
    background-color: #141313;
    border-radius: 8px;
    transition: ease 0.75s;
  }

  .icon span:nth-of-type(1) {
    top: 16px;
  }
  .icon span:nth-of-type(2) {
    top: 28px;
  }
  .icon span:nth-of-type(3) {
    bottom: 16px;
}

  .close span:nth-of-type(1) {
    transform: rotate(45deg);
    top: 28px;
  }

  .close span:nth-of-type(2) {
    opacity: 0;
  }

  .close span:nth-of-type(3) {
      transform: rotate(-45deg);
      top: 28px;
  }

  .sm {
	display: none;
    position: absolute;
    top: 90px;
    z-index: 10;
    width: 100%;
    background-color: rgba(90,86,86,0.88);
    box-sizing: border-box; /* 余白の影響を防ぐ */
  }

  .sm .nav-list02 {
	  list-style:none;
    flex-direction: column;
	  align-items: flex-start;
	  margin: 20px;
  }

 .sm a {
    text-align: left;
    border-bottom: solid 1px rgba(255, 255, 255, 0.6);
	 font-size: 1.2rem;
	color: aliceblue;
	}

/* -----------------------------------メディアクエリーーーーーメインビジュアル*/

.slider-container{
	   width: 100%;
        overflow-x: scroll;
	height: 100px;
	margin: 0;
}
.slideimg {
    flex: 0 0 auto;  /* 幅を100%に設定 */
	max-width: 100%;        /* 親の幅に応じて画像を縮小 */
    height: auto;           /* 縦横比を維持 */
    scroll-snap-align: start; /* スライドの開始位置をスナップ（オプション） */
    }
	
	.titleA{
		margin: 0;
	}
	
	/* 最新ニュースバナー*ーーーーー*/
	.boxB img{
		width: 100%;
		height: inherit;
        overflow-x:scroll;
		margin: 0 auto;
		padding: 0;
	}
	
	
	/* 今月の新商品２点*ーーーーー*/
	
	.conCC {
		flex-direction: column; /* 縦並びに変更 */
		margin: 0 auto;
		width:95%;
		padding: 10px;
	}
	
	/* -------１つ目！！！*/
	.photoC {
    flex-direction: column; /* 縦並びに変更 */
    align-items: center; /* 中央に揃える */
    gap: 10px;
		padding: 0;
		margin: 0;
		padding-bottom: 30px;
		padding-top: 30px;
  }
	
	.photoC,.imageC,.photoC,.rightC {
    width:85%; /* 画面幅に合わせる */
    text-align: center; /* 中央揃え */
  }

	/* -------１つ目発売中-----------------！！！*/
	
	.photoC01 {
    flex-direction: column; /* 縦並びに変更 */
    align-items: center; /* 中央に揃える */
    gap: 10px;
		padding: 0;
		margin: 0;
		padding-bottom: 30px;
		padding-top: 30px;
  }
	
	
	
/* 画像のスタイル */
  .photoC,img {
    width: 100%; /* 小さな画面では画像をフル幅に */
	  text-align: center; 
	  margin: 0;
	}

	.photoC,.rightC{
    max-width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center; /* テキストを中央に揃える */
  }

  .textC {
    padding: 0px 0; /* スマートフォン用にパディングを調整 */
	  text-align:left;
  }	
	
	
		
/* 画像のスタイル */
  .photoCo01,.imageC img {
    width: 100%; /* 小さな画面では画像をフル幅に */
	  text-align: center; 
	  margin: 0;
	}

	 .photoC01,.rightC {
    max-width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center; /* テキストを中央に揃える */
  }

  .textC {
    padding: 0px 0; /* スマートフォン用にパディングを調整 */
	  text-align:left;
  }	
	
	
	
	/* ------------２つ目！！！*/
	
	.photoCC {
	display: flex; /* flexboxに設定 */
    flex-direction: column; /* 縦並びに変更 */
    align-items: center; /* 中央に揃える */
    gap: 10px;
		margin: 0;
		padding: 0;
		padding-bottom: 30px;
		padding-top: 30px;
  }
	/* 各要素の横幅設定 */


/* 画像のスタイル */
 

	.photoCC,.rightC {
    max-width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center; /* テキストを中央に揃える */
  }

  .textC {
    padding: 10px 0; /* スマートフォン用にパディングを調整 */
	  text-align:left;
  }	
	
	
	
	
	/* ------------２つ目発売中！！！*/
	
	.photoCC01 {
	display: flex; /* flexboxに設定 */
    flex-direction: column; /* 縦並びに変更 */
    align-items: center; /* 中央に揃える */
    gap: 10px;
		margin: 0;
		padding: 0;
		padding-bottom: 30px;
		padding-top: 30px;
  }
	/* 各要素の横幅設定 */
	.photoCC01,.imageC,.photoCC01,.rightC {
    width: 85%; /* 画面幅に合わせる */
    text-align: center; /* 中央揃え */
  }

/* 画像のスタイル */
  .photoCC01,.imageC01,img {
    width: 100%; /* 小さな画面では画像をフル幅に */
	  
	  text-align: center; 
	}

	.photoCC01,.rightC {
    max-width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center; /* テキストを中央に揃える */
  }

  .textC {
    padding: 10px 0; /* スマートフォン用にパディングを調整 */
	  text-align:left;
  }	
	
	
	
	
	/* --------------------------------------メディアクエリ----リスト */
	
	.heading-19{
		margin-bottom: 20px;
	}
	
	.conE{
	display: block; /* 縦方向に並べる */
    margin: 10px auto;
    width: 100%; /* 親要素の幅を100%に設定 */
		margin-top:0; 
		
	}
	.titleE p {
        margin-left: 10px; /* 余白を縮小 */
        
    }

    .conE table {
        width: 90%; /* テーブル幅を画面幅に合わせる */
        margin-right: 0; /* 不要な余白を削除 */
		margin: 10px auto;
    }

   
    .thA, .thB, .thC, .thD, .thE, .thF, .thG, .thH, .thI {
        padding: 5px; /* 見出しの余白も小さく */
    }
	
		/* --------------------------------------メディアクエリ----カタログダウンロード */
	
	 .catalog {
    flex-direction: column; /* 縦並びにする */
    align-items: center; /* 中央揃え */
    gap: 15px; /* 写真間の余白を調整 */
		 margin-top: 10px;
  }

  .catalog img {
    max-width:80%; /* 画面サイズに収まるように調整 */
  }
	
	
	/* --------------------------------------メディアクエリ----通販ガイド */

	.howAA{
		text-align: left;
		margin: 0 auto;
	}
	
	/*-------------------------------------- SNS一覧 */
	.snsB .snsBB{
		text-align: center;
	}
	
	.photoB{
		 width: 50px; /* 画面幅に合わせる */
    text-align: center; /* 中央揃え */
	}
	.snsA{
		margin:10px;
		display: flex;
		text-align: left;
	}
	
	
	/*-------------------------------------- メディアクエリ----ご挨拶 */
	
	.helloA{
		display: flex;
		 flex-direction: column; /* 縦並びに変更 */
		align-items: center; /* 中央揃え */
	}
	
	.helloA img {
    width: 80%; /* 画面幅に合わせて画像を拡大縮小 */
    height: auto; /* 縦横比を保持する */
		margin:10px;
	
  }
	
	
	
/* --------------------------------------メディアクエリ----ファクトリー */	
	.factoryA{
		display: flex;
		 flex-direction: column; /* 縦並びに変更 */
	}
	
	
	.factoryA img {
    width: 50%; /* 画面幅に合わせて画像を拡大縮小 */
    height: auto; /* 縦横比を保持する */
	margin: 0 auto;	
  }
	
	/* --------------------------------------メディアクエリ----SNS---- */
	.snsBB{
		display: flex;
		 flex-direction: column; /* 縦並びに変更 */
			width: 100%;
	}

	
	
}