﻿/*-------------------------------------------------------------------------
 * Builder　個別スタイル　builder10.css
 * 	Copyright (c) 2012   www.inex.co.jp	
 *
 * (update 2012/09/24 : /builder/base/)
 *
 *-------------------------------------------------------------------------*/
.cl {
clear:both;
}
.clearfix:after {
  content: ".";  
  display: block;  
  clear: both;
  height: 0.1px;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}


.txt-center{
text-align:center !important;
}
.txtRed{
color:#f8003f;
}
.txtNavy{
color:#0e3192;
}
.txtDef{
color:#333333;
}

.nonMargin{
margin:0 !important;
}


.small{
font-size:0.8em;
}

.gray{
color:#666666;
}

.Wred{
color:#da1223;    
}

.line {
	border:1px solid #bdd1e6;
	padding:10px;
	clear: both;
	height: 55px;
	line-height: 18px;
}


 /*
 float
----------------------------------------------------------- */

.FloatL {
float: left;
}

.FloatR {
float: right;
}



/* マージン：上方向
--------------------------------------------------------------*/

.mt5{
margin-top:5px !important;
}

.mt10{
margin-top:10px !important;
}

.mt20{
margin-top:20px !important;
}


/* マージン：左方向
--------------------------------------------------------------*/

.ml10{
margin-left:10px !important;
}
.ml20{
margin-left:20px !important;
}
.ml40{
margin-left:40px !important;
}



/* マージン：右方向
--------------------------------------------------------------*/

.mr10{
margin-right:10px !important;
}
.mr20{
margin-right:20px !important;
}
.mr40{
margin-right:40px !important;
}



/* マージン：下方向
--------------------------------------------------------------*/
.mb10{
margin-bottom:10px !important;
}
.mb20{
margin-bottom:20px !important;
}
.mb40{
margin-bottom:40px !important;
}


/* パディング：下方向
--------------------------------------------------------------*/
.pb10{
padding-bottom:10px !important;
}
.pb20{
padding-bottom:20px !important;
}
.pb40{
padding-bottom:40px !important;
}

/* ------------------------------------------------------ *
 		ｻﾌﾞナビゲーションのリストスタイル4-2
 * ------------------------------------------------------ */
/* ｻﾌﾞナビのスタイル */
#sub-builderMenu {
	margin: 0 -20px 20px 0;
	float: left;
	width: 185px;
	padding: 2px;
	height: 150px; 							/* 表示範囲指定　*/
	overflow: auto;							/* スクロールバー付き　*/
}
*html #sub-builderMenu{						/*for IE6 hack*/
	margin: 0 -20px 0 0;
	width: 170px;
}
#sub-builderMenu h4{
	margin: 0 0 15px 0;
	width: 165px;
	height: 30px;
	line-height: 2.2em;
	font-weight: bold;
	font-size: 14px;
	text-indent: 15px;
	color: #FFFFFF;
	background-color: #0096FF;					/*　青色*/
	box-shadow: 5px 5px 3px #888888;
}
*html #sub-builderMenu h4{margin: 0 -20px 0 0;}		/*for IE6 hack*/
#sub-builderMenu li {
	width:150px;
	height:35px;
	padding: 0 0 0 10px;
	font-weight: bold;
	font-size: 12px;
	color: #446699;
	list-style-type: none;
}
*html #sub-builderMenu li button{margin: 0 -20px 0 0;}	/*for IE6 hack*/
#sub-builderMenu li a {
	display: block;
	color: #446699;
	padding: 10px 0 0 15px;
	border-bottom: 1px solid #DCDCDC;
	background: url("../../../user/vist/images/bg_menulist.gif") 0 12px no-repeat;
}
#sub-builderMenu li a:hover {
	background-image: url("../../../user/vist/images/cafe_icon_arrow_hover.gif");
	color: #FF0000;
}

/*-------------------------------------------------------
 	ﾎﾞﾀﾝのスタイル
-------------------------------------------------------- */
.btnStd_150{
	margin: 10px 0 0 0;
	width: 150px;
	height: 40px;
	background-color: #33CC33;
	border-top: 0;
	border-right: 2px #006600 solid;
	border-bottom: 2px #006600 solid;
	border-left: 0;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	cursor: pointer;
	-webkit-border-radius: 3px; /*for Safari*/
	-moz-border-radius: 3px; 	/*for FF*/
}


/*-------------------------------------------------------
 	20-1 ﾎﾞｯｸｽ　タイプ 1-1 left image
-------------------------------------------------------- */	

