@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap');
/* ver2.2.2 Jun 05, 2019 */
/*===========================================
reset css
!!!!! Do not edit !!!!!
===========================================*/

v\:line, v\:rect, v\:fill, v\:image, v\:stroke{ behavior: url(#default#VML); }

/*--------------------------------------------
  HTML5 Reset ::style.css
  -------------------------
  We have learned much from/been inspired by/taken code where offered from:
  Eric Meyer:http://ericmeyer.com
  HTML5 Doctor:http://html5doctor.com
  and the HTML5 Boilerplate:http://html5boilerplate.com
---------------------------------------------*/

/* Let's default this puppy out
--------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd,
q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video{
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
article, aside, figure, footer, header, hgroup, nav, section{display:block;}

/* Responsive images and other embedded objects
   Note:keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed{max-width:100%;}

html{overflow-y:scroll;}
ul{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before,
blockquote:after,
q:before,
q:after{content:''; content:none;}
a{margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
del{text-decoration:line-through;}
abbr[title], dfn[title]{border-bottom:1px dotted #000; cursor:help;}
table{border-collapse:collapse; border-spacing:0;}
th{font-weight:bold; vertical-align:top;}
td{font-weight:normal; vertical-align:top;}
hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}
input, select{vertical-align:top;}
pre{
  white-space:pre; /* CSS2 */
  white-space:pre-wrap; /* CSS 2.1 */
  white-space:pre-line; /* CSS 3 (and 2.1 as well, actually) */
  word-wrap:break-word; /* IE */
}
input[type="radio"]{vertical-align:middle;}
input[type="checkbox"]{vertical-align:middle; *vertical-align:baseline;}
input[type="button"],
input[type="submit"]{-webkit-appearance:none; -webkit-border-radius:0;}

select, input, textarea{font:99% sans-serif;}
table{font-size:inherit; font:100%;}
a:hover, a:active{outline:none;}
small{font-size:85%;}
strong, th{font-weight:bold;}
td, td img{vertical-align:top;}
sub, sup{font-size:75%; line-height:0; position:relative;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
pre, code, kbd, samp{font-family:monospace, sans-serif;}
.clickable,
label,
input[type=button],
input[type=submit],
button{cursor:pointer;font-size:90%;}
button, input, select, textarea{margin:0;}
button{width:auto; overflow:visible;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
img{vertical-align:bottom;}
em{font-style:normal;}



/*===========================================
base.css
!!!!! Do not edit !!!!!

* Base Setting
* wrapper
* header
* header [media queries]
* breadCrumb
* contents
* footer
* popup page
* clearfix
===========================================*/

/*-------------------------------------------
Base Setting
-------------------------------------------*/
@-ms-viewport {
  width: device-width;
}
html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-overflow-style: scrollbar;
  font-size:62.5%;
}
*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}
body,select,input,textarea{
  font-size:100%;
  -webkit-text-size-adjust:none;
}
a{
  color:#014099;
  text-decoration:none;
  -webkit-tap-highlight-color:rgba(0,0,255,0.2)!important;
}
a:link{-webkit-tap-highlight-color:#014099;}
a:hover{text-decoration:underline;}
a:visited{color:#004eb6; text-decoration:none;}
caption{margin-bottom:5px; text-align:left;}
ins{background-color:#fcd700; color:#000; text-decoration:none;}
mark{background-color:#fcd700; color:#000; font-style:italic; font-weight:bold;}
select{height:1.8em;}
input{padding:0 2px;}
textarea{padding:2px;resize:vertical;width:98%;}

@media screen and (max-width:767px){
  a:hover{opacity:1!important;}
}
body,select,input,textarea{
  font:1.6rem "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, メイリオ, Verdana, "ＭＳ Ｐゴシック", sans-serif;
  font-weight: 300;
  line-height:1.8;
  color:#333;
}
[lang="ja"] body,
[lang="ja"] select,
[lang="ja"] input,
[lang="ja"] textarea{
   font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo','メイリオ',Verdana,'ＭＳ Ｐゴシック',sans-serif;
}
html.tablet{min-width: 1120px;}

  @media screen and (max-width:320px){
    html{font-size:50%;}
    body,select,input,textarea{line-height: 1.6;}
  }

  @media screen and (max-width:767px){
    body,select,input,textarea{line-height: 1.6;}
  }


/*-------------------------------------------
wrapper
-------------------------------------------*/
#skipLink {position:absolute; left:-9999px;}
#wrapper {width: 1080px; margin:0 auto;}
.wrapContent {position: relative; width: 1080px; margin:0 auto;}
.wrapContent_KV {position: absolute; width: 1080px; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: center; margin: 0 auto;}

@media screen and (min-width: 769px){
  .wrapper {max-width: 1080px; margin: 0 auto; clear: both;}
}

@media screen and (max-width: 769px){
  .wrapper {margin: 0 20px;}
  .wrapContent {width: auto;}
  .wrapContent_KV {position: absolute; bottom: 0; padding: 15px 6%; width: 100%;}
}


/*-------------------------------------------
header
-------------------------------------------*/
#headerWrap {position: fixed; z-index: 101; background-color: #fff; width: 1600px; height: 110px; margin: 0 0 0 -260px;}

/* logo
---------------------------------*/
header #logo{position:absolute; top:20px; left:0; z-index:105;}
header #logo p{float:left;}
header #spMenuBtn{display:none;}
header #logo .groupLogo img{vertical-align: top;}
header #logo .siteLogo a{display:inline-block; height: auto;}
header #logo .siteLogo a img{vertical-align: middle;}
header #logo .siteLogo{padding:24px 0 0 0;}
header #logo .groupLogo + .siteLogo{padding-left:25px;}
header #logo .originalLogo{padding:14px 0 0 0;}
header #logo .groupLogo img{width:352px;}

/* siteFunctions
---------------------------------*/
#siteFunctions{
  position:fixed;
  z-index:99;
  width:1080px;
  left:50%;
  margin-left:-540px;
  /*height:85px;*/
  background-color:#fff;
}
#siteFunctions a{color:#333;}
#siteFunctions a:hover{text-decoration:none; color:#999;}
#siteFunctions.hideGnavHeader{height:110px;}

/* globalNav
---------------------------------*/
#gnavOverlay {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 98;
  top: 151px;
  background-color: rgba(0, 0, 0, 0.7);
  cursor: pointer;
}
#gnavOverlay.current,
#gnavOverlay.noGnav{top: 110px;}

#gNavSP{display: none;}
#globalNav{
  position:fixed;
  z-index:99;
  width:1600px;
  top:64px;
  height: 41px;
  background-color: #fff;
}
#globalNav.hideGnav{display:none;}
#globalNav ul.parentNav{position: absolute; right: 0;}
#globalNav ul.parentNav > li > a{font-weight: 600;}
#globalNav ul li{float:left;}
#globalNav ul li a{font-family: 'ヒラギノ角ゴ Pro W3', sans-serif; padding:5px 15px; font-size:1.6rem; display: block; line-height: 1.5;color: #333333; font-weight: 300 !important;}
#globalNav ul li:last-child a{padding-right:0;}
#globalNav ul li.lowerOpen a{color:#014099;}
#globalNav ul li a.current{color:#014099;}
#globalNav ul li a.off{color:#ccc;}
#globalNav ul li a.off:hover,
#globalNav ul li a:hover{text-decoration:none; color:#014099;}
#globalNav ul li a.menuToggle{display:none;}
#globalNav > p{
  position:relative;
  display:none;
  width:1080px;
  height:42px;
  margin:-60px auto 0;
  text-align:center;
  overflow:hidden;
}
#globalNav.close p{display:block; padding-bottom:18px;}

/* subGnav */
#globalNav ul li .subGnav{
  display:none;
  position:absolute;
  top:41px;
  left:100px;
  width:1080px;
  background-color:#fff;
  overflow:hidden;
}
#globalNav ul li .subGnav .subInner{display:table; position:relative; width: 100%;}
#globalNav ul li .subGnav .category{
  display:table-cell;
  position:relative;
  width:21%;
  padding:37px 30px 30px;
  background:#014099;
  color:#fff;
  vertical-align: top;
  box-sizing: border-box;
}
/*#globalNav ul li .subGnav .category:before{content:''; float:left; min-height:130px;}*/
#globalNav ul li .subGnav a.category{transition:background-color .3s cubic-bezier(0.170, 0.935, 0.305, 1.000);}
#globalNav ul li .subGnav a.category:hover{background-color:#034bb1;}
#globalNav ul li .subGnav .category a{color:#fff;}
#globalNav ul li .subGnav .category .heading{font-size:2rem; font-weight:bold; line-height:1.2;}
#globalNav ul li .subGnav .category .outline{margin-top:10px;}
#globalNav ul li .subGnav .menus{
  display: table-cell;
  width:79%;
  padding:30px 30px 30px 0;
  vertical-align: middle;
  box-sizing: border-box;
}
#globalNav ul li .subGnav .menus a{font-size: 1.6rem; padding:3px 10px;}
#globalNav ul li .subGnav .menus ul{display:table-cell; vertical-align:top; box-sizing: border-box; padding-left:30px; width: 40%;}
#globalNav ul li .subGnav .menus ul:last-child li{border:none;}
#globalNav ul li .subGnav .menus ul li{float:none;}
#globalNav ul li .subGnav .menus ul li a{display:inline-block;}
#globalNav ul li .subGnav .menus ul li.blank a{position: relative;}
#globalNav ul li .subGnav .menus ul li.blank a::after{display: inline-block;}
#globalNav ul li .subGnav .menus p.top{padding:0 0 13px 30px; font-weight: bold;}
#globalNav ul li .subGnav .menus p.top a{font-size: 1.8rem;}

