@charset "utf-8"
/* =====================================

----------------------------------------
	INDEX
----------------------------------------
	1.base

  2.parts

	3.header

	4.nav

  5. pagetop

	6.footer

	7.ページ固有

    7-1 index.html

    7-2. engineering.html
         software.html
         共通

    7-2. engineering.html
         software.html
         共通

    7-3. engineering.html

    7-4. software.html

    7-5. company.html

    7-6. .recruit共通

    7-7. recruit.html

    7-8. project.html

    7-9. training.html

    7-10. re_hardwear.html
          re_softwear.html
          re_qa

    7-11. interview1.html
          interview2.html
          interview3.html

    7-12. .sentence-page共通

    7-13. entry.html

    7-14. securitypolicy.html

    7-15. sitepolicy.html

    7-16. .contact共通

    7-17. thanks.html

    7-18. news.html


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

/* 1.base
======================================== */
html * {  
  max-height: 1000000px;  /* AndroidのChromeで文字サイズが大きくなる不具合の対策 */
}

body {
  color: #000;
  font-family: "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 15px;
  background-color: #FFF;
  width: 100%;
  min-width: 1000px;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;    /* AndroidのChromeで文字サイズが大きくなる不具合の対策 */
}

img{
  vertical-align: bottom;
}

.img{
}

.eng{
}

.left{
  float: left;
}

.right{
  float: right;
}

.content-in{
  margin: 0 auto;
  position: relative;
  width: 1000px;
}

/* link
--------------------------------------- */
a{
  text-decoration: none;
  color: #000;
}

a:hover{
  color: #1f9bfa;
}

a:hover img,
.boxhover:hover{
	filter: alpha(opacity=80);
	opacity:0.8;
}

/* clear
--------------------------------------- */
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/* 2. parts
======================================== */
/* heading
--------------------------------------- */
.heading{
  text-align: center;
}

.heading .jp{
  display: block;
  font-size: 28px;
  font-weight: normal;
}

.heading .jp.four-letters{
  letter-spacing: .2em;
  text-indent: 0.2em;
}

.heading .eng{
  display: block;
  font-size: 18px;
  color: #004395;
  font-weight: normal;
}

.section>.title{
  margin-top: 50px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

h1.header-desc{
	font-size: 11px;
    font-weight: normal;
    margin-bottom: 2px;
}

/* 3.header
======================================== */
header{
	border-top: 6px solid #1f9bfa;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
    background-color: #fff;
    height: 118px;
    z-index: 50;
    position: relative;
    width: 100%;
}

.header-in{
  background-color: #fff;
  height: 118px;
}

.header-left{
  float: left;
    height: 50px;
    padding-top: 8px;
    padding-left: 20px;
}

.header-nav{
  float: right;
	width: 521px;
  height: 45px;
  padding-left: 6px;
  background-color: #e8f5fe;
  border-radius: 0 0 10px 10px;
}

.header-nav li{
  background-image: url("../images/common/arrow_circle_skyblue.png");
    background-position: left center;
    background-repeat: no-repeat;
    float: left;
    font-weight: bold;
    line-height: 45px;
    margin-left: 14px;
    padding-left: 20px;
}

.header-nav li a{
  font-size: 13px;
}

.header-txt{
	font-size: 11px;
  margin-bottom: 5px;
}

#slider {
	position: relative; 
	overflow: hidden;
	width: 100%;
	min-height: 700px;
	background-color: #e8f5fe;
}

.slider-inner-content {
	position: absolute;
    z-index: 2;
    margin: 200px auto;
    padding: 40px 20px 30px 40px;
    max-width: 600px;
    text-align: left;
    font-size: 1.5em;
    right: 15px;
    filter: drop-shadow(0px 0px 5px rgba(31,155,250,0.3));
	-webkit-filter:drop-shadow(0px 0px 5px rgba(31,155,250,0.3));
  　-moz-filter:drop-shadow(0px 0px 5px rgba(31,155,250,0.3));
  　-ms-filter:drop-shadow(0px 0px 5px rgba(31,155,250,0.3));
	background: rgb(255,255,255);
	filter:alpha(opacity=40); 
	background: rgba(255,255,255,0.4);
    border-left: 4px solid #fff;
    border-bottom: 4px solid #fff;
}

.slider-inner-content h2 {
    margin: 0;
    line-height: 1.2;
    margin-top: 15px;
}

p.origin{
	font-size: 80%;
	margin-top: 20px;
}

/* 4. nav
======================================== */
.nav {
    height: 44px;
    margin: 80px 0 0 0;
    position: absolute;
    text-transform: uppercase;
    z-index: 500;
    font-size:0;      /* nav.li inline-blockの隙間を無くすため指定 */

}

.navbr {
	background-repeat: no-repeat;
}

#index .navbr {
    background-image: url("../images/common/btn_on_line_198px.png");
    background-position: 1px 30px;
}

.service .navbr {
    background-image: url("../images/common/btn_on_line_198px.png");
    background-position: 201px 30px;
}

#company .navbr {
    background-image: url("../images/common/btn_on_line_198px.png");
    background-position: 401px 30px;
}

.entry .navbr,
.recruit .navbr,
.interview .navbr {
    background-image: url("../images/common/btn_on_line_198px.png");
    background-position: 601px 30px;
}

#contact .navbr{
    background-image: url("../images/common/btn_on_line_198px.png");
    background-position: 801px 30px;
}

.nav * {
    box-sizing: border-box;
}

.nav li {
    border-left: 1px dotted #6b6969;
    display: inline-block;
    font-size: 15px;
    list-style: outside none none;
    margin-left: 0;
    margin-right: 0;
    text-align: center;
    width: 200px;
}

