@charset 'UTF-8';

/*
  CSS document for YTTH Famiel
--------------------------------------------------

## INDEX ##

-- All Reset
-- General Setting
-- Top Page
-- Restaurant Page
-- Footer Block
-- Administration Pages

*/



/*========== All Reset ==========*/
* {
  margin: 0;
  padding: 0;
  margin: 0;
  font-size: 12px;
  line-height: 1.6em;
}


/*========== General Setting ==========*/
img {
  border: 0;
  line-height:100%;
}

table {
  border-collapse: collapse;
  empty-cells: show;
}

#out {
  width: 750px;
  margin: 0 auto;
}

#headerBlock {
  position: relative;
  width: 750px;
  height: 95px;
}

#header1 {
  width: 460px;
  height: 60px;
  text-indent: -9999px;
  background: url(../img/toplogo.gif) left top no-repeat;
}

#header1 a {
  display: block;
  width: 220px;
  height: 56px;
}

#mainMenu {
  width: 750px;
  height: 35px;
}

#mainMenu li {
  float: left;
  list-style: none;
}

#subMenu {
  position: absolute;
  top: 0;
  right: 0;
  height: 20px;
  padding: 40px 0 0 0;
}

#subMenu li {
  display: block;
  float: left;
  padding: 0 12px 0 15px;
  line-height: 16px;
  background: url(../img/sankaku.gif) left 2px no-repeat;
}

.centering {
  text-align: center;
}

.clearing {
  height: 0;
  width: 500px;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  clear: both;
}


/*========== Top Page ==========*/
#contentsWrapper {
  width: 750px;
  height: 1%;
  margin: 6px 0 0 0;
  background: url(../img/right_bg.gif) right top repeat-y;
}

#right {
  float: right;
  width: 157px;
  font-family: "ヒラギノ角ゴ Pro W3", "メイリオ", "ＭＳ Ｐゴシック", Osaka;
  font-size: 90%;
}

#right h2 {
  width: 157px;
  height: 205px;
  text-indent: -9999px;
  background: url(../img/appearance.gif)
}

#right ul {
  margin: 0 8px;
  list-style: none;
  line-height: 1.5em;
}

#right h3 {
  margin: 0 8px 6px 8px;
  padding-top: 15px;
  border-bottom: solid 1px #0a5f3c;
  line-height: 1.5em;
  clear: both;
}

#rmenu li {
  display: block;
  float: left;
  margin: 4px 0px;
  padding: 0 5px 0 13px;
  line-height: 16px;
  background: url(../img/sankaku2.gif) left center no-repeat;
}

#infoItems {
  padding: 0 0 0 0.5em;
}

#recommend {
  float: left;
  width: 156px;
  margin: 0 10px 6px 0;
}

#recommend h2 {
  width: 156px;
  height: 22px;
  text-indent: -9999px;
  background: url(../img/osusume_info.gif) left top no-repeat;
}

#recommend ul li {
  width: 156px;
  height: 73px;
  margin: 2px 0 0 0;
  list-style: none;
  text-indent: -9999px;
  background-position: left top;
}

#recommend ul li a {
  display: block;
  width: 100%;
  height: 100%;
}

#news {
  float: left;
  width: 415px;
  height: 171px;
}

#news1Header {
  padding: 0 15px;
  font-size: 16px;
  line-height: 1.5em;
  color: #fff;
  background: url(../img/h2_bg.gif) left center repeat-x;
}

#news2Header {
  padding: 0 15px;
  font-size: 14px;
  line-height: 1.5em;
  color: #fff;
  background: url(../img/h2_bg.gif) left center repeat-x;
}

#news ul {
  margin: 2px 0 8px 34px;
  list-style-image: url(../img/sankaku.gif);
}

#main {
  width: 590px;
  clear: left;
}

div.tile {
  float: left;
  width: 180px;
  height: 170px;
  margin: 2px 12px 10px 0;
}

