@charset "shift_jis";

/*-----------------------------------すべての要素を初期化*/
/*  
Copyright (c) 2006, Yahoo! Inc. All rights reserved.  
Code licensed under the BSD License:  
http://developer.yahoo.net/yui/license.txt  
version: 0.10.0  
*/  
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}  
html { height: 100%; margin-bottom: 1px; }
table{border-collapse:collapse;border-spacing:0;}  
fieldset,img{border:0;}  
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}  
ol,ul {list-style:none;}  
caption {text-align:left;}
input,textarea,select { font-family: inherit; font-size: inherit; font-weight: inherit; color: inherit; }
input,textarea,select { *font-size: 100%; }
input { _margin: -1px 0; }  
sup,sub { vertical-align: baseline; position: relative; }
sup { top: -4px }
sub { top: 4px }
th { vertical-align: top; font-weight: normal; text-align: left; }
td { vertical-align: top; }
h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}
q:before,q:after{content:'';}
hr { display: none;}
/*-----------------------------------clearfixハック*/
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clear {display: inline-block;}
/* Hides from IE-mac \*/
* html .clear {height: 1%;}
.clear {display: block;}
/* End hide from IE-mac */
/*-----------------------------------回り込み解除*/
.clearBoth { clear: both; }
/*-----------------------------------imgoverを指マークに*/
.imgover { cursor:pointer; }
/*-----------------------------------imgの下の隙間をなくす*/
img { vertical-align:bottom; }
/*-----------------------------------基本セッティング*/
body{ font-family: "ＭＳ Ｐゴシック", "Osaka",arial,helvetica,clean,sans-serif; color: #3c3c3c; font-size: 12px; _font-size:83%; background-color: #c7eaf2; }
table { font-size:inherit; }
a{ outline : 0 ;}
a { text-decoration: none;  }
a:hover { text-decoration: underline; }
li,p,dt,dd { line-height: 1.5; }
td,th,h1,h2,h3,h4{ line-height: 1.5; }
strong,em { font-weight: bold; }
address { line-height: 1.5; }
/*-----------------------------------マージン*/
.marT5 { margin-top: 5px; }
.marT10 { margin-top: 10px; }
.marT15 { margin-top: 15px; }
.marT20 { margin-top: 20px; }
.marT30 { margin-top: 30px; }
.marB10 { margin-bottom: 10px; }
.marB20 { margin-bottom: 20px; }
.marR10 { margin-right: 10px; }
.marR20 { margin-right: 20px; }
.marL10 { margin-left: 10px; }
.marL20 { margin-left: 20px; }
/*-----------------------------------線*/

/*-----------------------------------テキスト位置*/
.fRight { float: right;}
.fLeft { float: left;}
.txtLeft { text-align: left; }
.txtRight { text-align: right; }
.center { text-align: center; }
.middle {vertical-align: middle; }
.bottom {vertical-align: bottom; }
/*-----------------------------------リスト*/
.list01 li{	list-style-position: outside; list-style-type: disc; margin: 5px 0 0 15px; line-height:1.2; }
.list02 li{	list-style-position: outside; list-style-type: decimal; margin: 10px 0 0 15px; line-height:1.2; }
/*-----------------------------------フォント設定*/
.normal { color: #333; font-weight: normal; font:12px;*font-size:small;*font:x-small; }
.small { font-size: 10px; _font-size: 83.3%; }
.large { font-size: 14px; _font-size: 116.6%; }
.xlarge { font-size: 16px; _font-size: 133.3%; }
.color01{ color: #ff0000;}
/*-----------------------------------外枠*/
#wrapper { width:850px;	margin: 0 auto; padding: 0 5px; position: relative; background:#41b8d4; }
/*-----------------------------------ヘッダー*/
#header {
	width:850px;
	height: 105px;
	position: relative;
	background: url(../images/header.gif) no-repeat;
	margin-bottom: 5px;
}
#header #logo{
	position: absolute;
	top: 30px;
	left: 20px;
}

/* ヘッダーテキスト */
#header h1{	
	position: absolute;
	top: 1px;
	right: 10px;
	color: #FFFFFF;
	font-size: 12px;
	z-index: 1;
}
#header h1 strong{ color:#C60057; }

