@charset "UTF-8";

<style type="text/css">
#slideshow {
   position: relative;
   width:  640px; /* 画像の横幅に合わせて記述 */
   height: 270px; /* 画像の高さに合わせて記述 */
}
#slideshow img {
   position: absolute;
   top: 0;
   left:100px;
   z-index: 8;
   opacity: 0.0;
}
#slideshow img.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow img.last-active {
   z-index: 9;
}
</style>

/*-------------------------------------------------
    common
=================================================*/


.box2 {
    padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: bold;
    color: #6091d3;/*文字色*/
    background: #FFF;
    border: solid 3px #6091d3;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box2 p {
    margin: 0; 
    padding: 0;
}

  
a img{
 text-decoration: none;
 border: none;
}
  
a:hover img{
  filter: alpha(opacity=50);
  -moz-opacity:0.50;
  opacity:0.50;
}

body {
    font-family: sans-serif;
    font-size: 86%＼9;
    color: #333;
	line-height: 1.8;
	background-color: #FFF;
	text-align: center;
}

* html body {
	font-family: "ＭＳ Ｐゴシック", sans-serif;
	vertical-align: baseline;
	text-align: center;
} /* for lte ie6 */

*:first-child+html body {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
} /* for ie7 */

html>/**/body {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
} /* for ie8 */

body:not(:target) {
    font-family: Verdana, Arial, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif＼9;
} /* for ie9 */

html:not(:target) body {
	font-size: 14px;
	font-family: Hiragino Kaku Gothic Pro, "ヒラギノ角ゴ Pro W6", Osaka, "ＭＳ Ｐゴシック", sans-serif;
} /* for modern browser not ie8 */

::-moz-selection {
    background: #6998d0;
    color: #FFF;
    text-shadow: none;
}

::selection {
    background: #6998d0;
    color: #FFF;
    text-shadow: none;
}

/* リンク
------------------------------------------*/
a{
	color: #6998d0;
	text-decoration: none;
}

a:hover{
	color: #b9c5df;
}



/* 共通class
------------------------------------------*/
.clearfix:after {
	content: "";
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.clearfix {
	display: inline-block;
}
/* hide macie ￥*/
*html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

.clear {
	clear: both;
	height: 0;
}

/*フォント*/
.fw_b {
	font-weight: bold;
}
.fs_11 {
	font-size: 85%;
}
.fs_14 {
	font-size: 107%;
}
.fs_16 {
	font-size: 122%;
}
.fs_18 {
	font-size: 136%;
}
.fs_48 {
	font-size: 364%;
}
.red {
	color: #a21d1d;
}

sup {
	font-size: 9px;
	vertical-align: super;
	line-height: 1;
}

.quotation {
    background: #DDD;
    font-size: 85%;
    position: relative;
    padding: 25px 20px 20px 100px;
    text-align: left;
	margin-top: 1.5em;
}
.quotation q {
	display: block;
	margin-bottom: 1em;
}
.quotation h4:before, .quotation q:before {
    color: #AAA;
    content: "“";
    font-size: 130px;
    font-weight: bold;
    left: 20px;
    line-height: 1;
    position: absolute;
    top: 20px;
}

#com1{
background:url(/imgs/car_back0.png) 263px 0 no-repeat;}

#com2{
background:url(/imgs/company.png) right center no-repeat;}

.com_table{
width:930px;
border-collapse:collapse;
margin:20px 0;}

#com2 .com_table{
width:600px;
}

.com_table th{
width:250px;
background:#f4f5f0;
border:1px solid #CCC;
padding:10px 0;
font-size:12px;
color:#333;
font-weight:bold;
line-height:2em;
}

.com_table td{
border:1px solid #CCC;
padding:10px;
text-align: left;
font-size:12px;
color:#333;
}


/*-------------------------------------------------
    header
=================================================*/

header {
	width: 100%;
	height: 100px;
	padding-top: ;
	border-bottom: 1px #AAA solid;
}header > .inner {
	width: 940px;
	position: relative;
	margin: 0 auto;
	padding: 0 5px;
}

header .logo {
	float: left;
	padding-top: 25px;
}

#gnav {
	float: cetner;
	padding-top: 35px;
}

#gnav li {
	display: inline-block;
	/display: inline;
	/zoom: 1;
	height: 3px;
	line-height: 1;
	padding-right: 5px;
	margin-right: 5px;
}

#gnav li:last-child {
	padding-right: 0;
	margin-right: 0;
	background: none;
}

