/* TOP画面、TOP画面コンポーネント */
/*
	CSSプロパティ分類
	1：表示・配置
	2：サイズ・余白
	3：フォント・テキスト
	4：背景・ボーダー
*/
/*文字色青*/
.txtblue {
	color: #0000FF;
}

/*文字色黒*/
.txtblack {
	color: #000000;
}

/*メッセージ表示色赤*/
.msg_red {
	color: #FF0000;
}
/*メッセージ表示色黒*/
.msg_black {
	color: #000000;
}

/* TOP画面 >> */
.top-one  {
	/* 2 */
	width: 100%;
}
.top-main {
	/* 1 */
	float: left;
	/* 2 */
	width: 70%;
}

.top-sub {
	/* 1 */
	float: left;
	/* 2 */
	width: 30%;
}
/* TOP画面 << */
/*文字色赤*/
.txtred {
	color: #FF0000;
}

/* トップ画面コンポーネント共通 >> */
.comp-box {
	/* 1 */
	float: left;
	/* 2 */
	margin: 0 1% 20px 1%;
	width: 98%;
}

.comp-box:after {
	content: "";
	/* 1 */
	clear: both;
	display: block;
	/* 2 */
	height: 0;
	visibility: hidden;
}

.comp-banner-area {
	/* 2 */
	margin: 0 1% 1% 1%;
}

.comp-contents {
	/* 2 */
	padding: 10px;
	/* 4 */
	background: #f1f1f1;
	border: #cbcbcb solid 1px;
}

.comp-note {
	/* 1 */
	display: block;
	/* 2 */
	padding: 0;
	/* 3 */
	font-size: 1.0em;
	/* 4 */
	border: none;
}

.comp-inner-box {
	/* 1 */
	display: block;
	/* 2 */
	padding: 5px;
	/* 4 */
	background: #fff;
	border: #cbcbcb solid 1px;
}

.comp-tbl {
	/* 2 */
	width: 100%;
	/* 4 */
	border: #b9b9b9 solid 1px;
	border-collapse: collapse;
}

.comp-tbl-head {
	/* 2 */
	padding: 3px 6px;
	/* 3 */
	color: #333;
	/* 4 */
	background: #b9ddd7;
	border: #b9b9b9 solid 1px;
}

.comp-tbl-head-y {
	/* 2 */
	width: 50%;
}

.comp-tbl-data {
	/* 2 */
	padding: 3px 6px;
	/* 3 */
	text-align: right;
	/* 4 */
	background: #fff;
	border: #b9b9b9 solid 1px;
}

.comp-tbl-data-y {
	/* 2 */
	width: 50%;
}

.comp-page {
	/* 2 */
	margin: -11px 0 10px;
	/* 3 */
	text-align: right;
}

.comp-page-select {
	/* 1 */
	display: inline-block;
}

.comp-error {
	/* 3 */
	color: #f00;
	/* 4 */
	background: #fff;
}

.comp-banner {
	/* 4 */
	border: none;
}
/* トップ画面コンポーネント共通 << */
/* ロック状況 >> */
.rock-jokyo {
	/* 2 */
	margin: 5px;
	/* 3 */
	color: #03c;
	font-weight: bold;
	/* 4 */
	background-color: #fff;
}
/* ロック状況 << */
/* マルチ顧客注意喚起 >> */
.multi-kokyaku {
	/* 2 */
	margin: 5px;
	/* 3 */
	color: #f00;
	font-weight: bold;
	/* 4 */
	background-color: #fff;
}
/* マルチ顧客注意喚起 << */
/* 文字サイズ変更 >> */
.fs-title {
	/* 1 */
	float: left;
	/* 3 */
	color: #04064d;
	font-weight: bold;
}

.fs-controls {	
	/* 1 */
	float: right; 
}

.ie7 .fs-controls {
	/* 1 */
	float: left;
}

.fs-item {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	list-style-type: none;
	*zoom: 1; /* IE7 */
	/* 2 */
	margin-left: 5px;	
}

.fs-btn {
	/* 1 */
	display: block;
	/* 2 */
	height: 20px;
	width: 20px;
	/* 3 */
	color: #fff;
	font-size: 16px;
	line-height: 20px;
	text-align: center;
	text-decoration: none;
	/* 4 */
	background: #6a87d9;
	border: #23509f solid 3px;
	border-radius: 6px;
	outline: 0 none;
}
/* 文字サイズ変更 << */
/* ロゴ >> */
.logo {
	/* 1 */
	float: left;
}

