@charset "utf-8";
/* CSS Document */
/*　----　メディアクエリ設定は500行目以降　------*/
/************************************************
 リセット
************************************************ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
  overflow:scroll;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
 :focus {
  outline: 0;
}
 ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}
 table {
  border-collapse: collapse;
  border-spacing: 0;
}

/************************************************
 共通設定
************************************************ */
body {
	background-color: #fff;
    color: #000;
    font-family: "メイリオ","Meiryo","ＭＳ Ｐゴシック",Arial,Helvetica,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,sans-serif;
    font-size: 16px;
	line-height:1.8;
}
body *{
  box-sizing:border-box;
  word-wrap: break-word;
}
.clearfix:after {
content: "";
display: block;
clear: both;
}
.clear {
    clear: both;
}
a:link,
a:visited {
	color:#0080d0;
    text-decoration: none;
}
a:hover{
	color:#01b6ef;
	text-decoration:none;
	opacity:0.8;
}
a:hover img,
input:hover{
	opacity:0.8;
}
.fl_l {
	float: left;
}
.fl_r {
	float: right;
}

.btm10{margin-bottom:10px;}
.btm15{margin-bottom:15px;}
.btm20{margin-bottom:20px;}
.btm30{margin-bottom:30px;}
.btm40{margin-bottom:40px;}
.lft10{margin-left:10px;}
.lft15{margin-left:15px;}
.lft20{margin-left:20px;}
.lft30{margin-left:30px;}
.lft40{margin-left:40px;}
.rgt10{margin-right:10px;}
.rgt15{margin-right:15px;}
.rgt20{margin-right:20px;}
.rgt30{margin-right:30px;}
.rgt40{margin-right:40px;}
.top10{margin-top:10px;}
.top15{margin-top:15px;}
.top20{margin-top:20px;}
.top30{margin-top:30px;}
.top40{margin-top:40px;}



/* フォント
----------------------------------------------- */
.attention {
    color: #d00;
}
.fs10{font-size:72%;}
.fs11{font-size:79%;}
.fs12{font-size:86%;}
.fs13{font-size:93%;}
.fs14{font-size:100%;}
.fs15{font-size:108%;}
.fs16{font-size:115%;}
.fs17{font-size:122%;}
.fs18{font-size:129%;}
.fs19{font-size:136%;}
.fs20{font-size:143%;}
.fs21{font-size:150%;}
.fs22{font-size:158%;}
.fs23{font-size:165%;}
.fs24{font-size:172%;}
.fs25{font-size:179%;}
.fs27{font-size:193%;}
.fs28{font-size:200%;}

.nowrap{
	white-space: nowrap;
}
.break{
	word-break: break-all;
}
/* 行揃え
----------------------------------------------- */
.alignC {
    text-align: center;
}
.alignR {
    text-align: right;
}
.alignL {
    text-align: left;
}
.alignM{
	vertical-align: middle;
}

/* フォーム
----------------------------------------------- */
input,
button {
	outline: 0;
}
/* Firefox */
input::-moz-focus-inner,
button::-moz-focus-inner {
	border: 0;
}
select {
    border: solid 1px #d9d9d9;
	line-height:40px;
	height:40px;
}
input[type='text'],
input[type='password'],
input[type='email']{
    border: solid 1px #d9d9d9;
    padding: 8px 10px 6px 10px;
}
input[type='text'] {
	line-height:1;
}
.label{
	display: iline-block;
	vertical-align: middle;
	line-height:26px;
}
.label input[type="radio"],
.label input[type="checkbox"]{
	margin-right:8px;
	vertical-align: middle;
}
.check {
    display: inline-block;
    position: relative;
    margin-right: 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: button;
    appearance: button;
    width: 26px;
    height: 26px;
    border: 1px solid #999;
    vertical-align: middle;
	background-color:#fff;
}

