@charset "utf-8";

/* ---------------------------------------------
 * http://www.myjcom.jp/region.html
 * http://www.myjcom.jp/simple-login.html
--------------------------------------------- */

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

	Common

================================ */
body {
	background: url(/library/files/user/cluboff/com_bg01.gif) repeat-x 0 0;
}
#page {
	background: none;
}

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

	Header

================================ */
#loginHeader {
	padding: 17px 0 14px;
}
#loginHeader .logo img {
	vertical-align: bottom;
}

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

	Footer

================================ */
#footerBottom {
	margin-top: 0;
}

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

	Settings

================================ */
#loginBox {
	margin-bottom: 30px;
	padding-bottom: 20px;
	background: url(/library/files/login/login_bg02.gif) no-repeat 0 100%;
}
#loginBox .inner {
	padding: 10px 10px 0;
	background: url(/library/files/login/login_bg01.gif) no-repeat 0 0;
}
#loginBox img {
	vertical-align: bottom;
}

/* #mapBox
-------------------------------- */
#mapBox {
	position: relative;
	width: 620px;
	height: 268px;
	background: url(/library/files/login/login_il01.gif) no-repeat 0 0;
}
#mapBox .leadTxt {
	position: absolute;
	top: 20px;
	left: 24px;
	margin: 0;
	font-size: 12px;
}
/* .areaBtn */
#mapBox .areaBtn {
	position: absolute;
	margin: 0;
}
#mapBox .areaList01 {
	position: absolute;
	width: 162px;
	border-right: 1px solid #97c2d4;
	border-bottom: 1px solid #97c2d4;
}
#mapBox .areaList01 li {
	float: left;
	border-top: 1px solid #97c2d4;
	border-left: 1px solid #97c2d4;
}
#mapBox .areaList02 {
	position: absolute;
	width: 81px;
	border-right: 1px solid #97c2d4;
	border-bottom: 1px solid #97c2d4;
}
#mapBox .areaList02 li {
	border-top: 1px solid #97c2d4;
	border-left: 1px solid #97c2d4;
}
#hokkaido {top: 46px;left: 422px;}
#miyagi {top: 102px;left: 373px;}
#kanto {top: 158px;left: 403px;}
#kansai {top: 75px;left: 61px;}
#kyushu {top: 159px;left: 61px;}

/* #selectBox
-------------------------------- */
#selectBox {
	position: relative;
	width: 559px;
	height: 208px;
	padding: 30px 31px 30px 30px;
	background: url(/library/files/login/login_bg03.gif) no-repeat 0 0;
}
#selectBox .colLeft {
	float: left;
	width: 318px;
}
#selectBox .areaTxt {
	margin: 0;
	line-height: 1.2;
	font-size: 16px;
	font-weight: bold;
}
#selectBox .areaTxt .area {
	font-size: 20px;
	color: #38911f;
}
#selectBox .selectBtn {
	position: absolute;
	top: 30px;
	left: 200px;
	margin: 0;
}
#selectBox .colLeft .heading {
	margin-top: 10px;
	font-size: 16px;
	font-weight: bold;
}
#selectBox .selectLayout {
	position: relative;
	z-index: 10;
}
#selectBox .selectCopyBox {
	position: relative;
	width: 318px;
	margin-top: 5px;
}
#selectBox .selectCopyBox .selectStage {
	display: block;
	height: 38px;
	line-height: 38px;
	padding: 0 40px 0 10px;
	border: 1px solid #999999;
	background: url(/library/files/login/login_bg04.gif) no-repeat 0 0;
	cursor: pointer;
}
#selectBox .selectCopyBox ul {
	position: absolute;
	display: none;
	width: 316px;
	margin-top: 0;
	padding: 0;
	background: #ffffff;
	border: solid 1px #999999;
	border-top: none;
	z-index: 100;
}
#selectBox .areaListcopy ul {
	height: 100px;
}
#selectBox .cityListcopy ul {
	height: 140px;
	overflow-y: scroll;
}
*html #loginSelectArea {
	position: relative;
	z-index: 1500 !important;
}
*html #addSelectBox {
	position: relative;
	z-index: 1000 !important;
}
*html #footerBottom {
	position: relative;
	z-index: 500 !important;
}
*html #selectBox .cityListcopy ul {
	height: auto;
	overflow: visible;
}
#selectBox .selectCopyBox ul li a {
	display: block;
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
	color: #333333;
}
#selectBox .selectCopyBox ul li a:hover {
	background-color: #3399ff;
	text-decoration: none;
	color: #ffffff;
}
#selectBox .colRight {
	float: right;
	width: 200px;
	padding: 10px 14px 10px 16px;
	text-align: center;
}
#selectBox .colRight .heading {
	margin-bottom: 10px;
	font-weight: bold;
}
#selectBox .areaSelectBox {
	display: table-cell;
	width: 180px;
	height: 100px;
	padding: 0 10px;
	background: url(/library/files/login/login_bg06.gif) no-repeat 0 0;
	vertical-align: middle;
}
* html #selectBox .areaSelectBox { /* IE 6 */
	position: relative;
	display: inline;
	zoom: 1;
}
* html #selectBox .areaSelectBox p { /* IE 6 */
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	margin-top: -16px;
}
*:first-child+html #selectBox .areaSelectBox { /* IE 7 */
	position: relative;
	display: inline;
	zoom: 1;
}
*:first-child+html #selectBox .areaSelectBox p { /* IE 7 */
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	margin-top: -16px;
}
/*\*//*/
* html #selectBox .areaSelectBox {
	display: inline-block;
}
/**/
#selectBox .areaSelectBox p {
	margin: 0;
	font-size: 16px;
	font-weight: bold;
}
#selectBox .txtOffice {
	color: #ff6600;
}
#selectBox .saveBtn {
	margin: 8px 0 0 0;
}