/*-------------------------------------------------------
 	20-2 ﾎﾞｯｸｽ　タイプ 1-2 right image
-------------------------------------------------------- */	

/*-------------------------------------------------------
 	21-1 ﾎﾞｯｸｽ　タイプ  left image 画像（小）
-------------------------------------------------------- */	

/*-------------------------------------------------------
 	21-2 ﾎﾞｯｸｽ　タイプ 3-1 left image 画像（中）
-------------------------------------------------------- */	
/*-------------------------------------------------------
 	21-3 ﾎﾞｯｸｽ　タイプ  left image  画像（小）　枠線なし 
-------------------------------------------------------- */	

/*-------------------------------------------------------
 	21-4 ﾎﾞｯｸｽ　タイプ 3-1 left image 画像（中） 枠線なし
-------------------------------------------------------- */	

/*-------------------------------------------------------
 	21-5 help  ﾎﾞｯｸｽ　タイプ left image 
-------------------------------------------------------- */	
.info_help{
	margin:5px 10px 5px 0;
	border: 1px solid #bdd1e6;
	width:650px;
	background-color:#F5F5F2;
}
.info_help img{
	float:left;
	margin:10px;
	border:2px solid #FFFFFF;
	width:300px;
	overflow:hidden;
}
.info_help p{
	float:right;
	width:300px;
	padding:10px;
}

.info_help p.fullMsg{
	float:right;
	width:600px;
	padding:10px;
}



/*-------------------------------------------------------
 	22-1 ﾎﾞｯｸｽ　タイプ right image 画像（小）
-------------------------------------------------------- */	
.infoRi_650{
	float:left;
	width:650px;
	margin:5px 10px 5px 0;
	border: 1px solid #bdd1e6;
	background-color:#F5F5F2;
}
.infoRi_650 p{
	width: 450px;
	padding: 10px 10px 10px 30px;
}
.infoRi_650 img{
	float:right;
	margin:10px;
	border:2px solid #FFFFFF;
	width:150px;
	height:120px;
	overflow:hidden;
}


/*-------------------------------------------------------
 	22-2 ﾎﾞｯｸｽ　タイプ 3-2 right image 画像（中）
-------------------------------------------------------- */	
.infoRiM_650{
	float:left;
	margin:5px 10px 5px 0;
	border: 1px solid #bdd1e6;
	width:650px;
	background-color:#F5F5F2;
}
.infoRiM_650 p{
	width: 390px;
	padding: 10px 10px 10px 20px;
}
.infoRiM_650 img{
	float:right;
	margin:10px;
	border:2px solid #FFFFFF;
	width:200px;
	height:160px;
	overflow:hidden;
}

/*-------------------------------------------------------
 	22-3 ﾎﾞｯｸｽ　タイプ right image 画像（小）  枠線なし
-------------------------------------------------------- */	
.infoNwRi_650{
	float:left;
	margin:5px 10px 5px 0;
	width:650px;
}
.infoNwRi_650 p{
	width: 450px;
	padding: 10px 10px 10px 30px;
}
.infoNwRi_650 img{
	float:right;
	margin:10px;
	border:2px solid #FFFFFF;
	width:150px;
	height:120px;
	overflow:hidden;
}

/*-------------------------------------------------------
 	22-3 ﾎﾞｯｸｽ　タイプ 3-2 right image 画像（中） 枠線なし
-------------------------------------------------------- */	
.infoNwRiM_650{
	float:left;
	margin:5px 10px 5px 0;
	width:650px;
}
.infoNwRiM_650 p{
	width: 390px;
	padding: 10px 10px 10px 20px;
}
.infoNwRiM_650 img{
	float:right;
	margin:10px;
	border:2px solid #FFFFFF;
	width:200px;
	height:160px;
	overflow:hidden;
}





/*-------------------------------------------------------
 	41-1 textAreaのスタイル
-------------------------------------------------------- */
.list_411{
	width: 190px;
	height: 700px;							/* 表示範囲指定　*/
	overflow: auto;							/* スクロールバー付き　*/
}
*html .list_411{							/*for IE6 hack*/
	margin: 20px -20px 0 0;
	width: 180px;
}	
.list_411 dt{
	margin: 0 5px 15px 0;
	width: 170px;
	height: 30px;
	line-height: 2.2em;
	font-weight: bold;
	font-size: 14px;
	text-indent: 15px;
	color: #FFFFFF;
	background-color: #0096FF;					/*　青色*/
	box-shadow: 5px 5px 3px #888888;
}
.list_411 dd{
	height: 31px;
}

