@charset "utf-8";
/* CSS Document */


/*==============================*/
/* メインスライダー */
/*==============================*/

@media (min-width: 600px) {
	/* 設定 */
	.container { width: 100%; height: 100%; overflow-x: hidden; }
	.slide_all { width: 1000px; margin: 0 auto; height: 520px; position: relative; }
	.slide_wrap { width: 3000px; position: absolute; left: 50%; margin-left: -1500px; }
	.slide_body { width: 100%;}
	.slide { width: 1000px; font-size: 50px; line-height: 400px; text-align: center; position: relative; }
	.slide img { width: 100%; vertical-align: bottom; }
	.slide:after{ position: absolute; top: 0; left: 0; content:""; width: 100%; height: 400px; background: #000; opacity: .4; }
	.slide.active:after{ content: none; }
	
	/* 装飾 */
	.bx-pager { text-align: center; margin-top: -10px; }
	.bx-pager a{ border: 4px solid #fff; display: inline-block; }
	.bx-pager a.active{ border: 4px solid #76a2b9; position: relative; }
	.bx-pager a.active:before { position: absolute; top: -14px; left: 50%; margin-left: -7px; content: "";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 10px 10px 10px;
		border-color: transparent transparent #76a2b9 transparent;
	}

}

@media (max-width: 600px) {
	.bx-pager a img{ display: none; }
	.container .bx-prev { display: none; }
	.container .bx-next { display: none; }
}


/*==============================*/
/* トピックス */
/*==============================*/
@media (min-width: 600px) {
.topics dl{
	border: 1px solid #ccc;
	border-top: 5px solid #4e4d4a;
	padding: 180px 10px 10px 10px;
	position: relative;
	min-height: 90px;
	cursor: pointer;
}
.topics dl:hover{
	background: #fffced;
}
.topics dl dt{
	font-size: 13px;
}
.topics dl dd:nth-child(3){
	width: calc(100% - 20px) ; width: -webkit-calc(100% - 20px);
	position: absolute;
	top: 10px;
	left: 9px;
}
.topics dl dd:nth-child(3) p.clip{
	width: 215px;
    height: 130px;
    overflow: hidden;
}
.topics dl dd:nth-child(3) p.clip img{	
	position: relative;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);	
}
.topics dl dd.icon{
	position: absolute;
	top: 150px;
	left: 10px;
	font-size: 11.5px;
	padding: 0 10px;
	color: #fff;
}
.topics dl dd a{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
}
/* イベント */
.topics dl dd.event{
	background: #f8b25a;
}
/* ニュース */
.topics dl dd.news{
	background: #2291B1;
}
/* メディア */
.topics dl dd.media{
	background: #E75D64;
}
}

	@media (max-width: 600px) {
		.topics dl{
			border: 1px solid #ccc;
			border-top: 5px solid #4e4d4a;
			padding: 40px 10px 10px 160px;
			position: relative;
			min-height: 90px;
			cursor: pointer;
		}
		.topics dl:hover{
			background: #fffced;
		}
		.topics dl dd:nth-child(3){
			width: calc(100% - 20px) ; width: -webkit-calc(100% - 20px);
			position: absolute;
			top: 10px;
			left: 9px;
		}
		.topics dl dd:nth-child(3) p.clip{
			width: 100%;
			height: 130px;
			overflow: hidden;
		}
		.topics dl dd:nth-child(3) p.clip img{
			width: 140px;
		}
		.topics dl dd.icon{
			position: absolute;
			top: 10px;
			left: 160px;
			font-size: 11.5px;
			padding: 0 10px;
			color: #fff;
			background: #f8b25a;
		}
		.topics dl dd a{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			display: block;
		}
	}


/*==============================*/
/* 導入事例 */
/*==============================*/
.works{
	background: url(/common/img/share/bg_dot_blue.png) repeat;
	padding: 40px 0;
}
.works .wrap{
	position: relative;
}

/*-- 見出し
------------------------- */
.works h2{
	font-size: 24px;
	line-height: 30px;
	color: #fff;
	font-weight: 500;
	font-family: 'Noto Sans Japanese', sans-serif;
	letter-spacing: -0.05em;
	margin-bottom: 10px;
}
.works h2 small{
	font-size: 16px;
	font-weight: 400;
	margin-left: 20px;
}
	@media (max-width: 600px) {
		.works h2{
			font-size: 20px;
		}
		.works h2 small{
			display: none;
		}
	}

/*-- ボタン
------------------------- */
.works .works_btn{
	position: absolute;
	top: 0;
	right: 0;
	color: #294a7d;
	background: #fff;
	border-radius: 3px;
	padding: 4px 10px;
}

/*-- ボックス
------------------------- */
.works .works_box{
	background: #fff;
	padding: 20px 20px 1px 20px;
	border-radius: 5px;
}
.works .works_box div img{
	margin-bottom: 20px;
	border: 1px solid #ccc;
}

	@media (min-width: 600px) {
		.works .works_box > div{
			box-sizing: border-box;
		}
		.works .works_box div h3{
			font-size: 20px;
			font-weight: bold;
			margin-bottom: 10px;
		}
		.works .works_box .two_column > div:first-child{
			position: relative;
		}
		.works .works_box .two_column > div:first-child:after{
			position: absolute;
			top: 0;
			right: -20px;
			content: "";
			width: 100%;
			height: 275px;
			border-right: 1px solid #ccc;
		}
	
		.works .bx-pager{
			display: none;
		}
		.works .bx-wrapper .bx-prev { left: -70px; background: url(/common/css/lib/images/controls.png) no-repeat 0 -32px; }
		.works .bx-wrapper .bx-next { right: -70px; background: url(/common/css/lib/images/controls.png) no-repeat -43px -32px; }
		.works .bx-wrapper a:hover{ transition: none; }
	}
	@media (max-width: 1000px) {
		.works .bx-wrapper .bx-prev { display: none; }
		.works .bx-wrapper .bx-next { display: none; }
	}
	
	@media (max-width: 600px) {
		.works .works_box{
			border-radius: 3px;
		}
		.works .works_box > div > div p:last-child{
			min-height: 6em;
		}
		.works .works_box div h3{
			font-size: 16px;
			font-weight: bold;
			margin-bottom: 10px;
		}		
		.works .bx-wrapper .bx-prev { display: none; }
		.works .bx-wrapper .bx-next { display: none; }
	}
/*==============================*/
/* 製品情報 */
/*==============================*/
.product > div > div{
	width: calc(33.33% - 20px) ; 
	width: -webkit-calc(33.33% - 20px);
}
.three_column > div:nth-child(3n+1){ 
	margin-right: 20px;
	clear: both;
}
.three_column > div:nth-child(3n+2){
	margin-left: 10px;
	margin-right: 10px;
}  
.three_column > div:nth-child(3n){
	margin-left: 20px;
}
.product > div > div:not(:last-child) {
	padding: 14px 20px 3px 20px;
	border: 1px solid #CCC;
	border-radius: 4px;
	box-sizing: border-box;
}

.product > div > div:last-child > div{
	padding: 20px 10px 4px 10px;
	border: 1px solid #CCC;
	border-radius: 4px;
}
.product > div > div:last-child > div img{
	float: left;
}
.product > div > div:last-child >div ul{
	margin-left: 91px;
}

/*-- リンクボタン
------------------------- */
.product ul li a{
	position: relative;
	display: block;
	margin-bottom: 10px;
	padding: 4px 10px 2px 10px;
	background: #4E4D4A;
	border-radius: 3px;
	color: #FFFFFF;
}
.product ul li a:after{
	position: absolute;
	right: 10px;
	content:"＞";
}
.product ul li a:hover{
	background: #666666; 
}
.product p{
	text-align: right;
}
.product p:before{
	content: "＞";
}

/*==============================*/
/* ポイント */
/*==============================*/	
.point_title{
	padding: 30px 0;
	background:url(/common/img/share/bg_dot_yellow.png) repeat;
	border-bottom: 1px solid #f8dbb6;
	color: #FFFFFF;
	text-align: center;
}

.point{
	padding: 30px 0;
	background:url(/common/img/share/bg_dot_orange.png) repeat;
	border-bottom: 1px solid #f8dbb6;
	color: #FFFFFF;
}
.point i{
	display: block;
	margin: 0 auto 10px auto;
	font-size: 40px;
}

.point a{
	position: relative;
	margin-top:30px;
	padding: 4px 10px 2px 10px;
	display: block;
	border-radius: 3px;
	background: #FFFFFF;
	color: #e77917;
}
.point a:after{
	position: absolute;
	right: 10px;
	content:"＞";
}
.point a:hover{
	background: #e77917;
	color:#FFFFFF;
}


/*==============================*/
/* ニュース */
/*==============================*/
.news{
	padding: 50px 0;
	background: url(../../img/share/bg_dot_gray.png) repeat;
}

/*-- ニュース
------------------------- */	
.news #news dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #news dl:last-child{ margin-bottom: 10px; }
.news #news dl dt{ float: left; color: #294A7D; font-weight: bold; }
.news #news dl dd{ margin-left: 100px; }
.news #news p{ text-align: right; }

	@media (max-width: 600px) {
		.news #news dl dt{ float: none; }
		.news #news dl dd{ margin-left: 0; }
	}
	
/*-- メルマガ
------------------------- */	
.news #mm dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #mm dl:last-child{ margin-bottom: 10px; }
.news #mm dl dt{ float: left; color: #294A7D; font-weight: bold; }
.news #mm dl dd{ margin-left: 136px; }
.news #mm p{ text-align: right; }

	@media (max-width: 600px) {
		.news #mm dl dt{ float: none; }
		.news #mm dl dd{ margin-left: 0; }
	}
	
/*-- ブログ
------------------------- */	
.news #blog dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #blog dl:last-child{ margin-bottom: 10px; }
.news #blog dl dt{ float: left; color: #294A7D; font-weight: bold; }
.news #blog dl dd{ margin-left: 100px; }
.news #blog p{ text-align: right; }

	@media (max-width: 600px) {
		.news #blog dl dt{ float: none; }
		.news #blog dl dd{ margin-left: 0; }
	}

/*-- メルマガ
------------------------- */	
.news #event dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #event dl:last-child{ margin-bottom: 10px; }
.news #event dl dt{ float: left; color: #294A7D; font-weight: bold; }
.news #event dl dd{ margin-left: 136px; text-decoration: underline; }
.news #event p{ text-align: right; }

	@media (max-width: 600px) {
		.news #event dl dt{ float: none; }
		.news #event dl dd{ margin-left: 0; }
	}
		
/*-- リリース情報
------------------------- */	
.news #release dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #release dl:last-child{ margin-bottom: 10px; }
.news #release dl dt{ float: left; color: #294A7D; font-weight: bold; }
.news #release dl dd{ margin-left: 100px; }
.news #release p{ text-align: right; }

	@media (max-width: 600px) {
		.news #release dl dt{ float: none; }
		.news #release dl dd{ margin-left: 0; }
	}
	
/*-- セミナー
------------------------- */	
.news #seminar dl{
	overflow: hidden;
	padding: 8px 0;
	border-bottom: 1px dotted #919191;
}
.news #seminar dl:last-child{ margin-bottom: 10px; }
.news #seminar dl dt{ color: #294A7D; font-weight: bold; }
.news #seminar p{ text-align: right; }

	@media (max-width: 600px) {
		.news #seminar dl dt{ float: none; }
		.news #seminar dl dd{ margin-left: 0; }
	}

/*-- タブメニュー
------------------------- */	
.tab {
	padding-left: 10px;
	overflow: hidden;
}
.tab li{ float:left; }
.tab li a{
    display: block;
	margin-right: 8px;
	padding: 5px 20px;
    text-align: center;
	background: #CCCCCC;
    border: #ccc 1px solid;
	border-bottom: none;
	font-size: 12px;
	border-radius: 5px 5px 0 0;
}
.tab li.active a{ background:#FFFFFF; }

.news > div > div{
	padding: 20px 20px 10px 20px;
	background: #FFFFFF;
    border: #ccc 1px solid;
	margin-top: -1px;
}
#media{ display:none; }
#mm{ display:none; }
#blog{ display:none; }
#release{ display:none; }
#seminar{ display:none; }
#event{ display:none; }

	@media (max-width: 600px) {
		.tab li a{ padding: 5px; }
	}

/*==============================*/
/* 製品の販売実績 */
/*==============================*/
.top_experts{
	padding: 5px 0 20px 0;
	color: #fff;
	background: url(/common/img/share/bg_dot_yellow.png) repeat;
}
.top_experts h2{
	 font-size: 20px;
	 font-weight: bold;
	 color: #fff;
	 border-bottom: 1px solid #fff;
	 margin-bottom: 16px;
	 padding-bottom: 10px; 
	 line-height: 30px;
	 text-align: center;
}
	@media (max-width: 600px) {
		.top_experts h2{
			font-size: 16px;
		}
	}