@charset "utf-8";/* CSS Document *//*大枠のcss*/#outer{width: 1260px;margin: 0 auto;}/*マウスオーバーでふぉんってなる*/#outer a:hover{opacity: 0.7;}/*見出し*/#outer .top_parts{width: 100%;display: flex;justify-content: space-between;background-color: #C35831;margin-bottom: 50px;}#outer .top_parts .top_txt{width: 54%;color: #FFFFFF;display: flex;flex-direction: column;justify-content: center;box-sizing: border-box;padding: 0 0 0 25px;}#outer .top_parts .top_txt h1{font-size: 2.3em;font-weight: bold;padding-bottom: 5px;line-height: 1.2;}#outer .top_parts .top_txt p{font-size: 1.3em;padding-top: 10px;}#outer .top_parts .top_img{width: 44%;}#outer .top_parts .top_img img{width: 100%;}/*ページジャンプ*/#outer .jump {width: 100%;background-color: #D48A6D;color: black;/* この部分は親要素の文字色 */margin: 0 auto 50px;box-sizing: border-box;position: sticky;top: 0;z-index: 2;padding-bottom: 0;padding-top: 0;max-width: 100%;}/* リンクの文字色を黒に設定 */#outer .jump a {color: ghostwhite;text-decoration: none;/* 必要であれば、下線を消す */font-size: 1.5em;}.jump ul._genre_menu{width: 100%;display: flex;flex-flow: row;justify-content: center;margin: 0;box-sizing: border-box;list-style: none;padding: 0;border-top: solid 2px #000000;border-right: solid 2px #000000;}.jump ul._genre_menu li.global_item{width: 100%;position: relative;border-left: solid 2px #000000;border-bottom: solid 2px #000000;}.jump ul._genre_menu li.global_item:last-child{border-right-style: none;}.jump ul._genre_menu li.global_item a{display: block;padding: 20px 20px 40px 20px;font-weight: bold;text-decoration: none;box-sizing: border-box;text-align: center;color: black!important;}.jump ul._genre_menu li.global_item a::after{content: "";display: block;position: absolute;left: 50%;top: 70%;transform: translate(-50%, -50%);width: 0;height: 0;border-style: solid;border-width: 15px 17.5px 0 17.5px;border-color: #000000 transparent transparent transparent;}/*ページジャンプおわり*//*レコメンドのところ*/#recommend_block{border-top: inherit;}#recommend_block .ec-shelfRole{margin-bottom: 0px;}/*カテゴリボタン設定*/#outer .category_btn{width: 100%;font-size: 1.2em;margin: 15px auto 0px;}#outer .category_btn a{color: ghostwhite;border-bottom: solid 3px #d48a6d;text-decoration: none !important;position: relative;display: block;text-align: center;vertical-align: middle;margin: 10px;padding: 10px;font-weight: bold;border-radius: 100vh;background-color: #C35831;font-size: 22px;}#outer .category_btn a:hover{opacity: 0.7;}/*レコメンドの順位ランキングアイコン*/#recommend_block .ec-shelfRole li.ec-shelfGrid__item:before {content: '';z-index: 2;position: absolute;display: inline-block;width: 25px;height: 25px;background-size: contain;vertical-align: middle;}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(1)::before {background-image: url(/img/icon/rank_category_1.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(2)::before {background-image: url(/img/icon/rank_category_2.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(3)::before {background-image: url(/img/icon/rank_category_3.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(4)::before {background-image: url(/img/icon/rank_category_4.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(5)::before {background-image: url(/img/icon/rank_category_5.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(6)::before {background-image: url(/img/icon/rank_category_6.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(7)::before {background-image: url(/img/icon/rank_category_7.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(8)::before {background-image: url(/img/icon/rank_category_8.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(9)::before {background-image: url(/img/icon/rank_category_9.png);}#recommend_block .ec-shelfRole li.ec-shelfGrid__item:nth-child(10)::before {background-image: url(/img/icon/rank_category_10.png);}/*h2食パン袋のおススメ商品から選ぶ*/#outer h2.uline_b /*h2のCSS*/{font-size: 2em;font-weight: bold;background-color: #FCE8D8;/* 背景色を淡いベージュに設定 */color: black;/* 文字色を黒に設定 */border-top: 1px solid #D48A6D;/* 上側の薄いボーダー */border-left: 1px solid #D48A6D;/* 左側の薄いボーダー */border-right: 1px solid #D48A6D;/* 右側の薄いボーダー */border-bottom: solid 4px #C35831;/* 下側の太い赤系ボーダー */padding: 10px;/* 内側の余白 */margin-top: 45px;margin-bottom: 15px;box-sizing: border-box;/* パディングとボーダー込みで幅を計算 */}/*横並び3つ*//*薄口厚口の丸いやつ*/.rounded-tag {display: inline-block;/* インラインブロックにして、要素の幅を自動調整 */padding: 5px 10px;/* 上下・左右の余白を指定 */background-color: #FCE8D8;/* 背景色を淡いベージュに設定 */color: #333;/* 文字色を黒に設定 */font-weight: bold;/* 太字に設定 */font-size: 1.2em;/* 少し小さめの文字サイズ */border: 1.5px solid #C35831;/* 外側の濃い青系のボーダー */border-radius: 15px;/* 丸みをつける */text-align: center;/* 中央揃え */box-sizing: border-box;width: auto;height: auto;margin-top: 10px;/* 上に余白を追加 */}.rounded-tagnone {display: inline-block;padding: 10px;font-size: 1.2em;/* border: 1.5px solid #C35831;*/border-radius: 15px;text-align: center;box-sizing: border-box;width: auto;height: auto;margin-top: 10px;}#outer .contents_con{display: flex;justify-content: center;gap: 1em;}#outer .contents_con .item_block{padding: 10px;border: solid 1px #CCCCCC;margin-bottom: 15px;}#outer .contents_con .item_block p.item_type{font-size: 1.6em;font-weight: bold;background-color: #FFD7C4;padding: 10px;text-align: center;}#outer .contents_con .item_block{display: block;}#outer .contents_con .item_block .item_detail_01,#outer .contents_con .item_block .item_detail_02{display: flex;}#outer .contents_con .item_block .item_detail_01{padding: 10px 20px 10px 0;}#outer .contents_con .item_block .item_detail_02{padding: 10px 20px 10px 0;gap: 1em;}#outer .contents_con .item_block .item_img{width: 50%;margin-right: 10px;margin: auto;}#outer .contents_con .item_block .detail_a{width: 50%;text-align: center;margin: 0;}#outer .contents_con .item_block p.item_name{font-size: 1.3em;margin: 0;}#outer .contents_con .item_block p.item_price{font-size: 4em;font-weight: bolder;color: red;text-align: center;font-family: 'Century Gothic', sans-serif;}#outer .contents_con .item_block p.item_price::before{content: "￥";font-size: 0.5em;}#outer .contents_con .item_block p.item_price::after{font-size: 0.3em;}#outer ul.btns{width: 95%;margin: 10px auto;}#outer ul.btns a{position: relative;display: block;text-align: center;vertical-align: middle;margin: auto;padding: 8px;font-weight: bold;border-radius: 100vh;background: #F1F0E8;color: #000000!important;font-size: small;text-decoration: none;position: relative;/* 下線風デザインに必要 */box-shadow: 0 3px 0 #D8DBBD;/* 下に影のような線を追加 */}/*横並び3つおわり*//*横並び4つはじめ*//* 見出し部分 */.product-heading {background-color: #FFD7C4;/* 見出しの背景色 */color: #333;/* 見出しの文字色 */font-weight: bold;font-size: 1.6em;padding: 10px;text-align: center;width: 100%;/* 見出しがブロック全体に広がるように */box-sizing: border-box;margin: 0;}#outer .contents_03 {display: flex;flex-wrap: wrap;justify-content: center;margin-bottom: 5px;gap: 1em;}#outer .item_03 {width: 23%;display: flex;flex-direction: column;box-sizing: border-box;border: solid 1px #cccccc;padding: 10px;margin-bottom: 10px;position: relative;}#outer .item_03 .item_txt_03 {padding: 5px;margin-bottom: 30px;font-size: 0.9em;margin: auto;text-align: center;}#outer .item_03 .image-container {display: flex;justify-content: center;/* 横方向の中央揃え */align-items: center;/* 縦方向の中央揃え（高さがある場合） */width: 100%;margin: 0 auto 10px;}#outer .item_img_03 {width: auto;/* 画像の幅をコンテナに合わせる */max-width: 100%;/* 親要素を超えないようにする */height: auto;}#outer .item_03:empty{border: inherit;}/*4つまとめて横並び*/.group-container {border: solid 1px #cccccc;padding: 10px;background-color: #fff;margin-bottom: 1em;box-sizing: border-box;}.group-items {display: flex;flex-wrap: wrap;/* 折り返しを有効化 */gap: 15px;/* 商品間の余白 */justify-content: center;/* 均等配置 */}#outer .group-items .item_03,#outer .double-items .item_03{border: inherit;margin-bottom: 0;}#outer .double-items .item_03{width: 46%;}#outer .three_wrapper .item_03{margin-bottom: 0;width: 48%;}/*4つまとめて横並び*//*2つ並び*/.double-wrapper,.three_wrapper{display: flex;justify-content: space-between;margin-bottom: 20px;}.double-section {width: 49%;/* セクションを横並びで2つ配置 */border: 1px solid #cccccc;padding: 10px;box-sizing: border-box;}.double-items {display: flex;flex-wrap: wrap;gap: 10px;/* 商品間の余白 */}.contents_wrap{display: flex;justify-content: space-between;width: 49%;}/*h2パン袋のサイズ一覧表から選ぶ*/#outer ._tab_title h3/*h3装飾*/{font-size: 1.5em;border-left: solid 10px #703D2B;margin-bottom: 25px;font-weight: bold;padding: 0.5em 1em;box-sizing: border-box;background-color: #FCE8D8;margin-top: 20px;}/* 表のCSS *//* テーブル全体のスタイル */#outer .thickness-table {width: 80%;margin: 0 auto;/* テーブル全体を中央に配置 */border-collapse: collapse;text-align: center;}/* ヘッダーの背景色 */#outer .thickness-table th {padding: 8px;border: 1px solid #ddd;background-color: #FCE8D8;/* 共通の薄いベージュ */font-weight: bold;text-align: center;font-size: large;}#outer .thickness-table th:nth-child(2) {background-color: #f4b19a;/* 0.02mm厚の色 */}#outer .thickness-table th:nth-child(3) {background-color: #f4b19a;/* 0.025mm厚の色 */}#outer .thickness-table th:nth-child(4) {background-color: #f4b19a;/* 0.03mm厚の色 */}/* おすすめ用途の列の背景色 */#outer .thickness-table th:nth-child(5) {background-color:  #A44B33;;padding-left: 10px;color: white;}/* データセルのスタイル */#outer .thickness-table td {padding: 8px;border: 1px solid #ddd;font-size: large;}/* リンクの黒丸スタイル */#outer .circle a {color: black;font-size: 1.2em;text-decoration: none;/* 下線を削除 */}/* リンクのホバー時のスタイル */#outer .circle a:hover {color: #c35831;/* ホバー時に色を変える（例: 濃い茶色） */}/*関連記事のところ*/.column{width: 100%;margin-bottom: 45px;}.column h3{font-size: 1.5em;font-weight: bold;margin: 35px 0 15px;}.column h3::before{content: "┃"}.contents_02{display: flex;flex-wrap: wrap;/*	justify-content: space-between;*/margin: 0 auto;}.contents_02 .item_{width: 32%;box-sizing: border-box;/*	border: solid 1px #cccccc;*/display: flex;flex-direction: column;}.contents_02::after{content: "";display: block;width: 32%;height: 0;}.contents_02 .item_ ul.btns_{margin-top: auto;margin-bottom: 12px;padding: 0 10px;}.contents_02 .item_ ul.btns_ li.btn_gazou_{position: relative;}.item_ .btn_gazou_ a{display: block;position: relative;padding: 10px;color: #000000;background-color: #FCE8D8;font-weight: bold;border-radius: 20px;text-align: center;text-decoration: none;font-size: 1em;}.column ul.tokusyu{display: flex;flex-wrap: wrap;justify-content: space-between;box-sizing: border-box;width: 100%;list-style: none;margin: 0 auto;}.column ul.tokusyu li{width: 23%;margin-bottom: 10px;}.column ul.tokusyu li img{width: 100%;height: auto;}.column ul.tokusyu::before{content: "";display: block;width: 23%;order: 1;}.column ul.tokusyu::after{content: "";display: block;width: 23%;}.btn_gazou_:hover,.tokusyu li:hover{opacity: 0.7;}/*価格*/.item_price {display: flex;align-items: center;gap: 5px;font-size: 2.6em;font-weight: bolder;color: red;text-align: center;justify-content: center;margin-bottom: 0;}.item_price::after {content: "(税込)";font-size: 0.3em;display: inline-block;vertical-align: baseline;margin-left: 0;position: relative;top: 1em;}.unit_price {display: flex;align-items: center;gap: 5px;font-size: 1em;font-weight: bolder;text-align: center;justify-content: center;margin-bottom: 1em;background: linear-gradient(transparent 65%, yellow 30%);color: red;}.unit_price::after {content: "(税込)";font-size: 1em;display: inline-block;vertical-align: baseline;margin-left: 4px;}/* --- typo修正（ついでに） --- */.yokonarabe{display: flex;gap: 1em;margin-bottom: 1em;/* typo直し */}.yokonarabe2{display: flex;gap: 1em;margin-bottom: 1em;/* typo直し */}.item_detail_01{display: flex;/* typo直し */}/* --- ここが本命：group-items を grid に戻す --- *//* スマホ：縦並び */#outer .group-items2{display: grid !important;/* block上書きを潰す */grid-template-columns: 1fr !important;gap: 12px !important;align-items: start;}#outer .group-items2{grid-template-columns: repeat(3, 1fr) !important;}.chosei{margin-top: 1.2em;font-size: 1em;color: gray;}#outer .contents_con .item_block p.item_name{font-size: 1.3em;margin: 0 0 0.7em 0;}#outer p.item_name{font-size: 1.3em;margin: 0.5em;text-align: center;}/*スマホの設定*/@media screen and (max-width: 768px) {#outer{width: 100%;}/*見出し*/#outer .top_parts{flex-direction: column-reverse;}#outer .top_parts .top_txt{width: 100%;padding: 15px;}#outer .top_parts .top_txt h1{font-size: 1.2em;padding: 5px 5px 0 5px;}#outer .top_parts .top_txt p{font-size: 1em;padding: 5px;}#outer .top_parts .top_img{width: 100%;}#outer .top_parts .top_img img{width: 100%;}/* スマホ用ページジャンプCSS */#outer .jump {width: 100%;background-color:transparent;color: black;margin: 0 auto 20px;box-sizing: border-box;position: static;top: 0;z-index: 2;padding: 5px 0;/* 上下余白を調整 */}/* リンクの文字サイズと調整 */#outer .jump a {color: black;text-decoration: none;font-size: 1.1em;/* スマホ向けに文字サイズを少し小さく */}/* ジャンプメニューを横並びに */.jump ul._genre_menu {width: 100%;display: flex;flex-wrap: wrap;/* 必要に応じて折り返す */justify-content: space-around;/* 均等に配置 */margin: 0;box-sizing: border-box;list-style: none;padding: 0;border: none;/* 不要な枠線を削除 */}.jump ul._genre_menu li.global_item {flex: 1 0 45%;/* ボタン幅を50%以下に調整 */margin: 5px;/* ボタン間に余白を追加 */text-align: center;border: none;/* 枠線を削除 */}.jump ul._genre_menu li.global_item a {display: block;padding: 10px;/* 余白を調整 */font-size: 1em;/* テキストサイズ調整 */border: none;border-radius: 5px;/* ボタンの角を少し丸める */background-color: #D48A6D;/* 背景色を調整 */color: black;}/* 矢印マークのサイズと位置調整 */.jump ul._genre_menu li.global_item a::after {content: "";display: block;position: absolute;left: 50%;top: 100%;transform: translate(-50%, 0);width: 0;height: 0;border-style: solid;border-width: 8px 10px 0 10px;/* 矢印のサイズを調整 */border-color: #000000 transparent transparent transparent;/* 矢印色を白に */}/* スマホ用h2 */#outer h2.uline_b {font-size: 1.2em;/* フォントサイズを小さく調整 */padding: 8px;/* 内側の余白を少し小さく */margin-top: 10px;/* 上の余白を縮小 */margin-bottom: 10px;/* 下の余白も縮小 */}#outer ._tab_title h3 {font-size: 1.1em;/* 文字サイズを小さく */border-left: solid 8px #703D2B;/* ボーダーの幅を調整 */margin-bottom: 15px;/* 下余白を狭める */padding: 0.3em 0.8em;/* 内側の余白を調整 */margin-top: 15px;/* 上余白を狭める */}/*カテゴリボタン設定*/#outer .category_btn{width: 95%;margin: 20px auto 20px;}#outer .category_btn a{padding: 6px;font-size: large;margin-bottom: auto;}/*りなほたんのところ*/#outer .contents_con{display: block;}#outer .contents_con .item_block{width: 100%;/* 横幅を少し狭めて余裕を持たせる */margin: 0 auto 10px;/* 左右中央寄せにしつつ、上下に余白を追加 */padding: 10px;/* 内側に余白を設定 */box-sizing: border-box;/* パディングを含めて幅を計算 */}#outer .contents_con .item_block p.item_type{font-size: 1.1em;padding: 5px;}#outer .contents_con .item_block .item_detail_01{padding: 0 0 10px 0;}#outer .contents_con .item_block .item_detail_02{padding: 10px 0 0;}#outer .contents_con .item_block .item_img{margin-right: 10px;}#outer .contents_con .item_block .detail_a{width: 70%;margin: 0 0 0.2em 0;}#outer .contents_con .item_block p.item_name{font-size: 1.1em;}#outer .contents_con .item_block p.item_price{font-size: 3em;}#outer .contents_con .item_block ul.btns{width: 85%;margin: auto;}#outer .contents_con .item_block ul.btns a{margin: auto;padding: 5px;font-size: 0.9em;}/*りなほたんのところ終わり*//*4こならびのとこ　*/#outer .product-heading {font-size: 1.1em;/* 見出しのフォントサイズを小さめに */padding: 8px;/* 余白を調整 */}#outer .contents_03 {flex-wrap: wrap;justify-content: center;gap: 0.5em;}#outer .item_03 {width: 47.5%;/* 各アイテムの幅を調整（2列表示にする） */margin-bottom: 5px;/* 各アイテム間の余白を広げる */}#outer .contents_03 .item_03 p.btn_p {font-size: 1em!important;/* ボタンの文字サイズを少し小さく */padding: 8px;/* ボタン内の余白を調整 */}#outer .contents_03 .item_03 .item_txt_03 {font-size: 0.9em!important;/* テキストのフォントサイズを調整 */}#outer .contents_03 .item_03 .image-container {margin-bottom: 8px;/* 画像下の余白を少し狭める */}#outer .contents_03 .item_img_03 {max-width: 100%;/* 画像をやや小さめに調整 */height: auto;/* 縦横比を保持 */}#outer .contents_con .item_block ul.btns a,.contents_03 .item_03 ul.btns a{font-size: small;}/*4こならびのとこ終わり　*//* 表のCSS */#outer .thickness-table {width: 100%;/* テーブルを画面幅いっぱいにする */font-size: 0.9em;/* フォントサイズを少し小さくする */margin: 0;/* 左右の余白をなくす */}#outer .thickness-table th,#outer .thickness-table td {padding: 5px;/* セル内の余白を減らす */font-size: 0.8em;/* フォントサイズを調整 */}#outer .thickness-table th {text-align: center;}/* スクロール対応: スマホでは横スクロール可能にする */#outer .thickness-table {display: block;overflow-x: auto;/* 横スクロールを可能にする */white-space: nowrap;/* テキストの折り返しを防ぐ */border-collapse: separate;/* ボーダーが見やすくなる */justify-items: center;}#outer .thickness-table th:nth-child(5),#outer .thickness-table td:nth-child(5) {padding-left: 5px;/* スペース調整 */}/* リンクの黒丸の調整 */#outer .circle a {font-size: 0.9em;/* フォントサイズを少し小さく */}/* 表のCSSおわり */.group-container {padding: 15px;margin: 10px;}.double-wrapper, .three_wrapper {display: block;margin: 5px;/* 余白を調整 */}.double-section {width:100%;margin-bottom: 5px;}.double-items {justify-content: space-between;}#outer .three_wrapper .item_03{margin-bottom: 0;width: 48.5%;}.contents_wrap{width: 100%;}/*関連記事のとこ*/.column{width: 100%;}.column h3{padding: 5px;font-size: 1.1em;margin: 0;}.column h3::before{content: "┃"}.contents_02{padding: 0 10px;}.contents_02 .item_{width: 100%;margin: 5px auto;padding: 0;}.contents_02::after{content: none;}#outer.item_ ul.btns_{font-size: 0.8em;width: 100%;margin-bottom: 0;padding: 0;}.contents_02 .item_ ul.btns_ li.btn_gazou_{position: relative;}.item_ .btn_gazou_ a{padding: 10px 0;border-radius: 100vh;color: #000000;font-weight: bold;text-align: center;display: block;position: relative;transition: .3s;margin: 5px;}.btn_gazou{margin-top: 1em;}.column ul.tokusyu{width: 96%;margin: 0 auto;padding: 0;float: none;}.column ul.tokusyu li{width: 49%;}/*価格*/.item_price {font-size: 2.4em;margin: 0;}.unit_price {font-size: 0.9em;}.yokonarabe{display: block;}.yokonarabe2{display: flex;}#outer p.item_name{font-size: 1.1em;margin: 0 0 0.7em 0;}.rounded-tag {font-size: 1em;}#outer .group-items2{display: grid !important;/* block上書きを潰す */grid-template-columns: 1fr !important;gap: 12px !important;align-items: start;}#outer p.item_name{font-size: 1.1em;margin: 0.5em;}}