@charset "UTF-8";


/*! CSS Used from: /css/product/electricpropulsion/electricpropulsion.css */
#content .content-header{height:690px;}
#content .content-header{background-image:url(../../../img/product/electricpropulsion/bg_header_index.jpg.webp)}
#content .content-header .content-header__inner .txt .bg-gray .br1{display:inline;}
@media screen and (max-width: 1000px) {
  #content .content-header{height:calc(300px * 1.6);}
}
@media screen and (max-width: 900px) {
  #content .content-header{height:calc(300px * 1.53);}
  #content .content-header .content-header__inner .content-header__txt {
    padding: 16px 10px 10px 51px;
  }
}
@media screen and (max-width: 700px) {
  #content .content-header{height:calc(200px * 1.7);}
}
@media screen and (max-width: 500px) {
  #content .content-header{height:calc(200px * 1.3);}
  #content .content-header{background-image:url(../../../img/product/electricpropulsion/bg_header_index_sp.jpg.webp)}
  #content .content-header .content-header__inner .content-header__txt {
    padding: 0px 10px 10px 29px;
  }
}


/*
  layout
----------------------------------------- */
section.content-section {
  padding:60px 0px 80px;
}
.content-section *{
  box-sizing: border-box;
}
.content-section > *{
  padding-left:30px;
  padding-right:30px;
}
.col2{
  display: flex;
  justify-content: space-between;
}
.border-gray{
  border: solid #ededed 21px;
  border-top: solid #ededed 24px;
  border-bottom: solid #ededed 24px;
  padding:30px;
  text-align: center;
}
.border-navy{
  border: solid #11335f 21px;
  padding:50px 30px 30px;
  text-align: center;
}
@media screen and (max-width: 700px) {
  .border-gray{
    border: solid #ededed 10px;
    border-top: solid #ededed 20px;
    border-bottom: solid #ededed 20px;
    padding:30px;
  }
}
/*
  typography
----------------------------------------- */
.copy{
  font-size:25px;
  text-align: center;
  font-weight: 900;
  margin-bottom:40px;
}
.copyB{
  font-size:25px;
  text-align: center;
  font-weight: 900;
  margin-bottom:44px;
  color:#0c76bb;
}
.ttl--lv1.underline--lv1 {
  padding: 0px 0px 9px;
  border-left: none;
  margin: 16px 0px 50px;
  line-height: 1.5;
  background: url(/img/common/underline--lv1.svg) no-repeat bottom center;
  background-size: 250px 2px;
  text-align: center;
}
.ttl--lv2.bg-green{
  display: block;
  text-indent:0px;
  margin:54px auto 25px;
  text-align: center
}
.ttl--lv2.bg-green .ttl-name{
  display: inline-block;
  background-color: #a0c02e;
  color:#11335f;
  padding:9px 16px;
  font-size:20px;
}
.border-gray + .ttl--lv2.bg-green{
  margin-top:70px;
}
.ttl--figure{
  background-color: #11335f;
  color:#fff;
  padding:7px 10px;
  display: inline-block;
  font-size:17px;
  font-weight: 500;
  min-width: 11.1em;
}
.ttl-list{
  font-size:30px;
  background-color: #0c76bc;
  color:#fff;
  padding:5px 10px;
  display: inline-block;
  font-weight: 900;
}
.ttl-listB{
  color:#0c76bb;
  font-weight: 900;
  font-size:21px;
}
section .ttl_section{
  background: url(/img/common/underline--lv2.svg) no-repeat bottom center;
  background-size: 150px 4px;
  line-height: 1.4;
}
.content-section .txt{
  font-size:16px;
  margin:50px auto;
  max-width:1160px;
}
.marker {
  background: linear-gradient(transparent 80%, #ffff00 80%);
  background-position-y: -6px;
}
.term{
  display: inline-block;
}
@media screen and (max-width: 500px) {
  .copyB{
    font-size:22px;
  }
  .ttl--lv2.bg-green .ttl-name{
    padding:9px 5px;
  }

}


/*
  .sec0
----------------------------------------- */
.content-section.sec0{
  background:url(../../../img/product/electricpropulsion/bg_sec0.jpg.webp) no-repeat center center;
  background-size: cover;
  color:#fff;
  padding:40px 35px 37px;
}
.content-section.sec0 .img17{
  margin:11px 0px 28px;
  text-align: left;
}
.content-section.sec0 .txt{
  margin:20px 0 17px;
  line-height: 1.7;
}
.content-section.sec0 .txt + .txt{
  margin:17px 0;
}
.content-section.sec0 .txt .bg-navy{
  background-color:rgba(17,51,95,0.68);
  padding:0px 0px 0px 2px;
}
@media screen and (max-width: 500px) {
  .content-section.sec0{
    background:url(../../../img/product/electricpropulsion/bg_sec0_sp.jpg.webp) no-repeat center center;
    background-size: cover;
    padding:20px 20px 15px;
  }
  .content-section.sec0 > *{
    padding:0px;
  }
}
/*
  .sec1
----------------------------------------- */
.content-section.sec1{
  padding:62px 0px 8px;
}
.sec1 .copy .br1,
.sec1 .copy .br2{
  display: none;
}
.img01{
  position: relative;
}
.img01-2{
  position: relative;
  max-width:840px;
  width:100%;
  margin:auto;
}
.img01-2 .bg{
  position: absolute;
  right:-30px;
  bottom:-10px;
}
.img01-2 .img{
  position: absolute;
  right:-30px;
  bottom:-10px;
}
.anckerlink{
  margin-bottom:42px;
}
.anckerlink .product-tab-nav{
  padding:0px;
}
.anckerlink .product-tab-nav .item:nth-of-type(1){
  border-left:none;
}
@media screen and (max-width: 1940px) {
  .anckerlink .product-tab-nav .item:nth-of-type(3){
    border-right:none;
  }
}
@media screen and (max-width: 1300px) {
  .sec1 .copy .br1{
    display: inline;
  }
}
@media screen and (max-width: 1200px) {
  .img01-2 .bg,
  .img01-2 .img{
    right: -10px;
    width:14%;
  }
}
@media screen and (max-width: 700px) {
  .sec1 .copy .br2{
    display: inline;
  }
}
@media screen and (max-width: 500px) {
  .sec1 .copy{
    font-size:20px;
    padding:0 10px;
  }
  .sec1 .copy .br1{
    display: none;
  }
  .img01-2 .bg,
  .img01-2 .img{
    bottom:-20px;
    width:20%;
  }
}

/*
  .sec2
----------------------------------------- */
.img02{
  margin-top:-16px;
}
.img12{
  margin: 70px auto 90px;
}
.img13{
  margin-bottom:14px;
}

.sec2 .ttl-name .br4,
.sec2 .copyB .br2,
.sec2 .copyB .br3,
.sec2 .copyB .br4,
.sec2 .copyB .br5{
  display: none;
}
.sec2 .img__big + .ttl--figure{
  margin-top:30px;
}
.sec2 .bg_blue{
  background-color: #0c76bc;
  max-width:calc(100% - 60px);
  width:1102px;
  margin:-16px auto 40px;
  padding-right:10px;
  padding:1px 10px 10px 30px;
}
.sec2 .bg_blue .normal-list{
  font-size: 22px;
  font-weight: 900;
  margin: 16px 10px 10px;
  color:#fff;
}
.sec2 .bg_blue li{
  position: relative;
  margin-left:5px;
  line-height: 2.5;
}
.sec2 .bg_blue li + li{
  margin-top:7px;
}
.sec2 .bg_blue li:nth-child(1){
  padding-right:210px;
}
.sec2 .bg_blue li:nth-child(n+3){
  padding-right:100px;
}
.sec2 .bg_blue .normal-list .img02_1{
  position: absolute;
  right:-17px;
  top:27px;
}
.sec2 .bg_blue .normal-list .img02_2{
  position: absolute;
  right:10px;
  top:-61px;
}
@media screen and (max-width: 1415px) {
  .sec2 .bg_blue li:nth-child(3){
    padding-right:0px;
  }
  .sec2 .bg_blue li:nth-child(4){
    padding-right:110px;
  }
  .sec2 .bg_blue .normal-list .img02_2{
    top:0px;
  }
}
@media screen and (max-width: 1330px) {
  .sec2 .txt .br1{
    display: none;
  }
}
@media screen and (max-width: 1130px) {
  .sec2 .copyB .br2{
    display: inline;
  }
}
@media screen and (max-width: 780px) {
  .sec2 .copyB .br3{
    display: inline;
  }
  .sec2 .bg_blue li:nth-child(1){
    padding-right:206px;
  }
  .sec2 .bg_blue .normal-list .img02_1{
    position: absolute;
    right:-17px;
    top:77px;
  }
}
@media screen and (max-width: 700px) {
  .content-section.sec2{
    padding-top:26px;
  }
  .img04{
    padding-left:0px;
  }
  .img04 img{
    max-width:270px;
  }
  .sec2 .bg_blue{
    max-width: 100%;
    padding: 1px 10px 10px 24px;
  }
  .sec2 .bg_blue .normal-list{
    margin: 16px 5px 10px 5px;
  }
  .sec2 .bg_blue li{
    line-height: 2.0;
  }
  .sec2 .bg_blue li:nth-child(1){
    padding-right:0px;
    padding-bottom:98px;
  }
  .sec2 .bg_blue li:nth-child(3){
    padding-right:0px;
  }
  .sec2 .bg_blue li:nth-child(4){
    padding-right:0px;
    padding-bottom:108px;
  }
  .sec2 .bg_blue .normal-list .img02_1{
    position: absolute;
    right:-17px;
    top:auto;
    bottom:10px;
  }
  .sec2 .bg_blue .normal-list .img02_2{
    position: absolute;
    right:10px;
    top:auto;
    bottom:-10px;
  }
}
@media screen and (max-width: 600px) {
  .sec2 .ttl-name .br4{
    display: inline;
  }
  .sec2 .copyB .br4{
    display: inline;
  }
}
@media screen and (max-width: 600px) {
  .sec2 .copyB{
    padding:0px 10px;
  }
}
@media screen and (max-width: 410px) {
  .sec2 .copyB .br3{
    display: none;
  }
}
/*
  .sec3
----------------------------------------- */
.content-section.sec3{
  padding-top:22px;
}
.sec3 .bg_sec3{
  padding:45px 40px;
  text-align: left;
  color:#fff;
  background: url(/img/product/electricpropulsion/bg_sec3.jpg.webp) no-repeat center right;
  background-size: cover;
}
.sec3 .bg_sec3 .normal-list{
  font-size:23px;
  font-weight: 900;
  margin:24px 30px 10px;
}
.sec3 .border-gray{

  padding:34px 40px 6px 106px;
}
.sec3 .merits{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sec3 .merits .merit{
  text-align: left;
}
.sec3 .merits .merit:nth-child(odd){
  width:calc(47% - 20px);
}
.sec3 .merits .merit:nth-child(even){
  width:calc(53% - 20px);
}
.sec3 .merits .merit .normal-list{
  margin:0px 0px 44px 20px;
  font-size:15px;
}
.sec3 .merits .merit:nth-child(3) .normal-list,
.sec3 .merits .merit:nth-child(4) .normal-list{
  margin-bottom:35px;
}
.sec3 .bg_sec3 .normal-list li{
  margin-left:-6px;
}
.img15{
  margin: 40px auto 7px;
}

.sec3 .border-gray .img07{
  margin-top:35px;
}
.sec3 .border-gray .img06{
  margin-top: 38px;
  margin-bottom: 30px;
  padding-right: 80px;
}
.sec3 .merit .txt-gray{
  color:#666666;
  text-indent: -1em;
  padding-left:1em;
}
.sec3 .merit .txt-gray .over800{
  display: inline;
}
.img15{
  margin: 70px auto 7px;
}
.img16{
  text-align: left;
  margin-bottom:20px;
}
.merit5{
  margin-top:80px;
}
@media screen and (max-width: 1300px) {
  .sec3 br.over1300{
    display: none;
  }
}
@media screen and (max-width: 1270px) {
  .sec3 .border-gray{
    padding:34px 40px 6px 40px;
  }
}
@media screen and (max-width: 800px) {
  .sec3 .merit .txt-gray .over800{
    display: none;
  }
}
@media screen and (max-width: 700px) {
  .content-section.sec3{
    padding-top:0px;
  }
  .sec3 .border-gray{
    padding:34px 14px 6px 14px;
  }
  .sec3 .merits{
    flex-direction: column;
  }
  .sec3 .merits .merit:nth-child(odd),
  .sec3 .merits .merit:nth-child(even){
    width:100%;
  }
  .sec3 .border-gray .img06{
    margin-top:30px;
    margin-bottom:50px;
  }
  .merit5{
    margin-top:44px;
  }
}
@media screen and (max-width: 650px) {
  .sec3 .bg_sec3{
    background: url(/img/product/electricpropulsion/bg_sec3_tb.jpg.webp) no-repeat center center;
    background-size: cover;
  }
}
@media screen and (max-width: 500px) {
  .sec3 .bg_sec3{
    padding:45px 20px;
    display: block;
    background: url(/img/product/electricpropulsion/bg_sec3_sp.jpg.webp) no-repeat center center;
    background-size: cover;
  }
  .sec3 .bg_sec3 .normal-list{
    margin:24px 10px 10px 30px;
  }
  .sec3 .border-gray .img06{
    padding-right:0px;
  }
}
/*
  .sec4
----------------------------------------- */
.content-section + .content-section.lineup{
  padding-top:20px;
  padding-bottom:120px;
}
.sec4.lineup .col2.list-lineup{
  max-width:1000px;
}
.sec4.lineup .col2.list-lineup .item .ttl{
  text-align: left;
  margin-bottom: 15px;
}
.sec4.lineup .col2.list-lineup .item .desc{
  text-align: left;
}
.sec4 .img08{
  margin:24px auto 112px;
}
.sec4 .img11{
  margin:-15px auto 13px;
}
@media screen and (max-width: 700px) {
  .content-section.sec4{
    padding-top:0px;
  }
  .content-section + .content-section.lineup{
    padding-top:0px;
  }
}