@charset "UTF-8";

/* ----------------------------------------
  page Style Seet

  2-1. トップページ
  2-2.products
  2-3.adjustmentInfo
  2-4.products_quest.
  2-5.whats karo
  2-6.35years_anniversary
  2-7.stopper
---------------------------------------- */


/* 2-1.トップページ
---------------------------------------------------------- */

div#main {
  padding-top: 100px;
  width: 100%;
  min-width: 1024px;
  overflow:hidden;
}

div#main div#mainSpace {
  height: 600px;
  z-index: 1;
  overflow: hidden;
}

div#main div#mainSpace video#bgvid {
/*
  position: absolute;
  top: 390px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
*/
  position:relative;
  top:0px;
  width: 100%;
  background-color:#000;
  min-width: 1124px;
  margin: 0 auto;
}

section#anniversaryLink{ position: relative;}

section#anniversaryLink>img{
  width: 100%;
  vertical-align: bottom;
}

section#anniversaryLink #anniversaryContents{
  position: absolute;
  top: 39%;
  right: 13%;
  text-align: right;
  margin: 0 auto;
}

section#teamChr {
  padding: 0 0 20px;
  background-color: #000;
}

section#teamChr .event {
  width: 880px;
  border: 2px solid #f00;
  text-align: center;
  padding: 10px 10px 6px;
  margin: 0 auto;
}

section#teamChr .banner {
  width: 880px;
  margin: 20px auto 0;
}

section#teamChr .gray {
  background-color: #333;
  padding-top: 1px;
  padding-bottom: 20px;
}

section#teamChr .banner a {
  display: inline-block;
  /* width: 430px; */
}

/* section#teamChr .banner a:last-child {
  float: right;
} */

section#teamChr .banner img {
  vertical-align: top;
}

@media screen and (max-width: 640px) {
  section#teamChr {
    padding: 10px 20px 0;
  }

  section#teamChr .event {
    width: auto;
  }

  section#teamChr .banner {
    width: 100%;
  }

  section#teamChr .banner {
    /* width: 100%;
    float: none !important; */
    margin-bottom: 20px;
  }
  section#teamChr .banner img {
    width: 100%;
  }
}

section#updateLink{ position: relative;}

section#updateLink>img{
  width: 100%;
  vertical-align: bottom;
}

section#updateLink #updateContents{
  position: absolute;
  top: 55%;
  left: 15%;
  text-align: left;
  margin: 0 auto;
  width: 20%;
}

section#updateLink #updateContents a.btn-link3 {
  border-color: #bfbfbf;
  color: #bfbfbf;
  font-size: 1.5vw;
}
@media screen and (max-width: 1000px) {
  section#updateLink #updateContents a.btn-link3 {
    font-size: 15px;
  }
}
section#updateLink #updateContents a.btn-link3:hover {
  border-color: red;
  color: red;
}


section#intro {
  color: black;
  width: 100%;
  min-width: 1024px;
  background-image: url("../img/bg_pattern2.png");
  background-color: #d9d8d8;
}

section#intro h2 {
  text-align: center;
  line-height: 1em;
  padding-top: 110px;
  margin: 0 0 18px 0px;
}

section#intro p {
  text-align: center;
  letter-spacing: -0.05em;
  padding-bottom: 111px;
}

section#thought {
  height: 553px;
  background-size: cover;
  background-image: url("../img/philosophy.jpg");
}

section#thought #phiContents {
  margin: 0 auto;
  width: 1054px;
  padding: 126px 0px;
}

section#thought #phiContents h2 { margin: 0 0 15px -3px;}

section#thought #phiContents p {
  font-size: 14px;
  margin: 0 0 29px -3px;
  color: #ccc;
}

section#products {
  background-image: url("../img/bg_pattern2.png");
  background-color: #d9d8d8;
  color: black;
}

section#products #proContents {
  text-align: center;
  margin: 0 auto;
  width: 100%;
  padding-top: 87px;
}

section#products #proContents h2 { margin:0 0 13px 13px;}

section#products #proContents p {
  letter-spacing: -0.04em;
  margin-bottom: 25px;
  font-size: 15px;
}

section#products #proContents span { font-size: 14.5px;}

section#products #proContents div#matWrap {
  width: 100%;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}

section#products #proContents div#matWrap ul {
  width: 100%;
  position: relative;
  left: 50%;
  float: left;
  list-style-type: none;
  margin-bottom: 40px;
}

section#products #proContents div#matWrap ul li {
  width: 100%;
  position: relative;
  left: -50%;
  float: left;
}

section#products #proContents div#matWrap ul li img {
  width: 100%;
  vertical-align: top;
}

section#products #proContents div#matWrap ul li.last { padding-right: 0;}

section#info {
  background: url(../img/bg_info01.jpg) no-repeat;
  background-size: cover;
}

section#info div#infoWrap {
  width: 1064px;
  margin: 0 auto;
  padding: 68px 0px 97px;
}

section#info div#infoWrap h2 {
  font-size: 24px;
  letter-spacing: 0.05em;
  border-bottom: solid 1px #6c6c6c;
  margin-bottom: 13px;
  padding-left: 8px;
  padding-bottom: 5px;
  position: relative;
}

section#info div#infoWrap h2 span.linkBox {
}

section#info div#infoWrap h2 span.linkBox a{
  position: absolute;
  bottom: 12px;
  right: 3px;
  color: #fff;
  font-size: 14px;
  background: url(../img/icon_arrow_white.png) left top 30% no-repeat;
  padding-left: 15px;
  text-decoration: none;
  line-height: 1;
}

section#info div#infoWrap p {
  font-size: 14px;
  margin-left: 5px;
}

section#info div#infoWrap table#infotxt{width: 100%;}

section#info div#infoWrap table#infotxt tr{
  color: #ccc;
  font-size: 13px;
  text-align: left;
  border-bottom: dotted 1px #6c6c6c;
}

section#info div#infoWrap table#infotxt th {
  width: 93px;
  font-weight: normal;
  vertical-align: top;
  padding: 15px 0 13px 2px;
}

section#info div#infoWrap table#infotxt td {
  padding: 15px 0 13px 2px;
}

section#info div#infoWrap table#infotxt td.infoTag{
  vertical-align: middle;
  text-align: right;
  padding: 0;
}


/*----------------------------
2-2 products
----------------------------*/

#products p{font-size: 14px;}

#products #pageTtl{background: url(../img/products/bg_products_main.jpg) center top no-repeat;}

#products .productsLeadArea{
  padding-top: 50px;
  overflow: hidden;
  margin-bottom: 27px;
}

#products .productsLeadTxt{
  width: 435px;
  float: left;
}

#products .productsLeadTxt p{margin-bottom: 28px;}

#products .productsLeadTxt p.productsCopy{
  font-size: 24px;
  line-height: 1.5;
  margin-bottom: 15px;
}

#products .typeandColor{
  width: 475px;
  float: right;
}

#products .typeandColor .typezoneImg{ margin-bottom: 10px;}

#products .typeandColor .btn3dColorS{ float: right;}

#products .typeandColor .btn3dColorS a{
  color: #a0a0a0;
  text-decoration: none;
  display: block;
  padding: 25px 0 22px 20px;
  background: url(../img/products/bg_3dcolorsimulation_s.jpg) left top no-repeat;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: 1px;
  position: relative;
  width: 346px;
}

#products .typeandColor .btn3dColorS a:after{
  position: absolute;
  top: 50%;
  right: 20px;
  display: block;
  content: '';
  width: 8px;
  height: 8px;
  margin-top: -5px;
  border-top: 2px solid #c0c0c0;
  border-right: 2px solid #c0c0c0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 10;
}

#products .productsListArea ul{ list-style: none;}

#products .productsListArea li a{
  display: block;
  color: #fff;
  text-decoration: none;
  width: 100%;
  height: 230px;
  padding: 25px 30px 30px 35px;
  margin-bottom: 20px;
}

#products .productsListArea li:nth-child(2n){
  text-align: right;
}

