/* PC限定対応 -----------------------------------------------------------------------*/
.pcHide {
	display:none;
}
@media screen and (max-width:768px){
.pcHide {
	display:block !important;
}
}

.smpHide {
	display:block;
}
@media screen and (max-width:768px){
.smpHide {
	display:none !important;
}
}

.pcBr {
	display:block;
}
@media screen and (max-width:768px){
.pcBr {
	display:inline !important;
}
}

.smpBr {
	display:inline;
}
@media screen and (max-width:768px){
.smpBr {
	display:block !important;
}
}




/* 共通 -----------------------------------------------------------------------*/
body {
	font-size: 14px;
	color: #000000;
	line-height: 170%;
	text-align: center;
}
table {
	font-size: 14px;
	line-height: 170%;
}
.clearfix:after {
	clear: both;
	display: block;
	content: "";
}
form {
	margin: 0px;
}
img {
	border: 0px;
	vertical-align: middle;
}

.wrapper {
	max-width:950px;
	text-align:left;
	margin-left:auto;
	margin-right:auto;
}


#pankz {
	font-size: 0.8em;
	color: #666;
	display:block;
	text-align:left;
	background-color:#ECECEC;
	padding:5px 10px;
}
#pankz .wrapper {
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mgnBtm10 {
	margin-bottom:10px !important;
}
.mgnBtm20 {
	margin-bottom:20px !important;
}
.mgnBtm30 {
	margin-bottom:30px !important;
}
.mgnBtm40 {
	margin-bottom:40px !important;
}
.mgnBtm50 {
	margin-bottom:50px !important;
}
.mgnTop10 {
	margin-top:10px !important;
}
.mgnTop20 {
	margin-top:20px !important;
}
.mgnTop30 {
	margin-top:30px !important;
}
.mgnTop40 {
	margin-top:40px !important;
}
.mgnTop50 {
	margin-top:50px !important;
}



ul.ul1 {
	
}
ul.ul1 li {
	padding:0 0 0 20px;
	background-image: url(../img/icn1.gif);
	background-repeat: no-repeat;
	background-position: 5px 6px;
}
.dl1 {
}
.dl1 dt {
	width:80px;
	float:left;
	display:block;
	font-weight: bold;
}
.dl1 dd {
	display:block;
	margin:0 0 0 80px;
}

.ol1 {
	margin:0 0 0 30px;
}
.ol1 li {
	margin:0 0 10px 0;
}

input[type="text"] {
	vertical-align:middle;
	font-size:16px;
	padding:2px;
	margin:3px;
}
input[type="radio"] {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
	margin-right:10px;
	vertical-align:middle;
}
input[type="checkbox"] {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
	margin-right:10px;
	vertical-align:middle;
}
input[type="submit"] {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
	vertical-align:middle;
}
textarea {
	vertical-align:middle;
	font-size:16px;
	padding:2px;
	margin:3px;
}


.btnOv:hover {
	filter: alpha(opacity=80);  /* IE */
	-moz-opacity:0.80;  /* Firefox・Netscape */
	opacity:0.80;  /* Opera・Safari */
	vertical-align:baseline;
	top:1px;
	position: relative;
}

.btn1 {
	color: #FF0000;
	border:1px solid #FF0000;
	background-color:#FFFFFF;
	border-radius: 5px;
	box-sizing:border-box;
	-moz-box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	-webkit-box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	display: inline-block;
	text-decoration:none;
	text-align:center;
	padding: 10px 40px 10px 20px;
	position:relative;
	line-height:150%;
	cursor:pointer;
}
.btn1:before {
	font-family: 'FontAwesome';
	content: "\f054";
	position: absolute;
	top: 50%;
	right: 10px;
	color:#FF0000;
	margin-top:-0.7em;
}
.btn2 {
	color: #FFFFFF;
	border:1px solid #FFFFFF;
	background-color:#0051bd;
	border-radius: 5px;
	box-sizing:border-box;
	-moz-box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	-webkit-box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	box-shadow:
		0px 1px 3px rgba(000,000,000,0.2),
		inset 0px 0px 2px rgba(255,255,255,1);
	display: inline-block;
	text-decoration:none;
	text-align:center;
	padding: 10px 40px 10px 20px;
	position:relative;
	line-height:150%;
	cursor:pointer;
	box-sizing:border-box;
}
.btn2:before {
	font-family: 'FontAwesome';
	content: "\f054";
	position: absolute;
	top: 50%;
	right: 10px;
	color:#FFFFFF;
	margin-top:-0.7em;
}

.w1 {
	width:100%;
}

.alignCnt {
	text-align:center;
}


/* ヘッダー---------------------------------------------------- */

#hd {
	width: 100%;
	background-repeat: repeat-x;
	background-position: top center;
	background-image: url(../img/hd_bg.gif);
	background-color: #FFF;
}
@media screen and (max-width: 1000px){
#hd {
	margin-top:60px;
}
}

#hd #hd_main {
	
}
#hd .logo {
	padding-top: 20px;
	float:left;
}
#hd .logo a {
	width:277px;
	height:39px;
	background-image: url(../img/hd_logo.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:39px;
}
#hd .catch {
	padding: 0;
	float:right;
	width:600px;
	text-align: right;
}
@media screen and (max-width: 1000px){
#hd .catch {
	display:none;
}
}

