@charset "utf-8";
@import url(echo_individual.css);
@import url(echo_input.css);

@import url(tcui_front_base.css);

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

	echo base style
	designed by Kei Sasaki in the planet of Hoth...

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

/* ---------- Universal ---------- */

* { margin: 0; padding: 0 }

body {
	margin: 0;
	border: none;
	padding: 0;
	background: #ccd0d9;
 	color: #000000;
	font-family: "Helvetica Neue", "Helvetica", "Meiryo", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴPro W3", "HiraKakuPro-W3", "MＳ Pゴシック", sans-serif;
	font-size: 14px; line-height: 150%;
	}
#canvas { background: url(/images/echo_back.png) repeat-x left top }

.container { width: 960px; margin: 0 auto }
.nesting-container { width: 906px; margin: 0 auto }
.center { text-align: center }
.clearer, .divider {
	clear: both;
	overflow: hidden;
	font-size: 1px;
	line-height: 500px;
	}
.clearer { height: 1px }
.divider { height: 4px; padding: 12px 0; background: url(/images/echo_divider.png) no-repeat center 12px }
a img { border: none !important }

/* ---------- Top Margin ---------- */

#top_margin {
	height: 27px;
	border-bottom: 1px solid #dddfe6;
	background: #e9ebf2;
	font-size: 12px; line-height: 16px;
	}
#updates p { padding: 5px 0 0 0 }
#updates span.label {
	display: block;
	float: left;
	overflow: hidden;
	width: 60px; height: 18px;
	background: url(/images/echo_newslabel.png) no-repeat left top;
	font-size: 1px; line-height: 500px;
	}
#updates span.date { display: inline-block; margin: 1px 6px 0 0; color: #4c5e80 }

#updates a:link,
#updates a:visited { border-bottom: 1px solid #c0c6d1; color: #0058cc; text-decoration: none }
#updates a:active,
#updates a:hover { border-bottom: 1px solid #000000; color: #000000 }

/* ---------- Header ---------- */

#header {
	height: 90px;
	}
#header p#title_logo {
	float: left;
	margin-top: 25px;
	}
#header p#title_logo a {
	display: block;
	width: 165px;
	height: 52px;
	}

/* ---------- Top Navigation ---------- */

#top_navigation { float: right }
#top_navigation ul {
	clear: right;
	float: right;
	padding-top: 9px;
	}
#content_nav {
	width: 708px;
	}
#top_navigation li {
	float: left;
	list-style: none;
	height: 32px;
	}
#top_navigation li,
#top_navigation a {
	display: block;
	overflow: hidden;
	font-size: 1px;
	line-height: 500px;
	}
#top_navigation li a { height: 32px }

#top_navigation #ref_home { width: 84px; background: url(/images/echo_publicnav.png) no-repeat 0 0 }
#top_navigation #ref_home a { width: 84px }
#top_navigation #ref_home a:active,
#top_navigation #ref_home a:hover { background: url(/images/echo_publicnav.png) no-repeat 0 -34px }
body.home #top_navigation #ref_home a { background: url(/images/echo_publicnav.png) no-repeat 0 -34px }
/*body.home #top_navigation #ref_home,
body.home #top_navigation #ref_home a { width: 1px; height: 1px; background: transparent }*/

#top_navigation #ref_overview { width: 110px; background: url(/images/echo_publicnav.png) no-repeat -84px 0 }
#top_navigation #ref_overview a { width: 110px }
#top_navigation #ref_overview a:active,
#top_navigation #ref_overview a:hover { background: url(/images/echo_publicnav.png) no-repeat -84px -34px }
body.overview #top_navigation #ref_overview a { background: url(/images/echo_publicnav.png) no-repeat -84px -34px }

#top_navigation #ref_features { width: 150px; background: url(/images/echo_publicnav.png) no-repeat -194px 0 }
#top_navigation #ref_features a { width: 150px }
#top_navigation #ref_features a:active,
#top_navigation #ref_features a:hover { background: url(/images/echo_publicnav.png) no-repeat -194px -34px }
body.features #top_navigation #ref_features a { background: url(/images/echo_publicnav.png) no-repeat -194px -34px }

