﻿@charset "utf-8";
/* CSS Document */
/* nakamura 追加　CSS*/
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
html { 
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
p { 
	font: 14px/1.7em "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}    
input,
button,
select,
textarea {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
} 


/* index-megamenu
----------------------------------------------- */


/*megamenu mouseover
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;  
	  
}*/	
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > li > a:hover{
	background-color: #F0F0F0;
	color: #333;
}
.yamm .container {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.content-img{
	border: 0 none;
    height: auto;
    vertical-align: middle;
    width: 100%;
}

@media screen and (max-width: 768px){
.content-img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
}

/* index-header
----------------------------------------------- */	
	
	
.navbar-brand {
    padding-left: 15px;
    padding-right: 15px;
	padding-top: 0;
}
.navbar {
 /*   height: 75px;*/
	padding-top: 15px;
	padding-bottom: 15px;
}
.container h4 {
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-size: 140%;
    font-weight: bold;
    line-height: 1.2em;
}
.container h5 {
	font-weight: bold;
	font-size: 130%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.2em;
}

/* index-solution
----------------------------------------------- */	
	
.catch {
	width: 225px;
	margin-right: auto;
	margin-left: auto;
	line-height: 1.2em;
	margin-bottom:0px;
}

.caption ul {/*-----  ------*/
	text-align: left;
	font-weight: bold;
	margin-right: 5px;
	margin-left: -25px;
	margin-bottom:5px;
}
.caption ul li:before {/*-----  ------*/
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 100%;
	color: #337AB7;
	padding-right: 5px;
	
}
	
/*.caption ul {
	list-style-position: inside;
	list-style-type: square;
	font-size: 100%;
	color: #337AB7;
	text-align: left;
	font-weight: bold;
	margin-right: 5px;
	
	margin-left: -35px;
	margin-bottom:5px;
}*/

.caption ul li{
	font-size: 90%;
	padding-left: 1em; /*1em（1文字）分、右に動かす*/
    text-indent: -1em; /*最初の行だけ1em（1文字）分、左に動かす*/
}


.st{
	width: 32.7%;
	height: 450px;
	border: 1px solid #337AB7;
	margin-right:5px;
	padding-top:0px;
	padding-left:0px;
	padding-right:0px;
	}
@media ( max-width: 767px ) {
.st {
	width: 100%;
	margin-bottom:10px;

}

}
h4.solution-title {
    background-color: #337ab7;
    color: #fff;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 5px;
    margin-top: 5px;
	margin-right:10px;
    padding: 10px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
h4.solution-title a{
		color: #FFF;
	}
	h4.solution-title a:hover{
	color: #A1D5E3;
	}
h4.solution-title a:after {
	content: "\f0da";
	font-family: FontAwesome;
	color: #FFF;
	padding-left:5px;
}


/* solution hard */
h4.solution-title-sub {
	font-size: 140%;
	font-weight: bold;
	color: #337AB7;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #337AB7;
	margin-top: 20px;
	margin-bottom: 20px;
	}
	h4.solution-title-sub:before {
	/* content: "\f0a9"; */
	font-family: FontAwesome;
	color: #337AB7;	
	padding-right:5px;
	}
	
	
h5.solution-title-jirei {
	font-size: 120%;
	font-weight: bold;
	color: #337AB7;
	background-color: #F5F5F5;
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #337AB7;
	text-indent: 1em;
	padding: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
}
h6.solution-title-jirei-sub {
	font-size: 120%;
	font-weight: bold;
	color: #337AB7;
	margin-top: 20px;
	margin-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #337AB7;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding: 10px;
}
.solutoin-seihin {
	font-size: 120%;
	font-weight: bold;
	color: #333;
	margin-left: 2em;
	padding: 10px;
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #337AB7;
	margin-bottom: 10px;
	border-bottom-width: 2px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
}


.solution-title-jirei-sub-icon:after {
	content: "\f08e";
	font-family: FontAwesome;
	color: #337AB7;
	font-size: 90%;
	padding-left:10px;
}


.dev {
	font-size: 120%;
	font-weight: bold;
	color: #999;
	margin-left: 25px;
}
.solution-img{
	border: 1px solid #CCC !important;
	margin: 20px;
}


	
.solution-title-catch{
	text-align: left;
	line-height: 1.5em;
	margin-right: 5px;
	margin-left: 5px;
	}
	
.caption img{
	margin-top: 5px;
	position: absolute;
    bottom: 5px;
    left: 5px;
	width:95%;
}
@media ( max-width: 767px ) {
.caption img{
	margin-top: 5px;
	position: absolute;
    left: 10%;
	width:80%;
}

}.catch-sl {
	width: 360px;
	margin-right: auto;
	margin-left: auto;
}

/*-.col-sm-4 ul {
	list-style-type: none;
}*/
.menu-list {/*----- megamenu-link-icolist ------*/
	list-style-type: none;
}
.menu-list:before {/*----- megamenu-link-icolist ------*/
	content: "\f0da";
	font-family: FontAwesome;
	color: #337AB7;
	font-size: 120%;
	margin-bottom: 10px;
	margin-right: 5px;
}

.center {
	text-align: center;
	/*margin-right: auto;
	margin-left: auto;*/
}

.center-menu a {
	text-align: center;
	font-weight: bold;
	display: block;
	margin-right: auto;
	margin-left: auto;
}


.mm_title {
	font-size: 140%;
	line-height: 2em;
	font-weight: bold;
	padding-bottom: 10px;
	padding-left: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #3567A4;
	margin-bottom: 15px;
}
.caret-right{
	display: inline-block;
	height: 0;
	margin-left: 2px;
	margin-right: 3px;
	vertical-align: middle;
	width: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #3567A4;
	border-right: 0px solid transparent;
}




/* index-news
----------------------------------------------- */

#news_and_topix dl {
	border-bottom: 1px #CCCCCC dotted;
	padding: 5px 0px;
	position: relative;
	top: 0;
	left: 0em;
	width: 100%;
	height: auto;
	line-height: 1.5em;
	margin-bottom: 5px;
}
#news_and_topix dt {
	text-align: left;
	padding-right: 5px;
	height: auto;
	width: 7em;
	float: left;
}
#news_and_topix dd {
	text-align: left;
	/*padding-left: 18em;*/
	padding-left: 8em;
	padding-right: 5px;
	height: auto;
}
#news_and_topix .nat_tag {
	/* Firefox v1.0+ */
	-moz-border-radius: 4px;
	/* Safari v3.0+ and by Chrome v0.2+ */
	-webkit-border-radius: 4px;
	/* Firefox v4.0+ , Safari v5.0+ , Chrome v4.0+ , Opera v10.5+  and by IE v9.0+ */
	border-radius: 4px;
	width: 7em;
	/*margin: 0 1em;*/
	text-align: center;
	float: left;
	color: #FFF;
	/* behavior: url(PIE.htc); */
}

	
#news_and_topix .info {
	background-color: #3075AD;
}
#news_and_topix .event {
	background-color: #EE695B;
}
#news_and_topix .keisai {
	background-color: #4AACAC;
}
#news_and_topix .topix {
	background: #2A8BE0;
}
#news_and_topix .awards {
	background-color: #87D068;
}
#news_and_topix #backnumber a {
	display: block;
	/* Firefox v1.0+ */
	-moz-border-radius: 6px;
	/* Safari v3.0+ and by Chrome v0.2+ */
	-webkit-border-radius: 6px;
	/* Firefox v4.0+ , Safari v5.0+ , Chrome v4.0+ , Opera v10.5+  and by IE v9.0+ */
	border-radius: 6px;
	background: #17469E;
	color: #FFF;
	font-size: 12px;
	float: right;
	padding: 3px 10px;
	margin: 0px 10px;
	/* behavior: url(PIE.htc); */
}
@media ( max-width: 767px ) {
#news_and_topix dl {

}
#news_and_topix dt {
	width: 20%;
	float: none;
}
#news_and_topix dd {
	padding-left: 7em;
}
#news_and_topix .nat_tag {
	margin: 0 0em;
}
}




