h3
{
	margin-bottom:10px;
}

#header{
	background-image:url(../images/contents/top/header.png);
	background-position:center;
	background-repeat:no-repeat;
	height:315px;
}

#header h1{
	margin:0px;
}

#header a.company{
	left:308px;
}

#header a.ycom{
	display:block;
	position:absolute;
	top:8px;
	left:30px;
	margin:0px;
}

#header a.tel{
	display:block;
	width:270px;
	height:85px;
	position:absolute;
	top:30px;
	left:750px;
}

#header #grobal_navi{
	position:relative;
	background-image:url(../images/contents/top/g_menu_bg.png);
	height:53px;
	width:960px;
	top:231px;
	left:20px;
	display:inline;
	float:left;
}

#header #grobal_navi a{
	background-image:url(../images/contents/top/g_menu.png);
	display:block;
	height:52px;
	width:120px;
	float:left;
	left:0px;
}

#header #grobal_navi a.top{
}

#header #grobal_navi a.top:hover{
	background-position:0px -53px;
}

#header #grobal_navi a.price{
	background-position:0px 0px;
}

#header #grobal_navi a.price:hover{
	background-position:0px -53px;
}

#header #grobal_navi a.service{
	background-position:-120px 0px;
}

#header #grobal_navi a.service:hover{
	background-position:-120px -53px;
}

#header #grobal_navi a.works{
	background-position:-240px 0px;
}

#header #grobal_navi a.works:hover{
	background-position:-240px -53px;
}

#header #grobal_navi a.faq{
	background-position:-360px 0px;
}

#header #grobal_navi a.faq:hover{
	background-position:-360px -53px;
}

#header #grobal_navi a.flow{
	background-position:-480px 0px;
}

#header #grobal_navi a.flow:hover{
	background-position:-480px -53px;
}

#header #grobal_navi a.contact{
	background-position:-600px 0px;
}

#header #grobal_navi a.contact:hover{
	background-position:-600px -53px;
}

#header #grobal_navi a.company{
	background-position:-720px -0px;
}

#header #grobal_navi a.company:hover{
	background-position:-720px -53px;
}

#main{
	background-image:url(../images/contents/top/background_m.png);
	background-position:center top;
}

#main .body
{
	text-align:left;
}

/* 制作プランナビ */
#makehp_navi
{
	background-image:url(../images/landing/makehp_navi_bg.png);
	width:910px;
	height:202px;	
	margin:0px 0px 30px 50px;
	float:left;
}

#makehp_navi h2
{
	margin:0px 0px 0px 0px;
}

#makehp_navi .plans
{
	margin:0px 0px 0px 10px;
}

/* 初めての方プラン */
#begginer h2
{
	margin:0px 0px 0px 50px;
}

#catch
{
	float:left;
	margin:30px 0px 10px 50px;
	background-image:url(../images/contents/top/catch.png);
	width:900px;
	height:233px;
}

#catch .text
{
	position:absolute;
	top:125px;
	left:65px;
	width:300px;
}

#catch a
{
	display:block;
	position:absolute;
	top:63px;
	left:520px;
	width:300px;
	height:100px;
}

#plans
{
	background-image:url(../images/contents/top/plan_type02_bg.png);
	width:900px;
	height:472px;	
	margin:0px 0px 20px 50px;
	float:left;
}

#plans img.visit{
	position:absolute;
	top:-65px;
	left:-10px;
	z-index:0;
}

#plans a.plan{
	margin:0px 0px 10px 100px;
	float:left;
}

#plans img
{
	margin:0px 0px 0px 20px;
}

#plans img.plan1
{
	position:relative;
	margin:20px 0px 0px 20px;
	z-index:1;
}

#area01 .left
{
	float:left;
	width:700px;
	margin:0px 20px 50px 50px;
}

#area01 .right
{
	float:left;
	width:180px;
	margin:0px 0px 10px 0px;
}

