tri-ability/jp/public/index_old.html
2023-06-20 10:18:41 +09:00

1011 lines
43 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<!--[if lt IE 8 ]><html class="no-js ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="no-js ie ie8" lang="en"> <![endif]-->
<!--[if IE 9 ]><html class="no-js ie ie9" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html class="no-js" lang="ja"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>TRi-aBility株式会社</title>
<meta name="description" content="TRi-aBility株式会社">
<meta name="author" content="TRi-aBility株式会社">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/media-queries.css">
<script src="js/modernizr.js"></script>
<link rel="icon" href="favicon.ico" type="image/x-icon"/>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
</head>
<body class="homepage">
<div id="preloader">
<div id="status">
<img src="images/loader.gif" height="60" width="60" alt="">
<div class="loader">Loading...</div>
</div>
</div>
<header id="main-header">
<div class="row header-inner">
<div class="logo">
<a class="smoothscroll" href="#hero">TRi-aBility株式会社</a>
</div>
<nav id="nav-wrap">
<ul id="nav" class="nav">
<li class="current"><a class="smoothscroll" href="#hero">ホーム</a></li>
<li><a class="smoothscroll" href="#portfolio">企業情報</a></li>
<li><a class="smoothscroll" href="#services">サービス</a></li>
<li><a class="smoothscroll" href="#about">導入事例</a></li>
<li><a class="smoothscroll" href="#journal">採用情報</a></li>
<li><a class="smoothscroll" href="#contact">お問い合わせ</a></li>
</ul>
</nav>
</div>
</header>
<section id="hero">
<div class="row hero-content">
<div class="twelve columns flex-container">
<div id="hero-slider" class="flexslider">
<ul class="slides">
<!-- Slide -->
<li>
<div class="flex-caption">
<h1>レンタルサーバーといえば<br>
レンタルサーバーといえば<br>
レンタルサーバーといえば
</h1>
<p><a class="button stroke smoothscroll" href="#about">More</a></p>
</div>
</li>
<!-- Slide -->
<li>
<div class="flex-caption">
<h1 >初心者だから、<br>使いこなせるか不安。</h1>
<p><a class="button stroke smoothscroll" href="#portfolio">More</a></p>
</div>
</li>
<!-- Slide -->
<li>
<div class="flex-caption">
<h1 >プロの専任スタッフが、
<a class="smoothscroll" href="#portfolio" title="">24時間365日無料で</a> <br>サポートいたします! </h1>
<p><a class="button stroke smoothscroll" href="#contact">スタート!</a></p>
</div>
</li>
</ul>
</div> <!-- .flexslider -->
</div> <!-- .flex-container -->
</div> <!-- .hero-content -->
</section> <!-- #hero -->
<!-- Portfolio
================================================== -->
<section id="portfolio">
<div class="row section-head">
<div class="twelve columns">
<h1>企業情報</h1>
<hr />
<p>
日々進化する情報通信業に応じて、各種ポータルサイトではあふれるが
真のサービスを受けている企業は、それほど多くありません。より安定した継続的な
サービスの顧客の関心が集められているのが現実です。
創立以来、着実に成長をしてきました。その中に培ってきた技術とノウハウをもとに、お客様が満足できるサービスを維持、開発しています。
私たちIDCJPは、あなたの心強い支えになることを約束します。
最高のサービスと技術力、強力なネットワークでお客様のサーバーを安全かつ完全に守っていただきます。
皆さんと一緒に夢を見ていただきます。
皆さんと一緒に夢を広げる仲間になっていただきます。
IDCJPに送ってくださった声援に感謝し、これからも持続的な愛と関心お願いいたします。
</p>
<table width="100%" border="1" cellpadding="7" cellspacing="1" bordercolor="#FFFFFF">
<tbody>
<tr>
<td width="130" align="left" nowrap="nowrap" bgcolor="#D6E7F7"><strong>会社名</strong></td>
<td align="left" bgcolor="#F6F6F6"> TRi-aBility 株式会社</td>
</tr>
<tr>
<td width="130" align="left" nowrap="nowrap" bgcolor="#D6E7F7"><strong>設立</strong></td>
<td align="left" bgcolor="#F6F6F6"> 1975年4月15日</td>
</tr>
<tr>
<td width="130" align="left" valign="top" nowrap="nowrap" bgcolor="#D6E7F7"><strong>所在地</strong></td>
<td align="left" bgcolor="#F6F6F6"> 〒260-0021 千葉県千葉市中央区新宿
丁目ヴィラサトウF</td>
</tr>
<tr>
<td width="130" align="left" valign="top" nowrap="nowrap" bgcolor="#D6E7F7"><strong>電話番号</strong></td>
<td align="left" bgcolor="#F6F6F6"><table width="450" border="0" cellpadding="3" cellspacing="0">
<tbody>
<tr align="left">
<td> セールス</td>
<td>TEL 043-441-4877</td>
<td>FAX 043-441-4878</td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td width="130" align="left" nowrap="nowrap" bgcolor="#D6E7F7"><strong>代表取締役社長</strong></td>
<td align="left" bgcolor="#F6F6F6"> 笹生 勝</td>
</tr>
<tr>
<td width="130" align="left" nowrap="nowrap" bgcolor="#D6E7F7"><strong>業務内容</strong></td>
<td align="left" bgcolor="#F6F6F6"> IT サーバーホスティング</td>
</tr>
</tbody>
</table>
</div>
</div>
<!--
<div class="row items">
<div class="twelve columns">
<div id="portfolio-wrapper" class="bgrid-fourth s-bgrid-third mob-bgrid-half group">
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/grizzly.jpg" alt="Grizzly">
<div class="overlay"></div>
<div class="portfolio-item-meta">
<h5>Grizzly</h5>
<p>Photography</p>
</div>
</a>
</div>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/hotel.jpg" alt="Hotel Sign">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Hotel Sign</h5>
<p>Webdesign</p>
</div>
</div>
</a>
</div>
</div>
<div class="bgrid stack item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/beetle.jpg" alt="Beetle">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Beetle</h5>
<p>Branding</p>
</div>
</div>
</a>
</div>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/banjo-player.jpg" alt="Banjo Player">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Banjo Player</h5>
<p>Videography</p>
</div>
</div>
</a>
</div>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/coffee.jpg" alt="Coffee Cup">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Coffee Cup</h5>
<p>Photography</p>
</div>
</div>
</a>
</div>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/farmerboy.jpg" alt="Farmerboy">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Farmerboy</h5>
<p>Branding</p>
</div>
</div>
</a>
</div>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/judah.jpg" alt="Judah">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Judah</h5>
<p>Web Design</p>
</div>
</div>
</a>
</div>
<div class="bgrid item">
<div class="item-wrap">
<a href="portfolio.html">
<img src="images/portfolio/embossed-paper.jpg" alt="Embossed Paper">
<div class="overlay">
<div class="portfolio-item-meta">
<h5>Embossed Paper</h5>
<p>Branding</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div> -->
</section> <!-- /Portfolio -->
<!-- Services Section
================================================== -->
<section id="services">
<div class="row section-head">
<div class="twelve columns">
<h1>サービス</h1>
<hr />
<p>
전용선 서비스 개요
서버운영에 필요한 전용회선을 고갠미이 단독으로 사용하는 서비승비니다.
5대 이상의 서버를 사용하시는 고객님을 위해 서비스에 필요한 네트워크 구성, 서버외에 고객님이 보유하고 계신 짱비를 이용해 맞춤형 서비스를 제공하고 있습니다.
서비스 대상 고객
※ 서버를 3대 이상 사용 하시는 고객
※ 해킹 및 보안에 신경을 쓰시는 고객
※ 해외에 서버를 두면서 단독으로 네트워크 망을 사용하고 싶은 고객
※ 기업 환경에 맞게 네트워크를 구성하고 싶은 고객
전용선 서비스 특징
※ 고객님 단독으로 전용회선을 사용하기 때문에 해킹이나 보안에서 좀 더 자유롭게 서버를 운영할 수 있습니다.
※ 저렴한 회선 비용으로 서버 운영비를 감소할 수 있습니다.
※ IP Address는 최소 29bit(IP 5개) 부터 다양하게 이용이 가능합니다.
=============회선서비스========================
우회망 서비스
우회서비스는 DDOS공격에 의한 대량의 트래픽 대역폭을 감당할 수 있는 별도의 Zone으로 트래픽을 우회시켜 해당 고객서버로 전달하여 서버(사이트) 마비가 되지 않도록 합니다. 갑작스런 DDOS 공격으로 정상적인 서비스가 어려울 시 단기간에 정상 서비스 이용이 가능하도록 대응해 드리는 서비스입니다.
=============회선서비스========================
CS서비스 / CS방어 서비스
CS서비스
특징
웹서비스를 평상시 CS서버로 우회 사용
- 앞단 CS 서버를 여러 개로 분리
- 공격시 앞단 CS서버만 차단, 나머지 CS서버는 정상 서비스 가능
- CS서버 차단 해제 시 IP변경해서 서비스
CS방어 서비스
특징
- 평상시는 CS서비스와 동일
- CS 서버 공격으로 차단 시 방어존 CS서버로 변경
- 공격 해제 시 CS IP 변경 후 서비스 원상복구
==============VPN서비스=======================
서비스개요 및 구성
VPN(Virtual private Network, 가상사설망)이란 터널링 기법을 사용하여 인터넷 프로토콜인 TCP/IP를 그대로 이용하면서도 외부인이 접근할 수 없는 별도의 가상사설망을 운용할 수 있도록 하는 보안 네트워크 기술입니다.
=====================================
Antiviser 서비스
안티바이러스 서비스
바이러스란? 컴퓨터의 프로그램이나 실행 가능한 부분을 변경하고자 자기 자신 또는 자신의 변형을 복사하여 컴퓨터 작동에 피해를 주는 명령어들의 조합을 말합니다. 바이러스는 부트 바이러스, 도스 바이러스, 파일 바이러스로 구분되지만, 보통의 컴퓨터 사용자들은 웹, 트로이 목마, 백도어, 해킹 툴 등을 모두 바이러스라고 통칭하여 부르고 있습니다.
바이러스는 전문 안티 바이러스 엔진이 탑재된 백신 프로그램으로 검사하고 치료해야 합니다.
IDCJP에서는 고객님들의 보안을 위하고자 Antivirus 제품을 유상 제공하고 있습니다.
안티 바이러스 서비스를 통해 시스템 보안의 기반을 다지도록 도와드리겠습니다.
====================================
웹 방화벽 서비스
WAF란? 웹방화벽(Web Application Firewall)은, 일반적인 네트워크 방화벽 (FIrewall)과는 달리
웹 애플리케이션 보안에 특화되어 개발된 솔루션 입니다. 웹 방화벽의 기본 역할은 그 이름에서도 알 수 있듯,
SQL Injection, Cross-Site Scriptiong(XSS)등과 같은 웹 공격을 탐지하고 차단하는 것 입니다.
개인정보가 웹 게시판에 게시되거나 개인 정보가 포함된 파일 등이
웹을 통해 업로드 및 다운로드 되는 경우에 대해서는 탐지하고 이에 대응하는 것 이 가능합니다.
웹 방화벽은 추정 가능한 모든 경우의 수를 대입하여 웹사이트에 로그인 을 시도하는 경우와 같은
비정상적인 접근에 대한 접근 제어 기능을 합니다. 주로 해커가 해킹을 한 후에 과시하는 것이 목적인
웹사이트 위변조가 발생했을 경우, 이에 대해 탐지하고 대응하는 웹사이트 위변조 방지 솔루션의 역할을 합니다.
IDCJP에서는 고객님의 웹 사이트를 방어하기 위해 유상으로 웹 방화벽 서비스를 제공하고 있습니다.
웹 방화벽을 통해, 보안이 강조되는 시대에 발 맞춰서 서비스를 하는데 있어서 IDCJP가 훌륭한 조력자가 되어 드리겠습니다.
====================================
코로케이션
서비스 개요
코로케이션 이란?
IDCJP내부의 인터넷 백본망에 고객의 서버와 네트워크 장비를 직접 연결함으로써 전용회선의 대역폭 한계를 극복하고 고속의 안정된 인터넷 접속을 가능하게 하는 서비스 입니다.
저희 IDCJP는 고객님의 서버가 입주할 로케이션을 제공하는 상면 서비스와 네트워크 임대 서비스를 이와 같이 진행하고 있습니다.
상면 서비스
서버 및 네트워크 장비의 종류를 불문하고
1/4,1/2, full Rack 형태의 서비스를 제공합니다.
네트워크 서비스
Dedicated
회선을 다른 고객과 공유하지 않는 형태의 서비스로, 하나의 회선을 단독으로 사용하는 방식입니다. 다른 고객의 트래픽 영향을 받지 않기 때문에 더욱 더 안정적인 서비스를 제공해 드릴 수 있습니다.
Shared 회선을 다른 고객과 공유하여 사용하는 것을 말합니다. 하나의 회선을 공유하여 사용하기 때문에 타 고객에게 영향을 미치는 트래픽이 발생할 경우 즉, 기본적으로 많은 트래픽을 사용하시는 고객님의 경우는 Dedicateed 형 네트워크 서비스를 이용하는 것이 좋습니다.
</p>
</div>
</div>
<div class="row">
<div class="twelve columns">
<div class="service-list bgrid-third s-bgrid-half mob-bgrid-whole">
<div class="bgrid">
<div class="icon-part">
<span class="icon-graph"></span>
</div>
<h3>Marketing.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
<div class="bgrid">
<div class="icon-part">
<i class="icon-film"></i>
</div>
<h3>Videography.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventoveritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
<div class="bgrid">
<div class="icon-part">
<i class="icon-camera"></i>
</div>
<h3>Photography.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
<div class="bgrid first">
<div class="icon-part">
<i class="icon-eye"></i>
</div>
<h3>Branding.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
<div class="bgrid">
<div class="icon-part">
<i class="icon-screen-desktop"></i>
</div>
<h3>Web Design.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
<div class="bgrid">
<div class="icon-part">
<i class="icon-eyeglasses"></i>
</div>
<h3>Web Development.</h3>
<div class="service-content">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</div>
</div> <!-- /bgrid -->
</div> <!-- /service-list -->
</div> <!-- /twelve -->
</div> <!-- /row -->
</section> <!-- /services -->
<!-- About Section
================================================== -->
<section id="about">
<div class="row section-head">
<div class="twelve columns">
<h1>導入事例</h1>
<hr />
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div>
</div>
<div class="row about-content">
<div class="mob-whole six columns left">
<h3>Our Process.</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div> <!-- /left -->
<div class="mob-whole six columns right">
<h3>Our Approach.</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div> <!-- /right -->
</div> <!-- /row -->
<div class="row about-content">
<div class="mob-whole six columns left">
<h3>Our Goal.</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div> <!-- /left -->
<div class="mob-whole six columns right">
<h3>Our Mission.</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div> <!-- /right -->
</div> <!-- /row -->
<!-- team
=================================================== -->
<div id='team'>
<div class="row team section-head">
<div class="twelve columns">
<h1>採用情報</h1>
<hr />
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div>
</div>
<div class="row about-content">
<div class="twelve columns">
<div id="team-wrapper" class="bgrid-half mob-bgrid-whole group">
<div class="bgrid member">
<div class="member-header">
<div class="member-pic">
<img src="images/team/member01-k.jpg" alt=""/>
</div>
<div class="member-name">
<h3>Naruto Uzumaki</h3>
<span>Creative Director</span>
</div>
</div>
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
nisi elit consequat ipsum, nec sagittis sem nibh id elit. </p>
<ul class="member-social">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#"><i class="fa fa-skype"></i></a></li>
</ul>
</div> <!-- /member -->
<div class="bgrid member">
<div class="member-header">
<div class="member-pic">
<img src="images/team/member02-k.jpg" alt=""/>
</div>
<div class="member-name">
<h3>Sasuke Uchiha</h3>
<span>Lead Designer</span>
</div>
</div>
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
nisi elit consequat ipsum, nec sagittis sem nibh id elit. </p>
<ul class="member-social">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#"><i class="fa fa-skype"></i></a></li>
</ul>
</div> <!-- /member -->
<div class="bgrid member first">
<div class="member-header">
<div class="member-pic">
<img src="images/team/member03-k.jpg" alt=""/>
</div>
<div class="member-name">
<h3>Sakura Haruno</h3>
<span>Web Designer</span>
</div>
</div>
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
nisi elit consequat ipsum, nec sagittis sem nibh id elit. </p>
<ul class="member-social">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#"><i class="fa fa-skype"></i></a></li>
</ul>
</div> <!-- /member -->
<div class="bgrid member">
<div class="member-header">
<div class="member-pic">
<img src="images/team/member04-k.jpg" alt=""/>
</div>
<div class="member-name">
<h3>Shikamaru Nara</h3>
<span>Web Designer</span>
</div>
</div>
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
nisi elit consequat ipsum, nec sagittis sem nibh id elit. </p>
<ul class="member-social">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#"><i class="fa fa-skype"></i></a></li>
</ul>
</div> <!-- /member -->
</div> <!-- /twelve -->
</div> <!-- /team-wrapper -->
</div> <!-- /row -->
</div> <!-- /team -->
</section> <!-- /about -->
<!-- journal
=================================================== -->
<section id="journal">
<div class="row section-head">
<div class="twelve columns">
<h1>サポート</h1>
<hr />
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit.
</p>
</div>
</div>
<div class="row">
<div class="twelve columns">
<div id="blog-wrapper" class="bgrid-third s-bgrid-half mob-bgrid-whole group">
<article class="bgrid">
<h5>September 2, 2014</h5>
<h3><a href="single.html">Sed ut perspiciatis unde omnis iste natus</a></h3>
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
isi elit consequat ipsum, nec sagittis sem nibh id elit. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium.
</p>
</article>
<article class="bgrid">
<h5>August 29, 2014</h5>
<h3><a href="single.html">Natus error sit voluptatem accusantium.</a></h3>
<p>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium,
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</p>
</article>
<article class="bgrid">
<h5>August 28, 2014</h5>
<h3><a href="single.html">Ut enim ad minim veniam quis nostrud</a></h3>
<p>
Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor,
isi elit consequat ipsum, nec sagittis sem nibh id elit. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium.
</p>
</article>
<article class="bgrid first">
<h5>August 27, 2014</h5>
<h3><a href="single.html">Sed ut perspiciatis unde omnis iste natus</a></h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
</p>
</article>
<article class="bgrid">
<h5>August 25, 2014</h5>
<h3><a href="single.html">Rerum dignissimos alias eligendi laudantium quod.</a></h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum fuga distinctio natus ab sint
voluptate quos cumque assumenda ipsa cupiditate aperiam officiis recusandae nemo labore adipisci harum,
ea odio dolor.
</p>
</article>
<article class="bgrid">
<h5>August 23, 2014</h5>
<h3><a href="single.html">Sed ut perspiciatis unde omnis iste natus</a></h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt cumque, aut nam at,
doloremque repellat blanditiis quo accusantium, rerum dignissimos alias eligendi, laudantium quod.
Autem nihil explicabo ipsa magnam porro.
</p>
</article>
</div> <!-- /blog-wrapper -->
</div> <!-- /twelve -->
</div> <!-- /row -->
</section> <!-- /blog -->
<!-- Contact Section
================================================== -->
<section id="contact">
<div class="row section-head">
<div class="twelve columns">
<h1>お問い合わせ・資料請求・お見積り</h1>
<hr />
<p>
プロの専任スタッフが、 24時間365日無料で サポートいたします!
</p>
</div>
</div>
<div class="row form-section">
<div id="contact-form" class="twelve columns">
<form name="contactForm" id="contactForm" method="post" action="">
<fieldset>
<div class="row">
<div class="six columns mob-whole">
<label for="contactFname"><span class="required">*</span></label>
<input name="contactFname" type="text" id="contactFname" placeholder="姓" value="" />
</div>
<div class="six columns mob-whole">
<label for="contactLname"><span class="required">*</span></label>
<input name="contactLname" type="text" id="contactLname" placeholder="名" value="" />
</div>
</div>
<div class="row">
<div class="six columns mob-whole">
<label for="contactEmail">メールアドレス <span class="required">*</span></label>
<input name="contactEmail" type="text" id="contactEmail" placeholder="メールアドレス" value="" />
</div>
<div class="six columns mob-whole">
<label for="contactSubject">お電話番号</label>
<input name="contactSubject" type="text" id="contactSubject" placeholder="お電話番号" value="" />
</div>
</div>
<div class="row">
<div class="twelve columns">
<label for="contactMessage">お問い合わせ <span class="required">*</span></label>
<textarea name="contactMessage" id="contactMessage" placeholder="お問い合わせ" rows="10" cols="50" ></textarea>
</div>
</div>
<div>
<button class="submit full-width">確認</button>
<div id="image-loader">
<img src="images/loader.gif" alt="" />
</div>
</div>
</fieldset>
</form> <!-- /contactForm -->
<!-- message box -->
<div id="message-warning"></div>
<div id="message-success">
<i class="fa fa-check"></i>Your message was sent, thank you!<br />
</div>
</div> <!-- /contact-form -->
</div> <!-- /form-section -->
</section> <!-- /contact-->
<!-- Footer
================================================== -->
<footer>
<div class="row">
<div class="six columns tab-whole footer-about">
<h3>TRi-aBility株式会社</h3>
<p>고객님의 서버를 안전하게 지켜드리기 위해 최첨단 인프라와 최고의 서비스, 강력한 네트워크를 기반으로
24시간 365일 동안 안정적인 서비스를 제공하는 IDC센터입니다.
</p>
<p>저희 IDCJP에선 각 분야에 맞는 엔지니어들이 고객님의 서버 혹은 네트워크에 발생한 장애를 빠르고 정확하게 해결해 드리는 맞춤식 장애 대응을 약속 드립니다.</p>
</div> <!-- /footer-about -->
<div class="six columns tab-whole right-cols">
<div class="row">
<div class="columns">
<h3 class="address">Contact Us</h3>
<p>
260-0021<br>
千葉県千葉市中央区新宿<br>
丁目ヴィラサトウF
</p>
<ul>
<li>TEL : 043-441-4877</li>
<li>FAX : 043-441-4878</li>
<li>support@tri-ability.jp</li>
</ul>
</div> <!-- /columns -->
<div class="columns last">
<h3 class="contact">Follow Us</h3>
<ul>
<li><a href="#">Facebook</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">GooglePlus</a></li>
<li><a href="#">Instagram</a></li>
<li><a href="#">Flickr</a></li>
<li><a href="#">Skype</a></li>
</ul>
</div> <!-- /columns -->
</div> <!-- /Row(nested) -->
</div>
<p class="copyright">&copy; Copyright 2015 TRi-aBility Co,LTD </p>
<div id="go-top">
<a class="smoothscroll" title="Back to Top" href="#hero"><span>トップ</span><i class="fa fa-long-arrow-up"></i></a>
</div>
</div> <!-- /row -->
</footer> <!-- /footer -->
<!-- Java Script
================================================== -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.10.2.min.js"><\/script>')</script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script src="js/jquery.fittext.js"></script>
<script src="js/backstretch.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/main.js"></script>
</body>
</html>