/* regionLang
---------------------------------*/
#selectRegion {
  display: none;
  position: absolute;
  top: 151px;
  z-index: 103;
  width:100%;
}
#drawer.current #selectRegion,
#drawer.noGnav #selectRegion{top: 110px;}
#selectRegion nav{display: table; width:100%;}
#selectRegion .regionHead {
  display: table-cell;
  box-sizing: border-box;
  width:21%;
  padding: 37px 30px 30px;
  vertical-align:top;
  background-color:#014099;
  color:#fff;
  font-size:2rem;
  font-weight: bold;
}
#selectRegion .regionList{
  display: table-cell;
  vertical-align: top;
  width: 79%;
  padding: 30px 30px 30px 40px;
  box-sizing: border-box;
  background-color: #fff;
}
#selectRegion .regionList ul{vertical-align: top; float:left; margin-left:100px;}
#selectRegion .regionList ul:nth-of-type(1){margin-left: 0;}
#selectRegion .regionList ul li{ margin-bottom:10px;}
#selectRegion .regionList ul li a{font-weight: bold;}

#subFunctions{position:absolute; top:20px; right:0; font-size:1.2rem;}
#subFunctions .langSelect{float:left; position:relative; font-family:Helvetica,Arial,sans-serif;}
#subFunctions .langSelect a{padding:1px 10px; line-height:1.2; color:#000000;font-size: 14px;text-decoration: underline; font-weight:600;}
#subFunctions .langSelect a:last-child{padding-right:0;}
#subFunctions .langSelect a + a{border-left:#ccc 1px solid;}
#subFunctions .langSelect span + a{background:none;}
#subFunctions .langSelect a.active{color:#0a367d;text-decoration:none;}