div.tile h2 {
  width: 150px;
  height: 17px;
  line-height: 100%;
  text-indent: -9999px;
}

div.tile img.intro {
  display: block;
  margin: 2px 0;
}

div.tile p {
  margin: 3px 0 0 0;
}

#hakkei {
  background: url(../img/hakkei_l.gif) left top no-repeat;
}

#ryuban {
  background: url(../img/ryuban_l.gif) left top no-repeat;
}
#crescent {
  background: url(../img/crescent_l.gif) left top no-repeat;
}

#barban {
  background: url(../img/barban_l.gif) left top no-repeat;
}

#mikaduki {
  background: url(../img/mikaduki_l.gif) left top no-repeat;
}

#stay {
  background: url(../img/syukuhaku_l.gif) left top no-repeat;
}

#banquet {
  background: url(../img/enkai_l.gif) left top no-repeat;
}

#bridal {
  background: url(../img/bridal_l.gif) left top no-repeat;
}
#kensyu {
  background: url(../img/kensyu_l.gif) left top no-repeat;
}

#banner {
  margin: 15px 0 5px 28px;
}

#banner img {
  margin: 5px 10px 5px;
}

#subMenu a:link, #subMenu a:visited,
#rmenu a:link, #rmenu a:visited,
#infoItems a:link, #infoItems a:visited,
#news a:link, #news a:visited {
  font-weight: bold;
  text-decoration: none;
  outline: none;
  color: #555;
}

#subMenu a:hover, #subMenu a:active,
#rmenu a:hover, #rmenu a:active,
#infoItems a:hover, #infoItems a:active,
#news a:hover, #news a:active {
  font-weight: bold;
  text-decoration: underline;
  outline: none;
  color: #0c8f59;
}


/*========== Restaurant & Party Page ==========*/
#shopWrapper {
  width: 750px;
  height: 1%;
  margin: 3px 0 0 0;
}

.shopTitle {
  margin: 20px 0;
  text-indent: -9999px;
  cursor: pointer;
}

.banquetTitle {
  margin: 10px 0 0;
  text-indent: -9999px;
  cursor: pointer;
}

#rubanTitle {
  height: 140px;
  background: url(../img/ruban_title.jpg) center top no-repeat;
}

#hakkeiTitle {
  height: 140px;
  background: url(../img/hakkei_title.jpg) center top no-repeat;
}

#mikazukiTitle {
  height: 140px;
  background: url(../img/mikazuki_title.jpg) center top no-repeat;
}

#crescentTitle {
  height: 140px;
  background: url(../img/crescent_title.jpg) center top no-repeat;
}

#barbentaneTitle {
  height: 140px;
  background: url(../img/barbentane_title.jpg) center top no-repeat;
}

#partyTitle {
  height: 120px;
  background: url(../img/party_title.jpg) center top no-repeat;
}

#ceremonyTitle {
  height: 120px;
  background: url(../img/ceremony_title.jpg) center top no-repeat;
}

.shopImage {
  display: block;
  margin: 0 auto;
}

#menuPlan {
  float: right;
  width: 500px;
  margin: 20px 0;
  padding: 15px;
  border: solid 1px #bbb;
}

#menuPlan h3 {
  border-bottom: solid 2px;
  font-size: larger;
  line-height: 1.8em;
  color: #81020B;
}

#menuPlan h4 {
  margin: 16px 0 6px 0;
  border-bottom: solid 1px #ddd;
  line-height: 1.6em;
  color: #4942a0;
  clear: both;
}

#planComment {
  margin: 8px 0;
  line-height: 1.4em;
}

.menuImage {
  float: right;
}

.menuImage img {
  display: block;
  margin: 0 0 6px 6px;
}

.menuItems {
  margin: 0 0 0 18px;
}

.price {
  margin: 8px 0 16px 18px;
  font-weight: bold;
  color: #c1241c;
}

#guideColumn {
  float: left;
  width: 200px;
  margin: 20px 0 0 0;
}