#banners01 img
{
	margin:0px 0px 5px 0px;
}

#seo
{
	margin:0px 0px 30px 50px;
}

#seo h2
{
	margin:0px 0px 20px 0px;
}

#seo .about
{
	float:left;
}

#seo .about
{
	margin:0px 20px 0px 20px;
	list-style:none;
}

#seo .about li
{
	margin:0px 0px 20px 0px;
}

#seo .about li h3
{
}

#seo .about li img.mark
{
	float:left;
}

#seo .about li img.detail
{
	position:absolute;
	top:7px;
	left:430px;
}

#seo .about li .text
{
	margin:0px 0px 0px 90px;
	width:420px;
}

#seo .seo_rank
{
	float:left;
	width:350px;
	margin:7px 0px 0px 0px;
}

#seo .seo_rank .frame
{
	background-image:url(../images/contents/top/seo_rank_m.png);
	background-repeat:repeat-y;
}

#seo .seo_rank .frame .text
{
	margin:10px 20px;
}

#seo .seo_rank .frame .text .row
{
	border-bottom:1px dashed #999999;
	margin:0px 0px 5px 0px;
}

#seo .seo_rank .frame .text .rank
{
	float:left;
	width:50px;
	font-weight:bold;
	color:#FF3300;
}

#seo .seo_rank .frame .text .keyword
{
	float:left;
	width:260px;
}

#seo .seo_rank .frame .text .msg
{
	margin:10px 0px 0px 0px;
	text-align:right;
}

#limited
{
	display:block;
	background-image:url(../images/contents/top/plan01_type02.png);
	width:900px;
	height:64px;	
	margin:0px 0px 10px 50px;
	text-decoration:none;
	color:#333333;
}

#limited .date
{
	position:relative;
	top:32px;
	left:670px;
	text-align:right;
	width:200px;
}

#service
{
	float:left;
	background-image:url(../images/contents/top/service_m.png);
	background-repeat:repeat-y;
	width:700px;
	margin:0px 0px 10px 0px;
}

#service .item
{
	height:290px;
	margin:0px 0px 0px 10px;
}

div#area_top{
	text-align:left;
}

div#area_top .plans{
	float:left;
	margin:30px 0px 40px 50px;
	display:inline;
}

div#area_top .plans h3{
	margin:0px 0px 10px 0px;
}

div#area_top .plans .btn_right
{
	width:900px;
	margin:0px 0px 10px 0px;
}

div#area_top .plan
{
	float:left;
	margin:0px 10px 0px 0px;
}

div#area_top .plan .number
{
	background-image:url(../images/contents/top/number/base.png);
	width:77px;
	height:77px;
	position:absolute;
	top:-7px;
	left:220px;
}

div#area_top .plan .number.rare
{
	background-image:url(../images/contents/top/number/base_rare.png);
	width:90px;
	height:83px;
	top:-13px;
	left:207px;
}

div#area_top .plan .number.sold
{
	background-image:url(../images/contents/top/number/base_sold.png);
	top:-25px;
	height:90px;
}

div#area_top .plan .number .num1
{
	position:absolute;
	top:15px;
	left:5px;
}

div#area_top .plan .number .num2
{
	position:absolute;
	top:46px;
	left:33px;
}

div#area_top .plan .number.rare .num1
{
	top:21px;
	left:18px;
}

div#area_top .plan .number.rare .num2
{
	top:52px;
	left:46px;
}

div#area_top .plan .meter{
	background-image:url(../images/contents/top/plan_meter_off.png);
	width:294px;
	height:31px;
	margin-bottom:5px;
}

div#area_top .plan .meter .on{
	background-image:url(../images/contents/top/plan_meter_on.png);
	height:31px;
}

div#area_top .plans a.plan1{
	display:block;
	background-image:url(../images/contents/top/banner_plans3.png);
	width:294px;
	height:217px;
}

div#area_top .plans a.plan1:hover{
	background-position:0px -217px;
}