#subFunctions .otherLink{float:right; margin:0 0 0 20px; padding-left:20px; border-left:#dcdcdc 1px solid; height: 20px;}
#subFunctions .otherLink:last-child{border:none;}
#subFunctions .otherLink a{display:block;}

/* funcBtns
---------------------------------*/
#funcBtns{position:absolute; top:60px; right:0; overflow: hidden;}
#funcBtns li{display:inline-block; height:20px; margin-left:30px;}
#funcBtns li span{display:block; width:20px; height: 20px; cursor: pointer;}
#funcBtns li span:hover{opacity:0.7;}
#funcBtns li#searchOpen{}
#funcBtns li#contactLink{vertical-align: top; margin:-3px 0 0 0; border:none;}
#funcBtns li#contactLink a{font-size:1.4rem;}
#funcBtns li#contactLink a:hover{text-decoration: none; opacity:0.7;}
#funcBtns #gnavTrigger {
  width: 20px;
  height: 20px;
  position: relative;
  cursor: pointer;
}
#funcBtns #gnavTrigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
#funcBtns #gnavTrigger span,
#funcBtns #gnavTrigger::before,
#funcBtns #gnavTrigger::after {
  position: absolute;
  left: 0;
  display: inline-block;
  width: 20px;
  height: 2px;
}
#funcBtns #gnavTrigger::before,
#funcBtns #gnavTrigger::after{content: '';}
#funcBtns #gnavTrigger::before {top: 1px;}
#funcBtns #gnavTrigger span{top: 9px;}
#funcBtns #gnavTrigger::after {top: 17px;}


/*-------------------------------------------
header media queries
-------------------------------------------*/
  @media screen and (min-width:769px){
    #siteFunctions{display:block!important;}
    #drawer{height:auto!important;}
  }

  @media screen and (max-width:768px){
    body,select,input,textarea{font-size:12px;}
    #wrapper{width:100%; min-width:320px; background-color:#fff;}
    #headerWrap{width:100%; height:auto; margin: 0;}
    #headerWrap.hideGnavHeader{height:42px;}
    /*#globalNav.hideGnav{display:block;}*/

    header #logo{display:block; position:relative; top:inherit; left:0; display:block; height: 50px; padding-left:20px; overflow:hidden;}
    header #logo .groupLogo{float:left; padding-top:2px;}
    header #logo .groupLogo img{width:200px;}
    header #logo .siteLogo{float:left; margin:0; padding:20px 0 0 0;}
    header #logo .groupLogo + .siteLogo{padding:12px 0 0 8px;}
    header #logo .siteLogo img{vertical-align:middle;}
    header #logo .originalLogo img{width:110px; height:12px;}

    /* spMenuBtn
    ---------------------------------*/
    header #logo #spMenuBtn{position: absolute; top:3px; right: 0; display: block;}
    header #logo #spMenuBtn span {
      display: inline-block;
      -webkit-transition: all .4s;
      transition: all .4s;
      box-sizing: border-box;
    }
    header #logo #spMenuBtn a {
      position: relative;
      display:block;
      width: 45px;
      height: 45px;
      box-sizing: border-box;
    }
    header #logo #spMenuBtn span {
      position: absolute;
      right:10px;
      width: 26px;
      height: 2px;
      background-color: #014099;
    }
    header #logo #spMenuBtn span:nth-of-type(1) {top: 13px;}
    header #logo #spMenuBtn span:nth-of-type(2) {top: 20px;}
    header #logo #spMenuBtn span:nth-of-type(3) {top: 27px;}
    header #logo #spMenuBtn .active span:nth-of-type(1) { -webkit-transform: translateY(8px) rotate(-45deg); transform: translateY(8px) rotate(-45deg); }
    header #logo #spMenuBtn .active span:nth-of-type(2) {opacity: 0;}
    header #logo #spMenuBtn .active span:nth-of-type(3) { -webkit-transform: translateY(-6px) rotate(45deg); transform: translateY(-6px) rotate(45deg); }

    #siteFunctions {
      display: none;
      position: fixed;
      z-index: inherit;
      width: 100%;
      height: 100%;
      top:50px; right:0; bottom:0; left: 0;
      margin-left: 0;
      padding:0;
      box-sizing: border-box;
      background-color: #fff !important;
    }
    #siteFunctions a:hover{color:#333333!important;}
    #drawer{
      display: block;
      position: relative;
      padding:10px 20px;
      overflow-y:scroll;
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
    }
    #siteFunctions.hideGnavHeader {height: inherit;}

    #contactLink,
    #regionLang,
    #funcBtns,
    #subFunctions,
    #selectRegion{display:block!important; position: relative; top:inherit!important;}
    #gnavOverlay{display:none!important;}

    /* globalNav
    ---------------------------------*/
    #gnavTrigger,
    #globalNav{display: none!important;}
    #gNavSP{position:relative; display: block;}
    #gNavSP ul li a.menuToggle{
      position:absolute;
      display:inline-block;
      top:15px;
      right:3%;
      margin:0;
      padding:0;
      width:24px;
      height:24px;
      cursor:pointer;
    }
    #gNavSP ul li a.menuToggle::before{
      content:'';
      display:inline-block;
      width:8px;
      height:8px;
      border-top:#333333 2px solid !important;
      border-right: #333333 2px solid !important;
      -ms-transform: rotate(135deg);
      -webkit-transform: rotate(135deg);
      transform: rotate(135deg);
      margin: -5px 0 0 5px;
      vertical-align: middle;
    }
    #gNavSP ul li.noList a.menuToggle{display:none;}
    #gNavSP ul li a.menuToggle.open::before{
      -ms-transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }
    #gNavSP ul>li{position:relative; border-bottom:#ccc 1px solid !important; padding: 15px 10px; }