#gnav li a {
}





/*-------------------------------------------------
    article
=================================================*/

article {
	width: 100%;
	position: relative;
	overflow: hidden;
}article > .inner {
	width: 960px;
	margin: 0 auto;
}




/* トップページ
------------------------------------------*/

#home article .bg {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -450px;
	z-index: -1;
	user-select: none;
	-moz-user-select: none; /* Firefox */
	-webkit-user-select: none; /* Safari、Chromeなど */
	-ms-user-select: none; /* IE10かららしい */
}

#home #mainvisual {
	padding: 400px 10px 0;
	margin-bottom: 100px;
}

#home #mainvisual h1 {
	padding-top: 30px;
	padding-bottom: 16px;
	font-size: 182%;
	font-weight: bold;
	color: #4a4a4a;
	letter-spacing: 0.2em;
	background: url(http://otagateway.co.jp/img/img_separate.png) center bottom no-repeat;
}
#home #mainvisual p {
	margin-top: 10px;
	font-size: 107%;
	color: #4a4a4a;
}

/* パンくず
------------------------------------------*/

.global .breadcrumbs {
	width: 100%;
	background: #AAA;
	color: #DDD;
	font-size: 77%;
	letter-spacing: 0.1em;
	text-align: left;
	padding: 3px 0;
}
.global .breadcrumbs .inner {
	width: 940px;
	margin: 0 auto;
	padding: 0 10px;
}
.global .breadcrumbs a {
	color: #DDD;
}.global .breadcrumbs a:hover {
	color: #BBB;
}
.global .breadcrumbs .current {
	color: #FFF;
}


/*-------------------------------------------------
    staff page
=================================================*/

#contents{
border-bottom:1px solid #ddd;
border-top:1px solid #ddd;
background:url(../images/contents_bg_naka.gif) 0 0 repeat-y;
padding:0!important;}

#message_box{
padding:15px 20px;}



/*-------------------------------------------------
    article(contents)
=================================================*/

article section.contents {
	margin: 0 auto 20px;
	width: 940px;
}

/* ブロックコンテンツ
------------------------------------------*/

article section.block_contents {
	margin: 0 auto 30px;
	text-align: left;
	width: 950px;
	height: 700px;
}
article section.block_contents a {
	display: block;
	cursor: pointer;
}
article .block {
	padding: 4px 5px 0;
	position: relative;
}article .contents .block .inner {
	padding: 0;
	width: auto;
}
article .left {
	float: left;
}
article .right {
	float: right;
}
article .clm1 {
	width: 300px;
	height: 300px;
	background: url(http://otagateway.co.jp/img/bg_block-1clm.png) center 0 no-repeat;
	text-align: center;
}
article .clm1 .inner {
	width: 300px;
	height: 250px;
}
.clm1.left {
	margin-right: 10px;
}


article #about .inner { background: url(/imgs/top_company.jpg) center 0 no-repeat;}
article #achieve .inner { background: url(/imgs/top_achieve.jpg) center 0 no-repeat;}
article #company .inner { background: url(/imgs/top_company.jpg) center 0 no-repeat;}
article #skill .inner { background: url(/imgs/top_skill.jpg) center 0 no-repeat;}
article #hr .inner { background: url(/imgs/top_hr.jpg)) center 0 no-repeat;}
article #access .inner { background: url(/imgs/top_access.jpg)) center 0 no-repeat;}

article #p001 .inner { background: url(/imgs/hr_ttl.jpg) 0 0 no-repeat;}
article #p002 .inner { background: url(/imgs/hr_president.jpg) 0 0 no-repeat;}
article #p003 .inner { background: url(/imgs/hr_staff.jpg) 0 0 no-repeat;}


article .clm1 h2 {
	padding-top: 60px;
}
article .clm1 p {
	font-size: 77%;
	color: #FFF;
	margin-top: 28px;
}

article .clm2 {
	width: 620px;
	height: 250px;
}

article #product_slider, #product .clm2 .inner{
	width: 620px;
	height: 250px;
	overflow: hidden;
}
article .contents .item {
	float: left;
	width: 620px;
	height: 300px;
}
article .contents .item .inner {
	width: 620px;
	height: 250px;
}

