/*----------------------------------------------------
 sukeneko.com style sheet
 copyright © 2007 aqualeaf corporation.
------------------------------------------------------*/
html,body,p,h1,h2,h3,h4,h5 {
	margin:0;
	padding:0;
	}
body {
	font-family: "Geneva", "Arial", "Helvetica", "sans-serif", "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Osaka";
	font-size: small;
	/*background: #776859;*/
	text-align:center;
	}

a:link {
	/*color: #FF3366;*/
	color: #3A9EEB;
	font-weight: bold;
}
a:visited {
	color: #3A9EEB;
	font-weight: bold;
}
a:hover {
	color: #3A9EEB;
	font-weight: bold;
	text-decoration: underline;
}
.right {
	float: right;
}
.more {
	text-align: right;
}
span.vertical {
	vertical-align:super;
}
h3 {
	/*clear:both;*/
	color: #300;
	padding: 0 10px;
	margin: 0 0 10px 0;
	font-size: 14px;
	line-height: 30px;
	border-top: 1px solid #CCCCCC;
	width: 95%;
}
.clear{
	margin: 0;
	padding: 0;
	clear: both;
	}

/*----------------------------------------------------
  container（共通）
------------------------------------------------------*/
#container{
	width: 825px;
	margin:0 auto;
	padding: 0;
	background: #FFF;
	text-align:left;
	}

/*----------------------------------------------------
  header（共通）
------------------------------------------------------*/
#header {
	margin:0;
	padding:0;
	position:relative;
	}
#logo {
	height:80px;
	margin:0 10px;
	padding:10px 0;
	}
#header h1 {
	/*color: #FF3366;*/
	/*color: #79B30B; (green) */
	width:345px;
	font-size: medium;
	font-weight: normal;
	position: absolute;
	right: 0;
	top: 25px;
	_top: 25px; /* WindowsIE Hack */
	}
#header p {
	width:345px;
	font-size: small;
	font-weight: normal;
	color: #8F310E;
	position: absolute;
	right: 0;
	top: 70px;
	_top: 70px; /* WindowsIE Hack */
	}

/*----------------------------------------------------
  footer（共通）
------------------------------------------------------*/
#footercontainer {
	/*clear: both;*/
	width: 100%;
	font-size: 10px;
	margin-top: 20px;
	padding: 10px 0 10px 0;
	text-align: center;
	background: #300;
	color: #B59382;
	}
#footer {
	width: 850px;
	margin: 0 auto;
	padding: 0;
	text-align: left;
	}
#footer p {
	font-size: 10px;
	margin: 0;
	padding:5px 10px;
	text-align: center;
	}
#footer a {
	font-size: 10px;
	font-weight: normal;
	padding: 0;
	text-decoration: none;
	color: #926956;
	}
#footer h3,
#footer h3 a {
	font-size: 12px;
	font-weight: bold;
	margin: 0;
	padding: 0;
	color: #B59382;
	border: none;
	}
#footer a:hover {
	color: #B59382;
	text-decoration: underline;
	}
#footer p.credit{
	clear:both;
	}
#footer_menu_motto {
	margin: 0;
	padding: 10px 0;
									/*height: 142px;*/
}
#footer_menu_motto p {
	margin: 0;
	padding: 0;
	text-align: left;
}
#footer_menu {
	margin: 0;
	padding: 10px 0;
	float: left;
	width: 130px;
}
#footer_menu ul,
#footer_menu ul a,
#footer_menu li,
#footer_menu li a {
	_font-size: 9px; /*IE Hack*/
	list-style: none;
	margin: 0;
	padding: 0;
}

#footer_menu_invoice {
	margin: 0;
	padding: 10px 0;
	float: left;
	width: 170px;
}
#footer_menu_invoice ul,
#footer_menu_invoice ul a,
#footer_menu_invoice li,
#footer_menu_invoice li a {
	_font-size: 9px; /*IE Hack*/
	list-style: none;
	margin: 0;
	padding: 0;
}

/*----------------------------------------------------
  headline（ページ内のタイトル）
------------------------------------------------------*/
#headline{
	margin: 0;
	padding-bottom: 10px;
	}
#headline h2 {
	color: #8F310E;
	font-size: 16px;
	font-weight: bold;
	margin: 0;
	padding-top: 15px;
	padding-bottom: 10px;
	}

/*----------------------------------------------------
  banner（お問い合わせ画像）
------------------------------------------------------*/
#banner {
	/*clear: both;*/
	/*float: right;*/
	width: 194px;
	height: 71px;
	}

