@import url(common.css);
#content{
}
body{
}

#header_wrapper,
#contents_wrapper{
}
#header_wrapper{
	width: 970px;
	margin: auto;
	background: url(../images/portal/bg_top.jpg) 0 -1px no-repeat;
}
#header{
	background: url(../images/portal/nav_header.jpg) 9px 63px no-repeat;
	height: 125px;
	position:relative;
}

#header h1{
	margin-left: 14px;
}
#header ul#header_menu{
	position: absolute;
	top: 63px;
	left: 296px;
	width: 664px;
}
#header ul#header_menu li{
	display:block;
	float:left;
}
#header ul#header_menu li a{
	background: #F7FAFF url(../images/portal/nav_header.jpg) 0 0 no-repeat;
	display:block;
	width: 132px;
	height: 65px;
	border-left: 1px solid #fff;
}
#header ul#header_menu li#hdr_introduction a{
	background-position: -295px 0;
}
#header ul#header_menu li#hdr_introduction a:hover{
	background-position: -295px -65px;
}
#header ul#header_menu li#hdr_features a{
	background-position: -425px 0;
}
#header ul#header_menu li#hdr_features a:hover{
	background-position: -425px -65px;
}
#header ul#header_menu li#hdr_questions a{
	width: 131px;
	background-position: -816px 0;
}
#header ul#header_menu li#hdr_questions a:hover{
	width: 131px;
	background-position: -816px -65px;
}
#header ul#header_menu li#hdr_casestudy a{
	background-position: -557px 0;
}
#header ul#header_menu li#hdr_casestudy a:hover{
	background-position: -557px -65px;
}
#header ul#header_menu li#hdr_download a{
	background-position: -687px 0;
}
#header ul#header_menu li#hdr_download a:hover{
	background-position: -687px -65px;
}
#catch{
	background: #F7FAFF url(../images/portal/catch_bg.jpg) 0 0 no-repeat;
	width: 950px;
	height: 364px;
	margin: auto;
}
#catch #text{
	color: #444;
	font-size: 95%;
}
#box_features li{
	width: 299px;
	height: 188px;
	display:block;
	float: left;
	background: #F7FAFF url(../images/portal/feature_bg.jpg) 0 0 no-repeat;
}

#header #main_menu li{
	display: block;
	float:left;
	text-align: center;
}
#header #main_menu li span{
	display: block;
	position: relative;
	top: 8px;
	width: 108px;
	height: 28px;
}
#header #main_menu li.active{
	background-color: #F7FAFF;
	border-bottom:1px solid #F7FAFF;
	border-left: 1px solid #AACBEE;
	border-right: 1px solid #AACBEE;
}
#header #sub_menu{
	background-color: #F7FAFF;
	height: 30px;
	padding: 0 0 0 4px;
	border-bottom: 1px solid #AACBEE;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
}
#header #sub_menu li{
	float:left;
	width: 108px;
	height: 28px;
	text-align:center;
}
#header #sub_menu li.active{
	background: #F7FAFF url(../images/home/sub_bg.gif) 4px 4px no-repeat;
}
#header #sub_menu li span{
	display: block;
	position: relative;
	top: 8px;
}
#header a:link { color: #07519A; font-weight:bold; text-decoration:none; } 
#header a:visited { color: #07519A; font-weight:bold;text-decoration:none; } 
#header a:hover { color: #07519A; font-weight:bold;text-decoration:underline; } 
#header a:active { color: red; } 

#header #sub_menu li.active a:link { color: #fff; font-weight:bold; text-decoration:none; } 
#header #sub_menu li.active a:visited { color: #fff; font-weight:bold;text-decoration:none; } 
#header #sub_menu li.active a:hover { color: #fff; font-weight:bold;text-decoration:underline; } 
#header #sub_menu li.active a:active { color: red; } 

