@charset "utf-8";
/* ===================================================================
CSS information

 #header
 #navi
 #footer
  #footerContents
 #page
  #mainImg
  #contentsHeader
  #contents
   #main
   #sub
=================================================================== */

/*----------------------------------------------------
	基本設定、リンクカラーなど
----------------------------------------------------*/
body {
	line-height:180%;
}

a:link {
	color:#444;
	text-decoration: none;
}
a:visited {
	color:#444;
	text-decoration: none;
}
a:hover {
	color:#666;
	text-decoration: none;
}
a:active {
	color:#444;
	text-decoration: none;
}
/*----------------------------------------------------
	画像リンクの投下
----------------------------------------------------*/

/* aタグで囲った画像全てに効果を追加 */

/*
a:hover img{
    filter: alpha(opacity=60);
    -moz-opacity:0.6;
    opacity:0.6;
}
*/
h1 a:hover img{
    filter: alpha(opacity=100);
    -moz-opacity:1;
    opacity:1;
}
/* 透明度変化の時間を設定 */
a img.btnover {
    /* Firefox */
    -moz-transition: 0.4s;
    /* WebKit */
    -webkit-transition: 0.4s;
    /* Opera */
    -o-transition: 0.4s;
    /* Standard */
    transition: 0.4s;
}
 
/* aタグで囲い、imgにclassを追加した画像に効果を追加 */
a:hover img.btnover {
    /* Firefox */
     -moz-opacity: 0.6;
    /* IE */
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
    /* Standard */
    opacity: 0.6;
}

/*======================================

	Others Module

=======================================*/

hr {
	display:none;
}


.ib{ display: inline-block; }
.mb5{ margin-bottom: 5px; }
.mb10{ margin-bottom: 10px; }
.mb15{ margin-bottom: 15px; }
.mb20{ margin-bottom: 20px; }
.mb25{ margin-bottom: 25px; }
.mb30{ margin-bottom: 30px; }
.mb35{ margin-bottom: 35px; }
.mb40{ margin-bottom: 40px; }
.mb45{ margin-bottom: 45px; }
.mb50{ margin-bottom: 50px; }
.mb55{ margin-bottom: 55px; }
.mb60{ margin-bottom: 60px; }
.mb65{ margin-bottom: 65px; }
.mb70{ margin-bottom: 70px; }
.mb75{ margin-bottom: 75px; }
.mb80{ margin-bottom: 80px; }

.mt10{ margin-top: 10px; }
.mt15{ margin-top: 15px; }
.mt20{ margin-top: 20px; }
.mt25{ margin-top: 25px; }
.mt30{ margin-top: 30px; }
.mt35{ margin-top: 35px; }
.mt40{ margin-top: 40px; }
.mt45{ margin-top: 45px; }
.mt50{ margin-top: 50px; }
.mt55{ margin-top: 55px; }
.mt60{ margin-top: 60px; }
.mt65{ margin-top: 65px; }
.mt70{ margin-top: 70px; }
.mt75{ margin-top: 75px; }
.mt80{ margin-top: 80px; }

.ml5{ margin-left: 5px; }
.ml10{ margin-left: 10px; }
.ml15{ margin-left: 15px; }
.ml20{ margin-left: 20px; }
.ml25{ margin-left: 25px; }
.ml30{ margin-left: 30px; }
.ml35{ margin-left: 35px; }
.ml40{ margin-left: 40px; }
.ml45{ margin-left: 45px; }
.ml50{ margin-left: 50px; }
.ml55{ margin-left: 55px; }
.ml60{ margin-left: 60px; }
.ml65{ margin-left: 65px; }
.ml70{ margin-left: 70px; }
.ml75{ margin-left: 75px; }
.ml80{ margin-left: 80px; }

