/* PC対応(min-width: 641px) and (max-width: 960px) */

.body01{
  margin            : 0px;
  font-family       : "Meiryo UI",serif;
}
.top{
  text-align        : center;
  padding           : 1px;
  margin            : 0px;
}

.p1{
  margin            : 0px;
  padding           : 4px;
  line-height       : 100%;
}
.bg01{
  background        : #f5f5f5;
}
.sitename{
  color             : #f6f6f6;
  font-size         : 24pt;
  text-decoration   : none;
  padding           : 10px;
}
.subbar{
  background-color  : #203744 ;
  margin            : 0px;
  padding           : 10px;
  color             : #f6f6f6;
  font-size         : 18pt;
  text-align        : center;
}
.visitor{
 position           : absolute;
}
.menu{
  columns           : 250px 5;
  padding           : 5px;
  margin            : 5px;
}

.contbar{
  border-radius     : 20px;
  font-size         : 14pt;
  padding           : 5px;
  margin            : 5px;
  color             : #bd6856;
  border            : 3px double #bd6856;
  text-align        : center;
}
.cake-list{
  text-align   : center;
  padding      : 3px;
  margin-bottom     : 3px;
}


/*twitt*/
.twitt{
  float             : left;
  width             : 200px;
  height            : auto;
}
.twitt .tframe01{
  border            : 3px #f6f6f6 solid;
  box-sizing        : border-box;
}
.twitt .tframe02{
  border            : 3px #f6f6f6 double;
  padding           : 2px;
  box-sizing        : border-box;
}

/*center*/
.centerview{
  float             : left;
  width             : 770px;
}

/*rightview*/
.rightview{
  float             : right;
  width             : 150px;
}
.floatend{
  clear             : right;
}


.frame01{
  border            : 3px #f6f6f6 solid;
}
.frame02{
  border            : 3px #f6f6f6 double;
  padding           : 2px;
}
.frame03{
  border            : 3px #c0c6c9 double;
  padding           : 2px;
}
.frame04{
  border            : 1px #007b43 solid;
  padding           : 2px;
}
.frame05{
  border            : 3px #d8e698 solid;
}
.frame06{
  border            : 2px #007b43 dashed;
  padding           : 2px;
}
.frame07{
  border            : 3px #f8b500 double;
  padding           : 5px;
  margin            : 10px;
}
.frame08{
  margin            : 2px;
  text-align        : right;
  background        : #f5f5f5;
  padding           : 2px;
  border            : dotted 1px #009944;
  font-size         : 10pt;
}
.frame09{
  border            : 1px #1e1e1e solid;
  padding           : 5px;
  margin            : 10px;
  text-align        : left;
  background        : #f5f5f5;
  line-height       : 150%;
}
.frame10{
  border            : 1px #1e1e1e solid;
  padding           : 5px;
  margin            : 10px;
  background        : #f5f5f5;
}
.frame11{
  border            : 3px #1e1e1e double;
  padding           : 5px;
  margin            : 5px 10px;
  background        : #f5f5f5;
  text-decoration   : none;
}

.titlebar{
  margin            : 5px;
  text-align        : center;
}
.titlebar2{
  margin            : 2px;
  text-align        : center;
  background        : #f5f5f5;
  border            : outset 2px #1e1e1e;
  font-size         : 14pt;
  font-weight       : 900;
  padding           : 3px;
}
.titlebar3{
  margin            : 2px;
  padding           : 2px;
  text-align        : center;
  border-top        : 3px double #007b43;
  border-bottom     : 3px double #007b43;
  font-size         : 12pt;
}
.titlebar3{
  margin            : 2px;
  text-align        : center;
  background        : #f5f5f5;
  border            : double 3px #1e1e1e;
  font-size         : 14pt;
  padding           : 3px;
}
.daybar{
  margin            : 2px;
  text-align        : center;
  background        : #f5f5f5;
}

.comm01{
  padding           : 5px;
  line-height       : 140%;
}
.comm02{
  padding           : 10px;
  line-height       : 140%;
}

.anker0{
  text-decoration   : none;
  color             : #000;
}
.anker1{
  text-decoration   : none;
  font-weight       : 900;
  color             : #ea5506;
}
.anker2{
  text-decoration   : none;
  font-weight       : 900;
  color             : #4d5aaf;
}
.anker3{
  text-decoration   : none;
  font-weight       : 900;
  color             : #9fa0a0;
}
.anker4{
  text-decoration   : none;
  font-weight       : 900;
  color             : #ec6800;
}
.anker5{
  text-decoration   : none;
  font-weight       : 900;
  color             : #0000ff;
}
.anker6{
  text-decoration   : none;
  font-weight       : 900;
  color             : #e73562;
}
.anker7{
  text-decoration   : none;
  font-weight       : 900;
  color             : #192f60;
}