.nav a {
    color: #333;
    padding: 7px 0 3px;
    position: relative;
    text-decoration: none;
}
.nav a:hover::after {
    max-width: 200px;
}
.nav a::before, .nav a::after {
    position: absolute;
    transition: all 0.35s ease 0s;
}
.nav a::before {
    background-color: #8fcdfc;
    bottom: 0;
    content: "";
    display: block;
    height: 4px;
    margin-bottom: -8px;
    margin-left: 0;
    width: 0;
}
.nav a::after {
    color: #000;
    content: attr(data-hover);
    left: 0;
    max-width: 0;
    overflow: hidden;
    padding: 7px 0;
    position: absolute;
    top: 0;
    white-space: nowrap;
}
.nav a:hover::before {
    margin-bottom: -8px;
    margin-left: 0;
    opacity: 1;
    width: 198px;
}
.nav .navtop, .nav .navtop_off {
    border-right: 1px dotted #6b6969;
}
.drop li ul {
    margin: 0;
    padding: 0;
}
.drop li ul li {
    background: #dcd3b2 none repeat scroll 0 0;
}
.nav li.drop {
    border-left: medium none;
    text-align: center;
    width: 200px;
}
.nav li.drop ul {
    margin-top: 3px;
}
.nav li.drop ul li {
    background-color: #e8f5fe;
    border-left: medium none;
    border-radius: 3px;
    float: left;
    font-size: 13px;
    margin-left: 0;
    margin-top: 3px;
    overflow: hidden;
    padding: 8px 2px 6px 15px;
    text-align: left;
    width: 200px;
}
.nav li.drop ul li a:hover {
    color: #1f9bfa;
}
.nav li.drop ul li a::before {
    content: none;
    display: block;
    height: auto;
    margin-bottom: 0;
    margin-left: 0;
    width: 0;
}
.nav li.drop ul li a::before, .nav li.drop ul li a::after {
    margin-left: 0;
    position: absolute;
    transition: none 0s ease 0s ;
}
.nav li.drop ul li a::after {
    color: #000;
    content: none;
    left: 0;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 0;
    white-space: nowrap;
}
.nav li.drop ul li a::before, .nav li.drop ul li a::after {
    margin-left: 0;
    position: absolute;
    transition: none 0s ease 0s ;
}
li.drop:hover ul {
    width: 175px;
}
li.drop:hover ul li a {
    white-space: nowrap;
}

/* 5. pagetop
======================================== */
.btn{
	width: 1000px;
	margin: 0 auto;
}

.btn_in{
	width: 25px;
	float: right;
}

.pagetop {
   bottom: 348px;
    font-size: 16px;
    line-height: 0;
    position: fixed;
    transform: scale(1.7, 1);
}

.pagetop a {
    background: #1f9bfa none repeat scroll 0 0;
    color: #fff;
    display: block;
    padding: 22px 0;
    text-align: center;
    text-decoration: none;
    width: 25px;
}

.pagetop a:hover {
    text-decoration: none;
    background: #8FCDFC;
}

/* 6. footer
======================================== */
.footer-top{
     background-image: url(../images/common/footer_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 40px 0 100px 0;
    border-top: 30px solid #1f9bfa;
}

.footer-nav>ul{
  float: left;
}

.footer-nav a,
.footer-nav>ul>li{
  color: #333;
}

.footer-nav a:hover{
  color: #1f9bfa;
}

.footer-nav>ul>li>a,
.footer-nav>ul>li{
  font-size: 13px;
    font-weight: 600;
}

.footer-nav-right{
  margin-left: 40px;
}

.footer-nav-right>li{
  margin-bottom: 6.9px;
}

.footer-nav-left>li{
  float: left;
  margin-left: 60px;
}

.footer-nav-left>li>ul{
  margin-top: 6px;
}

.footer-nav-left>li>ul>li{
      background-repeat: no-repeat;
    background-position: left center;
    margin-bottom: 2px;
    font-size: 13px;
    font-weight: normal;
}

.footer-bottom{
     background-color: #fff;
    padding: 16px 0 50px;
    border-top: 2px solid #1f9bfa;
}

.footer-info{
  width: 634px;
}

.footer-info dt{
  margin-right: 42px;
  font-size: 16px;
  font-weight: bold;
}

.footer-info dd{
  font-size: 12px;
}

.copyright{
  margin-top: -1px;
  font-size: 13px;
  letter-spacing: -.02em;
  color: #333;
  font-family: "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/* 7. ページ固有
======================================== */
/* 7-1 index.html
---------------------------------------- */
#index .introduction{
  height: 283px;
  padding-top: 82px;
  background-image: url(../images/home/introduction_bg.jpg);
  background-position: center bottom;
}

#index .introduction .title{
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

#index .introduction .text{
  font-size: 15px;
  line-height: 1.7;
  text-align: center;
}

#index .outline{
  height: 579px;
  padding-top: 58px;
  background-image: url(../images/home/outline_bg.jpg);
  background-position: center bottom;
  background-repeat: no-repeat;
}

#index .outline .links{
  padding: 152px 0 0 650px;
}

#index .outline .links a{
  display: block;
  width: 327px;
  height: 67px;
  margin-bottom: 14px;
  background-image: url(../images/home/outline_btn.png);
  font-size: 18px;
  line-height: 65px;
  text-align: center;
}

#index .recruite{
  height: 666px;
  padding-top: 58px;
  background-image: url(../images/home/recruite_bg.jpg);
  background-position: center bottom;
  background-repeat: no-repeat;
}

#index .recruite .content-in{
	position:relative;
    margin:0px auto;
	padding-bottom: 50px;
}

#index .recruite .content-in a{
	position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-999px;
}

#index .recruite .content-in a:hover{
    background-color:#FFF;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}


