@charset "UTF-8";
/*
 * layout.css
 *
 *  version --- 3.5
 *  updated --- 2013/07/23
 */


/* !wrapper
---------------------------------------------------------- */
#wrapper {
  margin: 0 auto;
  padding-top: 130px;
  text-align: left;
}


/* !header
---------------------------------------------------------- */
#header_wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;

}
  #header {
  position:relative;
}
 #headerIn {
  background: #FFF;
 }
 #headerArea {
  margin: 0 auto;
  width: 1000px;
  text-align: left;
 }

  #headerLogo {
  padding: 20px 0;
  float: left;
  }

  #headerLinks {
  float: right;
  margin-top: 25px;
  }
   #headerLinks li {
    float: left;
    margin-left: 20px;
   }


/* !gNavi
---------------------------------------------------------- */
#gnaviWrap {
  position: relative;
  padding: 0;
  z-index: 1;
  width: 100%;
  background: #18B6F0;
}

#gnaviWrap nav {
  display: block;
  margin: 0 auto;
  width: 1000px;
  *zoom: 1;
}

 #gNavi {
  display: block;
  margin: 0 auto;
  width: 1000px;
  height: 50px;
  *zoom: 1;
  z-index: 2;
 }
  #gNavi li#gNav_about,
  #gNavi li#gNav_sodamaker,
  #gNavi li#gNav_syrup,
  #gNavi li#gNav_bottle,
  #gNavi li#gNav_cylinder,
  #gNavi li#gNav_monthly,
  #gNavi li#gNav_shop {
    float: left;
    width:auto;
    height: 50px;
    *zoom: 1;
  }
  #gNavi li#gNav_about {
    width: 213px;
  }
  #gNavi li#gNav_sodamaker {
    width: 144px;
  }
  #gNavi li#gNav_syrup {
    width: 105px;
  }
  #gNavi li#gNav_bottle {
    width: 90px;
  }
  #gNavi li#gNav_cylinder {
    width: 143px;
  }
  #gNavi li#gNav_monthly {
    width: 157px;
  }
  #gNavi li#gNav_shop {
    width: 148px;
  }
   #gNavi li#gNav_about a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_about_no.png) left top no-repeat;
}
   #gNavi li#gNav_sodamaker a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_sodamaker_no.png) left top no-repeat;
}
   #gNavi li#gNav_syrup a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_syrup_no.png) left top no-repeat;
}
   #gNavi li#gNav_bottle a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_bottle_no.png) left top no-repeat;
}
   #gNavi li#gNav_cylinder a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_cylinder_no.png) left top no-repeat;
}
   #gNavi li#gNav_monthly a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_monthly_no.png) left top no-repeat;
}
   #gNavi li#gNav_shop a.navi {
    display: block;
    padding: 25px 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_shop_no.png) left top no-repeat;
}

   #gNavi li#gNav_about:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_about_on.png) left top no-repeat;}
   #gNavi li#gNav_sodamaker:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_sodamaker_on.png) left top no-repeat;}
   #gNavi li#gNav_syrup:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_syrup_on.png) left top no-repeat;}
   #gNavi li#gNav_bottle:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_bottle_on.png) left top no-repeat;}
   #gNavi li#gNav_cylinder:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_cylinder_on.png) left top no-repeat;}
   #gNavi li#gNav_monthly:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_monthly_on.png) left top no-repeat;}
   #gNavi li#gNav_shop:hover > a.navi { background: url(/user_data/packages/default/img/layout/header/nav_gnavlist_shop_on.png) left top no-repeat;}


/* !Sub Navigation
---------------------------------------------------------- */
.menu_box {
  display: none;
  position: absolute;
  left: 0;
  top: 50px;
  width: 100%;
  background: #FFF url(/user_data/packages/default/img/layout/header/bg_shadow.png) left top repeat-x;
}
  .menu_box .menu_inner {
    margin: 0 auto;
    padding: 40px 0 40px;
    width: 950px;
  }
    .menu_box .sodamaker {
      background: url(/user_data/packages/default/img/layout/header/bg_sodamaker.png) center top no-repeat;
    }
    .menu_box .syrup {
      background: url(/user_data/packages/default/img/layout/header/bg_syrup.png) center top no-repeat;
    }
    .menu_box .bottle {
      background: url(/user_data/packages/default/img/layout/header/bg_bottle.png) center top no-repeat;
    }
    .menu_box .cylinder {
      background: url(/user_data/packages/default/img/layout/header/bg_cylinder.png) center top no-repeat;
    }
    .menu_box .menu_inner ul {

    }
      .menu_box .menu_inner ul li {
        float: left;
      }
      .menu_box .menu_inner ul .description {
        padding-left: 60px;
        width: 260px;
      }
        .menu_box .menu_inner ul .description h2 {
          margin-bottom: 40px;
        }
      .menu_box .menu_inner ul .list1 {
        padding-right: 20px;
        width: 325px;
      }
      .menu_box .menu_inner ul .list2 {
        width: 285px;
      }
      .menu_box .menu_inner ul .list_wide {
        width: 630px;
      }
        .menu_box .menu_inner ul li dl {
          margin-bottom: 36px;
        }
          .menu_box .menu_inner ul li dl:last-child {
            margin-bottom: 0px;
          }
          .menu_box .menu_inner ul li dl dt {
            margin-bottom: 10px;
          }
          .menu_box .menu_inner ul li dl dd {
            margin-bottom: 6px;
          }
            .menu_box .menu_inner ul li dl dd:last-child {
              margin-bottom: 0;
            }
            .menu_box .menu_inner ul li dl dd a {
              display: block;
              padding-left: 9px;
              line-height: 1.5em;
              text-decoration: none;
              background: url(/user_data/packages/default/img/layout/header/icn_arrow.png) left 5px no-repeat;
            }
              .menu_box .menu_inner ul li dl dd a:hover {
                text-decoration: underline;
                color: #18B6F0;
              }
        .menu_box .menu_inner ul li .list_wide {

        }
          .menu_box .menu_inner ul .list_wide dd {
            float: left;
            width: 315px;
          }
        .menu_box .menu_inner .cylinder_list {
          margin-left: 50px;
        }
          .menu_box .menu_inner .cylinder_list li {
            margin-left: 20px;
            padding-left: 20px;
            width: 250px;
            border-left: #DFDFDF 1px solid;
            text-align: center;
          }
          .menu_box .menu_inner .cylinder_list li:first-child {
            margin-left: 0;
            padding-left: 0;
            border-left: 0;
          }
            .menu_box .menu_inner .cylinder_list li img {
              margin-bottom: 10px;
            }
            .menu_box .menu_inner .cylinder_list li span {
              padding-left: 9px;
              background: url(/user_data/packages/default/img/layout/header/icn_arrow.png) left 4px no-repeat;
            }
            .menu_box .menu_inner .cylinder_list li a {
              text-decoration: none;
              display: block;
            }
              .menu_box .menu_inner .cylinder_list li a:hover {
                text-decoration: underline;
                color: #18B6F0;
              }