#products .productsListArea li a h3,
#products .othersBtnWrap .btnStopper h3{
  font-size: 32px;
  font-family: 'Biryani light', sans-serif;
  font-weight: normal;
  letter-spacing: 3px;
  display: inline-block;
  margin-right: 20px;
}

#products .productsListArea li a h3 + .subTtl{
  display: inline-block;
  font-size: 18px;
}

#products .productsListArea li a p{line-height:1.7;}

#products .productsListArea li a#sisal .productsListText:after{
  content:'新色 ライム / ブラック 登場';
  display: block;
  font-size: 21px;
  color: #b0d91a;
  font-weight: bold;
  padding: 22px 0 0 0;
  letter-spacing: 0.04em;
}

#products .productsListArea li a#quest{ background: url(../img/products/bg_quest.jpg) left top no-repeat;}

#products .productsListArea li a#krone{ background: url(../img/products/bg_krone.jpg) left top no-repeat;}

#products .productsListArea li a#wooly{ background: url(../img/products/bg_wooly.jpg) left top no-repeat;}

#products .productsListArea li a#flaxy{ background: url(../img/products/bg_flaxy.jpg) left top no-repeat;}

#products .productsListArea li a#sisal{ background: url(../img/products/bg_sisal02.jpg) left top no-repeat;}

#products .productsOthers{
  overflow: hidden;
  margin-left: -10px;
}

#products .othersBtnWrap{
  width: 506px;
  margin-left: 11px;
  float: left;
}

#products .othersBtnWrap .btnStopper a{
  display: block;
  color: #fff;
  text-decoration: none;
  width: 100%;
  height: 196px;
  padding: 25px 30px 30px 35px;
  background: url(../img/products/bg_stopper.jpg) left top no-repeat;
  margin-bottom: 15px;
}

#products .othersBtnWrap .btnStopper p{line-height:1.7;}

#products .othersBtnWrap .btnStopper .subTtl{
  font-size: 17px;
  margin:5px 0 10px;
}

#products .othersBtnWrap .colorSimulation2D{ margin-bottom: 20px;}

#products .othersBtnWrap .btn-link-type2 a{
  color: #fff;
  border: 4px #333 solid;
  width: 100%;
  padding: 8px 0 8px 15px;
  display: block;
  font-size: 17px;
  letter-spacing: 1px;
}

#products .othersBtnWrap .btn-link-type2 a span{ margin-left: 15px;}

#products .othersBtnWrap .btn-link-type3 a{
  font-size: 22px;
  color: #fff;
  letter-spacing: 2px;
  padding: 10px 0 0 15px;
  border: 4px #333 solid;
  display: block;
  height: 96px;
}

#products .othersBtnWrap .btn-link-type3 a span{
  font-size: 14px;
  display: block;
}

#products .othersBtnWrap .btn-link-type3 a.btn3dColorL{
  border-bottom: none;
  background: url(../img/products/bg_3dcolorsimulation_l.jpg) right top no-repeat;
}

#products .othersBtnWrap .btn-link-type3 a.usersVoice{ background: url(../img/products/bg_users_vocie.jpg) 230px top no-repeat;}

.typeandColor a:hover,
.productsListArea a:hover{
  opacity: 0.8;
  text-decoration: none;
}

/*----------------------------
2-3.adjustmentInfo
----------------------------*/

.mainContents li{ list-style: none;}

.mainContents h2{
  font-family: 'Crimson Text', serif;
  font-style: italic;
}

#adjustmentInfo #pageTtl{
  background: url(../img/adjustment_info/adjustment_info_main.png) no-repeat center top;
  padding-top: 60px;
}

#adjustmentInfo .contentsInner{ color: #000;}

#adjustmentInfo .leadArea{
  background: #dddcdc;
  padding: 35px 0 35px 50px;
}

#adjustmentInfo .leadArea h3 {
  color: #b70101;
  font-size: 18px;
  padding-bottom: 8px;
}

#adjustmentInfo .leadArea p {
  line-height: 1.5em;
  letter-spacing: -0.05em;
  padding-bottom: 10px;
}

.adjustmentFlow{ overflow: hidden;}

.adjustmentFlow li:before {
  content: " ";
  display: block;
  height: 21px;
  width: 16px;
  position: absolute;
  left: -26px;
  top: 28px;
  background: url(../img/adjustment_info/icon_arrow.png) no-repeat;
}

.adjustmentFlow li.chosen:before {
  left: -32px;
  top: 22px;
}

.adjustmentFlow li{
  display:inline-block;
  float: left;
  background: #b1b0b0;
  color: #d0d0d0;
  width: 285px;
  height: 77px;
  line-height: 77px;
  text-align: center;
  margin-right: 35px;
  position: relative;
  font-size: 21px;
}

.adjustmentFlow li a{
  color: #fff;
  padding: 20px 49px;
}

.adjustmentFlow .chosen:hover{ opacity: 0.7;}

.adjustmentFlow .chosen a:hover{ text-decoration: none;}

.adjustmentFlow .chosen{
  background: #5f5f5f;
  color: #fff;
  border: solid 6px #b0b0b0;
  line-height: 65px;
}

.adjustmentFlow .current{
  background: #000;
  color: #fff;
}

.adjustmentFlow li:first-child:before{ background: none;}

#adjustmentInfo .choiceArea {
  background: #fff;
  padding: 42px 45px 0 50px;
}

#adjustmentInfo .choiceArea h4 {
  font-size: 24px;
  padding-bottom: 30px;
  font-weight:normal;
}

#adjustmentInfo .choiceArea h5 {
  font-size: 22px;
  padding: 0 0 15px 37px;
  background: url(../img/adjustment_info/icon_bar.png) no-repeat left top 13px;
  font-weight:normal;
}

.choiceArea .choiceBox { padding-bottom: 53px;}

.choiceArea ul{ overflow: hidden;}

.choiceArea li{
  display: table;
  float: left;
  margin-bottom: 15px;
  width: 154px;
  border-left: solid 1px #9f9f9f;
  font-size: 13px;
}

.choiceArea li:nth-child(6n){ border-right: solid 1px #9f9f9f;}

.choiceArea li:last-child{
  border-right: solid 1px #9f9f9f;
  width: 155px;
}

.choiceArea li a {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  color: #000;
  line-height: 1em;
  font-size: 15px;
  text-decoration: none;
  padding-left: 21px;
  background: url(../img/icon_arrow_gray.png) no-repeat 9px 50%;
}

#adjustmentInfo .Question {
  background: #fff;
  letter-spacing: -0.05em;
  text-align: center;
  padding: 40px 0;
  border-top: solid 1px #ccc;
}

#adjustmentInfo .Question p { line-height: 2em;}

#adjustmentInfo .Question p span{
  font-weight: bold;
  font-size: 16px;
}

#adjustmentInfo .Question a {
  display: inline-block;
  color: #000;
  text-decoration: none;
  padding-left: 15px;
  background: url(../img/icon_arrow_gray.png) no-repeat 4px 50%;
}

#adjustmentInfo .Question a:hover {
  color:red;
  text-decoration: underline;
}

#adjustmentInfo .adjustInfoDetail{
  border-top: 1px #000 solid;
  background: #fff;
  padding: 38px 50px 20px;
}

#adjustmentInfo .adjustInfoDetailTtl{
    font-size: 24px;
    padding-bottom: 7px;
    margin-bottom: 13px;
    font-weight: bold;
    text-align: center;
    border-bottom:  1px #999 solid;
}

#adjustmentInfo .adjustInfoDetailTtl span{ margin: 0 8px;}

#adjustmentInfo .carTypeNavList{ margin-bottom: 45px;}

#adjustmentInfo .carTypeNavList li{
  border: none;
  display: inline-block;
  margin-right: 23px;
}

#adjustmentInfo .carTypeNavList li a{
  background: url(../img/adjustment_info/icon_arrow_squea.jpg) left center no-repeat;
  padding: 1px 0 0 22px;
  color: #000;
  font-size: 16px;
}