.ttl {
	border-color: #ededed #efefef #3666a6 #ededed;
    border-style: solid;
    border-width: 1px 1px 3px;
    font-size: 160%;
    font-weight: bold;
    padding: 10px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */



}


.ttl_02 {
	border-color: #ededed #efefef #3666a6 #ededed;
	border-style: solid;
	border-width: 1px 1px 3px;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	font-size: 140%;
	font-weight: bold;
	margin-top: 15px;
	padding: 10px;
	text-align: left;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

}
	


.banner_img {
	margin-top: 5px;
	margin-bottom: 15px;
}

.ttl_news{/*single.php,date.php 記事詳細画面*/
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 3px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #EDEDED;
	border-right-color: #EFEFEF;
	border-bottom-color: #3666A6;
	border-left-color: #EDEDED;
	padding: 10px;
    font-size: 26px;
}


/*footer
----------------------------------------------- */	

footer {
	margin-top:40px;
	
}

.pa {
	background-color: #3666A6;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #FFF;
	padding-right: 15px;
	padding-left: 30px;
	padding-top: 30px;
	padding-bottom: 15px;
}
.company-name {
	font-size: 120%;
	font-weight: bold;
	float: left;
	width: 190px;
}
address {
	float: left;
	margin-left: 10px;
	width: 400px;
	margin-bottom: 0;
}


