@charset "utf-8";
/* -----------------------------------------------------------------------------
      for All 
------------------------------------------------------------------------------ */
/* ============================================
      base
============================================ */
header,
.globalNav,
#topicPath{
    font-size: 1.328rem;
	margin: 0 auto 0 auto;
	width: 970px;
}

footer:not(.footer){
	font-size: 1.328rem;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	width: 970px;
}
.footer {
    font-family:'Lucida Sans W01', 'Arial', 'Helvetica', 'メイリオ', 'Meiryo', sans-serif;
    line-height: 1.8;
    margin: 0;
    padding: 0;
}
.footer > .footer__copy{
	display: none;
}
#wrapper {
	width: auto;
	min-width: 970px;
	position: relative;
	z-index:200; 
}

.sp header{
	overflow: visible;
}
.sp .content-wrapper{
	z-index:100;
}
.pc .content-wrapper,
.sp .content-wrapper{
    padding: 0;
}

/* ============================================
      topicPath
============================================ */
#topicPath {
    line-height: 1.3;
    box-sizing: border-box;
    width: 970px;
    padding: 12px 0 10px 9px;
}

#topicPath ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#topicPath li {
	float: left;
	background: url(/instruments/img/misc_breadcrumbs.gif) no-repeat calc(100% - 2px) 43%;
   	padding-right: 13px;
}

#topicPath li:last-child {
	margin-right: 0;
	background: none;
}

#topicPath a {
    color: #003366;
	text-decoration: none;
}

#topicPath a:hover {
	text-decoration: underline;
}



/* ============================================
      l-header
============================================ */


/* -----------------------------------------------------------------------------
      for PC
------------------------------------------------------------------------------ */



/* -----------------------------------------------------------------------------
      for SP
------------------------------------------------------------------------------ */
@media only screen and (max-width: 719px) { /* device-width: 320px ～ 719px  for Smartphone */

/* ============================================
      base
============================================ */
#wrapper,
.container {
	min-width: 320px;
}
#wrapper{
    background: #fff;
    box-sizing: border-box;
    padding-bottom: 1px;
}

#topicPath {
    display: none;
}

header div.svgSwitch .rightBox{
	margin-bottom: 0;
}

/* ============================================
      l-header
============================================ */
.l-header__block {
	width: 100%;
}

/* ============================================
      header /footer
============================================ */
/* header */
header {
	width: auto;
}

header .leftBox {
	width: 168px;
	margin-top: 5px;
	margin-left: 2.06%;
}

header .rightBox {
	width: auto;
	margin-top: 5px;
	margin-right: 2.06%;
}

header .leftBox h1 {
	margin: 4px 0px 0px 0;
	width: 168px;
}

header .leftBox p.siteName,
header .leftBox p.siteNameFull {
	font-size: 90%;
    max-width: 230px;
	margin-left: 0;
	clear: left;
}

header .leftBox p.siteName img,
header .leftBox p.siteNameFull img {
	/*max-width: 230px;*/
	/*max-height: 28px;*/
	height: auto;
}

header .rightBox .langBox {
    margin-top: 14px;
}

header .rightBox .langBox p.communicationMessage {
    width: 114px;
}

header .rightBox .searchBox,
.configUnit {
    display: none;
}


/* footer */
div.footerBacktop {
	width: auto;
}

div.footerBacktop p {
    padding-right: 10px;
}

footer:not(.footer){
	width: auto;
}

footer {
	background: none;
	background-color: #e7e7e7;
	margin-bottom: 0;
	width: auto;
}

footer ul.rightNav {
	display: none;
}

footer article ul.leftNav {
	width: 100%;
	margin: 0;
	padding-left: 10px;
	padding-right: 10px;	
}

footer article ul.leftNav.pcTop {
	display: block;
	clear: both;
}

footer article ul.leftNav li {
	background:url(/common/unchangeable/img/bullet_arrow-a03.png) no-repeat left center;
	display: inline-block;
	padding: 0.4em 0.5em 0.4em 10px;
}
footer article ul.leftNav li.pcIcon {
    background: url(/common/unchangeable/img/icon_pc.png) no-repeat left center;
    display: inline-block;
    padding: 0.4em 0.5em 0.4em 16px;
}

footer p.copyright {
	border-top: none;
	margin-top: 0;
	padding: 5px 10px 10px;
}

footer .lang {
	margin: 0 0 10px;
	padding: 0 0 0 6px;
}