#adjustmentInfo .carTypeInfoList > li{ margin-bottom: 20px;}

#adjustmentInfo .carTypeNameBox{
  border: 1px #d0d0d0 solid;
  background: #ededed;
  padding: 10px 20px 5px;
}

#adjustmentInfo .carTypeName{ font-size: 16px;}

#adjustmentInfo .carTypeName span{
  font-weight: bold;
  margin-right: 10px;
}

#adjustmentInfo .carTypeDetailInfo{
  border: 1px #ededed solid;
  padding: 20px 20px;
}

#adjustmentInfo .carTypeDetailInfo .carInfoWrap{ overflow: hidden;}

#adjustmentInfo .carTypeDetailInfo .carImgBox{
  margin-bottom: 15px;
  width: 300px;
  float: left;
}

#adjustmentInfo .carTypeDetailInfo .carImgBox li{ margin-bottom: 10px;}

#adjustmentInfo .carTypeDetailInfo .carImgBox img{ margin-left: 15px;}

#adjustmentInfo .carTypeDetailInfo .carImgBox .attentionTxt{ font-size: 12px;}

#adjustmentInfo .carTypeDetailInfo .adjustTable{
  table-layout: fixed;
  width: 100%;
  font-size: 14px;
}

#adjustmentInfo .carTypeDetailInfo .adjustTable th{
  background: #f0f0f0;
  font-weight: normal;
  border: 1px #999 solid;
  padding: 2px 5px 2px 10px;
}

#adjustmentInfo .carTypeDetailInfo .adjustTable td{
  border: 1px #999 solid;
  padding: 2px 5px 2px 10px;
}

#adjustmentInfo .carTypeDetailInfo .carInfoTable{
  width: 534px;
  float: right;
}

#adjustmentInfo .carInfoTable th{ width: 120px;}

#adjustmentInfo .priceTablePC{
    text-align: center;
    margin-top: 10px;
}

#adjustmentInfo .priceTablePC th:first-child{ width: 120px;}

#adjustmentInfo .priceTableSP{ display: none;}

/* 2-4.products_quest.
---------------------------------------------------------- */

#products .contentsInner{ overflow: hidden;}

#products .productsInfoMainCol{
  width: 778px;
  float: right;
  color: #000;
  padding: 27px 0 7px 35px;
  background-color: #fff;
}

#products .productsInfoMainCol a.btn-link2  {
  width: 262px;
  padding: 13px 0 12px 28px;
  margin: 0 6px 27px 0px;
}

#products .productsInfoMainCol h2.productsTtl{
  font-family: 'Biryani light', sans-serif;
  font-style: normal;
  font-size: 47px;
padding: 0;
  border-bottom: 1px solid #7e7e7e;
  margin-bottom: 37px;
  line-height: 1.05em;
}

#products .productsInfoMainCol h2.productsTtl span{
  font-size: 26px;
  padding-left: 10px;
}

#products .productsInfoMainCol .productsDetail,
#products .productsInfoMainCol .colorVariation{ padding-right: 35px;}

#products .productsInfoMainCol h3{font-weight: normal;}

#products .productsInfoMainCol h3.introTtl{
  font-size: 30px;
  margin-bottom: 18px;
}

#products .productsDetail p{
  font-size: 14.5px;
  line-height: 1.7em;
  letter-spacing: -0.03em;
  padding: 11px 0;
}

#products .productsDetail dl{margin-bottom:15px;}
#products .productsDetail dl dt{font-weight:bold;}

#products .productFeatures{
  overflow: hidden;
  margin-bottom: 50px;
}

#products .productFeatures li{
  display: inline-block;
  float: left;
  font-size: 14px;
  background: #d9d9d9;
  padding: 4px 12px 1px;
  margin-right: 5px;
}

#products #colorTab p small{ font-size: 14px;}

#products #colorTab ul{overflow: hidden;}

#products #colorTab li{
  display: inline-block;
  float: left;
  margin: 0 6px 5px  0;
}

#products #colorTab li:nth-child(4n){margin-right: 0;}

#products #colorTab a{
  width: 172px;
  height: 70px;
  text-align: left;
  padding: 6px 0 0 8px ;
  position: relative;
  border: 3px solid #999;
  color: #000;
}

#products #colorTab a span{
  display:block;
  font-size:14px;
}

#products #colorTab a::after{
  top: 15px;
  right: 7px;
  width: 8px !important;
  height: 8px !important;
}

#products #colorTab a:hover,
#products #colorTab li.selected a{
   color: red;
   border: 3px solid #c0c0c0 !important;
   opacity: 0.8 !important;
}

#products #colorTab a img{
  position: absolute;
  left: -3px;
  bottom: -3px;
}

#products .pcWarm{ display: block;}

#products .spWarm{ display: none;}

#products .colorDetail{
  padding: 0 24px 13px 20px;
  border: 2px solid  #d3d3d3;
  margin-bottom: 40px;
}

#products .colorDetailInner{ overflow: hidden;}

#products .titleAndImages{
  width: 326px;
  float: left;
}

#products .titleAndImages p img{
  vertical-align: top;
  margin-bottom: 8px;
}

#products .titleAndImages h4{
  color: #000;
  font-size: 22px;
  letter-spacing: -0.1em;
  padding: 13px 0 14px 0;
}

#products .titleAndImages small{
  font-size: 14px;
  font-weight: bold;
  display:block;
}

#products .titleAndImages small.black{
  font-size: 14px;
  font-weight: bold;
  display: inline;
}

#products .titleAndImages small.newColor{
    font-weight: bold;
    font-size: 14px;
    letter-spacing: -0.05em;
    color: #F7101B;
    padding-left: 10px;
    display: inline;
}
#products .overallView{
  margin-top: 20px;
  width: 300px;
  float: right;
}

#products .productsInfoSideNav{
  width: 246px;
  float: left;
}

#products .productsInfoSideNav h5{
  height: 51px;
  font-size: 17px;
  font-weight: normal;
  line-height: 51px;
  padding-left: 16px;
  border-bottom: 1px solid  #515151;
  background: #2d2d2d;
}

#products .productsInfoSideNav li.current{
  color: #000;
  height: 40px;
  font-size: 14px;
  line-height: 40px;
  background: #fff;
  padding-left: 9px;
  border-bottom: 1px solid  #515151;
}

#products .productsInfoSideNav li.productTop{display: none;}

#products .productsInfoSideNav li a{
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  display: block;
  color: #d6d6d6;
  text-decoration: none;
  padding-left: 9px;
  border-bottom: 1px solid  #515151;
}

#products .productsInfoSideNav li.colorsimulation a::after,
#products .productsInfoSideNav li.colorsimulation a:hover::after {
  position: relative;
  top: -39px;
  right: -215px;
  display: block;
  content: url("../img/products_quest/icon_link01.png");
  width: 12px;
  height: 12px;
  border: none;
  -webkit-transform: none;
  transform: none;
}

#products .productsInfoSideNav li a:hover{ color: red;}

/* 2-5. whats karo
---------------------------------------------------------- */

#whatsKaro #pageTtl{background: url(../img/whats_karo/whats_karo_main.jpg) center top no-repeat;}

#whatsKaro #pageTtl h2 {
  letter-spacing: 6px;
  padding-top: 4px;
}

#whatsKaro .contentsInner{overflow: hidden;}

#whatsKaro .whatsKaroInfoMainCol{
  width: 778px;
  float: right;
  color: #000;
  padding: 27px 0 15px 35px;
  background-color: #fff;
}

#whatsKaro .whatsKaroInfoMainCol h2 {
  font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳＰゴシック","MS PGothic",Osaka,sans-serif;
  font-style: normal;
  font-size: 39px;
  padding: 0 0 10px 1px;
  border-bottom: 1px solid #7e7e7e;
  margin-bottom: 30px;
  line-height: 1.15em;
}

