/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */


/* =============================================================================
   HTML5 element display
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 *    http://clagnut.com/blog/348/#c790
 * 2. Force vertical scrollbar in non-IE
 * 3. Remove Android and iOS tap highlight color to prevent entire container being highlighted
 *    www.yuiblog.com/blog/2010/10/01/quick-tip-customizing-the-mobile-safari-tap-highlight-color/
 * 4. Prevent iOS text size adjust on device orientation change, without disabling user zoom
 *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
 */

html { font-size: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; font-size: 95%; line-height: 1.45; }

body, button, input, select, textarea { font-family: Arial, sans-serif; /* MTL color: #222; */ }

/*
 * These selection declarations have to be separate
 * No text-shadow: twitter.com/miketaylr/status/12228805301
 * Also: hot pink!
 */

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }


/* =============================================================================
   Links
   ========================================================================== */

a { color: #076bcb; }
a:visited { color: #551a8b; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: 0; }

/* area:active { outline: 0; } KAZ: does not work for mindmap */

/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #999999; margin: 1em 0; padding: 0; }
 /* MTL color was #ccc */

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: en.wikipedia.org/wiki/User:Davidgothberg/Test59 */
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; line-height: 1.2; }

/* Position subscript and superscript content without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 5px 0; padding: 0; }	/* MAT: 5px is same as p, table, was 10 */
ul { list-style-type:none; }
ul li {
	padding-left: 15px;
	background: url(image/listyle.gif) no-repeat left 0.5em;	/* list-style-image は位置がずれるので使えない */
}
ul.link li {
	background: url(image/listylelink.gif) no-repeat left 0.5em;
}
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * Improve image quality when scaled in IE7
 * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
 */

img { border: 0; -ms-interpolation-mode: bicubic; }

/*
 * Correct overflow displayed oddly in IE9
 */

svg:not(:root) {
    overflow: hidden;
}


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9 
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend { border: 0; *margin-left: -7px; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; } /* KAZ c/o: vertical-align: baseline; *vertical-align: middle; */

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 * 2. Correct inner spacing displayed oddly in IE6/7
 */

button, input { line-height: normal; *overflow: visible; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

/*
 * Remove inner padding and border in FF3/4
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* Remove default vertical scrollbar in IE6/7/8/9 */
textarea { overflow: auto; vertical-align: top; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; margin: 0; }
		/* MTL "border-collapse: collapse" disables padding of table tag on IE8, etc. */

.fee table {
	width: 100%;
}

td {
	padding: 0;
}

/* tables used in contents */
.content-m th, .content-m td {
	border: 1px solid #cccccc;
	padding: 3px 10px;
}

.content-m thead th, .content-m thead td {
	background-color: #0D5593;
	color: white;
}
.content-m th {
	background-color: #f2f2f2;
}

.content-m table.noborder { /* KAZ added */
	margin: 0;
}
.content-m table.noborder td { /* KAZ added */
	border: 0; padding: 0;
}

.tablelist {
	width: 100%;
}

.tablelist thead td {
	color: #0D5593;
	background-color: transparent;
}

.tablelist td {
	border: 0;
	vertical-align: top;
	padding: 0;
	width: 46%;
}
.tablelist td.gap {
	width: 4%;
}

.tablelist ul {
	margin: 0;
}

.tablelist ul li {
	background: none;
	background-color: #e6e6e6;
	line-height: 1em;
	padding: 5px 10px 5px 15px;
}

.tablelist ul li.color2nd {
	background-color: #f2f2f2;
}

.tablelist a {
	display: block;
	width: 100%;
	background: url(image/detailsmall.gif) no-repeat right center;
	color:#4d4d4d;
	text-decoration: none;
}

.tablelist a:hover {
	background: url(image/detailsmall_on.gif) no-repeat right center;
}

.tablelist a div.dummy { /* Avoid detailsmall.gif from overlapping text */
	float: right;
	width: 53px;
	height: 100%;
}

table.simplepricelist {	/* シンプルな価格表で、tableの幅が自動だと美しくないので */
	width: 90%;
}
table.simplepricelist th {
	width: 3em;
}
table.simplepricelist td {
	text-align: right;
}

/* ==================
   Initializr Theme
   ================== */

body{
	/* font-family:Helvetica, Helvetica Neue, Arial, sans-serif; MTL */
	background-color: white;
	color:#4d4d4d;
	padding: 5px 0 0;
}

p, address {
	margin-top: 5px;	/* MAT: Original design では 10px だが広すぎる */
	margin-bottom: 10px;
}

.content-m table {
	margin-top: 10px;	/* MAT: tableは、p より marginを大きくしないと詰まりすぎて見える */
	margin-bottom: 15px;
}


address {
	font-style: normal;
}

/* MTL section {
	clear: both;
}
.wrapper{
	margin:auto;
	width:960px;
}*/

h2, h3, h4, h5 {
	margin:12px 0 0;	/* MAT: Original desine では 15px だが広すぎる */
}

h2, h3, h4 {
	color:black;
}

h1, h2, h3{
	font-family: KozGoStd-Regular, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	 /* 'メイリオ', Meiryo might be good and Vista&7 has it, but too thick and doesn't be centered on XP. KozGoStd-Regular by Adobe seems better than default font of Win XP and ヒラギノ. "ヒラギノ角ゴ Pro W3" is for Mac. */
}

h3, .history h4{
	border-bottom:1px solid #6e89e8;
}
h2{
	font-size: 180%;
	background: url(image/h2.jpg) no-repeat left center;
	margin-left: -45px;
	padding-left: 45px;
	line-height: 1.6em;	/* try and error by KAZ: h2.jpgの線が表示されないことがある */
	padding-top: 2px;	/* KAZ: problem.txt */
/*	vertical-align: middle; */	/* by KAZ */
}
h3{
	font-size: 160%;
	background: url(image/h3.gif) no-repeat left center;
	padding-left: 15px;
	line-height: 130%;
/*	vertical-align: middle; */
}
h4{
	font-size: 105%;
	background: url(image/h4.gif) no-repeat left center;
	padding-left: 15px;
}

h5{
	font-size: 100%;
	color: #0D5593;
	background: url(image/h5.gif) no-repeat left center;
	padding-left: 13px;
}
h2.short120, h3.short120{	/* short for right side image whose width is less than 120px */
	margin-right: 125px;
}
h2.short200, h3.short200{	/* short for right side image whose width is 121 - 200px */
	margin-right: 205px;
}
h2.short240, h3.short240{	/* short for right side image whose width is 201 - 240px */
	margin-right: 245px;
}
h2.short300, h3.short300{	/* short for right side image whose width is 241 - 303px */
	margin-right: 305px;
}

h2 rt {	/* for ruby */
	font-size: 40%;
}

iframe {
	border: 0;
	overflow: hidden:
}

iframe.ifhead, iframe.iffoot {
	width: 100%;
}

table.fourimages {
	width: 100%;
	padding: 0;
}
table.fourimages tr {
	text-align: center;
}
table.fourimages td {
	width: 25%;
	border: 0px none;
}

.nomargin {
	margin: 0;
}

.righttop {	/* Force to position right top most of the parent element, which has position: relative */
	 position: absolute;
	 right: 0;
	 top: 0;
}
.rightbottom {
	 position: absolute;
	 right: 0;
	 bottm: 0;
}

.whatsnew td, .whatsnew ul li, .sbannersmallgoma p {
	font-size: 85%;
}

img.withintext {
	vertical-align:middle;
}

/* ===============================
   Copied from old stylesheet
   =============================== */
.border_silver { border: solid 1px silver; }
.center { text-align: center; }
.right { text-align: right; }
.small { font-size: 80%; line-height: 1.2; letter-spacing: 1px; }
.verysmall { font-size: 75%; line-height: 1.2; letter-spacing: 1px; } /* KAZ */
p.mbzero { margin-bottom: 0; } /* KAZ */
p.mtzero { margin-top: 0; } /* KAZ */
.photol, .photor, .photo { font-size: 80%; text-align: center; margin-top: 10px; margin-bottom: 10px; letter-spacing: 0; }
.photo { margin-left: 10px; }
.photol { float: left; margin-right: 10px; }
.photor { float: right; margin-left: 10px; }
th { text-align: left; }
.indent, .history h4 p,  { margin-left: 1em; }
.text-indent { text-indent: -1em; margin-left: 1em; }
.content-m table.tablestep { margin: 0; } /* KAZ added */
.content-m .tablestep td { border: 0; cellspacing: 0; } /* Kei added */
.content-m .tablestep .step { padding: 0; text-align: center; width: 228px; height: 40px; font-size: 110%; font-weight: bold; color: #a00e15; }
.steptrans { background: url(image/stptrans.gif) no-repeat center center #fff; }
.stepcheck { background: url(image/stpcheck.gif) no-repeat center center #fff; }
.stepother { background: url(image/stpother.gif) no-repeat center center #fff; }
.content-m .tablestep .transition { padding: 0; text-align: center; font-size: 110%; font-weight: bold; }
.content-m .tablestep .condition { padding: 0 0 0 10px; text-align: left; font-size: 90%; }
.stepdetail { margin: 3px 0px 3px 1em; } /* KAZ added */
.content-m td.hvgroups { vertical-align: text-top; } /* KAZ added */
table.vgroup { border: 1px solid silver; margin: 10px 5px 5px 5px; }
.content-m table.vgroup th.vgroupheadcell { border: 0; background-color: #ffffff; height: 0.5em; line-height: 0.7em; }
div.vgroupheadstr { position: relative; top: -0.5em; left: 0.25em; }
span.vgroupheadstr { background-color: white; }
.content-m table.vgroup td.vgroupcontents { border: 0; padding: 3px 8px; }
li.tr_mitu { margin-left: -1em; }
.content-m th.tr_mitu { border: 0; padding-right: 5px; background-color: #ffffff; line-height: 1.5em; text-align: right; vertical-align: text-top; white-space: nowrap; }
.content-m td.tr_mitu { border: 0; padding-left: 5px; line-height: 1.5em; }
ul.tr_mitu { margin-left: 0; }
.tr_miru_result { font-size: 100%; font-weight: bold; padding-bottom: 1px; border-bottom: 1px solid black; }
.tr_miru_overstrike { display: block; background: url(image/crossbg.gif) no-repeat left center #fff; font-size: 100%; font-weight: bold; padding-bottom: 1px; }
table.tr_miru_internal { border: 1px solid silver; margin: 10px 0px; line-height: 1em; }
.content-m td.tr_miru_internal { text-align: right; }
.tr_mitu button, .tr_mitu input[type="button"], .tr_mitu input[type="reset"], .tr_mitu input[type="submit"] { width: 7em; } /* KAZ added */
.gomabox { text-align:center; }
.gomabox td { width:40%; border:2px ridge silver; margin-top:1em; }
.gomabox td.gap { width:2%; border: 0; }
.advert { font-size: 80%; text-decoration: none; }
table.advert { border:1px solid #909090; color: #666666; margin-top:20px; }
.advert a:link { color: #666666; text-decoration: none; }
.advert a:visited { color: #999999; text-decoration: none; }
.advert a:hover { color:#003399; text-decoration: underline; }
.advert td { padding:2px 0.5em; border: 0px none; }

/* ===============================
   Minimum width for each page
   =============================== */

body#homepage div#header, body#homepage div#footer {
	min-width: 996px;	/* KAZ: minimum for homepage */
}
body#homepage #main  {
	min-width: 956px;	/* KAZ: minimum for homepage - 40 */
}

body#trantop div#header, body#trantop div#footer {
	min-width: 916px;	/* KAZ: minimum for tran/index */
}
body#trantop #main  {
	min-width: 876px;	/* KAZ: minimum for tran/index - 40 */
}

body#tourism div#header, body#tourism div#footer {
	min-width: 897px;	/* KAZ: minimum for tran/tourism */
}
body#tourism #main  {
	min-width: 857px;	/* KAZ: minimum for tran/tourism - 40 */
}

div#header, div#footer {
	min-width: 766px;	/* KAZ: minimum for other pages */
}
#main {
	min-width: 726px;	/* KAZ: minimum for other pages - 40 */
}

/* ===============================
   Header: logo, top menu area
   =============================== */
div#header {
	line-height: 0px;	/* KAZ: [IE8]下位ページのh1の高さがズレる、top menuの下に隙間ができる問題の対処 */
}

#head {
	position: relative;	/* for header .righttop */
	margin: 0 20px 7px;
	line-height: 0px;
}

#headertag #navtag {
	background: url(image/hnavbg.gif) repeat-x;
	padding: 0 20px;
	height: 40px;	/* needs to avoid crack under the images on IE8 */
	line-height: 0px;
}

#headertag #navtag td {
	text-align: center;
}

#headertag #navtag a {
	width: 100%;
	display: block;	/* because we can't specify width to inline element */
}