#hd .catch strong,
#hd .catch h1{
	text-align: right;
	display: block;
	padding-top: 30px;
	font-weight: bold;
}

#hd .topimg {
	background-repeat: repeat-x;
	background-position: top center;
	text-align: center;
	background-color: #0051BD;
	border-bottom: 1px solid;
	border-bottom-color: #000;
}
#hd .topimg2 {
	text-align: center;
	background-color: #0051BD;
}





/* ナビゲーション -----------------------------------------------------------------------*/
.sb-slidebar {
	border-left:1px solid #E4E4E4;
	background-color:#002759;
}

#logo {
	background-image: url(../img/hd_logo.png);
	background-repeat: no-repeat;
	background-position:center;
	width: 275px;
	height: 38px;
	display: block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	line-height: 38px;
	float: left;
	margin-top: 20px;
	margin-left: 15px;
}
@media screen and (max-width: 1000px){
#logo {
	width: 200px;
	height:auto;
	line-height: 60px;
	background-size:100%;
	position:absolute;
	z-index:99;
	margin:0;
	margin-left:10px;
}
}

.main_content {
    padding-top: 60px;
}
 
#header {
    position: fixed;
	top:0;
	left:0;
    width:100%;
    height: 60px;
    z-index: 4;
	display:none;
	background: rgba(255, 255, 255, 0.90);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1000px){
#header {
	display:block;
}
}
#header .sb-toggle-right {
	float: right;
	display: block;
	cursor: pointer;
	padding: 0;
	color: #fff;
	text-align: center;
	text-decoration: none;
	background-color: #002759;
	width: 60px;
	height: 60px;
	margin: 0;
	position: relative;
}
#header .sb-toggle-right:after {
	font-family: 'FontAwesome';
	content: "\f0c9";
	position: absolute;
	top: 30%;
	left:50%;
	margin-left:-0.4em;
	color:#FFFFFF;
	margin-top:0;
	font-size:180%;
}

#navi {
	text-align: left;
	width: 100%;
	height:60px;
	margin-top:15px;
	position: relative;
	z-index: 9999;
	background-color:#002759;
}
@media screen and (max-width: 1000px){
#navi {
	position: relative;
	background-image:none;
	margin:0;
}
}

#navi>ul {
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
	max-width:950px;
}

#navi li {
	float:left;
	width:15%;
	min-width:100px;
}
#navi li.navi02 {
	width:40%;
}
@media screen and (max-width: 1000px){
#navi li {
	float:none;
	width:100%;
	overflow: hidden;
	border-bottom: 1px solid #E0E0E0;
}
#navi li:after {
	font-family: 'FontAwesome';
	content: "\f105";
	position: absolute;
	top:50%;
	margin-top:-0.7em;
	right:10px;
	color:#FFFFFF;
	font-size:1em;
}
#navi li.navi02 {
	width:100%;
}
}


#navi li a {
	display: block;
	position: relative;
	line-height:60px;
	margin:0;
	text-decoration:none;
	text-align: center;
	color:#FFFFFF;
}

#navi li a:hover {
	
}
#navi li a:before {
	content: "";
	position:absolute;
	border-radius: 5px;
	width:100%;
	height:3px;
	left:0;
	bottom:0;
	-webkit-transform: scaleX(0);
	-ms-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
}
#navi li a:hover:before {
    background:#FFFFFF;
	-webkit-transform: scaleX(1);
	-ms-transform: scaleX(1);
	transform: scaleX(1);
}

.dropmenu li ul.ko{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 1000px){
.dropmenu li ul.ko{
  position: relative;
}
}

.dropmenu li ul.ko li{
  width:100% !important;
  position:relative;
}
@media screen and (max-width: 1000px){
.dropmenu li ul.ko li{
	border:0 !important;
	border-top:1px dotted #CCCCCC !important;
}
.dropmenu li ul.ko li:after {
	font-family: 'FontAwesome';
	content: "\f105";
	position: absolute;
	top:50%;
	margin-top:-0.7em;
	right:10px;
	color:#FFFFFF;
	font-size:1em;
}
}
.dropmenu li ul.ko li a{
	padding: 10px 10px !important;
	border-top: 1px solid #FFFFFF;
	background-color: #003476;
	text-align: left;
	font-size: 0.9em;
	line-height: 1.2em !important;
}
@media screen and (max-width: 1000px){
.dropmenu li ul.ko li a{
	border: 0;
	padding: 10px 30px 10px 10px !important;
	background-color: #003476;
}
}
.dropmenu li{
  perspective: 400px;
}
@media screen and (max-width: 1000px){
.dropmenui li{
  perspective: 0;
}
}
.dropmenu li ul.ko{
  visibility: hidden;
  transform: rotateX(-90deg);
  transform-origin: 50% 0;
}
@media screen and (max-width: 1000px){
.dropmenu li ul.ko{
  visibility: visible;
  transform: none;
  transform-origin: 0;
  transition: 0;
}
}
.dropmenu li:hover ul.ko{
  visibility: visible;
  transform: rotateX(0);
  transition: .3s;
}





