@charset "UTF-8";


.harerun {
    vertical-align: baseline;
    margin-left: 40px;
    padding-right:40px;
    width:125px;
}

.titlepic {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:600px;
}

.jrapic {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:400px;
}


table.downl {
    width:600px;
    margin-bottom:1em;
    border-collapse:collapse;
    border:1px solid #ddd;
}

th.downl {
    padding:0px;
    text-align:center;
    vertical-align:middle;
    border:1px solid #ddd;
    background:#f5f5ff;
}


th.downl:hover {
background-color: #BBBBFF;
}


td.downl {
    padding:20px;
    text-align:center;
    border:1px solid #ddd;
}


div.downl {
    width:600px;
    padding:0px;
    border:1px solid #ddf;
}



.atmenu:hover {
    color:#f15500;
}

.atmenu a{
 text-decoration: none;
}

.atmenu li {
  position: relative;
}
.atmenu li::after,
.atmenu li::before {
  display: block;
  content: '';
  position: absolute;
}
.atmenu li::after {
  top: 8px;
  left: -1em;
  width: 6px;
  height: 6px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
}
.atmenu li::before {
  top: 11px;
  left: -1.025em;
  width: 8px;
  height: 1px;
 background-color: #666;
}


a.menutitle {
display: block;
  text-decoration: none;
  text-align: center;
    color: black;
  font-weight: bold; 
}




.pop a:hover{
        position: relative;
        top: 0px; left: 0px;
}


.expop {
  position: absolute;
  top:20px; left:-250px;
  display: none;
  padding: 5px;
  width: 300px;
  font-weight: bold;
  text-decoration: none;
  color: #000000;
  background-color: #aadd88;

  border-top:white solid 20px;
  border-right:#aadd88 solid 10px;
  opacity:0.85;
  z-index: 0;
}


div:hover#subnu {
    width:100px;
    padding:0px;
    border:1px solid #ddf;
}




.exelem.table {
/*  width: 400; */
/*  height: 300; */
  border: 1px #000000 solid;
}

.exelem td {
  border: 1px #000000 solid;
  font-size: small;
}

.exelem th {
  border: 1px #000000 solid;
}

td.extitle {
  width: 80px;
  font-size: small;
/*	font: bold 15px; */
	color: #000000;
	text-align: center;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: left;
	padding: 6px 6px 6px 12px;
	background: #f0f8ff;
}


td.exexplain {
	color: #000000;
	text-align: center;
	letter-spacing: 2px;
	/* text-transform: uppercase; */
	text-align: left;
	padding: 6px 6px 6px 12px;
	background: #ffffff;
}



.summary {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:550px;
	background-color: #f0f8ff;
	list-style-position: outside;
	list-style-type: none;
	padding: 0.5em 0.8em 0.8em 0.5em;
    line-height: 1.3em; 
}


.howtouse {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:700px;
	background-color: #f0f8ff;
	list-style-position: outside;
	list-style-type: none;
	padding: 0.5em 0.8em 0.8em 0.5em;
    line-height: 1.3em; 
}


ul.refpaper {
  margin: 0.6em;
  margin-left: 1.5em; 
  margin-right: 1.5em; 
  list-style-image: url(../images/icon_book.gif);
}

li.refpaper {
 margin-bottom: 0.6em; 
}

a.refpaper {
  text-decoration:none;
  color: black;
}

ul.explain {
 margin: 0.6em;
 margin-left: 1.5em; 
 margin-right: 1.5em; 

}

li.explain {
 margin-bottom: 0.6em; 
}


div.tabbox {
  margin: 15px;
  padding: 1px;

}


div.figmenu {
  border-style: dotted;
  border-width: 1px;
  margin-left: 0.1em;
  margin-right: 0.1em;
  margin-top: 0.4em;
  margin-bottom: 0.4em;
  border-color: #80888d;
}



p.tabs { margin: 0px; padding: 0px; }
p.tabs a {
   display: block; width: 10em; float: left;
   margin: 0px 1px 0px 0px; padding: 3px;
   text-align: center;
   border-radius: 12px 12px 0px 0px;
   text-decoration: none;
}

