@charset utf-8;

* {
	margin:0;
	padding:0;
	border:0;
}

body {
	font-family:"ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "ＭＳ Ｐゴシック", Meiryo, sans-serif;
	font-size:95%;
	line-height:160%;
	-webkit-text-size-adjust:none;
	color:#333;
	background-color: #f5f5f5;
}


main {
	background:0 to(#fff));
}

.clear {clear:both;}

/*
ul {
	margin:0 auto;
	overflow:hidden;
	list-style:none;
}
*/

ol,
ul{
	list-style:none;
}
img {
	border:none;
	vertical-align:top;
}

.clearfix{
    zoom:1;/*for IE 5.5-7*/
		overflow:hidden;
}
.clearfix:after{/*for modern browser*/
    content:".";
    display: block;
    height:0px;
    clear:both;
    visibility:hidden;
}


/* link
----------------------------------------------------------*/
a{outline:none;}
a:link,
a:visited {
	color:#3058cc;
	text-decoration:underline;
}
a:hover {
	color:#3058cc;
	text-decoration:none;
}

/*　汎用
------------------------------------------------------------------*/
.fs60 {font-size:60%; line-height:1.2em;}
.fs80 {font-size:80%; line-height:140%;}
.fs85 {font-size:85%;}
.fs90 {font-size:90%; line-height:140%;}
.fs95 {font-size:95%;}
.fs100 {font-size:100%;}
.fs105 {font-size:105%;}
.fs110 {font-size:110%;}
.fs120 {font-size:120%;}
.fs130 {font-size:130%;}
.fs140 {font-size:140%;}
.fs160 {font-size:160%;}
.fs200 {font-size:200%;}

.bold{ font-weight:bold;}
.normal{ font-weight:normal;}

.mb01 {margin-bottom:1px;}
.mb05 {margin-bottom:5px;}
.mb07 {margin-bottom:7px;}
.mb10 {margin-bottom:10px;}
.mb15 {margin-bottom:15px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb55 {margin-bottom:55px;}

.mt05 {margin-top:5px;}
.mt15 {margin-top:15px;}
.mt30 {margin-top:30px;}

.ml15 {margin-left:15px;}

.pt07 {padding-top:7px;}
.pt10 {padding-top:10px;}
.pt15 {padding-top:15px;}
.pt20 {padding-top:20px;}
.pt30 {padding-top:30px;}
.pt35 {padding-top:35px;}
.pb05 {padding-bottom:5px;}
.pb10 {padding-bottom:10px;}

.pd10 {padding-left:10px; padding-right:10px;}
.pd20 {padding-left:20px; padding-right:20px;}

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

.tac {text-align:center;}
.tar {text-align:right;}
.tal {text-align:left;}
.ln {line-height:normal;}

.kome{
	text-indent:-1em;
	margin-left:1em;
}

.img-circle {border-radius:50%;}
.img-rounded {border-radius:5px;}


.img100 img {width:100%;height:auto;}

.img30_c {width:30%; margin:0 auto;}
.img30_c img {width:100%; height:auto;}

.img40_c {width:40%; margin:0 auto;}
.img40_c img {width:100%; height:auto;}

.img60_c {width:60%; margin:0 auto;}
.img60_c img {width:100%; height:auto;}

.img70_c {width:70%; margin:0 auto;}
.img70_c img {width:100%; height:auto;}

.img80_c {width:80%; margin:0 auto;}
.img80_c img {width:100%; height:auto;}

.img40 {width:40%;}
.img40 img {width:100%; height:auto;}

.img60 {width:60%;}
.img60 img {width:100%; height:auto;}

.img80 {width:80%;}
.img80 img {width:100%; height:auto;}


/*　カラー
------------------------------------------------------------------*/
.red {color:#c33;}

/*　list
------------------------------------------------------------------*/
ul.list_ul{
	list-style:disc;
	margin-left:20px;
}
ol.list_ol{
	list-style:decimal;
	margin-left:25px;
}

/* 背景
---------------------------------------------------- */

/* text_btn
----------------------------------------------------------*/
.text_btn{
	background-color:#fff;
	color:#3058cc;
	padding:10px 10px;
	text-align:center;
	display:block;
	border-radius:6px;
	font-size: 100%;
	line-height: 1.4em;
}
.text_btn:link,
.text_btn:visited,
.text_btn:hover{ color:#3058cc; text-decoration:none;}
.text_btn i {padding-right:8px;}

.text_btn2{
	background-color:#3058cc;
	color:#fff;
	padding:10px 10px;
	text-align:center;
	display:block;
	border-radius:6px;
	font-size: 100%;
	line-height: 1.4em;
}
.text_btn2:link,
.text_btn2:visited,
.text_btn2:hover{ color:#fff; text-decoration:none;}
.text_btn2 i {padding-right:8px;}



/* table
----------------------------------------------------------*/
.nw {width:1%; white-space:nowrap;}

.table1{
	width:100%;
	border-collapse:collapse;
	border-top:1px solid #d0d0d0;
}
.table1 th,.table1 td{
	padding:10px 13px;
	border-bottom:1px solid #d0d0d0;
	border-right:1px solid #d0d0d0;
}
.table1 th{
	background-color:#dfdfdf;
	text-align:center;
	font-size:105%;
}
.table1 th.blue{
	background-color: #bcd2ff;
	color: #3058cc;
}

.table1 th:last-child {border-right: none;}
.table1 td:last-child {border-right: none;}
.table1 .w20 {width: 20%;}

/*　mawarikomi
------------------------------------------------------------------*/
.mawarikomi_l .image{	
	float:left;
	margin-right:15px;
	margin-bottom:10px;
	width:40%;
}
.mawarikomi_l .image img{ width:100%; height:auto;}
.mawarikomi_l .text{ overflow:hidden; zoom:1;}

.mawarikomi_r .image{	
	float:right;
	margin-left:15px;
	margin-bottom:10px;
	width:40%;
}
.mawarikomi_r .image img{ width:100%; height:auto;}
.mawarikomi_r .text{ overflow:hidden; zoom:1;}


/*　headder
------------------------------------------------------------------*/
.head_moji {
	font-size: 80%;
	line-height: 1.4em;
	background-color: #efefef;
	padding: 5px 10px;
}

#header-menu {
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  background:#fff;
  -moz-background-size:100% auto;
  background-size:100% auto; 
  z-index: 9900;
  border-collapse:collapse;
}
#header-menu .inner {
  min-height: 60px;
  padding: 0 10px;
  position: relative;
	background: url(../images/bg_head.jpg) repeat-x top;
	-moz-background-size:auto 100%;
	background-size:auto 100%; 
}
#header-menu .inner .logo {
  width: 200px;
  margin: 0;
  float: left;
  padding-top: 17px;
}
#header-menu .inner .logo img {width:100%; height:auto;}
#header-menu .inner .gNavi_btn {
  float: right;
  width: 40px;
  height: 40px;
  margin-top: 10px;
}
#header-menu .inner .gNavi_box {
  width: 100%;
  clear: both;
  padding: 10px 0;
}
#header-menu .inner .gNavi_box ul {
  list-style: none;
  padding: 10px;
  border: solid 1px #4d5b74;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  margin: 0;
  max-height: 370px;
  background-color: #fff;
}
#header-menu .inner .gNavi_box ul li {
  margin-bottom: 1px;
}
#header-menu .inner .gNavi_box ul li a {
  color: #333;
  text-decoration: none;
  display: block;
  padding: 5px 10px 5px 15px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: #f1f1f1;
  font-size:90%;
}
#header-menu .inner .gNavi_box ul li a:hover {
  background-color: #5c5c5c;
  color:#fff;
}
#header-menu .inner .gNavi_box ul li.navi-on a {
  background-color: #5c5c5c;
  color:#fff;
}
@media (max-device-width: 320px) and (orientation: landscape) {
  #header-menu .inner .gNavi_box {
    max-height: 200px;
  }
}