.mr5 { margin-right: 5px; }
.mr8 { margin-right: 8px; }
.mr10{ margin-right: 10px; }
.mr15{ margin-right: 15px; }
.mr20{ margin-right: 20px; }
.mr25{ margin-right: 25px; }
.mr30{ margin-right: 30px; }
.mr35{ margin-right: 35px; }
.mr40{ margin-right: 40px; }
.mr45{ margin-right: 45px; }
.mr50{ margin-right: 50px; }
.mr55{ margin-right: 55px; }
.mr60{ margin-right: 60px; }
.mr65{ margin-right: 65px; }
.mr70{ margin-right: 70px; }
.mr75{ margin-right: 75px; }
.mr80{ margin-right: 80px; }


.mt0{ margin-top: 0px !important;}
.mr0{ margin-right: 0px !important; }
.ml0{ margin-left: 0px !important; }
.mb0{ margin-bottom: 0px !important; }

.ft10{ font-size: 10rem; }
.ft12{ font-size: 12rem; }
.ft14{ font-size: 14rem; }
.ft16{ font-size: 16rem; }
.ft18{ font-size: 18rem; }
.ft20{ font-size: 20rem; }


.tc{ text-align:center; }
.tr{ text-align:right; }
.tl{ text-align:left; }

.just{
	text-align:justify;
	text-justify:inter-ideograph; 
}

.left{
	float:left;
}
.right{
	float:right;
}



/* clearfix*/
.clearfix:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.clearfix{
	min-height: 1px;
	display: inline-table;
}
*:first-child+html .clearfix{
	zoom: 1;
}
/* Hides from IE-mac \*/
* html .clearfix{ height: 1%; }
.clearfix{ display: block; }
/* End hide from IE-mac */
.clear{
	clear:both;
}
.clear hr{ display:none;}
.ovh{ overflow:hidden; height:1%;}

/* ぶらさげインデント */
.indent_bu1{
      margin-left: 1em; /* ブロック全体を 1em 右に */
      text-indent: 1em; /* 先頭の1文字のみ 1em 左に */
}

.indent_bu2{
      margin-left: 2em; 
      text-indent: -2em;
      text-indent/*\**/:-1.3em\9;
}
.indent1{
     margin-left: 1em; 
}
.indent2{
     margin-left: 2em; 
}

/* padding
----------------------------------------------------------*/
/* Left */
.PD-L5 { padding-left: 5px !important; }
.PD-L10 { padding-left: 10px !important; }
.PD-L15 { padding-left: 15px !important; }
.PD-L20 { padding-left: 20px !important; }
.PD-L25 { padding-left: 25px !important; }
.PD-L30 { padding-left: 30px !important; }
/* Right */
.PD-R5 { padding-right: 5px !important; }
.PD-R10 { padding-right: 10px !important; }
.PD-R15 { padding-right: 15px !important; }
.PD-R20 { padding-right: 20px !important; }
.PD-R25 { padding-right: 25px !important; }
.PD-R30 { padding-right: 30px !important; }

/* フォントサイズ・カラー
----------------------------------------------------------*/
.TXT-S { font-size:12px;}
.TXT-M { font-size:14px;}
.TXT-L { font-size:16px;}

.TXT-RED { color:#FF3333;}
.TXT-ORG { color:#f7931e;}

.red { color:#FF6666;}


/* -----------------------------------------------------------
	#header
		ヘッダー
----------------------------------------------------------- */

div.header{
	position:relative;
	height:118px;
}
div.header h1{
	position:absolute;
	top:55px;
	right:0;
}
div.header ul{
	position:absolute;
	top:55px;
	left:0;
}
div.header ul.nav li{float:left;}
div.header ul.nav li {
	margin-right:120px;
	padding-bottom:12px;
}
div.header ul.nav li a.current img{
	border-bottom:1px solid #D3D1D0;
}
div.header ul.nav li a img:hover{
	border-bottom:1px solid #D3D1D0;
}
/* -----------------------------------------------------------
	#naviFrame
---------------------------------------------------------- */
.container {
	position:relative;
	width: 960px;
	margin: 0 auto;
}

/* -----------------------------------------------------------
	#footer
		フッター
----------------------------------------------------------- */
#footer {
	border-top:1px solid #A5A5A5;
	background: url(/img/common/footer_line_btm.gif) repeat-x bottom left;
	clear: both;
	padding: 11px 0 10px 0;
}

#footer ul {
	text-align: left;
}

#footer ul li {
	display: inline;
	font-size:10px;
	border-left: solid 1px #fff;
	padding: 0 10px 0 10px;
}
#footer ul li.end {
	border-right: solid 1px #fff;
}