#top_navigation #ref_startupguide { width: 164px; background: url(/images/echo_publicnav.png) no-repeat -344px 0 }
#top_navigation #ref_startupguide a { width: 164px }
#top_navigation #ref_startupguide a:active,
#top_navigation #ref_startupguide a:hover { background: url(/images/echo_publicnav.png) no-repeat -344px -34px }
body.startupguide #top_navigation #ref_startupguide a { background: url(/images/echo_publicnav.png) no-repeat -344px -34px }

#top_navigation #ref_seminar { width: 164px; background: url(/images/echo_publicnav.png) no-repeat -344px 0 }
#top_navigation #ref_seminar a { width: 164px }
#top_navigation #ref_seminar a:active,
#top_navigation #ref_seminar a:hover { background: url(/images/echo_publicnav.png) no-repeat -344px -34px }
body.seminar #top_navigation #ref_seminar a { background: url(/images/echo_publicnav.png) no-repeat -344px -34px }


#top_navigation #ref_download { width: 116px; background: url(/images/echo_publicnav.png) no-repeat -508px 0 }
#top_navigation #ref_download a { width: 116px }
#top_navigation #ref_download a:active,
#top_navigation #ref_download a:hover { background: url(/images/echo_publicnav.png) no-repeat -508px -34px }
body.download #top_navigation li#ref_download a { background: url(/images/echo_publicnav.png) no-repeat -508px -34px }

#top_navigation #ref_support { width: 84px; background: url(/images/echo_publicnav.png) no-repeat -624px 0 }
#top_navigation #ref_support a { width: 84px }
#top_navigation #ref_support a:active,
#top_navigation #ref_support a:hover { background: url(/images/echo_publicnav.png) no-repeat -624px -34px }
body.support #top_navigation #ref_support a { background: url(/images/echo_publicnav.png) no-repeat -624px -34px }

#top_navigation #ref_signup { width: 132px; background: url(/images/echo_publicnav.png) no-repeat -720px 0 }
#top_navigation #ref_signup a { width: 132px }
#top_navigation #ref_signup a:active,
#top_navigation #ref_signup a:hover { background: url(/images/echo_publicnav.png) no-repeat -720px -34px }
body.signup #top_navigation #ref_signup a { background: url(/images/echo_publicnav.png) no-repeat -720px -34px }

#top_navigation #ref_signin { width: 109px; background: url(/images/echo_publicnav.png) no-repeat -854px 0 }
#top_navigation #ref_signin a { width: 109px }
#top_navigation #ref_signin a:active,
#top_navigation #ref_signin a:hover { background: url(/images/echo_publicnav.png) no-repeat -854px -34px }
body.signin #top_navigation #ref_signin a { background: url(/images/echo_publicnav.png) no-repeat -854px -34px }

/* ---------- Main Content ---------- */

#main_content { background: url(/images/echo_container_body.png) repeat-y center top }
#main_content .container_holder_begin { background: url(/images/echo_container_top.png) no-repeat center top }
#main_content .container_holder_end { background: url(/images/echo_container_bottom.png) no-repeat center bottom; padding: 2px 2px 4px 2px }

#main_content a:link,
#main_content a:visited { border-bottom: 1px solid #c0c6d1; color: #0058cc; text-decoration: none }
#main_content a:active,
#main_content a:hover { border-bottom: 1px solid #000000; color: #000000 }

#main_content .content_title { padding: 12px 28px 12px 28px }
#main_content .box { padding: 0 28px 24px 28px }