#whatsKaro .whatsKaroDetail p{
  font-size: 14.5px;
  line-height: 1.7em;
  letter-spacing: -0.03em;
  padding: 11px 0;
  margin-right: 34px;
}

#whatsKaro .whatsKaroInfoMainCol h3 {
  font-size: 30px;
  font-weight: normal;
}

#whatsKaro .functionalDetail{
  overflow: hidden;
  margin-bottom: 44px;
}

#whatsKaro .functionalDetail span{
  display: inline-block;
  float: left;
  text-align: center;
  padding-top: 18px;
}

#whatsKaro .functionalDetail span small{
  display: block;
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 13px;
}

#whatsKaro .functionalDetail p{
  width: 49%;
  float: left;
  padding-top: 13px;
  margin-right: 13px;
}

#whatsKaro .whatsKaroInfoSideNav{
  width: 246px;
  float: left;
}

#whatsKaro .whatsKaroInfoSideNav h5{
  height: 51px;
  font-size: 17px;
  font-weight: normal;
  line-height: 51px;
  padding-left: 16px;
  border-bottom: 1px solid  #515151;
  background: #2d2d2d;
}

#whatsKaro .whatsKaroInfoSideNav li.current{
  color: #000;
  height: 40px;
  font-size: 14px;
  line-height: 40px;
  background: #fff;
  padding-left: 9px;
  border-bottom: 1px solid  #515151;
}

#whatsKaro .whatsKaroInfoSideNav li a{
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  display: block;
  color: #d6d6d6;
  text-decoration: none;
  padding-left: 9px;
  border-bottom: 1px solid  #515151;
}

#whatsKaro .whatsKaroInfoSideNav li a:hover{ color: red;}

#whatsKaro .eyeCatchImg { padding: 5px 0 42px 0;}

#whatsKaro .whatsKaroDetail .txtArea p{
  font-size: 14.5px;
  line-height: 1.7em;
  letter-spacing: -0.03em;
  padding: 15px 0 0 0;
}

#whatsKaro .whatsKaroDetail .txtArea{padding-bottom: 55px;}

#whatsKaro .whatsKaroDetail .txtArea span{
  color: #003174;
  font-weight: bold;
}

#whatsKaro .whatsKaroDetail .txtArea .attentionTxt{
  font-size: 12px;
  line-height: 1.5em;
  padding: 2px 0 12px;
}

#whatsKaro .functionalLinkBox{padding: 7px 0 16px;}

#whatsKaro .whatsKaroDetail .orderSystemCarMat{
  border: solid 5px #d6d6d6;
  margin: 0 35px 30px 0;
  padding: 20px 18px 0 25px;
}

#whatsKaro .whatsKaroDetail .orderSystemCarMat h3{font-size: 24px;}

#whatsKaro .whatsKaroDetail .orderSystemCarMat p{
  margin: 0;
  font-size: 14.5px;
  line-height: 1.7em;
  letter-spacing: -0.03em;
  padding: 15px 0 2px 0;
}

#whatsKaro .functionalLinkBox a{
  color: #2451a2;
  font-size: 14px;
  background: url(../img/whats_karo/icon_arrow_black.jpg) left top 30% no-repeat;
  padding-left: 15px;
  text-decoration: underline;
}

#whatsKaro .functionalLinkBox a:hover{text-decoration: none;}

/* 2-6.35years_anniversary
---------------------------------------------------------- */

section.anniversaryIntro {
  position: relative;
  padding-top: 93px;
  background: url("../img/35years_anniversary/bg_35yrs-anniversary02.jpg") no-repeat;
  background-position: 50% 0;
}

section.anniversaryIntro h2 img{ margin-bottom: 53px;}

section.anniversaryIntro h3 img{ margin-bottom: 36px;}

section.anniversaryIntro .anniversaryLeadArea{
  overflow: hidden;
  position: relative;
}

section.anniversaryIntro .anniversaryLeadArea>p{
  width: 68%;
  float: left;
  font-size: 16px;
  padding-top: 23px;
  margin-bottom: 53px;
}

section.anniversaryIntro .anniversaryLeadArea .siteRenewal{
  position: absolute;
  left: 492px;
  top: 51px;
}

section.anniversaryIntro .anniversaryLeadArea .siteRenewal a:hover{ opacity: 0.8;}

section.anniversaryIntro .anniversaryLeadArea .siteRenewal a p{
  display: table-cell;
  vertical-align: middle;
  line-height: 1.3em;
  padding-bottom: 2px;
  font-size: 16px;
}

section.anniversaryProjects { margin-bottom: 182px;}

section.anniversaryProjects h2{
  font-size: 26px;
  height: 45px;
  line-height: 45px;
  padding: 0px 0 0 18px;
  background: url("../img/35years_anniversary/bg_35yrs-anniversary-ttl01.png") repeat-y;
}

section.anniversaryProjects li{
  position: relative;
  height: 291px;
  border-bottom: 1px solid  #716011;
  list-style: none;
  overflow: hidden;
}

section.anniversaryProjects li#krone a{ height: 290px;}

section.anniversaryProjects a{
  display: block;
  height: 100%;
  padding: 43px 0 0 20px;
  text-decoration: none;
  color: #fff;
}

section.anniversaryProjects a:hover{
  opacity:0.8;
}

section.anniversaryProjects li#flaxy a{ background: url("../img/35years_anniversary/bg_flaxy02.jpg") no-repeat;}
section.anniversaryProjects li#krone a{ background: url("../img/35years_anniversary/bg_krone02.jpg") no-repeat;}
section.anniversaryProjects li#emblem a{ background: url("../img/35years_anniversary/bg_emblem02.jpg") no-repeat;}

section.anniversaryProjects a>img{
  position: absolute;
  right: 29px;
  bottom: 0;
}

section.anniversaryProjects #emblem a>img{ top: 0;}

section.anniversaryProjects .projectTxt img{ padding-top: 20px;}

section.anniversaryProjects .projectTxt{
  padding: 7px 0 0 67px;
  background: url("../img/35years_anniversary/icon_checkbox01.png") 1px 0 no-repeat;
  text-decoration: none;
  color: #fff;
}

section.anniversaryProjects .projectTag{
  width: 145px;
  height: 36px;
  font-size: 21px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
  line-height: 36px;
  background-color: #716011;
  border-radius: 50%;
  margin: 0px 0 7px 0;
}

section.anniversaryProjects h3 span{ font-size: 23px;}

section.anniversaryProjects h3{
  font-size: 33px;
  line-height: 1.1em;
}

/* 2-7.stopper
---------------------------------------------------------- */
#products .productsInfoMainCol h2 {
  font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳＰゴシック","MS PGothic",Osaka,sans-serif;
  font-style: normal;
  font-size: 39px;
  padding: 0 0 10px 1px;
  border-bottom: 1px solid #7e7e7e;
  margin-bottom: 30px;
  line-height: 1.15em;
}

#products #stopper { padding-bottom: 40px;}

#products #stopper h3 {
  font-size: 30px;
  margin-bottom: 5px;
}

#products .stopperIntro {
  padding-top: 8px;
  margin-bottom: 38px;
  overflow: hidden;
}

#products .stopperIntro p {
  width: 44%;
  float: left;
  padding-top: 0;
  margin-right: 16px;
}

#products .stopperIntro span {
  display: inline-block;
  float: left;
  text-align: center;
  padding-top: 6px;
}

#products #stopper .ttlDash{margin-bottom: 5px;}

#products .stopperDetail {
  overflow: hidden;
  position: relative;
  margin-bottom: 63px;
}

#products .stopperDetail>img {
  display: inline-block;
  float: left;
  padding-top: 3px;
  margin-right: 23px;
}

#products .stopperDetail .thumbsWrap {
  position: absolute;
  bottom: 0;
  display: inline-block;
  float: left;
  padding-top: 18px;
  overflow: hidden;
}

#products .stopperDetail .thumbsWrap h5{
  font-weight: bold;
  font-size: 15px;
  line-height: 1.3em;
  letter-spacing: -0.07em;
  margin: 0px 0px 6px 0;
}

