﻿* {
    font-size: 10pt;
    margin: 0;
    padding: 0;
}

body {
    background: #4a8ccb url(../images/background.png) repeat;
}

a {
    color: #4a8ccb;
}
a:hover {
    background-color:#FFFFCC;
    color:maroon;
    text-decoration:none;
}

a img {
    border-width: 0;
    border:none;
}


a.logo_link:hover{
   border:none;
   background-color:#4A8CCB;
   text-decoration: none;
   color:none;
}

a.nolink:hover{
   border:none;
   background-color:white;
   text-decoration: none;
   color:none;
}

.align_left {
    text-align: left;
}
.align_right {
    text-align: right;
}
.align_center {
    text-align: center;
}


h1.title {
    background: url(../images/h3_title.png) no-repeat;
    height: 64px;
    padding: 22px 0 0 4.3em;
    font-size: 130%;
    color: #fff;
}

h2.title {
    background: url(../images/h3_title.png) no-repeat;
    height: 64px;
    padding: 22px 0 0 4.3em;
    font-size: 130%;
    color: #fff;
}

a.main_button {
    background: url(../images/main_button.gif) no-repeat;
    display: inline-block;
    height: 47px;
    width: 253px;
    padding-top: 14px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 120%;
    text-decoration: none;
}
a.nomark{
    text-decoration: none;
}
}
ol.ballon_list,
ul.ballon_list {
    margin: 10em 0;
}
ol.balloon_list li,
ul.balloon_list li {
    list-style-type: none;
    background: url(../images/list_style_balloon.png) no-repeat 0% 0%;
    margin-left: 2em;
    padding-left: 52px;
    line-height: 140%;
}
ol.check_list li,
ul.check_list li{
    list-style-type: none;
    background: url(../images/list_style_check.png) no-repeat 0% 0%;
    margin-left: 2em;
    padding-left: 42px;
    line-height: 160%;
}

ol.check_list_nr li,
ul.check_list_nr li{
    margin-left: 4em;
    padding-left: 12px;
    line-height: 160%;
}

ol.number_list li,
ul.number_list li{
    list-style-type: decimal;
    margin-left: 8em;
    line-height: 160%;
}

ol.check_list_orange li,
ul.check_list_orange li{
    list-style-type: none;
    background: url(../images/list_style_orange.png) no-repeat 0% 0%;
    margin-left: 2em;
    padding-left: 22px;
}

h3.orange_style {
    background: url(../images/list_style_orange.png) no-repeat 0% 50%;
    margin: 2em 0 2em 1em;
    padding-left: 32px;
}

/************************************************************************
    form/
************************************************************************/

form {
    padding:0px;
    margin:0px;
}

form table {
    width:570px;
}

form .TextBox {
    width:200px;
}

form .TextBox2 {
    width:300px;
}

.must {
    font-weight:bold;
    color:#d58484;
}

.CenterImg {
    width:650px;
    text-align:center;
    margin-top:30px;
    margin-bottom:30px;
}

.CenterImg img {
    margin:auto 20px auto 20px;
}

.CenterBt {
    width:650px;
    text-align:center;
    margin-top:10px;
    margin-bottom:30px;
}

.CenterBt img {
    margin:auto 20px auto 20px;
}


/************************************************************************
    faq.html
************************************************************************/

ul.Faq {
    margin:10px 0px 50px 0px;
    padding:0px;
    list-style-type:none;
}

ul.Faq li {
    width:610px;
    height:31px;
    background-image:url(../images/faq_bg01.gif);
    background-repeat:no-repeat;
    margin-left:20px;
    text-indent:50px;
    padding-top:10px;
}

/*
 * Page
 *
 */
.page {
    margin: 0 auto;
    width: 1000px;
}

/*
 * Super nav
 *
 */