/* !screen
---------------------------------------------------------- */
.navi_screen {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  background: #00BCFF;
  z-index: 100;
}

/* !footer
---------------------------------------------------------- */
footer{
 text-align: left;
 *zoom: 1;
 width: 100%;
}

 #footerSocialWrap {
  background: #00BCFF;
 }

 .breadcrumb02 {
  float: left;
  margin-top: 5px;
 }
  #footerSocial {
   margin: 0 auto;
   width:  1000px;
   padding: 10px 0;
   text-align: left;
  }
   .pageTop {
    float: left;
   }

   #footerSocialBox01 {
    float:right;
   }
    #footerSocialBox01 ul {
     float: left;
    }
    #footerSocialBox01 p {
     float:left;
     margin: 3px 11px 0 0;
    }

     #footerSocialBox01 ul li {
      float: left;
      margin-right: 11px;
     }
     #footerSocialBox01 ul li.last {
      margin-right: 0;
     }


#footerIn {
 width: 1000px;
 margin: 0 auto 0;
}

  #footerBoxWrap {
    padding: 20px 0;
    background: #fff url(/user_data/packages/default/img/layout/footer/img_line.gif) 0 100% repeat-x;
    display: block;
    min-height: 1%;
  }
  #footerBoxWrap:after {
    clear: both;
    content:".";
    display: block;
    height: 0;
    visibility: hidden;
  }
  * html #footerBoxWrap {
    height: 1%;
    /*\*//*/
    height: auto;
    overflow: hidden;
    /**/
  }
  #footerBoxWrap li.box {
    float: left;
    margin-right: 20px;
    padding-right: 20px;
    width:  306px;
    line-height: 1.5em;
    border-right: #EFEFEF 1px solid;
  }
    #footerBoxWrap li.box.last {
      margin-right: 0;
      padding-right: 0;
      border-right: none;
    }
    #footerBoxWrap li h3 {
      margin-bottom: 10px;
    }
    #footerBoxWrap li p {
      margin-bottom: 10px;
    }
    #footerBoxWrap li .card {
    }
    #footerBoxWrap li .card li {
      float: left;
      margin-right: 10px;
    }



   #footerBox02 ul li{
    float: left;
   }

   #footerBox02 ul li.last .calendarBox01 {
    margin-left: 40px;
   }

    .calendarBox01 {
     width: 245px;
    }

      .calendarMonth01 {
       font-weight: bold;
       color: #666;
       float: left;
      }

      #footerBox02 ul li .calendarHoliday01 {
       float: right;
      }

     .table_calender01 {
      color: #777;
      width: 246px;
     }


       .table_calender01 th {
        width: 35px;
        background: #fff;
        text-align: center;
        padding: 7px 0;
       }

       .table_calender01 td {
       width: 35px;
       table-layout: fixed;
       background: #fff;
       text-align: center;
       border-right: 1px solid #e5e5e5;
       }

       .table_calender01 td.td_first {
        border-left: 1px solid #e5e5e5;
      }

       .table_calender01 td div {
        margin: 1px;
        padding: 8px 0;
       }

       .table_calender01 td.calenderColor01 div {
        margin: 1px;
        background: #d2ebf8;
       }


/*footerRemoteNavi*/
 #footerRemoteNavi {
  position: relative;
  width: 1000px;
 }

 #footerRemoteNavi li {
  float: left;
 }



#footerCopyWrap {
 margin: 0 auto;
 padding-top: 20px;
 width: 1000px;
 height: 42px;
 display: block;
 min-height: 1%;
 background: url(/user_data/packages/default/img/layout/footer/img_line.gif) left top repeat-x;
}
#footerCopyWrap:after {
 clear: both;
 content:".";
 display: block;
 height: 0;
 visibility: hidden;
}
* html #footerCopyWrap {
 height: 1%;
 /*\*//*/
 height: auto;
 overflow: hidden;
 /**/
}
 #footerCopy {
  display: block;
  position: relative;
  width: 1000px;
  height: 12px;
  margin: 0 auto;

 }
  .footerLogo01 {
   float: left;
  }
  #copyright {
   margin-top: 5px;
   float: right;
  }