#headertag #navtag a:hover {
	background: url(image/hnavbg_on.gif) repeat-x;
}

#headertag #navtag a:focus { outline: 0 }	/* Outline on focused menu item is not beautiful */

#headertag #navtag span {	/* Same as <haeder nav a:hover> */
	width: 100%;
	display: block;
	background: url(image/hnavbg_on.gif) repeat-x;
}

iframe.ifhead {
	height: 106px;	/* KAZ */
}

/* ==================
   Header: Title Bar
   ================== */
#titlebar-container {
	padding: 15px 20px 10px;
	background: url(image/titlebarbg.gif) no-repeat;
}

#titlebar {
	height: 40px;
	width: 100%;
}

#titlebar td.colored {
	background-color: #c0e0ef;
	padding: 5px 0 5px 10px;
}

#titlebar h1 {
	font-size: 30px;
	line-height: 28px;	/* KAZ: was 30px */
	padding-top: 2px;	/* KAZ: problem.txt */
	color: #000064;
	margin: 5px 0;
	padding-left: 15px;
	border-left: 1px solid #000064;
}

/* ==================
   Header: Mindmap
   ================== */
#mindmap-container {
	background: url(image/mindmapbg.jpg) repeat-x;
	line-height: 0;
	text-align: center;
}

/* #PictureBox { width: 877px; height: 246px; } */

