@charset "utf-8";


/*******************************
		システムページ共通
********************************/

div.system h2{
	margin-bottom: 0;
	height: 87px;
}

div.system p,div.system ul{
	font-size: 12px;
}

div.system p.top{
	background: #e3e3e3;
	padding:15px 40px;
	font-size: 14px;
	margin-bottom: 20px;
}

div.system h3{
	font-size: 20px;
	padding: 0;
	padding-left: 16px;
	line-height: 22px;
}

div.system h4{
	font-size: 16px;
	padding-left: 16px;
}


div.detail {
	border-top:#ececec 15px solid;
	border-bottom:#ececec 15px solid;
	border-left:#ececec 5px solid;
	border-right:#ececec 5px solid;
	padding: 20px 10px;
	}

div.part{
	margin-bottom: 25px;
}



div.full h5{
	font-size: 12px;
	background: url("../images/indexBlue.png") 0 50% no-repeat;
	padding-left: 10px;
	border-bottom: solid 1px #004193;
}



/***一番下の関連ページ***/

div.relatedLink{
	border-top: solid 1px #004193;
	overflow: hidden;
	padding-top: 10px;
}

div.relatedLink div{
	width:120px;
	float: left;
	margin-right: 5px;
}

div.relatedLink div.right{
	margin:0;
}

div.relatedLink p.title{
	padding-left: 11px;
	background: url("../images/blueArrowR.png") 0 0 no-repeat;
}

div.relatedLink p.img{
	width: 120px;
	height: 100px;
	background: #ddd;
}

div.relatedLink a p.title{
	color:#0099cc;
	font-size: 9px;
	line-height: 12px;
	height: 24px;
}

div.relatedLink a div:hover{
	color: #0066ff;
}


/*******************************
		システム保守TOPページ
********************************/

div.system p.smile{
	background:#e3e3e3 url("../images/smile.png") 93% 95% no-repeat;
}

div.system h2.index{
	background: url("../images/top_system.png") 0 100% no-repeat;
	background-size: 100% auto;
}


/*******サービス紹介********/

div.system_contents div.part{
	overflow: hidden;
}

div.system_contents div.float{
	float: left;
}

figure {
	position: relative;
	overflow: hidden;
	width: 300px;
}
figcaption {
	position: absolute;
	top: -100%;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 164px;
	background: rgba(0,0,0,.6);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 1;
	text-align: center;
	filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#77000000,endcolorstr=#77000000, gradienttype=0);/* IE 8以上用 */
}

figcaption img{
	padding-top: 30px;
}

figure:hover figcaption {
	top: 0;
	left: 0;
}

div.system_contents div.left{
	margin-right: 10px;
}

div.system_contents div.grey{
	padding: 10px 15px 10px 12px;
	height: 144px;
	width: 283px;
}

div.system_contents div.grey h5{
	border:none;
	background: none;
	padding:5px 0;
	font-size: 16px;
}

div.system_contents div.grey p.title{
	padding-left: 15px;
	background: url("../images/pinkArrow.png") 0 50% no-repeat
}

div.system_contents div.service01{
	background:#ececec url("../images/serviceBack01.png") 95% 10% no-repeat;
}
div.system_contents div.service02{
	background:#ececec url("../images/serviceBack02.png") 95% 10% no-repeat;
}
div.system_contents div.service03{
	background:#ececec url("../images/serviceBack03.png") 95% 10% no-repeat;
}
div.system_contents div.service04{
	background:#ececec url("../images/serviceBack04.png") 95% 10% no-repeat;
}

/*********選ばれる理由*********/


div.system_contents div.part {
	overflow: hidden;
}

div.system_contents div.part h3.float{
	width:360px;
	float: left;	
}

div.system_contents div.merit{
	overflow: hidden;
	padding: 0;
	clear: both;
}


div.system_contents div.part p.link{
	display: inline-block;
	width: 100px;
	padding-left: 16px;
	background: url("../images/pinkArrowR.png") 0 50% no-repeat;
}
div.system_contents div.reason{
	width: 194px;
	float: left;
	padding:15px 3px 15px 7px;
	border:1px #ececec solid;
}

div.system_contents div.r2{
	width: 196px;
}

div.system_contents div.merit p {
	font-size: 11px;
}

div.system_contents div.merit h4{
	background:none;
	padding-left: 40%;
	line-height: 20px;
}

div.system_contents div.r1 h4{
	background:url("../images/merit_1.png") 15% 50% no-repeat;
}

div.system_contents div.r2 h4{
	background:url("../images/merit_2.png") 15% 50% no-repeat;
}

div.system_contents div.r3 h4{
	background:url("../images/merit_3.png") 15% 50% no-repeat;
}