#index .recruite .text{
    margin-top: 303px;
    font-size: 23px;
    color: #004395;
    text-align: center;
    line-height: 1.4;
    font-weight: 600;
  text-shadow:
  	white 2px 0px 0px, white -2px 0px 0px,
    white 0px -2px 0px, white 0px 2px 0px,
    white 2px 2px 0px, white -2px 2px 0px,
    white 2px -2px 0px, white -2px -2px 0px,
    white 1px 2px 0px, white -1px 2px 0px,
    white 1px -2px 0px, white -1px -2px 0px,
    white 2px 1px 0px, white -2px 1px 0px,
    white 2px -1px 0px, white -2px -1px 0px,
    white 1px 1px 0px, white -1px 1px 0px,
    white 1px -1px 0px, white -1px -1px 0px;
}

#index .news{
  height: 466px;
  padding-bottom: 50px;
}

#index .news .link{
  display: block;
  float: right;
  background-image: url(../images/common/arrow_circle_blue.png);
  background-repeat: no-repeat;
  background-position: right;
  margin: 40px 0 24px;
  padding-right: 22px;
  font-size: 15px;
}

#index .news .news-list{
  clear: both;
  margin-top: 24px;
}

#index .news .news-list .article{
  clear: both;
  overflow: hidden;
  padding: 16px 0 14px 0;
  border-bottom: 1px dotted #aaa;
}

#index .news .news-list .article:first-child{
  border-top: 1px dotted #aaa;
}

#index .news .news-list .time{
  float: left;
  font-size: 15px;
  font-weight: bold;
  line-height: 30px;
}

#index .news .news-list .icon{
  display: block;
  float: left;
  border-radius: 10px;
  width: 104px;
  height: 28px;
  margin: 0 24px 0 34px;
  background: #1f9bfa;
  font-size: 15px;
  text-align: center;
  line-height: 28px;
  color: #fff;
}

#index .news .content{
  line-height: 2.3em;
  display: block;
  float: left;
  font-size: 15px;
}

#index .news .news-list .icon-news{
  background-color: #ff7500;
}

#index .link-list{
      height: 650px;
    background-image: url(../images/home/link-list_bg.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    padding-bottom: 20px;
}

#index .link-list .links{
  position: absolute;
  top: 146px;
  left: 530px;
  width: 493px;
}

#index .link-list .links .link{
  float: left;
  margin: 0 6px 15px 0;
}

#index .link-list .links a{
  display: block;
  width: 154px;
  height: 150px;
  background-image: url(../images/home/link-list_btn.png);
  background-repeat: no-repeat;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  line-height: 235px;
}

#index .link-list .link-engineering a{
  background-position: 0 0;
}

#index .link-list .link-software a{
  background-position: -160px 0;
}

#index .link-list .link-recruit a{
  background-position: -320px 0;
}

#index .link-list .link-company a{
  background-position: 0 -165px;
}

#index .link-list .link-access a{
  background-position: -160px -165px;
}

#index .link-list .link-contact a{
  background-position: -320px -165px;
  color: #fff;
}

/* 7-2. engineering.html
/*      software.html
---------------------------------------- */
.service .introduction{
  padding-top: 78px;
}

.service .introduction .heading{
  text-align: center;
  font-weight: normal;
}

.service .introduction .heading .eng{
  display: block;
  font-size: 35px;
  font-weight: normal;
  color: #000;
}

.service .introduction .heading .jp{
  display: block;
  font-size: 15px;
  color: #004395;
}

.service .introduction .title{
  margin-top: 56px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

.service .introduction .text{
    width: 580px;
    margin: 40px auto 0;
    font-size: 15px;
    line-height: 1.7;
}

/* 7-3. engineering.html
---------------------------------------- */
#engineering .introduction{
  height: 522px;
  background-image: url(../images/service/engineering/introduction_bg.jpg);
  background-position: center;
}

#engineering .workflow{
  height: 645px;
  padding-top: 64px;
  background-image: url(../images/service/engineering/workflow_bg.jpg);
  background-repeat: repeat-x;
}

#engineering .workflow-list{
  margin-top: 40px;
  list-style: none;
}

#engineering .workflow-list li.list-02{
	background-image: url("../images/service/engineering/engineering_arrow.png");
    background-position: 4px 100px;
	background-repeat: no-repeat;
}

#engineering .workflow-list li.list-03{
	background-image: url("../images/service/engineering/engineering_arrow.png");
    background-position: 4px 100px;
	background-repeat: no-repeat;
}

#engineering .workflow-list>li{
  float: left;
  width: 302px;
  padding-left: 45px;
}

#engineering .workflow-list>li:first-child{
  padding-left: 0;
}

#engineering .workflow-list .title{
  width: 254px;
  height: 41px;
  margin-bottom: 23px;
  padding: 222px 0 0 48px;
  font-size: 18px;
  color: #004395;
}

#engineering .workflow-list .list-01 .title{
  background-image: url(../images/service/engineering/workflow_01.jpg);
}

#engineering .workflow-list .list-02 .title{
  background-image: url(../images/service/engineering/workflow_02.jpg);
}

#engineering .workflow-list .list-03 .title{
  background-image: url(../images/service/engineering/workflow_03.jpg);
}

#engineering .workflow-list .desc{
  margin-bottom: 10px;
  font-size: 15px;
  color: #004395;
  text-align: center;
  line-height: 1.3;
}

#engineering .workflow-list>li>ul{
  margin-left: 18px;
}

#engineering .workflow-list>li>ul>li{
  margin-bottom: 10px;
  padding-left: 12px;
  background-image: url(../images/service/engineering/arrow_skyblue.png);
  background-position: left .4em;
  background-repeat: no-repeat;
}

#engineering .composition-ratio{
  padding: 80px 116px;
}