.check:checked::after {
    position: absolute;
    content: "";
    top: 1px;
    left: 5px;
    width: 8px;
    height: 14px;
    border-right: 4px solid #005eae;
    border-bottom: 4px solid #005eae;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
input[type="radio"] {
    position: relative;
    -webkit-appearance: button;
    appearance: button;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    content: "";
    background-color: #FFFFFF;
    border: 1px solid #999999;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    -webkit-box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    vertical-align: middle;
    cursor: pointer;
}
input[type="radio"]:checked:after {
    display: block;
    position: absolute;
    top: 5px;
    left: 5px;
    content: "";
    width: 12px;
    height: 12px;
    background: #005eae;
    -webkit-border-radius: 12px;
    border-radius: 12px;
}
textarea{
	padding:7px 10px;
	border:solid 1px #ccc;
	width:100%;
}
.error,
.caution{
	color:#C70003;
}
.box40 {width: 40px;}
.box50 {width: 50px;}
.box60 {width: 60px;}
.box70 {width: 70px;}
.box80 {width: 80px;}
.box100 {width: 100px;}
.box120 {width: 120px;}
.box150 {width: 150px;}
.box180 {width: 180px;}
.box200 {width: 200px;}
.box220 {width: 220px;}
.box250 {width: 250px;}
.w20p{width:20%;}
.w30p{width:30%;}
.w40p{width:40%;}
.w50p{width:50%;}
.w60p{width:60%;}
.w70p{width:70%;}
.w80p{width:80%;}
.w100p{width:100%;}


/* フレーム
----------------------------------------------- */
#wrapper{
	overflow : hidden ;
}
.drawer-contents{
	padding-top:150px;
}
.drawer-contents>div.inner{
	padding-bottom:100px;
}
.inner{
	max-width:980px;
	width:100%;
	margin:0 auto;
}
.top_main{
	width:100%;
}
.top_main div.fl_l{
	width:75%;
}
.top_main div.fl_r{
	width:23%;
}
.col_one,
.col_two{
	min-height:400px;
}
.col_two>div.fl_l{
	width:73%;
}
.col_two>div.fl_r{
	width:22%;
}
section{
	width:100%;
	padding:0 0 40px 0;
}
.first_read{
	margin:0 auto 30px auto;
}
.border{
	border:solid 1px #ccc;
}
/* タイトル
----------------------------------------------- */
h1.ttl{
	color:#000;
	font-size:180%;
	margin:20px 0;
	font-weight:normal;
	line-height:40px;
}
.page_ttl{
	clear:both;
	font-size:154%;
	padding:10px 0;
	margin-bottom:20px;
	line-height:1.4;
}
.section_ttl {
	position:relative;
	clear:both;
	font-size:119%;
	margin-bottom:20px;
	font-weight:bold;
	line-height:1;
	border-left:solid 5px #005eae;
	padding:5px 0 0 15px;
}
.topic_ttl {
	clear:both;
	color:#555;
	font-size:143%;
	font-weight:normal;
	border-bottom:solid 1px #005eae;
	margin-bottom:15px;
	padding:10px 0 0 15px;
}
.section_ttl span{
	position:absolute;
	top:0;
	right:0;
}
.top_main h2.section_ttl a{
	margin-right:10px;
}
.section_ttl a{
	border:solid 1px #ccc;
	background:url(../img/common/icon_arrow_r.png) no-repeat 8px center;
	background-size:12px 12px;
	background-color:#f6f4f0;
	padding:10px 10px 10px 25px;
	border-radius: 4px;
	color:#000;
	display: inline-block;
	text-align: center;
	font-size:68%;
	font-weight:normal;
}
.block_ttl{
	font-size:115%;
	margin-bottom:10px;
}
/* ぱんくず
----------------------------------------------- */
.path{
	max-width:980px;
	margin:20px auto;
	font-size:86%;
}
.path a{
	color:#0080d0;
}
.path a:hover{
	text-decoration:underline;
}

/* ==============================================
 ヘッダー
=============================================== */
.defs{
  display: none;
}
header {
	z-index:99;
	width: 100%;
	position: fixed;
	top: 0;
	left:0;
	background-color:#fff;
	color:#0080d0;
}
.logo {
	display:block;
    float: left;
	padding:20px 0 12px 0;
	max-width:300px;
}
.icon-logo{
	-webkit-font-smoothing: antialiased;
	font-size:600%;
	color:#fff;
}
.logo a{
	display: block;
	width:100%;
	height:100%;
}
.logo img{
	width:100%;
	max-width:300px;
}
.header_link{
	float:right;
	margin-top:25px;
	text-align:right;
	display: table;
}
.header_link a{
	font-size:86%;
	display:inline-block;
	line-height:37px;
	color:#005eae;
	margin-right:5px;
	padding:0 12px 0 28px;
}
.header_link a:nth-child(1),
.header_link a:nth-child(2){
	border-radius: 4px;
	border:solid 1px #005eae;
}