.text_l10{
  margin            : 2px;
  text-align        : left;
  background        : #f5f5f5;
  padding           : 2px;
  border            : solid 1px #1e1e1e;
  font-size         : 10pt;
}
.text_r10{
  margin            : 2px;
  text-align        : right;
  background        : #f5f5f5;
  padding           : 2px;
  border            : solid 1px #1e1e1e;
  font-size         : 10pt;
}
.text_c10{
  margin            : 2px;
  text-align        : center;
  padding           : 2px;
  font-size         : 10pt;
}
.text_l12{
  margin            : 2px;
  text-align        : left;
  background        : #f5f5f5;
  padding           : 2px;
  border            : solid 1px #1e1e1e;
  font-size         : 12pt;
}
.text_l14{
  margin            : 2px;
  text-align        : left;
  background        : #f5f5f5;
  padding           : 2px;
  border            : solid 1px #1e1e1e;
  font-size         : 14pt;
}
.text_l16{
  margin            : 2px;
  text-align        : left;
  background        : #f5f5f5;
  padding           : 2px;
  border            : solid 1px #1e1e1e;
  font-size         : 16pt;
}
.text_l14_nf{
  margin            : 2px;
  text-align        : left;
  background        : #f5f5f5;
  padding           : 2px;
  border            : 0px;
  font-size         : 14pt;
}
.text_c20_g{
  margin            : 2px;
  text-align        : center;
  font-size         : 20pt;
  padding           : 2px;
  color             : #007b43;
}
.text12l_dashed{
  text-align        : left;
  font-size         : 12pt;
  color             : #001e43;
  line-height       : 150%;
  border-bottom     : 1px dashed #1e1e1e;
}
.text12l_h180{
  text-align        : left;
  font-size         : 12pt;
  color             : #001e43;
  line-height       : 180%;
}

.line01{
  border-bottom     : dashed 1px #1e1e1e;
  line-height       : 150%;
  text-align        : left;
}
.line02{
  border-bottom     : double 3px #1e1e1e;
}

.week0{
  color             : #e2041b;
  text-align        : center;
}
.week6{
  color             : #007bbb;
  text-align        : center;
}

.err01{
  font-size         : 20pt;
  text-align        : center;
}
.err02{
  font-size         : 11pt;
  text-align        : center;
}
.err03{
  font-size         : 14pt;
  text-align        : center;
  color             : red;
  font-weight       : 900;
}
.alart{
  font-size         : 10pt;
  color             : red;
  font-weight       : 900;
}


.bo01{
  border            : 3px double #1e1e1e;
  padding           : 3px;
  font-size         : 12pt;
  background        : #f5f5f5;
  color             : #1e1e1e;
  text-decoration   : none;
}
.bo02{
  border            : 2px solid #007b43;
  padding           : 2px;
  font-size         : 10pt;
  background        : #c7dc68;
  color             : #007b43;
  text-decoration   : none;
}
.bo03{
  border            : 2px solid #c9171e;
  padding           : 2px;
  font-size         : 10pt;
  background        : #fdeff2;
  color             : #c9171e;
  text-decoration   : none;
}

.photocomm{
  text-align        : center;
  font-size         : 10pt;
  margin            : 0px;
  padding           : 0px;
}

/*ケーキタブ*/