@media (max-width: 480px) {
address {
    width: 100%;
}
}


.footer-nav ul li a {
	color:#FFF;	
	}
	.footer-nav ul li a:hover {
	color:#A1D5E3;
	}
	.footer-nav ul li:before {
		content: "\f0da";
		font-family: FontAwesome;
		padding-right:5px;
		}
.pmark {
	float: left;
	width: 450px;
	margin-top: 15px;
}
.pmark .pmark-img {
	float: left;
}
.pmark .pmark-text {
	float: left;
	margin-top: 24px;
}


.cybertrust {
	float: left;
	width: 600px;
	margin-top: 15px;
}
.cybertrust .cybertrust-img {
	float: left;
}
.cybertrust .cybertrust-text {
	float: left;
	margin-top: 24px;
	width:400px;
}

/*.cybertrust {
	float: left;
	margin-top: 24px;
}*/
.verisign {
	float: left;
	margin-top: 24px;
}

@media (max-width: 480px) {
.pmark {
	float: none;
	width: 100%;
	margin-top: 5px;
}

.pmark .pmark-text {
	float: none;
	margin-top: 5px;
}
.pmark::after{
	clear: both;
	}
	
.cybertrust {
	float: none;
	width: 100%;
	margin-top: 15px;
}

.cybertrust .cybertrust-text {
	float: none;
	margin-top: 24px;
	width: 100%;
}
.verisign {
	float: none;
	margin-top: 5px;
}

}


/*page-top
----------------------------------------------- */	
#page-top {
    position: fixed;
    bottom: 20px;
    right: 50px;
    font-size: 77%;
	z-index:1000;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}

#category_image {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	text-align:center;
}
h1.page-title {
	border-left-style: solid;
	border-left-width: 10px;
	border-left-color: #044591;
	padding-left: 10px;
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
}

.content-right {
	margin-top: 0px;
}

.sidetitle {
	background-color: #3567A4;
	text-align: center;
	padding: 12px;
	color: #FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	
}
.sptitle {
	font-size: 160%;
	line-height: 2em;
	font-weight: bold;	
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;

}
h3.sptitle a {
    color: #FFF !important;
    text-decoration: none;
}
h3.sptitle a:hover {
    color: #23527c !important;
    text-decoration: none;
}

.side {
	background-color: #F5F5F5;
	text-align: left;
	line-height: 2em;
	padding-top: 30px;
	padding-bottom: 30px;
}
.side ul {
	padding-left: 1em;
	text-indent: -1em;
	margin-right: 15px;
	margin-left: 15px;
}
.side ul li.sidemenu:before {
	content: "\f0a9";
	font-family: FontAwesome;
	color: #3567A4;
	font-size: 120%;
	padding-right:5px;
}


.sidemenu {
	list-style-type: none;
}

@media screen and (min-width: 768px) {
	/* 768px以上用（タブレット用）の記述 */
	/*megamenu mouseover*/
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;  
	  
}
}

@media (max-width: 979px) {
  .inlineBox {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
}

@media (max-width: 767px) {
	.sp_ml {
	margin-left: 15px;
	float:none;
	
	}
.yamm .dropdown:hover.yamm-fw .dropdown-menu {
    left: 0;
    right: 0;
}


}
@media (max-width: 480px) {
	
	.news {
	width:50%;
	float:none;

}
	
}

/*-------パンくず----*/
#bread-crumb {
	margin: 0 auto;
    max-width: 1200px;
    overflow: hidden;
	font-size: 95%;
	padding: 1px 0 10px;
}


#bread-crumb ul {
	margin: 0;
}

#bread-crumb ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}

#bread-crumb li {
	float: left;
	list-style:none;
	
}

#bread-crumb li.sub {
	padding-left: 10px;
}

#bread-crumb li.sub:before {
	letter-spacing: 10px;
    content: ">";
}

figure img {
	width: 100%;
}