#header h1 a {
	color:#FFFFFF;
	text-decoration:none;
}

#header h1 a:hover {
	text-decoration:underline;
}

/* ヘッダーテキスト ※全ページへ変更100616 */
#header h2 {
    position: absolute;
    top: 25px;
    right: 5px;
	font-size:13px;
	font-weight:normal;
	color:#0099CC;
}

/* ヘッダーナビ */
#headerNav { 
	position: absolute;
	top: 80px;
	right:140px;
	padding: 0px 0px 0 0px;
	height: 25px;
}

#headerNav li {
	float: left;
	color:#666666;
}
#headerNav li a {
	color:#666666;
}

#headerNav li a:hover {
	text-decoration:underline;
}

/* ヘッダー新規登録ボタン */
#header #btn-regist {
    position: absolute;
    top: 75px;
    right: 10px;
	margin:0;
	padding:0;
}

/*-----------------------------------メインナビ*/
ul#mainnav { width:850px; height: 50px; position: relative; }
#mainnav li{ float: left; height: 50px;}
/*-----------------------------------メイン枠*/
#container { width:830px; padding: 10px; background:url(../images/waku_btm.gif) no-repeat bottom; background-color:#FFFFFF; position: relative;}
#container:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
#container {display: inline-block;}
/* Hides from IE-mac \*/
* html #container {height: 1%;}
#container {display: block;}
/* End hide from IE-mac */

/*-----------------------------------本文*/
#main { width: 640px; float: left; padding-bottom: 20px; position: relative;}
#subNav { width: 180px; float: right; position: relative;}
#pagetitle { width: 605px; height: 47px; background:url(../images/pagetitle.gif) no-repeat; font-size: 18px; color: #fff; font-weight: bold; padding: 23px 0 0 35px; }
.subtitle { margin: 15px 0 0 0; background: url(../images/subtitle.gif); width: 625px; height: 23px; padding: 4px 0 0 15px; color: #C60057; font-weight: bold;}

.textarea { 
	margin: 20px 10px;
	position: relative;
	zoom:1;
}
	.textarea:after{
		content: ".";
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
	}
	
/*-----------------------------------ページトップへ戻る*/
.pagetop { position: absolute; bottom: 10px; right: 200px;}

/*-----------------------------------サイドナビ*/
#loginBox { background: url(../images/login_btm.gif) no-repeat bottom; background-color: #41b8d4; padding-bottom: 10px;  width: 180px; color: #fff; text-align:center;
	margin-top:10px;
 }
#loginBox a { color: #fff; }
#loginBox input { color: #333; }
#supportBox { background: url(../images/support_bk01.gif) no-repeat top;  width: 180px; text-align:center; margin-top: 10px; }
#supportBox h3 { color:#0068B6; font-size: 14px; font-weight: bold; margin-top: 5px; }
#supportBoxBtm { background: url(../images/support_bk02.gif) no-repeat bottom;  width: 180px; padding-bottom: 10px;}

/* サイドバー　おすすめ商品
==================================================*/
#subNav #recommend-item {
	width:180px;
	margin:auto;
	text-align:center;
	padding:0;
}

#subNav #recommend-item dl {
	width:170px;
	margin:auto;
	text-align:center;
	padding:8px 0 5px 0;
	border-bottom:dotted 1px #41B8D4;
}

#subNav #recommend-item dl dt img {
	border:solid 1px #CCCCCC;
}


#subNav #recommend-item dl dd {
	width:160px;
	margin-top:3px;
	padding-left:5px;
	text-align:left;
	line-height:1.3;
}

