@charset "utf-8";
/* CSS Document */
/********************************************************************
	sols.css
*********************************************************************/

/* =======================================

	カルーセルメニュー

======================================= */
#carousel {
	margin: 0 auto 40px;
	width: 720px;
	height: 210px;
	text-align: left;
	position: relative;
}

#carousel_prev,
#carousel_next {
	top: 0;
	width: 20px;
	height: 210px;
	background: #000;
	cursor: pointer;
	position: absolute;
}
#carousel_prev {
	left: -20px;
	background:transparent url(../img/prev.jpg) no-repeat top left;
}
#carousel_next {
	right: -20px;
	background:transparent url(../img/next.jpg) no-repeat top left;
}

#carousel ul li {
	width: 360px;
	float: left;
	display: inline;
}


/* =======================================
	ClearFixElements
======================================= */
#carousel ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

#carousel ul {
	display: inline-block;
	overflow: hidden;
}

/*--------------------------------------------------------
	ページタイトル背景を設定
----------------------------------------------------------*/
#pagettl #inner {
	background-image: url(../img/page_ttl_bg_sols.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}

/*========================================================
	コンテンツ
==========================================================*/
#contents {
	background-image: url(../img/cont_bg.jpg);
	background-repeat: repeat-y;
	background-position: left top;
	padding:0px;
	margin:0px auto 20px;
}
/*--------------------------------------------------------*/
/* 2016/5 デザイン変更 商材ページのサイド背景は無しにする */
/*--------------------------------------------------------*/
body.sol #contents {
	background-image:none !important;
}
/*========================================================
	メインエリア
==========================================================*/
#main {
	float:right;
	width:760px;
}
/* ソリューションタイトル */
#main .solttlBase {
  width: 760px;
  height: 38px;
  line-height: 38px;
  font-size: 16px;
  margin-bottom: 20px;
  text-indent: 50px;
}
#main .solttl01 {
  background-image:url(../img/ttl_bg01.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl02 {
  background-image:url(../img/ttl_bg02.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl03 {
  background-image:url(../img/ttl_bg03.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl04 {
  background-image:url(../img/ttl_bg04.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl05 {
  background-image:url(../img/ttl_bg05.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl06 {
  background-image:url(../img/ttl_bg06.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl07 {
  background-image:url(../img/ttl_bg07.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl08 {
  background-image:url(../img/ttl_bg08.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
#main .solttl09 {
  background-image:url(../img/ttl_bg09.jpg);
  background-repeat: no-repeat;
  background-position: top left;
}
/*--------------------------------------------------------
	ピックアップカテゴリバナー
----------------------------------------------------------*/
#main .pickupCateg {
  width: 720px;
  overflow: hidden;
  margin: 0px auto 30px;
  list-style:none;
}
#main .pickupCateg li {
  float: left;
  width: 360px;
}
/*--------------------------------------------------------
	リスト
----------------------------------------------------------*/
#main .pickupCategList {
  width: 750px;
  padding-left: 10px;
  margin-bottom: 30px;
  list-style: none;
  overflow: hidden;
}
#main .pickupCategList div {
  float: left;
  width: 365px;
  padding-right: 10px;
}
#main .pickupCategList div .indexList01 {
  list-style: none;
}
#main .pickupCategList div .indexList01 li {
  background-image: url(/product/solution/common/img/pic_arrow01.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	padding-left: 20px;
  margin-bottom: 5px;
}
#main .pickupCategList div .indexList01 li ul {
  list-style: disc;
  padding-left: 20px;
}
#main .pickupCategList div .indexList01 li ul li {
  background-image:none;
  padding: 0px;
  margin-bottom: 0px;
}
/*--- リンク ---*/
#main .pickupCategList a:link, #main .pickupCategList a:visited {
	color:#000;
	text-decoration: none;
}
#main .pickupCategList a:hover, #main .pickupCategList a:active {
	color: #e60012;
	text-decoration: none;
}
/*--------------------------------------------------------
	ソリューションサービスリスト
----------------------------------------------------------*/
#main .solutionList {
  width: 750px;
  padding-left: 10px;
  margin-bottom: 30px;
  list-style: none;
  overflow: hidden;
}
#main .solutionList li {
  float: left;
  width: 345px;
  margin-right: 10px;
  margin-bottom: 5px;
  background-image: url(/product/solution/common/img/pic_arrow01.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	padding-left: 20px;
}
/*--- リンク ---*/
#main .solutionList a:link, #main .solutionList a:visited {
	color:#000;
	text-decoration: none;
}
#main .solutionList a:hover, #main .solutionList a:active {
	color: #e60012;
	text-decoration: none;
}
/*--------------------------------------------------------
	サービスソリューションindex
----------------------------------------------------------*/
/* 20161215 下記 #main .indexBox 未使用 */
#main .indexBox {
	width:760px;
	margin:0px 0px 40px 0px;
	list-style:none;
}
#main .indexBox li {
	margin:0px 0px 1px 0px;
	font-size:16px;
	font-weight:bold;
}
#main .indexBox li a {
	display:block;
	padding:10px 30px;
	background-color: #f4f4f4;
	background-image: url(/product/solution/common/img/pic_arrow01.gif);
	background-repeat: no-repeat;
	background-position: 10px 16px;
}
/*--- リンク ---*/
.indexBox a:link, .indexBox a:visited {
	color:#000;
	text-decoration: none;
}
.indexBox a:hover, .indexBox a:active {
	color: #e60012;
	text-decoration: none;
}


