div#HeaderBox{ position: fixed; width: 100%; z-index: 100; }



div#Contents {

  padding-top: 50px;

}



div#Contents h2.tit {

  background:url(../images/motorcycle/h2_title.png) no-repeat center top;

}



div#Contents h2.tit img{

  width: 100%;

}





.motorcycleBox{

  margin: 60px 10px 30px 10px;

}



.banner{margin-bottom: 30px;}

.banner img{width: 100%;}



/* ====================================================

  box01

==================================================== */

.motorcycleBox .box01{

  position: relative;

  box-sizing: border-box;

  background: #ffefcf;

  border: 5px solid #efb239;

  margin: 0 0 50px;

  padding: 0 15px 8px;

}



.motorcycleBox .box01 h3{

  background: #cd3917;

  margin: -34px -25px 0 -20px;

  padding: 6px 42px;

  border-radius: 50px;

  text-align: right;

}

.motorcycleBox .box01 h3 img{

  width: 182px;

}



.motorcycleBox .box01 > h4{

  margin: 20px 0 10px;

  font-size: 20px;

  line-height: 1.2;

  text-align: center;

}



.motorcycleBox .box01 > h4 span{

  position: absolute;

  top: -61px;

  left: -10px;

  display: inline-block;

  background: url(../../images/motorcycle/fukidashi.png) no-repeat center top / contain;

  width: 126px;

  height: 110px;

  text-indent: -9999em;

}



.motorcycleBox .box01 .wrap{

  position: relative;

  display: flex;

  justify-content: space-between;

  align-content: center;

  background: #fff;

  margin: 6px 0 25px;

}

.motorcycleBox .box01 .wrap::before{

  content: "";

  position: absolute;

  top: 3px;

  left: 3px;

  border-style: solid;

  border-width: 13px 13px 0 0;

  border-color: #b09663 transparent transparent transparent;

}

.motorcycleBox .box01 .wrap::after{

  content: "";

  position: absolute;

  right: 3px;

  bottom: 3px;

  border-style: solid;

  border-width: 0 0 13px 13px;

  border-color: transparent transparent #b09663 transparent;

}

.motorcycleBox .box01 .wrap .img{

  position: relative;

  display: flex;

  justify-content: center;

  align-items: center;

  width: 54%;

}

.motorcycleBox .box01 .wrap .img img{

  width: 108px;

}

.motorcycleBox .box01 .wrap .img::after{

  content: "";

  position: absolute;

  right: 0;

  bottom: 0;

  background: #fff;

  width: 10px;

  height: 10px;

}

.motorcycleBox .box01 .wrap ul{

  width: 46%;

  padding: 12px 6px 12px 0;

}

.motorcycleBox .box01 .wrap ul li{

  margin: 0 0 2px;

}

.motorcycleBox .box01 .wrap ul li:last-child{

  margin-bottom: 0;

}

.motorcycleBox .box01 .wrap img{

  width: 100%;

}



.motorcycleBox .box01 .gallery h4,

.motorcycleBox .box02 .gallery h4{

  position: relative;

  z-index: 2;

  margin: 0 0 8px;

  text-align: center;

}

.motorcycleBox .box01 .gallery h4::before,

.motorcycleBox .box02 .gallery h4::before{

  position: absolute;

  top: 11px;

  left: 0;

  right: 0;

  z-index: -1;

  content: "";

  width: 100%;

  height: 2px;

  border-top: 2px solid #d2ba8a;

  border-bottom: 2px solid #d2ba8a;

}

.motorcycleBox .box01 .gallery h4 img,

.motorcycleBox .box02 .gallery h4 img{

  background: #ffefcf;

  width: 88px;

  padding: 0 6px;

}

.motorcycleBox .box02 .gallery h4 img{

  background: #fcf6ea;

}



.motorcycleBox .box01 .gallery ul,

.motorcycleBox .box02 .gallery ul{

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

}



.motorcycleBox .box01 .gallery ul li,

.motorcycleBox .box02 .gallery ul li{

  width: calc((100% - 5px) / 2);

  margin: 0 0 5px;

}



.motorcycleBox .box01 .gallery ul li img,

.motorcycleBox .box02 .gallery ul li img{

  width: 100%;

}





/* ====================================================

  box02

==================================================== */

.motorcycleBox .box02{

  box-sizing: border-box;

  background: #fcf6ea;

  border: 5px solid #e4db93;

  margin: 0 0 25px;

  padding: 0 15px 8px;

}



.motorcycleBox .box02 .pc-wrap h3{

  margin: -30px -15px 0 -33px;

}

.motorcycleBox .box02 .pc-wrap h3 img{

  width: 100%;

}

.motorcycleBox .box02 .pc-wrap .j-map{

  text-align: center;

}

.motorcycleBox .box02 .pc-wrap .j-map img{

  width: 80%;

}

.motorcycleBox .box02 .pc-wrap p{

  margin: 3px 0 10px;

}



.motorcycleBox .box02 .icons-wrap{

  margin: 0 0 20px;

}

.motorcycleBox .box02 .icons-wrap > div{

  box-sizing: border-box;

  background: #fff;

  border-radius: 5px;

  margin: 0 0 10px;

  padding: 15px 14px;

}

.motorcycleBox .box02 .icons-wrap > div img{

  width: 100%;

}