/* ==================
   Main
   ================== */
#main {
	padding:0 20px 20px;
	clear: both;
	border-top: 5px solid #000064;
}

/* ==================
   Side bar
   ================== */
#rsidebar {
	float: right;
	margin-top: 1px;
}
#rsidebar, iframe.ifsidemenu, iframe.ifsmenucmn, .notifsidemenu {
	width: 248px;
}

/* Side bar menu */
.smenu {
	background: url(image/smenuframe.jpg) repeat-y;
}

.smenu, .sbanner {
	padding: 0 5px 0 3px;
	line-height: 100%;
}

.sbanner, .sbannerbig {
	margin-top: 12px;
	margin-bottom: 6px;
}

.smenuhead {
	height: 6px; /* to avoid margin under img (IE's bug?) */
	line-height: 0px;	/* KAZ: [IE8]sidemenuheadの画像の始まり位置が下にずれる */
}

.smenu ul {
	margin: 0;
}

.smenu ul li {
	padding: 0;
	background: none;
}

.smenu ul li {
	border-bottom: 1px solid #a6a6a6;
}

.smenu ul li a {
	height: 41px;
	line-height: 41px;	/* to center the text */
	padding-left: 30px;
	background: url(image/smenu.gif) no-repeat;
	display: block;		/* see comment of "header nav a" above */
	text-decoration: none;
	color: #4d4d4d;
}