.cakecolor{
  margin            : 0px;
  background-color  : #fffff9;
  background-image  : linear-gradient(-45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%, rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%,  rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%);
  background-size   : 52px 52px;
}
.cakecolor2{
  margin            : 0px;
  background-color  : #fffff9;
  background-image  : linear-gradient(-45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%, rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%,  rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%);
  background-size   : 36px 36px;
  height            : 20px;
}
.cakecolor3{
  margin            : 0px;
  background-color  : #fffff9;
  background-image  : linear-gradient(-45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%, rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(250,177,177,.5) 25%, transparent 25%, transparent 50%,  rgba(250,177,177,.5) 50%, rgba(250,177,177,.5) 75%, transparent 75%, transparent 100%);
  background-size   : 18px 18px;
  height            : 10px;
}
.cakeframe {
  width             : 300px;
  height            : auto;
  padding           : 8px;
  margin            : 8px;
  background-color  : #fef4f4;
  float             : left;
  object-fit        : scale-down;
  border            : 1px solid #dcd6d9;
  border-radius     : 10px;
  text-align        : center;
}
.cakeframe img{
  vertical-align    : middle;
  max-width         : 300px;
  height            : auto;
}
.cakename{
  background-image  : linear-gradient(-45deg, rgba(248,229,140,.5) 25%, transparent 25%, transparent 50%, rgba(248,229,140,.5) 50%, rgba(248,229,140,.5) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(248,229,140,.5) 25%, transparent 25%, transparent 50%,  rgba(250,177,177,.5) 50%, rgba(248,229,140,.5) 75%, transparent 75%, transparent 100%);
  margin            : 5px 5px 5px 5px;
  background-color  : #fff8dc;
  font-size         : 14pt;
  text-align        : center;
  padding           : 10px 20px;
  border-radius     : 10px 10px 0 0;
  width             : border-box;
}
.title20{
  font-size         : 20pt;
  text-align        : center;
  padding           : 10px;
  margin            : 0px;
}
.titleline{
  margin            : 0px;
  background-color  : #bd6856;
  height            : 6px;
}
.cakeframeend{
  clear             : left;
}
.cakecat{
  font-size         : 8pt;
  color             : #006e54;
  margin            : 2px 10px;
}
.cakeshop{
  font-size         : 10pt;
}
.catshop{
  text-align        : right;
  margin            : 2px 10px;
}
.cakeline{
  margin            : 0px;
  background-color  : #bd6856;
  height            : 3px;
}
.cakeprice{
  text-align        : right;
  font-size         : 10pt;
  margin            : 2px 10px;
}
.cakerepo{
  background        : repeating-linear-gradient(#fde8d0, #fde8d0 5px, #fef4f4 0, #fef4f4 10px);
  padding           : 10px;
  border-radius     : 10px;
  width             : auto;
  height            : 140px;
  overflow          : auto;
  margin            : 5px 5px 5px 335px;
  box-sizing        : border-box;
}
.cakemat{
  font-size         : 9pt;
  border-radius     : 10px;
  border            : 1px solid #e9dfe5;
  width             : auto;
  padding           : 5px;
  margin            : 5px 10px 5px 340px;
  overflow          : auto;
  box-sizing        : border-box;
  height            : 70px;
}
.comingsoon{
  text-align        : center;
  font-size         : 12pt;
  padding           : 5px;
  border-radius     : 10px;
  border            : 3px double #ec6800;
}
.caketype2{
  background        : repeating-linear-gradient(90deg, #f2c9ac, #f2c9ac 5px, #fff1cf 0, #fff1cf 10px);
  text-decoration   : none;
  border-radius     : 15px;
  font-size         : 10pt;
  padding           : 4px 8px 8px 8px;
  margin            : 5px;
  color             : #a22041;
}
.cakeshop2{
  background        : repeating-linear-gradient(90deg, #d8e698, #d8e698 5px, #e0ebaf 0, #e0ebaf 10px);
  text-decoration   : none;
  border-radius     : 15px 15px 0 0;
  font-size         : 10pt;
  padding           : 4px 8px 8px 8px;
  margin            : 5px;
  color             : #69821b;
  border-left       : 1px solid #69821b;
  border-top        : 1px solid #69821b;
  border-right      : 1px solid #69821b;
}
.cakeshop2 : hover {
  color             : #aa4c8f;
  text-decoration   : none;
  border-radius     : 15px 15px 0 0;
  font-size         : 10pt;
  border-left       : 1px solid #aa4c8f;
  border-top        : 1px solid #aa4c8f;
  border-right      : 1px solid #aa4c8f;
}
.shopback{
  background        : linear-gradient( #fcfceb 0%, #a0d8ef 25%, #fcfceb 100%);
  padding           : 15px 5px;
  width             : auto;
}
.cakeprice2{
  text-decoration   : none;
  border-radius     : 5px;
  font-size         : 10pt;
  margin            : 5px;
  color             : #d66a35;
}
.priceback{
  background        : repeating-linear-gradient(#f2f2b0, #f2f2b0 3px, #f8f4e6 0, #f8f4e6 6px);
  padding           : 10px;
  width             : auto;
  margin            : 5px;
}

.toptab{
  display: inline-block;
  padding: 5px 15px;
  font-family     : "Meiryo UI", "MS UI Gothic", sans-serif;
  font-size: 14px;
  color: #ba2636;
  background-color: #fdeff2;
  cursor: pointer;
  box-shadow: inset -1px 1px 2px rgba(0, 0, 0, 0.3);
  border-radius: 5px 5px 0 0;
  box-sizing: border-box;
  text-decoration   : none;
}
.toptab:hover{
  color: #fdeff2;
  background-color: #ba2636;
}

.shopname{
  background-image  : linear-gradient(-45deg, rgba(239,250,195,0.6) 25%, transparent 25%, transparent 50%, rgba(239,250,195,0.6) 50%, rgba(239,250,195,0.6) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(239,250,195,0.6) 25%, transparent 25%, transparent 50%,  rgba(193,242,133,1) 50%, rgba(239,250,195,0.6) 75%, transparent 75%, transparent 100%);
  margin            : 5px 5px 5px 5px;
  background-color  : #fff8dc;
  font-size         : 14pt;
  text-align        : center;
  padding           : 10px 20px;
  border-radius     : 10px 10px 0 0;
  width             : border-box;
}

.cake-content input[type="radio"] {
  display: none;
}
.cake-content label {
  display: inline-block;
  padding: 5px 15px;
  font-family     : "Meiryo UI", "MS UI Gothic", sans-serif;
  font-size: 11px;
  color: #6c3524;
  background-color: #fff8dc;
  cursor: pointer;
  box-shadow: inset -1px 1px 2px rgba(0, 0, 0, 0.3);
  border-radius: 5px 5px 0 0;
  box-sizing: border-box;
}
.cake-content label:hover,
.cake-content input[type="radio"]:checked + label {
  color: #fff8dc;
  background-color: #6c3524;
}

.cake-content .tab-box {
  padding: 10px;
  border: 1px solid #6c3524;
  border-radius: 0 5px 5px 5px;
  box-sizing: border-box;
}

.cake-content > .tab-box > div {
  display: none;
}

#tab0:checked ~ .tab-box > #r0 {
  display: block;
}

#tab1:checked ~ .tab-box > #r1 {
  display: block;
}

#tab2:checked ~ .tab-box > #r2 {
  display: block;
}

#tab3:checked ~ .tab-box > #r3 {
  display: block;
}

#tab4:checked ~ .tab-box > #r4 {
  display: block;
}