#products .stopperDetail .thumbsWrap img{
  float: right;
  margin: 0px 5px 0px 0px;
  vertical-align: top;
  display: block;
}

#products .stopperDetail .thumbsWrap img:last-child {float: left }

#products dl.stopperImgFrontBack{
  font-size: 20px;
  overflow: hidden;
  padding: 10px 0;
  background: #d9d9d9;
  margin: 0 0 10px 0;
}

#products .stopperImgFrontBack dt{
  width: 148px;
  height: 162px;
  line-height: 162px;
  float: left;
  text-align: center;
}

#products .stopperImgFrontBack dd{
  display: inline-block;
  float: left;
  margin-right: 10px;
  height: 162px;
}

#products .stopperHook { margin-bottom: 41px;}

#products .stopperHook h5{
  font-size: 14px;
  font-weight: bold;
  padding-top: 5px;
  margin-bottom: 6px;
}

#products .stopperHook ul{
  overflow: hidden;
  margin-left: -2px;
}

#products .stopperHook li{
  display: inline-block;
  float: left;
  height: 84px;
  margin: 0 0 2px 2px;
}

#products  #stopper .stopperBoder{
  padding: 14px 0 22px 0;
  border-bottom: 1px solid #999;
  margin: -41px 0 14px 0;
}

#products #stopper .incompatible{padding: 8px 0;}

#products  #stopper .whatsKaroImgBox img{ padding-right: 3px;}

/*sp under 640px*/
@media screen and (max-width: 640px) {

  div#main {
    min-width: 0;
    height: 100%;
    padding-top: 50px;
  }

  div#main div#mainSpace { height: 100%;}

  div#main div#mainSpace img{
    width: 100%;
    display: block;
    position:relative;
    top:10px;
  }

  div#main div#mainSpace video#bgvid { display: none;}

  section#anniversaryLink p{
    top: 29.5%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 20px;
    position: absolute;
    font-weight: bold;
    line-height: 1.35;
    padding-right: 5%;
    color: #b0d91a;
  }
  section#anniversaryLink #anniversaryContents {
    top: 82.3%;
    left: 0;
    right: 0;
    text-align: center;
  }

  section#anniversaryLink>img{padding-top: 3%;}

  section#updateLink p{
    top: 29.5%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 20px;
    position: absolute;
    font-weight: bold;
    line-height: 1.35;
    padding-right: 5%;
    color: #b0d91a;
  }
  section#updateLink #updateContents {
    top: 83.1%;
    left: 0;
    right: 0;
    text-align: center;
    width: 80%;
  }

  section#updateLink>img{padding-top: 3%;}

  section#updateLink #updateContents a.btn-link3 {
    width: 100%;
    font-size: 5vw;
  }

  section#updateLink #updateContents a.btn-link3:after {
    right: 14px;
  }

  section#teamChr .gray {
    padding: 0;
  }

  section#intro {
    min-width: 0;
    width: 100%;
    margin: 0;
  }

  section#intro h2{
    font-size: 24px;
    padding-top: 37px;
    margin-bottom: 9px;
  }

  section#intro h2 span{ font-size: 77%;}

  section#intro p{
    padding:0 16px 30px;
    font-size: 14.5px;
    line-height:1.9;
  }

  section#thought {
    height: 464px;
    background: url(../img/sp_philosophy.jpg) no-repeat left bottom;
    background-size:100%;
  }

  section#thought #phiContents {
    width: 100%;
    text-align: center;
    padding: 40px 0px;
  }

  section#thought #phiContents h2 {
    line-height: 1.05em;
    margin: 0 0 17px 5px;
    font-size: 30px;
    letter-spacing: 0.1em;
  }

  section#thought #phiContents p {
    margin: 0 0 11px 11px;
    font-size: 14px;
    padding: 0 13px 10px;
    line-height: 1.9;
  }

  section#products #proContents { padding-top: 40px;}

  section#products #proContents h2 {
    line-height: 1em;
    font-size: 30px;
    margin: 0 0 13px 0px;
  }

  section#products #proContents p {
    letter-spacing: -0.05em;
    padding: 0 15px 10px 25px;
    margin-bottom: 0;
    font-size: 14.5px;
    line-height:1.9;
  }

  section#products #proContents div#matWrap ul { margin-bottom: 22px;}

  section#info div#infoWrap {
    width: 100%;
    padding: 7% 5% 25%;
  }

  section#info div#infoWrap h2 {
    font-size: 21px;
    padding: 15px 0 7px 11px;
    border-bottom: solid 1px #6c6c6c;
    margin-bottom: 12px;
  }

  section#info div#infoWrap p {
    font-size: 14px;
    margin: 0 0 0px 10px;
    line-height:1.7;
  }

  section#info div#infoWrap table#infotxt,
  section#info div#infoWrap table#infotxt tbody,
  section#info div#infoWrap table#infotxt tr,
  section#info div#infoWrap table#infotxt tr th,
  section#info div#infoWrap table#infotxt tr td{display:block;}

  section#info div#infoWrap table#infotxt tr{ padding:10px 0;}

  section#info div#infoWrap table#infotxt th,
  section#info div#infoWrap table#infotxt td{
    font-size: 14px;
    padding:0 10px;
  }

  section#info div#infoWrap table#infotxt td{margin-bottom:5px;}

  section#info div#infoWrap table#infotxt td.infoTag {text-align:left;}

