@charset "utf-8";

/*

	*01 リセット
	*02 link
	*03 base
	*04 ヘッダー
	*05 ナビゲーション
	*06 レイアウト
	*07 サイドメニュー
	*08 Top
	*09 フッター
	*00 clearfix

*/



/*-------------------------------------------------------------------------

	　*01 リセット
	
---------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	margin: 0px;
	padding: 0px;
	font-weight: bold;
	clear:both;
}

p, hr, blockquote, address, noscript {
	margin: 0px;
	padding: 0px;
	font-style: normal;
	font-weight: normal;
	border: none;
}

ul, li , ol, dl, dt, dd , pre, table, form {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

img {
	border: none;
}

em, strong , q, dfn, code, samp, kbd, var, cite, abbr, acronym {
	margin: 0px;
	padding: 0px;
	font-style: normal;
	font-weight: normal;
}

hr {
	height: 0px;
	border: none;
	margin: 0.5em auto 0.5em auto;
	-moz-float-edge: margin-box;
	-moz-box-sizing: border-box;
	clear: both;
	display: none;
}

ul img, dl img, ol img, object, embed {
	vertical-align: bottom;
}

.mgt10 {	margin-top: 10px; }
.mgt20 {	margin-top: 20px; }
.mgt30 {	margin-top: 30px; }
.mgt40 {	margin-top: 40px; }
.mgt50 {	margin-top: 50px; }


/*-------------------------------------------------------------------------

	*02 link
	
---------------------------------------------------------------------------*/

a:link,
a:visited {
	color: #535353;
	text-decoration: none;
	outline:none;
}

a:hover,
a:active {
	color: #1057d8;
	text-decoration: underline;
	outline:none;
}

#footer dd.about ul li a:link,
#footer dd.about ul li a:visited {
	color:#FFFFFF;
	text-decoration: none;
 }


#footer dd.about ul li a:hover,
#footer dd.about ul li a:active {
	color:#FFFFFF;
	text-decoration: underline;
 }

.linkBox {
	cursor: pointer;
}

/*-------------------------------------------------------------------------

	　*03 base

---------------------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	text-decoration: none;
}

body {
	font-size: 12px;
	_font-size: 75%;
	line-height: 1.5;
	color: #747474;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	margin: 0px;
/*	background: url(/img/common/second-bk.jpg) repeat-x center top;*/
	background: url(/img/common/second-bk2.gif) repeat-x left top;
}

*:first-child+html body { font-size: 75% } 


body#Error {
	background: url(/img/common/line-top.gif) repeat-x left top;
}

body#Top {
	background: url(/img/top/key-bk.gif) repeat-x left top;
}

h2 {
	font-size:16px;
	line-height:1.4;
}

p { margin-bottom:1em;}

.path {
	font-size:12px;
	padding-top:10px;
	margin-bottom: 3em;
}

h4.check {
	background: url(/img/common/h4-check.gif) no-repeat left bottom;
	padding-left:26px;
	padding-bottom:5px;
	margin-left:20px;
	margin-bottom:10px;
	font-size: 100%}

h5 {
	margin-left:20px;
}

/*-------------------------------------------------------------------------

	　*04 ヘッダー

---------------------------------------------------------------------------*/

#header { 
	width:985px;
	position:relative;
	margin:0 auto;
	text-align:center;
	height:99px;}


#header .logo {
	position: absolute;
	top: 25px;
	left:0;
	text-align:left;
}

p.outlink {
	position: absolute;
	top: 15px;
	left: 630px;
	font-size:10px;
}

body#Top p.outlink {
	position: absolute;
	top: 15px;
	left: 640px;
	font-size:10px;
}

p.outlink img {}

ul.subnavi {
	margin: 0px;
	position: absolute;
	top: 63px;
	left: 603px;
}

body#Top ul.subnavi {
	margin: 0px;
	position: absolute;
	top: 63px;
	left: 618px;
}

ul.subnavi li {
	list-style-type: none;
	float: left;
	overflow:hidden;
	_zoom: 1;
}

ul.subnavi li a {
	display: block;
	text-indent: -5000px;
	height: 28px;
	background-repeat: no-repeat;
}


