@charset "Shift_JIS";
/*-----------------------------------------------------

  Top CSS (LastUpdate:2015.10.26)

    - Contents Area, Contents
    - Main Area
    - date
    - Barcode
    - Chance
    - Notes
    - Button Area
    - Page Top

-----------------------------------------------------*/
/*-----------------------------------------------------

  Contents Area, Contents

-----------------------------------------------------*/
#contents-area {
  padding-top: 0;
  margin-top: -240px;
  position: relative;
  background: url(../img/index_contents_bg.png) no-repeat right 1125px;
}




/*-----------------------------------------------------

  Main Area

-----------------------------------------------------*/
#main-area {
  position: relative;
  height: 880px;
  background: url(../img/index_main_bg.jpg) no-repeat bottom center;
  z-index: 0;
}


/*-----------------------------------------------------
  Kobayashi Logo
-----------------------------------------------------*/
#main-area #company {
  top: 15px;
  left: 30px;
}


/*-----------------------------------------------------
  Lead
-----------------------------------------------------*/
#main-area .lead {
  position: absolute;
  top: 320px;
  left: 0;
  z-index: 100;
}


/*-----------------------------------------------------
  Title
-----------------------------------------------------*/
#main-area h1 {
  padding: 55px 0;
}


/*-----------------------------------------------------
  date
-----------------------------------------------------*/
#main-area .date {
  display: inline;
  float: left;
  width: 265px;
  margin: 0 0 0 30px;
  padding: 0 0 0 0;
}

#main-area .date dt, #main-area .date dd {
	float: none;
}


/*-----------------------------------------------------
  Products
-----------------------------------------------------*/
#main-area .products {
  display: inline;
  float: left;
  width: 320px;
  margin-left: 25px;
}

#main-area .products dd {
  padding: 10px 0 12px 20px;
  background: url(../img/index_products_bg.png) no-repeat left bottom;
}

#main-area .products dd ul {
  width: 285px;
  height: 50px;
}

#main-area .products dd ul li {
  display: inline;
  float: left;
  height: 20px;
  margin: 0 5px 5px 0;
  overflow: hidden;
}

#main-area .products dd .notes {
  padding: 2px 20px 0 0;
  text-align: right;
  height: 11px;
  overflow: hidden;
}


/*-----------------------------------------------------
  SNS
-----------------------------------------------------*/
#main-area .sns {
  display: inline;
  float: right;
  width: 265px;
  margin-right: 30px;
}

#main-area .sns dd {
  height: 85px;
  background: url(../img/index_sns_bg.png) no-repeat left bottom;
}

#main-area .sns dd ul {
  padding: 10px 0 0 23px;
  overflow: hidden;
}

#main-area .sns dd ul li {
  display: inline;
  float: left;
  margin-right: 20px;
  width: 60px;
}

#main-area .sns dd ul .line {
  overflow: hidden;
  height: 60px;
  background: url(../img/index_line.png) no-repeat;
}

#main-area .sns dd ul .line span {
  display: block;
  overflow: hidden;
  width: 60px;
  height: 60px;
}

#main-area .sns dd ul .line a {
  display: block;
  overflow: hidden;
  width: 60px;
  height: 0 !important;
  padding-top: 60px !important;
  background: none !important
  cursor: pointer !important;
}

#main-area .sns dd ul .line a span {
  display: block;
  overflow: hidden;
  height: 60px;
  width: 60px;
}

#main-area .sns dd ul .line a img {
  display: none;
}


/*-----------------------------------------------------

  Barcode

-----------------------------------------------------*/
/* Layout and Common
-----------------------------------------------------*/
.barcode {
  margin-bottom: 30px;
  position: relative;
}

.barcode h2 {
  position: absolute;
  top: 0;
  left: -7px;
}

.barcode ul {
  padding: 10px 10px 0 110px;
}

.barcode li {
  display: inline;
  float: left;
  margin-left: 5px;
  padding-bottom: 5px;
}


/* Barcode01(A-F)
-----------------------------------------------------*/
#barcode01 {
  background: url(../img/index_barcode01_bg.png) no-repeat right top;
  height: 455px;
}

#barcode01 ul {
  width: 780px;
}


/* Barcode02(G-I)
-----------------------------------------------------*/
#barcode02  {
  background: url(../img/index_barcode02_bg.png) no-repeat right top;
  height: 275px;
}
#barcode02 ul {
  width: 780px;
}