#engineering .composition-ratio .img{
  display: block;
  margin-top: 60px;
}

#engineering .technology-field{
  position: relative;
  height: 1125px;
  margin-bottom: 70px;
  padding-top: 90px;
  background-image: url(../images/service/engineering/technology-field_bg.jpg);
  background-position: center;
}

#engineering .technology-field .text{
  width: 800px;
  margin: 60px auto 0;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
}

#engineering .technology-field .field{
  position: absolute;
  line-height: 1;
}

#engineering .technology-field .field-title{
  font-size: 22px;
  font-weight: bold;
}

#engineering .technology-field .field-01{
  top: 260px;
  left: 50px;
}

#engineering .technology-field .field-02{
  top: 730px;
  left: 0px;
}

#engineering .technology-field .field-03{
  top: 952px;
  left: 388px;
}

#engineering .technology-field .field-01 .field-title{
  color: #f49c27;
}

#engineering .technology-field .field-02 .field-title{
  color: #34b366;
}

#engineering .technology-field .field-03 .field-title{
  color: #005d99;
}

#engineering .technology-field .field-list{
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.5;
}

#engineering .technology-field .area{
  margin: 30px 0 0 20px;
  color: #fff;
}

#engineering .technology-field .area-title{
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
}

#engineering .technology-field .area-list{
  font-size: 15px;
  line-height: 1.5;
}

#engineering .text-end{
  padding-bottom: 120px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

/* 7-4. software.html
---------------------------------------- */
#software .introduction{
  height: 392px;
  background-image: url(../images/service/software/introduction_bg.jpg);
  background-position: center;
}

#software .technical-composition{
  height: 800px;
  padding-top: 62px;
  background-image: url(../images/service/software/technical-composition_bg.jpg);
  background-position: center ;
}

#software .technical-composition .text{
  width: 584px;
  margin: 54px auto 0;
  line-height: 1.7;
}

#software .technical-composition .graph-top{
  width: 984px;
  margin: 64px auto 0;
}

#software .technical-composition .graph-top .graph{
  float: left;
  width: 468px;
  margin-left: 48px;
}

#software .technical-composition .graph-top .graph:first-child{
  margin-left: 0;
}

#software .technical-composition .graph-bottom{
  width: 468px;
  margin: 20px auto 0;
}

#software .technical-composition .graph .caption{
  margin-top: 10px;
  font-size: 22px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

#software .technical-composition .graph-top .caption{
  margin-top: 16px;
}

#software .technical-composition .graph-bottom .caption{
  margin-top: 6px;
}

#software .business-areas{
  height: 1871px;
  padding: 78px 0 180px;
  background-image: url(../images/service/software/business-areas_bg.jpg);
  background-repeat: no-repeat;
  background-position: center 446px;
}

#software .business-areas .map{
  width: 811px;
  margin: 60px auto 0;
}

#software .business-areas .map .title{
  position: absolute;
  margin: 30px 0 0 36px;
  font-size: 30px;
  font-weight: bold;
  color: #004395;
}

#software .business-areas .map .title span{
  margin-left: 1em;
  font-size: 18px;
  font-weight: bold;
  color: #000;
  vertical-align: middle;
}

#software .business-areas .nagano{
  position: relative;
  margin-top: 389px;
}

#software .business-areas .arrows{
  position: relative;
  font-size: 22px;
  font-weight: bold;
  color: #fff;
}

#software .business-areas .arrow-01{
  position: absolute;
  top: 178px;
  left: -17px;
}

#software .business-areas .arrow-02{
	line-height: 1.3;
  position: absolute;
  top: 168px;
  right: -75px;
}

#software .business-areas .nagano .area{
  position: absolute;
  top: 380px;
  left: 326px;
}

#software .business-areas .nagano .area .caption{
  margin-bottom: 4px;
  font-size: 22px;
  font-weight: bold;
  color: #004395;
}

#software .business-areas .nagano-table{
  width: 724px;
  position: absolute;
  top: 540px;
  left: 42px;
  border: 2px solid #1f9bfa;
}

#software .business-areas .nagano-table caption{
  font-size: 22px;
  font-weight: bold;
  color: #004395;
  text-align: left;
}

#software .business-areas .nagano-table th,
#software .business-areas .nagano-table td{
  height: 60px;
  border: 1px solid #1f9bfa;
  padding: 5px 0;
  vertical-align: middle;
  font-weight: normal;
}

#software .business-areas .nagano-table th{
  width: 188px;
}

#software .business-areas .nagano-table td{
  padding-left: 15px;
  line-height: 1.4;
}

/* 7-5. company.html
---------------------------------------- */
#company .top-massage{
  height: 678px;
  padding-top: 78px;
  background-image: url(../images/company/top-message_bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
}

#company .top-massage .text{
  width: 600px;
  margin: 65px auto 0;
}

#company .top-massage .text p{
  margin-bottom: 23px;
  line-height: 1.6;
}

#company .top-massage .sign{
  margin: 40px 0 0 530px;;
}

#company .philosophy{
  height: 308px;
  padding-top: 54px;
}

#company .philosophy .list{
  margin: 48px 0 0 173px;
  list-style: none;
}

#company .philosophy .list li{
  margin-bottom: 25px;
  padding-left: 30px;
}

#company .philosophy .list-01{
  background-image: url(../images/company/philosophy_01.png);
  background-repeat: no-repeat;
  background-position: left;
}

#company .philosophy .list-02{
  background-image: url(../images/company/philosophy_02.png);
  background-repeat: no-repeat;
  background-position: left;
}

#company .philosophy .list-03{
  background-image: url(../images/company/philosophy_03.png);
  background-repeat: no-repeat;
  background-position: left;
}