div#area_top .plans a.plan2{
	display:block;
	background-image:url(../images/contents/top/banner_plans3.png);
	width:294px;
	height:217px;
	background-position:-294px 0px;
}

div#area_top .plans a.plan2:hover{
	background-position:-294px -217px;
}

div#area_top .plans a.plan3{
	display:block;
	background-image:url(../images/contents/top/banner_plans3.png);
	width:294px;
	height:217px;
	background-position:-588px 0px;
}

div#area_top .plans a.plan3:hover{
	background-position:-588px -217px;
}


div#area_top #story
{
	margin:30px 0px 30px 40px;
}

div#area_top #story	h3
{
	margin:0px 0px 0px 0px;
}

div#area_top #story	img
{
	float:left;
}

div#area_top #story	.story
{
	background-image:url(../images/contents/top/story_m.png);
	width:460px;
	background-repeat:repeat-y;
	margin:0px 0px 10px 0px;
	float:left;
}

div#area_top #story	.text
{
	margin:0px 0px 0px 30px;
	width:400px;
	height:230px;
	line-height:22px;
}

div#area_top #story	.plan
{
	margin:0px 0px 0px 25px;
	display:inline;
}

div#area_top #story	.plan img
{
	margin:0px 10px 0px 0px;
}

div#area_top #story	.text b
{
	font-weight:bold;
	color:#006600;
}

div#area_top #story .story01 .plan
{
	margin:10px 0px 0px 0px;
	float:none;
}

div#area_top #story .story01 .plan img
{
	margin:0px 10px 0px 0px;
}


div#area1{
	width:400px;
	float:left;
	text-align:left;
}

/* あなたのご希望に応じます */
div#area1 .request{
	background-image:url(../images/contents/top/request_bg.png);
	background-position:-680px 0px;
	background-repeat:repeat-y;
	margin:0px 0px 20px 50px;
}

div#area1 .request h2{
	margin:0px 0px 10px 0px;
}

div#area1 .request h3{
	font-size:14px;
	margin:0px;
}

div#area1 .request .middle{
	float:left;
	width:340px;
}

div#area1 .request .middle li.caption{
	list-style:none;
	padding:0px;
	margin-left:20px;
	background-image:url(../images/contents/top/request_caption.png);
	width:300px;
	background-repeat:no-repeat;
	line-height:20px;
	color:#990000;
	font-size:14px;
	font-weight:bold;
}

div#area1 .request .middle li.caption a{
	color:#990000;
}

div#area1 .request .middle li.answer{
	list-style:none;
	padding:0px;
	margin-left:20px;
	background-image:url(../images/contents/top/request_answer.png);
	background-repeat:no-repeat;
	line-height:20px;
	margin-bottom:10px;
}

div#area1 .request .middle li.answer div{
	margin-left:25px;
	width:270px;
}

div#area1 .request .middle div.all{
	margin-left:20px;
}

div#area1 .request .bottom{
	background-image:url(../images/contents/top/request_bg.png);
	background-position:-340px 0px;
	width:340px;
	height:30px;
	float:left;
}

div#area1 .banner{
	margin:0px 0px 20px 50px;
}

div#area1 .banner img.banner{
	margin:0px 0px 10px 0px;
}

div#area1 .beginner{
	margin-left:50px;
	margin-bottom:10px;
}

div#area1 .beginner ul{
	margin:0px 0px 20px 20px;
}

div#area1 .beginner ul li{
	margin:0px;
	padding:0px;
}

div#area1 .target{
	margin-left:50px;
	margin-bottom:30px;
}

div#area1 .target ul{
	list-style:none;
}

div#area1 .target ul li{
	margin:0px;
	padding:0px;
	line-height:0em;
}

div#area1 .more{
	margin-left:50px;
	margin-bottom:30px;
}

div#area1 .more ul{
	list-style:none;
}