ul.subnavi li.list a {
	background: url(/img/common/sub-navi.gif) no-repeat left top;
	width: 230px;
}
ul.subnavi li.contact a {
	background: url(/img/common/sub-navi.gif) no-repeat -230px top;
	width: 130px;
}

ul.subnavi li.list a:hover, 
ul.subnavi li.list a.selected {	background-position: left -28px;}
ul.subnavi li.contact a:hover, 
ul.subnavi li.contact a.selected {	background-position: -230px -28px;}



/*-------------------------------------------------------------------------

	　*05 ナビゲーション

---------------------------------------------------------------------------*/

body#Top .key { margin:0px auto 0px auto;
	text-align:center;
	clear:both;
	position:relative;
}
body#Top #vi p{
	margin: 0;
}
body#Top .exBtn {
	position: absolute;
	left:43px;
	top:138px;
}
#gnavi {
	margin:0 auto;
	text-align:center;
	position:relative;
}


ul#gnavi {
	width:985px;
	margin:0 auto 25px auto;
}

ul#gnavi li {
	list-style-type: none;
	float: left;
}

ul#gnavi li a {
	display: block;
	text-indent: -5000px;
	height: 74px;
	_height: 74px;
	background-repeat: no-repeat;
}

body.whats #gnavi ul li.whats a,
body.line #gnavi ul li.line a,
body.enjoy #gnavi ul li.enjoy a,
body.fare #gnavi ul li.fare a{	background-position: 0px -72px;}

ul#gnavi li.cat_ex a {
	background: url(/img/top/navi.gif) no-repeat left top;
	width: 257px;
}

ul#gnavi li.mypage a {
	background: url(/img/top/navi.gif) no-repeat -257px top;
	width: 234px;
}
ul#gnavi li.g_answer a {
	background: url(/img/top/navi.gif) no-repeat -491px top;
	width: 234px;
}
ul#gnavi li.other a {
	background: url(/img/top/navi.gif) no-repeat -725px top;
	width: 260px;
}

ul#gnavi li.cat_ex a:hover,
ul#gnavi li.cat_ex a.selected { background: url(/img/top/navi_on.gif) no-repeat left top;}

ul#gnavi li.mypage a:hover,
ul#gnavi li.mypage a.selected { background: url(/img/top/navi_on.gif) no-repeat -257px top;}

ul#gnavi li.g_answer a:hover,
ul#gnavi li.g_answer a.selected { background: url(/img/top/navi_on.gif) no-repeat -491px top;}

ul#gnavi li.other a:hover,
ul#gnavi li.other a.selected { background: url(/img/top/navi_on.gif) no-repeat -725px top;}


/*-------------------------------------------------------------------------

	　*06 レイアウト

---------------------------------------------------------------------------*/
#wrap { 
	width:936px;
	margin:0 auto;
	text-align:left;
	padding-top:0px;
	padding-left:3px;
	clear:both;
}

#Top #wrap { 
	width:936px;
	margin:0 auto;
	text-align:left;
	padding-top:0px;
	padding-left:0px;
	clear:both;}

.contents { 
	letter-spacing:0.05em;
	float:left;
	clear:left;
	text-align:left;
	width:690px;
	margin-left:0px;
	position:relative;
	padding-left:0px;
	_padding-left:0px;
	padding-top:10px;
}

#Top .contents { 
	letter-spacing:0.06em;
	text-align:left;
	width:700px;
	margin-left:8px;
	padding-left:0;
	padding-top:0px;
	}

#Error .contents { 
	letter-spacing:0.06em;
	text-align:left;
	width:900px;
	margin-left:8px;
	padding-left:0;
	padding-top:0px;
	}


.box-left {
	float:right;
	width: 210px;
	text-align:left;
	}

.bnr-area {
	background:#e2e2e2;
	}

.bnr-area ul {
	margin:0px 10px 10px 10px;
	padding-top:11px;
	}

.bnr-area ul li { 
	list-style-type:none;
	margin-bottom:8px;
}