/*-----------------------
2-2 products
--------------------------*/

  #products p{font-size: 14px;}

  #products .contentsInner{width: 100%;}

  #products #pageTtl{
    background: url(../img/products/bg_products_main_sp.jpg) center 60px no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    padding-top: 33%;
    padding-bottom: 9%;
  }

  #products .productsLeadArea{
    width: 100%;
    padding: 15px;
    margin-bottom:0px;
  }

  #products .productsListArea ul{padding:0 15px;}

  #products .productsLeadArea .productsLeadTxt{
    width: 100%;
    float: none;
    margin-bottom: 15px;
  }

  #products .productsLeadArea .typeandColor{
    width: 100%;
    float: none;
    text-align: center;
  }

  #products .productsLeadTxt p{
    margin-bottom: 10px;
    font-size: 14px;
    line-height:2.1;
  }

  #products .productsLeadTxt p.productsCopy{
    font-size: 24px;
    margin-bottom: 10px;
  }

  #products .productsLeadTxt .btn-link{
    margin: 0 10px 30px;
    display: block;
  }

  #products .productsLeadArea .typeandColor img{
    width: 98%;
    height: auto;
  }

  #products .typeandColor .btn3dColorS{
    float: none;
    text-align: left;
  }

  #products .typeandColor .btn3dColorS a{
    width: 100%;
    height:40%;
    font-size: 14px;
    padding: 8% 0 8% 4%;
    font-weight: bold;
    letter-spacing: 1px;
    -webkit-background-size: cover;
    background-size: cover;
  }

  #products .typeandColor .btn3dColorS a:after {
    position: absolute;
    top: 52%;
    right: 20px;
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    margin-top: -5px;
    border-top: 1px solid #c0c0c0;
    border-right: 1px solid #c0c0c0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 10;
  }

  #products .productsListArea{
    width: 100%;
    height: 80%;
  }

  #products .productsListArea li a{
    display: block;
    color: #fff;
    text-decoration: none;
    width: 100%;
    height:auto;
    padding: 15px 20px 108%;
    position:relative;
    margin-bottom:0;
  }

  #products .productsListArea li a .productsListTitle{
    position:absolute;
    left:20px;
    top:15px;
  }

  #products .productsListArea li:nth-child(2n){ text-align: left;}

  #products .productsListArea li a h3,
  #products .othersBtnWrap .btnStopper h3{
    font-size: 29px;
    font-family: 'Biryani light', sans-serif;
    font-weight: normal;
    letter-spacing: 3px;
    display: inline-block;
    margin-right: 5px;
    margin-bottom:5px;
  }

  #products .productsListArea li a .productsListText{
    position:absolute;
    left:0;
    top:65px;
    padding:0 20px;
  }

  #products .productsListArea li a#sisal .productsListText:after{
    font-size: 16.3px;
    padding-top: 5px;
  }

  #products .productsListArea li a h3 + .subTtl{
    display: inline-block;
    font-size: 18px;
  }

  #products .productsListArea li a#quest{
    background: url(../img/products/bg_quest_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;

  }

  #products .productsListArea li a#krone{
    background: url(../img/products/bg_krone_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }

  #products .productsListArea li a#wooly{
    background: url(../img/products/bg_wooly_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }

  #products .productsListArea li a#flaxy{
    background: url(../img/products/bg_flaxy_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }

  #products .productsListArea li a#sisal{
    background: url(../img/products/bg_sisal02_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }

  #products .productsOthers{
    overflow: hidden;
    margin-left: 0;
    position: relative;
    padding:0 15px;
  }

  #products .othersBtnWrap{
    width: 100%;
    margin-left: 0;
    float: none;
  }

  #products .othersBtnWrap .btnStopper a{
    display: block;
    color: #fff;
    text-decoration: none;
    width: 100%;
    height:auto;
    padding: 0 0 107% 0;
    background: url(../img/products/bg_stopper_sp.jpg) left top no-repeat;
    -webkit-background-size: 100%;
    background-size: 100%;
    margin-bottom: 15px;
    position:relative;
  }

  #products .othersBtnWrap .btnStopper .productsListTitle{
    position:absolute;
    left:20px;
    top:15px;
  }

  #products .othersBtnWrap .btnStopper .subTtl{
    margin-top:0;
    font-size: 18px;
  }

  #products .othersBtnWrap .btnStopper p.productsListText{ line-height: 1.4;}

  #products .othersBtnWrap a .otherItemTitle{
    position:absolute;
    left:20px;
    top:20px;
  }

  #products .othersBtnWrap .btn-link-type2 a{
    padding: 0 5%;
    font-size: 19px;
    margin-bottom:20px;
    border-top: 1px ;
    position:relative;
    padding-bottom:20%;
    border:none;
  }

  #products .othersBtnWrap .btn-link-type2 a.karoMat{
    background: url(../img/products/bg_karomat.png) no-repeat left top;
    background-size:100%;
    position:relative;
    padding-bottom:16%;
  }

  #products .othersBtnWrap .btn-link-type2 a.karoMat span{
    position:absolute;
    left:20px;
    top:27%;
    font-size:17px;
  }

  #products .othersBtnWrap .btn-link-type2 a span{
    margin-left: 0;
    font-size: 14px;
    display:block;
  }

  #products .othersBtnWrap .btn-link-type3 a{
    font-size: 21px;
    letter-spacing: 0;
    padding: 0;
    line-height: 1.4;
    position:relative;
  }

  #products .othersBtnWrap .btn-link-type3 a span{
    font-size: 14px;
    display: block;
  }

  #products .othersBtnWrap .btn-link-type3 a.btn3dColorL{
    border: none;
    background: url(../img/products/bg_3dcolorsimulation_sp.jpg) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    padding-bottom:47.5%;
    height: auto;
  }

  #products .othersBtnWrap .colorSimulation2D a{
    border: none;
    background: url(../img/products/bg_2d.png) left top no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    padding:0 0 23% 0;
    height: auto;
    position:relative;
  }

  #products .othersBtnWrap .colorSimulation2D a .otherItemTitle{ top:10px;}

  #products .othersBtnWrap .btn-link-type3 a.usersVoice{
    background: url(../img/products/bg_uservoice.png) left top no-repeat;
    height: auto;
    border: none;
    padding-bottom:27.5%;
    -webkit-background-size: 100%;
    background-size: 100%;
    position:relative;
  }

  #products .typeandColor .btn3dColorS a{
    background: url(../img/products/bg_3dcolorsimulation_s_sp.jpg) left top no-repeat;
    -webkit-background-size: 100%;
    background-size: 100%;
  }

  #products .productsInfoMainCol {
    width: 100%;
    float: none;
    padding: 40px 0 35px 15px;
  }

  #products .productsInfoMainCol h2.productsTtl {
    font-size: 37px;
    margin-bottom: 20px;
    line-height: 1.15em;
  }

  #products .productsInfoMainCol h2.productsTtl span{
    font-size: 24px;
    padding-left: 2%;
  }

  #products .productsInfoMainCol .productsDetail,
  #products .productsInfoMainCol .colorVariation {padding-right: 4%;}

  #products .productsInfoMainCol h3.introTtl {
    font-size: 20px;
    margin-bottom: 1%;
  }

  #products .productsInfoMainCol img {
    width: 100%;
    vertical-align: bottom;
  }

  #products .productsDetail p {
    font-size: 14.5px;
    letter-spacing: -0.03em;
    padding: 1% 0px 2%;
  }

  #products .productFeatures li {
      font-size: 14px;
      padding: 2px 5px 0;
      margin-right: 5px;
      margin-bottom:5px;
  }

  #products .productFeatures { margin-bottom: 35px;}

  #products .productsInfoMainCol .productsDetail,
  #products .productsInfoMainCol .colorVariation{ padding-right: 15px;}

  #products .colorDetail small{
    font-size:13px;
    line-height:1.5;
    font-weight:normal;
    display:block;
    text-indent:-1em;
    margin-left:1em;
  }

  #products #colorTab p small{
    font-size: 14px;
    display:block;
    line-height:1.3;
    margin-bottom:10px;
  }

  #products #colorTab ul { width: 100%;}

  #products #colorTab ul li{
    width: 24%;
    margin: 0 0 1% 1%;
  }

  #products #colorTab li a{
    width: 100%;
    border: none;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    padding:0;
  }

  #products #colorTab li a.btn-link{
    margin:0;
    height:auto;
  }

  #products #colorTab a span{display:none;}

  #products #colorTab li a:hover,
  #products #colorTab li.selected a{
    border: none !important;
  }

  #products #colorTab li a::after,
  #products #colorTab li a:hover::after,
  #products #colorTab li.selected a::after{
    border: none;
  }

  #products #colorTab li a img{
    width: 100%;
    left: 0;
    bottom: 0;
    position:static;
  }

  #products .spWarm { display: block;}

  #products .pcWarm { display: none;}

  #products .colorDetail {
    padding: 0px 2% 5px 3%;
    border: 2px solid #D3D3D3;
    margin-bottom: 6%;
  }

  #products .colorDetailInner { overflow: hidden;}

  #products .titleAndImages {
    width: 49%;
    position:relative;
    padding-top:40px;
   }

  #products .titleAndImages h4 {
    position:absolute;
    left:0px;
    top:0px;
    font-size: 20px;
    padding: 10px 0 15px;
    min-width:300px;
  }

  #products .titleAndImages small.black {
    margin-left: 0;
    font-size: 12px;
  }

  #products .titleAndImages p img {
    margin-bottom: 5%;
    width: 100%;
  }

  #products .overallView {
    width: 46%;
    padding-top:30px;
  }

  #products .overallView img{ width: 100%;  }

  #products .productsInfoMainCol .productsLinkWrap {padding-right: 15px;}

  #products .productsInfoMainCol a.btn-link2 {
    display:block;
    width: 90%;
    padding: 14px 30px 14px 18px;
    margin: 0 auto 8px auto;
    font-size:16px;
    box-sizing: border-box;
  }

  #products .productsInfoSideNav {
    width: 100%;
    float: none;
    border-top: 1px solid #676767;
  }

  #products .productsInfoSideNav h5 {
    display: none;
  }

  #products .productsInfoSideNav li.current {
    height: 49px;
    font-size: 12px;
    line-height: 49px;
    padding: 0 0 0 5%;
    background: #ccc
  }

  #products .productsInfoSideNav li.productTop{display: block;}

  #products .productsInfoSideNav li a {
    width: 100%;
    height: 49px;
    font-size: 12px;
    line-height: 49px;
    border-bottom: 1px solid #676767;
    background-color: #333;
    padding: 0 0 0 5%;
    display: block;
    position:relative;
  }

  #products .productsInfoSideNav li a:after {
    position: absolute;
    top: 50%;
    right: 5%;
    display: block;
    content: '';
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: 1px solid #c0c0c0;
    border-right: 1px solid #c0c0c0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  #products .productsInfoSideNav li.colorsimulation a::after,
  #products .productsInfoSideNav li.colorsimulation a:hover::after{
    position: absolute;
    top: 5px;
    right: 5%;
  }