#super_nav { 
  background: #414141; border-top: 2px solid #000; 
  text-align: center; 
  padding: .3em 0; 
}
#super_nav p {
  font-size: .8em;
  color: #C0C0C0; 
}
#super_nav ul,
#super_nav form { 
  display: inline; float: right; 
  line-height: 1; 
  margin: 0 .5em 0 0; 
  font-size:.8em; 
}

#super_nav ul { 
  font-size: 1em;
  margin: 2px 7em 0 0; 
  font-size:.8em; 
}
#super_nav ul li 	{ 
  display: inline; 
  border-right: 1px solid #c6c6c6; 
}
#super_nav ul .last	{ 
  border-right: none; 
}
#super_nav ul li a { 
  padding: 0 8px; color: #c6c6c6; 
  text-decoration: none;
  background-color: transparent;
}
#super_nav ul li a:hover { 
  text-decoration: underline; 
  color: #fff; 
}

/*
 * Header
 *
 */
#header  { 
	padding:1em 0 5em 0; 
}

#header #logo,
#header #nav,
#header #nav li { 
	display: inline; 
	line-height: 1; 
}

#header #logo            { 
	float: left; 
}
#header #nav            { 
	font-size: 1.2em; 
	float: right; 
	margin: 1em 0 0 0; 
	padding-bottom:.6em; 
}
#header #nav li            { 
	margin: 0 .85em; 
}
#header #nav .last          { 
	margin-right: 0; 
}
#header #nav li a          { 
    display: inline-block;
    padding-top: 5px;
    text-align: center;
    color: white;
  	text-decoration: none;
  	background-color: transparent;
}
#header #nav li a:hover        { 
	text-decoration: underline; 
}

#header #nav li a.current,
#header #nav li a.current:visited,
#header #nav li a.current:hover   { 
	font-size: 1.4em; 
	color: white; 
	border-bottom: .25em solid #FF8000; 
	font-weight: bold; 
}

#header #nav li a.current:hover    { 
	text-decoration: none; 
}


/*
 * tip
 *
 */
a.tip { 
    text-decoration: none;
}

div.tip { 
    width:160px;
    position:absolute;  
    background-image:url(../images/sh_tip_bg01.gif);
    background-position:bottom;
    background-repeat:no-repeat;
}

#Background div.tip h6 {
    margin:5px 5px 0px 5px;
    padding:0px;
    color:#608B0D;
}
div.tip p { 
    margin:0px 5px 5px 5px;
    padding: 5px;
    font-size:80%;
}


/*
 * Navigation
 *
 */
div#right {  
  text-align: right;  
  position: relative;
}

#navigation {
    clear: both;
}
#navigation ul li {
    display: inline;
    margin-right: 3px;
}
#navigation ul li.last {
    float: right;
}
#navigation ul li a {
    display: inline-block;
    width: 100px;
    height: 25px;
    padding-top: 5px;
    text-align: center;
    color: white;
  	 text-decoration: none;
  	 background-color: transparent;
}

#navigation ul li a:hover {
  	 text-decoration: underline;
  	 background-color: transparent;
}

#navigation a.menu_active {
	border-bottom: 5px #191970 solid;
   font-size: 120%;
    font-weight: bold;
  	 text-decoration: none;
  	 background-color: transparent;
}

#navigation a.menu_active:hover {
   text-decoration: none;
   color:none;
}

/* Hack for Google Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    #navigation ul li a:hover {
        height: 39px; padding-top: 16px;
    }
}

#navigation ul li a span.en {
    vertical-align: middle;
    font-family: Arial;
    font-size: 110%;
    display: inline-block;
}
#navigation ul li a span.jp {
    display: none;
}
#navigation ul li a:hover span.en {
    display: none;
}
#navigation ul li a:hover span.jp {
    vertical-align: middle;
    display: inline;
}

/*
 * Footer
 *
 */