/*------- 国の委託・補助事業採択歴 ----*/
#adoption dt {
    border-bottom: 1px solid #004098;
    border-left: 5px solid #004098;
    font-size: 120%;
    font-weight: bold;
    margin-left: 10px;
    margin-top: 45px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-top: 10px;
}
#adoption dd {
    border-bottom: 1px solid #ccc;
    line-height: 2em;
    margin-left: 40px;
    margin-right: 40px;
    margin-top: 0;
    padding: 10px 2em;
}
#adoption dd a {
    color: #004098;
    text-decoration: underline;
}
#adoption dd a:hover {
    text-decoration: none;
}




/*------- IOT　mouseover 
-----------------------------------------*/
.iot-line{
	line-height: 2em;
	margin: 40px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #3666A6;
}
@media (max-width: 768px) {
	
.iot-line{
	 margin-top: 100px;
}
}

.iot-line:before {
	content: "\f0a9";
	font-family: FontAwesome;
	color: #337AB7;
	font-size: 120%;
	padding-right:5px;
}
.iot-img{
	border: 0 none;
    height: auto;
    vertical-align: middle;
    width: 100%;
}
.onestop-img{
	border: 0 none;
    height: auto;
    vertical-align: middle;
    width: 100%;
}
#block_img{
	display: block;
    /*height: auto;
    margin: 45px auto 0;*/
    max-width: 100%;
    position: relative;
}

.hover-click {
	position: absolute;
	width: 28%;
	top: 10%;
	left:5%;
	z-index: 101; 
	}
.hover-click p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}

.hover-click > a{	
	display: block;
	/*width: 100%;*/
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);

}

.hover-click > a:hover{
	background-color: #638FCB;
}

.hover-click > div{
	position: absolute;
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(255,255,255,0.85);
}

.hover-click > div a.productlink{
	 color: #D8657E;
}
.hover-click > div a:hover.productlink{
	color: #E9A5B4;
}

	
.hover-click2 {
	position: absolute;
	width: 28%;
	top: 10%;
	left:37%;
	z-index: 101;
	}
.hover-click2 p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}
.hover-click2 > a{
	display: block;
	/*width: 100%;*/
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);
}

.hover-click2 > a:hover{
	background-color: #638FCB;
}

.hover-click2 > div{
	position: absolute;
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(255,255,255,0.85);
}

.hover-click2 > div a.productlink{
	 color: #D8657E;
}
.hover-click2 > div a:hover.productlink{
	color: #E9A5B4;
}



.hover-click3 {
	position: absolute;
	width: 28%;
	top: 10%;
	left:69%;
	z-index: 101;
	}
.hover-click3 p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}
.hover-click3 > a{
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);

}

.hover-click3 > a:hover{
	background-color: #638FCB;
}

.hover-click3 > div{
	position: absolute;
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(255,255,255,0.85);
}

.hover-click3 > div a.productlink{
	 color: #D8657E;
}
.hover-click3 > div a:hover.productlink{
	color: #E9A5B4;
}



.hover-click4 {
	position: absolute;
	width: 28%;
	top: 55%;
	left:5%;
	z-index: 100;
	}
.hover-click4 p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}
.hover-click4 > a{	
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);		
}

.hover-click4 > a:hover{
	background-color: #638FCB;
}

.hover-click4 > div{
	position: absolute;
	width: 100%;
	text-align: left;
	padding: 10px;	
	background-color: rgba(255,255,255,0.85);

}

/*--- 吹き出し
--------------------------------- */
/* balloon-5 top-left */
.balloon-5-top-left {
	position: relative;
	display: inline-block;
	padding: 0 15px;
	width: auto;
	min-width: 115px;
	height: 200px;
	color: #F6F6F6;
	line-height: 50px;
	text-align: center;
	background: #19283C;
	border-radius: 40px;
	z-index: 0;
}
.balloon-5-top-left:before {
	content: "";
	position: absolute;
	top: -17px; left: 15px;
	margin-right: 0;
	display: block;
	width: 15px;
	height: 15px;
	background: #FFFFFF;
	border-radius: 50%;
	z-index: -1;
}
.balloon-5-top-left:after {
	content: "";
	position: absolute;
	top: -25px; left: 25px;
	margin-right: 0;
	display: block;
	width: 8px;
	height: 8px;
	background: #FFFFFF;
	border-radius: 50%;
	z-index: -1;
}
@media (max-width: 480px) {
	
.balloon-5-top-left:before {
	display: none;	
}
.balloon-5-top-left:after {
	display: none;		
}
}
.hover-click4 > div a.productlink{
	 color: #D8657E;
}
.hover-click4 > div a:hover.productlink{
	color: #E9A5B4;
}

	
.hover-click5 {
	position: absolute;
	width: 28%;
	top: 55%;
	left:37%;
	z-index: 100;
	}