#panel-btn {
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
  background-color:#36c;
  border-radius:3px;
}

#panel-btn-icon {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 1px;
  margin: -1px 0 0 -7px;
  background: #fff;
  transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 1px;
  background: #fff;
  transition: .3s;
}
#panel-btn-icon:before {
  margin-top: -6px;
}
#panel-btn-icon:after {
  margin-top: 4px;
}

#panel-btn .close {
  background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after {
  margin-top: 0;
}
#panel-btn .close:before {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#panel-btn .close:after {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}


/* midashi
----------------------------------------------------------*/
h2 {font-size:140%;}
h3 {font-size:120%;}
h4 {font-size:100%;}
h5 {font-size:100%;}
h6 {font-size:100%;}

#midashi_h2{
	width: 100%;
}
.technology_h2{background: url(../images/technology_h2.jpg) no-repeat scroll 50% 50% / cover;}
#midashi_h2 .in{
	padding: 20px;
}
#midashi_h2 h2{
	text-align: center;
	color: #fff;
	font-weight: normal;
	padding: 30px 0;
	font-size: 150%;
}
#midashi_h2 h2 .en{
	display: block;
	font-size: 60%;
	margin-top: 5px;
	line-height: 1.0em;
	font-family: 'Oswald', sans-serif;
}

.midashi1{
	background-color: #3366cc;
	color: #fff;
	line-height: 1.4em;
	font-size: 140%;
	padding: 10px 20px;
}