#footer ul li a{
	color:#fff;
}

#underFooter{
	width: 900px;
	margin: 0 auto;
	background: #fff;
	clear: both;
	padding: 12px 0 40px; 0;
}
#underFooter .copyright {
	width:600px;
	color: #999;
	font-size:8px;
	text-align: left;
	float:left;
}
#underFooter .bnr{
	width:107px;
	float:right;
}
#footer_pagetop{
	padding-bottom:10px;
	width: 900px;
	margin: 0 auto;
	text-align:right;
	clear: both;
}
.footerContents {
	width: 900px;
	margin: 0 auto;
}

/*----------------------------------------------------
	#page
----------------------------------------------------*/
#page {
}

/*----------------------------------------------------
	#contentsHeader
	セカンドページ
----------------------------------------------------*/
#contentsHeader{
	width: 900px;
	margin: 0 auto;
}
/*----------------------------------------------------
	#mainImg
----------------------------------------------------*/
#mainImg {
	padding-bottom:20px;
	width: 900px;
	margin: 0 auto;
	background: url(/img/common/dot_line.gif) repeat-x bottom left;
}

/*----------------------------------------------------
	#frame
----------------------------------------------------*/
#contents {
	width: 900px;
	margin: 20px auto 0 auto;
	padding-bottom: 60px;
	text-align: left;
}

.index #main {
	float: left;
	width: 651px;
}
.index #sub {
	float: right;
	width: 230px;
}

/*----------------------------------------------------
	#セカンドページ
　　　２カラム
----------------------------------------------------*/
.second01 #main {
	float: right;
	width: 690px;
}
.second01 #sub {
	float: left;
	width: 180px;
}

.second01 h3{
	line-height:160%;
	font-size:16px;
	font-weight:bold;
	padding:4px 20px;
	background: url(../img/common/ttl_mark.gif) no-repeat 10px center;
	background-color: #E9F3F8;
/*
	background-image: url("/img/common/ttl_bg.gif");
*/
	width:650px;
}

.side_ttl{
	font-size:14px;
	font-weight:bold;
	line-height:160%;
	background: url(../img/common/side_ttl_bg.gif) repeat-x bottom left;
	border-top:2px solid #2FABEB;
	border-bottom:1px solid #E0E0E0;
	padding:7px 0 7px 0;
}

.side_ttl span{
	background: url(../img/common/ttl_mark.gif) no-repeat left center;
	padding-left:10px;;
}


/*
	セカンドページ移行のサイドナビのリンク色指定
*/
.second01 #sub a{
	color:#333333;
}
.second01 #sub a:hover{
	color:#333333;
}

.second01 #sub ul.side_navi li a{
	color:#333333;
	display:block;
	background: url(../img/common/arrow.gif) no-repeat 10px 1.3em;
	padding:10px 10px 10px 20px;
	border-bottom:1px solid #E0E0E0;

}
.second01 #sub ul.side_sub_navi{
	border-bottom:1px solid #E0E0E0;
}
.second01 #sub ul.side_sub_navi li a{
	display:block;
	background: url(../img/common/arrow.gif) no-repeat 10px 1.3em;
	padding:8px 10px 8px 22px;
	font-size:12px;
	margin:0 10px;
	border-bottom:1px dotted #E0E0E0;
}
.second01 #sub ul.side_sub_navi li.last a{
	border-bottom:none;
}