/* ボディ -----------------------------------------------------------------------*/

#bd {
	width: 100%;
	background-repeat: repeat-y;
	background-position: top center;
	padding: 0 0 100px 0;
	background-color: #FFF;
}
#clm_lft {
	text-align: left;
	padding: 0;
}
#clm_rgt {
	text-align: left;
	padding: 0;
}



/* フッター -----------------------------------------------------------------------*/

#ft {
	max-width: 100%;
	background-color: #ECF4FF;
	border-top: 2px solid;
	border-top-color: #CAE0FF;
	padding: 20px 10px 30px 10px;
	text-align:center;
}
@media screen and (max-width: 768px){
#ft {
	padding: 0;
}
}

#ft #ft_rgt {
	text-align: right;
	position: relative;
	display:table;
	width:100%;
	margin-top:15px;
}
#ft .ft_menu {
	display:inline-block;
}

#ft #ft_menu1 {
	position: relative;
	padding: 0;
	margin: 0;
	font-size:0.9em;
	width:40%;
}

#ft #ft_menu2 {
	position: relative;
	top: 0px;
	padding-left:20px;
	font-size:0.9em;
	width:calc(24% - 20px);
}
@media screen and (max-width: 768px){
#ft #ft_menu2 {
	width:100%;
	box-sizing:border-box;
	padding:10px;
}
}

#ft #ft_menu3 {
	position: relative;
	padding-left:20px;
	font-size:0.9em;
	width:calc(34% - 20px);
}

#ft #ft_menu1 .ttl1 {
	border-bottom:1px solid;
	color: #0051BD;
	margin-bottom: 10px;
	font-size: 14px;
	font-weight: normal;
}
#ft #ft_menu2 .ttl1 {
	border-bottom:1px solid;
	color: #0972FF;
	margin-bottom: 10px;
	font-size: 14px;
	font-weight: normal;
}
#ft #ft_menu3 .ttl1 {
	border-bottom:1px solid;
	color: #539CFF;
	margin-bottom: 10px;
	font-size: 14px;
	font-weight: normal;
}
#ft .ft_menu a {
	position:relative;
	padding-left:15px;
}
#ft .ft_menu a:before {
	font-family: 'FontAwesome';
	content: "\f105";
	position: absolute;
	top: 0;
	left:0;
	margin-top:-0.3em;
	color:#0051bd;
	font-size:1.3em;
}



#ft .menu {
	padding:0px;
}


#ft .lft {
	display:table-cell;
	text-align:left;
	font-size:0.9em;
	line-height:1.5em;
	width:40%;
	padding-right:10px;
}

#ft .rgt {
	display:table-cell;
	background-color:#FFFFFF;
	border:1px solid #d5e3e9;
	border-radius:5px;
	padding:10px;
	font-size:0.9em;
	line-height:1.3em;
	text-align:center;
	display:table;
	width:100%;
	box-sizing:border-box;
}
#ft .rgt img {
	max-width:250px;
	display:table-cell;
}
#ft .rgt div {
	display:table-cell;
	padding-left:15px;
}

#ft .rgt h2 {
	font-weight:bold;
	color:#0051bd;
	margin:10px 0 5px 0;
}



.copyright {
	padding:30px 10px;
	text-align: center;
	background-color: #0051BD;
	color: #FFF;
	font-size:0.9em;
}
.copyright a {
	color: #FFF;
}



/* スライド -----------------------------------------------------------------------*/


#slide {
	width:100%;
	height:auto;
}
.bx-wrapper {
	position: relative;
	margin: 0 auto;
	padding: 0;
	*zoom: 1;
}
.bx-wrapper .bx-viewport {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow:0;
	border: 0;
	left: 0;
	background:none;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	position: absolute;
	bottom: 0px;
	width: 100%;
	z-index:100;
}

.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;
	padding-top: 20px;
}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	width:25%;
}

.bx-wrapper .bx-pager.bx-default-pager {
	height:5px;
	width:100%;
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background-color: #000;
	text-indent: -9999px;
	display: block;
	height: 5px;
	outline: 0;
	width:100%;
	border-left:1px solid #0051bd;
	box-sizing:border-box;
	margin:0;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #0051BD;
}




/*　トップページ--------------------------------------------　*/
#idx {
	max-width: 950px;
	padding-top: 25px;
}
@media screen and (max-width: 1000px){
#idx {
	width:92%;
	margin:0 auto;
}
}

#idx a{
	width:32%;
	position: relative;
	float:left;
	border:1px solid #CCCCCC;
	border-radius:5px;
	box-sizing:border-box;
	margin-right:2%;
	margin-bottom:2%;
	text-decoration:none;
	color:#222222;
	box-shadow: 0 9px 12px -9px #222;
}
#idx a:hover{
	border:1px solid #0051bd;
}

#idx a:nth-child(3n){
	margin-right:0;
}

@media screen and (max-width: 1000px){
#idx a{
	width:49%;
}
#idx a:nth-child(3n){
	margin-right:2%;
}
#idx a:nth-child(2n){
	margin-right:0;
}
}
@media screen and (max-width: 640px){
#idx a{
	width:100%;
	margin-right:0;
}
}


