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





/* NAV
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.inner {
    width: 980px;
    margin: 0 auto;
}
.inner:after {
    content: "";
    clear: both;
    display: block;
}
 
/* header */
#top-head {
    top: -100px;
    position: absolute;
    width: 100%;
    margin: 100px auto 0;
    padding: 30px 0 0;
    line-height: 1;
    z-index: 999;
}
#top-head a,
#top-head {
    text-decoration: none;
}
#top-head .inner {
    position: relative;
		max-width:1200px;
		width:100%;
		margin-left:auto; margin-right:auto;
}
#top-head .logo {
    float: left;
		width:50%;
		padding-left:10px;
}
#top-head span.logobox{ display:block; max-width:300px; margin-top:10px; }
#top-head span.headtext{
	display:block; font-size:11px; line-height:12px; margin-top:5px;
}
#globalnavwrap{
	position: absolute;
	right: 10px;
	top: 0;
	max-width:360px;
	width:45%;
	
}
#globalnavwrap ul {
    list-style: none;
    font-size: 14px;
		width:100%;
		text-align:right;
		margin-bottom:15px;
}

#global-nav ul li{
	display:inline-block;
	margin-left:20px;
	z-index:1000;
}
#global-nav ul li a{
	padding-right:18px;
	background:url(../images/mark1.png) right 3px no-repeat;
}
li.gtel{
	display:inline-block; max-width:238px; width:59.5%;
}
li.gmail{
	display:inline-block; max-width:143px; width:35.75%;
}

	
#global-nav ul li a {
	color:#000;
}
 
/* Fixed */
#top-head.fixed {
    margin-top: 0;
    top: 0;
    position: fixed;
    padding-top: 5px;
    height: 100px;
    background: rgba(255,255,255,1.0);
    transition: top 0.65s ease-in;
    -webkit-transition: top 0.65s ease-in;
    -moz-transition: top 0.65s ease-in;
}
#top-head.fixed .logo {
    max-width:450px;
}

#top-head.fixed span.logobox{ display:block; max-width:270px; margin-top:5px; }
#top-head.fixed span.headtext{
	display:block; font-size:11px; line-height:11px;
}
#top-head.fixed #globalnavwrap{
	position: absolute;
	right: 10px;
	top: 0;
	max-width:360px;
	width:45%;
}
#top-head.fixed #globalnavwrap ul {
		margin-bottom:5px;
}

#top-head.fixed #global-nav ul li a {
}
 
/* Toggle Button */
#nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 30px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 101;
}
#nav-toggle div {
    position:absolute;
		top:2px;
		right:0;
		width: 32px;
    height: 36px;
    cursor: pointer;
		float:right;
}
#nav-toggle span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #000000;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
    top: 0;
}
#nav-toggle span:nth-child(2) {
    top: 11px;
}
#nav-toggle span:nth-child(3) {
    top: 22px;
}
p.gtel{
	width:32px; height:32px; position:absolute; top:0; right:72px;
}
p.gmail{
	width:32px; height:32px; position:absolute; top:0; right:38px;
}