.hover-click5 p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}
.hover-click5 > a{
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);
}

.hover-click5 > a:hover{
	background-color: #638FCB;
}

.hover-click5 > div{
	position: absolute;
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(255,255,255,0.85);
}

.hover-click5 > div a.productlink{
	 color: #D8657E;
}
.hover-click5 > div a:hover.productlink{
	color: #E9A5B4;
}



.hover-click6 {
	position: absolute;
	width: 28%;
	top: 55%;
	left:69%;
	z-index: 100;
	}
.hover-click6 p {
	color: #333;
	line-height:1.5em;
	padding-left:5px;
}	
.hover-click6 > a{
	
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 140%;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background-color: #3666A4;
	line-height: 1.5em;
	border-radius: 150px;
	background-color: rgba(54,102,164,0.45);
}

.hover-click6 > a:hover{
	background-color: #638FCB;
}

.hover-click6 > div{
	position: absolute;
	width: 100%;
	padding: 10px;
	text-align: left;
	background-color: rgba(255,255,255,0.85);
}

.hover-click6 > div a.productlink{
	 color: #D8657E;
}
.hover-click6 > div a:hover.productlink{
	color: #E9A5B4;
}

	
@media screen and (max-width: 768px){
.iot-img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
.onestop-img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
.hover-click > a{	
	font-size: 90%;
}
.hover-click > div p{	
	font-size: 80%;
}
.hover-click2 > a{	
	font-size: 90%;
}
.hover-click2 > div p{	
	font-size: 80%;
}
.hover-click3 > a{	
	font-size: 90%;
}
.hover-click3> div p{	
	font-size: 80%;
}
.hover-click4 > a{	
	font-size: 90%;
}
.hover-click4 > div p{	
	font-size: 80%;
}
.hover-click5 > a{	
	font-size: 90%;
}
.hover-click5 > div p{	
	font-size: 80%;
}
.hover-click6 > a{	
	font-size: 90%;
}
.hover-click6 > div p{	
	font-size: 80%;
}
.fwB{
	font-size: 90%!important;
}
.fzLL{
	font-size: 90%!important;
}

}