#main_content .parent_navigation { list-style: none }
#main_content .parent_navigation li { float: right; margin-left: 0 }
#main_content .parent_navigation li a { margin-left: 20px }
#main_content h2 { padding-top: 12px; font-size: 20px; line-height: 24px }
#main_content h3 { padding-top: 12px; font-size: 16px; line-height: 20px }
#main_content h4 { padding-top: 10px; font-size: 14px; line-height: 19px }
#main_content h5 { color: #505050; padding-top: 10px; font-size: 13px; line-height: 19px }
#main_content p { color: #505050; padding-top: 10px; font-size: 13px; line-height: 19px }
#main_content ul,
#main_content ol,
#main_content dl { color: #505050; padding-top: 8px; font-size: 13px; line-height: 19px }
#main_content li { margin-left: 24px; padding-top: 4px }
#main_content ul ul { padding-top: 4px; padding-bottom: 8px }
#main_content ol { list-style-type: decimal }
#main_content ol ol { padding-bottom: 6px; list-style-type: lower-alpha }

#main_content .option { font-size: 12px; line-height: 16px; }
#main_content .subtitle { color: #000000; font-size: 14px; line-height: 20px; }
#main_content .caption { color: #707070; font-size: 11px; line-height: 15px; }

#main_content .columns { margin-top: 12px }
.double .column { float: left; width: 435px; padding-left: 30px }
.triple .column { float: left; width: 290px; padding-left: 15px }
.quartet .column { float: left; width: 210px; padding-left: 20px }
#main_content .first { padding-left: 0 }

/* ---------- Skip Navigation ---------- */

#main_content .skip_navigation {
	float: right;
	width: 36px;
	padding-top: 16px !important;
	}
#main_content .skip_navigation li {
	float: right;
	list-style: none !important;
	width: 18px;
	margin: 0 !important;
	padding: 0 !important
	}
#main_content .skip_navigation li a {
	display: block;
	overflow: hidden;
	height: 14px;
	border: none;
	font-size: 1px;
	line-height: 50px;
	}
.skip_navigation li.skip_to_prev a:link,
.skip_navigation li.skip_to_prev a:visited { border: none; background: url(/images/echo_next_and_previous.png) no-repeat left -0px }
.skip_navigation li.skip_to_prev a:active,
.skip_navigation li.skip_to_prev a:hover { border: none; background: url(/images/echo_next_and_previous.png) no-repeat left -20px }
.skip_navigation li.skip_to_next a:link,
.skip_navigation li.skip_to_next a:visited { border: none; background: url(/images/echo_next_and_previous.png) no-repeat left -40px }
.skip_navigation li.skip_to_next a:active,
.skip_navigation li.skip_to_next a:hover { border: none; background: url(/images/echo_next_and_previous.png) no-repeat left -60px }

/* ---------- Cap-box ---------- */

#main_content .cap {
	margin-top: 8px;
	padding: 2px 12px 12px 12px;
	background: #deeafc;
}

#main_content .cap_temp {
	margin-top: 8px;
	padding: 2px 12px 12px 12px;
	background: #e1fad2;
}

#main_content .positive-cap { background: url(/images/echo_capalt_body.png) repeat-y left top }
#main_content .positive-cap .cap_holder_begin { background: url(/images/echo_capalt_top.png) no-repeat left top }
#main_content .positive-cap .cap_holder_end { background: url(/images/echo_capalt_bottom.png) no-repeat left bottom }
#main_content .dominant-cap { background: url(/images/echo_captemp_body.png) repeat-y left top }
#main_content .dominant-cap .cap_holder_begin { background: url(/images/echo_captemp_top.png) no-repeat left top }
#main_content .dominant-cap .cap_holder_end { background: url(/images/echo_captemp_bottom.png) no-repeat left bottom }

/* ---------- Blockquote ---------- */

#main_content .blockquote h3 { padding-top: 12px; font-size: 14px; line-height: 19px }
#main_content .blockquote h4 { padding-top: 6px; font-size: 13px; line-height: 18px }
#main_content .blockquote p { color: #505050; font-size: 12px; line-height: 17px }
#main_content .blockquote ul,
#main_content .blockquote ol,
#main_content .blockquote dl { padding-top: 6px; font-size: 12px; line-height: 17px }
#main_content .blockquote li { color: #505050; margin-left: 24px; padding-top: 3px }