/*--------------------------------------------------------
	商材ページ
----------------------------------------------------------*/

/*----------------------------------
	お問い合わせ
------------------------------------*/
#main .contttl {
	width:760px;
	height:39px;
	line-height:39px;
	font-weight:bold;
	text-indent:30px;
	font-size:15px;
	margin-bottom:15px;
	margin-top:20px;
	background-image: url(../img/contact_ttlbg.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#main .contactBox {
	background-color:#f4f4f4;
	padding:30px;
	width:700px;
}
#main .contactBox .telno {
	background-image: url(/product/solution/common/img/pic_arrow01.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 20px;
	font-weight:bold;
	font-size:16px;
	margin-bottom:20px;
}
#main .contactBox .telno span {
	font-size:20px;
}


/*----- テーブル(課題・解決)----*/
table.kk {
	width:100%;
	margin-bottom:20px;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #CCC;
	border-left-color: #CCC;
	background-color: #FFF;
	border-collapse:collapse;
}
table.kk th,
table.kk td {
	padding:5px;
	vertical-align: top;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
}
table.kk th.k1 {
	background-color: #666;
	font-weight: bold;
	text-align: left;
	color: #FFF;
}
table.kk th.k2 {
	background-color: #C33;
	font-weight: bold;
	text-align: left;
	color: #FFF;
}
table.kk td.k1 {
	background-color: #CCC;
}
table.kk td.k2 {
	background-color: #F6F6F6;
}
/*--------------------------------------------------------
	事例ページ
----------------------------------------------------------*/
.casetxt {
	margin-bottom:30px;
}
.campProf {
	padding:30px;
	background-color: #f4f4f4;
	overflow:hidden;
	width:700px;
	margin-bottom:40px;
}
.campProf .text {
	float:left;
	width:500px;
}
.campProf .photo {
	float:right;
	width:170px;
}



/*========================================================
	サイドエリア
==========================================================*/
#side {
	float:left;
	width:180px;
}
/*------------------------------------------------------------------*/
/* 2016/5 デザイン変更 商材ページのサイドナビのタイトルデザイン変更 */
/*------------------------------------------------------------------*/
body.sol #side .sdtitle01 {
	font-size:14px;
	font-weight:bold;
	color:#FFF;
	text-align:center;
	padding:5px;
	background-image:url(../img/side_ttlbg_menu.jpg);
	background-repeat:no-repeat;
	background-position:left center;
}
/*----------------------------------
	サイドナビ
------------------------------------*/
.sdnav {
	width:180px;
	margin-bottom:20px;
	background-color:#f4f4f4;
}
.sdnav li.lv1b {
	width:180px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
}
.sdnav li.lv1b a {
	display:block;
	padding:6px 20px;
	background-image: url(/product/solution/common/img/pic_arrow03.gif);
	background-repeat: no-repeat;
	background-position: 10px 14px;
}
/*-- ロールオーバー --*/
.sdnav li a:hover {
	background:none;
	color:#FFF;
	background-color:#999;
}