/*-------------------------------------------------------
 	21-1 textAreaのスタイル
-------------------------------------------------------- */
.input_411{
	width:650px;
	height:200px;
} 
.input_412{
	width: 20em;
	height:1em;
} 
.input_413{
	width:650px;
	height:50px;
} 

p.error{
	margin:0;
	color:red;
	font-weight:bold;
}

/*-------------------------------------------------------
 	22-1-1. 自動的にスライド処理
-------------------------------------------------------- */	
#slid_mode{
	display:block;/*(iBuilder)*/
}	
#slid_100Wrap{
	margin: 0 0 0 50px;
	width: 600px;
	height: 300px;
	padding: 5px;
	position: relative;
}

#slid_100Prev{
	position:absolute;
	top:65px;
	left:-30px;
	cursor:pointer;
}
#slid_100Next{
	position:absolute;
	top:65px;
	right:-30px;
	cursor:pointer;
}
#slid_100{
	width:100%;
	height:100%;
	overflow:hidden;
	}
#slid_100 li{
	float:left;
	margin-right:10px;
	padding:15px 0 15px 15px;
	list-style-type:none;
	display:inline;
}
#slid_100 li img{
	border:none;
}
/*-------------------------------------------------------
 	22-1-2. 自動的にスライド処理 
-------------------------------------------------------- */	
#slid_200Wrap{
	margin: 0 0 0 50px;
	width: 600px;
	height: 300px;
	padding: 5px;
	position: relative;
}

#slid_200Prev{
	position:absolute;
	top:65px;
	left:-30px;
	cursor:pointer;
}
#slid_200Next{
	position:absolute;
	top:65px;
	right:-30px;
	cursor:pointer;
}
#slid_200{
	width:100%;
	height:100%;
	overflow:hidden;
	}
#slid_200 li{
	float:left;
	margin-right:10px;
	padding:15px 0 15px 15px;
	list-style-type:none;
	display:inline;
}
#slid_200 li img{
	border:none;
}

/*-------------------------------------------------------
 	22-1-3. 自動的にスライド処理
-------------------------------------------------------- */	
#slid_300Wrap{
	margin: 0 0 0 50px;
	width: 600px;
	height: 320px;
	padding: 5px;
	position: relative;
}

#slid_300Prev{
	position:absolute;
	top:65px;
	left:-30px;
	cursor:pointer;
}
#slid_300Next{
	position:absolute;
	top:65px;
	right:-30px;
	cursor:pointer;
}
#slid_300{
	width:100%;
	height:100%;
	overflow:hidden;
	}
#slid_300 li{
	float:left;
	margin-right:10px;
	padding:15px 0 15px 15px;
	list-style-type:none;
	display:inline;
}
#slid_300 li img{
	border:none;
}


/*-------------------------------------------------------
 	10-1. 自動的にスライド処理
-------------------------------------------------------- */	
#slid_400Wrap{
	margin: 0 0 0 20px;
	width: 600px;
	height: 400px;
	padding: 5px;
	position: relative;
}
*html #slid_400Wrap{		/*for IE6 hack*/
	margin: 0 0 0 -10px;
}

#slid_400Prev{
	position:absolute;
	top:65px;
	left:-20px;
	cursor:pointer;
}
*html #slid_400Prev{		/*for IE6 hack*/
	left:-10px;
}

#slid_400Next{
	position:absolute;
	top:65px;
	right:-30px;
	cursor:pointer;
}
*html #slid_400Next{		/*for IE6 hack*/
	right:50px;
}

#slid_400{
	width: 600px;
	height: 400px;
	overflow:hidden;
	}
#slid_400 li{
	float:left;
	margin-right:10px;
	padding:15px 0 15px 15px;
	list-style-type:none;
	display:inline;
}
#slid_400 li img{
	border:none;
}
/*-------------------------------------------------------
 	help  モーダルウィンドウのヘルプ画面 
-------------------------------------------------------- */	
#help-glayLayer{
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background: #C0C0C0;
	filter: alpha(opacity=75);
	opacity: 0.75;
}
*html div#help-glayLayer{		/*for IE6 hack*/
	position:absolute;
	height:800px;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../helps/ani_black.png',sizingMethod='scale');
	filter:alpha(opacity=60);
	opacity: 0.60;
}
#help-overLayer{
	display:none;
	width:670px;
	background:white;
	padding:10px;
	position: fixed;
	top:50%;
	left:50%;
}
#help-overLayer img.close{
	position:absolute;
	top:-23px;
	right:0px;
	cursor:pointer;
}
*html #help-overLayer{			/*for IE6 hack*/
	position: absolute;
}