/*----------------------------------------------------
  content（ＴＯＰページ）
------------------------------------------------------*/
#content{
	/*clear:both;*/
	margin-top:5px;
	margin-bottom:25px;
	padding-left: 20px;
	float:left;
	width: 500px;
	}

/*----------------------------------------------------
  navigation（ＴＯＰページの左側のブロック）
------------------------------------------------------*/
#navigation {
	clear: both;
	float: left;
	width: 194px;
									/* margin-top: 15px; */
									/* padding-right: 25px; */
									/*background: #776859;*/
	}
#navigation p {
	margin: 0;
	}

/*----------------------------------------------------
  contentbox（中ページのコンテンツと右側のブロックの入れ物）
------------------------------------------------------*/
#contentbox {
	clear: both;
	margin: 0;
	padding: 0;
	}

/*----------------------------------------------------
  contentmenu（中ページのコンテント）
------------------------------------------------------*/
#contentmenu{
	/* clear:both; */
	/*margin-top:5px;*/
	/*margin-bottom:25px;*/
	padding-right: 29px;
	float:left;
	width: 600px;
	}
#contentmenu h3 {
	clear:both;
	color: #300;
	padding: 0 0;
	margin: 0 0 10px 0;
	font-size: 16px;
	line-height: 30px;
	border-top: 1px solid #CCCCCC;
}
#contentmenu ul {
	color: #300;
	font-weight: bold;
	margin:0px;
	padding-left:15px;
	}
#contentmenu img.float {
	margin:0px 15px 15px 0;
	float:left;
	vertical-align: middle;
	}

#contentmenu p.description {
	float:left;
	margin:0px;
	padding:15px;
	background: #E4F2FC;
	width: 300px;
	}
#contentmenu p.quo {
	line-height: 1.5em;
	margin: 5px 0;
	padding:10px;
	background: #F1F9FE;
	border: 1px solid #E4F2FC;
	}
#contentmenu p.que {
	font-size: 14px;
	font-weight: bold;
	color: #FF92B1;
	line-height: 1.5em;
	margin-top:17px;
	padding-left:20px;
	background-image: url("sukeneko/img/q_sukeneko2.gif");
	background-repeat: no-repeat;
	}
#contentmenu p.ans {
	font-size: 14px;
	line-height: 1.5em;
	margin: 5px 0;
	padding:10px;
	background: #F9F9F9;
	border: 1px solid #EEEEEE;
	}
#contentmenu div.ans {
	font-size: 14px;
	line-height: 1.5em;
	margin: 5px 0;
	padding:10px;
	background: #F9F9F9;
	border: 1px solid #EEEEEE;
	}
#contentmenu p.more {
	text-align: right;
	padding-bottom:15px;
}

/*----------------------------------------------------
  navimenu（中ページの右側のブロック）
------------------------------------------------------*/
#navimenu {
	margin: 0;
	padding: 0;
	float: left;
	width: 194px;
										/*clear:both;*/
										/*background: #776859;*/
	}
#navimenu p {
	margin: 0;
	}

/*----------------------------------------------------
  サービス紹介の茶色四角（ＴＯＰページ）
------------------------------------------------------*/
#square {
	clear:both;
	margin: 0;
	padding: 0;
	}
#square_ecshop {
	background-image: url(sukeneko/img/bg_square_ecshop.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 16px 10px 10px;
	float: left;
	width: 180px;
	height: 142px;
}
#square_delivery {
	background-image: url(sukeneko/img/bg_square_delivery.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 16px 10px 10px;
	float: left;
	width: 180px;
	height: 142px;
}
#square_order {
	background-image: url(sukeneko/img/bg_square_order.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 16px 10px 10px;
	float: left;
	width: 180px;
	height: 142px;
}
#square_zaiko {
	background-image: url(sukeneko/img/bg_square_zaiko.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 16px 10px 10px;
	float: left;
	width: 180px;
	height: 142px;
}
#square_invoice {
	background-image: url(sukeneko/img/bg_square_invoice.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 16px 10px 10px;
	float: left;
	width: 180px;
	height: 142px;
}
#square_ecshop a,
#square_delivery a,
#square_order a,
#square_zaiko a,
#square_invoice a{
	cursor:hand;
	text-decoration: none;
}
#square_ecshop h2,
#square_delivery h2,
#square_order h2,
#square_zaiko h2,
#square_invoice h2 {
	color: #FFF;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.0;
	margin: 0;
	padding-bottom: 7px;
	}