#pre_footer {
    clear: both;
}
#footer {
    margin-top: 2em;
    background: url(../images/background_footer.png) repeat;
    color: #fff;
    padding: 3em 0 5em 0;
}
#copyright {
    font-family: Arial;
    font-size: 90%;
    padding-top: 1.2em;
}
#footer #left {
    font-size: 90%;
    float: left;
    width: 38%;
}
#footer .footer_navi {
    float: right;
    width: 60%;
}
#footer .footer_navi .bottom {
    border-bottom: 1px dotted #ddd;
    padding-bottom: .8em;
    margin-bottom: .8em;
}
#footer .footer_navi a {
    font-size: 90%;
}
#footer #footer_post {
    clear: both;
    margin-bottom: 5em;
}

/*
 * content
 *
 */
.rounded {
    background-color: #fff;
    padding: 1em;
}
.rounded p {
    margin: 1em;
}

#content {
    margin: .7em 0;
}
#top_content {
    margin-bottom: .5em;
}

#top_content h1 {
    color: #666;
    font-size: 150%;
    margin: .5em 0 1em .5em;
}
#top_content h2 {
    color: #666;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 1em;
    border-width:3pt;
    margin-left:0.8em;
    border-left-style:outset;
    border-color: Background ;
    padding: .2em 0 0 .7em;
}

#top_content p {
    margin-bottom: 1em;
    line-height: 140%;
}

#top_content u{
	
}
#top_content img.screenshot {
    float: right;
    margin-left: 1em;
}

#sub_content {
    width: 67%;
    float: left;
}
#sub_content p {
    margin-bottom: 1em;
    line-height: 140%;
}
#sub_content h1 {
    color: #666;
    margin-bottom: 2em;
}

#sub_content ul.submenu li {
  width: 9em;
  float: left;
  list-style:none
}

#sub_content ul.casestudy_image li {
  width: 9em;
  float: left;
  list-style:none
}

.casestudy_image li {
  width: 9em;
  float: left;
  list-style:none
}

.clearLeft { 
  clear: left; 
}

#sub_content_menu {
    background-color:whitesmoke;
    margin-bottom: 2em;
    border-bottom:1px solid #CACACA;
    border-top:1px solid #CACACA;
    line-height:14px;
    margin:10 10 10px;
    padding:10px 0px 10px 10px 
}

#sub_content h3 {
    color: #666;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 1em;
    border-width:3pt;
    margin-left:0.8em;
    border-left-style:outset;
    border-color: Background ;
    background-color:whitesmoke;
    padding: .4em 0 .2em .7em;
}

#sub_content h4 {
    color: #666;
    font-weight: bold;
    margin-bottom: 1em;
    border-width:3pt;
    border-left-style:outset;
    border-color: Background ;
    background-color:whitesmoke;
    padding: .4em 0 .1em 1em;
}

#side_content {
    width: 29%;
    float: right;
}

#side_content h3 {
    color: #666;
    font-weight: bold;
    border-width:3pt;
    border-left-style:outset;
    border-color: Background ;
    background-color:whitesmoke;
    padding: .2em 0 .1em .3em;
}

#side_content ol li,
#side_content ul li{
    list-style-type: decimal;
    margin-left: 2em;
}

#screen_shots {
    margin-bottom: .5em;
    position: relative;
}
#screen_shots div.screen_shot_image {
    text-align: center;
}

#banner {
    margin-bottom: .5em;
    position: relative;
}
#banner h3 {
    background: url(../images/h3_banner.png) no-repeat 0% 100%;
    padding-bottom: 10px;
    margin-bottom: .5em;
}

#news {
    margin-bottom: .5em;
    position: relative;
}
#news h3 {
    background: url(../images/h3_newsrelease.png) no-repeat 0% 100%;
    padding-bottom: 10px;
    margin-bottom: .5em;
}
#news dt {
    background: url(../images/list_style_orange.png) no-repeat 0% 50%;
    padding-left: 18px;
    font-family: verdana;
    font-weight: bold;
    font-size: 90%;
}
#news dd {
    padding-left: 18px;
    margin: .2em 0 .3em 0;
}