#infoHeader {
  width: 200px;
  height: 28px;
  text-indent: -9999px;
  background: url(../img/info_header.jpg) left top no-repeat;
}

#menuHeader {
  width: 200px;
  height: 28px;
  text-indent: -9999px;
  background: url(../img/menu_header.jpg) left top no-repeat;
}

.cateHeader {
  margin: 8px 0 0 0;
  border-bottom: solid 1px #195919;
  font-size: larger;
  font-weight: bold;
  text-align: center;
  line-height: 1.2em;
}

#infoGuide {
  margin: 0 0 20px 0;
  list-style: none;
}

#infoGuide li {
  padding: 0.3em 0;
  font-weight: bold;
  text-align: center;
  background: url(../img/infobg_g.png) left center repeat-x;
}

#infoGuide li a {
  display: block;
  width: 100%;
  height: 1.4em;
}

#infoGuide li span {
  padding: 0 6px;
  line-height: 1.4em;
  background: #fff;
}

#infoGuide li span#thisPage {
  color: #0c8f59;
}

#infoGuide a:link, #infoGuide a:visited {
  text-decoration: none;
  outline: none;
  color: #666;
}

#infoGuide a:hover, #infoGuide a:active {
  text-decoration: none;
  outline: none;
  color: #0c8f59;
}

#planGuide dd {
  padding: 6px 0 22px 0;
  font-weight: bold;
  background: url(../img/menu_bg.gif) center bottom no-repeat;
}

#planGuide dd a {
  line-height: 1.2em;
}

#planGuide a:link, #planGuide a:visited {
  text-decoration: none;
  outline: none;
  color: #444;
}

#planGuide a:hover, #planGuide a:active {
  text-decoration: none;
  outline: none;
  color: #0c8f59;
}

#datePlan {
  margin: 30px 0 0 0;
  padding: 15px 8px;
  background: #f2f0fa;
}

#datePlan h4 {
  margin: 0 0 15px 0;
  border-bottom: 0;
  text-align: center;
  color: #5e528b;
}

#datePlan p, #datePlan dl dd {
  line-height: 1.3em;
  color: #555;
}

#datePlan dl dt {
  margin: 10px 0 3px 0;
  border-bottom: solid 1px;
  font-weight: bold;
  line-height: 1.2em;
  color: #5e528b;
}

#totop {
  width: 30px;
  height: 30px;
  margin: 0 auto;
  padding: 20px 0;
  clear: both;
}

#totop a {
  display: block;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
  background: url(../img/totop.jpg) left top no-repeat;
}


/*========== footer Block ==========*/
#foot {
  width: 750px;
  height: 60px;
  margin: 0;
  clear: both;
}

#foot p {
  text-align: right;
}


/*========== Administration Pages ==========*/
/*--- share setting ---*/
#adminWrapper {
  width: 710px;
  margin: 0 auto;
  padding: 90px 20px 30px 20px;
  border-left: solid 1px #ccc;
  border-right: solid 1px #ccc;
  background: url(../img/toplogo.gif) 10px 8px no-repeat;
}

#adminHeader {
  margin: 0 0 10px 0;
  border-bottom: solid 1px #0a5f3c;
  font-size: medium;
}

#adminWrapper h2 {
  margin: 25px 0 10px;
  font-size: small;
}

#adminWrapper form {
  margin: 16px 0;
}

#adminWrapper fieldset {
  margin: 4px 0;
  padding: 2px 0;
  border: 0;
  background: #eee;
}

#adminWrapper form input.fields {
  border: solid 1px #ccc;
}

#operation {
  margin: 15px 0 0 0;
  padding: 3px 3px 15px 3px;
  text-align: center;
}

input.bDelImg {
  line-height: 1.1em;
  cursor: pointer;
}

#operation input, #paging input {
  margin: 0 15px;
  line-height: 1.2em;
  cursor: pointer;
}

#selects {
  margin: 30px 20px;
}

#selects select {
  border: solid 1px #ccc;
}