h3 { margin-bottom:12px;}
h4 { margin-bottom:12px; margin-top:10px;}
h5 { margin-bottom:10px; margin-top:0px; color:#535353; font-size:100%;}
#Service h5 { font-size:12px; margin-left:18px; margin-bottom:7px;}
.font-s { font-size:10px; _font-size:84%;}


h2#topics { margin-bottom:5px; margin-top:30px;}


/*-------------------------------------------------------------------------

	　*07 サイドメニュー

---------------------------------------------------------------------------*/

#menu-box {
	float:right;
	width: 210px;
	text-align:left;
	padding-top:20px;
}

#menu-box dl {
	margin:0px 0px 12px 0px;
	padding:0 0 7px 0;
	line-height:2.0em;
}
#menu-box #side-a{ margin-bottom:10px;}
#menu-box #side-a dl { margin-bottom:0;}

#menu-box dl dd, 
#menu-box dl dt { 
	list-style-type:none;
	margin-bottom:0px;
	}
 
#accordion {
	margin-bottom:0px;
	/* border-bottom:2px #589683 solid; */
	}

img.ttl-bt { margin-bottom:0px;}

#accordion dl {
	margin:0px 0px 0px 0px;
	padding:0 0 0px 0;
	line-height:2.0em;
	font-size:12px;
}

#accordion dt { margin-top:5px; cursor:pointer; }
#accordion dt:hover {}
#accordion dd { overflow:hidden; background:#fff;}
#accordion span { display:block; border-top:none; padding:15px;}
#accordion dl dd,
#accordion dl dt { 
	list-style-type:none;
	margin:0px;
	padding:0;
	display:block;
	}
		
#accordion dl dt#slider1,
#accordion dl dt#slider2,
#accordion dl dt#slider3,
#accordion dl dt#sliderOther
 { margin-top:0px; cursor:pointer; display: block; text-indent: -5000px; width: 210px; height:52px; }
#accordion dl dt#sliderOther {
 height:54px;
}

#accordion #sliderI-PLAT,
#accordion #sliderCat,
#accordion #sliderEx,
#accordion #sliderMypage,
#accordion #sliderGanswer {
	 width: 210px;
	 text-indent: -5000px;
}
#accordion #sliderI-PLAT a,
#accordion #sliderCat a,
#accordion #sliderEx a,
#accordion #sliderMypage a,
#accordion #sliderGanswer a {
	cursor:pointer;
	display: block;
	width: 210px;
}

#accordion #sliderI-PLAT a,
#accordion #sliderCat a,
#accordion #sliderEx a {
	height: 50px;
}
#accordion #sliderMypage a {
	height: 51px;
}
#accordion #sliderGanswer a {
	height: 53px;
}


#accordion #sliderI-PLAT {background: url(/img/common/m-s-i-plat.gif) no-repeat left top;}
#accordion #sliderI-PLAT:hover {background: url(/img/common/m-s-i-plat_on.gif) no-repeat left top;}

#accordion #sliderCat {background: url(/img/common/m-s-cat.gif) no-repeat left top;}
#accordion #sliderCat:hover {background: url(/img/common/m-s-cat_on.gif) no-repeat left top;}

#accordion #sliderEx {background: url(/img/common/m-s-cat-ex.gif) no-repeat left top;}
#accordion #sliderEx:hover {background: url(/img/common/m-s-cat-ex_on.gif) no-repeat left top;}

#accordion #sliderMypage {background: url(/img/common/m-s-mypage.gif) no-repeat left top;}
#accordion #sliderMypage:hover {background: url(/img/common/m-s-mypage_on.gif) no-repeat left top;}

#accordion #sliderGanswer {background: url(/img/common/m-s-g_answer.gif) no-repeat left top;}
#accordion #sliderGanswer:hover {background: url(/img/common/m-s-g_answer_on.gif) no-repeat left top;}



#accordion dd { overflow:hidden; background:#fff;}

#accordion dl#slider0 dd { height:0; margin-bottom:0;}

#accordion dl dt#slider1 { background: url(/img/common/m-s-cloud1.jpg) no-repeat left top;}

#accordion dl dt#slider1.open,#accordion dl dt#slider1:hover { background: url(/img/common/m-s-cloud1_on.jpg) no-repeat left top;}

#accordion dl dt#slider2 { background: url(/img/common/m-s-cloud2.jpg) no-repeat left top;}