/*----------------------------
2-3.adjustmentInfo
----------------------------*/

  #adjustmentInfo.mainContents {top: 0;}

  #adjustmentInfo #pageTtl{
    height: 212px;
    background: url(../img/adjustment_info/sp_adjustment_info_main.png) no-repeat ;
    background-position: 90% 60px;
    background-size: 155%;
  }

  #adjustmentInfo h2{
    line-height: 1.2em;
    padding-top: 6%;
    font-size: 30px;
    margin-bottom: 9px;
  }

  #adjustmentInfo #pageTtl h2 + .subTtl {
    font-size: 18px;
    letter-spacing: 0.2em;
  }

  #adjustmentInfo .leadArea{
    background: #dddcdc;
    padding: 17px 3% 15px 3%;
  }

  #adjustmentInfo .leadArea h3{
    color: #b70101;
    font-size: 16px;
    padding-bottom: 12px;
  }

  #adjustmentInfo .leadArea p {
    line-height: 1.5em;
    padding-bottom: 10px;
    font-size: 15px;
  }

  .adjustmentFlow li {
    display: inline-block;
    background: #b1b0b0;
    color: #d0d0d0;
    width: 100%;
    height: 57px;
    line-height: 57px;
    text-align: center;
    margin-bottom: 2%;
    position: relative;
    font-size: 18px;
  }

  .adjustmentFlow .current{
    color: #fff;
    border: none;
    background: #000;
  }

  .adjustmentFlow .chosen{
    background: #5f5f5f;
    color: #fff;
    border: solid 3px #b0b0b0;
    line-height: 51px;
    width: 100%;
  }

  .adjustmentFlow li:before{
      background: none;
  }

  .adjustmentFlow li:first-child:before{
    background: none;
  }

  #adjustmentInfo .choiceArea{
    background: #fff;
    padding: 30px 3% 0;
  }

  #adjustmentInfo .choiceArea h4{
    font-size: 17px;
    padding-bottom: 15px;
  }

  #adjustmentInfo .choiceArea h5{
    font-size: 17px;
    padding-bottom: 10px;
    padding-left: 8%;
    background-size: 14px 3px;
    background-position: 2% 11px;
  }

  .choiceArea .choiceBox{ padding-bottom: 40px;}

  .choiceArea li{
    width: 33%;
    border-left: solid 1px #9f9f9f;
    font-size: 6px;
  }

  .choiceArea li:nth-child(6n){ border-right: none;  }

  .choiceArea li:nth-child(3n){ border-right: solid 1px #9f9f9f;  }

  .choiceArea li:last-child{
    border-right: solid 1px #9f9f9f;
    width: 33%;
  }

  .choiceArea li a{
    color: #000;
    font-size: 11px;
    text-decoration: none;
    background: url(../img/icon_arrow_gray.png) no-repeat 4px center;
    background-size: 3px 6px;
    padding-left: 11%;
  }

  #adjustmentInfo .Question{
    background: #fff;
    text-align: center;
    border-top: solid 1px #ccc;
    padding: 20px 16%;
  }

  #adjustmentInfo .Question p{
    font-size: 13px;
    line-height: 1.3;
  }

  #adjustmentInfo .Question p span{
    font-weight: bold;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 5px;
  }

  #adjustmentInfo .Question p span.tel{
    display: block;
    line-height: 1.4;
    font-size: 17px;
  }

  #adjustmentInfo .Question a{
    font-size: 13px;
    color: #000;
    text-decoration: none;
    padding: 10px 0 10px 15px;
    background: url(../img/icon_arrow_gray.png) no-repeat 4px center;
  }

  #adjustmentInfo .adjustInfoDetail{
    padding: 0;
    border-top: none;
    padding-bottom: 1px;
  }

  #adjustmentInfo .adjustInfoDetailTtl{
    font-size: 18px;
    padding: 4% 2.5% 3%;
    margin-bottom: 13px;
    text-align: left;
  }

  #adjustmentInfo .adjustInfoDetailTtl p span{
    display: block;
    line-height: 1.4;
  }

  #adjustmentInfo .carTypeNavList{
    font-size: 14px;
    padding: 0px 2.5%;
    margin-bottom: 10px;
  }

  #adjustmentInfo .carTypeNavList li{
    margin-bottom: 10px;
  }

  #adjustmentInfo .carTypeNavList li a{
    padding-left: 20px;
    -webkit-background-size: 15px;
    background-size: 15px;
    font-size:14px;
  }

  #adjustmentInfo .carTypeInfoList > li{
    margin-bottom: 40px;
  }

  #adjustmentInfo .carTypeNameBox{
    border: none;
    border-bottom: 2px #d0d0d0 solid;
    padding: 5px 16% 2px 3%;
    font-size: 13px;
  }

  #adjustmentInfo .carTypeNameBox p{line-height: 1.7;}

  #adjustmentInfo .carTypeName{
    font-size: 14px;
    margin-bottom: 2px;
  }

  #adjustmentInfo .carTypeName span{margin-right: 5px;}

  #adjustmentInfo .carTypeDetailInfo{
    padding: 10px 3%;
    font-size: 12px;
    border: none;
  }

  #adjustmentInfo .carTypeDetailInfo .carImgBox{
    margin-bottom: 10px;
    float: none;
  }

  #adjustmentInfo .carTypeDetailInfo .carImgBox li{
    margin-bottom: 5px;
    font-size: 14px;
  }

  #adjustmentInfo .carTypeDetailInfo .carImgBox img{
    width: 90%;
  }

  #adjustmentInfo .carTypeDetailInfo .carImgBox .attentionTxt{
    font-size: 12px;
  }

  #adjustmentInfo .carTypeDetailInfo .adjustTable{
    font-size: 12px;
  }

  #adjustmentInfo .carTypeDetailInfo .adjustTable th,
  #adjustmentInfo .carTypeDetailInfo .adjustTable td{
    padding: 5px 2% 3px;
  }

  #adjustmentInfo .carTypeDetailInfo .carInfoTable{
    width: 100%;
    float: none;
    margin-bottom: 15px;
  }

  #adjustmentInfo .carInfoTable th{ width: 30%;}

  #adjustmentInfo .priceTablePC{ display: none;}

  #adjustmentInfo .priceTableSP{
    display: table;
    width: 100%;
  }

  #adjustmentInfo .carTypeDetailInfo .adjustTable.priceTableSP th{
      text-align: center;
      font-weight: bold;
    }

  #adjustmentInfo .priceTableSP th:first-child{ width: 30%;}

  #adjustmentInfo .priceTableSP .price{ text-align: center;}