#square_ecshop p,
#square_delivery p,
#square_order p,
#square_zaiko p,
#square_invoice p {
	color: #FFF;
	font-size: 12px;
	font-weight: normal;
	margin: 0;
	padding-right: 60px;
	/* width: 100px; */
	}

/*----------------------------------------------------
  助ネコのサービスはすべてＡＳＰだから安心（ＴＯＰページ）
------------------------------------------------------*/
#oshirase {
	margin: 0;
	padding-left: 8px;
	float: left;
	width: 600px;
	/* height: 142px; */
}
#oshirase h2 {
	color: #8F310E;
	font-size: 16px;
	font-weight: bold;
	margin: 0;
	padding-top: 5px;
	padding-bottom: 10px;
	}
#oshirase p {
	font-size: 14px;
	font-weight: normal;
	line-height: 1.5;
	margin: 0;
	padding: 0;
	}

/*----------------------------------------------------
  アコーディオン（ＴＯＰページ）
------------------------------------------------------*/
#accordion {
	background-image: url(sukeneko/img/banner_order_760.gif);
	background-repeat: no-repeat;
	background-position : 60px 10px;
	clear:both;
	padding-top: 10px;
	padding-bottom: 20px;
	}

.haccordion .header, .haccordion .content{
	float: left;
	height: 270px;
	}
.haccordion .header{
	width: 20px;
	cursor: pointer;
	}
  .haccordion .vbar_ecshop{
   background-image: url(sukeneko/img/acco_obi_ecshop.gif);
   background-repeat: no-repeat;
  }
  .haccordion .vbar_order{
   background-image: url(sukeneko/img/acco_obi_order.gif);
   background-repeat: no-repeat;
  }
  .haccordion .vbar_zaiko{
   background-image: url(sukeneko/img/acco_obi_zaiko.gif);
   background-repeat: no-repeat;
  }
  .haccordion .content{
   display: none;
   width: 0px;
   overflow: auto;
  }

/*----------------------------------------------------
  助ネコの歴史（ＴＯＰページ）
------------------------------------------------------*/
#box {
	margin-top: 15px;
	padding: 0;
	width: 194px
	}
.box-header {
	font-weight: bold;
	color: #990033;
	background-image: url(sukeneko/img/graybox_01.gif);
	background-repeat: no-repeat;
	padding: 10px 10px 0 10px;
	margin: 0;
	background-position: top center;
	}
.box-body {
	font-size: 10px;
	_font-size: 9px; /*IE Hack*/
	line-height: 1.5em;
	color: #666;
	background-image: url(sukeneko/img/graybox_02.gif);
	background-repeat: repeat-y;
	padding: 5px 10px 0 10px;
	margin: 0 0;
	background-position: top center;
	}
.box-footer {
	background-image: url(sukeneko/img/graybox_03.gif);
	background-repeat: no-repeat;
	padding: 0 0;
	margin: 0 0;
	background-position: top center;
	}

/*----------------------------------------------------
  あなたのショップに必要なサービスはどれ？（ＴＯＰページ）
------------------------------------------------------*/
#osusume {
	margin: 0;
	padding: 0;
	width: 600px;
	}
#osusume a {
	cursor: hand;
	text-decoration: none;
}
#osusume h2 {
	color: #8F310E;
	font-size: 16px;
	font-weight: bold;
	margin: 0;
	padding-top: 20px;
	padding-bottom: 10px;
	}
#osusume p {
	font-size: 14px;
	font-weight: normal;
	line-height: 1.5;
	margin: 0;
	padding: 0;
	}
#osusume p.osusume-header {
	font-weight: bold;
	font-size: 18px;
	color: #FFF;
	background-image: url(sukeneko/img/osusume_01.gif);
	background-repeat: no-repeat;
	padding: 50px 0 7px 100px;
	margin: 0;
	background-position: top center;
														/* height:84px; */
	}
#osusume p.osusume-body {
	background-image: url(sukeneko/img/osusume_02.gif);
	background-repeat: repeat-y;
	padding: 5px 10px;
	margin: 0;
	background-position: top center;
	}
#osusume p.osusume-footer {
	background-image: url(sukeneko/img/osusume_03.gif);
	background-repeat: no-repeat;
	padding: 0;
	margin: 0;
	background-position: top center;
	}