#idx .idx_box{
	padding:15px;
}
#idx .idx_box h2{
	position:absolute;
	top:0;
	left:0;
	width:100%;
}
#idx .idx_box h2 img{
	width:90%;
	margin:4.5% 5% 5% 5%;
}
#idx .idx_box h2:after {
	content: '';
	background-color: #0051bd;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: inline-block;
	width: 120px;
	height: 6px;
	margin: 0 auto;
}
#idx .txt{
	display:block;
	width: 100%;
	margin-top:30%;
}


/*　ソリューション・サービス--------------------------------------------　*/

h1.solTtl {
	color:#FFFFFF;
	text-align:center;
	padding:1em 0;
	font-size:1.5em;
	font-weight:bold;
	background-color:#0051BD;
}
@media screen and (max-width:1000px){
h1.solTtl {
	margin-top:60px;
}
}
h1.solTtl span {
	display:block;
	font-size:0.7em;
	font-weight:normal;
}

#sol {
	margin-top:25px;
}
@media screen and (max-width: 1000px){
#sol {
	width:92%;
	margin:25px auto 0 auto;
}
}

#sol .box1,
#sol .box2,
#sol .box3,
#sol .box4,
#sol .box5,
#sol .box6,
#sol .box7{
	margin-bottom:50px;
}
@media screen and (max-width: 1000px){
#sol .box1,
#sol .box2,
#sol .box3,
#sol .box4,
#sol .box5,
#sol .box6,
#sol .box7 {
	width:92%;
	margin:0 auto;
}
}

#sol .box1 .img {
	width:350px;
}
@media screen and (max-width: 640px){
#sol .box1 .img {
	width:100%;
}
}


#sol .box3 .txt {
	float:left;
	width:calc(100% - 270px);
}
@media screen and (max-width: 640px){
#sol .box3 .txt {
	float:none;
	width:100%;
	margin-bottom:15px;
}
}

#sol .box3 .img {
	float:right;
	max-width:250px;
	margin-bottom:15px;
}
@media screen and (max-width: 640px){
#sol .box3 .img {
	float:none;
	max-width:100%;
}
}

#sol .box7 .img {
	width:274;
	height:157px;
	background-image: url(../img/isms1.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:157px;
}
#sol .box1 dt {
	float:left;
	width:calc(100% - 370px);
}
@media screen and (max-width: 640px){
#sol .box1 dt {
	float:none;
	width:92%;
	margin:0 auto 15px auto;
}
}


#sol .box1 dd {
	float:right;
}
@media screen and (max-width: 640px){
#sol .box1 dd {
	float:none;
	width:92%;
	margin:0 auto;
}
}

#sol .box7 dt {
	float:left;
	width:274px;
}
@media screen and (max-width: 798px){
#sol .box7 dt {
	float:none;
	width:100%;
	text-align:center;
	margin-bottom:15px;
}
}
#sol .box7 dd {
	margin-left:300px;
}
@media screen and (max-width: 798px){
#sol .box7 dd {
	margin-left:0;
}
}


#sol .optbox {
	clear: both;
	padding: 0 0 5px 0;
	margin:10px 0 0 0;
	background-color:#ecf4ff;
}
#sol .optbox p {
	clear: both;
	padding: 10px 10px 10px 15px;
}
#sol .optbox strong {
	color: #0E9831;
}

#solmenu {
	padding:0;
	line-height: 130%;
}
#solmenu li {
	border-bottom: 1px solid;
	border-bottom-color: #CCC;
	border-left: 1px solid;
	border-left-color: #CCC;
	border-right: 1px solid;
	border-right-color: #CCC;
}
#solmenu li a {
	padding:10px 10px;
	display: block;
}
#solmenu li a:hover {
	background-color: #E1EEFF;
}
#solmenu li.ttl {
	padding:0;
	border:0;
}


/*　インターネットサービス--------------------------------------------　*/

h1.netTtl {
	width:950px;
	height:68px;
	background-image: url(../img/sol_net_ttl.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:68px;
}
#net {
	margin-top:25px;
	width:92%;
	margin:0 auto;
}
#net .tbl_1 {
	border-top:1px solid;
	border-color:#CCC;
	margin-bottom:10px;
}
#net .tbl_1 li {
	border-bottom:1px solid;
	border-color:#CCC;
	padding:3px 0;
	background-image: url(../img/pc_net_tbl1_bg.gif);
	background-repeat: repeat-y;
}
#net .tbl_1 li.ttl {
	background-color: #D2E7FF;
}
#net .tbl_1 .ttl_1,
#net .tbl_1 .ttl_2,
#net .tbl_1 .ttl_3,
#net .tbl_1 .ttl_4{
	float:left;
}
#net .tbl_1 .ttl_1 {
	width:260px;
	position:relative;
	left:10px;
}
#net .tbl_1 .ttl_2 {
	width:120px;
	position:relative;
	left:30px;
}
#net .tbl_1 .ttl_3 {
	width:120px;
	position:relative;
	left:50px;
}
#net .tbl_1 .ttl_4 {
	width:120px;
	position:relative;
	left:70px;
}
#net .tbl_1 .detail_1,
#net .tbl_1 .detail_2,
#net .tbl_1 .detail_3,
#net .tbl_1 .detail_4{
	float:left;
}
#net .tbl_1 .detail_1 {
	width:260px;
	position:relative;
	left:10px;
}
#net .tbl_1 .detail_2 {
	width:120px;
	position:relative;
	left:30px;
}
#net .tbl_1 .detail_3 {
	width:120px;
	position:relative;
	left:50px;
}
#net .tbl_1 .detail_4 {
	width:120px;
	position:relative;
	left:70px;
}