#tab5:checked ~ .tab-box > #r5 {
  display: block;
}

#tab6:checked ~ .tab-box > #r6 {
  display: block;
}

#tab7:checked ~ .tab-box > #r7 {
  display: block;
}

#tab8:checked ~ .tab-box > #r8 {
  display: block;
}

#tab9:checked ~ .tab-box > #r9 {
  display: block;
}

#tab10:checked ~ .tab-box > #r10 {
  display: block;
}

#tab11:checked ~ .tab-box > #r11 {
  display: block;
}

#tab12:checked ~ .tab-box > #r12 {
  display: block;
}
#tab13:checked ~ .tab-box > #r13 {
  display: block;
}
#tab14:checked ~ .tab-box > #r14 {
  display: block;
}
#tab15:checked ~ .tab-box > #r15 {
  display: block;
}
#tab16:checked ~ .tab-box > #r16 {
  display: block;
}
#tab17:checked ~ .tab-box > #r17 {
  display: block;
}
#tab18:checked ~ .tab-box > #r18 {
  display: block;
}
#tab19:checked ~ .tab-box > #r19 {
  display: block;
}
#tab20:checked ~ .tab-box > #r20 {
  display: block;
}
#tab21:checked ~ .tab-box > #r21 {
  display: block;
}
#tab22:checked ~ .tab-box > #r22 {
  display: block;
}

/*ショップタブ*/
.shop-content input[type="radio"] {
  display: none;
}
.shop-content label {
  display: inline-block;
  padding: 5px 15px;
  font-family     : "Meiryo UI", "MS UI Gothic", sans-serif;
  font-size: 14px;
  color: #69821b;
  background-color: #e0ebaf;
  cursor: pointer;
  box-shadow: inset -1px 1px 2px rgba(0, 0, 0, 0.3);
  border-radius: 5px 5px 0 0;
  box-sizing: border-box;
}
.shop-content label:hover,
.shop-content input[type="radio"]:checked + label {
  background-color: #69821b;
  color: #e0ebaf;
}

.shop-content .tab-box {
  padding: 10px;
  border: 1px solid #6c3524;
  border-radius: 0 5px 5px 5px;
  box-sizing: border-box;
}

.shop-content > .tab-box > div {
  display: none;
}

/*アレルゲン*/
/*Radio Check*/
.Checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  overflow: hidden;
  padding: 0;
  clip: rect(0, 0, 0, 0);
}

.Checkbox + label {
  display: inline-block;
  position: relative;
  padding-left: 1.25em;
  cursor: pointer;
}

/* 擬似要素で楕円を作る。 */
.Checkbox + label:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1em;
  height: 1em;
  margin: auto;
  border: 1px solid #767676;
  border-radius: 3px;
  background-repeat: no-repeat;
  background-size: contain;
}

/* フォーカスが当たると楕円の色などを変える。 */
.Checkbox:focus + label:before {
  border-color: #1589ee;
  box-shadow: 0 0 5px #1589ee;
}

/* チェックボックスがチェックされるとボーダーは非表示、画像でチェックボックスを表示する。 */
.Checkbox:checked + label:before {
  border: 0;
  background-image: url("./parts/checkbox.gif");
}

/* disabled（非活性）時にはスタイルを変える。 */
.Checkbox:disabled,
.Checkbox + label[disabled] {
  cursor: not-allowed;
  opacity: 0.5;
}