@charset "UTF-8";
/* CSS Document */
/* tradition/index.html 食卓写真からみる各地域の伝統料理のまとめ */
#tradition2008            { margin: 0 auto; width: 980px; }
#tradition2008 article    { margin: 60px auto; }
#tradition2008 article h2 { margin: 1em auto; text-align: center; font-weight: bold; font-size: 36px; line-height: 1.5; font-family: 'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック', sans-serif; color: #921717; }
#tradition2008 article h3 { margin: .5em auto; text-align: center; font-weight: bold; font-size: 24px; line-height: 1.5; font-family: 'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック', sans-serif; color: #4c4c4c; }
#tradition2008 article h4 { margin: .5em auto; padding: .25em .5em; font-weight: bold; font-size: 18px; line-height: 1.5; font-family: 'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック', sans-serif; color: #921717; }
@media only screen and (max-width: 768px){
#tradition2008            { width: 100%; }
#tradition2008 article    { margin: 6vw auto!important; padding: 0 3vw; }
#tradition2008 article h2 { margin: 2em auto 1em auto; font-size: 6vw!important; }
#tradition2008 article h2 .sp_block { display: inline-block; }
#tradition2008 article h3 { margin: 0 auto .5em auto; font-size: 4.5vw!important; }
}

/* 食卓写真からみる各地域の伝統料理のまとめ */
.j_map     {/* position: relative; */}
.j_map img {  }
.pref_list { /*width: 386px; position: absolute; */ top: 140px; right: 0px;  }
#tradition2008 article .pref_list h4 { text-align: center; font-size: 24px; }
.pref_list ul             { display: flex; flex-wrap: wrap; justify-content: space-between; }
.pref_list ul li          { margin-bottom: 10px; width: calc(25% - 5px); height: 48px; font-size: 18px; font-weight: 900; font-family: "游明朝",YuMincho,"ヒラギノ明朝 ProN W6","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝","MS PMincho","Sawarabi Mincho",serif; }
.pref_list ul li a        { padding-left: 34px; width: 230px; height: 48px; color: #000; border: 1px solid #ccc; border-radius: .5em; display: table-cell; vertical-align: middle; position: relative; }
.pref_list ul li.active   { background-image: none!important; }
.pref_list ul li.active a { background: #fdefec; }
.pref_list ul li a:hover  { background: #fdefec; }
.pref_list ul li a:before { content: '\f0ab'; position: absolute; left: .5em; top: 50%; color: #871717; transform: translateY(-50%); font-family: 'Font Awesome 5 Free'; font-weight: 900; }
.pref_list .pref_ex { margin: 1em auto 0 auto; padding: 1em; width: 60%; background: #fffae7; border: solid 1px #ccc; }
.pref_list .pref_ex p { margin: 0 auto .5em auto; text-align: center; font-weight: bold; }
@media only screen and (max-width: 768px){
.pref_list { width: 100%; position: initial; margin-top: -2em; }
#tradition2008 article .pref_list h4 { margin-top: 0;  font-size: 4vw!important; }
.pref_list ul li   { margin-bottom: .5em; width: calc(33.333% - .25em); height: auto; font-size: 3.3vw; }
.pref_list ul li a { padding: .5em 1em .5em 2em; width: 100%; height: auto; display: block; }
.pref_list .pref_ex { width: 100%; }
}

/* 47都道府県お正月料理例 */
#tradition2008 article.pref_recipe table             { margin: 2em 0 1em 0; width: 100%; border-bottom: solid 2px #921717; }
#tradition2008 article.pref_recipe table tr          { border-top: solid 2px #ccc; }
#tradition2008 article.pref_recipe table tr.pref     { border-top: solid 2px #921717; }
#tradition2008 article.pref_recipe table th          { padding: .25em 1em .5em 0em; vertical-align: top; font-size: 20px; white-space: nowrap; }
#tradition2008 article.pref_recipe table td          { padding: .5em 1em .5em 0; vertical-align: top; font-size: 18px; }
#tradition2008 article.pref_recipe table td span     { display: inline-block; }
#tradition2008 article.pref_recipe table td span.text_under { padding-top: 1px; border-bottom: solid 3px #FF0000; display: inline; }
#tradition2008 article.pref_recipe table tr td:nth-last-child(2) { width: 8em; } 
#tradition2008 article.pref_recipe table tr td:last-child        { padding-right: 0; } 
#tradition2008 article.pref_recipe .cap p            { margin: 0 0 .25em 0; padding-left: 1em; text-indent: -1em; font-size: 14px; }
#tradition2008 article.pref_recipe .cap p:last-child { margin-top: 1em; padding: 1em 0 0 5em; text-indent: -5em; border-top: solid 2px #ccc; }
#tradition2008 article.pref_recipe .cap p:last-child span:after { content: '：'; }
@media only screen and (max-width: 768px){
#tradition2008 article.pref_recipe table               { margin: 0; width: 100%; }
#tradition2008 article.pref_recipe table th            { display: none; }
#tradition2008 article.pref_recipe table tr.sp_pref td { padding: .5em; font-size: 4vw; font-weight: bold; text-align: center; border-top: solid 2px #921717; }
#tradition2008 article.pref_recipe table td            { padding: .5em 1em .5em 0; font-size: 3.3vw; width: 25%; }
#tradition2008 article.pref_recipe table td span       { display: inline; }
#tradition2008 article.pref_recipe table tr td:nth-last-child(2) { width: auto; } 
#tradition2008 article.pref_recipe table tr td:last-child        { padding-right: 0; width: 75%; } 
#tradition2008 article.pref_recipe .cap                          { margin-top: .5em; }
#tradition2008 article.pref_recipe .cap p                        { font-size: 3vw; }
#tradition2008 article.pref_recipe .cap p:last-child             { margin-top: 1em; padding: 1em 0 0 0; text-indent: 0; border-top: solid 2px #ccc; }
#tradition2008 article.pref_recipe .cap p:last-child span        { display: block; font-size: 3.3vw; font-weight: bold; }
#tradition2008 article.pref_recipe .cap p:last-child span:after  { content: ''; }
}
@media only screen and (min-width: 769px){
#tradition2008 article.pref_recipe table tr.sp_pref { display: none;  }
}