#company .concept{
  height: 603px;
  padding-top: 57px;
  background-image: url(../images/company/concept_bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
}

#company .concept .title{
  margin-top: 90px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
  text-align: center;
}

#company .concept .text{
  margin: 42px 0 0 135px;
}

#company .concept .text p{
  margin-bottom: 23px;
  line-height: 1.7;
}

#company .company-profile{
  padding: 56px 0 94px;
}

#company .company-profile-table{
  width: 100%;
  margin-top: 48px;
  font-size: 15px;
}

#company .company-profile-table tr{
  border-bottom: 1px dotted #aaa;
}

#company .company-profile-table tr:first-child{
  border-top: 1px dotted #aaa;
}

#company .company-profile-table th{
  width: 166px;
  padding: 22px 0 22px 14px;
  border-bottom: 1px dotted #aaa;
  text-align: left;
}

#company .company-profile-table td{
  padding: 22px 0;
}

#company .company-profile-table span{
  display: block;
  margin-top: 12px;
}

#company .company-profile-table span:first-child{
  margin-top: 0;
}

#company .company-profile-table li{
  margin-top: 10px;
  padding-left: 16px;
  background-image: url(../images/company/listmark.png);
  background-repeat: no-repeat;
  background-position: left;
}

#company .company-profile-table li:first-child{
  margin-top: 0;
}

#company .margin{
  padding: 62px 0 100px;
  background-color: #f4faff;
}

#company .margin p{
  font-size: 15px;
  text-align: center;
}

#company .margin .text{
  margin: 66px 0 45px;
}

#company .margin .list{
  margin: 30px 0 0 100px;
}

#company .margin .list li{
  color: #004395;
}

#company .margin .list dl{
  margin-bottom: 26px;
}

#company .margin .list dt{
  margin-bottom: 2px;
}

#company .margin .list dd{
  color: #000;
}

#company .margin table{
  width: 780px;
  margin-top: 15px;
  border: 2px solid #bde2fe;
  text-align: center;
}

#company .margin th{
  height: 52px;
  background-color: #def0fe;
  border: 2px solid #bde2fe;
  font-weight: normal;
  vertical-align: middle;
}

#company .margin td{
  height: 43px;
  border: 2px solid #bde2fe;
  vertical-align: middle;
}

#company .margin .graph{
  position: relative;
  width: 618px;
  margin-top: 30px;
}

#company .margin .caption span{
  position: absolute;
  right: 0;
  text-align: right;
}

#company td strong a{
	font-weight:normal;
	font-size:15px;
	color:#1f9bfa;
	display:inline;
}

#company .access{
  padding: 62px 0 30px;
  background-color: #e8f5fe;
}

#company .access .office-info{
  margin-top: 38px;
}

#company .access .office .name{
 	background-image: url("../images/company/arrow.png");
    background-position: left center;
    background-repeat: no-repeat;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    padding-left: 20px;
}

.place-card-large{
	display: none;
}

#company .access .office{
  width: 470px;
  margin-bottom: 100px;
}

#company .access .office .map{
  background-color: #333;
    border: 2px solid #fff;
    height: 326px;
    width: 470px;
}

#company .access .office .address{
  margin: 12px 0 0 0;
}

#company .access .office .way{
  margin: 12px 0 0 0;
  height:166px;
}

#company .access .office .way .title{
  margin-bottom: 5px;
  font-size: 15px;
  color: #004395;
}

#company .chart{
	  padding: 62px 0 80px;
}

.chart_img{
	margin: 38px auto;
    width: 700px;
}

.chart_img p{
  background-image: url(../images/company/chart.jpg);
  background-position: top right;
  background-repeat: no-repeat;
  padding-top: 800px;
}

/* .recruit共通
---------------------------------------- */
/* key */
.recruit .key{
  height: 250px;
  background-image: url(../images/recruit/key.jpg);
  background-position: center;
  background-repeat: no-repeat;
}

.recruit .key .heading{
  width: 200px;
  position: absolute;
  top: 94px;
  left: 70px;
}

.recruit .key .text{
  position: absolute;
  top: 64px;
  left: 388px;
  font-size: 21px;
  line-height: 1.7;
}

/* table */
.recruit .table{
  width: 100%;
  background-color: #fff;
}

.recruit .table th,
.recruit .table td{
  padding: 18px;
  border: 1px solid #b6b6b6;
}

.recruit .table th{
  background-color: #eee;
  text-align: left;
  font-weight: normal;
}

.recruit .table td .mb{
  margin-bottom: 1.4em;
}


/* 7-7. recruit.html
---------------------------------------- */
#recruit .recruitments{
  /*padding: 58px 0 64px;*/
  padding: 30px 0 30px;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #f1f8ff), color-stop(0.00, #fff));
background: -webkit-linear-gradient(#fff, #f1f8ff);
background: -moz-linear-gradient(#fff, #f1f8ff);
background: -o-linear-gradient(#fff, #f1f8ff);
background: -ms-linear-gradient(#fff, #f1f8ff);
background: linear-gradient(#fff, #f1f8ff);
}

#recruit .recruitments .text{
  width: 580px;
  /*margin: 54px auto 0;*/
  margin: auto;
  line-height: 1.8;
}

#recruit .recruitments .text_for_new{
  text-align: center;
  width: 554px;
  /*margin: 54px auto 30px;*/
  margin: auto;
  line-height: 1.8;
} 

#recruit .recruitments .entry-link{
  text-align: center;
}

#recruit .recruitments .list{
  margin-top: 60px;
}

#recruit .recruitments .list li{
  position: relative;
  width: 322px;
  height: 400px;
  margin-left: 17px;
  float: left;
  background-repeat: no-repeat;
}

#recruit .recruitments .list li:first-child{
  margin-left: 0;
}