/*
 * Side pop navigations
 *
 */
#pop_navi_images {
    position: absolute;
    left: 283px;
    top: 0px;
}

#pop_navi_news {
    position: absolute;
    left: 283px;
    top: 0px;
}

/*
 * About Ciklone
 *
 */
ul.members li {
    line-height: 200%;
    padding-left: 70px;
    margin-bottom: 2em;
}

/*
 * ASP Tokusho
 *
 */
h1#tokusho {
    width: 560px;
    font-weight: bold;
    padding: 20px;
    margin: 30px auto 0 auto;
    background-color: #DDDDDD;
}

dl#tokusho {
    width: 592px;
    font-size: 80%;
    border: 1px solid #f1f1f1;
    padding: 3px;
    text-align: left;
    margin: 0 auto 50px auto;
    background-color: #f1f1f1;
}

dl#tokusho dt {
    width: 180px;
    clear: both;
    float: left;
    padding: 5px;
    border-right: 0px solid #999999;
    border-top: 1px solid #999999;
}

dl#tokusho dd {
    margin-left: 200px;
    margin-bottom: 5px;
    padding: 10px;
    border-top: 1px solid #999999;
    border-left: 0px solid #999999;
    background-color:  #f1f1f1;
}

/*
 * Sign-up
 *
 */
#head_content h1 {
    color: #666;
    font-size: 180%;
}
#head_content h2 {
    color: #666;
    font-size: 100%;
    margin-bottom: 1em;
}

#head_content p {
    margin-bottom: 1em;
    line-height: 140%;
}

#sgu_content h1 {
    color: #666;
    font-size: 140%;
    text-align: center;
}
#sgu_content h2 {
    color: #666;
    font-size: 100%;
    text-align: center;
}

#sgu_content h3 {
    color: #608B0D;
    font-size: 100%;
    margin-bottom: 1em;
    text-align: center;
}

#sgu_content p {
    margin-bottom: 1em;
    line-height: 140%;
    text-align: center;
}

#sgu_content ol.none,ul.none{
    list-style-type:none;
    padding:6px ;
    background:#F4F4F4;
    border-bottom: solid 1px #B2B2B2;
    border-right: solid 1px #B2B2B2;
}

#sgu_content strong{
    font-size: 1.2em;
    line-height: 2.0;
    font-family: 'Arial', 'Tahoma', sans-serif;
    color: #990000;
}

.short_box {
    height:310px;
    width:180px;
    margin-top:10px;
    margin-left:25px;
    padding:10px 20px 0px 20px;
    background-color:white;
    border:1px solid #999999;
    float:left;
}

.short_box_r {
    height:310px;
    width:180px;
    margin-top:10px;
    margin-left:-1px;
    padding:10px 20px 0px 20px;
    background-color:white;
    border:1px solid #999999;
    float:left;
}

.short_box_u {
    margin-top:10px;
    margin-left:-1px;
    padding:10px 20px 0px 20px;
    background-color:white;
}

table.tb_center{
    margin-left : auto ;
    margin-right : auto ;
    margin-top: 0.2em;
    margin-bottom: 1em;
    border-spacing: 2px;
    font-size: 100%;
    width: 700px;
}

table.tb_center th,
table.tb_center td {
    padding: 4px 6px;
}

table.tb_center th{
    border-bottom: solid 1px #B2B2B2;
    border-right: solid 1px #B2B2B2;
    background: #F4F4F4;
}
table.tb_center td{
    border-bottom: solid 1px #B2B2B2;
    border-right: solid 1px #B2B2B2;
    background: #F4F4F4;
}