/*****タイプ別事例******/
div.system_contents div.case {
	border:none;
	padding:0px 0px 20px;
}
div.system_contents div.case h5{
	font-size: 16px;
	padding-left: 16px;
}

div.system_contents div.case dl{
	padding:0 0 15px;
}

div.system_contents div.case dt{
	margin: 0;
	padding: 0px 15px 0px 83px;
	font-size: 12px;
}

div.system_contents div.case dd{
	margin: 0;
	padding: 15px 15px 15px 83px;
	font-size: 12px;
}

div.system_contents div.case dt{
	margin:15px 0;
}

div.system_contents div.case dd{
	background: #efefef url("../images/arrowR.png") 15px 50% no-repeat;
	min-height: 50px;
}

div.system_contents div.case dd span{
	font-size: 14px;
	font-weight: bold;
}

/*******************************
		各サービス　ページ
********************************/
div.system h2.service01{
	background: url("../images/top_software.png") 0 100% no-repeat;
	background-size: 100% auto;
}

div.system h2.service02{
	background: url("../images/top_problem.png") 0 100% no-repeat;
	background-size: 100% auto;
}

div.system h2.service03{
	background: url("../images/top_version.png") 0 100% no-repeat;
	background-size: 100% auto;
}

div.system h2.service04{
	background: url("../images/top_server.png") 0 100% no-repeat;
	background-size: 100% auto;
}

div.system_contents h3{
	border-left: 5px #fe5a91 solid;
}

div.system_contents p.h3{
	padding-left: 22px;
}

div.system_contents h4{
	background: url("../images/pinkArrowR.png") 0 50% no-repeat;
}

div.system_contents h4.float{
	width: 220px;
	float: left;
}

div.system_contents p.h4{
	padding:0 15px;
	clear: both;
}


/*******事例部分（基本情報）********/

div.system_contents div.example {
	padding: 0;
}

div.example table,div.example tr,div.example td{
	font-size: 11px;
	padding: 0;
	margin: 0;
}

div.example table{
	width: 625px;
}

div.example th{
	width: 210px;
	font-size: 16px;
	text-align: left;
	padding: 10px 10px 5px;
}
div.example td{
	width: 210px;
	padding: 0 10px;
	line-height: 16px;
}

div.example td.img{
	background: url("../images/person.png") no-repeat 50% 100%;
	height: 120px;
	border-right: 3px solid #ececec;
}

div.example td.support{
	background: #e3e3e3;
	width: 421px;
	padding: 5px 10px;
}

@-moz-document url-prefix() {
  div.example td.img{
	height: 100%;
  }

div.example td.support{
	height: 58px;
	vertical-align: middle;
}
}

/*******事例部分（依頼内容・経緯）********/

div.example dl{
	border-top:5px solid #ececec;
	margin:0;
	min-height: 70px;
	vertical-align: middle;
}


div.example dt,div.example dd{
	display: table-cell;
	vertical-align: middle;
}

div.example dt{
	width: 70px;
	height: 70px;
	text-align: center;
	border-right:3px solid #ececec;
}
span.small{
	font-size: 10px;
}


div.example dd{
	font-size: 12px;
	padding: 15px 10px;
}

/*******************************
		料金体系　ページ
********************************/

div.system h2.price{
	background: url("../images/top_price.png") 0 100% no-repeat;
	background-size: 100% auto;
}

/***********料金表*********/

div.priceList p.pink{
	color: #fe5a91;
	float: left;
	margin:10px auto;
}

div.priceList p.banner{
	padding-left: 390px;
}

div.priceList table{
	clear: both;
	margin: 15px auto;
}

div.priceList table th{
	background-color: #ececec;
	padding: 10px 0;
	margin: auto;
	border:1px #fff solid;
}

div.priceList table td{
	vertical-align: middle;
	text-align: center;
	width: 160px;
	border-bottom:1px solid #ececec;
}

div.priceList table td.description{
	font-size: 11px;
	text-align: left;
	padding-left: 20px;
	width:240px;
	border-right:1px solid #ececec;
	border-left:1px solid #ececec;
}
div.priceList table tr.grey{
	background-color: #ececec;
	font-size: 11px;	
}


/*********運用までの流れ*********/

div.flow{
	padding: 0;
	margin-bottom: 20px;
	text-align: left;
}

div.flow table th{
	font-size: 16px;
	color: #fe5a91;
	padding:10px;
}

div.flow table tr{
	border-bottom:1px solid #ececec;
}

div.flow table{
	border-top:15px solid #ececec;
	border-bottom:14px solid #ececec;
}

/*****バナー********/


div.part p.banner{
	width:505px;
	margin: auto;
}

div.part p.banner a.right{
	margin-left: 20px;
}