@media screen and (max-width: 480px){
.iot-img{
	display: none;
}
#block_img{
	margin: 0px;
	text-align: left;
	font-size:90%;
	padding-left:0px;
}
.hover-click {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click2 {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click3 {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click4 {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click5 {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click6 {
	width: 100%;
	top: 0%;
	left: 0%;
	position: relative;
	}
.hover-click > div{
	display: block;
	position: relative;
}
.hover-click2 > div{
	display: block;
	position: relative;
}
.hover-click3 > div{
	display: block;
	position: relative;
}
.hover-click4 > div{
	display: block;
	position: relative;
}
.hover-click5 > div{
	display: block;
	position: relative;
}
.hover-click6 > div{
	display: block;
	position: relative;
}
.hover-click > a{	
	font-size: 120%;
}
.hover-click > div p{	
	font-size: 120%;
}
.hover-click2 > a{	
	font-size: 120%;
}
.hover-click2 > div p{	
	font-size: 120%;
}
.hover-click3 > a{	
	font-size: 120%;
}
.hover-click3> div p{	
	font-size: 120%;
}
.hover-click4 > a{	
	font-size: 120%;
}
.hover-click4 > div p{	
	font-size: 120%;
}
.hover-click5 > a{	
	font-size: 120%;
}
.hover-click5 > div p{	
	font-size: 120%;
}
.hover-click6 > a{	
	font-size: 120%;
}
.hover-click6 > div p{	
	font-size: 120%;
}
.fwB{
	font-size: 120%!important;
}
.fzLL{
	font-size: 120%!important;
}

}

/*  ----index-
 ------------ side-製品紹介 ------------*/

h4.side01-title{
	text-align: left;
	margin-bottom: 2px;
}
.side01 .catch {
	text-align: left;
}

.side01-title:before {
	content: "\f0a9";
	font-family: FontAwesome;
	color: #337AB7;
	font-size: 120%;
}
.side01-title:after {
	content: "\f08e";
	font-family: FontAwesome;
	color: #337AB7;
	font-size: 80%;
}
.alpha a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

/*  ----index-
 ------------ side-あさがくナビ ------------*/
 .asagaku{
	border: 1px solid #E8E8E8;
	padding-top: 15px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 15px;
	font-weight: bold;
 }
/*  ----index-
 ------------ side-名商就活ナビ2017 ------------*/
 .meisyo{
	border: 1px solid #E8E8E8;
	padding-top: 15px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 15px;
	font-weight: bold;
 }





/* !Btn
----------------------------------------------------------- */
.btn_basic01 {
    width: 100%;
	padding: 0 63px;
    height: 50px;
    display: table;
    color: #fff;
    text-decoration: none;
	border-radius: 4px;
	text-align: center;
	background-color: #337AB7;
	font-size: 120%;
}

.btn_basic01 span:after {  
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 100%;
	color: #FFF;
	padding-left: 5px;
}


.btn_basic01 span {
    display: table-cell;
    vertical-align: middle;
}
.btn_basic01:hover {
	background-color:#87D4FF;
}
.btn_basic01.color01 {
	background-color: #e39600;
}
.btn_basic01.color01:hover {
	background-color: #ebb54c;
}
.btn_basic01 span {
    display: table-cell;
    vertical-align: middle;
}


.btn_basic01-1 { /*-------- recruit-careerbtn --------*/
    width: 100%;
	padding: 0 63px;
    height: 50px;
    display: table;
    color: #fff;
    text-decoration: none;
	border-radius: 4px;
	text-align: center;
	background-color: #5EBABA;
	font-size: 120%;
}

.btn_basic01-1 span:after {  
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 100%;
	color: #FFF;
	padding-left: 5px;
}


.btn_basic01-1 span {
    display: table-cell;
    vertical-align: middle;
}
.btn_basic01-1:hover {
	background-color:#B0DDDD;
}
.btn_basic01-1.color01 {
	background-color: #e39600;
}
.btn_basic01-1.color01:hover {
	background-color: #ebb54c;
}
.btn_basic01-1 span {
    display: table-cell;
    vertical-align: middle;
}


.btn_basic02 {
	width: 50%;
	height: 50px;
	display: table;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
	text-align: center;
	background-color: #337AB7;
	font-size: 120%;
	/*margin-top: 20px;*/
}


.btn_basic02 span:after {  
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 100%;
	color: #FFF;
	padding-left: 5px;
}



.btn_basic02 span {
    display: table-cell;
    vertical-align: middle;
}

.btn_basic02:hover {
	background-color:#87D4FF;
}


.upper-roman{
	list-style-position: inside;
	list-style-type: upper-roman;
}

.btn_basic03 {
    background-color: #337ab7;
    border-radius: 4px;
    color: #fff;
    display: table;
    font-size: 120%;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 63px;
    text-align: center;
    text-decoration: none;
    width: 50%;
}

.btn_basic03 span:after {  
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 100%;
	color: #FFF;
	padding-left: 5px;
}


.btn_basic03 span {
    display: table-cell;
    vertical-align: middle;
}
.btn_basic03:hover {
	background-color:#87D4FF;
}
.btn_basic03.color01 {
	background-color: #e39600;
}
.btn_basic03.color01:hover {
	background-color: #ebb54c;
}
.btn_basic03 span {
    display: table-cell;
    vertical-align: middle;
}

@media screen and (max-width:767px){
.btn_basic01 {
	position: relative;
	padding: 0 30px;
	background-image: none;
}
.btn_basic01:after {

	display: block;
	width: 7px;
	height: 10px;
	position: absolute;
	right: 18px;
	top: 50%;
	margin-top: -5px;
	background: url(../../img/ico/ico_arrow_r02_sp.png) left top no-repeat;
	background-size: 7px 10px;
	-webkit-background-size: 7px 10px;
	-moz-background-size: 7px 10px;
}

.btn_basic02 {
	width: 100%;
	height: 50px;
	display: table;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
	text-align: center;
	background-color: #337AB7;
	font-size: 100%;
	margin-top: 20px;
}
}
/* --------------------------- company
------------------------------------------ */
.company-list-img{
	border: 1px solid #CCC !important;
	margin-top: 20px;
	margin-right: 20px;
	margin-bottom: 50px;
	margin-left: 20px;
	}
.company-list-font a{
	background-color: #3666a4;
    color: #fff;
    font-weight: bold;
    height: 20%;
    line-height: 3.5;
    position: absolute;
    right: 7%;
    text-align: center;
    width: 86%;
	
}
.company-list-font a:hover{
	background-color: #6994CD;
}

.company-list-font a:after{
	color: #fff;
    content: "";
    font-family: FontAwesome;
    font-size: 120%;
    margin-bottom: 10px;
    margin-left: 5px;
}

/*////guidelines.html////*/
/*（）*/
ol.list_parentheses{
  padding:0 0 0 2em;
  margin:0;
  text-indent:-2em;
  font-weight:normal;
} 
ol.list_parentheses li{
  list-style-type:none;
  list-style-position:inside;
  counter-increment: cnt;
}
ol.list_parentheses li:before{
  display: marker;
  content: "(" counter(cnt) ") ";
}
/*○*/
.list_circled {
    margin: 0 0 0 4em;
    padding: 0;
    position: relative;
    text-indent: -1em;
}
.list_circled li  {
list-style: none;
list-style-position:outside;
margin:0;
padding-left:1.25em
}
.list_circled li span {
position: absolute;
left:0;
margin:0
}
/*IE6*/
*html .list_circled li span  {
left: -1.25em;
}

/* --------------------------- access map
------------------------------------------ */
.nostyle-blue{
	border-radius:50%;
	background-color:#0760BE;
	color:#FFF;
	font-weight:bold;
	padding-left:5px;
	padding-right:5px;
	padding-top:2px;
	padding-bottom:2px;
	margin-left:5px;
	margin-right:5px;
}












 /*-------- recruit-flow-table --------*/
.table-border-no{
	border:none;
	width:90%;
	margin-left:auto;
	margin-right:auto;
}
.fa-large{
	font-size: 60px;
	color: #f5f5f5;
}

/*----------- 404
 ------------------------*/
.tit_basic01 {
	padding-top: 12px;
	font-size: 215%;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #3666A4;
	color: #3666A4;
}
@media screen and (max-width:767px){
.tit_basic01 {
	margin: 0 -10px;
	padding: 12px 10px 0;
}
}

@media screen and (max-width: 480px){
.company-list-font a{
    background-color: #3666a4;
    color: #fff;
    font-weight: bold;
    height: 20%;
   line-height: 1.7em;
    position: absolute;
    right: 14%;
    text-align: center;
    width: 73%;;
	}
}


/*sitemap*/
#sitemap_list{
	line-height:2em;
}


/*posts*/
.post {
	border-bottom: 1px #CCCCCC dotted;
	padding: 5px 0px;
	position: relative;
	top: 0;
	left: 0em;
	width: 100%;
	height: auto;
	line-height: 1.5em;
	margin-bottom: 5px;
	padding-left: 10em;
}
.date {
	text-align: left;
	padding-right: 10px;
	height: auto;
	/*width: 9em;*/
	float: left;
	font-weight: bold;
}



#guide {
	width:100%;
}
#previous{
	float:left;
}
#next{
	float:right;
}
.dotline{
	border-bottom-style: dotted;
    border-bottom-width: 1px;
    height: 1px;
    margin-bottom: 30px;
    margin-top: 20px;
    padding-top: 20px;
}