/*--- リンク ---*/
.sdnav a:link, .sdnav a:visited {
	color:#000;
	text-decoration: none;
}
.sdnav a:hover, .sdnav a:active {
	color: #e60012;
	text-decoration: none;
}
/*------------------------------------------------------------*/
/* 2016/5 デザイン変更 商材ページのサイドナビの左右に罫線追加 */
/*------------------------------------------------------------*/
body.sol .sdnav li.lv1b {
	width:178px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #CCC;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
}

/*----------------------------------
	お問い合わせ
------------------------------------*/
#side .sdtitleCnt {
	font-size:16px;
	font-weight:bold;
	color:#FFF;
	background-color: #e60012;
	padding:6px;
	/*margin-bottom:15px;*/
	text-align:center;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
}
#side .contBox {
	text-align: center;
	padding: 15px 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #CCC;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	margin-bottom: 20px;
	background-color: #e60012;
}
#side .contBox .text {
	font-size:11px;
	width:160px;
	margin:0px auto 5px;
	color:#FFF;
}
#side .contBox .telno {
	text-align:center;
	font-size:15px;
	font-weight:bold;
	color:#FFF;
}

/*----------------------------------
	事例
------------------------------------*/
#side .sdtitleJei {
	font-size:13px;
	font-weight:bold;
	color:#FFF;
	background-color: #6699cc;
	padding:6px;
	margin-bottom:0px;
	text-align:center;
}
#side .jreiBox {
	text-align: center;
	padding:0px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #CCC;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	margin-bottom: 20px;
	background-color:#f4f4f4;
	list-style:none;
}
#side .jreiBox li {
	padding:15px 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
}
#side .jreiBox .rog {
	width:160px;
	margin:0px auto 5px;
}
#side .jreiBox .text {
	font-size:12px;
	width:160px;
	margin:0px auto 5px;
	text-align:left;
}
/*-- PDFマークを外す --*/
#side .jreiBox a[href$=".pdf"] {   
    background:none;
	padding-right:0px; 
} 
#side .jreiBox a.pdf{   
    background:none;
	padding-right:0px; 
}
/*----------------------------------
	関連ソリューション
------------------------------------*/
#side .sdtitleOSol {
	font-size:13px;
	font-weight:bold;
	color:#FFF;
	background-color: #e60012;
	padding:6px;
	margin-bottom:0px;
	text-align:center;
}


/*-- テーブルsol ------------------------------------------------------------------------*/
table.typesol {
	width:100%;
	margin-bottom:20px;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #CCC;
	border-left-color: #CCC;
	background-color: #FFF;
	border-collapse:collapse;
}
table.typesol th,
table.typesol td {
	padding:5px;
	vertical-align: top;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
}
table.typesol th {
	background-color: #F5F5F5;
	font-weight: normal;
}




/*-- やばね ------------------------------------------------------------------------*/

.yabane{
  list-style-type: none;
  display:table;
  width:100%;
  padding:0;
  margin:0;
  overflow:hidden;
}
.yabane li{
  display:table-cell;
  position:relative;
  background: #504944;
  padding: 1em 0.5em 1em 2em;
  color: #fff;
}
.yabane li:last-child{
  padding-right: 1em;
}
.yabane li:last-child:before,
.yabane li:last-child:after{
  display:none;
}
.yabane li:before,
.yabane li:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
}
.yabane li:before{
  top:-15px;
  right:-1em;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
  border-width: 40px 0 40px 1em;
  z-index: 15;
}
.yabane li:after{
  top:-15px;
  right:-.8em;
  border-style: solid;
  border-color: transparent transparent transparent #504944;
  border-width: 40px 0 40px 1em;
  z-index: 15;
}
.yabane li.is-current{
  background: #7658F8;
  font-weight: bold;
}
.yabane li.is-current:after{
  border-color: transparent transparent transparent #7658F8;
}