#net .tbl_2 {
	border-top:1px solid;
	border-color:#CCC;
	margin-bottom:10px;
}
#net .tbl_2 li {
	border-bottom:1px solid;
	border-color:#CCC;
	padding:3px 0;
	background-image: url(../img/pc_net_tbl2_bg.gif);
	background-repeat: repeat-y;
}
#net .tbl_2 .detail_1,
#net .tbl_2 .detail_2{
	float:left;
}
#net .tbl_2 .detail_1 {
	width:180px;
	position:relative;
	left:10px;
	font-weight:bold;
}
#net .tbl_2 .detail_2 {
	width:480px;
	position:relative;
	left:30px;
}

#net .tbl_3 {
	height:100%;
	border-collapse:collapse;
}
#net .tbl_3 th {
	border:1px solid #CCCCCC;
	background-color:#ecf4ff;
	padding:5px 10px;
}
#net .tbl_3 td {
	border:1px solid #CCCCCC;
	padding:5px 10px;
}
@media screen and (max-width: 640px){
#net .tbl_3 th {
	display:list-item;
	list-style-type:none;
	display:none;
	padding:0;
}
#net .tbl_3 td {
	display:list-item;
	list-style-type:none;
	position:relative;
	border-top:0;
	padding:5px 0 5px 8em;
}
#net .tbl_3 tr {
	border-top:1px solid #CCCCCC;
}

#net .tbl_3 td:nth-child(4n) {
	margin-bottom:15px;
}

#net .tbl_3 td:nth-child(n):before {
	content:'接続コース名';
	position:absolute;
	top:0;
	left:0;
	background-color:#ecf4ff;
	width:8em;
	height:calc(100%-5px);
	font-size:0.9em;
	padding:5px 10px;
	box-sizing:border-box;
}
#net .tbl_3 td:nth-child(2n):before {
	content:'入会金';
}
#net .tbl_3 td:nth-child(3n):before {
	content:'月額基本料';
}
#net .tbl_3 td:nth-child(4n):before {
	content:'HP容量';
}
}


#net .tbl_4 {
	height:100%;
	border-collapse:collapse;
}
#net .tbl_4 th {
	border:1px solid #CCCCCC;
	background-color:#ecf4ff;
	padding:5px 10px;
}
#net .tbl_4 td {
	border:1px solid #CCCCCC;
	padding:5px 10px;
}
@media screen and (max-width: 640px){
#net .tbl_4 th {
	display:list-item;
	list-style-type:none;
	padding:5px 10px;
}
#net .tbl_4 td {
	display:list-item;
	list-style-type:none;
	position:relative;
	border-top:0;
	padding:5px 5px 5px 2em;
}
}



/*　システム導入例--------------------------------------------　*/
h1.caseTtl {
	width:950px;
	height:68px;
	background-image: url(../img/sys_ttl.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:68px;
}
#case {
	margin-top:25px;
}
@media screen and (max-width:1000px){
#case {
	width: 92%;
	margin:2em auto 0 auto;
}
}

#caseList {
	padding:0;
	margin-top:15px;
}
#caseList .caseBox {
	padding: 15px;
	margin: 0 0 20px 0;
	border:1px solid #CCCCCC;
	border-radius:5px;
	display:block;
	text-decoration:none;
	color:#222222;
}
#caseList .caseBox:hover {
	border-color:#0051bd;
}

#caseList .caseBox .image {
	float: left;
	width: 260px;
	height:200px;
	background-image:url(../img/case001_img1.gif);
	background-position:center;
	background-size:cover;
}
@media screen and (max-width:640px){
#caseList .caseBox .image {
	float: none;
	width: 100%;
	height:120px;
	margin-bottom:10px;
}
}
#caseList .caseBox .ttl {
	font-size: 1.8em;
	line-height:1.3em;
	border-bottom: 1px dotted;
	padding: 0 0 5px 0;
	display: block;
	margin: 0 0 10px 0;
}
#caseList .caseBox .txt {
	margin-left:280px;
}
@media screen and (max-width:640px){
#caseList .caseBox .txt {
	margin-left:0;
	font-size:0.9em;
}
}