/*******************************
		UNISEEDが選ばれる理由　ページ
********************************/
div.system h2.reason{
	background: url("../images/top_reason.png") 0 100% no-repeat;
	background-size: 100% auto;
}

div.reason_contents h3{
	border-left: 5px #e4df4a solid;
}

div.reason_contents p.h3{
	padding-left: 22px;
}

div.reason_contents h4{
	background: url("../images/yellowArrowR.png") 0 50% no-repeat;
}

div.reason_contents h4.float{
	width: 220px;
	float: left;
}


div.reason_contents　p.link{
	vertical-align: bottom;
}

div.reason_contents p.h4{
	padding:0 15px;
	clear: both;
}


div.grey{
	background: #ececec;
	padding:10px 20px;
	margin-bottom: 20px;
}

div.grey p{
	margin-bottom: 5px;
}

div.grey ul {
list-style-type: square;
margin: 0 15px;
}

/*****2.圧倒的なスピード********/


div.compe{
	padding: 0 20px 15px;
}

div.reason_contents p.img{
	text-align: center;
}

div.grey p.point{
	font-size: 14px;
	color: #fd9000;
}

/*****バナー********/


div.reason p.banner{
	width:505px;
	margin: auto;
}

div.reason p.banner a.right{
	margin-left: 20px;
}

/*******************************
		よくある質問ページ
********************************/
div.full h2.qa{
	background: url("../images/top_qa.png") 0 100% no-repeat;
	background-size: 100% auto;
	height: 87px;
}


div.qa_contents dl{
	padding:0 0 15px;
}

div.qa_contents dt,div.qa_contents dd{
	width:532px; 
	margin: 0;
	padding: 15px 15px 15px 83px;

}

div.qa_contents dt{
	height:25px;
	font-size: 16px;
	background: url("../images/qa_q.png") 15px 50% no-repeat;
	margin:15px 0;
}

div.qa_contents dd{
	background: #efefef url("../images/qa_a.png") 15px 50% no-repeat;
}


/* sidebar */
/*
.sidebar .inner_sidebar{
    margin: 0 0 20px;
    padding: 17px 30px;
}
.sidebar h3{
    width: 200px;
}
.sidebar h3,
.sidebar h3 a{
    font-size: 16px;
	font-weight:bold;
    margin: 0;
}
.sidebar #quote_wrap{
	background-color: #fff;
}
.sidebar .widget ul {
    margin: 0;
}
.sidebar .widget ul li {
	list-style: none;
}
.sidebar .widget.blog_wrapper {
    margin: 0 0 15px;
}
.sidebar .widget.blog_wrapper h3{
	background: url("../images/ico_blog.gif") no-repeat left center;
    padding: 5px 5px 3px 35px;
}
.sidebar .widget.links_wrapper {
    margin: 0 0 0;
}
.sidebar .widget.links_wrapper h3 a{
	background:url("../images/icons/blt_square.png") no-repeat center left;
    padding: 0 0 0 1.1em;
}
.sidebar .widget.links_wrapper h3 a:hover{
	color:#000;
	text-decoration:underline;
}
.sidebar .widget .links ul {
	border:none;
    margin: 0;
}
.sidebar .widget .links ul li {
	background-color: #fff;
	border:none;
	list-style: none;
    margin: 0 0 10px;
    padding: 10px 10px;
    width:92%;
}
.sidebar .widget .links ul li.end {
    margin: 0;
}
.sidebar .widget .links ul li a{
	background:url("../images/icons/blt_square.png") no-repeat center left;
	color: #484848;
	font-weight:bold;
}
.sidebar .widget .links ul li a:hover{
	text-decoration:underline;
}
.sidebar .widget .links_sub ul {
	border:none;
    margin: 0;
}



.sidebar .widget.links_wrapper h3 a{
	background:url("../images/icons/blt_square.png") no-repeat center left;
    padding: 0 0 0 1.1em;
}
*/

.sidebar .widget .links_sub ul li {
	list-style: none;
    margin: 0 0 5px;
    padding: 5px 10px 5px 30px;
    width:200px;
	color: #484848;
    font-size: 14px;
	background: #ddd url("../../images/icons/blt_square_white.png") no-repeat 0.7em center;
}
.sidebar .widget .links_sub ul li.w {
	padding-left: 20px;
	width: 92%;
	background: #fff url("../../images/icons/blt_square_white.png") no-repeat 0.7em center;

}

.sidebar .widget .links_sub ul li.end {
    margin: 0;
}
.sidebar .widget .links_sub ul li a{
	display: block;
	color: #484848;
    font-size: 14px;
    padding: 0;
    background: none;
}
.sidebar .widget .links_sub ul li a:hover{
	text-decoration:underline;
}
#nav_bnr img{
    width:100%;
}