.news_bleftimg {
    float: left;
    padding-right: 10px;
}
.news_brightimg {
    float: right;
}

/*投稿詳細*/
.container dt.single-date{
	float:right;
	font-size:14px;
}

#news dl {
	border-bottom: 1px #CCCCCC dotted;
	padding: 5px 0px;
	position: relative;
	top: 0;
	left: 0em;
	width: 100%;
	height: auto;
	line-height: 1.5em;
	margin-bottom: 5px;
}
#news dt {
	text-align: left;
	padding-right: 5px;
	height: auto;
	width: 9em;
	float: left;
}
#news dd {
	text-align: left;
	padding-left: 18em;
	padding-right: 5px;
	height: auto;
}
#news .nat_tag {
	/* Firefox v1.0+ */
	-moz-border-radius: 4px;
	/* Safari v3.0+ and by Chrome v0.2+ */
	-webkit-border-radius: 4px;
	/* Firefox v4.0+ , Safari v5.0+ , Chrome v4.0+ , Opera v10.5+  and by IE v9.0+ */
	border-radius: 4px;
	width: 7em;
	margin: 0 1em;
	text-align: center;
	float: left;
	color: #FFF;
	/* behavior: url(PIE.htc); */
}
#news .info {
	background-color: #3075AD;
}
#news .event {
	background-color: #EE695B;
}
#news .keisai {
	background-color: #4AACAC;
}
#news .topix {
	background: #2A8BE0;
}
#news .awards {
	background-color: #87D068;
}