#recruit .recruitments .list-01{
  background-image: url(../images/recruit/recruitments_01.jpg);
}

#recruit .recruitments .list-02{
  background-image: url(../images/recruit/recruitments_02.jpg);
}

#recruit .recruitments .list-03{
  background-image: url(../images/recruit/recruitments_03.jpg);
}

#recruit .recruitments .list .title{
  margin-top: 150px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

#recruit .recruitments .list-03 .title{
  line-height: 1.3;
    margin-top: 138px;
}

#recruit .recruitments .list .text{
  width: 262px;
  margin: 23px auto 0;
}

#recruit .recruitments .list-03 .text{
  margin-top: 16px;
}

#recruit .recruitments .list .boxhover{
  	position: absolute;
    bottom: 36px;
    left: 94px;
    display: block;
    padding: 8px 35px 6px 25px;
    background-repeat: no-repeat;
    background-position: 115px 14px;
    margin: 23px auto 0;
    border: 1px solid #333;
    border-radius: 4px;
    text-align: center;
}

#recruit .recruitments .list-01 .boxhover{
  background-image: url(../images/recruit/recruitments_arrow_01.png);
  border-color: #1f9bfa;
  color: #1f9bfa;
}

#recruit .recruitments .list-02 .boxhover{
  background-image: url(../images/recruit/recruitments_arrow_02.png);
  border-color: #13b5b1;
  color: #13b5b1;
}

#recruit .recruitments .list-02 a:hover{
	color: #13b5b1;
}

#recruit .recruitments .list-03 .boxhover{
  background-image: url(../images/recruit/recruitments_arrow_03.png);
  border-color: #80c269;
  color: #80c269;
}

#recruit .recruitments .list-03 a:hover{
	color: #80c269;
}

#recruit .recruitments .link{
  width: 800px;
  margin: 58px auto 0;
}

#recruit .recruitments .link a{
  display: block;
  width: 386px;
  height: 71px;
  background-image: url(../images/recruit/recruitments_btn.png);
  background-repeat: no-repeat;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  line-height: 71px;
  text-align: center;
}

#recruit .interview{
  padding: 60px 0 125px;
}

#recruit .interview .list{
  margin-top: 56px;
}

#recruit .interview .list li{
  float: left;
  position: relative;
  width: 326px;
  height: 356px;
  margin-left: 11px;
}

#recruit .interview .list li:first-child{
  margin-left: 0;
}

#recruit .interview .list .text{
  margin-top: 20px;
  font-size: 18px;
  font-weight: bold;
  color: #1f9bfa;
}

#recruit .interview .list .info{
  position: absolute;
  top: 274px;
  line-height: 1.4;
  font-size: 13px;
}

#recruit .interview .list .link{
  display: block;
  position: absolute;
  bottom: 0;
  padding-left: 23px;
  background-image: url(../images/recruit/interview_arrow.png);
  background-repeat: no-repeat;
  background-position: left center;
  font-size: 15px;
  color: #1f9bfa;
}

#recruit .interview .content-in ul li a:hover{
	font-weight: bold;
	border-bottom: 1px dotted #1f9bfa;
}

/* 7-8. project.html
---------------------------------------- */
#project .main{
	border-top: 1px solid #a7a7a7;
}

#project .project-examples{
  padding: 80px 0 60px;
}

#project .project-examples .sample{
  padding: 55px 0;
  border-top: 2px dotted #ccc;
}

#project .project-examples .sample-01{
  border-top: none;
}

#project > main > section > div > .sample-02{
      padding-bottom: 100px!important;
}

#project > main > section > div > .sample-03{
      padding-bottom: 100px!important;
}

#project .project-examples .sample>.title{
  float: left;
  width: 280px;
  height: 280px;
}

#project .project-examples .sample-01>.title{
  background-image: url(../images/project/project-examples_01.jpg);
}

#project .project-examples .sample-02>.title{
  background-image: url(../images/project/project-examples_02.jpg);
}

#project .project-examples .sample-03>.title{
  background-image: url(../images/project/project-examples_03.jpg);
}

#project .project-examples .sample>.title .jp{
  display: block;
  margin-top: 112px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-shadow: 1px 1px 3px #1673bb;
-moz-text-shadow:1px 1px 3px #1673bb;
-webkit-text-shadow:1px 1px 3px #1673bb;
}

#project .project-examples .sample>.title .eng{
  display: block;
  margin-top: 6px;
  font-size: 16px;
  font-weight: normal;
  color: #fff;
  text-align: center;
    text-align: center;
  text-shadow: 1px 1px 3px #1673bb;
-moz-text-shadow:1px 1px 3px #1673bb;
-webkit-text-shadow:1px 1px 3px #1673bb;
}

#project .project-examples .sample>.content{
  float: left;
  width: 681px;
  height: 280px;
  margin-left: 39px;
}

#project .project-examples .sample .text{
  margin-top: 10px;
  line-height: 1.8;
}

#project .project-examples .sample-01 .text{
  padding-bottom: 30px;
  border-bottom: 2px solid #1f9bfa;
}

#project .project-examples .sample-02 .text{
  padding-bottom: 24px;
  border-bottom: 2px solid #13b5b1;
}

#project .project-examples .sample .business>.title{
  margin-top: 13px;
  font-size: 15px;
}

#project .project-examples .sample-01 .business>.title{
  color: #1f9bfa;
}

#project .project-examples .sample-02 .business>.title{
  color: #13b5b1;
}

#project .project-examples .sample .list{
  margin-top: 6px;
}

#project .project-examples .sample .list li{
  margin-bottom: 4px;
  padding-left: 1.3em;
  text-indent: -1.3em;
  line-height: 1.4;
}

#project .project-examples .sample .list li::before{
  content: "・ ";
}