/*    #gNavSP ul li a{display:inline-block; color:#fff; padding:10px; font-size:1.6rem;}*/
    #gNavSP ul li a:hover{text-decoration:none;}

    /* subGnav */
    #gNavSP ul li .subGnav{display:none; position:relative;}
    #gNavSP ul li.lowerOpen .subGnav{display:block;}
    #gNavSP ul li .subGnav .category{display:none;}
    #gNavSP ul li .subGnav .menus{padding:0 0 10px 20px;}
    #gNavSP ul li .subGnav .menus ul li a,
    #gNavSP ul li .subGnav .menus p.top a{display:block; padding:3px 10px;}
    #gNavSP ul li .subGnav .menus ul li a:hover{text-decoration:none; color:#999;}
    #gNavSP ul li .subGnav .menus ul li.blank a{position: relative;}
    #gNavSP ul li .subGnav .menus ul li.blank a::after{
      position: absolute;
      top:5px; right: 5%;
      display: block;
      width: 14px;
      height: 14px;
    }
    #gNavSP #noSubGnav .menuToggle,
    #gNavSP #noSubGnav .subGnav{display: none;}

    /* contactLink
    ---------------------------------*/
    #searchOpen,
    #regionOpen{display: none!important;}
    #funcBtns{right:inherit;}
    #funcBtns li#contactLink{
      display: block;
      height: auto;
      padding: 0;
      margin:20px 0;
    }
    #funcBtns li#contactLink a{
      display:block;
      padding:10px;
      text-align:center;
      color:#000;
      background-color:#fff;
    }
    #funcBtns li#contactLink a:hover{text-decoration:none; color:#000!important;}

    /* langSelect
    ---------------------------------*/
    #regionLang{margin:0; padding:0 0 10px;}
    #subFunctions .langSelect{float:none; margin:15px 0; overflow:hidden;}
    #subFunctions .langSelect a,
    #subFunctions .langSelect span + a{
      display:block;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      width:47%;
      float:left;
      padding:7px;
      margin:0 0 0 2%;
      color:#fff;
      background:#022b66;
      border:none;
      text-align:center;
      line-height:inherit;
      font-size:1.4rem;
      text-decoration: none;
    }
    #subFunctions .langSelect a:hover{text-decoration:none;}
    #subFunctions .langSelect span + a{margin:0;}
    #subFunctions .langSelect span{clear:both; display:block; margin-bottom:7px; font-size:1.4rem; color:#fff;}
    #subFunctions .langSelect a.active{color:#fff;}

    #subFunctions .otherLink{margin:10px 0; float:none; height: auto; padding:0; border:none;}
    #subFunctions .otherLink a,
    #subFunctions .otherLink a:hover{
      display:block;
      padding:10px;
      text-align:center;
      color:#fff;
      background:none;
      background-color:#022b66;
    }

    /* selectRegion
    ---------------------------------*/
    #selectRegion nav{display: block; min-height: 0; margin-top:20px;}
    #selectRegion .regionHead {
      display: block;
      width:100%;
      margin-bottom:7px;
      padding:0;
      font-size: 1.4rem;
      font-weight: normal;
    }
    #selectRegion .regionList{
      display: block;
      width:100%;
      padding:0;
      background-color: inherit;
      overflow:hidden;
      box-sizing: border-box;
    }
    #selectRegion .regionList ul{display:inline; margin:0; float:none;}
    #selectRegion .regionList ul li{margin-bottom:10px; background-color:#022b66; width:32%; margin:0 0 2% 0; text-align:center; float:left; display: block; box-sizing: border-box;}
    #selectRegion .regionList ul:nth-of-type(1) li:nth-of-type(2),
    #selectRegion .regionList ul:nth-of-type(3) li,
    #selectRegion .regionList ul:nth-of-type(4) li:nth-of-type(3n+3){margin:0 2% 2%;}
    #selectRegion .regionList ul li a{display:block; font-size:1.4rem; font-weight: normal; padding:7px; color:#fff;}
    #selectRegion .regionList ul li a span{display: none;}
    #selectRegion .regionList ul li a:before{content:attr(data-jis);color:#fff;}
  }



/*-------------------------------------------
breadCrumb
-------------------------------------------*/
#breadCrumb {position: absolute; padding:15px 260px 0; margin-bottom:10px; font-size:1.2rem; clear:both; z-index: 99; top:0;}
#headerWrap + #breadCrumb{padding-top:121px;}
#breadCrumb li{
  float:left; white-space:nowrap;
  margin-right:5px;
  padding-top:3px;
  color:#fff;
  line-height:1.2;
  white-space:normal;
}
#breadCrumb li::before{content:'>'; font-family: verdana,sans-serif; padding:0 3px 0 8px;}
#breadCrumb li:first-child::before{padding-left:0; content:'';}
#breadCrumb li a{color:#fff; text-shadow: 1px 0px 8px #333;}
#breadCrumb li a:hover{text-decoration:none;}

  @media screen and (max-width:768px){
    #breadCrumb {padding:0; margin:0;top: 10px;}
    #breadCrumb li::before{padding: 0 3px;}
    #breadCrumb li a{color:#fff; text-shadow: 1px 0px 5px #333;}
  }


/*-------------------------------------------
contents
-------------------------------------------*/
#contents{background-color:#fff; clear:both;}
#headerWrap + #contents{padding-top:110px;}
#globalNav + #contents{padding-top:151px;}
#contents #main{float:left; width:800px;}