.itemBox { padding: 10px 10px 0 10px;}
.itemBox h3 { color:#A5318C; margin-top: 10px; font-weight: bold;}

#bnr { margin: 20px 0; }
#bnr li { text-align:center; margin-top: 5px; }
/*-----------------------------------フッター*/
#footer  { width:850px; height: 102px; margin-top: 5px; color: #898989; background:url(../images/footer.gif) no-repeat top; position: relative;}
#footer a{  color: #898989;}
#footernav01 { position: absolute; top: 5px; left: 235px;}
#footernav01 li { float: left; line-height: 1.3; }
#footernav02{ position: absolute; bottom: 5px; left: 235px; color: #00B4ED; font-weight: bold; width:450px;}
#footernav02 a { color: #00B4ED;}
#footernav02 li {
	display:inline;
	 text-align:left;
}
#copylight { padding: 10px 0; text-align: right; color:#fff;}

/*-----------------------------------テーブル*/
.table01 { width: 618px; border-top: 1px solid #999; border-right: 1px solid #999; }
.table01 th { background-color: #ccc; padding: 5px 0; width: 100px; text-align: center; border-bottom: 1px solid #999; border-left: 1px solid #999;}
.table01 td { padding: 5px 10px; border-bottom: 1px solid #999; border-left: 1px solid #999;}


/* 共通
==================================================*/
/* レイアウト */
.al-l {
	text-align:left !important
}

.al-r {
	text-align:right !important
}

.al-c {
	text-align:center !important
}

.left {
	float:left;
}

.right {
	float:right;
}

/* imgレイアウト */
.img-left {
	float:left;
	margin:0 10px 5px 0;
}

.img-right {
	float:right;
	margin:0 0 5px 10px;
}

/* main内で使うpagetop */
.pagetop-main {
	text-align:right;
	margin:0 0 10px 0;
	padding:0;
}

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

	#topic-path
	
==================================================*/
#main ul#topic-path{
	list-style: none;
	font-size: 91%;
	padding: 0px 0 10px 0;
	zoom: 1;
}

#main ul#topic-path:after{
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

#main ul#topic-path li{
	float: left;
}



/* インフォメーションテキストボックス （会社概要・アイテム）
==================================================*/

#main .info-box {
	background:url(../../images/bg_info-box_bottom.gif) left bottom no-repeat;
	margin:15px 0 15px 0;
	padding:0 0 10px 0;
}

#main .info-box h4 {
	background:url(../../images/title_info-box.jpg) left top no-repeat;
	height:35px;
	line-height:35px;
	font-weight:bold;
	color:#FFFFFF;
	padding:0 0 0 10px;
	font-size:16px;
}

#main .info-box p {
	background:url(../../images/bg_info-box_body.gif) left top repeat-y;
	padding:10px 15px 0px 15px;
	font-size:117%;
	color:#000066;
}

#main .info-box p span {
	color:#FF0000;
}

#main .topBan{
	padding: 10px 0;
}

#main table.topSP{
	margin: 5px 0 5px 10px;
}

#main p.topSP{
	margin: 5px 10px 5px 10px;
}


/* 画像置換関連
==================================================*/
.topBan-img{
	zoom: 1;
}

.topBan-img:after{
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.topBan-img span.link-box {
	width: 210px;
	height: 105px;
	display: block;
	text-indent: -9999px;
	float: left;
	margin: 0 4px 0 0;
}
.topBan-img span.end {
	margin: 0px 0px 0px 0px;
}

.topBan-img span.img-btn {
	width: 210px;
	height: 105px;
	display:block;
}

.topBan-img .top-btn1{
	background: url(../../images/top_btn1.jpg) no-repeat;
}

.topBan-img .top-btn2{
	background: url(../../images/top_btn2.jpg) no-repeat;
}

.topBan-img .top-btn3{
	background: url(../../images/top_btn3.jpg) no-repeat;
}

.link-box .topBan-txt{
	display:block;
	margin:0 0 0 0;
	padding:0;
	text-indent:0px;
	font-size:91%;
	text-align:center;
}

p.topbnr-txt{
	margin:5px 5px 0 0;
	padding:0;
	text-indent:0px;
	font-size:91%;
	text-align:right;
}

#main h2#introduction{
	margin-top:15px;
	_margin-top:0px;
	margin-bottom: 0;
	padding-bottom: 0;
}