/* ---------- Cut-in ---------- */

#main_content .cut,
#main_content .cut_alt { padding-bottom: 8px !important }
#main_content .side_cut .cut { float: right; padding-left: 24px }
#main_content .side_cut_alt .cut { float: left; padding-right: 24px }
#main_content .side_cut_both .cut { float: left; padding-right: 24px }
#main_content .side_cut_both .cut_alt { float: right; padding-left: 24px }

#main_content .broken { padding-left: 0; padding-right: 0 }
#main_content .box_fixer { padding-left: 28px; padding-right: 28px }

/* ---------- Footer ---------- */

#footer .bottom_navigation a { border: none }
#footer .bottom_navigation p,
#footer .bottom_navigation ul,
#footer .bottom_navigation li { margin: 0; padding: 0; color: #999999; font-size: 12px; line-height: 17px }

.bottom_navigation li { list-style: none }
.bottom_navigation .column { float: left }
.bottom_navigation .introduction { width: 230px }
.bottom_navigation .support { width: 460px }
.bottom_navigation .support li { float: left; width: 230px }
.bottom_navigation .account { width: 230px }
#footer .bottom_navigation p.title { padding-bottom: 4px; color: #4c5e80; font-weight: bold }
#footer .bottom_navigation p.title a { color: #4c5e80 }
#copyright { font-size: 11px; line-height: 16px; text-align: center; }
#copyright p { padding: 12px 0 }
#copyright a:link,
#copyright a:visited { color: #4c5e80; text-decoration: none }

.bottom_holder_begin {
    width: 956px;
    background: #f2f3f5 url(/images/echo_footer_top.png) repeat-x left top;
}
.bottom_holder_end {
    background: url(/images/echo_footer_bottom.png) repeat-x left bottom;
}

/* IE 6 and below */
* html .bottom_holder_end { padding: 16px 0 0 20px; border-top: 1px solid #d4d9e4 } 
* html .bottom_navigation ul { padding-bottom: 12px } 
/* IE 7 and below */
*:first-child+html .bottom_holder_end { padding: 16px 0 0 20px; border-top: 1px solid #d4d9e4 }
*:first-child+html .bottom_navigation ul { padding-bottom: 12px } 
/* Modern Browsers Only */
html>/**/body .bottom_holder_end { padding: 12px 0 12px 20px; }

/* ---------- Buttons and Links ---------- */

.button a,
.button input.submit { border: none !important }

#main_content .external a {
	display: inline-block;
	padding-right: 14px;
	background: url(/images/echo_external_link.png) no-repeat right 3px;
	}
#main_content .new_item a {
	display: inline-block;
	padding-right: 30px;
	background: url(/images/echo_new_item.png) no-repeat right 2px;
	}

.main_link,
.main_link_back {
	margin-top: 8px;
	padding: 0 0 0 20px !important;
	font-size: 13px;
	font-weight: bold;
	line-height: 13px;
	}
.main_link { background: url(/images/echo_linkarrow.png) no-repeat left 2px }
.main_link_back { background: url(/images/echo_linkarrow_back.png) no-repeat left 2px }
.main_button {
	display: block;
	width: 200px; height: 30px;
	margin-top: 8px;
	padding: 0 !important;
	background: url(/images/echo_mainbutton_body.png) no-repeat left top;
	}
.main_button a,
.main_button input.submit {
	display: block;
	width: 200px;
	margin: 0;
	background: transparent url(/images/echo_mainbutton_end.png) no-repeat right top;
	color: #000000 !important;
	font-size: 13px;
	font-weight: bold;
	line-height: 13px;
	text-align: center;
	text-shadow: 0 1px 0 #ffffff;
	}
.main_button a { height: 23px; padding: 7px 0 0 0 !important }
.main_button input.submit { height: 30px; padding: 0 !important }