.smenu ul li a:hover {
	background: url(image/smenu_on.gif) no-repeat;
	color: white;
}

.smenu ul li a:focus { outline: 0 }	/* Same as above a:focus */

.smenu ul li span {	/* Same as <.smenu ul li a:hover> */
	height: 41px;
	line-height: 41px;
	padding-left: 30px;
	display: block;
	text-decoration: none;
	background: url(image/smenu_on.gif) no-repeat;
	color: white;
}

/* Side bar 2nd menu */
.smenu ul li ul {
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-top: 1px solid #a6a6a6;
}

.smenu ul li ul li {
	border-bottom: 0px none;
}

.smenu ul li ul li a {
	height: 28px;
	line-height: 28px;	/* same reason as ".smenu ul li a" */
	background: #f2f2f2 none;
}

.smenu ul li ul li a:hover {
	background: #3697db none;
}

.smenu ul li ul li.color2nd a {
	background: white none;
}

.smenu ul li ul li.color2nd a:hover {
	background: #3999dd none;
}

.smenu ul li ul li span {	/* Same as <.smenu ul li ul li a:hover> */
	height: 28px;
	line-height: 28px;
	background: #3697db none;
}

.smenu ul li ul li.color2nd span {	/* Same as <.smenu ul li ul li.color2nd a:hover> */
	background: #3999dd none;
}