#movie{
	width: 407px;
	height: 330px;
	background-color: #FFF;
	margin: 16px!important;
	margin: 12px;
	float:left;
}
#top_menu{
	float: right;
	margin:16px 32px 16px 16px!important;
	margin:16px 16px 16px 16px;
}
#top_menu li{
	font-size: 90%;
	float:left;
	display:block;
	margin-top: 16px;
}
#top_menu li a{
	display:block;
	background: #F7FAFF url(../images/portal/nav_top.png) 0 0 no-repeat;
}
#top_menu li#top_home a{
	width: 30px;
	height: 10px;
	background-position: 0 0;
	margin-right: 8px;
}
#top_menu li#top_qa a{
	width: 63px;
	height: 10px;
	background-position: -44px 0;
	margin-right: 8px;
}
#top_menu li#top_privacy a{
	width: 105px;
	height: 10px;
	background-position: -120px 0;
	margin-right: 8px;
}
#top_menu li#top_news a{
	width: 55px;
	height: 10px;
	background-position: -36px 0;
	margin-right: 8px;
}
#top_menu li#top_contact{
	margin-top: 8px;
}
#top_menu li#top_contact a{
	background: #F7FAFF url(../images/portal/btn_contact.png) 0 0 no-repeat;
	width: 120px;
	height: 24px;
}
#top_menu li a:hover{
}
#top_menu li#top_contact a:hover{
	background-position: 0 -24px;
	height: 24px!important;
}
#catch #description{
	position:relative;
	width: 494px;
	float:left;
	margin: 16px 0 16px 0;
	height: 332px;
}
#description .button a{
	background: #F7FAFF url(../images/portal/btn_download_big.png) 0 0 no-repeat;
	width: 310px;
	height: 53px;
	display: block;
	position:absolute;
	bottom:0;
	right:0;
}
#description h2{
	position:absolute;
	top:-12px;
	left:4px;
	z-index:1000;
}
#description #text{
	background-color:#F9FBFE;
	padding: 16px;
	position:absolute;
	top:114px;
	left:0;
	height: 124px;
}
#description .button a:hover{
	background-position: 0 -53px;
}
textarea.privacy{
	width: 90%;
	height: 100px;
	display: block;
	margin: auto;
	font-size:80%;
}
textarea#text_body{
	width: 480px;
	height: 120px;
}
table.form,
table.list{
	border-top: 1px solid #ddd;
	border-left: none;
	width: 95%;
	margin:16px auto 0 auto;
	font-size: 85%;
	margin-bottom: 16px;
}
table.list td,
table.list th,
table.form td,
table.form th{
	border-bottom: 1px solid #ddd;
	padding: 8px;
}
table.list th,
table.form th{
	background-color: #f3f3f3;
}
table.list li{
	background: #FFF url(../images/portal/arrow_02-trans.png) no-repeat 4px 4px;
	padding-left: 14px;
}
table tr.odd{
	background-color: #f3f3f3;
}
input.submit{
	clear: both;
	display: block;
	margin:16px auto 0 auto;
}