#project .project-examples .sample-01 .list li::before{
  color: #1f9bfa;
}

#project .project-examples .sample-02 .list li::before{
  color: #13b5b1;
}

#project .project-examples .sample-03 .list li::before{
  color: #80c269;
}

#project .project-examples .sample-02 .business{
  float: left;
}

#project .project-examples .sample-02 .business:first-child{
  margin-right: 56px;
}

#project .project-examples .sample-02 .list{
  float: left;
}

#project .project-examples .sample-02 .list:first-child{
  margin-right: 14px;
}

#project .project-examples .sample-03 .content .title{
  padding-left: 26px;
  background-image: url(../images/project/project-examples_arrow.png);
  background-repeat: no-repeat;
  background-position: left .1em;
  font-size: 15px;
  font-weight: normal;
}

#project .project-examples .sample-03 .content .list{
  margin-left: 20px;
}

#project .project-examples .sample-03 .content-01,
#project .project-examples .sample-03 .content-02{
  margin: 7px 0 23px;
}

#project .project-examples .sample-03 .content-01{
  width: 330px;
}

#project .project-examples .sample-03 .content-02{
  width: 330px;
}

#project .project-examples .sample-03 .content-03{
  clear: both;
}

/* 7-9. training.html
---------------------------------------- */
#training .key .heading .eng {
    color: #3b8cc7;
}

#training .key .text{
  top: 80px;
}

#training .main{
  background-image: url("images/training/bg.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
}

#training .training-examples{
  padding: 78px 0 116px;
}

#training .training-examples .text{
  width: 660px;
  margin: 50px auto 0;
  line-height: 1.8;
}

#training .training-examples .table{
  margin-bottom: 30px;
}

#training .training-examples .table-01{
  margin-top: 55px;
}

#training .training-examples .table th{
  width: 124px;
  font-size: 15px;
}

#training .training-examples .table td{
  position: relative;
}

#training .training-examples .table ol{
  list-style: none;
  font-weight: bold;
  color: #3b8cc7;;
}

#training .training-examples .table ol>li{
  margin-top: 18px;
}

#training .training-examples .table ol>li:first-child{
  margin-top: 0;
}

#training .training-examples .table ul>li,
#training .training-examples .table p{
  text-indent: -1em;
  padding-left: 1.5em;
  font-weight: normal;
  color: #000;
  line-height: 1.7;
}

#training .training-examples .table p{
	padding-left: 25px;
}

#training .training-examples .table ul>li::before{
  content: "・";
  color: #1f9bfa;;
}

#training .training-examples .table.human .list-02{
  width: 600px;
}

#training .training-examples .table td .image{
  position: absolute;
  left: 462px;
}

#training .training-examples .table.technical td .image{
  top: 50px;
}

#training .training-examples .table.human td .image{
    top: 170px;
    left: 520px;
}

/* 7-10. re_hardwear.html
/*       re_softwear.html
/*       #re_qa
---------------------------------------- */
#re_hardware .key{
  background-image: url(../images/re_hardware/key.jpg);
}

#re_software .key{
  background-image: url(../images/re_software/key.jpg);
}

#re_qa .key{
  background-image: url(../images/re_qa/key.jpg);
}

#re_hardware .key .heading,
#re_software .key .heading{
  width: 350px;
  top: 94px;
  left: 0;
}

#re_qa .key .heading{
  width: 365px;
  top: 76px;
  left: 0;
}

#re_hardware .key .heading .eng{
  color: #004395;
}

#re_software .key .heading .eng{
  color: #13b5b1;
}

#re_qa .key .heading .eng{
  color: #80c269;
}

#re_hardware .key .text,
#re_software .key .text,
#re_qa .key .text{
  left: 475px;
}

#re_hardware .key .text{
  top: 64px;
}

.key .text,
#re_qa .key .text{
  top: 48px;
}

#re_software .key .text {
    top: 58px;
}

#re_hardware .requirements{
  background-image: url("../images/re_hardware/bg.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
}

#re_software .requirements{
  background-image: url("../images/re_software/bg.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
}

#re_qa .requirements{
  background-image: url("../images/re_qa/bg.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
}

#re_hardware .requirements,
#re_software .requirements,
#re_qa .requirements{
  padding: 75px 0 162px;
}

#re_hardware .requirements .image,
#re_software .requirements .image,
#re_qa .requirements .image{
  margin-top: 58px;
  text-align: center;
}

#re_hardware .requirements .table,
#re_software .requirements .table,
#re_qa .requirements .table{
  margin-top: 54px;
}

#re_hardware .requirements .table th,
#re_software .requirements .table th,
#re_qa .requirements .table th{
  width: 140px;
}

#re_hardware .requirements .table td,
#re_software .requirements .table td,
#re_qa .requirements .table td{
  line-height: 1.8;
}


/* 7-11. interview1.html
/*       interview2.html
/*       interview3.html
======================================== */
.interview .key .content-in{
  position: relative;
}

.interview .key .text{
  position: absolute;
  left: 370px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
}

#interview1 .key .text{
  top: 75px;
}

#interview2 .key .text,
#interview3 .key .text{
  top: 75px;
}

.interview .main{
  padding: 90px 0 98px;
}

.interview .row{
  margin-bottom: 64px;
}

.interview .image{
  width: 336px;
}

.interview .title{
  width: 634px;
  margin-bottom: 14px;
  font-size: 24px;
  font-weight: bold;
  color: #004395;
}

.interview .text{
  width: 634px;
  font-size: 15px;
  line-height: 1.6;
}

/* 7-12. .sentence-page
---------------------------------------- */
.sentence-page .key{
  height: 250px;
  background-image: url("../images/common/key.jpg");
  background-repeat: no-repeat;
  background-position: center;
}

