/*----------------------------------------------------
	Reset
----------------------------------------------------*/

html {
	overflow-y: scroll;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,th {
	text-align: left;
}

q:before,q:after {
	content: '.';
}

object,
embed {
	vertical-align: top;
}

hr,legend {
	display: none;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	text-indent: none;
}

img,abbr,acronym,fieldset {
	border: 0;
}

ul,ol {
	list-style-type: none;
	text-indent: none;
}

em {
    font-style: normal;
    font-weight: bold;
}

a {
    text-decoration: none;
}

*{zoom:1;}   /*--　for IE bug　--*/


/*----------------------------------------------------
	Base
----------------------------------------------------*/

html {
   background: url(../img/bottom_bg.jpg) left bottom repeat-x;
}


body {
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS P Gothic","Osaka",Verdana,Arial, Helvetica, sans-serif;
	font-size: 80%;
    line-height: 1.7;
	color: #333333;
	text-align: center;
    background: url(../img/top_bg.jpg) left top repeat-x;
    margin: 0 auto;
}

p {
    margin-bottom: 1.5em;
    text-align: left;
}

p.big {
    padding: 0 40px;
    margin-bottom: 1em;
    text-align: left;
    font-size: 140%;
    font-stle: bold;
}

span.lite {
	color: #aaa;
}


h1 {
    font-size: 1.2em;
    border-bottom: 1px #999 solid;
    border-left: 5px #112331 solid;
    margin: 20px auto;
    padding: 0.5em 0 0.5em 15px;
　　text-align: left;
}

h2 {
    font-size: 1em;
    font-weight: bold;
	margin-bottom: 1em;
}


.center {
    text-align: center;
}

.cap {
    font-size: 70%;
    color: #666;
    line-height: 1em;
}


.bg_white {
    background-color: #fff;
    margin: 20px;
    padding: 2em 1em 1em 1em;
}

.break {
    word-break: break-all; 
}

.clear {
	clear: both;
}

/*----------------------------------------------------
	Line ケイ
----------------------------------------------------*/

/*--　囲み　--*/

.around {
    border: 1px solid #CCCCCC;
    margin: 20px 5px;
    padding: 1em;
}

.aroundb {
    border: 1px solid #CCCCCC;
	padding: 10px;
}

.upper {
    border-top: 1px solid #CCCCCC;
    padding: 1em;
}

/*----------------------------------------------------
	Space スペース
----------------------------------------------------*/

/*--　上下20　--*/

.space1 {
    margin: 20px 0;
}

/*--　左右40　--*/

.space2 {
    margin: 0 40px;
}

/*--　上下左右40　--*/

.space3 {
    margin: 40px;
}

/*--　下20　--*/
.space4 {
    margin-bottom: 20px;
}





/*----------------------------------------------------
	List リスト
----------------------------------------------------*/

/*--　左に64x64pxのアイコンが入るリスト　--*/

ul.icon li {
     display: block;
     padding: 3px 30px 3px 95px;
     margin: 5px 0;
     height: auto;
}


/*--　番号が入るリスト　--*/

ul.dc li {
	list-style-type: decimal;
	list-style-position: inside;
	margin: 20px 50px; /*--　上下左右にスペース　--*/
 }

/*--　discが入る　--*/
ul.disclist {
	list-style-type: disc;
	list-style-position: inside;
}


/*--　右向き三角が入る　--*/
ul.link li a {
    display: inline-block;
    padding-left: 12px;
    background: url(../img/arrow.gif) 0px 0.45em no-repeat;
}


/*----------------------------------------------------
	Table　表
----------------------------------------------------*/

/*--　基本の表1　--*/

table#table_01 {
    width: 98%;
    border: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 10px;
    margin: 10px auto;
}

table#table_01 td {
    padding: 1em 5px;
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    background: #fff;
    line-height: 120%;
    text-align: center;
    white-space: nowrap; 
}

table#table_01 td.option {
    padding: 1em 5px;
    border: 1px #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    text-align: center;
    white-space: nowrap;
    color: #fff;
    background-color: #666666;
}

/*--　基本の表2　--*/

table.table_02 {
	width: 98%;
	border-top: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin: 1em auto;
	border-collapse: collapse;
    text-align: left;
	}