footer .lang li {
	text-align: left;
	display: block;
    background: url(/common/unchangeable/img/img_iconA03.png) no-repeat left center;
	padding: 0.4em 0.5em 0.4em 14px;
}

footer .lang li.current {
	color: #999;
	font-weight: bold;
	background: none;
}


/* svg */
header div.svgSwitch .leftBox{
	margin-left: 2.1%;
}
header div.svgSwitch .leftBox,
header div.svgSwitch h1,
header div.svgSwitch #header_km_logo {
	width: 177px;
	margin-right: -30px;
}
header div.svgSwitch h1 img,
header div.svgSwitch #header_km_logo img{
	margin-top: 0;
	margin-left: -10px;
	margin-bottom:-12px;
	width: 177px;
}
header div.svgSwitch h1,
header div.svgSwitch h1 a,
header div.svgSwitch h1 a img,
header div.svgSwitch #header_km_logo,
header div.svgSwitch #header_km_logo a,
header div.svgSwitch #header_km_logo a img {
	height: auto;
}
header div.svgSwitch .leftBox p.siteNameFull{
	margin-top: 5px;
}
header div.svgSwitch .rightBox{
	margin-top: 2px;
}
header div.svgSwitch .rightBox .langBox.langZh {
    margin-top: 11px;
}
header div.svgSwitch .rightBox .langBox p.communicationMessage{
	width:114px;
}
header div.svgSwitch .rightBox .langBox.langZh p.communicationMessage {
    width: 68px;
}



/* search */
.searchBoxSP.active {
	display: block;
}

.searchBoxSP {
	width: 96%;
	margin: 0 auto 12px;
	border: 1px solid #a0a0a0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-color: #fff;
	-webkit-box-shadow: inset 0 4px 4px rgba(0,0,0,.08);
	-moz-box-shadow: inset 0 4px 4px rgba(0,0,0,.08);
	box-shadow: inset 0 4px 4px rgba(0,0,0,.08);
}

.searchBoxSP form {
	margin: 0;
	padding: 0;
	overflow: hidden;
	zoom: 1;
    font-family: "ＭＳ Ｐゴシック","メイリオ","ヒラギノ角ゴ Pro W3",sans-serif;
}

.searchBoxSP form label {
	display:none;	
}

.searchBoxSP form input#search,
.searchBoxSP form input#search02 {
	color: #666;
	width: 85%;
	height: 27px;
	line-height: 27px;
	padding: 0 0 0 10px;
	border: none;
	background: none;
	float: left;
}

.searchBoxSP form input[type='image'] {
	float: right;
}

.searchBoxSP form input:focus {
	border:none;
	outline:none;
	outline: 0;
}


/* Reset input[type="search"] for Safari */
input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
}
input[type="search"]:focus {
  outline-offset: -2px;
}
input[type="search"]::-webkit-search-decoration {
  display: none;
}


/* ==================================
   Toggle Navigation
===================================== */

/* -webkit-tap-highlight-color */
.globalNav,
ul#toggleNavi a,
#navEnclosingArea nav.listNav a {
	-webkit-tap-highlight-color:transparent;
}

ul#toggleNavi {
	clear: both;
	display: block;
    float: right;
    margin: 13px 0 0;
    padding: 0px;
	list-style: none;
}

ul#toggleNavi li {
	display: block;
	float: left;
	margin: 0 0 0 6px;
}

ul#toggleNavi li a {
	/*display:block;*/
	display: inline-block;
}

ul#toggleNavi li.menuBtn a span {
	display: block;
	width: 36px;
	height: 27px;
	text-indent: -9999px;
	text-align: left;
	overflow: hidden;
	background: url(/common/unchangeable/img/icon_menu.png) no-repeat 0 0;
    -webkit-background-size: 36px 27px;
	-moz-background-size: 36px 27px;
    background-size: 36px 27px;	
}


html.mac ul#toggleNavi li.menuBtn a span:hover,
html.win ul#toggleNavi li.menuBtn a span:hover,
html.msie ul#toggleNavi li.menuBtn a span:hover,
html.chrome ul#toggleNavi li.menuBtn a span:hover,
html.firefox ul#toggleNavi li.menuBtn a span:hover,

ul#toggleNavi li.menuBtn.active a span,
ul#toggleNavi li.menuBtn a.hover span {
	background: url(/common/unchangeable/img/icon_menu_on.png) no-repeat 0 0;
    -webkit-background-size: 36px 27px;
	-moz-background-size: 36px 27px;
    background-size: 36px 27px;
}