.midashi2{
	color: #3366cc;
	font-size: 120%;
	line-height: 1.4em;
	margin-bottom: 5px;
}
.midashi2_sen{
	color: #3366cc;
	font-size: 120%;
	line-height: 1.4em;
	border-collapse: collapse;
	border-left: 5px solid #3366cc;
	padding-left: 10px;
}

/* dl
---------------------------------------------------- */
.dl_list dt{
	color:#0697cc;
	font-weight:bold;
	font-size:110%;
	margin-bottom: 5px;
}

/* content
----------------------------------------------------------*/
main {padding-top:80px; font-size: 105%;}

.content{padding:0 20px;}

/* mainimage
---------------------------------------------------- */
#mainimage {position: relative;}
#mainimage img{max-width: 100%;}

/* 01-index
---------------------------------------------------- */
#top_bg{
	width: 100%;
	background-color: #3058cc;
}
#top_bg .in{
	padding: 15px 20px;
	color: #fff;
}
#top_bg .in .top_en{
	background: url(../images/top_en.png) no-repeat center top;
	-moz-background-size: 100% auto;
	background-size:100% auto;
}
#top_bg .in .title{
	font-size: 160%;
	line-height: 1.4em;
	font-weight: normal;
	margin-bottom: 12px;
}


.top_box{
	background-color: #bdd7ff;
	padding: 15px 20px;
	line-height: 1.4em;
	margin-bottom: 15px;
}
.top_box.bg2 {background-color: #bcd2ff;}
.top_box .title{
	margin-bottom: 15px;
	color: #3e67d4;
	font-size: 150%;
	line-height: 1.4em;
}
.top_box img {width: 100%; height: auto;}
.top_box h4{
	font-size: 120%;
	line-height: 1.4em;
	margin-bottom: 10px;
}



#top_news{
	width: 100%;
	background-color: #e1e1e1;
}
#top_news .in{
	padding: 15px 20px 5px 20px;
}

#top_news .news{
	border-collapse: collapse;
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
#top_news .news div img {
	vertical-align:middle;
}
#top_news .news .date {font-size: 90%;}


/* 03-products
---------------------------------------------------- */
.products_photo .box{
	width: 48%;
	float: left;
	margin: 1%;
	text-align: center;
	font-size: 90%;
}
.products_photo .box img {
	width: 100%;
	height: auto;
	border: 1px solid #ccc;
	padding-bottom: 10px;
}

/* 04-facility
---------------------------------------------------- */
.facility_box{
	margin-bottom: 20px;
}
.facility_box img{
	width: 40%;
	height: auto;
	float: left;
	margin-right: 15px;
}
.facility_box .text{
	overflow: hidden;
	zoom:1;
}
.facility_box .midashi2 {font-size: 100%; margin-bottom: 10px;}


.facility_box .table1 td {text-align: center; width: 30%;}
.facility_box .table1 th,
.facility_box .table1 td {padding: 7px 10px;}

/* 05-company
---------------------------------------------------- */
.company_tablelist{
	margin-bottom: 10px;
}
.company_tablelist li.ginkou{
	font-weight: bold;
}
.company_tablelist.last {margin-bottom: 0;}


.company_box2 .box {
	border-collapse: collapse;
	border-bottom: 1px solid #ccc;
	padding-bottom: 15px;
	margin-bottom: 15px;
}

/* 06-contact
---------------------------------------------------- */
#contact_bg{
	width: 100%;
	background: url(../images/contact_bg.jpg) no-repeat center top;
	-moz-background-size:100% auto;
	background-size:100% auto; 
	text-align: center;
}
#contact_bg .in{
	padding: 20px 20px;
}
#contact_bg .title{
	font-size: 120%;
	color: #3058cc;
	line-height: 1.4em;
}

#contact_bg .tel{
	font-family: 'Oswald', sans-serif;
	font-size: 140%;
	display: inline-block;
}
#contact_bg .tel i {margin-right: 5px;}
#contact_bg  .text_btn2 {padding:5px 10px 10px 10px; font-size: 140%;}
#contact_bg  .en {font-family: 'Oswald', sans-serif;}


#contact_bg2{
	width: 100%;
	background-color: #bcd2ff;
	min-width: 1040px;
}
#contact_bg2 .in{
	width: 1000px;
	margin: 0 auto;
	padding: 20px 20px;
}