#accordion dl dt#slider2:hover,#accordion dl dt#slider2.open { background: url(/img/common/m-s-cloud2_on.jpg) no-repeat left top;}

#accordion dl dt#slider3 { background: url(/img/common/m-s-on-premise.jpg) no-repeat left top;}

#accordion dl dt#slider3.open,#accordion dl dt#slider3:hover { background: url(/img/common/m-s-on-premise_on.jpg) no-repeat left top;}


#accordion dl dt#sliderOther { background: url(/img/common/m-s-g_other.gif) no-repeat left top;}
#accordion dl dt#sliderOther.open,#accordion dl dt#sliderOther:hover { background: url(/img/common/m-s-g_other_on.gif) no-repeat left top;}


#accordion dl ul { margin-bottom:0px;}

#accordion dl ul li { 
	background: url(/img/common/icon-arrow.gif) no-repeat 26px 16px;
	border-bottom:#999999 1px dotted;
	border-right:1px solid #dbdbdc;
	border-left:1px solid #dbdbdc;
	padding:7px 10px 7px 38px;
	display:block;
	}


#accordion dl ul li a { display:block;}

#accordion dl ul li:hover { 
	display:block;
	background-color:#dde9fc;
	/* font-weight:bold; */
	display:block;
}
/*
#accordion dl ul li.on-premise:hover { 
	display:block;
	background-color:#FFF;
	display:block;
}
*/
#accordion dl ul ul li:hover { 
	display:block;
	background-color:#c5d8f7;
	/* font-weight:bold; */
	display:block;
}

#accordion dl ul li.end { 
	margin-bottom:0px;
	border-bottom:none;
	padding:7px 10px 7px 38px;
	_padding:7px 10px 0px 38px;
}


/* active */
body.crm #accordion dl ul li.crm,
body.crm #accordion dl ul li.mypage,
body.customer #accordion dl ul li.customer,
body.idp #accordion dl ul li.idp,
body.web_sol #accordion dl ul li.web_sol,
body.monitoring #accordion dl ul li.monitoring,
body.business_support #accordion dl ul li.business_support,
body.tiiki #accordion dl ul li.tiiki,
body.bai #accordion dl ul li.bai,
body.on-premise #accordion dl ul li.on-premise,
body.consulting #accordion dl ul li.consulting {
	font-weight:bold;
	background-color:#dde9fc;
}

#accordion dl ul ul li { 
	background: url(/img/common/icon-arrow.gif) no-repeat 5px 12px;
	border-top:#999999 1px dotted;
	border-bottom:none;
	border-right:none;
	border-left:none;
	padding:2px 10px 2px 17px;
	margin-right:-10px;
	/*
	padding:2px 10px 2px 50px;
	margin:0 -10px 0 -38px;
	*/
	display:block;
	}
body.catmanager-ex #accordion dl ul li.on-premise,
body.g-answer-navi #accordion dl ul li.on-premise {
	background-color:#dde9fc;
}
body.catmanager-ex #accordion dl ul li.catmanager-ex,
body.g-answer-navi #accordion dl ul li.g-answer-navi {
	font-weight:bold;
	background-color:#c5d8f7;
}

#side-b dl dt { margin-bottom:0px; clear:both;}
#side-b dl dt img { margin-bottom:0px;}
#side-b dl dd { margin-bottom:0px; text-align:center;}
#side-b dl dd img { margin-bottom:8px; text-align:center;}
#side-b dl dt.company img { margin-top:25px; }
#side-b dl dd.company img { margin-bottom:35px; }



.m-other { background:#fff; padding:30px 0px 20px 10px;}
.m-other-naka { background:#fff; padding:10px 0px 20px 10px;}

#customer {
	margin-top:15px;
	padding:12px 12px 0;
	border:solid 1px #CCC;
	font-size:10px;
}
/*
#customer {
	padding-top:15px;
 background:#FFF;
	font-size:10px;
}
#customer .inner {
	padding:12px 12px 10px;
	border:solid 1px #CCC;
}
*/
#customer .photo {
	float:left;
	clear:left;
}
#Top #customer dl,
#menu-box #customer dl {
	margin:0 0 0 70px;
	padding:0;
	line-height:1.4;
}
#customer .linkBox {
	margin-bottom:10px;
}
#customer .linkBox:hover {
	background:#eaf4fb;
}