/*----------------------------------------------------
  Speech Bubble（おすすめプラン）
------------------------------------------------------*/
#comment1{
	padding-right:14px;
	margin:10px;
	position:relative;
	width:250px;
	float:left;
}
#comment2{
	padding-right:14px;
	margin:10px;
	position:relative;
	width:350px;
	float:left;
}
#comment3{
	padding-right:14px;
	margin:10px;
	position:relative;
	width:80%;
	float:left;
}

.bubble{
    padding: 10px;
    text-align: left;
    border: 2px solid #D5F5F7;
	background-color:#EFFBFC;
}
.tail {
	position:absolute;
	top:0.8em;
	right:0;
	height: 11px;
	width: 16px;
}
.tail span {
	display: block;
	background-color:#EFFBFC;
	border-top:2px solid #D5F5F7;
	border-bottom:2px solid #D5F5F7;
	font-size:0;
	width: 3px;
	position:absolute;
	line-height:0;
	margin:0;
	padding:0;
}
.tail .a1 { height: 9px;left:0;}
.tail .a2 { height: 7px;left:2px;}
.tail .a3 { height: 5px;left:2px;}
.tail .a4 { height: 3px;left:2px;}
.tail .a5 { height: 1px;left:2px;}
.tail .a6 { background-color: #D5F5F7; border: 0; height: 2px;left:2px;}

/*----------------------------------------------------
  IzzyMenu（ＴＯＰページ）
------------------------------------------------------*/
#MainMenu {
	height: 33px;
	background: url(sukeneko/img/bg_banner.gif) no-repeat left top;
	border: 0;
	margin: 0 0 0 0;
	}
#tab {
	top: 0;
	height: 0;
	background: repeat-x top;
	margin: 0;
	}
#tab ul {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0;
	}
#tab li {
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
	}
#tab a {
	background: url(sukeneko/img/bg_banner.gif) no-repeat left top;
	text-decoration: none;
	border: 0;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	background-position: -5px 0;
	}
#tab a.left {
	background: url(sukeneko/img/bg_banner.gif) no-repeat left top;
	text-decoration: none;
	border: 0;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	background-position: 0 0;
	}
#tab a span {
	display: block;
	font-size: 12px;
	color: #FFF;
	font-weight: bold;
	line-height: 33px;
	padding: 0 20px;
	background-position: -5px 0;
	}
#tab a:hover,
#tab li.item_active a {
	background-position: -10px -34px;
	}
#tab a.left:hover,
#tab li.item_active a.left {
	background-position: 0 -34px;
	}

/*----------------------------------------------------
  IzzyMenu(右のメニュー)
------------------------------------------------------*/
#MainMenuVer {
	width: 194px;
	height: 210px;
	border: 0;
	margin: 0;
	}
#tabVer {
	top: 0;
	height: 0;
	margin: 0;
	}
#tabVer ul {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0;
	}
#tabVer li {
	float: left;
	clear: both;
	margin: 0;
	padding: 0;
	}
#tabVer li img {
	margin-right: 7px;
	vertical-align: baseline;
	}
#tabVer a {
	background: url(sukeneko/img/bg_vmenu.gif) no-repeat right bottom;
	text-decoration: none;
	width: 194px;
	border: 0;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
											/*line-height:33px;*/
	}
#tabVer a span {
	height:33px;
	display: block;
	background: url(sukeneko/img/bg_vmenu.gif) no-repeat left bottom;
	font-size: 12px;
	color: #FFF;
	line-height: 33px;
	padding: 0 10px;
	}
#tabVer a:hover,
#tabVer li.item_active a {
	background-position: right bottom;
	cursor:hand;
	}
#tabVer a:hover span,
#tabVer li.item_active a span {
	background-position: left top;
	color: #FFF;
	text-decoration: none;
	}

/*----------------------------------------------------
  CSS Crossfader(フェードインフェードアウト)
  http://mikeomatic.net/techtips/css-crossfader/
------------------------------------------------------*/
/* class styles */
.fade-box {
	position: absolute;
}

/*----------------------------------------------------
  clearfix hack
------------------------------------------------------*/
/* モダンブラウザ（Firefox Opera Safari）対策 */
.clearfix:after{
	content:".";
	display:block;
	height: 0;
	clear:both;
	visibility:hidden;
}

/* Win版IE7とMac版IE5対策 */
.clearfix{
	display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html .clearfix{
	height:1px;
}

.clearfix{
	display:block;
}
/* End hide from IE-mac */

/*----------------------------------------------------*/