@charset "utf-8";
/*===========================================
original.css INDEX
===========================================*/

@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700');

#contents{
  line-height: 1.7;
  font-weight: 400;
}

button {
  outline: none!important;
}
sup {
  font-size: 90%;
  vertical-align: top;
  position: relative;
  top: 0em;
}

_::-webkit-full-page-media, _:future, :root sup {
  font-size: 60%;
  vertical-align: top;
  position: relative;
  top: 0.2em;
}


/*--------------------------------------------------
header logo adjust
--------------------------------------------------*/
header #logo .siteLogo img,
body.popup header .siteLogo a img{width:320px;}

@media screen and (max-width:767px){
  header #logo .siteLogo img,
  body.popup header .siteLogo a img{width:160px;}
}


/*--------------------------------------------------
container (adjust col margin)
--------------------------------------------------*/
/*@media screen and (min-width:768px){
  .row {
    margin-right: -20px;
    margin-left: -20px;
  }
  .row > [class*="col"] {
    padding-left: 20px;
    padding-right: 20px;
  }
  .row + .row{
    margin-top:40px;
  }
}*/


/*--------------------------------------------------
notes iframe Height
--------------------------------------------------*/
.iframePress{height:300px;}

@media screen and (max-width:767px){
  .iframePress{height:200px;}
}


/*--------------------------------------------------
general class
--------------------------------------------------*/
/* category header
----------------------------------*/
div.category_header {
  height: 260px;
  background: #004091;
  color: #FFF;
  margin: 30px 0 35px;
  position: relative;
}
div.category_header h1 {
  font-size: 2em;
  font-weight: bold;
  position: absolute;
  bottom: 40px;
  left: 50px;
  line-height: 1.2;
  padding:0;
}

div.category_header p.category_no {
  font-size: 6em;
  font-family: 'Roboto',sans-serif;
  font-weight: 100;
  position: absolute;
  top: 30px;
  right: 30px;
  line-height: 1.0;
}
div.category_header.solutions {
  background: #004091 url(/images/hdr_icon_solutions.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.technology {
  background: #004091 url(/images/hdr_icon_technology.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.powertrain {
  background: #004091 url(/images/hdr_icon_powertrain.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.lightweight {
  background: #004091 url(/images/hdr_icon_lightweight.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.safety {
  background: #004091 url(/images/hdr_icon_safety.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.comfort {
  background: #004091 url(/images/hdr_icon_comfort.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.rd {
  background: #004091 url(/images/hdr_icon_rd.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.news {
  background: #004091 url(/images/hdr_icon_news.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.contact {
  background: #004091 url(/images/hdr_icon_contact.png) no-repeat 47px 50px;
  background-size: 87px;
}
div.category_header.applications {
  background: #004091 url(/images/hdr_icon_applications.png) no-repeat 47px 50px;
  background-size: 87px;
}

p.category_lead {
  text-align: center;
  margin-bottom: 35px;
}
div.lead_text p {
  text-align: center;
  margin-bottom: 65px;
}

  @media(min-width: 769px) {
    div.category_header h1 br {display: none;}
  }

  @media(max-width: 768px) {
    div.category_header {
      height: 43vw;
      background: #004091;
      color: #FFF;
      margin: 10px -10px 20px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: end;
          -ms-flex-align: end;
              align-items: flex-end;
    }
    div.category_header h1 {
      position: static;
      width: 55vw;
      padding: 0 0px 5vw 5vw;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
    }
    div.category_header.solutions {
      background: #004091 url(/images/hdr_icon_solutions.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.technology {
      background: #004091 url(/images/hdr_icon_technology.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.powertrain {
      background: #004091 url(/images/hdr_icon_powertrain.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.lightweight {
      background: #004091 url(/images/hdr_icon_lightweight.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.safety {
      background: #004091 url(/images/hdr_icon_safety.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.comfort {
      background: #004091 url(/images/hdr_icon_comfort.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.rd {
      background: #004091 url(/images/hdr_icon_rd.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.news {
      background: #004091 url(/images/hdr_icon_news.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.contact {
      background: #004091 url(/images/hdr_icon_contact.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header.applications {
      background: #004091 url(/images/hdr_icon_applications.png) no-repeat 20px 20px;
      background-size: 17vw;
    }
    div.category_header p.category_no {
      font-size: 14vw;
      top: 20px;
      right: 20px;
    }

    p.category_lead,
    div.lead_text p {
      text-align: left;
      margin-bottom: 50px;
    }
  }