article #product_slider h2, #product .clm2 h2{
	padding: 120px 0 0 20px;
	line-height: 1;
	font-size: 24px;
	color: #000;
	letter-spacing: 0.1em;
}
article #product_slider p.patent, #product .clm2 p.patent{
	margin: 10px 0 0 20px;
	padding: 4px 10px 3px;
	line-height: 1;
	font-size: 10px;
	background: #777;
	opacity: 0.8;
	color: #FFF;
	display: inline-block;
	/display: inline;
	/zoom: 1;
}
article #product_slider p.about, #product .clm2 p.about{
	margin: 15px 0 0 20px;
	font-size: 12px;
	color: #000;
	line-height: 1.6;
}

.product_slider_nav {
	position: absolute;
	top: 115px;
}
#product_slider_prev { left: -9px;}
#product_slider_next { right: -8px;}




/* 共通
------------------------------------------*/

article .contents .inner {
	width: 900px;
	padding: 0 20px;
}
article .sec_ttl {
	margin-bottom: 50px;
	font-weight: bold;
}
article .catch {
	margin-bottom: 1em;
	font-weight: bold;
}
article .text + .catch {
    margin-top: 3em;
}
article .text + dl {
    margin-top: 3em;
}
article .text {
}
article .text > ul {
	margin-top: 1em;
	list-style: disc inside;
}
article .small {
	margin-bottom: 2em;
	font-size: 85%;
}
article .note {
	font-size: 85%;
}
article ul.note {
	background-color: #EEE;
	padding: 20px;
	text-align: left;
	margin: 0 auto;
	margin-bottom: 2em;
	width: 600px;
}
article .note li {
	padding-left: 1em;
	text-indent: -1em;
}


article .jigyo img {
	float:left;
	margin-right:20px;
}


/* トピックス
------------------------------------------*/

article #topics li {
	margin-bottom: 1em;
	text-align: left;
}
article #topics .cat {
	margin: 0 40px 0 10px;
	padding: 4px 0 2px;
	width: 100px;
	font-size: 14px;
	line-height: 1;
	background: #DDD;
	color: #666;
	vertical-align: text-top;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	text-align: center;
}

#topics .data {
	width: 320px;
	margin: 26px auto;
}
#topics .data p {
	margin-bottom: 2em;
}


/* コラム
------------------------------------------*/

#column .block {
	text-align: left;
}
#column article .clm1 .inner {
	width: 260px;
	height: 230px;
	overflow: hidden;
	position: absolute;
	bottom: 65px;
	left: 25px;
	background: url(http://otagateway.co.jp/img/column_defimg.png) center 15px no-repeat;
}
#column article .clm1 h2 {
    padding-top: 145px;
	font-weight: bold;
}
#column article .clm1 a {
    color: #000;
}
#column article .clm1 p {
	color: #000;
	margin-top: 0;
}
#column article .clm1 p.date {
	font-weight: bold;
	color: #888;
}

#column div.date {
	width: 320px;
	margin: 26px auto;
}
#column div.data p {
	margin-bottom: 2em;
}


/* 下層ページ（共通）
------------------------------------------*/

.global article section.contents {
	margin-bottom: 80px;
}

.contents .page_name {
	padding-top: 100px;
	padding-bottom: 36px;
	font-size: 136%;
	font-weight: bold;
	line-height: 1;
	letter-spacing: 0.2em;
	color: #AAA;
}
.contents h1 {
	padding-bottom: 30px;
	font-size: 136%;
	font-weight: bold;
	letter-spacing: 0.2em;
	background: url(http://otagateway.co.jp/img/img_separate.png) center bottom no-repeat;
}
.contents h1 span {
	font-size: 85%;
	font-weight: bold;
}
.contents h1 + .text {
	margin-top: 26px;
}
.contents .text + .text {
	margin-top: 1.5em;
}

.global article section.block_contents {
	margin: 0 auto 10px;
	text-align: left;
	width: 640px;
}


/* ソーシャルブックマーク
------------------------------------------*/

.bookmark {
    overflow: hidden;
    height: 22px;
    margin-top: 1em;
}
#topics .data .bookmark, #column .bookmark {
	width: 320px;
	margin: 0 auto;
}
#topics .bookmark {
	margin: 80px auto 0;
}
.bookmark .facebook {
    width: 107px;
    float: left;
    margin-right: 5px;
}
.bookmark .twitter {
    width: 95px;
    float: left;
    margin-right: 5px;
}
.bookmark .google {
    width: 90px;
    float: left;
    margin-right: 5px;
}


/* プロダクト
------------------------------------------*/

#product .movie h3 {
	margin-bottom: 1em;
}
#product .movie iframe {
	margin-bottom: 50px;
}
#product .detail {
	padding: 0 0 0 300px;
	width: 640px;
	text-align: left;
}