*html #selects select { /* IE6 Hack */
  width: 200px;
}

#result {
  height: 2em;
  margin: 20px 0 0 10px;
  line-height: 2em;
  text-align: center;
  color: #b2113b;
}

#dummy {
  position: absolute;
  bottom:0;
  left: -9999px;
}

#adminFooter {
  width: 750px;
  margin: 0 auto 30px;
  border-top: solid 1px #ccc;
  line-height: 2em;
  text-align: center;
  color: #888;
}

/*--- for Index ---*/
.groupFrame {
  margin: 40px 20px 5px;
  padding: 15px;
  border: solid 1px #bbb;
}

#adminWrapper .groupHeader {
  margin: -23px 0 15px 0;
  padding: 0 5px;
  font-size: 14px;
  line-height: 1em;
  background: #fff;
}

.groupFrame  li {
  display: block;
  float: left;
  margin: 0 20px 10px;
  padding: 0 0 0 4px;
  line-height: 1em;
  border-left: solid 4px #a73a5e;
}

.groupFrame  li a {
  line-height: 1em;
}

.groupFrame  li a:link, .groupFrame  li a:visited {
  text-decoration: none;
  outline: none;
  color: #222;
}

.groupFrame  li a:hover, .groupFrame  li a:active {
  outline: none;
  color: #a73a5e;
}

/*--- for Top ---*/
img.dPhoto {
  display: block;
  margin: 4px 30px;
}

form.recommend label {
  display: block;
  width: 13em;
  height: 1.8em;
  padding: 0.2em 0;
  line-height: 1.8em;
}

form.recommend div {
  width: 510px;
  height: 1.8em;
  margin: -2.2em 0 0 0;
  padding: 0.2em 0 0 13em;
  line-height: 1.8em;
}

form.recommend input.fields {
  width: 500px;
  padding: 2px 3px;
  line-height: 1.4em;
}

form.news label {
  display: block;
  width: 11em;
  height: 1.8em;
  padding: 0.2em 0;
  line-height: 1.8em;
}

form.news div {
  width: 350px;
  height: 1.8em;
  margin: -2.2em 0 0 0;
  padding: 0.2em 0 0 11em;
  line-height: 1.8em;
}

form.news input.fields {
  width: 350px;
  padding: 2px 3px;
  line-height: 1.4em;
}

form#info label {
  display: block;
  width: 10.5em;
  height: 1.8em;
  padding: 0.2em 0;
  line-height: 1.8em;
}

form#info div {
  width: 300px;
  height: 1.8em;
  margin: -2.2em 0 0 0;
  padding: 0.2em 0 0 10.5em;
  line-height: 1.8em;
}

form#info input.fields {
  width: 300px;
  padding: 2px 3px;
  line-height: 1.4em;
}

/*--- for Event & Ingredient ---*/
form.eventItems, form.ingredientItems {
  margin: 25px 0;
  padding: 8px;
  background: #eee;
}

img.contentImage {
  display: block;
  float: left;
  margin: 0 20px 0 0;
}

label.eventAdmin, label.ingredientAdmin {
  display: block;
  padding: 0 0 0.3em 0;
}

input.eventAdmin, textarea.eventAdmin, input.ingredientAdmin, textarea.ingredientAdmin {
  margin: 0 0 1em 0;
}

input.imageFields {
  margin: 0.3em 0;
}

input.alternateFields {
  display: block;
  width: 530px;
  margin: -1.9em 0 0.3em 6em;
}

input.itemTitles {
  display: block;
  width: 250px;
  margin: -1.9em 0 0.3em 17em;
}

input.itemLinks {
  display: block;
  width: 400px;
  margin: -1.9em 0 0.3em 17em;
}

textarea.itemComments {
  display: block;
  width: 450px;
  height: 65px;
  margin: -1.6em 0 0 17em;
}

textarea.forIngredient {
  height: 80px;
}

#eventRead, #ingredientRead {
  width: 600px;
}

#monthlyTitle {
  width: 250px;
}