/* form関連
----------------------------------------------------------*/
.table_form{
	width:100%;
	border-collapse:collapse;
	border-bottom:1px solid #dfdfdf;
}
.table_form th{
	border-top:1px solid #dfdfdf;
	padding:10px 20px;
	background-color:#efefef;
	vertical-align:middle;
	text-align:left;
	font-weight:normal;
	font-size:110%;
}
.table_form td{
	padding:10px 20px;
	border-top:1px solid #dfdfdf;
	background-color: #fff;
}
.table_form .need:after { content: "必須 "; background-color:#c33; color:#fff; font-size:75%; line-height:normal; padding:5px; border-radius:3px; display:block; float:right}

.form-ss{width:25%}
.form-s{width:35%}
.form90{width:60%}
.form100{width:90%}
.form-h{ height:150px; width:90%}
.form-hs{ height:50px; width:90%; font-size:100%;}

input{font-size:100%;vertical-align:middle; padding:14px; margin:3px;}
input[type="text"]{ border:1px solid #ddd;padding:14px; border-radius:4px; font-size:100%;}
select{ border:1px solid #ddd;padding:14px; border-radius:4px; font-size:100%; height:50px; width:90%;}
input:focus[type="text"]{border:1px solid #999; padding:14px;}
input[type="checkbox"], input[type="radio"] {vertical-align:middle; border: 1px solid #ccc;}

.required input[type="text"], .required input[type="password"], .required select, .required textarea{ border:1px solid #e79595;padding:14px;}
.required input[type="text"]:focus, .required input[type="password"]:focus, .required textarea:focus{border:1px solid #c33; }

textarea{font-size:100%;border:1px solid #ccc;padding:14px;width:99%; border-radius:4px}

.submit{
	background-color:#36c;
    color: #fff;
	border:none;
	border-radius:5px;
	cursor:pointer;
	padding:10px 15px;
	-webkit-appearance: none;/*スマホのグラデ消す*/
	width:100%;
}

.submit2{
	background-color:#36c;
    color: #fff;
	border:none;
	border-radius:5px;
	font-size:110%;
	cursor:pointer;
	padding:15px 15px;
	-webkit-appearance: none;/*スマホのグラデ消す*/
	width:90%;
}
.submit3{
	background-color:#1f1f1f;
    color: #fff;
	border:none;
	border-radius:5px;
	font-size:100%;
	cursor:pointer;
	padding:15px 15px;
	-webkit-appearance: none;/*スマホのグラデ消す*/
}


/*薄い文字*/
.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: #999;
}
.form-control::-webkit-input-placeholder {
  color: #999;
}


.contact_scroll {
    height:250px;
    width: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}
.contact_scroll dt{
	background:none;
	padding-left:0;
	margin-bottom:5px;
}
.contact_scroll dd{
	padding-left:0;
}

/* kabu_otoiawase
---------------------------------------------------- */
#kabu_otoiawase{
	width: 100%;
	background-color: #bcd2ff;
}
#kabu_otoiawase .in{
	padding: 20px 20px;
}
#kabu_otoiawase .title{
	color: #3058cc;
	margin-bottom: 10px;
	font-size: 110%;
}

#kabu_otoiawase .otoiawase{
	text-align: center;
}

#kabu_otoiawase .tel{
	font-family: 'Oswald', sans-serif;
	font-size: 140%;
	display: inline-block;
}
#kabu_otoiawase .tel i {margin-right: 5px;}

#kabu_otoiawase .mail{
	display: block;
}
#kabu_otoiawase  .text_btn2 {padding:5px 10px 10px 10px; font-size: 140%;}
#kabu_otoiawase  .en {font-family: 'Oswald', sans-serif;}


/* footer
----------------------------------------------------------*/
footer{
	width:100%;
	border-collapse:collapse;
	border-top:1px solid #dcdcdc;
}
footer .in{
	padding:20px 20px;
	line-height:1.4em;
	font-size: 90%;
}

footer .text_btn2 {padding:5px 10px 10px 10px;}
footer .in .en {font-family: 'Oswald', sans-serif;}


.foot_navi li a{
	background-color: #5c5c5c;
	padding: 10px 20px;
	color: #fff;
	display: block;
	text-decoration: none;
	border-collapse: collapse;
	border-bottom: 1px solid #707070;
}
.foot_navi li a:after{content: " \f105";font-family: FontAwesome; float:right;}

.foot_navi li a:hover{
	background-color: #e0e0e0;
	color: #333;
}

.kabu_navi{
	display:table;
	table-layout: fixed;
	width:100%;
}
.kabu_navi li{
	display:table-cell;
	vertical-align:middle;
	border-collapse:collapse;
	border-right: 1px solid #5b82c9;
	text-align:center;
	font-size:80%;
	line-height:1.4em;
	background-color:#36c;
}
.kabu_navi li:last-child{/*最後の入れ子には線はつけない*/
    border-right:none;
}
.kabu_navi li i {font-size:150%;}
.kabu_navi a{color:#fff; text-decoration:none; padding:10px; display:block;}

.copy{
	text-align:center;
	padding:10px;
	font-size:80%;
	line-height:1.4em;
}

.security_img{
	display: block;
	width: 150px;
	height: 150px;
	margin: 0 auto 20px;
}