@charset "utf-8";
/* 教室タイトル帯 */
#content_header           { background: rgba(148,112,220,.2); border-color: #9470dc; }
#content_header h1        { color: #9470dc; }
#content_header h1:before { border: solid 2px #9470dc; }
#content_header h1 span   { font-size: 12px; }
.content_section h3       { color: #9470dc; }
/* 中カテゴリー帯 */
.category_section h3        { background: rgba(148,112,220,.2); }
.category_section h3:before { color: #9470dc; border: solid 2px #9470dc; }
/* コンテンツ・タイトル  */
.syoku_container #content_title .inner   { border-color: #9470dc; }
.syoku_container #content_title ul       { border-color: #9470dc; }
.syoku_container #content_title .lead    { border-color: #9470dc; }
.syoku_container #content_title .profile { background: #f2f9ff; border: 1px solid #9470dc; }
/* タイトルビジュアル */
.syoku_container.chronicle #content_title .inner { background: url(../img/visual/chronicle.png) right no-repeat; background-size: 320px; }
.syoku_container.glossary #content_title .inner  { background: url(../img/visual/glossary.png) right no-repeat; background-size: 320px; }
@media only screen and (max-width: 768px){
.syoku_container.chronicle #content_title .inner,
.syoku_container.glossary #content_title .inner  { background: none; }
.syoku_container.chronicle #content_title .lead  { background: url(../img/visual/chronicle.png) 50% 1em no-repeat; background-size: contain; }
.syoku_container.glossary #content_title .lead   { background: url(../img/visual/glossary.png) 50% 1em no-repeat; background-size: contain; }
}

/*扉リサイズ ハーフサイズ*/
@media only screen and (min-width: 769px){
.syoku_container .category_section .inner                  { display: flex; flex-wrap: wrap; justify-content: space-between; }
.syoku_container .category_section .inner .half_size       { width: 470px; }
.syoku_container .category_section .inner .half_size ul li { margin-left: 20px;}
}

/* 紀文「食」年表
================================================================= */
/*年表表組 indexボタン*/
.content_section ul#chronicle_link      { display: flex; justify-content: space-between; margin-bottom: 40px; }
.content_section ul#chronicle_link li   { width: 150px; text-align: center; }
.content_section ul#chronicle_link li a { display: block; padding: .5em 0 1.25em 0; font-weight: bold; font-size: 16px; color: #fff; background: #594384; border-radius: .5em; position: relative; }
.content_section ul#chronicle_link li a:after { content: '\f0d7'; font-weight: 900; font-family: FontAwesome; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); -webkit-font-smoothing: antialiased; }
/*年表表組タブ*/
.content_section ul#chronicle_title    { display: flex; justify-content: space-between; }
.content_section ul#chronicle_title li { margin: 0; padding: .5rem; font-size: 20px; text-align: center; color: #594384; background: #f4f0fb; border: 2px solid #d4c6f1; border-bottom: none; border-radius: 1rem 1rem 0 0; }
.content_section ul#chronicle_title li#chro_blu { width: 270px; }
.content_section ul#chronicle_title li#chro_ora { width: 690px; }
/*年表表組和暦*/
.content_section #chronicle h4       { margin: 0; padding: .5em!important; text-align: center; font-weight: bold!important; font-size: 30px; color: #9470dc; background: #fff!important; border: 2px solid #d4c6f1; display: block; }
.content_section #chronicle h4:before,
.content_section #chronicle h4:after { border: none; }

#chronicle .reki_unit dl    { display: flex; }
#chronicle .reki_unit dl dt { display: flex; width: 270px; color: #594384; background: #f4f5f7 /*#f4f0fb*/; border: 1px solid #d4c6f1; border-width: 0 1px; }
#chronicle .reki_unit dl dt .wareki         { width: 50%; padding: 8px 1em; text-align: right; border-right: 2px dotted #d4c6f1; }
#chronicle .reki_unit dl dt .seireki        { width: 50%; padding: 8px 1em; text-align: right; }
#chronicle .reki_unit dl dd                 { width: 690px; margin: 8px 0 8px 20px; padding: 1em; font-size: 16px; border-radius: .5em; }
#chronicle .reki_unit dl dd p               { margin-bottom: 0; font-size: 93%; }
#chronicle .reki_unit dl:first-child dd     { margin-top: 20px; }
#chronicle .reki_unit dl:last-child dd      { margin-bottom: 20px; }
#chronicle .reki_unit dl:first-child dt div { padding-top: 20px; }
#chronicle .reki_unit dl.next dt div        { padding-top: 0; }
#chronicle .reki_unit dl.next dd            { margin-top: 0; }

#chronicle div#btm                   { border-top: 2px solid #d4c6f1; }
#chronicle .reki_unit dl dd.odentopi { background: rgba(111, 186, 44, 0.1); border: solid 1px #c1db98; }
#chronicle .reki_unit dl dd.neritopi { background: rgba(255,165,0,.1); border: solid 1px #f2ba85; }
#chronicle .reki_unit dl dd.nabetopi { background: #f9f9d9; border: solid 1px #ffcf04; }
#chronicle .reki_unit dl dd.kibutopi { background: #fcf3f1; border: solid 1px #edb7b0; }
#chronicle .reki_unit dl dd.denttopi { background: #f2f9ff; border: solid 1px #7fc1fe; }

#chronicle .reki_unit dl dd sub      { font-size: 1.2em; vertical-align: sub; }
#chronicle .reki_unit dl dd.odentopi p,
#chronicle .reki_unit dl dd.neritopi p,
#chronicle .reki_unit dl dd.nabetopi p,
#chronicle .reki_unit dl dd.kibutopi p,
#chronicle .reki_unit dl dd.denttopi p  { padding-left: 5rem; position: relative; }

#chronicle .reki_unit dl dd p:before          { content: ''; display: block; width: 4rem; text-align: center; position: absolute; left: 0; top: 50%; font-size: 12px; font-weight:700; font-family: sans-serif; transform: translateY(-50%); }
#chronicle .reki_unit dl dd.odentopi p:before { content: 'おでん'; color: #4d821f; }
#chronicle .reki_unit dl dd.neritopi p:before { content: '練りもの'; color: #b27300; }
#chronicle .reki_unit dl dd.nabetopi p:before { content: '鍋'; color: #b29003; }
#chronicle .reki_unit dl dd.kibutopi p:before { content: '紀文'; color: #b10000; }
#chronicle .reki_unit dl dd.denttopi p:before { content: '伝統食品'; color: #5987b1; }

@media only screen and (max-width: 768px){
/*年表表組 indexボタンsp*/
.content_section ul#chronicle_link           { display: table; width: 100%; margin: 0 auto 1em auto; text-align: center; }
.content_section ul#chronicle_link li        { float: left; margin: .25em 0; font-size: 0.9em; text-align: center; background: none; box-sizing: border-box; }
.content_section ul#chronicle_link li.old_up { width: 50%; border-left: 3px solid #fff; border-right: 3px solid #fff; }
.content_section ul#chronicle_link li.old_lw { width: 50%; border-left: 3px solid #fff; border-right: 3px solid #fff; }
.content_section ul#chronicle_link li a      { display: block; margin: 0; font-size: 1.1em; color: #fff; }
/*年表表組タブ*/
.content_section ul#chronicle_title    { display: flex; justify-content: space-between; }
.content_section ul#chronicle_title li { margin: 0; padding: .5rem; font-size: 20px; text-align: center; color: #594384; background: #f4f0fb; border: 1px solid #d4c6f1; border-bottom: none; border-radius: .5em .5em 0 0; }
.content_section ul#chronicle_title li#chro_blu { display: none; }
.content_section ul#chronicle_title li#chro_ora { width: 100%; }
/*年表表組和暦*/
.content_section #chronicle h4       { margin: .5em 0 0 0; padding: .5em!important; text-align: center; font-weight: bold!important; font-size: 1.2em!important; color: #9470dc; background: #fff!important; border: 1px solid #d4c6f1; display: block; }
.content_section #chronicle h4:before,
.content_section #chronicle h4:after { border: none; }

.syoku_container .content_section ul#chronicle_title     { display: table; width: 100%; text-align: center; }
.syoku_container .content_section ul#chronicle_title li  { padding: .5em; font-weight: bold; font-size: 1em; text-align: center; color: ; }

#chronicle .reki_unit dl    { display: flex; flex-flow: column; }
#chronicle .reki_unit dl dt { padding:.25em; width: 100%; font-size: .85em; color: #594384; background:#f4f5f7; border: 1px solid #d4c6f1; border-width: 1px; border-radius: .5em .5em 0 0; }
#chronicle .reki_unit dl dt .wareki         { display: inline; width: auto; padding: 0 .5em 0 .5em; text-align: left; border: none; }
#chronicle .reki_unit dl dt .seireki        { display: inline; width: auto; padding: 0; text-align: left; }
#chronicle .reki_unit dl dd                 { width: 100%; margin: .15em 0 .5em 0; padding: .5em; font-size: 1em; border-radius: 0 0 .5em .5em; }
#chronicle .reki_unit dl.pre_nxt dd         { border-radius: 0; }
#chronicle .reki_unit dl dd p               { margin-bottom: 0; font-size: .8em!important; }
#chronicle .reki_unit dl:first-child dt     { margin-top: .5em; }
#chronicle .reki_unit dl:first-child dd     { margin-top: .15em; }
#chronicle .reki_unit dl:last-child dd      { margin-bottom: .5em; }
#chronicle .reki_unit dl:first-child dt div { padding-top: 0; }
#chronicle .reki_unit dl.next dt            { display: none; }
#chronicle .reki_unit dl.next dd            { margin-top: calc(-.5em - 1px); }
#chronicle div#btm                   { border-top: 1px solid #d4c6f1; }
#chronicle .reki_unit dl dd.odentopi { background: rgba(111, 186, 44, 0.1); border: solid 1px #c1db98; }
#chronicle .reki_unit dl dd.neritopi { background: rgba(255,165,0,.1); border: solid 1px #f2ba85; }
#chronicle .reki_unit dl dd.nabetopi { background: #f9f9d9; border: solid 1px #ffcf04; }
#chronicle .reki_unit dl dd.kibutopi { background: #fcf3f1; border: solid 1px #edb7b0; }
#chronicle .reki_unit dl dd sub      { font-size: 1.2em; vertical-align: sub; }
#chronicle .reki_unit dl dd.odentopi p,
#chronicle .reki_unit dl dd.neritopi p,
#chronicle .reki_unit dl dd.nabetopi p,
#chronicle .reki_unit dl dd.kibutopi p  { padding-left: 5em; position: relative; }

#chronicle .reki_unit dl dd p:before    { content: ''; display: block; width: 4em; text-align: center; position: absolute; left: 0; top: 50%; font-size: 10px; font-weight:400; font-family: sans-serif; transform: translateY(-50%); }
}

/* 用語集 */
#Container.glossary .content_section .inner { padding-bottom: 40px; }
#glossary_link        { display: flex; justify-content: center; }
#glossary_link li     { margin: 0 4px; text-align: center; font-weight: bold; font-size: 1.5em; }
#glossary_link li a   { display: block; padding: .25em 1.25em; color: #fff; background: #9470dc; border: 2px solid #9470dc; border-bottom: 0; border-radius: 4px 4px 0 0; }
#glossary_link li.pos { display: block; padding: .25em 1.25em; color: #9470dc; border: 2px solid #9470dc; border-bottom: 0; border-radius: 4px 4px 0 0; }
#yogo           { margin: 0 auto; padding: 2em 40px; border: 2px solid #9470dc; border-radius: 1em; }
#yogo dt        { margin: 1em 0 0 0; padding: 0 0 .5em 1.5rem; font-weight: bold; font-size: 1.5em; color: #000; border-bottom: 1px dotted #9470dc; position: relative; }
#yogo dt:before { content: '▶'; color: #9470dc; position: absolute; top: 0; left: 0; }
#yogo dd        { margin: 0; padding: .75em 0 .5em 1.5rem; }

@media only screen and (max-width: 768px){
#Container.glossary .content_section .inner { padding-bottom: ; }
#glossary_link        { display: table; width: 100%; margin: 0 auto .5em auto; text-align: center; }
#glossary_link li     { float: left; margin: .25em 3px; width: calc(20% - 6px); font-size: 1.2em; border: 2px solid #9470dc; border-radius: .25em; }
#glossary_link li a   { padding: .25em 0; border: none; border-radius: initial; }
#glossary_link li.pos { padding: .25em 0; border: 2px solid #9470dc; border-radius: .25em; }
#yogo    { padding: 1em; }
#yogo dt { margin: 0; font-size: 1.2em; }
}