#contents_wrapper{
	margin: auto;
	width: 970px;
	background: #FFF url(../images/portal/bg_middle.jpg) repeat-y 1px 0;
}
#box_features{
	margin-left: 7px;
	width:100%!important:
	width:auto;
}
#box_features li{
	margin-right: 7px;
	position:relative;
	font-size: 95%;
}
#box_features li#feature3{
	margin:0;
	float: right;
}
#box_features li .hdr{
	display: block;
	position:relative;
	top: 12px;
	left: 12px;
}
#box_features li .ttl{
	position:absolute;
	top: 19px;
	left: 72px;
}
#box_features .button a{
	background: #F7FAFF url(../images/portal/btn_detail.png) 0 0 no-repeat;
	width: 110px;
	height: 24px;
	display: block;
	position:absolute;
	right:12px;
	bottom:12px;
}
#box_features .button a:hover{
	background-position: 0 -24px;
}
#box_features p{
	position:absolute;
	right:16px;
	top:70px;
	width: 105px;
}
#box_features .capture{
	background-color:#FFF;
	position:absolute;
	top:72px;
	left:12px;
	width: 150px;
	height:100px;
}
h3{
	margin-bottom: 12px;
}
.section2{
	width: 450px;
	float:left;
	margin:16px 0 16px 16px;
}
.end{
	float:right;
	margin:16px 0;
}
.news li{
	padding-left: 16px;
	margin-bottom: 4px;
	margin-left: 12px;
	font-size: 94%;
	background: #FFF url(../images/portal/list_header.png) 0 0 no-repeat;
}
#contact_box_wrapper{
	background: #FFF url(../images/portal/contact_bg.png) 0 0 no-repeat;
	width: 443px;
	height: 77px;
}
#contact_box{
	padding: 16px;
	font-size: 90%;
}
#contact_box div{
	float: left;
	width : 150px;
	color: #555;
	margin-right: 4px;
	margin-top: 8px;
}
#contact_box ul{
	float: right;
	width: 252px;
	margin-top: 2px;
}
#contact_box ul li,
ul#btn_link li{
	float:left;
	margin-right: 8px;
}
#contact_box ul li.end{
	margin: 0;
}
li#btn_download a{
	background: #F7FAFF url(../images/portal/btn_download.png) 0 0 no-repeat;
	width: 120px;
	height: 24px;
	display: block;
}
#contact_box li#btn_contact a,
#main li#btn_contact a{
	background: #F7FAFF url(../images/portal/btn_contact.png) 0 0 no-repeat;
	width: 120px;
	height: 24px;
	display: block;
}
#contact_box li#btn_contact a:hover,
#contact_box li#btn_download a:hover
#main li#btn_contact a:hover,
#main li#btn_download a:hover{
	background-position: 0 -24px!important;
}

#footer{
	margin: auto;
	width: 968px;
	background: #FFF url(../images/portal/bg_bottom.jpg) 0 0 no-repeat;
	padding-top: 32px;
	font-size: 90%;
	text-align:center;
    margin-bottom: 16px;
}
#footer ul{
    margin-top: 4px;
}
#footer li{
    display:inline;
}
#nav_top{
	background: #F7FAFF url(../images/portal/sub_top.png) 0 0 no-repeat;
	width: 204px;
	height: 3px;
	font-size:0;
}
#nav_bottom{
	background: #F7FAFF url(../images/portal/sub_bottom.png) 0 0 no-repeat;
	width: 204px;
	height: 8px;
	font-size:0;
}
#navigation #lnk_contact a{
	background: #F7FAFF url(../images/portal/sub_top.png) 0 0 no-repeat;
	width: 194px;
	height: 35px;
	display:block;
}
#sub {
	width: 204px;
	float:left;
	margin-left: 24px!important;
	margin-left: 12px;
}
#content{
	margin-top: 12px;
}
#main{
	width: 692px;
	margin-right: 24px!important;
	margin-right: 12px;
	float:right;
}
div.fyi{
	background: #fff url(../images/portal/fyi_bg.png) 0 0;
	padding: 16px;
	margin: 16px 16px 0 16px;
	font-size:90%;
	border:1px solid #f3f3f3;
}
ul.fyi{
	font-size: 95%;
	margin: 16px;
}
input.text{
	width: 360px;
}
input.lfname,
input.tel,
input.lfname_kana{
	width: 120px;
}
input.email{
	width: 240px;
}
#nav_middle a{
	background-position: 0 -35px;
	background-repeat: no-repeat;
	width: 204px;
	height: 35px;
	display: block;
}
#nav_middle li a:hover{
	background-position: 0 -70px!important;
}
#nav_middle .selected a{
	background-position: 0 0;
}
#alert{
	border:1px solid #ccc;
	font-size:80%;
	margin:16px auto 0 auto;
	width: 95%;
}
#alert_msg{
	background:url(../images/home/alert.gif) #FAFAFA 8px 6px no-repeat;
	border-bottom:1px solid #ccc;
	color: #FF0000;
	padding: 8px 8px 8px 30px;
}
#alert ul{
	padding: 8px;
}
#sub #contact{
	background:url(../images/portal/contact_bg.jpg) #FAFAFA 0 0 no-repeat;
	width: 202px;
	height: 160px;
	position: relatvie;
	margin-top: 14px;
}
#sub #btn_contact a{
	background: #F7FAFF url(../images/portal/btn_contact.png) 0 0 no-repeat;
	width: 120px;
	height: 24px;
	display: block;
	position: relative;
	top: 43px;
	left: 40px;
}
#sub #btn_download a{
	background:url(../images/portal/btn_download2.jpg) #FFF 0 0 no-repeat;
	width: 170px;
	height: 29px;
	display: block;
	position: relative;
	top: 93px;
	left: 15px;
}
#main ul.news{
	margin-top: 16px;
}
#main ul.news li{
	margin-bottom: 32px;
}
#main ul.news li .subject{
	font-weight: bold;
}
#main h3{
	margin-top: 16px;
}
#main h3.news{
	background:url(../images/portal/h3_hdr.png) #FFF 16px 4px no-repeat;
	padding-left: 40px;
	padding-right: 40px;
	font-size: 150%;
}
#main div.text{
	margin: 0 8px 16px 16px;
}
#main .text .date{
	text-align:right;
	padding-right: 16px;
	padding-bottom: 16px;
	margin-bottom: 16px;
	background:url(../images/portal/hr.jpg) #FFF 0 bottom no-repeat;
}
.button{
	text-align:center;
}
.download{
	margin-top: 32px;
}
.message{
	margin: 16px 16px 0 16px;
}
.link{
	text-align:center;
	margin: 16px;
}
#topicpath{
	font-size: 90%;
	padding: 8px 16px 0 16px;
	margin-left: 12px;
}
ul#heatmap li,
ul#usr li{
	display: block;
	float: left;
	width: 214px;
	margin-right: 8px;
}