@media screen and (max-width: 640px) {
    #top-head,
    .inner {
      width: 100%;
      padding: 0;
    }
    #top-head {
      top: 0;
      position: fixed;
      margin-top: 0;
    }

    /* Fixed reset */
    #top-head.fixed {
      padding-top: 0;
      background: transparent;
    }
    #top-head.fixed #globalnavwrap{
      position: absolute;
      right: 0;
      top: 0;
      max-width:none;
      width:100%;
    }
    #mobile-head {
      background: rgba(255,255,255,1.0);
      width: 100%;
      height: 85px;
      z-index: 999;
      position: relative;
    }
    #top-head.fixed .logo,
    #top-head .logo {
      position: absolute;
      top: 0px;
      width:100%;
    }
    #top-head span.logobox,#top-head.fixed span.logobox{ display:block; max-width:200px; width:50%; margin-top:10px; }
    #top-head span.headtext,#top-head.fixed span.headtext{
      display:block; position:relative; font-size:11px; line-height:11px;
    }
    .gnavtelmail{
        display: none;
    }

    #globalnavwrap{
      position: absolute;
      right: 0;
      top: 0;
      max-width:none;
      width:100%;
    }
    #global-nav {
      position: absolute;
      /* 開いてないときは画面外に配置 */
      top: -500px;
      background:none;
      z-index:1000;
      max-width:none;
      width: 100%;
      text-align: center;
      padding: 10px 0;
      -webkit-transition: .5s ease-in-out;
      -moz-transition: .5s ease-in-out;
      transition: .5s ease-in-out;
    }




    #globalnavwrap ul {
        list-style: none;
        font-size: 14px;
        width:100%;
        text-align:right;
        margin-bottom:15px;
    }


    #global-nav ul {
      list-style: none;
      position: static;
      right: 0;
      bottom: 0;
      text-align:center;
      font-size: 18px;
    }
    #global-nav ul li {
      display:block;
      position: static;
    }
    #global-nav ul li{
      display:block;
      margin-left:0px;
    }
    #global-nav ul li a{
      padding-right:0;
      background-image:none;
      background-color: rgba(0,119,13,0.70);
      color:#fff;
      font-size:18px;
    }
    #global-nav ul li a:hover{
      background-color: rgba(0,119,13,1.0);
    }

    #top-head #global-nav ul li a,
    #top-head.fixed #global-nav ul li a {
      width: 100%;
      display: block;
      color: #fff;
      padding: 10px 0;
    }
    #nav-toggle {
      display: block;
    }
    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
      top: 11px;
      -webkit-transform: rotate(315deg);
      -moz-transform: rotate(315deg);
      transform: rotate(315deg);
    }
    .open #nav-toggle span:nth-child(2) {
      width: 0;
      left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
      top: 11px;
      -webkit-transform: rotate(-315deg);
      -moz-transform: rotate(-315deg);
      transform: rotate(-315deg);
    }
    /* #global-nav スライドアニメーション */
    .open #global-nav {
      /* #global-nav top + #mobile-head height */
      -moz-transform: translateY(575px);
      -webkit-transform: translateY(575px);
      transform: translateY(575px);
    }
}
 