div#area1 .more ul li{
	background-image:url(../images/base/list3.png);
	line-height:20px;
	padding-left:20px;
	margin-left:0px;
	background-repeat:no-repeat;
	background-position:0px 3px;
}

div#area1 .web_marketing{
	margin-left:50px;
	margin-bottom:30px;
}

div#area1 .web_marketing ul{
	list-style:none;
}

div#area1 .web_marketing ul li{
	background-image:url(../images/base/list3.png);
	line-height:20px;
	padding-left:20px;
	margin-left:0px;
	background-repeat:no-repeat;
	background-position:0px 3px;
}

div#area1 .myweb{
	margin-left:50px;
	margin-bottom:30px;
}

div#area2{
	width:600px;
	text-align:left;
	float:left;
}

div#area2 img.sample{
	margin:0px 0px 10px 20px;
}

div#area2 img.portrait
{
	margin:0px 0px 20px 20px;
}

div#area2 img.illust
{
	margin:0px 0px 0px 10px;
}

div#area2 .information{
	margin-left:20px;
	margin-bottom:20px;
}

div#area2 .information ul{
	list-style:none;
}

div#area2 .information ul li{
	border-bottom:1px dotted #CCCCCC; 
	margin:0px;
	padding:0px;
	width:530px;
}

div#area2 .information ul li .date{
	float:left;
	width:100px;
}

div#area2 .information ul li .content{
	float:left;
	width:430px;
}

div#area2 .update{
	margin-left:20px;
	margin-bottom:20px;
}

div#area2 .update ul{
	list-style:none;
}

div#area2 .update ul li{
	border-bottom:1px dotted #CCCCCC; 
	margin:0px;
	padding:0px;
	width:530px;
}

div#area2 .update ul li .date{
	float:left;
	width:100px;
}

div#area2 .update ul li .content{
	float:left;
	width:430px;
}

div#area2 .blog{
	margin-left:20px;
	margin-bottom:20px;
}

div#area2 .blog ul{
	list-style:none;
}

div#area2 .blog ul li{
	border-bottom:1px dotted #CCCCCC; 
	margin:0px;
	padding:0px;
	width:530px;
}

div#area2 .blog ul li .date{
	float:left;
	width:120px;
}

div#area2 .blog ul li .content{
	float:left;
	width:410px;
}

/* twitter */
div#area2 #twitter
{
	margin-left:0px;
	margin-bottom:20px;
	text-align:left;
}

#twitter .row
{
	border-bottom:1px dotted #0066CC;
	line-height:20px;
	margin:5px 0px;
	margin-left:40px;
	width:480px;
}

#twitter .top
{
	background-image:url(../images/contents/top/twitter_bg.png);
	width:550px;
	height:90px;
	float:left;
}

#twitter .top a.follow
{
	position:relative;
	display:block;
	width:60px;
	height:60px;
	left:490px;
	top:10px;
}

#twitter .middle
{
	background-image:url(../images/contents/top/twitter_text_bg.png);
	background-repeat:repeat-y;
	width:550px;
	float:left;
}

#twitter .tweet
{
	width:400px;
	float:left;
}

#twitter .time
{
	margin-left:10px;
	text-align:right;
	width:60px;
	float:left;
}

#twitter .bottom
{
	background-image:url(../images/contents/top/twitter_bg.png);
	width:550px;
	height:20px;
	background-position:0px 20px;
	background-repeat:repeat-y;
	float:left;
}

/* message area */
#message{
	background-image:url(../images/contents/top/message.png);
	width:604px;
	height:241px;
	margin:0px auto;
/*	margin-top:10px;	*/
}

#message .text{
	display:block;
	position:relative;
	margin-left:100px;
	top:80px;
	width:470px;
	text-align:left;
}

/* information */
#information{
	width:620px;
	text-align:left;
	margin:0px auto;
}

#information div.date{
	display:inline;
	width:100px;
	margin-left:20px;
	float:left;
	border-bottom:1px solid #CCCCCC;
}