.smenutitle {	/* needs to avoid crack under the images on IE8 */
	height: 50px;
}
.smenutitlesmall {
	height: 20px;
}

/* Side bar banner */
.sbannersmallinside, .sbannersmallgoma {
	text-align: center;
	border-bottom: 1px solid #a6a6a6;
}
.sbannersmallinside a img {
/*	margin-top: 5px; */
	vertical-align: middle;
}
.sbannersmallgoma a img {
	margin-top: 10px;
}
.sbannersmallgoma a {
	text-decoration: none;
}
.sbannersmallgoma p {
	background-color: #ececec;
	color: #4d4d4d;
	padding: 5px;
	margin: 5px 10px 10px;
	text-align: left;
	line-height: 1.2em;
}
.sidegadgetsep {
	margin: 9px 0;
	border-top: 1px solid #999999;
}
#webdictbanner {
	height: 50px;
	margin-top: 10px;
}
#webdictform {	/* for IE8 and later, and other browsers */
	width: 220px;
	margin-left: 10px;
	margin-bottom: 5px;
	background-color: #e6c0c0;
}
#webdictform7 {	/* for IE7 and earlier */
	width: 220px;
	margin-bottom: 5px;
	background-color: #e6c0c0;
}
#webdicttext {
	width: 141px;
	margin: 10px 0 10px 12px;
	border-width: 2px;
	border-style: inset;
	font-size: 80%;
}
#webdictbutton {
	width: 38px;
	margin: 10px 12px 10px 5px;
	border-width: 2px;
	padding: 1px 3px;
	font-size: 80%;
}
#addfavbutton {
	width: 104px;
	margin: 0;
	border-width: 2px;
	padding: 1px 3px;
	font-size: 80%;
}
#google {
	margin: 10px 0px;
}
#googletext {
	width: 118px;
	margin: 10px 5px 9px 5px;
	border-width: 2px;
	border-style: inset;
	font-size: 80%;
}
#googlebutton {
	width: 38px;
	border-width: 2px;
	padding: 1px 3px;
	font-size: 80%;
	margin-top: 9px;
	float: right;
/*	vertical-align: middle; */
}
.googlesite {
	margin-left: 12px;
	font-size: 85%;
	line-height: 125%;
}
.googlesiteradio {
	vertical-align: middle;
}
#counterimg {
	height: 20px;
	margin-left: 12px;
	vertical-align: middle;
}
iframe.ifsidemenu {
	height: 400px;	/* KAZ */
	margin-bottom: 6px;
}
iframe.ifsmenucmn {
	height: 466px;	/* KAZ */
}
/* =========================================
   Main contents (common among all pages)
   ======================================= */
#contents{
	margin-right: 258px;	/* KAZ */
}
/* table#contents-in {
	width: 100%;
} */	/* KAZ: This cause a problem on IE6, so it is added in the script */
#contents h1 {
	color: white;
	font-size: 30px;
	background: url(image/toptran.gif) no-repeat #000064;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif; /* KozGoStd-Regular is too thick. */
	margin-top: 10px;
	margin-left: -10px;
	padding-left: 15px;
}

#content-head {
	height: 16px;
	background: url(image/conframe-headm.jpg) repeat-x;
}
#content-head-l, .content-l {
	width: 5px;
}
#content-head-r, .content-r {
	width: 7px;
}
#content-head-l {
	background: url(image/conframe-headl.jpg) repeat-y;
}
#content-head-r {
	background: url(image/conframe-headr.jpg) repeat-y;
}

.content-l {
	background: url(image/conframe-left.jpg) repeat-y;
}
.content-m {
	padding-left: 20px;
	padding-right: 15px;
	vertical-align: top;	/* to specify height */
}
.content-r {
	background: url(image/conframe-right.jpg) repeat-y;
}

#content-foot {
	text-align: center;
	height: 34px;	/* for resizing contents-id table */
	line-height: 0;	/* in order to stick to the below line on IE6 mode */
}
#content-foot img {	/* in order to stick to the below line */
	vertical-align: bottom;
}
#content-foot p {
	background-color: #000064;
	margin: 0;
	line-height: 1.6;
}
#content-foot a {
	color: white;
	text-decoration: none;
}

.twitter-share-button {
	vertical-align: top; /* これでいいのかわからないが FBとtweetボタンで縦の位置がずれる時があり、IE8 on XPでこうすれば揃う。.fb_iframe_widget IFRAME は text-bottom で、ここで指定しても変えられない? */
}