table.table_02 tr.odd td	{
	background: #f4f4f4;
	}

table.table_02 tr.odd .column1	{
	background: #f4f4f4;
	}	

table.table_02 td {
	border-bottom: 1px solid #ddd;
	border-left: 1px solid #ddd;
	padding: 0.3em 1em;
	}				
table.table_02 th {
	font-weight: bold;
	text-align: left;
	border-bottom: 1px solid #ddd;
	border-left: 1px solid #ddd;
	padding: 0.3em 1em;
	white-space: nowrap;
	}

table.table_02.column1	{
	background: #f4f4f4;
	}



/*----------------------------------------------------
	Link
----------------------------------------------------*/

a:link {
	color: #06325A;
}

a:visited {
}

a:hover {
    color: #5da8e6;
}

a:active {
}

/*----------------------------------------------------
	wrap
----------------------------------------------------*/

#wrap {
    width: 900px;
    margin: 0 auto;
    text-align: left;
}

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

#header {
    width: 900px;
	margin: 0 auto;
	color: #333;
    font-size: 10px;
}

#logo {
    float: left;
    width: 500px;
    height: 56px;
    padding-top: 14px;
}

a#logomark, a:hover#logomark {
    display: block;
	overflow: hidden;
    background: url(../img/logo.jpg) ;
    width:250px;
    height:56px;
    text-indent: -9999px;
}


#navi_utility {
	float: right;
    width: 120px;
    height: 55px;
    padding-top: 15px;
    text-align: left;
    line-height: 15px;
}

#navi_utility li {
	padding-left: 12px;
    background: url(../img/arrow.gif) 0px 0.4em no-repeat;
}

#navi_utility a {
    color: #02365d;
}

#navi_utility a:hover {
    color: #999;
}

#navi {
    clear: both;
    margin: 0 auto;
    padding: 0;
    width: 900px;
    height: 40px;
    text-align: center;
    display: block;
}

ul.menu {text-align:center; line-height: 14px; }
ul.menu a {display:block; color:#666; text-decoration:none; }
ul.menu li {position:relative; float:left; }
ul.menu ul {position:absolute; top:30px; left:0; background:#fefefe; display:none; opacity:0; }
ul.menu ul li {position:relative; border:1px solid #ddd; text-align: left;}
ul.menu ul li a {display:block; padding:5px 10px 5px; background-color:#eee; color:#333; width: 160px; line-height: 20px; }
ul.menu ul li a:hover {background-color:#c5c5c5}
ul.menu ul ul {left:180px; top:-1px}
ul.menu .menulink {border:1px solid #ddd; padding:8px; font-weight:bold; background:url(../img/navi_bg.jpg); width:162px; letter-spacing: 0.5em; }
ul.menu .menulink:hover, ul.menu .menu:hover {background:url(../img/navi_over.gif); }
ul.menu .sub {background:#fefefe url(../img/arrow.gif) 170px 1em no-repeat; }
ul.menu .topline {border-top:1px solid #aaa; }


/*----------------------------------------------------
　メインイメージ　写真
----------------------------------------------------*/

.main_img {
    width: 900px;
    height: 220px;
}

.main_img#top_img {
    background: url(../img/top_img.jpg) left top no-repeat;
}

.main_img#esuru_mail {
    background: url(../img/products/esuru_mail/esuru_mail.jpg) left top no-repeat;
}


.main_img h1 {
	text-indent: -9999px;
	border: none;
}

.main_img .more {
	display: inline;
	float: right;
	padding: 27px 50px 0 0;
}


.main_img .more a {
	display: block;
	width: 142px;
	height: 30px;
	background-image: url(../img/more.jpg);
	background-repeat: no-repeat;
	text-indent: -9999px;
	overflow: hidden;
}

.main_img #goesurumail a { background-position: 0 0; }
.main_img #goesurumail a:hover { background-position: 0 -30px; }

/*----------------------------------------------------
　メインイメージ　テキストタイトル
----------------------------------------------------*/

.page_img {
    width: 900px;
    height: 90px;
}

.page_img#products {
    background: url(../img/products/products.jpg) left top no-repeat;
}

.page_img#development {
    background: url(../img/products/development/development.jpg) left top no-repeat;
}

.page_img#application {
    background: url(../img/products/esuru/application.jpg) left top no-repeat;
}

.page_img#company_profile {
    background: url(../img/profile/companyprofile.jpg) left top no-repeat;
}

.page_img#strength {
    background: url(../img/profile/strength.jpg) left top no-repeat;
}

.page_img#company_outline {
    background: url(../img/profile/companyoutline.jpg) left top no-repeat;
}