/*-----------------------
2-5.whats karo
--------------------------*/
  #whatsKaro #pageTtl {
    background: url(../img/whats_karo/whats_karo_main_sp.jpg) center bottom no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    padding-top: 38%;
    padding-bottom: 15%;
  }

  #whatsKaro #pageTtl h2 {
    letter-spacing: 4px;
    padding-top: 0px;
  }

  #whatsKaro .whatsKaroInfoMainCol {
    width: 100%;
    float: none;
    padding: 34px 0 19px 15px;
  }

  #whatsKaro .whatsKaroInfoMainCol h2 {
    font-size: 30px;
    line-height: 1.35em;
    margin-bottom: 25px;
  }

  #whatsKaro .functionalDetail { margin-bottom: 19px;}

  #whatsKaro .functionalDetail span {
    width: 95%;
    padding-top: 0;
  }

  #whatsKaro .functionalDetail span>img { width: 100%; }

  #whatsKaro .functionalDetail span small { margin: -4px 0 2px 0; }

  #whatsKaro .whatsKaroDetail p {
    padding-bottom: 2.3%;
    margin-right: 5%;
  }

  #whatsKaro .whatsKaroInfoMainCol h3 {font-size: 20px;}

  #whatsKaro .functionalDetail p {
    width: 96%;
    padding-top: 1%;
  }

  #whatsKaro .whatsKaroInfoSideNav {
    width: 100%;
    float: none;
    border-top: 1px solid #676767;
  }

  #whatsKaro .whatsKaroInfoSideNav h5{ display: none;}

  #whatsKaro .whatsKaroInfoSideNav li.current {
    height: 49px;
    font-size: 13px;
    letter-spacing: 0.13em;
    line-height: 49px;
    padding: 0 0 0 5%;
    background: #ccc;
  }

  #whatsKaro .whatsKaroInfoSideNav li a {
    width: 100%;
    height: 49px;
    font-size: 13px;
    letter-spacing: 0.13em;
    line-height: 49px;
    border-bottom: 1px solid #676767;
    background-color: #333;
    padding: 0 0 0 5%;
    display: block;
    position:relative;
  }

  #whatsKaro .whatsKaroInfoSideNav li a:after {
    position: absolute;
    top: 50%;
    right: 5%;
    display: block;
    content: '';
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: 1px solid #c0c0c0;
    border-right: 1px solid #c0c0c0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  #whatsKaro .eyeCatchImg{ padding: 6px 0 9px 0;}

  #whatsKaro .eyeCatchImg img{width: 95%;}

  #whatsKaro .whatsKaroDetail .txtArea p{padding-top: 4px;}

  #whatsKaro .whatsKaroDetail .txtArea{padding-bottom: 25px;}

  #whatsKaro .whatsKaroDetail .txtArea img{
    width: 95%;
    padding-bottom: 10px;
  }

  #whatsKaro .whatsKaroDetail .txtArea .attentionTxt {padding: 6px 0 12px 1%; }

  #whatsKaro .functionalLinkBox{padding: 5px 0 10px;}

  #whatsKaro .whatsKaroDetail .orderSystemCarMat{
    border: solid 2px #d6d6d6;
    margin: 0 5% 22px 0;
    padding: 10px 11px 0 8px;
  }

  #whatsKaro .whatsKaroDetail .orderSystemCarMat h3{
    font-size: 18.5px;
    line-height: 1.2em;
  }

  #whatsKaro .whatsKaroDetail .orderSystemCarMat p{padding-top: 7px;}

/*-----------------------
2-6.35years_anniversary
--------------------------*/
  section.anniversaryIntro {
    background: url("../img/35years_anniversary/bg_sp_35yrs-anniversary02.jpg") left 83% no-repeat;
    padding: 99px 4.6% 0;
    background-size: contain;
  }

  section.anniversaryIntro h2 img{
    width: 99.3%;
    margin: 0 0 15px 0.7%;
  }

  section.anniversaryIntro h3 img{
    width: 64%;
    margin: 0 auto 30px;
  }

  section.anniversaryIntro .contentsInner{ margin: 0;}

  section.anniversaryIntro .anniversaryLeadArea>p {
    width: 100%;
    font-size: 14px;
    line-height: 2em;
    padding: 0 1% 0 2%;
    margin-bottom: 71%;
    float: none;
  }

  section.anniversaryIntro .anniversaryLeadArea .siteRenewal {
    position: relative;
    left: 0.6%;;
    top: auto;
  }

  section.anniversaryIntro .anniversaryLeadArea .siteRenewal img{
    width: 242px;
    display: block;
    margin: 0 auto 20px;
    padding: 0;
  }

  section.anniversaryProjects{ margin: 0 4.7%;}

  section.anniversaryProjects li {height: 253px; }

  section.anniversaryProjects li#emblem {height: auto;}

  section.anniversaryProjects h2{
    height: 30px;
    line-height: 30px;
    font-size: 17.3px;
    padding: 0.3% 0 0 3%;
    background-size: contain;
  }

  section.anniversaryProjects li#krone a { height: 252px;}

  section.anniversaryProjects a { padding: 4% 0 0 1.5%;}

  section.anniversaryProjects a>img {
    position: absolute;
    right: -2%;
    top: auto;
    bottom: -11%;
    width: 54.5%;
  }

  section.anniversaryProjects li#krone a>img {
    width: 51%;
    bottom: -6%;
    right: 0.2%;
  }

  section.anniversaryProjects li#emblem a>img {
    position: static;
    text-align: center;
    width: 100%;
    height: auto;
    padding: 0px 22.5%;
    margin: -5.6% 0 13px -1%;
  }

  section.anniversaryProjects .projectTxt {
    padding: 6px 0 0 41px;
    background-position: 1px 1px;
    background-size: 40px 30px;
  }

  section.anniversaryProjects li#emblem .projectTxt img {
    width: 84%;
    padding-top: 0;
  }

  section.anniversaryProjects .projectTag {
    width: 88px;
    height: 22px;
    font-size: 12px;
    letter-spacing: 0.15em;
    line-height: 22px;
    margin-bottom: 3px;
  }

  section.anniversaryProjects li#flaxy a{ background: url("../img/35years_anniversary/bg_sp_flaxy01.jpg") 0 bottom no-repeat;}
  section.anniversaryProjects li#krone a{ background: url("../img/35years_anniversary/bg_sp_krone01.jpg") 0 bottom no-repeat;}
  section.anniversaryProjects li#emblem a{ background: url("../img/35years_anniversary/bg_sp_emblem01.jpg") 0 bottom no-repeat;}

  section.anniversaryProjects li#krone h3{ letter-spacing: -0.025em;}

  section.anniversaryProjects h3 span{ font-size: 14.5px;}
  section.anniversaryProjects h3{
    font-size: 21px;
    line-height: 1.1em;
    margin:0 0 8px -2px;
  }

  #products .productsInfoMainCol h2 {
    font-size: 31px;
    line-height: 1.35em;
  }

  /*-----------------------
  2-7.stopper
  --------------------------*/
  #products #stopper h3 {
    font-size: 20px;
    margin-bottom: 1px;
  }

  #products #stopper .productsDetail p {letter-spacing: -0.05em;}

  #products .stopperIntro {
    padding-top: 0;
    margin-bottom: 30px;
  }

  #products .stopperIntro p {
    width: 100%;
    margin-right: 0;
  }

  #products .stopperIntro span{ width: 100%;}

  #products #stopper {padding-bottom: 30px;}

  #products #stopper .ttlDash {
    font-size: 21px;
    margin-bottom: 0;
  }

  #products .stopperDetail {
    padding-top: 7px;
    margin-bottom: 32px;
  }

  #products .stopperDetail .thumbsWrap {
    position: static;
    width: 100%;
  }

  #products .stopperDetail .thumbsWrap h5 { line-height: 1.6em;}

  #products .stopperDetail .thumbsWrap img {
    margin: 0;
    padding: 0;
    width: 49.4%;
  }

  #products dl.stopperImgFrontBack { padding: 0 10px;}

  #products .stopperImgFrontBack dt {
    width: 100%;
    height: 38px;
    line-height: 38px;
    font-size: 17px;
  }

  #products .stopperImgFrontBack dd {
    width: 100%;
    height: auto;
    margin: 0 0 10px 0;
  }

  #products .stopperHook h5 {
    line-height: 1.75em;
    margin-bottom: 4px;
  }

  #products .stopperHook {margin-bottom: 32px;}

  #products .stopperHook li {
    height: auto;
    width: 48%;
  }

  #products #stopper .stopperBoder {
    padding-bottom: 6px;
    margin: -32px 0 22px 0;
  }

  #products #stopper .incompatible{padding: 12px 0 18px 0;}

  #products #stopper .whatsKaroImgBox img {padding: 0 0 9px 0;}

}