/*全体制御*/

html, body {
	background-repeat: repeat;
	font-size: 90%;
	margin : 10px 0 0 0;
	font-style: normal;
	background-color: #000000;
	color:#FFD900;
	line-height: 150%;
	background-image: url(../common/bgimg006.jpg);
}

h1,h2,h3,h4,h5,h6,pre,address,em,strong,th,ins,div,p,a {

	font-family:verdana, helvetica, "メイリオ", "ＭＳ Ｐゴシック", arial, sans-serif;
  font-style:normal;
}

h1,h2,h3,h4,h5,h6,pre,address,ul,ol,li,dl,dt,dd,form,legend,div,p,img {
	margin:0;
	padding:0;
	border:0;
}

p {
	padding: 0 0 0 0;
	margin: 0 0 12px 0;
	background-repeat: no-repeat;
	background-position: center;
}
form {
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

td {

}

/*文字色制御*/

.white {color: #FFFFFF}

.red {color: #FF0000}

a:link {color:#FFCC00;text-decoration:none;}
a:visited {color:#FFCC00;text-decoration:none;}
a:active {color:#FFFF00;text-decoration:none;}
a:hover {color:#FFFF00;text-decoration:none;}

/*強調と、より強調の制御（斜体を太字に、太字を一回り大きな太字に変更）*/

b, strong {
	font-weight: bold;
	color: #CC0000;
}
a b, a strong {
	font-weight: bold;
	color: #FFCC00;
}
i, em {
	font-weight: bold;
	color: #00CC00;
}

address {
	font-style: normal;
}

/*コンテナ制御*/

#container {
	width: 760px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	background-color: #8B0905;
	margin-bottom: 0px;
	border:1px solid #9D9226;
}

/*ヘッダー制御*/

#banner {
	width: 760px;
	background-color:#990000;
	padding: 0px;
	margin: 0px;
}
#banner h1{
	color: #FFCC00;
	font-size: 12px;
	margin: 0px;
	height: 24px;
	background-color: #550000;
	background-image: url(../common/top_01.gif);
	background-repeat: repeat;
	padding: 10px 0px 0px 11px;
}
/*メニューブロック制御*/

#menu {
	width: 760px;
	text-align: left;
	font-size: 14px;
	background-color: #990000;
	background-image: url(../common/top_03.gif);
	background-repeat: repeat;
	overflow: hidden;
}

#menu a{
	width: 80px;
	display: block;
	float: left;
	font-weight: bold;
	padding: 4px 0 4px 0;
	text-align: center;
	margin:0 0 0 0;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-style: solid;
	border-top-color: #CC9900;
	border-right-color: black;
	border-bottom-color: black;
	border-left-color: #CC9900;
	background-image: url(../common/top_03.gif);
	background-position: left top;
}
#menu a:link {color:#FFFFFF;text-decoration: none;}
#menu a:visited {color:#FFFFFF;text-decoration: none;}
#menu a:active {color:#FFFF00;text-decoration: none;}
#menu a:hover {color:#FF0000;text-decoration: none;}
#logo_under{
	width: 150px;
	height: 24px;
	float: right;
	background-image: url(../common/top_03.gif);
	background-position: right top;
}

/*中央ブロック制御*/

#content {
	clear: both;
	width: 660px;
	background-image: url(../common/contents_body.jpg);
	background-repeat: repeat-x;
	padding-top: 10px;
	padding-right: 50px;
	padding-bottom: 10px;
	padding-left: 50px;
	overflow: hidden;
}
#content .indent30 {
	margin: 0px;
	padding: 0px 30px 0px 30px;
}
#content h1{
	font-size: 24px;
	color:#FFFFFF;
	margin: 5px 0px 5px 0px;
	padding: 12px 0 0px 50px;
	background-image: url(category_back.gif);
	background-repeat: no-repeat;
	height: 60px;
}
#content h2{
	font-size: 14px;
	color:#990000;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}

#content ul.top-img {
	list-style: none;
	margin: 0;
	padding: 0;
}
#content ul.top-img li {
	float: left;
	position: static;
}

#content ul.nav {
  position: fixed;
  margin-left: -485px;
  left: 50%;
  top: 147px;
  width: 95px;
  border: none;
	background: #900 url(../common/contents_body.jpg);
	background-repeat: repeat-x;
	list-style: none;
	border: #cc9900 solid 1px;
	opacity: 0.5;
	transition: all 0.3s;
}