/* BASE-style
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.wrap{
	padding-top:150px;
}
.idlink { padding-top:102px; margin-top:-102px;  }
.idlink2 { padding-top:230px; margin-top:-109px;  }

.sliderwrap{ position:relative; margin-top:150px; height:auto; width:100%; z-index:10; background-color:#000; overflow: hidden; border-bottom: 10px solid #000; }



@media screen and (max-width: 640px) {

.wrap{ padding-top:90px; }
.idlink { padding-top:100px; margin-top:-80px; }
.idlink2 { padding-top:160px; margin-top:-80px;  }
.sliderwrap{ position:relative; margin-top:85px; height:auto; width:100%; height: 156px; }

}

@media screen and (max-width: 450px) {
  .sliderwrap { height: 132px; }
}

#business{ position:relative; background:url(../images/backimage1.jpg) 0 80px no-repeat fixed; background-size:cover; z-index:9; }
#info{ position:relative; background-color:#fff; z-index:8; }
#company{ position:relative; background:url(../images/backimage-company.jpg) center top no-repeat fixed; background-size:cover; z-index:7; }
#contact{ position:relative; background:url(../images/backimage2.jpg) center top no-repeat; background-size:cover; z-index:6; }

.box-right{ float:right; }
.box-left{ float:left; }

.mainwrap1{
	width:90%;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
}


#business{ padding-bottom:50px!important; }
.businessbox{ background-color:#fff; padding-bottom:20px; }
.businessbox ul li{ width:16.6666666666666%; float:left; }
.businessbox ul{ margin-bottom:20px; }
.businesstext{ width:70%; margin-left:auto; margin-right:auto; }
.businesstext span{ display: block; width: 30%; max-width: 180px; margin-right: 2%; float: left; }

@media screen and (max-width: 640px) {

#business{ padding-bottom:30px; }
.businessbox ul li{ width:33.333333333333%; }
.businesstext{ width:90%; }
.businesstext span{ width: 45%; margin-right: 10px; }

}

#info{ padding-bottom:50px; }
.infobox div{ margin:1%; width:23%; border:1px solid #002358; float:left; }
.infodate{ width:96%; margin:6px auto 0 auto; font-size:11px; color:#002358; }
.infottl{ width:96%; margin:0 auto; font-weight:bold; }
.infobody{ width:96%; margin:5px auto; }
.btn1{ width:60%; max-width:500px; margin:20px auto 30px auto; }
.btn1 a{ display:block;  text-align:center; background-color:#002358; color:#fff; padding:12px 10px; }

.infoextra1{ width:90%; max-width:1000px; margin:0 auto; background-color:#002358; padding:15px; }
.infoextra1 .box-right{ width:65%; max-width:624px; }
.infoextra1 .box-left{ width:33%; max-width:320px; }
.infoextra1 .box-left h3{ font-size:32px; color:#fff; text-align:center; margin:20px auto; }
.btn2{ max-width:214px; width:90%; margin-left:auto; margin-right:auto; }
.btn2 a{ display:block; border:1px solid #fff; background-color:#002358; text-align:center; padding:10px; color:#fff; font-size:18px; }

.infoextra1 .pc{ display:block; }
.infoextra1 .sp{ display:none; }

.infobox2{ margin-bottom: 30px; }
.infobox2 .box-left{ width:70%; float:left; }
.infobox2 .box-right{ width:25%; float:right; }
.infonavttl{ background-color: #DDD; text-align: center; margin-bottom: 10px; }
.infonav li a{ display: block; padding: 8px; border-bottom: 1px dotted #aaa; }

.infodetailttl{ font-size: 24px; line-height: 30px; }
.infodetaildate{ font-size:11px; color:#228a3b; margin-bottom: 15px; }
.infodetailbody p{ margin-bottom: 10px; }
.infodetailbody h2{ background-color: #333; color: #fff; font-size: 20px; padding: 5px 10px; font-weight: bold; margin-bottom: 20px; }
.infodetailbody h3{ border-left: 5px solid #333; font-size: 18px; padding: 3px 10px; font-weight: bold; margin-bottom: 20px; }
.infodetailbody h4{ border: 1px solid #333; padding: 5px 10px; font-weight: bold; margin-bottom: 20px; }
.infodetailbody h5{ border-bottom: 1px solid #333; padding: 5px 10px; font-weight: bold; font-size: 100%; margin-bottom: 20px; }
.infodetailbody table{ border-top: 1px solid #000; border-left: 1px solid #000; width: 100%; border-collapse: collapse; border-spacing: 0px; }
.infodetailbody th{ border-right: 1px solid #000; border-bottom: 1px solid #000; padding: 5px 7px; background-color: #ddd; }
.infodetailbody td{ border-right: 1px solid #000; border-bottom: 1px solid #000; padding: 5px 7px; }
.infodetailbody ul li{ margin-left: 30px; list-style: disc; }
.infodetailbody ol li{ margin-left: 30px; list-style: decimal; }

@media screen and (max-width: 640px) {

#info{ padding-bottom:30px; }
.infobox div{ margin:1.5%; width:47%; border:1px solid #002358; float:left; }
.infoextra1{ padding:10px 15px; }
.infoextra1 .box-right{ width:100%; max-width:none; }
.infoextra1 .box-left{ width:100%; max-width:none; }
.infoextra1 .box-left h3{ font-size:18px; color:#fff; text-align:center; margin:0 0 10px 0; }
.btn2{ max-width:214px; width:90%; margin-left:auto; margin-right:auto; margin-top:10px; }
.btn2 a{ display:block; border:1px solid #fff; background-color:#5088dc; text-align:center; padding:5px; color:#fff; font-size:16px; }
.btn1{ margin:0px auto 30px auto; }

.infoextra1 .pc{ display:none; }
.infoextra1 .sp{ display:block; }

.infobox2{ margin-bottom: 10px; }
.infobox2 .box-left{ width:96%; float:none; margin-left: auto; margin-right: auto; margin-bottom: 30px; }
.infobox2 .box-right{ width:60%; float:none; margin-left:auto; margin-right: auto; border-top: 1px solid #DDD; border-right: 1px solid #DDD; border-left: 1px solid #DDD; padding: 0px; text-align: center; }
.infonavttl{ background-color: #DDD; text-align: center; margin-bottom: 0px; }
.infonav li{  text-align: center; border-bottom: 1px solid #ddd; }
.infonav li a{ display:block; padding: 8px 10px; border-bottom:none; }

.infodetailttl{ font-size: 24px; line-height: 30px; }
.infodetaildate{ font-size:11px; color:#002358; margin-bottom: 15px; }
.infodetailbody p{ margin-bottom: 10px; }

}



#company{ padding-bottom:50px; }
.companybox table{ width:75%; border-top:1px solid #002358; border-left:1px solid #002358; margin-left:auto; margin-right:auto; }
.companybox th{ width:25%; padding:10px 3%; vertical-align:top; text-align:left;background-color: rgba(34,68,138,0.70); border-bottom:1px solid #002358; border-right:1px solid #002358; color: #fff; }
.companybox td{ padding:10px 3%; vertical-align:top; text-align:left;background-color: rgba(255,255,255,0.90); border-bottom:1px solid #002358; border-right:1px solid #002358; }

@media screen and (max-width: 640px) {

#company{ padding-bottom:30px; }
.companybox table{ width:96%; }
.companybox th{ padding:5px 2%; }
.companybox td{ padding:5px 2%; }
  
}

/* contact form */

