@charset 'UTF-8';
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{text-decoration:none}ins,mark{background-color:#ff9;color:#000}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}button{background:0;border:0;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}img{max-width: 100%;height:auto;vertical-align:bottom}

html {
  height: 100%;
  font-size: 62.5%;
  background-color: #fff;
}
body {
  min-width: 320px;
  height: 100%;
  line-height: 1.7;
  color: #464646;
  font-family: Noto Sans JP, sans-serif, "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
  font-weight: 400;
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 0em;
  overflow-wrap: break-word;
}
sup {
  vertical-align: top;
  font-size: smaller;
}
sub {
  vertical-align: baseline;
  font-size: smaller;
}

.en { font-family: "Century Gothic", sans-serif; }
.c_red { color: #f44336; }
.c_blue { color: #0e5a95; }


@media screen and (max-width:750px) {
  .pcDisp{display: none !important;}
}
@media screen and (min-width:751px) {
  .spDisp{display: none !important;}
  body {
    min-width: 1200px;
    font-size: 16px;
    font-size: 1.6rem;
  }
}
/* header */
header {
  display: block;
  position: fixed;
  top: 0;
  width: 100%;
  border-top: 3px solid #adadad;
  z-index: 1000;
  background-color: #fff;
}
header:before {
  position: absolute;
  top: -3px;
  left: 0;
  width: 20px;
  height: 3px;
  background-color: #ff0000;
  content: '';
}
header .header-logoarea {
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: space-between;
}
header .right-logo { font-size: 12px; } 
header .right-logo a {
  color: #333333;
  text-decoration: none;
}

@media screen and (min-width:751px) {
  body { padding-top: 84px; }
/* header */
  header {
    border-top: 5px solid #adadad;
    border-bottom: 1px solid #d8d8d8;
    transition: all 0.5s;
  }
  header:before {
    top: -5px;
    width: 30px;
    height: 5px;
  }
  header .header-logoarea {
    align-items: flex-end;
    width: 1040px;
    margin: 0 auto;
    padding: 21px 0 25px 30px;
  }
  header .logo { width: 172px; }
  header .right-logo {
    margin-bottom: -6px;
    letter-spacing: 0.6px;
  } 
  header .right-logo a:hover { color: #707070; }
  .btn-trigger { display: none; }

  /* nav */
  .siteNav {
    display: block !important;
    width: 280px;
  }
  .home .siteNav,
  .siteNav_link { display: none !important; }
  .siteNav h2 {
    margin-bottom: .8em;
    font-size: 2.4rem;
    font-weight: 400;
    text-align: center;
    letter-spacing: 2px;
    color: #045f98;
  }
  .archive .siteNav h2 { color: #fff; }
  .siteNav .siteNav_menu + .siteNav_menu { margin-top: 40px; }
  .lnav { font-size: 1.4rem; }
  .lnav > li + li { margin-top:16px; }
  .lnav > li {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .lnav > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 280px;
    height: 56px;
    padding: 8px 32px;
    color: #fff;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .05em;
    text-align: center;
    text-decoration: none;
    border-radius: 28px;
    background-color: #1d95d5;
    transition: background-color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .archive .lnav > li > a {
    border: 2px solid #fff;
    background-color: transparent;
  }
  .lnav > li > a:hover,
  .electric .lnav > .lnav_electric > a,
  .thermal .lnav > .lnav_thermal > a,
  .material .lnav > .lnav_material > a,
  .sensing .lnav > .lnav_sensing > a,
  .other .lnav > .lnav_other > a { background-color: #0F5A95; }
  .lnav > li.lnav_contact > a {
    border: 0;
    background-color: #EF4444;
  }
  .lnav > .lnav_contact > a:hover {
    border: 0;
    background-color: #DB3030;
  }

/* pagetop */
  .pageTop {
    position: fixed;
    bottom: 90px;
    right: 46px;
  } 
  .pageTop > a > img { width: 55px; } 
 
/* footer */
  footer {
    font-size: 1.4rem;
    background-color: #ebebeb;
    border-top: 5px solid #adadad;
    position: relative;
  } 
  footer:before {
    height: 5px;
    position: absolute;
    top: -5px;
    left: 0;
    width: 30px;
    background-color: #ff0000;
    content: "";
  } 
  footer .footer-inner {
    width: 1040px;
    margin: 0 auto;
    padding: 6px 0 9px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
  } 
  footer .footer-inner > ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
  } 
  footer .footer-inner > ul > li > a {
    border-left: 1px solid #080808;
    color: #004ecc;
    display: inline-block;
    line-height: 1;
    padding: 0 15px;
    font-size: 13px;
    text-decoration: none;
  } 
  footer .footer-inner > ul > li:first-of-type > a { padding: 0 15px; } 
  footer .footer-inner > ul > li:nth-of-type(2) > a { padding: 0 14px 0 20.5px; } 
  footer .footer-inner > ul > li:last-of-type > a {
    border-right: 1px solid #080808;
    padding: 0 15px 0 21.5px;
  } 
  footer .footer-inner > ul > li > a:hover { text-decoration: underline; } 
  footer .footer-inner > p { margin-top: -4px; } 
  footer .footer-inner > p > img { width: 383px; }
}
@media screen and (max-width:750px) {
  body { padding-top: 68px; }
  header {
    border-top: 3px solid #adadad;
    height: 68px;
  }
  header:before {
    top: -3px;
    width: 20px;
    height: 3px;
  }
  header .logo { 
    margin: 17px 0 0 17px;
    width: 140px;
  }
  header .right-logo { padding: 32px 17px 0 0; }
  /* btn */
  header .btn-trigger {
    position: relative;
    width: 35px;
    height: 26px;
    cursor: pointer;
  }
  header .btn-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #080808;
    border-radius: 4px;
  }
  header .btn-trigger,
  .btn-trigger span {
    position: absolute;
    top: 21px;
    right: 20px;
    display: inline-block;
    transition: all .5s;
    box-sizing: border-box;
  }
  header .btn-trigger span:nth-of-type(1) { top: 0; }
  header .btn-trigger span:nth-of-type(2) { top: 11px; }
  header .btn-trigger span:nth-of-type(3) { bottom: 0; }
  header .btn-trigger.active span:nth-of-type(1) {
    height: 3px;
    -webkit-transform: translateY(9px) rotate(-45deg);
    transform: translateY(9px) rotate(-45deg);
  }
  header .btn-trigger.active span:nth-of-type(2) {
    opacity: 0;
  }
  header .btn-trigger.active span:nth-of-type(3) {
    height: 3px;
    -webkit-transform: translateY(-14px) rotate(45deg);
    transform: translateY(-12px) rotate(45deg);
  }
  /* nav */
  .siteNav {
    position: fixed;
    top: -100vh;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: auto;
    color: #fff;
    background-color: #000;
    transition: .5s;
    z-index: 900;
  }
  .siteNav.in{
   transform: translateY(100%);
   position: fixed;
   transition: .5s;
   height: 100vh;
   overflow: auto;
   padding-top: 68px;
  }
  .siteNav h2 {
    padding: 20px 10px 0;
    text-align: center;
    font-size: 1.8rem;
  }
  .siteNav a {
    color: #ffffff;
    text-decoration: none;
  }
  .siteNav a:visited { color: #fff; }
  .siteNav_link > ul { display: flex; }
  .siteNav_link > ul > li { 
    width: 50%;
    text-align: center;
    border-bottom: 1px solid #3c3c3c;
  }
  .siteNav_link > ul > li:nth-child(even) { 
    border-left: 1px solid #3c3c3c;
  }
  .siteNav_link > ul > li > a {
    display: block;
    padding: 20px 10px;
  }
  .siteNav_menu > ul { padding: 0 20px; }
  .siteNav_menu > ul > li { border-bottom: 1px solid #3c3c3c; }
  .siteNav_menu > ul > li > a {
    position: relative;
    display: block;
    padding: 20px 10px 20px 20px;
  }
  .siteNav_menu > ul > li > a:before {
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(45deg);
    content: '';
  }

  /* footer */
  footer {
    border-top: 5px solid #adadad;
    padding-bottom: 19px;
    position: relative;
  } 
  footer:before {   
    background-color: #ff0000;
    content: "";
    display: inline-block;
    height: 5px;
    left: 0;
    position: absolute;
    top: -5px;
    width: 30px;
  } 
  footer .footer-inner > ul > li {
    background-color: #d8d8d8;
    border-bottom: 1px solid #adadad;
  } 
  footer .footer-inner > ul > li > a {
    color: inherit;
    display: block;
    padding: 24px 20px;
    position: relative;
    text-align: center;
    text-decoration: none;
    font-size: 12px;
  } 
  footer .footer-inner > ul > li > a:before {
    position: absolute;
    right: 20px;
    top: 45%;
    border: 0;
    content: "";
    display: inline-block;
    height: 8px;
    width: 8px;
    border-right: solid 1px #dd0000;
    border-top: solid 1px #dd0000;
    transform: rotate(45deg);
  } 
  footer .footer-inner > p {
    text-align: center;
    margin: 3px 0 29px;
  } 
  footer .footer-inner > p > img { width: 280px; } 

  /* pagetop */
  footer .footer-inner .pagetop-sp { text-align: center; } 
  footer .footer-inner .pagetop-sp > a { display: block; } 
  footer .footer-inner .pagetop-sp > a:before {
    border: 0;
    content: "";
    display: inline-block;
    height: 22px;
    position: relative;
    width: 22px;
    border-right: solid 1px #111111;
    border-top: solid 1px #111111;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}