.header_link a:hover{
	background-color:#aaa;
}
.header_link a.download{
	background:url(../img/common/icon_pamph.png) no-repeat 5px center;
	background-size:20px 20px;
}
.header_link a.inquiry{
	background:url(../img/common/icon_mail.png) no-repeat 5px center;
	background-size:20px 20px;
}
.header_link a.lang_en{
	background:url(../img/common/icon_arrow_r.png) no-repeat 10px center;
	background-color:#f4f2f2;
	background-size:10px 10px;
	margin:0 10px;
	padding:0 7px 0 25px;
}
.header_link a.lang_ch{
	background:url(../img/common/icon_arrow_r.png) no-repeat 10px center;
	background-color:#f4f2f2;
	background-size:10px 10px;
	margin-right:0px;
	padding:0 7px 0 25px;
}
/*----Android 4.1.1対策----*/
body.android .drawer-hamburger{
	padding-bottom:40px;
}
body.android .drawer-hamburger span.text {
    top: 42px;
}


/* ==============================================
 フッター
=============================================== */
footer{
	clear:both;
	width:100%;
	background-color:#ededed;
	padding:40px 0 0 0;
	font-size:92%;
}
footer div.inner{
	position:relative;
}
footer div.inner:after{
content: "";
display: block;
clear: both;
}
footer p{
	text-align: center;
	background-color:#005eae;
	color:#fff;
	line-height:46px;
}
a.return_top{
	display: none;
	width:60px;
	height:60px;
	position:fixed;
	bottom:220px;
	right:20px;
	text-indent:-9999px;
	text-align:center;
	background:url(../img/common/icon_arrow_t.png) no-repeat center center;
	background-size:14px 14px;
	background-color:#ededed;
	z-index:12;
}
body.inquiry a.return_top{
	bottom:80px;
}
footer ul.fl_l{
	width:55%;
	content: "";
	display: block;
	clear: both;
	padding-bottom:40px;
}
footer ul.fl_l:after{
content: "";
display: block;
clear: both;
}

footer ul.fl_l li{
	display: inline-block;
	width:30%;
	line-height:18px;
	vertical-align: middle;
}
footer ul.fl_l li a{
	color:#000;
	font-size:86%;
	text-align: left;
	display: inline-block;
}
footer div.fl_r{
	width:45%;
}
footer div.fl_r a{
	width:48%;
	color:#fff;
	display:inline-block;
	line-height:63px;
	height:63px;
	padding:0 15px 0 35px;
	text-align:center;
}
footer div.fl_r a.download{
	background:url(../img/common/icon_pamph_w.png) no-repeat 20px center;
	background-color:#005eae;
	background-size:25px 25px;
	margin-right:4%;
}
footer div.fl_r a.inquiry{
	background:url(../img/common/icon_mail_w.png) no-repeat 20px center;
	background-color:#005eae;
	background-size:25px 25px;
}

/* ==============================================
 ナビ
=============================================== */
.global_navi{
	clear:both;
	background-color:#fff;
	border-bottom:solid 1px #005eae;
}
.global_navi ul{
	max-width:980px;
	width:100%;
	margin:0 auto;
	letter-spacing: -0.4em;
}
.global_navi li{
	letter-spacing: normal;
	display: inline-block;;
	width:17%;
	height:50px;
	text-align:center;
	vertical-align:middle;
}
.global_navi li:last-child{
	border-right:none;
}
.global_navi li:first-child,
.global_navi li:last-child{
	width:16%;
}
.global_navi li a{
	width:100%;
	height:100%;
	display: block;
	color:#005eae;
	padding:10px 0;
	vertical-align:middle;
}
.global_navi li.home{
	background:url(../img/common/icon_home.png) no-repeat center center;
	background-size:25px 25px;
	text-align:center;
	text-indent:-9999px;
}
.global_navi li.home:hover,
body.home .global_navi li.home{
	background:url(../img/common/icon_home_w.png) no-repeat center center;
	background-color:#005eae;
	background-size:24px 24px;
}
.global_navi li:hover,
body.products .global_navi li.products,
body.develop .global_navi li.develop,
body.company .global_navi li.company,
body.ir .global_navi li.ir,
body.sustainability .global_navi li.sustainability,
body.recruit .global_navi li.recruit{
	background-color:#005eae;
}
.global_navi li:hover a,
body.products .global_navi li.products a,
body.develop .global_navi li.develop a,
body.company .global_navi li.company a,
body.ir .global_navi li.ir a,
body.sustainability .global_navi li.sustainability a,
body.recruit .global_navi li.recruit a{
	color:#fff;
}


