@charset "utf-8";
/* 教室タイトル帯 */
#content_header                     { background: rgba(127,193,254,.2); border-color: #7fc1fe; }
#content_header h1                  { color: #7fc1fe; }
#content_header h1:before           { border: solid 2px #7fc1fe; }
.shiokara #content_header h1:after  { content: '塩辛'; }
.kabayaki #content_header h1:after  { content: '蒲焼き'; }
.kuzumochi #content_header h1:after { content: 'くずもち'; }
.gomatofu #content_header h1:after  { content: 'ごまとうふ'; }
/* 中カテゴリー帯 */
.category_section h3        { background: rgba(127,193,254,.2); }
.category_section h3:before { color: #7fc1fe; border: solid 2px #7fc1fe; }
/* コンテンツ・タイトル  */
#Container .content_section h3         { color: #7fc1fe; }
#Container .content_section h4         { color: #7fc1fe; }
#Container .content_section h4:before,
#Container .content_section h4:after   { border-top: 2px solid #7fc1fe; }

.dento_container #content_title .inner { border-color: #7fc1fe; }
.dento_container #content_title ul     { border-color: #7fc1fe; }
.dento_container #content_title .lead  { border-color: #7fc1fe; }
.dento_container .profile              { background: #f2f9ff; border: 1px solid #7fc1fe; }
/* タイトルビジュアル */
.dento_container.worldOsechi #content_title .inner  { background: url("/knowledge/dento/img/visual/worldOsechi.jpg") right no-repeat; background-size: 320px; }
.dento_container.shiokara #content_title .inner     { background: url(/knowledge/dento/img/visual/shiokara.png) right no-repeat; background-size: 320px; }
.dento_container.kabayaki #content_title .inner     { background: url(/knowledge/dento/img/visual/kabayaki.png) right no-repeat; background-size: 320px; }
.dento_container.kuzumochi #content_title .inner    { background: url(/knowledge/dento/img/visual/kuzumochi.png) right no-repeat; background-size: 320px; }
.dento_container.gomatofu #content_title .inner     { background: url(/knowledge/dento/img/visual/gomatofu.png) right no-repeat; background-size: 320px; }
.dento_container.shikki #content_title .inner       { background: url(/knowledge/dento/img/visual/shikki.png) right no-repeat; background-size: 320px; }

.dento_container p { margin: 0 0 1em 0; }

.content_section .kakomi {
    margin: 0 0 2em 0;
    padding: 0;
    background: #fff;
    border: 2px solid #7fc1fe;;
    border-radius: 1rem;
}
.content_section.outro h5 {
    margin: 0;
    padding: 0.75em 1rem;
    font-size: 24px;
    color: #7fc1fe;;
    border-bottom: 2px solid #7fc1fe;
}
.content_section.outro .flex {
    padding: 1em;
}

@media only screen and (max-width: 768px){
.dento_container.shiokara #content_title .inner,
.dento_container.kabayaki #content_title .inner,
.dento_container.kuzumochi #content_title .inner,
.dento_container.gomatofu #content_title .inner,
.dento_container.shikki #content_title .inner{ background: none; }
.dento_container.shiokara #content_title .lead   { background: url(/knowledge/dento/img/visual/shiokara.png) 50% 1em no-repeat; background-size: contain; }
.dento_container.kabayaki #content_title .lead   { background: url(/knowledge/dento/img/visual/kabayaki.png) 50% 1em no-repeat; background-size: contain; }
.dento_container.kuzumochi #content_title .lead  { background: url(/knowledge/dento/img/visual/kuzumochi.png) 50% 1em no-repeat; background-size: contain; }
.dento_container.gomatofu #content_title .lead   { background: url(/knowledge/dento/img/visual/gomatofu.png) 50% 1em no-repeat; background-size: contain; }
.dento_container.shikki #content_title .lead   { background: url(/knowledge/dento/img/visual/shikki.png) 50% 1em no-repeat; background-size: contain; }
}

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

/* ～カ条リスト */
.kajyo h4                   { color: #7fc1fe; }
.kajyo .title_border:before,
.kajyo .title_border:after, 
.kajyo .pointlist           { border-color: #7fc1fe; }

.content_section.recipe          { margin-top: 0em; background: rgba(127,193,254,.2); border-color: #7fc1fe; }
.content_section.recipe .letter  { font-weight: bold; }
.content_section.recipe .profile { display: block!important; position: relative; width: 640px; margin: 1em auto; font-size: 14px; border-radius: .5em; }
@media only screen and (max-width: 768px){
.content_section.recipe .inner   { padding: 0 1em; }
}

/*共通　先頭のアンカーリンク*/
/* ごまとうふ */
.dento_toplink .dentolink           { margin: 0 auto; text-align: center; display: flex; justify-content: center; }
.dento_toplink .dentolink .out_line { margin: 0 .5em; padding: 2px; width: 360px; border: solid 2px #fe0000; border-radius: 6px; display: inline-block; }
.dento_toplink .dentolink p         { margin: 0!important; padding: 0!important; font-family: sans-serif; background-image: linear-gradient(to right, #fe0000 0%, #fe8080 100%)!important; border-radius: 4px; position: relative; }
.dento_toplink .dentolink p a       { padding: 0 3rem 0 .5rem; height: 3rem; line-height: 3rem; font-weight: bold; font-size: 16px; text-decoration: none; color: #fff; display: block; position: relative; }
.dento_toplink .dentolink p a:after { content: '\f078'; font-weight: 900; font-family: FontAwesome; text-align: center; width: 3rem; height: 3rem; background: #fe0000; position: absolute; top: 0; right: 0; border-radius: 0 4px 4px 0; -webkit-font-smoothing: antialiased; }
.dento_toplink .dentolink p a span  { font-size: 12px; }

@media only screen and (max-width: 768px){
.dento_toplink .dentolink            { margin: 0; }
.dento_toplink .dentolink .out_line  { margin: 1rem 0 0 0; padding: 2px; width: 100%; }
.dento_toplink .dentolink p          { margin: 0!important; padding: 0!important; overflow: hidden; }
.dento_toplink .dentolink p a        { padding: 0 3rem 0 .5rem; font-size: 4vw; }
.dento_toplink .dentolink p a span   { font-size: 3.3vw; }
}

/* アジアの食文化「塩辛」 */
@media only screen and (max-width: 768px){
.content_section.kome_sake .fix_center640 .r_single img { margin-top: .5em; }
}
/* 江戸情緒を楽しむ「蒲焼き」 */
/* 江戸期発祥「関東風くずもち」 */
#content_title ul li.bl                   { display: inline; }
#content_title ul li.bl span:nth-child(2) { padding-left: 3em; }
#hakko .inner .l_double img { margin-bottom: 1em; }
@media only screen and (max-width: 768px){
#content_title ul li.bl                   { display: inline-block; }
#content_title ul li.bl span:nth-child(2) { padding-left: 0; }
.kuzumochi .ofu                           { float: right; width: 50%; padding-left: 1em; }
}
.howto_make ul                 { display: flex; flex-wrap: wrap; margin-right: -40px; }
.howto_make ul li              { margin-right: 40px; width: 300px; }
.howto_make ul li h5           { font-size: 18px; line-height: initial!important; margin-bottom: 0; padding: .75em 0; display: block; position: relative; }
.howto_make ul li h5:before    { content: '1'; width: 40px; height: 40px; display: inline-block; margin-right: .25em; font-size: 24px; font-weight: bold; color: #fff; background: #7fc1fe; text-align: center; border-radius: 10%; }
.howto_make ul li:nth-child(2) h5:before { content: '2'; }
.howto_make ul li:nth-child(3) h5:before { content: '3'; }
.howto_make ul li:nth-child(4) h5:before { content: '4'; }
.howto_make ul li:nth-child(5) h5:before { content: '5'; }
.howto_make ul li:nth-child(6) h5:before { content: '6'; }
.howto_make ul li img          { width: 100%;  margin-bottom: 1em; }
.howto_make ul li .comment     { padding: 1em; background: #fff; border: 1px solid #7fc1fe; border-radius: .5em; }
.howto_make ul li .comment h6  { margin-bottom: .5em; }
.howto_make ul li .comment p   { margin-bottom: 0; }
@media only screen and (max-width: 768px){
.howto_make ul                 { display: flex; flex-wrap: wrap; margin-right: 0px; }
.howto_make ul li              { margin-right: 0px; width: 100%; }
}
.kuzumochi p img.fl_left { margin-right: 1em; margin-bottom: 1em; float: left; width: 130px; }
.konoaji p img.fl_right  { float: right; margin: 0 0 .5em 1em; width: 300px; }
@media only screen and (max-width: 768px){
.kuzumochi p img.fl_left { margin-right: 1em; margin-bottom: 1em; float: left; width: 25%; }
.konoaji p img.fl_right  { float: right; margin: 0 0 1em 1em; width: 50%; }
}
/* 先人の知恵「ごまとうふ」 */
.gomatofu #content_title ul li { display: inline-block; }
.fucha .left_half img { margin-bottom: 1em; }
.hyakuchin            { padding: 0 1em; margin: 1em 0 0 0; position: relative; }
.hyakuchin .hyoshi    { width: 220px; position: absolute; }
.hyakuchin .naka      { width: 250px; display: inline-block; position: relative; top: 50px; left: 190px; }
.hyakuchin p          { width: 180px; margin-top: 0; }
@media only screen and (max-width: 768px){
.hyakuchin            { padding: 0 1em; margin: 1em 0 0 0; position: relative; }
.hyakuchin .hyoshi    { width: 40%!important; position: relative; left: 10%; float: left; }
.hyakuchin .naka      { top: 0px; left: 0px; width: 48%!important; right: 8%; margin: 14% 0 .5rem 0; }
.hyakuchin p          { width: 100%; }
}
/* レシピ */
.item_lists                     { width: 100%; }
.item_lists ul                  { display: flex; flex-wrap: wrap; justify-content: center; }
.item_lists ul li               { position: relative; margin: 0 20px 20px 20px; width: 300px; background: #fff; border: solid 2px #7fc1fe; border-radius: 1em; overflow: hidden; }
.item_lists ul li h5            { margin: 0 auto; padding: .75em 0; display: block; text-align: center; border-bottom: solid 2px #7fc1fe; }
.item_lists ul li h5 span       { display: inline-block; white-space: pre; }
.item_lists ul li .item img     { width: 100%; }
.item_lists ul li p             { padding: 1em; border-top: solid 1px #7fc1fe; min-height: 6em; }
.item_lists ul li p span        { position: absolute; bottom: 1em; right: 1em; color: #fe0000; text-decoration: none; }
.item_lists.kuzumochi_recipe ul { margin: 0 -20px; }
@media only screen and (max-width: 768px){
.item_lists ul li               { position: relative; margin: 0 0 1em 0; width: 100%; background: #fff; border: solid 2px #7fc1fe; border-radius: 1em; overflow: hidden; }
.item_lists.kuzumochi_recipe ul { margin: 0; }
.item_lists.kuzumochi_recipe li { margin: 0 0 1em 0; }
}

/* 正月 */
/* おせち料理と漆器 */
.relative                       { position: relative; }
.relative .onImgcap             { position: absolute; top: 0.8em; left: 0.8em; font-size: 185%; font-weight: bold; }

.inner.frame                    { margin: 2.5em auto; border: solid 1px #7fc1fe; border-radius: 10px; padding: 0 2em 1em; box-sizing: border-box; }        

.shogatsu-osechi .btn_link                  { text-align: center; }
.shogatsu-osechi .btn_link a                { display: inline-block; padding: 0.25em 0.75em 0.25em 1em; text-decoration: none; color: #fff; background: #e60012; border-radius: 0.25em; }
.shogatsu-osechi .btn_link.external a:after { content: '\f35d'; font-family: FontAwesome; font-size: 1em; font-weight: 900; color: #fff; padding-left: 0.5em; }

.shogatsu-osechi dl             { font-size: 114.3%; }
.shogatsu-osechi dl dt          { white-space: nowrap; }

.shogatsu-osechi .right         { text-align: right; }

/* 世界のおせち */
.osechi #content_header h1.dento:after { content: '世界のおせち'; }
.worldmap .osechi_list                 { margin: 40px -20px 0 0; display: flex; flex-wrap: wrap; }
.worldmap .osechi_list li              { margin-bottom: 20px; margin-right: 20px; width: 230px; border: solid 2px #7fc1fe; border-radius: 1em; overflow: hidden; }
.worldmap .osechi_list li p            { margin: 0.5em auto; text-align: center; }
.worldmap .osechi_list li img          { width: 100%; }
.content_section .sm                   { font-size: 14px; }
.flex                                  { display: flex; justify-content: space-between; }
.flex .column1-2                       { width: 48%; }
.flex .column1-2 img                   { margin-bottom: 1em; }
.flex .column1-2 .caption              { margin-top: -0.5em; }

.osechi h4 img                         { height: 34px!important; width: auto!important; margin-right: 0.5em; }
.nomb                                  { margin-bottom: 0.2em!important; }
@media only screen and (max-width: 768px){
.worldmap .osechi_list                 { margin: 2em -1em 0 0; display: flex; flex-wrap: wrap; }
.worldmap .osechi_list li              { margin-bottom: 1em; margin-right: 1em; width: calc(50% - 1em); }
.flex                                  { display: block; }
.flex .column1-2                       { width: 100%; }
.osechi h4 img                         { height: 23px!important; }
.osechi h4 img.two-layers              { margin-top: -24px; }

}

.mb2em { margin-bottom: 2em; }

  