/*-------------------------------------------------------------------------

	　*08 Top

---------------------------------------------------------------------------*/
#vi {
	position:relative;
	width:985px;
	margin:0 auto;
}
#contact {
	position:absolute;
	right:42px;
	top:48px;
}
#btn-contact {
	position:absolute;
	left:65px;
	bottom:23px;
}
#ticker {
	position:relative;
	width:687px;
	height:31px;
	margin-bottom:40px;
	background:url(/img/top/bg_ticker.gif) no-repeat left center;
	overflow:hidden;
	_zoom:1;
}
#ticker ul {
	margin-left:60px;
}
#ticker li {
	height:31px;
	line-height:32px;
}
#ticker .start {
	font-weight:bold;
	color: #F68C00;
}
#ticker .new a {
	float:left\9;
}
.tickerTtl {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
}
.tickerBtn {
	position:absolute;
	top:5px;
	right:5px;
	z-index:1;
}
h2#solution { margin-bottom:30px;}
h2#topics { margin-bottom:10px;}
#Top h4 {
	background:none;
	padding:0;
	margin-left:0;
	border:none;
}
.box-main {
	clear:both;
	background:url(/img/top/bg_cat_cloud.jpg) no-repeat left top;
/*	background:url(/img/top/bg_cat_cloud.gif) no-repeat left top;*/

	width:685px;
	height:160px;
/*	height:180px;*/
	overflow:visible;
	margin-bottom:30px;
	border: solid 1px #ccc;
	position:relative;
}
.box-main p {
	margin-bottom:5px;
}
.box-main .cat_cloud {
	width:370px;
/*	width:260px;*/
	margin:25px 0 0 25px;
}
.box-main .on-premise {
	margin:12px 0 10px 25px;
	_margin:8px 0 10px 25px;
	*margin:8px 0 10px 25px;
	/*position:absolute;
	left:25px;
	bottom:5px;*/
}
.box-main .link {
}
.box-main .link a {
	background:url(/img/common/icon-arrow.gif) no-repeat left 3px;
	padding-left:12px;
}

.box-mypage{
	clear:both;
/*	width:685px;*/
	width:660px;
	margin-bottom:15px;
/*	border: solid 1px #ccc;*/
}
.box-webSol {
	clear:both;
	width:685px;
	margin-bottom:15px;
	border: solid 1px #ccc;
}

.box-mypage .mypage {
	width:370px;
	margin:20px 0 0 0;
	float:left;
	position:relative;
	display:inline;
}
.box-webSol .webSol {
	width:390px;
	margin:20px 0 0 15px;
	float:left;
	display:inline;
}
.box-mypage .img {
	float:right;
}
.box-webSol .img {
	float:right;
	margin-right:10px;
}


.packageBox {
	border: 1px solid #ccc;
	padding: 20px 10px 10px 15px;
	width:660px;
	margin-bottom:50px;
}
.box-catEx {
	margin-bottom:10px;
}
.box-mypage {
	margin-bottom:30px;
}

.box-catEx,
.box-gAnswer {
	clear:both;
	width:660px;
}
.box-catEx .boxL {
	float: left;
	width: 290px;
}
.box-catEx .boxR {
	float: right;
	width: 352px;
}

.box-gAnswer .boxL {
	float: left;
	width: 450px;
}
.box-gAnswer .boxR {
	float: right;
	width: 180px;
}


#new {
	position:absolute;
	right:60px;
	top:-10px;
}
.box-second {
	margin-bottom:20px;
	clear:both;
	width:685px;
}	
.box-second .linkBox:hover {
	background:#eaf4fb;
}

	p.img { margin:0px; text-align:center;}
	.box-left	p.img { /margin:-10px 0 -5px;}

.box-second ul { margin-bottom:0px; clear:both; overflow:hidden;}

.box-second li {
	position:relative;
	float:left;
	width:333px;
	border: solid 1px #ccc;
	margin: 0 12px 12px 0;
}
.box-second div.img {
	margin:10px;
	float: left;
	display: inline;
}
ul#webSol div.txt {
	width: 400px;
}