.motorcycleBox .box02 .icons-wrap > div h4{

  position: relative;

  z-index: 2;

  margin: 0 0 18px;

  text-align: center;

}

.motorcycleBox .box02 .icons-wrap > div h4::before{

  content: "";

  position: absolute;

  z-index: -1;

  top: 12px;

  left: 0;

  right: 0;

  background: #c4c4c4;

  width: 100%;

  height: 1px;

}

.motorcycleBox .box02 .icons-wrap > div h4 img{

  background: #fff;

  padding: 0 3px;

  width: 206px;

}

.motorcycleBox .box02 .icons-wrap > div.impossible h4 img{

  width: 232px;

}



.motorcycleBox .box02 .icons-wrap > div ul{

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

}

.motorcycleBox .box02 .icons-wrap > div ul li{

  display: flex;

  justify-content: center;

  align-items: flex-end;

  box-sizing: border-box;

  background: #e66d2b;

  width: 80px;

  height: 100px;

  margin: 0 2px 4px;

  padding: 0 0 12px;

  border-radius: 10px;

  text-align: center;

}

.motorcycleBox .box02 .icons-wrap > div ul li p{

  color: #fff;

  margin: 10px 0 0;

  font-weight: 600;

}



.motorcycleBox .box02 .icons-wrap .possible ul li:nth-child(1) img{ width: 56px; }

.motorcycleBox .box02 .icons-wrap .possible ul li:nth-child(2) img{ width: 39px; }

.motorcycleBox .box02 .icons-wrap .possible ul li:nth-child(3) img{ width: 30px; }

.motorcycleBox .box02 .icons-wrap .possible ul li:nth-child(4) img{ width: 56px; }

.motorcycleBox .box02 .icons-wrap .possible ul li:nth-child(5) img{ width: 40px; }



.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(1) img{ width: 63px; }

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(2) img{ width: 51px; }

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(3) img{ width: 58px; }

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(4) img{ width: 39px; }





.motorcycleBox .box02 .icons-wrap .impossible ul{

  justify-content: flex-start;

  width: 252px;

  margin: auto;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li{

  background: #d6d6d6;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li p{

  color: #000;

  line-height: 1;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(2) p{

  margin-top: 9px;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(3) p{

  margin-top: 12px;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li:nth-child(4) p{

  margin-top: 13px;

}



.motorcycleBox .box02 .icons-wrap .impossible ul li.text{

  justify-content: flex-start;

  align-items: center;

  background: none;

  padding: 0;

  flex-grow: 1;

}

.motorcycleBox .box02 .icons-wrap .impossible ul li.text p{

  margin: 0;

  font-weight: normal;

  text-align: left;

  font-size: 10px;

}





/* ====================================================

  box03

==================================================== */

.motorcycleBox .box03{

  padding: 0 0 20px;

  border-bottom: 1px solid #d1d1d1;

}

.motorcycleBox .box03 h3{

  background: url(../images/shop/common/img_bg_01.png) repeat-x 0 bottom;

  margin-bottom: 10px;

}

.motorcycleBox .box03 h3 span{

  background: url(/images/motorcycle/title04.png) no-repeat 0 0 / 216px;

  display: block;

  height: 51px;

  padding-bottom: 10px;

  text-indent: -9999px;

}



.motorcycleBox .box03 h4,

.motorcycleBox .box04 h4{

  position: relative;

  margin: 20px 0 10px;

  padding: 0 0 0 42px;

  font-size: 16px;

}

.motorcycleBox .box03 h4 span,

.motorcycleBox .box04 h4 span{

  position: absolute;

  bottom: -4px;

  left: 0;

  display: inline-block;

  background: url(/images/motorcycle/num1.png) no-repeat center / contain;

  width: 36px;

  height: 31px;

  text-indent: -9999em;

}

.motorcycleBox .box04 h4 span{

  background: url(/images/motorcycle/num2.png) no-repeat center / contain;

}



.motorcycleBox .box03 .wrap ul{

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

}

.motorcycleBox .box03 .wrap ul.left-box li{

  width: calc((100% - 5px) / 2);

  margin: 0 5px 5px 0;

}

.motorcycleBox .box03 .wrap ul.left-box li:nth-child(2n){

  margin-right: 0;

}

.motorcycleBox .box03 .wrap ul.right-box li{

  width: calc((100% - 15px) / 3);

  margin: 0 5px 5px 0;

}

.motorcycleBox .box03 .wrap ul.left-box li:nth-child(3n){

  margin-right: 0;

}

.motorcycleBox .box03 .wrap ul li img,

.motorcycleBox .box04 .wrap .photo img{

  width: 100%;

}



.motorcycleBox .box03 p{

  margin: 6px 0 0;

}







/* ====================================================

  box04

==================================================== */

.motorcycleBox .box04{

  margin: 0 0 25px;

}

.motorcycleBox .box04 .wrap .photo{

  width: 87%;

  margin: 0 auto 10px;

}

.motorcycleBox .box04 .wrap .attention{

  box-sizing: border-box;

  background: #d7e5f0;

  width: 100%;

  margin: 10px 0 0;

  padding: 18px 10px;

  border-radius: 5px;

  text-align: center;

}

.motorcycleBox .box04 .wrap .attention h5{

  color: #22557f;

  margin: 0 0 2px;

  font-size: 16px;

}









/* ====================================================

  box05

==================================================== */

.motorcycleBox .box05 a img{

  width: 100%;

}