#caseList .caseBox .txt .detail {
	font-size:0.9em;
	line-height:1.8em;
}
#caseList .caseBox .txt .gyousyu {
	width:71px;
	height:20px;
	margin-right:5px;
	background-image: url(../img/caseBoxGyosyu.gif);
	background-repeat: no-repeat;
	display:inline-block;
	/float:left;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:20px;
}
#caseList .caseBox .txt .keyword {
	width:71px;
	height:20px;
	margin-right:5px;
	background-image: url(../img/caseBoxKeyword.gif);
	background-repeat: no-repeat;
	display:inline-block;
	/float:left;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:20px;
}
#case .detail1 {
	margin-bottom:50px;
}
#case .detail1 h2 {
	position: relative;
	font-weight: bold;
	text-align:center;
	display:block;
	margin:20px auto;
	font-size:1.6em;
	background-color:#FFFFFF;
	border-bottom:3px solid;
	border-color:#ff0000;
	padding:0 10px 20px 10px;
	box-shadow:rgba(0, 0, 0, 0.2) 0px 6px 9px -3px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.2) 0px 6px 9px -3px;
	-moz-box-shadow:rgba(0, 0, 0, 0.2) 0px 6px 9px -3px;
}
#case .detail1 h2:before {
	content: "";
	position: absolute;
	bottom: -8px;
	left:50%;
	margin-left: -9px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 9px 0 9px;
	border-color: #FFFFFF transparent transparent transparent;
	z-index: 2;
}
#case .detail1 h2:after {
	content: "";
	position: absolute;
	bottom: -12px;
	left:50%;
	margin-left: -10px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: #ff0000 transparent transparent transparent;
	z-index: 1;
}






#case .detail1 li {
	border-bottom:1px dotted;
	border-color:#999;
	padding:3px 0;
}
#case .detail1 li .ttl {
	float:left;
}
#case .detail1 li .detail {
	margin-left:120px;
}
#case .detail2 {
	margin-top:15px;
	text-align:center;
}
#case .detail2 .box {
	display:inline-block;
	width:300px;
	margin:0 5px 40px 5px;
}
@media screen and (max-width:340px){
#case .detail2 .box {
	width:100%;
	margin:0 0 40px 0;
}
}

#case .detail2 .box ul {

}
#case .detail2 .box ul li strong {
	color: #F60;
}
#case .sub {
	font-size:11px;
	line-height:130%;
}



/*　会社概要--------------------------------------------　*/
h1.comTtl {
	width:950px;
	height:68px;
	background-image: url(../img/com_gaiyou_ttl.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:68px;
}
h1.comTtl2 {
	width:950px;
	height:68px;
	background-image: url(../img/com_idx_ttl.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:68px;
}

#com {
	margin-top:25px;
}
@media screen and (max-width:1000px){
#com {
	width:92%;
	margin:25px auto 0 auto;
}
}

#com .tbl_1 {
	border-top:1px solid;
	border-color:#CCC;
	margin-bottom:10px;
}
#com .tbl_1 li {
	border-bottom:1px solid;
	border-color:#CCC;
	padding:3px 0;
	background-image: url(../img/pc_com_tbl1_bg.gif);
	background-repeat: repeat-y;
}
#com .tbl_1 .detail_1,
#com .tbl_1 .detail_2{
	float:left;
}
#com .tbl_1 .detail_1 {
	width:140px;
	position:relative;
	left:10px;
}
#com .tbl_1 .detail_2 {
	width:520px;
	position:relative;
	left:30px;
}
#com .tbl_2 {
}
#com .tbl_2 .detail_1 {
	float:left;
	width:274px;
}
@media screen and (max-width:768px){
#com .tbl_2 .detail_1 {
	float:none;
	width:100%;
	text-align:center;
}
}
#com .tbl_2 .detail_2 {
	float:right;
	width:calc(100% - 290px);
}
@media screen and (max-width:768px){
#com .tbl_2 .detail_2 {
	float:none;
	width:100%;
}
}

#com .tbl_3 {
	margin-bottom:70px;
}
#com .tbl_3 li {
	padding:3px 0;
	border-bottom:1px solid;
	border-color:#CCC;
}
#com .tbl_3 .detail_1,
#com .tbl_3 .detail_2{
	float:left;
}
#com .tbl_3 .detail_1 {
	width:120px;
	position:relative;
	left:10px;
}
#com .tbl_3 .detail_2 {
	width:540px;
	position:relative;
	left:30px;
}

#com .tbl_4 {
	margin-bottom:10px;
}
#com .tbl_4 li {
	padding:10px 0;
	border-bottom:1px solid;
	border-color:#CCC;
}
#com .tbl_4 .detail_1,
#com .tbl_4 .detail_2{
	float:left;
}
#com .tbl_4 .detail_1 {
	width:120px;
	position:relative;
	left:10px;
	font-size:20px;
	font-weight:bold;
}
#com .tbl_4 .detail_2 {
	width:540px;
	position:relative;
	left:30px;
}
#com .tbl_4 dl {
}
#com .tbl_4 dl dt {
	width:80px;
	float:left;
	display:block;
	font-weight: bold;
}
#com .tbl_4 dl dd {
	width:420px;
	display:block;
	margin:0 0 0 80px;
}
#com .tbl_4 .sub {
	font-size:11px;
	line-height:130%;
}

#com .rinen {
	width:700px;
	height:76px;
	background-image: url(../img/pc_com_rinen.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:76px;
	margin:0 auto 50px auto;
}
@media screen and (max-width:768px){
#com .rinen {
	width:100%;
	height:auto;
	background-image:none;
	font-size:2em;
	text-indent: 0;
	white-space:normal;
	line-height:auto;
}
}

