@charset "utf-8";
/*----------------------------------------------------
	PC用スタイルシート
----------------------------------------------------*/
@font-face { font-family: 'kdawariTitle'; src: url("./SG-EL.eot") format('eot'), url("./SG-EL.woff") format('woff'); }
@font-face { font-family: 'Optima'; font-style: normal; font-weight: normal; src: local('Optima'), url('/corporate/css/fonts/OPTIMA.woff') format('woff'); }
#Container { width: 100%; }
ul { list-style: none none; }

/* SECTIONS */
.sp_only      { display: none; }
.pc_only      { display: block; }
.pc_br:before { content: '\A'; white-space: pre; }
.sp_br:before { content: ''; white-space: normal; }
.clear        { clear: both; }
.wrap         { width: 100%; z-index: 10; position: relative; margin: 0 auto; padding: 0; }
.inner        { margin: 0 auto; padding: 0 0 2px 0; position: relative; width: 980px; box-sizing: border-box; }
.inner:after  { content: ""; display: table; clear: both; }
p.location    { margin: 0 auto; max-width: 1200px; padding: .5em 1em; font-size: .8em; font-family: 'Optima'; }
p.location a  { color: #e60012; }
@media only screen and (max-width: 768px){
.sp_only      { display: block; }
.pc_only      { display: none; }
.pc_br:before { content: ''; white-space: normal; }
.sp_br:before { content: '\A'; white-space: pre; }
.inner        { margin: 0 auto; padding: 0; position: relative; width: 100%; box-sizing: border-box; }
p.location    { margin: 0 3% 10px; padding: 0; position: absolute; bottom: 0; left: 0; width: 94%; height: 1.5em; overflow: hidden; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; }
}
/* こだわりタイトル */
#kodawati_title          { background: #aabd46; height: 76px; }
#kodawati_title h1       { float: left; margin: 0; }
#kodawati_title h1:hover { opacity: .7; }
#kodawati_title h1 a     { width: 385px; height:76px; display: block; background: url(../img/kodawari_title.png) no-repeat; text-indent: -9999px; overflow: hidden; }
#kodawati_title .read    { width: 431px; height:76px; float: right; background: url(../img/kodawari_read.png) no-repeat; text-indent: -9999px; overflow: hidden; }
@media only screen and (max-width: 768px){
#kodawati_title          { background: #aabd46; height: auto; }
#kodawati_title .inner   { width: 100%; margin: 0 auto; }
#kodawati_title  h1      { float: none; margin-bottom: 0; }
#kodawati_title  h1 a    { padding-top: 14.6875%; width: 100%; display: block; text-indent: -9999px; overflow: hidden; height: 0; background: url(../img/kodawari_title_sp.png) no-repeat; background-size: contain; }
}
/* メニューボタン */
.subMenu                 { width: 100%; background: #e6e6e6; }
.subMenu #local_nav      { padding-top: 10px; }
.subMenu ul              { display: flex; flex-wrap: wrap; margin-left: -10px; }
.subMenu ul li           { margin-left: 10px; margin-bottom: 10px; width: 155px; height: 82px; }
.subMenu ul li#thumb01 a { background: url(../img/kodawari_base01.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb02 a { background: url(../img/kodawari_base02.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb03 a { background: url(../img/kodawari_base03.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb04 a { background: url(../img/kodawari_base04.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb05 a { background: url(../img/kodawari_base05.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb06 a { background: url(../img/kodawari_base06.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb07 a { background: url(../img/kodawari_base07.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb08 a { background: url(../img/kodawari_base08.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb09 a { background: url(../img/kodawari_base09.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb10 a { background: url(../img/kodawari_base10.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb11 a { background: url(../img/kodawari_base11.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb12 a { background: url(../img/kodawari_base12.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb13 a { background: url(../img/kodawari_base13.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb14 a { background: url(../img/kodawari_base14.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb15 a { background: url(../img/kodawari_base15.jpg) center no-repeat; background-size: cover; }
.subMenu ul li#thumb16 a { background: url(../img/kodawari_base01.jpg) center no-repeat; background-size: cover; }
.subMenu ul li a         { width: 155px; height: 82px; display: table-cell; border-radius: 8px; font-weight: 300; font-family: 'Arial'; font-size: 20px; line-height: 1; text-align: center; color: #fff; text-shadow: 2px 2px 4px #000,2px 2px 4px #000; vertical-align: middle; text-decoration: none; }
@media only screen and (max-width: 768px){
.subMenu                 { width: 100%; background: #e6e6e6; }
.subMenu #local_nav      { padding: 4px 2px; }
.subMenu ul              { margin-left: 0; padding: 0 !important; align-items: stretch; }
.subMenu ul li           { margin: 0 0 0 0; padding: 2px; width: 16.666%; height: auto; box-sizing: border-box; }
.subMenu ul li a         { font-weight:500; font-size: 2.4vw; height: 4.5em; word-break: break-all; text-shadow: 1px 1px 3px #000;border-radius: 4px; }

/* こだわり麺がアップされたらはずす */
.subMenu ul li           { margin: 0 0 0 0; padding: 2px; width: 20%; height: auto; box-sizing: border-box; }
}

/* SECTIONS */
.section                    { margin: 0 auto; padding: 0; padding-bottom: 47%; width: 100%; z-index: 10; position: relative; }
.section .circle h2         { margin: 60px auto 20px auto; display: block; font-family: 'kdawariTitle'; font-size: 32px; line-height: 1.2; color: #f00; text-shadow: 2px 2px 4px #000, 0px 0px 2px #fff; }
.section .circle h2.twoline { margin-top: 45px; margin-bottom: 15px; }
.section .circle h2 .small  { font-size: 80%; }
.section .circle .oblique   { font-style: italic; }
.section .circle p          { font-size: 1rem; font-family: sans-serif; color: #fff; max-width: 370px; margin: 0 auto; line-height: 1.5; }
.section .circle p i        { font-size: .8rem; font-style: normal; }
.section .circle p a        { color: #fff;border-bottom:1px dotted #ccc; }
.section .circle p a:hover  { cursor: help; }

.section .circle .gototop   { margin: 0 auto; text-align: center; width: 100%; position: absolute; bottom: 30px; }
.section .circle .gototop a { display: block; width: 100%; height: 21px; background: url(../img/sp_gotop.png) center no-repeat; text-indent: -9999px; overflow: hidden; }
@media only screen and (max-width: 768px){
.section                    { padding: 0; padding-top: 55%; border-bottom: 10px solid #e6e6e6; }
.section .circle h2         { margin: 0; padding: 1rem; width: 100%; position: absolute; top: 0; font-size: 7vw!important; box-sizing: border-box; }
.section .circle h2.twoline { margin-top: 0; margin-bottom: 0; }
.section .circle p          { padding: 1em 1em 3em 1em; font-size: .9rem; color: #fff; background: #000; max-width: 100%; }
.section .circle p i        { font-size: .8rem; font-style: normal; }
.section .circle .gototop   { position: absolute; right: .5em; bottom: 1em; width: 36px; }
.section .circle .gototop a { padding-top: 58.333333%; text-indent: -9999px; overflow: hidden; height: 0; background: url(../img/sp_gotop.png) no-repeat; background-size: contain; display: block; }
}

.circle { position: absolute; text-align: center; width: 400px; height: 400px; border-radius: 200px; background: rgba(0, 0, 0, 0.8); }
.s1     { background: url(../img/kodawari_base01.jpg) center no-repeat; background-size: cover; position: relative; }
.s2     { background: url(../img/kodawari_base02.jpg) center no-repeat; background-size: cover; position: relative; }
.s3     { background: url(../img/kodawari_base03.jpg) center no-repeat; background-size: cover; position: relative; }
.s4     { background: url(../img/kodawari_base04.jpg) center no-repeat; background-size: cover; position: relative; }
.s5     { background: url(../img/kodawari_base05.jpg) center no-repeat; background-size: cover; position: relative; }
.s6     { background: url(../img/kodawari_base06.jpg) center no-repeat; background-size: cover; position: relative; }
.s7     { background: url(../img/kodawari_base07.jpg) center no-repeat; background-size: cover; position: relative; }
.s8     { background: url(../img/kodawari_base08.jpg) center no-repeat; background-size: cover; position: relative; }
.s9     { background: url(../img/kodawari_base09.jpg) center no-repeat; background-size: cover; position: relative; }
.s10    { background: url(../img/kodawari_base10.jpg) center no-repeat; background-size: cover; position: relative; }
.s11    { background: url(../img/kodawari_base11.jpg) center no-repeat; background-size: cover; position: relative; }
.s12    { background: url(../img/kodawari_base12.jpg) center no-repeat; background-size: cover; position: relative; }
.s13    { background: url(../img/kodawari_base13.jpg) center no-repeat; background-size: cover; position: relative; }
.s14    { background: url(../img/kodawari_base14.jpg) center no-repeat; background-size: cover; position: relative; }
.s15    { background: url(../img/kodawari_base15.jpg) center no-repeat; background-size: cover; position: relative; }
.s16    { background: url(../img/kodawari_base16.jpg) center no-repeat; background-size: cover; position: relative; }
@media only screen and (max-width: 768px){
.circle { position: static; text-align: left; width: 100%; height: auto; border-radius: 0; background: rgba(0, 0, 0, 1); }
.s1   { background: url(../img/kodawari_base01.jpg) top no-repeat; background-size: 110%; }
.s2   { background: url(../img/kodawari_base02.jpg) top no-repeat; background-size: 110%; }
.s3   { background: url(../img/kodawari_base03.jpg) top no-repeat; background-size: 110%; }
.s4   { background: url(../img/kodawari_base04.jpg) top no-repeat; background-size: 110%; }
.s5   { background: url(../img/kodawari_base05.jpg) top no-repeat; background-size: 110%; }
.s6   { background: url(../img/kodawari_base06.jpg) top no-repeat; background-size: 110%; }
.s7   { background: url(../img/kodawari_base07.jpg) top no-repeat; background-size: 110%; }
.s8   { background: url(../img/kodawari_base08.jpg) top no-repeat; background-size: 110%; }
.s9   { background: url(../img/kodawari_base09.jpg) top no-repeat; background-size: 110%; }
.s10  { background: url(../img/kodawari_base10.jpg) top no-repeat; background-size: 110%; }
.s11  { background: url(../img/kodawari_base11.jpg) top no-repeat; background-size: 110%; }
.s12  { background: url(../img/kodawari_base12.jpg) top no-repeat; background-size: 110%; }
.s13  { background: url(../img/kodawari_base13.jpg) top no-repeat; background-size: 110%; }
.s14  { background: url(../img/kodawari_base14.jpg) top no-repeat; background-size: 110%; }
.s15  { background: url(../img/kodawari_base15.jpg) top no-repeat; background-size: 110%; }
.s16  { background: url(../img/kodawari_base16.jpg) top no-repeat; background-size: 110%; }
}
.s1 .circle  { top: 30px; right: 80px; }
.s2 .circle  { top: 30px; left: 80px; }
.s3 .circle  { top: 30px; right: 80px; }
.s4 .circle  { top: 60px; left: 80px; }
.s5 .circle  { top: 60px; left: 80px; }
.s6 .circle  { top: 30px; left: 80px; }
.s7 .circle  { top: 30px; right: 80px; }
.s8 .circle  { top: 30px; left: 80px; }
.s9 .circle  { top: 30px; right: 80px; }
.s10 .circle { top: 30px; left: 80px; }
.s11 .circle { top: 60px; right: 80px; }
.s12 .circle { top: 30px; right: 80px; }
.s13 .circle { top: 30px; left: 80px; }
.s14 .circle { top: 30px; right: 80px; background: rgba(0, 0, 0, 0.85); }
.s15 .circle { top: 30px; right: 80px; }
.s16 .circle { top: 30px; left: 80px; }
@media only screen and (max-width: 768px){
.s1 .circle h2  { color: #84001b; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; text-align: right; } /*文化伝承へのこだわり*/
.s2 .circle h2  { color: #fbcece; text-shadow: 0px 0px 4px #000; } /*職人技へのこだわり*/
.s3 .circle h2  { color: #e50012; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*正月へのこだわり*/
.s4 .circle h2  { color: #d9f238; text-shadow: 2px 2px 8px #000; } /*伝統料理へのこだわり*/
.s5 .circle h2  { color: #d65431; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*焼印へのこだわり*/
.s6 .circle h2  { color: #fff; text-shadow: 0px 0px 3px #000, 0px 0px 5px #000; } /*食の研究へのこだわり*/
.s7 .circle h2  { color: #000; text-shadow: 0px 0px 1px #fff; text-align: right; } /*鮮度へのこだわり*/
.s8 .circle h2  { color: #fff; text-shadow: 0px 0px 4px #000; text-align: right; } /*築地へのこだわり*/
.s9 .circle h2  { color: #fff; text-shadow: 2px 2px 4px #000, 0px 0px 2px #44260c; } /*うなぎへのこだわり*/
.s10 .circle h2 { color: #081b0f; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*涼味へのこだわり*/
.s11 .circle h2 { color: #640066; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*おでんへのこだわり*/
.s12 .circle h2 { color: #010100; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*はんぺんへのこだわり*/
.s13 .circle h2 { color: #4f2a13; text-shadow: 0px 0px 3px #fff, 0px 0px 3px #fff, 0px 0px 4px #fff; } /*漆器へのこだわり*/
.s14 .circle h2 { color: #efdfca; text-shadow: 0px 0px 4px #b73b19; } /*あしへのこだわり*/
.s15 .circle h2 { color: #fff; text-shadow: 2px 2px 4px #000, 0px 0px 2px #44260c; } /*江戸造りへのこだわり*/
.s16 .circle h2 { color: #f00; text-shadow: 2px 2px 4px #000, 0px 0px 2px #fff; } /*麺へのこだわり*/
}