#content ul.nav:hover {
	opacity: 1.0;

}

#content ul.nav > li.navtitle {
	color: #fff;
	display: block;
	width: 75px;
	padding: 5px 10px 5px 10px;
}

#content ul.nav a {
	display: block;
	width: 75px;
	padding: 5px 10px 5px 10px;
	text-decoration: none;
	font-weight: bold;
	opacity: 1.0;
	transition: all 0.3s;
}

#content ul.nav a:hover {
	background: #a00;
	font-weight: bold;
	color: #fff;
	opacity: 0.7;
}

#content ul.nav a:active {
	background: #a00;
	font-weight: bold;
	color: #fff;
}

#content a.yaki {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image11.jpg) no-repeat;
}

#content a.yaki:hover {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image12.jpg) no-repeat;
}

#content a.wa {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image21.jpg) no-repeat;
}

#content a.wa:hover {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image22.jpg) no-repeat;
}

#content a.sake {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image31.jpg) no-repeat;
}

#content a.sake:hover {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image32.jpg) no-repeat;
}

#content a.men {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image41.jpg) no-repeat;
}

#content a.men:hover {
	display : inline-block;
	width: 165px;
	height: 150px;
	overflow : hidden;
	background: url(../top/top-menu-image42.jpg) no-repeat;
}

#content a.branch {
	display : inline-block;
	color: #fff;
	font-size:80%;
	width: 95px;
	height: 20px;
	padding: 0px 4px 6px 10px;
	overflow : hidden;
	background: transparent url(../common/btn_bg1.png) no-repeat;
}

#content a.branch:hover {
	color: #fc0;
}

#content a.pdf {
	display : inline-block;
	color: #fc0;
//	font-size:80%;
	width: 100%;
	height: 23px;
	padding: 2px 1px 0px 50px;
	overflow : hidden;
	background: transparent url(../common/pdf_icon1.png) no-repeat;
}

#content a.pdf:hover {
	color: #fff;
}


#main{
	margin-left: 10px;
}

#main h2{
	font-size: 22px;
	color: #FFFFFF;
	margin-bottom: 3px;
}

/*フッターブロック制御*/

#footer {
	clear:both;
	width: 760px;
	padding: 0px;
	text-align:center;
}
#footer .menu{
	padding: 5px 0 5px 0;
	background-image:url(../common/bgimg01.gif);
	border-top-color: #CC9900;
	border-bottom-color: #000000;
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-style: solid;
}

#footer a {color:#FFFFFF;text-decoration: none;}
#footer a:hover {color:#FFCC00;text-decoration: none;}

#footer .copyright{
	padding: 5px 0 5px 0;
	color:#FFCC00;
}

/* slideshow element */
#content-slider .mask {
    margin:0 auto;
//    border:2px solid red;
    position:relative;
    cursor:pointer;
    overflow:hidden;
}
#content-slider ul{
    list-style:none;
    height:150px;
    width:660px;
    margin: 0;
    padding: 0;
    position:relative;
}
#content-slider li {
    margin:0;
    padding: 0;
    height:150px;
    width:660px;
    top:0;
    left:100%;
    position:absolute;
    overflow:hidden;
    -moz-animation:slide 16s 0s infinite;
    -webkit-animation:slide 16s 0s infinite;
    animation:slide 16s 0s infinite;
    -moz-animation-play-state:running;
    -webkit-animation-play-state:running;
    animation-play-state:running;
}
#content-slider li:nth-of-type(1) {
    -moz-animation-delay:0s;
    -webkit-animation-delay:0s;
    animation-delay:0s;
}
#content-slider li:nth-of-type(2) {
    -moz-animation-delay:4s;
    -webkit-animation-delay:4s;
    animation-delay:4s;
}
#content-slider li:nth-of-type(3) {
    -moz-animation-delay:8s;
    -webkit-animation-delay:8s;
    animation-delay:8s;
}
#content-slider li:nth-of-type(4) {
    -moz-animation-delay:12s;
    -webkit-animation-delay:12s;
    animation-delay:12s;
}
#content-slider a {
    height:150px;
    width:660px;
    display:block;
}
#content-slider h2 {
    position:absolute;
    padding:0.5em 1em;
    background:rgba(0,0,0,0.5);
    color:#fff;
    top:0;
    left:-110%;
    opacity:0;
    -moz-transition:0.5s;
    -webkit-transition:0.5s;
    transition:0.5s;
}
#content-slider .mask:hover h2 {
    left:0;
    opacity:1;
}