#information div.content{
	width:450px;
	float:left;
	border-bottom:1px solid #CCCCCC;
}

/* update */
#update{
	width:620px;
	text-align:left;
	margin:0px auto;
}

#update .row{
	border-bottom:1px solid #CCCCCC;
	margin-left:20px;
	width:590px;
}

#update div.date{
	display:inline;
	width:100px;
	float:left;
}

#update div.content{
	width:450px;
	float:left;
}

/* new articles of the blog */
#blog_new{
	width:620px;
	text-align:left;
	margin:0px auto;
}

#blog_new table{
	width:550px;
	margin-left:20px;
	border-collapse:collapse;
	border:none;
}

#blog_new table th, #blog_new table td{
	padding:0px;
}

#blog_new td.date{
	width:150px;
	border-bottom:1px solid #CCCCCC;
}

#blog_new td.author{
	width:100px;
	border-bottom:1px solid #CCCCCC;
}

#blog_new td.content{
	width:300px;
	border-bottom:1px solid #CCCCCC;
}

#blog_new div.link{
	width:620px;
	text-align:right;
	margin:10px 0px;
}

/* recent works */
#recent_works{
	width:645px;
	text-align:left;
	margin:0px auto;
}

#recent_works div.content{
	width:630px;
	margin-top:10px;
	margin-left:10px;
}

#recent_works div.content div.work{
	margin:5px;
	float:left;
	font-size:9pt;
	text-align:center;
	width:450px;
}

#recent_works div.content div.work a{
	float:left;
	margin:5px;
	border:1px solid #CCCCCC;
}

#recent_works div.content img.more{
	margin-top:80px;
	margin-left:30px;
	float:left;
}

/* option */
#option{
	width:645px;
	text-align:center;
	margin:0px auto;
}

#option div.content{
	width:460px;
	margin:0px auto;
}

#option a{
	display:block;
	width:140px;
	height:90px;
	margin:5px;
	float:left;
}

a#g_map{
	background-image:url(../images/banner/ban210_gmap.png);
}

a#favicon{
	background-image:url(../images/banner/ban_favi.png);
}

a#slideshow{
	background-image:url(../images/banner/ban210_sshow.png);
}

a#g_map:hover, a#favicon:hover, a#slideshow:hover{
	background-position:0px -90px;
}


/* contact */
#contact{
	position:relative;
	background-image:url(../images/contents/top/contact.png);
	width:265px;
	height:210px;
	margin:0px auto;
	margin-top:12px;
}

#contact .btn_pos{
	position:relative;
	top:68px;
	margin-left:73px;
}

#contact a{
	display:block;
	background-image:url(../images/contents/top/contact_btn.png);
	height:50px;
	width:183px;
}

#contact a:hover{
	background-position:0px -50px;
}


#start{
	
}

/* blog banner */
#area2 div.banner{
	border-top:#CCCCCC dotted 1px;
	width:280px;
}

#area2 div.banner img{
	margin:5px 0px;
}

a#blog{
	display:block;
	background-image:url(../images/base/blog_ban.png);
	width:155px;
	height:78px;
	background-position:-5px -5px;
}

a#blog:hover{
}

/* links area */
#area2 div.links{
}

#area2 div.links .title{
	font-weight:bold;
	color:#FF0000;
}

#area2 div.links .cell{
}


/* あと○つ */
img.last{
	position:absolute;
	left:190px;
	top:-20px;
}


/* Big banner for 10000 yen plan */
a#bigbanner_10000{
	display:block;
	background-image:url(../images/contents/top/10000_big_banner.png);
	width:605px;
	height:150px;
	margin:0px auto;
/*	margin-top:10px;	*/
}

a#bigbanner_10000:hover{
	background-position:0px 150px;
}

/* artile list */
#articles
{
	border-top:1px dotted #CCCCCC;
	padding:20px 0px;
}