ul#heatmap li,
ul#usr li{
	font-size: 90%;
	color: #555;
}
ul#heatmap li.end,
ul#usr li.end{
	margin: 0;
}
ul#heatmap h4,
ul#usr h4{
	text-align:center;
	text-decoration:underline;
	padding: 4px;
}
#flow dt{
	width: 224px;
	height: 80px;
	float:left;
	background:url(../images/portal/icn_arrow.jpg) #FFF 0 bottom no-repeat;
}
#flow dt.end,
#flow dd.end{
	height: 54px;
	margin-top: 0;
}
#flow dd{
	float:right;
	width: 451px;
	height: 80px;
	float:left;
	margin-left: 16px;
	background:url(../images/portal/step_bg.png) #FFF 0 0 no-repeat;
}
#flow dd span{
	display: block;
	margin: 16px;
}
#download a{
	background: #F7FAFF url(../images/portal/btn_download_big.png) 0 0 no-repeat;
	width: 310px;
	height: 53px;
	display: block;
	margin: auto;
}
#download a:hover{
	background-position: 0 -53px;
}
.section{
	background:url(../images/portal/hr.jpg) #FFF 0 bottom no-repeat;
	padding-bottom: 16px;
	margin: 0 16px;
}
.point{
	position:relative;
}
.css_image{
	float:left;
	margin-bottom: 8px;
	font-size: 80%;
	color: #ccc;
}
.css_image a{
	color: #ccc;
	text-decoration:none;
}
.css_text{
	padding: 0;
	float: left;
	width: 317px;
	line-height: 130%;
	margin-left: 16px;
}
table.vertical th{
	width: 100px;
}
#bottom,
ul.list{
	margin: 16px 16px 0 0;
	font-size: 95%;
}
ul.list{
	margin-bottom: 16px;
}
#bottom li,
ul.list li{
	padding-left: 16px;
	margin-bottom: 4px;
	margin-left: 12px;
	font-size: 94%;
	background: #FFF url(../images/portal/list_header.png) 0 0 no-repeat;
}
.more{
	text-align:right;
	font-size: 95%;
	margin-right: 8px;
	margin-top: 4px;
}
p{
	margin-bottom: 16px;
	line-height: 130%;
	color: #444;
}
ul#heatmap{
	margin-bottom: 16px;
}
.hr{
	background:url(../images/portal/hr.jpg) #FFF 0 bottom no-repeat;
	width: 670px;
	height: 10px;
}
dl.questions dt,
dl#features dt{
	text-decoration:underline;
	margin-bottom: 16px;
	font-weight: bold;
	color: #235894;
}
dl.questions dt{
	width:92%;
	margin: 0 auto 16px auto;
}
dl.questions dd,
dl#features dd{
	border: 1px solid #ccc;
	padding: 8px;
	width:90%;
	margin: 0 auto 16px auto;
}