/* ユーザの声 */
#user_voice{
  display: block;
  width: 210px;
  height: auto;
  margin:0;
}
/**/
#user_voice_title{
  display: block;
  width: 210px;
  height: 22px;
  background: url(../images/voice_title_bg.gif) no-repeat;
}
#user_voice_title p{
  text-align: left;
  padding: 2px 5px 0 30px;
}
#user_voice_bg{
  display: block;
  width: 210px;
  height:auto;
  background: url(../images/voice_bg.gif) top no-repeat;
  border-bottom: 1px dotted #999;
}
#user_voice_bg p{
  font-size: 11px;
  line-height: 14px;
  text-align: left;
  margin-top: 10px;
  padding: 0 15px 0 15px;
}
#user_voice_bg div.name_office{
  font-size: 11px;
  text-align: right;
  font-weight: bold;
  color:#108fd6;
  padding-top: 3px;
}

#SignupBtn a{
  display: block;
  width: 301px;
  height: 55px;
  background: url(../images/signup_btn_1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#SignupBtn a:hover{
  background: url(../images/signup_btn_2.gif) no-repeat 0 0;
  text-decoration:none;
}

#FreeAccountBtn a{
  display: block;
  width: 231px;
  height: 55px;
  background: url(../images/free_acount_1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#FreeAccountBtn a:hover{
  background: url(../images/free_acount_2.gif) no-repeat 0 0;
  text-decoration:none;
}

#CaseStudyBtn_sigma a{
  display: block;
  width: 116px;
  height: 81px;
  background: url(../images/case_sigma_logo1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#CaseStudyBtn_sigma a:hover{
  background: url(../images/case_sigma_logo2.gif) no-repeat 0 0;
  text-decoration:none;
}

#CaseStudyBtn_inforesta a{
  display: block;
  width: 116px;
  height: 81px;
  background: url(../images/case_inforesta_logo1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#CaseStudyBtn_inforesta a:hover{
  background: url(../images/case_inforesta_logo2.gif) no-repeat 0 0;
  text-decoration:none;
}

#CaseStudyBtn_spline a{
  display: block;
  width: 116px;
  height: 81px;
  background: url(../images/case_spline_logo1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#CaseStudyBtn_spline a:hover{
  background: url(../images/case_spline_logo2.gif) no-repeat 0 0;
  text-decoration:none;
}

#CaseStudyBtn_umanity a{
  display: block;
  width: 116px;
  height: 81px;
  background: url(../images/case_umanity_logo1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#CaseStudyBtn_umanity a:hover{
  background: url(../images/case_umanity_logo2.gif) no-repeat 0 0;
  text-decoration:none;
}

#CaseStudyBtn_opengroove a{
  display: block;
  width: 116px;
  height: 81px;
  background: url(../images/case_opengroove_logo1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#CaseStudyBtn_opengroove a:hover{
  background: url(../images/case_opengroove_logo2.gif) no-repeat 0 0;
  text-decoration:none;
}

#user_voice_comment_bg{
  display: block;
  height:auto;
  background: url(../images/voice_bg.gif) top no-repeat;
  border-bottom: 1px dotted #999;
}

#OptionPlanBtn a{
  display: block;
  width: 301px;
  height: 55px;
  background: url(../images/optionplan_btn_1.gif) no-repeat 0 0;
  text-decoration:none;
  text-indent: -9999px;
}
#OptionPlanBtn a:hover{
  background: url(../images/optionplan_btn_2.gif) no-repeat 0 0;
  text-decoration:none;
}

.bb_center {
  text-align: center;
  font-size:26px;
  font-weight: bold;
  color:#108fd6;
  padding-top: 3px;
}



/*----------------------------------------------------------------------
// inx add write
----------------------------------------------------------------------*/

#inxPageLead h1
{
 width: 895px;
 margin-right: auto;
 margin-bottom: 30px;
 margin-left: auto;
 padding: 10px;
 line-height: 1.0;
 text-align: center;
 color: #FFFFFF;
 text-shadow: 1px 1px 0 #333333;
 background: url(../images/bg_title.gif) 0 50% no-repeat;
}