.logo-img {
	/* 2 */
	height: auto;
}
/* ロゴ << */
/* 顧客名 >> */
.user {
	/* 2 */
	margin: 0;
	padding: 0.5em 0;
	/* 3 */
	color: #333;
	font-size: 1.0em;
	font-weight: bold;
}
/* 顧客名 << */
/* ログアウト >> */
.header-inner .logout {
	/* 1 */
	display: inline-block;
	margin: 0 0 0 10px;
}

.logout-link {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	*zoom: 1; /* IE7 */
	/* 2 */
	padding: 6px 20px;
	/* 3 */
	color: #fff;
	font-size: 0.85em;
	font-weight: bold;
	/* 4 */
	background: #787878; /* Old browsers */
	background: -moz-linear-gradient(top,	#787878 0%, #3a3a3a 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#787878), color-stop(100%,#3a3a3a)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,	#787878 0%,#3a3a3a 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,	#787878 0%,#3a3a3a 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,	#787878 0%,#3a3a3a 100%); /* IE10+ */
	background: linear-gradient(to bottom,	#787878 0%,#3a3a3a 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#787878', endColorstr='#3a3a3a',GradientType=0 ); /* IE6-9 */
	border: #434343 solid 1px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}
/* ログアウト << */
/* 豊証券独自 J-GXバナーコンポーネント>> */
.jgx-main {
	/* 1 */
	float: left;
}
.jgx-btns {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	float: left;
	*zoom: 1; /* IE7 */
	/* 3 */
	vertical-align: middle;
}
.jgx-btn-item {
	/* 1 */
	float: left;
	/* 2 */
	margin: 0 0 0 5px;
}
.jgx-btn-pc {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	*zoom: 1; /* IE7 */
	/* 2 */
	height: auto;
	padding: 5px 14px;
	width: 120px;
	/* 3 */
	text-align: center;
	color:#fff;
	font-weight: bold;
	/* 4 */
	border: #fff solid 1px;
	border-radius: 5px;
	background: #73cfda; /* Old browsers */
	background: -moz-linear-gradient(top,  #73cfda 0%, #39b1bf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#73cfda), color-stop(100%,#39b1bf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #73cfda 0%,#39b1bf 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#73cfda', endColorstr='#39b1bf',GradientType=0 ); /* IE6-9 */
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.jgx-btn-tb {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	*zoom: 1; /* IE7 */
	/* 2 */
	height: auto;
	padding: 5px 14px;
	width: 80px;
	/* 3 */
	text-align: center;
	color:#fff;
	font-weight: bold;
	/* 4 */
	border: #fff solid 1px;
	border-radius: 5px;
	background: #73cfda; /* Old browsers */
	background: -moz-linear-gradient(top,  #73cfda 0%, #39b1bf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#73cfda), color-stop(100%,#39b1bf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #73cfda 0%,#39b1bf 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #73cfda 0%,#39b1bf 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#73cfda', endColorstr='#39b1bf',GradientType=0 ); /* IE6-9 */
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

/* 豊証券独自 J-GXバナーコンポーネント << */
/* 株式注文ショートカットコンポーネント >> */
.soc {
	/* 2 */
	height: 36px;
	padding: 6px 10px;
	/* 4 */
	background: #dce8eb;
}

.soc-header {
	/* 1 */
	display: none;
}

.soc-main {
	/* 1 */
	float: right;
}

.soc-lbl-meigara {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	float: left;
	*zoom: 1; /* IE7 */
	/* 2 */
	margin: 7px 8px 0 0;
	/* 3 */
	font-weight: bold;
}

.soc-txt-meigara {
	/* 1 */
	float: left;
	/* 2 */
	height: 28px;
	margin: 2px 0 0 0;
	width: 176px;
	/* 3 */
	font-size: 100%;
}

.ie7 .soc-txt-meigara {
	/* 3 */
	font-size: 100%;
}

.soc-btns {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	float: left;
	*zoom: 1; /* IE7 */
	/* 3 */
	vertical-align: middle;
}

.soc-btn-item {
	/* 1 */
	float: left;
	/* 2 */
	margin: 0 0 0 5px;
}

.soc-btn {
	/* 1 */
	display: inline-block;
	*display: inline; /* IE7 */
	*zoom: 1; /* IE7 */
	/* 2 */
	height: auto;
	padding: 5px 14px;
	width: auto;
	/* 3 */
	color:#fff;
	font-weight: bold;
	/* 4 */
	border: #fff solid 1px;
	border-radius: 5px;
}

.soc-btn-stock {
	/* 4 */
	background: #4fb44d; /* Old browsers */
	background: -moz-linear-gradient(top, #4fb44d 0%, #2e951d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4fb44d), color-stop(100%,#2e951d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #4fb44d 0%,#2e951d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #4fb44d 0%,#2e951d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #4fb44d 0%,#2e951d 100%); /* IE10+ */
	background: linear-gradient(to bottom, #4fb44d 0%,#2e951d 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fb44d', endColorstr='#2e951d',GradientType=0 ); /* IE6-9 */
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.soc-btn-margin {
	/* 4 */
	background: #a3d02b; /* Old browsers */
	background: -moz-linear-gradient(top, #a3d02b 0%, #7bba01 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a3d02b), color-stop(100%,#7bba01)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #a3d02b 0%,#7bba01 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #a3d02b 0%,#7bba01 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #a3d02b 0%,#7bba01 100%); /* IE10+ */
	background: linear-gradient(to bottom, #a3d02b 0%,#7bba01 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3d02b', endColorstr='#7bba01',GradientType=0 ); /* IE6-9 */
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
/* 株式注文ショートカットコンポーネント << */
/* 連絡先 >> */
.contact {
	/* 1 */
	display: block;
	float: left;
	left: 50%;
	position: relative;
	/* 2 */
	margin: 0;
	padding: 0;
}

.contact-item {
	/* 1 */
	display: block;
	left: -50%;
	position: relative;
	/* 3 */
	text-align: left;
}

.contact-title {
	/* 1 */
	display: inline-block;
	/* 3 */
	vertical-align: top;
}

.contact-content {
	/* 1 */
	display: inline-block;
	/* 2 */
	margin: 0 0 0 5px;
	/* 3 */
	vertical-align: top;
}

.ie7 .contact-title,
.ie7 .contact-content {
	/* 1 */
	display: inline;
}

.contact-tel {
	/* 2 */
	margin: 0 5px 0 0;
	/* 3 */
	color: #06f;
	font-size: 1.0em;
	font-weight: bold;
}
/* 連絡先 << */
/* メッセージ詳細 >> */
.comp-msg-detail {
	/* 2 */
	margin: 0 auto;
	width: 98%;
}
/* メッセージ詳細 << */
/* メッセージリスト >> */
.comp-msg-list-item {
	/* 2 */
	margin: 0 0 10px;
}

.comp-msg-list-item:last-child {
	/* 2 */
	margin: 0;
}

.comp-emphasis-prefix {
	/* 3 */
	color: #f00;
}
/* メッセージリスト << */
/* 余力情報 >> */
.top-one .comp-yoryoku {
	/* 2 */
	width: 100%;
}
.top-main .comp-yoryoku {
	/* 2 */
	width: 48%;
}
.top-sub .comp-yoryoku {
	/* 2 */
	width: 98%;
}
/* 余力情報 << */
/* JGX >> */
.jgx {
	/* 1 */
	cursor: pointer;
}

.jgx-pc {
	/* 1 */
	display: block;
}

.jgx-tb,
.jgx-sp {
	display: none;
}
/* JGX << */

/* max-width: 880px */
@media screen and (max-width: 880px) {
/* JGX >> */
	.jgx-tb {
		/* 1 */
		display: block;
	}

	.jgx-pc,
	.jgx-sp {
		display: none;
	}
/* JGX << */
}

/* max-width: 768px */
@media screen and (max-width: 768px) {
	/* TOP画面 >> */
	.top-main,
	.top-sub {
		/* 1 */
		float: none;
		/* 2 */
		padding: 0 2%;
		width: auto;
	}
	/* TOP画面 << */
}

/* max-width: 650px */
@media screen and (max-width: 650px){
	/* TOP画面 >> */
	.top-main,
	.top-sub {
		/* 1 */
		float: none;
		/* 2 */
		padding: 0 2%;
		width: auto;
	}
	/* TOP画面 << */
	/* トップ画面コンポーネント共通 >> */
	.comp-box{
		/* 2 */
		margin: 0 0 2%;
		width: 100%;
	}
	/* トップ画面コンポーネント共通 << */
	/* ロゴ >> */
	.logo {
		/* 1 */
		clear: left;
		/* 2 */
		width: 48%;
	}

	.logo-img {
		/* 2 */
		max-height: 53px;
		max-width: 141px;
		min-width: 120px
		width: 100%;
	}
	/* ロゴ << */
	/* 顧客名 >> */
	.user {
		/* 2 */
		padding: 0;
		/* 3 */
		vertical-align: middle;
	}

	/* ドロワーメニュー時 */
	.sp-drawer-menu .user {
		/* 1 */
		display: table-cell;
		/* 2 */
		padding: 0 10px;
		/* 3 */
		font-size: 1.0em;
		vertical-align: middle;
	}
	/* 顧客名 << */
	/* ログアウト >> */
	.header-inner .logout {
		/* 1 */
		display: none;
	}

	/* ドロワーメニュー時 */
	.sp-drawer-menu .logout {
		/* 1 */
		display: table-cell;
		float: right;
		/* 2 */
		padding: 0 10px;
		/* 3 */
		text-align: center;
		vertical-align: middle;
	}

	.sp-drawer-menu .logout-link {
		/* 2 */
		padding: 0 20px;
		/* 3 */
		font-size: 0.8em;
		/* 4 */
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
	}
	/* ログアウト << */
	/* 株式注文ショートカットコンポーネント >> */
	.soc:before {
		content:"";
		/* 1 */
		display:block;
		left:60%;
		position:absolute;
		right:auto;
		top:-20px;
		/* 2 */
		height: 0;
		width: 0;
		/* 4 */
		border-style: solid;
		border-width: 0 11px 20px 11px;
		border-color: transparent transparent #ffffff transparent;
	}

	.sp-drawer-menu .soc:before {
		/* 1 */
		display: none;
	}

	.soc {
		/* 1 */
		display: none;
		left: 0;
		position: absolute;
		top: 0;
		z-index: 100;
		/* 2 */
		height: auto;
		margin: 0;
		padding: 0;
		width: 100%;
		/* 3 */
		line-height: 1.7;
		/* 4 */
		background: #fff;
	}

	.soc-header {
		/* 1 */
		display: block;
	}

	.soc-title {
		/* 2 */
		margin: 12px 15px;
		/* 3 */
		color: #333;
		font-size: 15px;
		font-weight: bold;
		/* 4 */
		background: none;
		box-shadow: none;
	}

	.soc-close {
		/* 1 */
		position: absolute;
		right: 15px;
		top: 12px;
		z-index: 92;
		/* 2 */
		padding: 4px;
		/* 3 */
		color: #333;
		/* 4 */
		background: #2c3d69;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
	}

	.soc-close-btn {
		/* 1 */
		display: block;
		/* 2 */
		height: 11px;
		width: 11px;
		/* 3 */
		text-indent: -9999px;
		/* 4 */
		background: url(../img/icn_close.png) left top no-repeat;
		background-size: 11px 11px;
	}

	.soc-main {
		/* 1 */
		float: none;
		/* 2 */
		margin: 0 0 15px;
		overflow: hidden;
		padding: 5px 15px 20px;
		width: auto;
		/* 4 */
		background: #fff;
		border-bottom: medium none;
		border-left: medium none;
		border-top: 2px solid #5c9ada;
	}

	.soc-lbl-meigara {
		/* 1 */
		display: block;
		float: none;
		/* 2 */
		margin: 10px 0 3px;
		/* 3 */
		font-weight: bold;
	}

	.soc-txt-meigara {
		/* 1 */
		display: block;
		float: none;
		/* 2 */
		width: 100%;
	}

	.soc-btns {
		/* 1 */
		display: block;
	}

	.soc-btn-item {
		/* 2 */
		margin: 0 5px 0 0;
	}

	.soc-btns {
		/* 2 */
		margin: 10px 0 3px;
	}

	.soc-btn {
		/* 2 */
		margin: 0 10px 0 0;
		padding: 8px 18px;
	}
	/* 株式注文ショートカットコンポーネント << */
	/* 連絡先 >> */
	.contact-title {
	/* 1 */
	display: block;
	}

	.contact-content {
		/* 1 */
		display: block;
		/* 2 */
		margin: 0 0 0 10px;
	}
	/* 連絡先 << */
	/* 余力情報 << */
	.top-main .comp-yoryoku, 
	.top-sub .comp-yoryoku {
		/* 2 */
		width: 100%;
	}
	/* 余力情報 << */
	/* JGX >> */
	.jgx-sp {
		/* 1 */
		display: block;
	}

	.jgx-pc,
	.jgx-tb {
		display: none;
	}
	/* JGX << */
}