.page_img#access {
    background: url(../img/profile/access.jpg) left top no-repeat;
}

.page_img#press {
    background: url(../img/profile/press.jpg) left top no-repeat;
}

.page_img#recruit {
    background: url(../img/profile/recruit.jpg) left top no-repeat;
}

.page_img#termsofuse {
    background: url(../img/terms/termsofuse.jpg) left top no-repeat;
}

.page_img#privacy {
    background: url(../img/terms/privacy.jpg) left top no-repeat;
}

.page_img#disclaimer {
    background: url(../img/terms/disclaimer.jpg) left top no-repeat;
}

.page_img#copyright {
    background: url(../img/terms/copyright.jpg) left top no-repeat;
}

.page_img#contact {
    background: url(../img/contact/contact.jpg) left top no-repeat;
}

.page_img#contactform {
    background: url(../img/contact/contactform.jpg) left top no-repeat;
}

.page_img#notfound {
    background: url(../img/404error.jpg) left top no-repeat;
}



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

#content {
　　 width: 900px;
     padding: 10px 0 220px 0;
　　 text-align: left;
}

#content_white {
　　 width: 900px;
     padding: 10px 0 220px 0;
　　 text-align: left;
     background: #fff;
	 margin-bottom: 30px;
}

.wide {
     float: left;
	 width: 900px;
}

.left {
     float: left;
     width: 600px;
     padding: 10px 20px 40px 20px;
     display: inline;  /*--　for IE bug　--*/
}

.right {
     float: right;
     width: 240px;
     padding: 10px 20px 40px 0px;
     display: inline;  /*--　for IE bug　--*/
}


.local_navi {
     background: url(../img/localnavi_top.jpg) center top no-repeat;
     padding-top: 1px;
}


.local_navi_middle {
     background: url(../img/localnavi_middle.jpg) center top repeat-y;
}

.local_navi_bottom {
     background: url(../img/localnavi_bottom.jpg) center bottom no-repeat;
     padding-bottom: 20px;
}

.local_navi h1 {
     color: #333;
     font-weight: normal;
     font-size: 14px;
     border: none;
     margin: 0.5em 0.5em 0.25em 0.5em;
}

.local_navi ul li a {
     display: block;
     border-bottom: 1px dotted #999999;
     margin: 0 20px;
     padding: 1em 0.25em 0.5em 17px;
     background: url(../img/arrow.gif) 5px 1.45em no-repeat;
     color: #003366;
}

.local_navi ul li a:hover {
     background-color: #eee;
     color: #003366;
}

.center_img {
	display: block;
	margin: 0 auto;
	text-align: center;
}

.godetail {
    border-top: 1px solid #CCCCCC;
    padding: 1em;
    text-align: left;
}

.godetail ul li a {
    display: inline-block;
    padding: 0 20px 0 12px;
    margin-left: 20px;
    background: url(../img/arrow.gif) 0px 0.45em no-repeat;
}

dl.gomobile {
    border: 1px solid #CCCCCC;
    padding: 2em;
    text-align: left;
}


     
/*----------------------------------------------------
　Individual decolation　個別ページ装飾
----------------------------------------------------*/

/*--　トップページ　--*/
/*--　What's New　--*/

ul.toplink li a,
ul.toplink li.nolink {
     display: block;
     border-bottom: 1px dotted #999999;
     padding: 1em 1em 0.5em 17px;
     background: url(../img/arrow.gif) 5px 1.45em no-repeat;
     color: #003366;
}

ul.toplink li a:hover {
     background-color: #eee;
     color: #003366;
}


/*--　イースル★メールバナー　--*/

a#toppage_banner_esuru{
   display: block;
   border-style: none;
   width: 240px;
   height: 300px; 
   text-indent: -9999px; 
   background-image: url("../img/esuru_banner_240.jpg"); 
	overflow: hidden;
}

