cf {
  zoom: 1; }

.cf:after {
  content: "";
  display: block;
  clear: both; }

/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  text-decoration: none; }

.opentip-container,
.opentip-container * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.opentip-container {
  position: absolute;
  max-width: 300px;
  z-index: 100;
  -webkit-transition: -webkit-transform 1s ease-in-out;
  -moz-transition: -moz-transform 1s ease-in-out;
  -o-transition: -o-transform 1s ease-in-out;
  -ms-transition: -ms-transform 1s ease-in-out;
  transition: transform 1s ease-in-out;
  pointer-events: none;
  -webkit-transform: translateX(0) translateY(0);
  -moz-transform: translateX(0) translateY(0);
  -o-transform: translateX(0) translateY(0);
  -ms-transform: translateX(0) translateY(0);
  transform: translateX(0) translateY(0); }

.opentip-container.ot-fixed.ot-hidden.stem-top.stem-center,
.opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-center,
.opentip-container.ot-fixed.ot-hiding.stem-top.stem-center {
  -webkit-transform: translateY(-5px);
  -moz-transform: translateY(-5px);
  -o-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px); }

.opentip-container.ot-fixed.ot-hidden.stem-top.stem-right,
.opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-right,
.opentip-container.ot-fixed.ot-hiding.stem-top.stem-right {
  -webkit-transform: translateY(-5px) translateX(5px);
  -moz-transform: translateY(-5px) translateX(5px);
  -o-transform: translateY(-5px) translateX(5px);
  -ms-transform: translateY(-5px) translateX(5px);
  transform: translateY(-5px) translateX(5px); }

.opentip-container.ot-fixed.ot-hidden.stem-middle.stem-right,
.opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-right,
.opentip-container.ot-fixed.ot-hiding.stem-middle.stem-right {
  -webkit-transform: translateX(5px);
  -moz-transform: translateX(5px);
  -o-transform: translateX(5px);
  -ms-transform: translateX(5px);
  transform: translateX(5px); }

.opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-right,
.opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-right,
.opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-right {
  -webkit-transform: translateY(5px) translateX(5px);
  -moz-transform: translateY(5px) translateX(5px);
  -o-transform: translateY(5px) translateX(5px);
  -ms-transform: translateY(5px) translateX(5px);
  transform: translateY(5px) translateX(5px); }

.opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-center,
.opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-center,
.opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-center {
  -webkit-transform: translateY(5px);
  -moz-transform: translateY(5px);
  -o-transform: translateY(5px);
  -ms-transform: translateY(5px);
  transform: translateY(5px); }

.opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-left,
.opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-left,
.opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-left {
  -webkit-transform: translateY(5px) translateX(-5px);
  -moz-transform: translateY(5px) translateX(-5px);
  -o-transform: translateY(5px) translateX(-5px);
  -ms-transform: translateY(5px) translateX(-5px);
  transform: translateY(5px) translateX(-5px); }

.opentip-container.ot-fixed.ot-hidden.stem-middle.stem-left,
.opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-left,
.opentip-container.ot-fixed.ot-hiding.stem-middle.stem-left {
  -webkit-transform: translateX(-5px);
  -moz-transform: translateX(-5px);
  -o-transform: translateX(-5px);
  -ms-transform: translateX(-5px);
  transform: translateX(-5px); }

.opentip-container.ot-fixed.ot-hidden.stem-top.stem-left,
.opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-left,
.opentip-container.ot-fixed.ot-hiding.stem-top.stem-left {
  -webkit-transform: translateY(-5px) translateX(-5px);
  -moz-transform: translateY(-5px) translateX(-5px);
  -o-transform: translateY(-5px) translateX(-5px);
  -ms-transform: translateY(-5px) translateX(-5px);
  transform: translateY(-5px) translateX(-5px); }

.opentip-container.ot-fixed .opentip {
  pointer-events: auto; }

.opentip-container.ot-hidden {
  display: none; }

.opentip-container .opentip {
  position: relative;
  font-size: 13px;
  line-height: 120%;
  padding: 9px 14px;
  color: #4f4b47;
  text-shadow: -1px -1px 0px rgba(255, 255, 255, 0.2); }

.opentip-container .opentip .header {
  margin: 0;
  padding: 0; }