/*---通常テーブル設定---*/
.tbl_common{
	width:100%;
}
.tbl_common.auto{
	width:auto;
}
.tbl_common th{
	font-weight: normal;
	background-color:#f4f2f2;
}
.tbl_common th,
.tbl_common td{
	text-align: left;
	padding:7px;
	border:solid 1px #ccc;
}
/*---スペック表---*/
.tbl_scroll_block table th{
	font-weight: normal;
	background-color:#f4f2f2;
}
.tbl_scroll_block table th,
.tbl_scroll_block table td{
	text-align: center;
	vertical-align: middle;
	word-break: break-all;
	line-height:1.4;
	padding:12px 5px;
	border:solid 1px #ccc;
}
.tbl_scroll_block table td.target{
	background-color:#ffdbdb;
}
.tbl_scroll_block table td.nontarget{
	background-color:#B5DDFF;
}
.tbl_scroll_block table td.caution{
	background-color:#fff8db;
}

.tbl_scroll_block ul,
.tbl_scroll_block ol{
	margin-left:20px;
}
.tbl_scroll_block ul li{
	list-style-type: disc;
	margin:0 0 10px 20px;
}
.tbl_scroll_block ol li{
	list-style-type:decimal;
	margin:0 0 10px 20px;
}
.tbl_scroll_block dl dt{
	background-color:#efefef;
	padding:10px 15px;
}
.tbl_scroll_block dl dd{
	padding:20px 30px;
	margin-bottom:20px;
}
.tbl_scroll_block dl dd p{
	border-bottom:dotted 1px #ccc;
	padding:10px 0;
	margin-bottom:5px;
}
.tbl_scroll_block p img{
	margin:10px;
}

/**************************************************************************************************
 ▽▽　ここからメディアクエリ　▽▽
************************************************************************************************** */
.sp{
	display: none;
}
/* ==============================================
 共通設定の980px以下
=============================================== */

@media only screen and (max-width : 980px) {
	header{
		border-bottom:solid 1px #1d70b7;
	}
	.drawer-contents{
		padding-top:130px;
	}
	.drawer-contents>div.inner{
		padding-bottom:40px;
	}
	.global_navi ul{
	width:100%;
	}
	.global_navi li a{
		font-size:14px;
	}
	.inner{
		max-width:980px;
		width:100%;
	}
}
/* ==============================================
 共通設定の860px以下
=============================================== */
@media only screen and (max-width : 860px) {
	.logo {
		max-width:240px;
	}
}
/* ==============================================
 共通設定の768px以下
=============================================== */
@media only screen and (max-width : 768px) {
	  .drawer-contents{
		  padding:74px 10px 0px 10px;
	  }
	  .inner{
		  max-width:768px;
	  }
	  .top_main div.fl_l{
		  width:100%;
	  }
	  .top_main div.fl_r{
		  width:100%;
	  }
	.col_two>div.fl_l{
		width:100%;
	}
	.col_two>div.fl_r{
		width:100%;
	}

	header {
		height:auto;
	}
	.logo{
		padding:0;
	}
	.logo a{
		padding:10px;
	}
	.logo img{
		max-width:220px;
	}
	.header_link{
		display:none;
	}
	.drawer-hamburger{
		display:block;
	}

footer div.fl_r,
footer ul.fl_l{
	float:none;
	width:100%;
	margin-bottom:20px;
}
	footer ul.fl_l li{
		width:32%;
		padding-left:15px;
		margin-bottom:10px;
	}
	footer ul.fl_l li{
		width:48%;
	}
	.global_navi ul{
		display:none;
	}
	h2.section_ttl a {
	text-indent: -9999px;
	border-radius: 0;
	background: url(../img/common/icon_list_w.png) no-repeat center center;
	background-size: 40px 40px;
	background-color: transparent;
	border:solid 1px #fff;
	width: 40px;
	height: 40px;
}
	
}

/* ==============================================
 共通設定の414px以下
=============================================== */
@media only screen and (max-width : 414px) {

/*-------デバイス幅に合わせて縦並びにする-----------*/

	.tbl_responsive_block tr{
		display: block;
		margin-bottom:10px;
	}
	.tbl_responsive_block .tbl_common th{
		display: block;
		width:100%;
	}
	.tbl_responsive_block .tbl_common td{
		display: list-item;
		border: none;
		width:100%;
		text-align:left;
		list-style-type:none;
 	}
.tbl_scroll_block p img{
	max-width:100%;
	display: block;
	width:100%;
	height:auto;
	margin:0;
	padding:10px;
}

}




/* ==============================================
 共通設定の320px以下
=============================================== */
@media only screen and (max-width : 320px) {
	  .inner{
		  max-width:320px;
	  }
	footer ul.fl_l li{
		font-size:86%;
	}
}