/* sidebar
---------------------------*/
#sidebar{float:right; width:260px;}
#sidebar dl dt{color:#fff; line-height:1.3; font-size:1.8rem;}
#sidebar dl dt a{display:block; padding:15px; background-color:#014099; color:#fff;}
#sidebar dl dt a:hover{background-color:#666; text-decoration:none;}
#sidebar dl > dd > ul{border-bottom:#e5e5e5 1px solid;}
#sidebar dl dd li{border-left:#e5e5e5 1px solid; border-right:#e5e5e5 1px solid; background-color:#fff; font-size:1.4rem;}
#sidebar dl > dd > ul > li:nth-of-type(1){padding-top:5px;}
#sidebar dl dd li a{display:block; padding:7px 20px; line-height:1.4; color:#000; text-decoration:none;}
#sidebar dl dd li a:hover{background-color:#eef4f9;}
#sidebar dl dd li.active a{font-weight:bold; color:#004097;}
#sidebar dl dd li.active li a{font-weight:normal; color:#5c5c5c;}

#sidebar dl dd li ul{margin:-5px 0 0 0;}
#sidebar dl dd li li{border:none;}
#sidebar dl dd li li.active a,
#sidebar dl dd li li li.active li.active a{font-weight:bold; color:#004097;}
#sidebar dl dd li li.active li a,
#sidebar dl dd li li li.active li a{font-weight:normal; color:#5c5c5c;}
#sidebar dl dd li li li.active a{font-weight:bold; color:#004097;}

#sidebar dl dd li li a{padding:5px 10px 5px 40px; background-position:23px 13px;}
#sidebar dl dd li ul ul{padding:0 0 5px;}
#sidebar dl dd li li li a{padding-left:60px; background-position:36px 13px;}
#sidebar dl dd li li li li a{padding-left:66px; background-position:36px 13px;}
#sidebar dl dd li a span.subname{display:block; padding:3px 0 0 0; background:none; font-size:1.2rem;}
#sidebar dl dd li.appear{display:none;}


/* sidebar [contact]
---------------------------*/
#sidebar .contact{margin-top:15px;}
#sidebar .contact a{
  display:block;
  text-align:center;
  padding:18px 10px;
  background-color:#fff;
  border:#eaeaea 1px solid;
  color:#333;
  font-size:14px;
}
#sidebar .contact a:hover{
  color:#fff;
  background-color:#004097;
  text-decoration:none!important;
}

/* sidebar [localNav]
---------------------------*/
#sidebar #localNav{margin-top:15px; border-bottom: none; border-top:#eaeae8 1px solid;}
#sidebar #localNav li{width:auto; border:#eaeae8 1px solid; border-top:none;}
#sidebar #localNav li:nth-of-type(1){padding-top:0px;}
#sidebar #localNav li a{padding:10px 15px;}
#sidebar #localNav li a:hover{background-color:#eef4f9;}

  @media screen and (max-width:768px){
    #headerWrap + #contents,
    #globalNav + #contents{padding-top:50px!important;}
    #contents #main{float:none; width:100%;}
    #contents #sidebar{float:none; width:100%; margin-top:30px;}
    #sidebar dd ul li{display:none;}
    #sidebar dd ul li.appear{display:block!important;}
    #sidebar dd ul li.appear li{display:block!important;}
    #sidebar #localNav li{display:block;}
    #sidebar dl dd li a span.subname{display:inline; padding-left:5px;}
    #sidebar nav{padding:10px; background-color:#f0f0f0; border:#eaeaea 1px solid;}
    #sidebar .contact a{padding:10px; height:auto;}
    #sidebar .contact a:hover{background-color:#014099; color:#fff;}
  }


/* ------------------------------------------
footer
--------------------------------------------- */
footer{padding:30px 0 33px; clear:both; font-size:1.2rem; text-align: center;background-color: #3a5a8a;color: #fff;}
footer .footLinks li{display:inline-block; line-height:1.5;}
footer .footLinks li a{padding:0 10px 0 20px; color:#fff;}
footer #copyright{width:auto; margin:0 auto; font-family: Helvetica, Arial,sans-serif; font-size: 10px;}
footer #groupLogo{margin:60px auto 12px;}
footer #groupLogo img{width:270px;}
footer .siteLogo {font-size: 14px; font-weight: bold;}
footer .siteLogo img{width:272px;}
footer .contactInfo{margin:35px auto 55px;}

@media screen and (max-width:767px){
  footer .contactInfo{margin:10px auto 50px;}
}

/* footerNav
---------------------------*/
body#sitemap #footerNav{display: none;}
#footerNav{text-align: left; padding:0 30px;}
#footerNav + .footLinks{margin-top:30px;}
#footerNav a{color:#000;}
#footerNav > ul.parentNav{
  position: relative;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -moz-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap:nowrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  justify-content:center;
}
#footerNav > ul.parentNav > li{padding:0 20px;}
#footerNav > ul.parentNav > li > a{display: none;}
#footerNav .subGnav .category .heading{display: inline-block; font-size: 1.8rem; font-weight: bold; margin-bottom:10px; line-height: 1.2;}
#footerNav .subGnav .category .outline{display: none;}
#footerNav .subGnav .menus .top{display: none;}
#footerNav .subGnav .menus a{color:#5e5e5e; font-size: 1.4rem;}

/* pagetop
---------------------------*/
#pagetop {
  position: fixed;
  bottom: 20px;
  right: 100px;
  z-index: 2;
}
#pagetop a {
  width: 50px;
  height: 50px;
  display: block;
  text-indent: 100%;
  background: rgba(255, 255, 255, 1);
  border-radius: 50%;
  position: relative;
  text-align: center;
  border: 1px solid #3a5a8a78;
}
#pagetop a::after {
  content: "";
  border: solid #3a5a8a;
  border-width: 0 4px 4px 0;
  display: block;
  position: absolute;
  top: 20px;
  left: 18px;
  padding: 4px;
  transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

  @media screen and (max-width:767px){
    footer{padding:20px; margin-top: 20px;}
    footer #footerInner p#copyright{color:#999;}
    footer #footerNav{display: none;}
    #footerNav + .footLinks{margin-top:0;}
    footer .footLinks{margin:0;}
    footer .footLinks li{display:block; border:none; margin-bottom: 5px; font-size: 12px;}
    footer .footLinks li:first-child{border:none;}
    footer .footLinks li a{padding:2px;}
    footer #copyright{width:auto; font-size:10px;}
    footer #groupLogo {margin: 0; padding: 20px 0 10px;}
    footer #groupLogo img{width:72.5vw;}
    #pagetop {right: 10px;}
    footer, footer *, .footerNav, .footerNav * {font-size: 12px;}
  }