.opentip-container .opentip .ot-close {
  pointer-events: auto;
  display: block;
  position: absolute;
  top: -12px;
  left: 60px;
  color: rgba(0, 0, 0, 0.5);
  background: transparent;
  text-decoration: none; }

.opentip-container .opentip .ot-close span {
  display: none; }

.opentip-container .opentip .ot-loading-indicator {
  display: none; }

.opentip-container.ot-loading .ot-loading-indicator {
  width: 30px;
  height: 30px;
  font-size: 30px;
  line-height: 30px;
  font-weight: bold;
  display: block; }

.opentip-container.ot-loading .ot-loading-indicator span {
  display: block;
  -webkit-animation: otloading 2s linear infinite;
  -moz-animation: otloading 2s linear infinite;
  -o-animation: otloading 2s linear infinite;
  -ms-animation: otloading 2s linear infinite;
  animation: otloading 2s linear infinite;
  text-align: center; }

.opentip-container.style-dark .opentip,
.opentip-container.style-alert .opentip {
  color: #f8f8f8;
  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); }

.opentip-container.style-glass .opentip {
  padding: 15px 25px;
  color: #317cc5;
  text-shadow: 1px 1px 8px rgba(0, 94, 153, 0.3); }

.opentip-container.ot-hide-effect-fade {
  -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  transition: transform 0.5s ease-in-out, opacity 1s ease-in-out;
  opacity: 1;
  -ms-filter: none;
  filter: none; }

.opentip-container.ot-hide-effect-fade.ot-hiding {
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }

.opentip-container.ot-show-effect-appear.ot-going-to-show,
.opentip-container.ot-show-effect-appear.ot-showing {
  -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out;
  transition: transform 0.5s ease-in-out, opacity 1s ease-in-out; }

.opentip-container.ot-show-effect-appear.ot-going-to-show {
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }

.opentip-container.ot-show-effect-appear.ot-showing {
  opacity: 1;
  -ms-filter: none;
  filter: none; }

.opentip-container.ot-show-effect-appear.ot-visible {
  opacity: 1;
  -ms-filter: none;
  filter: none; }

@-moz-keyframes otloading {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }
@-webkit-keyframes otloading {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }
@-o-keyframes otloading {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }
@-ms-keyframes otloading {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }
@keyframes otloading {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }
body {
  font-family: sans-serif; }

footer {
  background-color: #404041;
  text-align: center;
  width: 100%;
  height: 38px; }
  footer img {
    margin-top: 13px; }

nav#header {
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  width: 100%;
  height: 94px;
  background-color: white;
  padding: 27px 0; }
  nav#header .social {
    position: absolute;
    top: 30px;
    left: 30px; }
    nav#header .social a:nth-child(2) {
      margin-left: 10px; }
  nav#header > a {
    width: 168px;
    height: 41px;
    display: block;
    margin: 0 auto; }
  nav#header > img {
    position: absolute;
    top: 0;
    right: 0px; }

ul#menu {
  overflow: hidden;
  width: 100%; }
  ul#menu li {
    -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
    box-sizing: border-box;
    background-color: white;
    width: 100%;
    height: 80px;
    text-align: center;
    border-bottom: solid 1px #231f20; }

header {
  background-color: white;
  width: 100%;
  height: 80px;
  text-align: center; }

#dropdown {
  height: 80px; }
  #dropdown ul {
    -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
    box-sizing: border-box;
    position: relative;
    border: solid 1px white;
    width: 100%;
    height: 80px;
    overflow: hidden;
    z-index: 10; }
    #dropdown ul li {
      -webkit-box-sizing: border-box;
      /* Safari/Chrome, other WebKit */
      -moz-box-sizing: border-box;
      /* Firefox, other Gecko */
      box-sizing: border-box;
      height: 80px;
      background-color: #808284;
      border-bottom: solid 1px white;
      text-align: center; }
    #dropdown ul li:last-child {
      border-bottom: none; }

#page-company .content {
  width: 100%;
  text-align: center;
  margin-top: 24px; }

#page-product ul {
  width: 588px;
  margin: 0 auto; }
  #page-product ul li {
    height: 180px;
    margin-bottom: 16px; }
  #page-product ul li:last-child {
    margin-bottom: 24px; }