/* ===============================
   Main contents (top page only)
   ================== */
img.topcontact {
	margin-left: 11px;
}

#topmitsucon {
	margin-top: 20px;
	margin-bottom: 15px;
}

.whatsnew {
	position: relative;	/* for link .rightbottom;  */
	padding-bottom: 15px;
}
.whatsnew h2 {
	font-size: 95%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif; /* KozGoStd-Regular is too thick. */
	color: white;
	background: none #000064;
	margin-left: 0;
	padding: 3px 0;
	padding-left: 25px;
}
.whatsnew h2 a {
	color: white;
	text-decoration: none;
}
.whatsnew table {
	border-bottom: 1px solid #cccccc;
}
.whatsnew td {
	vertical-align: top;
	border-bottom: 1px dashed #cccccc;
	border-top: 0px none;
	border-left: 0px none;
	border-right: 0px none;
	padding: 0.5em 0;
}
.wndate { width: 120px; vertical-align: top; }
.whatsnew ul li {
	margin:0;
}
.dlbutton {	/* download button */
	vertical-align: middle;
}

/* ===============================
   Main contents (other page only)
   ================== */
.hpexample img {
	 height: 160px;
}
.hpexample td {
	vertical-align: top;
	width: 50%;
}
.hpexample p {
	 text-align: left;
}

.sitemap td {
	vertical-align: top;
	border: 0;
	width: 33%;
	padding-left: 1px;
	padding-right: 1px;
}

/* ==================
   Footer
   ================== */
footer{
/*	text-align: center; */	/* KAZ: moved to copyright */
	clear: both;
}

#globalnav-container{
	height: 26px;	/* 34-4-4 */
	background: url(image/globalnav.gif) repeat-x;
	/*border-top: 1px solid #000064; Kei included in globalnav.gif*/
	text-align: center;
	padding: 4px 0;
	margin: 0;
	border-right: 1px solid #d9d9d9;
}

#globalnav-container a {
	text-decoration:none;
	color:#4d4d4d;
	padding: 0 1%;
	font-size: 90%;
	border-left: 1px solid #d9d9d9;
	line-height: 26px;	/* same as height of upper level element, to center vertically */
	margin: 0;
}

#globalnav-container nav a:hover {
	color:#004bc8;
	text-decoration: underline;
}

#globalnav-container nav span {	/* Same as <#globalnav-containaer nav a> */
	color:#4d4d4d;
	padding: 0 1%;
	font-size: 90%;
	border-left: 1px solid #d9d9d9;
	line-height: 26px;
	margin: 0;
	text-decoration: underline;	/* except this */
}

#copyright{
	background-color:#000064;
	height:61px;		/* 73-12 */
	padding-top: 12px;	/* vertical-align: middle doesn't work not for table cell */
	line-height: 24px;
	color:white;
	text-align: center;	/* KAZ: moved from footer */
}

iframe.iffoot {
	height: 112px;	/* 34+73 above +margin:5 */	/* KAZ */
}

/* =============================================================================
   Non-semantic helper classes
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* =============================================================================
   PLACEHOLDER Media Queries for Responsive Design.
   These override the primary styles
   Modify as content requires.
   ========================================================================== */

img.mqresize {
/* Media Queries: set image max width to 100% */
	max-width: 100%;
	width: auto\9; /* ie8 */
	height: auto;
}

@media screen and (max-width: 976px) {
  /* Style adjustments for viewports 976px and smaller go here */

}

@media screen and (max-width: 480px) {
  /* Style adjustments for viewports 480px and smaller go here */

}


/* =============================================================================
   Print styles.
   Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    a, a:visited { color: #444 !important; text-decoration: underline; }
    thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
    tr, img { page-break-inside: avoid; }
    img { max-width: 100% !important; }
    @page { margin: 0.5cm; }
//  p, h2, h3 { orphans: 3; widows: 3; }
    h2, h3 { page-break-after: avoid; }
    /* KAZ: added below */
    iframe, aside { height: 0 !important; width: 0 !important; display: none !important; }
    #contents { margin-right: 0 !important; }
    #contents-in tr { page-break-inside: auto; }
    #contents-in tr tr { page-break-inside: avoid; }
}