#content-slider .mask:hover .progress-bar,
#content-slider .mask:hover li{
    -moz-animation-play-state:paused;
    -webkit-animation-play-state:paused;
    animation-play-state:paused;
}
#content-slider .progress-bar {
    background:rgba(0,0,0,1);
    height:3px;
    width:100%;
    position:absolute;
    z-index:100;
    bottom:0;
    left:0;
    -moz-animation:bar 16s linear infinite;
    -webkit-animation:bar 16s linear infinite;
    animation:bar 16s linear infinite;
}
/* keyframes for slide */
@-moz-keyframes slide {
    0% {left:100%;opacity:0.5;z-index:1;}  /*フレームイン開始*/
    10% {left:0;opacity:1;}                /*(a)全体の1/10秒でフレームイン終了*/
    25% {left:0;opacity:1;z-index:1;}  /*(b)ここまで停止して、フレームアウト開始（b = 100 / スライド数） */
    43.3% {left:-100%;top:0%;opacity:0.5;z-index:0;}  /*(c)フレームアウト終了（c = a） */
    50% {left:-100%;top:100%;opacity:0;z-index:0;}              /* 分かりやすい様に、見えないエリアで迂回させた */
    70% {left:100%;top:100%;opacity:0;z-index:-1;}
    80% {left:100%;top:0%;opacity:0;z-index:-1;}
}
@-webkit-keyframes slide {
    0% {left:100%;opacity:0.5;z-index:1;}  /*フレームイン開始*/
    10% {left:0;opacity:1;}                /*(a)全体の1/10秒でフレームイン終了*/
    25% {left:0;opacity:1;z-index:1;}  /*(b)ここまで停止して、フレームアウト開始（b = 100 / スライド数） */
    43.3% {left:-100%;top:0%;opacity:0.5;z-index:1;}  /*(c)フレームアウト終了（c = a） */
    50% {left:-100%;top:100%;opacity:0;z-index:0;}              /* 分かりやすい様に、見えないエリアで迂回させた */
    70% {left:100%;top:100%;opacity:0;z-index:-1;}
    80% {left:100%;top:0%;opacity:0;z-index:-1;}
}
@keyframes slide {
    0% {left:100%;opacity:0.5;z-index:1;}  /*フレームイン開始*/
    10% {left:0;opacity:1;}                /*(a)全体の1/10秒でフレームイン終了*/
    25% {left:0;opacity:1;z-index:1;}  /*(b)ここまで停止して、フレームアウト開始（b = 100 / スライド数） */
    43.3% {left:-100%;top:0%;opacity:0.5;z-index:0;}  /*(c)フレームアウト終了（c = a） */
    50% {left:-100%;top:100%;opacity:0;z-index:0;}              /* 分かりやすい様に、見えないエリアで迂回させた */
    70% {left:100%;top:100%;opacity:0;z-index:-1;}
    80% {left:100%;top:0%;opacity:0;z-index:-1;}
}
/* keyframes for progress-bar */
@-moz-keyframes bar {
    0%,43.3%,76.6% {width:0;opacity:0;}
    10%,53.3%,86.6% {width:10%;opacity:0.5;}
    30%,63.3%,96.6% {opacity:1;}
    33.3%,66.6%,99.9% {width:100%;opacity:0.1;}
    34%,67%,100% {width:100%;opacity:0;}
}
@-webkit-keyframes bar {
    0%,43.3%,76.6% {width:0;opacity:0;}
    10%,53.3%,86.6% {width:10%;opacity:0.5;}
    30%,63.3%,96.6% {opacity:1;}
    33.3%,66.6%,99.9% {width:100%;opacity:0.1;}
    34%,67%,100% {width:100%;opacity:0;}
}
@keyframes bar {
    0%,43.3%,76.6% {width:0;opacity:0;}         /*スライドのフレームイン中は表示しない */
    10%,53.3%,86.6% {width:10%;opacity:0.5;}    /*フレームイン終了。ここからbarがのびる */
    30%,63.3%,96.6% {opacity:1;}                /*barがのびきる前にopacityを1にするとおしゃれ */
    33.3%,66.6%,99.9% {width:100%;opacity:0.1;} /*ここまではbarがのびる */
    34%,67%,100% {width:100%;opacity:0;}        /*barを消す */
}