/*-------------------------------------------
popup page
-------------------------------------------*/
/* wrapper
---------------------------*/
body.popup #wrapper{
  width:1080px;
  margin:0 auto;
  text-align:left;
}

/* header
---------------------------*/
body.popup header{position:fixed; z-index:101; background-color:#fff; width:1080px; padding:20px 0; top:0; border-bottom:#eaeaea 1px solid;}
body.popup header p{float:left;}
body.popup header .siteLogo{padding:14px 0 0 25px;}
body.popup header .siteLogo a img{vertical-align: top;}
body.popup header .offleft{float:right; margin:10px 0 0;}
body.popup header .offleft a{
  position: relative;
  display: block;
  width: 38px;
  height: 38px;
  transition:opacity .3s ease-out;
}
body.popup header .offleft a:before,
body.popup header .offleft a:after {
  content: '';
  position: absolute;
  top: 17px;
  width: 38px;
  height: 2px;
  background-color: #333;
}
body.popup header .offleft a:before{
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
body.popup header .offleft a:after{
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
body.popup header .offleft a:hover{opacity:0.5;}
body.popup header .groupLogo img{width:68px;}

/* content
---------------------------*/
body.popup #contents{padding-bottom:20px; min-height: 650px;}
body.popup header + #contents{padding:103px 0 20px;}
body.popup header + #breadCrumb{padding:123px 0 0;}
body.popup h1{
  border:none;
  padding:0;
  color:#014099;
  font-weight:bold;
  margin:50px 0 15px;
  line-height:1;
  text-align:center;
}
body.popup .conBlock{width:900px; margin:0 auto 20px; text-align:center;}
body.popup .conBlock .color{color:#014099;}
body.popup .conBlock02{width:900px; margin:0 auto 20px;}
body.popup .conBlock02 ul{padding:25px 30px; border:1px solid #e7e7e7; text-align:left;}
body.popup .conBlock02 li{padding-left:1em; text-indent:-1em;}
body.popup .conBlock03{text-align:center;}
body.popup .conBlock03 .inqBtn a{display:inline-block; padding:8px 20px; background-color:#014099; color:#fff; font-size:1.8rem; font-weight:bold;}
body.popup .conBlock03 .inqBtn a:hover{text-decoration:none; background-color:#00265b;}
body.popup .pageTop{text-align:right;}

@media screen and (max-width:767px){
  body.popup #wrapper{width:100%; min-width:320px; background-color:#fff;}
  body.popup header{width:100%; height:50px; padding:0 0 0 12.5px; box-sizing: border-box;}
  body.popup header .groupLogo{float:left; padding-top:15px;}
  body.popup header .groupLogo img{width: 73px; vertical-align: top;}
  body.popup header .siteLogo{float:left; margin:0; padding:20px 0 0 8px;}
  body.popup header .siteLogo img{vertical-align:middle;}
  body.popup header .offleft{margin:15px 10px 0 0;}
  body.popup header .offleft a{position:relative;display:block;width:22px;height:22px;}
  body.popup header .offleft a:before,
  body.popup header .offleft a:after{top:10px;width:20px;height:2px;}
  body.popup #contents{padding:0 10px; min-height: 0;}
  body.popup header + #contents{padding:50px 10px 20px;}
  body.popup header + #breadCrumb{padding:50px 0 0;}
  body.popup h1{margin:20px 0 15px;}
  body.popup .conBlock{width:100%;}
  body.popup .conBlock02{width:100%;}
  body.popup .conBlock02 ul{padding:15px;}
  body.popup .conBlock03{padding-bottom:30px;}
  body.popup .conBlock03 a{display:block; width:80%; margin:0 auto; padding:10px; background-color:#013e94; color:#fff; font-size:1.8rem;}
  body.popup .conBlock03 a img{display:none;}
}


/*-------------------------------------------
clearfix
-------------------------------------------*/
.clearfix:after,
header:after,
header #logo:after,
#regionLang:after,
#globalNav ul:after,
#breadCrumb ul:after,
#contents:after,
footer:after,
footer ul:after{content:''; display:block; clear:both; height:0; overflow:hidden;}



/* mutiple line */
.gnavMultipleLines #gnavOverlay{top:171px;}
.gnavMultipleLines #globalNav{height:61px;}
.gnavMultipleLines #globalNav ul li .subGnav{top:61px;}
.gnavMultipleLines #breadCrumb{padding-top:171px;}



/*-------------------------------------------
Icon fonts
-------------------------------------------*/
@font-face {
  font-family: 'svgicon';
  src:
    url('../fonts/svgicon.ttf') format('truetype'),
    url('../fonts/svgicon.woff') format('woff'),
    url('../fonts/svgicon.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"]::before,
[class*=" icon-"]::before,
#funcBtns li#searchOpen span::before,
#funcBtns li#regionOpen span::before,
ul.iconLink li.newWindow a::after,
a.newWindow::after,
span.newWindow::after,
.row [class^="col"].linkBlank::after,
.productDetail .toBrandSite a::after,
.linksWrap ul li.icon a::after,
#globalNav ul li .subGnav .menus ul li.blank a::after,
#gNavSP ul li .subGnav .menus ul li.blank a::after{
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'svgicon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-employee::before {content: "\e901";}
.icon-mail::before {content: "\e902";}
.icon-pdf::after {content: "\e920"; color: red; font-size: 120%; display: inline-block; vertical-align: top; text-decoration: none; padding: 0 5px;}
.icon-general::before{content:"\e900";}
.icon-heading::before{content:"\e903";}
.icon-links::before{content:"\e904";}
.icon-lists::before{content:"\e905";}
.icon-table::before{content:"\e906";}
.icon-box::before{content:"\e907";}
.icon-button::before{content:"\e908";}
.icon-lump::before{content:"\e909";}
.icon-grid::before{content:"\e914";}
.icon-news::before{content:"\e911";}
.icon-map::before{content:"\e916";}
.icon-keyvisual::before{content:"\e917";}
.icon-tab::before{content:"\e918";}
.icon-accordion::before{content:"\e910";}
.icon-modal::before{content:"\e912";}
.icon-video::before{content:"\e913";}

h1 i[class*="icon-"]::before {
    display: inline-block;
    padding-left: 10px;
    vertical-align: baseline;
    color: #FFF;
}

#funcBtns li#searchOpen span::before{content: "\e906"; font-size:20px; color:#83979d;}
#funcBtns li#regionOpen span::before{content: "\e900"; font-size:20px; color:#83979d;}

/* other window */
ul.iconLink li.newWindow a::after,
a.newWindow::after,
span.newWindow::after,
.row [class^="col"].linkBlank::after,
.linksWrap ul li.icon a::after,
#globalNav ul li .subGnav .menus ul li.blank a::after{content: "\e907"; padding-left:10px; color:#999;}
#globalNav ul li .subGnav .menus ul li.blank a::after{font-size:14px;}
#gNavSP ul li .subGnav .menus ul li.blank a::after{content: "\e907"; color:#fff;}
.productDetail .toBrandSite a::after{
  content: "\e907";
  position: absolute;
  top:40%;
  right:5%;
  color:#999;
}
.productDetail .toBrandSite a:hover::after{color:#fff;}

.row [class^="col"].linkBlank{line-height: inherit;}
.row [class^="col"].linkBlank::after{
  position: absolute;
  right:15px;
  bottom:15px;
  width:14px;
  height:14px;
}

  @media screen and (max-width:767px){
    ul.iconLink li.newWindow a::after,
    ul.iconLink.notChange li.newWindow a::after,
    .linksWrap ul li.icon a::after{
      top:32%; right:4%;
      width:inherit;
      height:inherit;
      border-top:none;
      border-right:none;
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
      content: "\e907"; padding-left:0; color:#999;
    }
    ul.iconLink.notChange li.newWindow a{
      background-color: inherit;
    }
    ul.iconLink.notChange li.newWindow a::after{
      position: relative;
      right:0;
      padding-left:10px;
    }
  }

#searchSet {display: none;}
/* Dropdown Navigation (Hidden by Default) */
#globalNav.type02 ul.parentNav {position: relative; float: right;}
.dropdown-content {display: none; position: absolute; background-color: #fff; min-width: 140px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1;top: 1s.5vw; padding: 20px 10px;}
.dropdown-content a {color: #999999 !important; padding: 12px 16px; text-decoration: none; display: block;}
.dropdown-content a:hover {color: #014099 !important; padding: 12px 16px; text-decoration: none; display: block;}
.dropdown-content a.active {color: #014099 !important;}
.dropdown:hover .dropdown-content {display: block;}


@media only screen and (max-width:768px) {
  #gNavSP ul li:not(.dropdown) a:before {content: none;}
  #gNavSP ul li a {display: block; font-family: 'Noto Serif JP', sans-serif; font-size: 1.6rem;}
  #gNavSP ul .dropdown > a {display: inline-block;}
  .dropdown-content a:hover {background-color: #cfe8ff8c; }
  .dropdown-content {position: relative; background-color: #fff; min-width: 140px; box-shadow: none; top: 0; padding: 0; margin-top: 15px;}
  .dropdown-content a {padding: 15px 30px !important;}
  .dropdown-content a:first-child {border-top: #ccc 1px solid !important;}
  .dropdown-content a + a {border-top: #ccc 1px solid !important;}
}

/* ---------------------------------------------------------
TEMPLATE Pattern
---------------------------------------------------------- */
.temp .container .fluid3 {width: 50%; margin: 0 auto;}
.h2Type02 {font-size: 3.2rem; font-family: Helvetica; line-height: 1.1;text-align: center;  margin: 0 0 30px 0;}
.h2Type02::after {content: ''; display: block; margin: 10px auto 0; width: 50px; height: 3px; background-color: #0d2355;}
.tempModules {margin: 100px 0 0 0;}
.moduleList ul {width: 100%;}
.moduleList ul li {
  width: 19.6%;
  float: left;
  text-align: center;
  padding: 7%;
  background-color: #ECECEC;
  cursor: pointer;
  transition: all .3s ease;
  position: relative;
  margin-bottom: 0.5%;
}
.moduleList ul li + li {
  margin-left: 0.5%;
}
.moduleList ul li:nth-child(5n + 6) {
  margin-left: 0;
}
.moduleList ul li[class*="icon-"]::before {
  font-size: 50px;
  color: #014099;
  display: block;
  transition: all .3s ease;
}
.moduleList ul li:hover {
  background-color: rgba(10, 54, 125, 0.9);
}
.moduleList ul li:hover a {
  color: #FFF;
  text-decoration: none;
}
.moduleList ul li:hover::before {
  color: #FFF;
  transition: all .3s ease;
  transform: scale(1.2);
}
.moduleList ul li a {
  transition: all .3s ease;
  color: #666666;
  cursor: pointer;
  font-weight: 700;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  text-transform: capitalize;
}
.moduleList ul li a span {
  padding-top: 45%;
}
@media screen and (max-width: 768px) {
  ._modules #breadCrumb {top: 20px;}
  .h2Type02 {font-size: 2.6rem; margin: 0 0 6%;}
  .h2Type02::after {width: 30px; height: 2px;}
  .tempModules {margin: 50px 0 0 0;}
  .moduleList ul li[class*="icon-"]::before {font-size: 8vw;}
  .moduleList ul li, .moduleList ul li:nth-child(5n + 6) {
    width: 49%;
    margin-left: 0;
    margin-bottom: 2%;
    padding: 16vw;
  }
  .moduleList ul li + li {
    margin-left: 2% !important;
  }
  .moduleList ul li:nth-child(2n + 3) {
    margin-left: 0 !important;
  }
  .moduleList ul li:last-child {
    margin-bottom: 0;
  }
}

.FrameHeading2:first-of-type {
  margin-top: 0;
}
.FrameHeading2{
  position: relative;
  display: inline-block;
  padding: 10px 45px;
  margin:60px 0 15px 20px;
  font-size:2rem;
  font-weight:bold;
}
.FrameHeading2::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 15px;
  height: 70px;
  background-color: #0a367d;
  transform: skewX(-30deg);
}
.FrameHeading3{
  font-size:2rem;
  font-weight:bold;
  margin:40px 0 20px;
}
.FrameHeading4{
  font-size:1.8rem;
  font-weight:bold;
  margin:30px 0 10px;
}

[class*='FrameHeading'] {
  line-height: 1.8;
}
[class*='FrameHeading'] i {
  display: block;
  font-size: 14px;
  font-style: inherit;
  color: #999;
  font-weight: 400;
}

/*--------------------------------------------------
code
--------------------------------------------------*/

/* ========================
//#google-prettify-monokai-theme
//#Version: 0.3
//#Author: RaphaelDDL
//#Github: https://github.com/RaphaelDDL/google-prettify-monokai-theme/
//For use with Google Code Prettify, HTML Syntax only
//======================== */

pre .str, code .str { color: #e6db5a; } /* string */
pre .kwd, code .kwd { color: #66d9ef; } /* keyword */
pre .com, code .com { color: #75715e; font-style: italic; } /* comment */
pre .typ, code .typ { color: #66d9ef; } /* type */
pre .lit, code .lit { color: #ae81ff; } /* literal */
pre .pun, code .pun { color: #fff; } /* punctuation */
pre .pln, code .pln { color: #fff; } /* plaintext */
pre .tag, code .tag { color: #f92672; } /* html/xml tag */
pre .atn, code .atn { color: #a6e22a; } /* html/xml attribute name */
pre .atv, code .atv { color: #e6db74; } /* html/xml attribute value */
pre .dec, code .dec { color: #ae81ff; } /* decimal */

pre.prettyprint, code.prettyprint {
  background-color: #394034;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  -khtml-border-radius: 8px;
  border-radius: 8px;
  font-family: consolas, menlo, courier, monospace;
}

pre.prettyprint {
  width: 100%;
  margin: 1em auto;
  padding: 30px;
  white-space: pre-wrap;
}

pre.prettyprinted {
  /*box-shadow:inset 0 0 1px 2px #3c3d39, 0 0 15px rgba(0,0,0,0.5);
  border:1px solid #0b0c0a;*/
}

h2 + pre.prettyprint,
h3 + pre.prettyprint{margin-top:1rem;}

@media screen and (max-width:767px){
  .FrameHeading2 {font-size: 1.8rem; padding: 10px 35px; margin: 30px 0 20px 20px;}
  .FrameHeading3 {font-size: 1.6rem; margin: 20px 0 10px;}
  pre.prettyprint {margin: 1em auto 0; padding: 10px;}
  #_moduleKV pre.prettyprint {display: none;}
  .codewrap li {font-size: 12px;}
}

/* ------------------------
//Section: class 'linenums' for line numbering
//------------------------ */
ol.linenums {
  margin-top: 0;
  margin-bottom: 0;
  color: #75715e;
  list-style: decimal inside !important;
} /* IE indents via margin-left */


/* =============================================
//Section: Print Styles (partially from Sunburn Theme)
//================================================ */
@media print {
  pre.prettyprinted, pre.prettyprint, code.prettyprint {
    background-color:#394034;
    color:#fff;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    -o-border-radius:0;
    -ms-border-radius:0;
    -khtml-border-radius:0;
    border-radius:0;
  }

  pre .str, code .str { color: #060; }
  pre .kwd, code .kwd { color: #006; font-weight: bold; }
  pre .com, code .com { color: #600; font-style: italic; }
  pre .typ, code .typ { color: #404; font-weight: bold; }
  pre .lit, code .lit { color: #044; }
  pre .pun, code .pun { color: #440; }
  pre .pln, code .pln { color: #000; }
  pre .tag, code .tag { color: #006; font-weight: bold; }
  pre .atn, code .atn { color: #404; }
  pre .atv, code .atv { color: #060; }
}


.codewrap {
  margin: auto;
  position: relative;
  box-sizing: border-box;
  background-color: #394034;
  color: #f8f8f2 !important;
  display: block;
  line-height: 1.4;
  margin:2rem 0;
  padding: 30px 20px;
  text-align: left;
  overflow: auto;
  resize: horizontal;
  /*z-index: 2;*/
  border: 0;
  border-radius: 8px;
  vertical-align: 0;
  /*font-family: "SFMono-Regular", Consolas,'Courier New',Courier,Monaco,monospace;*/
  font-size: 14px !important;
  font-weight: 500;
}

.codewrap li{
  /*background-color: #394034!important;*/
  padding-left: 24px;
  border-left: 1px solid #75715e;
  margin-left: 36px;
  line-height: 1.4;
  list-style-type: decimal !important;
  list-style-position: outside;
  font-size: 14px;
}