/* tab color */
p.tabs a.tab1 { background-color: #d0d8ef; color: blue; }
p.tabs a.tab2 { background-color: #d0d8ef; color: blue; }
p.tabs a.tab3 { background-color: #d0d8ef; color: blue; }
p.tabs a:hover { color: red; }

div.tab {
   /* decoration tabbox */
   overflow: auto; clear: left;
   overflow-y: hidden;
}

/* color */
div#tab1 { border: 1px solid blue; background-color: #f0f8ff; }
div#tab2 { border: 1px solid blue; background-color: #f0f8ff; }
div#tab3 { border: 1px solid blue; background-color: #f0f8ff; }
div.tab p { margin: 0.5em; }













#submenulist{
    width:180px;
	font-size:100%;
	line-height:150%;
	background-color: #f0f8ff;
	list-style-position: outside;
	list-style-type: none;
	padding: 0.5em 0.8em 0.8em 0.5em;
	border-style: solid;
	border-color: #DADFEC;
	margin-bottom: 2em;
	margin-left: 2em;
}

#submenu li{
	font-size:100%;

}

#submenu ul{
	font-size:95%;

}





/* --Clearfix */
.cf:before,
.cf:after {content:""; display:table;}
.cf:after {clear:both;}

.toggle { margin: 2px 0 0 14px; float: left; border-radius: 6px; -webkit-border-radius: 6px; }
.toggle li { float: left; }
.toggle li a {width: 50px; padding: 6px 0; text-align: center; display: block; text-shadow: 1px 1px 0 #fff; font-size: 12px; font-weight: 600; color: #666; -webkit-border-radius: 0 4px 4px 0; -o-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; 

background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #ededed 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#ededed 100%); /* IE10+ */

box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;
-webkit-box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;

}
.toggle li:first-child a {-webkit-border-radius: 4px 0 0 4px; -o-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px;}
.toggle li a:hover { background: #ededed; color: #222; }
.toggle li a.active { background: #c8e0f3; color: #325874; cursor: default; box-shadow: inset 0 0 3px rgba(0,0,0,0.4); -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.4); }

.slider { margin: 10px 0 10px!important;}
#carousel li {margin-right: 5px;}
#carousel img {display: block; opacity: .5; cursor: pointer;}
#carousel img:hover {opacity: 1;}
#carousel .flex-active-slide img {opacity: 1; cursor: default;}

.button {
  display: inline-block;
  margin: 0;
  padding: .461em 1.563em .41em;
  color: #fff!important;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
  line-height: 1;
  font-size: .9em;
  cursor: pointer;
  font-family: "proxima-nova", sans-serif;
  border: 1px solid #1a4064;
  background: #255a8c;
  -webkit-border-radius: 100px;
  border-radius: 100px;
  -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(255, 255, 255, 0.15);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(255, 255, 255, 0.15);
}
.button:active  {
  -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(0, 0, 0, 0.1);
}
.button.green  {
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  border: 1px solid #578824;
  background: #71b02f;
}
.button.green:hover  {
  background: #79bc32;
}


/* Layout
***********************/
#container {padding: 0px 800px 800px;}
#header {width: 800px; float: left;}
#main {margin-left: 0px; overflow: hidden;}
#aside h3 {float: left;}

  #container {padding: 0px 0px;}
  header {width: 100%; float: none; text-align: center;}
  header img  {width:60px;}
  header .button  { margin-bottom: 8px; }

  #main {margin-left: 0;}
  h3.nav-header { margin: 0 auto 10px; font-size: 16px; }
  nav {
		position: relative;
		min-height: 46px;
		width: 800px;
	}	
	nav ul {
		width: 260px;
		padding: 0;
		margin-left: -130px;
		top: 0;
		z-index: 9999;
		border: 1px solid #1e5486;
		background: #255a8c;
		-webkit-border-radius: 3px;
		        border-radius: 3px;
		-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.2), inset 0 0 2px 0 rgba(255,255,255,0.2);
	        	box-shadow: 0 0 5px 0 rgba(0,0,0,.2), inset 0 0 2px 0 rgba(255,255,255,0.2);
	}
	nav li {
		display: none; /* hide all <li> items */
		margin: 0;
	}
	nav li a  { border: none!important; text-shadow: 1px 1px 0 rgba(0,0,0,0.3); }
	nav li a:hover  { text-decoration: underline; }
	nav .active {
		display: block; /* show only current <li> item */
	}
	nav a {
		display: block;
		padding: 10px 20px;
		text-align: center;
		font-size: 12px;
	}
	nav .active a {
		background: none;
		color: #fff;
		position: relative;
	}
	nav .active a:after  {
		font-family: flexslider-icon;
		content: '\f005';
		font-size: 13px;
		position: absolute;
		right: 10px;
		top: 10px;
	}

	/* on nav hover */
	nav ul:hover {
		background: #32679a;
	}
	nav ul:hover li {
		display: block;
		margin: 0 0 5px;
	}
	nav ul:hover .active {
		border: 1px solid #1e5486!important;
		background: #255a8c;
		-webkit-border-radius: 1px;
		border-radius: 1px;
	}
	nav ul:hover .active a:after  {
		display: none;
	}
  




/*------------JRA-55 WEB subset--------------*/
/*
html { font-size: 62.5%; height: 100%;}
*/

body {
  font-family: 'Helvetica Neue', Helvetica, Verdana, Arial, sans-serif;
/*
  font-size: 16px;
  line-height: 1.4;
*/
  height: 100%;
  background-color: #fff;
  background-image: url(../images/x.png);

/*  background-repeat: repeat-x repeat-y; */
  background-attachment: scroll;
  background-position: left top;
}
.pageback {
  position: fixed;
  bottom: 10px;
  right: 10px;
}
div.wrapper {
  width: 960px;
  margin: 0 auto;
  text-align: left;
}
.container {
  width: 100%;
  background-color: #fff;
  position: relative;
  height: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
body > .container {height: auto;}
.container:before, .container:after {
  display: table;
  content: " ";
}
.container:after {clear: both;}
.contents {padding-bottom: 50px;}
.navigation {
  display: block;
  height: 50px;
}
.article {
  display: block;
  padding-bottom: 10px;
  margin: 10px 0 0;
}
.article > h1 {
  background-color: #ecf0f1;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 60px;
  margin-bottom: 30px;
  font-size: 30px;
  line-height: 120%;
  border: 2px solid #2c3e50;
}
.article > div > p {text-indent: 2em;}
.article > div > h3 {margin-top: 60px;}
.page-header {
  padding-bottom: 10px;
  margin: 40px 0 20px;
  border-bottom: 5px solid #bdc3c7;
}
.header {
  margin-bottom: 30px;
  border-bottom: 5px solid #bdc3c7;
}
.footer {
  width: 100%;
  height: 60px;
  bottom: 0;
  padding-top: 10px;
  background-color: #ecf0f1;
}
.pull-right {float: right !important;}
.pull-left {float: left !important;}
.hide {display: none !important;}
.show {display: block !important;}



a.jra {
  color: #2980b9;
  text-decoration: none;
}
a.jra:hover, a.jra:focus {
  color: #c0392b;
  text-decoration: underline;
}
a.jra:focus {
  outline: thin dotted #7f8c8d;
/*  outline: 5px auto -webkit-focus-ring-color; */
  outline-offset: -2px;
}


h1.jra, h2.jra, h3.jra, h4.jra, h5.jra, h6.jra {
  font-family: 'Helvetica Neue', Helvetica, Verdana, Arial, sans-serif;
  font-weight: 500;
  line-height: 1.1;
}
h1.jra, h2.jra, h3.jra {
  margin-top: 5px;
  margin-bottom: 10px;
}
h4.jra, h5.jra, h6.jra {
  margin-top: 10px;
  margin-bottom: 10px;
}
h1.jra {font-size: 36px;}
h2.jra {font-size: 30px;}
h3.jra {font-size: 24px;}
h4.jra {font-size: 18px;}
h5.jra {font-size: 14px;}
h6.jra {font-size: 12px;}

.text-gray {color: #7f8c8d;}
.text-blue {color: #2980b9;}
.text-yellow {color: #f39c12;}
.text-red {color: #c0392b;}
.text-green {color: #16a085;}
.text-purple {color: #8e44ad;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}
.text-new:after {
  content: "New / Update !";
  padding-left: 1em;
  font-style: italic;
  vertical-align: top;
  font-size: 80%;
  color: #16a085;
}

/* Image sprite
******************************************************************************/
[class^="jraimg-"], [class*=" jraimg-"] {
  display: inline-block;
  background-image: url(../images/jraimg.gif);
  background-repeat: no-repeat;
  background-position: top left;
}
.jraimg-jma {background-position: 0 0; width: 140px; height: 140px;}
.jraimg-jra55 {background-position: 0 -142px; width: 140px; height: 140px;}
.jraimg-jra25 {background-position: 0 -284px; width: 140px; height: 140px;}
.jraimg-pageback {background-position: 0 -426px; width: 64px; height: 64px;}
.jraimg-go55en {background-position: 0 -492px; width: 320px; height: 200px;}
.jraimg-go55en:hover, .jraimg-go55en:focus {background-position: 0 -694px; width: 320px; height: 200px;}
.jraimg-go55ja {background-position: 0 -896px; width: 320px; height: 200px;}
.jraimg-go55ja:hover, .jraimg-go55ja:focus {background-position: 0 -1098px; width: 320px; height: 200px;}
.jraimg-go25en {background-position: 0 -1300px; width: 320px; height: 200px;}
.jraimg-go25en:hover, .jraimg-go25en:focus {background-position: 0 -1502px; width: 320px; height: 200px;}
.jraimg-go25ja {background-position: 0 -1704px; width: 320px; height: 200px;}
.jraimg-go25ja:hover, .jraimg-go25ja:focus {background-position: 0 -1906px; width: 320px; height: 200px;}
.jraimg-newsen {background-position: -322px 0; width: 120px; height: 50px;}
.jraimg-newsen:hover, .jraimg-newsen:focus {background-position: -322px -52px; width: 120px; height: 50px;}
.jraimg-newsja {background-position: -322px -104px; width: 120px; height: 50px;}
.jraimg-newsja:hover, .jraimg-newsja:focus {background-position: -322px -156px; width: 120px; height: 50px;}
.jraimg-abouten {background-position: -322px -208px; width: 120px; height: 50px;}
.jraimg-abouten:hover, .jraimg-abouten:focus {background-position: -322px -260px; width: 120px; height: 50px;}
.jraimg-aboutja {background-position: -322px -312px; width: 120px; height: 50px;}
.jraimg-aboutja:hover, .jraimg-aboutja:focus {background-position: -322px -364px; width: 120px; height: 50px;}
.jraimg-usageen {background-position: -322px -416px; width: 120px; height: 50px;}
.jraimg-usageen:hover, .jraimg-usageen:focus {background-position: -322px -468px; width: 120px; height: 50px;}
.jraimg-usageja {background-position: -322px -520px; width: 120px; height: 50px;}
.jraimg-usageja:hover, .jraimg-usageja:focus {background-position: -322px -572px; width: 120px; height: 50px;}
.jraimg-manualen {background-position: -322px -624px; width: 120px; height: 50px;}
.jraimg-manualen:hover, .jraimg-manualen:focus {background-position: -322px -676px; width: 120px; height: 50px;}
.jraimg-manualja {background-position: -322px -728px; width: 120px; height: 50px;}
.jraimg-manualja:hover, .jraimg-manualja:focus {background-position: -322px -780px; width: 120px; height: 50px;}
.jraimg-contacten {background-position: -322px -832px; width: 120px; height: 50px;}
.jraimg-contacten:hover, .jraimg-contacten:focus {background-position: -322px -884px; width: 120px; height: 50px;}
.jraimg-contactja {background-position: -322px -936px; width: 120px; height: 50px;}
.jraimg-contactja:hover, .jraimg-contactja:focus {background-position: -322px -988px; width: 120px; height: 50px;}
.jraimg-applyen {background-position: -322px -1040px; width: 180px; height: 50px;}
.jraimg-applyen:hover, .jraimg-applyen:focus {background-position: -322px -1092px; width: 180px; height: 50px;}
.jraimg-applyja {background-position: -322px -1144px; width: 180px; height: 50px;}
.jraimg-applyja:hover, .jraimg-applyja:focus {background-position: -322px -1196px; width: 180px; height: 50px;}
.jraimg-pdf-banner {background-position: -322px -1248px; width: 112px; height: 33px;}
.jraimg-pdf {background-position: -322px -1283px; width: 32px; height: 16px;}


/* Print
******************************************************************************/
@media print {
  * {
    color: #000 !important;
    text-shadow: none !important;
    box-shadow: none !important;
  }
  a, a:visited {text-decoration: underline;}
  a[href]:after {content: " (" attr(href) ")";}
  a:after,a[href^="#"]:after {content: "";}
  thead {display: table-header-group;}
  tr, img {page-break-inside: avoid;}
  img {max-width: 100% !important;}
  @page  {margin: 2cm .5cm;}
  p, h2, h3 {
    orphans: 3;
    widows: 3;
  }
  h2, h3 {page-break-after: avoid;}
  .table td, .table th {background-color: #fff !important;}
  .label {border: 1px solid #000;}
  .table {border-collapse: collapse !important;}
}