.comTbl1>dt {
	font-size:1.5em;
	font-weight:bold;
	float:left;
	width:6em;
	padding:15px 0;
}
@media screen and (max-width:768px){
.comTbl1>dt {
	float:none;
	width:100%;
}
}
.comTbl1>dd {
	padding:15px 0 15px 10em;
	border-bottom:1px solid #CCCCCC;
}
@media screen and (max-width:768px){
.comTbl1>dd {
	padding:15px 0 15px 0;
}
}



/*　お問い合わせ--------------------------------------------　*/
h1.conTtl {
	width:950px;
	height:68px;
	background-image: url(../img/con_ttl.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:68px;
}
#con {
	margin-top:25px;
}
@media screen and (max-width:1000px){
#con {
	width:92%;
	margin:25px auto 0 auto;
}
}

#con_mail {
	float:left;
	width:48%;
}
@media screen and (max-width:1000px){
#con_mail {
	float:none;
	width:100%;
}
}

#con_tel {
	float:right;
	width:48%;
}
@media screen and (max-width:1000px){
#con_tel {
	float:none;
	width:100%;
	margin-bottom:30px;
}
}

#con .mailBtn1 a {
	margin-left:auto;
	margin-right:auto;
	width:268px;
	height:40px;
	background-image: url(../img/btn_mailform.gif);
	background-repeat: no-repeat;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:40px;
}
#con .dl_1 {
}
#con .dl_1 dt {
	width:80px;
	float:left;
	font-weight: bold;
}
#con .dl_1 dd {
	margin-left:90px;
}




#mailbox {
	max-width:700px;
	margin-left:auto;
	margin-right:auto;
	text-align: left;
	margin-top:25px;
}
@media screen and (max-width:1000px){
#mailbox {
	width:92%;
	margin:25px auto 0 auto;
}
}

#mailbox2 {
	border: 1px solid;
	padding: 20px;
	border-color: #CAE0FF;
	background-color: #ECF4FF;
	margin: 20px 0 0 0;
	border-radius: 10px; 
	text-align:center;
}
#mailbox2 .btn {
	background-image: url(../img/btn_send.gif);
	width: 164px;
	height: 31px;
	border:0;
	cursor:pointer;
	margin-left:auto;
	margin-right:auto;
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	line-height:31px;
}
#mailbox .mailTtl {
	font-size:18px;
	text-align:left;
	font-weight:bold;
	border-bottom:2px solid;
	border-color:#0051BD;
	color:#0051BD;
	padding-bottom:10px;
	margin-bottom:15px;
}

#mailform {
}
#mailform span {
	color: #F00;	
}
#mailform table.mailform {
	margin:0;
}
#mailform table.mailform th {
	padding:5px 10px;	
}
#mailform table.mailform td {
	padding:5px 10px;	
}
#mailform .tbl_1 {
	margin-bottom:10px;
	text-align:left;
}
#mailform .tbl_1 li {
	padding:3px 0;
}
#mailform .tbl_1 li:after {
	clear: both;
	display: block;
	content: "";
}

#mailform .tbl_1 .detail_1,
#mailform .tbl_1 .detail_2{
	float:left;
}
#mailform .tbl_1 .detail_1 {
	width:180px;
	position:relative;
}
@media screen and (max-width:768px){
#mailform .tbl_1 .detail_1 {
	width: 100%;
	border-left: 5px solid #0051bd;
	padding-left: 8px;
	margin-bottom: 5px;
	box-sizing: border-box;
}
}

#mailform .tbl_1 .detail_2 {
	width:460px;
	position:relative;
}
@media screen and (max-width:768px){
#mailform .tbl_1 .detail_2 {
	width:100%;
}
}

#mailform input,
#mailform textarea{
	width:100%;
	box-sizing:border-box;
}
#mailform input.check {
	width:auto;
}

#mailbox2 .msg {
	text-align:center;
}
#mailbox2 .back {
	padding:2px 8px;
	margin-top:20px;
}



/* テーブル---------------------------------------------------- */
.tbl1 {
	border-collapse: collapse;
	list-style-type:none;
	max-width:800px;
	margin:0 auto;
}
.tbl1 th {
	border: 1px solid;
	box-sizing:border-box;
	border-color: #CCCCCC;
	padding: 5px 10px;
	font-weight: bold;
	background-color: #ececec;
	width:10em;
}
@media screen and (max-width:768px){
.tbl1 th {
	display:list-item;
	width:calc(100%);
	border-bottom:0;
}
}
.tbl1 td{
	border: 1px solid;
	box-sizing:border-box;
	border-color: #CCCCCC;
	padding: 5px 10px;
}
@media screen and (max-width:768px){
.tbl1 td {
	display:list-item;
	width:calc(100%-20px);
	border-bottom:0;
}
.tbl1 tr:last-child td:last-child {
	border-bottom:1px solid;
	border-color: #CCCCCC;
}
}