#main h2.introduction-img a{
	display: block;
	width: 630px;
	height: 340px;
	background: url(../../images/top_3step.jpg) no-repeat;
	text-indent: -9999px;
	margin-bottom: 0;
	padding-bottom: 0;
}

p.introduction-img2{
	background: url(../../images/top_3step.jpg) no-repeat 0px -340px;
}

p.introduction-img2 a{
	display: block;
	width: 470px;
	height: 60px;
	background: url(../../images/top_3step.jpg) no-repeat -80px -340px;
	text-indent: -9999px;
	margin-top: 0;
	margin-left: 80px;
	padding-top: 0;
}

.subtitle-kessai-img{
	background: url(../../images/subtitle_kessai.gif) no-repeat;
	width: 639px;
	height: 27px;
	text-indent: -9999px;
}

.subtitle-jirei-img{
	background: url(../../images/subtitle_jirei.gif) no-repeat;
	width: 639px;
	height: 27px;
	text-indent: -9999px;
}

.top-title-sp-img a{
	display: block;
	background: url(../../images/top_title_sp.jpg) no-repeat;
	width: 630px;
	height: 35px;
	text-indent: -9999px;
}

.subtitle-up-service-img{
	background: url(../../images/subtitle_up_service.gif) no-repeat;
	width: 639px;
	height: 27px;
	text-indent: -9999px;
}

.subtitle-1-img{
	background: url(../../images/subtitle_1.gif) no-repeat;
	width: 639px;
	height: 27px;
	text-indent: -9999px;
}

.subtitle-5-img{
	background: url(../../images/subtitle_5.gif) no-repeat;
	width: 639px;
	height: 27px;
	text-indent: -9999px;
}

.btn5min-img{
	display: block;
	text-indent: -9999px;
	background: url(../../images/btn5min.jpg) no-repeat;
	width: 460px;
	height: 40px;
}

.banner-up-img{
	background: url(../../images/banner_up.jpg) no-repeat;
	width: 630px;
	height: 80px;
	display: block;
	text-indent: -9999px;
}

.banner-web-drop-img{
	background: url(../../images/banner_web_drop.jpg) no-repeat;
	width: 630px;
	height: 80px;
	display: block;
	text-indent: -9999px;
}

table.topSP a{
	width: 200px;
	height: 50px;
	display: block;
	text-indent: -9999px;
}

table.topSP .top-sp-menu1{
	background: url(../../images/top_sp_menu1.jpg) no-repeat;
}

table.topSP .top-sp-menu2{
	background: url(../../images/top_sp_menu2.jpg) no-repeat;
}

table.topSP .top-sp-menu3{
	background: url(../../images/top_sp_menu3.jpg) no-repeat;
}

table.topSP .top-sp-menu4{
	background: url(../../images/top_sp_menu4.jpg) no-repeat;
}

table.topSP .top-sp-menu5{
	background: url(../../images/top_sp_menu5.jpg) no-repeat;
}

table.topSP .top-sp-menu6{
	background: url(../../images/top_sp_menu6.jpg) no-repeat;
}

table.topSP .top-sp-menu7{
	background: url(../../images/top_sp_menu7.jpg) no-repeat;
}

table.topSP .top-sp-menu8{
	background: url(../../images/top_sp_menu8.jpg) no-repeat;
}

table.topSP .top-sp-menu9{
	background: url(../../images/top_sp_menu9.jpg) no-repeat;
}

table.topSP .top-sp-menu10{
	background: url(../../images/top_sp_menu10.jpg) no-repeat;
}

table.topSP .top-sp-menu11{
	background: url(../../images/top_sp_menu11.jpg) no-repeat;
}

table.topSP .top-sp-menu12{
	background: url(../../images/top_sp_menu12.jpg) no-repeat;
}

table.topSP .top-sp-menu13{
	background: url(../../images/top_sp_menu13.jpg) no-repeat;
}