@charset "utf-8";
/* default reset */
#Container *    { box-sizing: border-box; }
#Container      { margin: 0 auto; width: 100%; line-height: 1.5 !important; }
p.location      { margin: 0 auto; padding: 5px 0 30px 140px; width: 980px; }
@media only screen and (max-width: 768px){
p.location      { margin: 0 3% 10px; padding: 0; position: absolute; bottom: 0; left: 0; width: 94%; height: 1.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* 共用コンテンツ
------------------------------------------------- */
.wrapper    { width: 100%; }
.wrapper h2 { color: #333; font-size: 30px; font-weight: bold; font-family: 'Yu Mincho','ヒラギノ明朝 ProN','Hiragino Mincho ProN',serif; text-align: center; }
@media only screen and (max-width: 768px){
.wrapper h2      { padding-top: 1.5rem; color: #333; font-size: 1.75rem!important; font-weight: bold; font-family: serif; text-align: center; }
}
/* 直販 Header
------------------------------------------------- */
#chokuhan_header    { padding-top: 20px; padding-bottom: 20px; height: 95px; background: #fff; position: relative; }
#chokuhan_header h1 { margin: 0 auto; padding-top: 6px; width: 980px; color: #330066; font-size: 38px; font-family: 'Yu Mincho','ヒラギノ明朝 ProN','Hiragino Mincho ProN',serif; }
#visual_sp      { display: none; }
#visual_top     { display: block; }
#visual_top img { width: 100%; }
@media only screen and (max-width: 768px){
#chokuhan_header    { padding: 0; height: auto; background: #fff; position: relative; }
#chokuhan_header h1 { padding: 1rem 0 1rem 1rem; width: 100%; font-size: 2rem; }
#visual_sp          { display: block; }
#visual_top         { display: none; }
}
/* NAVI
------------------------------------------------- */
#navi                          { position: absolute; top: 20px; }
#navi #header_navi             { margin: 0 auto; width: 980px; }
#navi #header_navi > ul        { float: right; font-size: 14px; font-family: 'Yu Mincho','ヒラギノ明朝 ProN','Hiragino Mincho ProN',serif; border-right: 1px solid #ccc; }
#navi #header_navi > ul > li   { float: left; text-align: center; border-left: 1px solid #ccc; }
#navi #header_navi > ul > li > a            { color: #000; padding: 18px 25px; display: block; }
#navi #header_navi > ul > li > a:hover      { color: #666; }
#navi #header_navi > ul > li > a span       { color: #999; }
#navi #header_navi > ul > li > a:hover span { color: #330066; }
@media only screen and (max-width: 768px){
#navi                        { position: relative; top: 0px; }
#navi #header_navi           { width: 100%; border-top: 1px solid #ccc; }
#navi #header_navi > ul      { float: none; display: block; border-right: 0; }
#navi #header_navi > ul > li          { float: none; border-left: 0; border-bottom: 1px solid #ccc; width: 100%: }
#navi #header_navi > ul > li > a      { color: #000; padding: .75rem 1.5rem; display: block; position: relative; }
#navi #header_navi > ul > li > a span { color: #000; position: absolute; right: 1.5rem; }
}
/* コンテンツ
------------------------------------------------- */
.jwave_bg                    { padding-top: 1px; padding-bottom: 40px; background-image: url(/chokuhan/img/bg_ougi_pc.png), url(/chokuhan/img/bg.png); background-position: top center,center; background-repeat: repeat-y,repeat; }
.jwave_bg .inner             { margin: 100px auto; width: 980px; height: 320px; position: relative; }
.jwave_bg .inner h2          { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; position: absolute; top: 0; left: calc(50% + 20px); }
.jwave_bg .inner .cpy        { position: absolute; top: 0; right: 0; width: 420px; }
.jwave_bg .inner .cpy p      { font: normal normal 1em/2 serif; }
.jwave_bg .inner.revers h2   { position: absolute; top: 0; left: 0; }
.jwave_bg .inner.revers .cpy { position: absolute; top: 0; left: 55px; width: 420px; }
.jwave_bg .inner.revers .pho { position: absolute; top: 0; left: 490px; }
@media only screen and (max-width: 768px){
.jwave_bg                    { margin-bottom: 0; background-image: url(/chokuhan/img/bg_ougi_sp.png), url(/chokuhan/img/bg.png); background-position: top center,center; background-repeat: repeat-y,repeat; background-size: 100%; }
.jwave_bg .inner             { margin: 4em auto; width: 100%; height: auto;  padding: 0 1em; display: block; position: relative; }
.jwave_bg .inner h2          { writing-mode: horizontal-tb; text-align: left; width: 100%; display: block; position: relative; top: 0; left: 0; }
.jwave_bg .inner .pho img    { width: 100%; }
.jwave_bg .inner .cpy        { position: relative; width: 100%; margin-top: 1em; }
.jwave_bg .inner .cpy p      { font: normal normal 1.1em/1.75 serif; }
.jwave_bg .inner .sp_br      { display: none; }
.jwave_bg .inner.revers h2   { position: relative; top: 0; left: 0; }
.jwave_bg .inner.revers .cpy { position: relative; top: 0; left: 0; width: 100%; }
.jwave_bg .inner.revers .pho { position: relative; top: 0; left: 0; }
}
/* 築地総本店 */
/* おすすめ商品 */
.osusme_items           { margin: 0 auto; width: 980px; }
.osusme_items ul        { margin-right: -22px; display: flex; flex-wrap: wrap; justify-content: flex-start; }
.osusme_items ul li     { width: 312px; margin-right: 22px; }
.osusme_items ul li h4  { margin: 1em 0 0 0; font: bold normal 1em/1.5 sans-serif; }
.osusme_items ul li p   { margin: 0 0 2em 0; font: normal normal 1em/1.5 sans-serif; }
@media only screen and (max-width: 768px){
.osusme_items           { margin: 0 auto; padding: 0 1em; width: 100%; }
.osusme_items ul        { margin-right: 0; display: flex; flex-direction: column; }
.osusme_items ul li     { width: 100%; margin-right: 0; }
.osusme_items ul li h4  { margin: .5em 0 0 0; font: bold normal 1em/1.5 sans-serif; }
.osusme_items ul li p   { margin: 0 0 2em 0; font: normal normal 1em/1.5 sans-serif; }
.osusme_items ul li img { width: 100%; }
}
/* おでん種 */
#navi #header_navi > ul > li#navi03,
#odendane { display: none; }
/* 定番商品 */
#navi #header_navi > ul > li#navi04,
#teiban { display: none; }
/* 店舗情報 */
#tenpo .pho { width: 490px; height: 320px; }
@media only screen and (max-width: 768px){
#tenpo .pho { width: 100%; height: 0; padding-top: 75%; position: relative; }
#tenpo .pho iframe { position: absolute; top: 0; }
}
/* 催事 */
#navi #header_navi > ul > li#navi06,
#saiji { display: none; }
/* 出店情報 */
#syutten       { display: none; }
#syutten ul    { margin-right: -22px; width: 940px; position: absolute; right: 0; display: flex; flex-wrap: wrap; justify-content: flex-start; }
#syutten ul li { width: calc(33.333% - 22px); margin-right: 22px; padding: 1em; border: 1px solid #fff; }
#syutten ul li .tenpo_photo img { width: 100%; margin-bottom: .5em; }
#syutten ul li p                { font-size: 16px; }
#syutten ul li p.tenpo_name,
#syutten ul li p.tenpo_area     { font-weight: bold; }
#syutten ul li .anc             { margin-top: 1em; width: 100%; border: 1px solid #000; }
#syutten ul li .anc a           { display: block; text-align: center; padding: .75em; color: #000;  }
#syutten ul li .anc a:before    { content: '▶︎'; color: #a2225f; padding-right: .25em; font-size: 1.25em; }
@media only screen and (max-width: 768px){
#syutten ul    { margin-right: 0; width: 100%; position: relative; right: 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
#syutten ul li { width: calc(50% - .5em); margin-right: 0; margin-bottom:1em; padding: 1em; border: 1px solid #fff;  }
#syutten ul li .tenpo_photo img { width: 100%; margin-bottom: .5em; }
#syutten ul li p                { font-size: 1em; }
#syutten ul li p.tenpo_name,
#syutten ul li p.tenpo_area     { font-weight: bold; }
#syutten ul li .anc             { margin-top: 1em; width: 100%; border: 1px solid #000; }
#syutten ul li .anc a           { display: block; text-align: center; padding: .5em .1em; color: #000; font-size:.9em }
#syutten ul li .anc a:before    { content: '▶︎'; color: #a2225f; padding-right: .25em; font-size: 1em; }
}