@media ( max-width: 767px ) {
#news dl {

}
#news dt {
	width: 100%;
	float: none;
}
#news dd {
	padding-left: 0em;
}
#news .nat_tag {
	margin: 0 0em;
	float: none;
}
}


/*お問い合わせフォーム　設定*/

.center_t{
	text-align: center;
}

#trust-form table{
	margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
	border: 1px solid #ddd;
}
#trust-form th{
	padding: 10px;
	text-align: left;
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	
}

#trust-form td{
	padding:5px;
	text-align:left;
	border: 1px solid #ddd;	
}

#trust-form　ul{
	margin:0;
	padding:0;	
}
#trust-form  li{
	list-style:none;	
}

#trust-form .require{
	background-color: #FF4444;
	color: #FFF;
	font-size: 12px;
	font-style: normal;
	border-radius: 5px;        /* CSS3草案 */
	-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 5px;   /* Firefox用 */
	margin-left: 10px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}

#trust-form .submessage {
    font-size: 80%;
}
#trust-form .error {
    color: red;
}

#confirm-button input:hover{
opacity:0.8;
filter:alpha(opacity=80);
-ms-filter: “alpha( opacity=80 )”;
}


/*
.require {
	color: #F00;
	font-size:12px;
}
.container .row .col-md-9 .col-md-12 .row #trust-form form table tbody tr th .subject .require {
	color: #F00;
}	*/
.container .row .col-md-9 .col-md-12 .row #trust-form form #confirm-button {
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #333;		
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}
/*.container .row .col-md-9 .col-md-12 .row #inquiryform-1 #iqfm-input-1 {
	background-color: #000;
}*/
#inquiryform-1 table{
	margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
	border: 1px solid #ddd;
}

#inquiryform-1 th{
	padding: 5px;
	text-align: left;
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	
}
#inquiryform-1 td{
	padding:5px;
	text-align:left;
	border: 1px solid #ddd;	
}

#inquiryform-1{
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #333;
}


#inquiryform-2 table{
	margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
	border: 1px solid #ddd;
}

#inquiryform-2 th{
	padding: 5px;
	text-align: left;
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	
}
#inquiryform-2 td{
	padding:5px;
	text-align:left;
	border: 1px solid #ddd;	
}

#inquiryform-2{
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #333;
}



#inquiryform-3 table{
	margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
	border: 1px solid #ddd;
}

#inquiryform-3 th{
	padding: 5px;
	text-align: left;
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	
}
#inquiryform-3 td{
	padding:5px;
	text-align:left;
	border: 1px solid #ddd;	
}

#inquiryform-3{
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 5px;
	font-weight: bold;
	color: #333;
}


/*.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.video-container iframe,  
.video-container object,  
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}*/
video {
	max-width: 100%;
	height: auto;
}

h5.chair-jirei {
	overflow: hidden;
	text-align: left;
}
h5.chair-jirei span {
	position: relative;
	display: inline-block;
	margin: 0 2.5em;
	padding: 0 1em;
	text-align: left;
}
h5.chair-jirei span::before,
h5.chair-jirei span::after {
    background-color: #ccc;
    content: "";
    height: 10px;
    position: absolute;
    top: 50%;
    width: 900%;
}
h5.chair-jirei span::before {
	right: 100%;
}
h5.chair-jirei span::after {
	left: 100%;
}


/*　中之島チャレンジ　SliderPro*/
.slider-pro p.sp-layer {
    font-size: 18px;
    line-height: 12px;
	
}
.table.item02 tr th.nknsm_bc{
    background-color: #eee!important;
}
.table.item02.nknsm{
    border: solid 1px #ccc;
}

#nakachalle_news dl {
	border-bottom: 1px #CCCCCC dotted;
	padding: 5px 0px;
	position: relative;
	top: 0;
	left: 0em;
	width: 100%;
	height: auto;
	line-height: 1.5em;
	margin-bottom: 5px;
}
#nakachalle_news dt {
	text-align: left;
	padding-right: 5px;
	height: auto;
	width: 7em;
	float: left;
}
#nakachalle_news dd {
	text-align: left;
	/*padding-left: 18em;*/
	padding-left: 8em;
	padding-right: 5px;
	height: auto;
}

@media ( max-width: 767px ) {
#nakachalle_news dl {

}
#nakachalle_news dt {
	width: 20%;
	float: none;
}
#nakachalle_news dd {
	padding-left: 7em;
}

}