/*----------------------------------------------------
	#セカンドページ
　　　横幅いっぱい
----------------------------------------------------*/
.second02 #main {
	width: 900px;
}

.second02 h3{
	line-height:160%;
	font-size:16px;
	font-weight:bold;
	padding:4px 20px;
	background: url(../img/common/ttl_mark.gif) no-repeat 10px center;
	background-color: #E9F3F8;
	width:860px;
}

.second02 h4{
	line-height:160%;
	font-size:13px;
	font-weight:bold;
	padding:4px 15px;
	background-color: #EFEFEF;
	width:870px;
}

/*----------------------------------------------------
	#セカンドページ共通
----------------------------------------------------*/
#pankuzu {
	overflow: hidden;
	font-size: 10px;
	margin:10px 0 50px 0;
	color:#919191;
}
#pankuzu li {
	float: left;
}

.content {
	border:1px solid #fff;
	margin:70px 0 100px 0;
	margin-bottom:100px;
}

div.left {
	float: left;
	width: 177px;
}
div.right {
	width: 770px;
	float: left;
}

div.left ul.col_nav li {
	margin-bottom: 26px;
	margin-left:-8px;
	padding: 0px;
}
div.left ul.col_nav li a{
	padding-left:8px;
}

div.left ul.col_nav li a.current,
div.left ul.col_nav li a:hover{
	background-image:url("../images/disc.png");
	background-repeat:no-repeat;
	background-position:0 5px;
}
td{
	padding:8px 20px 8px 0;
	vertical-align:middle;
}
th{
	vertical-align:middle;
	padding-right:20px;
}

.btn{
	cursor:pointer;
	display: inline-block;
	border: 1px solid #ccc;
	padding: 7px 15px;
	-moz-border-radius: 1px;
	border-radius: 1px;
}
/*
cart delete btn
*/

.delete-btn{
  cursor:pointer;
  display: inline-block;
  border: 1px solid #ccc;
  padding: 7px 7px;
  border-radius: 20px;
}
.delete-btn:hover{
	background: #ccc;
	color:#fff;
}

/*----------------------------------------------------
	フォーム
----------------------------------------------------*/

th.login_btn{
	padding:50px 0 0 0;
}
th.login_btn a{
	border:1px solid #ddd;
	padding:6px 50px;
}
th.login_btn a:hover{
	background-color:#ccc;
}

input[type=text]{
	border:0;
	padding:5px;
	color:#666;
	border:solid 1px #ddd;
}
select{
	border:0;
	padding:5px;
	color:#666;
	border:solid 1px #ddd;
}

input[type=text],input[type=number],input[type=password]{
	border:0;
	padding:5px;
	color:#666;
	border:solid 1px #ddd;
}

input[type=number]:read-only,
input[type=text]:read-only{
	background-color: #efefef;
}

input[type=button],
input[type=submit]{
	border: 1px solid #ddd;
	padding: 6px 50px;
	background-color: #fff;
	cursor: pointer;
}

input[type=button]:hover,
input[type=submit]:hover{
/*
	background-color: #ccc;
*/
}


textarea{
	border:0;
	padding:5px;
	color:#666;
	border:solid 1px #ddd;
	width: 100%;
}

.message{
	color: #f00;
	margin-bottom: 1em;
}

.nav li a{
	font-size:13px;
	padding-bottom:10px;
}
.nav li.current a,
.nav li a:hover{
	border-bottom:1px solid #ccc;
}

h2{
/*	font-size:14px;	*/
	margin-bottom:60px;
}
h3{
	margin-bottom:30px;
}

/* j-query.ui.css override */
.ui-widget-content{
	border: 1px solid #ccc;
}


#staff_order_info{
	position: absolute;
	top: 55px;
	left: 0;
	background-color: #f00;
	padding: 8px;
	color: #fff;
}