.sentence-page .key .heading{
  position: absolute;
  top: 100px;
  width: 100%;
  text-align: center;
}

.sentence-page .main{
  padding-bottom: 20px;
}

.sentence-page .main .content-in{
    width: 715px;
    margin: 0 auto 60px;
}

.sentence-page .text{
  width: 700px;
  margin: 50px auto 0;
}

.sentence-page .sentence{
  padding: 60px 0 50px;
}

.sentence-page .sentence .list{
  margin: 60px auto 0;
  list-style: none;
}

.sentence-page .sentence .list .title{
  display: block;
  font-weight: bold;
  color: #004395;
}

.sentence-page .sentence .list ul,
.sentence-page .sentence .list ol,
.sentence-page .sentence .list p{
  margin-top: 1em;
}

.sentence-page .sentence .list>li{
  margin-bottom: 30px;
}

.sentence-page .sentence .list li li,{
  line-height: 1.7;
}

.sentence-page .sentence .list li p{
    line-height: 1.7;
    width: 660px;
    margin-left: 30px;
}

#sitepolicy > main > div > ul > li > p{
    margin-left: 15px!important;
}

.sentence-page .sentence .list li ul li::before{
  content: "・";
}

.sentence-page .sentence .list li ol li{
  margin-left: 1.5em;
}

.sentence-page .sentence .contact-info{
  margin: 0 auto;
}

#privacy .sentence > div > ol > li > ol{
	width: 680px;
    margin-left: 30px;
}

/* 7-13. entry.html
  ---------------------------------------- */
#entry .entry-content{
  padding: 60px 0 50px;
}

#entry .entry-content .text{
	width: 675px;
}

#entry .entry-content .link{
  display: block;
  background-image: url(../images/entry/btn_bg.jpg);
  width: 493px;
  height: 71px;
  margin: 50px auto 0;
  padding-left: 54px;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  line-height: 74px;
}

#entry .entry-content .caution{
  margin-top: 6px;
  font-size: 12px;
  text-align: center;
}

#entry ol > li > ul{
margin-left: 30px;
}

/* 7-14. securitypolicy.html
---------------------------------------- */
#securitypolicy .sentence .signature{
  width: 210px;
  float: right;
}

#securitypolicy .sentence .auth{
    clear: both;
    width: 180px;
    position: absolute;
}

/* 7-15. sitepolicy.html
---------------------------------------- */
#sitepolicy .sentence{
  padding-top: 0;
}

#sitepolicy .sentence .list .title{
  font-size: 15px;
}

/* 7-16. .contact
---------------------------------------- */
.contact .key{
  height: 250px;
  background-image: url(../images/common/key.jpg);
  background-repeat: no-repeat;
  background-position: center;
}

.contact .navbr {
	background-image: none;
}

.contact .key .heading{
  position: absolute;
  top: 100px;
  width: 100%;
  text-align: center;
}

.contact .contact-content{
padding: 60px 0 50px;
}

.contact .contact-content .text{
  width: 628px;
  margin: 0 auto;
}

.contact .contact-content .caution{
  margin-top: 6px;
  font-size: 13px;
  text-align: center;
}

.contact .section{
  padding: 60px 0 50px;
}

.contact table{
	margin: 50px 0 20px;
  width: 700px;
}

.contact table th{
	width: 200px;
}

.contact th, .contact td{
	border: 1px solid #dbe8fb;
	border-collapse: collapse;
}

.contact th{
    background: #e8f5fe;
    vertical-align: middle;
}

.contact td{
    background: #e8f5fe;
    vertical-align: middle;
}

.contact tr:hover th{
    background: #e8f5fe;
    vertical-align: middle;
}

.contact tr:hover td,
.contact tr:hover td {
	background: #e8f5fe;
	vertical-align: middle;
}

/* 7-17. thanks.html
---------------------------------------- */
#thanks .main{
  padding-top: 60px;
}

#thanks .message{
	border-bottom: 1px dotted #0053a8;
  border-top: 1px dotted #0053a8;
  color: #0053a8;
  font-size: 18px;
  font-weight: bold;
  height: 150px;
  margin: 60px auto 300px;
  text-align: center;
  width: 450px;
}

#thanks .message p {
	margin-top: 48px;
}

#thanks .message .end2{
	color: #000000;
  font-size: 15px;
  font-weight: normal;
  margin-top: 85px;
  text-align: left;
  margin-left: 40px;
}

/* 7-18. news.html
---------------------------------------- */
#news .key{
  height: 250px;
  background-image: url(../images/common/key.jpg);
  background-repeat: no-repeat;
  background-position: center;
}

#news .key .heading{
  position: absolute;
  top: 100px;
  width: 100%;
  text-align: center;
}

#news .main{
  padding-bottom: 100px;
}

#news .post{
  margin-top: 65px;
}

#news .post .head{
  padding: 15px 0 11px 20px;
  background-image: url(../images/news/head_bg.png);
  background-repeat: repeat-x;
  background-position: top;
  border-bottom: 1px solid #ddd;
}

#news .post .time{
  float: left;
  width: 135px;
  margin-top: 2px;
  font-size: 18px;
  font-weight: bold;
}

#news .post .title{
  float: left;
  width: 720px;
  font-size: 20px;
  font-weight: bold;
}

#news .post .icon{
  display: block;
  float: right;
  width: 104px;
  height: 30px;
  background-color: #aaa;
  border-radius: 10px;
  font-size: 15px;
  color: #fff;
  line-height: 30px;
  text-align: center;
}

#news .post .icon-news{
  background-color: #ff7500;
}

#news .post .icon-event{
  background-color: #1f9bfa;
}

#news .post .content{
  padding: 24px 14px 0;
  line-height: 2.4;
}