#inxPageLead h2
{
 font-size: 120%;
 color: #990000;
 text-align: center;
}

.inxSection
{
 clear: both;
 width: 895px;
 height: 1%;
 margin-right: auto;
 margin-left: auto;
 padding-bottom: 30px;
 overflow: hidden;
}


.inxPlanWrap
{
 width: 895px;
 height: 1%;
 margin-right: auto;
 margin-left: auto;
 padding-left: 10px;
 background: url(../images/bg_service.gif) no-repeat;
 overflow: hidden;
}

.inxPlanBox
{
 float: left;
 width: 177px;
 padding-bottom: 15px;
}

.inxPlanBox h3
{
 margin-top: 10px;
 /*padding-top: 10px;
 padding-bottom: 10px;
 font-size: 110%;
 text-align: center;
 vertical-align: middle;
 color: #FFFFFF;
 text-shadow: 1px 1px 0 #000000;
 background: #666666;*/
 border-right: 1px solid #FFFFFF;
}

.focus h3
{
 margin-top: 0;
 /*font-size: 130%;
 color: #FFFFFF;
 text-shadow: 1px 1px 0 #000000;
 background: #333333;*/
 border-right: none;
}

.laneEnd h3
{
 border-right: none;
}


.inxPlanBox ul li
{
 margin-left: 15px;
 font-size: 90%;
}

.inxPlanBox h4,
.inxPlanBox p,
.inxPlanBox ul
{
 padding-right: 10px;
 padding-left: 10px;
}

.inxPlanBox h4
{
 margin: 0;
 padding-top: 0.5em;
 padding-bottom: 1.0em;
 color: #608B0D;
 text-align: center;
}

#head_content .inxPlanBox p
{
 margin: 0;
 padding-top: 0.5em;
 padding-bottom: 0.5em;
 font-weight: bold;
 line-height: 1.2;
 color: #666666;
 text-align: center;
}

#head_content .focus p
{
 font-size: 130%;
 color: #990000;
}

.inxPlanBox ul li
{
 line-height: 1.8;
}

.inxPlanBox ul li strong
{
 font-size: 110%;
 color: #990000;
}

.alCenter
{
 clear: both;
 text-align: center;
}

#head_content h2.inxSubTitle
{
 margin-top: 30px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 42px;
 font-size: 180%;
 background: url(../images/bg_subtitle.gif) no-repeat;
}

.inxSection ul.casestudy_image
{
 width: 750px;
 height: 1%;
 margin-right: auto;
 margin-left: auto;
 padding-bottom: 15px;
 overflow: hidden;
}

.inxSection ul.casestudy_image li
{
 padding-right: 15px;
 padding-left: 15px;
}

h3.inxSubLead
{
 clear: both;
 color: #666;
 font-size: 110%;
 font-weight: bold;
 margin-bottom: 1em;
 border-width:3pt;
 margin-left:0.8em;
 border-left-style:outset;
 border-color: Background ;
 background-color:whitesmoke;
 padding: .4em 0 .2em .7em;
}

a#inxPlanBtn01,
a#inxPlanBtn02,
a#inxPlanBtn03,
a#inxPlanBtn04,
a#inxPlanBtn05
{
 display: block;
 width: 121px;
 height: 33px;
 margin-right: auto;
 margin-left: auto;
 text-indent: -9999px;
}

a#inxPlanBtn01,
a#inxPlanBtn02,
a#inxPlanBtn03,
a#inxPlanBtn04
{
 background: url(../images/signup.png) no-repeat;
}

a#inxPlanBtn05
{
 background: url(../images/btn_contact.png) no-repeat;
}

a#inxPlanBtn01:hover,
a#inxPlanBtn02:hover,
a#inxPlanBtn03:hover,
a#inxPlanBtn04:hover
{
 background: url(../images/signup_on.png) no-repeat;
}

a#inxPlanBtn05:hover
{
 background: url(../images/btn_contact_on.png) no-repeat;
}