.contactbox{ max-width:1000px; width:90%; margin-left:auto; margin-right:auto;}
.contactbox .box-right{ width:54%; padding:20px; background-color:#fff; }
.contactbox .box-left{ width:42%; padding:20px; background-color:#fff; }
.contactbox h3{ font-size:21px; margin-bottom:10px; }

.error { color:#F00; }
span.error{ display:block; font-size:12px; }
.form-control{ width:70%; }
.form-group input,.form-group textarea{ width:100%; padding:1px 10px; }
.form-tr span.glyphicon{ display:block; float:left; width:20%; padding-top:6px; }
.form-tr div.form-group{ width:76%; float:right; }
.form-tr{ margin-bottom:10px; }
button.btn{ display:block; width:40%; background-color: #002358; border-style:none; margin:0 auto; padding:0; }
button.btn span{ display:block; width:100%; text-align:center; color:#fff; padding:5px 10px 4px 10px; margin:0; font-size:16px; }

.contact-tel{ font-size:32px; font-family:Arial, Helvetica, sans-serif; font-weight:bold; line-height:1.1; margin-bottom:10px; padding-top:10px; }
.contact-text{ margin-bottom:10px; }


.foottitle{ width:96%; max-width: 500px; text-align:center; font-size:32px; color:#fff; margin:30px auto; }
.copyright{ text-align:center; padding-bottom:30px; font-size:11px; color:#fff; }

@media screen and (max-width: 640px) {

.contactbox{ width:96%; }
.contactbox .box-right{ width:100%; margin-bottom:20px; padding:15px; }
.contactbox .box-left{ width:100%; padding:15px; }
.form-tr span.glyphicon{ display:block; float:left; width:25%; padding-top:0px; }
.form-tr div.form-group{ width:74%; float:right; }
.contact-tel{ margin-bottom:10px; padding-top:0px; }

.foottitle{ width:65%; text-align:center; font-size:16px; color:#fff; margin:10px auto; }

}


.gmap{ width: 100%; }
.gmap iframe{ width: 100%; height: 300px; }



.pagenate{
	position:relative;
	overflow:hidden;
  margin-top: 10px;
}
.pagenate ul{
	position:relative;
	left:50%;
	float:left;
}
.pagenate li{
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
}
.pagenate li a{
	display:block;
	padding:3px 5px;
/*	border:1px solid #fff;*/
	margin:2px;
  background-color: #228a3b; 
	text-decoration:none;
  border: 1px solid #228a3b;
  color: #fff;
}
.pagenate li a:hover{
	border: 1px solid#228a3b;
}
.pagenate li span{
	display:block;
	padding:3px 5px;
  border: 1px solid #228a3b;
	margin:2px;
}