a#toppage_banner_esuru:hover {
   display: block;
   border-style: none;
   width: 240px;
   height: 300px; 
   text-indent: -9999px; 
   background-image: url("../img/esuru_banner_240b.jpg");
	overflow: hidden;
}


/*--　製品サービストップページ　--*/	

.figurebox {
	display: inline;
	float: left;
	padding: 7px 0 20px 35px;
	width: 240px;
	height: 300px;
}

* html .figurebox {
	width: 240px;
	height: 300px;
}

a#toesuru, a#todevelopment {
	display: block;
	width: 240px;
	height: 300px;
	background-image: url(../img/products/matchup.jpg);
	background-repeat: no-repeat;
	text-indent: -9999px;
	overflow: hidden;
}

a#toesuru { background-position: 0 0; }
a#toesuru:hover { background-position: 0 -300px; }
a#todevelopment { background-position: -240px 0; }
a#todevelopment:hover { background-position: -240px -300px; }




/*--　esuru/index.html　--*/

a:hover img.mouseover {
	opacity: 0.8;
	filter: alpha(opacity=80); /*-- for IE --*/
}




/*--　イースル★メール esuru_mail　--*/

/*--　左アイコン　--*/

ul.detail li h2 {
	margin-bottom: 0.25em !important;
}

#esuru_mail li#unlimited { background: url(../img/products/esuru_mail/esuru_mail_icon/unlimited.jpg) 20px 2px no-repeat; }
#esuru_mail li#clickcounter { background: url(../img/products/esuru_mail/esuru_mail_icon/clickcounter.jpg) 20px 2px no-repeat; }
#esuru_mail li#group { background: url(../img/products/esuru_mail/esuru_mail_icon/group.jpg) 20px 2px no-repeat; }
#esuru_mail li#cloud { background: url(../img/products/esuru_mail/esuru_mail_icon/cloud.jpg) 20px 2px no-repeat; }
#esuru_mail li#decomail { background: url(../img/products/esuru_mail/esuru_mail_icon/decomail.jpg) 20px 2px no-repeat; }
#esuru_mail li#speed { background: url(../img/products/esuru_mail/esuru_mail_icon/speed.jpg) 20px 2px no-repeat; }


/*--　スクリーンショット　--*/

dl.screenshot {
	float: left;
	width: 260px;
	display: inline;
	margin: 5px 10px 5px 20px;
	padding: 0 auto;
	text-align: center;
	font-size: 10px;
}

dl.screenshot dt img {
	border: 7px #cacaca solid;
}

dl.screenshot dd p {
	margin: 0.5em;
	text-align: center;   
}


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

#footer {
     clear: both;
     height: 220px;
     color: #ffffff;
     background-color:#333333;
     font-size: 10px;
     text-align: center;
}


.sitemap {
     float: left;
     width: 170px;
     padding: 15px 5px;
     text-align: left;
}

.sitemap ul li{
     padding-left: 27px;
     background: url(../img/sitemap_li.jpg) left 0.2em no-repeat;
}

.sitemap ul li.last {
     padding-left: 27px;
     background: url(../img/sitemap_li_last.jpg) left 0.1em no-repeat;
}

.sitemap ul.second {
	padding-left: 27px;
}


#footer_navi {
     clear: both;
     width: 900px;
     text-align: center;
     padding-top: 10px;
     border-top: #fefefe 1px dotted;
	line-height: 1.5em;
}

#footer a {
	color: #ffffff;
    text-decoration: none;
    padding: 0 0.5em;
}

#footer a:hover {
    color: #fefefe;
    text-decoration: none;
    background-color: #666666;
}

#footer h1 {
    font-weight: normal;
    font-size: 12px;
    line-height: 17px;
    border: none;
    margin: 0;
    padding: 0;
}


#footer_navi p {
     text-align: center;
}



/*----------------------------------------------------
	Mail form
----------------------------------------------------*/

#thanks {
	margin: 20px;
	min-height: 200px;
}

#thanks p,
#thanks p strong  {
	text-align: center !important;
	font-size: 14px !important;
	margin-bottom: 2em !important;
}