#product .detail#p001 { background: url(/sagyo/p1.jpg) left top no-repeat; min-height: 288px;}
#product .detail#p002 { background: url(/sagyo/p2.jpg) left top no-repeat; min-height: 288px;}
#product .detail#p003 { background: url(/sagyo/p3.jpg) left top no-repeat; min-height: 288px;}
#product .detail#p004 { background: url(/sagyo/p4.jpg) left top no-repeat; min-height: 288px;}


#product .detail h2 {
	padding: 110px 0 0 0;
	line-height: 1;
	font-size: 24px;
	color: #000;
	letter-spacing: 0.1em;
}


#product .detail#p001 h2 { background: url(/imgs/product_ttl_p001.png) left 10px no-repeat;}
#product .detail#p002 h2 { background: url(/imgs/product_ttl_p002.png) left 10px no-repeat;}
#product .detail#p003 h2 { background: url(/imgs/product_ttl_p003.png) left 10px no-repeat;}
#product .detail#p004 h2 { background: url(/imgs/product_ttl_p004.png) left 10px no-repeat;}

#product .detail p.patent {
	margin: 10px 0 0 0;
	padding: 4px 10px 3px;
	line-height: 1;
	font-size: 10px;
	background: #AAA;
	color: #FFF;
	display: inline-block;
}
#product .detail p.about {
	margin: 3em 0 2em 0;
}

#product .copertion {
margin-top: 2em;
padding-left: 130px;
font-size: 10px;
color: #888;
}
#product .copertion.affrc { background: url(http://otagateway.co.jp/img/img_affrc-logo.png) 0 center no-repeat;}

#product .detail h3 {
	margin-top: 3em;
}
#product .detail .text {
	margin-top: 1em;
	font-size: 12px;
}
#product .detail .em {
	font-weight: bold;
}
#product .detail .award {
	background: url(http://otagateway.co.jp/img/ico_badge.png) left center no-repeat;
	padding-left: 25px;
	line-height: 20px;
	display: inline-block;
	font-weight: bold;
	color: #b7a612;
}
#product .detail .award:hover {
	text-decoration: underline;
}
#product .detail .data {
	margin-top: 1em;
	letter-spacing: -.40em;
}
#product .detail .data li {
	padding: 6px;
	margin-right: 20px;
	border: 1px #CCC solid;
	width: 126px;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	letter-spacing: -.40em;
}
#product .detail .data li a:hover {
	cursor: url(/img/ico_zoom.png), pointer;
	opacity: 0.6;
}



/* 実績
------------------------------------------*/

#achieve .movie h3 {
	margin-bottom: 1em;
}
#achieve .movie iframe {
	margin-bottom: 50px;
}
#achieve .detail {
	padding: 0 0 0 300px;
	width: 640px;
	text-align: left;
}

#achieve .access {
	padding: 0 0 0 50px;
	width: 640px;
	text-align: left;
}

#achieve .detail#p001 { background: url(/imgs/museum.png) left top no-repeat; min-height: 20px;}
#achieve .detail#p002 { background: url(/imgs/kokonoe.png) left top no-repeat; min-height: 20px;}
#achieve .detail#p003 { background: url(/imgs/usa.png) left top no-repeat; min-height: 20px;}
#achieve .detail#p004 { background: url(/imgs/oasis.png) left top no-repeat; min-height: 20px;}
#achieve .detail#p005 { background: url(/imgs/museum.png) 0 0 no-repeat;}


#achieve .detail h2 {
	padding: 100px 0 0 0;
	line-height: 1;
	font-size: 24px;
	color: #000;
	letter-spacing: 0.1em;
}

#achieve .access h2 {
	padding: 50px 0 0 0;
	line-height: 1;
	font-size: 24px;
	color: #000;
	letter-spacing: 0.1em;
}


#achieve .detail#p001 h2 { background: url(/imgs/achieve_ttl_p001.png) left 5px no-repeat;}
#achieve .detail#p002 h2 { background: url(/imgs/achieve_ttl_p002.png) left 5px no-repeat;}
#achieve .detail#p003 h2 { background: url(/imgs/achieve_ttl_p003.png) left 5px no-repeat;}
#achieve .detail#p004 h2 { background: url(/imgs/achieve_ttl_p004.png) left 5px no-repeat;}
#achieve .detail#p005 h2 { background: url(/imgs/nakatake.png) left 5px no-repeat;}


