@charset "utf-8";

/*
Theme Name:銀の森
Theme URI:https://ginnomori.jp
Description:銀の森 WordPressテーマ
Author:SHIFT Inc.
Version:1.0
*/
html, body { width:100%; height:100%; }
body { position:relative; margin:0; padding:0; color:#000; background:#fff; font-size:15px;  line-height:1.5;
font-family:"游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; }
*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

ul, ol, dl li { padding:0; margin:0; }
h1, h2, h3, h4, h5, h6 { margin-top:0; }
p,figure { margin:0; }
ul { list-style:none; }
img, iframe { vertical-align:bottom; }
button{ background-color:transparent; border:none; cursor:pointer; outline:none; padding:0; appearance:none; }
a img { border:none; }
a:hover { opacity:0.75; filter:alpha(opacity=75); -ms-filter:"alpha( opacity=75 )"; }
hr { height:0; margin:5px 0 30px; border:0; border-top:1px solid #999; border-bottom:1px solid #fff; }
hr.hd { height:0; margin:0; border:0; border-top:1px solid #d2d2d2; border-bottom:none; }
select { font-size:100%; }
input, textarea { padding:5px; border:1px solid #ddd; }
table { border-collapse:collapse; border-spacing:0; }
td    { padding:0; }
a:link    { color:#000; text-decoration:none; }
a:visited { color:#000;  }
a:hover, a:active, a:focus { text-decoration:none; }

.layout_body { max-width:1400px; margin:0 auto; }
.layout_header,
.layout_table { margin:90px 50px 100px; }
.layout_table2 { margin:90px 0 100px; }
/* .layout_footer {} */

.headlineNews { margin:0 50px 20px 50px; padding:5px 10px; border:1px solid #f00; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }

.swiper-container { margin-bottom:30px; }
.swiper-pagination-bullet-active { background-color:#fff; }
.swiper-button-prev { background-size:20px 33px;  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }
.swiper-button-next { background-size:20px 33px;  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }

.topMainBnr { display:flex; justify-content:space-between; width:100%; max-width:1400px; margin:0 auto 30px; }
.topMainBnr li { width:33.2%; }
.topBnr img { margin-bottom:20px; }
.topSubBnr { display:flex; flex-wrap:wrap; justify-content:space-between; }
.topSubBnr li { width:49%; }
.topNews { width:calc(100% - 530px); }
.topNews h3 { background-color:#004625; margin-bottom:15px; padding:3px 10px; color:#fff; }
.topNews dl { margin:0; }
.topNews dt { padding-left:15px; font-size:12px; font-weight:bold; }
.topNews dd { margin:0 0 17px 0; padding:0 0 15px 15px; border-bottom:1px dotted #999; font-size:15px; }

.container { display:flex; justify-content:space-between; }
.lclm { width:220px; margin-bottom:20px; }
.lclm > div { position:-webkit-sticky; position:sticky; top:0; }
.rclm { width:calc(100% - 250px); }

nav { position:relative; margin-bottom:30px; padding:0; }
nav ul { list-style:none; }
/*
nav ul { border-top:1px dotted #ccc; }
nav ul li { border-bottom:1px dotted #ccc; }
  
nav ul li a { display:block; padding:10px 0; line-height:40px; text-decoration:none !important; outline:none; }
nav ul li a:hover { background:url(/img/ico-arrow.png) right center no-repeat; background-size:4%; text-decoration:underline !important; }*/ 
nav ul li a img { margin-right:8px; }
.sideBnr li { margin-bottom:10px; }

/* footer { margin-top:80px; padding:50px 0;border-top:1px solid #014725;}
  footer > div { max-width:1400px; margin:0 auto; padding:0 50px; }
footer .ftGuide { display:flex; justify-content:space-between; font-size:14px; }
footer .ftGuide > div { width:48%; }
footer .ftGuide h3 { margin-bottom:10px; color:#004625; font-size:18px; line-height:1.2; }
footer .ftGuide h4 { display:inline-block; background-color:#004625; margin-bottom:5px; padding:2px 10px; color:#fff; font-size:14px; font-weight:normal; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }
footer .ftGuide ul { list-style-type:disc; }
footer .ftGuide li { margin-left:1.5em; }
footer .ftGuide > div:last-child ul { margin-bottom:20px; }
footer .ftGuide > div:last-child ul.mb30 { margin-bottom:30px; }
footer table { width:100%; margin-bottom:10px; }
footer th,
footer td { padding:5px; border:1px solid #ccc; text-align:center; }
footer th { background-color:#fff; font-weight:normal; }
footer td { background-color:#fff; }
footer .tbl1 td { }
footer .desc1 { margin-bottom:10px; }
footer .desc2 { margin-bottom:30px; color:#e00; font-size:16px; }
footer .desc3 { margin-bottom:10px; background-color:#e00; padding:5px 0; color:#fff; font-size:18px; font-weight:bold; text-align:center; letter-spacing:5px; }
footer .desc4 { margin-bottom:10px; font-size:18px; font-weight:bold; text-align:center; letter-spacing:5px; }
footer .desc5 { margin-bottom:20px; }
footer .desc6 { margin-bottom:10px; padding:20px; border:2px solid #e00; color:#e00; text-align:center; font-size:20px; font-weight:bold; -moz-border-radius:60px; -webkit-border-radius:60px; border-radius:60px; }
footer .desc7 { margin-bottom:30px; font-size:20px; font-weight:bold; text-align:center; letter-spacing:30px; }
footer .coolShipping { display:flex; align-items:center; margin:0 0 20px; }
footer .coolShipping li { min-height:30px; margin-left:0; list-style:none; font-size:12px; line-height:1.3; }
footer .coolShipping li:nth-child(1) { background:url(/img/ico-refrigeration.png) 0 0 no-repeat; background-size:30px; margin-right:20px; padding-left:35px; }
footer .coolShipping li:nth-child(2) { background:url(/img/ico-frozen.png) 0 0 no-repeat; background-size:30px; margin-right:20px; padding-left:35px; }
.ftInfo { display:flex; justify-content:space-between; background-color:#004625; padding:50px; color:#fff; font-size:14px; }
.ftInfo > div { margin-right:auto; }
.ftInfo > ul { margin-left:40px; }
.ftInfo > ul:first-child { margin-left:0; }
.ftInfo img { margin-bottom:20px; }
.ftLinks li { margin-bottom:5px; }
.ftLinks li a { color:#fff; font-size:12px; } */

h1.cttl { margin:0 0 30px; padding-top:60px; text-align:center; }
h2.bdb { margin-bottom:40px; border-bottom:1px solid #004625; color:#004625; }
h2.recipe { margin-bottom:20px; padding-top:20px; border-top:1px solid #999; color:#333; font-size:16px; text-align:center;}
h3.bdb { color:#004625; margin-top:50px; }
h3.recipe { display:inline-block; margin-bottom:15px; padding:5px 30px; border:1px solid #004625; color:#004625; font-size:16px; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }

ul.recipeIdx { display:flex; flex-wrap:wrap; margin-bottom:60px; }
ul.recipeIdx li { width:33.3%; margin-bottom:30px; }
/* 3列リストの一番左下にある要素 */
/* 3列リストの一番左下にある要素以降にあるliすべて */
ul.recipeIdx li:nth-child(3n+1):nth-last-child(-n+3),
ul.recipeIdx li:nth-child(3n+1):nth-last-child(-n+3) ~ li { margin-bottom:0; }

ul.recipeIdx li a { display:flex; align-items:center; padding-right:1em; font-size:16px; }
ul.recipeIdx li a img { width:90px; height:60px; margin-right:1em; }
figure.recipeMain { margin-bottom:30px; text-align:center;}
figure.recipeMain img { width:80%;}
.recipeInfo { display:flex; justify-content:space-between; margin-bottom:30px; }
.recipeInfo > div { width:47%; }
.recipeInfo .recipeRcmd { padding:20px; border:1px solid #aaa; line-height:1.8; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }
.recipeInfo .recipeMaterial li { display:flex; margin-bottom:5px; padding:0 0 5px 1em; border-bottom:1px dashed #999; }
.recipeInfo .recipeMaterial li a,
.recipeInfo .recipeMaterial li p { width:75%; display:block; }
.recipeInfo .recipeMaterial li span { width:25%; display:block; padding-right:1em; text-align:right; }

.recipeSteps { display:flex; flex-wrap:wrap; margin-bottom:50px; }
.recipeSteps li { width:18.4%; margin-right:2%; font-size:14px; }
.recipeSteps li:nth-child(5n) { margin-right:0; }
.recipeSteps li img { width:100%; height:auto; margin-bottom:5px; }

.recipeMoreInfo { padding:30px; border:1px solid #aaa; line-height:2; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }

.columnIdx { display:flex; flex-wrap:wrap; margin-bottom:40px; }
.columnIdx li { width:32%; margin:0 2% 20px 0; }
.columnIdx li:nth-child(3n) { margin-right:0; }
.columnIdx li a { display:block; padding:15px; border:1px solid #ccc; text-decoration:none; }
.columnIdx li a:hover { background-color:#fffadf; opacity:1; filter:alpha(opacity=100); -ms-filter:"alpha(opacity=100)"; }
.columnIdx li a img { width:100%; height:auto; margin-bottom:7px; }
.columnIdx li a strong { display:block; margin-bottom:5px; padding-bottom:5px; border-bottom:1px dotted #999; }
.columnIdx li a p { font-size:14px; }

.columnLayout { display:flex; justify-content:space-between; margin-top:60px; }
.columnLayout p { margin-bottom:1em; }
.columnBody { width:70%; }
.columnSidebar { width:25%; }
.columnSidebar div h2 { margin-bottom:15px; background-color:#004625; padding:3px 0; color:#fff; font-size:16px; text-align:center; border-radius:8px; }
/* .columnSidebar > div h2 { margin-bottom:15px; border-bottom:1px dotted #004625; color:#004625; font-size:18px; } */
.columnSidebar div ol { margin:0 0 40px 1.5em; }

/* .columnSidebar ul ul li { margin:0 0 15px 1.5em; list-style-type:disc; } */
.columnBack { margin-top:40px; }

/* 追記 */
.recipeInfo .recipeMaterial li a{text-decoration:underline;}

/* レシピカテゴリー */
.recipe-slction-title { margin:0 0 1.5em; font-size:26px; text-align:center; }
.recipe-cat-title { margin:0; padding-top:60px; text-align:center; }
.heading-deco { position:relative; display:inline-block; padding:0 65px; }
.heading-deco:before, .heading-deco:after { content:''; position:absolute; top:50%; display:inline-block; width:45px; height:1px; background-color:black; }
.heading-deco:before { left:0; }
.heading-deco:after { right:0; }

.staff-picks-section { max-width:1140px; margin:60px auto 0; }
.staff-pick-item { display:grid; grid-template-columns:500px 1fr; gap:40px; }
/* .staff-pick-desc { display:flex; flex-wrap:wrap; } */
.staff-pick-item .post-thumbnail img { width:100%; height:auto; }
.staff-pick-badge span { display:inline-block; background:#c53203; padding:3px .5em; color:#fff; font-size:16px; }
.staff-pick-item .post-title { margin:15px 0 0; font-size:20px; font-weight:normal; }
.staff-pick-item .recipe-copy { margin-top:1em; font-size:16px; }
.staff-pick-item .recipe-desc { margin-top:1em; font-size:16px; }
.staff-pick-item .post-tags { margin-top:2em; }

.recipe-cat-section { max-width:1140px; margin:100px auto 0; }
.recipe-cat-posts { display:grid; grid-template-columns:repeat(4, 1fr); gap:30px 30px; }
.recipe-cat-posts .post-thumbnail img { width:100%; height:auto; }
.recipe-cat-posts .post-title { margin:10px 0; font-size:16px; font-weight:normal; text-align:center; }

.post-tags { display:flex; flex-wrap:wrap; gap:10px 5px; }
.post-tags.post-tags-alc { justify-content:center; }
.post-tags a { display:inline-block; background:#fdf1d2; padding:3px 10px; border-radius:100vh; }

.recipe-search-container { max-width:600px; margin:20px auto; }
.recipe-search-form { width:100%; }
.search-input-wrapper { display:flex; align-items:center; border:2px solid #ddd; border-radius:100vh; overflow:hidden; transition:border-color 0.3s; }
.search-input-wrapper:focus-within { border-color:#666; }
.recipe-search-input { flex:1; padding:12px 20px; border:none; outline:none; font-size:16px; background:transparent; }
.recipe-search-input::placeholder { color:#999; }
.recipe-search-button { padding:12px 20px; background:#006636; border:none; cursor:pointer; color:white; display:flex; align-items:center; justify-content:center; transition:background 0.3s; }
.recipe-search-button:hover { background:#555; }
.recipe-search-button svg { width:20px; height:20px; }

.search-result-none { margin-top:60px; font-size:16px; text-align:center; }

/* レスポンシブ対応 */
@media (max-width:768px) {
  .recipe-search-container { margin:15px; }
  .recipe-search-input { font-size:14px; padding:10px 15px; }
  .recipe-search-button { padding:10px 15px; }
}

/* 人気のキーワード */
.hot-keywords-section { max-width:1140px; margin:60px auto 0; padding:30px 0; background:#FEF8E8; text-align:center; }
.hot-keywords-list { display:flex; justify-content:center; gap:10px; }
.keyword-link { background:#fff; padding:2px .75em; border:1px solid #333; border-radius:100vh; }
.keyword-link:hover { background:#006636; border:1px solid #006636; color:#fff; text-decoration:none; opacity:1; }

/* ボタンラッパー */
.button-wrapper { text-align:center; margin:0 0 100px; }

/* ボタンコンテナ */
.back-to-top-button { display:inline-flex; align-items:center; gap:20px; padding:12px 40px 12px 20px; background:white; border:2px solid #0a6638; border-radius:50px; text-decoration:none; transition:all 0.3s ease; cursor:pointer; min-width:300px; position:relative; }

/* 円形アイコン部分 */
.back-to-top-button .icon-circle { width:40px; height:40px; background:#0a6638; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }

/* 下向き矢印 */
.back-to-top-button .arrow { width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent; border-top:12px solid white; transform:rotate(180deg); /* 上向きに変換 */ }

/* テキスト部分 */
.back-to-top-button .text { font-size:18px; color:#0a6638; font-weight:500; letter-spacing:0.05em; flex-grow:1; text-align:center; }

/* ホバー効果 */
.back-to-top-button:hover { background:#f8fffe; transform:translateY(-2px); box-shadow:0 4px 8px rgba(10, 102, 56, 0.15); }

.back-to-top-button:hover .icon-circle { background:#085030; }

/* クリック効果 */
.back-to-top-button:active { transform:translateY(0); box-shadow:0 2px 4px rgba(10, 102, 56, 0.15); }

/* リンクとして使用する場合のスタイル */
a.back-to-top-button { text-decoration:none; }

/* レスポンシブ対応 */
@media (max-width:480px) {
  .back-to-top-button { min-width:250px; padding:10px 30px 10px 15px; }
  .back-to-top-button .icon-circle { width:35px; height:35px; }
  .back-to-top-button .text { font-size:16px; }
}