#monthlyComment {
  width: 330px;
  height: 140px;
}

/*--- for recruit ---*/
div.itemWrapper {
  margin: 25px 0;
  padding: 8px;
  background: #eee;
}

#adminWrapper div.itemWrapper h2 {
  margin: 0;
}

textarea.recruitAdmin {
  width: 600px;
  height: 7em;
  margin: 0 0 0 80px;
}

#example {
  height: 15em;
}

#companyOutline {
  width: 680px;
  height: 20em;
}

/*--- for Shop code & Category code ---*/
#adminWrapper table {
 margin: 30px 20px;
}

#adminWrapper table th {
 width: 12em;
}

#adminWrapper table th.codeNum {
 width: 5em;
 line-height:1.1em;
}

#adminWrapper table th, #adminWrapper table td {
  padding: 0 3px;
  line-height: 1.6em;
}

#adminWrapper table td.codeNum, #adminWrapper table td.recordFields {
  border: solid 1px #888;
}

#adminWrapper table td.codeNum, #adminWrapper table td#codeInput {
 text-align: right;
}

#adminWrapper table input#newCode {
 width: 2em;
}

/*--- for adminPlan ---*/
#fieldsWrapper {
  margin: 0 20px;
}

#fieldsWrapper #title, form#uploader div,
form#uploader1 div, form#uploader2 div {
  margin: 6px 0;
}

#fieldsWrapper .fields {
  width: 500px;
  padding: 0 3px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}

#label4selectImg {
  display: block;
  font-weight: bold;
  color: #666;
}

#comment {
  margin: 0 0 20px 0;
}

/*--- for listingPlan ---*/
#listWrapper {
  margin: 0 20px;
}

#list {
  margin: 0 0 30px 0;
  line-height: 1.8em;
}

#list dt {
  width: 35em;
  height: 1.8em;
}

#list a:link, #list a:visited {
  text-decoration: none;
  outline: none;
  color: #444;
}

#list a:hover, #list a:active {
  outline: none;
  color: #0c8f59;
}

#list dd {
  width: 4em;
  height: 1.8em;
  margin: -1.8em 0 0 0;
  padding: 0 0 0 35.2em;
  border-bottom: solid 1px #888;
}

#list dd input {
  width: 2em;
  border: solid 1px #ccc;
}

#list .listheader {
  font-weight: bold;
}

#list dd.listheader {
  border-bottom: solid 2px #666;
}

/*--- for adminMenu ---*/
#menuFieldsWrapper {
  width: 520px;
  margin: 0 20px;
}

#mname, #items, #priceTag, form#uploader div, #postscript {
  margin: 6px 0;
}

#menuFieldsWrapper .menuFields {
  width: 300px;
  padding: 0 3px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}

.label4selectImg {
  display: block;
  font-weight: bold;
  color: #666;
}

#menuImgBox {
  float: right;
  width: 180px;
}

#menuImgBox img {
  margin: 8px 0 0 0;
}

#priceTag input.priceField {
  width: 55px;
  padding: 0 3px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}


/*--- for adminPasswd ---*/
#adminWrapper table#adminPass th#shopName {
  width: 145px;
}

#adminWrapper table#adminPass select#shops {
  width: 140px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}

#adminWrapper table#adminPass th.passFields {
  width: 105px;
}

#adminWrapper table#adminPass input.passFields {
  width: 100px;
  padding: 0 3px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}


/*--- for Authentication ---*/
#adminHeader span {
  font-size: medium;
}

#authBlock {
  width: 300px;
  margin: 60px auto;
  text-align: center;
}

#authBlock label {
  display: block;
  margin: 10px 0;
  font-weight: bold;
}

#authBlock label input {
  width: 100px;
  padding: 0 3px;
  border: solid 1px #ccc;
  line-height: 1.6em;
}

#loginAuth {
  margin: 10px 0;
}

#loginAuth {
  margin: 10px 0;
}

#adminItem {
  margin: 60px 0;
}