@charset "Shift_JIS";


/* 
--------------------------------------------------------------------
1. 初期設定
2. clearfix
--------------------------------------------------------------------*/


/* 1. 初期設定
--------------------------------------------------------------------*/
body{
	margin:0px;
	padding:0px;
	background:transparent url(../images/bkg_page_frame.gif) no-repeat scroll center top;
}

div, p{
	margin:0px;
	padding:0px;
}


br{letter-spacing:0px;}

a:hover {
	color:#333;
}


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

.clearfix{
	display:inline-block;
}

/* Hides from IE-mac \*/
* html .clear {height: 1%;}
.clear {display: block;}
/* End hide from IE-mac */

.clear{
	clear:both;
}



/* 3. コンテンツ
--------------------------------------------------------------------*/
#main{
	margin:0 auto 0 10px;
	padding:0px 24px 0px 24px;
	text-align:center;
	
}

#main h2 {
	width:582px;
	/*background: url(../images/ttl.gif) no-repeat 20px 0;*/
	margin-bottom:0px;
	margin-top:10px;
	padding-left:15px;
}


h2 span, h3 span, h4 span{
	margin-left :-9999px;
}

h3 {
	width:500px;
	height:30px;
	background: url(../images/ttl_other.gif) no-repeat;
	margin-bottom:0px;
	margin-top:10px;
}

h4 {
	width:150px;
	height:30px;
	background: url(../images/ttl_links.gif) no-repeat;
	margin-bottom:0px;
	margin-top:10px;
}



/* Flash部分
--------------------------------------------------------------------*/

#flashbox {
	width:822px;
	height:315px;
}

#flashboxl {
	float:left;
	width:317px;
	padding:38px 30px;
}

#flashboxr {
	width:438px;
	height:auto;
	float:right;
	padding-left:37px;
	padding-top:37px;
	}


#flashboxr ul{
	list-style-type:none;
}

#flashboxr li{

}

#flashboxr li a{
	display:block;
	width:401px;
	height:80px;
	padding-bottom:2px;
}

#flashboxr li#faster{
	background:url("../images/btn_faster.gif") no-repeat;
}

#flashboxr li#faster:hover{
	background:url("../images/btn_faster_on.gif") no-repeat;
}

#flashboxr li#im{
	background:url("../images/btn_im.gif") no-repeat;
}

#flashboxr li#im a:hover{
	background:url("../images/btn_im_on.gif") no-repeat;
}

#flashboxr li#security{
	background:url("../images/btn_security.gif") no-repeat;
}

#flashboxr li#security a:hover{
	background:url("../images/btn_security_on.gif") no-repeat;
}



/* ご注意
-------------------------------- */
#main div.ctsbox{
	padding:15px 0;
	width:416px;
	margin:0 auto 15px;
	
}

#main div#boxsignin,
#main div#boxsignup{
	float:left;
}

#main div#boxsignin{
	margin:0 auto;
	width:203px;
}

#main div#boxsignup{
	padding-left:10px;
	width:203px;
}

#main div#boxsignin p,
#main div#boxsignup p{
	margin:0px auto 5px;
	text-align:center;
	font-size:0.8em;
}

#main div.ctsbox div.boxl{
	width:700px;
}


#main div.ctsbox div.boxl ul li{
	/*background:url("../images/icon.gif") 0px 2px no-repeat;*/
	padding:0px 0px 6px 10px;
	font-size:11px;
	font-family:'ＭＳ Ｐゴシック','Hiragino Kaku Gothic Pro W3',sans-serif;
	color:#666666;
	line-height:130%;
}

#main div.ctsbox div.boxl div.txt ul li span{
	color:#00a0fb;
}
#main div.ctsbox div.boxr{
	float:right;
	width:203px;
}

#main div.ctsbox div.boxr p{
	font-size:10px;
	text-align:right;
	margin-top:0.5em;
}

#main div.ctsbox div.boxr p span{
	font-size:12px;
}


/* 使ってみよう、便利なHotmail
-------------------------------- */

#main div#feature {
	width:822px;
	height:243px;
	background: url(../images/featurebg.gif) no-repeat;
	margin-top:20px;
	padding:20px;
}

#main div#feature h3{
	font-size:20px;
	font-weight:bold;
	color:#3e93c0;
}

#main div#feature ul{
	list-style-type: none;
	margin-top:25px;
}

#main div#feature ul li{
	float:left;
	width:240px;
	height:190px;
	margin-right:25px;
}

#main div#feature ul li#gb{
	background: url(../images/5gb.gif) no-repeat 25px 70px;
}

#main div#feature ul li#ui{
	background: url(../images/ui.gif) no-repeat 10px 80px;
}

#main div#feature ul li#security{
	background: url(../images/security.gif) no-repeat 60px 82px;
}

#main div#feature ul li h4{
	font-size:16px;
	font-weight:bold;
	color:#5b8ecb;
	border-bottom:1px #999 dotted;
	margin-bottom:10px;
}

#main div#feature ul li p{
	font-size:12px;
	line-height:1.5em;
}

#reg {
	text-align:center;
}

/* ヘッダー
-------------------------------- */
body{background:transparent url(../../images/bkg_page_frame.gif) no-repeat scroll center top;}

#header {border-bottom:1px #ccc solid;padding-bottom:0;}
ul#headlinks{margin-right:5px;}
ul#headlinks li{float:right; margin-right:10px;font-size:80%;margin-top:2px;}
ul#headlinks li#last{border-left:none;clear:right;padding:0;margin-top:2px;}
ul#headlinks li a {color:#057CB8;text-decoration:none;padding-left:10px;border-left:1px #ccc solid;}
ul#headlinks li a:hover {color:#07ACFF;}

/* 機能紹介タブのレイアウト調整 */
#functions {background:url(../images/bg.jpg) no-repeat; padding-top:60px;height:248px;width:869px;margin-left:1px;}
#functions #lists {float:right; width:280px;padding-top:px;}
#functions #lists li#ttl {margin-bottom:5px; margin-top:5px;}
#functions #lists li {margin-bottom:1px;}
#functions #funcimg {float:right; width:350px;height:220px;padding:0;}

/* スクロールのレイアウト調整 */
#scroll #scrollbox {border-top:2px #cecec6 dotted;width:870px;}
#scroll #scrollbox li {font-size:0.75em;text-align:center;}
#scroll #scrollbox img {width:80px;}
#scroll #scrollbox #text {text-align:left;}
#scroll #scrollbox #text p {line-height:1.4em;}
#scroll #scrollbox #text p#pname {font-size:1.2em;font-weight:bold;color:#444;padding:5px 0 0;}

/* 関連リンク */
#links {width:100%;font-size:0.8em;margin-bottom:20px;}
#links ul {border:2px #cecec6 dotted; width:830px; height:15px;padding:15px;}
#links ul li {float:left;margin-right:20px;padding-left:26px;background:url(../images/arrow_links.gif) no-repeat;}