.product-detail {
  text-align: center; }
  .product-detail .image {
    margin: 30px 0; }
  .product-detail .main {
    margin-top: 16px; }
  .product-detail .sns-box {
    display: inline-block;
    width: 613px;
    position: relative;
    margin-top: 36px; }
    .product-detail .sns-box .social {
      position: absolute;
      right: 16px;
      top: 12px; }
      .product-detail .sns-box .social a:first-child {
        margin-right: 20px; }

#page-product-shark header {
  background-color: #006ab6; }
#page-product-shark .main {
  background-color: #006ab6; }
#page-product-shark .shark-web {
  display: inline-block;
  width: 613px;
  height: 64px;
  background-image: url(/sp/images/banner-shark-official.png); }

#page-product-relax header {
  background-color: #31346f; }
#page-product-relax .main {
  background-color: #31346f;
  padding: 24px 0; }

#page-product-behugo header {
  background-color: #000000; }
#page-product-behugo .main {
  background-color: #000000;
  padding: 24px 0; }

#page-product-rawc header {
  background-color: #6fbd6c; }
#page-product-rawc .main {
  background-color: #6fbd6c;
  padding: 24px 0; }

#page-product-coconut-water header {
  background-color: #656565; }
#page-product-coconut-water .main {
  background-color: #848484;
  padding: 24px 0; }
#page-product-coconut-water p {
  margin-top: 30px; }
#page-product-coconut-water #link-2015-recall {
  color: #ffffff;
  font-size: 14pt;
  text-decoration: underline; }
  #page-product-coconut-water #link-2015-recall:visited {
    color: #ccc; }

#slide-container #slide-show {
  position: relative;
  *zoom: 1;
  margin: 0 auto;
  width: 640px;
  height: 640px;
  overflow: hidden; }
  #slide-container #slide-show .item {
    position: absolute;
    width: 640px;
    height: 640px;
    background-image: url(/sp/images/slide-background-0.png); }
#slide-container #slide-indicator {
  padding: 20px 0;
  text-align: center; }
  #slide-container #slide-indicator img {
    margin-left: 18px; }
  #slide-container #slide-indicator img:first-child {
    margin-left: 0; }

#page-index header.information {
  background-color: #231a16;
  height: 40px;
  text-align: center; }
#page-index #information {
  text-align: center;
  color: #231f20;
  margin: 20px 0; }
  #page-index #information .item {
    display: inline-block;
    width: 588px;
    margin-bottom: 30px;
    background-color: #296ba1; }
    #page-index #information .item:last-child {
      margin-bottom: 0; }
    #page-index #information .item img {
      max-width: 588px; }
    #page-index #information .item h3 {
      font-size: 40px;
      letter-spacing: 8px;
      margin-top: 20px;
      color: white; }
    #page-index #information .item p {
      font-size: 24px;
      line-height: 32.44px;
      letter-spacing: 2.4px;
      text-align: justify;
      margin-top: 20px;
      padding: 0 20px; }
    #page-index #information .item .bottom {
      -webkit-box-sizing: border-box;
      /* Safari/Chrome, other WebKit */
      -moz-box-sizing: border-box;
      /* Firefox, other Gecko */
      box-sizing: border-box;
      width: 100%;
      height: 56px;
      padding-top: 14px;
      padding-bottom: 14px;
      padding-left: 30px;
      position: relative;
      text-align: left;
      margin-top: 20px;
      background-color: white; }
      #page-index #information .item .bottom .date {
        font-size: 24px;
        line-height: 32.44px;
        letter-spacing: 2.4px;
        color: #296ba2; }
      #page-index #information .item .bottom .social {
        position: absolute;
        right: 15px;
        top: 18px; }
        #page-index #information .item .bottom .social .fb-like {
          vertical-align: middle;
          margin-right: 10px; }
        #page-index #information .item .bottom .social .twitter-share-button {
          vertical-align: middle;
          width: 90px !important; }

#page-contact form {
  width: 480px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40px; }
#page-contact input, #page-contact select, #page-contact textarea {
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  display: block;
  width: 480px;
  margin-bottom: 20px;
  font-size: 20px; }
#page-contact input {
  height: 40px; }
#page-contact input[type=submit] {
  -webkit-appearance: none;
  background-color: #404041;
  color: white;
  border: none; }
#page-contact select {
  height: 40px; }
#page-contact textarea {
  resize: none;
  height: 200px; }

/*# sourceMappingURL=style.css.map */