.box-second div.txt {
	float: left;
	margin:15px 10px 0 0;
	width: 235px;
	padding-bottom: 10px;
	display: inline;
}

.box-second li p {
	margin:10px 0 0;
	line-height:160%;
}
/*
.box-second li p.link { 
	text-align:right;
	padding:0px 10px 0px 10px;
	background: url(/img/top/icon-arrow-blue.gif) no-repeat left 3px;
}
*/

img#link-service1,img#link-service2,img#link-service3,img#link-service4,img#link-service5 {
	vertical-align:bottom;
	position:absolute;
	bottom:0;
}



/* topics */
ul.list-topics {
	width:687px;
	border-bottom: solid 1px #9999a4;
}

ul.list-topics li.link {
	padding-left:20px;
	background: #FFFFFF url(/img/common/icon-olink.gif) no-repeat 10px 15px;
	padding:8px 10px 8px 28px;
}
ul.list-topics li.nlink {
	padding-left:20px;
	padding:8px 10px 8px 28px;
}

ul.list-topics li.zebla { background-color: #efeded;}

ul.list-topics li a { display:block;}


p.pagetop {
    padding: 15px 0 0px 0;
	clear:both;
}

p.pagetop:after {
    display: block;
    clear: both;
    content: " ";
}

p.pagetop a {
	margin: 30px 90px 0 0;
	_margin: 30px 45px 0 0;
	padding: 0px;
	width: 120px;
	height:18px;
	text-decoration: none;
	text-indent: -5000px;
	display: block;
	float:right;
	line-height:1em;
	background: url(/img/common/page-top.gif) no-repeat right top;
}


.contents p.pagetop {
    padding: 0px 0 0px 0;
	clear:both;
}

.contents p.pagetop:after {
    display: block;
    clear: both;
    content: " ";
}

.contents p.pagetop a {
	margin: 0px 20px 0 0;
	_margin: 0px 10px 0 0;
	padding: 0px;
	width: 120px;
	height:18px;
	text-decoration: none;
	text-indent: -5000px;
	display: block;
	float:right;
	line-height:1em;
	background: url(/img/common/page-top.gif) no-repeat right top;
}
#Top #side-a {
	margin-bottom:20px;
}

/*-------------------------------------------------------------------------

	　*09 フッター

---------------------------------------------------------------------------*/
#footer {
	background-color: #414141;
	padding:0px 0 10px 0;
	margin:10px 0 0 0;
	clear:both;
}

.wall {
	width:940px;
	margin:0px auto;
	padding:10px 0;
}

.fl { float:left; padding-top:5px;}

#footer .info {
	float:left;
	border-left:#a0a0a0 1px solid;
	border-right:#a0a0a0 1px solid;
	margin:0 20px;
	padding:20px 2px 10px 17px;
}

#footer .info ul { margin-top:20px; margin-left:14px;}
#footer .info ul li { float:left; list-style-type:none; margin-right:15px;}

#footer .about { padding-top:20px; overflow:hidden; padding-bottom:0px;}
#footer .about ul { width:150px; margin-top:10px;}
#footer .about ul li {
	list-style-type:none;
	background: url(/img/top/arrow-grey.gif) no-repeat left 6px;
	padding-left:10px;
	margin-left:14px;
	margin-bottom:10px;}
	
#footer .about ul li img {
	vertical-align: middle; margin-left:2px;
}
	
#footer .about ul li a {
	color:#FFFFFF;}


/*-------------------------------------------------------------------------

	* ClearFix
	
---------------------------------------------------------------------------*/
#TopFlash:after,
.contents:after,
.pagetop:after,
.wall:after,
#menu-box:after,
#gnavi:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#TopFlash,
.contents,
.pagetop,
.wall,
#menu-box,
#gnavi
 {
  display: inline-table;
  min-height: 1%;
}

/* Hides from IE-mac \*/
* html #TopFlash,
* html .contents,
* html .pagetop,
* html .wall,
* html #menu-box,
* html #gnavi { height: 1%; }

#TopFlash,
.contents,
.pagetop,
.wall,
#menu-box,
#gnavi{ display: block; }
/* End hide from IE-mac */



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

.clearfix {
	display:inline-block;
	clear:both;}