#achieve .detail p.patent {
	margin: 10px 0 0 0;
	padding: 4px 10px 3px;
	line-height: 1;
	font-size: 10px;
	background: #AAA;
	color: #FFF;
	display: inline-block;
}
#achieve .detail p.about {
	margin: 3em 0 2em 0;
}

#achieve .copertion {
margin-top: 2em;
padding-left: 130px;
font-size: 10px;
color: #888;
}
#achieve .copertion.affrc { background: url(http://otagateway.co.jp/img/img_affrc-logo.png) 0 center no-repeat;}

#achieve .detail h3 {
	margin-top: 3em;
}
#achieve .detail .text {
	margin-top: 1em;
	font-size: 12px;
}
#achieve .detail .em {
	font-weight: bold;
}
#achieve .detail .award {
	background: url(http://otagateway.co.jp/img/ico_badge.png) left center no-repeat;
	padding-left: 25px;
	line-height: 20px;
	display: inline-block;
	font-weight: bold;
	color: #b7a612;
}
#achieve .detail .award:hover {
	text-decoration: underline;
}
#achieve .detail .data {
	margin-top: 1em;
	letter-spacing: -.40em;
}
#achieve .detail .data li {
	padding: 6px;
	margin-right: 20px;
	border: 1px #CCC solid;
	width: 126px;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	letter-spacing: -.40em;
}
#achieve .detail .data li a:hover {
	cursor: url(/img/ico_zoom.png), pointer;
	opacity: 0.6;
}

#jisseki_box{
padding:10px 20px;}

#jisseki_table{
width:930px;
border-collapse:collapse;
}

#jisseki_table th{
width:25%;
background:#f0f0f0;
border:1px solid #CCC;
padding:10px 0;
font-size:12px;
color:#333;
font-weight:bold;
line-height:2em;
}

#jisseki_table td{
border:1px solid #CCC;
padding:10px;
font-size:12px;
color:#333;
}

/*2段組
-----------------------------------*/
#achieve .figureBlock{
	float:left;
	display:inline;
	padding-right:18px;
	padding-top: 55px;
}
*html achieve .figureBlock{/*IE6用*/
	padding-right:0;
}
#achieve .txtBlock{
	overflow:hidden;
	width: 650px;
	/zoom:1;
}
#achieve .sentence p{
	margin-bottom:22px;
}
.tit_line{
	clear:both;
	color:#487bc1;
	font-size:120%;
	font-weight:bold;
	background:url("/imgs/bg_tit_line.gif") no-repeat 0 100%;
	padding-bottom:4px;
	margin:43px 0 14px;
}


/* お問い合わせ
------------------------------------------*/

#mailform {
	width: 640px;
	margin: 0 auto;
}
#mailform dl {
	width: 100%;
	text-align: left;
}
#mailform dt {
	margin-bottom: 1em;
	font-weight: bold;
}
#mailform dt .must {
	padding: 3px 10px 2px;
	line-height: 1;
	font-size: 10px;
	background: #6998d0;
	opacity: 0.6;
	color: #FFF;
}
#mailform dd {
	margin-bottom: 30px;
}
#mailform input[type=text] {
	width: 100%;
}
#mailform textarea {
	width: 100%;
	height: 120px;
}
#mailform .text {
	text-align: center;
	margin: 30px 0 0;
	font-size: 12px;
}
#mailform .button {
	text-align: center;
	margin: 30px 0 0;
}
input[type=submit],input[type=reset] {
	cursor: pointer;
}
input[type=submit] {
	height: 50px;
	width: 197px;
	border: none;
	background: url(/img/btn_contact_send.png) 0 0 no-repeat;
}


/*-------------------------------------------------
    footer
=================================================*/

footer {
	width: 100%;
	background: #f4f5f0;
	color: #989891;
}footer > .inner {
	width: 940px;
	position: relative;
	margin: 0 auto;
	padding: 50px 0 30px;
}
footer .contents {
	text-align: left;
	margin-bottom: 50px;
}
footer .left {
	float: left;
}
footer .right {
	float: right;
}
footer .contents h3 {
	margin-bottom: 1em;
}

#copyright {
	font-family: 'Arial';
	font-size: 10px;
	clear: both;
}


/* pageTop
------------------------------------------*/
#pageTop{
	position: fixed;
	text-align: right;
	clear: both;
	right: 20px;
	bottom: 90px;
	z-index: 13;
}

#pageTop a {
	display: block;
	opacity:0.6;
	float: right;
}

#pageTop a:hover {
	opacity:1;	
}