p.end{
	margin: 0;
}
/* casestudy */
.casestudy{
	margin-top: 16px;
}
.casestudy .capture{
	float: left;
	width: 210px;
}
.casestudy .text{
	float: left;
	width: 426px;
	margin: 0;
}
.casestudy .text .info{
	float:left;
	width: 260px;
}
.casestudy .text img.logo{
	float:right;
	display: block;
}
.casestudy .company,
.casestudy .url{
	font-size: 90%;
}
.casestudy h3{
	font-size: 120%;
	margin: 0 0 8px 0!important;
}
.casestudy .description{
	background: #fff url(../images/portal/fyi_bg.png) 0 0;
	padding: 8px 8px 0 8px;
	margin: 8px 0 0 0;
	font-size:90%;
	border:1px solid #f3f3f3;
}
.casestudy strong{
	background: none;
	font-weight: bold;
}

.heatmap_capture{
	float:left;
	margin: 8px 4px 8px 0;
}
.end{
	margin: 8px 0;
}

.user_capture{
	float: left;
	width: 300px;
}
#casestudy .logo {
	display :block;
	float: left;
	margin: 0 16px 0 8px;
}
#casestudy .company_info{
	float:left;
	width: 180px;
	font-size: 90%;
	margin-top: 8px;
}
#casestudy .description{
	celar: both;
	margin-top: 16px;
}
#casestudy .text{
	width:370px;
	float:left;
	margin: 16px 0 0 16px!important;
}
#casestudy .img{
	width:258px;
	float:right;
}
#casestudy p{
	font-size: 98%;
	line-height: 125%;
}
.user_capture{
	border: 1px solid #ccc;
	width:256px;
	margin-top: 16px;
}
.user_capture img{
	display: block;
	margin: 8px;
}
#casestudy .caption{
	text-align:center;
	margin-bottom: 8px;
	color: #666;
}
#casestudy h5{
	border-left: 5px solid #1F6F3A;
	padding: 4px 10px;
	margin-top: 16px;
}
#casestudy_box h3{
	margin:0!important;
}
#casestudy img.course{
	diaplay:block;
	margin-top: 16px;
}
#casestudy .section{
	background:none;
}
#casestudy_box #bandai_new a{
	background: #fff url(../images/portal/bandai_new.jpg) 0 0;
	width:225px;
	height:87px;
	display: block;
}
#casestudy_box #benesse_new a{
	background: #fff url(../images/portal/benesse_new.jpg) 0 0;
	width:225px;
	height:87px;
	display: block;
}
#casestudy_box li{
	position:relative;
	float:left;
}
#casestudy_box ul{
	margin-bottom: 16px;
}
#casestudy_box .name{
	position:absolute;
	bottom: 8px;
	text-align:center;
	width: 220px;
	font-size: 90%;
}
#news li{
	background:url(../images/portal/list_header.png) #FFF 2px 0 no-repeat;
	margin-bottom: 12px;
	padding-left:18px;
	font-size: 90%;
	width: 400px;
}
.text dl{
	margin :8px;
}
.text dd{
	margin :16px;
}
.text dt{
	font-size: 94%;
	font-weight:bold;
}

.text p{
	margin :8px;
	line-height: 130%;
	font-size: 94%;
}
.text h5{
	color: #4D8DD5;
	font-size: 96%;
}
.top_content{
	padding: 16px 36px 16px 16px;
	margin-top: 0!important;
}
#id_shellfish,
#id_bivalves{
	position: absolute;
	top: 0; left: 0;
	z-index:0;
}