ul#toggleNavi li.searchBtn a span {
	display: block;
	width: 27px;
	height: 27px;
	text-indent: -9999px;
	text-align: left;
	overflow: hidden;
	background: url(/common/unchangeable/img/icon_search.png) no-repeat 0 0;
    -webkit-background-size: 27px;
	-moz-background-size: 27px;
    background-size: 27px;
}


html.mac ul#toggleNavi li.searchBtn a span:hover,
html.win ul#toggleNavi li.searchBtn a span:hover,
html.msie ul#toggleNavi li.searchBtn a span:hover,
html.chrome ul#toggleNavi li.searchBtn a span:hover,
html.firefox ul#toggleNavi li.searchBtn a span:hover,

ul#toggleNavi li.searchBtn.active a span,
ul#toggleNavi li.searchBtn a.hover span {
	background: url(/common/unchangeable/img/icon_search_on.png) no-repeat 0 0;
    -webkit-background-size: 27px;
	-moz-background-size: 27px;
    background-size: 27px;
}

nav.globalNav {
	line-height: 1.2;
}

.globalNav {
	display: none;
	width: 96%;
	padding: 0;
	margin: 0 auto 12px;
}

ul#toggleNavi li.menuBtn .globalNav.active {
	display: block;
	position: absolute;
	left: 2%;
	z-index: 1000;
	margin-top: 4px;
	text-align: left;
	font-size: 13px;
}

ul#toggleNavi li.menuBtn .globalNav.active ul {
	width: auto;
	border: 1px solid #b9b9b9;
	border-bottom: none;
}

ul#toggleNavi li.menuBtn .globalNav.active ul li {
	display: block;
	float: none;
	padding: 0;
	margin: 0;
}

ul#toggleNavi li.menuBtn .globalNav.active ul li a,
ul#toggleNavi li.menuBtn .globalNav.active ul li a:hover {
	display: block;
	background: url(/common/unchangeable/img/icon_menu_02.png) no-repeat 98% center;
    -webkit-background-size: 18px;
	-moz-background-size: 18px;
    background-size: 18px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #cacaca;
	padding: 13px 10px;
}

ul#toggleNavi li.menuBtn .globalNav.active ul li.toPC a,
ul#toggleNavi li.menuBtn .globalNav.active ul li.toPC a:hover {
	background: url(/common/unchangeable/img/icon_menu_05.png) no-repeat 98% center;
    -webkit-background-size: 18px;
	-moz-background-size: 18px;
    background-size: 18px ;
}

ul#toggleNavi li.menuBtn .globalNav.active ul li a,
ul#toggleNavi li.menuBtn .globalNav.active ul li.toPC a {
	color: #000;
	background-color:#e8e8e8;
}

ul#toggleNavi li.menuBtn .globalNav.active ul li.current a,
ul#toggleNavi li.menuBtn .globalNav.active ul li.current a:hover,
ul#toggleNavi li.menuBtn .globalNav.active ul li.current a.hover {
	color: #fff;	
	background-color: #007cfd;
	background-color: -webkit-linear-gradient(top, #007cfd, #005aba);
	background-color: -moz-linear-gradient(top, #007cfd, #005aba);
	background-color: -o-linear-gradient(top, #007cfd, #005aba);
	background-color: linear-gradient(to bottom, #007cfd, #005aba);	
	
/* SVG as background image (IE9/Chrome/Safari/Opera) */ 
background-color:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImcxNTIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiMwMDdDRkQiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMwMDVBQjkiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2cxNTIpIiAvPgo8L3N2Zz4=);
}

ul#toggleNavi li.menuBtn .globalNav.active ul li a:hover,
ul#toggleNavi li.menuBtn .globalNav.active ul li a.hover,
ul#toggleNavi li.menuBtn .globalNav.active ul li.toPC a:hover,
ul#toggleNavi li.menuBtn .globalNav.active ul li.toPC a.hover {
	color: #000;	
	background-color: #d1e5fa;
}


ul#toggleNavi li.menuBtn .globalNav.active ul li ul {
	display: none;
}

}	/*End of  @media only screen and (max-width: 719px) */

/* -----------------------------------------------------------------------------
      clearfix
------------------------------------------------------------------------------ */
#topicPath ul::after {
    content: "";
    display: block;
    clear: both;  
}