/* dsableBox */
#selectBox .dsableBox .selectStage {
	background: url(/library/files/login/login_bg09.gif) no-repeat 0 0;
	cursor: default;
	color: #999999;
}
#selectBox .dsableBox .selectCopyList {
	display: none !important;
}

/* #serviceSelectBox
-------------------------------- */
#serviceSelectBox {
	clear: both;
	margin-top: 10px;
}
#serviceSelectBox .serviceList {
	padding: 20px 0 20px 30px;
	background-color: #f3f3f3;
}
#serviceSelectBox .serviceList li {
	float: left;
	margin-right: 50px;
}
#serviceSelectBox .serviceList li.last {
	margin-right: 0;
}
#serviceSelectBox .serviceList li input {
	margin-right: 10px;
	vertical-align: middle;
}
#serviceSelectBox .serviceList li img {
	vertical-align: middle;
}
#serviceSelectBox .saveBtn {
	margin: 14px 0 0 0;
	text-align: center;
}




/* #asideBox
-------------------------------- */
#asideBox {
	background: url(/library/files/login/aside_bg01.gif) no-repeat 0 100%;
	font-size: 12px;
}
#asideBox .leadTxt {
	margin-bottom: 0;
}
#asideBox .inner {
	padding: 10px 15px 18px;
}
#asideBox .loginFrame01 {
	margin-top: 10px;
	padding: 7px 14px 5px;
	border: 1px solid #e8e1ca;
	background-color: #ffffff;
}
#asideBox .loginFrame01 .link {
	margin: 0;
	padding-left: 16px;
	background: url(/library/files/login/login_ic02.gif) no-repeat 0 0.3em;
}

#asideBox .loginFrame02 {
	padding: 7px 14px 3px;
	border: 1px solid #e8e1ca;
	border-top: none;
	background-color: #ffffff;
}

/* clearfix
================================ */
#mapBox .areaList01:after,
#selectBox:after,
#serviceSelectBox .serviceList ul:after {
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	content: ".";
	font-size: 0;
	line-height: 0;
}

#mapBox .areaList01,
#selectBox,
#serviceSelectBox .serviceList ul {
	display:block;	/* for safari firefox3 対象ブラウザにsafari が含まれていれば */
	zoom:1;
}

/* for IE7 */
*:first-child+html #mapBox .areaList01,
*:first-child+html #selectBox,
*:first-child+html #serviceSelectBox .serviceList ul {
	display:inline-table;
}


/* #addSelectBox
-------------------------------- */
#addSelectBox {
	padding-top: 20px;
}
#addSelectBox p {
	margin: 0;
}
#addSelectBox .leadTxt {
	margin: 5px 0 0 20px;
}
#addSelectBox .selectFrame {
	clear: both;
	margin-top: 10px;
	padding-bottom: 10px;
	background: url(/library/files/login/login_bg08.gif) no-repeat 0 100%;
}
#addSelectBox .selectFrame .inner {
	padding: 15px 10px 0 20px;
	background: url(/library/files/login/login_bg07.gif) no-repeat 0 0;
}
#addSelectBox .selectFrame .txtCol {
	float: left;
	width: 260px;
}
#addSelectBox .selectFrame .txtCol p {
	font-size: 14px;
}
/* tooltip */
#addSelectBox .selectFrame .tooltipBox {
	position: relative;
}
#addSelectBox .selectFrame .tooltipBox dt {
	font-size: 10px;
	padding-left: 7px;
	background: url(/library/files/login/login_ic01.gif) no-repeat 0 50%;
}
#addSelectBox .selectFrame .tooltipBox dd {
	display: none;
}
#addSelectBox .selectFrame .btnListCol {
	float: right;
	width: 320px;
}
#addSelectBox .selectFrame .btnListCol li {
	float: left;
	margin-right: 10px;
}

#addSelectBox .selectFrame .btnListCol01 li {
	text-align: right;
	margin-right: 10px;
}


#addSelectBox #tooltipBody {
	display: none;
	position: absolute;
	top: 35px;
	left: 35px;
	margin-left: -20px;
	cursor: pointer;
}
#addSelectBox #tooltipBody .inner {
	padding: 0 !important;
	background: none !important;
}
#addSelectBox #tooltipBody .inner p {
	font-size: 12px !important;
}
#addSelectBox #tooltipBody .inner span.tipClose {
	display: block;
	margin-top: 5px;
}

/* clearfix
================================ */
#addSelectBox .selectFrame .inner:after,
#addSelectBox .selectFrame .btnListCol:after {
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	content: ".";
	font-size: 0;
	line-height: 0;
}

#addSelectBox .selectFrame .inner,
#addSelectBox .selectFrame .btnListCol {
	display:block;	/* for safari firefox3 対象ブラウザにsafari が含まれていれば */
	zoom:1;
}

/* for IE7 */
*:first-child+html #addSelectBox .selectFrame .inner,
*:first-child+html #addSelectBox .selectFrame .btnListCol {
	display:inline-table;
}