/* リスト構造
---------------------------------------------------- */
#lst1 ul {
	list-style-type: none;
	padding-left: 0px;
	margin-left: 0px;
}
#lst1 li {
	list-style-type: none;
	padding-left: 20px;
}
#lst1 li .head {
	background-color: #EEEEEE;
	margin: 5px 0px 3px 0px;
	padding: 3px;
	border-bottom: 1px solid;
	border-bottom-color: #999999;
}



/* 見出し構造
---------------------------------------------------- */
.ttl1 {
	padding: 0;
	margin: 0;
	font-size: 19px;
	font-weight: bold;
}


.ttl2 {
	padding: 20px 0;
	margin: 0 0 40px 0;
	font-size: 2em;
	line-height:1.3em;
	font-weight: bold;
	background-repeat: no-repeat;
	background-position: left bottom;
	border-bottom: 1px solid;
	border-bottom-color: #CCC;
	color: #0051BD;
	text-align:center;
	position:relative;
}
.ttl2:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: inline-block;
	width: 6em;
	height: 6px;
	margin: 0 auto;
	background-color: #0051bd;
}

.ttl3 {
	padding: 0;
	margin: 0 0 20px 0;
	font-size: 16px;
	font-weight: bold;
	color: #0097BD;
}
.ttl4 {
	padding-bottom:5px;
	margin: 0 0 20px 0;
	font-size: 20px;
	font-weight: bold;
	color: #0051bd;
	border-bottom:1px solid;
	border-color:#0051bd;
}



/* 基本フォント設定
---------------------------------------------------- */
.f10-1 {
	font-size: 10px;
	color: #000000;
	vertical-align: middle;
}

.f11-1 {
	font-size: 11px;
	color: #000000;
	vertical-align: middle;
}

.f12-1 {
	font-size: 12px;
	color: #000000;
	vertical-align: middle;
}

.f13-1 {
	font-size: 13px;
	color: #000000;
	vertical-align: middle;
}

.f14-1 {
	font-size: 14px;
	color: #000000;
	vertical-align: middle;
}

.f15-1 {
	font-size: 17px;
	color: #000000;
	vertical-align: middle;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

.f16-1 {
	font-size: 16px;
	color: #000000;
	vertical-align: middle;
}

.f17-1 {
	font-size: 17px;
	color: #000000;
	vertical-align: middle;
}

.f18-1 {
	font-size: 18px;
	color: #000000;
	vertical-align: middle;
}

.f19-1 {
	font-size: 19px;
	color: #000000;
	vertical-align: middle;
}

.f20-1 {
	font-size: 20px;
	color: #000000;
	vertical-align: middle;
}

.f21-1 {
	font-size: 21px;
	color: #000000;
	vertical-align: middle;
}

.f22-1 {
	font-size: 22px;
	color: #000000;
	vertical-align: middle;
}

.f23-1 {
	font-size: 23px;
	color: #000000;
	vertical-align: middle;
}

.f24-1 {
	font-size: 24px;
	color: #000000;
	vertical-align: middle;
}

.f25-1 {
	font-size: 25px;
	color: #000000;
	vertical-align: middle;
}

.f26-1 {
	font-size: 26px;
	color: #000000;
	vertical-align: middle;
}

.f27-1 {
	font-size: 27px;
	color: #000000;
	vertical-align: middle;
}

.f28-1 {
	font-size: 28px;
	color: #000000;
	vertical-align: middle;
}

.f29-1 {
	font-size: 29px;
	color: #000000;
	vertical-align: middle;
}

.f30-1 {
	font-size: 30px;
	color: #000000;
	vertical-align: middle;
}



.txtbox1 {
	line-height:130%;
}




/*　web制作実績　*/

.web_list {
	background-repeat: no-repeat;
	background-position: left top;
	padding: 0;
	margin: 0;
	float: left;
	width: 33%;
	height: 360px;
	line-height: 130%;
}
.web_list div.web_inner {
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 25px 15px 25px;
	display: block;
	text-align: center;
}
.web_list .img {
	width:260px;
}
.web_list .tbl {
	border-spacing:2px;
	border-collapse:separate;
}
.web_list .tbl th,
.web_list .tbl td {
	padding:3px 5px;
	background-color: #FFF;
}
.web_list .tbl th {
	background-color:#D6EAF1;
	white-space: nowrap;
	width: 60px;
}




.dl2 {
	max-width:700px;
	margin:0 auto;
}
.dl2 dt {
	width:8em;
	float:left;
	font-weight: bold;
	padding:5px 10px;
}
.dl2 dd {
	padding:5px 10px 5px 9em;
	border-bottom:1px solid #CCCCCC;
}


.f16 {
	font-size:16px;
}
.f13 {
	font-size:13px;
}


.ss_box1 {
	float:left;
	width:330px;
}
.ss_box1 .img {
	float:left;
	width:90px;
}
.ss_box1 .ul {
	float:right;
	width:230px;
}
.ss_box1 .ul li {
	background-image: url(../img/icn1.gif);
	background-repeat: no-repeat;
	padding: 0 0 0 30px;
	background-position: 10px 6px;
}
.ss_box1 .ul li.ttl {
	padding: 5px 0 5px 0;
	background-image:none;
	font-size: 18px;
}