/* Barcode03(I), Barcode04(J)
-----------------------------------------------------*/
#barcode03-04 {
  overflow: visible;
}

#barcode03, #barcode04 {
  display: inline;
  float: left;
  background: url(../img/index_barcode03-04_bg.png) no-repeat right top;
  height: 275px;
  width: 435px;
	margin-bottom: 0;
}

#barcode03 {
}

#barcode04 {
  margin-left: 30px;
}

#barcode03 ul, #barcode04 ul {
  width: 315px;
}

#barcode03 li, #barcode04 li {
  padding-bottom: 0;
}




/*-----------------------------------------------------

  Lucky

-----------------------------------------------------*/
#lucky {
  background: url(../img/index_lucky_bg.png) no-repeat center top;
  width: 580px;
  height: 180px;
  text-align: center;
}



/*-----------------------------------------------------

  Chance

-----------------------------------------------------*/
#chance {
   background: url(../img/index_chance_bg.png) no-repeat center bottom;
  width: 580px;
  height: 156px;
  text-align: center;
}




/*-----------------------------------------------------

  Notes

-----------------------------------------------------*/
#contents-area .notes {
  width: 580px;
  padding: 20px 0 80px 0;
  color: #333333;
}




/*-----------------------------------------------------

  Method

-----------------------------------------------------*/
#method {
  margin-bottom: 50px;
  border: solid #480500 5px;
  border-top: none;
  background: #ffffff;
}

#method h2 {
  margin-bottom: 45px;
}

#method #flow {
  padding: 0 45px 50px 45px;
}

#method #flow .lead {
  margin-bottom: 30px;
}


/*-----------------------------------------------------
  Step
-----------------------------------------------------*/
/* Common
-----------------------------------------------------*/
#method #step01, #method #step02, #method #step03 {
  padding-bottom: 70px;
  background: url(../img/index_step_btm.png) no-repeat left bottom;
}

#method #step02 .text-area, #method #step03 .text-area, #method #step04 .text-area {
  padding-left: 75px;
}

#method .text-area .notes {
  clear: both;
  padding: 10px 0 0 0;
  zoom: 100%;
  width: 100%;
}

#method .text-area .notes li {
  display: block !important;
  float: none !important;
  margin-left: 0 !important;
  color: #666666;
}

/* Step01
-----------------------------------------------------*/
#method #step01 h3 {
  float: left;
}

#method #step01 p {
  float: right;
  padding-top: 10px;
}

/* Step02
-----------------------------------------------------*/
#method #step02 .text-area {
  margin-top: 20px;
}

#method #step02 h4 {
  margin-bottom: 10px;
  border-left: 4px solid #e50012;
  padding-left: 10px;
}

#method #step02 ul li {
  display: inline;
  float: left;
  margin-right: 15px;
}

#method #step02 ul .end {
  margin-right: 0;
}

/* Step03
-----------------------------------------------------*/
#method #step03 h2 {
  margin-bottom: 20px;
}

/* Step04
-----------------------------------------------------*/
#method #step04 {
  margin-bottom: 40px;
}

#method #step04 h2 {
  margin-bottom: 7px;
}

#method #step04 .photo {
  float: left;
}

#method #step04 .caution {
  float: right;
  padding-top: 23px;
}


/*-----------------------------------------------------
  address
-----------------------------------------------------*/
#method #address {
  margin-bottom: 40px;
  padding: 10px 43px;
  border: 2px solid #e50012;
}

#method #address dt {
  float: left;
}

#method #address dd {
  float: right;
}

/*-----------------------------------------------------
  guidance
-----------------------------------------------------*/
#method #guidance dt {
  margin-bottom: 15px;
	border-left: 5px solid #e50012;
  padding-left: 8px;
}

#method #guidance dd {
  margin-bottom: 40px;
  padding-bottom: 25px;
  background: url(../common/img/cmn_dotline.png) repeat-x left bottom;
}

#method #guidance dd.end {
  margin-bottom: 0;
  padding-bottom: 0;
  background: none;
}

#method #guidance dd.date ul li {
  float: left;
  width: 370px;
}




/*-----------------------------------------------------

  Button Area

-----------------------------------------------------*/
#button-area {
  padding-left: 130px;
}

#button-area li {
  display: inline;
  float: left;
  width: 300px;
  margin-right: 30px;
}



/*-----------------------------------------------------

  Page Top

-----------------------------------------------------*/
body#Top #Footer p#PageTop {
  padding-right: 49px;
}